.login-scene{min-height:100dvh;background:var(--ludio-bg);color:var(--ludio-text);position:relative;overflow:hidden}.login-scene__art{position:absolute;inset:0;background:url(/assets/stories/afterimage-protocol.hero-960.webp) center / cover;opacity:.38}.login-scene__caption{position:relative;padding:48px;font-size:24px}.login-scene__caption strong{font-size:34px}.login-dialog{box-sizing:border-box;width:min(460px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - (2*max(24px,env(safe-area-inset-top,0px),env(safe-area-inset-bottom,0px))));padding:0;border:1px solid var(--ludio-line-strong);border-radius:26px;margin:auto;color:var(--ludio-text);background:var(--ludio-surface);box-shadow:0 28px 100px #0008;overflow:auto;overscroll-behavior:none;font-family:var(--ludio-ui-font-family, var(--ludio-font-family))}.login-dialog *,.login-dialog *:before,.login-dialog *:after{box-sizing:border-box}.login-dialog::backdrop{background:#08080bb8;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.login-dialog__body{padding:0 32px 32px;position:relative}.login-dialog__brand{display:flex;justify-content:center;align-items:center;gap:9px;margin-bottom:22px;font-size:26px;letter-spacing:-.04em}.login-dialog__brand img{object-fit:contain}.login-dialog__email-mark{display:grid;place-items:center;width:48px;height:48px;margin-bottom:18px;border-radius:15px;background:color-mix(in srgb,var(--ludio-brand) 16%,transparent);color:var(--ludio-accent-text)}.login-dialog__email-mark svg{width:26px;height:26px}.login-dialog__intro{margin:0 0 24px;color:var(--ludio-muted);font-size:13px;line-height:1.7;overflow-wrap:anywhere}.login-dialog--native{margin:auto auto 0;width:100%;max-width:640px;border-radius:26px 26px 0 0}.login-dialog--native .login-dialog__body{padding-bottom:max(24px,env(safe-area-inset-bottom,0px))}@media(max-width:600px){.login-dialog{width:100%;max-height:calc(100dvh - max(18px,env(safe-area-inset-top,0px)));margin:auto auto 0;border-radius:24px 24px 0 0;border-bottom:0}.login-dialog__body{padding:0 max(24px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(24px,env(safe-area-inset-left,0px))}.login-dialog__brand{display:none}.login-dialog__intro{margin-bottom:22px}}@media(max-height:550px){.login-dialog{max-height:calc(100dvh - (2*max(12px,env(safe-area-inset-top,0px),env(safe-area-inset-bottom,0px))))}.login-dialog--native{max-height:calc(100dvh - max(12px,env(safe-area-inset-top,0px)))}.login-dialog__body{padding-bottom:max(20px,env(safe-area-inset-bottom,0px))}.login-dialog__brand{margin-bottom:12px}}@media(max-height:550px)and (max-width:600px){.login-dialog{max-height:calc(100dvh - max(12px,env(safe-area-inset-top,0px)))}}.login-story-wall{position:absolute;inset-block-start:0;inset-inline-start:0;width:100%;height:59%;overflow:hidden;pointer-events:none;background:var(--ludio-bg)}.login-story-wall:before,.login-story-wall:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none}.login-story-wall:before{background:linear-gradient(to bottom,color-mix(in srgb,var(--ludio-bg) 65%,transparent),transparent 21%,transparent 72%,var(--ludio-bg))}.login-story-wall:after{background:linear-gradient(90deg,color-mix(in srgb,var(--ludio-bg) 40%,transparent),transparent 14%,transparent 85%,color-mix(in srgb,var(--ludio-bg) 40%,transparent))}.login-story-wall__grid{position:absolute;inset:-8% -22%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;transform:rotate(-8deg)}.login-story-wall__column{display:flex;flex-direction:column;gap:11px;min-width:0}.login-story-wall__column:nth-child(2n){transform:translateY(-55px)}.login-story-wall__column img{display:block;width:100%;height:auto;aspect-ratio:2 / 3;object-fit:cover;border-radius:11px}.login-story-wall--web{height:100%;opacity:.65}@container native-login (min-width: 700px){.native-auth .login-story-wall{inset-inline-start:-5%;width:77%;height:100%}.native-auth .login-story-wall:before{background:linear-gradient(to bottom,color-mix(in srgb,var(--ludio-bg) 25%,transparent),transparent 30%,color-mix(in srgb,var(--ludio-bg) 55%,transparent))}.native-auth .login-story-wall:after{background:linear-gradient(90deg,transparent 60%,var(--ludio-bg) 98%)}.native-auth[dir=rtl] .login-story-wall:after{background:linear-gradient(270deg,transparent 60%,var(--ludio-bg) 98%)}}
