/* ═══════════════════════════════════════════════════════════════
   nAS World™ COLLISION DESIGN TOKENS
   Single source of truth for the entire habitat visual system.
   
   Dashboard (nAS.loop), React app, website, and browser ALL pull
   from these tokens. No more duplicate CSS variable definitions.
   
   PALETTE: 1950s atom-age brass COLLIDES with 5252 cyan crystal.
   Living material system: stone bezel, mycelium networks,
   quantum-dot photoluminescence, crystal gauge cores.
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* ─── VOID FOUNDATION ─── */
  --nas-void: #03060c;
  --nas-void-deep: #000308;
  --nas-bg: #070b14;

  /* ─── STONE (Architectural - permanent bezel) ─── */
  --nas-stone: #2a3038;
  --nas-stone-hi: #5a6270;
  --nas-stone-lo: #14181e;
  --nas-stone-texture: rgba(42, 48, 56, 0.65);
  --nas-stone-grain: linear-gradient(
    175deg,
    rgba(90, 98, 112, 0.12) 0%,
    rgba(42, 48, 56, 0.08) 30%,
    rgba(20, 24, 30, 0.15) 60%,
    rgba(42, 48, 56, 0.06) 100%
  );

  /* ─── CRYSTAL (Faceted volumes behind gauges) ─── */
  --nas-crystal: rgba(159, 247, 250, 0.12);
  --nas-crystal-edge: rgba(92, 225, 230, 0.28);
  --nas-crystal-glow: rgba(159, 247, 250, 0.35);
  --nas-crystal-core: rgba(92, 225, 230, 0.55);
  --nas-crystal-facet: linear-gradient(
    135deg,
    rgba(159, 247, 250, 0.08) 0%,
    rgba(92, 225, 230, 0.04) 25%,
    rgba(255, 138, 61, 0.03) 50%,
    rgba(92, 225, 230, 0.06) 75%,
    rgba(159, 247, 250, 0.1) 100%
  );

  /* ─── WOOD (Organic grounding) ─── */
  --nas-wood: #3d3428;
  --nas-wood-grain: rgba(180, 150, 100, 0.08);
  --nas-wood-glow: rgba(180, 150, 100, 0.15);

  /* ─── ROOT (Twisted, knotted - lower card edges) ─── */
  --nas-root: rgba(61, 52, 40, 0.55);
  --nas-root-fiber: rgba(140, 110, 70, 0.18);
  --nas-root-tip-cyan: rgba(92, 225, 230, 0.4);
  --nas-root-tip-orange: rgba(255, 138, 61, 0.35);

  /* ─── BRASS (1950s atom-age warmth) ─── */
  --nas-brass: #c9a227;
  --nas-brass-hi: #f0d78c;
  --nas-brass-lo: #8a7020;
  --nas-brass-glow: rgba(201, 162, 39, 0.35);

  /* ─── CYAN (5252 crystal consciousness) ─── */
  --nas-cyan: #5ce1e6;
  --nas-cyan-hot: #9ff7fa;
  --nas-cyan-dim: rgba(92, 225, 230, 0.18);
  --nas-cyan-glow: rgba(92, 225, 230, 0.5);

  /* ─── ORANGE (energy accent) ─── */
  --nas-orange: #ff8a3d;
  --nas-orange-hot: #ffb070;

  /* ─── TEXT ─── */
  --nas-ink: #f2f6fc;
  --nas-muted: #a8b6cc;

  /* ─── GLASS ─── */
  --nas-glass: rgba(12, 20, 32, 0.72);
  --nas-glass-fill: rgba(255, 255, 255, 0.06);

  /* ─── SEMANTIC ─── */
  --nas-good: #3dd68c;
  --nas-warn: #f0b429;
  --nas-bad: #f07178;

  /* ─── MYCELIUM (Living network borders) ─── */
  --nas-myc-primary: rgba(92, 225, 230, 0.45);
  --nas-myc-secondary: rgba(255, 138, 61, 0.35);
  --nas-myc-filament: rgba(92, 225, 230, 0.22);
  --nas-myc-node: rgba(159, 247, 250, 0.6);
  --nas-myc-pulse-speed: 5.5s;
  --nas-myc-branch-density: 0.6;

  /* ─── QUANTUM DOT (Photoluminescent emission) ─── */
  --nas-qd-cyan: rgba(159, 247, 250, 0.55);
  --nas-qd-orange: rgba(255, 138, 61, 0.25);
  --nas-qd-spark-speed: 1.1s;
  --nas-qd-glow-radius: 12px;
  --nas-qd-intensity: 0.7;

  /* ─── BIO-RESPONSIVE (Smart glass behavior) ─── */
  --nas-bio-haze: 0.06;
  --nas-bio-edge-glow: rgba(92, 225, 230, 0.15);
  --nas-bio-shift-speed: 2.2s;

  /* ─── TYPOGRAPHY ─── */
  --nas-font-ui: "Source Sans 3", "Space Grotesk", system-ui, sans-serif;
  --nas-font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;

  /* ─── BEZEL ─── */
  --nas-bezel: clamp(10px, 1.4vw, 18px);

  /* ─── TIMING (Coherent Drift) ─── */
  --nas-duration-materialize: 1000ms;
  --nas-duration-dissolve: 500ms;
  --nas-duration-pulse: 200ms;
  --nas-duration-shift: 1500ms;
  --nas-duration-drift: 3000ms;
  --nas-duration-fruit: 550ms;

  --nas-ease-recognition: cubic-bezier(0.23, 1, 0.32, 1);
  --nas-ease-release: cubic-bezier(0.55, 0, 0.1, 1);
  --nas-ease-breathe: cubic-bezier(0.37, 0, 0.63, 1);
  --nas-ease-fruit: cubic-bezier(0.2, 0.9, 0.2, 1);

  /* ─── LAYOUT ─── */
  --nas-radius-card: 1.15rem;
  --nas-radius-pill: 999px;

  /* ─── BACKWARD COMPATIBILITY (dashboard aliases) ─── */
  --void: var(--nas-void);
  --bg: var(--nas-bg);
  --panel: var(--nas-glass);
  --brass: var(--nas-brass);
  --brass-hi: var(--nas-brass-hi);
  --brass-lo: var(--nas-brass-lo);
  --cyan: var(--nas-cyan);
  --cyan-hot: var(--nas-cyan-hot);
  --cyan-dim: var(--nas-cyan-dim);
  --cyan-glow: var(--nas-cyan-glow);
  --gold: var(--nas-brass);
  --text: var(--nas-ink);
  --muted: var(--nas-muted);
  --good: var(--nas-good);
  --warn: var(--nas-warn);
  --bad: var(--nas-bad);
  --font-ui: var(--nas-font-ui);
  --font-mono: var(--nas-font-mono);
}