:root{--safe-area-top:env(safe-area-inset-top,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px)}.auth-login-story-panel{background:radial-gradient(ellipse at 50% 40%,#167fd0 0,#0753aa 35%,transparent 68%),radial-gradient(ellipse at 50% 90%,#06499b,transparent 50%),linear-gradient(160deg,#0754ae,#03245e 65%,#021a49);color:#fff}.auth-story-skyline{position:relative;flex-shrink:0;width:100%;aspect-ratio:1024/290;background:url(/assets/images/school-heroes/auth-reference-light.png) top/100% auto no-repeat;mask-image:linear-gradient(#000,#000 75%,transparent)}.dark .auth-story-skyline{background-image:url(/assets/images/school-heroes/auth-reference-dark.png)}.auth-story-footer{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(20px,2.5vw,40px);min-height:max(148px,15vh);padding:28px 5%;flex-shrink:0;background:transparent}.auth-story-divider-comets{position:absolute;top:-4px;left:5%;right:5%;height:8px;overflow:hidden;pointer-events:none}.auth-story-comet{position:absolute;top:3px;left:50%;width:min(96px,22%);height:2px;opacity:0}.auth-story-comet:after{content:"";position:absolute;top:-1.5px;width:5px;height:5px;border-radius:50%;background:#e9faff;box-shadow:0 0 4px #92dcff}.auth-story-comet-left{background:linear-gradient(270deg,transparent,#88d6ff 80%,#e9faff);animation:auth-comet-left 7s ease-out infinite}.auth-story-comet-left:after{left:0}.auth-story-comet-right{transform:translateX(-100%);background:linear-gradient(90deg,transparent,#88d6ff 80%,#e9faff);animation:auth-comet-right 7s ease-out infinite}.auth-story-comet-right:after{right:0}@keyframes auth-comet-left{0%{left:50%;opacity:0}8%{opacity:1}70%{opacity:1}88%,to{left:0;opacity:0}}@keyframes auth-comet-right{0%{left:50%;opacity:0}8%{opacity:1}70%{opacity:1}88%,to{left:100%;opacity:0}}@media (prefers-reduced-motion:reduce){.auth-story-comet{animation:none;display:none}}.auth-story-waves{stroke:rgb(202 236 255/42%);stroke-width:1}.auth-story-wave-fill{fill:rgb(169 224 249/5%);stroke:none}.auth-login-robot-halo{background:radial-gradient(circle closest-side,#fff 0,rgb(255 255 255/96%) 20%,rgb(246 252 255/80%) 38%,rgb(229 246 255/48%) 56%,rgb(205 236 251/19%) 73%,rgb(205 236 251/5%) 87%,rgb(205 236 251/0) 100%)}.auth-form-backdrop{background:radial-gradient(ellipse at 0 12%,#d9edf8 0,transparent 48%),radial-gradient(ellipse at 100% 88%,#e0e4fa 0,transparent 45%),linear-gradient(145deg,#f4f9fc,#fafcff 55%,#f0f5fb)}.auth-form-backdrop:after,.auth-form-backdrop:before{content:"";position:absolute;width:76%;aspect-ratio:1;border:1px solid rgb(63 135 176/10%);border-radius:50%;box-shadow:0 0 0 32px rgb(63 135 176/3%),0 0 0 64px rgb(63 135 176/3%),0 0 0 96px rgb(63 135 176/2%)}.auth-form-backdrop:before{top:-34%;inset-inline-start:-35%}.auth-form-backdrop:after{bottom:-36%;inset-inline-end:-36%}.dark .auth-form-backdrop{background:radial-gradient(ellipse at 0 12%,#172f46 0,transparent 48%),radial-gradient(ellipse at 100% 88%,#22243f 0,transparent 45%),linear-gradient(145deg,#101d30,#0b1426 55%,#111d31)}.dark .auth-form-backdrop:after,.dark .auth-form-backdrop:before{border-color:rgb(150 198 229/12%);box-shadow:0 0 0 32px rgb(150 198 229/3%),0 0 0 64px rgb(150 198 229/3%),0 0 0 96px rgb(150 198 229/2%)}.auth-login-robot{position:relative;top:-6px;width:min(380px,36vh,65%);aspect-ratio:1}.auth-login-story-caption{display:flex;flex-direction:column;align-items:flex-start;gap:14px;min-width:0;text-align:start}.auth-story-caption-title{margin:0;width:fit-content;max-width:100%;color:#fff;font-size:clamp(1.375rem,1.7vw,1.75rem);font-weight:500;line-height:1.5;text-align:start;text-wrap:balance}.auth-story-certification{position:relative;padding:7px;border:1px solid rgb(190 225 255/32%);border-radius:18px;background:rgb(182 222 255/6%);box-shadow:0 8px 24px rgb(0 10 35/16%)}.auth-story-certification img{display:block;width:clamp(68px,5.8vw,96px);height:auto;padding:8px;border-radius:11px;background:#fff}.dark .auth-login-story-panel{background:radial-gradient(ellipse at 50% 43%,#0863bb 0,#032e70 28%,transparent 62%),radial-gradient(ellipse at 50% 90%,#033278,transparent 48%),linear-gradient(160deg,#021334,#010b25 70%,#01091e)}.dark .auth-story-waves{stroke:rgb(65 176 255/75%)}.dark .auth-story-wave-fill{fill:rgb(126 185 227/4%)}.dark .auth-login-robot-halo{background:radial-gradient(circle closest-side,#f4faff 0,rgb(240 249 255/90%) 20%,rgb(220 240 253/70%) 38%,rgb(177 216 242/37%) 56%,rgb(139 194 232/13%) 73%,rgb(139 194 232/3%) 87%,rgb(139 194 232/0) 100%)}