/* Bu11et Interactive — forward lean, hard shadows, one electric blue. */
@font-face{font-family:'Bu11et Display';src:url('/assets/bu11et-display.ttf?v=4') format('truetype');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:Bricolage;src:url('/assets/bricolage-grotesque.ttf') format('truetype');font-weight:200 800;font-display:swap}

:root{
  --ink:#050b18;--navy:#0a1630;--steel:#1a2d57;--volt:#2b63ff;--volt-hi:#5a88ff;--ice:#c4d6ff;--white:#f3f6ff;--muted:#8d9cc0;
  --ease:cubic-bezier(.16,1,.3,1);--snap:cubic-bezier(.2,.9,.2,1);
  --display:'Bu11et Display',Bricolage,Arial,sans-serif;--text:Bricolage,Arial,sans-serif;
  --gutter:5vw;--slant:polygon(4% 0,100% 0,96% 100%,0 100%);
  color-scheme:dark;background:var(--ink);color:var(--white);font-family:var(--text)
}
*{box-sizing:border-box}
html{scroll-padding-top:90px}
body{margin:0;overflow-x:clip;background:var(--ink);font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}
img{display:block;max-width:100%}
h1,h2,h3,p,figure,ul{margin:0}
h1,h2{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.005em;font-synthesis:none}
::selection{background:var(--volt);color:#fff}
:focus-visible{outline:3px solid var(--volt-hi);outline-offset:5px}
a,button{-webkit-tap-highlight-color:transparent}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:-80px;left:20px;z-index:200;padding:14px 20px;background:var(--volt);font-weight:700}
.skip-link:focus{top:12px}
.grain{position:fixed;inset:0;z-index:150;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* Buttons lean like the wordmark. */
.slant-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 32px;background:var(--volt);color:#fff;font:700 17px/1 var(--text);letter-spacing:-.01em;transform:skewX(-12deg);overflow:hidden;transition:color .35s var(--ease),transform .35s var(--ease)}
.slant-button>span{display:block;transform:skewX(12deg)}
.slant-button:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--white);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.slant-button:hover{color:var(--ink);transform:skewX(-12deg) translateY(-2px)}
.slant-button:hover:before{transform:scaleX(1);transform-origin:left}
.slant-ghost{background:transparent;box-shadow:inset 0 0 0 2px var(--white)}
.slant-small{min-height:46px;padding:0 22px;font-size:16px}

/* Header */
.site-header{position:fixed;z-index:60;inset:0 0 auto;display:flex;align-items:center;gap:40px;height:84px;padding:0 4vw;transition:transform .45s var(--ease),background .3s}
.site-header.is-scrolled{background:rgba(5,11,24,.86);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--steel)}
.site-header.is-hidden{transform:translateY(-100%)}
.brand{display:block;width:128px;flex-shrink:0}
.brand img{width:100%;height:auto}
.site-header nav{display:flex;gap:34px;margin-left:auto}
.site-header nav a{position:relative;font-weight:600;font-size:17px;color:var(--ice);padding:10px 0;transition:color .2s}
.site-header nav a:after{content:'';position:absolute;left:0;right:0;bottom:4px;height:3px;background:var(--volt);transform:scaleX(0) skewX(-30deg);transform-origin:left;transition:transform .35s var(--ease)}
.site-header nav a:hover,.site-header nav a.active{color:#fff}
.site-header nav a:hover:after,.site-header nav a.active:after{transform:scaleX(1) skewX(-30deg)}

/* Hero */
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;height:100svh;min-height:700px;max-height:1200px;overflow:hidden;background:var(--ink)}
.hero-wall{position:absolute;inset:0;z-index:-3;opacity:.55;overflow:hidden}
.hero-wall:after{content:'';position:absolute;inset:0;background:#1f4dff;mix-blend-mode:color}
.wall-tilt{position:absolute;left:-14vw;top:46%;width:128vw;display:flex;flex-direction:column;gap:22px;transform:translateY(-50%) rotate(-11deg) translate3d(var(--wx,0px),var(--wy,0px),0)}
.wall-row{display:flex;width:max-content;animation:drift 110s linear infinite;animation-play-state:paused}
.is-ready .wall-row{animation-play-state:running}
.wall-row img{flex:none;width:max(220px,25vw);height:auto;aspect-ratio:16/9;object-fit:cover;margin-right:22px;border-radius:4px}
.wall-row.r2{animation-direction:reverse;animation-duration:90s;margin-left:-12vw}
.wall-row.r3{animation-duration:130s;margin-left:-4vw}
@keyframes drift{to{transform:translateX(-50%)}}
.hero-shade{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse 75% 65% at 35% 70%,rgba(5,11,24,.5),rgba(5,11,24,.9) 80%),linear-gradient(to top,var(--ink) 4%,transparent 40%)}
.hero-streak{position:absolute;z-index:4;left:0;top:44%;width:55vw;height:5px;opacity:0;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(90,136,255,.6) 55%,#fff);box-shadow:0 0 28px 6px rgba(43,99,255,.7);border-radius:0 6px 6px 0;transform:translateX(-60vw) rotate(-4deg)}
.hero:after{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;background:var(--volt);opacity:0;mix-blend-mode:screen}
.hero-inner{position:relative;z-index:2;width:100%;padding:0 4vw 7vh}
.slam-title{font-size:clamp(64px,12.6vw,250px);line-height:.9;transform:rotate(-4deg);transform-origin:left bottom;margin:0 0 7vh}
.slam-line{display:block;white-space:nowrap;text-shadow:.055em .055em 0 var(--volt)}
.slam-title .l2{padding-left:11vw}
.hero-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}
.hero-copy{font-weight:500;font-size:clamp(18px,1.45vw,23px);line-height:1.4;color:var(--ice);max-width:30em}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}

