/* Airwave flight deck. Layered over the established UI; controls and layouts stay intact. */
:root,:root[data-theme=dark]{
  --bg:#0c1c29;
  --surface:#142d3e;
  --surface2:#1a374a;
  --surface3:#24465c;
  --border:#3a596e;
  --text:#f1f7fb;
  --muted:#bfd1dd;
  --dim:#a9bfcd;
  --accent:#71baff;
  --accent-text:#082840;
  --accent-line:#548fbe;
  --green:#75d9bc;
  --green-text:#083c35;
  --danger:#ffbe7d;
  --soft-blue:#183f5b;
  --soft-green:#153f39;
  --soft-amber:#473b2b;
  --aviation-navy:#0b3151;
  --aviation-header:#0b2b43;
  --aviation-header-muted:#c0d7e7;
  --aviation-amber:#f5ba58;
  --aviation-amber-ink:#173145;
  --aviation-shadow:0 3px 12px #03121e1c;
}
:root[data-theme=light]{
  --bg:#eef3f6;
  --surface:#ffffff;
  --surface2:#f4f7fa;
  --surface3:#e5edf4;
  --border:#cad8e3;
  --text:#142f42;
  --muted:#466071;
  --dim:#536c7c;
  --accent:#075cc4;
  --accent-text:#ffffff;
  --accent-line:#7ca7cf;
  --green:#007565;
  --green-text:#ffffff;
  --danger:#925014;
  --soft-blue:#e9f1fc;
  --soft-green:#e6f5ef;
  --soft-amber:#fff2df;
  --aviation-navy:#0b3151;
  --aviation-header:#0b3151;
  --aviation-header-muted:#c0d7e7;
  --aviation-amber:#f5ba58;
  --aviation-amber-ink:#173145;
  --aviation-shadow:0 3px 12px #18395309;
}

