:root {
--color-bg: #f7f4ed;
--color-surface: #fffdf8;
--color-surface-raised: #fff;
--color-text: #222821;
--color-muted: #657064;
--color-border: #ddd8ca;
--color-accent: #bd4d32;
--color-accent-strong: #9e3823;
--color-accent-text: #fffdf8;
--color-accent-soft: #f7e4d8;
--color-ink: #24362d;
--color-ink-text: #f8f3e9;
--color-ink-muted: #c8d0c4;
--color-focus: rgb(189 77 50 / 24%);
}


[data-theme="dark"] {
--color-bg: #1c231e;
--color-surface: #263129;
--color-surface-raised: #303d33;
--color-text: #f4f0e7;
--color-muted: #bbc3b7;
--color-border: #465247;
--color-accent: #e48a5a;
--color-accent-strong: #f3a572;
--color-accent-text: #202820;
--color-accent-soft: #443329;
--color-ink: #121914;
--color-ink-text: #f7f1e7;
--color-ink-muted: #bfc9bd;
--color-focus: rgb(228 138 90 / 30%);
}


html, body, .card, .site-header, .theme-toggle, .button, input, select, textarea {
transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}