:root{color-scheme:light dark;--bg: #0b1020;--panel: #131a30;--fg: #e7ecf7;--muted: #9aa6c4;--accent: #6aa6ff;--ok: #2fbf71;--err: #ff6b6b;--border: #1f2848}@media(prefers-color-scheme:light){:root{--bg: #f4f6fb;--panel: #ffffff;--fg: #16213a;--muted: #5b6b8f;--accent: #2b6cff;--ok: #168a4a;--err: #c93a3a;--border: #e3e8f3}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{display:flex;align-items:center;justify-content:center;padding:24px}.card{width:100%;max-width:560px;background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:28px;box-shadow:0 10px 40px #00000026}.card h1{font-size:20px;margin:0 0 6px;letter-spacing:.2px}.card p.sub{margin:0 0 22px;color:var(--muted);font-size:14px}.field{position:relative}.field input[type=text]{width:100%;font-size:22px;padding:22px 18px;border-radius:12px;border:2px solid var(--border);background:transparent;color:var(--fg);outline:none;letter-spacing:1px;transition:border-color .15s,box-shadow .15s}.field input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 4px #6aa6ff2e}.hint{margin-top:12px;font-size:13px;color:var(--muted);min-height:1.4em}.status{margin-top:18px;padding:14px 16px;border-radius:10px;font-size:14px;background:#6aa6ff14;border:1px solid var(--border);color:var(--muted);min-height:1.4em}.status.err{color:var(--err);border-color:#ff6b6b66;background:#ff6b6b14}.status.ok{color:var(--ok);border-color:#2fbf7166;background:#2fbf7114}.meta{margin-top:18px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:12px}.success{text-align:center;padding:20px 0 8px}.check{width:84px;height:84px;margin:0 auto 18px;border-radius:50%;background:var(--ok);display:flex;align-items:center;justify-content:center;animation:pop .35s ease-out}.check svg{width:46px;height:46px}@keyframes pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.08);opacity:1}to{transform:scale(1)}}.retry{margin-top:14px;width:100%;padding:16px;font-size:16px;font-weight:600;border-radius:12px;border:none;background:var(--accent);color:#fff;cursor:pointer}.spinner{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .8s linear infinite;vertical-align:-2px;margin-right:8px}@keyframes spin{to{transform:rotate(360deg)}}