*{box-sizing:border-box;margin:0}
:root{--y:#ffd400;--bg:#050505;--ink:#f4f1e8;--mut:#9a968a}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:Alexandria,system-ui,sans-serif;min-height:100vh;overflow-x:hidden}
.strip{height:34px;background:repeating-linear-gradient(90deg,var(--ink) 0 18px,transparent 18px 36px);opacity:.9;-webkit-mask:linear-gradient(#000 0 10px,transparent 10px 24px,#000 24px);mask:linear-gradient(#000 0 10px,transparent 10px 24px,#000 24px)}
.wrap{max-width:1100px;margin:auto;padding:26px 20px 40px}
.top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;font-size:.8rem;letter-spacing:.12em;color:var(--mut)}
.top b{color:var(--y)}
h1{font-weight:900;font-size:clamp(2.8rem,11vw,8rem);line-height:1;margin:30px 0 12px}
h1 em{font-style:normal;background:var(--y);color:var(--bg);padding:0 .12em;display:inline-block;transform:rotate(-2deg)}
.sub{font-weight:300;font-size:1.15rem;max-width:580px;color:#c9c5b8;line-height:1.9}
.stage{margin:34px 0 22px;border:2px solid var(--ink);position:relative;background:radial-gradient(circle at 50% 40%,#1b1b1b,#050505 70%);min-height:220px}
.drop{display:grid;place-items:center;text-align:center;padding:56px 16px;cursor:pointer;min-height:260px;position:relative}
.drop.over{background:#14120a;outline:3px dashed var(--y);outline-offset:-10px}
.drop big{font-family:Anton,sans-serif;font-size:clamp(2rem,7vw,4.2rem);letter-spacing:.08em;color:var(--y)}
.drop small{display:block;margin-top:8px;color:var(--mut)}
.rec{position:absolute;top:14px;right:16px;display:flex;gap:8px;align-items:center;font-size:.75rem;letter-spacing:.2em}
.rec i{width:10px;height:10px;border-radius:50%;background:#ff2b2b;animation:blink 1.2s steps(2) infinite}
@keyframes blink{50%{opacity:.15}}
.linkform{border-top:2px solid var(--ink);padding:16px;display:grid;gap:8px}
.linkform .row{display:flex;gap:10px}
.linkform input{flex:1;min-width:0;background:#0d0d0d;color:var(--ink);border:2px solid #3a3a36;padding:13px;font:inherit;font-size:1rem;border-radius:0;direction:ltr;text-align:left}
.linkform input:focus-visible{outline:3px solid var(--y);outline-offset:2px}
@media(max-width:560px){.linkform .row{flex-direction:column}}
.player{background:#000}
.player video{display:block;width:100%;max-height:70vh;background:#000}
video::cue{background:rgba(0,0,0,.88);color:#fff;font-family:Alexandria,sans-serif;font-size:1.15em;line-height:1.5}
.panel{display:grid;gap:16px;margin-bottom:26px}
.fileinfo{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline}.fileinfo b{font-weight:800;word-break:break-all}.fileinfo span{color:var(--mut);font-size:.85rem;direction:ltr;unicode-bidi:isolate}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:640px){.opts{grid-template-columns:1fr}}
label{display:grid;gap:6px;font-size:.85rem;color:var(--mut)}
select,input[type=range]{width:100%}
select{background:#0d0d0d;color:var(--ink);border:2px solid #3a3a36;padding:12px;font:inherit;font-size:1rem;border-radius:0}
select:focus-visible,.btn:focus-visible{outline:3px solid var(--y);outline-offset:2px}
input[type=range]{accent-color:var(--y)}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btn{padding:15px 24px;font:800 1rem Alexandria,sans-serif;border:2px solid var(--ink);color:var(--ink);background:transparent;cursor:pointer;border-radius:0}
.btn.p{background:var(--y);border-color:var(--y);color:var(--bg)}
.btn.on{background:var(--y);border-color:var(--y);color:var(--bg)}
.btn:disabled{opacity:.35;cursor:not-allowed}
.status{min-height:1.6em;color:#d8d4c6;font-size:.95rem;line-height:1.7}
.status.err{color:#ff8a7a}
.bar{height:14px;border:2px solid var(--ink)}.bar i{display:block;height:100%;width:0;background:var(--y);transition:width .3s}
.tl{display:flex;gap:3px;height:46px;align-items:flex-end}.tl i{flex:1;background:var(--ink);opacity:.22;min-width:2px;transition:opacity .3s,background .3s}.tl i.on{background:var(--y);opacity:1}.tl i.cur{background:var(--y);opacity:.6;animation:blink 1s steps(2) infinite}
.voice .status{grid-column:1/-1}
.voice{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:640px){.voice{grid-template-columns:1fr}}
.lines h2{font-weight:800;font-size:1.3rem;margin:8px 0 12px}
#list{display:grid;gap:0;border-top:1px solid #2a2a27}
.ln{display:grid;grid-template-columns:76px 1fr;gap:14px;padding:12px 4px;border-bottom:1px solid #2a2a27;cursor:pointer;text-align:right;background:none;color:inherit;border-left:0;border-right:0;border-top:0;font:inherit;width:100%}
.ln:hover,.ln.act{background:#14120a}.ln.act .ar{color:var(--y)}
.ln time{font-family:Anton,monospace;color:var(--y);letter-spacing:.06em;direction:ltr;font-size:.9rem;padding-top:3px}
.ln .ar{font-weight:500;line-height:1.7;font-size:1.05rem}
.ln .en{display:block;color:var(--mut);direction:ltr;text-align:left;font-size:.8rem;margin-top:2px;font-weight:300}
.note{color:var(--mut);font-size:.85rem;line-height:1.9;max-width:720px;margin-top:26px}
[hidden]{display:none!important}
