:root {
  color-scheme: dark;
  --font-main: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --duration-fast: 160ms;
  --duration-med: 320ms;
  --duration-slow: 700ms;
  --spring: cubic-bezier(.2, .9, .2, 1.08);
  --radius-xs: 12px;
  --radius-sm: 18px;
  --radius-md: 28px;
  --radius-lg: 38px;
  --shadow-soft: 0 24px 80px rgba(0, 0, 0, .28);
  --shadow-card: 0 18px 50px rgba(0, 0, 0, .2);
}

/* ── Brand colors (shared across themes) ── */
:root {
  --brand: #FC6E08;
  --brand-rgb: 252, 110, 8;
  --brand-2: #FD8F3D;
  --accent-2: #6366f1;
  --accent-3: #22c55e;
  --accent-4: #f472b6;
  --color-error: #ef4444;
  --gradient-brand: linear-gradient(135deg, #FC6E08, #FD8F3D);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b0d11;
  --bg-deep: #07080b;
  --bg-elevated: rgba(18, 20, 27, .72);
  --bg-card: rgba(255, 255, 255, .055);
  --bg-card-strong: rgba(255, 255, 255, .09);
  --text: #f3f5f8;
  --text-soft: #b7becb;
  --text-muted: #7d8493;
  --line: rgba(255, 255, 255, .14);
  --line-strong: rgba(255, 255, 255, .24);
  --accent: #ffffff;
  --accent-soft: rgba(255, 255, 255, .12);
  --glass: rgba(10, 12, 16, .56);
  --glow-a: rgba(255, 255, 255, .13);
  --glow-b: rgba(132, 145, 166, .18);
  --grid: rgba(255, 255, 255, .055);
  --invert: #0b0d11;
  --brand-soft: rgba(252, 110, 8, .12);
  --brand-glow: rgba(252, 110, 8, .30);
  --brand-line: rgba(252, 110, 8, .35);
  /* ── Aurora mesh background system ── */
  --mesh-1: rgba(252, 110, 8, .10);
  --mesh-2: rgba(99, 102, 241, .10);
  --mesh-3: rgba(34, 197, 94, .05);
  --aurora-1: rgba(252, 110, 8, .16);
  --aurora-2: rgba(139, 92, 246, .14);
  --aurora-3: rgba(56, 189, 248, .10);
  --node-color: rgba(200, 215, 240, .55);
  --node-hub: rgba(252, 140, 40, .90);
  --node-hub-2: rgba(139, 92, 246, .70);
  --line-color: rgba(200, 215, 240, .10);
  --spotlight: rgba(252, 110, 8, .07);
  --grid-dot: rgba(255, 255, 255, .09);
  --ambient-tint: rgba(252, 110, 8, .10);
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f7f4ee;
  --bg-deep: #efe9df;
  --bg-elevated: rgba(255, 255, 255, .76);
  --bg-card: rgba(255, 255, 255, .62);
  --bg-card-strong: rgba(255, 255, 255, .86);
  --text: #111318;
  --text-soft: #3f4652;
  --text-muted: #757d8b;
  --line: rgba(17, 19, 24, .12);
  --line-strong: rgba(17, 19, 24, .2);
  --accent: #111318;
  --accent-soft: rgba(17, 19, 24, .08);
  --glass: rgba(255, 255, 255, .58);
  --glow-a: rgba(14, 17, 23, .12);
  --glow-b: rgba(148, 132, 102, .18);
  --grid: rgba(17, 19, 24, .055);
  --invert: #ffffff;
  --brand-soft: rgba(252, 110, 8, .10);
  --brand-glow: rgba(252, 110, 8, .22);
  --brand-line: rgba(252, 110, 8, .30);
  /* ── Aurora mesh background system ── */
  --mesh-1: rgba(252, 110, 8, .08);
  --mesh-2: rgba(99, 102, 241, .06);
  --mesh-3: rgba(34, 197, 94, .04);
  --aurora-1: rgba(252, 110, 8, .12);
  --aurora-2: rgba(139, 92, 246, .09);
  --aurora-3: rgba(56, 189, 248, .07);
  --node-color: rgba(70, 82, 105, .42);
  --node-hub: rgba(252, 110, 8, .80);
  --node-hub-2: rgba(139, 92, 246, .55);
  --line-color: rgba(70, 82, 105, .12);
  --spotlight: rgba(252, 110, 8, .05);
  --grid-dot: rgba(17, 19, 24, .12);
  --ambient-tint: rgba(252, 110, 8, .08);
}