/* ================================================================
   SHARED DESIGN SYSTEM — CSS TOKENS
   Cross-subsystem primitives only. Each token here is consumed by
   2+ of the three independent frontend subsystems (SuprBad UX,
   SBNav, SB Buttons) today — see docs/FRONTEND-ARCHITECTURE.md for
   the Admission Test and Ownership Rule that govern this file.

   Adding a token here requires a real second consumer to already
   exist, not a hypothetical one — log additions in
   docs/FRONTEND-CHANGELOG.md per the Governance section.

   Per-token purpose + current consumers: docs/TOKENS.md (this plugin).
   Home since ADR-002 (2026-07-13): plugins/suprbad-frontend-foundation/
   — previously greenshift-child/design-system/ (ADR-001, Revision 1).
   ================================================================ */

:root {
  --sb-color-bg: #edeae4; /* warm off-white page / header background */
  --sb-color-border: #d4d0ca; /* subtle dividers on light */
  --sb-color-accent: #c8102e; /* brand accent (SuprBad red) — promoted from SBNav's
       nav-tokens.css 2026-07-17 (owner decision): consumers are SuprBad UX and
       SBNav's Navigation Feedback System (--sb-color-nav-commit derives from it).
       This is THE brand accent — when the visual identity is finalized it becomes
       the single source of truth for accent colour across all frontend plugins. */
  --sb-color-ink: #1a1a1a; /* near-black primary text — admitted 2026-07-19 (ADR-003 F1):
       consumers SBNav (--sb-color-text, --sb-color-connector) + SuprBad UX
       (accent fallback context); the platform's de-facto text colour, now owned here. */
  --sb-color-text-muted: #7a7772; /* secondary/muted text — admitted 2026-07-19 (ADR-003 F1):
       consumers SBNav (muted + muted-on-dark labels) + SuprBad UX (email-field
       pencil icon stroke — SVG data-URI, documented manual-sync consumer). */
  --sb-font-primary: 'Montserrat', sans-serif; /* Black 900 — wordmark, nav, headings */

  /* ── Radius scale (ADR-003 F2, 2026-07-19) ──────────────────────
     Shared design language; consumers apply, this file only defines.
     2px focus-ring radii remain consumer literals by decision (micro-
     chrome, below the scale). */
  --sb-radius-sm: 4px; /* inputs, small chrome (nav search forms) */
  --sb-radius-md: 8px; /* cards, panels, notices — the workhorse (SB Surface, UX cards, nav badge) */
  --sb-radius-lg: 14px; /* large panels (desktop menu dropdown) */
  --sb-radius-pill: 100px; /* button pills (SB Buttons) */
  --sb-radius-frame: 14px; /* rounded viewport corners (site frame, ADR-003 F7) */

  /* ── SB Surface (ADR-003 F2, 2026-07-19) ────────────────────────
     The canonical elevated-card treatment (docs/FRONTEND-ARCHITECTURE.md
     § SB Surface): --sb-color-surface + 1px --sb-color-border +
     --sb-radius-md + --sb-shadow-surface. Derived from the approved
     retry-page payment-panel reference — restrained paper elevation,
     not material depth. */
  --sb-color-surface: #fff; /* near-white card surface, lifts off --sb-color-bg */
  --sb-shadow-surface: 0 1px 2px rgb(26 26 26 / 5%), 0 4px 14px rgb(26 26 26 / 6%);
}