/* NEO body, entity skin · generated by ../fusion_landings.py (29-oct-2026); edit fusion_assets.py, not this file. */
:root{--fx-head:var(--serif);--fx-head-w:400;--fx-head-s:italic;--fx-deep:#08262d;--fx-deep2:#0e333b;--fx-box:#0b1f24;--fx-box2:#071518;--fx-acc-d:#9fe0d2;--fx-acc-l:#14657f;--fx-glow:#3E9BE6;--fx-glow2:#4CC3AE;--fx-snow:#f3faf8;--fx-snow2:rgba(243,250,248,.8);--fx-ink:#0f2f37;--fx-btn:#8bdece;--fx-btn-ink:#0f3138;--fx-em:#9fe0d2;--fx-kick-d:#9fe0d2}
.fx-body #contenido{--n:"01"}.fx-body #campana{--n:"02"}.fx-body #mensajes{--n:"03"}.fx-body #herramientas{--n:"04"}.fx-body #reporte{--n:"05"}.fx-body #regalo{--n:"06"}.fx-body #neo{--n:"07"}.fx-body #oferta{--n:"08"}.fx-body #planes{--n:"09"}.fx-body #reglas{--n:"10"}.fx-body #faq{--n:"11"}.fx-body #contacto{--n:"12"}
/* ---------- 6 · production slates ---------------------------------------------------------------------------------------- */
.fx-body .fx-slate{display:inline-flex;align-items:center;gap:10px;letter-spacing:.14em}
.fx-body .fx-slate::before{content:"";flex:none;width:30px;height:12px;border-radius:2px;background:repeating-linear-gradient(-55deg,var(--sa,var(--fx-acc-l)) 0 5px,transparent 5px 10px);opacity:.95}
.fx-body .fx-slate .fx-n{display:inline-grid;place-items:center;min-width:2.3em;padding:.28em .5em;border-radius:6px;background:var(--fx-ink);color:#fff;font-weight:600;letter-spacing:.04em;line-height:1}
.fx-body .dark .fx-slate .fx-n,.fx-body .contact .fx-slate .fx-n,.fx-body .fx-scene .fx-slate .fx-n{background:var(--fx-acc-d);color:var(--fx-deep)}

/* ---------- 5 · rhythm: dark chapters keep their grain visible --------------------------------------------------------------- */
.fx-body main>section.dark>.grain,.fx-body main>.contact>.grain{opacity:.1;z-index:0}
.fx-body main>section.dark>.in-w,.fx-body main>section.dark>.contact-in{position:relative;z-index:1}

/* text of a chapter that turned dark keeps AA contrast; a dark chapter without its own accent wears the entity's */
.fx-body .dark:not([data-acc]) h2 em{color:var(--fx-acc-d)}
.fx-body .dark .pulse-offer-note,.fx-body .dark .buzz-note,.fx-body .dark>.in-w>p:not(.kicker):not(.mono){color:var(--fx-snow2)!important}
.fx-body .dark .pulse-offer-note a{color:var(--fx-snow)!important}

/* ---------- 1 · the hero is a scene ------------------------------------------------------------------------------------------ */
.fx-body .page-hero.fx-scene{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:min(88svh,900px);
  padding-block:clamp(56px,8vw,112px);color:var(--fx-snow2)!important;
  background:radial-gradient(60% 70% at 72% 40%,color-mix(in srgb,var(--fx-glow) 26%,transparent),transparent 70%),
    radial-gradient(45% 55% at 0% 100%,color-mix(in srgb,var(--fx-glow2) 22%,transparent),transparent 70%),var(--fx-deep)!important}
.fx-scene>.grain{z-index:3!important;opacity:.11!important;pointer-events:none}
.fx-scene .hero-v-in{position:static!important;display:block!important;width:100%}
.fx-scene .hero-v-in>div:first-child{position:relative;z-index:2;max-width:min(600px,46%)}
.fx-scene .kicker{color:var(--fx-acc-d)!important}
.fx-scene h1{color:var(--fx-snow)!important}
.fx-scene h1 em{color:var(--fx-acc-d)!important}
.fx-scene .lead{color:var(--fx-snow2)!important;max-width:34em}
.fx-scene .lead .need{color:var(--fx-snow)!important;font-weight:600}
.fx-scene .trust{color:var(--fx-snow2)!important}
.fx-scene .trust span{color:inherit!important;background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.14)!important}
.fx-scene .row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.fx-scene .row .btn{background:var(--fx-btn)!important;color:var(--fx-btn-ink)!important;border-color:var(--fx-btn)!important;border-radius:999px!important}
.fx-link{color:var(--fx-snow)!important;font-weight:500;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);text-underline-offset:6px}
.fx-link:hover{text-decoration-color:currentColor}
/* Pulse: the strongest image bleeds to the right edge, top and bottom; the scene fades into the entity's ink */
.fx-scene>.in-w>figure.marco{position:absolute!important;z-index:1;top:0;right:0;bottom:0;left:auto;width:60%;height:auto!important;aspect-ratio:auto!important;
  margin:0;border-radius:0!important;box-shadow:none!important;background:var(--fx-deep)!important;padding:clamp(18px,2.4vw,32px);align-items:flex-end;justify-content:flex-end;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%);mask-image:linear-gradient(90deg,transparent 0,#000 34%)}
.fx-scene>.in-w>figure.marco::before{display:none!important}
.fx-scene>.in-w>figure.marco::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,color-mix(in srgb,var(--fx-deep) 55%,transparent) 0,transparent 26%,transparent 62%,color-mix(in srgb,var(--fx-deep) 80%,transparent) 100%)}
.fx-scene>.in-w>figure.marco .marco-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;filter:saturate(1.04) contrast(1.04)}
.fx-scene>.in-w>figure.marco .marco-k{position:relative;z-index:2;text-align:right;font-size:clamp(1rem,1.5vw,1.3rem)}
.fx-scene>.in-w>figure.marco .marco-ia{position:relative;z-index:2;text-align:right}
.fx-scene>.in-w>figure.marco .marco-bot{position:absolute;z-index:2;left:auto;right:clamp(18px,2.4vw,32px);top:auto;bottom:clamp(70px,8vw,96px);width:clamp(84px,9vw,128px)}
/* BUZZ: the before/after is the result; it bleeds to the right edge over a blurred atmosphere of the same piece */
.fx-bg{position:absolute;inset:-40px;z-index:0;pointer-events:none;overflow:hidden}
.fx-bg img{width:100%;height:100%;object-fit:cover;filter:blur(38px) saturate(1.25) brightness(.55);opacity:.55;transform:scale(1.1)}
.fx-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--fx-deep) 0,color-mix(in srgb,var(--fx-deep) 82%,transparent) 42%,transparent 80%)}
.fx-scene .hero-v-in>figure.buzz-compare{position:absolute!important;z-index:1;top:0;right:0;bottom:0;width:min(50%,760px);margin:0;display:flex;flex-direction:column}
.fx-scene .buzz-compare-frame{flex:1;aspect-ratio:auto!important;height:100%;border-radius:0!important;box-shadow:none!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%);mask-image:linear-gradient(90deg,transparent 0,#000 12%)}
.fx-scene .buzz-compare-frame::before{top:24px;left:56px}.fx-scene .buzz-compare-frame::after{bottom:96px;right:24px}
.fx-scene .buzz-compare-char{width:clamp(84px,9vw,128px)!important;right:24px!important;bottom:120px!important}
.fx-scene .buzz-compare-range{position:absolute;z-index:5;left:56px;right:24px;bottom:44px;margin:0;padding:8px 14px;border-radius:999px;background:color-mix(in srgb,var(--fx-deep) 72%,transparent);backdrop-filter:blur(6px);color:var(--fx-snow)!important}
.fx-scene .buzz-compare figcaption{position:absolute;z-index:5;left:56px;right:24px;bottom:12px;margin:0;color:var(--fx-snow2)!important;font-size:.68rem;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.fx-scene .buzz-tag{z-index:5}
.fx-scene .buzz-tag--a{left:56px!important}
@media (max-width:860px){
  .fx-body .page-hero.fx-scene{display:block;min-height:0;padding-top:0}
  .fx-scene .hero-v-in>div:first-child{max-width:none}
  .fx-scene>.in-w>figure.marco{position:relative!important;width:auto;height:min(56svh,460px)!important;margin:0 calc(-1 * clamp(16px,5vw,64px)) -64px;
    -webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent);order:-1;align-self:stretch}
  .fx-scene .hero-v-in{display:flex!important;flex-direction:column}
  .fx-scene>.in-w>figure.marco .marco-bot{bottom:84px}
  .fx-scene>.in-w>figure.marco .marco-k,.fx-scene>.in-w>figure.marco .marco-ia{margin-bottom:56px}
  .fx-scene .hero-v-in>figure.buzz-compare{position:relative!important;width:auto;align-self:stretch;order:-1;margin:0 calc(-1 * clamp(16px,5vw,64px)) 28px}
  .fx-scene .buzz-compare-frame{height:auto;aspect-ratio:4/5!important;max-height:72svh;-webkit-mask-image:none;mask-image:none}
  .fx-scene .buzz-compare-frame::before{left:16px}.fx-scene .buzz-tag--a{left:16px!important}
  .fx-scene .buzz-compare-range{left:16px;right:16px;bottom:40px}
  .fx-scene .buzz-compare figcaption{left:16px;right:16px;bottom:8px}
  .fx-scene .buzz-compare-char{bottom:96px!important;right:16px!important}
}

/* ---------- 2 · each example is a Black Box delivery ------------------------------------------------------------------------- */
.fx-body .fx-box{position:relative;isolation:isolate;align-self:start;padding:12px 14px 16px;border-radius:24px;color:var(--fx-snow2);
  background:radial-gradient(80% 50% at 85% 0%,color-mix(in srgb,var(--sa,var(--fx-glow)) 16%,transparent),transparent 70%),linear-gradient(180deg,var(--fx-box),var(--fx-box2));
  box-shadow:0 0 0 1px rgba(255,255,255,.09),0 50px 100px -50px rgba(0,0,0,.75),0 0 80px -30px color-mix(in srgb,var(--sa,var(--fx-glow)) 40%,transparent)}
.fx-body .fx-box::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background-image:var(--grain);opacity:.07;mix-blend-mode:overlay}
.fx-body .fx-box--wide{margin-block:6px 18px}
.fx-body .fx-bar{display:flex!important;align-items:center;gap:12px;margin:0 0 14px!important;padding:4px 6px 12px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.1)!important;
  font:500 .68rem/1.35 var(--mono)!important;letter-spacing:.1em!important;text-transform:uppercase;color:rgba(255,255,255,.66)!important;opacity:1!important}
