:root[data-theme="dark"] {
    color-scheme: dark;

    --color-bg: #171312;
    --color-card: #231A18;
    --color-sidebar: #1D1513;
    --color-border: #4A342E;
    --color-text: #F3E8E4;
    --color-text-secondary: #B69F98;
    --color-primary: #7A4A32;
    --color-primary-hover: #CF78AF;
    --color-primary-soft: rgba(207, 120, 175, 0.14);
    --shadow-soft: 0 12px 32px rgba(0, 0, 0, 0.24);
    --shadow-panel: 0 20px 60px rgba(0, 0, 0, 0.38);
}

.theme-transition,
.theme-transition * {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}