/* Shared navigation and the focused Radar page. */
html[data-theme="dark"]:not([data-palette="solarized"]):not([data-palette="contrast"]) {
  --bg:#080f15; --panel:#101920; --panel2:#142129; --line:#2b363e;
  --text:#f0f4f7; --muted:#a3b2bd; --accent:#43cfc3; --good:#43cfc3;
}
body > header { background:var(--bg); box-shadow:none; border-color:var(--line); }
body > header h1 { color:var(--text); text-shadow:none; letter-spacing:.02em; }
body > header .tab { color:var(--text); background:transparent; border:0; box-shadow:none; }
body > header .tab.active { color:var(--text); background:color-mix(in srgb,var(--accent) 18%,transparent); box-shadow:none; }
body > header #station-name { background:var(--panel); color:var(--muted); border:1px solid var(--line); border-radius:8px; }
.settings-label { display:none; }
.watch-map { position:relative; overflow:hidden; background:var(--panel); }
.watch-map #lab-frame { position:absolute; inset:0; }
@media (min-width:1000px) and (min-height:501px) {
  body { flex-direction:row; }
  body > header { width:188px; flex:0 0 188px; height:auto; padding:24px 14px 16px; box-sizing:border-box; flex-wrap:wrap; align-content:flex-start; align-items:center; gap:10px; border-right:1px solid var(--line); border-bottom:0; position:relative; }
  body > header #brand { width:30px; height:30px; }
  body > header h1 { font-size:16px; display:block; }
  body > header nav { flex:none; width:100%; display:flex; flex-direction:column; gap:8px; margin-top:22px; }
  body > header .tab { width:100%; min-height:48px; padding:12px; text-align:left; border-radius:7px; font-size:14px; }
  body > header .tab::before { display:inline-block; width:28px; font-size:19px; color:var(--accent); }
  .tab[data-section="desk"]::before { content:"▦"; }
  .tab[data-section="timeline"]::before { content:"◷"; }
  .tab[data-section="lab"]::before { content:"◎"; }
  .tab[data-section="signals"]::before { content:"⌁"; }
  .tab[data-section="data"]::before { content:"▥"; }
  body > header #station-name { margin:24px 0 0; width:100%; padding:12px; white-space:normal; }
  body > header #station-switch { max-width:100%; width:100%; }
  body > header .header-overflow { margin-left:0; }
  body > header .header-overflow-menu { left:0; right:auto; top:auto; bottom:calc(100% + 8px); }
  body > header #btn-settings { display:flex; align-items:center; gap:10px; flex:1; min-height:44px; }
  .settings-label { display:inline; font-size:13px; }
  main { min-width:0; height:100%; }
}
body, main { background:var(--bg); }
body > header nav { background:transparent; border:0; }
body > header #brand { box-shadow:none; }
body > header #btn-settings, body > header .iconbtn, body > header .header-overflow > summary, body > header .header-overflow-menu { color:var(--text); background:var(--panel); border-color:var(--line); }
html[data-theme="dark"]:not([data-palette="contrast"]) { --warn:#eea64b; }
@media (min-width:1000px) and (min-height:501px) {
  body > header { display:grid; grid-template-columns:30px minmax(0,1fr); grid-template-rows:auto 1fr auto auto auto; align-content:stretch; }
  body > header h1 { margin:0; font-size:14px; }
  body > header nav { grid-column:1/-1; align-self:start; }
  body > header #station-name, body > header #station-switch { grid-column:1/-1; }
  body > header #btn-settings { margin-left:4px; }
}
@media (max-width:999px), (max-height:500px) {
  body > header #station-name { display:none; }
  body > header nav { flex:1; }
  body > header #station-switch { max-width:110px; }
}
@media (max-width:600px) {
  body > header { gap:4px; padding-left:6px; padding-right:6px; }
  body > header #brand { display:none; }
  body > header .tab { padding:8px; font-size:12px; min-height:44px; }
  body > header .iconbtn, body > header .header-overflow > summary { min-height:44px; }
  body > header #station-switch { max-width:70px; }
  body > header .header-overflow-menu { top:auto; bottom:calc(100% + 8px); }
}

html[data-theme="light"]:not([data-palette="solarized"]):not([data-palette="contrast"]) {
  --bg:#f2f5f8; --panel:#fff; --panel2:#e8edf3; --line:#ccd6e0;
  --text:#16202b; --muted:#526476; --accent:#087f78; --warn:#a35a00;
}

.watch-map #lab-radar-still { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.radar-safe-caption { position:absolute; bottom:0; left:0; right:0; margin:0; padding:8px; background:var(--panel); color:var(--muted); text-align:center; font-size:12px; }
