/* FounderOS Platform prototypes: design tokens.
   Extracted READ-ONLY from GladOS (platform-overnight/app/globals.css, "G0 tokens (lane 1c)",
   the GladOS style, data-ui='glados'). Values are copied verbatim; the selectors are simplified
   because prototypes only ever render the GladOS style:
     :root                                 dark neutrals (default)
     :root[data-mode='light']              light neutrals
     :root[data-accent='<id>']             accent palette, dark   (ice is the default)
     :root[data-accent='<id>'][data-mode='light']  accent palette, light
   Every colour a prototype paints is one of these tokens. Do not add literal hex in screens.
   The --p-* block at the end is prototype-only: layout constants and semantic aliases that
   point back at --g-* tokens (no new colours). */

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300..600&display=swap');

:root {
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
  --font-sans: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Mode: dark (base), plus shape, type, space and motion. */
:root {
  color-scheme: dark;
  --g-bg: #18191d;
  --g-bg-lift: rgba(255, 255, 255, 0.05);
  --g-card: #222429;
  --g-card-2: #2a2d33;
  --g-well: #1d1f23;
  --g-ink: #ecf2fa;
  --g-ink-inverse: #111113;
  --g-muted: #a8b2c1;
  --g-dim: #737c8b;
  --g-line: rgba(205, 215, 232, 0.08);
  --g-ring: rgba(205, 215, 232, 0.24);
  --g-track: #32353c;
  --g-track-soft: #4a4e57;
  --g-scrim: rgba(0, 0, 0, 0.55);
  --g-shadow: 0 24px 48px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --g-shadow-sm: 0 10px 24px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --g-ok: #4fc16f;
  --g-warn: #f0a24a;
  --g-err: #f6867b;
  --g-ok-soft: color-mix(in srgb, var(--g-ok) 12%, transparent);
  --g-warn-soft: color-mix(in srgb, var(--g-warn) 12%, transparent);
  --g-err-soft: color-mix(in srgb, var(--g-err) 12%, transparent);
  --g-accent-soft: color-mix(in srgb, var(--g-accent) 12%, transparent);

  --g-hero-a-ink: #ffffff;
  --g-hero-b-ink: #ffffff;
  --g-hero-c-ink: #ffffff;
  --g-on-hero: #ffffff;
  --g-on-hero-dim: rgba(255, 255, 255, 0.88);
  --g-on-hero-faint: rgba(255, 255, 255, 0.2);

  --g-cat-1: var(--g-series-1);
  --g-cat-2: var(--g-series-2);
  --g-cat-3: var(--g-series-3);
  --g-cat-4: var(--g-series-4);
  --g-cat-5: var(--g-series-5);
  --g-cat-6: var(--g-series-6);
  --g-cat-7: #d9a441;
  --g-cat-8: #3fb59c;
  --g-cat-9: #e07aae;
  --g-cat-10: #a0a656;
  --g-cat-11: #b48a6a;

  --g-state-ready: var(--g-ok);
  --g-state-approved: var(--g-series-3);
  --g-state-draft: var(--g-dim);
  --g-state-sent: var(--g-badge);

  --g-viz-stage: #1c1d22;
  --g-viz-ink: color-mix(in srgb, var(--g-ink) 55%, transparent);
  --g-viz-hud: color-mix(in srgb, var(--g-card-2) 72%, transparent);
  --g-diff-del-bg: color-mix(in srgb, var(--g-err) 14%, transparent);
  --g-diff-del-fg: #ff9a90;
  --g-diff-add-bg: color-mix(in srgb, var(--g-ok) 14%, transparent);
  --g-diff-add-fg: #74d68f;

  /* Shape */
  --g-r-card: 28px;
  --g-r-nested: 20px;
  --g-r-well: 14px;
  --g-r-input: 12px;
  --g-r-pill: 999px;

  /* Type */
  --g-fs-display: 44px;
  --g-fs-section: 26px;
  --g-fs-title: 28px;
  --g-fs-card: 15px;
  --g-fs-body: 13.5px;
  --g-fs-cap: 11.5px;
  --g-fs-faint: 11px;
  --g-fw-light: 300;
  --g-fw-body: 400;
  --g-fw-badge: 500;

  /* Space */
  --g-space-1: 4px;
  --g-space-2: 8px;
  --g-space-3: 12px;
  --g-space-4: 16px;
  --g-space-5: 20px;
  --g-space-6: 24px;
  --g-space-7: 36px;
  --g-space-8: 48px;

  /* Motion */
  --g-dur-colour: 150ms;
  --g-dur-lift: 180ms;
  --g-dur-sheet: 240ms;
  --g-dur-arrive: 420ms;
}

/* Mode: light */
:root[data-mode='light'] {
  color-scheme: light;
  --g-bg: #e8e8eb;
  --g-bg-lift: rgba(255, 255, 255, 0.55);
  --g-card: #f6f6f8;
  --g-card-2: #ffffff;
  --g-well: #efeff2;
  --g-ink: #1d1d1f;
  --g-ink-inverse: #ffffff;
  --g-muted: #636368;
  --g-dim: #a1a1a6;
  --g-line: rgba(29, 29, 31, 0.07);
  --g-ring: rgba(29, 29, 31, 0.18);
  --g-track: #e9e9ed;
  --g-track-soft: #c9c9cf;
  --g-scrim: rgba(29, 29, 31, 0.22);
  --g-shadow: 0 24px 48px rgba(16, 16, 24, 0.07), 0 1px 2px rgba(16, 16, 24, 0.03);
  --g-shadow-sm: 0 10px 24px rgba(16, 16, 24, 0.06), 0 1px 2px rgba(16, 16, 24, 0.03);
  --g-ok: #1b7535;
  --g-warn: #9c4f00;
  --g-err: #b9322a;
  --g-cat-7: #8f6400;
  --g-cat-8: #13786a;
  --g-cat-9: #b0407a;
  --g-cat-10: #66701c;
  --g-cat-11: #8a5c3c;
  --g-viz-stage: var(--g-card);
  --g-diff-del-fg: #9e2a22;
  --g-diff-add-fg: #17672e;
}

/* Palette: ice (default) */
:root,
:root[data-accent='ice'] {
  --g-accent: #9fc6ff;
  --g-accent-rgb: 159, 198, 255;
  --g-accent-2: #5f86c9;
  --g-badge: #cfe4ff;
  --g-badge-ink: #06111f;
  --g-hero-a: radial-gradient(85% 36% at 78% 108%, #cfe4ff 0%, rgba(207, 228, 255, 0) 100%), linear-gradient(180deg, #1d3152 0%, #2b4a7e 62%, #4f78bd 100%);
  --g-hero-b: radial-gradient(80% 36% at 18% 108%, #c7b8ff 0%, rgba(199, 184, 255, 0) 100%), linear-gradient(160deg, #222f48 0%, #33528f 68%, #5d7fd0 100%);
  --g-hero-c: radial-gradient(90% 34% at 50% 110%, #9fc6ff 0%, rgba(159, 198, 255, 0) 100%), linear-gradient(180deg, #27416b 0%, #34548f 68%, #6e96f2 100%);
  --g-series-1: #9fc6ff;
  --g-series-2: #6ee7ff;
  --g-series-3: #c7b8ff;
  --g-series-4: #cfe4ff;
  --g-series-5: #5f86c9;
  --g-series-6: #8a939f;
}
:root[data-mode='light']:not([data-accent]),
:root[data-accent='ice'][data-mode='light'] {
  --g-accent: #3a6fc4;
  --g-accent-rgb: 58, 111, 196;
  --g-accent-2: #27416b;
  --g-series-1: #3a6fc4;
  --g-series-2: #0a7f9e;
  --g-series-3: #7458d0;
  --g-series-4: #6a80a6;
  --g-series-5: #27416b;
  --g-series-6: #6b7380;
}

/* Palette: lime */
:root[data-accent='lime'] {
  --g-accent: #2fa84f;
  --g-accent-rgb: 47, 168, 79;
  --g-accent-2: #d7ff3c;
  --g-badge: #d7ff3c;
  --g-badge-ink: #1d1d1f;
  --g-hero-a: radial-gradient(85% 36% at 22% 108%, #e7b35d 0%, rgba(231, 179, 93, 0) 100%), linear-gradient(180deg, #0f5a26 0%, #136a2a 62%, #2f9a45 100%);
  --g-hero-b: radial-gradient(80% 36% at 80% 108%, #f6b04a 0%, rgba(246, 176, 74, 0) 100%), linear-gradient(160deg, #7a2a0c 0%, #9a370b 66%, #e0631f 100%);
  --g-hero-c: radial-gradient(90% 34% at 50% 110%, #f6a0bd 0%, rgba(246, 160, 189, 0) 100%), linear-gradient(180deg, #8c1840 0%, #b0244f 68%, #e2507f 100%);
  --g-series-1: #2fa84f;
  --g-series-2: #f0862c;
  --g-series-3: #8fa6d9;
  --g-series-4: #ef4b7e;
  --g-series-5: #d7ff3c;
  --g-series-6: #8a8a8f;
}
:root[data-accent='lime'][data-mode='light'] {
  --g-accent: #1f8a3e;
  --g-accent-rgb: 31, 138, 62;
  --g-accent-2: #165c2b;
  --g-series-1: #1f8a3e;
  --g-series-2: #c05f10;
  --g-series-3: #5470b4;
  --g-series-4: #cc2f63;
  --g-series-5: #657f00;
  --g-series-6: #707075;
}

/* Palette: ember */
:root[data-accent='ember'] {
  --g-accent: #ff4557;
  --g-accent-rgb: 255, 69, 87;
  --g-accent-2: #ff8a3d;
  --g-badge: #ffc861;
  --g-badge-ink: #2a060b;
  --g-hero-a: radial-gradient(85% 36% at 22% 108%, #ffc861 0%, rgba(255, 200, 97, 0) 100%), linear-gradient(180deg, #6e0f1a 0%, #9c1b25 62%, #d8392f 100%);
  --g-hero-b: radial-gradient(80% 36% at 80% 108%, #ffb067 0%, rgba(255, 176, 103, 0) 100%), linear-gradient(160deg, #7a2a0c 0%, #9a370b 66%, #e0631f 100%);
  --g-hero-c: radial-gradient(90% 34% at 50% 110%, #ff8a96 0%, rgba(255, 138, 150, 0) 100%), linear-gradient(180deg, #7d0f22 0%, #b01a30 68%, #ef3a4f 100%);
  --g-series-1: #ff4557;
  --g-series-2: #ff8a3d;
  --g-series-3: #ffc861;
  --g-series-4: #ffe9c2;
  --g-series-5: #cf5a2a;
  --g-series-6: #8a8a8f;
}
:root[data-accent='ember'][data-mode='light'] {
  --g-accent: #d42a3c;
  --g-accent-rgb: 212, 42, 60;
  --g-accent-2: #8f1522;
  --g-series-1: #d42a3c;
  --g-series-2: #b8540e;
  --g-series-3: #946a00;
  --g-series-4: #8a6a4a;
  --g-series-5: #9c3a14;
  --g-series-6: #707075;
}

/* Palette: mint */
:root[data-accent='mint'] {
  --g-accent: #00ffab;
  --g-accent-rgb: 0, 255, 171;
  --g-accent-2: #0a8f63;
  --g-badge: #00ffab;
  --g-badge-ink: #04241a;
  --g-hero-a: radial-gradient(85% 36% at 78% 108%, #b8ffe6 0%, rgba(184, 255, 230, 0) 100%), linear-gradient(180deg, #04402c 0%, #065a3b 62%, #0a8a5c 100%);
  --g-hero-b: radial-gradient(80% 36% at 18% 108%, #89cff0 0%, rgba(137, 207, 240, 0) 100%), linear-gradient(160deg, #0e3a5c 0%, #1a5a8e 66%, #2f7fc0 100%);
  --g-hero-c: radial-gradient(90% 34% at 50% 110%, #4dffc4 0%, rgba(77, 255, 196, 0) 100%), linear-gradient(180deg, #04402c 0%, #066142 68%, #0a8f63 100%);
  --g-series-1: #00ffab;
  --g-series-2: #6e96f2;
  --g-series-3: #89cff0;
  --g-series-4: #bd5fe8;
  --g-series-5: #4dffc4;
  --g-series-6: #8a939f;
}
:root[data-accent='mint'][data-mode='light'] {
  --g-accent: #00845a;
  --g-accent-rgb: 0, 132, 90;
  --g-accent-2: #04603f;
  --g-series-1: #00845a;
  --g-series-2: #3d66d4;
  --g-series-3: #2a7fae;
  --g-series-4: #9a3fc9;
  --g-series-5: #00705a;
  --g-series-6: #6b7380;
}

/* ── Prototype-only (--p-*): layout constants and semantic aliases. No new colours. ── */
:root {
  --p-sidebar-w: 232px;          /* GladOS --sidebar-w */
  --p-topbar-h: 52px;            /* GTopbar height */
  --p-main-pad-x: 32px;          /* GladOS <main> px-8 */
  --p-main-pad-top: 28px;        /* GladOS <main> pt-7 */
  --p-content-max: 1440px;

  /* Machine and run states (north star §5.2, §5.7). Status always carries a word; hue only assists. */
  --p-s-live: var(--g-ok);       /* running, working, succeeded, active */
  --p-s-wait: var(--g-warn);     /* idle, queued, starting, paused-idle, waiting on input, stale */
  --p-s-bad: var(--g-err);       /* error, failed, lost, revive_failed, over cap */
  --p-s-off: var(--g-dim);       /* paused, stopped, destroyed, away, canceled */
  --p-s-info: var(--g-accent);   /* in progress, provisioning */

  /* Spend split (north star §5): MIOSA $ and AI (BYOK) $ read as two series everywhere, one definition for every screen.
     AI uses series-5, not series-3: against series-1 the dataviz validator gives series-3 dE 6.0 dark / 9.1 light (floor 15),
     series-5 dE 20.0 dark / 18.5 light (ice accent). Both are GladOS tokens. */
  --p-spend-miosa: var(--g-series-1);
  --p-spend-ai: var(--g-series-5);
  --p-spend-unattributed: var(--g-track-soft);
}