/* GENERATED by scripts/copy-tokens.mjs from src/tokens.css — do not edit.
   Served at /tokens.css for the server-rendered Go pages (be/landing.go). */
/* ── Design tokens — THE source of truth for both front ends ──────────────────
   Dark-first "command center" palette, no framework: we lift the design language into
   custom properties instead of adopting Tailwind or a UI kit.

   This file has TWO consumers, which is why it is its own file rather than the top of
   styles.css (launch plan §L0):

     web/src/styles.css      @import-s it, so Vite inlines it into the SPA's hashed
                             stylesheet — no extra request.
     web/public/tokens.css   a verbatim copy staged by scripts/copy-tokens.mjs, served
                             same-origin at /tokens.css and <link>-ed by the
                             server-rendered Go pages (be/landing.go, the legal pages),
                             which have no bundler to inline anything.

   Edit HERE. public/tokens.css is generated and gitignored; a Go template that drifts
   from the SPA is exactly the failure this split exists to prevent — the landing is
   supposed to look like the product, and nothing would fail if it slowly stopped.

   Theme: dark is the default (bare :root); a light palette is layered in via
   :root[data-theme="light"]. The active theme is stamped onto <html data-theme> by an
   inline boot script in index.html (no flash) and toggled from the sidebar (see
   theme.ts). Overlay/state colors that differ per theme are tokens too, so no rule
   anywhere hardcodes a light-or-dark-only value.

   Typography: body is self-hosted Inter Variable with the system stack behind it;
   labels/data use a system mono. Nothing is fetched from a CDN — the font ships with the
   image (docs/licenses.md §Fonts). */
:root {
  color-scheme: dark;
  --bg: #0f1116;
  --panel: #181b22;
  --surface-elevated: #1c2029;
  --surface-lowest: #0c0e13;
  --fg: #e6e8eb;
  --muted: #9aa0aa;
  --accent: #3d71d9;
  --accent-bright: #5b8bf0;
  --danger: #c8433a;
  --danger-fg: #ff8b82;
  --border: #262a33;
  --border-strong: #333945;

  /* Ambient background bloom (see the body rule in styles.css / the landing template) */
  --glow: rgba(61, 113, 217, 0.15);
  --glow-far: rgba(61, 113, 217, 0.07);

  /* Hover overlays (tint applied over a surface on hover) */
  --hover: #ffffff0d;
  --hover-strong: #ffffff10;
  --hover-faint: #ffffff08;

  /* Inline error block */
  --error-bg: #2a1618;

  /* Stream state colors */
  --live: #10b981;
  --warn: #ffb786;
  --offline: #6b7280;

  --radius: 10px;
  --radius-sm: 8px;

  /* Inter Variable is self-hosted (/fonts/, staged by scripts/copy-fonts.mjs). The system
     stack stays behind it as a real fallback, not a formality: font-display:swap renders
     text in it first, and it is what shows if the woff2 fails to load. */
  --font-body: "Inter Variable", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", Menlo,
    Consolas, monospace;

  --sidebar-w: 260px;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f5f7;
  --panel: #ffffff;
  --surface-elevated: #ffffff;
  --surface-lowest: #eceef1;
  --fg: #1a1d23;
  --muted: #5c6470;
  --accent: #3d71d9;
  --accent-bright: #2f5fc0;
  --danger: #c8433a;
  --danger-fg: #b3261e;
  --border: #dfe2e7;
  --border-strong: #c8cdd6;

  --glow: rgba(61, 113, 217, 0.10);
  --glow-far: rgba(61, 113, 217, 0.05);

  --hover: rgba(0, 0, 0, 0.05);
  --hover-strong: rgba(0, 0, 0, 0.06);
  --hover-faint: rgba(0, 0, 0, 0.03);

  --error-bg: #fbeae9;

  --warn: #d97706;
}