.auth-container{background:#fff;border-radius:30px;width:768px;max-width:100%;height:600px;position:relative;overflow:hidden;box-shadow:0 20px 60px #0000001a}.auth-form{justify-content:center;align-items:center;width:50%;height:100%;transition:all .6s ease-in-out;display:flex;position:absolute;top:0}.auth-form form{flex-direction:column;align-items:center;width:100%;padding:20px 32px;display:flex}.auth-form h1{font-family:var(--font-kanit), sans-serif;color:#1e293b;margin:0 0 2px;font-size:1.5rem;font-weight:700}.auth-subtitle{color:#94a3b8;margin-bottom:14px;font-size:.7rem}.social-row{gap:10px;margin:12px 0;display:flex}.social-icon{color:#475569;cursor:pointer;background:0 0;border:1px solid #cbd5e1;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:.8rem;text-decoration:none;transition:all .2s;display:flex}.social-icon:hover{color:#b91c1c;background:#fef2f2;border-color:#b91c1c}.social-divider{color:#94a3b8;margin:6px 0 10px;font-size:.7rem}.auth-form input{color:#0f172a;caret-color:#b91c1c;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;outline:none;width:100%;margin:4px 0;padding:10px 16px;font-size:.82rem;font-weight:500;transition:all .2s}.auth-form input[type=password]{letter-spacing:.15em}.auth-form input:focus{background:#fff;border-color:#fbbf24;box-shadow:0 0 0 3px #fbbf2433}.auth-form input::placeholder{color:#64748b;opacity:1;font-weight:500}.auth-form input:-webkit-autofill{caret-color:#0f172a;transition:background-color 9999s ease-in-out;-webkit-text-fill-color:#0f172a!important;-webkit-box-shadow:inset 0 0 0 1000px #f1f5f9!important}.auth-form input:-webkit-autofill:hover{caret-color:#0f172a;transition:background-color 9999s ease-in-out;-webkit-text-fill-color:#0f172a!important;-webkit-box-shadow:inset 0 0 0 1000px #f1f5f9!important}.auth-form input:-webkit-autofill:active{caret-color:#0f172a;transition:background-color 9999s ease-in-out;-webkit-text-fill-color:#0f172a!important;-webkit-box-shadow:inset 0 0 0 1000px #f1f5f9!important}.auth-form input:-webkit-autofill:focus{-webkit-box-shadow:inset 0 0 0 1000px #fff!important}.forgot-link{color:#94a3b8;align-self:flex-end;margin:6px 0 0;font-size:.7rem;text-decoration:none}.forgot-link:hover{color:#b91c1c;text-decoration:underline}.remember-row{justify-content:space-between;align-items:center;width:100%;margin-top:6px;display:flex}.remember-label{color:#64748b;cursor:pointer;align-items:center;gap:6px;font-size:.72rem;display:inline-flex}.remember-label input[type=checkbox]{accent-color:#b91c1c;cursor:pointer;width:14px;height:14px}.remember-row .forgot-link{margin:0}.auth-btn{color:#fde68a;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:linear-gradient(135deg,#dc2626 0%,#991b1b 100%);border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;height:42px;margin-top:12px;font-size:.82rem;font-weight:700;transition:all .2s;display:flex;box-shadow:0 6px 18px -4px #b91c1c73}.auth-btn:hover{background:linear-gradient(135deg,#b91c1c 0%,#7f1d1d 100%)}.auth-btn:active{transform:scale(.98)}.auth-btn:disabled{opacity:.5}.auth-btn .spinner{width:16px;height:16px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.auth-error{color:#dc2626;text-align:center;background:#fef2f2;border-radius:8px;width:100%;margin:4px 0;padding:8px 12px;font-size:.72rem}.type-toggle{background:#f1f5f9;border-radius:8px;gap:2px;width:100%;margin:4px 0 8px;padding:3px;display:flex}.type-toggle button{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;padding:7px 4px;font-size:.7rem;font-weight:500;transition:all .2s}.type-toggle button.active{color:#1e293b;background:#fff;box-shadow:0 1px 3px #00000014}.auth-signin{z-index:2;left:0}.auth-signup{opacity:0;z-index:1;pointer-events:none;left:0}.auth-container.active .auth-signin{opacity:0;pointer-events:none;transform:translate(100%)}.auth-container.active .auth-signup{opacity:1;z-index:5;pointer-events:auto;animation:.6s showForm;transform:translate(100%)}@keyframes showForm{0%,49.99%{opacity:0}50%,to{opacity:1}}.auth-overlay-wrap{z-index:100;width:50%;height:100%;transition:all .6s ease-in-out;position:absolute;top:0;left:50%;overflow:hidden}.auth-container.active .auth-overlay-wrap{transform:translate(-100%)}.auth-overlay{background:radial-gradient(circle at 20% 15%,#fbbf2440 0%,#0000 45%),radial-gradient(circle at 85% 85%,#f59e0b38 0%,#0000 50%),radial-gradient(circle at 70% 30%,#fcd34d1f 0%,#0000 40%),linear-gradient(135deg,#d11f25 0%,#a01115 42%,#4a0808 100%);width:200%;height:100%;transition:all .6s ease-in-out;position:relative;left:-100%}.auth-overlay:before{content:"";opacity:.5;pointer-events:none;background-image:radial-gradient(circle at 1px 1px,#fbbf242e 1px,#0000 0);background-size:22px 22px;position:absolute;inset:0}.auth-overlay:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000 0%,#fbbf24 50%,#0000 100%);height:3px;position:absolute;bottom:0;left:0;right:0}.auth-container.active .auth-overlay{transform:translate(50%)}.auth-overlay-wrap{border-radius:150px 0 0 150px}.auth-container.active .auth-overlay-wrap{border-radius:0 150px 150px 0}.overlay-panel{text-align:center;z-index:300;flex-direction:column;justify-content:center;align-items:center;width:50%;height:100%;padding:0 40px;transition:transform .6s ease-in-out,opacity .6s ease-in-out;display:flex;position:absolute;top:0}.overlay-icon{color:#fbbf24;filter:drop-shadow(0 4px 12px #fbbf2466);width:44px;height:44px;margin-bottom:14px}.overlay-panel h1{font-family:var(--font-kanit), sans-serif;color:#fff;letter-spacing:-.01em;margin-bottom:8px;font-size:1.85rem;font-weight:800}.overlay-panel h1 .gold{background:linear-gradient(135deg,#fde68a 0%,#fbbf24 50%,#f59e0b 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.overlay-panel p{color:#fef3c7d9;max-width:240px;margin-bottom:24px;font-size:.82rem;line-height:1.6}.overlay-btn{color:#7f1d1d;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 100%);border:none;border-radius:999px;padding:11px 44px;font-size:.82rem;font-weight:800;transition:all .25s;box-shadow:0 10px 24px -6px #fbbf248c}.overlay-btn:hover{background:linear-gradient(135deg,#fcd34d 0%,#fbbf24 100%);transform:translateY(-1px);box-shadow:0 14px 28px -6px #fbbf24a6}.overlay-btn:active{transform:scale(.98)}.overlay-left{opacity:0;right:50%;transform:translate(-20%)}.auth-container.active .overlay-left{opacity:1;transform:translate(0)}.overlay-right{right:0}.auth-container.active .overlay-right{opacity:0;transform:translate(20%)}.mobile-toggle{color:#64748b;text-align:center;margin-top:14px;font-size:.78rem;display:none}.mobile-toggle button,.mobile-toggle a{color:#b91c1c;cursor:pointer;font-weight:700;font-size:inherit;background:0 0;border:none;padding:0 4px;text-decoration:none}.mobile-toggle button:hover,.mobile-toggle a:hover{color:#7f1d1d;text-decoration:underline}@media (max-width:900px){.auth-container{width:100%;max-width:640px;height:580px}.auth-form form{padding:16px 24px}.auth-form h1{font-size:1.3rem}.overlay-panel{padding:0 24px}.overlay-panel h1{font-size:1.4rem}.overlay-panel p{max-width:220px;font-size:.78rem}}@media (max-width:640px){.auth-container{border-radius:20px;width:100%;max-width:440px;height:auto;min-height:auto;box-shadow:0 10px 40px #00000014}.auth-overlay-wrap{display:none}.auth-form{width:100%;height:auto;transition:none;position:relative}.auth-form form{padding:28px 22px 24px}.auth-signup{display:none}.auth-signin{display:flex}.auth-container.active .auth-signin{display:none}.auth-container.active .auth-signup{opacity:1;pointer-events:auto;animation:none;display:flex;transform:none}.mobile-toggle{display:block}.auth-form h1{font-size:1.35rem}.auth-subtitle{font-size:.72rem}.auth-form input{padding:11px 14px;font-size:.88rem}.auth-btn{height:44px;font-size:.82rem}.social-icon{width:34px;height:34px}.type-toggle button{font-size:.72rem}}@media (max-height:680px) and (min-width:641px){.auth-container{height:540px}.auth-form form{gap:2px;padding:12px 28px}.social-row{margin:6px 0}.auth-form h1{font-size:1.25rem}}