/* ================= LOGO SHOWCASE =================
   25 ways to present the Next One Athletics logo at the top of the hero. The logo file itself is never
   altered: every design shows it at the same width (--lgx-w) and builds the housing, light and motion
   around it. Chosen in the designer under Top logo → Logo showcase (setting: lgShow).

   Markup (built by the engine):
   .rig-sign.lg.lgx.lgx--<id>
     .lgx__stage
       .lgx__cables  .lgx__beam
       .lgx__panel
         .lgx__deco
         .lgx__logo  > .lgx__glow>i  img  .lgx__fx
         .lgx__gloss
       .lgx__under
   Only the panel takes up space, so the lamps below always clear it; beams, cables and reflections
   are drawn outside it. */

.rig-sign.lgx{--lgx-w:19em;--g:255,26,26;--glow:1;--acc:#ff2a2a;top:16px;padding:0;margin:0;background:none;border:0;border-radius:0;box-shadow:none!important;
  font-size:16px;line-height:1;letter-spacing:0;color:#EB0102;white-space:nowrap;display:block;pointer-events:none}
.hero.is-lit .rig-sign.lgx.lg-react--lamp{--glow:1.35}
.hero.is-lit .rig-sign.lgx.lg-react--own{--glow:1.5}
.lgx .lgx__stage{position:relative;display:block;transform:perspective(60em) rotateX(var(--lg-rx,0deg)) rotateY(var(--lg-ry,0deg));transform-origin:50% 0;transition:filter .5s}
.lgx .lgx__panel{position:relative;display:block;padding:var(--pad,.85em 1.25em);transition:box-shadow .5s,background .5s}
.lgx .lgx__logo{position:relative;z-index:2;display:block;width:var(--lgx-w);aspect-ratio:var(--lgx-ar,3.965)}
.lgx .lgx__logo img{position:relative;z-index:1;display:block;width:100%;height:100%;transition:filter .5s}
.lgx .lgx__glow{position:absolute;inset:0;z-index:0;filter:blur(var(--gb,.32em));opacity:0;transition:opacity .5s}
.lgx .lgx__glow i,.lgx .lgx__fx{position:absolute;inset:0;display:block;-webkit-mask:var(--lgx-url) center/100% 100% no-repeat;mask:var(--lgx-url) center/100% 100% no-repeat}
.lgx .lgx__glow i{background:rgb(var(--g))}
.lgx .lgx__fx{z-index:2;opacity:0}
.lgx .lgx__deco,.lgx .lgx__gloss{position:absolute;inset:0;pointer-events:none;border-radius:inherit}
.lgx .lgx__gloss{z-index:3}
.lgx .lgx__cables,.lgx .lgx__beam,.lgx .lgx__under{position:absolute;pointer-events:none;display:none}
/* hanging cables up into the rafters */
.lgx .lgx__cables{left:0;right:0;bottom:100%;height:30em}
.lgx .lgx__cables::before,.lgx .lgx__cables::after{content:"";position:absolute;bottom:0;width:.09em;min-width:1px;height:100%;background:linear-gradient(90deg,#3a3f46,#9aa2ab 50%,#3a3f46)}
.lgx .lgx__cables::before{left:12%}.lgx .lgx__cables::after{right:12%}
.lgx.cab .lgx__cables{display:block}
/* the lamp colors bounce up onto the bottom edge of every housing */
.lgx .lgx__panel::after{content:"";position:absolute;left:8%;right:8%;bottom:-.1em;height:1.4em;border-radius:50%;background:rgba(var(--lgb,255,255,255),calc(var(--lgb-a,0) * .45));filter:blur(.6em);pointer-events:none;z-index:-1}

/* open designs (no housing) sit on a soft dark backer so the rigging behind never runs through the letters */
.lgx.open .lgx__deco{inset:-.7em -2.4em -1em;border-radius:50%;background:radial-gradient(closest-side,rgba(4,5,7,.9),rgba(4,5,7,.82) 60%,rgba(4,5,7,.4) 85%,transparent);z-index:0}

/* light sweep shared by several designs */
@keyframes lgxSweep{0%,62%{background-position:-60% 0}88%,100%{background-position:160% 0}}
.lgx .sweep{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.75) 47%,rgba(255,255,255,.95) 50%,rgba(255,255,255,.75) 53%,transparent 70%) -60% 0/60% 100% no-repeat;mix-blend-mode:screen}
@keyframes lgxBreathe{0%,100%{opacity:calc(.8 * var(--glow))}50%{opacity:calc(1 * var(--glow))}}

/* ---------- 1 Backlit lightbox ---------- */
.lgx--lightbox{--pad:1em 1.45em}
.lgx--lightbox .lgx__panel{border-radius:.22em;background:linear-gradient(180deg,#141519,#0a0b0d 60%,#070809);
  box-shadow:inset 0 0 0 .05em #000,inset 0 0 0 .2em #0d0e10,inset 0 0 0 .24em rgba(var(--g),.35),inset 0 0 2em rgba(var(--g),.12),0 0 0 .12em #8e959e,0 0 0 .16em #2a2d33,0 .7em 1.6em rgba(0,0,0,.75),0 0 2.4em rgba(var(--g),calc(.14 * var(--glow)))}
.lgx--lightbox .lgx__logo img{filter:drop-shadow(0 0 .03em rgba(255,150,150,.8)) drop-shadow(0 0 .22em rgba(var(--g),calc(.42 * var(--glow))))}
.lgx--lightbox .lgx__glow{opacity:calc(.35 * var(--glow));--gb:1em}
.lgx--lightbox .lgx__gloss{background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 38%),linear-gradient(0deg,rgba(var(--g),.12),transparent 30%)}
.lgx--lightbox .lgx__fx{opacity:1;background:linear-gradient(180deg,rgba(255,200,200,.28),transparent 50%);mix-blend-mode:screen}

/* ---------- 2 Halo-lit letters ---------- */
.lgx--halo{--pad:1.1em 1.9em}
.lgx--halo .lgx__panel{border-radius:.1em;background:linear-gradient(180deg,#1d1f23,#121316 50%,#0c0d0f);
  box-shadow:inset 0 .05em 0 rgba(255,255,255,.12),inset 0 -.05em 0 rgba(0,0,0,.8),0 .7em 1.6em rgba(0,0,0,.7)}
.lgx--halo .lgx__glow{opacity:calc(.62 * var(--glow));--gb:.3em;transform:translate(.08em,.16em)}
.lgx--halo .lgx__glow i{background:rgb(255,40,40)}
.lgx--halo .lgx__logo img{filter:drop-shadow(.02em .04em 0 #6a0000) drop-shadow(.02em .04em 0 #4a0000) drop-shadow(.02em .04em 0 #2a0000)}
.lgx--halo .lgx__gloss{background:radial-gradient(60% 90% at 50% 55%,rgba(var(--g),calc(.14 * var(--glow))),transparent 70%)}

/* ---------- 3 Brushed steel plate ---------- */
.lgx--steel{--pad:1em 1.5em}
.lgx--steel .lgx__panel{border-radius:.2em;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 .06em,rgba(0,0,0,.04) .06em .14em),linear-gradient(180deg,#5b616a,#3b4047 40%,#262a30 75%,#1c1f24);
  box-shadow:inset 0 .07em 0 rgba(255,255,255,.4),inset 0 -.07em 0 rgba(0,0,0,.7),inset .07em 0 0 rgba(255,255,255,.12),inset -.07em 0 0 rgba(0,0,0,.4),0 .8em 1.6em rgba(0,0,0,.75)}
.lgx--steel .lgx__deco{background:radial-gradient(circle at .55em .55em,#c9ced4 0 .11em,#3a3f46 .13em,transparent .2em),radial-gradient(circle at calc(100% - .55em) .55em,#c9ced4 0 .11em,#3a3f46 .13em,transparent .2em),
  radial-gradient(circle at .55em calc(100% - .55em),#c9ced4 0 .11em,#3a3f46 .13em,transparent .2em),radial-gradient(circle at calc(100% - .55em) calc(100% - .55em),#c9ced4 0 .11em,#3a3f46 .13em,transparent .2em)}
.lgx--steel .lgx__logo img{filter:drop-shadow(0 .04em 0 rgba(255,255,255,.18)) drop-shadow(0 -.03em .02em rgba(0,0,0,.6))}
.lgx--steel .lgx__gloss{background:radial-gradient(42% 120% at 22% -10%,rgba(255,255,255,.22),transparent 60%),radial-gradient(42% 120% at 78% -10%,rgba(255,255,255,.22),transparent 60%)}
.lgx--steel .lgx__beam{display:block;left:-4%;right:-4%;bottom:100%;height:7em;
  background:radial-gradient(30% 100% at 22% 100%,rgba(255,255,255,.16),transparent 70%),radial-gradient(30% 100% at 78% 100%,rgba(255,255,255,.16),transparent 70%);filter:blur(.3em)}
.lgx--steel .lgx__beam::before,.lgx--steel .lgx__beam::after{content:"";position:absolute;top:0;width:1.1em;height:.7em;border-radius:.2em .2em .45em .45em;background:linear-gradient(#2b2f35,#0d0f12);box-shadow:0 .25em .5em rgba(255,255,255,.35),inset 0 -.12em 0 rgba(255,255,255,.75)}
.lgx--steel .lgx__beam::before{left:20%}.lgx--steel .lgx__beam::after{right:20%}
.lgx--steel .lgx__fx{opacity:1}
.lgx--steel .lgx__fx{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%) -60% 0/60% 100% no-repeat;mix-blend-mode:screen}
.lgx--steel:not(.lg-idle--none) .lgx__fx{animation:lgxSweep 9s ease-in-out infinite}

/* ---------- 4 Frosted glass panel ---------- */
.lgx--frost{--pad:1.05em 1.55em}
.lgx--frost .lgx__panel{border-radius:.35em;background:linear-gradient(160deg,rgba(225,235,248,.16),rgba(150,170,195,.07) 45%,rgba(225,235,248,.12));
  -webkit-backdrop-filter:blur(.6em) brightness(.62);backdrop-filter:blur(.6em) brightness(.62);
  box-shadow:inset 0 0 0 .06em rgba(255,255,255,.4),inset 0 .08em 0 rgba(255,255,255,.55),inset 0 0 1.4em rgba(255,255,255,.1),0 .7em 1.6em rgba(0,0,0,.55)}
.lgx--frost .lgx__deco{background:radial-gradient(circle at .6em .6em,#eef2f6 0 .13em,#7a828c .16em,transparent .22em),radial-gradient(circle at calc(100% - .6em) .6em,#eef2f6 0 .13em,#7a828c .16em,transparent .22em),
  radial-gradient(circle at .6em calc(100% - .6em),#eef2f6 0 .13em,#7a828c .16em,transparent .22em),radial-gradient(circle at calc(100% - .6em) calc(100% - .6em),#eef2f6 0 .13em,#7a828c .16em,transparent .22em)}
.lgx--frost .lgx__logo img{filter:drop-shadow(0 .03em .05em rgba(0,0,0,.35))}
.lgx--frost .lgx__gloss{background:linear-gradient(115deg,transparent 18%,rgba(255,255,255,.18) 22%,transparent 30%,transparent 58%,rgba(255,255,255,.1) 62%,transparent 68%)}
.lgx--frost .lgx__glow{opacity:calc(.25 * var(--glow));--gb:.7em}

/* ---------- 5 Center-hung video board ---------- */
.lgx--video{--pad:.95em 1.5em}
.lgx--video .lgx__panel{border-radius:.35em;background:radial-gradient(90% 120% at 50% 50%,#17121a,#07070a 70%);
  box-shadow:inset 0 0 0 .32em #0b0c0f,inset 0 0 0 .38em #262a31,inset 0 0 0 .42em #0a0b0d,0 0 0 .08em #3a3f47,0 .8em 1.7em rgba(0,0,0,.8)}
.lgx--video .lgx__deco{inset:.42em;border-radius:.15em;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 .06em,transparent .06em .14em),repeating-linear-gradient(90deg,rgba(0,0,0,.25) 0 .05em,transparent .05em .14em)}
.lgx--video .lgx__logo img{filter:drop-shadow(0 0 .05em rgba(255,90,90,.8)) drop-shadow(0 0 .35em rgba(var(--g),calc(.5 * var(--glow))))}
.lgx--video .lgx__fx{opacity:1;background:linear-gradient(180deg,transparent 0 44%,rgba(255,255,255,.55) 50%,transparent 56%) 0 -120%/100% 200% no-repeat;mix-blend-mode:screen}
@keyframes lgxScanY{0%,55%{background-position:0 -120%}100%{background-position:0 220%}}
.lgx--video:not(.lg-idle--none) .lgx__fx{animation:lgxScanY 6s linear infinite}
.lgx--video .lgx__gloss{inset:.42em;background:linear-gradient(170deg,rgba(255,255,255,.07),transparent 40%)}
.lgx--video .lgx__under{display:block;left:6%;right:6%;top:100%;height:.55em;margin-top:.12em;border-radius:.1em;background:linear-gradient(90deg,#1a0406,#c50f16 20%,#ff3b3b 50%,#c50f16 80%,#1a0406);box-shadow:0 0 .8em rgba(var(--g),.55),0 .2em .5em rgba(0,0,0,.6)}
@keyframes lgxChase{0%{background-position:0 0}100%{background-position:4em 0}}
.lgx--video .lgx__under::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.55) 0 .5em,transparent .5em 2em);mix-blend-mode:overlay}
.lgx--video:not(.lg-idle--none) .lgx__under::after{animation:lgxChase 1.4s linear infinite}

/* ---------- 6 LED ribbon board ---------- */
.lgx--ribbon{--pad:.45em 4.2em}
.lgx--ribbon .lgx__panel{border-radius:.12em;background:radial-gradient(circle,#1d0f12 0 .06em,transparent .08em) 0 0/.22em .22em,linear-gradient(180deg,#0d0d10,#060608);
  box-shadow:inset 0 .09em 0 #2c3036,inset 0 -.09em 0 #2c3036,0 0 0 .05em #000,0 .6em 1.4em rgba(0,0,0,.75)}
.lgx--ribbon .lgx__deco{background:linear-gradient(90deg,transparent,rgba(var(--g),.85) 50%,transparent) -30% 50%/22% 14% no-repeat,linear-gradient(90deg,transparent,rgba(255,255,255,.7) 50%,transparent) 130% 50%/22% 14% no-repeat;
  -webkit-mask:linear-gradient(90deg,#000 0 32%,transparent 32% 68%,#000 68%);mask:linear-gradient(90deg,#000 0 32%,transparent 32% 68%,#000 68%)}
@keyframes lgxRun{0%{background-position:-30% 50%,130% 50%}100%{background-position:130% 50%,-30% 50%}}
.lgx--ribbon:not(.lg-idle--none) .lgx__deco{animation:lgxRun 3.2s linear infinite}
.lgx--ribbon .lgx__logo img{opacity:.7;filter:drop-shadow(0 0 .3em rgba(var(--g),calc(.6 * var(--glow))))}
.lgx--ribbon .lgx__fx{opacity:1;background:#ff3030;-webkit-mask:var(--lgx-url) center/100% 100% no-repeat,radial-gradient(circle,#000 .055em,transparent .075em) 0 0/.16em .16em;-webkit-mask-composite:source-in;
  mask:var(--lgx-url) center/100% 100% no-repeat,radial-gradient(circle,#000 .055em,transparent .075em) 0 0/.16em .16em;mask-composite:intersect}
.lgx--ribbon.cab .lgx__cables::before{left:4%}.lgx--ribbon.cab .lgx__cables::after{right:4%}

/* ---------- 7 Neon glow ---------- */
.lgx--neon{--pad:1em 1.5em}
.lgx--neon .lgx__panel{border-radius:.25em;background:radial-gradient(circle,#202226 0 .05em,transparent .07em) 0 0/.3em .3em,linear-gradient(180deg,#121316,#0a0b0d);
  box-shadow:inset 0 0 0 .06em rgba(255,255,255,.07),0 .7em 1.6em rgba(0,0,0,.75)}
.lgx--neon .lgx__logo img{filter:drop-shadow(0 0 .03em rgba(255,220,220,.9)) drop-shadow(0 0 .12em rgba(var(--g),.85)) drop-shadow(0 0 .4em rgba(var(--g),calc(.55 * var(--glow))))}
.lgx--neon .lgx__glow{opacity:calc(.5 * var(--glow));--gb:1.1em}
.lgx--neon .lgx__fx{opacity:.35;background:#ffd4d4;mix-blend-mode:screen;transform:scale(.985);filter:blur(.02em)}
.lgx--neon .lgx__gloss{background:radial-gradient(70% 100% at 50% 50%,rgba(var(--g),calc(.2 * var(--glow))),transparent 70%)}
@keyframes lgxFlicker{0%,90%,100%{opacity:1}91%{opacity:.55}92%{opacity:1}94%{opacity:.7}95%{opacity:1}}
.lgx--neon:not(.lg-idle--none) .lgx__logo{animation:lgxFlicker 8s linear infinite}

/* ---------- 8 Spotlight reveal ---------- */
.lgx--spot{--pad:.8em 1.4em}
.lgx--spot .lgx__beam{display:block;left:50%;bottom:30%;width:26em;height:22em;transform:translateX(-50%);
  background:radial-gradient(60% 40% at 50% 100%,rgba(255,250,240,.28),transparent 70%),linear-gradient(180deg,rgba(255,250,240,.02),rgba(255,250,240,.16));
  clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);filter:blur(.4em);mix-blend-mode:screen}
.lgx--spot .lgx__logo img{filter:drop-shadow(0 -.04em 0 rgba(255,255,255,.35)) drop-shadow(0 .35em .5em rgba(0,0,0,.55))}
.lgx--spot .lgx__under{display:block;left:-10%;right:-10%;top:72%;height:3em;border-radius:50%;background:radial-gradient(closest-side,rgba(255,245,235,.18),transparent);filter:blur(.4em)}
.lgx--spot .lgx__glow{opacity:calc(.3 * var(--glow));--gb:.8em}

/* ---------- 9 Twin searchlights ---------- */
.lgx--cross{--pad:.8em 1.4em}
.lgx--cross .lgx__beam{display:block;left:50%;top:-14em;width:2px;height:24em;z-index:-1}
.lgx--cross .lgx__beam::before,.lgx--cross .lgx__beam::after{content:"";position:absolute;bottom:0;left:-1.4em;width:2.8em;height:26em;transform-origin:50% 100%;
  background:linear-gradient(0deg,rgba(255,255,255,.4),rgba(255,255,255,.05) 80%,transparent);clip-path:polygon(40% 100%,60% 100%,100% 0,0 0);filter:blur(.15em);mix-blend-mode:screen}
.lgx--cross .lgx__beam::before{transform:translateX(-7em) rotate(18deg)}
.lgx--cross .lgx__beam::after{transform:translateX(7em) rotate(-18deg)}
@keyframes lgxSwingL{0%,100%{transform:translateX(-7em) rotate(26deg)}50%{transform:translateX(-7em) rotate(8deg)}}
@keyframes lgxSwingR{0%,100%{transform:translateX(7em) rotate(-26deg)}50%{transform:translateX(7em) rotate(-8deg)}}
.lgx--cross:not(.lg-idle--none) .lgx__beam::before{animation:lgxSwingL 7s ease-in-out infinite}
.lgx--cross:not(.lg-idle--none) .lgx__beam::after{animation:lgxSwingR 7s ease-in-out infinite}
.lgx--cross .lgx__logo img{filter:drop-shadow(0 0 .3em rgba(0,0,0,.8)) drop-shadow(0 0 .25em rgba(var(--g),calc(.35 * var(--glow))))}

/* ---------- 10 Championship banner ---------- */
.lgx--banner{--pad:1.15em 1.6em 1.35em}
.lgx--banner .lgx__panel{background:repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 .08em,transparent .08em .2em),linear-gradient(90deg,rgba(0,0,0,.25),transparent 12% 88%,rgba(0,0,0,.25)),linear-gradient(180deg,#121a26,#0b111a);
  box-shadow:inset 0 .32em 0 #0b111a,inset 0 .42em 0 #d9dde2,inset 0 .5em 0 #0b111a,inset 0 .58em 0 #c8102e,inset 0 -.32em 0 #0b111a,inset 0 -.42em 0 #c8102e,inset 0 -.5em 0 #0b111a,inset 0 -.58em 0 #d9dde2,0 .8em 1.6em rgba(0,0,0,.7);
  transform-origin:50% -1em}
.lgx--banner .lgx__panel::before{content:"";position:absolute;left:-.5em;right:-.5em;top:-.35em;height:.35em;border-radius:.2em;background:linear-gradient(180deg,#c8cdd3,#5f656d);box-shadow:0 .1em .2em rgba(0,0,0,.6)}
.lgx--banner .lgx__gloss{background:repeating-linear-gradient(90deg,transparent 0 3.5em,rgba(255,255,255,.035) 4.5em,transparent 5.5em)}
.lgx--banner .lgx__logo img{filter:drop-shadow(0 .04em .03em rgba(0,0,0,.5))}
@keyframes lgxSway{0%,100%{transform:rotate(-.5deg)}50%{transform:rotate(.5deg)}}
.lgx--banner:not(.lg-idle--none) .lgx__panel{animation:lgxSway 6s ease-in-out infinite}
.lgx--banner.cab .lgx__cables::before{left:6%}.lgx--banner.cab .lgx__cables::after{right:6%}

/* ---------- 11 Carbon fiber plate ---------- */
.lgx--carbon{--pad:1em 1.5em;--cf:.32em}
.lgx--carbon .lgx__panel{border-radius:.3em;
  background:linear-gradient(180deg,rgba(255,255,255,.1),transparent 35%,rgba(0,0,0,.25)),
    linear-gradient(27deg,#151618 var(--cf),transparent var(--cf)) 0 var(--cf)/calc(var(--cf) * 4) calc(var(--cf) * 4),
    linear-gradient(207deg,#151618 var(--cf),transparent var(--cf)) calc(var(--cf) * 2) 0/calc(var(--cf) * 4) calc(var(--cf) * 4),
    linear-gradient(27deg,#232528 var(--cf),transparent var(--cf)) 0 calc(var(--cf) * 2)/calc(var(--cf) * 4) calc(var(--cf) * 4),
    linear-gradient(207deg,#232528 var(--cf),transparent var(--cf)) calc(var(--cf) * 2) var(--cf)/calc(var(--cf) * 4) calc(var(--cf) * 4),
    linear-gradient(90deg,#1b1c1e calc(var(--cf) * 2),transparent calc(var(--cf) * 2)) 0 0/calc(var(--cf) * 4) calc(var(--cf) * 4),
    #18191b;
  box-shadow:inset 0 0 0 .09em #EB0102,inset 0 0 0 .16em #0b0b0c,inset 0 .2em .3em rgba(255,255,255,.08),0 .8em 1.6em rgba(0,0,0,.75)}
.lgx--carbon .lgx__logo img{filter:drop-shadow(0 .05em .04em rgba(0,0,0,.7))}
.lgx--carbon .lgx__fx{opacity:1}
.lgx--carbon .lgx__gloss{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.12) 48%,transparent 60%) -60% 0/70% 100% no-repeat}
.lgx--carbon:not(.lg-idle--none) .lgx__gloss{animation:lgxSweep 8s ease-in-out infinite}

/* ---------- 12 Chrome bezel ---------- */
.lgx--chrome{--pad:.9em 1.4em}
.lgx--chrome .lgx__panel{border:.34em solid transparent;border-radius:.55em;
  background:linear-gradient(180deg,#121417,#07080a) padding-box,conic-gradient(from 200deg,#f4f6f9,#7d848d 12%,#ffffff 25%,#545b64 38%,#dfe3e8 52%,#6d747d 66%,#fbfcfd 80%,#868d96 92%,#f4f6f9) border-box;
  box-shadow:inset 0 0 0 .05em rgba(0,0,0,.8),inset 0 0 1.2em rgba(0,0,0,.8),0 0 0 .05em #1a1c1f,0 .8em 1.7em rgba(0,0,0,.8)}
.lgx--chrome .lgx__logo img{filter:drop-shadow(0 0 .25em rgba(var(--g),calc(.35 * var(--glow))))}
.lgx--chrome .lgx__gloss{inset:-.34em;border-radius:.55em;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 48%,rgba(255,255,255,.85) 50%,rgba(255,255,255,.55) 52%,transparent 70%) -60% 0/55% 100% no-repeat;mix-blend-mode:overlay}
.lgx--chrome:not(.lg-idle--none) .lgx__gloss{animation:lgxSweep 7s ease-in-out infinite}
.lgx--chrome .lgx__fx{opacity:1}
.lgx--chrome:not(.lg-idle--none) .lgx__fx{animation:lgxSweep 7s ease-in-out infinite}
.lgx--chrome .lgx__fx{background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.7) 50%,transparent 65%) -60% 0/55% 100% no-repeat;mix-blend-mode:screen}

/* ---------- 13 Marquee lights ---------- */
.lgx--marquee{--pad:1.25em 1.8em}
.lgx--marquee .lgx__panel{border-radius:.45em;background:radial-gradient(120% 150% at 50% 0%,#24160c,#0c0806 70%);
  box-shadow:inset 0 0 0 .1em #5a4126,inset 0 0 0 .95em #120c07,inset 0 0 0 1.02em #3a2a18,inset 0 0 1.4em rgba(0,0,0,.85),0 .8em 1.7em rgba(0,0,0,.75)}
.lgx--marquee .lgx__deco{inset:.2em;border-radius:.35em;
  background:radial-gradient(circle,#fff6dc 0 .1em,#ffcf7a .14em,rgba(255,180,80,.35) .22em,transparent .3em) 0 0/.75em .75em round;
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);padding:.6em}
.lgx--marquee .lgx__gloss{inset:.2em;border-radius:.35em;padding:.6em;
  background:radial-gradient(circle,rgba(20,12,6,.85) 0 .2em,transparent .24em) .375em 0/1.5em .75em round;
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
@keyframes lgxBulbs{0%{background-position:.375em 0}50%{background-position:1.125em 0}100%{background-position:1.875em 0}}
.lgx--marquee:not(.lg-idle--none) .lgx__gloss{animation:lgxBulbs 1.2s steps(2) infinite}
.lgx--marquee .lgx__logo img{filter:drop-shadow(0 0 .1em rgba(255,210,150,.55)) drop-shadow(0 0 .35em rgba(var(--g),calc(.45 * var(--glow))))}

/* ---------- 14 Ice slab ---------- */
.lgx--ice{--pad:1.05em 1.6em}
.lgx--ice .lgx__panel{background:linear-gradient(160deg,rgba(215,240,255,.3),rgba(120,175,215,.1) 38%,rgba(170,215,240,.08) 62%,rgba(225,245,255,.22));
  -webkit-backdrop-filter:blur(.4em) saturate(.7) brightness(.55);backdrop-filter:blur(.4em) saturate(.7) brightness(.55);
  clip-path:polygon(1.5% 4%,22% 0,48% 2.5%,77% 0,98.5% 3%,100% 46%,98% 97%,70% 100%,41% 97.5%,14% 100%,0 95%,1% 52%);
  box-shadow:inset 0 0 1.4em rgba(255,255,255,.35),inset 0 .1em .15em rgba(255,255,255,.8)}
.lgx--ice .lgx__deco{background:linear-gradient(32deg,transparent 47%,rgba(255,255,255,.35) 48%,transparent 49.5%) 0 0/14% 100% no-repeat,linear-gradient(150deg,transparent 45%,rgba(255,255,255,.3) 46%,transparent 48%) 100% 0/12% 100% no-repeat,radial-gradient(80% 60% at 50% 110%,rgba(255,255,255,.18),transparent)}
.lgx--ice .lgx__glow{opacity:calc(.55 * var(--glow));--gb:.55em}
.lgx--ice .lgx__logo img{filter:drop-shadow(0 0 .04em rgba(255,255,255,.6))}
.lgx--ice .lgx__gloss{background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.35) 20%,transparent 27%)}

/* ---------- 15 Mirror plinth ---------- */
.lgx--mirror{--pad:.75em 1.4em .6em}
.lgx--mirror .lgx__logo img{filter:drop-shadow(0 -.04em 0 rgba(255,255,255,.25))}
.lgx--mirror .lgx__panel::before{content:"";position:absolute;left:.4em;right:.4em;bottom:-.05em;height:.42em;border-radius:.08em;z-index:1;
  background:linear-gradient(180deg,#5b6068 0 .06em,#16181b .06em,#08090a);box-shadow:0 .4em .8em rgba(0,0,0,.7)}
.lgx--mirror .lgx__under{display:block;left:0;right:0;top:100%;height:2.4em;overflow:hidden;
  background:var(--lgx-url) 50% 100%/var(--lgx-w) auto no-repeat;transform:scaleY(-1);transform-origin:50% 50%;margin-top:.05em;opacity:.3;
  -webkit-mask:linear-gradient(0deg,#000,transparent 80%);mask:linear-gradient(0deg,#000,transparent 80%);filter:blur(.04em)}
.lgx--mirror .lgx__beam{display:block;left:50%;bottom:20%;width:24em;height:16em;transform:translateX(-50%);background:linear-gradient(180deg,transparent,rgba(255,255,255,.1));clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);filter:blur(.4em)}

/* ---------- 16 Laser scan ---------- */
.lgx--scan{--pad:1em 1.5em}
.lgx--scan .lgx__panel{background:linear-gradient(180deg,#0b0c0e,#060708);border-radius:.1em;box-shadow:0 .7em 1.6em rgba(0,0,0,.7)}
.lgx--scan .lgx__deco{background:
  linear-gradient(#EB0102,#EB0102) 0 0/1.1em .09em,linear-gradient(#EB0102,#EB0102) 0 0/.09em 1.1em,
  linear-gradient(#EB0102,#EB0102) 100% 0/1.1em .09em,linear-gradient(#EB0102,#EB0102) 100% 0/.09em 1.1em,
  linear-gradient(#EB0102,#EB0102) 0 100%/1.1em .09em,linear-gradient(#EB0102,#EB0102) 0 100%/.09em 1.1em,
  linear-gradient(#EB0102,#EB0102) 100% 100%/1.1em .09em,linear-gradient(#EB0102,#EB0102) 100% 100%/.09em 1.1em;background-repeat:no-repeat}
.lgx--scan .lgx__gloss{background:linear-gradient(180deg,transparent 0 calc(50% - .05em),rgba(255,70,70,.95) calc(50% - .05em) calc(50% + .05em),transparent calc(50% + .05em)) 0 -50%/100% 200% no-repeat;filter:drop-shadow(0 0 .25em rgba(255,30,30,.9))}
.lgx--scan .lgx__fx{opacity:1;background:linear-gradient(180deg,transparent 0 40%,rgba(255,220,220,.9) 50%,transparent 60%) 0 -50%/100% 200% no-repeat;mix-blend-mode:screen}
@keyframes lgxScan{0%,40%{background-position:0 -50%}100%{background-position:0 150%}}
.lgx--scan:not(.lg-idle--none) .lgx__gloss,.lgx--scan:not(.lg-idle--none) .lgx__fx{animation:lgxScan 4.5s cubic-bezier(.5,0,.5,1) infinite}
.lgx--scan .lgx__logo img{filter:drop-shadow(0 0 .2em rgba(var(--g),calc(.35 * var(--glow))))}

/* ---------- 17 Broadcast plate ---------- */
.lgx--broadcast{--pad:.9em 2.1em}
.lgx--broadcast .lgx__panel{background:linear-gradient(180deg,#1b1e23,#0c0d10);clip-path:polygon(1.1em 0,100% 0,calc(100% - 1.1em) 100%,0 100%);
  box-shadow:inset 0 .07em 0 rgba(255,255,255,.2)}
.lgx--broadcast .lgx__deco{background:linear-gradient(105deg,#EB0102 0 2.1em,transparent 2.1em) 0 0/100% 100% no-repeat,linear-gradient(285deg,#EB0102 0 .9em,#fff .9em 1.15em,transparent 1.15em) 0 0/100% 100% no-repeat,linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent) 50% 100%/80% .06em no-repeat}
.lgx--broadcast .lgx__deco{background:linear-gradient(105deg,#EB0102 0 1.15em,#fff 1.15em 1.35em,transparent 1.35em),linear-gradient(285deg,#EB0102 0 1.15em,transparent 1.15em),linear-gradient(90deg,transparent 10%,rgba(255,255,255,.6) 50%,transparent 90%) 50% 100%/100% .06em no-repeat}
.lgx--broadcast .lgx__gloss{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.18) 48%,transparent 62%) -60% 0/60% 100% no-repeat}
.lgx--broadcast:not(.lg-idle--none) .lgx__gloss{animation:lgxSweep 6s ease-in-out infinite}
.lgx--broadcast .lgx__stage{filter:drop-shadow(0 .7em 1em rgba(0,0,0,.7))}

/* ---------- 18 Truss mount ---------- */
.lgx--truss{--pad:1.45em 1.6em}
.lgx--truss .lgx__panel{background:linear-gradient(180deg,transparent 0 .9em,#0c0d10 .9em calc(100% - .9em),transparent calc(100% - .9em))}
.lgx--truss .lgx__deco{background:
  linear-gradient(180deg,#9aa1aa,#4a5058) 0 0/100% .16em no-repeat,linear-gradient(180deg,#9aa1aa,#4a5058) 0 .78em/100% .16em no-repeat,
  repeating-linear-gradient(60deg,transparent 0 .3em,#7d848d .3em .42em,transparent .42em .9em) 0 .16em/100% .62em no-repeat,
  linear-gradient(180deg,#9aa1aa,#4a5058) 0 calc(100% - .78em)/100% .16em no-repeat,linear-gradient(180deg,#9aa1aa,#4a5058) 0 100%/100% .16em no-repeat,
  repeating-linear-gradient(-60deg,transparent 0 .3em,#7d848d .3em .42em,transparent .42em .9em) 0 calc(100% - .16em)/100% .62em no-repeat;filter:drop-shadow(0 .15em .2em rgba(0,0,0,.6))}
.lgx--truss .lgx__panel::before{content:"";position:absolute;inset:.94em -.1em;border-left:.22em solid #6b727b;border-right:.22em solid #6b727b}
.lgx--truss .lgx__logo img{filter:drop-shadow(0 .25em .35em rgba(0,0,0,.7)) drop-shadow(0 0 .2em rgba(var(--g),calc(.3 * var(--glow))))}
.lgx--truss .lgx__gloss{background:radial-gradient(40% 55% at 50% 30%,rgba(255,255,255,.08),transparent 70%)}

/* ---------- 19 Pixel matrix ---------- */
.lgx--pixel{--pad:.95em 1.45em}
.lgx--pixel .lgx__panel{border-radius:.25em;background:radial-gradient(circle,#2a1a1c 0 .05em,transparent .07em) 0 0/.17em .17em,#060607;
  box-shadow:inset 0 0 0 .08em #22262c,inset 0 0 0 .2em #050506,0 .7em 1.6em rgba(0,0,0,.8)}
.lgx--pixel .lgx__logo img{opacity:.5}
.lgx--pixel .lgx__fx{opacity:1;background:linear-gradient(180deg,#ff5050,#ff1010);-webkit-mask:var(--lgx-url) center/100% 100% no-repeat,radial-gradient(circle,#000 .055em,transparent .075em) 0 0/.17em .17em;-webkit-mask-composite:source-in;
  mask:var(--lgx-url) center/100% 100% no-repeat,radial-gradient(circle,#000 .055em,transparent .075em) 0 0/.17em .17em;mask-composite:intersect;filter:drop-shadow(0 0 .08em rgba(255,60,60,.9))}
.lgx--pixel .lgx__glow{opacity:calc(.55 * var(--glow));--gb:.5em}
.lgx--pixel .lgx__gloss{background:linear-gradient(180deg,transparent 0 46%,rgba(255,255,255,.12) 50%,transparent 54%) 0 -60%/100% 200% no-repeat}
.lgx--pixel:not(.lg-idle--none) .lgx__gloss{animation:lgxScanY 5s linear infinite}

/* ---------- 20 Minimal float ---------- */
.lgx--minimal{--pad:.8em 1.4em}
.lgx--minimal .lgx__logo img{filter:drop-shadow(0 .28em .45em rgba(0,0,0,.65))}
.lgx--minimal .lgx__glow{opacity:calc(.28 * var(--glow));--gb:1.1em;transform:translateY(.35em)}
@keyframes lgxFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-.12em)}}
.lgx--minimal:not(.lg-idle--none) .lgx__panel{animation:lgxFloat 6s ease-in-out infinite}

/* ---------- 21 Rink glass ---------- */
.lgx--glass{--pad:1em 1.9em}
.lgx--glass .lgx__panel{background:linear-gradient(180deg,rgba(200,225,235,.14),rgba(10,14,18,.35) 30%,rgba(10,14,18,.4));-webkit-backdrop-filter:blur(.3em) brightness(.55);backdrop-filter:blur(.3em) brightness(.55);
  box-shadow:inset 0 .06em 0 rgba(255,255,255,.35),inset 0 -.06em 0 rgba(255,255,255,.12),0 .6em 1.4em rgba(0,0,0,.35)}
.lgx--glass .lgx__panel::before{content:"";position:absolute;inset:-.25em -.05em;border-left:.32em solid transparent;border-right:.32em solid transparent;
  background:linear-gradient(90deg,#9ca3ab,#e6e9ec 30%,#7a818a) left/.32em 100% no-repeat,linear-gradient(90deg,#9ca3ab,#e6e9ec 30%,#7a818a) right/.32em 100% no-repeat;border-radius:.06em;pointer-events:none}
.lgx--glass .lgx__gloss{background:linear-gradient(120deg,transparent 12%,rgba(255,255,255,.22) 15%,transparent 22%,transparent 64%,rgba(255,255,255,.14) 67%,rgba(255,255,255,.05) 73%,transparent 74%)}
.lgx--glass .lgx__logo img{filter:drop-shadow(0 0 .02em rgba(255,255,255,.4))}

/* ---------- 22 Dasher board ---------- */
.lgx--dasher{--pad:.9em 1.6em 1.25em}
.lgx--dasher .lgx__panel{border-radius:.15em .15em .1em .1em;background:linear-gradient(180deg,#ffffff,#eef1f4 55%,#dde2e7);
  box-shadow:inset 0 -.5em 0 #e7b904,inset 0 -.56em 0 #b58f00,0 .7em 1.5em rgba(0,0,0,.7)}
.lgx--dasher .lgx__panel::before{content:"";position:absolute;left:-.12em;right:-.12em;top:-.32em;height:.38em;border-radius:.2em;background:linear-gradient(180deg,#ffffff,#c9ced4);box-shadow:0 .08em .15em rgba(0,0,0,.35)}
.lgx--dasher .lgx__gloss{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.7) 48%,transparent 62%) -60% 0/60% 100% no-repeat;mix-blend-mode:soft-light}
.lgx--dasher:not(.lg-idle--none) .lgx__gloss{animation:lgxSweep 9s ease-in-out infinite}
.lgx--dasher .lgx__deco{background:radial-gradient(100% 60% at 50% 0,rgba(255,255,255,.6),transparent 70%)}

/* ---------- 23 Arena ring fascia ---------- */
.lgx--ring{--pad:.75em 3.2em .9em}
.lgx--ring .lgx__panel{border-radius:50% 50% 50% 50%/22% 22% 28% 28%;background:radial-gradient(circle,#1c1214 0 .05em,transparent .07em) 0 0/.2em .2em,linear-gradient(180deg,#0e0d10,#060608);
  box-shadow:inset 0 .12em 0 rgba(255,255,255,.55),inset 0 -.12em 0 rgba(var(--g),.85),inset 0 .5em 1em rgba(0,0,0,.6),0 .2em 1em rgba(var(--g),calc(.25 * var(--glow))),0 .8em 1.6em rgba(0,0,0,.75)}
.lgx--ring .lgx__deco{border-radius:inherit;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent) -40% 0/25% .12em no-repeat,linear-gradient(90deg,transparent,rgba(255,90,90,.9),transparent) 140% 100%/25% .12em no-repeat}
@keyframes lgxRing{0%{background-position:-40% 0,140% 100%}100%{background-position:140% 0,-40% 100%}}
.lgx--ring:not(.lg-idle--none) .lgx__deco{animation:lgxRing 4s linear infinite}
.lgx--ring .lgx__logo img{filter:drop-shadow(0 0 .05em rgba(255,110,110,.8)) drop-shadow(0 0 .3em rgba(var(--g),calc(.45 * var(--glow))))}
.lgx--ring.cab .lgx__cables::before{left:10%}.lgx--ring.cab .lgx__cables::after{right:10%}

/* ---------- 24 Goal light ---------- */
.lgx--goal{--pad:1em 1.5em}
.lgx--goal .lgx__panel{border-radius:.3em;background:linear-gradient(180deg,#141518,#0a0a0c);box-shadow:inset 0 0 0 .07em #2b2f35,0 .7em 1.6em rgba(0,0,0,.75)}
.lgx--goal .lgx__beam{display:block;left:50%;top:50%;width:34em;height:34em;margin:-17em 0 0 -17em;z-index:-1;border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0 20deg,rgba(255,30,30,.42) 32deg,transparent 46deg 200deg,rgba(255,30,30,.42) 212deg,transparent 226deg 360deg);
  -webkit-mask:radial-gradient(closest-side,#000 25%,transparent);mask:radial-gradient(closest-side,#000 25%,transparent);filter:blur(.3em);opacity:calc(.6 * var(--glow))}
@keyframes lgxSpin{to{transform:rotate(360deg)}}
.lgx--goal:not(.lg-idle--none) .lgx__beam{animation:lgxSpin 5s linear infinite}
.hero.is-lit .lgx--goal .lgx__beam{animation-duration:1.6s}
.lgx--goal .lgx__logo img{filter:drop-shadow(0 0 .3em rgba(var(--g),calc(.5 * var(--glow))))}
.lgx--goal .lgx__panel::before{content:"";position:absolute;left:50%;top:-.9em;width:1.6em;height:.9em;margin-left:-.8em;border-radius:.8em .8em 0 0;background:radial-gradient(70% 90% at 50% 100%,#ff6a6a,#c50f16 60%,#5a0408);box-shadow:0 0 .8em rgba(255,30,30,.7)}

/* ---------- 25 Smoke & uplights ---------- */
.lgx--fog{--pad:.85em 1.4em}
.lgx--fog .lgx__beam{display:block;left:50%;top:-8em;width:30em;height:14em;transform:translateX(-50%);z-index:-1;
  background:linear-gradient(0deg,rgba(255,240,225,.32),transparent 85%) 20% 100%/4.5em 100% no-repeat,linear-gradient(0deg,rgba(255,240,225,.32),transparent 85%) 80% 100%/4.5em 100% no-repeat;filter:blur(.7em)}
.lgx--fog .lgx__under{display:block;left:-20%;right:-20%;top:62%;height:4.5em;z-index:-1;
  background:radial-gradient(35% 60% at 30% 50%,rgba(200,205,215,.28),transparent 70%),radial-gradient(35% 55% at 68% 55%,rgba(200,205,215,.24),transparent 70%),radial-gradient(50% 50% at 50% 60%,rgba(255,60,60,calc(.18 * var(--glow))),transparent 70%);filter:blur(.6em)}
@keyframes lgxDrift{0%,100%{transform:translateX(-3%)}50%{transform:translateX(3%)}}
.lgx--fog:not(.lg-idle--none) .lgx__under{animation:lgxDrift 9s ease-in-out infinite}
.lgx--fog .lgx__logo img{filter:drop-shadow(0 0 .08em rgba(255,200,200,.45)) drop-shadow(0 0 .4em rgba(var(--g),calc(.4 * var(--glow))))}

/* ---------- arriving (Top logo → "How it arrives") ---------- */
@keyframes lgxIgnite{0%{opacity:0}8%{opacity:.7}12%{opacity:.1}20%{opacity:.85}26%{opacity:.3}36%,100%{opacity:1}}
@keyframes lgxSlam{0%{opacity:0;transform:translateY(-1.6em) scale(1.08)}55%{opacity:1;transform:translateY(.12em) scale(.99)}75%{transform:translateY(-.05em)}100%{transform:none}}
@keyframes lgxReveal{0%{clip-path:inset(-50% 100% -50% 0)}100%{clip-path:inset(-50% -10% -50% 0)}}
@keyframes lgxLower{0%{transform:translateY(-9em)}70%{transform:translateY(.35em)}85%{transform:translateY(-.1em)}100%{transform:none}}
@keyframes lgxResolve{0%{opacity:0;filter:blur(.6em) brightness(2)}100%{opacity:1;filter:none}}
.lgx.lg-play--ignite .lgx__panel,.lgx.lg-play--ignite .lgx__under{animation:lgxIgnite 1.4s linear both}
.lgx.lg-play--slam .lgx__panel{animation:lgxSlam .7s cubic-bezier(.3,1.3,.5,1) both}
.lgx.lg-play--sweep .lgx__panel{animation:lgxReveal 1.2s cubic-bezier(.6,0,.2,1) both}
.lgx.lg-play--lower .lgx__panel{animation:lgxLower 1.5s cubic-bezier(.3,.9,.4,1) both}
.lgx.lg-play--scramble .lgx__panel{animation:lgxResolve 1.2s ease-out both}

@media (prefers-reduced-motion:reduce){.lgx *,.lgx *::before,.lgx *::after{animation:none!important}}

/* phones: a touch less padding so the logo can stay large */
@media (max-width:600px){.rig-sign.lgx{top:10px}}

/* ---------- the showcase cards in the designer ---------- */
.lgxgrid .preset-card__img{aspect-ratio:12/5}
.lgx-card__off{display:grid;place-items:center;width:100%;height:100%;font:800 28px/1 var(--label,sans-serif);letter-spacing:.06em;color:#c9ccd1;background:linear-gradient(180deg,#1a1c20,#0b0c0e)}
.lgx-note{margin:0 0 10px;padding:8px 10px;border-radius:8px;background:rgba(200,16,46,.07);font-size:12.5px}