.side-s{padding:10px 0 18px;position:relative}
.side-wrap{max-width:1280px;margin:0 auto;padding:0 12px}
.side-stage{position:relative;overflow:hidden;border-radius:18px;background:#060b1a;aspect-ratio:16/9;max-height:calc(100svh - 96px);width:100%;box-shadow:0 30px 90px rgba(0,0,0,.7),0 0 0 1px rgba(248,183,0,.35);--px:0;--py:0;isolation:isolate}
.side-scene{position:absolute;inset:0;transform-origin:50% 70%;transition:transform 1.25s cubic-bezier(.2,.7,.2,1);will-change:transform}
.l-bg,.l-bg img{position:absolute;inset:-3%;width:106%;height:106%;display:block}
.l-bg img{inset:0;width:100%;height:100%;object-fit:cover;transform:translate3d(calc(var(--px)*-10px),calc(var(--py)*-6px),0)}
.l-rays{position:absolute;inset:-10% 20% 30%;background:conic-gradient(from 180deg at 35% 0,transparent 40%,rgba(255,214,120,.2) 46%,transparent 50%,rgba(255,214,120,.14) 55%,transparent 61%);mix-blend-mode:screen;animation:sray 9s ease-in-out infinite alternate;pointer-events:none}
@keyframes sray{to{transform:translateX(4%) rotate(3deg);opacity:.6}}
.l-army{position:absolute;bottom:10%;height:auto;filter:drop-shadow(0 10px 14px rgba(0,0,0,.6)) brightness(.9);transition:filter .8s;will-change:transform}
.l-army.a{left:6%;width:46%;transform:translate3d(calc(var(--px)*-18px),0,0)}
.l-army.h{right:6%;width:40%;transform:translate3d(calc(var(--px)*-18px),0,0)}
.l-lead{position:absolute;bottom:1.5%;height:92%;width:auto;transform-origin:50% 100%;filter:drop-shadow(0 20px 26px rgba(0,0,0,.75));transition:filter .8s;will-change:transform}
.l-lead.a{left:2%;animation:sbreath 4s ease-in-out infinite}
.l-lead.h{right:1%;animation:sbreath 4.4s ease-in-out infinite}
@keyframes sbreath{50%{transform:translateY(-.4%) scaleY(1.006)}}
.l-fog{z-index:1;position:absolute;left:0;right:0;bottom:0;height:22%;background:linear-gradient(0deg,rgba(6,11,26,.85),rgba(6,11,26,0));pointer-events:none}
.side-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.side-vig{position:absolute;inset:0;pointer-events:none;opacity:0;z-index:2;background:radial-gradient(ellipse at center,transparent 45%,rgba(180,10,0,.75))}
.side-logo{position:absolute;left:50%;top:6%;transform:translateX(-50%);text-align:center;pointer-events:none;width:44%;z-index:4;transition:opacity .6s}
.side-eye{display:block;font:600 clamp(10px,1.1vw,15px)/1 Georgia,serif;letter-spacing:.35em;text-transform:uppercase;color:#f8b700;text-shadow:0 2px 8px #000}
.side-logo h2{margin:.25em 0 .2em;font:700 clamp(30px,5vw,70px)/1 Georgia,serif;color:#fff3cf;text-shadow:0 0 34px rgba(248,183,0,.75),0 3px 0 #6b4a00,0 8px 20px #000}
.side-sub{font-size:clamp(11px,1.15vw,15px);color:#e9e4d6;text-shadow:0 1px 6px #000}
.side-pick{position:absolute;top:0;bottom:0;width:42%;border:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent;display:flex;align-items:flex-end;justify-content:center;padding-bottom:3.5%;z-index:5;touch-action:manipulation}
.side-pick.a{left:0}.side-pick.h{right:0}
.side-pick span{font:700 clamp(14px,2vw,24px)/1 Georgia,serif;letter-spacing:.18em;text-transform:uppercase;padding:.6em 1.3em;border-radius:999px;background:rgba(6,11,26,.75);border:1px solid rgba(248,183,0,.65);color:#f8e7b0;transition:transform .3s,box-shadow .3s}
.side-pick.h span{border-color:rgba(255,90,50,.75);color:#ffd2c0}
.side-pick:focus-visible{outline:none}
.side-pick:hover span,.side-pick:focus-visible span{transform:translateY(-4px);box-shadow:0 0 28px rgba(248,183,0,.7)}
.side-pick.h:hover span,.side-pick.h:focus-visible span{box-shadow:0 0 28px rgba(255,80,30,.8)}
.side-stage:has(.side-pick.a:hover) .l-lead.a,.side-stage:has(.side-pick.a:focus-visible) .l-lead.a{filter:drop-shadow(0 0 18px rgba(255,220,130,.9)) drop-shadow(0 20px 26px rgba(0,0,0,.75))}
.side-stage:has(.side-pick.h:hover) .l-lead.h,.side-stage:has(.side-pick.h:focus-visible) .l-lead.h{filter:drop-shadow(0 0 18px rgba(255,80,20,.95)) drop-shadow(0 20px 26px rgba(0,0,0,.75))}
.side-cap{position:absolute;right:12px;bottom:6px;margin:0;font-size:10px;color:rgba(233,228,214,.6);z-index:5;pointer-events:none}
/* ground fx anchored at --gx/--gy (scene %) */
.fxg{z-index:2;position:absolute;inset:0;pointer-events:none;--gx:50%;--gy:95%}
.fxg>*{position:absolute;left:var(--gx);top:var(--gy);opacity:0}
.fx-pillar{width:22%;height:130%;transform:translate(-50%,-100%) scaleX(0);transform-origin:50% 100%;background:linear-gradient(90deg,transparent,rgba(255,226,140,.7) 30%,rgba(255,252,230,.95) 50%,rgba(255,226,140,.5) 70%,transparent);filter:blur(2px);mix-blend-mode:screen}
.fx-consec{width:46%;aspect-ratio:3.2/1;transform:translate(-50%,-50%) scale(.1);border-radius:50%;box-shadow:0 0 40px rgba(255,214,110,.8),inset 0 0 40px rgba(255,214,110,.6);border:3px solid rgba(255,236,170,.95)}
.fx-consec i{position:absolute;inset:10%;border-radius:50%;border:2px dashed rgba(255,230,150,.9)}
.fx-consec i+i{inset:24%;border-style:dotted}
.fx-consec span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(10px,1.4vw,18px);letter-spacing:.3em;color:#fff3c0;text-shadow:0 0 10px #ffd66e;white-space:nowrap;overflow:hidden}
.fx-lava{width:60%;height:auto;aspect-ratio:5/1;transform:translate(-50%,-50%);overflow:visible}
.fx-lava path{fill:none;stroke:#ff7a1a;stroke-width:3;stroke-linecap:round;stroke-dasharray:240;stroke-dashoffset:240;filter:drop-shadow(0 0 4px #ffb347) drop-shadow(0 0 10px #ff3d00)}
.fx-ring{width:40%;aspect-ratio:3.2/1;border-radius:50%;transform:translate(-50%,-50%) scale(.1);border:4px solid rgba(255,236,170,.95);box-shadow:0 0 40px rgba(255,214,120,.9),inset 0 0 30px rgba(255,214,120,.6)}
.go-h .fx-ring,.held-h .fx-ring{border-color:rgba(255,70,30,.95);box-shadow:0 0 40px rgba(255,40,0,.9),inset 0 0 30px rgba(255,60,0,.6)}
/* camera push */
.go-a .side-scene,.held-a .side-scene{transform:scale(1.2) translate(9%,2%)}
.go-h .side-scene,.held-h .side-scene{transform:scale(1.2) translate(-9%,2%)}
.go-a .side-logo,.go-h .side-logo,.held-a .side-logo,.held-h .side-logo{opacity:.35}
.go-a .l-lead.h,.go-a .l-army.h,.held-a .l-lead.h,.held-a .l-army.h,.go-h .l-lead.a,.go-h .l-army.a,.held-h .l-lead.a,.held-h .l-army.a{filter:brightness(.5) saturate(.7)}
.go-a .side-pick.h,.go-h .side-pick.a,.held-a .side-pick.h,.held-h .side-pick.a{opacity:.6}
/* slam (impact at .86s) */
.go-a .l-lead.a,.go-h .l-lead.h{animation:sslam 1.3s cubic-bezier(.3,.6,.3,1) .1s both}
@keyframes sslam{0%{transform:none}30%{transform:translateY(-8%) rotate(-1.5deg) scale(1.02)}55%{transform:translateY(-12%) rotate(1deg) scale(1.03)}64%{transform:translateY(1.2%) scale(1.02,.975);animation-timing-function:ease-out}72%{transform:translateY(-.6%)}100%{transform:none}}
.go-h .l-lead.h{animation-name:sslamh}
@keyframes sslamh{0%{transform:none}30%{transform:translateY(-8%) rotate(1.5deg) scale(1.02)}55%{transform:translateY(-12%) rotate(-1deg) scale(1.03)}64%{transform:translateY(1.2%) scale(1.02,.975);animation-timing-function:ease-out}72%{transform:translateY(-.6%)}100%{transform:none}}
.go-a .l-army.a{animation:surgea 1.4s .9s ease-out both}.go-h .l-army.h{animation:surgeh 1.4s .9s ease-out both}
@keyframes surgea{0%{transform:none}20%{transform:translate(3%,-2%) scale(1.04)}40%{transform:translate(2%,0) scale(1.02)}60%{transform:translate(3%,-1.5%) scale(1.04)}100%{transform:translate(2%,0) scale(1.02)}}
@keyframes surgeh{0%{transform:none}20%{transform:translate(-3%,-2%) scale(1.04)}40%{transform:translate(-2%,0) scale(1.02)}60%{transform:translate(-3%,-1.5%) scale(1.04)}100%{transform:translate(-2%,0) scale(1.02)}}
.go-a .l-army.a{filter:brightness(1.1) drop-shadow(0 0 14px rgba(255,220,130,.6))}.go-h .l-army.h{filter:brightness(1.05) drop-shadow(0 0 14px rgba(255,60,20,.7))}
.go-a .fx-pillar{animation:spill 2.2s .86s ease-out both}
@keyframes spill{0%{opacity:0;transform:translate(-50%,-100%) scaleX(0)}12%{opacity:1;transform:translate(-50%,-100%) scaleX(1.4)}40%{opacity:.9;transform:translate(-50%,-100%) scaleX(1)}100%{opacity:.35;transform:translate(-50%,-100%) scaleX(.6)}}
.go-a .fx-consec{animation:scons 1s .86s cubic-bezier(.2,.9,.3,1.2) both}
.go-a .fx-consec span,.held-a .fx-consec span{animation:srot 14s linear infinite}
@keyframes scons{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}100%{opacity:.9;transform:translate(-50%,-50%) scale(1)}}
@keyframes srot{to{transform:translateX(-30%)}}
.go-a .fx-ring,.go-h .fx-ring{animation:sring 1s .86s ease-out both}.go-a .fx-ring.r2,.go-h .fx-ring.r2{animation-delay:1.06s}
@keyframes sring{0%{opacity:1;transform:translate(-50%,-50%) scale(.1)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.4)}}
.go-h .fx-lava{animation:son .1s .86s both}.go-h .fx-lava path{animation:sdash .5s .86s ease-out both,slava 1.2s 1.4s ease-in-out infinite alternate}
@keyframes son{to{opacity:1}}@keyframes sdash{to{stroke-dashoffset:0}}@keyframes slava{to{stroke:#ffcf5a}}
.go-h .side-vig{animation:svig 1.6s .86s ease-out both}
@keyframes svig{0%{opacity:0}15%{opacity:1}100%{opacity:.35}}
.go-a .l-rays{animation:none;opacity:1;filter:brightness(1.8)}
.side-stage.shake{animation:sshake .55s cubic-bezier(.36,.07,.19,.97)}
@keyframes sshake{10%,90%{transform:translate3d(-3px,2px,0)}20%,80%{transform:translate3d(7px,-4px,0)}30%,50%,70%{transform:translate3d(-12px,6px,0) rotate(-.5deg)}40%,60%{transform:translate3d(12px,-6px,0) rotate(.5deg)}}
/* held (returning visit / end state) */
.held-a .fx-consec{opacity:.6;transform:translate(-50%,-50%) scale(1)}.held-a .fx-pillar{opacity:.3;transform:translate(-50%,-100%) scaleX(.6)}
.held-h .fx-lava{opacity:1}.held-h .fx-lava path{stroke-dashoffset:0}.held-h .side-vig{opacity:.3}
/* panel */
.side-panel{margin:16px auto 0;max-width:640px;text-align:center;padding:22px;border-radius:14px;background:linear-gradient(180deg,rgba(14,22,48,.95),rgba(6,11,26,.95));border:1px solid rgba(248,183,0,.4);animation:spanel .6s ease-out}
.side-panel.horde{border-color:rgba(255,90,40,.55)}
.side-panel h3{margin:0 0 6px;font:700 clamp(24px,4vw,36px)/1.1 Georgia,serif;color:#f8b700}.side-panel.horde h3{color:#ff7a3d}
.side-panel p{color:#e9e4d6;margin:0 0 12px}
#side-form{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
#side-form input{flex:1 1 240px;min-width:0;font-size:16px;padding:12px 14px;border-radius:10px;border:1px solid rgba(248,183,0,.4);background:#0a1230;color:#fff}
.side-msg{min-height:1.2em;font-size:14px;color:#7fd8ff}
.side-reset{background:none;border:0;color:#a8acc0;text-decoration:underline;cursor:pointer;font-size:13px;padding:8px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@keyframes spanel{from{opacity:0;transform:translateY(12px)}}
@media (max-width:600px){
.side-wrap{padding:0 6px}.side-stage{aspect-ratio:auto;height:min(80svh,720px);max-height:none;border-radius:12px}
.l-army{bottom:20%}.l-army.a{left:-8%;width:72%}.l-army.h{right:-8%;width:66%}
.l-lead{height:50%;bottom:5%}.l-lead.a{left:-15%}.l-lead.h{right:-17%}
.side-logo{width:86%;top:4%}.side-logo h2{font-size:clamp(30px,9vw,44px)}
.side-pick{width:50%;padding-bottom:5%}.side-pick span{letter-spacing:.08em;padding:.55em .9em}
.go-a .side-scene,.held-a .side-scene{transform:scale(1.25) translate(14%,3%)}.go-h .side-scene,.held-h .side-scene{transform:scale(1.25) translate(-14%,3%)}
.fx-consec{width:80%}.fx-ring{width:70%}.fx-lava{width:110%}.fx-pillar{width:30%}.side-cap{font-size:9px;left:8px;right:8px;text-align:center}}
@media (prefers-reduced-motion:reduce){.side-scene{transition:opacity .4s}.l-rays,.l-lead,.l-army,.side-panel,.fx-consec span{animation:none!important}
.go-a .side-scene,.go-h .side-scene,.held-a .side-scene,.held-h .side-scene{transform:none}
.go-a .fxg>*,.go-h .fxg>*{animation:none!important}.go-a .fx-consec{opacity:.6;transform:translate(-50%,-50%) scale(1)}.go-a .fx-pillar{opacity:.3;transform:translate(-50%,-100%) scaleX(.6)}
.go-h .fx-lava{opacity:1}.go-h .fx-lava path{stroke-dashoffset:0}.go-h .side-vig{animation:none;opacity:.3}.side-stage.shake{animation:none}}
/* v3.2 legibility + iPhone framing */
.side-stage::before{content:"";position:absolute;left:0;right:0;top:0;height:34%;z-index:4;pointer-events:none;background:linear-gradient(180deg,rgba(4,7,18,.82),rgba(4,7,18,.45) 55%,rgba(4,7,18,0))}
.side-logo{z-index:5}
.side-logo h2{color:#fff6d8;-webkit-text-stroke:1px rgba(248,183,0,.9);paint-order:stroke fill;text-shadow:0 2px 0 #3a2700,0 4px 10px #000,0 0 3px #000,0 0 24px rgba(248,183,0,.55)}
.side-eye,.side-sub{text-shadow:0 1px 2px #000,0 0 10px #000}
.go-a .side-logo,.go-h .side-logo,.held-a .side-logo,.held-h .side-logo{opacity:.92}
.l-army{filter:drop-shadow(0 10px 14px rgba(0,0,0,.6)) brightness(1.05) contrast(1.08)}
@media (max-width:600px){
.go-a .side-scene,.held-a .side-scene,.go-h .side-scene,.held-h .side-scene{transform:none}
.l-lead{height:44%;bottom:7%;max-width:47%;object-fit:contain;object-position:bottom}
.l-lead.a{left:1%}.l-lead.h{right:1%}
.l-army{bottom:24%}.l-army.a{left:-4%;width:62%}.l-army.h{right:-4%;width:58%}
.go-a .l-lead.h,.go-a .l-army.h,.held-a .l-lead.h,.held-a .l-army.h,.go-h .l-lead.a,.go-h .l-army.a,.held-h .l-lead.a,.held-h .l-army.a{filter:brightness(.78) saturate(.85)}
.side-logo h2{-webkit-text-stroke:.8px rgba(248,183,0,.9)}}

.side-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.side-consent{flex:1 1 100%;display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.4;color:#d8d2c0;text-align:left;cursor:pointer}.side-consent input{margin-top:2px;accent-color:#f8b700;flex:none;width:16px;height:16px}.side-consent a{color:#f8b700}
.side-msg.err{color:#ff8a7a}.side-msg.ok{font-size:16px;font-weight:600;padding:12px 16px;border-radius:10px}.side-msg.ok.a{color:#cfe3ff;background:rgba(20,60,160,.35);border:1px solid rgba(120,170,255,.5)}.side-msg.ok.h{color:#ffd6c8;background:rgba(140,20,10,.4);border:1px solid rgba(255,110,70,.5)}
