/**
 * SANCTUARY DESIGN SYSTEM — TOKENS (OBSIDIAN SERENITY)
 * Paradigm: Quiet Luxury & Obsidian Serenity
 * Logic-frozen compatibility with all legacy --bg-*, --gold, --emerald, --amber, --ruby tokens.
 */

:root {
  /* ==========================================================================
     1. SURFACES (Obsidian Palette)
     ========================================================================== */
  --obs-0: #07080b;            /* Deep obsidian canvas background */
  --obs-1: #0d0f14;            /* Raised obsidian surface */
  --obs-2: #12151c;            /* Card / container surface */
  --obs-3: #191d26;            /* Interactive / hover surface */
  --obs-4: #222733;            /* Elevated / active highlight surface */
  
  --glass: rgba(18, 21, 28, 0.68);          /* Translucent frosted glass */
  --glass-card: rgba(18, 21, 28, 0.78);     /* Frosted card backdrop */
  --glass-modal: rgba(13, 15, 20, 0.88);    /* Modal/sheet backdrop */
  
  --hairline: rgba(232, 213, 181, 0.10);        /* Ultra-subtle champagne hairline */
  --hairline-strong: rgba(232, 213, 181, 0.24); /* Prominent champagne border */
  --hairline-subtle: rgba(255, 255, 255, 0.05); /* Ghost divider */

  /* ==========================================================================
     2. INK & TYPOGRAPHIC CONTRAST
     ========================================================================== */
  --ink-1: #f4efe6;            /* Primary warm ivory text (high contrast) */
  --ink-2: #b9b2a6;            /* Secondary muted text */
  --ink-3: #7d776d;            /* Tertiary faint labels / metadata */
  --ink-4: #55514a;            /* Disabled / lowest priority ink */

  /* ==========================================================================
     3. SEMANTIC ACCENTS & CLINICAL GEARS
     ========================================================================== */
  --champagne: #e8d5b5;        /* Sovereign heraldic gold */
  --champagne-deep: #c9ae82;   /* Deep aged champagne */
  --sage: #8fb8a0;             /* Gear 1 (Standard) / Green radar */
  --honey: #e0b36a;            /* Gear 2 (Low-Draw) / Yellow radar */
  --lavender: #9d8ec4;         /* Gear 2.5 (Luteal Sanctuary Shield) */
  --candle: #d4af37;           /* Gear 3 (Hibernate Shield) / Warm gold */
  --ember: #ff9a4d;            /* Circadian night & sensory overload */
  --crimson: #e0566b;          /* STRICTLY RESERVED FOR 5 SAFETY FLAGS & DELETES */

  /* ==========================================================================
     4. TYPOGRAPHY & DENSITY SCALE (S13 READY)
     ========================================================================== */
  --font-scale: 1;             /* Root multiplier for Bedside mode (1.0, 1.12, 1.25) */
  
  --font-display: 'Fraunces', 'Cinzel', 'Cormorant Garamond', Georgia, serif;
  --font-ui: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  --fs-xs: calc(11px * var(--font-scale));
  --fs-sm: calc(13px * var(--font-scale));
  --fs-md: calc(15px * var(--font-scale));
  --fs-lg: calc(18px * var(--font-scale));
  --fs-xl: calc(22px * var(--font-scale));
  --fs-2xl: calc(28px * var(--font-scale));
  --fs-3xl: calc(36px * var(--font-scale));

  /* ==========================================================================
     5. SPACING SYSTEM (4px baseline)
     ========================================================================== */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 40px;
  --sp-9: 48px;
  --sp-10: 64px;

  /* ==========================================================================
     6. RADII & ELEVATIONS
     ========================================================================== */
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-pill: 9999px;

  --elev-1: 0 2px 8px rgba(0, 0, 0, 0.35);
  --elev-2: 0 8px 24px rgba(0, 0, 0, 0.45);
  --elev-3: 0 16px 48px rgba(0, 0, 0, 0.60);
  --shadow-glow: 0 0 25px rgba(232, 213, 181, 0.12);

  /* ==========================================================================
     7. MOTION & INTERACTION
     ========================================================================== */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  
  --dur-1: 150ms;
  --dur-2: 250ms;
  --dur-3: 400ms;
  --dur-4: 600ms;

  --tap-min: 44px;             /* Minimum touch target size */

  /* ==========================================================================
     8. LEGACY VARIABLE ALIASES (100% Backward Compatibility)
     ========================================================================== */
  --bg-base: var(--obs-0);
  --bg-card: var(--glass);
  --bg-card-hover: var(--obs-3);
  --bg-surface: var(--obs-2);
  --border: var(--hairline);
  --border-subtle: var(--hairline-subtle);
  --border-gold: var(--hairline-strong);
  --gold: var(--champagne);
  --gold-light: var(--ink-1);
  --gold-dim: rgba(232, 213, 181, 0.12);
  --emerald: var(--sage);
  --emerald-dim: rgba(143, 184, 160, 0.15);
  --amber: var(--honey);
  --amber-dim: rgba(224, 179, 106, 0.15);
  --ruby: var(--crimson);
  --ruby-dim: rgba(224, 86, 107, 0.15);
  --text: var(--ink-1);
  --text-muted: var(--ink-2);
  --text-faint: var(--ink-3);
  --radius-sm: var(--r-sm);
  --radius-md: var(--r-md);
  --radius-lg: var(--r-lg);
}

/* SPS / Sensory Safe Motion Reduction */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 0ms;
    --dur-2: 0ms;
    --dur-3: 0ms;
    --dur-4: 0ms;
  }
}