:root {
    --bg: #FAFAF7;
    --bg-2: #F2F2EC;
    --bg-3: #E9E9E0;
    --ink: #0E1116;
    --ink-2: #23262C;
    --muted: #6B6B66;
    --muted-2: #9A9A92;
    --line: #E5E5DB;
    --line-2: #D8D8CC;
    --card: #FFFFFF;

    --accent: oklch(0.72 0.17 145);
    --accent-ink: oklch(0.32 0.09 145);
    --accent-soft: oklch(0.96 0.05 145);
    --accent-line: oklch(0.88 0.10 145);

    --danger: oklch(0.62 0.22 28);
    --danger-soft: oklch(0.96 0.06 28);
    --danger-line: oklch(0.88 0.12 28);
    --warn: oklch(0.78 0.15 75);

    --radius: 14px;
    --radius-lg: 22px;
    --shadow-sm: 0 1px 0 rgba(14,17,22,0.04), 0 1px 2px rgba(14,17,22,0.04);
    --shadow-md: 0 1px 0 rgba(14,17,22,0.04), 0 12px 32px -12px rgba(14,17,22,0.12);
    --shadow-lg: 0 1px 0 rgba(14,17,22,0.04), 0 30px 80px -20px rgba(14,17,22,0.18);

    --font-display: 'Inter Tight', system-ui, sans-serif;
    --font-body: 'Inter', system-ui, sans-serif;
    --font-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
}

[data-accent="amber"]  { --accent: oklch(0.78 0.17 75);  --accent-ink: oklch(0.38 0.10 75);  --accent-soft: oklch(0.96 0.05 75);  --accent-line: oklch(0.88 0.10 75); }
[data-accent="cyan"]   { --accent: oklch(0.72 0.14 215); --accent-ink: oklch(0.35 0.09 215); --accent-soft: oklch(0.96 0.04 215); --accent-line: oklch(0.87 0.08 215); }
[data-accent="violet"] { --accent: oklch(0.65 0.19 300); --accent-ink: oklch(0.32 0.11 300); --accent-soft: oklch(0.96 0.05 300); --accent-line: oklch(0.86 0.09 300); }

[data-theme="dark"] {
    --bg: #0D0F13;
    --bg-2: #14171D;
    --bg-3: #1B1F26;
    --ink: #EEF0F3;
    --ink-2: #D3D6DC;
    --muted: #8A8F99;
    --muted-2: #60656E;
    --line: #252932;
    --line-2: #30353F;
    --card: #141820;
    --accent-soft: color-mix(in oklab, var(--accent) 14%, transparent);
    --accent-line: color-mix(in oklab, var(--accent) 32%, transparent);
    --danger-soft: color-mix(in oklab, var(--danger) 14%, transparent);
    --danger-line: color-mix(in oklab, var(--danger) 32%, transparent);
    --shadow-md: 0 1px 0 rgba(0,0,0,0.4), 0 12px 32px -12px rgba(0,0,0,0.6);
    --shadow-lg: 0 1px 0 rgba(0,0,0,0.4), 0 30px 80px -20px rgba(0,0,0,0.7);
}
