/* Shared design tokens — linked by both the landing page and the viewer.
   The single source of truth for the palette; nothing else declares colours. */
/* Meteoadriatic viewer — instrument-panel chrome around the map.
   Palette: cool paper grays, ink, and Adriatic-blue accent. */

:root {
  --bg:           #eceff1;
  --panel:        #ffffff;
  --panel-hover:  #f2f5f7;
  --panel-active: #e8f0f5;
  --active-ink:   #0a4a68;
  --ink:          #14242f;
  --muted:        #5d6b78;
  --line:         #c9d2d9;
  --accent:       #0d5c80;
  --accent-hi:    #0a4a68;
  --on-accent:    #ffffff;
  --fresh:        #2e7d32;
  --aging:        #b26a00;
  --stale:        #b3261e;
  --map-bg:       #ffffff;
  --shadow-1:     rgba(20, 36, 47, 0.18);
  --shadow-2:     rgba(20, 36, 47, 0.15);
  --shadow-3:     rgba(20, 36, 47, 0.25);
  --backdrop:     rgba(20, 36, 47, 0.45);
  --badge-bg:     #f6e7b0;
  --badge-line:   #e3cd7e;
  --badge-ink:    #7a5a00;
  --badge-hover:  #f0da92;
  --chip-bg:      #ffe3b3;
  --chip-line:    #e8c078;
  --chip-ink:     #7a4a00;
  /* The Skew-T diagram's own curve families (web/js/skewt-draw.js) --
     narrow enough in use to sit here unnamed after any page, the same way
     --badge-*/--chip-* already do, rather than the diagram carrying its
     own hex constants and ignoring the theme. */
  --skewt-temp:      #a03328;
  --skewt-dewpoint:  #0f6b6b;
  --skewt-dry:       #b8860b;
  --skewt-moist:     #3f7d5a;
  --skewt-mix:       #7a8fa6;
  /* The Skew-T plate's own background (skewt.css's `.sk-plate`) -- fixed,
     not overridden under [data-theme="dark"] below, on purpose: the plot
     reads like paper whatever theme the surrounding chrome is in (design
     #1), not a toggle Ivan asked for and not one this token grows one of. */
  --plate:           #ffffff;
  /* Isotherms and the plot border, not --line: --line is tuned for a hairline
     against --panel in the site's chrome (a 1-2px separator next to other
     ink), not for a grid of lines meant to still read as a grid across an
     entire plot. --line on --panel is 1.29:1 in dark mode -- close enough to
     invisible that the isotherms would vanish at night. --skewt-grid is
     picked for >=3:1 against --panel in both themes (WCAG's floor for a
     graphical object, not text), checked by relative-luminance formula
     against #ffffff/light and #151f28/dark: light 3.19:1, dark 3.70:1. */
  --skewt-grid:      #7f93a0;
  --sans: "IBM Plex Sans", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --cond: "IBM Plex Sans Condensed", "IBM Plex Sans", system-ui, sans-serif;
}

/* Jadran slate — cold blue undertone, same instrument at night */
[data-theme="dark"] {
  --bg:           #0e151b;
  --panel:        #151f28;
  --panel-hover:  #1b2530;
  --panel-active: #1b2a36;
  --active-ink:   #8fc3de;
  --ink:          #d9e4ec;
  --muted:        #7f93a3;
  --line:         #24333f;
  --accent:       #4ea5cf;
  --accent-hi:    #6db8dc;
  --on-accent:    #0e151b;
  --fresh:        #4caf50;
  --aging:        #d68a1e;
  --stale:        #e05d52;
  --map-bg:       #ffffff;
  --shadow-1:     rgba(0, 0, 0, 0.45);
  --shadow-2:     rgba(0, 0, 0, 0.40);
  --shadow-3:     rgba(0, 0, 0, 0.55);
  --backdrop:     rgba(0, 0, 0, 0.60);
  --badge-bg:     #3a3218;
  --badge-line:   #57491f;
  --badge-ink:    #e8d48a;
  --badge-hover:  #453c1d;
  --chip-bg:      #3a2e18;
  --chip-line:    #5a4620;
  --chip-ink:     #f0c987;
  --skewt-temp:      #e0685a;
  --skewt-dewpoint:  #4fb8ac;
  --skewt-dry:       #d9b84f;
  --skewt-moist:     #6fbf8b;
  --skewt-mix:       #9fb3c8;
  --skewt-grid:      #5f7995;
}

html { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }