/* Decorative layers are clipped independently so the login can scroll freely. */
.login-screen { position: relative; isolation: isolate; }
.login-screen > .login-card, .login-screen > .page-header { position: relative; z-index: 1; }
.login-parallax { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; user-select: none; }
.login-parallax [data-depth] { transform: translate3d(var(--parallax-x, 0px), var(--parallax-y, 0px), 0); transition: transform 700ms cubic-bezier(.2,.65,.3,1); }
.login-parallax-grid { position: absolute; inset: -35px; opacity: .3; background-image: radial-gradient(#6b9888 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(120deg, #000, transparent 60%, #000); }
.login-parallax-orb { position: absolute; border-radius: 50%; }
.login-parallax-orb-mint { width: clamp(240px, 38vw, 560px); aspect-ratio: 1; top: -15%; right: -8%; background: radial-gradient(circle at 35% 35%, #bcebd3b3, #bcebd310 70%); }
.login-parallax-orb-navy { width: clamp(230px, 33vw, 470px); aspect-ratio: 1; bottom: -18%; left: -9%; background: radial-gradient(circle, #25555324, #bcebd340 50%, transparent 72%); }
.login-parallax-ring { position: absolute; width: clamp(190px, 25vw, 350px); aspect-ratio: 1; border: 1px solid #43897226; border-radius: 50%; left: -8%; top: 12%; box-shadow: 0 0 0 28px #43897207, 0 0 0 56px #43897205; }
.login-parallax-widget { position: absolute; width: 174px; }
.login-parallax-widget-inner { padding: 18px; border: 1px solid #ffffffd9; border-radius: 18px; background: #ffffff9c; box-shadow: 0 18px 45px #142d4310; animation: login-parallax-float 9s ease-in-out infinite alternate; }
.login-parallax-chart { left: max(18px, calc(50% - 590px)); top: 24%; rotate: -12deg; }
.login-parallax-checklist { right: max(18px, calc(50% - 590px)); bottom: 18%; rotate: 12deg; }
.login-parallax-checklist .login-parallax-widget-inner { animation-delay: -4s; }
.login-parallax-dots { display: flex; gap: 5px; }
.login-parallax-dots b { width: 5px; height: 5px; border-radius: 50%; background: #7baa98; }
.login-parallax-bars { display: flex; gap: 9px; align-items: flex-end; height: 82px; padding-top: 16px; }
.login-parallax-bars i { flex: 1; height: 36%; border-radius: 5px 5px 2px 2px; background: #bcebd3; }
.login-parallax-bars i:nth-child(2) { height: 62%; }
.login-parallax-bars i:nth-child(3) { height: 48%; background: #83b69f; }
.login-parallax-bars i:nth-child(4) { height: 85%; background: #255553; }
.login-parallax-bars i:nth-child(5) { height: 100%; background: #438972; }
.login-parallax-symbol { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: #bcebd3; color: #255553; font-weight: 800; margin-bottom: 14px; }
.login-parallax-line { display: block; height: 6px; border-radius: 5px; background: #25555321; margin-top: 9px; }
.login-parallax-line:last-child { width: 65%; }
.login-parallax-tile { position: absolute; right: 13%; top: 8%; display: grid; place-items: center; width: 64px; height: 64px; border: 1px solid #ffffffcc; border-radius: 18px; background: #bcebd380; color: #25555380; font-size: 28px; rotate: 15deg; }
@keyframes login-parallax-float { from { transform: translateY(-7px); } to { transform: translateY(7px); } }
@media (max-width: 700px) {
    .login-parallax-widget { width: 118px; opacity: .55; }
    .login-parallax-widget-inner { padding: 12px; border-radius: 14px; }
    .login-parallax-chart { left: -38px; top: 20%; }
    .login-parallax-checklist { right: -36px; bottom: 8%; }
    .login-parallax-tile { right: -15px; top: 3%; width: 48px; height: 48px; font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
    .login-parallax [data-depth] { transform: none !important; transition: none; }
    .login-parallax-widget-inner { animation: none; }
}
.login-parallax.is-paused .login-parallax-widget-inner { animation-play-state: paused; }