/**
 * Track 1 section lessons — semantic tokens (--bg-primary, --t1, …).
 * Pair with styles/design-system.css. Values match legacy inline blocks (L02 canonical).
 */

:root {
  /* Shared lesson UI (styles/lesson-ui.css) */
  --qd-lesson-cta-gradient: linear-gradient(135deg, var(--t1), var(--accent-cyan));
  --qd-lesson-complete-accent: var(--t1);
  --qd-lesson-complete-bd: var(--t1-bd);
  --bg-primary: #06080f;
  --bg-secondary: #0c1018;
  --bg-tertiary: #111827;
  --bg-card: #0f1623;
  --bg-card-hover: #141d2e;
  --bg-glass: rgba(15, 22, 35, 0.85);
  --text-primary: #e8edf5;
  --text-secondary: #8b96a8;
  --text-tertiary: #6b7f93;
  --text-body: #c5cdd9;
  --accent-cyan: #00d4c8;
  --accent-cyan-dim: #00a89e;
  --accent-cyan-bg: rgba(0, 212, 200, 0.07);
  --accent-cyan-bd: rgba(0, 212, 200, 0.2);
  --accent-blue: #3b82f6;
  --accent-violet: #8b5cf6;
  --accent-amber: #f59e0b;
  --accent-rose: #f43f5e;
  --accent-emerald: #10b981;
  --t1: #10b981;
  --t1-dim: #059669;
  --t1-bg: rgba(16, 185, 129, 0.08);
  --t1-bd: rgba(16, 185, 129, 0.25);
  --border: rgba(255, 255, 255, 0.06);
  --border-strong: rgba(255, 255, 255, 0.11);
  --border-accent: rgba(0, 212, 200, 0.22);
  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 24px rgba(0, 0, 0, 0.55);
  --shadow-glow: 0 0 48px rgba(0, 212, 200, 0.1);
  --nav-height: 64px;
  --content-max: 1020px;
  --prose-max: 68ch;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 26px;
  --transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --section-gap: 4rem;
}

[data-theme="light"] {
  --bg-primary: #f5f7fc;
  --bg-secondary: #ebeef7;
  --bg-tertiary: #dde2f0;
  --bg-card: #fff;
  --bg-card-hover: #f8faff;
  --bg-glass: rgba(245, 247, 252, 0.92);
  --text-primary: #0c1117;
  --text-secondary: #4a5568;
  --text-tertiary: #6b7280;
  --text-body: #2d3748;
  --accent-cyan: #008f88;
  --accent-cyan-dim: #007a74;
  --accent-cyan-bg: rgba(0, 143, 136, 0.06);
  --accent-cyan-bd: rgba(0, 143, 136, 0.2);
  --accent-blue: #2563eb;
  --accent-violet: #7c3aed;
  --accent-amber: #d97706;
  --accent-rose: #e11d48;
  --accent-emerald: #059669;
  --t1: #059669;
  --t1-bg: rgba(5, 150, 105, 0.07);
  --t1-bd: rgba(5, 150, 105, 0.2);
  --t1-link: #047857;
  --border: rgba(0, 0, 0, 0.07);
  --border-strong: rgba(0, 0, 0, 0.11);
  --border-accent: rgba(0, 143, 136, 0.22);
  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.07);
  --shadow-md: 0 4px 24px rgba(0, 0, 0, 0.1);
  --shadow-glow: 0 0 48px rgba(0, 143, 136, 0.07);
}