.fx-bar .fx-dots{display:inline-flex;gap:6px;flex:none}
.fx-bar .fx-dots i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.2)}
.fx-bar .fx-dots i:first-child{background:var(--sa,var(--fx-acc-d))}
.fx-bar b{color:var(--fx-acc-d);font-weight:600;white-space:nowrap}
.fx-bar>span:last-child{margin-left:auto;text-align:right}
.fx-box .note,.fx-box .spec-note,.fx-box .nf-nota,.fx-box figcaption:not(.marco-k){color:rgba(255,255,255,.66)!important}
.fx-box .buzz-pane-cap{color:var(--fx-snow2)!important}
.fx-box .buzz-pane-cap b{color:var(--fx-snow)!important}
.fx-box .dl-steps button,.fx-box .buzz-step-list button{color:var(--fx-snow2)!important;border-color:rgba(255,255,255,.18)!important;background:rgba(255,255,255,.04)!important}
.fx-box .dl-steps button[aria-current],.fx-box .buzz-step-list button[aria-current]{color:var(--fx-btn-ink)!important;background:var(--fx-btn)!important;border-color:var(--fx-btn)!important}
.fx-box .dl-steps button i,.fx-box .buzz-step-list button i{color:inherit!important;border-color:currentColor!important;background:transparent!important}
.fx-box .buzz-log{color:var(--fx-snow2)}
.fx-body .fx-box .rep-c h3 i{color:var(--fx-acc-d)}
.fx-box .buzz-log b{color:var(--fx-snow)}
/* the character presents the piece */
.fx-say{display:flex;align-items:flex-end;gap:12px;margin:16px 2px 4px}
.fx-say-av{flex:none;width:58px;height:auto;filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}
.fx-say p{margin:0;padding:12px 16px;border-radius:18px 18px 18px 4px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  color:var(--fx-snow)!important;font-size:.95rem;line-height:1.55;max-width:62ch}
.fx-say p a{color:inherit}
@media (min-width:861px){
  .fx-body .pulse-service-copy,.fx-body .buzz-service-copy{position:sticky;top:calc(var(--bar-h,64px) + 28px)}
}

