:root{--purple-primary:#8400ff;--purple-glow:#8400ff33;--purple-border:#8400ffcc;--border-color:#392e4e;--background-dark:#06001000;--pink-accent:#ff1493}.login-panel{width:25vw;height:87.5vh;box-shadow:none;pointer-events:auto;z-index:50;background:0 0;justify-content:center;align-items:center;padding:2.5em;font-weight:300;transition:all .3s;display:flex;position:fixed;top:50%;left:25%;transform:translate(-50%,-50%)}.login-panel-card{border:1px solid var(--border-color);background:var(--background-dark);z-index:2;border-radius:20px;width:100%;max-width:475px;max-height:85vh;padding:2.5em;position:relative;overflow:hidden auto;box-shadow:0 20px 60px #00000080}.login-panel-card:hover{box-shadow:0 25px 70px #0009}.login-close-btn{color:#fffc;cursor:pointer;z-index:10;background:#ffffff1a;border:1px solid #fff3;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-size:16px;transition:all .2s;display:flex;position:absolute;top:1.5em;right:1.5em}.login-close-btn:hover{color:#fff;background:#ffffff26;border-color:#fff6}.login-close-btn:active{transform:scale(.95)}.login-content{z-index:3;flex-direction:column;gap:1.5em;width:100%;display:flex;position:relative}.login-title{color:#fff;margin-top:0;font-size:24px;font-weight:600}.login-form{flex-direction:column;gap:1.2em;display:flex}.form-fields{flex-direction:column;gap:1em;display:flex}.form-group{flex-direction:column;gap:.4em;display:flex}.form-label{color:#ffffffb3;text-transform:uppercase;letter-spacing:.05em;font-size:12px;font-weight:500}.form-input{color:#fff;background:#ffffff14;border:1px solid #8400ff4d;border-radius:8px;width:100%;padding:.8em 1em;font-size:14px;transition:all .2s}.form-input::placeholder{color:#fff6}.form-input:focus{border-color:var(--purple-primary);background:#ffffff1f;outline:none;box-shadow:0 0 12px #8400ff33}.form-input:hover:not(:focus){border-color:#8400ff80}.username-status{text-align:center;border-radius:4px;padding:.4em .6em;font-size:11px;font-weight:500}.username-status.available{color:#4ade80;background:#4ade801a}.username-status.taken{color:#ef4444;background:#ef44441a}.error-message{color:#fca5a5;background:#ef44441a;border:1px solid #ef444466;border-radius:8px;padding:.8em 1em;font-size:13px;line-height:1.4}.form-actions{flex-direction:column;gap:.8em;display:flex}.submit-button{background:linear-gradient(135deg,var(--purple-primary)0%,var(--pink-accent)100%);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;padding:.95em;font-size:14px;font-weight:600;transition:all .3s;position:relative;overflow:hidden}.submit-button:before{content:"";opacity:0;background:#ffffff1a;transition:opacity .3s;position:absolute;inset:0}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #8400ff66}.submit-button:hover:not(:disabled):before{opacity:1}.submit-button:active:not(:disabled){transform:translateY(0)}.submit-button:disabled{opacity:.5;cursor:not-allowed}.toggle-button{color:#fffc;cursor:pointer;background:0 0;border:1px solid #8400ff4d;border-radius:8px;width:100%;padding:.75em;font-size:13px;font-weight:500;transition:all .2s}.toggle-button:hover{border-color:var(--purple-primary);color:#fff;background:#8400ff1a}.toggle-button:active{transform:scale(.98)}.login-account-info{flex-direction:column;gap:1.2em;display:flex}.account-card{background:#8400ff1a;border:1px solid #8400ff4d;border-radius:8px;padding:1.2em}.account-label{color:#fff9;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5em;font-size:11px}.account-email{color:#fff;word-break:break-all;font-size:15px;font-weight:500}.logout-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);border:none;border-radius:8px;width:100%;padding:.95em;font-size:14px;font-weight:600;transition:all .3s}.logout-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ef44444d}.logout-button:active{transform:translateY(0)}.logout-button-small{color:#fff;cursor:pointer;background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);border:none;border-radius:6px;align-self:flex-start;width:auto;padding:.5em 1.2em;font-size:13px;font-weight:500;transition:all .2s}.logout-button-small:hover{transform:translateY(-1px);box-shadow:0 4px 15px #ef44444d}.logout-button-small:active{transform:translateY(0)}.login-panel-card::-webkit-scrollbar{width:6px}.login-panel-card::-webkit-scrollbar-track{background:#ffffff0d;border-radius:10px}.login-panel-card::-webkit-scrollbar-thumb{background:#8400ff66;border-radius:10px}.login-panel-card::-webkit-scrollbar-thumb:hover{background:#8400ff99}@media (max-width:768px){.login-panel{width:100%;height:auto;box-shadow:none;z-index:10;background:0 0;padding:1.875em;position:static;transform:none}.login-panel-card{max-width:400px}.login-title{font-size:20px}.form-input{padding:.7em .9em;font-size:13px}.submit-button,.logout-button{padding:.85em;font-size:13px}.toggle-button{padding:.7em;font-size:12px}}@media (max-width:480px){.login-panel{z-index:10;width:100%;height:auto;position:static;transform:none}.login-panel-card{max-width:350px}}