/* ── CSS Variables ────────────────────────────────────────────────────── */
:root {
  --bg:           #F7F6F3;
  --surface:      #FFFFFF;
  --surface-2:    #F2F1EE;
  --border:       #E4E3DF;
  --border-strong:#CCCAC5;

  --accent:       #2563EB;
  --accent-dark:  #1D4ED8;
  --accent-light: #EFF6FF;
  --accent-border:#BFDBFE;

  --danger:       #DC2626;
  --danger-light: #FEF2F2;
  --danger-border:#FECACA;
  --success:      #16A34A;
  --success-light:#F0FDF4;
  --success-border:#BBF7D0;
  --amber:        #D97706;
  --amber-light:  #FFFBEB;

  --text:         #111827;
  --text-muted:   #6B7280;
  --text-subtle:  #9CA3AF;

  --radius:       6px;
  --radius-lg:    12px;
  --shadow-sm:    0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04);
  --shadow:       0 4px 16px rgba(0,0,0,.09), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg:    0 16px 48px rgba(0,0,0,.14), 0 4px 16px rgba(0,0,0,.06);

  --header-h:     64px;
  --sidebar-w:    380px;
  --drawer-w:     520px;
  --transition:   .18s cubic-bezier(.4,0,.2,1);
}

/* Dark mode */
html[data-theme="dark"] {
  --bg:           #141414;
  --surface:      #1E1E1E;
  --surface-2:    #181818;
  --border:       #2C2C2C;
  --border-strong:#3A3A3A;

  --accent:       #3B82F6;
  --accent-dark:  #2563EB;
  --accent-light: rgba(59,130,246,.12);
  --accent-border:rgba(59,130,246,.3);

  --danger:       #F87171;
  --danger-light: rgba(248,113,113,.1);
  --danger-border:rgba(248,113,113,.3);
  --success:      #4ADE80;
  --success-light:rgba(74,222,128,.1);
  --success-border:rgba(74,222,128,.3);
  --amber:        #FBBF24;
  --amber-light:  rgba(251,191,36,.1);

  --text:         #E8E6E3;
  --text-muted:   #8A8885;
  --text-subtle:  #555552;

  --shadow-sm:    0 1px 3px rgba(0,0,0,.3);
  --shadow:       0 4px 16px rgba(0,0,0,.4);
  --shadow-lg:    0 16px 48px rgba(0,0,0,.5);
}

/* ── Reset ────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  height: 100%;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

a { color: var(--accent); text-underline-offset: 2px; }

/* ── Scrollbars ───────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-subtle); }