/* ---------- 3 · each family opens with its best result ----------------------------------------------------------------------- */
.fx-hook{display:grid;gap:14px;margin:0 0 18px}
.fx-hook .marcos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:12px;margin:0}
.fx-hook .marco{height:clamp(190px,22vw,300px);aspect-ratio:auto;border-radius:18px}
.fx-hook .note{margin:0;font-size:.8rem;opacity:.8}
.fx-hook .buzz-reels{display:grid;grid-template-columns:repeat(2,minmax(0,220px));gap:14px;margin:0}
.fx-hook .buzz-pause{justify-self:start}
.fx-hook .bot-info,.fx-hook .buzz-does{margin:0}
.fx-hook .does,.fx-hook .buzz-does{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:10px;margin:0;padding:0}
.dark .fx-hook .does li,.dark .fx-hook .buzz-does li{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.12)!important;color:var(--fx-snow2)!important}
.dark .fx-hook .does b,.dark .fx-hook .buzz-does b{color:var(--fx-snow)!important}
.dark .fx-hook .chans span{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.16)!important;color:var(--fx-snow)!important}
.dark .fx-hook .pulse-conversation summary{color:var(--fx-snow)}

/* ---------- 4 · «Cómo funciona»: a production sequence ----------------------------------------------------------------------- */
.fx-seq{--fx-p:0;position:relative;list-style:none;margin:clamp(48px,7vw,96px) 0 clamp(40px,6vw,80px);padding:0;display:grid;gap:clamp(48px,8vw,112px)}
.fx-seq::before,.fx-seq::after{content:"";position:absolute;left:21px;top:8px;bottom:8px;width:2px;border-radius:2px;background:rgba(255,255,255,.1)}
.fx-seq::after{bottom:auto;height:calc(var(--fx-p) * (100% - 16px));background:linear-gradient(180deg,var(--fx-acc-d),var(--sa,var(--fx-glow)))}
.fx-step{position:relative;margin:0;padding:0 0 0 clamp(64px,7vw,96px)!important;min-width:0}
.fx-step::before,.fx-step::marker{content:none!important}
.fx-step::after{content:"";position:absolute;z-index:1;left:12px;top:-2px;width:20px;height:20px;border-radius:50%;background:var(--fx-deep);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.22);transition:background .5s,box-shadow .5s}
.fx-step.is-on::after{background:var(--fx-acc-d);box-shadow:0 0 0 7px color-mix(in srgb,var(--fx-acc-d) 18%,transparent)}
.fx-step-k{margin:0 0 12px;font:500 .78rem/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--fx-acc-d)}
.fx-step-k .fx-n{display:inline-grid;place-items:center;min-width:2.3em;padding:.3em .5em;border-radius:6px;background:var(--fx-acc-d);color:var(--fx-deep);font-weight:600;letter-spacing:.04em;line-height:1;margin-right:2px}
.fx-step-l{margin:0 0 clamp(18px,2.4vw,28px);max-width:26ch;font:var(--fx-head-w) clamp(1.7rem,3.4vw,2.8rem)/1.08 var(--fx-head);letter-spacing:-.02em;color:var(--fx-snow);text-wrap:balance}
.fx-step-v{min-width:0}
.fx-step-v .neo-b{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px}
.fx-step-v .nfx{margin-top:0}
.fx-step-v .nfx-intro .nf-k,.fx-step-v .nfx-intro>p,.fx-step-v .nfx-bul,.fx-step-v .buzz-flow-intro .mono{display:none}
.fx-ask{display:flex;align-items:flex-end;gap:14px;max-width:640px}
.fx-ask img{flex:none;width:72px;height:auto;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5))}
.fx-ask-box{flex:1;display:grid;gap:14px;padding:18px 20px;border-radius:20px 20px 20px 6px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 30px 60px -30px rgba(0,0,0,.6)}
.fx-ask-t{font:var(--fx-head-s) var(--fx-head-w) clamp(1.3rem,2.4vw,1.8rem)/1.15 var(--fx-head);color:var(--fx-snow)}
.fx-ask-t::after{content:"";display:inline-block;width:2px;height:1em;margin-left:4px;vertical-align:-.12em;background:var(--fx-acc-d);animation:fx-caret 1.1s steps(1) infinite}
.fx-ask-ch{display:flex;flex-wrap:wrap;gap:8px}
.fx-ask-ch i{font:500 .7rem/1 var(--mono);font-style:normal;letter-spacing:.1em;text-transform:uppercase;padding:8px 12px;border-radius:999px;color:var(--fx-snow2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.fx-ask-ch i:first-child{color:var(--fx-btn-ink);background:var(--fx-acc-d);box-shadow:none}
@keyframes fx-caret{50%{opacity:0}}
.fx-neo-cta{align-items:center;margin-top:clamp(24px,4vw,48px)}
.fx-neo-top{align-items:center}
@media (max-width:860px){.fx-seq::before,.fx-seq::after{left:13px}.fx-step::after{left:4px}.fx-step{padding-left:44px!important}}

/* scenes arrive softly as you scroll (never hidden without the script, never animated with reduced motion) */
@media (prefers-reduced-motion:no-preference){
  .fx-js .fx-step .fx-step-h,.fx-js .fx-step .fx-step-v{transition:opacity .9s cubic-bezier(.2,.7,.2,1),translate .9s cubic-bezier(.2,.7,.2,1)}
  .fx-js .fx-step .fx-step-v{transition-delay:.12s}
  .fx-js .fx-step:not(.is-seen) .fx-step-h,.fx-js .fx-step:not(.is-seen) .fx-step-v{opacity:0;translate:0 26px}
}
@media (prefers-reduced-motion:reduce){.fx-ask-t::after{animation:none}.fx-step::after{transition:none}}
@media print{.fx-bg,.fx-box::before{display:none}}

/* ---------- owner, 29-oct: every step demo advances with the scroll (fusion.js builds the tracks; nothing changes without it) ---- */
.fx-track{position:relative;min-width:0}
/* a held stage that changes height between steps must not make the browser re-anchor the scroll (it would undo the step) */
.fx-js body.fx-body{overflow-anchor:none}
.fx-spacer{pointer-events:none}
.fx-body .fx-held{position:sticky!important;top:var(--fx-top,80px);z-index:2}
@media (min-width:861px){.fx-body .fx-stick{position:sticky;top:var(--fx-top,80px);align-self:start}}
/* the hero before/after (BUZZ) is held while the scroll moves it from the photo to the video */
.fx-scene>.fx-pin{position:relative;width:100%}
@media (min-width:861px){
  .fx-body .fx-scene.fx-hold{padding:0!important}
  .fx-scene.fx-hold>.fx-pin{display:flex;align-items:center;min-height:min(88svh,900px);padding:clamp(56px,8vw,112px) clamp(16px,5vw,64px)}
  .fx-js .fx-body .fx-scene.fx-holding{display:block!important;min-height:0!important;height:calc(var(--fx-ph) + var(--fx-extra))!important;overflow:clip!important}
  .fx-js .fx-scene.fx-holding>.fx-pin{position:sticky;top:var(--fx-htop,0px);height:var(--fx-ph);min-height:0}
}

/* ---------- blurred transparency, only where an element sits over another (owner, 29-oct) ---------- */
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .fx-body header.bar{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .fx-body header.bar::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:rgba(247,251,250,0.9);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
  @media (max-width:1024px){.fx-body.menu-open header.bar :is(.nav,nav),.fx-body header.bar nav.open{background:rgba(247,251,250,.9)!important;-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}}
  .fx-body .ba-tag{-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
}
@media (prefers-reduced-transparency:reduce){
  .fx-body header.bar::before{background:rgb(247,251,250);-webkit-backdrop-filter:none;backdrop-filter:none}
  .fx-body.menu-open header.bar :is(.nav,nav),.fx-body header.bar nav.open{background:rgb(247,251,250)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
  .fx-body .ba-tag{-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ---- media (29-oct): new pieces wired from the media plan; a scene video takes over its photo as you scroll ---- */
.fx-vid{display:none}
.fx-js .fx-vid{display:block;position:absolute;left:0;top:0;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;object-fit:cover;opacity:0;pointer-events:none;background:transparent}
.fx-fig{position:relative;margin:0 0 18px;border-radius:14px;overflow:hidden;aspect-ratio:16/9;max-width:960px;background:rgba(0,0,0,.25)}
.fx-fig img{display:block;width:100%;height:100%;object-fit:cover}
.fx-fig::after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.72));pointer-events:none}
.fx-fig figcaption{position:absolute;z-index:1;left:14px;right:14px;bottom:10px;color:#fff;font-size:.92rem;font-weight:600;line-height:1.3}
.fx-fig figcaption small{display:block;margin-top:3px;font-size:.62rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;opacity:.86}
.fx-hook>.fx-fig{margin:0}
@media (max-width:620px){.fx-fig{aspect-ratio:3/2}}
.fx-ba{--x:50%;touch-action:pan-y;cursor:ew-resize;user-select:none;-webkit-user-select:none}
.fx-ba .fx-ba-d{position:absolute;inset:0;clip-path:inset(0 0 0 var(--x))}
.fx-ba .fx-ba-line{position:absolute;z-index:1;top:0;bottom:0;left:var(--x);width:2px;margin-left:-1px;background:rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(0,0,0,.2);pointer-events:none}
.fx-ba .hv-tag{white-space:normal;max-width:calc(50% - 15px);line-height:1.25}
.fx-ba .hv-tag.fx-ba-td{left:auto;right:10px}
.fx-ba img{pointer-events:none}
.pn .fx-sb-gen{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;opacity:0;filter:none!important;transition:opacity .5s}
.panel .pn img.fx-sb{filter:none}
.fx-spec{display:block;margin-top:2px;font-size:.92em;opacity:.85}
.demo[data-step="4"] .board .panel:first-child .pn .fx-sb-gen,.board-w.is-final .panel:first-child .pn .fx-sb-gen{opacity:1}