:root{--auth-navy:#050b1c;--auth-card:#0b1934;--auth-cyan:#00e5ff;--auth-gold:#ffc857;--auth-pink:#ff4267;--auth-muted:#91a5bd}
*{box-sizing:border-box}
body.habbo-auth-body{min-height:100vh;margin:0;padding:32px 16px;display:grid;place-items:center;overflow-x:hidden;color:#f5f9ff;font-family:Outfit,sans-serif;background:#050b1c url('/assets/rooftop.webp') center/cover fixed no-repeat}
.auth-bg-overlay{position:fixed;inset:0;z-index:0;background:linear-gradient(135deg,rgba(2,7,20,.74),rgba(6,18,46,.5)),radial-gradient(circle at 50% 15%,rgba(0,229,255,.13),transparent 35%)}
.auth-container{position:relative;z-index:1;width:min(100%,470px);padding:27px;border:2px solid #284b75;border-radius:14px;background:linear-gradient(160deg,rgba(13,31,64,.97),rgba(5,13,31,.98));box-shadow:8px 8px 0 rgba(1,4,13,.85),0 22px 70px rgba(0,0,0,.55)}
.auth-brand-header{text-align:center;margin-bottom:18px}.auth-logo{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none}.auth-icon{display:grid;place-items:center;width:42px;height:42px;border:2px solid var(--auth-gold);border-radius:8px;background:#11264b;font-size:22px;box-shadow:3px 3px 0 #020611}.auth-title{font:700 25px Silkscreen,monospace;letter-spacing:-1px}.auth-title b{color:var(--auth-cyan)}.auth-sub{display:block;margin-top:7px;color:var(--auth-muted);font:7px 'Press Start 2P',monospace;letter-spacing:.08em}
.live-avatar-box{display:grid;justify-items:center;margin:4px 0 18px}.avatar-stage-circle{width:112px;height:112px;display:grid;place-items:center;overflow:hidden;border:3px solid var(--auth-cyan);border-radius:50%;background:radial-gradient(circle,#1d4671,#09172f 70%);box-shadow:0 0 22px rgba(0,229,255,.25),inset 0 -8px rgba(0,0,0,.22)}.avatar-stage-circle img{height:130px;transform:translateY(10px);image-rendering:pixelated}.avatar-preview-tag{margin-top:-5px;padding:6px 11px;border:2px solid #020611;border-radius:4px;background:var(--auth-gold);color:#101018;font:700 9px Silkscreen,monospace;box-shadow:3px 3px 0 #020611}
.auth-tabs-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:19px;padding:5px;border:1px solid #29496d;border-radius:8px;background:#061127}.auth-tab-btn{padding:11px 7px;border:0;border-radius:5px;background:transparent;color:var(--auth-muted);font:700 9px Silkscreen,monospace;cursor:pointer}.auth-tab-btn.active{background:var(--auth-cyan);color:#031018;box-shadow:2px 2px 0 #020611}
.auth-form{display:grid;gap:15px}.auth-form.hidden{display:none}.input-group{display:grid;gap:7px}.input-group label{color:#dcecff;font-size:12px;font-weight:800}.input-group input{width:100%;padding:12px 13px;border:1px solid #355a83;border-radius:7px;outline:0;background:#061126;color:#fff;font:600 15px Outfit,sans-serif;transition:.15s}.input-group input:focus{border-color:var(--auth-cyan);box-shadow:0 0 0 3px rgba(0,229,255,.1)}.input-note{color:var(--auth-muted);font-size:10px}
.auth-submit-btn{margin-top:3px;padding:14px 11px;border:0;border-radius:7px;background:var(--auth-gold);color:#11131a;font:700 10px Silkscreen,monospace;cursor:pointer;box-shadow:4px 4px 0 #745710;transition:.15s}.auth-submit-btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 #745710}.auth-submit-btn.pink-btn{background:var(--auth-pink);color:#fff;box-shadow:4px 4px 0 #851e35}
.auth-footer-link{text-align:center;margin-top:20px}.auth-footer-link a{color:var(--auth-cyan);font-size:12px;font-weight:700;text-decoration:none}.auth-footer-link a:hover{color:#fff}
#authToast{position:fixed;z-index:10;left:50%;bottom:24px;transform:translate(-50%,25px);max-width:min(90vw,460px);padding:11px 16px;border:1px solid var(--auth-cyan);border-radius:7px;background:#07152c;color:#fff;opacity:0;pointer-events:none;transition:.2s;box-shadow:4px 4px 0 #020611;text-align:center;font-weight:700}#authToast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:520px){body.habbo-auth-body{padding:14px 10px;align-items:start}.auth-container{padding:20px 16px;margin-top:8px}.auth-title{font-size:21px}.live-avatar-box{margin-bottom:14px}.avatar-stage-circle{width:94px;height:94px}.avatar-stage-circle img{height:112px}}
.auth-icon{border-color:#214979!important;background:#0b1d48!important}.auth-icon img{display:block;width:40px;height:40px;object-fit:contain;object-position:center;image-rendering:pixelated}