:root{color-scheme:dark;--bg:#080b10;--text:#f2f4f8;--muted:#8994a3;--yellow:#F9D002;--line:rgba(255,255,255,.1)}
*{box-sizing:border-box}body{min-height:100vh;margin:0;color:var(--text);background:radial-gradient(ellipse at 50% 35%,rgba(249,208,2,.07),transparent 36rem),var(--bg);font-family:Inter,"Segoe UI",Arial,sans-serif}
button,input,a{font:inherit}.shell{width:min(1120px,calc(100% - 64px));min-height:100vh;margin:auto;display:flex;flex-direction:column}
header{min-height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font-size:13px;font-weight:850;letter-spacing:2px}
.brand small{display:block;margin-top:4px;color:var(--muted);font-size:8px;font-weight:650}
.mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(249,208,2,.34);border-radius:11px;background:rgba(249,208,2,.12);color:#F9D002;font-size:17px}
.back{color:#aeb8c5;font-size:11px;text-decoration:none}.back:hover,footer a:hover{color:white}
main{flex:1;display:grid;place-items:center;padding:42px 0}
.card{width:min(440px,100%);padding:clamp(25px,5vw,40px);border:1px solid var(--line);border-radius:20px;background:rgba(17,22,30,.9);box-shadow:0 24px 80px rgba(0,0,0,.38);backdrop-filter:blur(16px)}
.kicker{margin:0 0 12px;color:var(--yellow);font-size:8px;font-weight:800;letter-spacing:2px}
h1{margin:0;font-size:clamp(28px,6vw,36px);line-height:1.12;letter-spacing:-.055em}
.intro{margin:11px 0 24px;color:#9ca6b4;font-size:13px;line-height:1.6}
.setup,.status{margin:0 0 16px;padding:12px;border:1px solid rgba(255,193,97,.24);border-radius:9px;background:rgba(255,193,97,.07);color:#e6c795;font-size:11px;line-height:1.6}
.status{border-color:rgba(249,208,2,.24);background:rgba(249,208,2,.07);color:#F9D002}
.status[data-state=error]{border-color:rgba(255,92,111,.25);background:rgba(255,92,111,.08);color:#ffb5bf}
.status[data-state=success]{border-color:rgba(101,219,165,.24);background:rgba(101,219,165,.07);color:#a7e8c8}
form{display:grid;gap:9px}label{margin-top:5px;color:#dce1e8;font-size:11px;font-weight:680}
input{width:100%;min-height:45px;padding:0 13px;border:1px solid rgba(255,255,255,.12);border-radius:9px;outline:none;background:rgba(4,7,11,.48);color:var(--text);font-size:12px}
input::placeholder{color:#626e7c}input:focus{border-color:rgba(249,208,2,.65);box-shadow:0 0 0 3px rgba(249,208,2,.09)}
.submit{min-height:47px;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;border:0;border-radius:9px;background:linear-gradient(135deg,#F9D002,#c49d00);color:#17150a;font-size:12px;font-weight:800;cursor:pointer}
.submit:hover{filter:brightness(1.08)}.submit:disabled,.providers button:disabled{opacity:.65;cursor:wait}
.divider{display:flex;align-items:center;gap:12px;margin:22px 0 14px;color:#687482;font-size:8px;font-weight:750;letter-spacing:1.2px;white-space:nowrap}
.divider:before,.divider:after{height:1px;flex:1;background:var(--line);content:""}
.providers{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.providers button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 9px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.035);color:#e4e8ee;font-size:10px;font-weight:680;cursor:pointer}
.providers button:hover{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.075)}
.providers b{width:21px;height:21px;display:grid;place-items:center;border-radius:6px;font-size:13px}.google{background:#f4f5f7;color:#4285f4}.discord{background:#5865f2;color:white}
.switch{margin:22px 0 0;color:#858f9d;text-align:center;font-size:11px}.switch a{margin-left:4px;color:#F9D002;font-weight:700;text-decoration:none}.switch a:hover{color:white}
.account-card{width:min(520px,100%)}
.account-card .intro strong{color:#e6edf5;font-weight:700}
.account-details{margin-top:23px}
.account-facts{display:grid;gap:10px;margin:0 0 18px}
.account-facts div{padding:13px 15px;border:1px solid var(--line);border-radius:10px;background:rgba(4,7,11,.28)}
.account-facts dt{margin-bottom:6px;color:#788493;font-size:9px;font-weight:750;letter-spacing:1.25px;text-transform:uppercase}
.account-facts dd{margin:0;color:#e2e7ee;font-size:12px;overflow-wrap:anywhere}
.account-links{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:11px}
.account-links a{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.035);color:#dbe2ea;font-size:10px;font-weight:700;text-decoration:none;transition:background 180ms ease,border-color 180ms ease,color 180ms ease}
.account-links a:hover{border-color:rgba(249,208,2,.4);background:rgba(249,208,2,.08);color:#fff}
.account-security{margin-top:19px;padding-top:16px;border-top:1px solid var(--line)}
.account-security p{margin:0 0 9px;color:#8994a3;font-size:10px;line-height:1.5}
.account-signout--global{min-height:40px;border:1px solid rgba(255,115,125,.24);background:rgba(255,83,101,.07);color:#ffc0c7;font-size:10px}
.account-signout--global:hover{filter:brightness(1.12)}
.account-signout{width:100%;cursor:pointer}
.account-signout:disabled{opacity:.65;cursor:wait}
footer{min-height:56px;display:flex;align-items:center;justify-content:center;gap:8px;border-top:1px solid var(--line);color:#66717f;font-size:8px;font-weight:700;letter-spacing:1.1px}
footer a{color:#9ba6b4;text-decoration:none}[hidden]{display:none!important}
:focus-visible{outline:2px solid #F9D002;outline-offset:3px}
@media(max-width:520px){.shell{width:calc(100% - 36px)}header{min-height:74px}main{padding:30px 0}.providers{grid-template-columns:1fr}.providers button{justify-content:flex-start;padding:0 13px}footer{font-size:7px}}