/* Ruby on Slate — canonical token sheet (operator-supplied 2026-09-04, from the admin-portal overhaul direction).
   Consumers: community.wovin.tv site · wovin.tv marketing site re-skin · account.wovin.tv pages.
   Rule: emulate verbatim; do not re-tune hues.
   RULE (operator 2026-09-04): ruby (--am) is STANDALONE — always flat; never a gradient stop, never a glow. Instrument Sans face is referenced but not declared here —
   self-host its woff2 alongside IBM Plex Mono (no CDN fonts). */

@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-latin-400.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-latin-500.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-latin-600.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}

:root {
  /* ── surfaces ───────────────────────────────────────────────────────── */
  --bg: #252A36;
  --bg0: var(--bg);
  --bg1: #2C3242;
  --panel: #313848;
  --raise: #3C445A;
  --control-well: #353D4F;

  /* ── inks ───────────────────────────────────────────────────────────── */
  --ink-hi: #ECEFF6;
  --ink: #C9D0DE;
  --ink-dim: #99A2B6;

  /* ── jewel families (roles preserved, hues tuned to the slate field) ─── */
  --am: #E8607A;          /* primary / chrome / Library — ruby             */
  --am-hover: #F0879B;
  --ink-on-am: #2A0610;
  --sa: #7ED0C8;          /* Engines / technical — teal                    */
  --ci: #E5C878;          /* Sessions / time / live + WARN — gold          */
  --lp: #7FC4E8;          /* Users / people — sky                          */
  --ok: #8FD4A5;
  --ga: #F5A08C;          /* failed / destructive — salmon                 */
  --cn: #C4B287;          /* structure / config — sand                     */

  /* ── line variants (family mixed ~50% toward the field) ─────────────── */
  --am-line: #8F4458;
  --sa-line: #4E837E;
  --ci-line: #927F4C;
  --lp-line: #4F7D96;
  --ok-line: #588A69;
  --ga-line: #9A6659;
  --cn-line: #7C7257;

  /* ── borders ────────────────────────────────────────────────────────── */
  --rule: rgba(210, 220, 240, .10);
  --rule-strong: rgba(210, 220, 240, .22);

  /* ── status translucents (bg @ .10-.12 / border @ .28-.30) ──────────── */
  --ok-bg: rgba(143, 212, 165, .10);
  --ok-border: rgba(143, 212, 165, .28);
  --warn-bg: rgba(229, 200, 120, .12);
  --warn-border: rgba(229, 200, 120, .30);
  --err-bg: rgba(245, 160, 140, .10);
  --err-border: rgba(245, 160, 140, .28);
  --info-bg: rgba(232, 96, 122, .10);
  --info-border: rgba(232, 96, 122, .28);
  --lp-bg: rgba(127, 196, 232, .12);
  --lp-border: rgba(127, 196, 232, .28);

  /* ── effects ────────────────────────────────────────────────────────── */
  --focus-ring: rgba(232, 96, 122, .38);
  --ghost: rgba(236, 239, 246, .12);
  --overlay: rgba(10, 12, 18, .62);
  --shadow-c: rgba(10, 12, 18, .55);
  --shadow-strong: rgba(10, 12, 18, .65);
  --duo-a: #3A4257;
  --duo-b: #2C3242;

  /* ── geometry (README §Geometry) ────────────────────────────────────── */
  --radius: 12px;          /* cards / panels                               */
  --radius-ctl: 8px;       /* controls / buttons / inputs                  */
  --radius-inner: 6px;     /* segmented inner                              */
  --radius-tile: 10px;     /* tiles                                        */
  --radius-pill: 999px;

  --rail-w: 264px;
  --strip-h: 52px;
  --gutter: 56px;

  /* ── type (README §Typography) ──────────────────────────────────────── */
  --sans: 'Instrument Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  color-scheme: dark;
}