.app{max-width:720px;margin:0 auto;padding:48px 20px 80px;display:flex;flex-direction:column;gap:24px}header{text-align:center}header h1{margin:0;font-size:2.2rem;letter-spacing:-.02em}.logo{color:var(--accent)}.tag{margin:4px 0 0;color:var(--muted)}.url-box{display:flex;gap:10px}.url-box input{flex:1;padding:14px 16px;font-size:1rem;border-radius:10px;border:1px solid var(--border);background:var(--panel);color:var(--text);outline:none}.url-box input:focus{border-color:var(--accent)}button{padding:14px 20px;font-size:1rem;font-weight:600;border:none;border-radius:10px;background:var(--accent);color:#fff;cursor:pointer;transition:background .15s ease;white-space:nowrap}button:hover:not(:disabled){background:var(--accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}.format-box{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:20px}.format-box .meta{display:flex;gap:16px;align-items:center}.thumb{width:160px;max-width:40%;border-radius:10px;object-fit:cover}.format-box h2{margin:0;font-size:1.15rem;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.duration{color:var(--muted);font-size:.9rem}.format-box h3{margin:20px 0 10px;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.format-list{display:flex;flex-wrap:wrap;gap:10px}.format-list button{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:10px 16px;font-weight:500}.format-list button:hover:not(:disabled){border-color:var(--accent);background:var(--panel-2)}.progress-box{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:20px}.progress-head{display:flex;justify-content:space-between;margin-bottom:10px;font-weight:500}.bar{height:10px;background:var(--panel-2);border-radius:999px;overflow:hidden}.bar .fill{height:100%;background:var(--accent);border-radius:999px;transition:width .3s ease}.bar-error .fill{background:#f59e0b}.eta{display:inline-block;margin-top:8px;color:var(--muted);font-size:.85rem}.error-text,.error-banner{color:#fca5a5}.error-banner{margin:0;padding:12px 16px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:10px}footer{text-align:center;color:var(--muted);font-size:.8rem;margin-top:auto}@media(max-width:520px){.url-box{flex-direction:column}}:root{--bg: #0f1115;--panel: #1a1d24;--panel-2: #22262f;--text: #e8eaed;--muted: #9aa0a6;--accent: #ef4444;--accent-hover: #dc2626;--border: #2c313a;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased}