:root{color-scheme:light dark;--bg: #f6f6f8;--card: #fff;--fg: #15151a;--muted: #6b6b78;--line: #e3e3ea;--accent: #6d3df5;--ok: #138a4b;--err: #c62828}@media (prefers-color-scheme: dark){:root{--bg: #0f0f13;--card: #1a1a21;--fg: #f2f2f6;--muted: #9a9aa8;--line: #2b2b35;--ok: #4cc58a;--err: #ff8a80}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}.page{max-width:480px;margin:0 auto;padding:24px 16px 48px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}h1{font-size:22px;margin:0}h2{font-size:18px;margin:0 0 12px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px}.card.ok h2{color:var(--ok)}label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}input{font:inherit;padding:12px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--fg)}input:focus{outline:2px solid var(--accent);outline-offset:1px}button{font:inherit;border:0;border-radius:10px;padding:12px 16px;cursor:pointer}button.primary{background:var(--accent);color:#fff;font-weight:600}button.primary:disabled{opacity:.6;cursor:default}button.link{background:none;color:var(--accent);padding:4px 0;align-self:flex-start}.qr{width:100%;max-width:320px;align-self:center;background:#fff;border-radius:12px;padding:8px;image-rendering:pixelated}ol{margin:0;padding-left:20px;color:var(--muted);font-size:15px}.hint{color:var(--muted);font-size:13px;margin:0}.error{color:var(--err);margin:0;font-size:14px}.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px}.list li>div{display:flex;flex-direction:column;gap:4px}.badge{font-size:12px;font-weight:600;width:fit-content;padding:2px 8px;border-radius:999px}.badge.ok{color:var(--ok);border:1px solid var(--ok)}.badge.off,.badge.wait{color:var(--muted);border:1px solid var(--line)}.badge.err{color:var(--err);border:1px solid var(--err)}.tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}.tab{background:var(--card);border:1px solid var(--line);color:var(--fg);padding:8px 14px;border-radius:999px}.tab.on{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}.list .hint{display:block}
