:root {
    --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-6: 24px;
    --space-8: 32px;
    --radius-control: 14px;
    --radius-card: 28px;
    --bg: #f7fbff;
    --surface: rgba(255,255,255,.82);
    --surface-solid: #fff;
    --text: #102033;
    --muted: #607086;
    --border: rgba(16,32,51,.10);
    --shadow: 0 24px 70px rgba(16,32,51,.10);
    --primary: #2d8cff;
    --secondary: #21d39a;
    --gradient: linear-gradient(135deg, #2d8cff, #21d39a);
    --soft-gradient: radial-gradient(circle at top left, rgba(45,140,255,.18), transparent 32%), radial-gradient(circle at bottom right, rgba(33,211,154,.18), transparent 34%), #f7fbff;
}
html[data-theme="dark"] {
    --bg: #07111f;
    --surface: rgba(14,25,42,.78);
    --surface-solid: #0e192a;
    --text: #f3f8ff;
    --muted: #a8b6ca;
    --border: rgba(255,255,255,.11);
    --shadow: 0 28px 80px rgba(0,0,0,.38);
    --soft-gradient: radial-gradient(circle at top left, rgba(45,140,255,.24), transparent 34%), radial-gradient(circle at bottom right, rgba(33,211,154,.22), transparent 36%), #07111f;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-sans); background: var(--soft-gradient); color: var(--text); line-height: 1.6; }