:root{--surface:#131313;--surface-dim:#131313;--surface-bright:#393939;--surface-container-lowest:#0e0e0e;--surface-container-low:#1c1b1b;--surface-container:#201f1f;--surface-container-high:#2a2a2a;--surface-container-highest:#353534;--on-surface:#e5e2e1;--on-surface-variant:#cbc3d7;--inverse-surface:#e5e2e1;--inverse-on-surface:#313030;--outline:#958ea0;--outline-variant:#494454;--surface-tint:#d0bcff;--primary:#d0bcff;--on-primary:#3c0091;--primary-container:#a078ff;--on-primary-container:#340080;--inverse-primary:#6d3bd7;--secondary:#4cd7f6;--on-secondary:#003640;--secondary-container:#03b5d3;--on-secondary-container:#00424e;--tertiary:#ffb2b7;--on-tertiary:#67001b;--tertiary-container:#ff516a;--on-tertiary-container:#5b0017;--error:#ffb4ab;--on-error:#690005;--error-container:#93000a;--on-error-container:#ffdad6;--background:#131313;--on-background:#e5e2e1;--surface-variant:#353534;--font-body:"Inter", sans-serif;--font-mono:"Geist", monospace;--rounded-sm:.125rem;--rounded:.25rem;--rounded-md:.375rem;--rounded-lg:.5rem;--rounded-xl:.75rem;--rounded-full:9999px;--spacing-unit:4px}body{font-family:var(--font-body);color:var(--on-background);background-color:#0b0b0c;justify-content:center;align-items:center;min-height:100vh;margin:0;display:flex;position:relative;overflow:hidden}body:before,body:after{content:"";filter:blur(100px);z-index:-1;border-radius:50%;width:60vw;height:60vw;animation:20s ease-in-out infinite alternate float;position:absolute}body:before{background:radial-gradient(circle,#d0bcff26 0%,#d0bcff00 70%);top:-10vw;left:-10vw}body:after{background:radial-gradient(circle,#4cd7f61a 0%,#4cd7f600 70%);animation-delay:-10s;bottom:-20vw;right:-10vw}@keyframes float{0%{transform:translate(0)scale(1)}50%{transform:translate(5vw,10vh)scale(1.1)}to{transform:translate(-5vw,-5vh)scale(.9)}}*{box-sizing:border-box}h1,h2,h3,h4,h5,h6{margin:0;font-weight:600}#app{justify-content:center;width:100%;display:flex}.login-container{flex-direction:column;align-items:center;gap:32px;width:100%;max-width:420px;padding:24px;display:flex}.branding{text-align:center}.logo-icon{filter:drop-shadow(0 0 12px #d0bcff66);width:48px;height:48px;margin:0 auto 16px;animation:4s infinite alternate pulse-glow}@keyframes pulse-glow{0%{filter:drop-shadow(0 0 8px #d0bcff4d);transform:scale(.98)}to{filter:drop-shadow(0 0 16px #4cd7f680);transform:scale(1.02)}}.branding h1{letter-spacing:-.02em;color:#fff;margin-bottom:8px;font-size:32px;font-weight:700}.branding p{color:var(--on-surface-variant);margin:0;font-size:14px}.glass-panel{-webkit-backdrop-filter:blur(40px);border-radius:var(--rounded-lg);background-color:#1c1b1b73;width:100%;padding:40px;transition:transform .3s,box-shadow .3s;position:relative;transform:translateY(0);box-shadow:0 24px 64px #0009,inset 0 0 0 1px #ffffff0d}.glass-panel:before{content:"";border-radius:var(--rounded-lg);-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,#ffffff4d 0%,#ffffff0d 50%,#fff0 100%);padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.glass-panel:hover{transform:translateY(-4px);box-shadow:0 32px 80px #000000b3,inset 0 0 0 1px #ffffff14}.form-group{flex-direction:column;gap:8px;margin-bottom:24px;display:flex;position:relative}.form-label{font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--on-surface);justify-content:space-between;font-size:11px;font-weight:600;display:flex}.form-label a{color:var(--secondary);text-transform:none;font-family:var(--font-body);font-size:12px;text-decoration:none}.form-label a:hover{text-decoration:underline}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{color:var(--outline);pointer-events:none;display:flex;position:absolute;left:14px}.input-icon svg{width:16px;height:16px}.input-field{border-radius:var(--rounded);width:100%;color:var(--on-surface);font-family:var(--font-mono);background-color:#0e0e0ecc;border:1px solid #ffffff14;outline:none;padding:12px 36px 12px 40px;font-size:14px;transition:all .3s;box-shadow:inset 0 2px 4px #0000004d}.input-field::placeholder{color:var(--outline);font-family:var(--font-body)}.input-field:focus{border-color:var(--primary);background-color:var(--surface-container-lowest);box-shadow:inset 0 2px 4px #0000004d,0 0 12px #d0bcff40}.btn-primary{background-color:var(--primary-container);width:100%;color:#fff;border-radius:var(--rounded);font-family:var(--font-body);cursor:pointer;background:linear-gradient(135deg,#a078ff 0%,#8553f4 100%);border:none;margin-top:8px;padding:14px;font-size:16px;font-weight:600;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 0 20px #a078ff33}.btn-primary:after{content:"";background:linear-gradient(90deg,#fff0 0%,#fff3 50%,#fff0 100%);width:50%;height:100%;animation:4s infinite shimmer;position:absolute;top:0;left:-100%;transform:skew(-20deg)}@keyframes shimmer{0%{left:-100%}20%{left:200%}to{left:200%}}@keyframes shine{0%{transform:translate(-100%)skew(-15deg)}50%,to{transform:translate(200%)skew(-15deg)}}.btn-primary:hover{filter:brightness(1.15);transform:translateY(-1px);box-shadow:0 0 30px #d0bcff80}.divider{text-align:center;color:var(--outline);font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;align-items:center;margin:32px 0 24px;font-size:11px;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid var(--outline-variant);flex:1}.divider::not(:empty):before{margin-right:16px}.divider::not(:empty):after{margin-left:16px}.ghost-buttons{gap:16px;display:flex}.btn-ghost{border:1px solid var(--outline-variant);border-radius:var(--rounded);color:var(--on-surface);font-family:var(--font-body);cursor:pointer;background-color:#0000;flex:1;justify-content:center;align-items:center;gap:8px;padding:10px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.btn-ghost svg{width:16px;height:16px}.btn-ghost:hover{border-color:var(--secondary);background-color:#4cd7f60d;box-shadow:0 0 8px #4cd7f633}.footer-text{text-align:center;color:var(--on-surface-variant);font-size:13px}.footer-text a{color:#fff;font-weight:600;text-decoration:none}.footer-text a:hover{text-decoration:underline}.hidden{display:none!important}.transition-all,.transition-colors,.transition-opacity,.transition-transform,.transition{transition-timing-function:cubic-bezier(.16,1,.3,1)!important}.duration-300{transition-duration:.4s!important}.glass-panel{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s cubic-bezier(.16,1,.3,1)!important}#toast-container{z-index:9999;pointer-events:none;flex-direction:column;gap:12px;display:flex;position:fixed;top:24px;right:24px}.toast{-webkit-backdrop-filter:blur(20px);color:var(--on-surface);border-radius:var(--rounded-lg);font-family:var(--font-body);opacity:0;pointer-events:auto;background-color:#1c1b1bd9;align-items:center;gap:12px;padding:16px 20px;font-size:14px;font-weight:500;animation:.4s cubic-bezier(.16,1,.3,1) forwards slide-in;display:flex;transform:translate(120%);box-shadow:0 12px 40px #0006,inset 0 0 0 1px #ffffff1a}.toast.toast-error{border-left:4px solid var(--error);box-shadow:0 12px 40px #0006,inset 0 0 0 1px #ffb4ab33}.toast.toast-error svg{color:var(--error)}.toast.toast-success{border-left:4px solid var(--secondary);box-shadow:0 12px 40px #0006,inset 0 0 0 1px #4cd7f633}.toast.toast-success svg{color:var(--secondary)}.toast.fade-out{animation:.3s cubic-bezier(.16,1,.3,1) forwards slide-out}@keyframes slide-in{0%{opacity:0;transform:translate(120%)}to{opacity:1;transform:translate(0)}}@keyframes slide-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(120%)}}.password-toggle{color:var(--outline);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;transition:color .2s;display:flex;position:absolute;right:12px}.password-toggle:hover{color:var(--on-surface)}.password-toggle svg{width:16px;height:16px}