@import"https://fonts.googleapis.com/css2?family=Silkscreen&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--bg-dark: #0a0a0a;--bg-panel: #111;--border-color: #2a2a2a;--accent: #00ccff;--accent-dim: #006680;--text: #999;--text-bright: #ccc;--success: #00ff66;--font-pixel: "Silkscreen", monospace;--font-mono: "Monaco", "Consolas", monospace}html{font-size:12px}body{min-height:100vh;display:flex;flex-direction:column;font-family:var(--font-mono);line-height:1.5;color:var(--text);background-color:var(--bg-dark)}#app{flex:1;max-width:720px;margin:0 auto;padding:2rem;width:100%}header{text-align:center;margin-bottom:3rem}header h1{font-family:var(--font-pixel);font-size:1.5rem;font-weight:400;color:var(--accent);text-transform:uppercase;letter-spacing:.2em;margin-bottom:.75rem}header p{font-size:.9rem;color:var(--text);text-transform:lowercase}header .description{margin-top:1.5rem;font-size:.85rem;color:var(--text);max-width:480px;margin-left:auto;margin-right:auto;line-height:1.6}main{display:flex;flex-direction:column;gap:1.5rem}section{background:var(--bg-panel);border:1px solid var(--border-color);padding:1.5rem}.upload-section{text-align:center}.file-input-wrapper{position:relative;display:inline-block}#videoInput{position:absolute;opacity:0;width:0;height:0}#videoInput+label{display:inline-block;padding:.75rem 1.5rem;background:transparent;color:var(--accent);border:1px solid var(--accent);cursor:pointer;font-family:var(--font-pixel);font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;transition:all .15s}#videoInput+label:hover{background:var(--accent);color:var(--bg-dark)}.file-info{margin-top:1rem;color:var(--text);font-size:.85rem;font-family:var(--font-mono)}.conversion-section{text-align:center}button{padding:.75rem 1.5rem;font-family:var(--font-pixel);font-size:.85rem;font-weight:400;text-transform:uppercase;letter-spacing:.1em;border:1px solid;cursor:pointer;transition:all .15s}#convertBtn{background:transparent;color:var(--success);border-color:var(--success)}#convertBtn:hover:not(:disabled){background:var(--success);color:var(--bg-dark)}#convertBtn:disabled{color:var(--border-color);border-color:var(--border-color);cursor:not-allowed}.progress-container{display:none;margin-top:1.5rem}.progress-bar{width:0;height:4px;background:var(--accent);transition:width .3s}.progress-text{margin-top:.5rem;color:var(--text);font-size:.85rem;font-family:var(--font-mono)}.error-section{display:none}.error-section h2{font-family:var(--font-pixel);font-size:1rem;font-weight:400;color:#f44;text-transform:uppercase;letter-spacing:.15em;margin-bottom:1rem}.error-section pre{font-family:var(--font-mono);font-size:.75rem;color:var(--text);background:var(--bg-dark);border:1px solid var(--border-color);padding:1rem;overflow-x:auto;white-space:pre-wrap;word-break:break-word;max-height:300px;overflow-y:auto}.output-section{display:none;text-align:center}.output-section h2{font-family:var(--font-pixel);font-size:1rem;font-weight:400;color:var(--text-bright);text-transform:uppercase;letter-spacing:.15em;margin-bottom:1rem}#outputVideo{width:100%;max-width:100%;border:1px solid var(--border-color);margin-bottom:1rem;background:#000}#downloadBtn{background:transparent;color:var(--accent);border-color:var(--accent)}#downloadBtn:hover{background:var(--accent);color:var(--bg-dark)}footer{text-align:center;padding:2rem;color:var(--text);font-size:.85rem;margin-top:2rem}footer a{color:var(--accent);text-decoration:none;transition:color .15s}footer a:hover{color:var(--text-bright)}@media(max-width:640px){#app{padding:1rem}header h1{font-size:1.2rem;letter-spacing:.1em}section{padding:1rem}}
