:root{color-scheme:dark;--bg:#0d1117;--surface:#151a21;--border:#30363d;--field:#0b0f14;--text:#d8dee9;--accent:#8fbc8f;--error:#ef6b73}
:root[data-theme=light]{color-scheme:light;--bg:#eef1f4;--surface:#fff;--border:#c8ced6;--field:#f5f7f9;--text:#20252b;--accent:#477a52;--error:#b4232c}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}button,input{font:inherit}
.background{position:fixed;inset:0;background-image:linear-gradient(color-mix(in srgb,var(--border) 22%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--border) 22%,transparent) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.page{position:relative;min-height:100vh;display:grid;place-items:center;padding:20px}.shell{width:min(440px,100%);overflow:hidden;border:1px solid var(--border);border-radius:8px;background:var(--surface);box-shadow:0 25px 70px rgb(0 0 0/24%)}
.bar{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid var(--border)}.dots{display:flex;gap:7px}.dots span{width:9px;height:9px;border-radius:50%;background:var(--border)}.icon{border:0;background:transparent;color:var(--text);padding:7px;cursor:pointer}
.access{padding:64px 44px 72px}.message{margin:0 0 24px;font-size:12px;line-height:1.6;color:var(--text)}form{display:grid;gap:16px}input{width:100%;height:44px;padding:0 13px;border:1px solid var(--border);border-radius:4px;outline:0;background:var(--field);color:var(--text)}input:focus{border-color:var(--accent)}button[type=submit]{height:44px;border:1px solid var(--accent);border-radius:4px;background:transparent;color:var(--accent);cursor:pointer}button:disabled{opacity:.5}.error{min-height:18px;margin:0;color:var(--error);text-align:center;font-size:12px}
@media(max-width:520px){.page{padding:0}.shell{min-height:100vh;border:0;border-radius:0}.access{padding:72px 24px}}