.login-page{background:linear-gradient(180deg, var(--color-white) 0%, var(--color-brand-50) 100%);flex-direction:column;justify-content:center;align-items:center;min-height:calc(100dvh - 200px);padding:2rem 2rem 150px;display:flex}@media (width<=768px){.login-page{padding:6.5rem 1rem 150px}}.login-page .login-card{background:var(--color-elevated);border:1px solid var(--color-border);border-radius:24px;width:100%;max-width:420px;padding:2.5rem;animation:.6s cubic-bezier(.34,1.56,.64,1) both card-appear;position:relative;overflow:hidden;box-shadow:0 4px 24px #0000000f,inset 0 0 0 1px #fffc}.login-page .register-card{max-width:520px}@keyframes card-appear{0%{opacity:0;transform:translateY(20px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.login-page .login-card:before{content:"";background:radial-gradient(ellipse 80% 40% at 50% 0%, var(--color-accent-glow) 0%, transparent 70%);pointer-events:none;position:absolute;inset:0}.login-page .mode-toggle{justify-content:center;align-items:center;gap:.5rem;margin-bottom:1.5rem;animation:.5s .1s both fade-up;display:flex;position:relative}.login-page .toggle-label{color:var(--color-text-muted);font-size:.875rem}.login-page .toggle-switch{background:var(--color-surface-alt);border:1px solid var(--color-border);cursor:pointer;border-radius:9999px;gap:.125rem;padding:.25rem;transition:border-color .2s,box-shadow .2s;display:flex;position:relative}.login-page .toggle-switch:hover{border-color:var(--color-accent);box-shadow:0 0 12px var(--color-accent-dim)}.login-page .toggle-switch:disabled,.login-page .toggle-switch.disabled{cursor:not-allowed;opacity:.55}.login-page .toggle-switch:disabled:hover,.login-page .toggle-switch.disabled:hover{border-color:var(--color-border);box-shadow:none}.login-page .toggle-option{z-index:2;color:var(--color-text-muted);-webkit-user-select:none;user-select:none;isolation:isolate;border-radius:9999px;padding:.375rem 1rem;font-size:.8125rem;font-weight:500;transition:color .3s,background-color .3s .55s;position:relative}.login-page .toggle-option.active{color:var(--color-white)}@property --trace-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.login-page .toggle-option:not(.active):before{content:"";border-radius:inherit;background:conic-gradient(from var(--trace-angle), var(--color-accent) 0deg, var(--color-accent) 40deg, transparent 90deg, transparent 360deg);-webkit-mask-composite:xor;opacity:0;pointer-events:none;z-index:-1;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;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}.login-page .toggle-option:not(.active):hover{color:var(--color-text);background-color:#ffffff0d}.login-page .toggle-option:not(.active):hover:before{animation:.6s cubic-bezier(.4,0,.2,1) forwards toggle-trace}@keyframes toggle-trace{0%{--trace-angle:0deg;opacity:1}85%{--trace-angle:360deg;opacity:1}to{--trace-angle:360deg;opacity:0}}@media (prefers-reduced-motion:reduce){.login-page .toggle-option{transition:color .2s,background-color .2s}.login-page .toggle-option:not(.active):before{display:none}}.login-page .toggle-slider{background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-brand-400) 100%);z-index:1;border-radius:9999px;width:calc(50% - .25rem);transition:transform .3s cubic-bezier(.34,1.56,.64,1);position:absolute;top:.25rem;bottom:.25rem;left:.25rem;box-shadow:0 2px 8px #2563eb4d}.login-page .toggle-slider.slide-right{transform:translate(100%)}.login-page .login-header{text-align:center;margin-bottom:2rem;animation:.5s .2s both fade-up;position:relative}.login-page .login-header h2{margin-bottom:.5rem;font-size:2rem}.login-page .login-subtitle{color:var(--color-text-muted);font-size:.9375rem}.login-page .step-cell{background:var(--color-accent-dim);border-radius:12px;align-items:center;gap:1rem;margin-bottom:2rem;padding:.75rem 1rem;animation:.5s cubic-bezier(.34,1.56,.64,1) both step-cell-enter;display:flex;position:relative}@keyframes step-cell-enter{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.login-page .step-indicator{background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-brand-400) 100%);border:2px solid var(--color-accent);width:44px;height:44px;color:var(--color-white);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;transition:background .4s,border-color .4s,box-shadow .4s;display:flex;box-shadow:0 4px 12px #2563eb33}.login-page .step-indicator.completed{background:linear-gradient(135deg, var(--color-success) 0%, #059669 100%);border-color:var(--color-success);box-shadow:0 4px 12px #10b9814d}.login-page .step-indicator svg{animation:.6s cubic-bezier(.34,1.56,.64,1) icon-bounce}@keyframes icon-bounce{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.login-page .step-info{flex-direction:column;flex:1;gap:.125rem;min-width:0;display:flex}.login-page .step-label{color:var(--color-accent);font-size:.9375rem;font-weight:600;transition:color .4s}.login-page .step-label.completed{color:var(--color-success)}.login-page .step-desc{color:var(--color-text-muted);font-size:.75rem}.login-page .step-counter{background:var(--color-surface-alt);border:1px solid var(--color-border);color:var(--color-text-muted);white-space:nowrap;border-radius:9999px;flex-shrink:0;padding:.375rem .75rem;font-size:.8125rem;font-weight:600;animation:.4s cubic-bezier(.34,1.56,.64,1) counter-pop}@keyframes counter-pop{0%{opacity:0;transform:scale(.8)}50%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.login-page .login-form{flex-direction:column;gap:1.25rem;animation:.5s .3s both fade-up;display:flex;position:relative}.login-page .error-message{background:var(--color-error-dim);color:var(--color-error);border-radius:12px;padding:.75rem 1rem;font-size:.8125rem;font-weight:500;animation:.4s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.login-page .field-group{flex-direction:column;gap:.375rem;display:flex}.login-page .field-label{color:var(--color-text);font-size:.8125rem;font-weight:600}.login-page .input-field{transition:border-color .2s,box-shadow .2s,transform .2s}.login-page .input-field:focus{transform:translateY(-2px)}.login-page .password-input-wrapper{align-items:center;display:flex;position:relative}.login-page .password-input-wrapper .password-input{width:100%;padding-right:3rem}.login-page .password-toggle{width:1.75rem;height:1.75rem;color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:0;transition:color .2s,background-color .2s;display:flex;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.login-page .password-toggle:hover{color:var(--color-accent);background-color:var(--color-accent-dim)}.login-page .password-toggle:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.login-page .password-toggle svg{width:1.125rem;height:1.125rem}.login-page .submit-btn{width:100%;margin-top:.5rem;padding:.875rem;font-size:1rem;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.login-page .submit-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);transition:transform .5s;position:absolute;inset:0;transform:translate(-100%)}.login-page .submit-btn:hover:before{transform:translate(100%)}.login-page .submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #2563eb4d}.login-page .message{border-radius:8px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.8125rem;font-weight:500;animation:.3s fade-up}.login-page .message.error{background:var(--color-error-dim);color:var(--color-error)}.login-page .message.success{color:var(--color-success);background:#10b98114}.login-page .step-content{min-height:200px;position:relative}.login-page .step-panel{flex-direction:column;gap:1.25rem;animation:.4s cubic-bezier(.34,1.56,.64,1) step-enter;display:flex}@keyframes step-enter{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.login-page .verified-badge{color:var(--color-success);background:#10b98114;border-radius:8px;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.875rem;font-weight:600;display:flex}.login-page .password-requirements{flex-direction:column;gap:.5rem;display:flex}.login-page .requirement{color:var(--color-text-dim);align-items:center;gap:.5rem;font-size:.8125rem;display:flex}.login-page .requirement.met{color:var(--color-success)}.login-page .req-icon{text-align:center;width:1rem;font-size:.75rem}.login-page .section-label{color:var(--color-text);margin:0;font-size:.9375rem;font-weight:600}.login-page .token-rate-hint{color:#64748b;margin:0 0 .25rem;font-size:.875rem;line-height:1.25rem}.login-page .plan-select{flex-direction:column;gap:.5rem;display:flex}.login-page .plan-option{background:var(--color-surface);border:1px solid var(--color-border);cursor:pointer;text-align:left;border-radius:10px;flex-direction:column;gap:.125rem;padding:.875rem 1rem;font-family:inherit;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex}.login-page .plan-option:hover{border-color:var(--color-accent);transform:translateY(-2px)}.login-page .plan-option.selected{border-color:var(--color-accent);background:var(--color-accent-dim);transform:scale(1.02);box-shadow:0 4px 16px #2563eb33}.login-page .plan-option-name{color:var(--color-text);font-size:.9375rem;font-weight:600}.login-page .plan-option-price{color:var(--color-text-muted);font-size:.8125rem}.login-page .step-description{color:var(--color-text-muted);margin:0;font-size:.8125rem;line-height:1.5}.login-page .pay-form-wrapper{flex-direction:column;gap:.75rem;display:flex}.login-page .pay-form-container{width:100%;min-height:320px}.login-page .pay-form-container:has(.stripe-field-container){min-height:auto}.login-page .stripe-field-container{flex-direction:column;gap:.375rem;width:100%;display:flex}.login-page .stripe-card-field{border:1px solid var(--color-border);background:var(--color-white);border-radius:10px;width:100%;padding:.875rem 1rem;transition:border-color .2s,box-shadow .2s}.login-page .stripe-card-field.focused{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-dim)}.login-page .stripe-card-submit{width:100%;color:var(--color-white);background:var(--color-accent);cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:.5rem;margin-top:.75rem;padding:.875rem;font-size:.9375rem;font-weight:600;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex}.login-page .stripe-card-submit:hover:not(:disabled){background:var(--color-brand-700);transform:translateY(-2px);box-shadow:0 8px 24px #2563eb4d}.login-page .stripe-card-submit:disabled{background:var(--color-text-dim);color:#fffc;cursor:not-allowed;box-shadow:none;transform:none}.login-page .stripe-button-spinner{width:1.125rem;height:1.125rem;animation:.8s linear infinite stripe-spin}.login-page .stripe-spinner-track{opacity:.25}.login-page .stripe-spinner-head{opacity:.85}@keyframes stripe-spin{to{transform:rotate(360deg)}}.login-page .pay-status{border-radius:10px;align-items:center;gap:.5rem;padding:.625rem .875rem;font-size:.8125rem;font-weight:500;display:flex}.login-page .pay-status--loading{background:var(--color-accent-dim);color:var(--color-accent)}.login-page .pay-status--success{color:var(--color-success);background:#10b98114;border:1px solid #10b98133;font-weight:600}.login-page .pay-status svg{flex-shrink:0;width:1.125rem;height:1.125rem}.login-page .pay-spinner{animation:.8s linear infinite pay-spin}.login-page .pay-spinner-track{opacity:.25}.login-page .pay-spinner-head{opacity:.85}@keyframes pay-spin{to{transform:rotate(360deg)}}.login-page .backup-info{color:var(--color-text-muted);background:#f59e0b14;border:1px solid #f59e0b33;border-radius:10px;flex-direction:column;gap:.5rem;padding:1rem;font-size:.8125rem;line-height:1.5;display:flex}.login-page .backup-info strong{color:var(--color-warning)}.login-page .backup-codes{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.login-page .backup-code{background:var(--color-surface);border:1px solid var(--color-border);font-family:var(--font-mono);border-radius:8px;align-items:center;gap:.5rem;padding:.5rem .75rem;animation:.3s cubic-bezier(.34,1.56,.64,1) both code-appear;display:flex}.login-page .backup-code:first-child{animation-delay:0s}.login-page .backup-code:nth-child(2){animation-delay:50ms}.login-page .backup-code:nth-child(3){animation-delay:.1s}.login-page .backup-code:nth-child(4){animation-delay:.15s}.login-page .backup-code:nth-child(5){animation-delay:.2s}.login-page .backup-code:nth-child(6){animation-delay:.25s}.login-page .backup-code:nth-child(7){animation-delay:.3s}.login-page .backup-code:nth-child(8){animation-delay:.35s}@keyframes code-appear{0%{opacity:0;transform:translateY(10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.login-page .code-number{color:var(--color-text-dim);min-width:1.25rem;font-size:.75rem}.login-page .code-value{color:var(--color-text);letter-spacing:.05em;font-size:.875rem;font-weight:600}.login-page .backup-actions{justify-content:center;gap:.75rem;display:flex}.login-page .btn-ghost.small,.login-page .btn-primary.small{padding:.5rem 1rem;font-size:.8125rem}.login-page .verify-intro{color:var(--color-text-muted);font-size:.875rem;line-height:1.5}.login-page .verify-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;justify-content:space-between;align-items:center;padding:.5rem .75rem;font-size:.875rem;transition:all .3s;display:flex}.login-page .verify-item.done{opacity:.7;animation:.5s cubic-bezier(.34,1.56,.64,1) verify-done}@keyframes verify-done{0%{transform:scale(1)}50%{background:#10b9811a;transform:scale(1.05)}to{transform:scale(1)}}.login-page .verify-prompt{color:var(--color-text)}.login-page .verify-status{font-size:.8125rem;font-weight:600}.login-page .verify-status.success{color:var(--color-success)}.login-page .verify-status.error{color:var(--color-error)}.login-page .verify-input-group{align-items:center;gap:.75rem;display:flex}.login-page .verify-input-group .input-field{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;flex:1}.login-page .verification-code-section{flex-direction:column;gap:1rem;animation:.4s cubic-bezier(.34,1.56,.64,1) step-enter;display:flex}.login-page .verification-hint{color:var(--color-text-muted);margin:0;font-size:.875rem;line-height:1.5}.login-page .verification-hint strong{color:var(--color-text)}.login-page .verification-input-group{align-items:center;gap:.75rem;display:flex}.login-page .verification-code-input{text-align:center;flex:1;font-family:var(--font-mono)!important;letter-spacing:.5em!important;padding:.75rem!important;font-size:1.5rem!important}.login-page .verify-status-bar{border-radius:10px;align-items:center;gap:.5rem;padding:.625rem .875rem;font-size:.8125rem;font-weight:600;animation:.3s fade-up;display:flex}.login-page .verify-status-bar--idle{color:var(--color-error);background:#ef444414;border:1px solid #ef444433}.login-page .verify-status-bar--verifying{color:var(--color-warning);background:#f59e0b14;border:1px solid #f59e0b33}.login-page .verify-status-bar--success{color:var(--color-success);background:#10b98114;border:1px solid #10b98133;animation:.4s cubic-bezier(.34,1.56,.64,1) verify-success-pop}@keyframes verify-success-pop{0%{opacity:0;transform:scale(.95)}50%{transform:scale(1.03)}to{opacity:1;transform:scale(1)}}.login-page .verify-status-icon{flex-shrink:0;width:1.125rem;height:1.125rem}.login-page .verify-status-spinner{flex-shrink:0;width:1.125rem;height:1.125rem;animation:.8s linear infinite verify-spin}.login-page .verify-spinner-track{opacity:.25}.login-page .verify-spinner-head{opacity:.85}@keyframes verify-spin{to{transform:rotate(360deg)}}.login-page .verification-footer{justify-content:space-between;align-items:center;display:flex}.login-page .resend-btn,.login-page .change-email-btn{color:var(--color-accent);cursor:pointer;background:0 0;border:none;padding:.375rem 0;font-family:inherit;font-size:.8125rem;font-weight:500;transition:color .2s,opacity .2s}.login-page .resend-btn:hover:not(:disabled),.login-page .change-email-btn:hover{color:var(--color-brand-400)}.login-page .resend-btn:disabled{color:var(--color-text-dim);cursor:not-allowed;opacity:.6}.login-page .change-email-btn{color:var(--color-text-muted)}.login-page .change-email-btn:hover{color:var(--color-text)}.login-page .step-nav{border-top:1px solid var(--color-border-light);margin-top:1.5rem;padding-top:1.5rem;position:relative}.login-page .next-btn{justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.875rem;font-size:1rem;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.login-page .next-btn:disabled{background:var(--color-surface-alt);color:var(--color-text-dim);cursor:not-allowed;opacity:.7;box-shadow:none;border:2px dashed var(--color-border)}.login-page .next-btn:not(:disabled){background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-brand-400) 100%);border:none}.login-page .next-btn:not(:disabled):before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);transition:transform .5s;position:absolute;inset:0;transform:translate(-100%)}.login-page .next-btn:not(:disabled):hover:before{transform:translate(100%)}.login-page .next-btn.registering{cursor:wait}.login-page .next-btn .btn-spinner{flex-shrink:0;width:1.125rem;height:1.125rem;animation:.8s linear infinite btn-spin}.login-page .next-btn .btn-spinner-track{opacity:.25}.login-page .next-btn .btn-spinner-head{opacity:.85}@keyframes btn-spin{to{transform:rotate(360deg)}}.login-page .next-btn:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 8px 24px #2563eb66}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.login-page .code-boxes-container{justify-content:center;gap:.5rem;margin:1rem 0;display:flex}.login-page .code-box{text-align:center;width:2.5rem;height:3rem;font-family:var(--font-mono);text-transform:uppercase;background:var(--color-surface);border:2px solid var(--color-border);color:var(--color-text);caret-color:var(--color-accent);border-radius:10px;font-size:1.25rem;font-weight:600;transition:all .2s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}@property --spin-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.login-page .code-box-wrapper{border-radius:10px;display:inline-flex;position:relative}.login-page .code-box-wrapper.spinning:before{content:"";background:conic-gradient(from var(--spin-angle), red, #ff0, #0f0, #0ff, #00f, #f0f, red);-webkit-mask-composite:xor;animation:1.2s linear infinite spin-gradient;animation-delay:var(--spin-delay,0s);pointer-events:none;border-radius:10px;padding:2px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;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}.login-page .code-box:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-dim), 0 4px 12px #2563eb33;outline:none;transform:translateY(-2px)}.login-page .code-box.filled{background:var(--color-surface-alt);border-color:var(--color-brand-300)}.login-page .code-box.correct{border-color:var(--color-success);color:var(--color-success);background:#10b9811a;animation:.4s cubic-bezier(.34,1.56,.64,1) code-success}.login-page .code-box.incorrect{border-color:var(--color-error);color:var(--color-error);background:#ef44441a;animation:.4s code-shake}.login-page .code-box::placeholder{color:var(--color-text-dim);opacity:.5;font-size:1.5rem}.login-page .code-box:disabled{opacity:.7;cursor:not-allowed}@keyframes code-success{0%{transform:scale(1)}50%{background:#10b98133;transform:scale(1.1)}to{transform:scale(1)}}@keyframes code-shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}@keyframes spin-gradient{to{--spin-angle:360deg}}.login-page .cooldown-timer{color:var(--color-text-muted);justify-content:center;align-items:center;gap:.5rem;margin-top:.75rem;font-size:.875rem;display:flex}.login-page .cooldown-ring{width:24px;height:24px;color:var(--color-accent);transform:rotate(-90deg)}.login-page .cooldown-ring circle{transition:stroke-dashoffset 1s linear}.login-page .forgot-password-btn{text-align:center;width:100%;color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;margin-top:-.5rem;padding:.5rem 0;font-family:inherit;font-size:.8125rem;font-weight:500;transition:color .2s;display:block}.login-page .forgot-password-btn:hover{color:var(--color-accent);text-decoration:underline}.login-page .recovery-actions{flex-direction:column;gap:.75rem;margin-top:.5rem;display:flex}.login-page .recovery-actions .btn-ghost{align-self:center}.login-page .recovery-success{text-align:center;flex-direction:column;align-items:center;gap:.75rem;padding:1.5rem 0;display:flex}.login-page .recovery-success h3{color:var(--color-success);margin:0;font-size:1.125rem;font-weight:700}.login-page .recovery-success p{color:var(--color-text-muted);margin:0;font-size:.875rem;line-height:1.5}.login-page .resume-hint{text-align:center;color:var(--color-text-dim);margin-top:.75rem;font-size:.8125rem;line-height:1.5}