/* ============================================================================
   ATLAS REDESIGN — Token Layer (Calm + Operator)
   Source of truth: _redesign_handoff_2026-06-29/  ·  Branch: atlas-redesign-2026-06-29
   Loads LAST (after v6-lock.css). Owns the NEW visual language.

   ISOLATION CONTRACT (read before editing):
   - The legacy app is themed via [data-theme="light"] (hundreds of !important rules).
     We DO NOT touch that. Instead the redesign theme rides on a SEPARATE attribute:
        html[data-rtheme="almanac"]  = Calm  (warm editorial light, default/lead)
        html[data-rtheme="operator"] = Operator (dark command console)
   - This file defines ONLY new --r-* variables. Legacy --bg/--surface/--gold are
     left alone so un-migrated screens keep their known-good look during the phased build.
   - Migrated surfaces (shell, Home, Tasks, Pipeline, …) consume --r-* exclusively and
     use html[data-rtheme="…"]-prefixed selectors to win over legacy [data-theme="light"].
   ========================================================================== */

/* ---- Shared scale (theme-independent) ------------------------------------ */
:root {
  /* radii */
  --r-radius-chip: 6px;
  --r-radius-badge: 8px;
  --r-radius-control: 10px;   /* buttons / inputs */
  --r-radius-card: 14px;
  --r-radius-pill: 20px;

  /* type scale (px) */
  --r-fs-h1: 30px;        /* P3 2026-07-02: 25→30 — V6 boardroom-readable spec (H1 30-34) + Claude-design ref match */
  --r-fs-h2: 17px;
  --r-fs-card-title: 14px;
  --r-fs-body: 13.5px;
  --r-fs-meta: 12px;      /* parity 2026-07-02: 11.5→12 — metadata ≥12px gate */
  --r-fs-eyebrow: 11px;   /* parity 2026-07-02: mono uppercase eyebrow 10→11 (decorative, lifted off the tiny-text floor) */

  /* fonts (body + mono shared; display differs per theme) */
  --r-font-body: "Hanken Grotesk", "Inter", system-ui, -apple-system, Segoe UI, sans-serif;
  --r-font-mono: "JetBrains Mono", SFMono-Regular, Consolas, monospace;

  /* layout */
  --r-rail-w: 248px;
  --r-rail-w-collapsed: 76px;
  --r-topbar-h: 64px;
  --r-page-max: 1480px;
  --r-gutter: 22px;

  /* motion */
  --r-ease: cubic-bezier(.2, .7, .2, 1);
  --r-dur: .14s;

  /* focus (shared) */
  --r-focus: 2px solid rgba(92, 157, 255, .55);

  /* W2 2026-07-02 · floating voice pill — DARK control surface in BOTH themes
     (V6 language: dark is reserved for control panels — Ask Atlas / Trust Rail /
     the voice dock). Deliberately theme-independent, hence this shared block. */
  --r-dock-bg: #1D1B16;
  --r-dock-ink: #F2EFE6;
  --r-dock-muted: #A8A294;
  --r-dock-border: #3A362D;
}

/* ===========================================================================
   CALM  (almanac)  —  warm editorial light · evergreen · Newsreader serif
   =========================================================================== */
html[data-rtheme="almanac"] {
  --r-font-display: "Newsreader", Georgia, "Times New Roman", serif;

  /* canvas + surfaces */
  --r-canvas: #FBF9F4;
  --r-canvas-raised: #F7F4ED;
  --r-well: #F2EFE6;          /* board wells */
  --r-surface: #FFFFFF;
  --r-surface-2: #FBFAF6;

  /* ink */
  --r-ink: #211F1A;
  --r-body: #46423A;
  --r-muted: #6A6458;
  --r-faint: #797264;         /* parity 2026-07-02: was #9A9080 (2.9:1, FAIL) → 4.6:1 on cream canvas, AA; still a tier lighter than --r-muted */

  /* borders */
  --r-border: #E6E0D3;        /* outer */
  --r-hairline: #EFEAE0;
  --r-hairline-2: #ECE6DA;

  /* primary + semantic */
  --r-primary: #2F5D50;       /* evergreen */
  --r-primary-2: #2F7D5B;
  --r-primary-ink: #FFFFFF;   /* text on primary fill */
  --r-mint-surface: #E6EEEA;
  --r-mint-ink: #234A40;
  --r-clay: #B0614A;
  --r-clay-2: #8E4A37;
  --r-alert: #B0463A;
  --r-amber: #C99A3B;
  --r-good: #2F7D5B;
  --r-info: #2F5D50;

  /* delta-chip + KpiCard chart tints (v1.2) */
  --r-chip-up-surface: #E6EEEA;     /* positive trend chip */
  --r-chip-up-ink: #2F7D5B;
  --r-chip-risk-surface: #F3EBD6;   /* "at risk" / attention chip */
  --r-chip-risk-ink: #8A6A22;
  --r-chip-down-surface: #F4E7E0;   /* negative trend chip */
  --r-chip-down-ink: #8E4A37;
  --r-spark-fill: 0.14;             /* area-chart fill opacity */
  --r-seg-track: #EFEAE0;           /* segment / momentum rest track */

  /* priority */
  --r-prio-high: #B0463A;
  --r-prio-med:  #C99A3B;
  --r-prio-low:  #9A9080;

  /* rail (Calm = light rail, dark ink) */
  --r-rail-bg: #F7F4ED;
  --r-rail-bg-2: #F2EFE6;
  --r-device-bezel: #1d1b16; /* warm near-black — phone/device frame (reads as hardware in both themes) */
  --r-rail-ink: #211F1A;
  --r-rail-muted: #6A6458;
  --r-rail-active-bg: #E6EEEA;
  --r-rail-active-ink: #234A40;
  --r-rail-border: #E6E0D3;

  /* elevation */
  --r-shadow-card: 0 1px 2px rgba(40, 33, 20, .04);
  --r-shadow-hover: 0 10px 26px -10px rgba(40, 33, 20, .22);
  --r-shadow-pop: 0 18px 44px -14px rgba(40, 33, 20, .26);

  /* selection */
  --r-select: rgba(47, 93, 80, .16);

  /* unread row tint (notification dropdown · v2.2) */
  --r-row-unread: #FBF7F0;
}

