*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0d0d0d;--surface: #1a1a1a;--surface2: #242424;--border: #2e2e2e;--text: #e8e8e8;--text-muted: #888;--accent: #00d8d8;--accent-dim: #00a8a8;--danger: #e05252;--success: #52e08a;--radius: 8px;--font: "Segoe UI", system-ui, -apple-system, sans-serif;--mono: "Cascadia Code", "Fira Code", "Consolas", monospace}html{font-size:16px}body{background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.6;min-height:100dvh}a{color:var(--accent);text-decoration:underline}a:hover{color:var(--accent-dim)}.page-header{border-bottom:1px solid var(--border);padding:1rem 1.5rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.logo{font-size:1.25rem;font-weight:700;color:var(--accent);letter-spacing:-.02em}.tagline{color:var(--text-muted);font-size:.875rem}.header-links{margin-left:auto;display:flex;gap:1rem;font-size:.875rem}.version-badge{font-family:var(--mono);font-size:.75rem;padding:.125rem .5rem;background:var(--surface2);border:1px solid var(--border);border-radius:999px;color:var(--text-muted)}main{max-width:720px;margin:0 auto;padding:2rem 1.5rem;display:grid;gap:1.5rem}#dropzone{border:2px dashed var(--border);border-radius:var(--radius);padding:3rem 2rem;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;outline:none}#dropzone:hover,#dropzone:focus{border-color:var(--accent)}#dropzone.drag-over{border-color:var(--accent);background:#00d8d80a}#dropzone.error{border-color:var(--danger)}#dropzone svg{display:block;margin:0 auto 1rem;opacity:.4}#drop-message{color:var(--text-muted);font-size:.9rem}#file-input{display:none}#samples-section{text-align:center}.samples-label{font-size:.8rem;color:var(--text-muted);margin-bottom:.5rem}#samples-list{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.sample-btn{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);padding:.35rem .75rem;font-size:.8rem;cursor:pointer;font-family:var(--font);transition:border-color .15s}.sample-btn:hover{border-color:var(--accent);color:var(--accent)}#preview-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.875rem 1rem;display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.badge{font-size:.7rem;font-weight:700;padding:.2rem .5rem;border-radius:4px;font-family:var(--mono)}.badge--format{background:#00d8d826;color:var(--accent)}.preview-filename{font-family:var(--mono);font-size:.875rem;word-break:break-all}.preview-meta{color:var(--text-muted);font-size:.8rem;margin-left:auto}#picker-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.picker-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.picker-label{font-size:.875rem;color:var(--text-muted);white-space:nowrap}#format-select{flex:1;min-width:160px;background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:.5rem .75rem;border-radius:var(--radius);font-size:.875rem;font-family:var(--font);cursor:pointer}#format-select:focus{outline:2px solid var(--accent);outline-offset:2px}.btn{padding:.5rem 1.25rem;border-radius:var(--radius);border:none;font-size:.9rem;font-family:var(--font);font-weight:600;cursor:pointer;transition:opacity .15s}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{background:var(--accent);color:#000}.btn--primary:hover:not(:disabled){opacity:.85}.btn--ghost{background:transparent;border:1px solid var(--border);color:var(--text-muted)}.btn--ghost:hover{border-color:var(--accent);color:var(--accent)}.picker-actions{display:flex;gap:.5rem;flex-wrap:wrap}#progress-section{display:grid;gap:.4rem}.progress-track{height:6px;background:var(--surface2);border-radius:3px;overflow:hidden}#progress-bar-fill{height:100%;background:var(--accent);border-radius:3px;width:0%;transition:width .2s ease}#progress-label{font-size:.8rem;color:var(--text-muted);font-family:var(--mono)}#result-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;display:grid;gap:.5rem}.result-row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}#download-btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--success);color:#000;font-weight:700;padding:.5rem 1.25rem;border-radius:var(--radius);text-decoration:none;font-size:.9rem;transition:opacity .15s}#download-btn:hover{opacity:.85;color:#000}#result-meta{font-family:var(--mono);font-size:.75rem;color:var(--text-muted)}#error-section{background:#e0525214;border:1px solid var(--danger);border-radius:var(--radius);padding:.875rem 1rem}.error-text{font-size:.875rem;color:var(--danger)}.error-text a{color:#f08080}.page-footer{border-top:1px solid var(--border);padding:1rem 1.5rem;text-align:center;font-size:.8rem;color:var(--text-muted)}@media (max-width: 640px){main{padding:1rem;gap:1rem}#dropzone{padding:2rem 1rem}.picker-row{flex-direction:column;align-items:stretch}.picker-label{display:none}.preview-meta{margin-left:0;width:100%}.header-links{display:none}}