.login-entry.login-onboarding{overscroll-behavior:contain;height:100dvh;overflow:hidden auto}.login-entry.login-onboarding>.surface{min-height:100%;padding:28px 24px;padding-block:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-bottom));flex-direction:column;align-items:center;gap:0;display:flex}.login-onboarding .login-panel{flex:none;max-width:344px;margin-block:auto;animation:none}.onboarding-character{--onboarding-character-size:172px;isolation:isolate;width:calc(var(--onboarding-character-size) + 48px);height:calc(var(--onboarding-character-size) + 32px);flex:none;place-items:center;margin-inline:auto;line-height:0;animation:.55s cubic-bezier(.2,.7,.2,1) both onboarding-character-arrive;display:grid;position:relative}.onboarding-character:before{content:"";z-index:-1;background:radial-gradient(ellipse,color-mix(in srgb,var(--tint) 80%,transparent),transparent 70%);pointer-events:none;border-radius:50%;position:absolute;inset:10% 0 0}.onboarding-character>.mascot{width:var(--onboarding-character-size)!important;height:var(--onboarding-character-size)!important}.login-onboarding .onboarding-body{width:100%;animation:.42s ease-out 60ms both onboarding-form-arrive}.login-onboarding .login-panel h1{text-wrap:balance;margin-top:8px;font-size:27px;font-weight:700;line-height:1.6}.login-onboarding .login-intro{text-wrap:balance;margin-top:4px;font-size:14px;line-height:1.8}.login-onboarding .login-panel form{gap:14px;margin-top:22px}.login-onboarding .login-panel .field{gap:7px}.login-onboarding .field>span,.login-onboarding .otp-field>label{color:var(--muted);font-weight:600}.login-onboarding .login-panel .field input.login-phone-input{border-color:color-mix(in srgb,var(--accent) 36%,var(--line));background:var(--surface);height:58px;box-shadow:0 0 0 4px color-mix(in srgb,var(--tint) 38%,transparent),0 8px 26px -17px var(--accent);border-radius:15px;transition:border-color .2s,box-shadow .25s}.login-onboarding .login-panel .field input.login-phone-input:focus{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 13%,transparent),0 8px 28px -14px color-mix(in srgb,var(--accent) 55%,transparent);outline:none}.login-onboarding .login-panel .field input.login-phone-input[aria-invalid=true]{border-color:var(--error);box-shadow:0 0 0 3px var(--error-bg)}.login-onboarding .login-panel form>.button{border-radius:13px;min-height:48px;margin-top:5px;padding-inline:17px}.login-onboarding .login-demo{margin-top:12px;line-height:1.8}.login-onboarding .login-phone{letter-spacing:.25px;margin-top:6px;font-size:16px}.login-onboarding .otp-cell{box-shadow:0 3px 12px -10px var(--accent);border-radius:13px}.login-onboarding .otp-entry:focus-within .otp-cell.active{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}.login-onboarding .login-code-actions{margin-top:12px}.login-onboarding .login-secondary-button{border-radius:12px;min-height:44px}.login-onboarding .onboarding-status{min-height:20px;margin-top:10px;line-height:20px}.login-onboarding .login-retry{margin-top:2px}.login-onboarding .onboarding-body>.text-button{margin-top:10px}.inline-auth.login-onboarding .onboarding-character{--onboarding-character-size:64px;width:88px;height:82px;animation:none}.inline-auth.login-onboarding .onboarding-character:before{inset:0}.inline-auth.login-onboarding .onboarding-body{animation:none}.inline-auth.login-onboarding .login-panel h1{margin-top:2px;font-size:20px}.inline-auth.login-onboarding .login-panel form{margin-top:16px}.inline-auth.login-onboarding .login-panel .field input.login-phone-input{height:54px;box-shadow:none}.telegram-invitation.onboarding-invitation{padding-block:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-bottom));overflow-y:auto}.onboarding-invitation .telegram-invitation-content{margin-block:auto}.onboarding-invitation .telegram-invitation-character{padding:0}.onboarding-invitation h1{margin-top:8px;margin-bottom:4px;font-size:27px}.onboarding-invitation p{font-size:15px}.onboarding-invitation .telegram-invitation-actions{gap:10px;margin-top:24px}.onboarding-invitation .telegram-later{color:var(--muted);background:0 0;border-color:#0000}@keyframes onboarding-character-arrive{0%{opacity:.55;transform:translateY(9px)scale(.97)}to{opacity:1;transform:none}}@keyframes onboarding-form-arrive{0%{opacity:.7;transform:translateY(5px)}to{opacity:1;transform:none}}@media (max-width:380px){.login-entry.login-onboarding>.surface{padding-inline:22px}.login-onboarding .login-panel h1,.onboarding-invitation h1{font-size:25px}.login-onboarding .login-secondary-button{padding-inline:6px;font-size:11px}.onboarding-invitation .telegram-invitation-content{max-width:320px}}@media (max-height:620px){.login-onboarding:not(.inline-auth) .onboarding-character,.onboarding-invitation .onboarding-character{--onboarding-character-size:132px;height:154px}.login-entry.login-onboarding>.surface{padding-block:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-bottom))}.login-onboarding .login-panel form{margin-top:17px}.onboarding-invitation .telegram-invitation-actions{margin-top:18px}}@media (max-height:460px){.login-onboarding:not(.inline-auth) .onboarding-character,.onboarding-invitation .onboarding-character{--onboarding-character-size:96px;height:116px}.login-entry.login-onboarding>.surface{padding-block:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-bottom))}.login-onboarding .login-panel h1{font-size:23px}}.reduced .onboarding-character,.reduced .onboarding-body,.reduced .login-phone-input,.reduced .otp-cell{transition:none!important;animation:none!important}@media (prefers-reduced-motion:reduce){.onboarding-character,.onboarding-body,.login-onboarding .login-phone-input,.login-onboarding .otp-cell{transition:none!important;animation:none!important}}