/* ===========================================================================
   OPERATOR  (operator)  —  dark command console · azure/mint · Space Grotesk
   =========================================================================== */
html[data-rtheme="operator"] {
  --r-font-display: "Space Grotesk", "Inter", system-ui, sans-serif;

  /* canvas + surfaces */
  --r-canvas: #0C0E11;
  --r-canvas-raised: #101317;
  --r-well: #0E1115;
  --r-surface: #14171C;
  --r-surface-2: #161A20;

  /* ink */
  --r-ink: #EEF0F2;
  --r-body: #CDD2D8;
  --r-muted: #9AA0A8;
  --r-faint: #828892;         /* parity 2026-07-02: was #7A8088 (4.4:1, borderline) → 5.2:1 on operator canvas, AA */

  /* borders */
  --r-border: rgba(255, 255, 255, .08);
  --r-hairline: rgba(255, 255, 255, .06);
  --r-hairline-2: rgba(255, 255, 255, .07);

  /* primary + semantic */
  --r-primary: #5C9DFF;        /* azure */
  --r-primary-2: #46DDA0;
  --r-primary-ink: #06101F;    /* near-black text on azure fill */
  --r-mint-surface: rgba(70, 221, 160, .12);
  --r-mint-ink: #46DDA0;
  --r-clay: #FF8A8A;
  --r-clay-2: #FF8A8A;
  --r-alert: #FF8A8A;
  --r-amber: #F4B740;
  --r-good: #46DDA0;
  --r-info: #5C9DFF;

  /* delta-chip + KpiCard chart tints (v1.2) */
  --r-chip-up-surface: rgba(70, 221, 160, .13);
  --r-chip-up-ink: #46DDA0;
  --r-chip-risk-surface: rgba(244, 183, 64, .14);
  --r-chip-risk-ink: #F4B740;
  --r-chip-down-surface: rgba(255, 138, 138, .13);
  --r-chip-down-ink: #FF8A8A;
  --r-spark-fill: 0.18;
  --r-seg-track: rgba(255, 255, 255, .08);

  /* priority */
  --r-prio-high: #FF8A8A;
  --r-prio-med:  #F4B740;
  --r-prio-low:  #7A8088;

  /* rail (Operator = near-black rail) */
  --r-rail-bg: #08090B;
  --r-rail-bg-2: #101317;
  --r-device-bezel: #000; /* phone/device frame — pure black against the operator canvas */
  --r-rail-ink: #EEF0F2;
  --r-rail-muted: #9AA0A8;
  --r-rail-active-bg: rgba(92, 157, 255, .14);
  --r-rail-active-ink: #9CC2FF;
  --r-rail-border: rgba(255, 255, 255, .06);

  /* elevation */
  --r-shadow-card: 0 1px 2px rgba(0, 0, 0, .5);
  --r-shadow-hover: 0 14px 30px -12px rgba(0, 0, 0, .7);
  --r-shadow-pop: 0 18px 44px -14px rgba(0, 0, 0, .75);

  /* selection */
  --r-select: rgba(92, 157, 255, .22);

  /* unread row tint (notification dropdown · v2.2) */
  --r-row-unread: rgba(92, 157, 255, .05);
}

/* Fallback: if data-rtheme is somehow unset, behave as Calm so nothing renders unstyled. */
html:not([data-rtheme="operator"]) { color-scheme: light; }
html[data-rtheme="operator"] { color-scheme: dark; }

/* ── P3 (2026-07-02): phones keep a calmer H1 so long greetings/headers do not wrap awkwardly ── */
@media (max-width: 767px) {
  :root { --r-fs-h1: 26px; }
}