/* ============================================================
   tokens.css — Cobalt terminal (dark) design tokens
   Single source of truth for colour, type, radius, shadow, motion.
   Blue-family terminal theme, deliberately not green-on-black.

   Contrast is computed, not eyeballed. On --bg #0e1116: ink 15.55, ink-soft 12.64, muted 6.38,
   faint 4.79, bayside-text 5.51, cmd 10.90, ok 10.86, warn 11.05. On --surface #161a21: ink 14.34,
   ink-soft 11.66, muted 5.89, bayside-text 5.08, cmd 10.05; --faint 4.42 is AA-large only, so
   captions, never body text.

   Two-step accent: brand Bayside Blue #277CE0 is 4.54:1 on the canvas and 4.19:1 on a panel
   (white on it 4.16:1), so it fails AA as small text — --cobalt-text is the same hue one step
   lighter (5.51 / 5.08) for links and prompts. Buttons use --ink-dark on --cobalt.

   --line / --line-strong (1.36 / 1.65) are decorative dividers, not UI boundaries, so 1.4.11
   does not apply; real boundaries (focus rings, active borders) use --cobalt.
   ============================================================ */

:root {
  /* ---- Canvas ---- */
  --bg:            #0e1116;
  --surface:       #161a21;
  --surface-2:     #1b202a;   /* hover lift */
  --mist:          #232a35;   /* strongest lift */

  /* ---- Foreground ---- */
  --ink:           #e6e9ef;   /* 15.55:1 - body text */
  --ink-soft:      #cbd4e0;   /* 12.64:1 - secondary */
  --muted:         #8b97a8;   /* 6.38:1  - dim output, comments */
  --faint:         #758194;   /* 4.79 canvas / 4.42 panel - captions only, never body */

  /* ---- Bayside Blue accent ---- */
  --cobalt:        #277CE0;   /* fills, borders, motif, dots, hover */
  --cobalt-text:   #3d8ce8;   /* small accent TEXT - 5.51 / 5.08 */
  --cobalt-deep:   #1a56a0;   /* deep hover fill (ink on it: 5.99:1) */
  --cobalt-soft:   #14304e;   /* tinted panel (ink on it: 11.05:1) */

  /* ---- Terminal semantics ---- */
  --term-cmd:      #7fd1e0;   /* commands          10.90:1 */
  --term-ok:       #7bd88f;   /* status ● building  10.86:1 */
  --term-warn:     #e8c07d;   /* status ● exploring 11.05:1 */
  --term-comment:  var(--muted);

  /* ---- Field aliases: kept (deliberately unused) so rules in other files that still
     reference these names resolve to a dark panel pair rather than a cobalt poster. ---- */
  --field:          #12161c;
  --field-2:        #161b23;
  --on-cobalt:      #e6e9ef;
  --on-cobalt-soft: #b7c1cf;
  --on-cobalt-line: rgba(230, 233, 239, 0.16);

  /* ---- Texture ---- */
  --grain:     0.025;

  /* ---- Lines: decorative dividers, not UI boundaries (1.36 / 1.65) ---- */
  --line:          #262d38;
  --line-strong:   #313a47;

  /* ---- Radii ---- */
  --r-sm:   4px;
  --r-md:   6px;
  --r-lg:   8px;
  --r-xl:   10px;
  --r-pill: 999px;

  /* ---- Elevation: flat; separation comes from borders, not shadows ---- */
  --shadow-sm: none;
  --shadow-md: 0 0 0 1px var(--line-strong);
  --shadow-lg: 0 18px 50px rgba(0, 0, 0, 0.55);

  /* ---- Typography: two faces. --font-display is the hero name ONLY; everything else,
     headings included, is monospace. ---- */
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;  /* hero name ONLY */
  --font-mono:    ui-monospace, 'SF Mono', 'Cascadia Mono', 'JetBrains Mono', 'Fira Mono', Menlo, Consolas, monospace;
  --font-body:    var(--font-mono);
  --font-ui:      var(--font-mono);
  --font-accent:  var(--font-mono);
  --font-titling: var(--font-mono);

  /* ---- Type scale ---- */
  --fs-hero:       clamp(3rem, 9vw, 9rem);
  --fs-section:    clamp(1.45rem, 3.1vw, 2.3rem);
  --fs-numeral:    clamp(2rem, 6vw, 3.4rem);
  --track-display: -0.02em;

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft:  cubic-bezier(0.22, 1, 0.36, 1);
  --dur:        0.6s;

  /* ---- Layout. --term-bar-h / --term-status-h size the fixed terminal chrome;
     content offsets itself by them so nothing hides behind bar or statusline. ---- */
  --container:      1080px;
  --gutter:         clamp(1.25rem, 5vw, 3rem);
  --term-bar-h:     34px;
  --term-status-h:  30px;
  --nav-h:          58px;
}
