/* One appearance picker, shared by the app and public guides. */
.theme-dialog{box-sizing:border-box;width:min(500px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;padding:24px;background:var(--surface,var(--bg));color:var(--ink);border:2px solid var(--ink);border-radius:0;box-shadow:6px 6px 0 var(--bg),8px 8px 0 var(--ink);font:14px/1.5 'Courier New',Courier,monospace}
.theme-dialog::backdrop{background:rgb(12 16 28 / .58);backdrop-filter:blur(3px)}
:root[data-contrast=high] .theme-dialog::backdrop{background:repeating-conic-gradient(#000 0% 25%,transparent 0% 50%) 0 0/4px 4px;backdrop-filter:none}
.theme-dialog *{box-sizing:border-box}
.theme-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}
.theme-dialog-heading h2{margin:0;font:500 30px/1.3 Eggmode,'Courier New',monospace}
.theme-close{display:grid;place-items:center;flex:none;width:34px;height:34px;padding:0;border:1px solid var(--ink);background:var(--bg);color:var(--ink);font:24px/1 'Courier New',monospace;cursor:pointer}
.theme-description{margin:0 0 18px;color:var(--muted,var(--ink));font-size:13px;line-height:1.6}
.theme-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;min-width:0;margin:0;padding:0;border:0}
.theme-group-label{grid-column:1/-1;font-size:12px;font-weight:bold;margin:3px 0 0;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,var(--ink))}
.theme-group-label:not(:first-of-type){margin-top:8px}
.theme-choice{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;gap:8px;padding:10px;border:1px solid var(--line-soft,var(--ink));background:var(--bg);cursor:pointer;min-width:0}
.theme-choice:has(input:checked){border-color:var(--ink);box-shadow:inset 0 -3px 0 var(--accent,var(--ink))}
.theme-choice:hover{border-color:var(--ink)}
.theme-choice input{grid-row:2;grid-column:1;appearance:auto;margin:0;accent-color:var(--ink);width:16px;height:16px;cursor:pointer}
.theme-choice-name{grid-row:2;grid-column:2;min-width:0;font-size:12px;line-height:1.5;color:var(--ink)}
.theme-preview{position:relative;display:block;grid-column:1/-1;height:62px;background:var(--sample-bg);border:1px solid var(--sample-ink);overflow:hidden;forced-color-adjust:none}
.theme-preview-header{position:absolute;top:9px;left:10px;right:10px;height:4px;background:var(--sample-ink)}
.theme-preview-panel{position:absolute;top:21px;left:10px;right:10px;height:21px;background:var(--sample-panel);border:1px solid var(--sample-ink)}
.theme-preview-action{position:absolute;bottom:7px;right:10px;width:35px;height:7px;background:var(--sample-action);border:1px solid var(--sample-ink)}
[data-choice=color-light]{--sample-bg:#fff8ed;--sample-ink:#1c2541;--sample-panel:#e3e8ff;--sample-action:#ff8165}
[data-choice=color-dark]{--sample-bg:#141827;--sample-ink:#fff8ed;--sample-panel:#2a3556;--sample-action:#ff9579}
[data-choice=contrast-light]{--sample-bg:#fff;--sample-ink:#000;--sample-panel:#fff;--sample-action:#000}
[data-choice=contrast-dark]{--sample-bg:#000;--sample-ink:#fff;--sample-panel:#000;--sample-action:#fff}
.theme-dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-soft,var(--ink))}
.theme-dialog-footer button{font:inherit;min-height:40px;padding:9px 13px;border:1px solid var(--ink);background:var(--bg);color:var(--ink);cursor:pointer}
.theme-dialog-footer .theme-device{font-size:12px;text-align:left}
.theme-device[aria-pressed=true]{box-shadow:inset 0 -3px 0 var(--accent,var(--ink))}
.theme-dialog-footer .theme-done{font:500 18px/1.3 Eggmode,'Courier New',monospace;background:var(--accent,var(--ink));color:var(--accent-ink,var(--bg));min-width:80px}
.theme-selection-status{margin:16px 0 0;font-size:12px;line-height:1.5;color:var(--muted,var(--ink));min-height:18px}
.theme-dialog button:focus-visible,.theme-dialog input:focus-visible{outline:2px solid var(--focus,var(--ink));outline-offset:4px}
.theme-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:400px){.theme-dialog{padding:18px}.theme-options{gap:9px}.theme-choice{padding:8px;gap:6px}.theme-choice-name{font-size:11px}.theme-dialog-heading h2{font-size:27px}.theme-description{font-size:12px}.theme-preview{height:54px}.theme-preview-panel{height:17px}.theme-dialog-footer{gap:10px}.theme-dialog-footer .theme-device{font-size:11px;padding:9px}.theme-dialog-footer .theme-done{min-width:68px}.theme-selection-status{font-size:11px}}

/* The brush identifies appearance without repeating the current theme's name. */
#theme-toggle.theme-icon-toggle{min-width:36px;min-height:36px;padding:7px 10px;gap:0}
.theme-icon-toggle .theme-label{display:none}
#theme-toggle .theme-brush{display:block;flex:none;width:20px;height:20px;overflow:visible}
.theme-brush-detail{fill:transparent}
:root[data-contrast=normal] .theme-brush-handle{fill:#647e89}
:root[data-contrast=normal][data-theme=dark] .theme-brush-handle{fill:#9baeb7}
:root[data-contrast=normal] .theme-brush-band-0{fill:#b1a0c8}
:root[data-contrast=normal] .theme-brush-band-1{fill:#ff8165}
:root[data-contrast=normal] .theme-brush-band-2{fill:#ffdc74}
:root[data-contrast=normal] .theme-brush-band-3{fill:#c6ea79}
:root[data-contrast=normal] .theme-brush-band-4{fill:#59b4ae}
:root[data-contrast=normal] .theme-brush-detail{fill:#ffdc74}
:root[data-contrast=normal] .theme-icon-toggle:hover{background:var(--surface-active);color:var(--ink)}

.footer-feedback{display:inline-flex;align-items:center;gap:8px}