:root[data-theme=dark]{--bg:#1a1a2e;--card-bg:#16213e;--card-border:#0f3460;--text:#e0e0e0;--text-dim:#888;--text-body:#c0c0c0;--input-bg:#0f3460;--input-border:#1a4a8a;--accent:#e94560;--accent-hover:#c73652;--progress-track:#0f3460;--save-btn:#2ecc71;--save-btn-hover:#27ae60;--cancel-btn:#555;--cancel-btn-hover:#444;--clear-btn:#1a4a8a;--clear-btn-hover:#2a5aaa;--footer-text:#fff;--footer-link:#ccc;--footer-link-hover:#fff;--back-link:#888;--back-link-hover:#ccc;--toggle-bg:#0f3460;--toggle-border:#1a4a8a;--toggle-color:#ccc}:root[data-theme=light]{--bg:#f0f4f8;--card-bg:#fff;--card-border:#dde3ed;--text:#1a1a2e;--text-dim:#666;--text-body:#333;--input-bg:#f8fafc;--input-border:#c0cad8;--accent:#e94560;--accent-hover:#c73652;--progress-track:#e4eaf2;--save-btn:#2ecc71;--save-btn-hover:#27ae60;--cancel-btn:#999;--cancel-btn-hover:#777;--clear-btn:#4a7ab5;--clear-btn-hover:#5a8ac5;--footer-text:#333;--footer-link:#555;--footer-link-hover:#111;--back-link:#888;--back-link-hover:#333;--toggle-bg:#eef2f7;--toggle-border:#c0cad8;--toggle-color:#555}*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}.card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:2rem;width:100%;max-width:520px;position:relative}.card-header{display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:1.5rem}h1{font-size:1.4rem;color:var(--accent)}.card-404 h1{color:var(--text)}.theme-toggle{background:var(--toggle-bg);border:1px solid var(--toggle-border);color:var(--toggle-color);padding:.25rem .6rem;border-radius:6px;font-size:1rem;cursor:pointer;line-height:1.4;width:auto;margin-top:0;font-weight:400}.theme-toggle:hover:not(:disabled){opacity:.75;background:var(--toggle-bg)}.card-header .theme-toggle{position:absolute;right:0}.card-404>.theme-toggle{position:absolute;top:1rem;right:1rem}label{display:block;font-size:.8rem;color:var(--text-dim);margin-bottom:.3rem;text-transform:uppercase;letter-spacing:.05em}input,select{width:100%;background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);padding:.6rem .8rem;border-radius:6px;font-size:.95rem;margin-bottom:1rem}input:focus,select:focus{outline:2px solid var(--accent)}select:disabled{opacity:.4;cursor:not-allowed}.row{display:flex;gap:1rem}.row>div{flex:1}button{width:100%;background:var(--accent);color:#fff;border:none;padding:.75rem;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:.5rem}button:disabled{opacity:.5;cursor:not-allowed}button:hover:not(:disabled){background:var(--accent-hover)}.progress-section{display:none;margin-top:1.5rem;border-top:1px solid var(--card-border);padding-top:1.5rem}.progress-bar-track{background:var(--progress-track);border-radius:999px;height:8px;overflow:hidden;margin-bottom:.5rem}.progress-bar-fill{height:100%;background:var(--accent);border-radius:999px;width:0%;transition:width .3s ease}.progress-text{font-size:.85rem;color:var(--text-dim);margin-bottom:.5rem}.filename{font-size:.9rem;color:var(--text);margin-bottom:.5rem;word-break:break-all}.error-msg{color:var(--accent);font-size:.9rem;margin-top:.5rem}#saveBtn{background:var(--save-btn);margin-top:.75rem;display:none}#saveBtn:hover:not(:disabled){background:var(--save-btn-hover)}#cancelBtn{background:var(--cancel-btn);margin-top:.5rem;display:none}#cancelBtn:hover:not(:disabled){background:var(--cancel-btn-hover)}#clearBtn{background:var(--clear-btn);margin-top:.5rem;display:none}#clearBtn:hover:not(:disabled){background:var(--clear-btn-hover)}.footer{margin-top:1.25rem;text-align:center;font-size:.78rem;color:var(--footer-text)}.footer a{color:var(--footer-link);text-decoration:none}.footer a:hover{color:var(--footer-link-hover)}h2{font-size:.85rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;margin-top:1.25rem;margin-bottom:.5rem}p,li{font-size:.95rem;color:var(--text-body);line-height:1.6}ul{padding-left:1.2rem}li{margin-bottom:.3rem}.back{display:block;margin-top:1.75rem;text-align:center;color:var(--back-link);font-size:.85rem;text-decoration:none}.back:hover{color:var(--back-link-hover)}.card-404{text-align:center}.code{font-size:4rem;font-weight:700;color:var(--accent);line-height:1;margin-bottom:.5rem}.btn-primary{display:inline-block;background:var(--accent);color:#fff;padding:.6rem 1.5rem;border-radius:6px;font-size:.95rem;font-weight:600;text-decoration:none}.btn-primary:hover{background:var(--accent-hover)}