:root{color-scheme:light dark;--bg: #f7f8fa;--panel: #ffffff;--border: #dcdfe4;--text: #1c2127;--muted: #5f6b7a;--accent: #d33d2e;--accent-hover: #b8321f;--ok-bg: #e6f4ea;--ok-text: #1e7d34;--err-bg: #fdecea;--err-text: #b3261e}@media(prefers-color-scheme:dark){:root{--bg: #12151a;--panel: #1a1e24;--border: #2d333c;--text: #e8eaed;--muted: #9aa4b1;--ok-bg: #12301b;--ok-text: #6fcf8a;--err-bg: #3a1715;--err-text: #f28b82}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text)}.layout{display:flex;min-height:100vh}.sidebar{width:320px;flex-shrink:0;padding:24px 20px;background:var(--panel);border-right:1px solid var(--border)}.sidebar h2{margin:0 0 20px;font-size:1.1rem}.field{display:block;margin-bottom:14px}.field span{display:block;font-size:.82rem;color:var(--muted);margin-bottom:4px}.field input,.field select{width:100%;padding:8px 10px;font-size:.9rem;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text)}.field input:focus,.field select:focus{outline:2px solid var(--accent);outline-offset:-1px}hr{border:none;border-top:1px solid var(--border);margin:18px 0}.modes{border:none;padding:0;margin:0}.modes legend{font-size:.82rem;color:var(--muted);margin-bottom:8px;padding:0}.mode{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;padding:8px 10px;border-radius:8px;cursor:pointer;margin-bottom:4px}.mode:hover,.mode.selected{background:var(--bg)}.mode input{margin-top:3px}.mode-name{font-weight:600;font-size:.9rem}.mode-caption{grid-column:2;font-size:.78rem;color:var(--muted)}.status{padding:10px 12px;border-radius:8px;font-size:.85rem}.status.ok{background:var(--ok-bg);color:var(--ok-text)}.status.err{background:var(--err-bg);color:var(--err-text)}.status.pending{background:var(--bg);color:var(--muted)}.status pre{margin:8px 0 0;padding:8px;background:#00000026;border-radius:6px;font-size:.78rem;overflow-x:auto}.content{flex:1;max-width:760px;margin:0 auto;padding:48px 32px}.content h1{font-size:1.7rem;margin:0 0 28px}.dropzone{border:2px dashed var(--border);border-radius:12px;padding:40px 24px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;background:var(--panel)}.dropzone:hover,.dropzone.drag{border-color:var(--accent)}.dropzone p{margin:0}.hint{margin-top:16px;padding:12px 14px;border-radius:8px;background:var(--panel);border:1px solid var(--border);color:var(--muted);font-size:.9rem}.primary{display:block;width:240px;margin:24px auto 0;padding:12px 18px;font-size:1rem;font-weight:600;color:#fff;background:var(--accent);border:none;border-radius:10px;cursor:pointer;text-align:center;text-decoration:none}.primary:hover{background:var(--accent-hover)}.download{width:auto;padding:12px 28px}.spinner-box{margin-top:28px;text-align:center;color:var(--muted)}.spinner{width:36px;height:36px;margin:0 auto 12px;border:4px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.done{margin-top:28px;padding:18px;border-radius:10px;background:var(--ok-bg);color:var(--ok-text);text-align:center}.done p{margin:0 0 8px;font-weight:600}.error{margin-top:24px;padding:14px;border-radius:10px;background:var(--err-bg);color:var(--err-text)}.error pre{margin:0;white-space:pre-wrap;word-break:break-word;font-size:.82rem}@media(max-width:720px){.layout{flex-direction:column}.sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border)}.content{padding:28px 20px}}
