/* JA 14 / KINETIC UNIVERSE – all art is CSS/SVG/canvas; no remote fonts or libraries.
   The entire layer can be disabled in the UI. Persistent forms do not move. */
:root{--ja-ease:cubic-bezier(.16,1,.3,1);--ja-neon:#7437f7;--ja-lemon:#ffe334}
.ja-opening[hidden]{display:none!important}
.ja-opening{position:fixed;inset:0;z-index:4000;display:grid;place-items:center;isolation:isolate;color:white;overflow:hidden;background:#1d074c;pointer-events:auto;user-select:none}
.ja-opening:before{content:"";position:absolute;inset:-45%;z-index:-1;background:conic-gradient(from 75deg at 50% 50%,#1b0746 0deg,#6225da 85deg,#311176 160deg,#ffd927 182deg,#230451 212deg,#1b0746 360deg);animation:ja-intro-sky 6s linear infinite;filter:saturate(1.18)}
.ja-opening-ambient{position:absolute;inset:0;opacity:.85;background:radial-gradient(ellipse at 35% 45%,#ad61ff90,transparent 44%),radial-gradient(circle at 79% 20%,#ffe62770,transparent 29%);mix-blend-mode:screen}
.ja-opening-rings{position:absolute;inset:0;display:grid;place-items:center;perspective:900px;transform-style:preserve-3d}
.ja-opening-rings i{position:absolute;width:min(72vw,790px);height:min(72vw,790px);border:1px solid #ffdf4caa;border-radius:50%;box-shadow:0 0 44px #ffde4659,inset 0 0 25px #ffd82920;transform:rotateX(72deg) rotateZ(45deg);animation:ja-intro-orbit 2.4s var(--ja-ease) both}
.ja-opening-rings i:nth-child(2){width:min(57vw,620px);height:min(57vw,620px);border-color:#cb91ffae;transform:rotateY(58deg) rotateZ(-30deg);animation-delay:.07s}
.ja-opening-rings i:nth-child(3){width:min(42vw,460px);height:min(42vw,460px);border-width:2px;transform:rotateX(30deg) rotateY(48deg);animation-delay:.12s}
.ja-opening-mark{position:relative;display:flex;gap:.02em;margin-top:-68px;font-size:clamp(104px,26vw,340px);font-weight:1000;line-height:.82;letter-spacing:-.14em;padding-right:.18em;text-shadow:0 4px 0 #160439,0 12px 0 #2e0a6f,0 23px 30px #11022d;transform-style:preserve-3d;animation:ja-intro-logo 1.5s var(--ja-ease) both}
.ja-opening-mark span:last-child{color:var(--ja-lemon);text-shadow:0 3px 0 #b88d08,0 13px 0 #744007,0 30px 40px #201036}
.ja-opening-slogan{position:absolute;left:0;right:0;top:67%;font-size:clamp(18px,3vw,42px);font-weight:1000;line-height:1.03;letter-spacing:-.04em;text-align:center;animation:ja-intro-copy 1.25s .24s var(--ja-ease) both}
.ja-opening-slogan strong{color:#ffdf35}.ja-opening-slogan span{display:block;letter-spacing:.28em;font-size:clamp(9px,1.1vw,14px);font-weight:800;margin-top:17px;color:#e2d1ff}
.ja-opening-skip{position:absolute;right:clamp(20px,5vw,85px);bottom:clamp(20px,5vh,60px);border:1px solid #ffffff6e;background:#ffffff1e;color:white;border-radius:999px;padding:12px 18px;font-weight:750;z-index:10;cursor:pointer;backdrop-filter:blur(12px)}
.ja-opening-skip:hover{background:#fff;color:#300a79}
.ja-opening-split{position:absolute;top:0;bottom:0;width:50%;pointer-events:none;transform:translateX(0);background:linear-gradient(145deg,#2c096c 0%,#5312b4 55%,#24064c);z-index:-1}
.ja-opening-split--left{left:0}.ja-opening-split--right{right:0;background:linear-gradient(235deg,#26045d,#6d18cb 58%,#2b0956)}
.ja-opening.ja-opening--exit{animation:ja-intro-exit .88s var(--ja-ease) forwards;pointer-events:none}
.ja-opening--exit .ja-opening-split--left{animation:ja-shutter-left .85s var(--ja-ease) both}
.ja-opening--exit .ja-opening-split--right{animation:ja-shutter-right .85s var(--ja-ease) both}
.ja-opening--exit .ja-opening-mark{animation:ja-intro-collapse .6s both}
.ja-opening--exit .ja-opening-slogan,.ja-opening--exit .ja-opening-skip{opacity:0;transition:opacity .19s ease}
@keyframes ja-intro-sky{to{transform:rotate(360deg)}}
@keyframes ja-intro-orbit{from{opacity:0;scale:.35;filter:blur(18px)}to{opacity:1;scale:1;filter:blur(0)}}
@keyframes ja-intro-logo{0%{opacity:0;transform:perspective(800px) translateZ(-700px) rotateY(-46deg) rotateX(32deg);filter:blur(18px)}65%{opacity:1;filter:blur(0)}100%{transform:perspective(800px) translateZ(0) rotateY(-8deg) rotateX(4deg)}}
@keyframes ja-intro-copy{from{opacity:0;transform:translate3d(0,60px,0);letter-spacing:.4em}to{opacity:1;transform:translate3d(0,0,0);letter-spacing:-.04em}}
@keyframes ja-intro-exit{0%{opacity:1;filter:brightness(1)}75%{opacity:1}100%{opacity:0;filter:brightness(1.8);visibility:hidden}}
@keyframes ja-intro-collapse{to{opacity:0;transform:perspective(750px) translateZ(750px) rotateY(24deg);filter:blur(16px)}}
@keyframes ja-shutter-left{to{transform:translateX(-106%) skewX(-10deg)}}
@keyframes ja-shutter-right{to{transform:translateX(106%) skewX(10deg)}}
.ja-scroll-progress{height:3px;position:fixed;z-index:110;inset:0 auto auto 0;width:100%;transform:scaleX(var(--ja-scroll,0));transform-origin:left;background:linear-gradient(90deg,#5220d5,#9f65ff,#ffe036);pointer-events:none;will-change:transform;box-shadow:0 0 16px #7527e875}
/* Landing: subtly lit 3D portal with true perspective CSS geometry */
.ja-motion-on .landing{--ja-x:0px;--ja-y:0px;--ja-rotate-x:0deg;--ja-rotate-y:0deg}
.landing .hero{isolation:isolate;perspective:1100px;transform-style:preserve-3d}
.landing .hero:after{content:'';position:absolute;inset:-30px -3% 0 34%;pointer-events:none;background:radial-gradient(circle at calc(60% + var(--ja-pointer-x,0%)) calc(44% + var(--ja-pointer-y,0%)),#ffe13e19,transparent 48%);z-index:-1}
.landing .hero-art{transform-style:preserve-3d;perspective:1050px}
.ja-hero-depth{position:absolute;inset:0;z-index:0;transform-style:preserve-3d;transform:rotateX(var(--ja-rotate-x,0deg)) rotateY(var(--ja-rotate-y,0deg)) translate3d(var(--ja-x,0px),var(--ja-y,0px),0);transition:transform .24s ease-out;pointer-events:none}
.ja-space-aurora{position:absolute;inset:3% -11%;border-radius:50%;background:radial-gradient(ellipse at 54% 47%,#e3c5ff90 0%,#f9eaff5e 44%,transparent 70%),radial-gradient(circle at 25% 65%,#fff18070,transparent 25%);filter:blur(14px);animation:ja-aurora 8s ease-in-out infinite alternate;transform:translateZ(-110px)}
.ja-orbit{position:absolute;top:50%;left:50%;width:65%;aspect-ratio:1;border:2px solid #7649d733;border-radius:50%;box-shadow:inset 0 0 20px #f2deff70,0 0 28px #a47eeb12;transform:translate(-50%,-50%) rotateX(65deg) rotateZ(22deg) translateZ(-80px);animation:ja-orbit-drift 11s linear infinite;transform-style:preserve-3d}
.ja-orbit-two{width:50%;border-color:#e8bf3590;animation-direction:reverse;animation-duration:13s;transform:translate(-50%,-50%) rotateY(60deg) rotateZ(-26deg) translateZ(-40px)}
.ja-orbit span{position:absolute;top:-7px;left:50%;width:13px;height:13px;background:#ffe13b;border-radius:50%;box-shadow:0 0 15px #ffda39,0 0 34px #e3ae22}
.ja-orbit-two span{background:#7434dc;box-shadow:0 0 12px #9a59fa}
.ja-depth-cube{position:absolute;width:57px;height:57px;top:17%;left:14%;transform-style:preserve-3d;transform:rotateX(-22deg) rotateY(-30deg) rotateZ(8deg) translateZ(-40px);animation:ja-cube-float 9s ease-in-out infinite alternate}
.ja-cube-b{width:33px;height:33px;left:auto;right:13%;top:auto;bottom:20%;animation-delay:-3s;animation-duration:12s}
.ja-depth-cube i{position:absolute;inset:0;border:1px solid #aa72fa9c;background:linear-gradient(135deg,#b784ff65,#6235cd35);backdrop-filter:blur(2px);box-shadow:inset 0 0 15px #fff8}
.ja-depth-cube i:nth-child(1){transform:translateZ(28.5px)}.ja-depth-cube i:nth-child(2){transform:rotateY(180deg) translateZ(28.5px)}
.ja-depth-cube i:nth-child(3){transform:rotateY(90deg) translateZ(28.5px)}.ja-depth-cube i:nth-child(4){transform:rotateY(-90deg) translateZ(28.5px)}
.ja-depth-cube i:nth-child(5){transform:rotateX(90deg) translateZ(28.5px)}.ja-depth-cube i:nth-child(6){transform:rotateX(-90deg) translateZ(28.5px)}
.ja-cube-b i:nth-child(1){transform:translateZ(16.5px)}.ja-cube-b i:nth-child(2){transform:rotateY(180deg) translateZ(16.5px)}
.ja-cube-b i:nth-child(3){transform:rotateY(90deg) translateZ(16.5px)}.ja-cube-b i:nth-child(4){transform:rotateY(-90deg) translateZ(16.5px)}
.ja-cube-b i:nth-child(5){transform:rotateX(90deg) translateZ(16.5px)}.ja-cube-b i:nth-child(6){transform:rotateX(-90deg) translateZ(16.5px)}
.ja-floating-star{position:absolute;color:#ffd726;font-size:30px;text-shadow:0 5px 14px #d19d2690;animation:ja-star-drift 6s ease-in-out infinite;transform:translateZ(80px)}
.ja-star-a{left:14%;bottom:21%;font-size:42px}.ja-star-b{right:18%;top:10%;animation-delay:-2s}
.ja-particle-canvas{position:absolute;inset:0;z-index:0;pointer-events:none;width:100%;height:100%}
.ja-motion-on .hero-art .hero-brand{filter:drop-shadow(0 25px 24px #5d1ab332);transform:translate3d(calc(var(--ja-x,0px) * .25),calc(var(--ja-y,0px) * .25),25px);animation:ja-logo-hover 7s ease-in-out infinite;will-change:transform}
.ja-motion-on .hero-copy{animation:none}
.ja-hero-overline{position:absolute;top:1px;left:0;z-index:4;letter-spacing:.23em;font-weight:950;font-size:10px;color:#6b29da;opacity:.75}
.ja-hero-overline b{color:#e1a800;padding-inline:9px}
.ja-motion-on .hero-copy h1 .ja-word{display:inline-block;white-space:pre;opacity:0;transform:translate3d(0,65px,-50px) rotateX(-38deg);filter:blur(12px);transition:opacity .74s var(--ja-ease),transform .98s var(--ja-ease),filter .85s ease;transition-delay:calc(var(--ja-word-index,0) * 48ms)}
.ja-motion-on.ja-intro-finished .hero-copy h1 .ja-word{opacity:1;transform:translate3d(0,0,0) rotateX(0);filter:none}
.ja-motion-on .hero-copy .lead,.ja-motion-on .heroActions,.ja-motion-on .avatar-strip{opacity:0;transform:translateY(20px);transition:opacity .75s ease,transform .9s var(--ja-ease)}
.ja-motion-on.ja-intro-finished .hero-copy .lead{opacity:1;transform:none;transition-delay:.3s}
.ja-motion-on.ja-intro-finished .heroActions{opacity:1;transform:none;transition-delay:.44s}
.ja-motion-on.ja-intro-finished .avatar-strip{opacity:1;transform:none;transition-delay:.55s}
@keyframes ja-logo-hover{0%,100%{translate:0 0}50%{translate:0 -11px}}
@keyframes ja-cube-float{0%{transform:rotateX(-20deg) rotateY(-30deg) translateZ(-40px)}100%{transform:rotateX(35deg) rotateY(115deg) translate3d(35px,-24px,20px)}}
@keyframes ja-aurora{from{transform:translateZ(-110px) scale(.95) rotate(-8deg);opacity:.72}to{transform:translateZ(-110px) scale(1.12) rotate(9deg);opacity:1}}
@keyframes ja-star-drift{50%{translate:0 -16px;rotate:23deg}}
@keyframes ja-orbit-drift{to{rotate:360deg}}
/* 3D cursor-reactive tiles, subtle glare, and section compositions */
.ja-motion-on .ja-tilt{position:relative;transform-style:preserve-3d;backface-visibility:hidden;transform:perspective(960px) rotateX(var(--ja-rx,0deg)) rotateY(var(--ja-ry,0deg)) translate3d(0,var(--ja-lift,0px),0);transition:transform .35s var(--ja-ease),box-shadow .3s ease;will-change:transform}
.ja-motion-on .ja-tilt:hover{--ja-lift:-5px;box-shadow:0 20px 42px #40108222}
.ja-tilt .ja-tile-glare{position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px circle at var(--ja-glare-x,50%) var(--ja-glare-y,50%),#ffffff6b,transparent 75%);opacity:0;transition:opacity .23s;mix-blend-mode:soft-light;border-radius:inherit;z-index:5}
.ja-tilt:hover>.ja-tile-glare{opacity:1}
.ja-motion-on .landing .reveal{transform:translate3d(0,40px,0) rotateX(5deg);filter:blur(5px);transition:opacity .8s var(--ja-ease),transform 1.1s var(--ja-ease),filter .8s ease;transform-origin:center 15%}
.ja-motion-on .landing .reveal.is-visible{transform:translate3d(0,0,0) rotateX(0deg);filter:none}
.ja-motion-on .ja-item-enter{opacity:0;transform:translate3d(0,30px,0) scale(.94) rotate(-2deg);filter:blur(5px);transition:opacity .7s ease,transform .85s var(--ja-ease),filter .75s ease;transition-delay:var(--ja-item-delay,0ms)}
.ja-motion-on .ja-item-enter.ja-item-visible{opacity:1;transform:none;filter:none}
.ja-motion-on .contest-section{isolation:isolate}
.ja-motion-on .contest-section:after{content:"";position:absolute;inset:-50%;pointer-events:none;background:conic-gradient(from 0deg at 50% 50%,transparent 0 20%,#9e68ff42 28%,transparent 36% 55%,#ffde372a 60%,transparent 66%);animation:ja-intro-sky 24s linear infinite;z-index:0;mix-blend-mode:screen}
.ja-motion-on .contest-section>.contest-copy,.ja-motion-on .contest-section>.contest-portrait,.ja-motion-on .contest-section>.contest-side{z-index:2}
.ja-motion-on .contest-section .crown{animation:ja-crown 4s ease-in-out infinite}
@keyframes ja-crown{0%,100%{rotate:-8deg;translate:0 0}50%{rotate:9deg;translate:0 -8px}}
.ja-motion-on .btn.primary:hover,.ja-motion-on .btn.yellow:hover,.ja-motion-on .jd-btn-yellow:hover{filter:brightness(1.06);box-shadow:0 12px 32px #5c26ce33,0 0 0 5px #8552eb17}
.ja-motion-on .btn:active,.ja-motion-on .jd-btn:active{scale:.97}
/* dashboard: quieter motion, preserve click accuracy and form legibility */
.ja-motion-on.jd-body .jd-topbar{animation:ja-admin-top .6s var(--ja-ease) both}
.ja-motion-on.jd-body .jd-view>.jd-welcome{animation:ja-admin-enter .75s var(--ja-ease) both}
.ja-motion-on.jd-body .jd-view>.jd-metrics,.ja-motion-on.jd-body .jd-view>.jd-card,.ja-motion-on.jd-body .jd-view>.jd-main-grid{animation:ja-admin-enter .8s .1s var(--ja-ease) both}
.ja-motion-on.jd-body .jd-nav-item{transition:background .24s ease,color .24s ease,transform .24s var(--ja-ease),box-shadow .24s ease}
.ja-motion-on.jd-body .jd-nav-item:hover{transform:translateX(4px)}
.ja-motion-on.jd-body .jd-metric{transition:transform .35s var(--ja-ease),box-shadow .35s ease}
.ja-motion-on.jd-body .jd-metric:hover{transform:perspective(700px) translateY(-3px) rotateX(2deg);box-shadow:0 14px 32px #2c136b13}
.ja-motion-on.jd-body .jd-quick{transition:transform .35s var(--ja-ease),box-shadow .25s}
.ja-motion-on.jd-body .jd-quick:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 9px 22px #3a12901a}
.ja-motion-on.jd-body .jd-avatar,.ja-motion-on.jd-body .jd-current-team-logo{box-shadow:0 0 0 3px #ffffff88,0 8px 18px #4a1bbb1a}
.ja-motion-on.jd-body .jd-btn:focus-visible,.ja-motion-on.jd-body .jd-nav-item:focus-visible{outline-offset:3px}
@keyframes ja-admin-top{from{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:none}}
@keyframes ja-admin-enter{from{opacity:0;transform:translateY(17px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
/* motion switch remains available even if effects are disabled */
.ja-motion-controls{position:fixed;z-index:150;bottom:18px;right:18px}
.ja-motion-toggle{border:1px solid #d7caef;background:#ffffffed;display:inline-flex;align-items:center;justify-content:center;gap:9px;color:#421590;min-height:39px;padding:8px 13px;border-radius:999px;box-shadow:0 5px 20px #3816792b;backdrop-filter:blur(12px);cursor:pointer;font-size:12px;font-weight:850;white-space:nowrap}
.ja-motion-toggle>span:first-child{display:grid;place-items:center;border-radius:50%;width:22px;height:22px;color:#421590;background:#ffe33a}
.ja-motion-toggle[aria-pressed="false"]{background:#f8f5ff;color:#6b6580}
.ja-motion-toggle[aria-pressed="false"]>span:first-child{background:#e4dced;color:#807594}
.ja-motion-toggle--dashboard{box-shadow:none;min-height:35px;padding:5px 10px;gap:5px;border-radius:9px;font-size:11px}
.ja-motion-toggle:focus-visible,.ja-opening-skip:focus-visible{outline:3px solid #ffd735;outline-offset:3px}
/* no movement while completing check-ins, moderation, QR scanning, authentication */
.ja-motion-off .landing .hero-copy,.ja-motion-off .landing .hero-art,.ja-motion-off .landing .hero-brand{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
.ja-motion-off .landing .reveal,.ja-motion-off .landing .ja-item-enter,.ja-motion-off .landing .ja-word{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
.ja-motion-off .ja-hero-depth,.ja-motion-off .ja-particle-canvas,.ja-motion-off .ja-scroll-progress{display:none!important}
.ja-motion-off .contest-section:after{display:none}
@media(max-width:900px){.ja-hero-depth{opacity:.6}.ja-depth-cube{display:none}.ja-motion-on .ja-tilt{transform:none!important;will-change:auto}.ja-motion-on .landing .reveal{transform:translateY(18px)}.ja-motion-on .landing .reveal.is-visible{transform:none}.ja-hero-overline{font-size:8px;letter-spacing:.13em}}
@media(max-width:600px){.ja-opening-mark{font-size:34vw;margin-top:-28px}.ja-opening-slogan{top:65%}.ja-opening-rings i{width:92vw;height:92vw}.ja-opening-rings i:nth-child(2){width:74vw;height:74vw}.ja-opening-rings i:nth-child(3){width:58vw;height:58vw}.ja-hero-depth{opacity:.33}.ja-hero-overline{top:-8px;font-size:8px}.ja-motion-controls{bottom:12px;right:10px}.ja-motion-toggle--dashboard [data-ja-motion-label]{display:none}.ja-motion-toggle--dashboard{min-height:34px;padding:5px 8px}}
@media(hover:none),(pointer:coarse){.ja-motion-on .ja-tilt{transform:none!important;will-change:auto}.ja-motion-on .ja-tile-glare{display:none}}
@media(prefers-reduced-motion:reduce){.ja-opening{display:none!important}.ja-motion-on .hero-copy,.ja-motion-on .hero-art,.ja-motion-on .hero-brand,.ja-motion-on .jd-view>*,.ja-motion-on .jd-topbar,.ja-motion-on .landing .reveal,.ja-motion-on .landing .ja-item-enter,.ja-motion-on .landing .hero .ja-word{animation:none!important;transition:none!important;opacity:1!important;transform:none!important;filter:none!important}.ja-motion-on .ja-hero-depth,.ja-motion-on .ja-particle-canvas,.ja-scroll-progress{display:none!important}}
/* Graceful static fallback: the marketing sections remain readable without JavaScript. */
body:not(.ja-motion-on) .landing .reveal{opacity:1;transform:none;filter:none}
@media(min-width:901px){.ja-motion-on .hero-art .hero-brand{max-width:96%;margin-right:3%}}
@media(max-width:900px){.ja-motion-on .landing .ja-item-enter{filter:none;transition-duration:.6s}}
