.cinematic{--event-color:#477baa;--event-accent:#d2ff73;background:#060b12;isolation:isolate;perspective:1100px;animation:stadium-enter .5s ease-out both}.cinematic.departing{animation:stadium-exit .65s cubic-bezier(.6,0,.9,.5) both}.stadium-wash{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--event-color) 75%,transparent),transparent 65%),linear-gradient(140deg,#101d2b,#03080e);animation:wash-bloom 1.4s ease-out both}.stadium-grid{position:absolute;left:-50%;right:-50%;height:100%;bottom:-60%;background:repeating-linear-gradient(90deg,transparent 0,transparent 79px,#ffffff12 80px),repeating-linear-gradient(0deg,transparent 0,transparent 79px,#ffffff12 80px);transform:rotateX(64deg);transform-origin:top;mask-image:linear-gradient(transparent,#000);animation:grid-advance 5s linear infinite}.spotlights{position:absolute;inset:0;overflow:hidden}.spotlights i{position:absolute;top:-30%;left:10%;width:22vw;height:150vh;background:linear-gradient(#ffffff28,transparent 80%);clip-path:polygon(47% 0,53% 0,100% 100%,0 100%);transform-origin:50% 0;filter:blur(3px);animation:spotlight-sweep 5s ease-in-out infinite alternate}.spotlights i:nth-child(2){left:70%;animation-delay:-2s}.spotlights i:nth-child(3){left:35%;opacity:.4;animation-delay:-3s}.spotlights i:nth-child(4){left:85%;opacity:.5;animation-delay:-1s}.impact-ring{position:absolute;top:46%;left:50%;width:30vmin;height:30vmin;border:2px solid var(--event-accent);border-radius:50%;opacity:0;box-shadow:0 0 24px color-mix(in srgb,var(--event-accent) 40%,transparent),inset 0 0 24px color-mix(in srgb,var(--event-accent) 30%,transparent);animation:shockwave 1.6s .4s ease-out both}.ring-two{animation-delay:.6s;border-width:6px}.ring-three{animation-delay:.85s;border-width:1px}.event-ghost{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%) rotate(-8deg);font:900 clamp(100px,21vw,350px) 'Barlow Condensed',Arial;white-space:nowrap;color:transparent;-webkit-text-stroke:1px #ffffff18;letter-spacing:8px;animation:ghost-pan 7s ease-out both}.speed-lines{position:absolute;inset:0;overflow:hidden}.speed-lines i{position:absolute;height:2px;width:75vw;left:-90vw;top:24%;background:linear-gradient(90deg,transparent,var(--event-accent),white,transparent);transform:rotate(-12deg);animation:speed-pass .9s .15s ease-out both}.speed-lines i:nth-child(2){top:34%;animation-delay:.28s;height:5px}.speed-lines i:nth-child(3){top:63%;animation-delay:.4s}.speed-lines i:nth-child(4){top:72%;animation-delay:.53s;height:4px}.speed-lines i:nth-child(5){top:82%;animation-delay:.63s}.cinematic .event-content{width:min(96vw,1600px);display:flex;align-items:center;flex-direction:column;z-index:4}.logo-orbit{position:relative;width:clamp(95px,15vh,190px);height:clamp(95px,15vh,190px);display:grid;place-items:center;margin-bottom:10px;animation:logo-arrival .95s cubic-bezier(.16,.85,.3,1.12) both}.event-logo{width:95%;height:95%;object-fit:contain;filter:drop-shadow(0 12px 20px #0008) drop-shadow(0 0 35px color-mix(in srgb,var(--event-color) 80%,transparent));animation:logo-float 3s 1s ease-in-out infinite alternate}.event-ball{font-size:70px;color:var(--event-accent)}.orbit-circle{position:absolute;inset:-15px;border:2px solid color-mix(in srgb,var(--event-accent) 45%,transparent);border-left-color:transparent;border-right-color:transparent;border-radius:50%;animation:orbit-spin 8s linear infinite;box-shadow:0 0 40px color-mix(in srgb,var(--event-color) 50%,transparent)}.cinematic .event-team{font:700 clamp(16px,2.5vw,35px) 'Barlow Condensed',Arial;letter-spacing:5px;text-transform:uppercase;color:#fff;animation:rise-in .6s .35s both}.event-title-wrap{position:relative;overflow:hidden;width:100%;margin-top:8px}.cinematic .event-label{font:900 clamp(46px,12.6vw,225px) 'Barlow Condensed',Impact,sans-serif;line-height:1.05;letter-spacing:4px;color:#fff;text-shadow:0 5px 0 color-mix(in srgb,var(--event-color) 70%,#000),0 14px 25px #0008,0 0 70px color-mix(in srgb,var(--event-accent) 25%,transparent);transform:skewX(-7deg);animation:title-impact .8s .4s cubic-bezier(.12,.85,.2,1.15) both}.cinematic.turnover .event-label,.cinematic.redzone .event-label{color:var(--event-accent)}.title-sweep{position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#fff8 48%,transparent 65%);transform:translateX(-120%);mix-blend-mode:overlay;animation:title-shine 1s 1.15s ease-out both}.event-subtitle{font:700 clamp(12px,1.6vw,23px) 'Barlow Condensed',Arial;letter-spacing:4px;color:var(--event-accent);display:flex;align-items:center;gap:15px;animation:rise-in .6s .8s both;margin-top:10px}.event-subtitle strong{display:inline-grid;place-items:center;font:900 clamp(28px,4vw,55px) 'Barlow Condensed',Arial;background:var(--event-accent);color:#08101a;min-width:70px;padding:2px 12px;transform:skewX(-7deg);box-shadow:0 0 35px color-mix(in srgb,var(--event-accent) 25%,transparent)}.event-scoreboard{display:flex;gap:32px;align-items:center;background:#050b14a6;border:1px solid #ffffff24;border-top:2px solid var(--event-accent);border-radius:8px;padding:14px 30px;margin-top:22px;box-shadow:0 15px 50px #0007;animation:scoreboard-arrive .7s 1.3s both;backdrop-filter:blur(12px)}.event-score-team{display:flex;align-items:center;gap:20px}.event-score-team>span{font:700 clamp(20px,3vw,38px) 'Barlow Condensed',Arial;letter-spacing:2px;color:#b9c7d2}.event-score-window{height:clamp(48px,7vh,90px);overflow:hidden;min-width:65px}.event-score-window b{display:block;font:900 clamp(48px,7vh,90px)/1 'Barlow Condensed',Arial;font-variant-numeric:tabular-nums}.score-roll{animation:score-roll 1s 1.9s cubic-bezier(.22,1,.36,1) both}.score-roll b:last-child{color:var(--event-accent)}.event-score-divider{color:#547081;font-size:30px}.cinematic .event-note{font-size:12px;letter-spacing:2px;margin-top:14px;animation:rise-in .5s 1.5s both}.particle-origin{position:absolute;left:50%;top:45%;width:0;height:0;z-index:3}.burst-particle{position:absolute;left:0;top:0;width:var(--size);height:calc(var(--size)*2);background:var(--particle);border-radius:1px;opacity:0;box-shadow:0 0 8px var(--particle);animation:particle-burst 2.5s var(--delay) cubic-bezier(.08,.6,.3,1) both;will-change:transform,opacity}.stadium-confetti{position:absolute;left:var(--left);top:-30px;width:8px;height:19px;background:var(--particle);z-index:3;opacity:0;animation:stadium-confetti var(--duration) var(--delay) linear both;will-change:transform}.event-ribbon{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:15px 4vw;font:700 11px Barlow,Arial;letter-spacing:3px;color:#bbcad5;background:#030a1290;z-index:5;animation:rise-in .6s .2s both}.top-ribbon{top:0;border-bottom:1px solid #ffffff20}.bottom-ribbon{bottom:8px;border-top:1px solid #ffffff20}.event-progress{position:absolute;bottom:0;left:0;height:4px;width:100%;background:var(--event-accent);transform-origin:left;animation:event-progress var(--event-duration) linear both;z-index:6;box-shadow:0 0 20px var(--event-accent)}.redzone .stadium-grid{background:repeating-linear-gradient(90deg,transparent 0,transparent 79px,#ff425735 80px),repeating-linear-gradient(0deg,transparent 0,transparent 79px,#ff425735 80px)}.turnover .speed-lines i{animation-direction:reverse}.turnover .orbit-circle{animation-direction:reverse}
@keyframes stadium-enter{from{opacity:0;clip-path:polygon(0 45%,100% 55%,100% 55%,0 45%)}to{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes stadium-exit{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.07)}}@keyframes wash-bloom{from{opacity:.2;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes grid-advance{to{background-position:0 80px}}@keyframes spotlight-sweep{from{transform:rotate(-30deg)}to{transform:rotate(25deg)}}@keyframes shockwave{0%{transform:translate(-50%,-50%) scale(.15);opacity:.9}100%{transform:translate(-50%,-50%) scale(7);opacity:0}}@keyframes speed-pass{to{left:130vw}}@keyframes ghost-pan{from{opacity:0;transform:translate(-40%,-50%) rotate(-8deg)}30%{opacity:1}to{opacity:.4;transform:translate(-58%,-50%) rotate(-8deg)}}@keyframes logo-arrival{from{opacity:0;transform:translateY(-140px) rotateY(-140deg) scale(.4)}70%{opacity:1;transform:translateY(5px) rotateY(15deg) scale(1.08)}to{opacity:1;transform:translateY(0) rotateY(0) scale(1)}}@keyframes logo-float{to{transform:translateY(-6px) rotate(-3deg)}}@keyframes orbit-spin{to{transform:rotate(360deg)}}@keyframes title-impact{0%{opacity:0;transform:translateX(-15vw) skewX(-20deg) scale(1.6)}70%{opacity:1;transform:translateX(1vw) skewX(-7deg) scale(.98)}100%{opacity:1;transform:translateX(0) skewX(-7deg) scale(1)}}@keyframes title-shine{to{transform:translateX(120%)}}@keyframes rise-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scoreboard-arrive{from{opacity:0;transform:translateY(40px) rotateX(-45deg)}to{opacity:1;transform:translateY(0) rotateX(0)}}@keyframes score-roll{to{transform:translateY(-50%)}}@keyframes particle-burst{0%{opacity:0;transform:translate(0,0) scale(0)}8%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.5)}}@keyframes stadium-confetti{0%{opacity:0;transform:translateY(-20px) rotateX(0) rotate(0)}5%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translate(var(--drift),110vh) rotateX(1080deg) rotate(540deg)}}@keyframes event-progress{to{transform:scaleX(0)}}
.creator-credit{position:fixed;right:14px;bottom:7px;font:400 10px Barlow,Arial,sans-serif;letter-spacing:.3px;color:#a9bacb;opacity:.48;pointer-events:none;z-index:25}footer{padding-bottom:25px}
@media(max-height:650px){.logo-orbit{width:80px;height:80px;margin-bottom:4px}.cinematic .event-label{font-size:clamp(42px,10vw,130px)}.event-scoreboard{margin-top:10px;padding:8px 20px}.event-score-window{height:48px}.event-score-window b{font-size:48px}.event-subtitle{margin-top:4px}.event-ribbon{padding:8px 4vw}.cinematic .event-team{font-size:18px}.event-note{margin-top:5px!important}}
@media(max-width:600px){.event-ribbon{font-size:8px;letter-spacing:1px}.event-subtitle{letter-spacing:1px;gap:8px}.event-scoreboard{gap:15px;padding:12px 20px}.event-score-team{gap:10px}.event-score-window{min-width:45px}.event-score-team>span{font-size:23px}.cinematic .event-label{letter-spacing:1px}.cinematic .event-team{letter-spacing:2px}.bottom-ribbon span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.cinematic,.cinematic *{animation:none!important;transition:none!important}.speed-lines,.particle-origin,.stadium-confetti,.impact-ring,.title-sweep{display:none}.score-roll{transform:translateY(-50%)}.cinematic.departing{opacity:0}}
