:root{--motion-blue:#2864ef;--motion-cyan:#51d8d0}
/* Appearance covers forms, results, dialogs and account UI as well as the shell. */
:root{color-scheme:light}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:40px;min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);font-size:11px;flex-shrink:0}
.theme-toggle:hover{border-color:var(--blue);box-shadow:0 2px 12px #2864ef18}
.theme-toggle svg{height:18px;width:18px}.theme-moon{display:none}.auth-appearance{float:right;margin:-8px -8px 8px 8px}
:root[data-theme="dark"]{color-scheme:dark;--paper:#0b1423;--white:#142136;--ink:#e3ecfa;--muted:#acbad0;--line:#2b3d55;--blue:#98b9ff;--blue-dark:#bad0ff;--green:#73d9b3;--motion-blue:#98b9ff}
[data-theme="dark"] .theme-sun{display:none}[data-theme="dark"] .theme-moon{display:block}
[data-theme="dark"] :is(.sidebar,.topbar,.panel,.stepper,.account-quota,dialog,.auth-dialog){background:#142136;color:var(--ink);border-color:var(--line);box-shadow:0 4px 20px #00000018}
[data-theme="dark"] :is(.nav-item:hover,.nav-item.selected,.count,.segments,.feature-tags span,.history-icon,.auth-mark,.privacy-icon,.avatar,.mini-symbol,.upload-icon,.icon-button:hover){background:#203656;color:#aecbff;border-color:#365077}
[data-theme="dark"] .local-card{background:linear-gradient(145deg,#192b44,#142238);border-color:var(--line)}
[data-theme="dark"] :is(.nav-item,.breadcrumb,.breadcrumb strong,.lang-tag,.local-card p,.local-card button,.help-link,.sidebar-foot small,.workspace-label,.workspace-label span,.section-number,.subtle,.eyebrow,.page-heading p,.edition,.step,.step small,.drop-zone small,.drop-zone>span:not(.upload-icon),.transcript-heading label>span,.text-footer,.text-note,.option-row p,.generate-row>span,.preview-info p,.quick-tip p,.quick-tip>span:first-child,.result-hint,.check-label,.cue-header,.cue-row>span,.history-empty,.history-title small,footer,.auth-dialog p,.auth-dialog small,dialog p,.server-details>span,.help-steps,.account-quota small,.account-quota p,.privacy-strip p){color:#acbad0}
[data-theme="dark"] :is(.edition,.quick-tip,.textarea-wrap,.text-footer){border-color:var(--line)}
[data-theme="dark"] .step>span{background:#1a2b43;border-color:var(--line)}
[data-theme="dark"] .step.current>span{background:#2864ef;border-color:#2864ef;color:#fff}
[data-theme="dark"] .step.completed>span{background:#183a33;border-color:#315e4d;color:#91e1bf}
[data-theme="dark"] .drop-zone{background:#0f1c2e;border-color:#46658d}
[data-theme="dark"] :is(.drop-zone:hover,.drop-zone.dragover){background:#1c3150;border-color:#9dbfff}
[data-theme="dark"] .drop-zone.has-file{background:#132e29;border-color:#3f7a60}
[data-theme="dark"] :is(textarea,.auth-dialog input,.time-inputs input){background:#0e1b2e;color:var(--ink);border-color:#3b506e}
[data-theme="dark"] :is(textarea,input)::placeholder{color:#97a9c2}
[data-theme="dark"] .textarea-wrap:focus-within{border-color:#98b9ff;box-shadow:0 0 0 3px #98b9ff20}
[data-theme="dark"] :is(.segments button.chosen,.cue-row.active,.cue-text:hover,.cue-text:focus,.cue-header,.server-details){background:#223752;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .cue-text{color:var(--ink)}
[data-theme="dark"] .primary{background:#2864ef;color:#fff;--blue:#2864ef}
[data-theme="dark"] .primary:hover:not(:disabled){background:#245ad9}
[data-theme="dark"] .primary:disabled{background:#2d4266;color:#c4d2e7;opacity:.7}
[data-theme="dark"] .privacy-strip{background:linear-gradient(100deg,#1b2e49,#142d34);border-color:#314b64;color:var(--ink)}
[data-theme="dark"] :is(.account-quota strong,.plan-tag,.privacy-badge){color:#afcbff}
[data-theme="dark"] .telegram-contact{background:#1c3652;color:#b4d7ff;border-color:#426389}
[data-theme="dark"] .telegram-contact:hover{background:#294765}
[data-theme="dark"] :is(.retention-banner,.review-badge,.missing-words span){background:#362d1c;border-color:#685330;color:#f0d08e}
[data-theme="dark"] .retention-banner strong{color:#ffda8e}
[data-theme="dark"] .result-tools{color:#dfc58e}
[data-theme="dark"] :is(.error-box,.history-state.error){background:#38242a;border-color:#75454a;color:#ffc1bb}
[data-theme="dark"] :is(.error-box button,.edit-error){color:#ffc1bb}
[data-theme="dark"] :is(.server-pill.online,.history-state){background:#18352e;border-color:#345f51;color:#9be1c6}
[data-theme="dark"] .server-pill.offline{background:#352c21;border-color:#65513c;color:#f2cca0}
[data-theme="dark"] .progress-track{background:#2b4161}
[data-theme="dark"] dialog::backdrop{background:#030914ae}
[data-theme="dark"] .toast{background:#dce9fb;color:#17283f}
@media(max-width:760px){.theme-toggle{padding:6px;min-width:38px;min-height:38px}.top-actions .theme-label{display:none}}
@media(max-width:470px){.breadcrumb{font-size:0;gap:0}.breadcrumb>span{display:none}.top-actions{gap:6px}.server-pill{min-width:0;max-width:135px}#connectionText{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
.account-quota{display:flex;flex-wrap:wrap;gap:15px;align-items:center;justify-content:space-between;background:#fff;border:1px solid #dbe7fb;border-radius:14px;padding:17px 20px;margin-bottom:20px}.account-quota>div{display:grid;gap:4px;min-width:180px}.account-quota strong{font-size:21px;color:#244780;font-variant-numeric:tabular-nums}.account-quota small,.account-quota p{color:#76869c;font-size:11px}.account-quota p{flex-basis:100%}.account-quota meter{width:100%;height:8px}.plan-tag{font-size:10px;letter-spacing:1px;color:#2864ef;font-weight:700}.telegram-contact{display:inline-flex;align-items:center;justify-content:center;border:1px solid #b9d9ff;background:#eef6ff;color:#2466b2;border-radius:10px;padding:10px 14px;font-weight:600;font-size:12px;transition:background .2s,transform .2s}.telegram-contact:hover{background:#deedff;transform:translateY(-1px)}.auth-dialog .telegram-contact{display:flex;margin-top:12px}.auth-dialog .plan-summary{margin-top:15px;font-size:11px}
body{overflow-x:hidden}
body::before,body::after{content:"";position:fixed;z-index:-2;pointer-events:none;border-radius:50%;filter:blur(1px);opacity:.45}
body::before{width:42vw;height:42vw;right:-20vw;top:8vh;background:radial-gradient(circle,rgba(40,100,239,.13),transparent 68%);animation:ambientDrift 18s ease-in-out infinite alternate}
body::after{width:32vw;height:32vw;left:12vw;bottom:-24vw;background:radial-gradient(circle,rgba(81,216,208,.1),transparent 70%);animation:ambientDrift 24s ease-in-out -7s infinite alternate-reverse}
.brand img{animation:logoBreath 4s ease-in-out infinite}
.privacy-strip{display:flex;align-items:center;gap:14px;background:linear-gradient(100deg,rgba(237,244,255,.95),rgba(244,251,251,.95));border:1px solid #dae7fb;border-radius:12px;padding:12px 16px;margin:0 0 18px;color:#3d5270;box-shadow:0 8px 24px rgba(33,74,145,.05)}
.privacy-strip p{font-size:11px;line-height:1.65;color:#7b889b}.privacy-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#e1edff;color:var(--motion-blue);font-size:22px}.privacy-badge{margin-left:auto;font-size:9px;font-weight:700;letter-spacing:1px;color:var(--motion-blue);white-space:nowrap}
.retention-banner{display:flex;justify-content:space-between;align-items:center;background:#fff8e8;border:1px solid #f5dfaa;border-radius:8px;color:#85611b;padding:8px 12px;margin:0 0 13px;font-size:11px}.retention-banner strong{font-variant-numeric:tabular-nums;color:#b37709}
.primary{position:relative;overflow:hidden}.primary::after{content:"";position:absolute;inset:0;transform:translateX(-130%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transition:transform .6s ease}.primary:hover::after{transform:translateX(130%) skewX(-18deg)}
.panel,.preview-card,.preview-info,.quick-tip{animation:riseIn .55s cubic-bezier(.2,.8,.2,1) both}.preview-card{animation-delay:.08s}.preview-info{animation-delay:.15s}.quick-tip{animation-delay:.22s}
.sound-stage{isolation:isolate}.sound-stage::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 50%,rgba(40,100,239,.16),transparent 58%);animation:stagePulse 8s ease-in-out infinite}
.waveform i{animation:waveFloat 1.7s ease-in-out var(--delay) infinite alternate}.preview-card.playing .waveform i{animation-duration:.55s}
@keyframes ambientDrift{to{transform:translate3d(4vw,2vh,0) scale(1.12)}}
@keyframes logoBreath{0%,100%{filter:drop-shadow(0 0 0 rgba(40,100,239,0))}50%{filter:drop-shadow(0 0 10px rgba(40,100,239,.3));transform:translateY(-1px)}}
@keyframes riseIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes stagePulse{0%,100%{opacity:.45;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}
@keyframes waveFloat{to{transform:scaleY(.55);opacity:.7}}
@media(max-width:760px){.privacy-strip{align-items:flex-start;padding:11px 12px}.privacy-strip p{font-size:10px}.privacy-badge{font-size:8px}.retention-banner{font-size:10px}}
@media(prefers-reduced-motion:reduce){body::before,body::after,.brand img,.panel,.preview-card,.preview-info,.quick-tip,.sound-stage::after,.waveform i{animation:none}.primary::after{display:none}}
.auth-dialog{border:1px solid #dbe6f8;border-radius:18px;padding:30px;max-width:390px;width:calc(100% - 28px);color:#192b45;box-shadow:0 24px 80px rgba(21,54,111,.22)}.auth-dialog::backdrop{background:rgba(15,31,58,.38);backdrop-filter:blur(5px)}.auth-dialog h2{margin:8px 0 4px}.auth-dialog p{color:#7b889b;font-size:12px}.auth-dialog form{display:grid;gap:8px;margin-top:18px}.auth-dialog label{font-size:11px;font-weight:700}.auth-dialog input{border:1px solid #dbe4f1;border-radius:9px;padding:11px 12px;text-transform:uppercase}.auth-dialog small{display:block;color:#9aa6b6;font-size:10px;margin-top:14px}.auth-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:15px;background:#edf3ff;margin-bottom:12px}