/* GENERATED by build.mjs from tokens.mjs — do not edit by hand. */
:root {
  /* Non-themed scale + type tokens. */
  /* The brand typeface (Switzer) with its fallback stack. */
  --font-sans: 'Switzer', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* Monospace fallback stack, for URLs / code-like text. */
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  /* Small corner radius — menu items, small badges. */
  --radius-sm: 6px;
  /* Default corner radius — buttons, fields, chips. */
  --radius: 8px;
  /* Medium corner radius. */
  --radius-md: 10px;
  /* Large corner radius — primary buttons, big cards. */
  --radius-lg: 12px;
  /* Fully round — pills, chips, count badges. */
  --radius-pill: 999px;
  /* A quick transition, e.g. for a button press. */
  --transition-fast: 0.12s ease;
  /* The default transition speed for hover / state changes. */
  --transition: 0.15s ease;

  /* Dark palette — the default. */
  color-scheme: dark;
  /* Farthest-back page background. */
  --bg-0: #05090f;
  /* List / scroll-area background. */
  --bg-1: #0a1019;
  /* Toolbars, headers, footers. */
  --surface: #121c2e;
  /* Row / control hover (subtle). */
  --surface-hover: #182234;
  /* Selected-row tint (clearly the accent colour). */
  --surface-selected: #1d3a63;
  /* Cards, menus, badges — a neutral surface. */
  --bg-card: #10161f;
  /* A second, slightly different neutral surface. */
  --bg-card-2: #0b111d;
  /* Hairline dividers. */
  --line: rgba(148, 170, 205, 0.12);
  /* Container edges — a more visible border. */
  --line-strong: rgba(148, 170, 205, 0.24);
  /* The brand accent. Primary buttons, links, active states. */
  --blue: #4b8ef7;
  /* Accent hover / emphasis — brighter than --blue. */
  --blue-bright: #7fb2ff;
  /* A pale accent tint, for a background behind accent-coloured content. */
  --blue-soft: rgba(75, 142, 247, 0.16);
  /* Text / icon colour to use ON TOP OF a --blue fill. */
  --on-accent: #ffffff;
  /* A pill or badge sitting on a --blue fill. */
  --on-accent-soft: rgba(255, 255, 255, 0.22);
  /* Primary text colour. */
  --text: #f4f7fc;
  /* Secondary text colour. */
  --text-dim: #a7b3ca;
  /* Tertiary text — labels, captions, placeholders. */
  --text-mute: #6f7c95;
  /* Success text / icon colour. */
  --success: #55c98d;
  /* Pale background behind success text or a success badge. */
  --success-soft: rgba(85, 201, 141, 0.16);
  /* Warning text / icon colour. */
  --warn: #f2b45a;
  /* Pale background behind warning text or a warning badge. */
  --warn-soft: rgba(242, 180, 90, 0.16);
  /* Danger / error text colour. */
  --danger: #fca5a5;
  /* Pale background behind danger text or a danger badge. */
  --danger-soft: rgba(252, 165, 165, 0.16);
  /* Drop-shadow colour for menus, trays, and toasts. */
  --shadow: rgba(0, 0, 0, 0.45);
  /* Themed scrollbar thumb colour. */
  --scrollbar-thumb: rgba(96, 165, 250, 0.85);
  /* Themed scrollbar track colour. */
  --scrollbar-track: rgba(255, 255, 255, 0.05);
}

/* Light — "match system". Skipped when the user has explicitly forced dark. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme='dark']) {
    color-scheme: light;
    --bg-0: #e6eaf1;
    --bg-1: #ffffff;
    --surface: #f1f4f9;
    --surface-hover: #e9eef7;
    --surface-selected: #d7e6ff;
    --bg-card: #f6f8fc;
    --bg-card-2: #eef2f8;
    --line: rgba(18, 38, 78, 0.1);
    --line-strong: rgba(18, 38, 78, 0.18);
    --blue: #2f6fe0;
    --blue-bright: #1c5cc8;
    --blue-soft: rgba(47, 111, 224, 0.12);
    --on-accent: #ffffff;
    --on-accent-soft: rgba(255, 255, 255, 0.3);
    --text: #131a26;
    --text-dim: #45546a;
    --text-mute: #77869c;
    --success: #12935a;
    --success-soft: rgba(18, 147, 90, 0.14);
    --warn: #b26b00;
    --warn-soft: rgba(178, 107, 0, 0.14);
    --danger: #c0392b;
    --danger-soft: rgba(192, 57, 43, 0.12);
    --shadow: rgba(20, 35, 70, 0.16);
    --scrollbar-thumb: rgba(47, 111, 224, 0.55);
    --scrollbar-track: rgba(18, 38, 78, 0.06);
  }
}

/* Light — explicit choice (`<html data-theme="light">`). */
:root[data-theme='light'] {
  color-scheme: light;
  --bg-0: #e6eaf1;
  --bg-1: #ffffff;
  --surface: #f1f4f9;
  --surface-hover: #e9eef7;
  --surface-selected: #d7e6ff;
  --bg-card: #f6f8fc;
  --bg-card-2: #eef2f8;
  --line: rgba(18, 38, 78, 0.1);
  --line-strong: rgba(18, 38, 78, 0.18);
  --blue: #2f6fe0;
  --blue-bright: #1c5cc8;
  --blue-soft: rgba(47, 111, 224, 0.12);
  --on-accent: #ffffff;
  --on-accent-soft: rgba(255, 255, 255, 0.3);
  --text: #131a26;
  --text-dim: #45546a;
  --text-mute: #77869c;
  --success: #12935a;
  --success-soft: rgba(18, 147, 90, 0.14);
  --warn: #b26b00;
  --warn-soft: rgba(178, 107, 0, 0.14);
  --danger: #c0392b;
  --danger-soft: rgba(192, 57, 43, 0.12);
  --shadow: rgba(20, 35, 70, 0.16);
  --scrollbar-thumb: rgba(47, 111, 224, 0.55);
  --scrollbar-track: rgba(18, 38, 78, 0.06);
}
