:root{--theme-surface:#fffcf6;--theme-ink:#2b2927;--theme-line:#b9ada0;--theme-focus:#b9462e}
:root[data-color-mode=light]{color-scheme:light}
:root[data-color-mode=dark]{color-scheme:dark;--theme-surface:#24221f;--theme-ink:#f4efe7;--theme-line:#817366;--theme-focus:#e59a80}
@media(prefers-color-scheme:dark){:root:not([data-color-mode]){color-scheme:dark;--theme-surface:#24221f;--theme-ink:#f4efe7;--theme-line:#817366;--theme-focus:#e59a80}}
.theme-control{position:relative;display:none;flex:none;margin:0;border:0;padding:0;background:none;color:var(--theme-ink);font:500 12px/1.4 system-ui,sans-serif;letter-spacing:0}
[data-color-mode] .theme-control{display:block}
.theme-control summary{display:grid;place-items:center;width:40px;height:40px;margin:0;padding:0;border:1px solid transparent;border-radius:7px;list-style:none;cursor:pointer;color:var(--theme-ink);background:transparent}
.theme-control summary::-webkit-details-marker{display:none}
.theme-control summary::after{content:none}
.theme-control summary:hover,.theme-control[open] summary{border-color:var(--theme-line)}
.theme-control svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.theme-control .theme-moon{display:none}
[data-color-mode=dark] .theme-control .theme-sun{display:none}
[data-color-mode=dark] .theme-control .theme-moon{display:block}
.theme-options{position:absolute;right:0;top:calc(100% + 8px);z-index:30;width:156px;display:grid;gap:3px;padding:6px;border:1px solid var(--theme-line);border-radius:10px;background:var(--theme-surface);box-shadow:0 10px 28px #0002}
.theme-options button{display:flex;align-items:center;gap:12px;min-height:40px;width:100%;margin:0;padding:8px 10px;border:1px solid transparent;border-radius:5px;background:none;color:var(--theme-ink);font:inherit;text-align:left;letter-spacing:0;cursor:pointer}
.theme-options button:hover,.theme-options button[aria-pressed=true]{border-color:var(--theme-line)}
.theme-options button[aria-pressed=true]{color:var(--theme-focus)}
.theme-control summary:focus-visible,.theme-options button:focus-visible{outline:2px solid var(--theme-focus);outline-offset:3px}