body{font-kerning:normal;text-rendering:optimizeLegibility}
.topbar{border-bottom:1px solid var(--border);box-shadow:0 2px 0 #071f3104}
.brand{letter-spacing:-1.45px;font-weight:700}
.brand-icon{position:relative;background:var(--aviation-navy);color:#f3f9ff;border-radius:9px;box-shadow:inset 0 0 0 1px #ffffff1c}
.brand-icon:after{content:'';position:absolute;right:5px;bottom:5px;width:4px;height:4px;background:var(--aviation-amber);border-radius:1px;box-shadow:0 0 0 2px var(--aviation-navy)}
.brand-icon .icon{stroke-width:1.5}
.brand-dot{color:var(--green)}
.main-nav a,.main-nav .nav-action{font-weight:600}
.main-nav a.active:after{height:3px;background:var(--accent)}
.main-nav a:hover,.main-nav .nav-action:hover{color:var(--accent)}
#account-button{border-radius:6px;background:var(--surface);border-color:var(--border);color:var(--text)}
#account-button:hover{background:var(--soft-blue);color:var(--accent);border-color:var(--accent-line)}
.top-actions .icon-button{border-radius:6px}

.intro{position:relative}
.intro h1{font-weight:600;letter-spacing:-1.65px}
.intro .tiny-line{height:3px;background:var(--green);border-radius:0}
.eyebrow{font-weight:650;letter-spacing:1.7px}
.intro p{color:var(--muted)}
.utc strong{font-weight:500;letter-spacing:.8px}
.utc-label{font-weight:600}
.utc .status-dot{box-shadow:0 0 0 3px var(--soft-green)}
.utc>span:last-child{color:var(--muted)}

.search-trigger,.quick-airports button{border-radius:6px;box-shadow:none}
.search-trigger{border-color:var(--border)}
.search-trigger:hover{border-color:var(--accent-line);background:var(--surface2)}
.quick-airports button{font-weight:600}
.quick-airports button.active{box-shadow:0 2px 0 color-mix(in srgb,var(--accent) 20%,transparent)}
.quick-airports button:not(.active):hover{color:var(--accent);border-color:var(--accent-line);background:var(--soft-blue)}
.airport-hero{position:relative;overflow:hidden;background:var(--surface);border-radius:10px;box-shadow:var(--aviation-shadow)}
.airport-hero:before{content:'';position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(to bottom,var(--accent) 0 65%,var(--green) 65% 88%,var(--aviation-amber) 88%);pointer-events:none}
.airport-code{font-weight:600;letter-spacing:-3.5px;line-height:1.05}
.airport-copy h2{font-weight:600;letter-spacing:-.65px}
.airport-location{font-weight:500}
.country-tag,.station-code,.weather-airport{font-family:var(--display);font-variant-numeric:tabular-nums;font-weight:500;letter-spacing:.35px}
.country-tag{background:var(--surface2);border-radius:3px}
.airport-meta{color:var(--muted);font-variant-numeric:tabular-nums}
.airport-end .icon-button{border-radius:7px}
.airport-hero-controls{display:flex;align-items:center;gap:7px}
#share-airport:hover{color:var(--accent);background:var(--soft-blue);border-color:var(--accent-line)}
.runway-art{color:var(--accent);opacity:.1}

.panel{border-radius:10px;border-color:var(--border);box-shadow:var(--aviation-shadow)}
.panel-heading{border-bottom-color:var(--border)}
.panel-heading h2{font-weight:650}
.panel-heading h2 .icon{stroke-width:1.8}
.count-badge{font-weight:600;border-radius:4px}
.badge,.map-actions .badge{border-radius:4px;font-weight:600;letter-spacing:.05px}
.badge:before,.status-dot{border-radius:2px}
.primary-button,.outline-button{border-radius:6px;font-weight:600}
.primary-button{box-shadow:0 2px 0 #071f3110}
.outline-button:hover{border-color:var(--accent-line);background:var(--soft-blue)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* Radio is the warm visual anchor; source and availability labels keep their own meaning. */
#radio .panel-heading h2 .icon{color:var(--green)}
.channel-tabs button{border-radius:4px;font-weight:600}
.channel-tabs button.active{background:var(--green);color:var(--green-text)}
.channel-tabs button:disabled{opacity:.6}
.station-title h3{font-family:var(--display);font-weight:600;letter-spacing:-.25px}
.station-sub{font-variant-numeric:tabular-nums}
.station-code{background:var(--surface2);border-radius:4px}
.player-splash{background:var(--aviation-header);border-color:#345d78;border-radius:7px}
.player-splash:before{border-color:#a0d4ee28;box-shadow:0 0 0 42px #a0d4ee09,0 0 0 84px #a0d4ee07}
.waveform i:nth-child(3n+1){background:#7dddc5}
.waveform i:nth-child(3n+2){background:#9dd7ff}
.waveform i:nth-child(3n){background:#f5ba58}
.play-stream,#radio .primary-button{background:var(--aviation-amber);border-color:var(--aviation-amber);color:var(--aviation-amber-ink);font-weight:650;border-radius:6px}
.play-stream:hover,#radio .primary-button:hover{background:#ffd17d;border-color:#ffd17d;filter:none}
.radio-empty .empty-icon{color:var(--green);background:var(--soft-green);border-color:color-mix(in srgb,var(--green) 28%,transparent);border-radius:12px}
.radio-empty h3{font-family:var(--display);font-weight:600}
.radio-footer{border-top:1px solid var(--border);margin-top:16px}
.radio-footer button{font-weight:600}

/* Telemetry uses the local display face and a stable numeric rhythm. */
.weather-metric strong,.weather-metric-detail,.weather-observed,.weather-forecast-meta,.ad-main-metrics strong,.ad-field dd,.fp-metrics dd,.fp-provider dd,.fp-chart-times,.map-bottom,.flight-tz{font-variant-numeric:tabular-nums}
.weather-heading h2{font-weight:650}
.weather-metric strong{font-family:var(--display);font-weight:600;letter-spacing:-.65px}
.weather-metric-label,.weather-detail>span,.ad-main-metrics>div>span,.ad-field dt,.fp-metrics dt{font-weight:500}
.weather-detail>strong{font-weight:550}
.weather-category{font-family:var(--display);font-weight:600;border-radius:3px}
.weather-badge{font-weight:600}
.weather-unit-select select{border-radius:4px;font-weight:500}
.weather-outlook summary,.weather-reports summary,.weather-runway-wind summary,.weather-advisories summary{font-weight:500}
.weather-source{background:var(--surface2)}
.weather-source a{font-weight:500}

.map-settings-trigger,#map-settings-button.map-settings-trigger{border-radius:5px;box-shadow:none}
.map-settings-trigger .icon{stroke-width:1.8}
.map-caption,.map-center,.map-legend,.map-altitude-legend{border-radius:5px;box-shadow:0 2px 8px #05213718}
.map-bottom{background:var(--surface2)}
.map-settings{border-radius:8px}
.map-settings-heading{background:var(--aviation-header);color:#f1f7fb}
.map-settings-heading button{color:#f1f7fb}
.map-settings-heading strong{font-family:var(--display);font-weight:600}
.map-setting-field select,.map-filter-query,.map-reset{border-radius:4px}
.map-reset{font-weight:600}
.plane-label{border-radius:4px}
.plane-label strong{font-family:var(--display);font-weight:600;letter-spacing:.1px}
.airwave-plane.is-selected .plane-label{border-color:var(--accent);background:var(--aviation-header);color:#f1f7fb}
.airwave-plane.is-selected .plane-label small{color:var(--aviation-header-muted)}
.map-route-legend{top:55px;bottom:auto;border-radius:5px;border-left:3px solid var(--accent);box-shadow:0 2px 10px #0316241c}
.map-wrap:has(.map-imagery-note:not([hidden])) .map-route-legend{top:110px}
.map-route-legend>span{font-weight:500}
.airwave-route-airport>span{border-radius:4px;font-family:var(--display);font-weight:600;border-width:2px}
.route-endpoint,.nearby-airport{border-radius:4px}

/* A flight identity bar gives the compact card a recognisable Airwave signature. */
.aircraft-detail{border-radius:9px;box-shadow:0 8px 28px #071e3438;border-color:var(--accent-line)}
.ad-header{background:var(--aviation-header);color:#f3f9fc;border-bottom-color:#ffffff22}
.ad-title-icon{background:#ffffff0d;border:1px solid #ffffff33;border-radius:6px;color:#edf8ff}
.ad-heading h3{font-weight:600;letter-spacing:-.55px;color:#f3f9fc}
.ad-header .ad-heading>span,.ad-header-identity,.ad-header-airline{color:var(--aviation-header-muted)}
.ad-header .ad-header-identity span{color:#90b2c9}
.ad-close{border-radius:5px;color:#d4e4ee}
.ad-close:hover{color:#fff;background:#ffffff14}
.ad-favorite{color:var(--aviation-amber);border-radius:5px}
.ad-favorite:hover{background:#ffffff14}
.ad-main-metrics strong{font-weight:600;letter-spacing:-.75px}
.ad-main-metrics>div>span{color:var(--muted)}
.ad-status{font-weight:500}
.ad-status>span{border-radius:2px}
.ad-status small{font-weight:400}
.ad-follow{border-radius:5px;background:var(--soft-blue);border-color:var(--border);color:var(--accent);font-weight:600}
.ad-follow:hover{border-color:var(--accent-line)}
.ad-follow.is-following{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}
.ad-more>summary{font-weight:600;background:var(--surface2)}
.ad-more>summary>svg{color:var(--accent)}
.ad-tabs button{border-radius:4px;font-weight:500}
.ad-tabs button[aria-selected=true]{font-weight:600}
.ad-source{background:var(--surface2)}
.ad-source a{font-weight:500}
.ad-data-grid .ad-field dd{font-weight:500}
.ad-section-title{font-weight:600;letter-spacing:.15px}

/* Route summary is independent of the long details drawer. */
.ad-route-summary{flex-shrink:0;padding:8px 14px;background:var(--surface2);border-bottom:1px solid var(--border);min-width:0}
.ad-route-label{font-size:10px;font-weight:500;line-height:1.4;color:var(--muted);margin-bottom:4px}
.ad-route-codes{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;min-width:0;font-family:var(--display);color:var(--muted);line-height:1.1}
.ad-route-codes strong{font-size:20px;letter-spacing:-.5px;font-weight:600;color:var(--accent);min-width:0;overflow:hidden;text-overflow:ellipsis}
.ad-route-codes strong:last-child{text-align:right}
.ad-route-codes>span{display:grid;place-items:center;color:var(--muted)}
.ad-route-codes>span svg,.ad-route-codes>svg{width:16px;height:16px;color:var(--muted)}
.ad-route-cities{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;font-size:10px;line-height:1.45;color:var(--muted);margin-top:3px}
.ad-route-cities>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:49%}
.ad-route-cities>span:last-child{text-align:right}
.ad-route-progress{height:4px;background:var(--surface3);border-radius:3px;overflow:hidden;margin:5px 0 4px}
.ad-route-progress>span{height:100%;display:block;background:var(--accent);border-radius:3px;transition:width .3s ease}
.ad-route-estimate{display:flex;align-items:center;justify-content:space-between;gap:7px;min-width:0;font-size:10px;font-variant-numeric:tabular-nums;line-height:1.4;color:var(--muted)}
.ad-route-estimate strong{color:var(--text);font-weight:600}
.ad-route-state{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;font-size:11px;line-height:1.45;color:var(--muted)}
.ad-route-state>span{min-width:0;overflow-wrap:anywhere}
.ad-route-state button{flex-shrink:0;display:grid;place-items:center;min-width:28px;min-height:28px;padding:3px 5px;color:var(--accent);font-size:20px;font-weight:500;line-height:1;border-radius:4px}
.ad-route-state button:hover{background:var(--soft-blue)}
.ad-route-state button svg{width:16px;height:16px;display:block}
.aircraft-detail.is-expanded .ad-route-cities{display:none}
.aircraft-detail.is-expanded .ad-route-summary[data-state=available]{padding-top:5px;padding-bottom:5px}
.aircraft-detail.is-expanded .ad-route-label{margin-bottom:2px;font-size:9px}
.aircraft-detail.is-expanded .ad-route-progress,.aircraft-detail.is-expanded .ad-route-estimate{display:none}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-body{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:5px 10px;align-items:center;padding:7px 14px 8px;flex:0 1 auto;overflow-y:auto}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-status{display:flex;grid-column:1/-1;padding:0;font-size:11px;line-height:1.4}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-status small{font-size:10px}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-secondary,
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-main-metrics small{display:none}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-main-metrics{padding:0;gap:10px}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-main-metrics strong{font-size:21px;line-height:1.2}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-main-metrics>div>span{font-size:11px;line-height:1.4}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-follow{width:38px;height:38px;min-height:38px;padding:8px;margin:0;position:relative}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-follow span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-stale-note,
.aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-emergency{grid-column:1/-1;margin:0}

.flight-progress{font-variant-numeric:tabular-nums}
.fp-heading h4,.fp-history h4{font-family:var(--display);font-weight:600}
.fp-badge{border:1px solid var(--border);border-radius:4px;font-weight:500}
.fp-airports{padding:10px 0 12px;border-top:1px solid var(--border)}
.fp-airport strong{font-weight:600;color:var(--accent);letter-spacing:-.6px}
.fp-airport small{font-weight:500}
.fp-route-arrow{color:var(--green)}
.fp-airport em{font-size:10px;letter-spacing:.2px}
.fp-track{height:6px;border-radius:3px}
.fp-track>span{border-radius:3px;background:var(--accent)}
.fp-metrics dd{font-weight:600;font-size:15px}
.fp-progress-label strong{font-weight:600}
.fp-observed{border-left:3px solid var(--green);padding:7px 9px;background:var(--soft-green);border-top:0;border-radius:0 4px 4px 0}
.fp-observed strong{color:var(--text);font-weight:600}
.fp-fit{border-radius:5px;font-weight:600}
.fp-chart{background:var(--surface2);padding:9px 8px 6px;border:1px solid var(--border);border-radius:5px}
.fp-chart>div>strong{font-weight:600}
.fp-chart-line path{stroke-width:2.2}
.fp-chart:nth-of-type(2) .fp-chart-line path{stroke:var(--green)}
.fp-chart:nth-of-type(2) .fp-chart-line circle{fill:var(--green)}
.fp-source{border-top:1px solid var(--border);padding-top:7px}

.pd-details>summary{background:var(--surface)}
.pd-summary-title strong{font-family:var(--display);font-size:15px;letter-spacing:-.15px;font-weight:600}
.pd-summary-title>svg{color:var(--green);stroke-width:1.8}
.pd-summary-count{border-radius:4px;font-weight:600}
.pd-view-option,.pd-airport,.pd-text-button{border-radius:5px}
.pd-airport strong{font-weight:600}
.airport-reference-details>summary{background:var(--surface)}
.airport-reference-heading h2{font-weight:600}
.airfield-runway-name,.airfield-freq-value{font-family:var(--display);font-variant-numeric:tabular-nums}
.airport-info-panel .airfield-section-title{font-weight:600}
.flights-toolbar{background:var(--surface)}
.flight-tabs button{font-weight:600}
.fw-icon{border-radius:8px;color:var(--accent)}
.fw-load{border-radius:6px}
.flights-foot,.airfield-reference-footer{background:var(--surface2)}
.bottom-note>span[data-icon]{border-radius:10px;color:var(--green);background:var(--soft-green);border-color:color-mix(in srgb,var(--green) 25%,transparent)}
footer{border-top-color:var(--border)}
footer .version{font-weight:500;color:var(--muted)}

@media(max-width:800px){
  .intro h1{letter-spacing:-1.25px}
  .airport-code{letter-spacing:-2.5px}
}
@media(max-width:650px){
  .brand-icon{border-radius:8px}
  .brand-icon:after{right:4px;bottom:4px}
  .intro h1{font-weight:600;letter-spacing:-1.15px}
  .airport-hero{border-radius:8px}
  .airport-hero:before{width:3px}
  .airport-code{letter-spacing:-2.3px}
  .airport-copy h2{font-weight:600;letter-spacing:-.45px}
  .airport-end{left:16px;right:auto;top:auto;bottom:15px}
  .airport-hero-controls{gap:6px}
  .airport-end .icon-button.large{width:31px;height:31px;background:var(--surface2);border:1px solid var(--border)}
  .airport-end .icon-button.selected{background:var(--soft-blue);border-color:var(--accent-line)}
  .radio-footer{margin-top:14px}
  .ad-header{padding-top:8px;padding-bottom:7px}
  .ad-heading h3{font-size:20px}
  .ad-main-metrics strong{font-size:23px;letter-spacing:-.7px}
  .ad-route-summary{padding:7px 12px 6px}
  .aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded){max-height:min(340px,60%)}
  .aircraft-detail:has(.ad-route-summary[data-state=available]):not(.is-expanded) .ad-body{padding:6px 12px 7px;gap:4px 8px}
  .ad-route-codes strong{font-size:19px}
  .ad-route-cities{font-size:10px}
  .ad-route-estimate{font-size:10px}
  .ad-route-state{font-size:10px;line-height:1.4}
  .fp-airport strong{font-size:23px}
  .fp-metrics dd{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .ad-route-progress>span{transition:none}
}
@media(max-width:650px) and (pointer:coarse){
  .airport-end .icon-button.large{width:35px;height:40px}
  .ad-close,.ad-favorite{min-width:38px;min-height:38px}
  .ad-route-state button{min-width:34px;min-height:34px}
}
@media(forced-colors:active){
  .brand-icon,.ad-header,.map-settings-heading{background:Canvas;color:CanvasText;border:1px solid CanvasText}
  .ad-heading h3,.ad-header .ad-heading>span,.ad-header-identity,.ad-header-airline,.ad-close{color:CanvasText}
  .fp-track,.ad-route-progress{border:1px solid CanvasText}
  .fp-track>span,.ad-route-progress>span{background:Highlight}
}
