/* ─────────────────────────────────────────────────────────────
   LOCKED_STATIC_TOKENS.css
   NURiQ Liquid Glass · Phase 1+2 · Locked 2026-06-23

   Direction B2 · Modern Premium
   Cabinet Grotesk (display) + Geist (body) + Geist Mono (mono)
   Storyboard rendered Cabinet Grotesk as Outfit fallback; production
   uses Outfit + Inter + system stack until Cabinet Grotesk is licensed.

   This file is consumed by globals.css as the authoritative
   design-token source for Phase 2 build. Do not edit by hand. To
   change the locked design, rerun the storyboard sprint.

   Approved by founder Tim Pauldon via storyboard/static.html PAUSE 1.
   ───────────────────────────────────────────────────────────── */

:root {
  /* ───────────────────────────────────────────────
     Typography
     ─────────────────────────────────────────────── */
  --font-display: 'Cabinet Grotesk', 'Outfit', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-body:    'Geist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono:    'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Display weights — Outfit/Cabinet Grotesk Light at 300 */
  --font-display-weight: 300;
  --font-display-weight-medium: 500;
  --font-body-weight: 400;
  --font-body-weight-medium: 500;
  --font-body-weight-bold: 600;

  /* ───────────────────────────────────────────────
     Header tracking
     ─────────────────────────────────────────────── */
  --header-tracking: 0.15em;
  --label-tracking: 0.18em;
  --eyebrow-tracking: 0.24em;

  /* ───────────────────────────────────────────────
     Liquid Glass · blur tiers (Apple-fidelity)
     ─────────────────────────────────────────────── */
  --lg-blur-foreground: 12px;
  --lg-blur-mid:        20px;
  --lg-blur-background: 32px;
  --lg-blur-modal:      48px;
  --lg-blur-default:    20px;

  /* Saturation boost — Apple macOS Tahoe value */
  --lg-saturate: 180%;

  /* Adaptive surface opacity (use with color-mix on var(--surface-base)) */
  --lg-glass-opacity: 65%;

  /* Specular highlight overlay applied via ::before pseudo */
  --lg-highlight: linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0%, transparent 50%);

  /* ───────────────────────────────────────────────
     NURiQ gold accent · edge-plus-glow treatment
     ─────────────────────────────────────────────── */
  --nuriq-gold:              #F6D55C;
  --nuriq-gold-deep:         #C8A630;
  --nuriq-gold-edge-opacity: 0.18;
  --nuriq-gold-treatment:    edge-plus-glow;

  /* Box-shadow recipes for the four gold-treatment modes.
     Phase 2 components pick one of these on .lg-surface variants. */
  --shadow-gold-edge:
    inset 0 0 0 1px rgba(246, 213, 92, 0.18);

  --shadow-gold-edge-glow:
    inset 0 0 0 1px rgba(246, 213, 92, 0.18),
    0 0 24px rgba(246, 213, 92, 0.09);

  --shadow-gold-pulse-base:
    inset 0 0 0 1px rgba(246, 213, 92, 0.18),
    0 0 16px rgba(246, 213, 92, 0.05);
  --shadow-gold-pulse-peak:
    inset 0 0 0 1px rgba(246, 213, 92, 0.25),
    0 0 32px rgba(246, 213, 92, 0.14);

  /* ───────────────────────────────────────────────
     Surface palette · charcoal base on NURiQ canvas
     ─────────────────────────────────────────────── */
  --surface-canvas:  #0A0807;
  --surface-base:    #1A1A1A;
  --surface-raised:  #1C1814;
  --surface-recess:  #14110E;

  /* Brand-canon ink colors (NURIQ_BRAND_STANDARD §1) */
  --ink-primary:    #F0EAE0;
  --ink-secondary:  #B8AFA0;
  --ink-tertiary:   #7D746A;
  --ink-disabled:   #4A4138;

  /* Borders */
  --border-subtle:    rgba(240, 234, 224, 0.05);
  --border-default:   rgba(240, 234, 224, 0.10);
  --border-emphasis:  rgba(240, 234, 224, 0.18);

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

  /* ───────────────────────────────────────────────
     Status colors (kept from brand canon)
     ─────────────────────────────────────────────── */
  --status-success:    #10B981;
  --status-warning:    #F6D55C;
  --status-regulatory: #8E342B;
}

/* ─────────────────────────────────────────────────────────────
   Liquid Glass primitive · canonical implementation
   Phase 2 components extend this via .lg-surface plus optional
   .lg-surface--gold-edge / .lg-surface--gold-edge-glow / .lg-surface--pulse
   ───────────────────────────────────────────────────────────── */
.lg-surface {
  position: relative;
  background: color-mix(in srgb, var(--surface-base) var(--lg-glass-opacity), transparent);
  backdrop-filter: blur(var(--lg-blur-default)) saturate(var(--lg-saturate));
  -webkit-backdrop-filter: blur(var(--lg-blur-default)) saturate(var(--lg-saturate));
  border: 1px solid var(--border-default);
  border-radius: var(--radius-default);
  overflow: hidden;
}
.lg-surface::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--lg-highlight);
  pointer-events: none;
  z-index: 1;
}
.lg-surface > * { position: relative; z-index: 2; }

.lg-surface--foreground { backdrop-filter: blur(var(--lg-blur-foreground)) saturate(var(--lg-saturate)); }
.lg-surface--background { backdrop-filter: blur(var(--lg-blur-background)) saturate(var(--lg-saturate)); }
.lg-surface--modal      { backdrop-filter: blur(var(--lg-blur-modal))      saturate(var(--lg-saturate)); }

.lg-surface--gold-edge      { box-shadow: var(--shadow-gold-edge); }
.lg-surface--gold-edge-glow { box-shadow: var(--shadow-gold-edge-glow); }
.lg-surface--pulse          { animation: nuriq-gold-pulse 1500ms ease-in-out infinite; }

@keyframes nuriq-gold-pulse {
  0%, 100% { box-shadow: var(--shadow-gold-pulse-base); }
  50%      { box-shadow: var(--shadow-gold-pulse-peak); }
}