/* ── Design Tokens ───────────────────────────────────────────────────────── */
:root {
  /* Backgrounds */
  --bg:            #FAFBFC;
  --surface:       #FFFFFF;
  --surface-muted: #F4F5F7;

  /* Borders */
  --border:        #E6E8EB;
  --border-strong: #D5D9DE;

  /* Text */
  --text:           #16191D;
  --text-secondary: #6B7280;
  --text-muted:     #9AA1AB;

  /* Accent – blue */
  --accent:       #2F6FED;
  --accent-hover: #2257C7;
  --accent-soft:  #E8F0FE;

  /* Status: neutral */
  --status-neutral-bg: #F4F5F7;
  --status-neutral-fg: #4B5563;

  /* Status: info / blue */
  --status-info-bg: #EFF6FF;
  --status-info-fg: #1D4ED8;

  /* Status: progress / amber */
  --status-progress-bg: #FEF3E2;
  --status-progress-fg: #B7791F;

  /* Status: success / green */
  --status-success-bg: #E7F4EC;
  --status-success-fg: #1E7E45;

  /* Status: danger / red */
  --status-danger-bg: #FBEAE8;
  --status-danger-fg: #C0362C;

  /* Status: purple / released */
  --status-purple-bg: #F3F0FF;
  --status-purple-fg: #6D28D9;

  /* Border radius */
  --radius-sm: 6px;
  --radius:    8px;
  --radius-lg: 12px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(16,24,40,.06);
  --shadow:    0 4px 12px rgba(16,24,40,.08);

  /* Spacing */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10:40px;

  /* Font sizes */
  --fs-caption:  12px;
  --fs-body-sm:  13px;
  --fs-body:     14px;
  --fs-subhead:  16px;
  --fs-h3:       20px;
  --fs-h2:       24px;
  --fs-h1:       30px;

  /* Sidebar */
  --sidebar-width: 248px;
  --topbar-height: 56px;

  /* Font stack */
  --font: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}