html[data-theme="dark"],
html[data-resolved-theme="dark"] {
    --oak-bg: #0e1411;
    --oak-bg-elevated: #131b17;
    --oak-surface: #151e1a;
    --oak-surface-subtle: #1a2520;
    --oak-surface-hover: #223029;
    --oak-surface-active: #293a31;

    --oak-text: #edf5f0;
    --oak-text-soft: #b8c8bf;
    --oak-text-muted: #899a90;
    --oak-text-inverse: #0d1712;

    --oak-border: #29372f;
    --oak-border-strong: #3a4a41;

    --oak-accent: var(--oak-accent-300);
    --oak-accent-hover: var(--oak-accent-200);
    --oak-accent-soft: rgba(72, 188, 163, .11);
    --oak-accent-border: rgba(128, 213, 191, .24);

    --oak-overlay: rgba(0, 0, 0, .62);
    --oak-input-bg: #111915;
    --oak-focus-ring: rgba(128, 213, 191, .20);

    --oak-shadow-sm: 0 1px 2px rgba(0, 0, 0, .25);
    --oak-shadow-md: 0 16px 36px rgba(0, 0, 0, .28);
    --oak-shadow-lg: 0 28px 70px rgba(0, 0, 0, .40);
}

@media (prefers-color-scheme: dark) {
    html[data-theme="system"]:not([data-resolved-theme="light"]) {
        --oak-bg: #0e1411;
        --oak-bg-elevated: #131b17;
        --oak-surface: #151e1a;
        --oak-surface-subtle: #1a2520;
        --oak-surface-hover: #223029;
        --oak-surface-active: #293a31;

        --oak-text: #edf5f0;
        --oak-text-soft: #b8c8bf;
        --oak-text-muted: #899a90;
        --oak-text-inverse: #0d1712;

        --oak-border: #29372f;
        --oak-border-strong: #3a4a41;

        --oak-accent: var(--oak-accent-300);
        --oak-accent-hover: var(--oak-accent-200);
        --oak-accent-soft: rgba(72, 188, 163, .11);
        --oak-accent-border: rgba(128, 213, 191, .24);

        --oak-overlay: rgba(0, 0, 0, .62);
        --oak-input-bg: #111915;
        --oak-focus-ring: rgba(128, 213, 191, .20);
    }
}