:root {
  color-scheme:dark;
  --ocean-950:#060a14; --ocean-900:#0a1020; --ocean-850:#0d1526;
  --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.18);
  --muted:#718099; --text:#eaf0f6; --accent:#4dffff;
  --td:#6ec1ea; --ts:#4dffff; --c1:#ffffd9; --c2:#ffd98c;
  --c3:#ff9e59; --c4:#ff738a; --c5:#8d75e6;
  --bg:var(--ocean-950); --land:var(--ocean-850); --cyan:var(--accent); --orange:var(--c3);
  --ink:#061018; --map-ocean:#07111f;
  --coastline:rgba(234,240,246,.24); --surface-overlay:rgba(10,16,32,.94);
  --accent-wash:rgba(77,255,255,.04);
  --font-body:'Inter','Noto Sans SC',sans-serif;
  --font-display:'Barlow Condensed','Noto Sans SC',sans-serif;
  --font-data:'JetBrains Mono','Noto Sans SC',monospace;
}
* { border-radius:0 !important; }
html { background:var(--ocean-950); }
body {
  background-color:var(--ocean-950); color:var(--text); font-family:var(--font-body);
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:56px 56px;
}
.top-spectrum { position:fixed; inset:0 0 auto; z-index:13000; height:8px; background:linear-gradient(90deg,var(--td),var(--ts),var(--c1),var(--c2),var(--c3),var(--c4),var(--c5)); }
a { color:var(--accent); }
button,input,select,textarea { font-family:var(--font-body); color:var(--text); background:var(--ocean-900); border-color:var(--line-strong); }
button:hover { border-color:var(--accent); }
button.primary { background:var(--accent); color:var(--ink); font-weight:700; }
:focus-visible { outline-color:var(--accent) !important; }
textarea,.mono,td:not(:first-child),.time-readout,.metric small,.inspector small,.bias-number,.wind-from { font-family:var(--font-data); }
label,.micro,.muted,.section-kicker,.tag,.hero-title .eyebrow,.legend,.timeline label,th,.status,.correction-control p,.case-heading,.case-average-note { font-family:var(--font-data); }
.section-kicker,.tag,.hero-title .eyebrow { text-transform:uppercase; font-size:9px; letter-spacing:.1em; }
.hero { background:transparent; }
.hero h1 { font-family:var(--font-display); font-weight:800; letter-spacing:0; text-transform:uppercase; }
h2,h3 { font-family:var(--font-display); letter-spacing:0; }
.hero-title .eyebrow { color:var(--accent); }
.hero header.detail-command { min-height:30px; align-items:center; border-bottom:1px solid var(--line); padding-bottom:8px; }
.back-link { color:var(--muted); font:600 10px/1.3 var(--font-data); letter-spacing:.08em; }
.back-link:hover { color:var(--accent); }
.command-meta { display:flex; align-items:center; gap:24px; }
.detail-status,.coordinate-note { color:var(--muted); font:600 9px/1.3 var(--font-data); letter-spacing:.08em; text-transform:uppercase; }
.detail-status::before { content:''; display:inline-block; width:5px; height:5px; margin-right:7px; background:var(--accent); }
.map {
  background-color:var(--map-ocean);
  background-image:linear-gradient(rgba(77,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(77,255,255,.035) 1px,transparent 1px);
  background-size:38px 38px;
}
.map svg text { font-family:var(--font-data); }
.map-tools button { background:var(--ocean-900); font-family:var(--font-data); font-size:10px; }
.input-drawer,.inspector { background:var(--surface-overlay); border:1px solid var(--line-strong); box-shadow:12px 12px 0 rgba(0,0,0,.28); }
.input-drawer>summary { font-family:var(--font-data); font-size:12px; color:var(--text); }
.inspector { padding:14px; }
.inspector>strong { font-family:var(--font-body); }
.inspector .reading { font-family:var(--font-display); font-weight:800; color:var(--accent); }
.inspector p { color:var(--muted); }
.map-readings { background:linear-gradient(90deg,var(--surface-overlay),transparent); }
.metric strong { font-family:var(--font-display); font-weight:800; color:var(--accent); font-size:47px; letter-spacing:0; }
#mean,#max,#cpa { font-family:var(--font-display); font-weight:800; }
#mean small,#max small,#cpa small,#motion { font-family:var(--font-data); }
.metric span { font-family:var(--font-data); font-size:10px; color:var(--muted); }
.metric.geometry strong { font-size:28px; }
.metric.geometry #motion { font-family:var(--font-data); font-size:12px; color:var(--muted); }
.metric small { color:var(--muted); font-weight:400; }
.correction-control { background:var(--surface-overlay); border:1px solid var(--line-strong); }
.correction-control input,.timeline input { accent-color:var(--accent); }
.correction-control label { color:var(--text); font-size:11px; }
.correction-control #correction-means { font-family:var(--font-data); color:var(--accent); }
.timeline { border-color:var(--line-strong); }
.time-readout { color:var(--text); }
.legend { display:block; bottom:128px; width:220px; background:var(--surface-overlay); padding:10px 12px; border:1px solid var(--line); }
#legend-unit { display:block; margin-bottom:6px; color:var(--muted); font-size:9px; }
.wind-band-list { display:grid; gap:5px; }
.wind-band { display:grid; grid-template-columns:8px 64px minmax(0,1fr); gap:7px; align-items:center; font-size:10px; }
.wind-band>i { width:8px; height:14px; }
.wind-band>span { color:var(--text); }
.wind-band>small { color:var(--muted); font:8px/1.4 var(--font-data); white-space:nowrap; text-align:right; }
.scroll { border-top:1px solid var(--line-strong); }
th { background:var(--ocean-950); color:var(--muted); box-shadow:0 1px 0 var(--line-strong); }
th,td { border-color:var(--line); }
td strong { color:var(--accent); }
tbody tr.selected,tbody tr:hover,tbody tr.hovered { background:var(--ocean-850); }
tbody tr.selected td:first-child { box-shadow:inset 2px 0 0 var(--accent); }
.validation-summary strong { color:var(--accent); font:800 43px/1 var(--font-display); }
.validation-summary>div>span,.validation-summary small { font-family:var(--font-data); }
.comparison-track,.history-bar-track { background:var(--ocean-950); border:1px solid var(--line); }
.comparison-track i { background:var(--accent); }
.comparison-row.baseline i { background:var(--muted); }
.comparison-row b { font-family:var(--font-data); }
.validation-notice { border-color:var(--accent); background:var(--ocean-850); color:var(--text) !important; }
.history-list { display:grid; gap:4px; }
.history-row { display:grid; grid-template-columns:29px minmax(92px,.9fr) minmax(60px,1fr) 76px; gap:9px; align-items:center; min-height:46px; padding:7px 9px; background:var(--ocean-900); border:1px solid var(--line); }
.history-row:hover { background:var(--ocean-850); border-color:var(--line-strong); }
.history-row.is-current { outline:1px solid var(--accent); outline-offset:-1px; }
.history-rank { display:grid; place-items:center; width:25px; height:25px; color:var(--ink); background:var(--td); font:800 15px/1 var(--font-display); }
.history-name { min-width:0; }
.history-tc-name { color:var(--text); font:700 11px/1.3 var(--font-body); text-transform:uppercase; overflow-wrap:anywhere; }
.history-tc-date { margin-top:3px; color:var(--muted); font:9px/1.3 var(--font-data); }
.history-bar-track { height:14px; position:relative; }
.history-bar { height:100%; background:var(--accent); opacity:.65; }
.history-row.highest-error .history-bar,.history-row.highest-error .history-rank { background:var(--c4); }
.history-row.highest-error .history-speed { color:var(--c4); }
.history-bar-track .average-mark { position:absolute; width:1px; top:-3px; bottom:-3px; background:var(--accent); }
.history-speed { text-align:right; white-space:nowrap; color:var(--text); font:800 21px/1 var(--font-display); }
.history-speed small { font:8px/1 var(--font-data); color:var(--muted); }
.case-average-note { color:var(--muted); }
.method>details { border-color:var(--line-strong); }
.method summary { font-family:var(--font-data); color:var(--muted); }
@media(max-width:1100px) and (min-width:761px) {
  .legend { display:block; right:24px; width:185px; padding:8px; }
  .wind-band { grid-template-columns:6px 55px 1fr; gap:5px; font-size:9px; }
  .wind-band>small { font-size:7px; }
  .metric strong { font-size:38px; }
}
@media(max-width:760px) {
  .hero { padding-top:22px; }
  .hero header.detail-command { display:flex; min-height:28px; padding-bottom:9px; gap:8px; }
  .command-meta { display:flex; flex-direction:column; gap:4px; align-items:flex-end; }
  .hero header .detail-status,.hero header .coordinate-note { display:inline; font-size:8px; letter-spacing:.02em; }
  .back-link { font-size:9px; letter-spacing:0; }
  .hero h1 { font-size:26px; line-height:1.25; letter-spacing:0; }
  .map-tools button { font-size:10px; }
  .input-drawer { box-shadow:none; }
  .metric strong { font-size:38px; }
  .metric.geometry strong { font-size:24px; }
  .metric.geometry #motion { font-size:11px; }
  .map-readings { background:none; grid-row:7; }
  .correction-control { grid-row:8; }
  .timeline { grid-row:9; }
  .inspector { grid-row:10; padding:12px; box-shadow:none; background:var(--ocean-900); }
  .inspector .reading { font-size:29px; }
  .legend { position:static; grid-row:6; display:block; width:auto; background:none; border:0; padding:0; }
  .wind-band-list { gap:4px; }
  .wind-band { grid-template-columns:8px 75px minmax(0,1fr); font-size:10px; }
  .wind-band>small { font-size:9px; }
  .wind-band>i { height:12px; }
  .validation-summary strong { font-size:38px; }
  .history-row { grid-template-columns:25px minmax(82px,.9fr) minmax(48px,1fr) 64px; gap:6px; padding:6px; min-height:43px; }
  .history-rank { width:23px; height:23px; }
  .history-tc-name { font-size:10px; }
  .history-tc-date { font-size:8px; }
  .history-speed { font-size:19px; }
  .history-speed small { font-size:7px; }
}
@media(max-width:360px) {
  .hero h1 { font-size:24px; }
  .metric strong { font-size:34px; }
  .history-row { grid-template-columns:22px minmax(70px,.9fr) minmax(38px,1fr) 57px; gap:5px; }
}
