/* Orbit Monitor — design tokens (Orbit's own system).
   Graphite neutrals, one iris accent, Geist + Geist Mono. Status colours are reserved for status and always carry a label/icon.
   Dark is the default; light is a warm-paper theme, not an inversion. */

@font-face { font-family: "Geist"; src: url("../fonts/geist-latin-wght-normal.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist"; src: url("../fonts/geist-latin-ext-wght-normal.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/geist-mono-latin-wght-normal.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  color-scheme: light;
  --font-sans: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --fs-xs: 12px; --fs-sm: 13px; --fs-base: 14px; --fs-md: 15px; --fs-lg: 17px; --fs-xl: 20px; --fs-2xl: 26px; --fs-hero: 34px;
  --lh-tight: 1.25; --lh-base: 1.5;

  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px;
  --radius-sm: 6px; --radius: 8px; --radius-lg: 14px; --radius-xl: 18px; --radius-pill: 999px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1); --dur-fast: 120ms; --dur: 180ms;
  --sidebar-w: 236px; --sidebar-w-collapsed: 68px; --topbar-h: 60px;

  /* light: warm paper */
  --bg: #f6f5f2; --surface: #ffffff; --surface-2: #faf9f7; --surface-3: #efede9;
  --border: #e3e0da; --border-strong: #cdc9c1;
  --text: #15171c; --text-2: #484e5a; --text-3: #5d6472; --text-inverse: #ffffff; --focus: #5646d8;
  --accent: #5646d8; --accent-hover: #4637c4; --accent-soft: #efecfd; --accent-soft-border: #d3ccf8; --accent-text: #4535c2; --on-accent: #ffffff;
  --ok: #178a58; --ok-soft: #e4f5ec; --ok-text: #12724a;
  --warn: #a8650a; --warn-dot: #e29a10; --warn-soft: #fdf1da; --warn-text: #8a520a;
  --serious: #c2410c; --serious-dot: #ec835a; --serious-soft: #fdeee6;
  --danger: #c4382f; --danger-dot: #c9382f; --danger-soft: #fdeceb; --danger-text: #a52d26;
  --info: #1769ac; --info-soft: #e5f1fa; --neutral-dot: #98a0ad;

  --nav-bg: #ffffff; --nav-border: #e3e0da; --nav-text: #484e5a; --nav-text-muted: #5f6675; --nav-hover: #f4f3f0; --nav-active-bg: #efecfd; --nav-active-text: #4535c2;
  --chart-series: #5646d8; --chart-area: rgba(86, 70, 216, 0.1); --chart-grid: #ece9e4; --chart-axis: #cdc9c1; --chart-muted: #b9b4aa; --meter-track: #e8e5df;
  --chart-series-2: #e0742a; --chart-series-3: #16996a; --chart-series-4: #c0398e; --chart-ref: #8a909c;
  --shadow-sm: 0 1px 2px rgba(30, 24, 10, 0.05), 0 0 0 0.5px rgba(30, 24, 10, 0.03); --shadow-md: 0 6px 18px rgba(30, 24, 10, 0.1), 0 1px 3px rgba(30, 24, 10, 0.06); --shadow-lg: 0 24px 60px rgba(30, 24, 10, 0.2), 0 2px 8px rgba(30, 24, 10, 0.08);
  --scrim: rgba(18, 16, 12, 0.45);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b0c0f; --surface: #14161b; --surface-2: #1a1d23; --surface-3: #232730;
  --border: #272b34; --border-strong: #3a404c;
  --text: #eceef2; --text-2: #adb3be; --text-3: #8c93a1; --text-inverse: #0b0c0f; --focus: #a597ff;
  --accent: #6f5ff2; --accent-hover: #8173ff; --accent-soft: #1f1c3d; --accent-soft-border: #3b3580; --accent-text: #b9afff; --on-accent: #ffffff;
  --ok: #3ccb8a; --ok-soft: #12261d; --ok-text: #6ee0aa;
  --warn: #f0b429; --warn-dot: #f5b82e; --warn-soft: #2a2110; --warn-text: #f5c961;
  --serious: #f08a5d; --serious-dot: #ee8658; --serious-soft: #2c1a12;
  --danger: #f5776b; --danger-dot: #ee6258; --danger-soft: #2c1615; --danger-text: #ff9b92;
  --info: #5db4f2; --info-soft: #0f2230; --neutral-dot: #737b89;

  --nav-bg: #0f1115; --nav-border: #1f232b; --nav-text: #b3b9c4; --nav-text-muted: #8a91a0; --nav-hover: #181b21; --nav-active-bg: #1f1c3d; --nav-active-text: #cfc8ff;
  --chart-series: #8b7dff; --chart-area: rgba(139, 125, 255, 0.14); --chart-grid: #1f232b; --chart-axis: #333945; --chart-muted: #424958; --meter-track: #262a33;
  --chart-series-2: #f08a4b; --chart-series-3: #3ccb8a; --chart-series-4: #ec7ac0; --chart-ref: #747c8b;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-md: 0 8px 22px rgba(0, 0, 0, 0.5); --shadow-lg: 0 28px 70px rgba(0, 0, 0, 0.65);
  --scrim: rgba(3, 4, 6, 0.62);
}

/* production addition: QR codes must stay black on white in both themes */
:root { --qr-bg: #ffffff; }