/* ============================================================================
   Siphrix — Design Tokens  ·  "Neural Firewall" theme
   Single source of truth shared by the landing, docs hub, and console shell.
   Re-skin existing dashboards by including this file + base.css.
   ============================================================================ */

:root {
  color-scheme: dark;

  /* --- Brand --------------------------------------------------------------- */
  --teal:        #2bd4bd;   /* primary brand / ALLOW */
  --teal-bright: #5af2dd;
  --teal-deep:   #06231f;   /* text on teal */
  --cyan:        #38e1ff;
  --violet:      #8b7bff;

  /* --- Semantic verdict colors -------------------------------------------- */
  --allow:   #2bd4bd;
  --block:   #e0556b;
  --abort:   #f6a740;
  --review:  #8b7bff;
  --allow-glow: rgba(43, 212, 189, .45);
  --block-glow: rgba(224, 85, 107, .45);
  --abort-glow: rgba(246, 167, 64, .40);

  /* --- Surfaces (deep space → glass) -------------------------------------- */
  --bg-0:    #060a10;   /* page void */
  --bg-1:    #0b1119;   /* base surface */
  --bg-2:    #0f1620;   /* raised */
  --bg-3:    #141d2a;   /* cards */
  --bg-4:    #1a2433;   /* hover / inputs */
  --glass:   rgba(20, 29, 42, .55);
  --glass-2: rgba(15, 22, 32, .72);

  /* --- Lines & borders ----------------------------------------------------- */
  --line:      rgba(255, 255, 255, .08);
  --line-2:    rgba(255, 255, 255, .14);
  --line-teal: rgba(43, 212, 189, .35);

  /* --- Text ---------------------------------------------------------------- */
  --ink:     #eaf1fb;   /* primary */
  --ink-2:   #aeb9cc;   /* secondary */
  --ink-3:   #6b7689;   /* muted / captions */
  --ink-on-teal: #06231f;

  /* --- Glow / FX ----------------------------------------------------------- */
  --glow-teal:   0 0 0 1px rgba(43,212,189,.25), 0 0 32px -4px rgba(43,212,189,.45);
  --glow-soft:   0 0 40px -8px rgba(43,212,189,.30);
  --shadow-1:    0 2px 8px rgba(0,0,0,.35);
  --shadow-2:    0 12px 40px -12px rgba(0,0,0,.65);
  --shadow-card: 0 1px 0 rgba(255,255,255,.04) inset, 0 18px 50px -24px rgba(0,0,0,.8);

  /* --- Gradients ----------------------------------------------------------- */
  --grad-teal:   linear-gradient(135deg, var(--teal) 0%, var(--cyan) 100%);
  --grad-ink:    linear-gradient(180deg, #eaf1fb 0%, #9fb0c8 100%);
  --grad-aurora: radial-gradient(900px 480px at 70% -10%, rgba(43,212,189,.18), transparent 60%),
                 radial-gradient(700px 420px at 12% 8%, rgba(139,123,255,.14), transparent 55%);
  --grad-line:   linear-gradient(90deg, transparent, var(--line-teal), transparent);

  /* --- Typography ---------------------------------------------------------- */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", ui-monospace, "Cascadia Code",
               Consolas, "Liberation Mono", monospace;
  --fs-hero:   clamp(2.6rem, 6vw, 5.2rem);
  --fs-h1:     clamp(2rem, 4vw, 3.2rem);
  --fs-h2:     clamp(1.5rem, 2.6vw, 2.2rem);
  --fs-h3:     1.25rem;
  --fs-body:   1.0625rem;
  --fs-sm:     0.875rem;
  --fs-xs:     0.75rem;
  --lh:        1.65;
  --tracking:  -0.011em;

  /* --- Layout -------------------------------------------------------------- */
  --maxw:      1200px;
  --maxw-prose: 760px;
  --gut:       clamp(1rem, 4vw, 2.5rem);
  --radius:    18px;
  --radius-sm: 12px;
  --radius-lg: 26px;
  --radius-pill: 999px;

  /* --- Motion -------------------------------------------------------------- */
  --ease:      cubic-bezier(.22, .61, .36, 1);
  --ease-out:  cubic-bezier(.16, 1, .3, 1);
  --spring:    cubic-bezier(.34, 1.56, .64, 1);
  --t-fast:    .18s;
  --t:         .32s;
  --t-slow:    .6s;

  --z-bg: 0;
  --z-content: 10;
  --z-nav: 100;
  --z-modal: 1000;
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: .01ms; --t: .01ms; --t-slow: .01ms; }
}