/* One orchestrated entrance: the shot, the slam, the hit. */
.motion-enabled .slam-line,.motion-enabled .hero-foot{opacity:0}
.motion-enabled .hero-wall{opacity:0}
.is-ready .hero-streak{animation:streak .5s cubic-bezier(.65,0,.2,1) both}
.is-ready .slam-title .l1{animation:slam-left .8s var(--snap) .16s both}
.is-ready .slam-title .l2{animation:slam-right .8s var(--snap) .28s both}
.is-ready .hero-inner{animation:hit .42s linear .5s}
.is-ready .hero:after{animation:flash .6s ease-out .46s both}
.is-ready .hero-wall{animation:wall-in 1.8s var(--ease) .5s both}
.is-ready .hero-foot{animation:rise 1s var(--ease) .75s both}
@keyframes streak{0%{opacity:0;transform:translateX(-60vw) rotate(-4deg)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translateX(130vw) rotate(-4deg)}}
@keyframes slam-left{0%{opacity:0;transform:translateX(-70vw) skewX(32deg)}55%{opacity:1;transform:translateX(2.5vw) skewX(-9deg)}78%{transform:translateX(-.6vw) skewX(3deg)}100%{opacity:1;transform:none}}
@keyframes slam-right{0%{opacity:0;transform:translateX(70vw) skewX(-32deg)}55%{opacity:1;transform:translateX(-2.5vw) skewX(9deg)}78%{transform:translateX(.6vw) skewX(-3deg)}100%{opacity:1;transform:none}}
@keyframes hit{0%,100%{transform:none}15%{transform:translate(-10px,6px)}35%{transform:translate(8px,-5px)}55%{transform:translate(-4px,3px)}75%{transform:translate(2px,-1px)}}
@keyframes flash{0%{opacity:0}12%{opacity:.4}100%{opacity:0}}
@keyframes wall-in{from{opacity:0;transform:scale(1.18)}to{opacity:.55;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* Crossing motto band */
.band{position:relative;z-index:2;height:clamp(170px,17vw,270px);overflow:hidden;background:var(--ink)}
.band-strip{position:absolute;left:-10%;right:-10%;top:50%;padding:20px 0;white-space:nowrap;overflow:hidden}
.band-a{z-index:2;background:var(--volt);color:var(--ink);transform:translateY(-50%) rotate(-3deg)}
.band-b{background:var(--navy);color:var(--ice);transform:translateY(-50%) rotate(2.6deg);box-shadow:inset 0 1px 0 var(--steel),inset 0 -1px 0 var(--steel)}
.band-run{display:inline-flex;align-items:center;will-change:transform}
.band-run span{font:800 clamp(30px,3.7vw,60px)/1.1 var(--display);text-transform:uppercase;padding:0 .55em}
.band-b .band-run span{font-size:clamp(22px,2.4vw,38px);color:transparent;-webkit-text-stroke:1.5px var(--ice)}
.band-run i{display:block;width:.9em;height:.9em;font-size:clamp(22px,2.6vw,40px);background:currentColor;transform:skewX(-22deg)}
.band-b .band-run i{width:.5em;height:.5em;background:var(--volt)}

/* Games */
.games{position:relative;background:var(--ink)}
.games-pin{position:relative;padding:110px 0 70px}
.games-head{padding:0 var(--gutter);margin-bottom:50px}
.games-head h2{font-size:clamp(60px,7.4vw,140px);line-height:.92;text-shadow:.05em .05em 0 var(--volt)}
.games-total{display:flex;flex-direction:column;gap:6px;margin-top:38px}
.games-total strong{font:800 clamp(44px,4.4vw,80px)/1 var(--display);color:var(--volt-hi);font-variant-numeric:tabular-nums}
.games-total span{font-weight:500;color:var(--ice)}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(90,136,255,0)}100%{box-shadow:0 0 0 0 rgba(90,136,255,0)}}
.games-track{display:flex;align-items:center;gap:4vw;padding:10px var(--gutter) 30px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none}
.games-track::-webkit-scrollbar{display:none}
.game-card{flex:0 0 auto;width:min(62vw,calc((100svh - 330px) * 1.78));min-width:280px;scroll-snap-align:center}
.game-link{position:relative;display:block;overflow:hidden;clip-path:var(--slant);transition:clip-path .55s var(--ease)}
.game-media{display:block;overflow:hidden;aspect-ratio:16/9;background:var(--navy)}
.game-media img{width:100%;height:100%;object-fit:cover;transform:translate3d(var(--px,0px),0,0) scale(var(--zoom,1.14));transition:transform .9s var(--ease)}
.game-play{position:absolute;inset:0;display:grid;place-items:center;font:800 clamp(64px,8vw,150px)/1 var(--display);text-transform:uppercase;color:#fff;text-shadow:.05em .05em 0 var(--ink);background:rgba(43,99,255,.6);opacity:0;transform:scale(1.25);transition:opacity .3s,transform .5s var(--snap)}
.game-link:hover,.game-link:focus-visible{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.game-link:hover .game-media img,.game-link:focus-visible .game-media img{--zoom:1.24}
.game-link:hover .game-play,.game-link:focus-visible .game-play{opacity:1;transform:none}
.game-meta{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-top:22px;padding:0 3%}
.game-meta h3{font:700 clamp(23px,2vw,34px)/1.1 var(--text);letter-spacing:-.03em}
.game-stats{display:flex;gap:26px;white-space:nowrap;font-weight:500;font-size:15px;color:var(--muted)}
.game-stats>span{display:flex;gap:7px;align-items:baseline}
.game-stats strong{font:800 clamp(22px,1.8vw,30px)/1 var(--text);letter-spacing:-.02em;color:var(--white);font-variant-numeric:tabular-nums}
.is-live .stat-online strong:before{content:'';display:inline-block;width:8px;height:8px;margin:0 8px 4px 0;border-radius:50%;background:var(--volt-hi);vertical-align:middle;animation:pulse 2s infinite}
.games-end{flex:0 0 auto;display:flex;flex-direction:column;gap:22px;padding:0 4vw 0 1vw;scroll-snap-align:center}
.games-end-big{font:800 clamp(60px,7vw,130px)/.92 var(--display);text-transform:uppercase;color:transparent;-webkit-text-stroke:2px var(--white);transition:color .3s,transform .5s var(--snap)}
.games-end-small{font-weight:700;font-size:18px;color:var(--volt-hi)}
.games-end:hover .games-end-big{color:var(--volt);-webkit-text-stroke-color:var(--volt);transform:skewX(-8deg)}

.pinned .games-pin{position:sticky;top:0;height:100svh;min-height:620px;padding:0;overflow:hidden}
.pinned .games-head{position:absolute;z-index:2;left:var(--gutter);top:50%;width:min(31vw,520px);padding:0;margin:0;transform:translate3d(var(--tx,0px),-50%,0);will-change:transform}
.pinned .games-track{position:absolute;inset:0;width:max-content;overflow:visible;padding:30px var(--gutter) 0 calc(var(--gutter) * 1.4 + min(31vw,520px));gap:5vw;will-change:transform}
.pinned .games-head h2{font-size:clamp(46px,4.9vw,96px)}
.pinned .game-card:nth-child(even){transform:translateY(7vh)}
.pinned .game-card:nth-child(odd){transform:translateY(-3vh)}
.pinned .game-link{transform:skewX(var(--skew,0deg))}
.wheel-pointer{display:none}
/* Ticket wheel: a ring that idles, then locks into a drum; the pointer on the left reads the slot. */
.games.games-wheel{--wheel-x:63%}
.games.games-wheel .games-pin{isolation:isolate;background:radial-gradient(ellipse 42% 60% at var(--wheel-x) 50%,rgba(43,99,255,.16),transparent 70%)}
.games.games-wheel .games-head{width:min(30vw,500px);transform-origin:left top;transform:translate3d(0,calc(-50% + var(--hy,0px)),0) scale(var(--hs,1));will-change:transform}
.games.games-wheel .games-track{display:block;inset:0;width:auto;padding:0;perspective:1700px;perspective-origin:var(--wheel-x) 50%;transform-style:preserve-3d;pointer-events:none;will-change:auto;scroll-snap-type:none;overflow:visible}
.games.games-wheel .game-card{position:absolute;left:var(--wheel-x);top:50%;width:var(--card-width);min-width:0;will-change:transform,opacity;backface-visibility:hidden;pointer-events:none;transform-style:preserve-3d}
.games.games-wheel .game-card.is-active{pointer-events:auto}
.games.games-wheel .game-link{transform:none;clip-path:none}
.games.games-wheel .game-media{position:relative}
.games.games-wheel .game-media:after{content:'';position:absolute;inset:0;background:var(--ink);opacity:var(--shade,0);pointer-events:none}
.games.games-wheel .game-meta,.games.games-wheel .games-end{display:none}
.games.games-wheel .wheel-pointer{display:block;position:absolute;z-index:70;left:var(--gutter);top:50%;width:calc(var(--wheel-x) - var(--card-width) / 2 - 44px - var(--gutter));max-width:560px;margin-left:auto;transform:translate3d(var(--px-in,0px),-50%,0);opacity:var(--p-op,1)}
.games.games-wheel .wheel-pointer{left:auto;right:calc(100% - var(--wheel-x) + var(--card-width) / 2 + 48px)}
.wheel-ticket{position:relative;display:flex;flex-direction:column;gap:18px;padding-right:56px}
.wheel-name{font:800 clamp(34px,3.1vw,60px)/.98 var(--display);text-transform:uppercase;min-height:1.96em;display:flex;align-items:flex-end}
.wheel-stats{display:flex;gap:28px;font-size:15px}
.wheel-stats strong{font-size:clamp(26px,2.2vw,38px)}
.wheel-stats>span{flex-direction:column;gap:4px}
.wheel-ticket.is-swapping .wheel-name,.wheel-ticket.is-swapping .wheel-stats{animation:ticket-in .4s var(--ease)}
@keyframes ticket-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.wheel-play{align-self:flex-start;margin-top:4px;padding-bottom:4px;border-bottom:2px solid var(--volt);font-weight:700;font-size:17px;color:var(--white);transition:color .2s,border-color .2s}
.wheel-play:hover{color:var(--volt-hi);border-color:var(--volt-hi)}
.wheel-flapper{position:absolute;right:-30px;top:50%;width:26px;height:22px;margin-top:-11px;background:var(--volt);clip-path:polygon(0 0,100% 50%,0 100%);transform-origin:0 50%;transform:rotate(var(--flap,0deg))}
@media(min-width:761px) and (max-width:1099px){
  .games.games-wheel{--wheel-x:66%}
  .games.games-wheel .games-head{width:30vw}
  .games.games-wheel .games-head h2{font-size:clamp(40px,5vw,60px)}
    }

/* Revenue: the arrow breaks the corner and floods the screen. */
.impact{position:relative;background:var(--ink)}
.impact-sticky{position:relative;isolation:isolate;overflow:hidden;padding:130px var(--gutter) 120px}
.impact-flood{position:absolute;inset:0;z-index:-2;background:var(--volt);clip-path:circle(150% at 100% 0)}
.graph-field{position:absolute;inset:0;z-index:-1;opacity:.12}
.revenue-graph{width:100%;height:100%;overflow:visible}
.graph-grid{stroke:rgba(196,214,255,.07);stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.graph-track{fill:none;stroke:rgba(90,136,255,.18);stroke-width:8;vector-effect:non-scaling-stroke}
.graph-line{fill:none;stroke:var(--white);stroke-width:10;stroke-linecap:square;stroke-linejoin:bevel;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 14px rgba(43,99,255,.9))}
.graph-arrow{fill:none;stroke:var(--white);stroke-width:10;stroke-linejoin:miter;opacity:0}
.graph-arrow path{vector-effect:non-scaling-stroke}
.break-corner{position:absolute;z-index:3;right:0;top:0;width:300px;height:300px;pointer-events:none;perspective:900px}
.crack{width:100%;height:100%;fill:none;stroke:#fff;stroke-width:2;opacity:0}
.glass-filter{position:absolute;pointer-events:none}
.shard{position:absolute;top:-8px;right:-5px;width:clamp(54px,7.5vw,120px);height:clamp(72px,9vw,150px);clip-path:var(--glass-shape);opacity:0;visibility:hidden;transform-origin:45% 45%;background:linear-gradient(125deg,rgba(239,250,255,.34),rgba(172,210,255,.03) 38%,rgba(255,255,255,.14) 67%,rgba(92,139,255,.25));-webkit-backdrop-filter:blur(1px) brightness(1.35) saturate(1.4);backdrop-filter:blur(1px) brightness(1.35) saturate(1.4)}
.shard svg{width:100%;height:100%;overflow:visible;fill:none;stroke:rgba(235,249,255,.9);stroke-width:1.5;vector-effect:non-scaling-stroke;filter:drop-shadow(1px 0 0 #7dcfff) drop-shadow(-1px 0 0 #b3a0ff)}
.shard svg path{stroke:rgba(255,255,255,.24);stroke-width:.7}
.shard:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,var(--glint,.2)) 49%,transparent 65%);mix-blend-mode:screen}
@supports(backdrop-filter:url(#glass-refraction)){.shard{backdrop-filter:url(#glass-refraction) brightness(1.3) saturate(1.5)}}
@media(min-width:761px){.graph-line,.graph-arrow{stroke-width:11}.graph-arrow{vector-effect:non-scaling-stroke}.graph-arrow path{vector-effect:none}}
.impact-stack{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:60px 10vw}
.stat-layer{transform-origin:left center}
.stat-num{display:block;font:800 clamp(84px,15.5vw,280px)/1 var(--display);white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--white);text-shadow:.05em .05em 0 var(--ink)}
.stat-num span{font-size:.62em}
.layer-pcr .stat-num{color:var(--ink);text-shadow:.05em .05em 0 var(--white)}
.result-label{margin-top:10px;font:800 clamp(20px,1.9vw,32px)/1.2 var(--text);letter-spacing:-.01em;color:var(--white)}
.layer-pcr .result-label{color:var(--ink)}
.layer-rev{flex-basis:100%}
.impact-sticky:after{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;background:#fff;opacity:0}
.impact-sticky.is-hit{animation:hit .45s linear}
.impact-sticky.is-hit:after{animation:flash-white .5s ease-out}
@keyframes flash-white{0%{opacity:0}10%{opacity:.75}100%{opacity:0}}
.impact-active{height:330svh}
.impact-active .impact-sticky{position:sticky;top:0;height:100svh;min-height:620px;padding:0}
.impact-active .impact-flood{clip-path:circle(0% at 100% 0)}
.impact-active .graph-field{opacity:1}
.impact-active .graph-arrow{opacity:1}
.impact-active .impact-stack{position:absolute;left:var(--gutter);right:var(--gutter);top:50%;transform:translateY(-50%);display:block;height:clamp(160px,24vw,420px)}
.impact-active .stat-layer{position:absolute;left:0;top:0;will-change:transform,opacity,filter}
.impact-active .layer-pcr,.impact-active .layer-arpdau{opacity:0}
.impact-active .layer-pcr .stat-num,.impact-active .layer-arpdau .stat-num{font-size:clamp(100px,19vw,340px)}
.impact-active .shard{will-change:transform,opacity}

/* From X: the post, and the three numbers in it. */
.featured{display:grid;grid-template-columns:1.15fr 1fr;gap:6vw;align-items:center;padding:20vh var(--gutter) 6vh;background:var(--ink)}
.featured .small-head{padding:0;margin-bottom:22px}
.featured-title{font-size:clamp(56px,7.2vw,140px);line-height:.92;text-shadow:.05em .05em 0 var(--volt)}
.featured-stats{list-style:none;padding:0;margin-top:7vh;display:grid;gap:3vh}
.featured-stats li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:clamp(18px,2vw,32px);padding-bottom:3vh;border-bottom:2px solid var(--steel)}
.featured-stats strong{display:block;width:4.15em;font:800 clamp(54px,5.6vw,104px)/1 var(--display);color:var(--volt-hi);font-variant-numeric:tabular-nums;white-space:nowrap}
.featured-stats span{font-weight:600;font-size:clamp(18px,1.4vw,22px);line-height:1.3;color:var(--ice)}
.xpost{position:relative;padding:38px 40px 30px;background:var(--navy);box-shadow:14px 14px 0 var(--volt);transform:rotate(2.5deg);transition:transform .6s var(--snap),box-shadow .6s var(--snap)}
.xpost:hover{transform:rotate(0deg) translateY(-6px);box-shadow:20px 20px 0 var(--volt)}
.xpost-head{display:flex;align-items:center;gap:14px}
.xpost-avatar{display:block;flex:none;width:48px;height:48px;border-radius:50%;background:var(--steel);object-fit:cover}
.xpost-who{display:flex;flex-direction:column;line-height:1.25}
.xpost-who strong{font-size:18px}
.xpost-who span{font-size:16px;color:var(--muted)}
.xpost-on{margin-left:auto;font-weight:700;font-size:14px;color:var(--muted)}
.xpost-lede{margin-top:26px;font-weight:600;font-size:clamp(20px,1.6vw,26px);line-height:1.35}
.xpost-quote{margin:20px 0 0;padding:0 0 0 22px;border-left:4px solid var(--volt)}
.xpost-quote p{font-weight:500;font-size:clamp(18px,1.4vw,23px);line-height:1.45;color:var(--ice)}
.xpost-watch{display:flex;align-items:center;gap:16px;margin-top:28px;padding:20px 22px;background:var(--ink);font-weight:700;font-size:17px;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);transition:background .25s,color .25s}
.xpost-play{width:0;height:0;border-left:16px solid var(--volt-hi);border-top:10px solid transparent;border-bottom:10px solid transparent}
.xpost-watch:hover{background:var(--volt)}
.xpost-watch:hover .xpost-play{border-left-color:#fff}
.xpost-foot{display:flex;justify-content:space-between;gap:20px;margin-top:24px;padding-top:18px;border-top:1px solid var(--steel);font-size:15px;color:var(--muted)}
.xpost-foot a{font-weight:700;color:var(--volt-hi)}
.xpost-foot a:hover{color:#fff}

/* Studio */
.studio{padding:16vh var(--gutter) 6vh;background:var(--ink)}
.manifesto{font:800 clamp(40px,5.5vw,104px)/1.03 var(--display);text-transform:uppercase;max-width:15.5em}
.manifesto .w{display:inline-block;opacity:var(--o,1);transition:opacity .15s linear}
.motion-enabled .manifesto .w{--o:.14}
.studio-art{position:relative;margin:16vh calc(var(--gutter) * -1) 0;overflow:hidden;clip-path:var(--clip,none);background:var(--navy)}
.studio-art img{width:100%;height:auto;aspect-ratio:2.2;object-fit:cover;transform:scale(var(--s,1));transform-origin:center}
.brands{display:flex;justify-content:center;gap:clamp(32px,5vw,96px);align-items:center;padding:11vh 0 7vh}
.brands .small-head{margin:0;padding:0;flex-shrink:0}
.small-head{font:700 19px/1.3 var(--text);color:var(--muted);padding-top:1.2em}
.brand-list{list-style:none;margin:0;padding:0;display:flex;align-items:baseline;justify-content:center;gap:.15em 0}
.brand-list li{font:800 clamp(34px,4.1vw,82px)/1.05 var(--text);white-space:nowrap;letter-spacing:-.05em;transition:color .3s}
.brand-list li+li:before{content:'/';margin:0 .42em;color:var(--volt);font-weight:300;letter-spacing:0}
.brand-list li:hover{color:var(--volt-hi)}
.brand-list .sephora{letter-spacing:.06em;font-weight:600}
.brand-list .loreal{font-weight:500}
.partners{padding:6vh 0;border-top:2px solid var(--steel);scroll-margin-top:110px}
.partners .small-head{padding:0;margin-bottom:28px;color:var(--white);font-size:clamp(24px,2.4vw,36px)}
.partner-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.partner-card{display:block;min-width:0}
.partner-banner{position:relative;display:grid;place-items:center;aspect-ratio:2.75;overflow:hidden;background:#070d20;border:1px solid var(--steel)}
.partner-banner>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.partner-banner .partner-logo{position:absolute;width:51%;height:auto;object-fit:contain;filter:drop-shadow(0 2px 12px #0009)}
.partner-name{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;font:800 clamp(24px,2.1vw,34px)/1.2 var(--text)}
.partner-name svg{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:2;transition:transform .25s ease}
a.partner-card:hover .partner-banner>img,a.partner-card:focus-visible .partner-banner>img{transform:scale(1.035)}
a.partner-card:hover .partner-name svg,a.partner-card:focus-visible .partner-name svg{transform:translate(3px,-3px)}

/* Ways to partner: three deals, dealt onto the table as you scroll in. */
.ways{padding:14vh var(--gutter) 12vh;background:var(--ink)}
.ways-head{display:grid;grid-template-columns:1.1fr 1fr;align-items:end;gap:20px 6vw}
.ways-head .small-head{grid-column:1/-1;padding:0}
.ways-title{font-size:clamp(56px,7vw,132px);line-height:.92;text-shadow:.05em .05em 0 var(--volt)}
.ways-sub{font-weight:500;font-size:clamp(18px,1.45vw,23px);line-height:1.45;color:var(--ice);max-width:28em;padding-bottom:.6em}
.deal-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.4vw;margin:9vh 0 7vh;counter-reset:none}
.deal-card{position:relative;display:flex;flex-direction:column;gap:18px;padding:40px 36px 32px;background:var(--navy);clip-path:polygon(18px 0,100% 0,calc(100% - 18px) 100%,0 100%);transform:translate3d(var(--dx,0px),var(--dy,0px),0) rotate(var(--dr,0deg));transition:background .3s;will-change:transform}
.deal-card:before{content:'';position:absolute;left:0;right:0;top:0;height:6px;background:var(--volt);transform-origin:left;transform:scaleX(var(--bar,1))}
.deal-card:hover{background:#0f2148}
.deal-card h3{font:800 clamp(30px,2.6vw,48px)/1.02 var(--display);text-transform:uppercase}
.deal-desc{font-weight:500;font-size:clamp(17px,1.2vw,20px);line-height:1.45;color:var(--ice)}
.deal-points{list-style:none;padding:0;display:grid;gap:10px;margin-top:auto;padding-top:10px}
.deal-points li{position:relative;padding-left:26px;font-weight:700;font-size:17px}
.deal-points li:before{content:'';position:absolute;left:0;top:.42em;width:12px;height:12px;background:var(--volt);transform:skewX(-20deg)}
.deal-meter{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:20px;border-top:2px solid var(--steel);font-weight:700;font-size:15px;color:var(--muted)}
.meter-bars{display:flex;gap:6px}
.meter-bars i{width:30px;height:12px;background:var(--steel);transform:skewX(-20deg)}
.meter-bars i.on{background:var(--volt-hi)}

/* Hiring strip */
.hiring{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin:0 var(--gutter) 14vh;padding:7vh 4vw;background:repeating-linear-gradient(-62deg,var(--navy) 0 18px,#0c1b3b 18px 36px);box-shadow:14px 14px 0 var(--volt);clip-path:none}
.hiring .small-head{padding:0;margin-bottom:12px}
.hiring-title{font-size:clamp(52px,6.4vw,120px);line-height:.92;text-shadow:.05em .05em 0 var(--volt)}
.hiring-sub{margin-top:18px;font-weight:500;font-size:clamp(17px,1.35vw,22px);color:var(--ice);max-width:30em}

/* Careers page */
.careers-main{position:relative;isolation:isolate;overflow:hidden;padding:140px var(--gutter) 14vh}
.careers-hero .small-head{padding:0}
.careers-title{font-size:clamp(70px,11vw,210px);margin:4vh 0 4vh}
.careers-title .l2{padding-left:9vw}
.careers-sub{font-weight:500;font-size:clamp(18px,1.5vw,24px);line-height:1.45;color:var(--ice);max-width:34em}
.apply{position:relative;margin-top:10vh;max-width:1180px;padding:44px 48px 40px;background:var(--navy);box-shadow:16px 16px 0 var(--volt)}
.apply-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 38px}
.apply-steps li{position:relative;padding-top:16px;font-weight:700;font-size:15px;color:var(--muted)}
.apply-steps li:before{content:'';position:absolute;left:0;right:0;top:0;height:6px;background:var(--steel);transform:skewX(-20deg)}
.apply-steps li.is-on{color:var(--white)}
.apply-steps li.is-on:before{background:var(--volt)}
.apply-step{border:0;margin:0;padding:0;min-width:0}
.apply-step legend{padding:0;font:800 clamp(34px,3.2vw,58px)/1 var(--display);text-transform:uppercase}
.step-hint{margin:12px 0 30px;font-weight:500;font-size:18px;color:var(--ice)}
.step-hint strong{color:#fff}
.apply-step.is-current{animation:step-in .5s var(--snap)}
@keyframes step-in{from{opacity:0;transform:translateX(40px) skewX(-6deg)}to{opacity:1;transform:none}}
.role-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.role-chip{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px 22px;background:var(--ink);cursor:pointer;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);transition:background .2s,transform .3s var(--snap)}
.role-chip input{position:absolute;opacity:0;pointer-events:none}
.role-name{font:800 22px/1.05 var(--display);text-transform:uppercase}
.role-note{font-weight:500;font-size:15px;line-height:1.4;color:var(--muted)}
.role-chip:hover{background:#0f2148;transform:translateY(-2px)}
.role-chip:has(input:checked){background:var(--volt);transform:translateY(-3px)}
.role-chip:has(input:checked) .role-note{color:var(--ice)}
.role-chip:has(input:focus-visible){outline:3px solid var(--volt-hi);outline-offset:3px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
.field{display:flex;flex-direction:column;gap:9px;font-weight:700;font-size:16px}
.field em{font-style:normal;font-weight:500;color:var(--muted)}
.field-wide{grid-column:1/-1}
.field input,.field select,.field textarea{width:100%;padding:16px 18px;border:2px solid var(--steel);background:var(--ink);color:var(--white);font:500 18px/1.4 var(--text);border-radius:0;transition:border-color .2s}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--volt-hi)}
.field input[aria-invalid=true]{border-color:#ff5d73}
.apply-error{min-height:1.4em;margin-top:16px;font-weight:700;font-size:16px;color:#ff8a9a}
.apply-preview{margin:0;padding:24px 26px;background:var(--ink);border-left:6px solid var(--volt);font:500 17px/1.6 var(--text);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ice)}
.apply-send{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.submission-status{margin:22px 0 0;max-width:52ch;font:600 18px/1.5 var(--text);color:var(--ice)}
.submission-status:empty{display:none}
.submission-status.is-error{color:#ff8a9a}
.apply button:disabled{opacity:.55;cursor:default;pointer-events:none}
.submission-trap{position:absolute!important;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.apply-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:34px;padding-top:26px;border-top:2px solid var(--steel)}
.apply-back{font-weight:700;font-size:17px;color:var(--ice);padding:12px 0}
.apply-back:hover{color:#fff}
.apply-nav .slant-button{margin-left:auto}
.apply-nav [hidden]{display:none}
@media(max-width:900px){
  .ways-head{grid-template-columns:1fr}
  .deal-grid{grid-template-columns:1fr;gap:18px}
  .hiring{flex-direction:column;align-items:flex-start}
}
@media(max-width:760px){
  .ways{padding:10vh var(--gutter) 9vh}
  .ways-title{font-size:15vw}
  .deal-card{padding:30px 26px 26px}
  .hiring{margin:0 var(--gutter) 10vh;padding:40px 26px;box-shadow:9px 9px 0 var(--volt)}
  .hiring-title{font-size:14vw}
  .careers-main{padding-top:110px}
  .careers-title{font-size:19vw}
  .careers-title .l2{padding-left:6vw}
  .apply{padding:28px 22px 26px;box-shadow:9px 9px 0 var(--volt)}
  .apply-steps{margin-bottom:28px}
  .field-grid{grid-template-columns:1fr}
  .role-grid{grid-template-columns:1fr}
}

/* Team */
.team{padding:10vh var(--gutter) 14vh;background:var(--ink)}
.team-title{font-size:clamp(66px,10vw,190px);line-height:.9;text-shadow:.05em .05em 0 var(--volt)}
.team-grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3.2vw;margin-top:8vh}
.team-member{position:relative}
.team-member:nth-child(even){margin-top:6vh}
/* 1:1 portraits: brand duotone by default, real colour on hover. */
.pfp{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:var(--navy);clip-path:polygon(5% 0,100% 0,95% 100%,0 100%);transform:rotate(var(--tilt,-2deg));transition:transform .55s var(--snap),clip-path .55s var(--ease)}
.team-member:nth-child(even) .pfp{--tilt:2deg}
.team-member{--shadow:12px}
.team-member:before{content:'';position:absolute;left:0;right:0;top:0;aspect-ratio:1;background:var(--volt);clip-path:polygon(5% 0,100% 0,95% 100%,0 100%);transform:translate(var(--shadow),var(--shadow)) rotate(var(--tilt,-2deg));transition:transform .55s var(--snap)}
.team-member:nth-child(even):before{--tilt:2deg}
.pfp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:opacity .45s ease,transform .8s var(--ease)}
.pfp-empty{background:repeating-linear-gradient(-62deg,var(--navy) 0 16px,#0c1b3b 16px 32px)}
.pfp-empty:before{content:attr(data-initial);position:absolute;inset:0;display:grid;place-items:center;font:800 clamp(90px,11vw,200px)/1 var(--display);color:var(--white);text-shadow:.06em .06em 0 var(--volt)}
.pfp-empty:after{content:'';position:absolute;inset:0;pointer-events:none;background:url('/assets/monogram.png') 88% 88%/34% no-repeat;mix-blend-mode:screen;opacity:.1}
@media(hover:hover){
  .team-member:hover .pfp,.team-member:hover:before{--tilt:0deg}
  .team-member:hover{--shadow:18px}
  .team-member:hover .pfp{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
  .team-member:hover:before{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
  .team-member:hover .pfp img{transform:scale(1.1)}
}
.team-member h3{margin-top:calc(26px + 1.2vw);font:800 clamp(30px,3vw,56px)/1.05 var(--display);text-transform:uppercase}
.team-member p{margin-top:10px;font:700 clamp(16px,1.25vw,21px)/1.4 var(--text);color:var(--muted)}

/* Sign-off */
.cta{position:relative;isolation:isolate;overflow:hidden;padding:15vh var(--gutter) 13vh;background:var(--volt);color:var(--ink)}
.cta-mark{position:absolute;z-index:-1;right:-6vw;top:-12%;width:min(56vw,900px);height:auto;filter:invert(1);mix-blend-mode:multiply;opacity:.2;transform:rotate(8deg)}
.cta-big{display:inline-block;font:800 clamp(92px,19.5vw,390px)/.86 var(--display);text-transform:uppercase;transform:rotate(-3deg);transform-origin:left bottom}
.cta-word{display:block;transition:transform .6s var(--snap),color .3s,text-shadow .3s}
.cta-word+.cta-word{padding-left:12vw}
.cta-big:hover .cta-word{color:#fff;text-shadow:.05em .05em 0 var(--ink)}
.cta-big:hover .cta-word:first-child{transform:translateX(-1.5vw) skewX(-6deg)}
.cta-big:hover .cta-word:last-child{transform:translateX(2vw) skewX(-6deg)}
.cta-links{display:flex;flex-wrap:wrap;gap:18px;margin-top:9vh}
.cta-chip{display:inline-flex;align-items:baseline;gap:18px;padding:22px 40px 22px 34px;background:var(--ink);color:var(--white);clip-path:polygon(16px 0,100% 0,calc(100% - 16px) 100%,0 100%);transition:background .25s,color .25s;text-align:left}
.cta-chip strong{font:700 clamp(22px,2vw,30px)/1 var(--text);letter-spacing:-.02em}
.chip-label{font-weight:600;font-size:15px;color:var(--muted)}
.chip-note{font-weight:700;font-size:15px;color:var(--volt-hi)}
.cta-chip:hover{background:var(--white);color:var(--ink)}
.cta-chip:hover .chip-label{color:var(--steel)}
.cta-chip:hover .chip-note{color:var(--volt)}

/* Footer and toast */
.site-footer{display:flex;align-items:center;gap:30px;padding:30px 4vw;background:var(--ink);border-top:1px solid var(--steel)}
.site-footer .brand{width:100px}
.footer-copy{font-size:15px;color:var(--muted)}
.footer-links{display:flex;align-items:center;gap:26px;margin-left:auto;font-weight:600;font-size:16px;color:var(--ice)}
.footer-links a,.footer-links button{padding:12px 0;transition:color .2s}
.footer-links a:hover,.footer-links button:hover{color:#fff}
.motion-toggle{padding-left:24px!important;border-left:1px solid var(--steel)!important}
.toast{position:fixed;z-index:160;left:50%;bottom:30px;max-width:calc(100vw - 32px);width:max-content;padding:16px 30px;background:var(--white);color:var(--ink);font-weight:700;font-size:16px;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);opacity:0;transform:translate(-50%,16px);pointer-events:none;transition:opacity .25s,transform .35s var(--snap)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* Contact page */
.contact-main{position:relative;isolation:isolate;overflow:hidden;min-height:calc(100svh - 94px);padding:150px var(--gutter) 12vh}
.contact-glow{position:absolute;z-index:-1;right:-20vw;top:-30vw;width:70vw;height:70vw;border-radius:50%;background:radial-gradient(circle,rgba(43,99,255,.45),transparent 65%)}
.back-link{display:inline-block;font-weight:600;font-size:16px;color:var(--muted);padding:8px 0;transition:color .2s}
.back-link:hover{color:#fff}
.contact-title{font-size:clamp(56px,9.4vw,180px);margin:7vh 0 5vh}
.contact-title .l2{padding-left:8vw}
.contact-copy{font-weight:500;font-size:clamp(18px,1.5vw,23px);color:var(--ice)}
.contact-options{display:grid;grid-template-columns:1fr 1fr;gap:2vw;margin-top:8vh;max-width:1400px}
.contact-option{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:40px 48px;overflow:hidden;background:var(--navy);text-align:left;clip-path:polygon(22px 0,100% 0,calc(100% - 22px) 100%,0 100%);transition:color .3s}
.contact-option:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--volt);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.contact-option:hover:before{transform:scaleX(1);transform-origin:left}
.contact-option strong{font:800 clamp(36px,4vw,68px)/1.05 var(--text);letter-spacing:-.04em}
.option-label{font-weight:600;font-size:16px;color:var(--muted);transition:color .3s}
.option-note{font-weight:600;font-size:16px;color:var(--volt-hi);transition:color .3s}
.contact-option:hover .option-label,.contact-option:hover .option-note{color:var(--ice)}

@media(max-width:1000px){
  .site-header nav{gap:24px}
  .brands{flex-direction:column;gap:26px;text-align:center}
  .small-head{padding-top:0}
  .pinned .games-head{width:min(36vw,380px)}
  .pinned .games-track{padding-left:calc(var(--gutter) * 2 + min(36vw,380px))}
}
@media(max-width:760px){
  :root{--gutter:6vw}
  html{scroll-padding-top:74px}
  body{font-size:17px}
  .site-header{height:72px;padding:0 5vw}
  .site-header nav{display:none}
  .site-header .slant-button{margin-left:auto}
  .brand{width:108px}
  .slant-button{min-height:52px;padding:0 24px;font-size:16px}
  .slant-small{min-height:42px;padding:0 18px;font-size:15px}
  .hero{min-height:640px;height:100svh}
  .hero-inner{padding:0 5vw 6vh}
  .slam-title{font-size:19.5vw;line-height:.92;margin-bottom:5vh}
  .hero .slam-line{white-space:normal}
  .slam-title .l2{padding-left:6vw}
  .hero-foot{flex-direction:column;align-items:flex-start;gap:26px}
  .hero-actions{gap:12px}
  .wall-row img{width:46vw}
  .band{height:140px}
  .games-pin{padding:80px 0 50px}
  .games-head{margin-bottom:36px}
  .games-track{gap:5vw}
  .game-card{width:84vw;min-width:0}
  .game-meta{flex-direction:column;gap:12px;margin-top:16px}
  .game-stats{gap:20px}
  .games-end{width:70vw;padding:0}
  /* Native page scrolling carries the cards across a stable phone viewport. */
  .pinned .games-pin{display:flex;flex-direction:column;justify-content:center;min-height:0;padding:88px 0 56px}
  .pinned .games-head{position:relative;left:auto;top:auto;width:auto;padding:0 var(--gutter);margin:0 0 26px;transform:none;will-change:auto}
  .pinned .games-head h2{font-size:clamp(36px,10vw,58px)}
  .pinned .games-total{flex-direction:row;align-items:baseline;gap:12px;margin-top:18px}
  .pinned .games-total strong{font-size:32px}
  .pinned .games-total span{max-width:12em;line-height:1.3}
  .pinned .games-track{position:relative;inset:auto;flex:none;align-items:center;padding:0 var(--gutter);scroll-snap-type:none;touch-action:pan-y}
  .pinned .game-card:nth-child(n){transform:none}
  .pinned .game-link{transform:none}
  .pinned .game-media img{transition:none}
  .impact-sticky{padding:100px var(--gutter) 90px}
  .impact-active{height:280svh}
  .impact-active .impact-sticky{min-height:0}
  .impact-active .stat-layer{will-change:transform,opacity}
  .stat-num{font-size:18vw}
  .impact-active .impact-stack{height:38vw}
  .impact-active .layer-pcr .stat-num,.impact-active .layer-arpdau .stat-num{font-size:27vw}
  .break-corner{width:200px;height:200px}
  .graph-line{stroke-width:7}
  .graph-arrow{stroke-width:7}
  .featured{grid-template-columns:1fr;gap:9vh;padding-top:13vh}
  .featured-title{font-size:15vw}
  .featured-stats li{column-gap:16px}
  .featured-stats strong{font-size:13vw}
  .xpost{padding:28px 24px 22px;box-shadow:9px 9px 0 var(--volt);transform:rotate(1.5deg)}
  .studio{padding-top:13vh}
  .manifesto{font-size:9.4vw}
  .studio-art{margin-top:9vh}
  .studio-art img{aspect-ratio:1.3}
  .brands{padding:9vh 0 5vh}
  .brand-list{flex-direction:column;align-items:center;gap:18px}
  .brand-list li{font-size:12vw}
  .brand-list li+li:before{display:none}
  .partner-grid{grid-template-columns:1fr;gap:30px}
  .partner-banner{aspect-ratio:2.75}
  .partner-name{font-size:26px;margin-top:12px}
  .partner-banner--text{font-size:42px}
  .team{padding:10vh var(--gutter) 12vh}
  .team-title{font-size:17vw}
  .team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9vw 7vw;margin-top:5vh}
  .team-member{--shadow:8px}
  .team-member:nth-child(even){margin-top:5vh}
  .pfp-empty:before{font-size:22vw}
  .team-member h3{margin-top:22px;font-size:clamp(24px,7vw,40px)}
  .team-member p{margin-top:6px;font-size:15px}
  .cta{padding:11vh var(--gutter) 10vh}
  .cta-big{font-size:22vw}
  .cta-links{flex-direction:column;align-items:stretch}
  .cta-chip{justify-content:space-between;padding:20px 30px}
  .site-footer{flex-wrap:wrap;gap:14px 24px;padding:26px 6vw}
  .footer-links{width:100%;margin-left:0;justify-content:space-between;gap:12px;font-size:15px}
  .motion-toggle{padding-left:14px!important}
  .contact-main{padding-top:110px}
  .contact-title{font-size:14vw;line-height:.95}
  .contact-title .slam-line{white-space:normal}
  .contact-title .l2{padding-left:5vw}
  .contact-options{grid-template-columns:1fr;gap:14px}
  .contact-option{padding:30px 32px}
  .contact-option strong{font-size:10vw}
}

/* The complete catalog stays a simple, fast grid. */
.games-catalog{padding:160px var(--gutter) 100px}
.catalog-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:80px}
.catalog-head h1{font-size:clamp(80px,11vw,190px);line-height:.95;text-shadow:.045em .045em 0 var(--volt)}
.catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px 4vw}
.catalog-grid .game-card{width:auto;min-width:0}
.catalog-grid .game-meta{flex-direction:column;gap:16px}
.catalog-grid .game-meta h2{font:700 clamp(24px,2.2vw,36px)/1.15 var(--text);letter-spacing:-.03em}
.catalog-grid .game-stats{flex-wrap:wrap}
.catalog-cta{display:flex;align-items:center;justify-content:space-between;gap:32px;border-top:1px solid var(--steel);margin-top:100px;padding-top:60px}
.catalog-cta h2{font-size:clamp(36px,4vw,70px);max-width:12em}
@media(max-width:760px){
  .games-catalog{padding-top:132px;padding-bottom:64px}
  .catalog-head{align-items:flex-start;flex-direction:column;gap:24px;margin-bottom:48px}
  .catalog-head h1{font-size:16vw}
  .catalog-grid{grid-template-columns:1fr;gap:44px}
  .catalog-grid .game-meta h2{font-size:26px}
  .catalog-cta{flex-direction:column;align-items:flex-start;margin-top:64px;padding-top:40px}
  .catalog-cta h2{font-size:10vw}
  .shard{width:66px;height:88px;-webkit-backdrop-filter:blur(1px) brightness(1.35);backdrop-filter:blur(1px) brightness(1.35)}
  .shard:nth-of-type(n+9){display:none}
  .result-label{max-width:16em}
}
/* Conversion: live proof in the hero, a pitch on every deal, one primary action in the sign-off. */
.hero-proof{display:flex;flex-direction:column;gap:16px}
.hero-live{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:clamp(16px,1.2vw,19px);color:var(--ice)}
.hero-live[hidden]{display:none}
.hero-live strong{font:800 clamp(22px,1.8vw,30px)/1 var(--text);letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums}
.live-dot{width:10px;height:10px;border-radius:50%;background:var(--volt-hi);box-shadow:0 0 0 0 rgba(90,136,255,.6);animation:pulse 2s infinite}
.deal-cta{align-self:flex-start;margin-top:4px;padding-bottom:4px;border-bottom:2px solid var(--volt);font-weight:700;font-size:16px;color:var(--white);transition:color .2s,border-color .2s}
.deal-cta:hover{color:var(--volt-hi);border-color:var(--volt-hi)}
.cta-chip.cta-primary{background:var(--white);color:var(--ink)}
.cta-chip.cta-primary .chip-note{color:var(--volt)}
.cta-chip.cta-primary:hover{background:var(--ink);color:var(--white)}
.cta-chip.cta-primary:hover .chip-note{color:var(--volt-hi)}
.pitch{margin-top:7vh}
.contact-direct{margin-top:10vh;padding:0}
.contact-direct+.contact-options{margin-top:22px}
.field[hidden]{display:none}

/* Showpiece: the first scroll fires a bullet through the headline and splits it. */
.slice{position:relative;margin:0 0 7vh}
.slice .slam-title{margin:0}
.slice-b{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.005em;font-synthesis:none}
.slice-b,.slice-cut,.slice-bullet,.slice-shards{display:none}
.motion-enabled .slice-b{display:block;position:absolute;left:0;right:0;top:0;visibility:hidden}
.motion-enabled .slice-cut,.motion-enabled .slice-bullet,.motion-enabled .slice-shards{display:block;position:absolute;inset:0;pointer-events:none;transform:rotate(-4deg);transform-origin:left bottom}
.slice.is-sliced .slice-b{visibility:visible}
.slice.is-sliced .slice-a{clip-path:polygon(-10% -60%,110% -60%,110% 78.6%,-10% 23.4%);transform:rotate(-4deg) translate3d(calc(var(--sep,0) * -5vw),calc(var(--sep,0) * -12vh),0) rotate(calc(var(--sep,0) * -3.5deg))}
.slice.is-sliced .slice-b{clip-path:polygon(-10% 23.4%,110% 78.6%,110% 160%,-10% 160%);transform:rotate(-4deg) translate3d(calc(var(--sep,0) * 6.5vw),calc(var(--sep,0) * 9vh),0) rotate(calc(var(--sep,0) * 3deg))}
.slice-cut{opacity:var(--cut-op,0)}
.slice-cut:before,.slice-cut:after{content:'';position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#000 calc(var(--cut,0) * 100%),transparent calc(var(--cut,0) * 100% + 6%));mask-image:linear-gradient(90deg,#000 calc(var(--cut,0) * 100%),transparent calc(var(--cut,0) * 100% + 6%))}
.slice-cut:before{background:linear-gradient(90deg,transparent,rgba(90,136,255,.55) 20%,rgba(90,136,255,.55) 80%,transparent);clip-path:polygon(-10% 20.6%,110% 75.8%,110% 81.4%,-10% 26.2%)}
.slice-cut:after{background:linear-gradient(90deg,transparent,#fff 12%,#fff 85%,transparent);clip-path:polygon(-10% 22.8%,110% 78%,110% 79.2%,-10% 24%)}
.slice-bullet:before{content:'';position:absolute;left:0;top:0;width:26%;height:8px;margin-top:-4px;border-radius:0 8px 8px 0;background:linear-gradient(90deg,transparent,rgba(90,136,255,.75) 55%,#fff);box-shadow:0 0 26px 6px rgba(43,99,255,.75);transform-origin:right center;transform:translate(calc(var(--bx,0px) - 100%),var(--by,0px)) rotate(var(--ba,0deg));opacity:var(--b-op,0)}
.slice-shard{position:absolute;left:var(--x);top:var(--y);width:var(--s,14px);height:calc(var(--s,14px) * .7);background:var(--c,var(--volt-hi));clip-path:polygon(0 0,100% 30%,30% 100%);transform:translate(-50%,-50%) translate3d(var(--dx,0px),var(--dy,0px),0) rotate(var(--dr,0deg));opacity:var(--o,0)}
.hero.slice-hit .hero-inner{animation:slice-hit .38s linear}
@keyframes slice-hit{0%,100%{transform:none}12%{transform:translate(-12px,8px)}30%{transform:translate(9px,-6px)}50%{transform:translate(-5px,3px)}72%{transform:translate(2px,-1px)}}
@media(max-width:760px){.slice{margin-bottom:5vh}}

/* Reduced motion: everything visible, nothing pinned, no idle drift. */
.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.reduced-motion .hero-wall{opacity:.4}
.reduced-motion .hero-streak{display:none}
.reduced-motion .games-track{flex-wrap:wrap;overflow:visible;scroll-snap-type:none}
.reduced-motion .game-card{width:calc(50% - 2vw)}
.reduced-motion .catalog-grid .game-card{width:auto}
.reduced-motion .break-corner{display:none}
@media(max-width:760px){.reduced-motion .game-card{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Scroll scenes. Every value defaults to the finished state, so without JS or
   with motion off everything simply sits in place. */
.pop.pop{transform:translate3d(0,var(--py,0px),0) skewY(var(--pk,0deg));transform-origin:left bottom;text-shadow:calc(var(--pd,1) * .05em) calc(var(--pd,1) * .05em) 0 var(--volt)}
.featured-stats li{transform:translate3d(var(--sx,0px),0,0);opacity:var(--so,1)}
.xpost{transform:translate3d(var(--xx,0px),var(--xy,0px),0) rotate(calc(2.5deg + var(--xr,0deg)))}
.brand-list li{clip-path:inset(-20% calc(var(--bw,0) * 100%) -20% -2%)}
.partner-grid>li{transform:translate3d(0,var(--ry,0px),0) rotate(var(--rr,0deg));opacity:var(--ro,1)}
.partner-grid .partner-logo{transform:scale(var(--ls,1))}
.team-member{transform:perspective(1100px) translate3d(0,var(--ty,0px),0) rotateY(var(--fy,0deg));transform-origin:50% 35%;opacity:var(--to,1)}
.hiring{transform:translate3d(var(--hx,0px),0,0) skewX(var(--hk,0deg));background-position:var(--hb,0px) 0}
.cta-word{transform:translate3d(var(--wx,0px),0,0) skewX(var(--wk,0deg))}
.cta-mark{transform:rotate(calc(8deg + var(--mr,0deg))) scale(var(--ms,1))}
.cta-links{transform:translate3d(0,var(--ly,0px),0);opacity:var(--lo,1)}
.catalog-grid .game-card{transform:translate3d(0,var(--cy,0px),0) rotate(var(--cr,0deg));opacity:var(--co,1);transform-origin:50% 100%}
.motion-enabled .xpost{transition:box-shadow .6s var(--snap)}
.motion-enabled .xpost:hover{transform:translate3d(var(--xx,0px),calc(var(--xy,0px) - 6px),0) rotate(var(--xr,0deg))}
.motion-enabled .cta-word{transition:color .3s,text-shadow .3s}
.motion-enabled .cta-big:hover .cta-word:first-child{transform:translate3d(calc(var(--wx,0px) - 1.5vw),0,0) skewX(calc(var(--wk,0deg) - 6deg))}
.motion-enabled .cta-big:hover .cta-word:last-child{transform:translate3d(calc(var(--wx,0px) + 2vw),0,0) skewX(calc(var(--wk,0deg) - 6deg))}