@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
:root{--auth-bg-1:#0f0720;--auth-bg-2:#1a0a3e;--auth-bg-3:#0d1f3c;--auth-bg-4:#0a2a2f;--auth-card-bg:#ffffff0f;--auth-card-border:#ffffff1a;--auth-card-shadow:0 8px 32px #0006, 0 0 0 1px #ffffff0d;--auth-text:#f0f0f5;--auth-text-muted:#ffffff8c;--auth-text-label:#ffffffb3;--auth-input-bg:#ffffff0d;--auth-input-border:#ffffff1a;--auth-input-focus-border:#8b5cf699;--auth-input-focus-glow:0 0 0 3px #8b5cf626, 0 0 20px #8b5cf61a;--auth-accent-1:#8b5cf6;--auth-accent-2:#06b6d4;--auth-accent-3:#a855f7;--auth-error:#f87171;--auth-error-bg:#f871711a;--auth-error-border:#f8717140;--auth-radius:16px;--auth-radius-sm:10px;--auth-radius-input:12px;--in-oklch: }@supports (background:linear-gradient(in oklch, #000, #fff)){:root{--in-oklch:in oklch}}.auth-container{-webkit-font-smoothing:antialiased;background:var(--auth-bg-1);justify-content:center;align-items:center;min-height:100vh;padding:24px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;position:relative;overflow:hidden}.auth-container:before{content:"";background:radial-gradient(ellipse 600px 600px at 20% 30%, var(--auth-accent-1), transparent 70%), radial-gradient(ellipse 500px 500px at 75% 20%, var(--auth-accent-2), transparent 70%), radial-gradient(ellipse 700px 700px at 50% 80%, var(--auth-accent-3), transparent 60%), radial-gradient(ellipse 400px 400px at 80% 70%, #3b82f6, transparent 70%);opacity:.3;z-index:0;width:200%;height:200%;animation:20s ease-in-out infinite alternate meshDrift;position:absolute;inset:-50%}.auth-container:after{content:"";z-index:0;background-image:radial-gradient(circle at 25% 25%,#ffffff04 1px,#0000 1px),radial-gradient(circle at 75% 75%,#ffffff04 1px,#0000 1px);background-size:50px 50px;position:absolute;inset:0}@keyframes meshDrift{0%{transform:translate(0)rotate(0)scale(1)}25%{transform:translate(-3%,2%)rotate(1deg)scale(1.02)}50%{transform:translate(2%,-1%)rotate(-.5deg)scale(.98)}75%{transform:translate(-1%,-3%)rotate(.5deg)scale(1.01)}to{transform:translate(1%,1%)rotate(-1deg)scale(1)}}@media (prefers-reduced-motion:reduce){.auth-container:before{animation:none}.auth-particles span{opacity:.1;animation:none}}.auth-particles{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}.auth-particles span{background:#ffffff26;border-radius:50%;width:4px;height:4px;animation:linear infinite particleFloat;display:block;position:absolute}.auth-particles span:first-child{width:3px;height:3px;animation-duration:18s;animation-delay:0s;bottom:-10%;left:10%}.auth-particles span:nth-child(2){width:5px;height:5px;animation-duration:22s;animation-delay:2s;bottom:-10%;left:25%}.auth-particles span:nth-child(3){width:3px;height:3px;animation-duration:16s;animation-delay:4s;bottom:-10%;left:40%}.auth-particles span:nth-child(4){width:6px;height:6px;animation-duration:24s;animation-delay:1s;bottom:-10%;left:55%}.auth-particles span:nth-child(5){width:4px;height:4px;animation-duration:20s;animation-delay:3s;bottom:-10%;left:70%}.auth-particles span:nth-child(6){width:3px;height:3px;animation-duration:26s;animation-delay:5s;bottom:-10%;left:85%}.auth-particles span:nth-child(7){width:5px;height:5px;animation-duration:19s;animation-delay:7s;bottom:-10%;left:15%}.auth-particles span:nth-child(8){width:3px;height:3px;animation-duration:21s;animation-delay:6s;bottom:-10%;left:60%}@keyframes particleFloat{0%{opacity:0;transform:translateY(0)translate(0)}10%{opacity:.4}90%{opacity:.15}to{opacity:0;transform:translateY(-110vh)translate(40px)}}.auth-card{z-index:1;background:var(--auth-card-bg);-webkit-backdrop-filter:blur(24px)saturate(1.4);border:1px solid var(--auth-card-border);border-radius:var(--auth-radius);width:100%;max-width:440px;box-shadow:var(--auth-card-shadow);opacity:0;padding:48px 40px;animation:.6s cubic-bezier(.16,1,.3,1) forwards cardAppear;position:relative}@keyframes cardAppear{0%{opacity:0;transform:translateY(20px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.auth-header{text-align:center;margin-bottom:36px}.auth-logo{justify-content:center;align-items:center;gap:10px;margin-bottom:4px;font-size:1.75rem;display:flex}.auth-logo-icon{background:linear-gradient(135deg var(--in-oklch), var(--auth-accent-1), var(--auth-accent-2));border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;line-height:1;display:inline-flex}.auth-logo-text{color:var(--auth-text);letter-spacing:-.03em;font-weight:700}.auth-header h1{color:var(--auth-text);letter-spacing:-.01em;margin:16px 0 6px;font-size:1.375rem;font-weight:600}.auth-header p{color:var(--auth-text-muted);font-size:.9rem;line-height:1.5}.auth-form{flex-direction:column;gap:20px;display:flex}.form-group{position:relative}.form-input{width:100%;color:var(--auth-text);background:var(--auth-input-bg);border:1px solid var(--auth-input-border);border-radius:var(--auth-radius-input);outline:none;padding:16px 16px 8px;font-family:inherit;font-size:.95rem;line-height:1.5;transition:border-color .25s,box-shadow .25s,background .25s;display:block}.form-input::placeholder{color:#0000}.form-input:focus{border-color:var(--auth-input-focus-border);box-shadow:var(--auth-input-focus-glow);background:#ffffff14}.form-label{color:var(--auth-text-muted);pointer-events:none;transform-origin:0;font-size:.9rem;transition:all .2s cubic-bezier(.16,1,.3,1);position:absolute;top:50%;left:16px;transform:translateY(-50%)}.form-input:focus+.form-label,.form-input:not(:placeholder-shown)+.form-label{color:var(--auth-accent-1);font-weight:500;top:10px;transform:translateY(0)scale(.78)}.field-error{color:var(--auth-error);background:var(--auth-error-bg);border:1px solid var(--auth-error-border);border-radius:8px;margin-top:6px;padding:6px 12px;font-size:.8rem;animation:.3s cubic-bezier(.16,1,.3,1) forwards errorSlide;display:block}@keyframes errorSlide{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.auth-error{color:var(--auth-error);background:var(--auth-error-bg);border:1px solid var(--auth-error-border);border-radius:var(--auth-radius-sm);align-items:center;gap:10px;padding:12px 16px;font-size:.875rem;animation:.3s cubic-bezier(.16,1,.3,1) forwards errorSlide;display:flex}.auth-error:before{content:"⚠";flex-shrink:0;font-size:1rem}.auth-button{color:#fff;background:linear-gradient(135deg var(--in-oklch), var(--auth-accent-1), var(--auth-accent-2));border-radius:var(--auth-radius-input);cursor:pointer;letter-spacing:.01em;border:none;justify-content:center;align-items:center;width:100%;margin-top:4px;padding:14px 24px;font-family:inherit;font-size:.95rem;font-weight:600;transition:transform .2s,box-shadow .2s,opacity .2s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 15px #8b5cf64d,0 0 #8b5cf600}.auth-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 25px #8b5cf666,0 0 40px #8b5cf626}.auth-button:active:not(:disabled){transform:translateY(0)}.auth-button:disabled{opacity:.65;cursor:not-allowed}.auth-button:after{content:"";background:linear-gradient(105deg,#0000 30%,#ffffff26 50%,#0000 70%);transition:transform .5s;position:absolute;inset:0;transform:translate(-100%)}.auth-button:hover:not(:disabled):after{transform:translate(100%)}.auth-button-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;margin-right:8px;animation:.6s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.auth-link{text-align:center;color:var(--auth-text-muted);margin-top:8px;font-size:.875rem}.auth-link a{color:var(--auth-accent-1);font-weight:500;text-decoration:none;transition:color .2s}.auth-link a:hover{color:var(--auth-accent-2);text-underline-offset:3px;-webkit-text-decoration:underline #06b6d466;text-decoration:underline #06b6d466}.auth-divider{color:var(--auth-text-muted);align-items:center;gap:16px;margin:4px 0;font-size:.8rem;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:var(--auth-input-border);flex:1;height:1px}@media (max-width:520px){.auth-card{border-radius:12px;padding:36px 24px}.auth-logo{font-size:1.5rem}.auth-header h1{font-size:1.2rem}.auth-container{padding:16px}}@media (max-width:360px){.auth-card{padding:28px 18px}}