/* Shared application tokens. Brand values follow the parent application's palette.
   Weather semantics and component sizes are centralized here. */
:root {
  --green:#173f34; --green-2:#245747; --green-3:#dfe9e3; --gold:#c89537;
  --paper:#f5f3ed; --surface:#fffefa; --ink:#1b2924; --muted:#69756f; --line:#dddcd5;
  --danger:#b3483f; --warning:#c47c20; --shadow:0 18px 50px rgba(27,41,36,.08);
  --color-bg:var(--paper); --color-surface:var(--surface); --color-text:var(--ink); --color-muted:var(--muted); --color-border:var(--line);
  --color-brand:var(--green); --color-brand-hover:var(--green-2); --color-soft:var(--green-3); --color-accent:var(--gold);
  --color-on-brand:#fffefa; --color-map:#131d20; --color-map-panel:rgba(19,29,32,.94); --color-map-text:#f2f5f3; --color-map-muted:#b9c8c5;
  --color-red:var(--danger); --color-orange:var(--warning); --color-yellow:#a87b16; --color-info:#287aab; --color-good:#83d9ad;
  --color-red-soft:#f8e7e4; --color-orange-soft:#faf0de; --color-yellow-soft:#faf4d8; --color-info-soft:#e6f1f7;
  --font-body:Inter,"Segoe UI",system-ui,-apple-system,sans-serif; --font-mono:"SFMono-Regular",Consolas,monospace;
  --text-xs:.69rem; --text-sm:.79rem; --text-base:.88rem; --text-lg:1.12rem; --text-xl:1.5rem; --text-hero:clamp(1.8rem,3vw,2.65rem);
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px;
  --radius-sm:6px; --radius:12px; --radius-lg:18px; --control-height:44px; --border:1px solid var(--color-border);
  --sidebar-width:280px; --color-map-border:#2e3b3e; --color-warning-text:#ebc782; --color-alert-text:#ffb4a9; --color-dialog-backdrop:rgba(8,16,18,.28);
}
.weather-app--map { --color-bg:var(--color-map); --color-surface:var(--color-map); --color-text:var(--color-map-text); --color-muted:var(--color-map-muted); --color-border:var(--color-map-border); --color-soft:var(--color-brand); color-scheme:dark; }
/* HD canvas palette, shared by CSS and the renderer. Based on the supplied HD reference. */
.weather-app--hd {
  --font-body:Geist,"Segoe UI",system-ui,sans-serif; --font-mono:"Geist Mono",Consolas,monospace;
  --color-bg:#030407; --color-surface:#0f131a; --color-text:#fff; --color-muted:#a5adb8;
  --color-border:rgba(180,200,230,.18); --color-soft:rgba(255,255,255,.08); --color-good:#6ef0b4;
  --hd-ocean:#0c121c; --hd-land:#0f131a; --hd-coast:rgba(180,200,230,.32); --hd-grid:rgba(255,255,255,.035);
  --hd-panel:rgba(15,19,26,.88); --hd-clear:rgba(3,4,7,0); --hd-shade:rgba(3,4,7,.96);
  --hd-particle-low:rgba(150,180,220,.28); --hd-particle-mid:rgba(215,230,255,.55); --hd-particle-high:rgba(255,255,255,.9);
  --hd-gust-30:40,110,200,0; --hd-gust-45:60,190,220,.2; --hd-gust-65:240,205,90,.36;
  --hd-gust-85:255,140,50,.48; --hd-gust-105:255,60,70,.6; --hd-gust-135:255,40,160,.7;
  --hd-rain-0:40,110,200,0; --hd-rain-1:60,190,220,.25; --hd-rain-5:90,160,255,.5; --hd-rain-15:165,90,240,.7;
  --hd-low:#ff806c; --hd-yellow:#f1cf59; --hd-orange:#ff8c32; --hd-red:#ff3c46;
  --hd-radius:999px; --hd-inset:clamp(16px,2.5vw,36px); --hd-value:clamp(36px,6vw,76px); --hd-small-value:clamp(20px,3vw,36px);
  --hd-sheet-width:380px; --hd-legend:linear-gradient(90deg,rgba(60,190,220,.6),#f0cd5a,#ff8c32,#ff3c46,#ff28a0);
  --hd-ticker-height:45px; --hd-ticker-gap:48px;
  --hd-forecast-width:420px; --hd-range-fill:rgba(110,240,180,.18);
  --hd-control-text:1rem;
  color-scheme:dark;
}