/* ===========================================================
   COOPEN · Design Tokens
   Single source of truth for the HUD aesthetic.
   Modify values here to re-skin the entire UI.
=========================================================== */
:root {
  /* Surface */
  --c-bg:           #030712;
  --c-surface:      rgba(3, 7, 18, 0.78);
  --c-surface-2:    rgba(2, 12, 28, 0.72);
  --c-grid:         #0b1f4a;

  /* Brand */
  --c-cyan:         #00e5ff;
  --c-cyan-soft:    #7dd3fc;
  --c-blue:         #0ea5e9;
  --c-amber:        #fbbf24;
  --c-magenta:      #ff4dd2;
  --c-violet:       #a78bfa;

  /* Text */
  --c-white:        #e2e8f0;
  --c-gray:         #64748b;
  --c-gray-2:       #cbd5e1;
  --c-blue-text:    #38bdf8;

  /* Borders / glow */
  --b-cyan:         1px solid var(--c-cyan);
  --b-cyan-soft:    1px solid rgba(0, 229, 255, .32);
  --glow-cyan:      0 0 14px rgba(0, 229, 255, .55);
  --glow-cyan-soft: 0 0 8px  rgba(0, 229, 255, .35);
  --glow-amber:     0 0 10px rgba(251, 191, 36, .48);

  /* Typography */
  --ff-mono:        'Share Tech Mono', ui-monospace, monospace;
  --fs-xs:          clamp(8px, .64vw, 10.4px);
  --fs-sm:          clamp(9px, .73vw, 11.8px);
  --fs-md:          clamp(10px, .85vw, 13px);
  --fs-lg:          clamp(11px, .95vw, 14px);
  --fs-xl:          clamp(13px, 1.1vw, 16px);
  --fs-2xl:         clamp(22px, 2.05vw, 33px);
  --fs-3xl:         clamp(28px, 3.3vw, 56px);
  --ls-tight:       .03em;
  --ls-norm:        .06em;
  --ls-wide:        .12em;

  /* Layout */
  --pad-1:          .6vh .8vw;
  --pad-2:          1vh 1.2vw;
  --gap-1:          .55vw;
  --gap-2:          1vh;
  --radius-pill:    999px;
  --radius-md:      4px;

  /* Status */
  --c-status-ok:     #22c55e;
  --c-status-warn:   #fbbf24;
  --c-status-err:    #ef4444;
  --c-status-idle:   #64748b;
  --c-status-listen: #00e5ff;
  --c-status-think:  #a78bfa;
  --c-status-speak:  #34d399;
}