:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--fg:#eceff4;--muted:#9aa3b2;--accent:#4c9aff;--accent-strong:#2563eb;--panel:#12141ad1;color:var(--fg);background:#000;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px}*{box-sizing:border-box}[hidden]{display:none!important}a{color:var(--accent)}button,select,.button{font:inherit;color:var(--fg);cursor:pointer;background:#ffffff14;border:1px solid #ffffff24;border-radius:8px;padding:5px 10px}button:hover,select:hover,.button:hover{background:#ffffff29}.primary{background:var(--accent-strong);border-color:var(--accent-strong);color:#fff;padding:8px 18px;text-decoration:none;display:inline-block}.primary:hover{background:#1d4ed8}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}html,body,#app{background:#000;width:100%;height:100%;margin:0;overflow:hidden}#app{position:fixed;inset:0}#stage{position:absolute;inset:0}#stage canvas{cursor:grab;width:100%;height:100%;display:block}#stage canvas.dragging{cursor:grabbing}#video,#preview-video{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed}.overlay{place-items:center;padding:16px;display:grid;position:absolute;inset:0;overflow-y:auto}.card{background:var(--panel);text-align:center;border-radius:14px;width:100%;max-width:480px;padding:clamp(20px,5vw,32px);line-height:1.5}.card h1{margin:0 0 8px;font-size:22px}.card .logo{margin:0 auto 12px;display:block}.card .lead{color:#c9d1dd;margin:0 0 20px}.card .hint{color:var(--muted);margin:10px 0 0;font-size:13px}.features{text-align:left;color:var(--muted);border-top:1px solid #ffffff1a;margin:24px 0 0;padding:20px 0 0;font-size:13px;list-style:none}.features li+li{margin-top:10px}.features strong{color:var(--fg)}.site-links,.report{color:var(--muted);margin:20px 0 0;font-size:12px}#drop .card{border:2px dashed #fff3}.dragover #drop .card,.dragover #drop{border-color:var(--accent)}.dragover #drop{background:#4c9aff1f;display:grid!important}select:disabled{opacity:.4;cursor:default}#bar{padding:28px calc(16px + env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) calc(16px + env(safe-area-inset-left,0px));touch-action:manipulation;background:linear-gradient(#0000,#000000d9);flex-direction:column;gap:8px;transition:opacity .3s;display:flex;position:absolute;bottom:0;left:0;right:0}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.formats{align-items:center;gap:8px;display:flex}.row label{color:var(--muted);align-items:center;gap:6px;display:flex}.seek-row{position:relative}#seek{flex:1;min-width:0}#preview{pointer-events:none;flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;bottom:calc(100% + 8px);transform:translate(-50%)}#preview-frame{background:#000;border:1px solid #ffffff24;border-radius:8px;width:160px;height:90px;display:block}#preview-time{background:var(--panel);font-variant-numeric:tabular-nums;border-radius:4px;padding:1px 6px}#volume{width:80px}input[type=range]{accent-color:var(--accent);cursor:pointer}.time{font-variant-numeric:tabular-nums;min-width:3.5em;color:var(--muted)}#duration{text-align:right}.spacer{flex:1}.note{color:var(--muted);overflow-wrap:anywhere;font-size:12px}.idle #bar{opacity:0;pointer-events:none}.idle #stage canvas{cursor:none}@media (pointer:coarse){#bar button,#bar select{min-height:40px;font-size:16px}#bar button{min-width:44px}#volume{display:none}}@media (width<=640px){.formats{flex:1 0 100%;order:1}.formats label{flex:1;min-width:0}.formats label:has(#stereo){flex:1.6}.formats label span{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.formats select{width:100%;min-width:0}.note{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}}@media (height<=500px){#bar{gap:4px;padding-top:16px}.note{display:none}}
