.wto-typing-test{background:var(--wto-bg)!important;color:var(--wto-text)}.wto-site-header{position:sticky;top:0;z-index:8;padding:4px 0;background:var(--wto-bg)}.wto-brand,.wto-word.is-current,.wto-word i.is-correct-letter{color:var(--wto-text)!important}.wto-option-set,.wto-keyboard,.wto-custom-time-dialog,.wto-preferences-dialog{background:color-mix(in srgb,var(--wto-bg) 88%,#000)!important}.wto-option-set button.is-active,.wto-live-stats strong,.wto-stats strong,.wto-result-details strong,.wto-score strong,.wto-brand-mark{color:var(--wto-accent)!important}.wto-brand-mark{border-color:var(--wto-accent)!important}.wto-word i.is-current-letter:before{background:var(--wto-accent)!important}.wto-app-footer{position:absolute;right:44px;bottom:18px;left:44px;z-index:5;display:flex;align-items:center;justify-content:space-between;color:var(--wto-muted);font-size:11px}.wto-app-footer button{display:flex;align-items:center;gap:7px;border:0;background:none;color:var(--wto-muted);font:inherit;cursor:pointer}.wto-app-footer i{width:12px;height:12px;border:2px solid var(--wto-accent);border-radius:50%;box-shadow:7px 0 0 var(--wto-accent),14px 0 0 var(--wto-text)}.wto-theme-dialog{width:min(92vw,590px);max-height:min(78vh,680px);border:1px solid color-mix(in srgb,var(--wto-accent) 45%,transparent);border-radius:15px;padding:0;background:var(--wto-bg);color:var(--wto-text);font-family:inherit;box-shadow:0 25px 80px #0009}.wto-theme-dialog::backdrop{background:#101216b3;backdrop-filter:blur(5px)}.wto-theme-dialog-inner{padding:22px}.wto-theme-dialog input{box-sizing:border-box;width:100%;margin-bottom:12px;border:1px solid color-mix(in srgb,var(--wto-muted) 60%,transparent);border-radius:8px;padding:12px;background:color-mix(in srgb,var(--wto-bg) 83%,#000);color:var(--wto-text);font:inherit;outline:none}.wto-theme-dialog input:focus{border-color:var(--wto-accent)}.wto-theme-list{max-height:min(54vh,480px);overflow:auto;padding-right:4px}.wto-theme-option{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:7px;padding:10px;background:transparent;color:var(--wto-text);font:inherit;text-align:left;cursor:pointer}.wto-theme-option:hover,.wto-theme-option.is-selected{background:color-mix(in srgb,var(--wto-accent) 17%,transparent)}.wto-theme-option i{display:flex;gap:5px;padding:3px;border-radius:99px;background:color-mix(in srgb,var(--wto-muted) 28%,transparent)}.wto-theme-option b{display:block;width:12px;height:12px;border-radius:50%}.wto-theme-dialog p{margin:13px 0 0;color:var(--wto-muted);font-size:11px;text-align:center}.wto-no-themes{padding:20px!important}@media(max-width:700px){.wto-site-header{padding-top:0}.wto-app-footer{right:19px;bottom:12px;left:19px;font-size:9px}.wto-typing-test{padding-bottom:55px}.wto-theme-dialog-inner{padding:17px}.wto-theme-option{padding:9px;font-size:13px}}
.wto-typing-test.is-running .wto-site-header,.wto-typing-test.is-running .wto-settings{opacity:1;pointer-events:auto;transform:none;height:auto;overflow:visible}.wto-typing-test.is-running .wto-site-header{margin:0}.wto-typing-test.is-running .wto-settings{margin:38px 0 32px}

/* Preferences controls must remain readable in every light and dark theme. */
.wto-preferences-dialog select { border-color: color-mix(in srgb, var(--wto-muted) 55%, transparent) !important; background: color-mix(in srgb, var(--wto-bg) 86%, #000) !important; color: var(--wto-text) !important; }
.wto-preferences-dialog select:focus { border-color: var(--wto-accent) !important; outline: 1px solid color-mix(in srgb, var(--wto-accent) 42%, transparent); }
.wto-preferences-dialog select option, .wto-preferences-dialog select optgroup { background: var(--wto-bg); color: var(--wto-text); }
.wto-custom-time-dialog { border-color: color-mix(in srgb, var(--wto-muted) 55%, transparent) !important; background: color-mix(in srgb, var(--wto-bg) 88%, #000) !important; color: var(--wto-text) !important; }
.wto-custom-time-dialog input { border-color: color-mix(in srgb, var(--wto-muted) 55%, transparent) !important; background: color-mix(in srgb, var(--wto-bg) 86%, #000) !important; color: var(--wto-text) !important; }
.wto-custom-time-dialog .wto-dialog-title { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 0 0 8px !important; }.wto-custom-time-dialog .wto-dialog-title button { padding: 0; font-size: 27px; line-height: 1; }.wto-custom-time-dialog .wto-dialog-title button:hover { color: var(--wto-accent); }
