:root{--bg:#0d1117;--card:#161b22;--border:#2b3340;--text:#e6edf3;--muted:#8b949e;--accent:#2f81f7;--accent-text:#fff;--red:#ff7b72}
@media (prefers-color-scheme: light){:root{--bg:#f4f6f8;--card:#fff;--border:#d0d7de;--text:#1f2328;--muted:#59636e;--accent:#0969da;--accent-text:#fff;--red:#cf222e}}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;display:flex;align-items:center;justify-content:center;min-height:100vh;padding:16px}
.box{width:100%;max-width:360px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:32px 24px;text-align:center}
h1{margin:0 0 8px;font-size:26px;letter-spacing:.2px}
.hint{margin:0 0 24px;color:var(--muted);font-size:15px}
input{width:100%;font:600 32px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.35em;text-align:center;padding:12px 8px 12px calc(8px + .35em);border-radius:10px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-variant-numeric:tabular-nums}
input:focus{outline:2px solid var(--accent);outline-offset:1px}
button{margin-top:16px;width:100%;min-height:48px;border:0;border-radius:10px;background:var(--accent);color:var(--accent-text);font:600 17px system-ui,sans-serif;cursor:pointer}
button:disabled{opacity:.6;cursor:default}
.msg{min-height:1.4em;margin:14px 0 0;color:var(--red);font-size:14px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}