/* Soft sports-inspired atmosphere. Motion uses transforms and opacity only. */
body{background:#f2f6f7}
#app{position:relative;z-index:1}
.ambient-scene{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;background:linear-gradient(135deg,#eef5ff 0%,#fbf8ed 48%,#e8f5ee 100%);isolation:isolate}
.ambient-glow{position:absolute;width:min(65vw,850px);aspect-ratio:1;border-radius:50%;opacity:.7;will-change:transform;animation:ambient-drift 25s ease-in-out infinite alternate}
.glow-mint{left:-17%;top:-29%;background:radial-gradient(circle,#7ddbcbb0 0%,#a9e8e47a 35%,#bdece900 69%);--travel-x:18vw;--travel-y:18vh}
.glow-peach{right:-20%;top:3%;background:radial-gradient(circle,#ffd098a6 0%,#ffe0ae73 36%,#ffe9d100 70%);--travel-x:-18vw;--travel-y:13vh;animation-duration:31s;animation-delay:-12s}
.glow-lilac{left:17%;bottom:-40%;background:radial-gradient(circle,#b8b4ed99 0%,#d4d1f35e 35%,#e3ddf600 70%);--travel-x:21vw;--travel-y:-13vh;animation-duration:35s;animation-delay:-18s}
.ambient-track{position:absolute;border:1px solid #6ab3bc38;border-radius:50%;width:800px;height:800px;animation:ambient-orbit 55s linear infinite;opacity:.7}
.ambient-track:before,.ambient-track:after{content:"";position:absolute;inset:18px;border:1px solid #85bfc226;border-radius:50%}
.ambient-track:after{inset:38px;border-style:dashed;border-color:#89babf28}
.ambient-track>i{position:absolute;width:12px;height:12px;top:17%;left:11%;border-radius:50%;background:#7ecfc9;box-shadow:0 0 0 8px #86d7d018,0 0 24px #7ecfc930}
.track-one{left:-550px;top:27%;transform:rotate(-22deg)}
.track-two{right:-490px;top:-490px;width:1000px;height:1000px;border-color:#d6af903b;animation-duration:75s;animation-direction:reverse}
.track-two:before,.track-two:after{border-color:#d6af9026}
.track-two>i{background:#e8b384;box-shadow:0 0 0 8px #edc29018;top:80%;left:89%}
.ambient-dots{position:absolute;inset:0}
.ambient-dots>i{position:absolute;width:5px;height:5px;border-radius:50%;background:#71b7bc66;left:calc(8% + var(--dot)*13%);top:calc(13% + var(--dot)*11%);animation:ambient-float 14s ease-in-out infinite;animation-delay:calc(var(--dot)*-2.3s)}
.ambient-dots>i:nth-child(3n){width:8px;height:8px;background:#dfb58577}
.ambient-dots>i:nth-child(2n){background:#aea6d577}
.ambient-toggle{position:fixed;right:20px;bottom:17px;z-index:40;display:flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid #ffffffb8;border-radius:25px;background:#ffffffd6;color:#6f8b97;box-shadow:0 3px 16px #375b7210;font-size:11px;cursor:pointer;backdrop-filter:blur(10px);transition:background .2s,color .2s}
.ambient-toggle:hover{background:#fff;color:#317c85}
.ambient-toggle:disabled{cursor:default;color:#8d9ba4}
.ambient-toggle-symbol{font-size:13px;width:13px;line-height:15px;text-align:center}
.prod-login{background:transparent;position:relative;isolation:isolate;padding-bottom:65px}
.prod-login-window{position:relative;border:1px solid #ffffffd9;box-shadow:0 30px 100px #3f6a7c21}
.prod-login-art{background:linear-gradient(150deg,#dff3fb,#d2f1e7);isolation:isolate}
.prod-login-art:before{content:"";position:absolute;z-index:-1;width:420px;height:420px;left:-180px;bottom:-220px;border-radius:50%;border:1px solid #ffffffb0;box-shadow:0 0 0 25px #ffffff35,0 0 0 55px #ffffff24,0 0 0 95px #ffffff17;animation:ambient-art 20s ease-in-out infinite alternate}
.prod-login-art:after{content:"";position:absolute;z-index:-1;width:180px;height:180px;right:-60px;top:-60px;border-radius:50%;background:radial-gradient(circle,#ffdfacb3,#fff2d700 72%);animation:ambient-art 16s ease-in-out infinite alternate-reverse}
.home-view{background:transparent}
.home-shell{background:transparent}
.home-shell:before,.home-shell:after{display:none}
/* A fixed viewport layer preserves the image ratio regardless of page length. */
body[data-ambient-page="home"] .ambient-scene:before{content:"";position:absolute;inset:0;background:url('./assets/sports-center-panorama.png') center bottom/cover no-repeat;opacity:.56}
body[data-ambient-page="home"] .ambient-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#fbf4e46b,#f7f8ed26 48%,#eaf4ef40);pointer-events:none}
body[data-ambient-page="home"] .ambient-glow{opacity:.48}
body[data-ambient-page="home"] .ambient-track{opacity:.28}
body[data-ambient-page="business"] .ambient-scene{background:#f4f7fa}
body[data-ambient-page="business"] .ambient-glow{opacity:.17}
body[data-ambient-page="business"] .ambient-track,body[data-ambient-page="business"] .ambient-dots{opacity:.18}
body[data-ambient-page="business"] .ambient-toggle{bottom:11px;padding:6px 10px;opacity:.85}
.prod-statusbar{padding-bottom:32px}
body[data-motion-paused="true"] .ambient-scene *,body[data-motion-paused="true"] .prod-login-art:before,body[data-motion-paused="true"] .prod-login-art:after{animation-play-state:paused!important}
@keyframes ambient-drift{to{transform:translate3d(var(--travel-x),var(--travel-y),0) scale(1.08)}}
@keyframes ambient-orbit{to{transform:rotate(360deg)}}
@keyframes ambient-float{0%,100%{transform:translate3d(0,0,0);opacity:.3}50%{transform:translate3d(15px,-24px,0);opacity:.85}}
@keyframes ambient-art{to{transform:translate3d(26px,-18px,0) scale(1.08)}}
@media(max-width:760px){.ambient-glow{width:130vw}.glow-mint{left:-70%;top:-10%}.glow-peach{right:-75%;top:25%}.glow-lilac{bottom:-12%;left:-5%}.track-one{left:-690px;top:36%}.track-two{right:-750px;top:-540px}.ambient-toggle{right:14px;bottom:14px;font-size:10px}.prod-login{padding-bottom:65px}.prod-login-window{max-width:460px}.ambient-dots>i:nth-child(even){display:none}}
@media(prefers-reduced-motion:reduce){.ambient-scene *,.prod-login-art:before,.prod-login-art:after{animation:none!important;will-change:auto}}
@media print{.ambient-scene,.ambient-toggle{display:none}body,.prod-login{background:#fff}}