:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background:#0b0d10; color:#f5f6f2; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 70% 0,#203026 0,transparent 35%),#0b0d10; }
.top-actions { position:fixed; z-index:10; top:22px; right:26px; display:flex; gap:8px; }
.top-actions a,.top-actions button { padding:10px 15px; background:#20281f; color:#cfff4d; border:1px solid #52653f; }
.top-actions form { padding:0; border:0; background:transparent; }
main { width:min(900px,calc(100% - 36px)); margin:0 auto; padding:70px 0; }
.eyebrow { color:#cfff4d; font-weight:800; letter-spacing:.22em; font-size:12px; }
h1 { margin:10px 0; font-size:clamp(38px,7vw,72px); letter-spacing:-.05em; }
.intro { color:#9da49c; font-size:18px; margin-bottom:36px; }
form,section { border:1px solid #2b302c; background:rgba(18,21,24,.9); border-radius:20px; padding:24px; }
label { display:block; color:#bac0b9; font-weight:700; margin-bottom:20px; }
input,textarea,select { display:block; width:100%; margin-top:9px; border:1px solid #394039; border-radius:12px; padding:14px; background:#0c0f11; color:#fff; font:inherit; }
textarea { resize:vertical; line-height:1.7; }
.history-picker { margin:-4px 0 24px; padding:0 0 24px; border-bottom:1px solid #2b302c; }
.history-picker-head { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.history-picker-head label { margin:0; }
.history-picker-head button { padding:9px 13px; }
.history-picker select { margin-top:12px; cursor:pointer; }
.history-summary { margin:9px 2px 0; color:#858d85; font-size:13px; }
.lyrics-inputs { margin-top:26px; padding-top:24px; border-top:1px solid #2b302c; }
.file-status { margin:-8px 0 20px; padding:10px 12px; border-radius:9px; background:#172019; color:#cfff4d; font-size:13px; }
.file-status.error { background:#28191b; color:#ff9b9b; }
.separator { display:flex; align-items:center; gap:12px; margin:4px 0 18px; color:#747b74; font-size:13px; }
.separator::before,.separator::after { content:""; height:1px; flex:1; background:#2b302c; }
button,a { border:0; border-radius:10px; padding:13px 18px; background:#cfff4d; color:#111; font-weight:800; cursor:pointer; text-decoration:none; }
button[disabled] { opacity:.5; cursor:wait; }
#status,#result { margin-top:18px; }
.secondary-button { background:#282e29; color:#eef1eb; }
.result-head { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.result-head h2 { margin-bottom:5px; }
.result-note { margin:0; color:#7f877f; font-size:13px; }
.processing-time { margin:8px 0 0; color:#cfff4d; font-size:13px; font-variant-numeric:tabular-nums; }
.downloads { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.result-head a { display:inline-block; }
.confirm-correct { background:#20281f; color:#cfff4d; border:1px solid #52653f; white-space:nowrap; }
.confirm-correct.confirmed { background:#cfff4d; color:#111; border-color:#cfff4d; }
.view-switch { display:flex; padding:4px; border:1px solid #343a34; border-radius:12px; background:#0c0f11; }
.view-switch button { min-width:74px; padding:9px 15px; border-radius:8px; background:transparent; color:#929a92; }
.view-switch button.active { background:#cfff4d; color:#111; }
.result-head .secondary-download { background:#282e29; color:#eef1eb; }
.verify-panel { display:grid; grid-template-columns:minmax(220px,1fr) minmax(280px,1fr); align-items:center; gap:24px; margin:22px 0 8px; padding:18px; border:1px solid #303630; border-radius:14px; background:#0c0f11; }
.verify-panel h3 { margin:0 0 6px; font-size:15px; }
.verify-panel p { margin:0; color:#828982; font-size:13px; line-height:1.55; }
.verify-panel audio { width:100%; }
.cue { display:grid; grid-template-columns:100px 1fr; gap:12px; padding:13px 10px; border-top:1px solid #282e29; align-items:center; border-radius:8px; cursor:pointer; transition:background .15s,color .15s; }
.cue:hover { background:#191e1a; }
.cue.active { background:#26321f; color:#d9ff76; }
.cue.active .time { color:#cfff4d; }
.cue.srt-cue { grid-template-columns:36px 1fr; align-items:start; }
.srt-index { color:#697069; padding-top:3px; }
.srt-content { display:flex; flex-direction:column; gap:7px; }
.srt-content .time { font-size:13px; }
.time { color:#969d96; font-variant-numeric:tabular-nums; }
@media(max-width:650px){.top-actions{position:absolute;top:14px;right:14px}.verify-panel{grid-template-columns:1fr}.cue{grid-template-columns:88px 1fr}.cue.srt-cue{grid-template-columns:30px 1fr}.result-head{align-items:flex-start;flex-direction:column}.downloads{justify-content:flex-start}}
