/* One compact, anchored settings menu across all translation screens. */
.settings-trigger{display:inline-flex;align-items:center;justify-content:center;flex:none;width:38px;height:38px;padding:0;border:1px solid #e2e6eb;border-radius:10px;background:transparent;color:#667085;cursor:pointer}
#playground-settings,#speech-settings,#translator-options{--menu-panel:var(--tr-panel,var(--sp-panel,#fff));--menu-text:var(--tr-text,var(--sp-text,#263244));--menu-muted:var(--tr-muted,var(--sp-muted,#728097));--menu-line:var(--tr-line,var(--sp-line,#e6e9ee));--menu-accent:var(--tr-accent,var(--sp-blue,#6285c0));--menu-hover:var(--tr-soft,#f3f5f8);position:fixed;inset:auto;margin:0;width:320px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:8px;border:1px solid var(--menu-line);border-radius:22px;background:var(--menu-panel);color:var(--menu-text);box-shadow:0 16px 60px #14243e25;overflow:auto;overscroll-behavior:contain}
body[data-theme=dark] .settings-menu{--menu-hover:#ffffff0b}
#playground-settings::backdrop,#speech-settings::backdrop,#translator-options::backdrop{background:transparent;backdrop-filter:none}
.settings-menu .settings-row{display:flex;flex-direction:row;align-items:center;gap:12px;min-height:56px;width:100%;padding:10px 15px;margin:0;border:0;border-radius:13px;color:var(--menu-text);font-size:15px;font-weight:450;line-height:1.4;cursor:pointer}
.settings-menu .settings-row:hover{background:var(--menu-hover)}
.settings-menu .menu-icon{display:block;flex:none;width:25px;height:25px;fill:none;stroke:var(--menu-accent);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.settings-menu .settings-row>span{min-width:0;overflow-wrap:anywhere}
.settings-menu .settings-row select{margin:0 0 0 auto;width:auto;min-width:0;max-width:135px;min-height:32px;height:auto;padding:6px 24px 6px 4px;border:0;border-radius:0;background-color:transparent;background-position:right 4px center;background-size:10px 7px;color:var(--menu-muted);font-size:12px;text-align:right;cursor:pointer}
.settings-menu .settings-row select option{background:var(--menu-panel);color:var(--menu-text)}
.settings-menu .settings-row:has(select:disabled){opacity:.45}
#speech-settings .speech-dialog-heading{display:none}
#speech-settings .speech-option-grid{display:flex;flex-direction:column;gap:0}
#speech-settings .speech-host-settings{margin:7px 15px 0;padding:7px 0 0;border-top:1px solid var(--menu-line)}
#speech-settings .speech-host-settings .settings-row{margin-left:-15px;width:calc(100% + 30px)}
#speech-settings .speech-host-settings h3{margin:5px 0;font-size:11px;color:var(--menu-muted);font-weight:500}
#speech-settings .settings-range{display:grid;grid-template-columns:25px minmax(0,1fr) auto;gap:8px 12px}
#speech-settings .settings-range input{grid-column:2/4;grid-row:2;width:100%;accent-color:var(--menu-accent)}
#speech-settings .settings-range output{grid-column:3;grid-row:1;margin:0;font-size:12px;color:var(--menu-muted)}
#speech-settings .speech-help{margin:8px 0}
#speech-settings .video-picker{flex-wrap:wrap}
#speech-settings .video-picker input{width:100%}
#translator-options .translator-copy-feedback{border:0}
@media(max-width:720px){#playground-settings,#speech-settings,#translator-options{width:292px;padding:7px}.settings-menu .settings-row{padding:11px 14px;font-size:15px}.settings-menu .settings-row select{max-width:110px}}
.settings-menu .settings-row{flex-wrap:nowrap}
#speech-settings.settings-menu .ui-language-setting{align-items:center;flex-wrap:nowrap}
#speech-settings.settings-menu .ui-language-setting select{width:auto;max-width:135px}
@media(max-width:720px){#speech-settings.settings-menu .ui-language-setting select{max-width:110px}}

/* Preserve native dialog focus and Tab order; only suppress pointer-mode rings. */
html[data-settings-input=pointer] .settings-menu :is(button,input,select,textarea,a):focus{outline:none}
html[data-settings-input=pointer] .settings-menu label:has(input:focus-visible){outline:none}