/* ============================================================
   EXPLORE THE CELL — design tokens
   Generated from DESIGN.md (the SSOT). Components read these;
   nothing re-declares a brand value.
   Provenance: [context] extracted from cell_mobile/lib/theme/
   potatuhs.dart, pubspec.yaml, cell-catalog.json; [derived]
   computed; [proposed] this run's draft, awaiting lock.
   ============================================================ */

:root {
  /* ---- Ink surfaces — the app's own dark system [context] ---- */
  --ink-deep:  #14110F;   /* page background */
  --ink-panel: #262320;   /* raised surface, modals */
  --ink:       #1C1917;   /* borders, shadows */

  /* ---- Text on ink [context] ---- */
  --text-warm:  #FDF5EB;  /* primary — warm white */
  --text-dim:   #BAB2A8;  /* secondary — warm grey */
  --text-faint: #8A847C;  /* faint */

  /* ---- The Potatuhs tri-orange [context] ---- */
  --brand-orange: #E16416;
  --brand-sienna: #E19816;
  --brand-gold:   #E1C916;

  /* ---- Secondary accents [context: potatuhs.dart] ---- */
  --copper:   #B86F4B;
  --mocha:    #533A35;
  --airforce: #6690A3;
  --glaucous: #7272AB;
  --go:       #66BB6A;    /* positive CTAs, external links */

  /* ---- Gradients [proposed: the mark's orbit spectrum, linearized] ---- */
  --gradient-orbit: linear-gradient(135deg, var(--brand-orange), var(--brand-gold) 45%, var(--go));

  /* ---- Mark artwork spectrum [answered 2026-08-03 — sampled from app-icon.png]
     MARK-ONLY. These are the mark's own artwork colors (nucleus + orbit rings),
     tokenized so the live mark rebuild / nav marker / cell cursor can draw them.
     They are artwork, not palette — NEVER for UI surfaces, text, or components. */
  --mark-nucleus:         #D4E674;  /* the luminous chartreuse nucleus */
  --mark-orbit-blue:      #3853A8;  /* royal blue orbit */
  --mark-orbit-crimson:   #C42943;  /* crimson orbit */
  --mark-orbit-orange:    #F17D3D;  /* orange orbit */
  --mark-orbit-chartreuse:#D4E674;  /* chartreuse orbit — shares the nucleus value */

  /* ---- Typography [context: pubspec.yaml + learn site] ---- */
  --font-display: 'Bowlby One SC', 'Arial Black', sans-serif;
  --font-body:    'Outfit', 'Helvetica Neue', sans-serif;
  --font-scholar-display: 'Fraunces', Georgia, serif;   /* the learn-site pairing */
  --font-scholar-body:    'Inter', 'Helvetica Neue', sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  --text-hero:    clamp(2.6rem, 1.8rem + 4vw, 5rem);
  --text-h1:      clamp(1.9rem, 1.4rem + 2.2vw, 2.8rem);
  --text-h2:      clamp(1.4rem, 1.15rem + 1.3vw, 2rem);
  --text-h3:      clamp(1.15rem, 1rem + 0.7vw, 1.4rem);
  --text-h4:      1.05rem;
  --text-body-lg: clamp(1.05rem, 0.95rem + 0.5vw, 1.2rem);
  --text-body:    clamp(0.95rem, 0.88rem + 0.4vw, 1.05rem);
  --text-body-sm: 0.88rem;
  --text-caption: 0.78rem;
  --text-label:   0.7rem;

  /* ---- Spacing [proposed: 8px base] ---- */
  --sp-1: 0.5rem;
  --sp-2: 0.75rem;
  --sp-3: 1rem;
  --sp-4: 1.5rem;
  --sp-5: 2rem;
  --sp-6: 3rem;
  --sp-7: 4rem;
  --sp-8: 6rem;
  --section-pad: clamp(4rem, 8vw, 7rem);

  /* ---- Radii [proposed: round like the cell] ---- */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;
  --r-surface: 16px;      /* app surface default [context: potatuhs.dart] */

  /* ---- Borders & elevation [proposed: tone steps, no hard offsets] ---- */
  --border-w: 2px;
  --border: var(--border-w) solid var(--ink-panel);
  --border-lit: var(--border-w) solid var(--text-faint);
  --surface-border-w: 1.5px;  /* app surface border [context: potatuhs.dart] */
  --surface-border: var(--surface-border-w) solid color-mix(in srgb, var(--text-warm) 20%, transparent);

  /* ---- Motion [context: extracted 2026-08-03 from in-app controllers/curves] ---- */
  --dur-press: 110ms;     /* card & button press (HpgCard, easeOut) */
  --dur-fast: 140ms;      /* [derived] document micro */
  --dur-normal: 300ms;    /* generic smooth transition */
  --dur-slow: 520ms;      /* [derived] document reveals */
  --dur-screen: 1000ms;   /* lobby / screen transitions */
  --dur-drift: 9s;        /* organelle idle drift loop */
  --ease-out: cubic-bezier(0, 0, 0.2, 1);           /* Curves.easeOut — dominant */
  --ease-drift: cubic-bezier(0.4, 0, 0.2, 1);       /* smooth standard */
  --ease-back: cubic-bezier(0.34, 1.56, 0.64, 1);   /* springy pop (easeOutBack) */

  /* ---- Glow — elevation on ink [context: Potatuhs.glow] ---- */
  --glow-blur: 18px;        /* rest — color at 50% strength */
  --glow-press-blur: 10px;  /* press — color dims to 25% strength */
  --glow-rest-strength: 50%;   /* rest glow color strength */
  --glow-press-strength: 25%;  /* press glow color strength */

  /* ---- Layout [proposed] ---- */
  --max-w: 72rem;
  --max-w-narrow: 46rem;
  --max-w-wide: 88rem;
  --nav-w: 232px;
}