.top-actions #options-button{display:grid;place-items:center;width:38px;height:38px;padding:8px;color:var(--gold);border:1px solid var(--surface-border);border-radius:7px}
.ui-size-options{min-width:0;margin:4px 0 8px;padding:10px 12px;border:1px solid var(--surface-border);border-radius:6px}
.ui-size-options legend{padding:0 5px;font-size:14px;color:var(--text)}
.ui-size-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.ui-size-choices label{position:relative;cursor:pointer}
.ui-size-choices input{position:absolute;opacity:0;width:1px;height:1px}
.ui-size-choices span{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;border:1px solid var(--line);border-radius:5px;font-size:14px;background:var(--field)}
.ui-size-choices small{font-size:10px;color:var(--muted)}
.ui-size-choices input:checked+span{color:var(--gold);border-color:var(--gold);background:var(--selection)}
.ui-size-choices input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
#ui-size-message{margin:9px 0 0;font-size:11px;line-height:1.6;color:var(--muted)}
#ui-size-message.is-error{color:#efb09f}
.touch-ui #ui-size-options,#ui-size-options[hidden]{display:none}
#options-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.settings-dialog{color:var(--text);background:var(--floating);border:1px solid var(--surface-border);border-radius:12px;padding:0;width:min(600px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 32px);box-shadow:0 16px 70px #000a}
.settings-dialog::backdrop{background:#050809a8}
.settings-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;border-bottom:1px solid var(--surface-border)}
.settings-dialog h2{font-size:18px;color:var(--gold);margin:0;font-weight:600}
.settings-dialog header p{font-size:12px;color:var(--muted);margin:6px 0 0}
.settings-dialog header>button{width:36px;height:36px;padding:0;font-size:23px;background:transparent;flex-shrink:0}
#options-window{width:min(340px,calc(100vw - 24px))}
.options-actions{display:flex;flex-direction:column;gap:6px;padding:14px}
#options-window .options-actions>button,#options-window .options-actions>a,#options-window #sound-settings{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:11px 14px;text-align:left;font-size:14px;color:var(--text);border:1px solid transparent;border-radius:6px;background:#ffffff05;text-decoration:none}
#options-window .options-actions>button:hover,#options-window .options-actions>a:hover,#options-window #sound-settings:hover{background:#ffffff0c;border-color:var(--surface-border)}
#options-window .sound-controls{display:block}
#options-window .options-action-icon{width:19px;height:19px;flex:0 0 19px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#options-window .sound-mixer{position:static;width:100%;max-width:none;margin:6px 0 0;padding:8px 10px;background:#0003;box-shadow:none}
#options-window :is(#sound-button,#music-button){display:grid;place-items:center;width:36px;height:36px;padding:7px;flex-shrink:0}
#options-window :is(#sound-button,#music-button)[aria-pressed=true]{color:var(--gold)}
#options-window .sound-volume-controls{flex:1;min-width:0}
#options-window .sound-volume-controls input{width:100%;min-width:30px}
#options-window #logout-button{color:#e4ad9d;margin-top:6px;border-top-color:var(--surface-border)}
.keybindings-help{font-size:12px;color:var(--muted);line-height:1.7;margin:14px 20px}
#keybindings-window[open]{display:flex;flex-direction:column}
#keybindings-window header,#keybindings-window footer,.keybindings-help,.settings-message{flex-shrink:0}
.keybindings-list{overflow:auto;min-height:0;padding:0 20px;overscroll-behavior:contain}
.keybindings-list table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}
.keybindings-list th,.keybindings-list td{padding:7px 6px;text-align:center;border-bottom:1px solid #ffffff0a}
.keybindings-list th:first-child{text-align:left;width:44%;font-weight:400}
.keybindings-list thead{position:sticky;top:0;background:var(--floating);z-index:1;color:var(--muted);font-size:12px}
.keybindings-list .keybindings-group th{padding-top:18px;color:var(--gold);font-size:12px;font-weight:600}
.keybindings-list kbd{font:12px ui-monospace,monospace;color:var(--muted)}
.keybindings-list [data-keybinding]{width:100%;min-height:34px;padding:5px;font:12px ui-monospace,monospace;white-space:normal;overflow-wrap:anywhere}
.keybindings-list [aria-pressed=true]{color:var(--gold);border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.key-conflict [data-keybinding]{border-color:#ef927f;color:#efb09f}
.settings-message{min-height:20px;line-height:1.5;font-size:12px;color:var(--gold);margin:10px 20px}
.settings-message.is-error{color:#efb09f}
.settings-dialog footer{display:flex;gap:8px;padding:14px 20px;border-top:1px solid var(--surface-border)}
.settings-dialog footer span{flex:1}
.settings-dialog footer button{min-height:38px;white-space:nowrap;font-size:12px}
.settings-dialog .settings-primary{border-color:var(--gold);color:var(--gold)}
.settings-dialog button:focus-visible,.settings-dialog a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media(max-width:480px){.settings-dialog header{padding:14px}.keybindings-help{margin:10px 14px;font-size:11px}.keybindings-list{padding:0 10px}.keybindings-list th:first-child{width:40%}.settings-dialog footer{padding:12px;gap:6px}.settings-message{margin:8px 14px}.settings-dialog{max-height:calc(100dvh - 24px)}}
#options-window .options-group-title{margin:5px 8px 2px;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--gold)}#options-window .options-divider{width:100%;box-sizing:border-box;margin:10px 0 4px;border:0;border-top:1px solid var(--surface-border)}#options-window #logout-button{margin-top:0;border-top-color:transparent}
