/* ============================================================================
   CYNOSURE — platform UI design tokens  (S1 theme seam)
   ----------------------------------------------------------------------------
   RECONCILED (TD-1): the canonical source of truth is
       e:/cynos-mail/shared/theme/tokens.css   (authored by W-MAIL-UI).
   The :root BASE block below is a VERBATIM MIRROR of that file — identical
   token NAMES and VALUES, zero drift — because the platform Worker's ASSETS
   binding serves only ./platform/ui/ at runtime and therefore cannot <link>
   a file outside its served root (the same constraint the shared header
   documents for the mail SPA, which also mirrors the values inline).

   Frozen Phase-1 values (do NOT drift; must equal shared/theme/tokens.css):
       accent cyan ...... #22d3ee   (--accent)
       base background .. #000000   (--black, OLED true-black)
       ink on accent .... #00171c   (--accent-ink)

   When the platform deploy gains a build step that copies
   shared/theme/tokens.css into platform/ui/ (or a bundler import), it
   SUPERSEDES this mirror — delete the mirror block and link the shared file.
   The hub-only EXTENSIONS block (VFD panels, radii, z-layers) is additive and
   stays platform-local regardless.
   ========================================================================== */

/* ---- BASE: verbatim mirror of shared/theme/tokens.css --------------------- */
:root {
  /* --- OLED black surfaces --- */
  --black: #000000;          /* app base — true black (OLED pixels off) */
  --raise-1: #07090b;        /* hover / selected (barely-there lift) */
  --raise-2: #0b0e11;        /* fields, body card */
  --raise-3: #101418;        /* inputs, chips */

  /* --- hairlines --- */
  --line: rgba(255,255,255,0.075);
  --line-strong: rgba(255,255,255,0.14);
  --line-faint: rgba(255,255,255,0.045);

  /* --- type --- */
  --fg: #e9eef2;
  --fg-dim: #9aa6b2;
  --fg-faint: #5d6873;
  --fg-ghost: #3a434c;

  /* --- cyan accent (the Cynosure signature) --- */
  --accent: #22d3ee;
  --accent-bright: #5eeaff;
  --accent-dim: #0e7490;
  --accent-glow: rgba(34,211,238,0.16);
  --accent-ink: #00171c;     /* text/glyph that sits ON an --accent fill */

  /* --- semantic security triad --- */
  --ok: #34d399;
  --warn: #fbbf24;
  --bad: #fb7185;
  --ok-bg: rgba(52,211,153,0.12);
  --warn-bg: rgba(251,191,36,0.12);
  --bad-bg: rgba(251,113,133,0.12);

  /* --- type families --- */
  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: ui-monospace, "Cascadia Code", "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

/* ---- EXTENSIONS: platform-hub-only, additive (NOT in the shared file) ------
   Derived strictly from the canonical tokens above (no new raw color literals
   except the VFD panel field, a darkened sibling of --black). Kept separate so
   the BASE mirror can be swapped for the shared file without losing these. --- */
:root {
  /* soft cyan derivations for glow/hairline work */
  --accent-glow-soft: rgba(34,211,238,0.08);
  --accent-hairline: rgba(34,211,238,0.30);

  /* near-black raises pushed toward true #000 (opt-in via body.surface-pure) */
  --raise-1-pure: #000000;
  --raise-2-pure: #030405;
  --raise-3-pure: #060809;

  /* VFD register — vacuum-fluorescent panel styling for hub tiles */
  --vfd-bg: #04070a;                                   /* near-black panel field, faint cyan cast */
  --vfd-border: rgba(34,211,238,0.22);                 /* hairline cyan vector border */
  --vfd-border-hot: rgba(34,211,238,0.55);             /* hover / focus border */
  --vfd-glow: 0 0 22px -8px rgba(34,211,238,0.45);     /* outer phosphor glow */
  --vfd-inner: inset 0 0 0 1px rgba(34,211,238,0.06);  /* inner trace */

  /* radii / spacing rhythm */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 18px;

  /* z-layer stack — reserves an empty background-layer for Stage-2 living-circuitry */
  --z-background: 0;
  --z-content: 10;
  --z-chrome: 20;
  --z-overlay: 80;
  --z-toast: 90;
}

/* surface: pure variant — opt-in deeper black */
body.surface-pure {
  --raise-1: var(--raise-1-pure);
  --raise-2: var(--raise-2-pure);
  --raise-3: var(--raise-3-pure);
}