/* Smart Pacts design tokens — the COMPLETE token layer (A7 design system).
 * This file is the single source of truth for every visual primitive on the
 * site: color, type, spacing, radii, borders, shadows, z-layers, motion and
 * container widths. Components (site.css) and pages consume ONLY the semantic
 * tokens — change a value here and the whole site follows.
 * Consumers: import this file plus /fonts/fonts.css (public/fonts/).
 *
 * SINGLE-SCHEME DARK (founder decision 2026-07-12): the brand look is dark
 * ink layered with the violet accent — served to everyone regardless of
 * prefers-color-scheme. The light palette raws are retained (on-accent text,
 * print/OG uses, a possible future toggle) but no light scheme is emitted. */

:root {
  /* ── raw palette — always reference through the semantic tokens below ── */
  --sp-black: #0b0d10;         /* deepest — terminal / sunken islands */
  --sp-ink-deep: #101216;      /* page base */
  --sp-ink: #16181d;           /* cards / panels / chrome */
  --sp-ink-2: #1f232b;         /* raised rows, code, disclaimers */
  --sp-ink-3: #282d37;         /* borders on ink */
  --sp-paper: #faf9f6;
  --sp-paper-dim: #f0eee9;
  --sp-mist: #e3e1db;
  --sp-slate: #5b6472;
  --sp-slate-bright: #949ca9;  /* secondary text — 7.0:1 on ink */
  --sp-violet: #6d28d9;        /* accent (light contexts) — 6.75:1 on paper */
  --sp-violet-deep: #5b21b6;
  --sp-violet-bright: #a78bfa; /* THE accent — 6.53:1 on ink */
  --sp-violet-glow: #c4b5fd;   /* accent hover */
  --sp-teal: #0e7569;          /* legacy accent, retained for reference */
  --sp-teal-bright: #2bb3a0;
  --sp-error: #b3261e;
  --sp-error-bright: #e5484d;

  /* ── semantic color — dark, layered ink ladder ── */
  --color-text: var(--sp-paper);
  --color-text-secondary: var(--sp-slate-bright);
  --color-page: var(--sp-ink-deep);           /* body base under the washes */
  --color-surface: var(--sp-ink);             /* cards, panels, chrome */
  --color-surface-raised: var(--sp-ink-2);    /* kv rows, code, disclaimers */
  --color-surface-sunken: var(--sp-black);    /* terminal/code islands */
  --color-on-sunken: var(--sp-paper);
  --color-on-sunken-dim: var(--sp-slate-bright);
  --color-border: var(--sp-ink-3);
  --color-border-strong: var(--sp-slate);
  --color-accent: var(--sp-violet-bright);
  --color-accent-hover: var(--sp-violet-glow);
  --color-accent-soft: color-mix(in srgb, var(--sp-violet-bright) 12%, transparent);
  --color-on-accent: var(--sp-ink);
  --color-error: var(--sp-error-bright);
  --color-focus: var(--sp-violet-bright);

  /* page background — the AURORA field (founder-picked, 2026-07-12):
     three violet aurora washes over deep ink, with a film-grain noise layer
     on top to kill gradient banding. All one token; body consumes it. */
  /* NOTE: these decorative SVGs are same-origin FILES (public/assets/), not
     data: URIs — the CSP's img-src allows 'self' but not data:. */
  --bg-noise: url('/assets/noise.svg');
  --bg-page:
    var(--bg-noise),
    radial-gradient(64rem 38rem at 80% -14rem,
      color-mix(in srgb, var(--sp-violet) 42%, transparent), transparent 60%),
    radial-gradient(46rem 32rem at -10rem 16rem,
      color-mix(in srgb, #4c1d95 38%, transparent), transparent 58%),
    radial-gradient(50rem 34rem at 55% 120rem,
      color-mix(in srgb, var(--sp-violet-bright) 10%, transparent), transparent 60%),
    var(--color-page);

  /* blueprint detail ink (corner ticks, annotations) */
  --tick-ink: color-mix(in srgb, var(--sp-violet-bright) 55%, transparent);
  /* single strand divider (braid language at rest) — sine strand + node */
  --strand-rule: url('/assets/strand.svg');

  /* ── typography ── */
  --font-sans: "IBM Plex Sans", -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600; /* heaviest weight in the kit — no 700 */

  /* type scale (px equivalents: 13 / 16 / 20 / 25 / 31 / 39 / 49) */
  --text-sm: 0.8125rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5625rem;
  --text-2xl: 1.9375rem;
  --text-3xl: 2.4375rem;
  --text-4xl: 3.0625rem;       /* display — hero only */
  --leading-body: 1.6;
  --leading-heading: 1.25;
  --leading-tight: 1.1;        /* display headlines */
  --tracking-wide: 0.015em;    /* wordmark-style letter-space for labels/nav brand */
  --tracking-caps: 0.08em;     /* uppercase eyebrows / badges */

  /* ── spacing scale ── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-9: 4rem;
  --space-10: 5rem;
  --space-11: 6rem;

  /* ── radii ── */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-pill: 999px;

  /* ── borders ── */
  --border-w: 1px;
  --border-w-accent: 3px;      /* disclaimer / log left rails */

  /* ── shadows (lift on hover pairs with translateY) ── */
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.4);
  --shadow-md: 0 2px 8px rgb(0 0 0 / 0.45);
  --shadow-lg: 0 10px 28px rgb(0 0 0 / 0.5);
  --shadow-glow: 0 0 32px color-mix(in srgb, var(--sp-violet-bright) 14%, transparent);

  /* ── z-layers ── */
  --z-banner: 30;
  --z-dock: 35;   /* docked activity log — above the banner, below nothing else */
  --z-nav: 20;
  --z-menu: 25;

  /* ── motion ── */
  --dur-fast: 150ms;
  --dur-base: 250ms;
  --dur-slow: 450ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.45, 0, 0.25, 1);

  /* ── container widths ── */
  --container-sm: 46rem;       /* reading pages (event, guides, legal) */
  --container-md: 52rem;       /* app pages (gallery, portal) */
  --container-lg: 64rem;       /* homepage */
  --gutter: 1.25rem;
}

/* No prefers-color-scheme block on purpose: single-scheme dark (see header).
 * If a light scheme ever returns, it returns HERE as a root override —
 * never in site.css or a page. */