/**
 * LingYao design tokens — 4 switchable themes
 * Apply via <html data-theme="...">
 */

/* ---- 深海 Midnight (default) ---- */
:root,
[data-theme="midnight"] {
  --bg-deep: #0c1222;
  --bg-card: #141e33;
  --bg-elevated: #1a2740;
  --bg-muted: #111a2e;
  --text: #e8edf5;
  --text-muted: #8b9cb3;
  --accent: #38bdf8;
  --accent-hover: #7dd3fc;
  --accent-soft: rgba(56, 189, 248, 0.12);
  --cta: #f59e0b;
  --cta-hover: #fbbf24;
  --cta-soft: rgba(245, 158, 11, 0.12);
  --border: rgba(148, 163, 184, 0.14);
  --header-bg: #0c1222;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.32);
  --radius: 12px;
  --hero-glow: rgba(56, 189, 248, 0.08);
  --theme-label: "深海";
  --theme-swatch: #38bdf8;
  --theme-preview-bg: #0c1222;
  --theme-preview-accent: #38bdf8;
  --theme-preview-cta: #f59e0b;
  --on-cta: var(--bg-deep);
  --on-accent: var(--bg-deep);
  --surface-tint: rgba(17, 29, 50, 0.55);
  --surface-tint-soft: rgba(17, 29, 50, 0.45);
  --surface-tint-lite: rgba(17, 29, 50, 0.35);
  --surface-tint-mid: rgba(17, 29, 50, 0.6);
  --surface-tint-strong: rgba(17, 29, 50, 0.65);
  --surface-panel: rgba(22, 34, 54, 0.85);
  --surface-panel-heavy: rgba(17, 29, 50, 0.9);
  --surface-sticky: rgba(10, 22, 40, 0.88);
  --hero-radial: rgba(0, 180, 216, 0.1);
  --brand-gradient: linear-gradient(135deg, #22d3ee 0%, #38bdf8 25%, #818cf8 52%, #c084fc 76%, #f472b6 100%);
  --accent-gradient: linear-gradient(135deg, #38bdf8 0%, #a78bfa 100%);
}

/* ---- 石墨 Slate ---- */
[data-theme="slate"] {
  --bg-deep: #111318;
  --bg-card: #1a1d24;
  --bg-elevated: #22262f;
  --bg-muted: #161920;
  --text: #eceef2;
  --text-muted: #9aa3b2;
  --accent: #60a5fa;
  --accent-hover: #93c5fd;
  --accent-soft: rgba(96, 165, 250, 0.12);
  --cta: #eab308;
  --cta-hover: #facc15;
  --cta-soft: rgba(234, 179, 8, 0.12);
  --border: rgba(148, 163, 184, 0.12);
  --header-bg: #111318;
  --shadow: 0 8px 28px rgba(0, 0, 0, 0.38);
  --hero-glow: rgba(96, 165, 250, 0.07);
  --theme-label: "石墨";
  --theme-swatch: #60a5fa;
  --theme-preview-bg: #111318;
  --theme-preview-accent: #60a5fa;
  --theme-preview-cta: #eab308;
  --on-cta: #111318;
  --on-accent: #111318;
  --surface-tint: rgba(26, 29, 36, 0.65);
  --surface-tint-soft: rgba(26, 29, 36, 0.5);
  --surface-tint-lite: rgba(26, 29, 36, 0.38);
  --surface-tint-mid: rgba(26, 29, 36, 0.7);
  --surface-tint-strong: rgba(26, 29, 36, 0.78);
  --surface-panel: rgba(34, 38, 47, 0.92);
  --surface-panel-heavy: rgba(26, 29, 36, 0.95);
  --surface-sticky: rgba(17, 19, 24, 0.94);
  --hero-radial: rgba(96, 165, 250, 0.09);
  --brand-gradient: linear-gradient(135deg, #38bdf8 0%, #60a5fa 28%, #a78bfa 55%, #e879f9 78%, #f9a8d4 100%);
  --accent-gradient: linear-gradient(135deg, #60a5fa 0%, #a78bfa 100%);
}

/* ---- 素纸 Paper (light) — 高对比可读 ---- */
[data-theme="paper"] {
  --bg-deep: #f1f5f9;
  --bg-card: #ffffff;
  --bg-elevated: #f8fafc;
  --bg-muted: #e2e8f0;
  --text: #0f172a;
  --text-muted: #475569;
  --accent: #4338ca;
  --accent-hover: #4f46e5;
  --accent-soft: rgba(67, 56, 202, 0.1);
  --cta: #c2410c;
  --cta-hover: #ea580c;
  --cta-soft: rgba(194, 65, 12, 0.12);
  --border: rgba(15, 23, 42, 0.14);
  --header-bg: #ffffff;
  --shadow: 0 4px 20px rgba(15, 23, 42, 0.1);
  --hero-glow: rgba(67, 56, 202, 0.08);
  --theme-label: "素纸";
  --theme-swatch: #4338ca;
  --theme-preview-bg: #f1f5f9;
  --theme-preview-accent: #4338ca;
  --theme-preview-cta: #c2410c;
  --on-cta: #ffffff;
  --on-accent: #ffffff;
  --surface-tint: #e2e8f0;
  --surface-tint-soft: #f1f5f9;
  --surface-tint-lite: #f8fafc;
  --surface-tint-mid: #e2e8f0;
  --surface-tint-strong: #cbd5e1;
  --surface-panel: #ffffff;
  --surface-panel-heavy: #f8fafc;
  --surface-sticky: rgba(255, 255, 255, 0.96);
  --hero-radial: rgba(67, 56, 202, 0.1);
  --brand-gradient: linear-gradient(135deg, #0369a1 0%, #0284c7 25%, #4f46e5 52%, #7e22ce 76%, #be185d 100%);
  --accent-gradient: linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
}

/* ---- 墨绿 Jade ---- */
[data-theme="jade"] {
  --bg-deep: #0a1512;
  --bg-card: #12201c;
  --bg-elevated: #182a24;
  --bg-muted: #0e1a17;
  --text: #e6f0ec;
  --text-muted: #8fa89e;
  --accent: #2dd4bf;
  --accent-hover: #5eead4;
  --accent-soft: rgba(45, 212, 191, 0.12);
  --cta: #fbbf24;
  --cta-hover: #fcd34d;
  --cta-soft: rgba(251, 191, 36, 0.12);
  --border: rgba(143, 168, 158, 0.14);
  --header-bg: #0a1512;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.34);
  --hero-glow: rgba(45, 212, 191, 0.08);
  --theme-label: "墨绿";
  --theme-swatch: #2dd4bf;
  --theme-preview-bg: #0a1512;
  --theme-preview-accent: #2dd4bf;
  --theme-preview-cta: #fbbf24;
  --on-cta: #0a1512;
  --on-accent: #0a1512;
  --surface-tint: rgba(14, 26, 23, 0.65);
  --surface-tint-soft: rgba(14, 26, 23, 0.5);
  --surface-tint-lite: rgba(14, 26, 23, 0.38);
  --surface-tint-mid: rgba(14, 26, 23, 0.7);
  --surface-tint-strong: rgba(14, 26, 23, 0.78);
  --surface-panel: rgba(24, 42, 36, 0.92);
  --surface-panel-heavy: rgba(14, 26, 23, 0.95);
  --surface-sticky: rgba(10, 21, 18, 0.93);
  --hero-radial: rgba(45, 212, 191, 0.09);
  --brand-gradient: linear-gradient(135deg, #10b981 0%, #14b8a6 22%, #2dd4bf 44%, #38bdf8 68%, #a78bfa 100%);
  --accent-gradient: linear-gradient(135deg, #2dd4bf 0%, #38bdf8 100%);
}