:root {
  /* Backgrounds (5 levels: darkest -> lightest) */
  --bg: #0C0F14;   --bg2: #141820;  --bg3: #1A1F2B;
  --bg4: #222838;   --bg5: #2A3144;

  /* Borders (3 levels) */
  --brd: rgba(255,255,255,.04);  --brd2: rgba(255,255,255,.07);  --brd3: rgba(255,255,255,.12);

  /* Text (4 levels) */
  --t1: #EDEAE4;  --t2: #8B90A0;  --t3: #4D5264;  --t4: #363A4A;

  /* Brand accent (emove orange) */
  --accent: #f97316;  --accent2: #ea580c;
  --a-soft: rgba(249,115,22,.06);  --a-med: rgba(249,115,22,.14);  --a-str: rgba(249,115,22,.24);

  /* Secondary */
  --secondary: #388FCE;
  --s-soft: rgba(56,143,206,.08);  --s-med: rgba(56,143,206,.14);

  /* Status */
  --ok: #34D399;  --warn: #FBBF24;  --err: #F87171;  --info: #60A5FA;

  /* Typography */
  --font: 'Inter', system-ui, sans-serif;
  --mono: 'JetBrains Mono', monospace;

  /* Border radius */
  --r1: 8px;  --r2: 12px;  --r3: 16px;

  /* Easing & transitions */
  --ease: cubic-bezier(.22,1,.36,1);
  --ease-apple: cubic-bezier(.4,0,.2,1);
  --t-fast: .15s var(--ease-apple);
  --t-med: .25s var(--ease-apple);
  --t-smooth: .4s var(--ease);
}

[data-theme="light"] {
  --bg: #fafafa;  --bg2: #FFFFFF;  --bg3: #F4F4F5;
  --bg4: #E4E4E7;  --bg5: #D4D4D8;
  --brd: rgba(0,0,0,.04);  --brd2: rgba(0,0,0,.07);  --brd3: rgba(0,0,0,.12);
  --t1: #18181b;  --t2: #52525b;  --t3: #a1a1aa;  --t4: #d4d4d8;
  --a-soft: rgba(249,115,22,.06);  --a-med: rgba(249,115,22,.10);  --a-str: rgba(249,115,22,.18);
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0 }
html { font-size: 17.6px; -webkit-font-smoothing: antialiased }
body { font-family: var(--font); background: var(--bg); color: var(--t1) }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px }
::-webkit-scrollbar-track { background: transparent }
::-webkit-scrollbar-thumb { background: var(--t3); border-radius: 3px }
::-webkit-scrollbar-thumb:hover { background: var(--t2) }

/* Tabular nums */
.tabular-nums { font-variant-numeric: tabular-nums }