.login-page{--color-bg1:#221054;--color-bg2:#080416;--color1:#4420a7;--color2:#a955e7;--color3:#08ecfe;--color4:#301678;--color5:#823cc8;--color-interactive:#08ecfe;--color-small1:#a955e7;--color-small2:#08ecfe;--color-small3:#4420a7;--color-small4:#8c46dc;--circle-size:40%;--circle-size-sm:14%;--blending:hard-light}@keyframes login-moveInCircle{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}@keyframes login-moveVertical{0%{transform:translateY(-50%)}50%{transform:translateY(50%)}to{transform:translateY(-50%)}}@keyframes login-moveHorizontal{0%{transform:translate(-50%)translateY(-10%)}50%{transform:translate(50%)translateY(10%)}to{transform:translate(-50%)translateY(-10%)}}.login-page .gradient-bg{z-index:0;background:linear-gradient(40deg, var(--color-bg1), var(--color-bg2));pointer-events:none;width:100vw;height:100vh;position:fixed;inset:0;overflow:hidden}.login-page .gradient-bg svg{width:0;height:0;position:fixed;top:0;left:0}.login-page .gradient-bg .gradients-container{filter:url(#login-goo)blur(40px);width:100%;height:100%}.login-page .gradient-bg .g1{background:radial-gradient(circle at center, rgb(from var(--color1) r g b / .8) 0, rgb(from var(--color1) r g b / 0) 50%) no-repeat;mix-blend-mode:var(--blending);width:var(--circle-size);height:var(--circle-size);top:calc(50% - var(--circle-size) / 2);left:calc(50% - var(--circle-size) / 2);transform-origin:50%;opacity:1;animation:30s infinite login-moveVertical;position:absolute}.login-page .gradient-bg .g2{background:radial-gradient(circle at center, rgb(from var(--color2) r g b / .8) 0, rgb(from var(--color2) r g b / 0) 50%) no-repeat;mix-blend-mode:var(--blending);width:var(--circle-size);height:var(--circle-size);top:calc(50% - var(--circle-size) / 2);left:calc(50% - var(--circle-size) / 2);transform-origin:calc(50% - 400px);opacity:1;animation:20s infinite reverse login-moveInCircle;position:absolute}.login-page .gradient-bg .g3{background:radial-gradient(circle at center, rgb(from var(--color3) r g b / .8) 0, rgb(from var(--color3) r g b / 0) 50%) no-repeat;mix-blend-mode:var(--blending);width:var(--circle-size);height:var(--circle-size);top:calc(50% - var(--circle-size) / 2 + 200px);left:calc(50% - var(--circle-size) / 2 - 500px);transform-origin:calc(50% + 400px);opacity:1;animation:40s linear infinite login-moveInCircle;position:absolute}.login-page .gradient-bg .g4{background:radial-gradient(circle at center, rgb(from var(--color4) r g b / .8) 0, rgb(from var(--color4) r g b / 0) 50%) no-repeat;mix-blend-mode:var(--blending);width:var(--circle-size);height:var(--circle-size);top:calc(50% - var(--circle-size) / 2);left:calc(50% - var(--circle-size) / 2);transform-origin:calc(50% - 200px);opacity:.7;animation:40s infinite login-moveHorizontal;position:absolute}.login-page .gradient-bg .g5{background:radial-gradient(circle at center, rgb(from var(--color5) r g b / .8) 0, rgb(from var(--color5) r g b / 0) 50%) no-repeat;mix-blend-mode:var(--blending);width:calc(var(--circle-size) * 2);height:calc(var(--circle-size) * 2);top:calc(50% - var(--circle-size));left:calc(50% - var(--circle-size));transform-origin:calc(50% - 800px) calc(50% + 200px);opacity:1;animation:20s infinite login-moveInCircle;position:absolute}.login-page .gradient-bg .s1,.login-page .gradient-bg .s2,.login-page .gradient-bg .s3,.login-page .gradient-bg .s4,.login-page .gradient-bg .s5,.login-page .gradient-bg .s6,.login-page .gradient-bg .s7,.login-page .gradient-bg .s8{mix-blend-mode:var(--blending);width:var(--circle-size-sm);height:var(--circle-size-sm);top:calc(50% - var(--circle-size-sm) / 2);left:calc(50% - var(--circle-size-sm) / 2);opacity:.85;position:absolute}.login-page .gradient-bg .s1{background:radial-gradient(circle at center, rgb(from var(--color-small1) r g b / .9) 0, rgb(from var(--color-small1) r g b / 0) 50%) no-repeat;transform-origin:calc(50% + 70px) calc(50% - 40px);animation:12s linear infinite login-moveInCircle}.login-page .gradient-bg .s2{background:radial-gradient(circle at center, rgb(from var(--color-small2) r g b / .9) 0, rgb(from var(--color-small2) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * .7);height:calc(var(--circle-size-sm) * .7);top:calc(50% - var(--circle-size-sm) * .35);left:calc(50% - var(--circle-size-sm) * .35);transform-origin:calc(50% - 90px) calc(50% + 50px);animation:15s linear infinite reverse login-moveInCircle}.login-page .gradient-bg .s3{background:radial-gradient(circle at center, rgb(from var(--color-small3) r g b / .9) 0, rgb(from var(--color-small3) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * 1.05);height:calc(var(--circle-size-sm) * 1.05);top:calc(50% - var(--circle-size-sm) * .525);left:calc(50% - var(--circle-size-sm) * .525);transform-origin:calc(50% + 45px) calc(50% + 80px);animation:18s linear infinite login-moveInCircle}.login-page .gradient-bg .s4{background:radial-gradient(circle at center, rgb(from var(--color-small4) r g b / .9) 0, rgb(from var(--color-small4) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * .55);height:calc(var(--circle-size-sm) * .55);top:calc(50% - var(--circle-size-sm) * .275);left:calc(50% - var(--circle-size-sm) * .275);transform-origin:calc(50% - 55px) calc(50% - 70px);opacity:.75;animation:11s infinite reverse login-moveInCircle}.login-page .gradient-bg .s5{background:radial-gradient(circle at center, rgb(from var(--color-small1) r g b / .85) 0, rgb(from var(--color-small1) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * .8);height:calc(var(--circle-size-sm) * .8);top:calc(50% - var(--circle-size-sm) * .4);left:calc(50% - var(--circle-size-sm) * .4);transform-origin:calc(50% + 100px) calc(50% + 30px);animation:16s infinite login-moveInCircle}.login-page .gradient-bg .s6{background:radial-gradient(circle at center, rgb(from var(--color-small2) r g b / .85) 0, rgb(from var(--color-small2) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * .5);height:calc(var(--circle-size-sm) * .5);top:calc(50% - var(--circle-size-sm) * .25);left:calc(50% - var(--circle-size-sm) * .25);transform-origin:calc(50% - 40px) calc(50% + 95px);opacity:.8;animation:13s linear infinite reverse login-moveInCircle}.login-page .gradient-bg .s7{background:radial-gradient(circle at center, rgb(from var(--color-small3) r g b / .9) 0, rgb(from var(--color-small3) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * .9);height:calc(var(--circle-size-sm) * .9);top:calc(50% - var(--circle-size-sm) * .45);left:calc(50% - var(--circle-size-sm) * .45);transform-origin:calc(50% + 25px) calc(50% - 85px);animation:20s infinite reverse login-moveInCircle}.login-page .gradient-bg .s8{background:radial-gradient(circle at center, rgb(from var(--color-small4) r g b / .85) 0, rgb(from var(--color-small4) r g b / 0) 50%) no-repeat;width:calc(var(--circle-size-sm) * .65);height:calc(var(--circle-size-sm) * .65);top:calc(50% - var(--circle-size-sm) * .325);left:calc(50% - var(--circle-size-sm) * .325);transform-origin:calc(50% - 75px) calc(50% - 25px);opacity:.78;animation:14s linear infinite login-moveInCircle}.login-page .gradient-bg .interactive{background:radial-gradient(circle at center, rgb(from var(--color-interactive) r g b / .8) 0, rgb(from var(--color-interactive) r g b / 0) 50%) no-repeat;mix-blend-mode:var(--blending);opacity:.7;width:100%;height:100%;position:absolute;top:-50%;left:-50%}@media (prefers-reduced-motion:reduce){.login-page .gradient-bg .g1,.login-page .gradient-bg .g2,.login-page .gradient-bg .g3,.login-page .gradient-bg .g4,.login-page .gradient-bg .g5,.login-page .gradient-bg .s1,.login-page .gradient-bg .s2,.login-page .gradient-bg .s3,.login-page .gradient-bg .s4,.login-page .gradient-bg .s5,.login-page .gradient-bg .s6,.login-page .gradient-bg .s7,.login-page .gradient-bg .s8{animation:none!important}}
.login-page{background:0 0;place-items:center;min-height:100dvh;display:grid;position:relative;overflow-x:hidden}.login-page .login-shell{z-index:1;background:linear-gradient(#05062d,#0c0e41) padding-box padding-box,linear-gradient(144deg,#af40ff,#5b42f3 50%,#00ddeb) border-box;border:5px solid #0000;border-radius:18px;width:min(440px,100% - 40px);margin:32px auto;padding:0;position:relative;overflow:hidden;box-shadow:0 24px 70px #00000075}.login-page .login-panel{padding:clamp(28px,6vw,42px)}.login-page .login-heading{text-align:center;margin-bottom:30px;display:block}.login-page .login-logo{width:170px;height:auto;margin:0 auto 18px;display:block}.login-page .login-heading h1{letter-spacing:-.02em;max-width:22ch;color:var(--foreground);margin:0 auto;font-size:clamp(1.05rem,2.8vw,1.2rem);font-weight:700;line-height:1.3}.login-page .login-form{gap:18px;margin:0;display:grid}.login-page .field-group{gap:8px;display:grid}.login-page .login-form label{color:var(--foreground);font-weight:700}.login-page .login-form input,.login-page .login-form [data-slot=input]{box-sizing:border-box;width:100%;min-height:46px}.login-page .login-form .critical-action-button{width:100%;min-height:46px;margin-top:6px}.login-page .login-form .critical-action-button__content{min-height:42px}.login-page .form-status{color:var(--muted-foreground);text-align:center;margin:0;font-size:.925rem}.login-page .form-status:not(:empty){min-height:1.6em;margin-top:14px}.login-page .form-status[role=alert]{color:var(--destructive-fg)}@media (max-width:480px){.login-page .login-shell{width:calc(100% - 28px);margin:14px auto}.login-page .login-panel{padding:28px 22px}}
