:root{--yellow:#ffd018;--ink:#101110;--paper:#f0efeb}
:root:has(.page){font-family:'Barlow Condensed',sans-serif;color:var(--paper);background:#efefec;font-synthesis:none}
/* The app's Tailwind reset loads on every page. Restore the browser defaults this design was
   built on; the rules below override them exactly as before (same specificity, later order). */
:where(.page) p{margin-block:1em}
:where(.page) :is(ul,ol){margin-block:1em;padding-inline-start:40px}
:where(.page) ul{list-style:disc}
:where(.page) ol{list-style:decimal}
:where(.page) h3{font-size:1.17em;margin-block:1em}
:where(.page) :is(h1,h2,h3,h4){text-wrap:wrap}
:where(.page) :is(img,video,iframe,canvas){display:inline;vertical-align:baseline}
/* The app body sets its own font and line height; the landing page keeps the original type. */
.page{font-family:'Barlow Condensed',sans-serif;color:var(--paper);font-synthesis:none;line-height:normal}
:where(.page) *{box-sizing:border-box}html:has(.page){scroll-behavior:smooth}body:has(.page){margin:0;padding:16px}:where(.page) a{color:inherit;text-decoration:none}:where(.page) svg{display:block;width:100%;height:100%}:where(.page) .symbols{position:absolute;width:0;height:0;overflow:hidden}.page{isolation:isolate;position:relative;overflow:hidden;max-width:1600px;margin:auto;min-height:1100px;border-radius:10px;background:#0b0d0c;box-shadow:0 0 0 1px #343531}.page:before{content:"";position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(5,7,6,.35),transparent 63%),linear-gradient(0deg,#0b0d0c 1%,transparent 36%)}.page:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:5;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.65' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}:where(.page) .header{height:275px;display:flex;align-items:flex-start;padding:30px 5% 0;gap:50px}:where(.page) .brand{display:block;position:relative;flex:none;width:205px;height:205px;overflow:hidden;border-radius:50%;transform:rotate(-4deg)}:where(.page) .brand img{position:absolute;width:133.7%;height:auto;max-width:none;left:-17%;top:-46.4%}:where(.page) .nav{display:flex;align-items:center;justify-content:space-between;gap:34px;flex:1;margin-top:21px;margin-left:auto;padding-left:12%;font-size:21px;font-weight:600;text-transform:uppercase}:where(.page) .nav a{position:relative;white-space:nowrap;padding:0 0 17px;transition:color .2s}:where(.page) .nav a:hover,:where(.page) .nav .active{color:var(--yellow)}:where(.page) .nav .active:after{content:"";position:absolute;width:38px;height:3px;bottom:0;left:50%;transform:translateX(-50%);background:var(--yellow)}:where(.page) .socials{display:flex;gap:26px;margin-top:22px}:where(.page) .socials a{width:25px;height:25px}:where(.page) .socials svg{fill:none;stroke:currentColor;stroke-width:2}:where(.page) .socials a:hover{color:var(--yellow)}:where(.page) main{padding:0 4.7%}:where(.page) .hero{padding:13px 16px 37px}:where(.page) .eyebrow{color:var(--yellow);text-transform:uppercase;font-size:25px;font-weight:700;font-style:italic;letter-spacing:1.3px;margin:0 0 8px}:where(.page) h1{font-size:clamp(76px,7.8vw,120px);line-height:.91;letter-spacing:-1.8px;text-transform:uppercase;font-weight:800;font-style:italic;margin:0 0 25px;filter:drop-shadow(0 2px 2px #0003)}:where(.page) h1>span{color:var(--yellow)}:where(.page) .period{color:#e0dfda}:where(.page) .intro{font-size:24px;line-height:1.4;margin:0;max-width:520px;color:#e1e0dc}:where(.page) .coming{display:flex;align-items:center;gap:18px;margin:28px 0 0;color:var(--yellow);text-transform:uppercase;letter-spacing:1px;font-style:italic;font-size:26px;font-weight:700}:where(.page) .coming span{font-size:36px;font-style:normal;font-weight:400;line-height:1;transform:scaleX(1.3)}:where(.page) .actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}:where(.page) .action{min-height:248px;border:5px solid transparent;border-radius:9px;padding:39px 26px;display:flex;gap:25px;position:relative;isolation:isolate;transition:transform .2s ease,box-shadow .2s ease}:where(.page) .action:before{content:"";position:absolute;inset:2px;z-index:-1;border:1px solid currentColor;opacity:.35;border-radius:4px}:where(.page) .action:hover{transform:translateY(-5px);box-shadow:0 10px 30px #0005}:where(.page) .action-yellow{color:var(--ink);background:var(--yellow);border-color:#e9c22b}:where(.page) .action-white{color:var(--ink);background:#e9e9e7;border-color:#c4c5c2}:where(.page) .action-dark{color:var(--paper);background:#101211eF;border-color:#252720}:where(.page) .action-dark:before{color:var(--yellow);opacity:.55}:where(.page) .action-icon{width:101px;height:101px;flex:none}:where(.page) .action-dark .action-icon{color:var(--yellow)}:where(.page) .action-copy{position:relative;z-index:1}:where(.page) h2{font-style:italic;text-transform:uppercase;font-weight:800;font-size:36px;line-height:1.07;margin:3px 0 24px;letter-spacing:-.5px}:where(.page) .action h2 span{font-size:30px}:where(.page) .action p{font-size:20px;line-height:1.3;margin:0}:where(.page) .number{position:absolute;top:0;right:19px;font-size:116px;line-height:1;font-style:italic;font-weight:800;opacity:.07}:where(.page) .arrow{position:absolute;right:16px;bottom:17px;border-radius:50%;width:51px;height:51px;padding:12px;background:var(--ink);color:var(--paper)}:where(.page) .action-yellow .arrow{color:var(--yellow)}:where(.page) .action-dark .arrow{background:var(--yellow);color:var(--ink)}:where(.page) .arrow svg{fill:none;stroke:currentColor;stroke-width:2}:where(.page) .features{list-style:none;display:flex;justify-content:space-between;gap:26px;padding:0 7.5%;margin:51px 0 42px}:where(.page) .features li{display:flex;align-items:center;gap:17px;font-weight:600;font-size:17px;line-height:1.2;text-transform:uppercase}:where(.page) .features svg{height:37px;width:37px;flex:none;fill:none;stroke:var(--yellow);stroke-width:2.7;stroke-linecap:round;stroke-linejoin:round}:where(.page) .one-v-one{border-radius:50%;background:var(--yellow);color:var(--ink);font-size:22px;width:35px;height:35px;display:grid;place-items:center}:where(.page) .detail{display:none;scroll-margin:30px;border-top:1px solid #ffd01866;padding:38px 16px 48px;max-width:850px}:where(.page) .detail:target{display:block}:where(.page) .detail h2{font-size:40px;margin:12px 0}:where(.page) .detail p:not(.eyebrow){font-size:23px;line-height:1.4;max-width:680px}:where(.page) .detail a{display:inline-block;color:var(--yellow);font-size:21px;padding:10px 0;text-decoration:underline;text-underline-offset:5px}:where(.page) :focus-visible{outline:3px solid var(--yellow);outline-offset:6px}:where(.page) .action-yellow:focus-visible,:where(.page) .action-white:focus-visible{outline-color:#faf9ef}:where(.page) .skip-link{position:fixed;left:25px;top:-100px;z-index:10;background:var(--yellow);color:var(--ink);padding:12px 20px;font-size:20px}:where(.page) .skip-link:focus{top:20px}
@media(min-width:1500px){:where(.page) .header{height:290px}:where(.page) .hero{padding-top:20px;padding-bottom:44px}.page{min-height:1160px}}
@media(max-width:1250px){:where(.page) .header{gap:25px;height:245px}:where(.page) .brand{width:175px;height:175px}:where(.page) .nav{padding-left:3%;gap:22px;font-size:19px}:where(.page) .socials{gap:18px}:where(.page) .action{gap:18px;padding:30px 20px;min-height:225px}:where(.page) .action-icon{width:78px;height:78px}:where(.page) h2{font-size:32px}:where(.page) .action h2 span{font-size:25px}:where(.page) .action p{font-size:18px}:where(.page) .arrow{width:44px;height:44px;padding:10px}:where(.page) .features{padding:0 4%}.page{min-height:990px}:where(.page) .intro{font-size:22px}}
@media(max-width:1000px){body:has(.page){padding:10px}:where(.page) .header{height:210px;gap:20px}:where(.page) .brand{width:145px;height:145px}:where(.page) .nav{gap:16px;padding-left:0;font-size:18px}:where(.page) .socials{gap:13px}:where(.page) .socials a{width:21px;height:21px}:where(.page) .hero{padding-left:0}:where(.page) .actions{gap:15px}:where(.page) .action{padding:28px 18px;gap:13px;min-height:220px}:where(.page) .action-icon{width:57px;height:57px}:where(.page) h2{font-size:29px}:where(.page) .action h2 span{font-size:23px}:where(.page) .action p{font-size:18px}:where(.page) .features{padding:0;gap:18px}:where(.page) .features li{font-size:15px;gap:10px}.page{min-height:900px}}
@media(max-width:760px){body:has(.page){padding:8px}.page{border-radius:7px;min-height:100vh}.page:before{background:linear-gradient(0deg,#0b0d0c 0%,transparent 32%),linear-gradient(90deg,#0b0d0c88,transparent);background-size:auto,auto}:where(.page) .header{height:auto;min-height:205px;padding:22px 6% 0;display:grid;grid-template-columns:1fr auto;gap:20px}:where(.page) .brand{width:116px;height:116px}:where(.page) .socials{margin-top:15px;gap:22px}:where(.page) .socials a{width:24px;height:24px}:where(.page) .nav{grid-row:2;grid-column:1/-1;margin:0;gap:13px;justify-content:space-between;font-size:17px;overflow-x:auto}:where(.page) .nav a{padding-bottom:12px}:where(.page) .nav .active:after{width:25px;height:2px}:where(.page) main{padding:0 5%}:where(.page) .hero{padding:40px 0 35px;min-height:455px}:where(.page) .eyebrow{font-size:21px}:where(.page) h1{font-size:clamp(67px,12.5vw,93px);letter-spacing:-1px;margin-bottom:24px}:where(.page) .intro{font-size:21px;max-width:340px;text-shadow:0 1px 4px #000}:where(.page) .desktop-break{display:none}:where(.page) .coming{font-size:23px;margin-top:24px}:where(.page) .actions{grid-template-columns:1fr;gap:17px}:where(.page) .action{min-height:194px;padding:30px 25px;gap:26px}:where(.page) .action-icon{width:83px;height:83px}:where(.page) .action-copy h2{font-size:34px;margin:0 0 15px}:where(.page) .action h2 span{font-size:28px}:where(.page) .action p{font-size:20px}:where(.page) .number{font-size:105px;right:22px}:where(.page) .arrow{right:20px;bottom:20px;width:46px;height:46px}:where(.page) .features{display:grid;grid-template-columns:repeat(2,1fr);gap:26px 22px;margin:35px 12px}:where(.page) .features li{font-size:17px;gap:15px}:where(.page) .features li:last-child{grid-column:1/-1}:where(.page) .detail{padding-left:0;padding-right:0}:where(.page) .detail h2{font-size:34px}}
@media(prefers-reduced-motion:reduce){html:has(.page){scroll-behavior:auto}:where(.page) .action,:where(.page) .nav a{transition:none}}
/* Keep the card text clear of the arrow on small screens. */
@media(max-width:760px){:where(.page) .action{padding:28px 22px 74px;gap:18px}:where(.page) .action-icon{width:70px;height:70px}:where(.page) .action-copy{min-width:0}:where(.page) .action-copy h2{font-size:32px}:where(.page) .action h2 span{font-size:26px}:where(.page) .action-dark h2{white-space:nowrap}.page:before{background-image:linear-gradient(0deg,#0b0d0c 0%,transparent 32%),linear-gradient(90deg,#0b0d0cb3,#0b0d0c15)}}
@media(min-width:761px){.page:before{background-image:linear-gradient(90deg,rgba(5,7,6,.72),transparent 66%),linear-gradient(0deg,#0b0d0c 1%,transparent 36%)}}
@media(max-width:380px){:where(.page) .action{padding-left:18px;padding-right:18px;gap:14px}:where(.page) .action-icon{width:55px;height:55px}:where(.page) .action-copy h2{font-size:28px}:where(.page) .action h2 span{font-size:23px}:where(.page) .action p{font-size:18px}:where(.page) .nav{gap:10px;font-size:15px}}

/* Detail views use the same bold type and yellow rules as the landing view. */
:where(.page) .detail-wide{max-width:940px}
:where(.page) .video-wrap{position:relative;isolation:isolate;width:100%;aspect-ratio:16/9;margin:24px 0 12px;background:#181b18;border:1px solid #ffd01880;border-radius:18px}
:where(.page) .video-wrap iframe{display:block;width:100%;height:100%;border:0;border-radius:17px}
:where(.page) .video-wrap:before,:where(.page) .video-wrap:after{content:"";position:absolute;z-index:-1;top:43%;width:clamp(75px,10vw,160px);height:30px;background:linear-gradient(90deg,transparent 0%,#ffd018 62%,#fff2a6 100%);clip-path:polygon(0 55%,17% 43%,34% 63%,53% 23%,70% 53%,86% 33%,100% 48%,100% 63%,86% 47%,70% 70%,53% 39%,34% 78%,17% 56%,0 67%);filter:drop-shadow(0 0 5px #fff2a6) drop-shadow(0 0 12px #ffd018) drop-shadow(0 0 26px #ffd018);pointer-events:none}
:where(.page) .video-wrap:before{right:100%}:where(.page) .video-wrap:after{left:100%;transform:scaleX(-1)}
:where(.page) .detail .social-list{display:flex;flex-wrap:wrap;gap:8px 28px;margin:20px 0 14px}
:where(.page) .detail .social-list a{font-size:26px;font-weight:700;text-transform:uppercase}
:where(.page) .detail>a+a{margin-left:24px}
:where(.page) .socials a{display:grid;place-items:center;min-width:25px;min-height:25px}
:where(.page) .clips-heading{margin:34px 0 18px;font-size:30px;font-style:italic;font-weight:800;text-transform:uppercase}
:where(.page) .clip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0 0 26px}
:where(.page) .clip-video{aspect-ratio:9/16;background:#181b18;border:1px solid #ffd01880;border-radius:14px;overflow:hidden}
:where(.page) .clip-video iframe{display:block;width:100%;height:100%;border:0}
:where(.page) .clip h4{font-size:24px;line-height:1.1;text-transform:uppercase;font-style:italic;margin:12px 0 2px}
:where(.page) .detail .clip a{font-size:18px}
@media(max-width:760px){:where(.page) .socials a{min-width:44px;min-height:44px}:where(.page) .detail .social-list{display:grid;gap:4px}:where(.page) .detail>a+a{margin-left:0;display:block}}
@media(max-width:600px){:where(.page) .clip-grid{grid-template-columns:1fr;max-width:290px;gap:32px}:where(.page) .clips-heading{font-size:27px}}

/* Fill the browser and size the desktop composition to its available height. */
:root:has(.page){background:var(--ink)}
body:has(.page){padding:0}
.page{width:100%;max-width:none;min-height:100svh;margin:0;border-radius:0;box-shadow:none}
@media(min-width:761px){
  .page{--header-height:clamp(110px,20svh,230px)}
  :where(.page) .header{height:var(--header-height);padding-top:clamp(18px,3svh,30px)}
  :where(.page) .brand{width:clamp(90px,16svh,190px);height:clamp(90px,16svh,190px)}
  :where(.page) .landing-surface{min-height:calc(100svh - var(--header-height));display:grid;grid-template-rows:minmax(min-content,1fr) auto auto auto}
  :where(.page) .hero{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:12px 16px 22px}
  :where(.page) .eyebrow{font-size:clamp(20px,2.6svh,25px);margin-bottom:8px}
  :where(.page) h1{font-size:clamp(64px,min(7.8vw,11svh),120px);margin-bottom:clamp(14px,2svh,25px)}
  :where(.page) .intro{font-size:clamp(19px,2.5svh,24px);line-height:1.35}
  :where(.page) .coming{margin-top:clamp(14px,2.4svh,28px);font-size:clamp(21px,2.7svh,26px)}
  :where(.page) .coming span{font-size:30px}
  :where(.page) .action{min-height:clamp(180px,23svh,248px);padding:clamp(23px,3.5svh,39px) clamp(18px,1.8vw,26px);gap:clamp(13px,1.7vw,25px)}
  :where(.page) .action-icon{width:clamp(57px,min(7vw,10svh),101px);height:clamp(57px,min(7vw,10svh),101px)}
  :where(.page) .action h2{font-size:clamp(27px,min(2.5vw,3.8svh),36px);margin-top:0;margin-bottom:clamp(12px,2svh,24px)}
  :where(.page) .action h2 span{font-size:clamp(22px,min(2.1vw,3.2svh),30px)}
  :where(.page) .action p{font-size:clamp(17px,2.1svh,20px)}
  :where(.page) .arrow{width:clamp(38px,5.4svh,51px);height:clamp(38px,5.4svh,51px);padding:10px;right:14px;bottom:14px}
  :where(.page) .features{min-height:clamp(58px,8svh,90px);align-items:center;margin:0;padding-top:12px;padding-bottom:12px}
  :where(.page) .features li{font-size:clamp(15px,1.8svh,17px)}
  :where(.page) .features svg{width:clamp(29px,3.9svh,37px);height:clamp(29px,3.9svh,37px)}
  :where(.page) .details{display:none}
  :where(.page) .details:has(.detail:target){display:block}
}
@media(min-width:761px) and (max-height:750px){
  .page{--header-height:clamp(96px,16svh,120px)}
  :where(.page) .brand{width:clamp(78px,13svh,98px);height:clamp(78px,13svh,98px)}
  :where(.page) .hero{padding-top:8px;padding-bottom:14px}
  :where(.page) h1{margin-bottom:12px}
  :where(.page) .coming{margin-top:12px}
}

/* Keep the photo and grain on the first screen. Detail sections sit on black. */
.page:before,.page:after{bottom:auto;height:100svh}
:where(.page) .details{position:relative;z-index:6;margin-inline:-5.19%;padding-inline:5.19%;background:radial-gradient(ellipse 28rem 20rem at 104% 12%,#ffd0181c,transparent 75%),radial-gradient(ellipse 22rem 22rem at -4% 90%,#ffd01812,transparent 75%),#050505}
:where(.page) .detail-wide{margin-inline:auto}
:where(.page) .detail:focus-visible{outline:0;border-top-color:var(--yellow)}
@media(max-width:760px){:where(.page) .details{margin-inline:-5.56%;padding-inline:5.56%}}

/* The landing story follows the first screen without crowding the hero. */
:where(.page) .mission{position:relative;z-index:6;margin-inline:-5.19%;padding:clamp(76px,8vw,130px) 5% 0;background:#060806;border-top:1px solid #ffd01855;overflow:hidden}
.page:has(.detail:target) .mission{display:none}
:where(.page) .mission:before{content:"";position:absolute;right:-8%;top:5%;width:40%;height:360px;transform:rotate(-17deg);background:linear-gradient(90deg,transparent,#ffd01812 47%,#ffd01828 50%,transparent 53%);pointer-events:none}
:where(.page) .mission-head{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);align-items:end;gap:clamp(30px,6vw,100px);padding-bottom:clamp(70px,7vw,110px)}
:where(.page) .mission-head h2{margin:18px 0 0;font-size:clamp(64px,7.6vw,126px);line-height:.85;letter-spacing:-.035em;font-style:italic;font-weight:800;text-transform:uppercase}:where(.page) .mission-head h2 span{color:var(--yellow)}
:where(.page) .mission-head>p{max-width:490px;margin:0 0 5px;padding-left:25px;border-left:3px solid var(--yellow);font-size:clamp(24px,2.4vw,31px);line-height:1.28;color:#e3e4dd}
:where(.page) .mission-formats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,6vw,95px);padding:0 0 clamp(90px,9vw,150px)}
:where(.page) .mission-formats article{position:relative;padding-top:20px;border-top:2px solid #ffd01899}:where(.page) .format-number{display:block;color:var(--yellow);font-size:20px;font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.05em}
:where(.page) .mission-formats h3{font-size:clamp(43px,4vw,68px);line-height:.92;font-weight:800;font-style:italic;text-transform:uppercase;margin:24px 0 16px}:where(.page) .mission-formats p{max-width:480px;margin:0;color:#c9ccc5;font-size:24px;line-height:1.3}
:where(.page) .mission-world{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,110px);margin-inline:-5.56%;padding:clamp(60px,7vw,105px) 5.56%;background:var(--yellow);color:var(--ink);overflow:hidden}
:where(.page) .mission-world>*{position:relative;z-index:1}
:where(.page) .mission-world>.mission-ball{position:absolute;z-index:0;color:var(--ink);pointer-events:none}
:where(.page) .mission-ball-large{width:min(48vw,590px);height:min(48vw,590px);right:-90px;top:-170px;opacity:.13;transform:rotate(18deg)}
:where(.page) .mission-ball-small{width:190px;height:190px;left:-72px;bottom:-80px;opacity:.1;transform:rotate(-22deg)}
:where(.page) .mission-world-label{margin:0 0 20px;font-size:22px;letter-spacing:.08em;text-transform:uppercase;font-style:italic;font-weight:700}:where(.page) .mission-world h3{font-size:clamp(60px,6.8vw,110px);line-height:.84;letter-spacing:-.03em;font-style:italic;font-weight:800;text-transform:uppercase;margin:0}
:where(.page) .mission-world>div>p:not(.mission-world-label){max-width:560px;font-size:clamp(24px,2.5vw,32px);line-height:1.22;margin:0 0 20px}:where(.page) .mission-world .mission-join{font-weight:800;font-style:italic;text-transform:uppercase}
:where(.page) .mission-links{display:flex;flex-wrap:wrap;align-items:center;gap:15px 28px;margin-top:30px}:where(.page) .mission-links a{font-size:20px;font-weight:700;text-transform:uppercase}:where(.page) .mission-links a:first-child{display:inline-flex;align-items:center;gap:20px;padding:16px 20px;border-radius:3px;background:var(--ink);color:var(--paper);transition:transform .2s cubic-bezier(.25,1,.5,1)}:where(.page) .mission-links a:first-child:hover{transform:translateY(-3px)}:where(.page) .mission-links svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2}:where(.page) .mission-links a:last-child{text-decoration:underline;text-underline-offset:6px}:where(.page) .mission-links a:focus-visible{outline-color:var(--ink)}
:where(.page) .coming:hover{color:#ffe66e}
@media(max-width:900px){:where(.page) .mission-head{grid-template-columns:1fr;gap:32px}:where(.page) .mission-head>p{max-width:680px}:where(.page) .mission-world{grid-template-columns:1fr;gap:45px}}
@media(max-width:760px){:where(.page) .mission{margin-inline:-5.56%;padding:74px 5% 0}}
@media(max-width:600px){:where(.page) .mission-head h2{font-size:clamp(52px,12vw,75px)}:where(.page) .mission-head>p{font-size:24px}:where(.page) .mission-formats{grid-template-columns:1fr;gap:45px;padding-bottom:75px}:where(.page) .mission-formats h3{font-size:48px}:where(.page) .mission-formats p{font-size:22px}:where(.page) .mission-world{padding:65px 5.56%}:where(.page) .mission-world h3{font-size:clamp(55px,13vw,78px)}:where(.page) .mission-world>div>p:not(.mission-world-label){font-size:24px}:where(.page) .mission-links{flex-direction:column;align-items:flex-start}}
@media(max-width:600px){:where(.page) .mission-ball-large{width:430px;height:430px;right:-225px;top:22%;opacity:.1}:where(.page) .mission-ball-small{width:145px;height:145px;left:-55px;bottom:-60px}}

/* A playable goal gives the second screen a clear Street FC identity. */
:where(.page) .site-footer{position:relative;z-index:6;overflow:hidden;background:#080a08;border-top:1px solid #ffd01866}
:where(.page) .footer-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);align-items:center;gap:clamp(35px,6vw,95px);min-height:480px;padding:clamp(62px,7vw,105px) 5%;background:radial-gradient(circle at 76% 50%,#ffd01819,transparent 35%),linear-gradient(135deg,#10140f,#070907 70%)}
:where(.page) .footer-hero:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.24;background:repeating-linear-gradient(100deg,transparent 0 80px,#d6d8c609 81px 82px,transparent 83px 160px)}
:where(.page) .footer-hero-copy{position:relative;z-index:1}:where(.page) .footer-hero h2{font-size:clamp(66px,9vw,142px);line-height:.83;letter-spacing:-.04em;margin:15px 0 30px;font-style:italic;font-weight:800;text-transform:uppercase;white-space:nowrap}:where(.page) .footer-hero h2 span{color:var(--yellow)}
:where(.page) .footer-hero-copy>p:not(.eyebrow){max-width:560px;font-size:clamp(21px,2.3vw,28px);line-height:1.3;margin:0 0 30px}
:where(.page) .footer-hero-links{display:flex;align-items:center;flex-wrap:wrap;gap:18px 30px}:where(.page) .footer-hero-links a{font-size:21px;font-weight:700;text-transform:uppercase}:where(.page) .footer-primary{display:inline-flex;align-items:center;gap:26px;padding:17px 20px;background:var(--yellow);color:var(--ink);border-radius:3px;transition:transform .2s ease,background .2s ease}:where(.page) .footer-primary:hover{transform:translateY(-3px);background:#ffe05a}:where(.page) .footer-primary svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2}:where(.page) .footer-secondary{text-decoration:underline;text-underline-offset:6px}:where(.page) .footer-secondary:hover{color:var(--yellow)}
:where(.page) .goal-cheer{position:absolute;z-index:4;top:16%;left:50%;color:var(--yellow);font-size:clamp(65px,7vw,110px);font-weight:800;font-style:italic;text-transform:uppercase;text-shadow:0 5px 0 #050505,0 0 30px #ffd01888;opacity:0;transform:translate(-50%,15px) rotate(-8deg);pointer-events:none}
:where(.page) .goal-scene.is-shooting .goal-cheer{animation:goal-flash .65s .73s cubic-bezier(.22,1,.36,1) both}
@keyframes goal-flash{0%{opacity:0;transform:translate(-50%,15px) rotate(-8deg) scale(.8)}35%,80%{opacity:1;transform:translate(-50%,0) rotate(-8deg) scale(1)}100%{opacity:0;transform:translate(-50%,-12px) rotate(-8deg) scale(1.05)}}
:where(.page) .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:where(.page) .footer-main{display:grid;grid-template-columns:minmax(0,2fr) repeat(2,minmax(170px,1fr));gap:clamp(30px,5vw,90px);padding:60px 5% 70px;border-top:1px solid #ffffff24}:where(.page) .footer-logo{font-size:clamp(32px,3vw,45px);line-height:1;margin:0 0 20px;font-weight:800;font-style:italic;text-transform:uppercase}:where(.page) .footer-logo span{color:var(--yellow)}:where(.page) .footer-about>p:last-child{font-size:21px;line-height:1.35;max-width:440px;margin:0;color:#c6c8c2}:where(.page) .footer-nav{display:flex;flex-direction:column;align-items:flex-start;gap:13px}:where(.page) .footer-nav h3{margin:0 0 9px;color:var(--yellow);font-size:20px;letter-spacing:.05em;text-transform:uppercase}:where(.page) .footer-nav a{font-size:20px;line-height:1.15}:where(.page) .footer-nav a:hover{color:var(--yellow);text-decoration:underline;text-underline-offset:5px}
:where(.page) .footer-main{position:relative;isolation:isolate;overflow:hidden}:where(.page) .footer-main>div,:where(.page) .footer-main>nav{position:relative;z-index:1}
:where(.page) .footer-main>.footer-ball{position:absolute;z-index:0;color:var(--yellow);pointer-events:none}
:where(.page) .footer-ball-left{width:255px;height:255px;left:-65px;bottom:-100px;opacity:.08;transform:rotate(-14deg)}
:where(.page) .footer-ball-right{width:160px;height:160px;right:4%;top:-42px;opacity:.1;transform:rotate(25deg)}
:where(.page) .footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 25px;padding:22px 5%;border-top:1px solid #ffffff24;color:#aeb2aa;font-size:16px;text-transform:uppercase;letter-spacing:.04em}:where(.page) .footer-bottom a{color:var(--paper)}:where(.page) .footer-bottom a:hover{color:var(--yellow)}
@media(max-width:900px){:where(.page) .footer-hero{grid-template-columns:minmax(0,1fr);min-height:450px}:where(.page) .footer-hero h2{font-size:clamp(64px,11vw,105px)}}
@media(max-width:600px){:where(.page) .footer-hero{padding:68px 5% 76px;min-height:480px}:where(.page) .footer-hero h2{font-size:clamp(56px,13vw,78px);white-space:normal}:where(.page) .footer-hero-copy>p:not(.eyebrow){font-size:22px}:where(.page) .footer-hero-links{align-items:flex-start;flex-direction:column}:where(.page) .footer-main{grid-template-columns:1fr;gap:36px;padding:50px 5% 60px}:where(.page) .footer-bottom{flex-direction:column}}
@media(prefers-reduced-motion:reduce){:where(.page) .footer-primary{transition:none}:where(.page) .goal-scene.is-shooting .goal-cheer{animation:none;opacity:1}}

/* ---- Plasma storm around the main video ---- */
:where(.page) .video-wrap{box-shadow:0 0 0 1px #ffd01833,0 0 40px #ffb00022}
:where(.page) .video-wrap.has-plasma:before,:where(.page) .video-wrap.has-plasma:after{display:none}
:where(.page) .plasma-canvas{position:absolute;z-index:-1;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;mix-blend-mode:screen}


/* ---- Footer court: vector pitch backdrop with a small, blended 3D scene ---- */
:where(.page) .goal-scene{position:relative;isolation:isolate;width:min(100%,640px);aspect-ratio:1.5;margin:auto;background:#070907;border-radius:22px;overflow:hidden;border:1px solid #ffd01844;box-shadow:0 20px 60px #000a}
:where(.page) .goal-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;touch-action:manipulation}
:where(.page) .goal-scene.no-webgl{min-height:220px}
:where(.page) .shoot-ball{position:absolute;z-index:3;left:50%;bottom:10px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:6px 16px 6px 8px;border:2px solid #fff3a0;border-radius:999px;background:var(--yellow);color:var(--ink);font:800 18px/1 'Barlow Condensed',sans-serif;font-style:italic;text-transform:uppercase;cursor:pointer;box-shadow:0 4px 0 #a57f0b,0 10px 22px #000a;transition:transform .2s cubic-bezier(.25,1,.5,1),opacity .2s}
:where(.page) .shoot-ball svg{width:28px;height:28px;flex:none}
:where(.page) .shoot-ball:hover{transform:translateX(-50%) translateY(-3px)}
:where(.page) .shoot-ball:active{transform:translateX(-50%) translateY(2px)}
:where(.page) .goal-scene.is-shooting .shoot-ball,:where(.page) .goal-scene.is-shooting .goal-prompt{opacity:0;pointer-events:none}
:where(.page) .goal-prompt{position:absolute;z-index:2;top:8px;left:0;right:0;text-align:center;pointer-events:none;color:#fff3c0;font-size:15px;font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.08em;text-shadow:0 2px 8px #000}
:where(.page) .goal-cheer{top:22%;font-size:clamp(56px,7vw,96px)}
:where(.page) .goal-cheer.pop{animation:goal-flash 1.1s cubic-bezier(.22,1,.36,1) both}
@media(max-width:600px){:where(.page) .goal-scene{width:min(100%,480px)}}

/* Living hero photo */
:where(.page) .media-stage{position:absolute;z-index:-3;top:0;left:0;right:0;height:var(--stage-h,100svh);pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
:where(.page) .media-stage svg{display:block;width:100%;height:100%}
.media-page .media-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b0d0ccc 0%,#0b0d0c66 30%,transparent 55%)}
:where(.page) .fx-lamps,:where(.page) .fx-flash{mix-blend-mode:screen}
:where(.page) .fx-lamp{animation:fx-lamp-a 9s infinite}
:where(.page) .fx-lamp-b{animation-name:fx-lamp-b;animation-duration:13s}
:where(.page) .fx-lamp-c{animation-name:fx-lamp-c;animation-duration:7s}
:where(.page) .fx-lamp-fail{animation-name:fx-lamp-fail;animation-duration:8s}
@keyframes fx-lamp-a{0%,100%{opacity:.95}45%{opacity:1}46%{opacity:.35}47%{opacity:1}48%{opacity:.5}49%{opacity:1}}
@keyframes fx-lamp-b{0%,100%{opacity:1}70%{opacity:.9}71%{opacity:.4}73%{opacity:1}}
@keyframes fx-lamp-c{0%,100%{opacity:.85}50%{opacity:1}}
@keyframes fx-lamp-fail{0%,55%,100%{opacity:1}56%{opacity:.1}58%{opacity:.8}60%{opacity:.05}63%{opacity:.9}64%{opacity:.2}68%{opacity:1}}
@media(prefers-reduced-motion:reduce){:where(.page) .fx-lamp{animation:none}}
/* Account entry stays in the header; social channels stay in the footer. */
:where(.page) .header-actions{margin-left:auto;display:flex;align-items:center;flex-shrink:0}
:where(.page) .header .account-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 18px;border-radius:3px;background:var(--yellow);color:var(--ink);font-size:20px;font-weight:700;white-space:nowrap;text-transform:uppercase}
:where(.page) .header .nav a{display:inline-flex;align-items:center;min-height:44px;padding-block:0;line-height:1}:where(.page) .header .account-link{line-height:1}
:where(.page) .header .account-link:hover{background:var(--paper)}
:where(.page) .header .account-link:focus-visible{outline:3px solid var(--paper);outline-offset:4px}
@media(min-width:761px){:where(.page) .header{gap:clamp(12px,1.5vw,24px)}:where(.page) .header .nav{justify-content:flex-end;gap:clamp(10px,1.2vw,20px);min-height:44px;margin-top:18px;padding-left:0}:where(.page) .header-actions{margin-left:0;padding-top:18px}}
@media(max-width:760px){:where(.page) .header-actions{grid-column:2;grid-row:1;padding-top:8px}:where(.page) .header .nav{min-width:0;width:100%;justify-content:flex-start;gap:clamp(10px,3vw,16px)}}
:where(.page) .footer-socials{display:flex;flex-wrap:wrap;gap:12px}
:where(.page) .footer-nav .footer-socials a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:8px;border:1px solid currentColor;border-radius:6px}
:where(.page) .footer-socials svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2}
:where(.page) .footer-nav .footer-socials a:hover{color:var(--yellow)}
:where(.page) .footer-nav .footer-socials a:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}

/* Match the app's .app-shell: content stays within 80rem and uses the same side gutter.
   Percent padding resolves against the full-width parent, so each full-bleed band keeps its background. */
.page{--gutter:max(clamp(1rem,4vw,3rem),calc((100% - 80rem) / 2 + clamp(1rem,4vw,3rem)))}
:where(.page) main{padding-inline:0}
:where(.page) .landing-surface,:where(.page) .details,:where(.page) .mission-head,:where(.page) .mission-formats,:where(.page) .mission-world,:where(.page) .footer-hero,:where(.page) .footer-main,:where(.page) .footer-bottom{padding-inline:var(--gutter)}
:where(.page) .details,:where(.page) .mission,:where(.page) .mission-world{margin-inline:0}
:where(.page) .mission{padding-inline:0}
:where(.page) .hero,:where(.page) .detail{padding-left:0;padding-right:0}
/* The shared site header overlays the top of the page (see .site-frame in app/globals.css). */
.page{padding-top:var(--site-header-h);--header-height:var(--site-header-h)}