/* ==========================================================
   ARENA LAYER — Wix brand look (metallic gold + chrome silver,
   crowns, stadium lights, sparks) with immersive interactions
   ========================================================== */
:root{
  --bg:#050505; --bg2:#0b0a08; --panel:#100e0a; --panel2:#17140e;
  --gold:#e2b04a; --gold-hi:#ffe39a; --gold-lo:#8a5d14;
  --line:rgba(226,176,74,.32); --line2:rgba(255,255,255,.07);
  --g-grad:linear-gradient(180deg,#fff6d2 0%,#ffd76e 22%,#e0a93a 48%,#9c6a18 62%,#f3c95e 80%,#fff0b8 100%);
  --s-grad:linear-gradient(180deg,#ffffff 0%,#dfe3ea 30%,#8e949d 52%,#c9ced6 70%,#f4f6f9 100%);
  --g-btn:linear-gradient(180deg,#fff0b5 0%,#f2c75a 30%,#d49a2c 62%,#a56f17 100%);
  --cut:12px;
  --chamfer:polygon(var(--cut) 0,calc(100% - var(--cut)) 0,100% var(--cut),100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,var(--cut) 100%,0 calc(100% - var(--cut)),0 var(--cut));
}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* textured black with gold bokeh */
body{background:
  radial-gradient(1200px 600px at 85% 8%,rgba(226,176,74,.07),transparent 60%),
  radial-gradient(900px 500px at 10% 45%,rgba(226,176,74,.05),transparent 60%),
  radial-gradient(1000px 600px at 70% 85%,rgba(226,176,74,.05),transparent 60%),var(--bg)}

/* ---------- metallic two-tone headings (like the logo) ---------- */
.h1,.h2,.h3,.hero__title .line:first-child .ch{background:var(--s-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.h1,.h2,.h3{filter:drop-shadow(0 3px 0 rgba(0,0,0,.65)) drop-shadow(0 10px 24px rgba(0,0,0,.5))}
.h1 em,.h2 em,.h3 em,.split.gold-text .ch,.hero__stats b,.cd__u b,.price b,.vs__x,.gate__title{
  background:var(--g-grad);background-size:100% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:none}
.h1 em,.h2 em{filter:drop-shadow(0 0 22px rgba(255,190,70,.28))}
.hero__title{filter:drop-shadow(0 4px 0 rgba(0,0,0,.7)) drop-shadow(0 18px 40px rgba(0,0,0,.6))}
.hero__title .line:last-child{filter:drop-shadow(0 0 30px rgba(255,186,60,.35))}
.h2{font-size:clamp(40px,5.8vw,76px)}

/* gold shine sweep across headings when revealed */
.sec__head .h2{position:relative}
.sec__head.is-in .h2 em{background-image:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.85) 50%,transparent 65%),var(--g-grad);background-size:250% 100%,100% 100%;background-repeat:no-repeat;animation:shine 2.4s .4s var(--ease) both}
@keyframes shine{from{background-position:180% 0,0 0}to{background-position:-80% 0,0 0}}

/* crown kicker */
.kicker{color:var(--gold-hi);letter-spacing:.34em;font-weight:800;font-size:11.5px;text-shadow:0 0 14px rgba(255,190,70,.35)}
.kicker::before{width:22px;height:16px;background:var(--g-grad);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M2 5l5 4 5-8 5 8 5-4-2 12H4z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M2 5l5 4 5-8 5 8 5-4-2 12H4z'/%3E%3C/svg%3E") center/contain no-repeat;filter:drop-shadow(0 0 6px rgba(255,190,70,.6))}
.center .kicker::after{content:none}
.crown{display:none}
/* logo-style divider under headings */
.sec__head::after{content:"";display:block;width:min(260px,60%);height:2px;margin-top:22px;background:linear-gradient(90deg,var(--gold),rgba(226,176,74,.0));box-shadow:0 0 12px rgba(255,190,70,.5)}
.sec__head.center::after,.center .sec__head::after{margin-inline:auto;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.sec__head--row::after{display:none}

/* ---------- buttons: metallic gold plates ---------- */
.btn{border-radius:0;clip-path:var(--chamfer);--cut:10px;letter-spacing:.16em;font-weight:800}
.btn--gold{background:var(--g-btn);color:#1a1002;text-shadow:0 1px 0 rgba(255,240,190,.6);box-shadow:none;filter:drop-shadow(0 10px 22px rgba(226,160,40,.35))}
.btn--gold:hover{filter:drop-shadow(0 12px 30px rgba(255,180,50,.6)) brightness(1.08)}
.btn--ghost{background:linear-gradient(#0b0906,#0b0906) padding-box,var(--g-btn) border-box;border:1.5px solid transparent;color:var(--gold-hi)}
.btn--ghost:hover{background:linear-gradient(#1b150a,#1b150a) padding-box,var(--g-btn) border-box;color:#fff}
.btn--tg{clip-path:var(--chamfer)}
.pill{border-radius:0;clip-path:var(--chamfer);--cut:6px}
.pill--gold{background:rgba(226,176,74,.14);color:var(--gold-hi)}
.chip{border-radius:0;clip-path:var(--chamfer);--cut:8px}
.chip.is-on{background:var(--g-btn);color:#1a1002;border-color:transparent}
.chip.is-on small{color:#5a3d0c}

/* ---------- gold-framed chamfered panels ---------- */
.way,.step,.drop,.ccard,.apick,.card-sum,.done,.cta-strip,.gate__box,.trust__i,.cd__u,.tape,.player{border-radius:0;clip-path:var(--chamfer)}
.way,.step,.drop,.ccard,.card-sum,.done,.gate__box,.cd__u{background-clip:padding-box;border:1px solid var(--line);box-shadow:inset 0 0 0 1px rgba(255,220,140,.05),inset 0 0 60px rgba(226,176,74,.06)}
.step{background:linear-gradient(180deg,#17130c,#0c0a07)}
.trust{border-radius:0;background:transparent;border:0;gap:14px}
.trust__i{background:linear-gradient(180deg,#15110b,#0b0907);border:1px solid var(--line)}
.trust__i svg{filter:drop-shadow(0 0 10px rgba(255,190,70,.5))}

/* corner ornaments + mouse spotlight */
.way::before,.fcard::before,.drop::before,.step::before,.ccard::before,.trust__i::before{content:"";position:absolute;inset:8px;z-index:3;pointer-events:none;
  background:
    radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,205,110,.16),transparent 60%),
    linear-gradient(var(--gold),var(--gold)) top left/26px 2px no-repeat,
    linear-gradient(var(--gold),var(--gold)) top left/2px 26px no-repeat,
    linear-gradient(var(--gold),var(--gold)) top right/26px 2px no-repeat,
    linear-gradient(var(--gold),var(--gold)) top right/2px 26px no-repeat,
    linear-gradient(var(--gold),var(--gold)) bottom left/26px 2px no-repeat,
    linear-gradient(var(--gold),var(--gold)) bottom left/2px 26px no-repeat,
    linear-gradient(var(--gold),var(--gold)) bottom right/26px 2px no-repeat,
    linear-gradient(var(--gold),var(--gold)) bottom right/2px 26px no-repeat;
  opacity:.55;transition:opacity .5s,inset .5s var(--ease)}
.trust__i{position:relative}
.way:hover::before,.fcard:hover::before,.drop:hover::before,.step:hover::before,.ccard:hover::before,.trust__i:hover::before{opacity:1;inset:12px}
.way:hover,.drop:hover,.ccard:hover,.step:hover{border-color:rgba(255,205,110,.8);box-shadow:inset 0 0 0 1px rgba(255,220,140,.15),inset 0 0 80px rgba(226,176,74,.12)}

/* ways */
.way__num{display:inline-block;padding:6px 10px;background:var(--g-btn);color:#1a1002;font:400 18px/1 var(--display);letter-spacing:.04em;clip-path:var(--chamfer);--cut:5px}
.way h3{background:var(--s-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 rgba(0,0,0,.7))}
.way--hero h3{background:var(--g-grad);-webkit-background-clip:text;background-clip:text}

/* steps — like the Wix "PASO" infographic */
.step{padding-top:86px}
.step__n{left:22px;right:auto;top:22px;font:400 46px/1 var(--display);color:#1a1002;-webkit-text-stroke:0;background:var(--g-btn);padding:6px 14px 4px;transform:skewX(-10deg);clip-path:none;filter:drop-shadow(0 6px 14px rgba(226,160,40,.35))}
.step__i{position:absolute;right:20px;top:24px;margin:0;border-radius:0;border-color:var(--line)}
.step h3{background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:25px}

/* ---------- fighter cards with gold name plaque ---------- */
.fcard{border-radius:0;clip-path:var(--chamfer);border:1.5px solid rgba(226,176,74,.45);background:#0d0b08}
.fcard img{filter:brightness(.92) contrast(1.05)}
.fcard::after{background:linear-gradient(180deg,transparent 50%,rgba(5,5,5,.85) 82%,#050505)}
.fcard__info{left:10px;right:10px;bottom:10px;text-align:center;padding:12px 8px 10px;background:linear-gradient(180deg,rgba(18,14,8,.92),rgba(8,7,5,.96));border:1px solid rgba(226,176,74,.6);clip-path:var(--chamfer);--cut:8px;transition:transform .5s var(--ease)}
.fcard__info::before{content:"";position:absolute;left:50%;top:-1px;width:40%;height:2px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--gold-hi),transparent)}
.fcard__name{background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:28px;letter-spacing:.04em;filter:drop-shadow(0 2px 0 rgba(0,0,0,.8))}
.fcard__tags{max-height:0;opacity:0;margin:0;transition:max-height .5s var(--ease),opacity .4s,margin .4s;color:#cbbf9f;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
.fcard:hover .fcard__tags{max-height:20px;opacity:1;margin-top:6px}
.fcard:hover{border-color:var(--gold-hi);box-shadow:none;transform:translateY(-6px);filter:drop-shadow(0 18px 30px rgba(226,160,40,.28))}
.badge{border-radius:0;clip-path:var(--chamfer);--cut:5px;top:14px;left:14px}
.badge--alpha{background:var(--g-btn);color:#1a1002;border:0}
.badge--beta{background:var(--s-grad);color:#15171a;border:0}
.badge--women{background:linear-gradient(180deg,#ffd0dc,#e07a96);color:#2a0710;border:0}
.fcard__go{border-radius:0;clip-path:var(--chamfer);--cut:6px;top:14px;right:14px}

/* builder picks */
.pick{border-radius:0;clip-path:var(--chamfer);--cut:9px;border:1.5px solid rgba(226,176,74,.25)}
.pick__n{text-align:center;background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pick.is-sel{border-color:var(--gold-hi)}
.pick__sel{border-radius:0;clip-path:var(--chamfer);--cut:5px}
.stepper li.is-now i{background:var(--g-btn)}
.stepper li i{border-radius:0;clip-path:var(--chamfer);--cut:5px}
.vs__f{border-radius:0;clip-path:var(--chamfer);--cut:8px}
.vs__x{font-size:38px;filter:drop-shadow(0 0 14px rgba(255,190,70,.5))}

/* drops */
.drop__play{background:var(--g-btn);color:#1a1002}
.drop__body h3{background:var(--s-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.price b{font-size:84px;filter:drop-shadow(0 0 20px rgba(255,190,70,.35))}

/* ---------- hero: stadium lights ---------- */
.beams{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;mix-blend-mode:screen}
.beams i{position:absolute;top:-20%;width:34vw;height:140%;transform-origin:50% 0;background:linear-gradient(180deg,rgba(255,214,130,.30),rgba(255,200,100,.08) 45%,transparent 75%);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);filter:blur(6px);opacity:.7;animation:beam 9s ease-in-out infinite alternate}
.beams i:nth-child(1){left:2%;animation-delay:-2s}
.beams i:nth-child(2){left:33%;opacity:.45;animation-duration:12s}
.beams i:nth-child(3){left:64%;animation-delay:-5s}
@keyframes beam{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
.hero__frame{display:none}
.hero__side{display:none}
.hero__stats{border-top:1px solid transparent;border-image:linear-gradient(90deg,transparent,var(--gold),transparent) 1}
.hero__stats b{filter:drop-shadow(0 0 16px rgba(255,190,70,.4))}

/* ticker: gold band */
.ticker{background:linear-gradient(180deg,#1a1309,#0b0905);border-block:1px solid rgba(226,176,74,.5);box-shadow:0 0 30px rgba(226,176,74,.12)}
.ticker__track span{color:var(--gold-hi);text-shadow:0 0 12px rgba(255,190,70,.3)}

/* countdown */
.cd__u{background:linear-gradient(180deg,#19140b,#0a0806)}
.cd__u b{filter:drop-shadow(0 0 12px rgba(255,190,70,.4))}

/* faq */
.faq summary::after{border-radius:0;clip-path:var(--chamfer);--cut:6px}
.faq details[open] summary{color:var(--gold-hi)}

/* header */
.hdr.is-solid{background:rgba(5,5,5,.85);border-color:rgba(226,176,74,.25)}
.hdr__nav a{letter-spacing:.14em;padding:10px 10px}
.hdr__nav a::after{left:10px;right:10px;height:2px;background:var(--g-btn);box-shadow:0 0 10px rgba(255,190,70,.6)}
.burger{border-radius:0;clip-path:var(--chamfer);--cut:7px}
.hdr__right{flex:none}
@media (max-width:1240px){.hdr__nav{display:none}.burger{display:block}}
.x{border-radius:0;clip-path:var(--chamfer);--cut:8px}

/* profile */
.profile h2{background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 rgba(0,0,0,.7))}
.tape b{color:var(--gold-hi)}

/* gate */
.gate__title{font-size:76px;filter:drop-shadow(0 0 24px rgba(255,190,70,.35))}

/* ---------- intro ---------- */
.intro{position:fixed;inset:0;z-index:180;display:none;pointer-events:none}
body.is-intro .intro{display:block}
.intro__curtain{position:absolute;left:0;right:0;height:50.5%;background:#030303;transition:transform 1.1s cubic-bezier(.77,0,.18,1)}
.intro__curtain--t{top:0}.intro__curtain--b{bottom:0}
.intro__c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:opacity .5s}
.intro__c img{width:min(340px,66vw);opacity:0;transform:scale(.85);filter:brightness(.3);animation:introLogo 1.5s .1s var(--ease) forwards}
.intro__line{width:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold-hi),transparent);box-shadow:0 0 14px rgba(255,190,70,.8);animation:introLine 1s .5s var(--ease) forwards}
.intro__tag{font:400 20px var(--display);letter-spacing:.4em;text-transform:uppercase;background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;animation:fadeUp .8s .9s var(--ease) forwards}
@keyframes introLogo{55%{filter:brightness(1.6) drop-shadow(0 0 40px rgba(255,190,70,.8))}to{opacity:1;transform:none;filter:brightness(1) drop-shadow(0 0 24px rgba(255,190,70,.35))}}
@keyframes introLine{to{width:min(360px,72vw)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
body.is-intro-out .intro__c{opacity:0}
body.is-intro-out .intro__curtain--t{transform:translateY(-101%)}
body.is-intro-out .intro__curtain--b{transform:translateY(101%)}

/* ---------- custom cursor (gold) ---------- */
.cur{position:fixed;left:0;top:0;z-index:250;pointer-events:none;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--gold-hi);box-shadow:0 0 10px rgba(255,190,70,.9);opacity:0;transition:opacity .3s}
.cur--ring{width:36px;height:36px;margin:-18px 0 0 -18px;background:none;box-shadow:none;border:1.5px solid rgba(255,214,120,.6);transition:opacity .3s,width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .3s}
body.has-cur .cur{opacity:1}
body.cur-hover .cur--ring{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(226,176,74,.12);border-color:var(--gold-hi)}
@media (hover:hover) and (pointer:fine){body.has-cur,body.has-cur a,body.has-cur button,body.has-cur .chip,body.has-cur label{cursor:none}}
body.has-cur input,body.has-cur textarea{cursor:text}

/* spark burst canvas */
.burst{position:fixed;inset:0;z-index:240;pointer-events:none;width:100%;height:100%}

/* parallax */
[data-parallax]{will-change:translate}
.phero__bg,.band__bg,.final__bg{inset:-8% 0}
.band .embers,.final .embers{z-index:1}
.band__inner,.final__inner{z-index:2}

@media (max-width:760px){
  .beams i{width:70vw}
  .step{padding-top:80px}
  .fcard__name{font-size:20px}
  .fcard__info{padding:8px 4px 7px}
  .price b{font-size:68px}
}

/* auto carousel */
.rail{scroll-snap-type:none;scroll-behavior:auto;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
@media (max-width:760px){.rail .fcard{flex-basis:62vw}}

/* sound toggle with equalizer */
.snd{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 14px;border:1px solid var(--line);background:rgba(10,8,5,.6);clip-path:var(--chamfer);--cut:7px;color:var(--gold-hi);font:800 10.5px var(--body);letter-spacing:.2em;text-transform:uppercase;transition:border-color .3s,background .3s}
.snd:hover{border-color:var(--gold-hi);background:rgba(226,176,74,.12)}
.snd__bars{display:flex;align-items:flex-end;gap:2px;height:16px}
.snd__bars i{width:3px;height:3px;background:var(--g-btn);box-shadow:0 0 6px rgba(255,190,70,.6);transition:height .3s}
.snd.is-on .snd__bars i{animation:eq 1s ease-in-out infinite}
.snd.is-on .snd__bars i:nth-child(2){animation-delay:-.4s;animation-duration:.8s}
.snd.is-on .snd__bars i:nth-child(3){animation-delay:-.2s;animation-duration:1.1s}
.snd.is-on .snd__bars i:nth-child(4){animation-delay:-.6s;animation-duration:.7s}
.snd.is-on .snd__bars i:nth-child(5){animation-delay:-.3s;animation-duration:.95s}
@keyframes eq{0%,100%{height:3px}50%{height:16px}}
.snd:not(.is-on){color:var(--muted)}
@media (max-width:760px){.snd{padding:0 10px;height:40px}.snd__lbl{display:none}.lang{font-size:10.5px}}

.hdr__right{margin-left:auto}

/* ===== LITE MODE (phones): same look, far less memory/GPU ===== */
html.lite .grain,html.lite .cursor-glow,html.lite .cur{display:none}
html.lite *{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.lite .hdr.is-solid,html.lite .mnav{background:rgba(5,5,5,.97)}
html.lite .hero__video{animation:none;transform:none}
html.lite .beams{mix-blend-mode:normal}
html.lite .beams i{filter:none;opacity:.35}
html.lite .beams i:nth-child(2){display:none}
html.lite .h1,html.lite .h2,html.lite .h3,html.lite .hero__title,html.lite .hero__title .line:last-child,
html.lite .h1 em,html.lite .h2 em,html.lite .fcard__name,html.lite .way h3,html.lite .profile h2,html.lite .gate__title,
html.lite .hero__stats b,html.lite .cd__u b,html.lite .price b,html.lite .vs__x,html.lite .btn--gold,html.lite .fcard:hover,
html.lite .step__n,html.lite .trust__i svg,html.lite .kicker::before{filter:none}
html.lite .h1,html.lite .h2,html.lite .hero__title{text-shadow:none}
html.lite [data-parallax]{will-change:auto;translate:none!important}
html.lite .phero__bg,html.lite .band__bg,html.lite .final__bg{inset:0}
html.lite .rail{-webkit-mask:none;mask:none}
html.lite .way__media img,html.lite .way__media video,html.lite .fcard img,html.lite .pick img,html.lite .duo__a img,html.lite .apick img,html.lite .phero__bg img,html.lite .band__bg img,html.lite .final__bg img{filter:none!important;transition:none}
html.lite .band__bg img{filter:brightness(.35)!important}
html.lite .phero__bg img{filter:brightness(.45)!important;transform:none}
html.lite .final__bg img{filter:brightness(.3)!important}
html.lite .duo__a img{filter:brightness(.65)!important}
html.lite .way__media img{filter:brightness(.8)!important}
html.lite .sec__head.is-in .h2 em{animation:none}
html.lite .fcard__info{clip-path:none}
html.lite .drop__play{animation:none}

/* profile media: video + photos */
.profile__media{position:sticky}
.profile__media video,.profile__media img{position:absolute;inset:0}
.profile__live{position:absolute;top:18px;left:18px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:7px 12px;background:rgba(5,5,5,.7);border:1px solid var(--line);clip-path:var(--chamfer);--cut:6px;font:800 10px var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-hi)}
.profile__live i{width:8px;height:8px;border-radius:50%;background:#e0243a;box-shadow:0 0 10px #e0243a;animation:pulse 1.6s infinite}
.profile__thumbs button{position:relative;border-radius:0;clip-path:var(--chamfer);--cut:5px}
.profile__thumbs .is-vid svg{position:absolute;inset:0;margin:auto;width:22px;height:22px;color:#fff;filter:drop-shadow(0 0 6px #000)}
@media (max-width:760px){.profile__media{position:relative}}

/* third card = browse the fighters (not a product) */
.way__num--see{display:inline-grid;place-items:center;padding:6px 9px}
.way__num--see svg{width:16px;height:16px}

/* ===== fight formats ===== */
.fmts{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}
.fmt{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px 14px 14px;text-align:left;background:linear-gradient(180deg,#15110b,#0b0907);border:1.5px solid rgba(226,176,74,.25);clip-path:var(--chamfer);--cut:9px;transition:border-color .3s,transform .3s var(--ease),background .3s}
.fmt:hover{border-color:rgba(255,214,120,.7);transform:translateY(-3px)}
.fmt.is-on{border-color:var(--gold-hi);background:radial-gradient(ellipse at 50% 0,rgba(226,176,74,.25),transparent 70%),linear-gradient(180deg,#1d160b,#0d0a06)}
.fmt.is-on::after{content:"";position:absolute;top:10px;right:10px;width:18px;height:18px;background:var(--g-btn);clip-path:polygon(0 50%,38% 88%,100% 18%,88% 6%,38% 64%,12% 38%)}
.fmt__ic{display:flex;align-items:center;gap:4px;height:22px;margin-bottom:4px}
.fmt__ic .d{width:12px;height:12px;border-radius:50%}
.fmt__ic .d--a{background:#e0243a;box-shadow:0 0 8px rgba(224,36,58,.7)}
.fmt__ic .d--b,.fmt__ic .d--x{background:var(--g-btn);box-shadow:0 0 8px rgba(255,190,70,.6)}
.fmt__ic b{font:400 12px var(--display);letter-spacing:.06em;color:var(--gold-hi);margin:0 3px}
.fmt__t{font:400 22px/1 var(--display);text-transform:uppercase;background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.fmt__s{font-size:11.5px;color:var(--muted);line-height:1.35}
.mixnote{display:flex;align-items:center;gap:8px;margin:0 0 22px;font-size:13.5px;color:#d9cbaa}
.mixnote svg{color:var(--gold);flex:none}
#bPickLbl b{color:var(--gold-hi)}
/* picks colored by team */
.pick.is-sel[data-team="a"]{border-color:var(--red)}
.pick.is-sel[data-team="a"] .pick__sel{background:var(--red);color:#fff}
/* summary card: teams / all vs all */
.vs{display:grid;align-items:center;gap:8px}
.vs--teams{grid-template-columns:1fr auto 1fr}
.vs__side{display:flex;flex-direction:column;gap:6px;min-width:0}
.vs__lbl{font:800 9px var(--body);letter-spacing:.18em;text-transform:uppercase;text-align:center;color:var(--gold-hi)}
.vs__side[data-team="a"] .vs__lbl{color:#ff6b7c}
.vs__team{display:grid;gap:6px}
.vs--n4 .vs__team,.vs--n3 .vs__side[data-team="b"] .vs__team{grid-template-columns:1fr 1fr}
.vs__ffa{display:grid;gap:6px;grid-template-columns:repeat(3,1fr)}
.vs--n4 .vs__ffa{grid-template-columns:repeat(4,1fr)}
.vs__all{grid-column:1/-1;margin:2px 0 0;text-align:center;font:400 18px var(--display);letter-spacing:.08em;text-transform:uppercase;background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.vs__f[data-team="a"].has{border-color:var(--red)}
.vs__f[data-team="b"].has,.vs__f[data-team="x"].has{border-color:var(--gold)}
.vs__f b{font-size:14px}
.vs--n3 .vs__f b,.vs--n4 .vs__f b{font-size:11px;padding:16px 3px 4px}
.vs__f span{font-size:10px}
@media (max-width:1100px){.fmts{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){
  .fmts{grid-template-columns:1fr 1fr;gap:8px}
  .fmt{padding:12px 10px}
  .fmt__t{font-size:19px}
  .card-sum .vs{grid-template-columns:1fr auto 1fr;max-width:none;width:100%}
  .card-sum .vs.vs--ffa{display:block}
  .card-sum{grid-template-columns:1fr}
  .vs__f{font-size:10px}
  .vs__f em{display:none}
}

@media (max-width:760px){.card-sum .vs__f{max-height:130px}}