/* Registration has its own editorial layout within the shared WEB design system. */
.registration-masthead { padding: 40px 0 32px; background: linear-gradient(90deg, #fff 4%, rgba(255,255,255,.97) 30%, rgba(255,255,255,.65) 52%, rgba(255,255,255,.08) 85%), url('/img/pages/ev-registration-harbour-v1.jpg') center 66% / cover; }
.registration-masthead-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 64px; min-height: 370px; }
.registration-eyebrow { display: block; color: var(--blue-700); margin-bottom: 18px; font-size: 14px; font-weight: var(--weight-ui); }
.registration-masthead h1 { margin: 0 0 20px; font-size: clamp(36px, 4vw, 56px); line-height: 1.14; letter-spacing: -.035em; }
.registration-masthead-grid > div > p { max-width: 550px; margin-bottom: 26px; font-size: 17px; line-height: 1.8; color: var(--ink); }
.registration-masthead-grid > div > .registration-hero-source { font-size: 13px; line-height: 1.8; color: #405768; margin: 22px 0 0; }
.registration-summary { width: 100%; max-width: 480px; justify-self: end; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--yellow); border-radius: var(--radius); box-shadow: 0 8px 28px #17344812; }
.registration-summary h2 { margin: 0; padding: 16px 22px; font-size: 21px; border-bottom: 1px solid var(--line); }
.registration-summary dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; }
.registration-summary dl > div { padding: 16px 22px; min-width: 0; }
.registration-summary dl > div:nth-child(odd) { border-right: 1px solid var(--line); }
.registration-summary dl > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
.registration-summary dt { font-size: 14px; color: #405768; }
.registration-summary dd { margin: 5px 0; font-size: clamp(26px, 3vw, 38px); line-height: 1.2; font-weight: var(--weight-heading-strong); letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.registration-summary dd small { font-size: 14px; font-weight: normal; }
.registration-summary dl span { color: #405768; font-size: 12px; }
.registration-page .charging-index-section { padding-top: 36px; padding-bottom: 40px; }
.registration-page .charging-index-section-head { margin-bottom: 26px; }
.registration-year-panel { background: #fffcf0; border: 1px solid #e9dfb1; border-radius: var(--radius); }
.registration-focus .registration-eyebrow { margin-bottom: 8px; }
.registration-year-total { font-size: 14px; }
.registration-year-total > strong { font-size: 26px; color: var(--ink); margin-left: 12px; }
.registration-editorial { border-top: 3px solid var(--yellow); background: #fff; border-radius: var(--radius); margin-top: 24px; padding: 24px; }
.registration-editorial header { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.registration-editorial > div { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.registration-editorial > div > p + p { border-left: 1px solid var(--line); padding-left: 24px; }
.registration-editorial h3 { margin: 0; }
.registration-editorial p { line-height: 1.8; margin: 0 0 12px; }
.registration-panel { padding: 28px; }
.registration-panel h3 { margin: 0 0 16px; font-size: 21px; }
.registration-panel p { line-height: 1.8; }
.registration-controls { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-bottom: 20px; }
.registration-controls h3 { flex: 1; margin: 0; }
.registration-controls label { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; }
.registration-page :is(select, input[type="search"]) { min-height: 42px; max-width: 100%; border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 12px; background: #fff; color: var(--ink); font: inherit; }
.registration-page :is(a, button, input, select, summary):focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.registration-page button:disabled { opacity: .6; cursor: not-allowed; }
.registration-go { padding: 9px 13px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; color: var(--blue-700); font: inherit; cursor: pointer; }
.registration-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.registration-explorer { grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr); }
.registration-grid > * { min-width: 0; }
.registration-focus { margin-top: 28px; }
.registration-ranking { list-style: none; padding: 0; margin: 0; counter-reset: ranking; }
.registration-ranking li { counter-increment: ranking; border-bottom: 1px solid var(--line); }
.registration-ranking a { display: flex; align-items: center; gap: 12px; padding: 15px 5px; color: var(--ink); }
.registration-ranking a::before { content: counter(ranking, decimal-leading-zero); color: var(--blue-700); font-size: 12px; }
.registration-ranking a > span { flex: 1; }
#registration-brand-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin: 20px 0; }
#registration-brand-summary span { display: flex; flex-direction: column; gap: 6px; color: #405768; font-size: 13px; }
#registration-brand-summary strong { color: var(--ink); font-size: 27px; }
.registration-ranking small { display: inline-block; margin-left: 8px; color: var(--muted); font-size: 12px; font-weight: normal; }
.registration-ranking a:is(:hover, [aria-current="true"]) { background: var(--soft); color: var(--blue-700); }
.registration-brand-list { max-height: 465px; overflow-y: auto; margin-top: 15px; }
.registration-note { font-size: 13px; color: var(--index-muted); }
.registration-page summary { cursor: pointer; font-weight: var(--weight-ui); padding: 10px 0; }
.registration-page .charging-table-wrap { min-width: 0; max-width: 100%; max-height: 620px; overflow: auto; }
.registration-page .charging-data-table thead th { position: sticky; top: 0; background: #f3f7fa; z-index: 1; }
.registration-page .charging-data-table td { font-variant-numeric: tabular-nums; }
@media (min-width: 861px) and (max-width: 1080px) {
  .registration-page .charging-index-toolbar { top: 68px; }
}
@media (max-width: 860px) {
  .registration-masthead-grid { gap: 24px; min-height: 355px; }
  .registration-summary dl > div { padding: 14px; }
  .registration-grid, .registration-explorer { grid-template-columns: 1fr; }
  .registration-brand-list { max-height: 225px; }
  .registration-panel { padding: 20px; }
  .registration-page .charging-index-toolbar nav { display: flex; overflow-x: auto; justify-content: flex-start; }
  .registration-page .charging-index-toolbar nav a { flex: 0 0 auto; padding: 8px 12px; }
  .registration-page .charging-index-month { flex-direction: row; align-items: center; flex-wrap: wrap; }
  .registration-page .charging-index-month select { width: auto; flex: 1; }
}
@media (max-width: 640px) {
  .registration-masthead { padding: 28px 0 24px; background-position: 68% 0; background-size: auto 490px; background-repeat: no-repeat; background-color: #f3f8fb; background-image: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.96) 38%, rgba(255,255,255,.4) 66%, #f3f8fb 100%), url('/img/pages/ev-registration-harbour-v1.jpg'); }
  .registration-masthead-grid { grid-template-columns: 1fr; gap: 18px; min-height: 0; }
  .registration-masthead h1 { font-size: 34px; margin-bottom: 14px; }
  .registration-masthead .registration-eyebrow { margin-bottom: 12px; font-size: 12px; }
  .registration-masthead-grid > div > p { font-size: 15px; margin-bottom: 16px; }
  .registration-masthead .registration-controls { margin-bottom: 0; }
  .registration-masthead-grid > div > .registration-hero-source { margin-top: 14px; margin-bottom: 0; font-size: 12px; display: inline-block; padding: 8px 10px; background: #fff; border-radius: var(--radius); }
  .registration-masthead .registration-controls .inline-link { padding: 8px 10px; background: #fff; border-radius: var(--radius); }
  .registration-summary { max-width: none; }
  .registration-summary h2 { font-size: 18px; line-height: 1.4; padding: 12px 14px; }
  .registration-summary dl > div { padding: 12px 14px; }
  .registration-summary dt { font-size: 13px; line-height: 1.4; }
  .registration-summary dd { font-size: 28px; margin: 4px 0; }
  .registration-summary dl span { display: block; line-height: 1.4; }
  .registration-editorial { padding: 20px; }
  .registration-editorial > div { grid-template-columns: 1fr; gap: 12px; }
  .registration-editorial > div > p + p { border: 0; padding: 12px 0 0; border-top: 1px solid var(--line); }
  #registration-brand-summary { gap: 10px; }
  #registration-brand-summary strong { font-size: 23px; }
  .registration-panel { padding: 16px; }
  .registration-controls { align-items: stretch; }
  .registration-controls h3 { flex-basis: 100%; }
}

/* Interactive report surfaces share WEB typography and Chart.js with INDEX-REPORT. */
.registration-page { --index-muted: #405768; color: #071832; }
.registration-page .charging-index-section-head h2 { font-size: clamp(26px, 3vw, 36px); letter-spacing: -.025em; }
.registration-page .charging-index-section-head p { color: #405768; font-size: 16px; }
.registration-page .charging-index-section-head .registration-eyebrow { margin-bottom: 8px; }
.registration-page .registration-panel { border-radius: 10px; border-color: #dbe7f1; box-shadow: 0 5px 22px #123e6010; }
.registration-page .registration-panel h3 { color: #071832; font-size: 22px; font-weight: 700; }
.registration-page .registration-panel p { color: #405768; line-height: 1.85; }
.registration-trend-panel, .registration-month-panel { border-top: 4px solid #0096d6 !important; }
.registration-year-panel { background: linear-gradient(160deg, #edf8f3, #fff 65%); border-top: 4px solid #16885d !important; }
.registration-year-panel .registration-eyebrow { color: #116849; }
.registration-year-total { margin: 0 0 12px; }
.registration-year-total > strong { font-size: 32px; }
.registration-chart { position: relative; height: 320px; width: 100%; min-width: 0; margin: 8px 0 16px; }
.registration-chart-ranking { height: 280px; }
.registration-chart[hidden], .registration-page [hidden] { display: none !important; }
.registration-note { font-size: 14px; line-height: 1.7; color: #405768; }
.registration-page details { border-top: 1px solid #dbe7f1; margin-top: 12px; }
.registration-page summary { color: #006fa8; font-size: 14px; }
.registration-segmented { display: inline-flex; border: 1px solid #bed5e6; border-radius: 7px; overflow: hidden; background: #f4f9fd; }
.registration-segmented button { border: 0; background: transparent; color: #405768; padding: 11px 18px; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.registration-segmented button[aria-pressed="true"] { background: #006fa8; color: #fff; }
.registration-editorial { background: #071832; color: #fff; }
.registration-editorial h3, .registration-editorial p { color: #fff; }
.registration-editorial .inline-link { color: #ffd400; white-space: nowrap; }
.registration-editorial > div > p + p { border-color: #34485e; }
.registration-brand-list a[aria-current="true"] { background: #e5f3fb; border-left: 3px solid #0096d6; font-weight: 700; }
#registration-brand-summary { background: #f1f7fc; padding: 20px; border-radius: 7px; }
#registration-brand-summary strong { font-size: 30px; }
.registration-compare-panel { border-top: 4px solid #6157e7 !important; }
.registration-compare-legend { display: flex; flex-wrap: wrap; gap: 10px; }
.registration-compare-legend button { border: 1px solid #dbe7f1; background: #fff; border-radius: 6px; padding: 9px 14px; font: inherit; font-size: 14px; cursor: pointer; color: #071832; }
.registration-compare-legend button::before { content: ''; display: inline-block; width: 18px; height: 4px; margin: 0 8px 3px 0; background: var(--series-color); }
.registration-compare-legend button[aria-pressed="false"] { text-decoration: line-through; background: #eef2f5; }
.registration-page .charging-data-table th { color: #071832; font-weight: 700; }
.registration-page .charging-data-table td { color: #203d56; font-size: 14px; padding-top: 12px; padding-bottom: 12px; }
.registration-page .charging-data-table tbody tr:nth-child(even) { background: #f5f9fc; }
.registration-page .charging-data-table tbody tr:hover { background: #eaf4fb; }
.registration-page .charging-data-table td:not(:first-child), .registration-page .charging-data-table th:not(:first-child) { text-align: right; }
#data .charging-data-table td:nth-child(2), #data .charging-data-table th:nth-child(2) { text-align: left; }
.registration-page .charging-data-table .change-up { color: #08764d; font-weight: 700; }
.registration-page .charging-data-table .change-down { color: #ad4b21; font-weight: 700; }
#analysis .registration-grid > .registration-panel:first-child > p:first-of-type { background: #eef7fc; border-left: 4px solid #0096d6; padding: 16px 18px; border-radius: 0 6px 6px 0; color: #071832; font-size: 19px; line-height: 1.75; }
#explore .charging-data-table { width: 100%; min-width: 0; table-layout: fixed; }
#explore .charging-data-table th:first-child { width: 46%; }
#explore .charging-data-table td:first-child { white-space: normal; overflow-wrap: anywhere; }
#explore .charging-data-table :is(th, td) { padding-left: 9px; padding-right: 9px; }
#data .charging-data-table { min-width: 680px; }
.registration-compare-panel .charging-data-table { min-width: 520px; table-layout: auto !important; }
@media (max-width: 640px) {
  .registration-chart { height: 270px; }
  .registration-chart-ranking { height: 270px; }
  .registration-panel { padding: 18px 14px; }
  .registration-controls { gap: 12px; }
  .registration-controls > h3 { font-size: 20px !important; }
  .registration-segmented { margin-left: auto; }
  .registration-segmented button { padding: 10px 12px; }
  #registration-brand-summary { padding: 14px; gap: 8px; }
  #registration-brand-summary strong { font-size: 23px; }
  .registration-editorial header { align-items: center; }
}