/* ============================================================
   tokens.css — design tokens (single source of truth)
   Color · type · layout · spacing · radius · motion
   Square, minimalist aesthetic: radius is 0 by design.
   ============================================================ */
:root{
  /* ── Color ── */
  --ink:#111;
  --ink-70:#333;
  --steel:#666;
  --mute:#888;
  --line:#e2e2e2;
  --line-strong:#111;
  --bg:#fff;
  --bg-soft:#fafafa;
  --accent:#0f6e56;
  --accent-soft:#e1f5ee;
  --accent-line:#9fe1cb;
  --accent-ink:#0b5642;          /* darker accent for hover/links on light */
  --on-dark:#fff;
  --on-dark-mute:#bbb;
  --on-dark-faint:#999;
  --dark-line:rgba(255,255,255,.2);

  /* ── Typography ── */
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono:"SF Mono",ui-monospace,Menlo,Consolas,monospace;
  --fs-base:16px;
  --lh-base:1.6;

  /* ── Layout ── */
  --maxw:1080px;
  --gutter:32px;                 /* horizontal page padding */
  --section-y:80px;              /* vertical section rhythm */

  /* ── Spacing scale ── */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:40px;
  --space-9:48px;
  --space-10:64px;
  --space-12:80px;

  /* ── Radius (square by design) ── */
  --radius:0;
  --radius-pill:0;

  /* ── Borders & motion ── */
  --border:1px solid var(--line);
  --border-strong:1px solid var(--line-strong);
  --t-fast:.15s;
  --t-med:.3s;
  --t-slow:.5s;

  /* ── Elevation layers ── */
  --z-nav:100;
  --z-overlay:99;
}