/* ============================================================
   TOKENS — colors, type, spacing primitives.
   ============================================================ */
/* ── TOKENS ──────────────────────────────────────── */
:root{
  /* surfaces */
  --bg-deep:#05070f;
  --bg-dim:#0a0d1a;
  --surf-1:rgba(10,13,26,.72);
  --surf-2:rgba(14,18,32,.86);
  --surf-3:rgba(18,22,38,.94);
  /* borders / hairlines */
  --line-1:rgba(255,255,255,.04);
  --line-2:rgba(255,255,255,.07);
  --line-3:rgba(255,255,255,.11);
  /* text */
  --t-0:#f5f7ff;        /* primary */
  --t-1:#d0d6e8;        /* secondary */
  --t-2:#8891a8;        /* tertiary */
  --t-3:#5a6278;        /* muted   */
  --t-4:#373d51;        /* whisper */
  /* brand accent (UI chrome — distinct from pattern colors) */
  --accent:#818cf8;
  --accent-soft:rgba(129,140,248,.14);
  --accent-line:rgba(129,140,248,.28);
  --accent-glow:rgba(129,140,248,.45);
  /* pattern palette (semantic — do not reuse for chrome) */
  --pat-ow:#6366f1;     /* orchestrator-worker */
  --pat-pipe:#22d3ee;   /* pipeline */
  --pat-fan:#f59e0b;    /* fan-out */
  --pat-eval:#4ade80;   /* evaluator */
  --pat-hier:#a78bfa;   /* hierarchical */
  /* status */
  --ok:#4ade80;
  --warn:#f59e0b;
  --err:#f87171;
  /* radii */
  --r-xs:5px; --r-sm:7px; --r-md:10px; --r-lg:14px; --r-xl:18px;
  /* spacing scale */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-7:32px;
  /* type */
  --f-sans:'Inter','SF Pro Text',-apple-system,system-ui,sans-serif;
  --f-mono:'Inter','SF Pro Text',-apple-system,system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  background:var(--bg-deep);
  color:var(--t-1);
  font-family:var(--f-sans);
  font-size: 14.5px;
  line-height:1.45;
  height:100vh;
  overflow:hidden;
  user-select:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:'ss01','cv11';
}
/* utility: monospaced numerics for live data */
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums;}
#c{display:block;position:fixed;top:0;left:0;cursor:grab;z-index:1;}
#c:active{cursor:grabbing;}
