:root{--bg-primary:#0a0a0f;--bg-secondary:#12121a;--bg-card:#1a1a26;--accent:#3b82f6;--accent-hover:#2563eb;--text-primary:#f0f0f5;--text-secondary:#88a;--border:#2a2a3a;--success:#10b981;--error:#ef4444;--font-mono:"IBM Plex Mono", ui-monospace, Consolas, monospace;--font-sans:"Inter", system-ui, "Segoe UI", Roboto, sans-serif;font:16px/1.5 var(--font-sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text-primary);background:var(--bg-primary);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:var(--bg-primary);min-height:100vh;margin:0}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3{font-family:var(--font-mono);color:var(--text-primary);margin:0;font-weight:600}p{margin:0}button{font-family:var(--font-sans)}a{color:var(--accent)}.app{flex-direction:column;min-height:100vh;display:flex}.header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:20px 32px;display:flex}.header__logo{font-family:var(--font-mono);color:var(--accent);letter-spacing:-.02em;font-size:1.25rem;font-weight:600}.header__tagline{font-family:var(--font-mono);color:var(--text-secondary);font-size:.875rem}.main{flex:1;justify-content:center;align-items:center;padding:32px 16px;display:flex}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;width:100%;max-width:560px;padding:32px}.footer{text-align:center;color:var(--text-secondary);border-top:1px solid var(--border);padding:16px;font-size:.8rem}.uploader{flex-direction:column;gap:16px;display:flex}.uploader__dropzone{border:2px dashed var(--border);cursor:pointer;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:300px;padding:24px;transition:border-color .2s,background-color .2s;display:flex}.uploader__dropzone:hover,.uploader__dropzone--active{border-color:var(--accent);background-color:#3b82f60f}.uploader__dropzone svg{color:var(--text-secondary);transition:color .2s}.uploader__dropzone:hover svg,.uploader__dropzone--active svg{color:var(--accent)}.uploader__title{color:var(--text-primary);font-size:1.125rem;font-weight:500}.uploader__hint{color:var(--text-secondary);font-size:.875rem}.uploader__file{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.uploader__filename{font-family:var(--font-mono);color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;overflow:hidden}.uploader__submit{background:var(--accent);color:var(--text-primary);cursor:pointer;border:none;border-radius:6px;flex-shrink:0;padding:10px 20px;font-size:.9rem;font-weight:500;transition:background-color .2s}.uploader__submit:hover{background:var(--accent-hover)}.uploader__error{color:var(--error);font-size:.875rem}.progress{flex-direction:column;gap:28px;display:flex}.progress__title{text-align:center;font-size:1.1rem}.progress__bar{background:var(--border);border-radius:2px;width:100%;height:4px;overflow:hidden}.progress__bar-fill{background:var(--accent);border-radius:2px;height:100%;transition:width .4s}.progress__steps{flex-direction:column;gap:14px;margin:0;padding:0;list-style:none;display:flex}.progress__step{color:var(--text-secondary);align-items:center;gap:12px;font-size:.95rem;transition:color .2s;display:flex}.progress__step-icon{border:1px solid;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:.75rem;display:inline-flex}.progress__step--done{color:var(--success)}.progress__step--done .progress__step-icon{background:#10b98126}.progress__step--current{color:var(--accent)}.progress__step--current .progress__step-icon{background:#3b82f626;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 #3b82f673}50%{box-shadow:0 0 0 6px #3b82f600}}.result{text-align:center;flex-direction:column;align-items:center;gap:16px;display:flex}.result__status{align-items:center;gap:12px;display:flex}.result__check{width:40px;height:40px;color:var(--success);background:#10b98126;border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;font-weight:700;display:inline-flex}.result__title{font-size:1.25rem}.result__preview{background:#fff;border-radius:8px;justify-content:center;align-items:center;width:400px;max-width:100%;height:300px;padding:16px;display:flex;overflow:hidden}.result__preview svg{width:100%;height:100%;display:block}.result__error{color:var(--error);font-size:.875rem}.result__download{background:var(--accent);color:var(--text-primary);border-radius:8px;align-items:center;gap:8px;padding:14px 28px;font-size:1rem;font-weight:500;text-decoration:none;transition:background-color .2s;display:inline-flex}.result__download:hover{background:var(--accent-hover)}.result__compat{color:var(--text-secondary);margin-top:-8px;font-size:.8rem}.result__reset{background:var(--bg-secondary);color:var(--text-secondary);border:1px solid var(--border);cursor:pointer;border-radius:6px;margin-top:8px;padding:10px 20px;font-size:.875rem;transition:background-color .2s,color .2s}.result__reset:hover{background:var(--border);color:var(--text-primary)}
