:root{--bg:#060a0f;--bg2:#0b1119;--line:#15222e;--fg:#dfe9f2;--mute:#6f8396;--acc:#19e6ff;--warn:#ff5a5f;--mono:"IBM Plex Mono",ui-monospace,monospace;--sans:Inter,system-ui,sans-serif}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:var(--sans);display:grid;place-items:center;overflow:hidden}
.bg{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 40%,rgba(25,230,255,.07),transparent 60%),repeating-linear-gradient(0deg,transparent 0 39px,rgba(25,230,255,.035) 39px 40px),repeating-linear-gradient(90deg,transparent 0 39px,rgba(25,230,255,.035) 39px 40px)}
.box{position:relative;width:360px;max-width:92vw;padding:32px 28px;background:rgba(11,17,25,.9);border:1px solid var(--line);border-radius:12px;text-align:center;backdrop-filter:blur(8px)}
.mark{margin-bottom:10px}.spin{transform-origin:center;animation:spin 3s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
h1{margin:0;font-family:var(--mono);letter-spacing:.3em;font-size:16px;font-weight:600}
.tag{margin:6px 0 22px;color:var(--mute);font-size:12px}
label{display:block;text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--mute);margin:10px 0}
input{display:block;width:100%;margin-top:6px;height:40px;background:var(--bg2);border:1px solid var(--line);border-radius:8px;color:var(--fg);padding:0 12px;font:14px var(--sans);outline:0}
input:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(25,230,255,.12)}
button{width:100%;height:42px;margin-top:16px;background:var(--acc);border:0;border-radius:8px;font:600 14px var(--sans);color:#06202a;cursor:pointer}
button:disabled{opacity:.6}
.err{margin-top:12px;color:var(--warn);font-size:13px}
.foot{margin:22px 0 0;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--mute)}.foot b{color:var(--acc)}
