:is(html:has(body.login-page),html:has(.login-page)){height:auto!important;overflow:auto scroll!important}body.login-page{background:linear-gradient(#0a1628 0%,#134e6f 50%,#1a7a9e 100%) fixed;min-height:100vh;margin:0;padding:0;display:block;position:relative;height:auto!important;overflow:visible auto!important}.ocean-bg{pointer-events:none;position:absolute;inset:0;overflow:hidden}.ocean-bg .wave{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120'%3E%3Cpath fill='rgba(255,255,255,0.08)' d='M0,60 C300,120 600,0 900,60 C1200,120 1200,120 1200,120 L0,120 Z'/%3E%3C/svg%3E") repeat-x;width:200%;height:200px;animation:15s linear infinite wave-move;position:absolute;bottom:0;left:0}.ocean-bg .wave-1{opacity:.6;animation-duration:12s;bottom:0}.ocean-bg .wave-2{opacity:.4;animation-duration:18s;animation-direction:reverse;bottom:30px}.ocean-bg .wave-3{opacity:.2;animation-duration:24s;bottom:60px}@keyframes wave-move{0%{transform:translate(0)}to{transform:translate(-50%)}}.floating-elements{position:absolute;inset:0}.float-item{opacity:.3;font-size:2rem;animation:20s ease-in-out infinite float-around;position:absolute}.float-item:first-child{animation-delay:0s;top:20%;left:10%}.float-item:nth-child(2){animation-delay:5s;top:15%;left:80%}.float-item:nth-child(3){animation-delay:10s;top:70%;left:15%}.float-item:nth-child(4){animation-delay:15s;top:75%;left:85%}@keyframes float-around{0%,to{transform:translate(0)rotate(0)}25%{transform:translate(20px,-20px)rotate(10deg)}50%{transform:translate(-10px,10px)rotate(-5deg)}75%{transform:translate(15px,15px)rotate(5deg)}}.login-container{z-index:10;box-sizing:border-box;width:100%;max-width:440px;margin:0 auto;padding:4rem 2rem;position:relative}.login-logo{color:#fff;justify-content:center;align-items:center;gap:.5rem;margin-bottom:2rem;font-size:1.75rem;font-weight:700;text-decoration:none;display:flex}.login-logo .logo-icon{font-size:2rem;animation:3s ease-in-out infinite float-gentle}@keyframes float-gentle{0%,to{transform:translateY(0)rotate(-5deg)}50%{transform:translateY(-5px)rotate(5deg)}}.login-logo .logo-accent{background:linear-gradient(135deg,#ff6b9d 0%,#ff9f43 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.login-card{-webkit-backdrop-filter:blur(20px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:24px;padding:2rem;animation:.6s ease-out card-enter;box-shadow:0 25px 50px #0000004d,inset 0 0 0 1px #ffffff0d}@keyframes card-enter{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.auth-tabs{background:#ffffff0d;border-radius:12px;margin-bottom:1.5rem;padding:4px;display:flex;position:relative}.auth-tab{color:#ffffff80;cursor:pointer;z-index:1;background:0 0;border:none;border-radius:8px;flex:1;padding:.75rem;font-size:.95rem;font-weight:600;transition:all .3s}.auth-tab:hover:not(.active){color:#ffffffb3}.auth-tab.active{color:#fff}.auth-tab-indicator{z-index:0;background:linear-gradient(135deg,#ff6b9d 0%,#ff9f43 100%);border-radius:8px;width:calc(50% - 4px);height:calc(100% - 8px);transition:transform .3s cubic-bezier(.34,1.56,.64,1);position:absolute;top:4px;left:4px}.auth-tabs:has(#signupTab.active) .auth-tab-indicator{transform:translate(100%)}.auth-form{animation:.3s ease-out form-fade}@keyframes form-fade{0%{opacity:0}to{opacity:1}}.form-title{color:#fff;text-align:center;margin-bottom:.5rem;font-size:1.5rem;font-weight:700}.form-subtitle{color:#fff9;text-align:center;margin-bottom:1.5rem;font-size:.95rem}.form-group{margin-bottom:1.25rem}.form-group label{color:#fffc;margin-bottom:.5rem;font-size:.9rem;font-weight:500;display:block}.input-wrapper{position:relative}.input-wrapper .input-icon{pointer-events:none;font-size:1rem;position:absolute;top:50%;left:1rem;transform:translateY(-50%)}.input-wrapper input{color:#fff;background:#ffffff14;border:1px solid #ffffff1a;border-radius:12px;width:100%;padding:.875rem 1rem .875rem 2.75rem;font-size:1rem;transition:all .3s}.form-group .input-icon+input{padding-left:2.75rem}.input-wrapper input::placeholder{color:#fff6}.input-wrapper input:focus{background:#ffffff1f;border-color:#ff6b9d;outline:none;box-shadow:0 0 0 3px #ff6b9d33}.password-toggle{color:#ffffff80;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:all .3s;display:flex;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.password-toggle:hover{color:#fff;background:#ffffff1a}.input-hint{color:#ffffff80;margin-top:.5rem;font-size:.75rem;display:block}.password-strength{align-items:center;gap:.75rem;margin-top:.5rem;display:flex}.strength-bar{background:#ffffff1a;border-radius:100px;flex:1;height:4px;position:relative;overflow:hidden}.strength-bar:after{content:"";border-radius:100px;width:0;height:100%;transition:all .3s;position:absolute;top:0;left:0}.password-strength[data-strength=weak] .strength-bar:after{background:#ef4444;width:25%}.password-strength[data-strength=fair] .strength-bar:after{background:#f59e0b;width:50%}.password-strength[data-strength=good] .strength-bar:after{background:#22c55e;width:75%}.password-strength[data-strength=strong] .strength-bar:after{background:#22c55e;width:100%}.strength-text{text-align:right;min-width:50px;font-size:.75rem;font-weight:500}.password-strength[data-strength=weak] .strength-text{color:#ef4444}.password-strength[data-strength=fair] .strength-text{color:#f59e0b}.password-strength[data-strength=good] .strength-text,.password-strength[data-strength=strong] .strength-text{color:#22c55e}.form-options{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.checkbox-wrapper{cursor:pointer;color:#ffffffb3;align-items:center;gap:.5rem;font-size:.9rem;display:flex}.checkbox-wrapper input{display:none}.checkbox-custom{border:2px solid #ffffff4d;border-radius:4px;width:18px;height:18px;transition:all .3s;position:relative}.checkbox-wrapper input:checked+.checkbox-custom{background:linear-gradient(135deg,#ff6b9d 0%,#ff9f43 100%);border-color:#0000}.checkbox-custom:after{content:"✓";color:#fff;opacity:0;justify-content:center;align-items:center;font-size:.65rem;font-weight:700;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:absolute;inset:0;transform:scale(0)}.checkbox-wrapper input:checked+.checkbox-custom:after{opacity:1;transform:scale(1)}.forgot-link{color:#ff6b9d;font-size:.9rem;text-decoration:none;transition:opacity .3s}.forgot-link:hover{opacity:.8}.back-btn{color:#fffc;cursor:pointer;background:#ffffff1a;border:none;border-radius:8px;align-items:center;margin-bottom:1rem;padding:.5rem 1rem;font-size:.9rem;transition:all .3s;display:inline-flex}.back-btn:hover{color:#fff;background:#ffffff26}.btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;padding:1rem 1.5rem;font-size:1rem;font-weight:600;transition:all .3s;display:inline-flex}.btn-primary{color:#fff;background:linear-gradient(135deg,#ff6b9d 0%,#ff9f43 100%)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px #ff6b9d66}.btn-full{width:100%}.btn-loader{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.auth-error,.auth-success{border-radius:12px;margin-top:1rem;padding:1rem;font-size:.9rem;animation:.3s ease-out message-enter}@keyframes message-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.auth-error{color:#fca5a5;background:#ef444426;border:1px solid #ef44444d}.auth-success{color:#86efac;background:#22c55e26;border:1px solid #22c55e4d}.auth-divider{align-items:center;gap:1rem;margin:1.5rem 0;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:#ffffff1a;flex:1;height:1px}.auth-divider span{color:#ffffff80;font-size:.85rem}.social-buttons{gap:1rem;display:flex}.social-btn{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff1a;border-radius:12px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.875rem;font-weight:500;transition:all .3s;display:flex}.social-btn:hover{background:#ffffff1f;border-color:#fff3;transform:translateY(-2px)}.social-icon{width:20px;height:20px}.login-footer{text-align:center;color:#ffffff80;justify-content:center;gap:1rem;margin-top:1.5rem;font-size:.9rem;display:flex}.login-footer a{color:#ffffffb3;text-decoration:none;transition:color .3s}.login-footer a:hover{color:#ff6b9d}.toast-container{z-index:1000;flex-direction:column;gap:.5rem;display:flex;position:fixed;bottom:2rem;right:2rem}.hidden{display:none!important}.phone-sign-in-btn{color:#ffb86c;letter-spacing:.01em;cursor:pointer;background:linear-gradient(135deg,#ff6b9d26 0%,#ff9f4326 100%);border:1.5px solid #ff9f4380;border-radius:12px;justify-content:center;align-items:center;gap:.75rem;width:100%;padding:.95rem 1.25rem;font-size:1.05rem;font-weight:700;transition:all .3s;display:flex;position:relative;overflow:hidden}.phone-sign-in-btn:before{content:"";opacity:0;z-index:0;background:linear-gradient(135deg,#ff6b9d,#ff9f43);transition:opacity .35s;position:absolute;inset:0}.phone-sign-in-btn:hover{color:#fff;border-color:#0000;transform:translateY(-2px);box-shadow:0 8px 28px #ff6b9d59,0 4px 12px #ff9f4340}.phone-sign-in-btn:hover:before{opacity:1}.phone-sign-in-btn:active{transform:translateY(0);box-shadow:0 4px 14px #ff6b9d40}.phone-btn-icon{z-index:1;font-size:1.25rem;transition:transform .3s;position:relative}.phone-sign-in-btn:hover .phone-btn-icon{transform:scale(1.2)rotate(-8deg)}.phone-btn-label{z-index:1;position:relative}.phone-btn-arrow{opacity:0;z-index:1;font-size:1.15rem;transition:all .3s;position:relative;transform:translate(-8px)}.phone-sign-in-btn:hover .phone-btn-arrow{opacity:1;transform:translate(0)}.phone-input-row{gap:0;display:flex!important}.login-card select.phone-country-select{outline:none;flex:0 0 88px;font-size:.95rem;font-weight:600;color:#1a2744!important;appearance:none!important;background:#f0f4f8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231a2744' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") right 8px center/12px no-repeat!important;border:1px solid #fff6!important;border-right:none!important;border-radius:12px 0 0 12px!important;width:88px!important;padding:0 24px 0 10px!important}.login-card select.phone-country-select:focus{background:#fff!important;border-color:#ff6b9d!important;box-shadow:0 0 0 3px #ff6b9d26!important}.login-card select.phone-country-select option{color:#1a2744!important;background:#fff!important}.phone-number-input{min-width:0;border-left:none!important;border-radius:0 12px 12px 0!important;flex:1!important;width:auto!important;padding-left:1rem!important}.otp-input{letter-spacing:.5em;text-align:center;font-weight:600;font-size:1.2rem!important}.resend-code-link{color:#06b6d4;cursor:pointer;background:0 0;border:none;margin:.5rem auto 0;font-size:.85rem;display:block}@media (max-width:480px){.login-container{padding:1rem}.login-card{padding:1.5rem}.form-options{flex-direction:column;align-items:flex-start;gap:1rem}.social-buttons{flex-direction:column}.login-footer{flex-direction:column;gap:.5rem}.login-footer span{display:none}}
.login-page-layout{z-index:10;align-items:center;min-height:100vh;display:flex;position:relative}.otter-section{flex:1;justify-content:center;align-items:center;min-height:100vh;padding:2rem;display:flex}.otter-family-container{width:100%;max-width:500px}.otter-family-svg{filter:drop-shadow(0 8px 32px #0000004d);width:100%;height:auto;display:block;overflow:visible}.login-divider{background:linear-gradient(#0000,#ffffff1f 15%,#ffffff38 50%,#ffffff1f 85%,#0000);flex-shrink:0;align-self:stretch;width:2px;margin:8vh 0}.login-section{flex:1;justify-content:flex-start;align-items:center;min-height:100vh;padding:2rem 3rem 2rem 2.5rem;display:flex}.login-page-layout .login-container{width:100%;max-width:440px;margin:0;padding:2rem 0}.otter-head-group{transform-style:preserve-3d}.head-3d{transform-origin:80px 75px;will-change:transform}.otter-family-svg .mouth{opacity:0;transition:opacity .3s}.otter-family-svg .otter-eyes-closed{opacity:0;transition:opacity .35s}.otter-family-svg .otter-eyes-open,.otter-family-svg .eyelashes{transition:opacity .35s}.otter-family-svg .otter-cheek{transition:fill .4s,rx .4s}.otter-family-svg.state-tracking .mouth-normal,.otter-family-svg.state-focused .mouth-happy,.otter-family-svg.state-hiding .mouth-hidden{opacity:1}.otter-family-svg.state-hiding .otter-eyes-open,.otter-family-svg.state-hiding .eyelashes{opacity:0}.otter-family-svg.state-hiding .otter-eyes-closed{opacity:1}.deco-bubbles circle{animation:6s ease-in-out infinite bubble-drift}.deco-bubbles circle:nth-child(2){animation-duration:7s;animation-delay:-1s}.deco-bubbles circle:nth-child(3){animation-duration:5s;animation-delay:-2s}.deco-bubbles circle:nth-child(4){animation-duration:8s;animation-delay:-3.5s}.deco-bubbles circle:nth-child(5){animation-duration:6.5s;animation-delay:-4s}.deco-bubbles circle:nth-child(6){animation-duration:7.5s;animation-delay:-1.5s}@keyframes bubble-drift{0%,to{opacity:.1;transform:translateY(0)scale(1)}50%{opacity:.18;transform:translateY(-12px)scale(1.15)}}.sparkle{animation:3s ease-in-out infinite sparkle-pulse}.sparkle.sp2{animation-duration:3.5s;animation-delay:-1s}.sparkle.sp3{animation-duration:4s;animation-delay:-2s}@keyframes sparkle-pulse{0%,to{opacity:.15;transform:scale(1)rotate(0)}50%{opacity:.35;transform:scale(1.3)rotate(20deg)}}@media (max-width:1100px){.otter-section{flex:.8}.login-section{flex:1.2}.otter-family-container{max-width:400px}}@media (max-width:768px){.login-page-layout{flex-direction:column;min-height:auto}.otter-section{flex:none;min-height:auto;padding:2rem 2rem .5rem}.otter-family-container{max-width:320px;margin:0 auto}.login-divider{background:linear-gradient(90deg,#0000,#ffffff26 20%,#fff3 50%,#ffffff26 80%,#0000);align-self:auto;width:60%;height:2px;margin:.5rem auto}.login-section{justify-content:center;min-height:auto;padding:1rem 2rem 2rem}.login-page-layout .login-container{margin:0 auto;padding:1rem 0 2rem}}@media (max-width:480px){.otter-family-container{max-width:260px}.otter-section{padding:1.5rem 1rem .5rem}.login-section{padding:.5rem 1rem 2rem}.login-page-layout .login-container{padding:.5rem 0 1.5rem}}
body:has(.login-page){background:linear-gradient(#0a1628 0%,#134e6f 50%,#1a7a9e 100%) fixed}.login-page .floating-elements{overflow:visible}.login-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}