
:root{
  color-scheme: dark;
  --spx-bg:#04060d;
  --spx-panel:#0a0f1b;
  --spx-panel-2:#0e1527;
  --spx-border:rgba(255,255,255,.1);
  --spx-text:#edf4ff;
  --spx-muted:rgba(205,220,246,.75);
  --spx-cyan:#7ddcff;
  --spx-pink:#c06cff;
  --spx-gold:#ffc770;
  --spx-green:#75f3b0;
  --spx-red:#ff798b;
  --spx-shadow:0 24px 90px rgba(0,0,0,.45);
  --spx-ease:cubic-bezier(.22,.61,.36,1);
  --safeT: env(safe-area-inset-top, 0px);
  --safeB: env(safe-area-inset-bottom, 0px);
  --safeL: env(safe-area-inset-left, 0px);
  --safeR: env(safe-area-inset-right, 0px);
}
*{box-sizing:border-box}
html,body{min-height:100%}
body.spx-prealpha{margin:0;background:var(--spx-bg);color:var(--spx-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overflow-x:hidden;overflow-y:auto}
#spxScene{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.spx-shell{position:relative;z-index:1;min-height:100svh;padding:calc(22px + var(--safeT)) calc(26px + var(--safeR)) calc(34px + var(--safeB)) calc(26px + var(--safeL))}
.spx-pageFade{opacity:0;transform:translateY(18px);filter:blur(10px);animation:spxPageIn .7s var(--spx-ease) .04s forwards}
body.is-transitioning .spx-pageFade{animation:none;opacity:0;transform:translateY(22px);filter:blur(8px);transition:opacity .28s var(--spx-ease),transform .36s var(--spx-ease),filter .36s var(--spx-ease)}
body.spx-prealpha::after{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 42%, rgba(255,255,255,.08), rgba(4,6,13,0) 52%), linear-gradient(180deg, rgba(3,5,10,0), rgba(3,5,10,0));opacity:0;transition:opacity .34s var(--spx-ease);z-index:999;}
body.spx-prealpha.is-transitioning::after{opacity:1;background:radial-gradient(circle at 50% 42%, rgba(255,255,255,.06), rgba(3,5,10,.12) 36%, rgba(3,5,10,.56) 100%);}
@keyframes spxPageIn{to{opacity:1;transform:none;filter:none}}
.spx-topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:1280px;margin:0 auto}
.spx-brand{display:inline-flex;align-items:center;gap:10px;padding:12px 15px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(8,13,24,.4);backdrop-filter:blur(14px);color:inherit;text-decoration:none;box-shadow:0 8px 30px rgba(0,0,0,.18)}
.spx-brandDot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--spx-cyan),var(--spx-pink));box-shadow:0 0 14px rgba(125,220,255,.35),0 0 18px rgba(192,108,255,.2)}
.spx-brandWord{font-size:13px;font-weight:950;letter-spacing:.24em}
.spx-brandTag{font-size:11px;font-weight:800;letter-spacing:.12em;color:rgba(231,238,255,.7);padding-left:10px;border-left:1px solid rgba(255,255,255,.12)}
.spx-topActions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.spx-main{max-width:1280px;margin:0 auto}
.spx-heroShell{max-width:960px;margin:clamp(44px,8vh,96px) auto 0;text-align:center;padding-bottom:24px}
.spx-kicker,.spx-panelKicker{font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:rgba(229,238,255,.8)}
.spx-h1{margin:18px 0 14px;font-size:clamp(44px,7vw,84px);line-height:.97;letter-spacing:-.06em;font-weight:1000;text-wrap:balance}
.spx-h1 .accent{background:linear-gradient(135deg,var(--spx-cyan),#cbd1ff 48%,var(--spx-pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.spx-lead{max-width:860px;margin:0 auto;color:var(--spx-muted);font-size:18px;line-height:1.85;font-weight:600;text-wrap:pretty}
.spx-heroActions{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px}
.spx-noteLine{margin-top:14px;color:rgba(216,226,245,.65);font-size:14px;font-weight:700}
.spx-btn{appearance:none;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.055);color:var(--spx-text);padding:13px 18px;border-radius:16px;font-size:14px;font-weight:850;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;transition:transform .25s var(--spx-ease),border-color .25s var(--spx-ease),background .25s var(--spx-ease),box-shadow .25s var(--spx-ease)}
.spx-btn:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.08);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.spx-btn.primary{background:linear-gradient(135deg, rgba(125,220,255,.14), rgba(192,108,255,.18));border-color:rgba(144,215,255,.25);box-shadow:0 12px 36px rgba(60,96,196,.18)}
.spx-btn.ghost{background:rgba(6,10,19,.25)}
.spx-btn.small{padding:11px 14px;border-radius:14px;font-size:13px}
.spx-previewStage{position:relative;max-width:1160px;margin:34px auto 0;padding:12px 0 0}
.spx-previewGlow{position:absolute;left:50%;top:20%;width:min(920px,92vw);height:360px;transform:translateX(-50%);background:radial-gradient(circle, rgba(255,205,120,.12), rgba(166,115,255,.08) 34%, transparent 74%);filter:blur(42px);pointer-events:none;z-index:0}
.spx-previewBrowser{position:relative;z-index:1;max-width:1120px;margin:0 auto;border-radius:28px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(12,17,31,.96), rgba(5,9,18,.99));box-shadow:0 34px 110px rgba(0,0,0,.52);overflow:hidden;transform:translateY(0);opacity:.84;filter:saturate(.78) brightness(.62);transition:transform .7s var(--spx-ease),opacity .7s var(--spx-ease),filter .7s var(--spx-ease),box-shadow .7s var(--spx-ease)}
.spx-previewBrowser:hover{transform:translateY(-10px);opacity:1;filter:saturate(1) brightness(1);box-shadow:0 42px 120px rgba(0,0,0,.62)}
.spx-browserBar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02))}
.spx-browserLeft{display:flex;gap:8px;align-items:center}
.spx-browserDot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.22)}
.spx-browserDot.red{background:#ff6f88}.spx-browserDot.gold{background:#ffc875}.spx-browserDot.green{background:#65f5ae}
.spx-browserUrl{flex:1;min-width:0;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:rgba(220,229,247,.75);font-size:13px;font-weight:700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.spx-previewMedia{position:relative;aspect-ratio:16/9;background:linear-gradient(180deg,#0b1021,#070b16);padding:0;display:block}
.spx-previewMedia::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,.03), transparent 18%, rgba(0,0,0,.22));pointer-events:none}
.spx-previewMedia img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain;object-position:center center;background:#050914;border-radius:0;box-shadow:none}
.spx-previewCaption{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 22px 20px;color:rgba(214,226,248,.78);font-size:14px;font-weight:700;background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01))}
.spx-section{max-width:1240px;margin:46px auto 0;display:grid;grid-template-columns:1.04fr .96fr;gap:18px}
.spx-sectionTight{margin-top:30px}
.spx-panel{border-radius:28px;border:1px solid var(--spx-border);background:linear-gradient(180deg, rgba(11,17,30,.84), rgba(6,10,22,.94));backdrop-filter:blur(16px);box-shadow:var(--spx-shadow);padding:28px;position:relative;overflow:hidden}
.spx-panelAccent{background:linear-gradient(180deg, rgba(12,18,35,.90), rgba(8,11,25,.98)), radial-gradient(circle at top right, rgba(127,220,255,.10), transparent 34%)}
.spx-panel h2{margin:10px 0 10px;font-size:clamp(28px,4vw,38px);line-height:1.08;letter-spacing:-.04em}
.spx-panel p{margin:0;color:var(--spx-muted);line-height:1.82;font-weight:600}
.spx-gridPoints{display:grid;gap:12px;margin-top:18px}
.spx-feature{padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.spx-feature b{display:block;font-size:15px;margin-bottom:6px}
.spx-feature span{color:var(--spx-muted);font-size:14px;line-height:1.7;font-weight:600}
.spx-steps{display:grid;gap:12px;margin-top:18px}
.spx-step{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.spx-step span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg, rgba(125,220,255,.16), rgba(192,108,255,.16));border:1px solid rgba(255,255,255,.08);font-size:12px;font-weight:900;letter-spacing:.16em}
.spx-step b{display:block;margin-bottom:4px}.spx-step small{display:block;color:var(--spx-muted);font-size:14px;line-height:1.7;font-weight:600}
.spx-footer{max-width:1240px;margin:34px auto 0;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:rgba(197,209,233,.72);font-size:14px;font-weight:700;padding-bottom:34px}
.spx-footerLinks{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.spx-footer a,.spx-linkBtn{color:inherit;text-decoration:none}
.spx-linkBtn{appearance:none;border:0;background:none;padding:0;cursor:pointer;font:inherit;border-bottom:1px solid rgba(255,255,255,.12)}
.spx-footer a{border-bottom:1px solid rgba(255,255,255,.12)}
.spx-modal{position:fixed;inset:0;display:grid;place-items:center;padding:20px;z-index:44;opacity:0;pointer-events:none;transition:opacity .28s var(--spx-ease)}
.spx-modal.show{opacity:1;pointer-events:auto}
.spx-modalShade{position:absolute;inset:0;background:rgba(2,5,14,.74);backdrop-filter:blur(10px)}
.spx-modalCard{position:relative;z-index:1;width:min(940px,100%);max-height:min(86svh,860px);overflow:auto;border-radius:28px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(11,16,30,.96), rgba(6,10,20,.98));box-shadow:0 30px 100px rgba(0,0,0,.58);padding:28px}
.spx-legalModalCard{width:min(1040px,100%)}
.spx-modalHead{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:18px}
.spx-modalHead h3{margin:0;font-size:30px;line-height:1.08;letter-spacing:-.03em}
.spx-modalClose{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:var(--spx-text);width:42px;height:42px;border-radius:14px;font-size:20px;cursor:pointer}
.spx-faq{display:grid;gap:14px}.spx-faqItem{padding:18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}.spx-faqItem b{display:block;font-size:16px;margin-bottom:8px}.spx-faqItem p{margin:0;color:var(--spx-muted);font-size:15px;line-height:1.8}
.spx-legalTabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.spx-legalTab{appearance:none;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.05);color:var(--spx-text);padding:10px 14px;border-radius:999px;cursor:pointer;font-size:13px;font-weight:800}
.spx-legalTab.is-active{background:linear-gradient(135deg, rgba(125,220,255,.14), rgba(192,108,255,.18));border-color:rgba(125,220,255,.24)}
.spx-legalBody{display:grid;gap:12px}
.spx-legalLoading{padding:24px;border-radius:18px;border:1px dashed rgba(255,255,255,.16);color:var(--spx-muted);font-weight:700;text-align:center}
.spx-legalBody .card{border:0;background:transparent;box-shadow:none;padding:0;color:var(--spx-text)}
.spx-legalBody .meta{color:var(--spx-muted)}
.spx-legalBody h1,.spx-legalBody h2,.spx-legalBody h3{color:var(--spx-text)}
.spx-legalBody p,.spx-legalBody li,.spx-legalBody .foot{color:var(--spx-muted);line-height:1.8}
.spx-legalBody ul{padding-left:20px}
.spx-legalBody .foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:18px;border-top:1px solid rgba(255,255,255,.08)}
.spx-legalBody .foot a{color:inherit}
[data-reveal]{opacity:0;transform:translateY(24px);filter:blur(8px);transition:opacity .8s var(--spx-ease),transform .8s var(--spx-ease),filter .8s var(--spx-ease)}
[data-reveal].is-visible{opacity:1;transform:none;filter:none}
.spx-authPage .spx-shell{display:flex;flex-direction:column}
.spx-authWrap{max-width:1180px;width:100%;margin:48px auto 0;display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.spx-authCard{width:min(640px,100%);justify-self:center;border-radius:30px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(12,17,33,.9), rgba(6,10,20,.96));backdrop-filter:blur(16px);box-shadow:var(--spx-shadow);padding:26px;position:relative;overflow:hidden}
.spx-authCard::before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 50% 0%, rgba(255,201,132,.08), transparent 30%),radial-gradient(circle at 100% 0%, rgba(103,216,255,.08), transparent 32%);pointer-events:none}
.spx-authTabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.spx-authTab{appearance:none;border:0;background:transparent;color:rgba(223,231,247,.72);padding:12px 16px;border-radius:14px;font-size:15px;font-weight:900;cursor:pointer;transition:all .28s var(--spx-ease)}
.spx-authTab.is-active{background:linear-gradient(135deg, rgba(101,245,174,.14), rgba(103,216,255,.14));color:var(--spx-text);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.spx-authPanels{position:relative;min-height:470px;margin-top:18px}.spx-authPanel{position:absolute;inset:0;opacity:0;transform:translateX(26px);pointer-events:none;transition:opacity .42s var(--spx-ease),transform .42s var(--spx-ease)}.spx-authPanel.is-active{opacity:1;transform:translateX(0);pointer-events:auto}.spx-authPanel.is-exit{transform:translateX(-26px)}
.spx-authTitle{font-size:34px;font-weight:1000;line-height:1.05;letter-spacing:-.04em;margin:0 0 10px;position:relative;z-index:1}.spx-authSub{margin:0 0 18px;color:var(--spx-muted);font-size:15px;line-height:1.8;font-weight:600;position:relative;z-index:1}
.spx-form{display:grid;gap:14px;position:relative;z-index:1}.spx-field{display:grid;gap:8px}.spx-field label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:900;color:rgba(226,234,250,.66)}
.spx-input,.spx-textarea,.spx-select{width:100%;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:var(--spx-text);font-size:15px;font-weight:700;outline:none;transition:border-color .25s var(--spx-ease),background .25s var(--spx-ease),box-shadow .25s var(--spx-ease),transform .25s var(--spx-ease)}
.spx-input:focus,.spx-textarea:focus,.spx-select:focus{border-color:rgba(103,216,255,.42);background:rgba(255,255,255,.08);box-shadow:0 0 0 4px rgba(103,216,255,.08)}
.spx-inputRow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.spx-authActions{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:6px}.spx-authLinks{display:flex;gap:10px;flex-wrap:wrap}
.spx-statusCard{display:none;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.12);font-size:14px;font-weight:700;line-height:1.6;margin-top:8px}.spx-statusCard.show{display:block}.spx-statusCard.ok{border-color:rgba(101,245,174,.36);background:rgba(101,245,174,.09)}.spx-statusCard.bad{border-color:rgba(255,117,134,.36);background:rgba(255,117,134,.09)}.spx-statusCard.warn{border-color:rgba(255,200,117,.36);background:rgba(255,200,117,.08)}
.spx-authHelper{display:grid;gap:12px;margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);position:relative;z-index:1}.spx-authHelper strong{font-size:15px}.spx-authHelper p{margin:0;color:var(--spx-muted);font-size:14px;line-height:1.7;font-weight:600}.spx-authLegalLinks{padding-top:4px}
.spx-forgotBox{display:none;margin-top:16px;padding:16px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}.spx-forgotBox.show{display:block}.spx-inlineHint{color:rgba(205,216,240,.62);font-size:13px;font-weight:700;line-height:1.7}
@media (max-width:920px){.spx-shell{padding-inline:16px}.spx-section{grid-template-columns:1fr}.spx-authCard{padding:22px}.spx-inputRow{grid-template-columns:1fr}.spx-previewStage{padding-inline:0}.spx-browserUrl{font-size:12px;padding:9px 12px}}
@media (max-width:640px){.spx-topbar{align-items:flex-start}.spx-topActions{width:100%;justify-content:flex-start}.spx-btn{width:100%;justify-content:center}.spx-previewCaption{font-size:13px}.spx-authTabs{grid-template-columns:1fr}.spx-authPanels{min-height:560px}.spx-h1{font-size:clamp(34px,12vw,58px)}.spx-previewMedia{padding:0}.spx-footer{font-size:13px;width:calc(100vw - 20px);left:50%;transform:translateX(-50%)}}

/* --- v9 cinematic polish overrides --- */
body.spx-prealpha{background:#02050b}
.spx-shell{padding-top:calc(18px + var(--safeT))}
.spx-topbar{max-width:1320px}
.spx-brand{gap:12px;padding:11px 16px;background:linear-gradient(180deg, rgba(8,14,28,.72), rgba(5,9,18,.58));box-shadow:0 12px 32px rgba(0,0,0,.28)}
.spx-brandLogo{width:28px;height:28px;display:block;object-fit:contain;filter:drop-shadow(0 0 12px rgba(116,206,255,.22))}
.spx-brandDot{display:none}
.spx-brandWord{font-size:13px;letter-spacing:.22em}
.spx-brandTag{font-size:10px;letter-spacing:.18em}
.spx-topActions .spx-btn.top{min-width:112px;padding:11px 16px;border-radius:999px;background:rgba(8,13,24,.48);border-color:rgba(149,176,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 12px 30px rgba(0,0,0,.18)}
.spx-topActions .spx-btn.top.primary{background:linear-gradient(135deg, rgba(81,140,255,.22), rgba(184,90,255,.22));border-color:rgba(141,176,255,.26);box-shadow:0 14px 38px rgba(76,80,205,.22)}
.spx-topActions .spx-btn.top.ghost{background:rgba(8,13,24,.38)}

.spx-heroShell{max-width:980px;margin-top:clamp(40px,7vh,84px)}
.spx-wordmarkWrap{margin-top:18px}
.spx-wordmark{
  margin:0;
  font-size:clamp(80px,11.6vw,162px);
  line-height:.88;
  letter-spacing:-.08em;
  font-weight:1000;
  position:relative;
  display:inline-block;
  background-image:
    linear-gradient(112deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 42%,
      rgba(255,255,255,.08) 46%,
      rgba(255,255,255,.92) 49%,
      rgba(255,255,255,.34) 52%,
      rgba(255,255,255,0) 58%,
      rgba(255,255,255,0) 100%),
    linear-gradient(92deg,
      #d8e5ff 0%,
      #8bdcff 18%,
      #8a86ff 42%,
      #ba7fff 66%,
      #ff76d6 86%,
      #ffd6f4 100%);
  background-size:230% 100%, 100% 100%;
  background-position:-180% 50%, 50% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:
    0 0 16px rgba(64,132,255,.10),
    0 0 42px rgba(113,94,255,.08),
    0 0 72px rgba(255,96,212,.06);
  animation:spxWordmarkShine 10s cubic-bezier(.22,.61,.36,1) infinite;
}
.spx-wordmark::after{
  content:'';
  position:absolute;
  left:50%;
  top:48%;
  transform:translate(-50%,-50%);
  width:74%;
  height:66%;
  background:radial-gradient(circle,
    rgba(74,124,255,.18) 0%,
    rgba(120,98,255,.13) 34%,
    rgba(255,96,208,.10) 58%,
    rgba(0,0,0,0) 76%);
  filter:blur(26px);
  z-index:-1;
  animation:spxGlowPulse 7.6s ease-in-out infinite;
}
@keyframes spxWordmarkShine{
  0%,76%{background-position:-180% 50%, 50% 50%;}
  87%{background-position:130% 50%, 50% 50%;}
  100%{background-position:130% 50%, 50% 50%;}
}
@keyframes spxGlowPulse{0%,100%{opacity:.75;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}
.spx-tagline{margin:12px 0 0;font-size:clamp(16px,1.55vw,22px);line-height:1.15;letter-spacing:.12em;font-weight:900;color:rgba(206,220,246,.82);text-transform:none}
.spx-kicker{color:rgba(200,216,247,.78)}
.spx-lead{max-width:860px;font-size:18px;line-height:1.95;color:rgba(212,224,245,.82)}
.spx-noteLine{color:rgba(190,204,232,.60)}
.spx-heroActions .spx-btn{min-width:148px;border-radius:999px;padding:14px 20px}

.spx-previewStage{max-width:1220px;margin-top:38px}
.spx-previewBrowser{max-width:1180px;border-radius:30px;opacity:.90;filter:saturate(.82) brightness(.68);background:linear-gradient(180deg, rgba(10,14,24,.94), rgba(5,8,15,.98))}
.spx-previewBrowser:hover{opacity:1;filter:saturate(1) brightness(1)}
.spx-browserBar{position:absolute;left:0;right:0;top:0;z-index:2;padding:14px 18px;background:linear-gradient(180deg, rgba(6,10,18,.72), rgba(6,10,18,.28), rgba(6,10,18,0));backdrop-filter:blur(8px);border-bottom:0}
.spx-previewMedia{aspect-ratio:auto;background:transparent;overflow:hidden}
.spx-previewMedia::before{display:none}
.spx-previewMedia img{display:block;width:100%;height:auto;object-fit:initial;background:transparent}

.spx-section{margin-top:34px;grid-template-columns:1fr 1fr}
.spx-panel,.spx-feature,.spx-step{transition:transform .45s var(--spx-ease),border-color .32s var(--spx-ease),background .32s var(--spx-ease),box-shadow .32s var(--spx-ease)}
.spx-panel:hover{transform:translateY(-4px);border-color:rgba(136,176,255,.18)}

.spx-authModalCard{width:min(820px,100%);padding:24px 24px 28px;background:linear-gradient(180deg, rgba(10,15,28,.94), rgba(5,9,18,.98));overflow:hidden}
.spx-authModal .spx-authWrap{margin:0;max-width:none}
.spx-authModal .spx-authCard{width:100%;background:transparent;border:0;box-shadow:none;padding:0;backdrop-filter:none}
body.spx-authOpen{overflow:hidden}

@media (max-width:920px){
  .spx-wordmark{font-size:clamp(60px,16vw,110px)}
  .spx-tagline{font-size:clamp(16px,4vw,22px)}
  .spx-section{grid-template-columns:1fr}
}


/* v11 fixes */
.spx-heroShell,.spx-previewStage,.spx-section,.spx-footer{position:relative;z-index:2}
.spx-modal{visibility:hidden;display:none}
.spx-modal.show{visibility:visible;display:grid}
.spx-browserBar{pointer-events:none}
.spx-previewBrowser{overflow:hidden}
.spx-previewMedia{line-height:0}
.spx-previewMedia img{width:100%;height:auto;display:block}
.spx-lead{max-width:820px;font-size:18px;line-height:1.9;color:rgba(217,229,248,.86)}
.spx-wordmark{background-image:linear-gradient(112deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 42%, rgba(255,255,255,.08) 46%, rgba(255,255,255,.92) 49%, rgba(255,255,255,.34) 52%, rgba(255,255,255,0) 58%, rgba(255,255,255,0) 100%), linear-gradient(92deg,#d8e5ff 0%, #8bdcff 18%, #8a86ff 42%, #ba7fff 66%, #ff76d6 86%, #ffd6f4 100%);background-size:230% 100%, 100% 100%;background-position:-180% 50%, 50% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}


/* --- v5 UI polish pass --- */
.spx-wordmarkWrap{max-width:100%;overflow:visible}
.spx-wordmark{
  display:inline-block;
  overflow:visible;
  padding-right:.09em;
  background:linear-gradient(92deg,#d8e7ff 0%, #8fdcff 18%, #8b85ff 42%, #bd80ff 68%, #ff7ad3 88%, #ffd7ef 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:0 0 18px rgba(89,146,255,.10),0 0 44px rgba(124,95,255,.09),0 0 80px rgba(255,96,212,.07);
  animation:none;
}
.spx-wordmark::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  padding-right:.09em;
  background:linear-gradient(108deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,.10) 46%, rgba(255,255,255,.92) 50%, rgba(255,255,255,.18) 54%, rgba(255,255,255,0) 61%, rgba(255,255,255,0) 100%);
  background-size:220% 100%;
  background-position:-150% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:spxWordmarkSweep 10s cubic-bezier(.22,.61,.36,1) infinite;
  pointer-events:none;
}
@keyframes spxWordmarkSweep{0%,76%{background-position:-150% 50%}87%{background-position:130% 50%}100%{background-position:130% 50%}}
.spx-tagline{margin-top:16px;font-size:clamp(15px,1.35vw,20px);letter-spacing:.08em;color:rgba(214,226,248,.78)}
.spx-lead strong{color:#fff6d2;font-weight:900}
.spx-topActions .spx-btn.top,.spx-heroActions .spx-btn,.spx-authActions .spx-btn{
  position:relative;
  overflow:hidden;
  border-color:rgba(150,190,255,.18);
  background:linear-gradient(180deg, rgba(10,15,28,.68), rgba(6,10,18,.62));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 16px 40px rgba(0,0,0,.22);
}
.spx-topActions .spx-btn.top.primary,.spx-heroActions .spx-btn.primary,.spx-authActions .spx-btn.primary{
  background:linear-gradient(135deg, rgba(95,220,255,.18), rgba(126,120,255,.14) 42%, rgba(255,122,211,.18));
  border-color:rgba(146,205,255,.30);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 46px rgba(62,74,190,.26);
}
.spx-topActions .spx-btn.top::before,.spx-heroActions .spx-btn::before,.spx-authActions .spx-btn::before{
  content:'';
  position:absolute;inset:-140% auto -140% -45%;width:38%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.18), transparent);
  transform:rotate(12deg);
  transition:transform .9s var(--spx-ease), left .9s var(--spx-ease);
  pointer-events:none;
}
.spx-topActions .spx-btn.top:hover::before,.spx-heroActions .spx-btn:hover::before,.spx-authActions .spx-btn:hover::before{left:115%}
.spx-panel{
  background:linear-gradient(180deg, rgba(10,16,30,.90), rgba(6,10,20,.97));
  border-color:rgba(255,255,255,.10);
}
.spx-panel::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at top right, rgba(133,220,255,.10), transparent 30%),
             radial-gradient(circle at bottom left, rgba(190,114,255,.10), transparent 34%);
  opacity:.9;
}
.spx-panelAccent::before{
  background:radial-gradient(circle at top right, rgba(133,220,255,.16), transparent 30%),
             radial-gradient(circle at bottom left, rgba(255,124,208,.10), transparent 34%),
             linear-gradient(180deg, rgba(255,255,255,.03), transparent 22%);
}
.spx-feature,.spx-step{
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  border-color:rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 18px 30px rgba(0,0,0,.10);
}
.spx-feature b,.spx-step b{font-size:15px;letter-spacing:.01em}
.spx-feature span,.spx-step small{color:rgba(211,223,246,.76)}
.spx-step span{box-shadow:0 12px 28px rgba(67,86,205,.20)}
.spx-footer{
  position:relative;
  left:50%;
  transform:translateX(-50%);
  width:min(1380px, calc(100vw - 28px));
  max-width:none;
  margin-top:42px;
  padding:22px 24px 34px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(9,14,24,.62), rgba(5,9,18,.82));
  box-shadow:0 24px 60px rgba(0,0,0,.20);
}
.spx-footerBrand{display:flex;align-items:center;gap:14px;max-width:660px}
.spx-footerBrand img{width:34px;height:34px;display:block;object-fit:contain;filter:drop-shadow(0 0 14px rgba(123,212,255,.24))}
.spx-footerBrand strong{display:block;color:var(--spx-text);font-size:15px;letter-spacing:.02em}
.spx-footerBrand span{display:block;color:rgba(199,211,235,.70);font-size:13px;line-height:1.7;font-weight:700}
.spx-footerLinks{gap:14px}
.spx-linkBtn,.spx-footer a{border-bottom:0;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);transition:transform .24s var(--spx-ease),background .24s var(--spx-ease),border-color .24s var(--spx-ease)}
.spx-linkBtn:hover,.spx-footer a:hover{transform:translateY(-1px);background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12)}
.spx-modal{transition:opacity .32s var(--spx-ease),visibility .32s var(--spx-ease)}
.spx-modalShade{opacity:0;transition:opacity .32s var(--spx-ease),backdrop-filter .32s var(--spx-ease)}
.spx-modalCard{opacity:0;transform:translateY(28px) scale(.965);transition:opacity .34s var(--spx-ease),transform .42s var(--spx-ease),box-shadow .34s var(--spx-ease);background:linear-gradient(180deg, rgba(10,15,28,.97), rgba(5,9,18,.99));border-color:rgba(255,255,255,.12)}
.spx-modal.show .spx-modalShade{opacity:1}
.spx-modal.show .spx-modalCard{opacity:1;transform:translateY(0) scale(1)}
.spx-authModalCard{box-shadow:0 36px 110px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.06) inset}
.spx-authCard::before{background:radial-gradient(circle at 12% 0%, rgba(255,190,110,.11), transparent 30%),radial-gradient(circle at 100% 0%, rgba(103,216,255,.10), transparent 34%),radial-gradient(circle at 60% 100%, rgba(183,114,255,.08), transparent 35%)}
.spx-authPanels{min-height:500px}
#loginPanel.is-forgot #loginForm{display:none}
#loginPanel.is-forgot .spx-authSub{opacity:.8}
.spx-forgotBox{display:none;margin-top:0;padding:0;border:0;background:transparent}
#loginPanel.is-forgot .spx-forgotBox{display:grid;gap:14px}
.spx-forgotHead{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:4px}
.spx-forgotHead strong{font-size:16px;letter-spacing:.01em}
.spx-previewMedia img{margin-top:65px;width:100%;height:auto;display:block;object-fit:initial;background:transparent}
@media (max-width:920px){.spx-footer{padding-inline:18px}.spx-footerBrand{align-items:flex-start}.spx-previewMedia img{margin-top:40px}}


/* --- v6 modal/button/legal polish --- */
body.spx-prealpha{
  scrollbar-width:thin;
  scrollbar-color:rgba(138,192,255,.46) rgba(8,12,22,.64);
}
body.spx-prealpha::-webkit-scrollbar,
.spx-modalCard::-webkit-scrollbar,
.spx-legalBody::-webkit-scrollbar{
  width:12px;
  height:12px;
}
body.spx-prealpha::-webkit-scrollbar-track,
.spx-modalCard::-webkit-scrollbar-track,
.spx-legalBody::-webkit-scrollbar-track{
  background:linear-gradient(180deg, rgba(6,10,18,.85), rgba(11,16,28,.92));
  border-radius:999px;
}
body.spx-prealpha::-webkit-scrollbar-thumb,
.spx-modalCard::-webkit-scrollbar-thumb,
.spx-legalBody::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(124,220,255,.55), rgba(152,130,255,.52), rgba(255,118,214,.5));
  border:2px solid rgba(7,11,20,.9);
  border-radius:999px;
  box-shadow:0 0 18px rgba(124,220,255,.18);
}
body.spx-prealpha::-webkit-scrollbar-thumb:hover,
.spx-modalCard::-webkit-scrollbar-thumb:hover,
.spx-legalBody::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg, rgba(132,228,255,.72), rgba(166,141,255,.7), rgba(255,129,220,.68));
}

.spx-h1 .accent,
.spx-wordmark{
  background-image:
    linear-gradient(90deg, #e4efff 0%, #9fe3ff 22%, #8b91ff 48%, #be88ff 72%, #ff86d5 100%),
    linear-gradient(110deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.05) 44%, rgba(255,255,255,.95) 50%, rgba(255,255,255,.14) 56%, rgba(255,255,255,0) 65%);
  background-size:100% 100%, 230% 100%;
  background-position:0 0, -180% 0;
  background-repeat:no-repeat;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:spxWordmarkGloss 10s cubic-bezier(.22,.61,.36,1) infinite;
  filter:drop-shadow(0 0 16px rgba(121,190,255,.18)) drop-shadow(0 0 34px rgba(192,107,255,.12));
}
.spx-wordmark::after{content:none !important;}
@keyframes spxWordmarkGloss{
  0%,78%{background-position:0 0, -180% 0;}
  88%{background-position:0 0, 135% 0;}
  100%{background-position:0 0, 135% 0;}
}
.spx-wordmarkWrap{display:grid;gap:8px;justify-items:center;overflow:visible;}
.spx-wordmark{font-size:clamp(72px,11vw,150px);line-height:.9;padding-right:.04em;letter-spacing:-.06em;}
.spx-tagline{
  color:rgba(224,235,255,.9);
  font-size:clamp(17px,1.55vw,23px);
  font-weight:850;
  letter-spacing:.05em;
  text-transform:none;
  text-shadow:0 10px 32px rgba(0,0,0,.28);
}
.spx-lead{
  max-width:760px;
  font-size:17px;
  line-height:1.84;
  color:rgba(219,229,246,.82);
}
.spx-noteLine{
  max-width:720px;
  margin-inline:auto;
  color:rgba(196,210,235,.6);
  font-size:13px;
}

.spx-btn{
  position:relative;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(160,190,255,.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.01) 26%),
    linear-gradient(180deg, rgba(11,16,28,.96), rgba(7,10,19,.92));
  box-shadow:
    0 22px 44px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -12px 24px rgba(0,0,0,.18);
}
.spx-btn::before{
  content:'';
  position:absolute;
  inset:1px;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 48%);
  pointer-events:none;
}
.spx-btn::after{content:none !important;}
.spx-btn:hover{
  transform:translateY(-2px) scale(1.01);
  border-color:rgba(176,206,255,.28);
  background:
    linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.02) 26%),
    linear-gradient(180deg, rgba(12,18,32,.98), rgba(8,12,22,.96));
  box-shadow:
    0 26px 52px rgba(0,0,0,.3),
    0 0 0 1px rgba(255,255,255,.03) inset,
    inset 0 1px 0 rgba(255,255,255,.15),
    inset 0 -14px 30px rgba(0,0,0,.22),
    0 0 30px rgba(121,190,255,.10);
}
.spx-btn.primary{
  background:
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.015) 28%),
    linear-gradient(135deg, rgba(84,208,255,.2), rgba(118,122,255,.16) 45%, rgba(255,116,210,.18) 100%),
    linear-gradient(180deg, rgba(8,12,22,.96), rgba(7,10,20,.98));
  border-color:rgba(148,206,255,.32);
  box-shadow:
    0 22px 52px rgba(33,38,98,.32),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -14px 26px rgba(0,0,0,.16),
    0 0 26px rgba(110,176,255,.12);
}
.spx-btn.ghost{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.01) 28%),
    linear-gradient(180deg, rgba(7,11,20,.86), rgba(4,7,14,.88));
}
.spx-topActions .spx-btn.top,
.spx-heroActions .spx-btn,
.spx-authActions .spx-btn{min-height:50px;padding-inline:20px;}

.spx-panelKicker,
.spx-kicker{
  color:rgba(234,242,255,.88);
  text-shadow:0 0 18px rgba(120,188,255,.12);
}
.spx-panel h2,
.spx-modalHead h3,
.spx-authTitle{
  background:linear-gradient(120deg, #f4f8ff 0%, #b7e6ff 34%, #cba7ff 78%, #ffd2ee 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.spx-panel h2{margin-bottom:12px;}
.spx-panel p,
.spx-feature span,
.spx-step small,
.spx-authSub,
.spx-faqItem p,
.spx-legalBody{color:rgba(212,223,244,.78);}
.spx-feature,
.spx-step{
  border-color:rgba(255,255,255,.10);
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(135,220,255,.10) 0%, rgba(135,220,255,0) 38%),
    radial-gradient(120% 160% at 100% 100%, rgba(196,116,255,.08) 0%, rgba(196,116,255,0) 44%),
    linear-gradient(180deg, rgba(16,22,38,.58), rgba(9,13,23,.78));
  backdrop-filter:blur(14px) saturate(120%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 14px 34px rgba(0,0,0,.16);
}
.spx-feature:hover,
.spx-step:hover{transform:translateY(-2px);border-color:rgba(158,200,255,.14);}

.spx-modal{
  display:grid !important;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:opacity .36s var(--spx-ease), visibility .36s var(--spx-ease);
}
.spx-modal.show{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}
.spx-modalShade{
  opacity:0;
  background:radial-gradient(circle at center, rgba(15,20,34,.26), rgba(3,6,14,.86));
  backdrop-filter:blur(0px);
  transition:opacity .38s var(--spx-ease), backdrop-filter .38s var(--spx-ease);
}
.spx-modal.show .spx-modalShade{
  opacity:1;
  backdrop-filter:blur(12px);
}
.spx-modalCard{
  max-height:min(88svh,920px);
  border-radius:30px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at top right, rgba(123,220,255,.12), transparent 24%),
    radial-gradient(circle at bottom left, rgba(201,117,255,.10), transparent 28%),
    linear-gradient(180deg, rgba(16,22,38,.68), rgba(7,10,19,.84));
  backdrop-filter:blur(22px) saturate(135%);
  box-shadow:0 40px 120px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.08), inset 0 -24px 48px rgba(0,0,0,.14);
  opacity:0;
  transform:translateY(34px) scale(.955);
  transition:opacity .34s var(--spx-ease), transform .44s var(--spx-ease), box-shadow .34s var(--spx-ease);
}
.spx-modal.show .spx-modalCard{
  opacity:1;
  transform:translateY(0) scale(1);
}
.spx-authModalCard,
.spx-legalModalCard{overflow:hidden;}
.spx-modalHead{padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:22px;}
.spx-modalClose{
  width:42px;height:42px;border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 10px 20px rgba(0,0,0,.14);
}
.spx-modalClose:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.18);}

.spx-legalTabs{
  display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px;
}
.spx-legalTab{
  appearance:none;border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  color:rgba(224,234,250,.86);
  padding:11px 15px;border-radius:14px;font-weight:800;cursor:pointer;
  transition:transform .24s var(--spx-ease), border-color .24s var(--spx-ease), background .24s var(--spx-ease);
}
.spx-legalTab.is-active,
.spx-legalTab:hover{
  transform:translateY(-1px);
  border-color:rgba(151,208,255,.24);
  background:linear-gradient(135deg, rgba(84,208,255,.14), rgba(255,116,210,.14));
}
.spx-legalBody{
  max-height:min(62svh,680px);
  overflow:auto;
  padding:20px 22px 22px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top left, rgba(125,220,255,.08), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
  backdrop-filter:blur(10px) saturate(120%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 12px 32px rgba(0,0,0,.10);
}
.spx-legalBody h1,
.spx-legalBody h2,
.spx-legalBody h3{
  color:#eff6ff;
  letter-spacing:-.02em;
}
.spx-legalBody p,
.spx-legalBody li{line-height:1.84;color:rgba(214,225,245,.8);}

.spx-footer{
  background:
    radial-gradient(circle at top left, rgba(125,220,255,.10), transparent 28%),
    radial-gradient(circle at bottom right, rgba(194,118,255,.08), transparent 30%),
    linear-gradient(180deg, rgba(12,17,30,.54), rgba(6,9,18,.76));
  border-color:rgba(255,255,255,.09);
  backdrop-filter:blur(16px) saturate(120%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 18px 48px rgba(0,0,0,.16);
}


.spx-cookieBanner{
  position:fixed;
  left:20px;
  right:20px;
  bottom:20px;
  z-index:60;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:18px 20px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at top left, rgba(125,220,255,.12), transparent 26%),
    radial-gradient(circle at bottom right, rgba(194,118,255,.10), transparent 30%),
    linear-gradient(180deg, rgba(16,22,38,.68), rgba(7,10,19,.84));
  backdrop-filter:blur(22px) saturate(135%);
  box-shadow:0 28px 80px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.08);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(28px) scale(.98);
  transition:opacity .34s var(--spx-ease), transform .44s var(--spx-ease), visibility .34s var(--spx-ease);
}
.spx-cookieBanner.show{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);}
.spx-cookieText{display:grid;gap:6px;color:rgba(214,225,245,.82);font-size:14px;line-height:1.6;}
.spx-cookieTitle{font-size:15px;font-weight:900;color:#eef5ff;letter-spacing:-.02em;}
.spx-cookieText a{color:#dff1ff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.18);}
.spx-cookieActions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end;}
@media (max-width: 760px){
  .spx-cookieBanner{left:14px;right:14px;bottom:14px;grid-template-columns:1fr;padding:16px;}
  .spx-cookieActions{justify-content:stretch;}
  .spx-cookieActions .spx-btn{width:100%;}
}

@media (max-width: 920px){
  .spx-wordmark{font-size:clamp(62px,18vw,108px);} 
  .spx-lead{font-size:16px;line-height:1.75;}
  .spx-modalCard{padding:22px 18px;}
}

.spx-topActions .spx-btn.top::before,.spx-heroActions .spx-btn::before,.spx-authActions .spx-btn::before{left:auto !important;transform:none !important;transition:none !important;}


/* --- v10 auth/modal continuation fixes --- */
.spx-modal{
  display:grid !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.spx-modal.show,
.spx-modal.is-closing{
  visibility:visible;
  pointer-events:auto;
}
.spx-modal.is-closing{
  opacity:0;
}
.spx-modal.show{
  opacity:1;
}
body.spx-modalOpen{overflow:hidden;}

.spx-modalShade{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:rgba(3,6,14,.72);
}
.spx-modalShade::before,
.spx-modalShade::after{
  content:"";
  position:absolute;
  inset:-14%;
  pointer-events:none;
}
.spx-modalShade::before{
  background:
    radial-gradient(circle at 20% 25%, rgba(92,202,255,.14), transparent 26%),
    radial-gradient(circle at 75% 18%, rgba(205,118,255,.12), transparent 24%),
    radial-gradient(circle at 52% 82%, rgba(255,186,112,.10), transparent 28%);
  opacity:.15;
  transform:scale(1.04);
}
.spx-modalShade::after{
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  opacity:.22;
}
.spx-modal.show .spx-modalShade{
  backdrop-filter:blur(14px) saturate(112%);
}
.spx-modal.show .spx-modalShade::before,
.spx-modal.is-closing .spx-modalShade::before{
  animation:spxModalAurora 18s linear infinite;
  opacity:.9;
}
.spx-modal.is-closing .spx-modalShade,
.spx-modal.is-closing .spx-modalCard{
  pointer-events:none;
}
@keyframes spxModalAurora{
  0%{transform:translate3d(-2%, -1%, 0) scale(1.02) rotate(0deg)}
  50%{transform:translate3d(2%, 1.5%, 0) scale(1.06) rotate(7deg)}
  100%{transform:translate3d(-2%, -1%, 0) scale(1.02) rotate(0deg)}
}

.spx-modalCard{
  will-change:transform, opacity;
  contain:layout paint;
}
.spx-modal.is-closing .spx-modalCard{
  opacity:0;
  transform:translateY(16px) scale(.982);
}

.spx-authModalCard{
  width:min(760px,100%);
  padding:24px 24px 26px;
}
.spx-authModal .spx-modalHead{
  margin:0 0 18px;
  padding:0 0 16px;
}
.spx-authCard{
  width:100%;
  padding:0;
  overflow:visible;
}
.spx-authTabs{
  position:relative;
  margin:-4px -4px 16px;
  padding:8px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 18px 38px rgba(0,0,0,.16);
}
.spx-authTab{
  min-height:48px;
  border:1px solid transparent;
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
  color:rgba(225,234,250,.72);
}
.spx-authTab:hover{
  color:rgba(245,249,255,.92);
  border-color:rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
}
.spx-authTab.is-active{
  border-color:rgba(144,206,255,.22);
  background:
    radial-gradient(circle at 20% 0%, rgba(121,214,255,.15), transparent 38%),
    linear-gradient(135deg, rgba(84,208,255,.12), rgba(118,122,255,.10) 48%, rgba(255,116,210,.12));
  box-shadow:0 16px 34px rgba(18,22,52,.22), inset 0 1px 0 rgba(255,255,255,.08);
}
.spx-authPanels{
  position:relative;
  display:block;
  min-height:0;
  margin-top:0;
}
.spx-authPanel{
  position:relative;
  inset:auto;
  opacity:1;
  transform:none;
  pointer-events:auto;
  transition:opacity .26s var(--spx-ease), transform .34s var(--spx-ease), filter .26s var(--spx-ease);
}
.spx-authPanel[hidden]{
  display:none !important;
}
.spx-authPanel.is-entering{
  animation:spxAuthPanelIn .34s var(--spx-ease);
}
@keyframes spxAuthPanelIn{
  from{opacity:0;transform:translateY(8px);filter:blur(4px)}
  to{opacity:1;transform:none;filter:none}
}
.spx-authTitle{
  margin-top:4px;
}
.spx-authSub{
  margin-bottom:20px;
}
.spx-authActionsStack{
  display:grid;
  justify-items:stretch;
  gap:10px;
}
.spx-authSubmit{
  width:100%;
  min-height:54px;
  border-radius:18px;
}
.spx-authLinksStack{
  justify-content:center;
}
.spx-authTextLink,
.spx-authTextLink.spx-linkBtn{
  padding:0;
  border:0;
  background:transparent;
  border-radius:0;
  min-height:auto;
  color:rgba(213,226,246,.78);
  font-size:13px;
  font-weight:800;
  box-shadow:none;
}
.spx-authTextLink:hover,
.spx-authTextLink.spx-linkBtn:hover{
  transform:none;
  background:transparent;
  border-color:transparent;
  color:#f2f7ff;
  text-decoration:underline;
  text-underline-offset:3px;
}
.spx-forgotBox{
  margin-top:18px;
  padding:18px 18px 6px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.spx-forgotBox[hidden]{display:none !important;}
.spx-forgotHead{
  align-items:center;
  margin-bottom:12px;
}
.spx-authHelper{display:none !important;}

#loginPanel{
  display:grid;
  justify-items:center;
}
#loginPanel > .spx-authTitle,
#loginPanel > .spx-authSub,
#loginPanel > #loginForm,
#loginPanel > #forgotBox{
  width:min(100%, 560px);
}
#loginPanel > .spx-authTitle,
#loginPanel > .spx-authSub{
  text-align:center;
}
#loginPanel > .spx-authSub{
  margin-inline:auto;
}
#loginPanel #loginForm,
#loginPanel #forgotForm,
#loginPanel .spx-authActionsStack,
#loginPanel .spx-authLinksStack,
#loginPanel .spx-forgotBox,
#loginPanel .spx-authSubmit{
  width:100%;
}
#loginPanel .spx-authLinksStack{
  justify-content:center;
}
#loginPanel #forgotToggle,
#loginPanel #forgotBack{
  width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
#loginPanel .spx-forgotHead{
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}


.spx-legalModalCard{
  width:min(980px,100%);
  min-height:min(72svh,760px);
  max-height:min(88svh,860px);
  overflow:hidden;
}
.spx-legalTabs{
  margin-bottom:14px;
}
.spx-legalBody{
  min-height:min(54svh,560px);
  max-height:none;
  height:calc(min(88svh,860px) - 186px);
  overflow:auto;
}
.spx-legalLoading{
  min-height:inherit;
  display:grid;
  place-items:center;
  text-align:center;
  color:rgba(216,227,246,.72);
  font-weight:800;
}

.spx-cookieBanner{
  left:22px;
  right:auto;
  bottom:18px;
  width:min(560px, calc(100vw - 44px));
  gap:14px;
  padding:14px 16px;
  border-radius:20px;
  border-color:rgba(255,255,255,.09);
  background:
    radial-gradient(circle at top left, rgba(125,220,255,.07), transparent 30%),
    radial-gradient(circle at bottom right, rgba(194,118,255,.06), transparent 34%),
    linear-gradient(180deg, rgba(12,17,30,.56), rgba(7,10,19,.76));
  backdrop-filter:blur(18px) saturate(120%);
  box-shadow:0 18px 56px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05);
}
.spx-cookieText{
  gap:4px;
  font-size:13px;
  line-height:1.55;
  color:rgba(214,225,245,.76);
}
.spx-cookieTitle{
  font-size:14px;
}
.spx-cookieActions .spx-btn.small{
  min-height:42px;
  padding:10px 14px;
}

.spx-btn,
.spx-topActions .spx-btn.top,
.spx-heroActions .spx-btn,
.spx-authActions .spx-btn{
  overflow:hidden;
}
.spx-btn::before,
.spx-topActions .spx-btn.top::before,
.spx-heroActions .spx-btn::before,
.spx-authActions .spx-btn::before{
  inset:1px !important;
  left:auto !important;
  transform:none !important;
  transition:opacity .24s var(--spx-ease), background .24s var(--spx-ease) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 46%) !important;
  opacity:.9;
}
.spx-btn:hover::before,
.spx-topActions .spx-btn.top:hover::before,
.spx-heroActions .spx-btn:hover::before,
.spx-authActions .spx-btn:hover::before{
  left:auto !important;
  background:linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,0) 48%) !important;
  opacity:1;
}

@media (max-width:760px){
  .spx-authModalCard{
    width:min(100%, 100vw - 24px);
    padding:18px 16px 20px;
  }
  .spx-authTabs{
    grid-template-columns:1fr 1fr;
    margin-bottom:14px;
  }
  .spx-cookieBanner{
    left:14px;
    width:calc(100vw - 28px);
  }
}

/* --- v6c auth sizing/title/cancel refinements --- */
.spx-srOnly{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

.spx-authModalHead{
  justify-content:flex-end;
  gap:0;
  padding-bottom:8px;
}

#loginPanel{
  width:100%;
  max-width:none;
}

#loginPanel > .spx-authTitle,
#loginPanel > .spx-authSub,
#loginPanel > #loginForm,
#loginPanel > #forgotBox{
  width:100%;
  max-width:none;
}

#loginPanel #loginForm,
#loginPanel #forgotForm,
#loginPanel .spx-forgotBox{
  width:100%;
  max-width:none;
}

#loginPanel .spx-authActionsStack{
  width:100%;
  gap:12px;
}

#loginPanel .spx-authSubmit,
#loginPanel .spx-authCancel{
  width:100%;
  min-height:56px;
  justify-content:center;
}

#loginPanel .spx-authCancel{
  border-radius:18px;
}

#loginPanel .spx-authTextLink{
  display:inline-flex;
  justify-content:center;
  width:100%;
}

.spx-forgotHead{
  display:flex;
  justify-content:center;
  text-align:center;
}

.spx-forgotHead strong{
  display:block;
  width:100%;
  font-size:19px;
  line-height:1.2;
}


/* --- v6d auth full-width button hardening --- */
#loginPanel,
#loginPanel > #loginForm,
#loginPanel > #forgotBox,
#loginPanel #forgotForm,
#loginPanel .spx-forgotBox,
#loginPanel .spx-authActions,
#loginPanel .spx-authActionsStack{
  width:100% !important;
  max-width:none !important;
}

#loginPanel .spx-authActions,
#loginPanel .spx-authActionsStack{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  justify-items:stretch !important;
  align-items:stretch !important;
  margin-inline:0 !important;
}

#loginPanel .spx-authSubmit,
#loginPanel .spx-authCancel,
#loginPanel .spx-authActions .spx-btn,
#loginPanel .spx-authActionsStack .spx-btn{
  display:flex !important;
  width:100% !important;
  max-width:none !important;
  min-width:100% !important;
  flex:0 0 100% !important;
  justify-content:center !important;
  margin:0 !important;
}

#loginPanel .spx-authTextLink,
#loginPanel #forgotToggle,
#loginPanel #forgotBack{
  width:100% !important;
  max-width:none !important;
}

/* --- v6e forgot copy cleanup + register full-width actions --- */
#loginPanel.is-forgot > .spx-authTitle,
#loginPanel.is-forgot > .spx-authSub{
  display:none !important;
}

#registerPanel,
#registerPanel > #registerForm,
#registerPanel .spx-authActions,
#registerPanel .spx-authActionsStack,
#registerPanel .spx-authLinks,
#registerPanel .spx-authLinksStack{
  width:100% !important;
  max-width:none !important;
}

#registerPanel .spx-authActions,
#registerPanel .spx-authActionsStack{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  justify-items:stretch !important;
  align-items:stretch !important;
  margin-inline:0 !important;
}

#registerPanel .spx-authSubmit,
#registerPanel .spx-authActions .spx-btn,
#registerPanel .spx-authActionsStack .spx-btn,
#registerPanel .spx-authTextLink,
#registerPanel [data-auth-switch]{
  display:flex !important;
  width:100% !important;
  max-width:none !important;
  min-width:100% !important;
  flex:0 0 100% !important;
  justify-content:center !important;
  margin:0 !important;
}

#registerPanel .spx-authTextLink,
#registerPanel [data-auth-switch]{
  text-align:center !important;
}


/* Dark dropdown readability fix */
select,
select option,
select optgroup{
  background-color:#0b1020;
  color:#f5f7ff;
}

select option:checked,
select option:hover,
select option:focus{
  background:linear-gradient(180deg, #18233f, #10192f);
  color:#ffffff;
}


.spx-maintenanceBar{max-width:1320px;margin:10px auto 0;padding:12px 18px;border-radius:18px;border:1px solid rgba(255,210,84,.35);background:linear-gradient(180deg, rgba(255,192,72,.16), rgba(255,153,0,.12));color:#ffe9b0;box-shadow:0 14px 34px rgba(255,168,58,.14);font-weight:700;letter-spacing:.01em}
#landingAuthActions.is-maintenance-hidden,.spx-heroActions.is-maintenance-hidden{display:none !important}

#maintenanceModalCountdown{color:rgba(255,236,194,.92);font-weight:700;line-height:1.6}#maintenanceModalCountdown b{color:#fff7dc}


/* --- mobile auth modal scroll fix --- */
@media (max-width: 760px){
  body.spx-modalOpen{
    overflow:hidden;
    height:100dvh;
  }
  .spx-authModal{
    place-items:start center;
    align-content:start;
    padding:10px 10px max(10px, env(safe-area-inset-bottom));
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .spx-authModal .spx-modalShade{
    position:fixed;
  }
  .spx-authModalCard{
    width:min(100%, calc(100vw - 20px));
    max-height:calc(100dvh - max(20px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom)));
    min-height:0;
    margin-block:max(10px, env(safe-area-inset-top)) 14px;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .spx-authModal .spx-authWrap,
  .spx-authModal .spx-authCard,
  .spx-authModal .spx-authPanels,
  .spx-authModal .spx-authPanel,
  .spx-authModal #registerPanel,
  .spx-authModal #registerForm,
  .spx-authModal #loginPanel,
  .spx-authModal #loginForm{
    min-height:0;
  }
  .spx-authModal .spx-modalHead{
    position:sticky;
    top:0;
    z-index:3;
    background:linear-gradient(180deg, rgba(10,15,28,.98), rgba(10,15,28,.92));
    backdrop-filter:blur(12px);
  }
  .spx-authModal .spx-authTabs{
    position:sticky;
    top:0;
    z-index:2;
  }
  .spx-authModal .spx-input,
  .spx-authModal .spx-select,
  .spx-authModal .spx-textarea{
    font-size:16px;
  }
}


/* --- captcha layout / consent polish --- */
.spx-captchaCard{display:grid;gap:14px;padding:18px;border-radius:22px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));overflow:hidden}
.spx-captchaHead{display:flex;justify-content:space-between;gap:12px;align-items:start}
.spx-captchaTitle{font-size:13px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#ffd5b0}
.spx-captchaSub{font-size:12px;font-weight:800;color:rgba(255,244,233,.72);margin-top:4px;line-height:1.55}.spx-captchaSub:empty{display:none}
.spx-captchaRow{display:grid;grid-template-columns:minmax(260px,1.2fr) minmax(220px,.8fr);gap:14px;align-items:stretch}
.spx-captchaVisualWrap{display:flex;align-items:center;justify-content:center;padding:10px;border-radius:18px;border:1px dashed rgba(255,255,255,.12);background:rgba(0,0,0,.18);min-width:0;overflow:auto}
.spx-captchaImage{display:block;width:100%;min-width:320px;max-width:420px;height:auto;border-radius:16px;box-shadow:0 14px 36px rgba(4,8,22,.45)}
.spx-captchaInputCol{display:grid;gap:10px;align-content:center;min-width:0}
.spx-captchaFallback{padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);color:rgba(255,244,233,.72);font-size:12px;font-weight:800;line-height:1.55}
.spx-inlineLegal{color:#ffd7b0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.spx-consentSwitch{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03)}
.spx-consentSwitch input{position:absolute;opacity:0;pointer-events:none}
.spx-consentTrack{position:relative;flex:0 0 58px;width:58px;height:32px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);transition:background .22s ease,border-color .22s ease,box-shadow .22s ease}
.spx-consentKnob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:999px;background:#fff;box-shadow:0 6px 16px rgba(0,0,0,.28);transition:transform .22s ease}
.spx-consentCopy{font-size:13px;font-weight:800;line-height:1.6;color:rgba(255,244,233,.92)}
.spx-consentSwitchRegister input:checked + .spx-consentTrack{background:linear-gradient(135deg,#8e72ff,#5f83ff);border-color:transparent;box-shadow:0 0 0 4px rgba(122,114,255,.12)}
.spx-consentSwitchRegister input:checked + .spx-consentTrack .spx-consentKnob{transform:translateX(26px)}
@media (max-width: 760px){
  .spx-captchaRow{grid-template-columns:1fr}
  .spx-captchaImage{min-width:280px}
}
@media (max-width: 760px){
  .spx-authModal{padding:0 !important;align-items:stretch !important;justify-items:stretch !important}
  .spx-authModalCard{width:100% !important;max-width:none !important;max-height:100dvh !important;height:100dvh !important;border-radius:0 !important;margin:0 !important;padding-bottom:max(18px, env(safe-area-inset-bottom)) !important;overflow-y:auto !important;-webkit-overflow-scrolling:touch !important;overscroll-behavior:contain !important}
  .spx-authModal .spx-authWrap,.spx-authModal .spx-authCard,.spx-authModal .spx-authPanels,.spx-authModal .spx-authPanel,.spx-authModal #registerPanel,.spx-authModal #registerForm,.spx-authModal #loginPanel,.spx-authModal #loginForm{overflow:visible !important;min-height:0 !important}
}

/* --- v14b desktop auth modal register visibility fix --- */
.spx-authModal{
  overflow-y:auto;
  overscroll-behavior:contain;
}
.spx-authModalCard{
  max-height:min(92dvh, 940px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:18px 20px 16px;
}
.spx-authModal .spx-modalHead{
  position:relative;
  top:auto;
  z-index:2;
  margin:0 0 12px;
  padding:0 0 10px;
  background:transparent;
  backdrop-filter:none;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.spx-authModal .spx-authPanels,
.spx-authModal .spx-authPanel,
.spx-authModal #registerPanel,
.spx-authModal #registerForm{
  min-height:0;
}
.spx-authModal #registerPanel{
  padding-bottom:0;
}
@media (min-width: 761px){
  .spx-authModal{
    place-items:start center;
    align-content:start;
    padding-block:24px;
  }
}

@media (min-width: 761px){
  .spx-authModalCard{
    padding-bottom:14px;
  }
  .spx-authModal .spx-authWrap{
    margin-top:0;
  }
  .spx-authModal .spx-authCard{
    padding-bottom:0;
  }
}
@media (max-width: 760px){
  .spx-authModal .spx-modalHead{
    position:sticky;
    top:0;
    z-index:4;
    background:linear-gradient(180deg, rgba(10,15,28,.94), rgba(10,15,28,.84));
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(255,255,255,.06);
  }
}


/* --- v14c auth consent gate + compact auth/support layout --- */
.spx-authSubmit:disabled,
.spx-authActions .spx-btn:disabled{
  cursor:not-allowed !important;
  pointer-events:none !important;
  opacity:.56 !important;
  filter:saturate(.72) brightness(.92) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 24px rgba(0,0,0,.14) !important;
}
.spx-authSubmit:disabled::before,
.spx-authActions .spx-btn:disabled::before{
  opacity:.22 !important;
}
.spx-authModalCard{
  padding:16px 20px 10px !important;
}
.spx-authModal .spx-modalHead{
  margin:0 0 10px !important;
  padding:0 0 8px !important;
}
.spx-authModal .spx-authTabs{
  margin-bottom:12px !important;
}
.spx-authModal .spx-authSub{
  margin-bottom:14px !important;
}
.spx-authModal #loginPanel,
.spx-authModal #registerPanel,
.spx-authModal #loginForm,
.spx-authModal #registerForm{
  padding-bottom:0 !important;
  margin-bottom:0 !important;
}
.spx-authModal .spx-authActionsStack,
.spx-authModal .spx-authLinksStack{
  margin-bottom:0 !important;
}
@media (min-width: 761px){
  .spx-authModalCard{
    max-height:min(90dvh, 920px) !important;
    padding-bottom:10px !important;
  }
  .spx-authModal{
    padding-block:18px !important;
  }
}
@media (max-width: 760px){
  .spx-authModalCard{
    padding:14px 14px max(8px, env(safe-area-inset-bottom)) !important;
  }
}


/* --- v14d auth modal bottom gap + live-only status spacing --- */
.spx-authModalCard{
  padding:14px 18px 6px !important;
}
.spx-authWrap,
.spx-authModal .spx-authCard,
.spx-authModal .spx-authPanels,
.spx-authModal .spx-authPanel,
.spx-authModal #loginForm,
.spx-authModal #registerForm,
.spx-authModal #forgotForm{
  min-height:0 !important;
  margin-bottom:0 !important;
  padding-bottom:0 !important;
}
.spx-authModal .spx-authPanels{
  display:grid !important;
  align-content:start !important;
  gap:0 !important;
}
.spx-authModal .spx-form{
  gap:12px;
}
.spx-authModal .spx-statusCard{
  display:none;
  margin-top:0;
  margin-bottom:0;
}
.spx-authModal .spx-statusCard.show{
  display:block;
  margin-top:10px;
}
.spx-authModal #systemStatus.spx-statusCard.show{
  margin:0 0 10px;
}
.spx-authModal #loginPanel > .spx-authSub,
.spx-authModal #registerPanel > .spx-authSub{
  margin-bottom:12px !important;
}
.spx-authModal #loginPanel .spx-authActionsStack,
.spx-authModal #registerPanel .spx-authActionsStack,
.spx-authModal #forgotForm .spx-authActionsStack{
  gap:8px !important;
}
@media (min-width: 761px){
  .spx-authModalCard{
    padding:14px 18px 4px !important;
    max-height:min(88dvh, 900px) !important;
  }
}
@media (max-width: 760px){
  .spx-authModalCard{
    padding:12px 12px max(6px, env(safe-area-inset-bottom)) !important;
  }
}

/* --- v15 auth modal full rework: consistent desktop height, no ghost scroll, no fake bottom gap --- */
.spx-authModal{
  align-items:center;
  justify-items:center;
  padding:18px;
  overflow:auto;
  overscroll-behavior:contain;
}

.spx-authModalCard{
  width:min(760px, calc(100vw - 36px)) !important;
  height:min(820px, calc(100dvh - 36px)) !important;
  max-height:min(820px, calc(100dvh - 36px)) !important;
  min-height:min(620px, calc(100dvh - 36px)) !important;
  margin:0 !important;
  padding:16px 18px 14px !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) !important;
  gap:0 !important;
  overflow:hidden !important;
}

.spx-authModal .spx-modalHead,
.spx-authModalHead{
  position:sticky !important;
  top:0 !important;
  z-index:5 !important;
  margin:0 0 12px !important;
  padding:0 0 12px !important;
  background:transparent !important;
  backdrop-filter:none !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
}

.spx-authModal .spx-authWrap{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  min-height:0 !important;
  height:100% !important;
  display:block !important;
}

.spx-authModal .spx-authCard{
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) !important;
  gap:0 !important;
}

.spx-authModal .spx-authTabs{
  position:sticky !important;
  top:0 !important;
  z-index:4 !important;
  margin:0 0 12px !important;
}

.spx-authModal #systemStatus{
  margin:0 0 10px !important;
}
.spx-authModal #systemStatus:not(.show){
  display:none !important;
}

.spx-authModal .spx-authPanels{
  position:static !important;
  min-height:0 !important;
  height:100% !important;
  margin-top:0 !important;
  display:block !important;
  overflow:auto !important;
  overscroll-behavior:contain !important;
  padding-right:2px;
}

.spx-authModal .spx-authPanel{
  position:static !important;
  inset:auto !important;
  opacity:1 !important;
  transform:none !important;
  pointer-events:auto !important;
  transition:none !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  display:none;
}

.spx-authModal .spx-authPanel.is-active:not([hidden]){
  display:block !important;
}

.spx-authModal #loginPanel,
.spx-authModal #registerPanel{
  width:100% !important;
  max-width:none !important;
}

.spx-authModal #loginPanel > .spx-authTitle,
.spx-authModal #loginPanel > .spx-authSub,
.spx-authModal #loginPanel > #loginForm,
.spx-authModal #loginPanel > #forgotBox{
  width:100% !important;
  max-width:none !important;
}

.spx-authModal .spx-authTitle{
  margin:0 0 10px !important;
}

.spx-authModal .spx-authSub{
  margin:0 0 14px !important;
}

.spx-authModal #loginForm,
.spx-authModal #registerForm,
.spx-authModal #forgotForm,
.spx-authModal #forgotBox,
.spx-authModal .spx-form{
  margin:0 !important;
  padding:0 !important;
}

.spx-authModal .spx-form{
  gap:12px !important;
}

.spx-authModal .spx-captchaCard,
.spx-authModal .spx-consentSwitch,
.spx-authModal .spx-authActions,
.spx-authModal .spx-authActionsStack,
.spx-authModal .spx-authLinks,
.spx-authModal .spx-authLinksStack{
  margin-bottom:0 !important;
}

.spx-authModal .spx-authActionsStack{
  gap:8px !important;
}

.spx-authModal .spx-authSubmit,
.spx-authModal .spx-authCancel,
.spx-authModal .spx-authTextLink{
  min-height:50px !important;
}

.spx-authModal .spx-statusCard{
  display:none;
  margin:10px 0 0 !important;
}

.spx-authModal .spx-statusCard.show{
  display:block !important;
}

@media (max-width: 760px){
  .spx-authModal{
    padding:0 !important;
    align-items:stretch !important;
    justify-items:stretch !important;
  }

  .spx-authModalCard{
    width:100% !important;
    height:100dvh !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    border-radius:0 !important;
    padding:14px 14px max(10px, env(safe-area-inset-bottom)) !important;
  }

  .spx-authModal .spx-modalHead,
  .spx-authModalHead{
    margin:0 0 10px !important;
    padding:0 0 10px !important;
  }

  .spx-authModal .spx-authPanels{
    padding-right:0;
  }
}


/* --- v15b mobile auth modal overflow + captcha containment --- */
.spx-authModal,
.spx-authModalCard,
.spx-authModal .spx-authWrap,
.spx-authModal .spx-authCard,
.spx-authModal .spx-authPanels,
.spx-authModal .spx-authPanel,
.spx-authModal .spx-form{
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

.spx-authModal .spx-authPanels,
.spx-authModal .spx-authPanel,
.spx-authModal .spx-form,
.spx-authModal .spx-captchaCard,
.spx-authModal .spx-captchaRow,
.spx-authModal .spx-captchaVisualWrap,
.spx-authModal .spx-captchaInputCol,
.spx-authModal .spx-consentSwitch,
.spx-authModal .spx-inputRow{
  min-width:0 !important;
  max-width:100% !important;
}

.spx-authModal .spx-captchaVisualWrap{
  overflow:hidden !important;
}

.spx-authModal .spx-captchaImage{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}

@media (max-width: 760px){
  .spx-authModal,
  .spx-authModalCard,
  .spx-authModal .spx-authWrap,
  .spx-authModal .spx-authCard,
  .spx-authModal .spx-authPanels,
  .spx-authModal .spx-authPanel{
    width:100% !important;
    max-width:100vw !important;
    overflow-x:hidden !important;
  }

  .spx-authModalCard{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .spx-authModal .spx-inputRow,
  .spx-authModal .spx-captchaRow{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .spx-authModal .spx-authActionsStack .spx-btn,
  .spx-authModal .spx-authLinksStack,
  .spx-authModal .spx-authTextLink,
  .spx-authModal .spx-consentCopy{
    min-width:0 !important;
    max-width:100% !important;
  }
}


/* --- v15c register success modal --- */
.spx-registerSuccessCard{width:min(720px,100%);}
.spx-registerSuccessBanner{margin-bottom:16px;}
.spx-registerSuccessBanner strong{color:#fff7ec;}
.spx-registerSuccessSteps{display:grid;gap:12px;margin:0 0 16px;}
.spx-registerSuccessStep{display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));}
.spx-registerSuccessStep span{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg, rgba(255,179,102,.22), rgba(255,127,69,.12));border:1px solid rgba(255,173,102,.28);font-weight:900;color:#fff2e4;box-shadow:0 10px 24px rgba(255,138,68,.14);}
.spx-registerSuccessStep strong{display:block;margin-bottom:5px;font-size:15px;color:#fff5ea;}
.spx-registerSuccessStep p{margin:0;line-height:1.65;opacity:.82;}
.spx-registerSuccessHint{margin:0 0 16px;}
.spx-registerSuccessActions{margin-top:0;}
@media (max-width: 640px){
  .spx-registerSuccessStep{grid-template-columns:1fr;}
  .spx-registerSuccessStep span{width:38px;height:38px;border-radius:12px;}
}

/* --- v15d public site depth + public updates --- */
.spx-scrollCue{display:inline-flex;align-items:center;gap:12px;margin-top:44px;padding:12px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);color:var(--spx-text);text-decoration:none;font-weight:800;box-shadow:0 14px 40px rgba(0,0,0,.18);transition:transform .26s var(--spx-ease),background .26s var(--spx-ease),border-color .26s var(--spx-ease)}
.spx-scrollCue:hover{transform:translateY(-2px);background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16)}
.spx-scrollCueLabel{font-size:14px;letter-spacing:.01em}
.spx-scrollCueArrow{width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-1px);opacity:.85}
@keyframes spxScrollCueFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.spx-scrollCue{position:relative;overflow:hidden}
.spx-scrollCue::after{content:"";position:absolute;inset:-40% auto -40% -52%;width:44%;background:linear-gradient(90deg, transparent, rgba(255,255,255,.16), transparent);transform:skewX(-18deg);animation:spxScrollCueSweep 3.6s ease-in-out infinite;pointer-events:none;opacity:.72}
.spx-scrollCueArrow{animation:spxScrollCueFloat 1.8s ease-in-out infinite}
@keyframes spxScrollCueSweep{0%,18%{transform:translateX(0) skewX(-18deg);opacity:0}35%{opacity:.72}60%,100%{transform:translateX(320%) skewX(-18deg);opacity:0}}
.spx-scrollTopFab{position:fixed;right:clamp(16px,2vw,28px);bottom:clamp(18px,2.4vw,30px);width:56px;height:56px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg, rgba(10,14,24,.84), rgba(7,10,17,.94));color:#fff4e8;box-shadow:0 22px 56px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06);display:grid;place-items:center;z-index:120;opacity:0;transform:translateY(18px) scale(.92);pointer-events:none;transition:opacity .28s ease, transform .28s ease, border-color .28s ease, background .28s ease}
.spx-scrollTopFab.is-visible{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.spx-scrollTopFab:hover{transform:translateY(-2px) scale(1.02);border-color:rgba(255,255,255,.24)}
.spx-scrollTopFabIcon{width:12px;height:12px;border-top:2px solid currentColor;border-left:2px solid currentColor;transform:rotate(45deg) translateY(2px)}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollTopFab{border-color:rgba(196,131,77,.18);background:linear-gradient(180deg, rgba(255,248,241,.94), rgba(247,236,223,.98));color:#6a3f27;box-shadow:0 18px 42px rgba(163,93,37,.12), inset 0 1px 0 rgba(255,255,255,.8)}

.spx-storySection{display:grid;grid-template-columns:minmax(280px, .9fr) minmax(0, 1.1fr);gap:24px;align-items:start}
.spx-storyIntro{position:sticky;top:96px;padding:12px 6px 12px 0}
.spx-storyIntro h2{margin:10px 0 14px;font-size:clamp(30px,4vw,44px);line-height:1.06;letter-spacing:-.04em}
.spx-storyIntro p{margin:0;color:var(--spx-muted);line-height:1.82;font-weight:600}
.spx-storyStats{display:grid;gap:12px;margin-top:20px}
.spx-storyStat{padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);backdrop-filter:blur(12px);box-shadow:0 12px 36px rgba(0,0,0,.12)}
.spx-storyStat strong{display:block;font-size:15px;color:var(--spx-text);margin-bottom:4px}
.spx-storyStat span{display:block;font-size:13px;color:var(--spx-muted);font-weight:700;line-height:1.6}
.spx-storyCards{display:grid;gap:18px}
.spx-storyCard{padding:22px 22px 22px 74px;position:relative;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(13,19,34,.82), rgba(8,12,24,.94));box-shadow:0 20px 60px rgba(0,0,0,.20);overflow:hidden}
.spx-storyCard::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right, rgba(123,212,255,.09), transparent 36%);pointer-events:none}
.spx-storyCard h3{margin:0 0 10px;font-size:24px;line-height:1.14;letter-spacing:-.03em}
.spx-storyCard p{margin:0;color:var(--spx-muted);line-height:1.8;font-weight:600}
.spx-storyIndex{position:absolute;left:22px;top:22px;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:12px;font-weight:900;letter-spacing:.12em;color:#fdf3e2;background:linear-gradient(135deg, rgba(255,179,102,.20), rgba(255,127,69,.12));border:1px solid rgba(255,173,102,.26);box-shadow:0 10px 24px rgba(255,138,68,.12)}

.spx-flowSection{display:grid;gap:20px}
.spx-flowHead{max-width:880px}
.spx-flowHead h2{margin:10px 0 12px;font-size:clamp(28px,4vw,40px);line-height:1.08;letter-spacing:-.04em}
.spx-flowHead p{margin:0;color:var(--spx-muted);line-height:1.82;font-weight:600}
.spx-flowGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.spx-flowCard{padding:22px;border-radius:22px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(11,17,31,.74), rgba(8,12,23,.92));box-shadow:0 18px 52px rgba(0,0,0,.18);min-height:180px;display:flex;flex-direction:column;justify-content:space-between;gap:16px;transition:transform .28s var(--spx-ease),border-color .28s var(--spx-ease),box-shadow .28s var(--spx-ease)}
.spx-flowCard:hover{transform:translateY(-4px);border-color:rgba(136,176,255,.18);box-shadow:0 24px 60px rgba(0,0,0,.22)}
.spx-flowCard strong{font-size:18px;line-height:1.2;color:var(--spx-text)}
.spx-flowCard span{color:var(--spx-muted);line-height:1.75;font-weight:600}

.spx-newsSection{display:grid;gap:18px}
.spx-newsSectionHead{display:flex;justify-content:space-between;gap:18px;align-items:end;flex-wrap:wrap}
.spx-newsSectionHead h2{margin:10px 0 10px;font-size:clamp(28px,4vw,40px);line-height:1.08;letter-spacing:-.04em}
.spx-newsSectionHead p{margin:0;max-width:760px;color:var(--spx-muted);line-height:1.82;font-weight:600}
.spx-newsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.spx-newsGridFull{grid-template-columns:repeat(3,minmax(0,1fr))}
.spx-newsCard{border-radius:26px;border:1px solid rgba(255,255,255,.08);overflow:hidden;background:linear-gradient(180deg, rgba(11,17,30,.88), rgba(7,11,23,.96));box-shadow:0 22px 60px rgba(0,0,0,.20);display:flex;flex-direction:column;min-height:100%;transition:transform .3s var(--spx-ease),border-color .3s var(--spx-ease),box-shadow .3s var(--spx-ease)}
.spx-newsCard:hover{transform:translateY(-4px);border-color:rgba(136,176,255,.18);box-shadow:0 28px 72px rgba(0,0,0,.24)}
.spx-newsCardVisual{height:200px;background:#0d1321 center/cover no-repeat;position:relative}
.spx-newsCardVisual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(6,10,18,0) 0%, rgba(6,10,18,.08) 52%, rgba(6,10,18,.54) 100%)}
.spx-newsCardBody{padding:20px;display:flex;flex-direction:column;gap:14px;flex:1}
.spx-newsMetaRow{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.spx-newsMetaTag,.spx-newsMetaDate{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.spx-newsMetaTag{background:rgba(255,173,102,.12);border:1px solid rgba(255,173,102,.18);color:#ffe9cf}
.spx-newsMetaDate{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:rgba(214,226,248,.80)}
.spx-newsCard h3{margin:0;font-size:24px;line-height:1.16;letter-spacing:-.03em}
.spx-newsCard p{margin:0;color:var(--spx-muted);line-height:1.8;font-weight:600;flex:1}
.spx-emptyNewsCard{min-height:220px;display:flex;flex-direction:column;justify-content:center}

.spx-closingSection{padding-bottom:8px}
.spx-closingCard{text-align:left}
.spx-closingCard p{max-width:840px}

.spx-updatesHero{max-width:920px}
.spx-wordmarkSmall{font-size:clamp(44px,8vw,88px)}
.spx-updatesGridSection{padding-top:10px}
.spx-updatesPage .spx-newsGridFull{grid-template-columns:repeat(3,minmax(0,1fr))}
.spx-updateReadLayout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.55fr);gap:20px;align-items:start}
.spx-updateReadCard{overflow:hidden}
.spx-updateHeroVisual{height:280px;margin:-28px -28px 0}
.spx-updateReadHead{padding-top:22px}
.spx-updateReadTitle{margin:14px 0 10px;font-size:clamp(34px,4vw,48px);line-height:1.04;letter-spacing:-.05em}
.spx-updateReadExcerpt{margin:0;color:var(--spx-muted);line-height:1.8;font-size:17px;font-weight:600}
.spx-updateReadContent{margin-top:22px;color:var(--spx-text);font-size:16px;line-height:1.85}
.spx-updateReadContent > *:first-child{margin-top:0}
.spx-updateReadContent h2,.spx-updateReadContent h3,.spx-updateReadContent h4{color:var(--spx-text);margin:1.3em 0 .55em;line-height:1.15}
.spx-updateReadContent p,.spx-updateReadContent li{color:var(--spx-muted);font-weight:600}
.spx-updateReadContent a{color:#8fd8ff}
.spx-updateReadAside{display:grid;gap:18px;position:sticky;top:96px}
.spx-updateAsideActions,.spx-updateActions{margin-top:14px}
.spx-relatedList{display:grid;gap:12px}
.spx-relatedCard{display:grid;gap:6px;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);text-decoration:none;color:inherit;transition:transform .26s var(--spx-ease),background .26s var(--spx-ease),border-color .26s var(--spx-ease)}
.spx-relatedCard:hover{transform:translateY(-2px);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.13)}
.spx-relatedCard strong{font-size:16px;line-height:1.35;color:var(--spx-text)}
.spx-relatedCard span{color:var(--spx-muted);font-size:13px;line-height:1.65;font-weight:700}
.spx-relatedDate{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(197,214,236,.68)}

html[data-spx-theme="light"] body.spx-prealpha .spx-authSub,
html[data-spx-theme="light"] body.spx-prealpha .spx-lead,
html[data-spx-theme="light"] body.spx-prealpha .spx-noteLine,
html[data-spx-theme="light"] body.spx-prealpha .spx-inlineHint,
html[data-spx-theme="light"] body.spx-prealpha .spx-storyCard p,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowCard span,
html[data-spx-theme="light"] body.spx-prealpha .spx-newsCard p,
html[data-spx-theme="light"] body.spx-prealpha .spx-updateReadContent p,
html[data-spx-theme="light"] body.spx-prealpha .spx-updateReadContent li,
html[data-spx-theme="light"] body.spx-prealpha .spx-registerSuccessStep p,
html[data-spx-theme="light"] body.spx-prealpha .spx-consentCopy,
html[data-spx-theme="light"] body.spx-prealpha .spx-panel p{color:rgba(74,47,31,.82) !important}
html[data-spx-theme="light"] body.spx-prealpha .spx-authTabs .spx-authTab,
html[data-spx-theme="light"] body.spx-prealpha .spx-linkBtn[data-legal-open],
html[data-spx-theme="light"] body.spx-prealpha .spx-inlineLegal{color:#5b341f !important}
html[data-spx-theme="light"] body.spx-prealpha .spx-storyStat,
html[data-spx-theme="light"] body.spx-prealpha .spx-storyCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-newsCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-relatedCard{background:linear-gradient(180deg, rgba(255,249,243,.86), rgba(246,236,227,.94));border-color:rgba(124,79,49,.11);box-shadow:0 18px 48px rgba(171,114,65,.10), inset 0 1px 0 rgba(255,255,255,.62)}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsMetaDate{background:rgba(139,79,42,.05);border-color:rgba(124,79,49,.10);color:rgba(83,53,35,.76)}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsMetaTag{background:rgba(255,157,87,.14);border-color:rgba(214,112,75,.18);color:#6c3f26}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollCue{background:rgba(255,255,255,.52);border-color:rgba(124,79,49,.12);box-shadow:0 14px 40px rgba(171,114,65,.10)}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollCue:hover{background:rgba(255,255,255,.70);border-color:rgba(124,79,49,.18)}
html[data-spx-theme="light"] body.spx-prealpha .spx-updateReadContent a{color:#a0552f}

@media (max-width: 1080px){
  .spx-storySection,.spx-updateReadLayout{grid-template-columns:1fr}
  .spx-storyIntro,.spx-updateReadAside{position:static;top:auto}
  .spx-flowGrid,.spx-newsGrid,.spx-updatesPage .spx-newsGridFull{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 760px){
  .spx-storyCards,.spx-storyStats,.spx-flowGrid,.spx-newsGrid,.spx-updatesPage .spx-newsGridFull{grid-template-columns:1fr}
  .spx-storyCard{padding-left:22px;padding-top:70px}
  .spx-storyIndex{top:18px;left:18px}
  .spx-newsSectionHead{align-items:flex-start}
  .spx-updateHeroVisual{height:220px;margin:-28px -28px 0}
}

/* --- public landing rework pass --- */
.spx-heroActionsWide{gap:14px;max-width:620px;margin-inline:auto;margin-top:30px}
.spx-btnHero{min-width:220px;min-height:58px;padding:16px 24px;border-radius:18px;font-size:15px;font-weight:900}
.spx-heroShell .spx-lead{max-width:900px}
.spx-previewMedia{overflow:hidden}
.spx-previewCallout{position:absolute;z-index:2;display:grid;gap:4px;max-width:240px;padding:14px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(8,13,25,.84), rgba(6,10,20,.92));box-shadow:0 18px 40px rgba(0,0,0,.28);backdrop-filter:blur(12px)}
.spx-previewCallout strong{font-size:14px;line-height:1.2}
.spx-previewCallout span{color:rgba(219,229,245,.78);font-size:12px;line-height:1.55;font-weight:700}
.spx-previewCalloutLeft{left:18px;top:18px}
.spx-previewCalloutRight{right:18px;top:18px}
.spx-previewCalloutBottom{left:50%;bottom:18px;transform:translateX(-50%);max-width:320px;text-align:center}
.spx-previewMeta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px 20px 22px;background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01))}
.spx-previewMetric{padding:14px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
.spx-previewMetric b{display:block;font-size:14px;margin-bottom:6px}
.spx-previewMetric span{display:block;color:var(--spx-muted);font-size:13px;line-height:1.6;font-weight:700}
.spx-builderShowcaseSection{align-items:start}
.spx-showcaseIntro,.spx-accessPanel{height:100%}
.spx-showcasePills{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.spx-showcasePill{display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.spx-showcaseCards{display:grid;gap:14px;margin-top:18px}
.spx-showcaseCard{padding:18px 18px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.spx-showcaseCard small{display:block;margin-bottom:8px;color:rgba(221,231,247,.66);font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.spx-showcaseCard h3{margin:0 0 8px;font-size:21px;line-height:1.18;letter-spacing:-.03em}
.spx-showcaseCard p{margin:0;color:var(--spx-muted);line-height:1.72;font-size:14px}
.spx-stepsRefined{gap:14px}
.spx-builderDetailBand{max-width:1240px;margin:42px auto 0;padding:28px;border-radius:30px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(10,14,26,.82), rgba(6,10,20,.95));box-shadow:0 30px 90px rgba(0,0,0,.32);position:relative;overflow:hidden}
.spx-builderDetailBand::before{content:"";position:absolute;inset:auto auto 0 0;width:46%;height:220px;background:radial-gradient(circle, rgba(255,186,110,.10), transparent 66%);filter:blur(8px);pointer-events:none}
.spx-builderDetailHead{max-width:780px;margin-bottom:18px;position:relative;z-index:1}
.spx-builderDetailHead h2{margin:10px 0 10px;font-size:clamp(30px,4.1vw,42px);line-height:1.06;letter-spacing:-.045em}
.spx-builderDetailHead p{margin:0;color:var(--spx-muted);line-height:1.82;font-weight:600}
.spx-builderDetailGrid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.spx-detailCard{padding:18px;border-radius:22px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));display:grid;gap:8px;min-height:176px}
.spx-detailCard strong{font-size:16px;line-height:1.25}
.spx-detailCard span{color:var(--spx-muted);font-size:14px;line-height:1.72;font-weight:600}
.spx-newsSectionHead p,.spx-closingCard p{max-width:760px}

html[data-spx-theme="light"] body.spx-prealpha .spx-previewCallout{background:linear-gradient(180deg, rgba(255,248,242,.92), rgba(246,236,228,.96));border-color:rgba(129,89,58,.12);box-shadow:0 18px 40px rgba(171,114,65,.12)}
html[data-spx-theme="light"] body.spx-prealpha .spx-previewCallout span,
html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseCard p,
html[data-spx-theme="light"] body.spx-prealpha .spx-detailCard span{color:rgba(95,69,50,.82)}
html[data-spx-theme="light"] body.spx-prealpha .spx-previewMeta,
html[data-spx-theme="light"] body.spx-prealpha .spx-builderDetailBand{background:linear-gradient(180deg, rgba(255,251,247,.92), rgba(247,238,231,.96));border-color:rgba(129,89,58,.10);box-shadow:0 26px 70px rgba(170,118,78,.10)}
html[data-spx-theme="light"] body.spx-prealpha .spx-previewMetric,
html[data-spx-theme="light"] body.spx-prealpha .spx-showcasePill,
html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-detailCard{background:rgba(255,255,255,.62);border-color:rgba(129,89,58,.10)}
html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseCard small{color:rgba(128,89,58,.62)}

@media (max-width:1080px){
  .spx-previewCallout{max-width:210px}
  .spx-builderDetailGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .spx-previewMeta{grid-template-columns:1fr}
  .spx-previewCallout{position:static;transform:none;max-width:none;margin:12px}
  .spx-previewCalloutBottom{text-align:left}
  .spx-builderDetailBand{padding:22px}
}
@media (max-width:640px){
  .spx-topbar{display:grid;grid-template-columns:1fr;align-items:stretch}
  .spx-topActions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:8px;align-items:center}
  .spx-topActions .spx-btn.top{width:100%;min-width:0;padding:11px 10px;font-size:12px}
  .spx-topActions .spx-themeToggle{justify-self:end}
  .spx-heroShell{margin-top:28px}
  .spx-heroActionsWide{display:grid;grid-template-columns:1fr 1fr;max-width:100%}
  .spx-btnHero{min-width:0;width:100%;min-height:56px;padding:15px 18px}
  .spx-scrollCue{width:100%;justify-content:center}
  .spx-builderDetailGrid{grid-template-columns:1fr}
  .spx-showcaseCard h3{font-size:19px}
}
@media (max-width:460px){
  .spx-topActions{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(42px,auto)}
  .spx-topActions .spx-themeToggle{grid-column:2;justify-self:end}
  .spx-heroActionsWide{grid-template-columns:1fr}
}

/* --- homepage flow rework / builder showcase lanes --- */
.spx-main{position:relative}
.spx-main::before{content:"";position:absolute;inset:120px 0 auto;min-height:1500px;pointer-events:none;z-index:0;opacity:.42;
  background:
    radial-gradient(circle at 8% 12%, rgba(255,255,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 16% 32%, rgba(255,255,255,.35) 0 1px, transparent 1.7px),
    radial-gradient(circle at 28% 9%, rgba(255,255,255,.56) 0 1.2px, transparent 2px),
    radial-gradient(circle at 38% 24%, rgba(255,255,255,.32) 0 1px, transparent 1.7px),
    radial-gradient(circle at 52% 15%, rgba(255,255,255,.54) 0 1px, transparent 2px),
    radial-gradient(circle at 62% 35%, rgba(255,255,255,.25) 0 1px, transparent 1.8px),
    radial-gradient(circle at 76% 11%, rgba(255,255,255,.72) 0 1px, transparent 1.9px),
    radial-gradient(circle at 86% 28%, rgba(255,255,255,.32) 0 1px, transparent 1.6px),
    radial-gradient(circle at 94% 18%, rgba(255,255,255,.58) 0 1.1px, transparent 1.9px);
  filter:blur(.15px);
}
.spx-previewStageClean{max-width:1320px;margin-top:72px;padding-bottom:18px}
.spx-previewBrowserClean{max-width:1240px;opacity:.98;filter:none;box-shadow:0 46px 120px rgba(0,0,0,.42)}
.spx-previewBrowserClean:hover{transform:translateY(-8px);box-shadow:0 54px 130px rgba(0,0,0,.5)}
.spx-previewMediaClean{min-height:clamp(320px,48vw,660px);background:linear-gradient(180deg, rgba(11,16,28,.66), rgba(9,13,24,.94))}
.spx-previewMediaClean img{display:block;width:100%;height:auto;object-fit:cover}
.spx-previewCaptionRow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px 22px 24px;background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01))}
.spx-previewCaptionRow span{display:grid;gap:5px;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
.spx-previewCaptionRow strong{font-size:14px;line-height:1.2}
.spx-previewCaptionRow small{color:var(--spx-muted);font-size:13px;line-height:1.55;font-weight:700}

.spx-storyRail{position:relative;z-index:1;display:grid;gap:34px;max-width:1240px;margin:64px auto 0}

.spx-scrollFeature{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:52px;align-items:center;padding:18px 0 28px}
.spx-scrollFeatureLayers{grid-template-columns:minmax(360px,.92fr) minmax(0,1.08fr)}
.spx-scrollFeatureCopy{display:grid;gap:14px}
.spx-scrollFeatureCopy h2{margin:0;font-size:clamp(30px,4vw,44px);line-height:1.05;letter-spacing:-.045em;max-width:12ch}
.spx-scrollFeatureCopy p{margin:0;color:var(--spx-muted);font-size:15px;line-height:1.9;font-weight:600;max-width:60ch}
.spx-featureList{display:grid;gap:10px;padding:4px 0 0;margin:0;list-style:none}
.spx-featureList li{position:relative;padding-left:24px;color:rgba(229,237,248,.92);font-size:14px;line-height:1.75;font-weight:700}
.spx-featureList li::before{content:"";position:absolute;left:0;top:.78em;width:10px;height:10px;border-radius:999px;background:linear-gradient(180deg, rgba(127,210,255,.98), rgba(82,146,255,.95));box-shadow:0 0 0 6px rgba(88,150,255,.12)}

.spx-scrollFeatureVisual{display:flex;justify-content:center;align-items:center;overflow:visible;min-height:100vh}
.spx-showcaseScene{position:relative;width:min(1880px,100vw);min-height:100vh;display:flex;align-items:center;justify-content:center;--spx-scene-progress:0;--spx-scene-mx:0;--spx-scene-my:0;--spx-base-enter-x:0px;--spx-panel-enter-x:0px}
.spx-showcaseScene::before{content:"";position:absolute;inset:10% 6% 6%;border-radius:42px;background:radial-gradient(circle at 24% 18%, rgba(124,181,255,.18), transparent 34%), radial-gradient(circle at 78% 76%, rgba(255,155,84,.16), transparent 38%);filter:blur(12px);opacity:.88;pointer-events:none}
.spx-showcaseBaseFrame{position:relative;z-index:1;width:min(1520px,94vw);margin:0;border-radius:34px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(12,17,30,.96), rgba(8,11,20,.99));box-shadow:0 48px 120px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);transform:translate3d(calc(var(--spx-base-enter-x) + (var(--spx-scene-mx) * -14px)), calc((1 - var(--spx-scene-progress)) * 46px + (var(--spx-scene-my) * -10px)), 0) scale(calc(.9 + (var(--spx-scene-progress) * .1)));opacity:calc(.18 + (var(--spx-scene-progress) * .82));transition:transform .12s ease-out, opacity .12s ease-out, box-shadow .28s ease}
.spx-showcaseBaseFrame:hover{box-shadow:0 56px 136px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06)}
.spx-showcaseBaseImg{display:block;width:100%;height:auto}
.spx-showcasePanel{position:absolute;z-index:2;margin:0;filter:drop-shadow(0 42px 110px rgba(0,0,0,.42));transition:transform .12s ease-out, opacity .12s ease-out;pointer-events:none}
.spx-showcasePanel img{display:block;width:100%;height:auto}
.spx-showcaseSceneSettings{--spx-base-enter-x:-220px;--spx-panel-enter-x:420px}
.spx-showcaseSceneLayers{--spx-base-enter-x:220px;--spx-panel-enter-x:-380px}
.spx-showcasePanelSettings{width:min(820px,52vw);right:-11%;top:2%;transform:translate3d(calc(var(--spx-panel-enter-x) + (var(--spx-scene-mx) * 22px)), calc((1 - var(--spx-scene-progress)) * 28px + (var(--spx-scene-my) * 14px)), 0) scale(calc(.82 + (var(--spx-scene-progress) * .18)));opacity:calc(.08 + (var(--spx-scene-progress) * .92))}
.spx-showcasePanelLayers{width:min(460px,32vw);left:-6.5%;top:2%;transform:translate3d(calc(var(--spx-panel-enter-x) + (var(--spx-scene-mx) * 20px)), calc((1 - var(--spx-scene-progress)) * 28px + (var(--spx-scene-my) * 13px)), 0) scale(calc(.82 + (var(--spx-scene-progress) * .18)));opacity:calc(.08 + (var(--spx-scene-progress) * .92))}
.spx-showcaseSceneSettings .spx-showcaseBaseFrame{transform-origin:left center}
.spx-showcaseSceneLayers .spx-showcaseBaseFrame{transform-origin:right center}
.spx-showcaseSceneSettings .spx-showcaseBaseFrame::after,
.spx-showcaseSceneLayers .spx-showcaseBaseFrame::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg, rgba(7,10,18,.02), rgba(7,10,18,.14))}

html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseScene::before{opacity:.62;filter:blur(10px)}
html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseBaseFrame{border-color:rgba(129,89,58,.12);background:linear-gradient(180deg, rgba(255,249,243,.94), rgba(246,236,227,.98));box-shadow:0 42px 100px rgba(171,117,78,.16)}
html[data-spx-theme="light"] body.spx-prealpha .spx-showcasePanel{filter:drop-shadow(0 34px 84px rgba(171,117,78,.18))}

@media (max-width:1100px){
  .spx-showcaseScene{width:min(1000px,92vw);min-height:560px}
  .spx-showcaseBaseFrame{width:min(920px,84vw)}
  .spx-showcasePanelSettings{right:-4%;width:min(460px,42vw)}
  .spx-showcasePanelLayers{left:-1%;width:min(330px,32vw)}
}
@media (max-width:860px){
  .spx-showcaseScene{min-height:460px;width:100%}
  .spx-showcaseBaseFrame{width:min(920px,96vw)}
  .spx-showcasePanelSettings{right:-1%;top:3%;width:min(370px,46vw)}
  .spx-showcasePanelLayers{left:0%;top:2%;width:min(280px,38vw)}
}
@media (max-width:640px){
  .spx-showcaseScene{min-height:310px}
  .spx-showcaseBaseFrame{width:118vw;max-width:none;margin-inline:-11vw}
  .spx-showcasePanelSettings{width:min(250px,42vw);right:-6px;top:8%}
  .spx-showcasePanelLayers{width:min(180px,32vw);left:-2px;top:8%}
}

.spx-flowBand{display:grid;gap:20px;padding:30px 0 10px;border-top:1px solid rgba(255,255,255,.07)}
.spx-flowBandHead{display:grid;gap:8px;max-width:680px}
.spx-flowBandHead h2{margin:0;font-size:clamp(28px,4vw,40px);line-height:1.08;letter-spacing:-.04em}
.spx-flowBandGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.spx-flowBandGrid article{padding:18px 18px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}
.spx-flowBandGrid strong{display:block;margin-bottom:8px;font-size:16px;line-height:1.25}
.spx-flowBandGrid p{margin:0;color:var(--spx-muted);font-size:14px;line-height:1.76;font-weight:600}

html[data-spx-theme="light"] body.spx-prealpha .spx-main::before{opacity:.18;filter:blur(.2px)}
html[data-spx-theme="light"] body.spx-prealpha .spx-previewCaptionRow,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandGrid article{background:linear-gradient(180deg, rgba(255,250,246,.94), rgba(247,238,230,.98));border-color:rgba(129,89,58,.1);box-shadow:0 30px 70px rgba(170,118,78,.10)}
html[data-spx-theme="light"] body.spx-prealpha .spx-previewCaptionRow span{background:rgba(255,255,255,.66);border-color:rgba(129,89,58,.1)}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollShotImg{border-color:rgba(129,89,58,.12);box-shadow:0 30px 80px rgba(171,117,78,.14)}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureCopy p,
html[data-spx-theme="light"] body.spx-prealpha .spx-previewCaptionRow small,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandGrid p{color:rgba(93,68,49,.82)}
html[data-spx-theme="light"] body.spx-prealpha .spx-featureList li,
html[data-spx-theme="light"] body.spx-prealpha .spx-settingsRows label span,
html[data-spx-theme="light"] body.spx-prealpha .spx-layerItem span,
html[data-spx-theme="light"] body.spx-prealpha .spx-layerFooter b{color:rgba(58,39,25,.92)}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollShotFrame::before{opacity:.72}
html[data-spx-theme="light"] body.spx-prealpha .spx-featureList li::before{box-shadow:0 0 0 6px rgba(233,147,79,.14)}

@media (max-width:1100px){
  .spx-scrollFeature,.spx-scrollFeatureLayers{grid-template-columns:1fr;gap:24px}
  .spx-scrollFeatureLayers .spx-scrollFeatureCopy{order:2}
  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{order:1}
  .spx-scrollFeatureCopy h2{max-width:none}
}
@media (max-width:860px){
  .spx-previewCaptionRow{grid-template-columns:1fr}
  .spx-flowBandGrid{grid-template-columns:1fr}
  .spx-scrollShotFrame{width:min(860px,92vw)}
}
@media (max-width:640px){
  .spx-storyRail{margin-top:42px;gap:24px}
  .spx-scrollFeature{padding:8px 0 18px}
  .spx-scrollShotHost{min-height:280px}
  .spx-scrollShotFrame{width:118vw;max-width:none;margin-inline:-14vw}
  .spx-main::before{display:none}
}


/* public nav / mobile / profile dropdown */
.spx-mobileNavToggle{display:none;align-items:center;justify-content:center;gap:5px;flex-direction:column;width:50px;height:50px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);box-shadow:0 14px 32px rgba(0,0,0,.22);cursor:pointer;transition:transform .28s ease, border-color .28s ease, background .28s ease}
.spx-mobileNavToggle span{display:block;width:18px;height:2px;border-radius:999px;background:#f8f0e8;transition:transform .28s ease, opacity .28s ease}
.spx-topbar.is-mobile-open .spx-mobileNavToggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.spx-topbar.is-mobile-open .spx-mobileNavToggle span:nth-child(2){opacity:0}
.spx-topbar.is-mobile-open .spx-mobileNavToggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.spx-navProfileDrop{position:relative}
.spx-navProfileBtn{display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);color:#fff4e9;cursor:pointer;box-shadow:0 12px 28px rgba(0,0,0,.18);transition:transform .22s ease,border-color .22s ease,background .22s ease}
.spx-navProfileBtn:hover{transform:translateY(-1px);border-color:rgba(255,157,87,.20);background:rgba(255,255,255,.07)}
.spx-navProfileBtn img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.16);box-shadow:0 6px 18px rgba(0,0,0,.22)}
.spx-navProfileMeta{display:grid;gap:2px;text-align:left;line-height:1.04}
.spx-navProfileMeta strong{font-size:13px;font-weight:900}
.spx-navProfileMeta small{font-size:11px;color:rgba(231,239,253,.68);font-weight:700}
.spx-navProfileMenu{position:absolute;top:calc(100% + 10px);right:0;min-width:240px;padding:10px;display:grid;gap:8px;border-radius:22px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(10,14,24,.95), rgba(7,10,17,.98));box-shadow:0 28px 70px rgba(0,0,0,.34);transform:translateY(10px) scale(.98);opacity:0;pointer-events:none;visibility:hidden;transition:opacity .24s ease,transform .24s ease,visibility .24s ease;z-index:25}
.spx-navProfileDrop.is-open .spx-navProfileMenu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;visibility:visible}
.spx-navProfileItem{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#fff4e9;text-decoration:none;font-weight:850}
.spx-navProfileItem:hover{background:rgba(255,255,255,.06);border-color:rgba(255,157,87,.18)}

/* bigger showcase sections */
.spx-storyRail{display:grid;gap:8vh}
.spx-scrollFeature{min-height:112vh;align-items:center}
.spx-showcaseScene{width:min(1880px,100vw);min-height:100vh}
.spx-showcaseBaseFrame{width:min(1520px,94vw)}
.spx-showcasePanelSettings{width:min(820px,52vw);right:-11%;top:2%}
.spx-showcasePanelLayers{width:min(460px,32vw);left:-6.5%;top:2%}

html[data-spx-theme="light"] .spx-navProfileBtn{background:linear-gradient(180deg, rgba(255,248,241,.88), rgba(247,236,223,.96));border-color:rgba(196,131,77,.18);color:#4a2d1d;box-shadow:0 18px 40px rgba(163,93,37,.12)}
html[data-spx-theme="light"] .spx-navProfileMeta small{color:rgba(109,71,46,.62)}
html[data-spx-theme="light"] .spx-navProfileMenu{border-color:rgba(196,131,77,.18);background:linear-gradient(180deg, rgba(255,248,240,.98), rgba(247,236,223,.98));box-shadow:0 22px 60px rgba(163,93,37,.14)}
html[data-spx-theme="light"] .spx-navProfileItem{background:rgba(255,255,255,.55);border-color:rgba(196,131,77,.14);color:#4a2d1d}

@media (max-width: 980px){
  .spx-showcaseScene{min-height:82vh;width:min(1520px,100vw)}
  .spx-showcaseBaseFrame{width:min(1320px,96vw)}
  .spx-showcasePanelSettings{width:min(680px,60vw);right:-6%}
  .spx-showcasePanelLayers{width:min(420px,38vw);left:-3%}
}
@media (max-width: 720px){
  .spx-mobileNavToggle{display:inline-flex}
  .spx-topbar{display:grid;grid-template-columns:1fr auto;align-items:center}
  .spx-topActions[data-mobile-nav]{grid-column:1 / -1;display:grid;gap:10px;width:100%;max-height:0;opacity:0;overflow:hidden;pointer-events:none;transform:translateY(-8px);transition:max-height .38s ease, opacity .3s ease, transform .38s ease;padding-top:0}
  .spx-topbar.is-mobile-open .spx-topActions[data-mobile-nav]{max-height:420px;opacity:1;pointer-events:auto;transform:none;padding-top:12px}
  .spx-topActions .spx-btn,.spx-topActions .spx-themeToggle,.spx-topActions .spx-navProfileDrop{width:100%}
  .spx-navProfileMenu{position:relative;top:0;right:auto;min-width:0}
  .spx-navProfileBtn{width:100%;justify-content:flex-start;border-radius:22px}
  .spx-scrollFeature{min-height:auto;padding:6vh 0 2vh}
  .spx-showcaseScene{min-height:62vh;width:100vw}
  .spx-showcaseBaseFrame{width:136vw;max-width:none;margin-inline:-18vw}
  .spx-showcasePanelSettings{width:min(430px,64vw);right:-8vw;top:6%}
  .spx-showcasePanelLayers{width:min(290px,42vw);left:-6vw;top:7%}
}


/* public updates rail widening */
.spx-newsSectionWide{max-width:min(1620px,96vw)!important;width:100%;margin-inline:auto;}
.spx-newsSectionActions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.spx-newsArrows{display:inline-flex;align-items:center;gap:10px}
.spx-newsArrow{appearance:none;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--spx-text);width:48px;height:48px;border-radius:16px;font-size:20px;font-weight:900;cursor:pointer;box-shadow:0 16px 34px rgba(0,0,0,.18);transition:transform .25s var(--spx-ease),border-color .25s var(--spx-ease),background .25s var(--spx-ease),opacity .25s var(--spx-ease)}
.spx-newsArrow:hover:not(:disabled){transform:translateY(-1px);border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.08)}
.spx-newsArrow:disabled{opacity:.38;cursor:default}
.spx-newsSwiper{position:relative;overflow:hidden;padding-top:6px}
.spx-newsTrack{display:flex;gap:22px;overflow:auto;padding:6px 2px 10px;scrollbar-width:none;scroll-snap-type:x proximity;-ms-overflow-style:none}
.spx-newsTrack::-webkit-scrollbar{display:none}
.spx-newsSlide{flex:0 0 min(520px,36vw);scroll-snap-align:start;height:auto}
.spx-newsCard.spx-newsSlide{display:flex;flex-direction:column;min-height:100%}
.spx-newsCard.spx-newsSlide .spx-newsCardVisual{min-height:240px}
.spx-newsCard.spx-newsSlide .spx-newsCardBody{display:flex;flex-direction:column;flex:1 1 auto}
.spx-newsCard.spx-newsSlide .spx-btn{margin-top:auto}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsArrow{background:linear-gradient(180deg, rgba(255,248,241,.86), rgba(247,236,223,.96));border-color:rgba(196,131,77,.16);color:#5a3923;box-shadow:0 16px 32px rgba(163,93,37,.10)}
@media (max-width:980px){.spx-newsSlide{flex-basis:min(440px,72vw)}}
@media (max-width:720px){.spx-newsSectionHead{gap:14px}.spx-newsSectionActions{width:100%;justify-content:space-between}.spx-newsSlide{flex-basis:min(86vw,520px)}.spx-newsCard.spx-newsSlide .spx-newsCardVisual{min-height:210px}}


/* full-screen showcase pass */
.spx-storyRail{max-width:100%;gap:12vh;margin-top:84px}
.spx-scrollFeature{max-width:min(1780px,100vw);margin:0 auto;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:clamp(28px,4.5vw,72px);min-height:148vh;padding-inline:clamp(20px,3.2vw,56px)}
.spx-scrollFeatureLayers{grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr)}
.spx-scrollFeatureVisual{position:sticky;top:8vh;min-height:84vh;align-self:start}
.spx-showcaseScene{width:min(1720px,100vw);min-height:84vh}
.spx-showcaseBaseFrame{width:min(1380px,86vw);border-radius:38px;transform:translate3d(calc(var(--spx-base-enter-x) + (var(--spx-scene-mx) * -20px)), calc((1 - var(--spx-scene-progress)) * 28px + (var(--spx-scene-my) * -12px)), 0) scale(calc(.96 + (var(--spx-scene-progress) * .04)));opacity:calc(.42 + (var(--spx-scene-progress) * .58))}
.spx-showcasePanel{filter:drop-shadow(0 56px 132px rgba(0,0,0,.42))}
.spx-showcasePanelSettings{width:min(940px,60vw);right:-18%;top:4%;transform:translate3d(calc(var(--spx-panel-enter-x) + (var(--spx-scene-mx) * 26px)), calc((1 - var(--spx-scene-progress)) * 12px + (var(--spx-scene-my) * 14px)), 0) scale(calc(.9 + (var(--spx-scene-progress) * .1)));opacity:calc(.34 + (var(--spx-scene-progress) * .66))}
.spx-showcasePanelLayers{width:min(540px,38vw);left:-12%;top:6%;transform:translate3d(calc(var(--spx-panel-enter-x) + (var(--spx-scene-mx) * 24px)), calc((1 - var(--spx-scene-progress)) * 14px + (var(--spx-scene-my) * 13px)), 0) scale(calc(.9 + (var(--spx-scene-progress) * .1)));opacity:calc(.34 + (var(--spx-scene-progress) * .66))}
@media (max-width:1180px){.spx-scrollFeature,.spx-scrollFeatureLayers{grid-template-columns:1fr;min-height:auto;gap:24px}.spx-scrollFeatureVisual{position:relative;top:auto;min-height:unset}.spx-showcaseScene{min-height:72vh}.spx-showcaseBaseFrame{width:min(1360px,96vw)}.spx-showcasePanelSettings{right:-10%;width:min(760px,72vw)}.spx-showcasePanelLayers{left:-6%;width:min(420px,42vw)}}
@media (max-width:720px){.spx-storyRail{gap:8vh}.spx-scrollFeature{padding-inline:0}.spx-showcaseScene{min-height:54vh}.spx-showcaseBaseFrame{width:154vw;max-width:none;margin-inline:-27vw}.spx-showcasePanelSettings{width:min(460px,76vw);right:-12vw;top:8%}.spx-showcasePanelLayers{width:min(300px,54vw);left:-10vw;top:10%}}


/* public mobile nav polish */
.spx-mobileNavToggle{border-color:rgba(255,210,173,.18);background:linear-gradient(180deg, rgba(20,24,38,.72), rgba(11,15,25,.92));box-shadow:0 16px 36px rgba(0,0,0,.22)}
.spx-mobileNavToggle span{width:20px;height:2.5px;background:#f1d4b5}
.spx-mobileNavToggle:hover{transform:translateY(-1px);border-color:rgba(255,210,173,.26);background:linear-gradient(180deg, rgba(28,33,50,.82), rgba(14,18,29,.98))}
html[data-spx-theme="light"] .spx-mobileNavToggle{border-color:rgba(179,115,68,.16);background:linear-gradient(180deg, rgba(255,248,241,.92), rgba(247,236,223,.98));box-shadow:0 16px 32px rgba(163,93,37,.10)}
html[data-spx-theme="light"] .spx-mobileNavToggle span{background:#6e4027}
@media (max-width:720px){.spx-topActions .spx-btn,.spx-topActions .spx-themeToggleWrap,.spx-topActions .spx-navProfileDrop{width:100%}.spx-topActions .spx-btn,.spx-topActions .spx-themeToggle,.spx-topActions .spx-navProfileBtn{display:flex;width:100%;min-height:50px;justify-content:center;border-radius:18px}.spx-topActions .spx-btn{padding-inline:18px}.spx-topActions .spx-themeToggle{justify-content:space-between}.spx-topActions[data-mobile-nav]{padding-bottom:4px}}

/* --- v8 showcase motion + feature hotspots refinement --- */
.spx-storyRail{gap:16vh;margin-top:104px;max-width:none;padding-inline:0}
.spx-scrollFeature{position:relative;width:100%;max-width:none;margin:0;grid-template-columns:minmax(0,1.18fr) minmax(420px,.82fr);gap:clamp(34px,4.4vw,92px);min-height:190vh;padding-inline:clamp(20px,3vw,44px);overflow:hidden;--spx-scene-progress:0;--spx-scene-enter:0;--spx-copy-enter:0;--spx-points-enter:0;--spx-scene-exit:0;--spx-base-x:0px;--spx-base-y:0px;--spx-panel-x:0px;--spx-panel-y:0px;--spx-copy-x:0px;--spx-copy-y:0px}
.spx-scrollFeatureSettings{grid-template-columns:minmax(0,1.18fr) minmax(420px,.82fr)}
.spx-scrollFeatureLayers{grid-template-columns:minmax(420px,.82fr) minmax(0,1.18fr)}
.spx-scrollFeatureVisual{position:sticky;top:5vh;min-height:96vh;align-self:start;overflow:visible;display:flex;justify-content:flex-start;pointer-events:none}
.spx-scrollFeatureCopy{display:grid;gap:16px}
.spx-scrollFeatureCopyCard{position:relative;z-index:8;align-self:center;padding:clamp(28px,2.8vw,40px);border-radius:34px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(9,13,23,.84), rgba(8,10,18,.62));box-shadow:0 40px 110px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(16px);transform:translate3d(var(--spx-copy-x), var(--spx-copy-y), 0);opacity:calc(.04 + (var(--spx-copy-enter) * .96) - (var(--spx-scene-exit) * .12));will-change:transform,opacity}
.spx-scrollFeatureCopySettings{justify-self:end;max-width:min(760px,42vw);margin-right:clamp(18px,3vw,54px)}
.spx-scrollFeatureCopyLayers{justify-self:start;max-width:min(760px,42vw);margin-left:clamp(18px,3vw,54px)}
.spx-scrollFeatureCopy h2{margin:0;font-size:clamp(30px,4vw,46px);line-height:1.02;letter-spacing:-.045em;max-width:13ch}
.spx-scrollFeatureCopy p{margin:0;color:var(--spx-muted);font-size:15px;line-height:1.85;font-weight:650;max-width:60ch}
.spx-featureListWide{margin-top:6px}

.spx-showcaseScene{position:relative;width:clamp(1480px,118vw,2100px);min-height:96vh;display:flex;align-items:center;justify-content:flex-start;padding-left:0;--spx-scene-mx:0;--spx-scene-my:0}
.spx-showcaseBaseFrame{position:relative;z-index:1;width:min(1560px,94vw);margin:0 auto 0 0;border-radius:40px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg, rgba(12,17,30,.98), rgba(8,11,20,.99));box-shadow:0 52px 132px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);will-change:transform,opacity;transition:none !important}
.spx-showcaseBaseImg{display:block;width:100%;height:auto}
.spx-showcaseSceneSettings .spx-showcaseBaseFrame{transform-origin:left center;transform:translate3d(calc(var(--spx-base-x) + (var(--spx-scene-mx) * -14px)), calc(var(--spx-base-y) + (var(--spx-scene-my) * -8px)), 0) scale(calc(.972 + (var(--spx-scene-enter) * .028) - (var(--spx-scene-exit) * .02)));opacity:.9}
.spx-showcaseSceneSettings .spx-showcaseBaseImg{opacity:.9}
.spx-showcaseSceneLayers .spx-showcaseBaseFrame{transform-origin:right center;transform:translate3d(calc(var(--spx-base-x) + (var(--spx-scene-mx) * -14px)), calc(var(--spx-base-y) + (var(--spx-scene-my) * -8px)), 0) scale(calc(.972 + (var(--spx-scene-enter) * .028) - (var(--spx-scene-exit) * .02)));opacity:1}
.spx-showcasePanel{position:absolute;z-index:6;margin:0;pointer-events:none;will-change:transform,opacity,filter;transition:none !important}
.spx-showcasePanel img{display:block;width:100%;height:auto}
.spx-showcasePanelSettings{width:min(470px,28vw);right:7%;top:-1.5%;filter:drop-shadow(0 42px 92px rgba(0,0,0,.54));transform:translate3d(calc(var(--spx-panel-x) + (var(--spx-scene-mx) * 12px)), calc(var(--spx-panel-y) + (var(--spx-scene-my) * 9px)), 0) scale(calc(.92 + (var(--spx-copy-enter) * .08) - (var(--spx-scene-exit) * .02)));opacity:calc(.18 + (var(--spx-copy-enter) * .82) - (var(--spx-scene-exit) * .08))}
.spx-showcasePanelLayers{width:min(360px,22vw);left:6%;top:2%;filter:drop-shadow(0 38px 80px rgba(0,0,0,.48));transform:translate3d(calc(var(--spx-panel-x) + (var(--spx-scene-mx) * 11px)), calc(var(--spx-panel-y) + (var(--spx-scene-my) * 9px)), 0) scale(calc(.92 + (var(--spx-copy-enter) * .08) - (var(--spx-scene-exit) * .02)));opacity:calc(.18 + (var(--spx-copy-enter) * .82) - (var(--spx-scene-exit) * .08))}

.spx-showcaseHotspots{position:absolute;inset:0;pointer-events:none}
.spx-showcaseHotspot{position:absolute;border-radius:24px;border:1px solid rgba(172,124,255,.78);background:rgba(135,114,255,.14);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 0 12px rgba(126,107,255,.06),0 24px 42px rgba(59,39,119,.34);opacity:0;transform:scale(.96);transition:opacity .32s ease, transform .32s ease, box-shadow .32s ease}
.spx-showcaseHotspot::after{content:'';position:absolute;inset:-10px;border-radius:inherit;border:1px dashed rgba(190,164,255,.44);opacity:.88}
.spx-showcaseHotspotNav{right:1.2%;top:14%;width:14%;height:78%}
.spx-showcaseHotspotContent{left:4%;top:20%;width:76%;height:72%}
.spx-showcaseHotspotHeader{left:4%;top:4%;width:76%;height:15%}
[data-active-hotspot="settings-nav"] .spx-showcaseHotspotNav,
[data-active-hotspot="settings-content"] .spx-showcaseHotspotContent,
[data-active-hotspot="settings-header"] .spx-showcaseHotspotHeader{opacity:1;transform:scale(1)}

.spx-featurePoints{display:grid;gap:12px;margin-top:10px}
.spx-featurePoint{appearance:none;position:relative;overflow:hidden;display:grid;grid-template-columns:46px minmax(0,1fr);align-items:start;gap:14px;width:100%;padding:16px 18px;border-radius:22px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);text-align:left;color:var(--spx-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);cursor:pointer;opacity:0;transform:translateX(24px);transition:transform .62s cubic-bezier(.22,.61,.36,1), opacity .62s cubic-bezier(.22,.61,.36,1), border-color .22s ease,background .22s ease,box-shadow .22s ease}
.spx-featurePoint::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:3px;border-radius:999px;background:linear-gradient(90deg, rgba(255,184,109,.95), rgba(168,118,255,.95));transform-origin:left center;transform:scaleX(0);opacity:0;pointer-events:none}
.spx-featurePoint:hover,.spx-featurePoint.is-active{transform:translateY(-2px);border-color:rgba(178,140,255,.28);background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));box-shadow:0 18px 34px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.06)}
.spx-featurePoint.is-active::after{opacity:1;animation:spxFeatureCountdown 3.2s linear forwards}
[data-feature-rotator]:hover .spx-featurePoint.is-active::after,
[data-feature-rotator]:focus-within .spx-featurePoint.is-active::after{animation-play-state:paused}
.spx-scrollFeature.is-points-active .spx-featurePoint{opacity:1;transform:translateX(0)}
.spx-scrollFeature.is-points-active .spx-featurePoint:nth-child(1){transition-delay:.02s}
.spx-scrollFeature.is-points-active .spx-featurePoint:nth-child(2){transition-delay:.14s}
.spx-scrollFeature.is-points-active .spx-featurePoint:nth-child(3){transition-delay:.26s}
.spx-scrollFeatureLayers .spx-featurePoint{transform:translateX(-24px)}

@keyframes spxFeatureCountdown{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.spx-featurePointBody{display:grid;gap:6px}
.spx-featurePointBody strong{font-size:15px;line-height:1.15;color:var(--spx-text)}
.spx-featurePointBody small{font-size:13px;line-height:1.55;color:var(--spx-muted);font-weight:700}
.spx-featurePointIcon{position:relative;width:46px;height:46px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.spx-featurePointIcon::before,.spx-featurePointIcon::after{content:'';position:absolute}
.spx-featurePointIcon-list::before{left:12px;right:12px;top:13px;height:2px;background:#c3ceff;box-shadow:0 8px 0 #c3ceff,0 16px 0 #c3ceff}
.spx-featurePointIcon-content::before{inset:10px;border-radius:10px;border:2px solid #8fd0ff}
.spx-featurePointIcon-content::after{left:16px;right:16px;top:22px;height:2px;background:#8fd0ff;box-shadow:0 8px 0 #8fd0ff}
.spx-featurePointIcon-header::before{left:10px;right:10px;top:10px;height:10px;border-radius:8px;background:#ffd38f}
.spx-featurePointIcon-header::after{left:12px;right:12px;top:26px;height:2px;background:#ffd38f;box-shadow:0 8px 0 #ffd38f}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureCopyCard{border-color:rgba(124,79,49,.12);background:linear-gradient(180deg, rgba(255,248,241,.92), rgba(247,236,223,.84));box-shadow:0 34px 90px rgba(163,93,37,.12)}
html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseBaseFrame{border-color:rgba(129,89,58,.12);background:linear-gradient(180deg, rgba(255,249,243,.94), rgba(246,236,227,.98));box-shadow:0 42px 100px rgba(171,117,78,.16)}
html[data-spx-theme="light"] body.spx-prealpha .spx-showcasePanel{filter:drop-shadow(0 30px 54px rgba(171,117,78,.22))}
html[data-spx-theme="light"] body.spx-prealpha .spx-featurePoint{border-color:rgba(124,79,49,.12);background:rgba(255,255,255,.48);box-shadow:0 18px 36px rgba(171,117,78,.06), inset 0 1px 0 rgba(255,255,255,.7)}
html[data-spx-theme="light"] body.spx-prealpha .spx-featurePoint::after{background:linear-gradient(90deg, rgba(229,142,84,.96), rgba(192,120,78,.96))}
html[data-spx-theme="light"] body.spx-prealpha .spx-featurePoint:hover,
html[data-spx-theme="light"] body.spx-prealpha .spx-featurePoint.is-active{border-color:rgba(196,131,77,.24);background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(250,240,230,.92))}
html[data-spx-theme="light"] body.spx-prealpha .spx-showcaseHotspot{border-color:rgba(187,104,63,.64);background:rgba(255,170,102,.16);box-shadow:0 0 0 1px rgba(255,255,255,.34),0 0 0 10px rgba(255,170,102,.07),0 20px 36px rgba(171,117,78,.18)}

@media (max-width:1180px){
  .spx-scrollFeature,.spx-scrollFeatureLayers{grid-template-columns:1fr;min-height:auto;gap:28px;padding-inline:16px}
  .spx-scrollFeatureVisual{position:relative;top:auto;min-height:unset}
  .spx-scrollFeatureCopySettings,.spx-scrollFeatureCopyLayers{max-width:none;justify-self:auto;margin:0}
  .spx-showcaseScene{min-height:76vh}
  .spx-showcaseBaseFrame{width:min(1400px,96vw)}
  .spx-showcasePanelSettings{width:min(380px,42vw);right:0;top:3%}
  .spx-showcasePanelLayers{width:min(280px,34vw);left:2%;top:10%}
}
@media (max-width:720px){
  .spx-storyRail{gap:9vh}
  .spx-scrollFeature{padding:4vh 0 2vh}
  .spx-showcaseScene{min-height:58vh;width:100vw}
  .spx-showcaseBaseFrame{width:142vw;max-width:none;margin-inline:-21vw}
  .spx-showcasePanelSettings{width:min(280px,58vw);right:-3vw;top:4%}
  .spx-showcasePanelLayers{width:min(190px,40vw);left:-2vw;top:8%}
  .spx-featurePoint{grid-template-columns:40px minmax(0,1fr);padding:14px 14px}
  .spx-featurePointIcon{width:40px;height:40px}
}


/* --- showcase lane full-width docking correction --- */
.spx-storyRail{max-width:none;padding-inline:0;}
.spx-scrollFeature,.spx-scrollFeatureLayers{width:100%;max-width:none;margin:0;grid-template-columns:minmax(0,1.18fr) minmax(440px,.82fr);gap:clamp(34px,4.4vw,96px);padding-inline:clamp(20px,3vw,44px);}
.spx-scrollFeatureSettings .spx-scrollFeatureVisual{justify-content:flex-start;margin-left:clamp(-360px,-20vw,-120px);}
.spx-scrollFeatureLayers{grid-template-columns:minmax(440px,.82fr) minmax(0,1.18fr);}
.spx-scrollFeatureLayers .spx-scrollFeatureVisual{justify-content:flex-end;margin-right:clamp(-320px,-18vw,-110px);}
.spx-scrollFeatureCopySettings{justify-self:end;max-width:min(820px,44vw);margin-left:auto;margin-right:clamp(26px,3vw,72px);}
.spx-scrollFeatureCopyLayers{justify-self:start;max-width:min(820px,44vw);margin-right:auto;margin-left:clamp(26px,3vw,72px);}
.spx-showcaseScene{justify-content:flex-start;}
.spx-scrollFeatureLayers .spx-showcaseScene{justify-content:flex-end;}
.spx-showcaseBaseFrame{width:min(1680px,102vw);}
.spx-showcasePanelSettings{right:7%;top:-1.5%;}
.spx-showcasePanelLayers{left:6%;top:2%;}
@media (max-width:1180px){
  .spx-storyRail{max-width:min(1400px,100vw);padding-inline:16px;}
  .spx-scrollFeature,.spx-scrollFeatureLayers{grid-template-columns:1fr;max-width:none;gap:28px;}
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual,.spx-scrollFeatureLayers .spx-scrollFeatureVisual{margin:0;justify-content:center;}
  .spx-scrollFeatureCopySettings,.spx-scrollFeatureCopyLayers{max-width:none;justify-self:auto;margin:0;}
  .spx-showcaseScene,.spx-scrollFeatureLayers .spx-showcaseScene{justify-content:center;}
}

/* --- v8 showcase docking polish / full-width edge entry --- */
.spx-storyRail{gap:10vh;overflow:visible}
.spx-scrollFeature{
  position:relative;
  width:100vw;
  max-width:none;
  margin-inline:calc(50% - 50vw);
  grid-template-columns:minmax(0,1.22fr) minmax(540px,.78fr);
  gap:clamp(40px,4vw,92px);
  min-height:205vh;
  padding-top:0;
  padding-bottom:0;
  padding-left:0;
  padding-right:clamp(24px,3.2vw,56px);
  overflow:visible;
}
.spx-scrollFeatureVisual{
  position:sticky;
  top:7vh;
  min-height:92vh;
  align-self:start;
  display:flex;
  justify-content:flex-start;
  overflow:visible;
}
.spx-scrollFeatureSettings .spx-scrollFeatureVisual{
  margin-left:calc(-1 * min(24vw, 420px));
}
.spx-scrollFeatureLayers .spx-scrollFeatureVisual{
  justify-content:flex-end;
  margin-right:calc(-1 * min(16vw, 260px));
}
.spx-scrollFeatureCopyCard{
  align-self:center;
  width:min(860px,100%);
  max-width:none;
  transform:translate3d(var(--spx-copy-x), var(--spx-copy-y), 0);
}
.spx-scrollFeatureCopySettings{
  justify-self:end;
  width:min(860px,46vw);
  margin-left:auto;
  margin-right:clamp(32px,3.6vw,86px);
  padding-right:clamp(16px,2.2vw,42px);
}
.spx-scrollFeatureCopyLayers{
  justify-self:start;
  width:min(840px,44vw);
  margin-right:auto;
  margin-left:clamp(32px,3.6vw,86px);
}
.spx-showcaseScene{
  position:relative;
  width:clamp(1760px,132vw,2600px);
  min-height:92vh;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible;
}
.spx-scrollFeatureLayers .spx-showcaseScene{justify-content:flex-end}
.spx-showcaseBaseFrame{
  width:min(1760px,108vw);
  border-radius:40px;
  transition:none !important;
}
.spx-showcaseSceneSettings .spx-showcaseBaseFrame{
  transform-origin:left center;
  transform:translate3d(calc(var(--spx-base-x)), calc(var(--spx-base-y)), 0) scale(calc(.97 + (var(--spx-scene-enter) * .03) - (var(--spx-scene-exit) * .02)));
  opacity:calc(.24 + (var(--spx-scene-enter) * .66));
}
.spx-showcaseSceneLayers .spx-showcaseBaseFrame{
  transform-origin:right center;
  transform:translate3d(calc(var(--spx-base-x)), calc(var(--spx-base-y)), 0) scale(calc(.97 + (var(--spx-scene-enter) * .03) - (var(--spx-scene-exit) * .02)));
  opacity:calc(.24 + (var(--spx-scene-enter) * .76));
}
.spx-showcasePanel{
  z-index:7;
  transition:none !important;
}
.spx-showcasePanelSettings{
  width:min(430px,27vw);
  right:12%;
  top:0%;
  filter:drop-shadow(0 40px 92px rgba(0,0,0,.5));
  transform:translate3d(var(--spx-panel-x), var(--spx-panel-y), 0) scale(calc(.9 + (var(--spx-copy-enter) * .1) - (var(--spx-scene-exit) * .02)));
  opacity:calc(.1 + (var(--spx-copy-enter) * .9) - (var(--spx-scene-exit) * .08));
}
.spx-showcasePanelLayers{
  width:min(330px,22vw);
  left:7%;
  top:2%;
  filter:drop-shadow(0 34px 80px rgba(0,0,0,.46));
  transform:translate3d(var(--spx-panel-x), var(--spx-panel-y), 0) scale(calc(.9 + (var(--spx-copy-enter) * .1) - (var(--spx-scene-exit) * .02)));
  opacity:calc(.1 + (var(--spx-copy-enter) * .9) - (var(--spx-scene-exit) * .08));
}
.spx-scrollFeature.is-docked .spx-showcaseBaseFrame,
.spx-scrollFeature.is-copy-active .spx-showcaseBaseFrame{
  box-shadow:0 52px 132px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
}
.spx-featurePoints{margin-top:14px}
.spx-featurePoint{backdrop-filter:blur(12px)}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureCopyCard{
  background:linear-gradient(180deg, rgba(255,248,241,.94), rgba(247,236,223,.88));
}
@media (max-width: 1180px){
  .spx-scrollFeature{width:100%;margin:0;grid-template-columns:1fr;min-height:auto;padding-inline:20px}
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual,
  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{margin:0;justify-content:center}
  .spx-scrollFeatureCopySettings,.spx-scrollFeatureCopyLayers{width:100%;margin:0;max-width:none;justify-self:auto}
  .spx-showcaseScene{width:min(1500px,100vw);min-height:74vh}
  .spx-showcaseBaseFrame{width:min(1420px,96vw)}
  .spx-showcasePanelSettings{width:min(360px,44vw);right:2%;top:2%}
  .spx-showcasePanelLayers{width:min(270px,34vw);left:2%;top:8%}
}
@media (max-width: 720px){
  .spx-scrollFeature{padding-inline:0;padding-top:4vh}
  .spx-scrollFeatureVisual{position:relative;top:auto;min-height:unset}
  .spx-showcaseScene{width:100vw;min-height:56vh}
  .spx-showcaseBaseFrame{width:146vw;max-width:none;margin-inline:-23vw}
  .spx-showcasePanelSettings{width:min(260px,58vw);right:-4vw;top:6%}
  .spx-showcasePanelLayers{width:min(190px,40vw);left:-2vw;top:10%}
}

/* --- edge entry hard alignment fix --- */
.spx-scrollFeatureSettings .spx-showcaseScene{margin-left:calc(-1 * min(15vw, 280px));}
.spx-scrollFeatureLayers .spx-showcaseScene{margin-right:calc(-1 * min(8vw, 140px));}
@media (max-width:1180px){
  .spx-scrollFeature{padding-right:0;}
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual,.spx-scrollFeatureLayers .spx-scrollFeatureVisual{margin-left:0;margin-right:0;}
  .spx-scrollFeatureSettings .spx-showcaseScene,.spx-scrollFeatureLayers .spx-showcaseScene{margin-left:0;margin-right:0;}
}

/* --- final hard viewport-edge breakout fix for settings/layers showcase --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    position:relative;
    grid-template-columns:minmax(0,1fr) minmax(560px, 42vw);
    column-gap:clamp(36px, 4vw, 88px);
    padding-left:0 !important;
    padding-right:clamp(24px,3.2vw,56px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual,
  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    grid-column:1 / -1;
    width:100vw;
    justify-self:stretch;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    justify-content:flex-start !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    justify-content:flex-end !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    grid-column:2;
    position:relative;
    z-index:12;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:100vw !important;
    max-width:none !important;
    min-height:92vh;
    margin:0 !important;
    padding:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{justify-content:flex-start !important;}
  .spx-scrollFeatureLayers .spx-showcaseScene{justify-content:flex-end !important;}

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseBaseFrame{
    width:min(1680px, 96vw) !important;
    max-width:none !important;
    margin:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{right:clamp(64px, 8vw, 160px) !important;}
  .spx-scrollFeatureLayers .spx-showcasePanelLayers{left:clamp(16px, 3vw, 64px) !important;}
}


/* --- viewport overflow release fix --- */
@media (min-width:1181px){
  .spx-storyRail,
  .spx-scrollFeature,
  .spx-scrollFeatureVisual,
  .spx-showcaseScene{overflow:visible !important;}
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{margin-left:calc(-1 * min(28vw, 520px)) !important;}
  .spx-scrollFeatureSettings .spx-showcaseScene{margin-left:calc(-1 * min(20vw, 360px)) !important;}
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{width:min(1700px, 98vw) !important;}
  .spx-scrollFeatureSettings .spx-showcasePanelSettings{right:clamp(88px, 10vw, 220px) !important; top:clamp(4px, 1.2vw, 18px) !important;}
}


/* --- pass46 settings showcase centering + pulled-panel polish --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    padding-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(22vw, 420px)) !important;
    margin-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(12vw, 220px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1680px, 96vw) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(760px, calc(42vw - 100px));
    max-width:min(760px, calc(42vw - 100px));
    margin-right:100px !important;
    padding-right:0;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene::after{
    content:"";
    position:absolute;
    z-index:2;
    right:clamp(320px, 23vw, 460px);
    top:50%;
    width:min(380px, 22vw);
    height:min(500px, 31vw);
    transform:translateY(-50%);
    border-radius:34px;
    border:1px solid rgba(142,121,255,.24);
    background:
      linear-gradient(180deg, rgba(116,89,255,.12), rgba(19,25,42,.03)),
      radial-gradient(circle at 18% 18%, rgba(146,220,255,.14), transparent 52%);
    box-shadow:
      0 0 0 1px rgba(255,255,255,.03),
      0 0 0 24px rgba(111,89,255,.05),
      inset 0 1px 0 rgba(255,255,255,.05),
      0 34px 90px rgba(6,10,20,.20);
    opacity:calc(.10 + (var(--spx-copy-enter) * .62) - (var(--spx-scene-exit) * .24));
    pointer-events:none;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:50% !important;
    right:clamp(112px, 12vw, 230px) !important;
    width:min(500px, 29vw) !important;
    overflow:visible;
    filter:drop-shadow(0 56px 138px rgba(0,0,0,.58)) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.91 + (var(--spx-copy-enter) * .11) - (var(--spx-scene-exit) * .02))) !important;
    opacity:calc(.10 + (var(--spx-copy-enter) * .90) - (var(--spx-scene-exit) * .08));
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    content:"";
    position:absolute;
    inset:-4% -4% -6% -18%;
    z-index:-2;
    border-radius:34px;
    background:
      linear-gradient(90deg, rgba(134,108,255,.24), rgba(134,108,255,0) 48%),
      radial-gradient(circle at 72% 14%, rgba(142,221,255,.18), transparent 30%),
      radial-gradient(circle at 12% 52%, rgba(125,99,255,.20), transparent 46%);
    filter:blur(18px);
    opacity:calc(.08 + (var(--spx-copy-enter) * .84));
    pointer-events:none;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    content:"";
    position:absolute;
    left:-18%;
    top:18%;
    width:34%;
    height:64%;
    z-index:-1;
    border-radius:28px;
    background:
      linear-gradient(90deg, rgba(121,98,255,.22), rgba(121,98,255,.02) 72%),
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    filter:blur(10px);
    opacity:calc(.06 + (var(--spx-copy-enter) * .72));
    pointer-events:none;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img{
    position:relative;
    border-radius:28px;
    border:1px solid rgba(255,255,255,.12);
    box-shadow:
      0 22px 56px rgba(0,0,0,.26),
      inset 0 1px 0 rgba(255,255,255,.06),
      0 0 0 1px rgba(125,98,255,.08);
    background:linear-gradient(180deg, rgba(10,14,25,.96), rgba(7,10,18,.99));
  }
}

@media (max-width:1180px){
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    margin-right:0 !important;
    width:100%;
    max-width:none;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:8% !important;
    transform:translate3d(var(--spx-panel-x), var(--spx-panel-y), 0) scale(calc(.9 + (var(--spx-copy-enter) * .1) - (var(--spx-scene-exit) * .02))) !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcaseScene::after{
  border-color:rgba(191,117,79,.16);
  background:
    linear-gradient(180deg, rgba(255,171,116,.12), rgba(255,248,240,.02)),
    radial-gradient(circle at 18% 18%, rgba(255,198,143,.12), transparent 52%);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.22),
    0 0 0 22px rgba(255,170,102,.06),
    inset 0 1px 0 rgba(255,255,255,.55),
    0 28px 74px rgba(171,117,78,.12);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings{
  filter:drop-shadow(0 44px 92px rgba(171,117,78,.22)) !important;
}



/* --- pass47 showcase immersion / solid settings panel / centered scroll choreography --- */
@media (min-width:1181px){
  .spx-scrollFeature,
  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    align-items:center;
  }

  .spx-scrollFeatureVisual{
    top:0 !important;
    min-height:100vh !important;
    display:grid !important;
    align-items:center !important;
  }

  .spx-scrollFeatureCopy{
    min-height:100vh;
    align-content:center;
  }

  .spx-scrollFeatureCopySettings{
    margin-right:100px !important;
    padding-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(24vw, 460px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(14vw, 260px)) !important;
    min-height:clamp(720px, 88vh, 980px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    min-height:clamp(720px, 88vh, 980px) !important;
  }

  .spx-showcaseBaseFrame{
    position:relative;
    isolation:isolate;
  }

  .spx-showcaseBaseFrame::after{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background:linear-gradient(180deg, rgba(3,6,12,0), rgba(3,6,12,.18));
    opacity:calc((var(--spx-copy-enter) * .34) + (var(--spx-scene-exit) * .14));
  }

  .spx-showcaseSceneSettings .spx-showcaseBaseFrame{
    opacity:calc(.96 - (var(--spx-copy-enter) * .38) - (var(--spx-scene-exit) * .10)) !important;
    filter:saturate(calc(1 - (var(--spx-copy-enter) * .08))) brightness(calc(1 - (var(--spx-copy-enter) * .03)));
  }

  .spx-showcasePanelSettings,
  .spx-showcasePanelLayers{
    opacity:clamp(0, calc((var(--spx-copy-enter) - .04) * 6.5), 1) !important;
  }

  .spx-showcasePanelSettings{
    top:50% !important;
    right:clamp(118px, 11vw, 248px) !important;
    transform-origin:center right;
    filter:drop-shadow(0 42px 96px rgba(0,0,0,.52));
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.84 + (var(--spx-copy-enter) * .18) - (var(--spx-scene-exit) * .02))) !important;
  }

  .spx-showcasePanelSettings::before{
    content:'';
    position:absolute;
    inset:-12px;
    border-radius:30px;
    background:linear-gradient(180deg, rgba(10,14,24,.98), rgba(8,11,19,.99));
    box-shadow:0 34px 110px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.08);
    z-index:-2;
  }

  .spx-showcasePanelSettings::after{
    content:'';
    position:absolute;
    inset:-10% -8% -8% -10%;
    border-radius:42px;
    background:radial-gradient(circle at 26% 28%, rgba(124,217,255,.24), rgba(103,120,255,.12) 28%, transparent 72%);
    opacity:calc(.2 + (var(--spx-copy-enter) * .46));
    filter:blur(26px);
    z-index:-3;
    transform:scale(calc(.94 + (var(--spx-copy-enter) * .12)));
  }
}

@media (max-width:1180px){
  .spx-scrollFeatureCopySettings{margin-right:0 !important;}
}


/* --- pass48 balance recovery / softer settings panel / restored page centering --- */
@media (min-width:1181px){
  .spx-scrollFeatureCopy{
    min-height:100vh;
    display:grid;
    align-content:center;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    width:min(700px, 38vw) !important;
    max-width:min(700px, 38vw) !important;
    margin-right:clamp(28px, 3vw, 64px) !important;
    margin-left:auto !important;
    padding-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    padding:clamp(24px, 2.2vw, 34px) !important;
    border-radius:30px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy h2{
    max-width:12ch;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy p{
    max-width:54ch;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(23vw, 430px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(13vw, 240px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(104px, 10vw, 212px) !important;
    filter:drop-shadow(0 30px 64px rgba(0,0,0,.38)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    inset:-8px !important;
    border-radius:28px !important;
    box-shadow:0 22px 56px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    inset:-7% -6% -5% -7% !important;
    opacity:calc(.05 + (var(--spx-copy-enter) * .18)) !important;
    filter:blur(18px) !important;
    background:radial-gradient(circle at 28% 28%, rgba(124,217,255,.12), rgba(103,120,255,.05) 30%, transparent 72%) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img{
    border:1px solid rgba(255,255,255,.10) !important;
    box-shadow:0 16px 36px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.04) !important;
  }
}

@media (max-width:1180px){
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:100% !important;
    max-width:none !important;
    margin-right:0 !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings{
  filter:drop-shadow(0 24px 48px rgba(171,117,78,.14)) !important;
}


/* --- pass50 centering recovery / earlier settings scroll / compact layout --- */
@media (min-width:1181px){
  .spx-main,
  .spx-topbar,
  .spx-maintenanceBar,
  .spx-heroShell,
  .spx-previewStage,
  .spx-previewStageClean,
  .spx-previewBrowser,
  .spx-previewBrowserClean,
  .spx-section,
  .spx-footer{
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .spx-main{max-width:1320px !important;}
  .spx-heroShell{
    max-width:1060px !important;
    padding-inline:clamp(12px, 1.4vw, 22px) !important;
  }
  .spx-previewStageClean{
    max-width:1260px !important;
    margin-top:64px !important;
  }
  .spx-previewBrowserClean{
    max-width:1180px !important;
    margin-inline:auto !important;
  }

  .spx-storyRail{
    gap:14vh !important;
    margin-top:96px !important;
  }
  .spx-scrollFeature{
    min-height:176vh !important;
    gap:clamp(26px, 3.8vw, 74px) !important;
  }
  .spx-scrollFeatureSettings{
    grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr) !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    min-height:90vh !important;
    margin-left:calc(-1 * min(17vw, 320px)) !important;
  }
  .spx-scrollFeatureSettings .spx-showcaseScene{
    min-height:clamp(660px, 82vh, 900px) !important;
    margin-left:calc(-1 * min(9vw, 160px)) !important;
  }
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1540px, 92vw) !important;
  }
  .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-showcaseSceneSettings .spx-showcaseBaseImg{
    opacity:calc(.98 - (var(--spx-copy-enter) * .18) - (var(--spx-scene-exit) * .05)) !important;
  }
  .spx-showcaseBaseFrame::after{
    opacity:calc((var(--spx-copy-enter) * .16) + (var(--spx-scene-exit) * .08)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    min-height:90vh !important;
    align-content:center !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    width:min(560px, 33vw) !important;
    max-width:min(560px, 33vw) !important;
    margin-right:clamp(72px, 6vw, 132px) !important;
    transform:translate3d(var(--spx-copy-x), calc(var(--spx-copy-y) + 10px), 0) !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    padding:clamp(20px, 1.8vw, 28px) !important;
    border-radius:26px !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureCopy h2{
    font-size:clamp(28px, 3.2vw, 40px) !important;
    max-width:11ch !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureCopy p{
    font-size:14px !important;
    line-height:1.72 !important;
    max-width:48ch !important;
  }
  .spx-featurePoints{gap:10px !important;}
  .spx-featurePoint{
    padding:14px 16px !important;
    border-radius:18px !important;
    grid-template-columns:42px minmax(0,1fr) !important;
  }
  .spx-featurePointIcon{
    width:42px !important;
    height:42px !important;
    border-radius:14px !important;
  }
  .spx-featurePointBody strong{font-size:14px !important;}
  .spx-featurePointBody small{
    font-size:12px !important;
    line-height:1.45 !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(144px, 13vw, 280px) !important;
    width:min(450px, 26vw) !important;
    filter:drop-shadow(0 24px 48px rgba(0,0,0,.28)) !important;
  }
  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    inset:-6px !important;
    box-shadow:0 16px 36px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04) !important;
  }
  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    opacity:calc(.03 + (var(--spx-copy-enter) * .09)) !important;
    filter:blur(12px) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(520px, 35vw) !important;
    max-width:min(520px, 35vw) !important;
    margin-right:clamp(36px, 4vw, 84px) !important;
  }
  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(112px, 11vw, 220px) !important;
  }
}


/* --- pass51 settings left-pull / earlier copy / stronger lock-in --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    grid-template-columns:minmax(0,1.24fr) minmax(340px,.76fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(20vw, 360px)) !important;
    min-height:90vh !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(11vw, 210px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1580px, 94vw) !important;
  }

  .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-showcaseSceneSettings .spx-showcaseBaseImg{
    opacity:calc(.995 - (var(--spx-copy-enter) * .13) - (var(--spx-scene-exit) * .035)) !important;
  }

  .spx-showcaseBaseFrame::after{
    opacity:calc((var(--spx-copy-enter) * .09) + (var(--spx-scene-exit) * .05)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(540px, 32vw) !important;
    max-width:min(540px, 32vw) !important;
    margin-right:clamp(36px, 4vw, 92px) !important;
    transform:translate3d(var(--spx-copy-x), calc(var(--spx-copy-y) + 2px), 0) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(84px, 9vw, 200px) !important;
    top:clamp(10px, 1.6vh, 24px) !important;
    width:min(470px, 27vw) !important;
    filter:drop-shadow(0 22px 44px rgba(0,0,0,.24)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    inset:-4px !important;
    box-shadow:0 12px 28px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.03) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(17vw, 280px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(9vw, 160px)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    margin-right:clamp(24px, 3vw, 64px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(62px, 8vw, 150px) !important;
  }
}


/* --- pass53 settings overlap / hold / scale tuning --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:252vh !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:11vh !important;
    min-height:84vh !important;
    margin-left:calc(-1 * min(23vw, 430px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1320px, 108vw, 1960px) !important;
    min-height:84vh !important;
    margin-left:calc(-1 * min(13vw, 250px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1400px, 84vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:56% !important;
    right:clamp(16px, 3.6vw, 84px) !important;
    width:min(388px, 22vw) !important;
    filter:drop-shadow(0 28px 76px rgba(0,0,0,.40)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    opacity:calc(.035 + (var(--spx-copy-enter) * .34)) !important;
    filter:blur(10px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    opacity:calc(.025 + (var(--spx-copy-enter) * .28)) !important;
    filter:blur(6px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(590px, 32vw) !important;
    max-width:min(590px, 32vw) !important;
    margin-right:clamp(28px, 3vw, 72px) !important;
    margin-top:clamp(32px, 4.8vh, 64px) !important;
    padding-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    transform:translate3d(var(--spx-copy-x), calc(var(--spx-copy-y) + 12px), 0) !important;
  }

  .spx-scrollFeatureSettings .spx-panelTitle{
    margin-bottom:12px !important;
  }

  .spx-scrollFeatureSettings .spx-featurePoints{
    margin-top:10px !important;
    gap:10px !important;
  }

  .spx-scrollFeatureSettings .spx-featurePoint{
    padding:14px 16px !important;
  }
}

@media (max-width:1180px){
  .spx-scrollFeatureSettings{
    min-height:unset !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    width:min(250px, 56vw) !important;
    top:10% !important;
  }
}


/* --- pass54 settings overlap recovery / lower copy / smaller builder / longer hold --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:286vh !important;
    grid-template-columns:minmax(0,1.14fr) minmax(360px,.86fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:15vh !important;
    min-height:78vh !important;
    margin-left:calc(-1 * min(14vw, 260px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1180px, 98vw, 1700px) !important;
    min-height:78vh !important;
    margin-left:calc(-1 * min(6vw, 110px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1220px, 76vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:60.5% !important;
    right:clamp(116px, 9vw, 220px) !important;
    width:min(350px, 20vw) !important;
    filter:drop-shadow(0 22px 56px rgba(0,0,0,.28)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    opacity:calc(.03 + (var(--spx-copy-enter) * .24)) !important;
    filter:blur(7px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    opacity:calc(.02 + (var(--spx-copy-enter) * .16)) !important;
    filter:blur(5px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    min-height:78vh !important;
    align-content:center !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(520px, 29vw) !important;
    max-width:min(520px, 29vw) !important;
    margin-right:clamp(18px, 2.2vw, 44px) !important;
    margin-top:clamp(72px, 8vh, 128px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    padding:clamp(18px, 1.55vw, 24px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy h2{
    font-size:clamp(26px, 2.8vw, 38px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy p{
    font-size:13.5px !important;
    line-height:1.66 !important;
    max-width:44ch !important;
  }

  .spx-scrollFeatureSettings .spx-featurePoints{
    margin-top:8px !important;
    gap:8px !important;
  }

  .spx-scrollFeatureSettings .spx-featurePoint{
    padding:12px 14px !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(11vw, 180px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(4vw, 64px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1120px, 78vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(88px, 8vw, 160px) !important;
    width:min(330px, 22vw) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(480px, 31vw) !important;
    max-width:min(480px, 31vw) !important;
    margin-top:clamp(64px, 7vh, 108px) !important;
  }
}


/* --- pass55 recenter / inward builder / larger settings panel / right-edge content entry --- */
@media (min-width:1181px){
  .spx-main,
  .spx-topbar,
  .spx-maintenanceBar,
  .spx-heroShell,
  .spx-previewStage,
  .spx-previewStageClean,
  .spx-previewBrowser,
  .spx-previewBrowserClean,
  .spx-section,
  .spx-footer{
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .spx-main{max-width:1320px !important;}
  .spx-heroShell,
  .spx-previewStageClean,
  .spx-previewBrowserClean{
    left:auto !important;
    right:auto !important;
    transform:none !important;
  }

  .spx-scrollFeatureSettings{
    grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr) !important;
    gap:clamp(28px, 4vw, 88px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:14vh !important;
    min-height:79vh !important;
    margin-left:calc(-1 * min(9vw, 176px)) !important;
    margin-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1120px, 92vw, 1560px) !important;
    min-height:79vh !important;
    margin-left:calc(-1 * min(2.5vw, 34px)) !important;
    margin-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1140px, 72vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:59.5% !important;
    right:clamp(148px, 11vw, 264px) !important;
    width:min(382px, 21.5vw) !important;
    filter:drop-shadow(0 24px 60px rgba(0,0,0,.30)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    min-height:79vh !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    width:min(500px, 28vw) !important;
    max-width:min(500px, 28vw) !important;
    margin-left:auto !important;
    margin-right:clamp(18px, 2.1vw, 40px) !important;
    margin-top:clamp(48px, 5.4vh, 92px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    transform:translate3d(var(--spx-copy-x), calc(var(--spx-copy-y) + 6px), 0) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings{
    grid-template-columns:minmax(0,1.02fr) minmax(360px,.94fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(7vw, 110px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1040px, 90vw, 1380px) !important;
    margin-left:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1020px, 70vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(126px, 10vw, 212px) !important;
    width:min(356px, 24vw) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(460px, 31vw) !important;
    max-width:min(460px, 31vw) !important;
    margin-top:clamp(40px, 4.6vh, 76px) !important;
  }
}


/* --- pass56 settings showcase reset / left-overlap / phased copy entry --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:318vh !important;
    grid-template-columns:minmax(0,1.06fr) minmax(380px,.94fr) !important;
    gap:clamp(26px, 3.6vw, 78px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:14vh !important;
    min-height:80vh !important;
    margin-left:calc(-1 * min(8vw, 140px)) !important;
    margin-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1100px, 91vw, 1500px) !important;
    min-height:80vh !important;
    margin-left:0 !important;
    margin-right:0 !important;
    justify-content:flex-start !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1120px, 71vw) !important;
    transform-origin:left center !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:50% !important;
    right:clamp(212px, 15vw, 336px) !important;
    width:min(428px, 23.5vw) !important;
    overflow:visible !important;
    filter:drop-shadow(0 28px 72px rgba(0,0,0,.32)) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.92 + (var(--spx-copy-enter) * .08) - (var(--spx-scene-exit) * .02))) !important;
    opacity:calc(.14 + (var(--spx-copy-enter) * .86) - (var(--spx-scene-exit) * .07)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    inset:-3% -3% -5% -12% !important;
    opacity:calc(.025 + (var(--spx-copy-enter) * .18)) !important;
    filter:blur(8px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    left:-14% !important;
    top:16% !important;
    width:30% !important;
    height:68% !important;
    opacity:calc(.02 + (var(--spx-copy-enter) * .12)) !important;
    filter:blur(6px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    min-height:80vh !important;
    align-content:center !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    align-self:center !important;
    width:min(540px, 31vw) !important;
    max-width:min(540px, 31vw) !important;
    margin-left:auto !important;
    margin-right:0 !important;
    margin-top:0 !important;
    padding-right:clamp(18px, 2.6vw, 44px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    transform:translate3d(var(--spx-copy-x), var(--spx-copy-y), 0) !important;
    border-top-right-radius:26px !important;
    border-bottom-right-radius:26px !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings{
    grid-template-columns:minmax(0,1.03fr) minmax(360px,.97fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(5vw, 76px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1020px, 89vw, 1360px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1010px, 69vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(168px, 14vw, 270px) !important;
    width:min(392px, 24.5vw) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(488px, 33vw) !important;
    max-width:min(488px, 33vw) !important;
    padding-right:clamp(12px, 2.1vw, 28px) !important;
  }
}


/* --- pass57 settings choreography tighten / earlier copy / longer opaque panel / full-bleed right card --- */
.spx-scrollTopFab:hover,
.spx-scrollTopFab:focus-visible{
  border-color:rgba(255,255,255,.42);
  background:linear-gradient(180deg, rgba(18,25,42,.96), rgba(10,14,24,.98));
  color:#ffffff;
  outline:none;
}

@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:340vh !important;
    grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr) !important;
    gap:clamp(22px, 3.2vw, 68px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:12vh !important;
    min-height:84vh !important;
    margin-left:calc(-1 * min(5vw, 82px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1040px, 88vw, 1420px) !important;
    min-height:84vh !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1060px, 68vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    opacity:calc(.98 - (var(--spx-copy-enter) * .08) - (var(--spx-scene-exit) * .04)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame::after{
    opacity:calc((var(--spx-copy-enter) * .07) + (var(--spx-scene-exit) * .035)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:50% !important;
    right:clamp(268px, 19vw, 392px) !important;
    width:min(442px, 24.2vw) !important;
    filter:drop-shadow(0 26px 70px rgba(0,0,0,.34)) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.94 + (var(--spx-copy-enter) * .07) - (var(--spx-scene-exit) * .015))) !important;
    opacity:calc(.56 + (var(--spx-copy-enter) * .44) - (var(--spx-scene-exit) * .05)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    inset:-3% -3% -5% -10% !important;
    opacity:calc(.012 + (var(--spx-copy-enter) * .09)) !important;
    filter:blur(7px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    left:-10% !important;
    top:18% !important;
    width:24% !important;
    height:64% !important;
    opacity:calc(.01 + (var(--spx-copy-enter) * .06)) !important;
    filter:blur(5px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    min-height:84vh !important;
    align-content:center !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    align-self:center !important;
    width:min(650px, 38vw) !important;
    max-width:min(650px, 38vw) !important;
    margin-left:auto !important;
    margin-right:calc(-1 * clamp(24px, 2.8vw, 54px)) !important;
    padding-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    padding:clamp(24px, 2.35vw, 34px) !important;
    border-top-left-radius:30px !important;
    border-bottom-left-radius:30px !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    background:linear-gradient(180deg, rgba(10,14,24,.96), rgba(8,11,19,.9)) !important;
    box-shadow:0 30px 84px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.045) !important;
    opacity:calc(.10 + (var(--spx-copy-enter) * .90) - (var(--spx-scene-exit) * .16)) !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(980px, 87vw, 1280px) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(980px, 67vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(224px, 18vw, 328px) !important;
    width:min(410px, 25vw) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(590px, 40vw) !important;
    max-width:min(590px, 40vw) !important;
    margin-right:calc(-1 * clamp(18px, 2.3vw, 38px)) !important;
  }
}


/* --- pass58 settings early horizontal reveal / light-mode card fix --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    transform:none !important;
    margin-top:0 !important;
    width:min(690px, 40vw) !important;
    max-width:min(690px, 40vw) !important;
    margin-right:calc(-1 * clamp(10px, 1.4vw, 22px)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    opacity:calc(.22 + (var(--spx-copy-enter) * .78) - (var(--spx-scene-exit) * .16)) !important;
    transition:opacity .16s linear !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    opacity:calc(.82 + (var(--spx-copy-enter) * .18) - (var(--spx-scene-exit) * .06)) !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
  background:linear-gradient(180deg, rgba(255,250,245,.98), rgba(248,238,229,.96)) !important;
  box-shadow:0 26px 70px rgba(171,117,78,.14), inset 0 1px 0 rgba(255,255,255,.78) !important;
  border-color:rgba(182,118,72,.14) !important;
}


/* --- pass59 settings true horizontal reveal / edge-bleed card / larger builder --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings[data-reveal].is-visible,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    filter:none !important;
    transition:none !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:11vh !important;
    min-height:86vh !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1120px, 90vw, 1500px) !important;
    min-height:86vh !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1120px, 72vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    opacity:calc(.985 - (var(--spx-copy-enter) * .045) - (var(--spx-scene-exit) * .035)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    top:50% !important;
    right:clamp(302px, 21vw, 434px) !important;
    width:min(448px, 24.4vw) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.95 + (var(--spx-copy-enter) * .06) - (var(--spx-scene-exit) * .015))) !important;
    opacity:calc(.96 - (var(--spx-scene-exit) * .09)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    min-height:86vh !important;
    align-content:center !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    align-self:center !important;
    width:min(760px, 44vw) !important;
    max-width:min(760px, 44vw) !important;
    margin-left:auto !important;
    margin-top:0 !important;
    margin-right:calc(-1 * clamp(26px, 3vw, 44px)) !important;
    padding-right:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    padding:clamp(24px, 2.2vw, 32px) clamp(30px, 2.4vw, 38px) !important;
    border-top-left-radius:30px !important;
    border-bottom-left-radius:30px !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    width:100% !important;
    margin-right:calc(-1 * clamp(26px, 3vw, 44px)) !important;
    opacity:calc(.18 + (var(--spx-copy-enter) * .82) - (var(--spx-scene-exit) * .18)) !important;
    background:linear-gradient(180deg, rgba(10,14,24,.94), rgba(8,11,19,.88)) !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
  background:linear-gradient(180deg, rgba(255,251,247,.985), rgba(248,239,231,.965)) !important;
  box-shadow:0 26px 68px rgba(171,117,78,.12), inset 0 1px 0 rgba(255,255,255,.82) !important;
  border-color:rgba(182,118,72,.14) !important;
}


/* --- pass60 settings sticky copy / true horizontal entry / locked overlap --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:214vh !important;
    grid-template-columns:minmax(0,1.26fr) minmax(360px,.74fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:6vh !important;
    min-height:88vh !important;
    margin-left:calc(-1 * min(22vw, 360px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1260px, 96vw, 1580px) !important;
    min-height:88vh !important;
    margin-left:calc(-1 * min(14vw, 220px)) !important;
    align-items:center !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1240px, 79vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    transform:translate3d(calc(var(--spx-base-x) - 42px), 0, 0) scale(calc(.982 + (var(--spx-copy-enter) * .02) - (var(--spx-scene-exit) * .012))) !important;
    opacity:calc(.995 - (var(--spx-copy-enter) * .028) - (var(--spx-scene-exit) * .02)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    z-index:24 !important;
    top:50% !important;
    right:clamp(332px, 22vw, 452px) !important;
    width:min(456px, 24.2vw) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.965 + (var(--spx-copy-enter) * .045) - (var(--spx-scene-exit) * .012))) !important;
    opacity:calc(.985 - (var(--spx-scene-exit) * .035)) !important;
    filter:drop-shadow(0 30px 76px rgba(0,0,0,.32)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    content:"";
    position:absolute;
    inset:-2px !important;
    z-index:-1 !important;
    border-radius:28px !important;
    background:linear-gradient(180deg, rgba(10,14,25,.98), rgba(7,10,18,.995)) !important;
    box-shadow:0 24px 60px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.05) !important;
    filter:none !important;
    opacity:1 !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    opacity:0 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy{
    position:sticky !important;
    top:12vh !important;
    align-self:start !important;
    min-height:76vh !important;
    align-content:center !important;
    pointer-events:auto !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings[data-reveal].is-visible{
    transform:none !important;
    translate:none !important;
    margin-top:0 !important;
    align-self:center !important;
    justify-self:end !important;
    width:min(780px, 46vw) !important;
    max-width:min(780px, 46vw) !important;
    margin-left:auto !important;
    margin-right:calc(-1 * clamp(34px, 3.2vw, 52px)) !important;
    padding-right:0 !important;
    filter:none !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    translate:none !important;
    margin-top:0 !important;
    width:100% !important;
    padding:clamp(22px, 2vw, 30px) clamp(28px, 2.4vw, 36px) !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    border-top-left-radius:30px !important;
    border-bottom-left-radius:30px !important;
    margin-right:calc(-1 * clamp(34px, 3.2vw, 52px)) !important;
    opacity:calc(.08 + (var(--spx-copy-enter) * .92) - (var(--spx-scene-exit) * .22)) !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
  background:linear-gradient(180deg, rgba(255,249,242,.995), rgba(246,237,227,.99)) !important;
  box-shadow:0 24px 60px rgba(171,117,78,.12), inset 0 1px 0 rgba(255,255,255,.75) !important;
}


/* --- pass61 settings true-horizontal entry / less-left-compression / locked panel backing --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:238vh !important;
    grid-template-columns:minmax(0,1.22fr) minmax(380px,.78fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:7vh !important;
    min-height:88vh !important;
    margin-left:calc(-1 * min(18vw, 292px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1240px, 93vw, 1540px) !important;
    min-height:88vh !important;
    margin-left:calc(-1 * min(9vw, 138px)) !important;
    align-items:center !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1280px, 80vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    transform:translate3d(calc(var(--spx-base-x) - 12px), 0, 0) scale(calc(.99 + (var(--spx-copy-enter) * .018) - (var(--spx-scene-exit) * .012))) !important;
    opacity:calc(.985 - (var(--spx-copy-enter) * .015) - (var(--spx-scene-exit) * .02)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    z-index:40 !important;
    top:50% !important;
    right:clamp(360px, 23vw, 480px) !important;
    width:min(470px, 24.6vw) !important;
    padding:12px !important;
    border-radius:30px !important;
    overflow:hidden !important;
    background:linear-gradient(180deg, rgba(10,14,25,.995), rgba(7,10,18,.998)) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.975 + (var(--spx-copy-enter) * .04) - (var(--spx-scene-exit) * .01))) !important;
    opacity:calc(.992 - (var(--spx-scene-exit) * .028)) !important;
    filter:drop-shadow(0 30px 72px rgba(0,0,0,.30)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
    inset:0 !important;
    border-radius:30px !important;
    background:linear-gradient(180deg, rgba(10,14,25,.995), rgba(7,10,18,.998)) !important;
    box-shadow:0 24px 60px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.05) !important;
    opacity:1 !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    opacity:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    border-radius:22px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings.is-visible{
    position:sticky !important;
    top:10vh !important;
    align-self:start !important;
    min-height:74vh !important;
    align-content:center !important;
    width:min(760px, 44vw) !important;
    max-width:min(760px, 44vw) !important;
    margin-left:auto !important;
    margin-right:calc(-1 * clamp(24px, 2.2vw, 34px)) !important;
    padding-right:0 !important;
    filter:none !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard.is-visible{
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    transition:none !important;
    translate:none !important;
    margin-top:0 !important;
    width:100% !important;
    padding:clamp(22px, 2vw, 30px) clamp(28px, 2.4vw, 36px) !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    border-top-left-radius:30px !important;
    border-bottom-left-radius:30px !important;
    margin-right:calc(-1 * clamp(24px, 2.2vw, 34px)) !important;
    opacity:calc(.02 + (var(--spx-copy-enter) * .98) - (var(--spx-scene-exit) * .20)) !important;
    will-change:transform, opacity !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings,
html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings::before{
  background:linear-gradient(180deg, rgba(255,249,242,.995), rgba(246,237,227,.992)) !important;
  box-shadow:0 24px 60px rgba(171,117,78,.12), inset 0 1px 0 rgba(255,255,255,.75) !important;
}


/* --- pass62 settings pure horizontal entry / panel-right / builder-left --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:228vh !important;
    grid-template-columns:minmax(0,1.24fr) minmax(380px,.76fr) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    top:6vh !important;
    min-height:88vh !important;
    margin-left:calc(-1 * min(10vw, 160px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1280px, 95vw, 1560px) !important;
    min-height:88vh !important;
    margin-left:calc(-1 * min(5vw, 74px)) !important;
    align-items:center !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1320px, 82vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    transform:translate3d(calc(var(--spx-base-x) - 34px), 0, 0) scale(calc(.992 + (var(--spx-copy-enter) * .018) - (var(--spx-scene-exit) * .012))) !important;
    opacity:calc(.992 - (var(--spx-copy-enter) * .010) - (var(--spx-scene-exit) * .022)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    z-index:60 !important;
    top:50% !important;
    right:clamp(300px, 18vw, 390px) !important;
    width:min(470px, 24.8vw) !important;
    padding:12px !important;
    overflow:hidden !important;
    border-radius:30px !important;
    background:linear-gradient(180deg, rgba(10,14,25,.995), rgba(7,10,18,.998)) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.978 + (var(--spx-copy-enter) * .036) - (var(--spx-scene-exit) * .012))) !important;
    opacity:calc(.18 + (var(--spx-copy-enter) * .82) - (var(--spx-scene-exit) * .06)) !important;
    filter:drop-shadow(0 30px 72px rgba(0,0,0,.30)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings::before,
  .spx-scrollFeatureSettings .spx-showcasePanelSettings::after{
    opacity:0 !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    border-radius:22px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings.is-visible{
    position:sticky !important;
    top:12vh !important;
    align-self:start !important;
    min-height:74vh !important;
    align-content:center !important;
    width:min(780px, 44vw) !important;
    max-width:min(780px, 44vw) !important;
    margin-left:auto !important;
    margin-right:calc(-1 * clamp(12px, 1.4vw, 22px)) !important;
    padding-right:0 !important;
    filter:none !important;
    transform:none !important;
    translate:none !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard.is-visible{
    width:100% !important;
    padding:clamp(22px, 2vw, 30px) clamp(28px, 2.4vw, 36px) !important;
    margin-top:0 !important;
    margin-right:calc(-1 * clamp(12px, 1.4vw, 22px)) !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    border-top-left-radius:30px !important;
    border-bottom-left-radius:30px !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    translate:none !important;
    transition:none !important;
    will-change:transform, opacity !important;
    opacity:calc(var(--spx-copy-enter) * (1 - (var(--spx-scene-exit) * .72))) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings[data-reveal].is-visible,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    opacity:calc(var(--spx-copy-enter) * (1 - (var(--spx-scene-exit) * .72))) !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    translate:none !important;
    filter:none !important;
  }
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings{
  background:linear-gradient(180deg, rgba(255,249,242,.995), rgba(246,237,227,.992)) !important;
  box-shadow:0 24px 60px rgba(171,117,78,.12), inset 0 1px 0 rgba(255,255,255,.75) !important;
}

html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
  background:linear-gradient(180deg, rgba(255,251,247,.985), rgba(248,239,231,.965)) !important;
  border-color:rgba(182,118,72,.14) !important;
  box-shadow:0 26px 68px rgba(171,117,78,.12), inset 0 1px 0 rgba(255,255,255,.82) !important;
}


/* --- pass63 settings pre-reveal lock / true horizontal onset / hard viewport edge --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(7.2vw, 118px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1320px, 97vw, 1600px) !important;
    margin-left:calc(-1 * min(3.4vw, 48px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1360px, 84vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    transform:translate3d(calc(var(--spx-base-x) - 22px), 0, 0) scale(calc(.993 + (var(--spx-copy-enter) * .018) - (var(--spx-scene-exit) * .012))) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(268px, 16.2vw, 348px) !important;
    width:min(474px, 25vw) !important;
    opacity:calc(.28 + (var(--spx-copy-enter) * .72) - (var(--spx-scene-exit) * .05)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings.is-visible{
    top:50vh !important;
    min-height:0 !important;
    align-content:stretch !important;
    width:calc(min(780px, 44vw) + clamp(20px, 3vw, 44px)) !important;
    max-width:calc(min(780px, 44vw) + clamp(20px, 3vw, 44px)) !important;
    margin-left:auto !important;
    margin-right:calc(-1 * clamp(20px, 3vw, 44px)) !important;
    padding-right:0 !important;
    transform:translateY(-50%) !important;
    translate:none !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    margin-top:0 !important;
    margin-right:0 !important;
    padding:clamp(22px, 1.95vw, 30px) clamp(26px, 2.2vw, 34px) !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    opacity:calc(var(--spx-copy-enter) * (1 - (var(--spx-scene-exit) * .74))) !important;
  }
}


/* --- pass64 settings copy true side-in smoothing / viewport edge lock --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:236vh !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(5.6vw, 88px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1360px, 98vw, 1620px) !important;
    margin-left:calc(-1 * min(4.6vw, 70px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    width:min(1400px, 85vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame{
    transform:translate3d(calc(var(--spx-base-x) - 34px), 0, 0) scale(calc(.994 + (var(--spx-copy-enter) * .016) - (var(--spx-scene-exit) * .010))) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(288px, 17.2vw, 366px) !important;
    width:min(474px, 25vw) !important;
    opacity:calc(.40 + (var(--spx-copy-enter) * .60) - (var(--spx-scene-exit) * .05)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings.is-visible{
    position:sticky !important;
    top:0 !important;
    min-height:100vh !important;
    align-self:start !important;
    display:grid !important;
    align-content:center !important;
    justify-items:end !important;
    width:calc(min(780px, 44vw) + clamp(30px, 3.5vw, 54px)) !important;
    max-width:calc(min(780px, 44vw) + clamp(30px, 3.5vw, 54px)) !important;
    margin-left:auto !important;
    margin-right:calc(-1 * clamp(30px, 3.5vw, 54px)) !important;
    padding-right:0 !important;
    transform:none !important;
    translate:none !important;
    filter:none !important;
    overflow:visible !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    margin-top:0 !important;
    margin-right:calc(-1 * clamp(30px, 3.5vw, 54px)) !important;
    padding:clamp(22px, 1.9vw, 30px) clamp(26px, 2.2vw, 34px) !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    transition:none !important;
    opacity:calc(var(--spx-copy-enter) * (1 - (var(--spx-scene-exit) * .70))) !important;
    will-change:transform, opacity !important;
  }
}


/* --- pass65 settings copy lower / left-aligned / reduced left overshoot --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings .spx-scrollFeatureCopy,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings.is-visible{
    top:0 !important;
    min-height:100vh !important;
    display:grid !important;
    align-content:center !important;
    justify-items:end !important;
    box-sizing:border-box !important;
    padding-top:clamp(48px, 6vh, 92px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings.is-visible{
    width:calc(min(760px, 43vw) + clamp(30px, 3.5vw, 54px)) !important;
    max-width:calc(min(760px, 43vw) + clamp(30px, 3.5vw, 54px)) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    text-align:left !important;
    justify-items:start !important;
    align-items:start !important;
    padding:clamp(22px, 1.85vw, 28px) clamp(28px, 2.35vw, 38px) !important;
  }

  .spx-scrollFeatureSettings .spx-panelKicker,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard h2,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard p,
  .spx-scrollFeatureSettings .spx-featurePoints,
  .spx-scrollFeatureSettings .spx-featurePoint,
  .spx-scrollFeatureSettings .spx-featurePointBody,
  .spx-scrollFeatureSettings .spx-featurePointBody strong,
  .spx-scrollFeatureSettings .spx-featurePointBody small{
    text-align:left !important;
    justify-content:flex-start !important;
    align-items:flex-start !important;
  }
}


/* --- pass67 unified showcase system / mirrored layers / responsive fallback / smoother motion --- */
@media (min-width:1181px){
  .spx-storyRail{
    gap:clamp(11vh, 13vh, 15vh) !important;
    margin-top:92px !important;
  }

  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    width:100vw !important;
    margin-inline:calc(50% - 50vw) !important;
    min-height:272vh !important;
    padding-inline:0 !important;
    align-items:center !important;
    overflow:visible !important;
  }

  .spx-scrollFeatureSettings{
    grid-template-columns:minmax(0,1.06fr) minmax(420px,.94fr) !important;
  }

  .spx-scrollFeatureLayers{
    grid-template-columns:minmax(420px,.94fr) minmax(0,1.06fr) !important;
  }

  .spx-scrollFeatureVisual{
    top:8vh !important;
    min-height:84vh !important;
    align-self:start !important;
    overflow:visible !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    justify-content:flex-start !important;
    margin-left:calc(-1 * min(10vw, 180px)) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    justify-content:flex-end !important;
    margin-right:calc(-1 * min(4vw, 76px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(1320px, 104vw, 1900px) !important;
    min-height:84vh !important;
    overflow:visible !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    margin-left:calc(-1 * min(4vw, 72px)) !important;
    justify-content:flex-start !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    margin-right:0 !important;
    justify-content:flex-end !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseBaseFrame{
    width:min(1320px, 84vw) !important;
    border-radius:34px !important;
    backface-visibility:hidden;
    transform-style:preserve-3d;
    contain:paint;
    box-shadow:0 30px 90px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings,
  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    top:50% !important;
    width:min(410px, 24vw) !important;
    padding:10px !important;
    border-radius:30px !important;
    overflow:hidden !important;
    background:linear-gradient(180deg, rgba(10,14,24,.985), rgba(8,11,19,.995)) !important;
    border:1px solid rgba(255,255,255,.08) !important;
    box-shadow:0 28px 88px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05) !important;
    backface-visibility:hidden;
    contain:paint;
    filter:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(78px, 8vw, 162px) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.94 + (var(--spx-copy-enter) * .06) - (var(--spx-scene-exit) * .02))) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    left:clamp(78px, 8vw, 162px) !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.94 + (var(--spx-copy-enter) * .06) - (var(--spx-scene-exit) * .02))) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img,
  .spx-scrollFeatureLayers .spx-showcasePanelLayers img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    border-radius:22px !important;
    background:#0b0f19 !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopy{
    min-height:100vh !important;
    display:grid !important;
    align-content:center !important;
    box-sizing:border-box !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:calc(min(760px, 42vw) + 44px) !important;
    max-width:calc(min(760px, 42vw) + 44px) !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    justify-self:end !important;
    margin-right:-44px !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    justify-self:start !important;
    margin-left:-44px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    width:100% !important;
    padding:24px 30px !important;
    background:linear-gradient(180deg, rgba(11,15,26,.92), rgba(8,11,20,.82)) !important;
    border:1px solid rgba(255,255,255,.08) !important;
    box-shadow:0 20px 58px rgba(0,0,0,.18) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    text-align:left !important;
    justify-items:start !important;
    align-items:start !important;
    will-change:transform, opacity !important;
    contain:layout paint style;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
  }

  .spx-scrollFeatureSettings .spx-panelKicker,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard h2,
  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard p,
  .spx-scrollFeatureSettings .spx-featurePoints,
  .spx-scrollFeatureSettings .spx-featurePoint,
  .spx-scrollFeatureSettings .spx-featurePointBody,
  .spx-scrollFeatureSettings .spx-featurePointBody strong,
  .spx-scrollFeatureSettings .spx-featurePointBody small,
  .spx-scrollFeatureLayers .spx-panelKicker,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard h2,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard p,
  .spx-scrollFeatureLayers .spx-featureListWide,
  .spx-scrollFeatureLayers .spx-featureListWide li{
    text-align:left !important;
  }

  .spx-scrollFeatureLayers .spx-featureListWide{
    margin:10px 0 0 !important;
    padding-left:18px !important;
    display:grid !important;
    gap:10px !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    opacity:calc(.04 + (var(--spx-copy-enter) * .96) - (var(--spx-scene-exit) * .12)) !important;
  }

  html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    background:linear-gradient(180deg, rgba(255,249,243,.96), rgba(247,236,223,.90)) !important;
    box-shadow:0 20px 58px rgba(171,117,78,.12) !important;
    border-color:rgba(129,89,58,.10) !important;
  }

  html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureSettings .spx-showcasePanelSettings,
  html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    background:linear-gradient(180deg, rgba(255,251,246,.98), rgba(247,236,223,.98)) !important;
    border-color:rgba(129,89,58,.10) !important;
    box-shadow:0 22px 64px rgba(171,117,78,.14), inset 0 1px 0 rgba(255,255,255,.65) !important;
  }
}

@media (max-width:1180px){
  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    width:100% !important;
    margin:0 !important;
    min-height:auto !important;
    grid-template-columns:1fr !important;
    gap:20px !important;
    padding:0 16px 12px !important;
    overflow:visible !important;
  }

  .spx-scrollFeatureCopy,
  .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureCopyLayers{
    order:1 !important;
    position:relative !important;
    top:auto !important;
    min-height:auto !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
  }

  .spx-scrollFeatureCopyCard{
    width:100% !important;
    margin:0 !important;
    transform:none !important;
    opacity:1 !important;
    border-radius:24px !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  .spx-scrollFeatureVisual{
    order:2 !important;
    position:relative !important;
    top:auto !important;
    min-height:auto !important;
    margin:0 !important;
    justify-content:center !important;
  }

  .spx-showcaseScene{
    width:100% !important;
    min-height:auto !important;
    margin:0 !important;
    padding:0 !important;
  }

  .spx-showcaseBaseFrame{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    border-radius:24px !important;
  }

  .spx-showcasePanelSettings,
  .spx-showcasePanelLayers{
    display:none !important;
  }

  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    --spx-copy-enter:1 !important;
    --spx-scene-enter:1 !important;
    --spx-scene-exit:0 !important;
    --spx-base-x:0px !important;
    --spx-base-y:0px !important;
    --spx-panel-x:0px !important;
    --spx-panel-y:0px !important;
    --spx-copy-x:0px !important;
    --spx-copy-y:0px !important;
  }
}

@media (max-width:720px){
  .spx-storyRail{
    gap:7vh !important;
    margin-top:72px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    padding:20px 18px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopy h2,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopy h2{
    font-size:clamp(28px, 8vw, 36px) !important;
    max-width:none !important;
  }
}


/* --- pass68 settings panel offset + longer story hold --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    min-height:368vh !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(196px, 14vw, 308px) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    right:clamp(156px, 13vw, 248px) !important;
  }
}


/* --- pass69 showcase + support polish override --- */
.spx-scrollFeatureSettings,
.spx-scrollFeatureLayers{
  min-height: 392vh !important;
}

.spx-scrollFeatureSettings .spx-scrollFeatureVisual{
  margin-left: calc(-1 * min(20vw, 340px)) !important;
}
.spx-scrollFeatureSettings .spx-showcaseScene{
  justify-content: flex-start !important;
  margin-left: calc(-1 * min(9vw, 160px)) !important;
}
.spx-scrollFeatureSettings .spx-showcaseBaseFrame{
  width: min(1640px, 95vw) !important;
  max-width: none !important;
}
.spx-scrollFeatureSettings .spx-showcasePanelSettings{
  right: clamp(120px, 12vw, 240px) !important;
  left: auto !important;
  width: min(860px, 56vw) !important;
  background: rgba(6, 9, 16, .98) !important;
  box-shadow: 0 34px 90px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.06) !important;
  overflow: hidden !important;
}
.spx-scrollFeatureSettings .spx-showcasePanelSettings::before,
.spx-scrollFeatureSettings .spx-showcasePanelSettings::after,
.spx-scrollFeatureLayers .spx-showcasePanelLayers::before,
.spx-scrollFeatureLayers .spx-showcasePanelLayers::after{
  opacity: .55 !important;
}
.spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
  justify-self: end !important;
  margin-right: 0 !important;
  max-width: min(840px, 45vw) !important;
}
.spx-scrollFeatureSettings .spx-scrollFeatureCopyCard{
  text-align: left !important;
}

.spx-scrollFeatureLayers{
  grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr) !important;
}
.spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
  justify-self: start !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  max-width: min(760px, 42vw) !important;
  width: min(760px, 42vw) !important;
  text-align: left !important;
}
.spx-scrollFeatureLayers .spx-scrollFeatureVisual{
  margin-right: calc(-1 * min(19vw, 320px)) !important;
}
.spx-scrollFeatureLayers .spx-showcaseScene{
  justify-content: flex-end !important;
  margin-right: calc(-1 * min(10vw, 180px)) !important;
}
.spx-scrollFeatureLayers .spx-showcaseBaseFrame{
  width: min(1600px, 94vw) !important;
  max-width: none !important;
}
.spx-scrollFeatureLayers .spx-showcasePanelLayers{
  left: clamp(6px, 1.5vw, 28px) !important;
  right: auto !important;
  width: min(520px, 38vw) !important;
  background: rgba(6, 9, 16, .98) !important;
  box-shadow: 0 34px 90px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.06) !important;
  overflow: hidden !important;
}

.spx-showcaseHotspotLayersMain{left:8%;top:5%;width:76%;height:12%}
.spx-showcaseHotspotLayersSub{left:8%;top:19%;width:76%;height:10%}
.spx-showcaseHotspotLayersTree{left:8%;top:32%;width:78%;height:58%}
[data-active-hotspot="layers-main-tabs"] .spx-showcaseHotspotLayersMain,
[data-active-hotspot="layers-sub-tabs"] .spx-showcaseHotspotLayersSub,
[data-active-hotspot="layers-tree"] .spx-showcaseHotspotLayersTree{opacity:1;transform:scale(1)}

.spx-scrollFeatureLayers .spx-featurePoints{
  margin-top: 14px !important;
}
.spx-scrollFeatureLayers .spx-featurePoint{
  transform: translateX(-28px);
}
.spx-scrollFeatureLayers .spx-featurePointBody,
.spx-scrollFeatureLayers .spx-featurePointBody strong,
.spx-scrollFeatureLayers .spx-featurePointBody small,
.spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
.spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers p,
.spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers h2{
  text-align: left !important;
  justify-items: start !important;
}

@media (max-width: 1180px){
  .spx-scrollFeatureSettings,
  .spx-scrollFeatureLayers{
    min-height: auto !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding-inline: 18px !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    justify-self: auto !important;
    order: 1 !important;
  }
  .spx-scrollFeatureSettings .spx-scrollFeatureVisual,
  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    order: 2 !important;
    margin: 0 !important;
    justify-content: center !important;
  }
  .spx-scrollFeatureSettings .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseScene{
    margin: 0 !important;
    justify-content: center !important;
    min-height: 66vh !important;
  }
  .spx-scrollFeatureSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseBaseFrame{
    width: min(1200px, 100%) !important;
  }
  .spx-scrollFeatureSettings .spx-showcasePanelSettings,
  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    display: none !important;
  }
}


/* --- pass70 shrink settings panel back to intended overlap size --- */
@media (min-width:1181px){
  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    width:min(520px, 31vw) !important;
    padding:8px !important;
    border-radius:26px !important;
    right:clamp(96px, 9vw, 188px) !important;
    box-shadow:0 24px 72px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.06) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img{
    border-radius:18px !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    width:min(468px, 34vw) !important;
    right:clamp(76px, 8vw, 148px) !important;
  }
}

/* --- pass71 smaller visuals + more breathing room between content and imagery --- */
@media (min-width:1181px){
  .spx-scrollFeature,
  .spx-scrollFeatureLayers{
    gap:clamp(52px, 5.8vw, 124px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(20vw, 320px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1180px, 89vw, 1460px) !important;
    margin-left:calc(-1 * min(12vw, 180px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame{
    width:min(1180px, 75vw) !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    width:min(486px, 29vw) !important;
    right:clamp(126px, 10.6vw, 226px) !important;
    padding:7px !important;
    border-radius:24px !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings img{
    border-radius:16px !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(740px, 42vw) !important;
    max-width:min(740px, 42vw) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(22vw, 360px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    margin-right:calc(-1 * min(12vw, 220px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame{
    width:min(1500px, 90vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(486px, 35vw) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:min(740px, 42vw) !important;
    max-width:min(740px, 42vw) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    width:min(454px, 31vw) !important;
    right:clamp(108px, 9.6vw, 184px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(448px, 33vw) !important;
  }
}


/* --- pass72 reduce spacing + clean builder preview + deeper explore landing --- */
@media (min-width:1181px){
  .spx-scrollFeature,
  .spx-scrollFeatureLayers{
    gap:clamp(40px, 4.6vw, 96px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureVisual{
    margin-left:calc(-1 * min(18vw, 292px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseScene{
    width:clamp(1140px, 88vw, 1420px) !important;
    margin-left:calc(-1 * min(10vw, 156px)) !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame,
  .spx-scrollFeatureSettings .spx-showcaseSceneSettings .spx-showcaseBaseFrame{
    width:min(1220px, 77vw) !important;
    background:transparent !important;
    border-color:transparent !important;
    box-shadow:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseFrame::after,
  .spx-scrollFeatureLayers .spx-showcaseBaseFrame::after{
    display:none !important;
  }

  .spx-scrollFeatureSettings .spx-showcaseBaseImg,
  .spx-scrollFeatureLayers .spx-showcaseBaseImg{
    opacity:1 !important;
    filter:none !important;
    mix-blend-mode:normal !important;
  }

  .spx-scrollFeatureSettings .spx-showcasePanelSettings{
    width:min(474px, 28vw) !important;
    right:clamp(118px, 10vw, 206px) !important;
  }

  .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings{
    width:min(720px, 41vw) !important;
    max-width:min(720px, 41vw) !important;
    margin-right:calc(-1 * clamp(18px, 2vw, 34px)) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(20vw, 330px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    margin-right:calc(-1 * min(10vw, 184px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1460px, 88vw) !important;
    background:transparent !important;
    border-color:transparent !important;
    box-shadow:none !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(468px, 33vw) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:min(720px, 41vw) !important;
    max-width:min(720px, 41vw) !important;
  }
}


/* --- pass74 layers balance / inset copy / smaller visuals --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    gap:clamp(34px, 4vw, 78px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:min(660px, 38vw) !important;
    max-width:min(660px, 38vw) !important;
    margin-left:clamp(28px, 3vw, 72px) !important;
    margin-right:auto !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    padding:clamp(22px, 2vw, 30px) !important;
  }

  .spx-scrollFeatureLayers .spx-featurePoints{
    gap:12px !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(12vw, 190px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    margin-right:calc(-1 * min(5vw, 84px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1240px, 74vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(398px, 28vw) !important;
    left:clamp(24px, 3.6vw, 74px) !important;
  }
}


/* --- pass75 layers mirror settings / flush-left copy / smaller right visuals --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    grid-template-columns:minmax(0, 1fr) minmax(620px, 1.06fr) !important;
    gap:clamp(30px, 3.4vw, 72px) !important;
    padding-left:0 !important;
    padding-right:clamp(20px, 2.8vw, 46px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    justify-self:start !important;
    width:min(720px, 42vw) !important;
    max-width:min(720px, 42vw) !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:auto !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    border-top-right-radius:34px !important;
    border-bottom-right-radius:34px !important;
    padding:clamp(24px, 2vw, 32px) clamp(28px, 2.3vw, 38px) !important;
  }

  html[data-spx-theme="light"] body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    background:linear-gradient(180deg, rgba(255,248,241,.96), rgba(247,236,223,.88)) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    justify-content:flex-end !important;
    margin-right:calc(-1 * min(9vw, 150px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(1040px, 80vw, 1280px) !important;
    justify-content:flex-end !important;
    margin-right:calc(-1 * min(3vw, 52px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1080px, 68vw) !important;
    max-width:none !important;
    background:transparent !important;
    border-color:transparent !important;
    box-shadow:none !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(392px, 27vw) !important;
    left:clamp(36px, 4vw, 92px) !important;
    right:auto !important;
    top:50% !important;
  }

  .spx-scrollFeatureLayers .spx-featurePoint{
    transform:none !important;
  }
}

/* --- pass76 layers true mirror / left-edge card / right-side visuals --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    width:100vw !important;
    max-width:none !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    grid-template-columns:minmax(520px, 44vw) minmax(640px, 1fr) !important;
    gap:clamp(20px, 2.3vw, 44px) !important;
    padding-left:0 !important;
    padding-right:clamp(22px, 2.4vw, 48px) !important;
    align-items:center !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    grid-column:1 !important;
    justify-self:start !important;
    align-self:center !important;
    width:min(760px, 44vw) !important;
    max-width:min(760px, 44vw) !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0 !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    width:100% !important;
    margin-left:0 !important;
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    border-top-right-radius:34px !important;
    border-bottom-right-radius:34px !important;
    padding:clamp(24px, 2vw, 32px) clamp(28px, 2.2vw, 38px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    grid-column:2 !important;
    justify-content:flex-end !important;
    width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:calc(-1 * min(8vw, 120px)) !important;
    align-self:center !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(820px, 66vw, 1120px) !important;
    min-height:100vh !important;
    justify-content:flex-end !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(980px, 58vw) !important;
    max-width:none !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(342px, 23vw) !important;
    left:clamp(12px, 1.8vw, 28px) !important;
    right:auto !important;
    top:50% !important;
  }
}


/* --- pass77 layers true mirror polish / flush-left / smaller panel / smoother left-flow --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    width:100vw !important;
    max-width:none !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    grid-template-columns:minmax(560px, 43vw) minmax(560px, 1fr) !important;
    gap:clamp(16px, 2vw, 34px) !important;
    padding-left:0 !important;
    padding-right:clamp(18px, 2vw, 36px) !important;
    align-items:center !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    grid-column:1 !important;
    justify-self:start !important;
    align-self:center !important;
    width:min(760px, 43vw) !important;
    max-width:min(760px, 43vw) !important;
    margin-left:0 !important;
    margin-right:auto !important;
    padding-left:0 !important;
    transform:none !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    margin-left:0 !important;
    margin-right:auto !important;
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    border-top-right-radius:32px !important;
    border-bottom-right-radius:32px !important;
    padding:clamp(24px, 1.95vw, 30px) clamp(26px, 2vw, 34px) !important;
    text-align:left !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard *{
    text-align:left !important;
  }

  .spx-scrollFeatureLayers .spx-featurePoints{
    gap:12px !important;
    margin-top:12px !important;
  }

  .spx-scrollFeatureLayers .spx-featurePoint{
    transform:none !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    grid-column:2 !important;
    justify-content:flex-end !important;
    align-self:center !important;
    width:100% !important;
    min-width:0 !important;
    margin-left:0 !important;
    margin-right:calc(-1 * min(3.5vw, 54px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(780px, 58vw, 980px) !important;
    min-height:94vh !important;
    justify-content:flex-end !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(860px, 52vw) !important;
    max-width:none !important;
    background:transparent !important;
    border-color:transparent !important;
    box-shadow:none !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(282px, 18vw) !important;
    left:clamp(28px, 3.1vw, 64px) !important;
    right:auto !important;
    top:50% !important;
    background:rgba(6, 9, 16, .98) !important;
    box-shadow:0 28px 68px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.05) !important;
    overflow:hidden !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers img{
    display:block !important;
    width:100% !important;
    height:auto !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers{
    grid-template-columns:minmax(500px, 45vw) minmax(520px, 1fr) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:min(700px, 45vw) !important;
    max-width:min(700px, 45vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(720px, 56vw, 900px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(780px, 50vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(264px, 18vw) !important;
    left:clamp(24px, 2.8vw, 52px) !important;
  }
}


/* --- pass78 layers mirror polish / flush-left entry / tighter hotspots / larger base --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    grid-template-columns:minmax(600px, 43vw) minmax(620px, 1fr) !important;
    gap:clamp(18px, 2vw, 34px) !important;
    padding-right:clamp(18px, 2vw, 36px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:min(760px, 42vw) !important;
    max-width:min(760px, 42vw) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    border-top-right-radius:32px !important;
    border-bottom-right-radius:32px !important;
    padding:clamp(24px, 1.95vw, 30px) clamp(28px, 2.05vw, 36px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(2.2vw, 34px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(860px, 60vw, 1040px) !important;
    min-height:95vh !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(940px, 56vw) !important;
    opacity:.9 !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseImg{
    opacity:.9 !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(246px, 15.8vw) !important;
    left:clamp(18px, 2vw, 34px) !important;
    right:auto !important;
    top:50% !important;
  }

  .spx-showcaseHotspotLayersMain{
    left:5.5% !important;
    top:7.2% !important;
    width:88% !important;
    height:9.8% !important;
  }

  .spx-showcaseHotspotLayersSub{
    left:5.5% !important;
    top:16.2% !important;
    width:88% !important;
    height:8.6% !important;
  }

  .spx-showcaseHotspotLayersTree{
    left:6.5% !important;
    top:49.5% !important;
    width:84% !important;
    height:39% !important;
  }
}


/* --- pass79 layers mirror refinement: hotspot positions, larger base, larger panel, longer hold --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    min-height:392vh !important;
    grid-template-columns:minmax(620px, 43vw) minmax(660px, 1fr) !important;
    gap:clamp(20px, 2.1vw, 36px) !important;
    padding-right:clamp(18px, 1.8vw, 34px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers{
    width:min(770px, 42vw) !important;
    max-width:min(770px, 42vw) !important;
    margin-left:0 !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(1vw, 16px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(930px, 62vw, 1100px) !important;
    min-height:96vh !important;
    margin-right:calc(-1 * min(4vw, 56px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1010px, 59vw) !important;
    max-width:none !important;
    opacity:.9 !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseImg{
    opacity:.9 !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(286px, 17.4vw) !important;
    left:clamp(8px, 1vw, 18px) !important;
    right:auto !important;
    top:50% !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.945 + (var(--spx-copy-enter) * .055) - (var(--spx-scene-exit) * .018))) !important;
  }

  .spx-showcaseHotspotLayersMain{
    left:5.5% !important;
    top:9.2% !important;
    width:88% !important;
    height:10.8% !important;
  }

  .spx-showcaseHotspotLayersSub{
    left:5.5% !important;
    top:17.2% !important;
    width:88% !important;
    height:9.8% !important;
  }

  .spx-showcaseHotspotLayersTree{
    left:7.2% !important;
    top:57.8% !important;
    width:82% !important;
    height:26.5% !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers{
    grid-template-columns:minmax(540px, 44vw) minmax(560px, 1fr) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(820px, 59vw, 980px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(900px, 56vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(262px, 19vw) !important;
    left:clamp(8px, 1vw, 16px) !important;
  }
}


/* --- pass80 layers sticky hook + mirrored side-entry --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    min-height:416vh !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    position:sticky !important;
    top:0 !important;
    min-height:100vh !important;
    align-self:start !important;
    display:grid !important;
    align-content:center !important;
    justify-items:start !important;
    width:calc(min(770px, 42vw) + clamp(26px, 3vw, 46px)) !important;
    max-width:calc(min(770px, 42vw) + clamp(26px, 3vw, 46px)) !important;
    margin-left:calc(-1 * clamp(26px, 3vw, 46px)) !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    overflow:visible !important;
    transform:none !important;
    translate:none !important;
    filter:none !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    margin-left:calc(-1 * clamp(26px, 3vw, 46px)) !important;
    margin-right:0 !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    transition:none !important;
    translate:none !important;
    opacity:calc(.34 + (var(--spx-copy-enter) * .66) - (var(--spx-scene-exit) * .08)) !important;
  }
}


/* --- pass81 layers pre-visual first, true mirror, unclipped left card --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    min-height:430vh !important;
    grid-template-columns:minmax(520px, .84fr) minmax(0, 1.16fr) !important;
    gap:clamp(22px, 3.2vw, 62px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    position:sticky !important;
    top:0 !important;
    min-height:100vh !important;
    align-self:start !important;
    display:grid !important;
    align-content:center !important;
    justify-items:start !important;
    width:min(720px, 40vw) !important;
    max-width:min(720px, 40vw) !important;
    margin-left:0 !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    overflow:visible !important;
    transform:none !important;
    translate:none !important;
    filter:none !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    transition:none !important;
    translate:none !important;
    opacity:calc(.06 + (var(--spx-copy-enter) * .94) - (var(--spx-scene-exit) * .12)) !important;
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:0 !important;
    justify-content:flex-end !important;
    top:6vh !important;
    min-height:92vh !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(980px, 66vw, 1180px) !important;
    min-height:92vh !important;
    margin-right:calc(-1 * min(1.8vw, 26px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1080px, 62vw) !important;
    max-width:none !important;
    opacity:.9 !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(322px, 19.4vw) !important;
    left:clamp(22px, 2.1vw, 40px) !important;
    right:auto !important;
    top:50% !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.93 + (var(--spx-scene-enter) * .07) - (var(--spx-scene-exit) * .02))) !important;
    opacity:calc(.14 + (var(--spx-scene-enter) * .86) - (var(--spx-scene-exit) * .08)) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    width:min(660px, 44vw) !important;
    max-width:min(660px, 44vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene{
    width:clamp(860px, 62vw, 1020px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(960px, 59vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(286px, 21vw) !important;
    left:clamp(18px, 1.8vw, 28px) !important;
  }
}

/* --- pass82 layers flush-left padding + hotspot lift --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    min-height:438vh !important;
    gap:clamp(18px, 2.2vw, 34px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    width:calc(min(720px, 40vw) + clamp(20px, 3vw, 44px)) !important;
    max-width:calc(min(720px, 40vw) + clamp(20px, 3vw, 44px)) !important;
    margin-left:calc(-1 * clamp(20px, 3vw, 44px)) !important;
    padding-left:0 !important;
    overflow:visible !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    margin-left:0 !important;
    padding:34px 38px 36px 42px !important;
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    text-align:left !important;
    justify-items:start !important;
    align-items:start !important;
  }

  .spx-scrollFeatureLayers .spx-featurePoints{
    margin-top:18px !important;
  }

  .spx-showcaseHotspotLayersMain{
    left:5.5% !important;
    top:6.8% !important;
    width:88% !important;
    height:10.2% !important;
  }

  .spx-showcaseHotspotLayersSub{
    left:5.5% !important;
    top:14.0% !important;
    width:88% !important;
    height:9.0% !important;
  }

  .spx-showcaseHotspotLayersTree{
    left:7.1% !important;
    top:51.5% !important;
    width:82% !important;
    height:24.0% !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    width:calc(min(660px, 43vw) + clamp(20px, 3vw, 36px)) !important;
    max-width:calc(min(660px, 43vw) + clamp(20px, 3vw, 36px)) !important;
    margin-left:calc(-1 * clamp(20px, 3vw, 36px)) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    padding:30px 32px 32px 36px !important;
  }
}


/* --- pass83 layers mirror final alignment / visual-first motion / hotspot correction --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers{
    min-height:452vh !important;
    padding-inline-start:0 !important;
    padding-inline-end:clamp(18px, 2.2vw, 38px) !important;
    grid-template-columns:minmax(540px, .82fr) minmax(0, 1.18fr) !important;
    gap:clamp(28px, 3.2vw, 56px) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    width:min(748px, 43vw) !important;
    max-width:min(748px, 43vw) !important;
    margin-left:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
    justify-items:start !important;
    align-content:center !important;
    top:0 !important;
    min-height:100vh !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:40px 40px 38px 48px !important;
    border-top-left-radius:0 !important;
    border-bottom-left-radius:0 !important;
    border-top-right-radius:30px !important;
    border-bottom-right-radius:30px !important;
    text-align:left !important;
    justify-items:start !important;
    align-items:start !important;
    transform:translate3d(var(--spx-copy-x), 0, 0) !important;
    opacity:calc(.05 + (var(--spx-copy-enter) * .95) - (var(--spx-scene-exit) * .14)) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(12vw, 192px)) !important;
    justify-content:flex-end !important;
    top:6vh !important;
    min-height:92vh !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers{
    width:clamp(1120px, 73vw, 1340px) !important;
    min-height:92vh !important;
    margin-right:calc(-1 * min(6vw, 98px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1200px, 69vw) !important;
    max-width:none !important;
    opacity:.9 !important;
    background:transparent !important;
    border-color:transparent !important;
    box-shadow:none !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(342px, 20.5vw) !important;
    left:clamp(18px, 1.8vw, 32px) !important;
    top:50% !important;
    transform:translate3d(var(--spx-panel-x), calc(-50% + var(--spx-panel-y)), 0) scale(calc(.94 + (var(--spx-scene-enter) * .06) - (var(--spx-scene-exit) * .018))) !important;
    opacity:calc(.10 + (var(--spx-scene-enter) * .90) - (var(--spx-scene-exit) * .08)) !important;
  }

  .spx-scrollFeatureLayers .spx-featurePoints{
    margin-top:20px !important;
    gap:12px !important;
  }

  .spx-showcaseHotspotLayersMain{
    left:2.6% !important;
    top:2.2% !important;
    width:94.2% !important;
    height:8.6% !important;
  }

  .spx-showcaseHotspotLayersSub{
    left:2.0% !important;
    top:10.2% !important;
    width:94.8% !important;
    height:8.6% !important;
  }

  .spx-showcaseHotspotLayersTree{
    left:7.0% !important;
    top:48.4% !important;
    width:84.0% !important;
    height:42.6% !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers{
    grid-template-columns:minmax(500px, .84fr) minmax(0, 1.16fr) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    width:min(676px, 45vw) !important;
    max-width:min(676px, 45vw) !important;
  }

  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    padding:34px 32px 32px 38px !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers{
    width:clamp(980px, 70vw, 1160px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1080px, 66vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(320px, 22vw) !important;
    left:clamp(14px, 1.4vw, 24px) !important;
  }
}

/* --- pass84 layers visual nudge: smaller and more right --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(14vw, 228px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers{
    width:clamp(1040px, 70vw, 1240px) !important;
    margin-right:calc(-1 * min(9vw, 146px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1120px, 65vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(332px, 19.8vw) !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    margin-right:calc(-1 * min(12vw, 170px)) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseScene,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers{
    width:clamp(930px, 67vw, 1080px) !important;
  }

  .spx-scrollFeatureLayers .spx-showcaseBaseFrame,
  .spx-scrollFeatureLayers .spx-showcaseSceneLayers .spx-showcaseBaseFrame{
    width:min(1000px, 62vw) !important;
  }

  .spx-scrollFeatureLayers .spx-showcasePanelLayers{
    width:min(304px, 21vw) !important;
  }
}


/* --- pass85 flow tightening + why this matters rework + smoother landing performance --- */
[data-reveal]{
  filter:none;
  transform:translate3d(0,18px,0);
  transition:opacity .72s var(--spx-ease),transform .72s var(--spx-ease);
  will-change:transform,opacity;
}
[data-reveal].is-visible{transform:translate3d(0,0,0);}

.spx-scrollFeatureVisual,
.spx-showcaseScene,
.spx-showcaseBaseFrame,
.spx-showcasePanel,
.spx-scrollFeatureCopyCard,
.spx-flowBandStat,
.spx-flowBandGrid article,
.spx-flowBandStep{
  backface-visibility:hidden;
  transform-style:preserve-3d;
  will-change:transform,opacity;
}

.spx-flowBandRework{
  display:grid;
  gap:26px;
  padding:18px 0 18px;
  border-top:1px solid rgba(255,255,255,.07);
}

.spx-flowBandRework .spx-flowBandHead{
  max-width:860px;
}

.spx-flowBandRework .spx-flowBandHead p{
  margin:0;
  color:var(--spx-muted);
  line-height:1.84;
  font-weight:600;
}

.spx-flowBandStats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.spx-flowBandStat,
.spx-flowBandGridRich article,
.spx-flowBandStep{
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(13,19,34,.78), rgba(8,12,24,.94));
  box-shadow:0 18px 52px rgba(0,0,0,.18);
}

.spx-flowBandStat{
  padding:20px 20px 18px;
  border-radius:24px;
  display:grid;
  gap:10px;
}

.spx-flowBandStat strong{
  font-size:15px;
  line-height:1.25;
}

.spx-flowBandStat span{
  color:var(--spx-muted);
  line-height:1.72;
  font-size:14px;
  font-weight:600;
}

.spx-flowBandGridRich{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.spx-flowBandGridRich article{
  padding:24px 24px 22px;
  border-radius:26px;
}

.spx-flowBandStory{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:20px;
  align-items:stretch;
}

.spx-flowBandStoryCopy{
  padding:28px 30px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(12,18,32,.82), rgba(8,12,23,.95));
  box-shadow:0 20px 56px rgba(0,0,0,.18);
}

.spx-flowBandStoryKicker{
  margin-bottom:10px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(255,221,184,.72);
}

.spx-flowBandStoryCopy h3{
  margin:0 0 12px;
  font-size:clamp(24px,3vw,34px);
  line-height:1.1;
  letter-spacing:-.04em;
}

.spx-flowBandStoryCopy p{
  margin:0;
  color:var(--spx-muted);
  line-height:1.82;
  font-weight:600;
}

.spx-flowBandList{
  margin:18px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:12px;
}

.spx-flowBandList li{
  position:relative;
  padding-left:18px;
  color:var(--spx-text);
  font-weight:700;
  line-height:1.68;
}

.spx-flowBandList li::before{
  content:"";
  position:absolute;
  left:0;
  top:.68em;
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(255,179,102,.9), rgba(255,127,69,.82));
  box-shadow:0 0 0 4px rgba(255,163,82,.14);
}

.spx-flowBandSteps{
  display:grid;
  gap:14px;
}

.spx-flowBandStep{
  position:relative;
  padding:22px 22px 20px 70px;
  border-radius:24px;
}

.spx-flowBandStep span{
  position:absolute;
  left:22px;
  top:20px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  color:#fff3e0;
  background:linear-gradient(135deg, rgba(255,179,102,.22), rgba(255,127,69,.14));
  border:1px solid rgba(255,173,102,.28);
}

.spx-flowBandStep strong{
  display:block;
  margin-bottom:8px;
  font-size:16px;
  line-height:1.24;
}

.spx-flowBandStep p{
  margin:0;
  color:var(--spx-muted);
  font-size:14px;
  line-height:1.74;
  font-weight:600;
}

html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandStat,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandGridRich article,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandStoryCopy,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandStep{
  background:linear-gradient(180deg, rgba(255,250,246,.96), rgba(246,236,226,.99));
  border-color:rgba(129,89,58,.10);
  box-shadow:0 24px 64px rgba(170,118,78,.10);
}

html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandStat span,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandStoryCopy p,
html[data-spx-theme="light"] body.spx-prealpha .spx-flowBandStep p{
  color:rgba(93,68,49,.82);
}

@media (min-width:1181px){
  .spx-scrollFeatureSettings{
    min-height:314vh !important;
  }

  .spx-scrollFeatureLayers{
    min-height:324vh !important;
  }
}

@media (max-width: 980px){
  .spx-flowBandStats,
  .spx-flowBandGridRich,
  .spx-flowBandStory{
    grid-template-columns:1fr;
  }

  .spx-flowBandStoryCopy{
    padding:22px 20px;
  }

  .spx-flowBandStep{
    padding:20px 18px 18px 62px;
  }
}


.spx-flowBandStoryMode{
  gap:22px;
}

.spx-flowBandStoryModeRail{
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
}

.spx-flowBandOutcome{
  max-width:880px;
}

@media (max-width: 980px){
  .spx-flowBandStoryModeRail{
    grid-template-columns:1fr;
  }

  .spx-flowBandOutcome{
    max-width:none;
  }
}

/* pass87: why story editorial rework */
.spx-whyStory{
  display:grid;
  gap:20px;
  padding:12px 0 6px;
}

.spx-whyStoryHead{
  max-width:700px;
}

.spx-whyStoryHead p{
  margin:0;
  max-width:640px;
  color:var(--spx-muted);
  line-height:1.82;
  font-weight:600;
}

.spx-whyStoryShell{
  display:grid;
  grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr);
  gap:18px;
  align-items:start;
}

.spx-whyStoryVisualRail{
  position:sticky;
  top:calc(var(--spx-topbar-height, 88px) + 20px);
}

.spx-whyStoryVisual{
  position:relative;
  min-height:520px;
  padding:30px;
  border-radius:30px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 50% 32%, rgba(126,108,255,.22), transparent 34%),
    radial-gradient(circle at 68% 70%, rgba(93,223,255,.16), transparent 28%),
    linear-gradient(180deg, rgba(10,15,29,.92), rgba(6,10,20,.98));
  box-shadow:0 28px 80px rgba(0,0,0,.26);
  isolation:isolate;
}

.spx-whyStorySpace{
  position:relative;
  height:320px;
  margin-bottom:18px;
}

.spx-whyStoryGlow,
.spx-whyStoryOrbit,
.spx-whyStoryPlanet,
.spx-whyStoryCore,
.spx-whyStoryBeam{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
}

.spx-whyStoryGlow{
  width:240px;
  height:240px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(119,112,255,.26), rgba(50,62,150,.08) 58%, transparent 72%);
  filter:blur(18px);
  opacity:.9;
}

.spx-whyStoryOrbit{
  border:1px solid rgba(198,212,255,.14);
  border-radius:999px;
}

.spx-whyStoryOrbitOuter{width:300px;height:300px;opacity:.72;}
.spx-whyStoryOrbitMid{width:224px;height:224px;opacity:.58;}
.spx-whyStoryOrbitInner{width:150px;height:150px;opacity:.46;}

.spx-whyStoryCore{
  width:28px;
  height:28px;
  border-radius:50%;
  background:linear-gradient(135deg, #fff1d8, #9fe7ff 72%, #8978ff);
  box-shadow:0 0 0 10px rgba(133,155,255,.08), 0 0 32px rgba(122,148,255,.35);
}

.spx-whyStoryBeam{
  width:170px;
  height:170px;
  border-radius:50%;
  background:conic-gradient(from 0deg, transparent 0deg 120deg, rgba(165,197,255,.24) 150deg 210deg, transparent 240deg 360deg);
  animation:spxWhyOrbitSpin 18s linear infinite;
  opacity:.8;
}

.spx-whyStoryPlanet{
  width:16px;
  height:16px;
  border-radius:50%;
  box-shadow:0 0 0 6px rgba(255,255,255,.05);
  transition:transform .45s ease, opacity .45s ease, box-shadow .45s ease, background .45s ease;
}

.spx-whyStoryPlanetOne{background:linear-gradient(135deg,#ffb26e,#ff6f53); transform:translate(-50%, -50%) translate(0,-150px);}
.spx-whyStoryPlanetTwo{background:linear-gradient(135deg,#85f0ff,#6ca2ff); transform:translate(-50%, -50%) translate(112px,0);}
.spx-whyStoryPlanetThree{background:linear-gradient(135deg,#d3b3ff,#8d7bff); transform:translate(-50%, -50%) translate(-82px,96px);}

.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryPlanetOne,
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryPlanetTwo,
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryPlanetThree{
  box-shadow:0 0 0 10px rgba(255,255,255,.08), 0 0 28px rgba(145,173,255,.36);
  opacity:1;
}

.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryPlanetTwo,
.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryPlanetThree,
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryPlanetOne,
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryPlanetThree,
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryPlanetOne,
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryPlanetTwo{
  opacity:.58;
}

.spx-whyStoryVisualCard{
  position:relative;
  z-index:1;
  display:grid;
  gap:8px;
  padding:18px 18px 16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(12,18,33,.82), rgba(7,11,23,.96));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.spx-whyStoryVisualKicker{
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:rgba(255,220,184,.72);
}

.spx-whyStoryVisualCard strong{
  font-size:22px;
  line-height:1.1;
  letter-spacing:-.03em;
}

.spx-whyStoryVisualCard p{
  margin:0;
  color:var(--spx-muted);
  line-height:1.72;
  font-weight:600;
}

.spx-whyStorySteps{
  display:grid;
  gap:12px;
  align-content:start;
}

.spx-whyStoryStep,
.spx-whyStoryOutro{
  position:relative;
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  gap:16px;
  align-items:start;
  padding:22px 22px 20px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg, rgba(12,18,31,.72), rgba(7,11,21,.92));
  box-shadow:0 18px 54px rgba(0,0,0,.18);
  opacity:.64;
  transform:translateY(10px) scale(.986);
  transition:opacity .34s ease, transform .34s ease, border-color .34s ease, background .34s ease, box-shadow .34s ease;
}

.spx-whyStoryStep.is-active{
  opacity:1;
  transform:translateY(0) scale(1);
  border-color:rgba(170,198,255,.22);
  background:linear-gradient(180deg, rgba(15,22,38,.92), rgba(9,13,24,.98));
  box-shadow:0 24px 64px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
}

.spx-whyStoryStepNo{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  color:#fff3e0;
  background:linear-gradient(135deg, rgba(255,176,97,.22), rgba(139,126,255,.16));
  border:1px solid rgba(255,184,110,.20);
}

.spx-whyStoryStepBody{display:grid;gap:8px;}

.spx-whyStoryStepKicker{
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:rgba(161,196,255,.82);
}

.spx-whyStoryStep h3{
  margin:0;
  font-size:clamp(22px,2.4vw,30px);
  line-height:1.05;
  letter-spacing:-.04em;
}

.spx-whyStoryStep p,
.spx-whyStoryOutro p{
  margin:0;
  color:var(--spx-muted);
  line-height:1.78;
  font-weight:600;
}

.spx-whyStoryOutro{
  grid-template-columns:1fr;
  gap:8px;
  opacity:1;
  transform:none;
  max-width:720px;
}

.spx-whyStoryOutro strong{
  font-size:15px;
  line-height:1.25;
}

@keyframes spxWhyOrbitSpin{
  from{transform:translate(-50%, -50%) rotate(0deg);}
  to{transform:translate(-50%, -50%) rotate(360deg);}
}

html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryVisual{
  background:
    radial-gradient(circle at 50% 32%, rgba(143,131,255,.18), transparent 34%),
    radial-gradient(circle at 68% 70%, rgba(114,214,255,.14), transparent 28%),
    linear-gradient(180deg, rgba(255,251,247,.98), rgba(244,234,223,.98));
  border-color:rgba(129,89,58,.10);
  box-shadow:0 28px 72px rgba(170,118,78,.12);
}

html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryVisualCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryStep,
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryOutro{
  background:linear-gradient(180deg, rgba(255,250,246,.96), rgba(246,236,226,.99));
  border-color:rgba(129,89,58,.10);
  box-shadow:0 24px 64px rgba(170,118,78,.10);
}

html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryVisualCard p,
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryStep p,
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryOutro p,
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryHead p{
  color:rgba(93,68,49,.82);
}

@media (max-width: 980px){
  .spx-whyStoryShell{
    grid-template-columns:1fr;
  }

  .spx-whyStoryVisualRail{
    position:relative;
    top:auto;
  }

  .spx-whyStoryVisual{
    min-height:440px;
    padding:22px;
  }

  .spx-whyStorySpace{
    height:250px;
  }

  .spx-whyStoryStep,
  .spx-whyStoryOutro{
    grid-template-columns:48px minmax(0,1fr);
    padding:18px 18px 16px;
  }

  .spx-whyStoryOutro{
    grid-template-columns:1fr;
  }
}


/* pass88: deeper explore + interactive why story */
.spx-whyStory{
  gap:24px;
}

.spx-whyStoryHead{
  max-width:620px;
}

.spx-whyStoryHead p{
  max-width:560px;
}

.spx-whyStoryShell{
  grid-template-columns:minmax(320px,.88fr) minmax(0,1.12fr);
  gap:26px;
  --spx-why-progress:0;
}

.spx-whyStoryVisual{
  min-height:540px;
}

.spx-whyStoryVisual::after{
  content:"";
  position:absolute;
  inset:auto 30px 30px 30px;
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.06), rgba(164,192,255,.26), rgba(255,255,255,.04));
  opacity:.72;
  pointer-events:none;
}

.spx-whyStorySpace{
  overflow:hidden;
}

.spx-whyStoryDust{
  position:absolute;
  border-radius:999px;
  background:radial-gradient(circle, rgba(255,255,255,.9), rgba(180,210,255,.16) 52%, transparent 72%);
  opacity:.42;
  filter:blur(.2px);
}

.spx-whyStoryDustOne{width:8px;height:8px;left:24%;top:26%;}
.spx-whyStoryDustTwo{width:6px;height:6px;left:74%;top:38%;}
.spx-whyStoryDustThree{width:10px;height:10px;left:36%;top:76%;}

.spx-whyStoryVisual,
.spx-whyStoryPlanet,
.spx-whyStoryGlow,
.spx-whyStoryCore,
.spx-whyStoryBeam,
.spx-whyStoryVisualCard{
  transition:transform .55s cubic-bezier(.22,.74,.2,1), opacity .45s ease, box-shadow .45s ease, background .45s ease;
}

.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryGlow{transform:translate(-50%, -50%) scale(1.02);}
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryGlow{transform:translate(-50%, -50%) scale(1.14);}
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryGlow{transform:translate(-50%, -50%) scale(.96);}
.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryVisualCard{transform:translateY(0) rotate(-1deg);}
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryVisualCard{transform:translateY(-4px) rotate(.6deg);}
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryVisualCard{transform:translateY(6px) rotate(-.4deg);}
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryPlanetTwo{transform:translate(-50%, -50%) translate(126px,-8px) scale(1.16);}
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryPlanetThree{transform:translate(-50%, -50%) translate(-94px,108px) scale(1.16);}
.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryPlanetOne{transform:translate(-50%, -50%) translate(0,-162px) scale(1.16);}

.spx-whyStorySteps{
  position:relative;
  display:grid;
  gap:0;
  padding-left:34px;
}

.spx-whyStoryProgress{
  position:absolute;
  left:10px;
  top:8vh;
  bottom:8vh;
  width:2px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  overflow:hidden;
  border-radius:999px;
}

.spx-whyStoryProgress span{
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:calc(var(--spx-why-progress, 0) * 100%);
  min-height:18px;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,193,124,.95), rgba(132,201,255,.92));
  box-shadow:0 0 20px rgba(152,195,255,.28);
}

.spx-whyStoryScene{
  min-height:58vh;
  display:flex;
  align-items:center;
  position:relative;
}

.spx-whyStoryScene:last-child{
  min-height:42vh;
}

.spx-whyStoryStep,
.spx-whyStoryOutro{
  width:min(100%, 760px);
}

.spx-whyStoryStep{
  position:sticky;
  top:calc(var(--spx-topbar-height, 88px) + 44px);
  opacity:.38;
  transform:translateX(42px) scale(.97);
  border-color:rgba(255,255,255,.05);
  background:linear-gradient(180deg, rgba(11,17,29,.54), rgba(7,11,20,.82));
}

.spx-whyStoryStep.is-active{
  opacity:1;
  transform:translateX(0) scale(1);
  box-shadow:0 28px 80px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04);
}

.spx-whyStoryStepNo{
  box-shadow:0 10px 28px rgba(255,138,68,.16);
}

.spx-whyStoryStepBody{
  gap:10px;
}

.spx-whyStoryStep p{
  max-width:52ch;
}

.spx-whyStoryOutro{
  align-self:center;
  margin-top:6vh;
  padding:22px 24px;
}

html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryProgress{
  background:linear-gradient(180deg, rgba(129,89,58,.10), rgba(129,89,58,.04));
}

@media (max-width: 980px){
  .spx-whyStoryShell{
    grid-template-columns:1fr;
  }

  .spx-whyStoryVisual{
    min-height:460px;
  }

  .spx-whyStorySteps{
    padding-left:26px;
  }

  .spx-whyStoryProgress{
    top:20px;
    bottom:20px;
  }

  .spx-whyStoryScene,
  .spx-whyStoryScene:last-child{
    min-height:auto;
  }

  .spx-whyStoryStep,
  .spx-whyStoryOutro{
    position:relative;
    top:auto;
    width:100%;
    opacity:1;
    transform:none;
  }
}


/* === PASS89: Our vision interactive story === */
.spx-whyStory{ --spx-why-ease:cubic-bezier(.2,.82,.2,1); }
.spx-whyStoryHead{ max-width:min(820px, 100%); }
.spx-whyStoryHead h2{ max-width:16ch; }
.spx-whyStoryHead p{ max-width:62ch; }
.spx-whyStoryShell{
  grid-template-columns:minmax(320px, .92fr) minmax(0, 1.08fr);
  gap:clamp(32px, 4vw, 72px);
  align-items:start;
}
.spx-whyStoryVisualRail{
  position:sticky;
  top:calc(var(--spx-topbar-height, 88px) + 32px);
}
.spx-whyStoryVisual{
  min-height:560px;
  border-radius:32px;
  overflow:hidden;
  padding:28px;
  background:
    radial-gradient(circle at 50% 44%, rgba(120,166,255,.22), transparent 34%),
    radial-gradient(circle at 24% 22%, rgba(255,173,104,.14), transparent 28%),
    linear-gradient(180deg, rgba(10,14,23,.92), rgba(7,10,18,.98));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 36px 100px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .7s var(--spx-why-ease), box-shadow .7s var(--spx-why-ease), border-color .45s ease;
}
.spx-whyStoryVisual::before{
  content:"";
  position:absolute;
  inset:20px;
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0)),
    radial-gradient(circle at 50% 40%, rgba(126,149,255,.08), transparent 52%);
  pointer-events:none;
}
.spx-whyStorySpace{ inset:30px 30px 148px; }
.spx-whyStoryMarker{
  position:absolute;
  z-index:3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:9px 14px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(245,248,255,.88);
  background:rgba(12,18,31,.76);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 14px 40px rgba(0,0,0,.28);
  backdrop-filter:blur(12px);
  opacity:.4;
  transform:translate3d(0,16px,0) scale(.94);
  transition:transform .6s var(--spx-why-ease), opacity .45s ease, border-color .45s ease, box-shadow .45s ease;
}
.spx-whyStoryMarkerOne{ left:12%; top:12%; }
.spx-whyStoryMarkerTwo{ right:10%; top:30%; }
.spx-whyStoryMarkerThree{ left:18%; bottom:8%; }
.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryMarkerOne,
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryMarkerTwo,
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryMarkerThree{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  border-color:rgba(255,200,136,.28);
  box-shadow:0 20px 52px rgba(0,0,0,.3), 0 0 0 1px rgba(255,200,136,.06) inset;
}
.spx-whyStoryVisual[data-active-step="1"]{ transform:translateY(0) scale(1); }
.spx-whyStoryVisual[data-active-step="2"]{ transform:translateY(-6px) scale(1.01); }
.spx-whyStoryVisual[data-active-step="3"]{ transform:translateY(4px) scale(.995); }
.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryGlow{ transform:translate(-50%, -50%) scale(1.04); opacity:.92; }
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryGlow{ transform:translate(-50%, -50%) scale(1.18); opacity:1; }
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryGlow{ transform:translate(-50%, -50%) scale(.98); opacity:.84; }
.spx-whyStoryVisual[data-active-step="1"] .spx-whyStoryVisualCard{ transform:translateY(0) rotate(-.8deg); }
.spx-whyStoryVisual[data-active-step="2"] .spx-whyStoryVisualCard{ transform:translateY(-6px) rotate(.55deg); }
.spx-whyStoryVisual[data-active-step="3"] .spx-whyStoryVisualCard{ transform:translateY(8px) rotate(-.35deg); }
.spx-whyStoryVisualCard{ z-index:4; max-width:320px; transition:transform .7s var(--spx-why-ease), opacity .35s ease; }
.spx-whyStoryVisualKicker{ color:rgba(255,194,131,.88); }
.spx-whyStorySteps{ padding-left:54px; }
.spx-whyStoryProgress{
  left:18px;
  top:10vh;
  bottom:10vh;
  width:3px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
}
.spx-whyStoryProgress span{
  background:linear-gradient(180deg, rgba(255,198,135,.98), rgba(128,194,255,.96));
  box-shadow:0 0 24px rgba(156,195,255,.30);
}
.spx-whyStoryScene{ min-height:70vh; }
.spx-whyStoryScene:last-child{ min-height:48vh; }
.spx-whyStoryStep,
.spx-whyStoryOutro{ width:min(100%, 720px); }
.spx-whyStoryStep{
  position:sticky;
  top:calc(var(--spx-topbar-height, 88px) + 58px);
  padding:28px 28px 26px;
  border-radius:28px;
  opacity:.22;
  transform:translate3d(50px, 12px, 0) scale(.962);
  background:linear-gradient(180deg, rgba(10,14,23,.44), rgba(7,10,18,.80));
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 22px 62px rgba(0,0,0,.14);
  transition:opacity .65s ease, transform .75s var(--spx-why-ease), box-shadow .65s ease, border-color .45s ease, background .45s ease;
}
.spx-whyStoryStep.is-before{
  opacity:.12;
  transform:translate3d(-18px, -8px, 0) scale(.94);
}
.spx-whyStoryStep.is-after{
  opacity:.24;
  transform:translate3d(48px, 10px, 0) scale(.965);
}
.spx-whyStoryStep.is-active{
  opacity:1;
  transform:translate3d(0, 0, 0) scale(1);
  background:linear-gradient(180deg, rgba(11,17,29,.84), rgba(7,11,20,.96));
  border-color:rgba(255,255,255,.09);
  box-shadow:0 34px 92px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
}
.spx-whyStoryStepNo{
  width:52px;
  height:52px;
  color:rgba(255,226,199,.96);
  background:linear-gradient(180deg, rgba(255,168,91,.18), rgba(99,153,255,.10));
  border-color:rgba(255,183,121,.20);
}
.spx-whyStoryStepBody{ gap:12px; }
.spx-whyStoryStepKicker{ color:rgba(255,199,136,.90); }
.spx-whyStoryStep h3{ max-width:18ch; }
.spx-whyStoryStep p{ max-width:48ch; }
.spx-whyStoryStepNote{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.82rem;
  color:rgba(224,233,255,.68);
}
.spx-whyStoryStepNote::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(255,196,128,.96), rgba(127,191,255,.92));
  box-shadow:0 0 16px rgba(147,192,255,.36);
}
.spx-whyStoryOutro{
  padding:24px 26px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(11,17,29,.62), rgba(7,11,20,.92));
  border:1px solid rgba(255,255,255,.06);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryVisual{
  background:
    radial-gradient(circle at 50% 44%, rgba(114,129,255,.12), transparent 34%),
    radial-gradient(circle at 24% 22%, rgba(255,178,115,.10), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,247,252,.99));
  border-color:rgba(129,89,58,.14);
  box-shadow:0 32px 80px rgba(74,49,33,.10), inset 0 1px 0 rgba(255,255,255,.75);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryMarker{
  color:rgba(53,42,33,.80);
  background:rgba(255,255,255,.84);
  border-color:rgba(129,89,58,.10);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryStep,
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryOutro{
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(246,247,252,.98));
  border-color:rgba(129,89,58,.12);
  box-shadow:0 26px 68px rgba(74,49,33,.08);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-whyStoryStepNote{ color:rgba(70,56,46,.64); }
@media (max-width: 980px){
  .spx-whyStoryShell{ grid-template-columns:1fr; gap:24px; }
  .spx-whyStoryVisualRail{ position:relative; top:auto; }
  .spx-whyStoryVisual{ min-height:420px; }
  .spx-whyStoryVisualCard{ max-width:none; }
  .spx-whyStorySteps{ padding-left:0; }
  .spx-whyStoryProgress{ display:none; }
  .spx-whyStoryScene,
  .spx-whyStoryScene:last-child{ min-height:auto; }
  .spx-whyStoryStep,
  .spx-whyStoryOutro{
    position:relative;
    top:auto;
    width:100%;
    transform:none !important;
    opacity:1 !important;
    margin-bottom:16px;
  }
}

/* === PASS90: Our vision stacked cards rework === */
.spx-visionStack{
  --spx-vision-ease:cubic-bezier(.2,.84,.2,1);
}
.spx-visionStackHead{
  max-width:min(640px,100%);
}
.spx-visionStackHead h2{
  max-width:12ch;
}
.spx-visionStackHead p{
  max-width:40ch;
  font-size:1rem;
}
.spx-visionStackShell{
  grid-template-columns:minmax(300px,.86fr) minmax(0,1.14fr);
  gap:clamp(28px,4vw,64px);
  align-items:start;
}
.spx-visionStackVisualRail{
  position:sticky;
  top:calc(var(--spx-topbar-height, 88px) + 34px);
}
.spx-visionStackVisual{
  min-height:520px;
  border-radius:30px;
}
.spx-visionStackVisualCard{
  max-width:300px;
}
.spx-visionStackSteps{
  position:relative;
  padding-left:64px;
  padding-top:18px;
}
.spx-visionStackProgress{
  left:20px;
  top:0;
  bottom:24px;
}
.spx-visionStackScene{
  min-height:52vh;
  position:relative;
}
.spx-visionStackScene + .spx-visionStackScene{
  margin-top:-22vh;
}
.spx-visionStackCard{
  position:sticky;
  top:calc(var(--spx-topbar-height, 88px) + 66px);
  width:min(100%, 640px);
  padding:26px 26px 24px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(11,17,29,.80), rgba(8,11,20,.96));
  border:1px solid rgba(255,255,255,.075);
  box-shadow:0 26px 72px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(14px);
  transition:transform .75s var(--spx-vision-ease), opacity .5s ease, box-shadow .5s ease, border-color .4s ease;
  will-change:transform, opacity;
}
.spx-visionStackCard .spx-whyStoryStepBody{
  gap:10px;
}
.spx-visionStackCard .spx-whyStoryStepKicker{
  letter-spacing:.12em;
}
.spx-visionStackCard .spx-whyStoryStepNo{
  width:48px;
  height:48px;
}
.spx-visionStackCard h3{
  max-width:18ch;
  font-size:clamp(1.45rem,2.2vw,2.05rem);
}
.spx-visionStackCard p{
  max-width:34ch;
  font-size:1rem;
}
.spx-visionStackCard.is-before{
  opacity:.36;
  transform:translate3d(0,-34px,0) scale(.93);
  box-shadow:0 10px 28px rgba(0,0,0,.14);
}
.spx-visionStackCard.is-active{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  border-color:rgba(255,255,255,.11);
  box-shadow:0 36px 94px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
}
.spx-visionStackCard.is-after{
  opacity:.72;
  transform:translate3d(0,28px,0) scale(.965);
  box-shadow:0 18px 50px rgba(0,0,0,.18);
}
.spx-visionStackCard[data-why-step="1"]{ z-index:4; }
.spx-visionStackCard[data-why-step="2"]{ z-index:3; }
.spx-visionStackCard[data-why-step="3"]{ z-index:2; }
.spx-visionStackShell[data-active-step="1"] .spx-visionStackCard[data-why-step="1"],
.spx-visionStackShell[data-active-step="2"] .spx-visionStackCard[data-why-step="2"],
.spx-visionStackShell[data-active-step="3"] .spx-visionStackCard[data-why-step="3"]{
  z-index:6;
}
.spx-visionStackShell[data-active-step="1"] .spx-visionStackVisual{ transform:translateY(0) scale(1); }
.spx-visionStackShell[data-active-step="2"] .spx-visionStackVisual{ transform:translateY(-8px) scale(1.01); }
.spx-visionStackShell[data-active-step="3"] .spx-visionStackVisual{ transform:translateY(6px) scale(.995); }
.spx-visionStackVisual .spx-whyStoryMarker,
.spx-visionStackVisual .spx-whyStoryVisualCard{
  transition-duration:.8s;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionStackCard{
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(245,247,252,.99));
  border-color:rgba(129,89,58,.12);
  box-shadow:0 24px 62px rgba(74,49,33,.10);
}
@media (max-width: 980px){
  .spx-visionStackShell{ grid-template-columns:1fr; gap:22px; }
  .spx-visionStackVisualRail{ position:relative; top:auto; }
  .spx-visionStackVisual{ min-height:400px; }
  .spx-visionStackSteps{ padding-left:0; padding-top:0; }
  .spx-visionStackProgress{ display:none; }
  .spx-visionStackScene,
  .spx-visionStackScene + .spx-visionStackScene{ min-height:auto; margin-top:0; }
  .spx-visionStackCard{
    position:relative;
    top:auto;
    width:100%;
    transform:none !important;
    opacity:1 !important;
    margin-bottom:14px;
  }
}


/* === PASS91: Our vision interactive deck rework === */
.spx-visionDeck{
  --spx-vision-ease:cubic-bezier(.2,.84,.18,1);
}
.spx-visionDeckHead{
  max-width:min(620px,100%);
  margin-bottom:clamp(18px,2vw,28px);
}
.spx-visionDeckHead h2{
  max-width:11ch;
}
.spx-visionDeckHead p{
  max-width:28ch;
  font-size:1rem;
}
.spx-visionDeckShell{
  position:relative;
  display:grid;
  grid-template-columns:minmax(300px,.82fr) minmax(0,1.18fr);
  gap:clamp(34px,4.2vw,72px);
  align-items:start;
}
.spx-visionDeckVisualRail{
  position:sticky;
  top:calc(var(--spx-topbar-height,88px) + 26px);
}
.spx-visionDeckVisual{
  position:relative;
  min-height:540px;
  border-radius:34px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
  background:radial-gradient(circle at 50% 28%, rgba(115,170,255,.14), rgba(8,12,22,.92) 52%, rgba(5,8,15,.98) 100%);
  box-shadow:0 34px 88px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .85s var(--spx-vision-ease), box-shadow .5s ease;
}
.spx-visionDeckHalo,
.spx-visionDeckGrid{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.spx-visionDeckHalo{
  background:radial-gradient(circle at 38% 26%, rgba(130,173,255,.20), transparent 34%),
             radial-gradient(circle at 68% 70%, rgba(145,104,255,.16), transparent 34%);
  opacity:.95;
}
.spx-visionDeckGrid{
  inset:18px;
  border-radius:26px;
  background:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(circle at 50% 46%, rgba(0,0,0,.92), transparent 82%);
  opacity:.3;
}
.spx-visionDeckSpace{ position:absolute; inset:0; }
.spx-visionDeckVisualCard{
  position:absolute;
  left:24px;
  right:24px;
  bottom:24px;
  max-width:none;
  padding:18px 18px 16px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(10,15,27,.84), rgba(8,11,20,.96));
  border:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(12px);
  box-shadow:0 20px 48px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.04);
}
.spx-visionDeckVisualTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.spx-visionDeckPills{ display:flex; gap:8px; }
.spx-visionDeckPills span{
  width:8px; height:8px; border-radius:999px;
  background:rgba(255,255,255,.22);
  box-shadow:0 0 0 1px rgba(255,255,255,.04) inset;
  transition:transform .45s ease, background .35s ease, opacity .35s ease;
}
.spx-visionDeckShell[data-active-step="1"] .spx-visionDeckPills span:nth-child(1),
.spx-visionDeckShell[data-active-step="2"] .spx-visionDeckPills span:nth-child(2),
.spx-visionDeckShell[data-active-step="3"] .spx-visionDeckPills span:nth-child(3){
  background:rgba(161,208,255,.92);
  transform:scale(1.28);
}
.spx-visionDeckSteps{
  position:relative;
  padding-left:60px;
  padding-top:8px;
}
.spx-visionDeckProgress{
  left:16px;
  top:18px;
  bottom:42px;
}
.spx-visionDeckScene{
  min-height:64vh;
  position:relative;
}
.spx-visionDeckScene + .spx-visionDeckScene{
  margin-top:-26vh;
}
.spx-visionDeckCard{
  position:sticky;
  top:calc(var(--spx-topbar-height,88px) + 72px);
  width:min(100%, 640px);
  padding:26px 26px 24px;
  border-radius:30px;
  background:linear-gradient(180deg, rgba(10,14,24,.86), rgba(7,10,18,.98));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 80px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(14px);
  transform-origin:50% 0%;
  transition:transform .8s var(--spx-vision-ease), opacity .5s ease, box-shadow .45s ease, border-color .35s ease, filter .45s ease;
  will-change:transform, opacity;
}
.spx-visionDeckCardMeta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.spx-visionDeckTag{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(233,240,255,.78);
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.70rem;
  font-weight:700;
}
.spx-visionDeckCard .spx-whyStoryStepNo{
  width:52px;
  height:52px;
  flex:0 0 52px;
}
.spx-visionDeckCard h3{
  max-width:16ch;
  font-size:clamp(1.55rem,2.4vw,2.2rem);
  line-height:1.06;
  letter-spacing:-.03em;
}
.spx-visionDeckCard p{
  max-width:32ch;
  font-size:1.02rem;
  line-height:1.7;
}
.spx-visionDeckCard .spx-whyStoryStepNote{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
}
.spx-visionDeckCard .spx-whyStoryStepNote::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(161,208,255,.92);
  box-shadow:0 0 16px rgba(161,208,255,.45);
}
.spx-visionDeckCard.is-before{
  opacity:.38;
  transform:translate3d(0,-30px,0) scale(.92) rotate(-2deg);
  filter:saturate(.82);
}
.spx-visionDeckCard.is-active{
  opacity:1;
  transform:translate3d(0,0,0) scale(1) rotate(0deg);
  border-color:rgba(161,208,255,.15);
  box-shadow:0 36px 96px rgba(0,0,0,.30), 0 0 0 1px rgba(161,208,255,.05), inset 0 1px 0 rgba(255,255,255,.05);
}
.spx-visionDeckCard.is-after{
  opacity:.72;
  transform:translate3d(0,32px,0) scale(.965) rotate(1.4deg);
}
.spx-visionDeckCard[data-why-step="1"]{ z-index:4; }
.spx-visionDeckCard[data-why-step="2"]{ z-index:3; }
.spx-visionDeckCard[data-why-step="3"]{ z-index:2; }
.spx-visionDeckShell[data-active-step="1"] .spx-visionDeckCard[data-why-step="1"],
.spx-visionDeckShell[data-active-step="2"] .spx-visionDeckCard[data-why-step="2"],
.spx-visionDeckShell[data-active-step="3"] .spx-visionDeckCard[data-why-step="3"]{ z-index:7; }
.spx-visionDeckShell[data-active-step="1"] .spx-visionDeckVisual{ transform:translateY(0) scale(1); }
.spx-visionDeckShell[data-active-step="2"] .spx-visionDeckVisual{ transform:translateY(-8px) scale(1.015); }
.spx-visionDeckShell[data-active-step="3"] .spx-visionDeckVisual{ transform:translateY(8px) scale(.995); }
.spx-visionDeckShell[data-active-step="1"] .spx-whyStoryPlanetOne,
.spx-visionDeckShell[data-active-step="2"] .spx-whyStoryPlanetTwo,
.spx-visionDeckShell[data-active-step="3"] .spx-whyStoryPlanetThree{
  box-shadow:0 0 0 12px rgba(161,208,255,.06), 0 0 52px rgba(161,208,255,.24);
  transform:translateZ(0) scale(1.08);
}
.spx-visionDeckShell[data-active-step="1"] .spx-whyStoryMarkerOne,
.spx-visionDeckShell[data-active-step="2"] .spx-whyStoryMarkerTwo,
.spx-visionDeckShell[data-active-step="3"] .spx-whyStoryMarkerThree{
  opacity:1;
  transform:translateY(0) scale(1);
}
.spx-visionDeckVisual .spx-whyStoryMarker{
  opacity:.42;
  transition:transform .45s ease, opacity .35s ease, background .35s ease, border-color .35s ease;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionDeckVisual{
  background:radial-gradient(circle at 50% 30%, rgba(178,205,255,.34), rgba(237,242,251,.98) 52%, rgba(230,236,247,1) 100%);
  border-color:rgba(131,94,62,.10);
  box-shadow:0 28px 74px rgba(74,49,33,.10), inset 0 1px 0 rgba(255,255,255,.72);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionDeckVisualCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionDeckCard{
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(245,247,252,.99));
  border-color:rgba(129,89,58,.12);
  box-shadow:0 24px 62px rgba(74,49,33,.10);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionDeckTag{
  background:rgba(72,101,138,.06);
  border-color:rgba(72,101,138,.12);
  color:rgba(58,68,87,.78);
}
@media (max-width: 980px){
  .spx-visionDeckShell{ grid-template-columns:1fr; gap:22px; }
  .spx-visionDeckVisualRail{ position:relative; top:auto; }
  .spx-visionDeckVisual{ min-height:400px; }
  .spx-visionDeckSteps{ padding-left:0; padding-top:0; }
  .spx-visionDeckProgress{ display:none; }
  .spx-visionDeckScene,
  .spx-visionDeckScene + .spx-visionDeckScene{ min-height:auto; margin-top:0; }
  .spx-visionDeckCard{
    position:relative;
    top:auto;
    width:100%;
    transform:none !important;
    opacity:1 !important;
    margin-bottom:14px;
  }
}

/* === PASS92: Our vision wide story bands === */
.spx-visionWide{
  --spx-vision-ease:cubic-bezier(.2,.82,.18,1);
  position:relative;
}
.spx-visionWideHead{
  max-width:760px;
  margin-bottom:24px;
}
.spx-visionWideHead h2{
  margin-bottom:12px;
}
.spx-visionWideHead p{
  max-width:620px;
}
.spx-visionWideShell{
  position:relative;
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding:0 0 12vh;
  --spx-vision-progress:0;
}
.spx-visionWideProgress{
  position:sticky;
  top:calc(var(--spx-header-height, 84px) + 18px);
  z-index:6;
  width:min(1240px, calc(100vw - 48px));
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  pointer-events:none;
}
.spx-visionWideProgressLine{
  position:relative;
  flex:1;
  height:2px;
  margin-right:18px;
  border-radius:999px;
  background:rgba(255,255,255,.09);
  overflow:hidden;
}
.spx-visionWideProgressLine i{
  position:absolute;
  inset:0 auto 0 0;
  width:calc(var(--spx-vision-progress, 0) * 100%);
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(111,245,255,.78), rgba(177,122,255,.82));
}
.spx-visionWideProgressPills{
  display:flex;
  gap:8px;
}
.spx-visionWideProgressPills b{
  width:36px;
  height:7px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
  transition:transform .35s ease, opacity .35s ease, background .35s ease;
  opacity:.55;
}
.spx-visionWideShell[data-active-step="1"] [data-vision-pill="1"],
.spx-visionWideShell[data-active-step="2"] [data-vision-pill="2"],
.spx-visionWideShell[data-active-step="3"] [data-vision-pill="3"]{
  background:linear-gradient(90deg, rgba(111,245,255,.9), rgba(177,122,255,.95));
  transform:scaleX(1.08);
  opacity:1;
}
.spx-visionWideScene{
  position:relative;
  min-height:88vh;
}
.spx-visionWideScene + .spx-visionWideScene{
  margin-top:-14vh;
}
.spx-visionWideBand{
  position:sticky;
  top:calc(var(--spx-header-height, 84px) + 62px);
  width:min(1240px, calc(100vw - 48px));
  min-height:560px;
  margin:0 auto;
  overflow:hidden;
  border-radius:32px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(8,12,24,.88);
  box-shadow:0 26px 80px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
  isolation:isolate;
  transform:translateY(110px) scale(.965);
  opacity:.54;
  filter:saturate(.88);
  transition:filter .32s ease, box-shadow .35s ease, border-color .28s ease;
  will-change:transform, opacity;
}
.spx-visionWideBand.is-before{
  transform:translateY(-44px) scale(.96);
  opacity:.34;
  filter:saturate(.82);
}
.spx-visionWideBand.is-active{
  transform:translateY(0) scale(1);
  opacity:1;
  filter:none;
  border-color:rgba(111,245,255,.18);
  box-shadow:0 34px 110px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.09), 0 0 0 1px rgba(111,245,255,.06);
}
.spx-visionWideBand.is-after{
  transform:translateY(104px) scale(.972);
  opacity:.58;
}
.spx-visionWideBandBg,
.spx-visionWideBandGrid{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.spx-visionWideBandBg{
  background:
    radial-gradient(circle at 15% 20%, rgba(115,228,255,.18), transparent 32%),
    radial-gradient(circle at 80% 30%, rgba(177,122,255,.18), transparent 30%),
    linear-gradient(135deg, rgba(11,18,33,.98), rgba(9,12,24,.92));
}
.spx-visionWideBandGrid{
  background-image:linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.88), rgba(0,0,0,.26));
  opacity:.55;
}
.spx-visionWideInner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(360px, .9fr);
  gap:clamp(26px, 4vw, 54px);
  align-items:center;
  min-height:560px;
  padding:clamp(30px, 4vw, 54px);
}
.spx-visionWideCopy{
  max-width:670px;
}
.spx-visionWideMeta{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:18px;
}
.spx-visionWideNo{
  display:inline-grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:14px;
  font-size:.92rem;
  font-weight:700;
  color:#ecf7ff;
  background:linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.03));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
}
.spx-visionWideKicker{
  font-size:.88rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(208,225,255,.74);
}
.spx-visionWideCopy h3{
  margin:0 0 14px;
  font-size:clamp(2rem, 3vw, 3.2rem);
  line-height:1.05;
  max-width:12ch;
}
.spx-visionWideCopy p{
  margin:0;
  max-width:560px;
  font-size:clamp(1rem, 1.18vw, 1.12rem);
  line-height:1.75;
  color:rgba(220,230,247,.78);
}
.spx-visionWideChips{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}
.spx-visionWideChips span{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:rgba(240,246,255,.86);
  font-size:.92rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.spx-visionWideVisual{
  position:relative;
  min-height:420px;
  border-radius:26px;
  overflow:hidden;
  background:
    radial-gradient(circle at 30% 35%, rgba(111,245,255,.16), transparent 26%),
    radial-gradient(circle at 72% 24%, rgba(177,122,255,.18), transparent 28%),
    linear-gradient(160deg, rgba(9,13,26,.82), rgba(10,11,22,.62));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.spx-visionWideVisual::before{
  content:"";
  position:absolute;
  inset:10% 12% auto auto;
  width:180px;
  height:180px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(111,245,255,.20), transparent 70%);
  filter:blur(10px);
  opacity:.85;
}
.spx-visionWideOrbit{
  position:absolute;
  inset:50% auto auto 50%;
  width:300px;
  height:300px;
  margin:-150px 0 0 -150px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 0 0 28px rgba(255,255,255,.02), 0 0 0 64px rgba(255,255,255,.015);
}
.spx-visionWideCore{
  position:absolute;
  inset:50% auto auto 50%;
  width:84px;
  height:84px;
  margin:-42px 0 0 -42px;
  border-radius:999px;
  background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.98), rgba(111,245,255,.86) 48%, rgba(87,115,255,.24) 76%, transparent 100%);
  box-shadow:0 0 28px rgba(111,245,255,.30), 0 0 90px rgba(111,245,255,.14);
}
.spx-visionWideTag{
  position:absolute;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(8,11,20,.72);
  color:rgba(236,245,255,.88);
  font-size:.84rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.spx-visionWideTagOne{ top:18%; right:12%; }
.spx-visionWideTagTwo{ bottom:18%; left:11%; }
.spx-visionWideMiniCard{
  position:absolute;
  right:24px;
  bottom:24px;
  width:min(300px, calc(100% - 48px));
  padding:18px 18px 16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(180deg, rgba(13,18,34,.88), rgba(10,13,23,.82));
  box-shadow:0 24px 56px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06);
}
.spx-visionWideMiniCard small{
  display:block;
  margin-bottom:8px;
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(206,223,255,.62);
}
.spx-visionWideMiniCard strong{
  display:block;
  font-size:1.08rem;
  line-height:1.35;
  color:#f5fbff;
}
.spx-visionWideMiniCard p{
  margin:10px 0 0;
  font-size:.94rem;
  line-height:1.65;
  color:rgba(222,232,247,.73);
}
.spx-visionWideShell[data-active-step="1"] .spx-visionWideBand[data-vision-step="1"],
.spx-visionWideShell[data-active-step="2"] .spx-visionWideBand[data-vision-step="2"],
.spx-visionWideShell[data-active-step="3"] .spx-visionWideBand[data-vision-step="3"]{
  z-index:4;
}
.spx-visionWideShell[data-active-step="1"] .spx-visionWideBand[data-vision-step="1"] .spx-visionWideVisual{ transform:translateY(0) scale(1); }
.spx-visionWideShell[data-active-step="2"] .spx-visionWideBand[data-vision-step="2"] .spx-visionWideVisual{ transform:translateY(-6px) scale(1.02); }
.spx-visionWideShell[data-active-step="3"] .spx-visionWideBand[data-vision-step="3"] .spx-visionWideVisual{ transform:translateY(4px) scale(1.01); }
.spx-visionWideVisual{
  transition:transform .85s var(--spx-vision-ease), box-shadow .45s ease, opacity .45s ease;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{
  background:rgba(248,251,255,.92);
  border-color:rgba(25,45,88,.10);
  box-shadow:0 26px 80px rgba(26,52,110,.12), inset 0 1px 0 rgba(255,255,255,.66);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{
  background:
    radial-gradient(circle at 15% 20%, rgba(111,245,255,.18), transparent 32%),
    radial-gradient(circle at 80% 30%, rgba(177,122,255,.16), transparent 30%),
    linear-gradient(135deg, rgba(246,250,255,.98), rgba(240,244,252,.94));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy p,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard p{
  color:rgba(28,46,72,.74);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideKicker,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard small{
  color:rgba(54,78,122,.66);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideChips span,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{
  background:rgba(255,255,255,.74);
  border-color:rgba(37,57,94,.12);
  box-shadow:0 18px 42px rgba(32,58,108,.08), inset 0 1px 0 rgba(255,255,255,.7);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual{
  background:
    radial-gradient(circle at 30% 35%, rgba(111,245,255,.14), transparent 26%),
    radial-gradient(circle at 72% 24%, rgba(177,122,255,.12), transparent 28%),
    linear-gradient(160deg, rgba(244,248,255,.95), rgba(238,244,252,.92));
}
@media (max-width: 1100px){
  .spx-visionWideScene{ min-height:82vh; }
  .spx-visionWideBand{ min-height:520px; }
  .spx-visionWideInner{ grid-template-columns:1fr; min-height:auto; }
  .spx-visionWideVisual{ min-height:340px; }
}
@media (max-width: 780px){
  .spx-visionWideShell{
    width:100%;
    margin-left:0;
    padding-bottom:32px;
  }
  .spx-visionWideProgress{
    position:relative;
    top:auto;
    width:100%;
    padding-inline:4px;
    margin-bottom:12px;
  }
  .spx-visionWideScene,
  .spx-visionWideScene + .spx-visionWideScene{
    min-height:auto;
    margin-top:18px;
  }
  .spx-visionWideBand{
    position:relative;
    top:auto;
    width:100%;
    min-height:auto;
    border-radius:24px;
    transform:none !important;
    opacity:1 !important;
    filter:none !important;
  }
  .spx-visionWideInner{ padding:22px; gap:18px; }
  .spx-visionWideCopy h3{ max-width:none; }
  .spx-visionWideVisual{ min-height:300px; }
}


/* === PASS93: Vision story copy + muted palette === */
body.spx-prealpha .spx-visionWideHead{max-width:820px;margin-bottom:30px;}
body.spx-prealpha .spx-visionWideHead h2{max-width:14ch;letter-spacing:-.03em;}
body.spx-prealpha .spx-visionWideHead p{max-width:720px;font-size:clamp(1.02rem,1.24vw,1.16rem);line-height:1.72;color:rgba(214,225,243,.76);}
body.spx-prealpha .spx-visionWideProgress{display:none;}
body.spx-prealpha .spx-visionWideShell{padding-top:8px;}
body.spx-prealpha .spx-visionWideBand{border-color:rgba(148,169,208,.12);background:rgba(10,15,27,.92);box-shadow:0 28px 80px rgba(3,6,14,.32), inset 0 1px 0 rgba(255,255,255,.06);}
body.spx-prealpha .spx-visionWideBand.is-active{border-color:rgba(132,165,225,.20);box-shadow:0 34px 96px rgba(4,8,18,.36), inset 0 1px 0 rgba(255,255,255,.07), 0 0 0 1px rgba(120,152,218,.08);}
body.spx-prealpha .spx-visionWideBandBg{background:radial-gradient(circle at 18% 18%, rgba(93,133,214,.18), transparent 34%), radial-gradient(circle at 78% 22%, rgba(123,152,224,.11), transparent 32%), linear-gradient(135deg, rgba(10,15,27,.98), rgba(8,12,22,.94));}
body.spx-prealpha .spx-visionWideBandGrid{opacity:.28;background-image:linear-gradient(rgba(152,171,211,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(152,171,211,.06) 1px, transparent 1px);}
body.spx-prealpha .spx-visionWideNo{background:linear-gradient(135deg, rgba(121,147,205,.18), rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.08);}
body.spx-prealpha .spx-visionWideKicker{color:rgba(196,209,233,.70);}
body.spx-prealpha .spx-visionWideCopy h3{max-width:13ch;}
body.spx-prealpha .spx-visionWideChips span{background:rgba(255,255,255,.03);border-color:rgba(148,169,208,.12);color:rgba(234,241,251,.85);}
body.spx-prealpha .spx-visionWideVisual{background:radial-gradient(circle at 34% 34%, rgba(94,133,213,.15), transparent 28%), radial-gradient(circle at 74% 24%, rgba(137,160,221,.10), transparent 28%), linear-gradient(160deg, rgba(12,18,31,.88), rgba(10,13,24,.78));border-color:rgba(149,170,208,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);}
body.spx-prealpha .spx-visionWideVisual::before{background:radial-gradient(circle, rgba(108,146,220,.18), transparent 72%);filter:blur(14px);opacity:.62;}
body.spx-prealpha .spx-visionWideOrbit{border-color:rgba(147,166,205,.12);box-shadow:0 0 0 24px rgba(255,255,255,.015), 0 0 0 56px rgba(255,255,255,.01);}
body.spx-prealpha .spx-visionWideCore{background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.96), rgba(141,175,241,.80) 46%, rgba(97,126,196,.20) 76%, transparent 100%);box-shadow:0 0 22px rgba(110,147,220,.20), 0 0 70px rgba(110,147,220,.10);}
body.spx-prealpha .spx-visionWideTag{background:rgba(11,16,29,.72);border-color:rgba(149,170,208,.12);color:rgba(234,241,251,.84);}
body.spx-prealpha .spx-visionWideMiniCard{background:linear-gradient(180deg, rgba(13,19,34,.86), rgba(10,13,24,.78));border-color:rgba(149,170,208,.12);box-shadow:0 22px 56px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05);}
body.spx-prealpha .spx-visionWideMiniCard small{color:rgba(188,203,230,.60);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideHead p{color:rgba(43,61,92,.74);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{background:rgba(247,250,255,.94);border-color:rgba(46,67,110,.10);box-shadow:0 26px 72px rgba(30,53,103,.10), inset 0 1px 0 rgba(255,255,255,.72);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-active{border-color:rgba(85,116,183,.18);box-shadow:0 30px 80px rgba(33,58,108,.12), inset 0 1px 0 rgba(255,255,255,.76), 0 0 0 1px rgba(105,132,194,.08);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{background:radial-gradient(circle at 18% 18%, rgba(97,136,210,.10), transparent 34%), radial-gradient(circle at 78% 22%, rgba(137,160,221,.08), transparent 30%), linear-gradient(135deg, rgba(247,250,255,.98), rgba(241,245,252,.95));}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandGrid{opacity:.2;background-image:linear-gradient(rgba(89,112,156,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(89,112,156,.06) 1px, transparent 1px);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual, html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard, html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideChips span, html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{background:rgba(255,255,255,.78);border-color:rgba(62,84,125,.12);box-shadow:0 18px 42px rgba(31,56,102,.08), inset 0 1px 0 rgba(255,255,255,.74);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual{background:radial-gradient(circle at 34% 34%, rgba(97,136,210,.10), transparent 28%), radial-gradient(circle at 74% 24%, rgba(137,160,221,.08), transparent 28%), linear-gradient(160deg, rgba(251,253,255,.92), rgba(243,247,252,.86));}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{color:rgba(35,52,82,.78);}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard small, html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideKicker{color:rgba(74,96,137,.62);}


/* === PASS94: Vision cards truly stack + light mode palette align === */
body.spx-prealpha .spx-visionWideHead{
  max-width: 860px;
}
body.spx-prealpha .spx-visionWideHead h2{
  max-width: 16ch;
}
body.spx-prealpha .spx-visionWideHead p{
  max-width: 760px;
}
body.spx-prealpha .spx-visionWideShell{
  padding-top: 10px;
  padding-bottom: 14vh;
}
body.spx-prealpha .spx-visionWideScene{
  min-height: 72vh;
}
body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
  margin-top: -34vh;
}
body.spx-prealpha .spx-visionWideBand{
  top: calc(var(--spx-header-height, 84px) + 72px);
  min-height: 540px;
  transform: translateY(78px) scale(.982);
  opacity: .76;
  filter: saturate(.93);
  border-color: rgba(148,169,208,.13);
  box-shadow: 0 26px 80px rgba(3,6,14,.26), inset 0 1px 0 rgba(255,255,255,.06);
}
body.spx-prealpha .spx-visionWideBand.is-before{
  transform: translateY(-18px) scale(.974);
  opacity: .70;
  filter: saturate(.9);
}
body.spx-prealpha .spx-visionWideBand.is-active{
  transform: translateY(0) scale(1);
  opacity: 1;
  filter: none;
}
body.spx-prealpha .spx-visionWideBand.is-after{
  transform: translateY(84px) scale(.986);
  opacity: .74;
}
body.spx-prealpha .spx-visionWideBand[data-vision-step="1"]{ z-index: 1; }
body.spx-prealpha .spx-visionWideBand[data-vision-step="2"]{ z-index: 2; }
body.spx-prealpha .spx-visionWideBand[data-vision-step="3"]{ z-index: 3; }
body.spx-prealpha .spx-visionWideBand.is-active{ z-index: 6 !important; }
body.spx-prealpha .spx-visionWideBand.is-before,
body.spx-prealpha .spx-visionWideBand.is-after{
  box-shadow: 0 18px 54px rgba(3,6,14,.16), inset 0 1px 0 rgba(255,255,255,.04);
}
body.spx-prealpha .spx-visionWideBandBg{
  background:
    radial-gradient(circle at 16% 18%, rgba(94,133,213,.16), transparent 34%),
    radial-gradient(circle at 82% 24%, rgba(128,153,214,.11), transparent 32%),
    linear-gradient(135deg, rgba(10,15,27,.98), rgba(8,12,22,.94));
}
body.spx-prealpha .spx-visionWideVisual{
  background:
    radial-gradient(circle at 34% 34%, rgba(94,133,213,.14), transparent 28%),
    radial-gradient(circle at 74% 24%, rgba(137,160,221,.09), transparent 28%),
    linear-gradient(160deg, rgba(12,18,31,.88), rgba(10,13,24,.78));
}
body.spx-prealpha .spx-visionWideMiniCard{
  background: linear-gradient(180deg, rgba(13,19,34,.84), rgba(10,13,24,.78));
}

html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideHead p{
  color: rgba(58,76,109,.74);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{
  background: linear-gradient(180deg, rgba(248,250,253,.94), rgba(242,246,251,.92));
  border-color: rgba(94,116,152,.11);
  box-shadow: 0 24px 68px rgba(28,52,97,.10), inset 0 1px 0 rgba(255,255,255,.74);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-before,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-after{
  box-shadow: 0 16px 42px rgba(32,58,108,.07), inset 0 1px 0 rgba(255,255,255,.70);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-active{
  border-color: rgba(100,123,160,.16);
  box-shadow: 0 28px 72px rgba(33,58,108,.11), inset 0 1px 0 rgba(255,255,255,.78), 0 0 0 1px rgba(117,141,181,.07);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{
  background:
    radial-gradient(circle at 16% 18%, rgba(154,175,208,.12), transparent 34%),
    radial-gradient(circle at 82% 24%, rgba(184,198,223,.10), transparent 30%),
    linear-gradient(135deg, rgba(249,251,254,.98), rgba(242,246,251,.95));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandGrid{
  opacity: .18;
  background-image:
    linear-gradient(rgba(102,121,155,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(102,121,155,.045) 1px, transparent 1px);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideNo{
  background: linear-gradient(135deg, rgba(118,140,177,.10), rgba(255,255,255,.7));
  color: rgba(44,61,90,.78);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideKicker,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard small{
  color: rgba(90,108,141,.68);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy h3,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard strong{
  color: rgba(20,34,58,.94);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy p,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard p{
  color: rgba(58,76,109,.74);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual{
  background:
    radial-gradient(circle at 32% 34%, rgba(154,175,208,.16), transparent 28%),
    radial-gradient(circle at 72% 24%, rgba(184,198,223,.12), transparent 28%),
    linear-gradient(160deg, rgba(244,247,252,.96), rgba(236,241,248,.92));
  border-color: rgba(94,116,152,.10);
  box-shadow: 0 16px 36px rgba(34,58,102,.06), inset 0 1px 0 rgba(255,255,255,.72);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual::before{
  background: radial-gradient(circle, rgba(164,182,214,.20), transparent 72%);
  opacity: .48;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideOrbit{
  border-color: rgba(111,130,162,.10);
  box-shadow: 0 0 0 24px rgba(122,143,176,.035), 0 0 0 56px rgba(122,143,176,.02);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCore{
  background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.98), rgba(167,184,214,.72) 46%, rgba(120,142,178,.16) 76%, transparent 100%);
  box-shadow: 0 0 18px rgba(126,148,186,.12), 0 0 52px rgba(126,148,186,.06);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideChips span,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{
  background: rgba(250,252,255,.82);
  border-color: rgba(94,116,152,.10);
  box-shadow: 0 10px 24px rgba(33,58,108,.05), inset 0 1px 0 rgba(255,255,255,.75);
  color: rgba(43,60,90,.82);
}

@media (max-width: 1100px){
  body.spx-prealpha .spx-visionWideScene{
    min-height: 78vh;
  }
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    margin-top: -24vh;
  }
}
@media (max-width: 780px){
  body.spx-prealpha .spx-visionWideScene,
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    min-height: auto;
    margin-top: 18px;
  }
}

/* === PASS95: Vision light-mode palette aligned with landing === */
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideHead p{
  color:rgba(74,47,31,.82);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{
  background:linear-gradient(180deg, rgba(255,249,243,.90), rgba(246,236,227,.96));
  border-color:rgba(124,79,49,.11);
  box-shadow:0 18px 48px rgba(171,114,65,.10), inset 0 1px 0 rgba(255,255,255,.62);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-active{
  border-color:rgba(124,79,49,.16);
  box-shadow:0 24px 58px rgba(171,114,65,.12), inset 0 1px 0 rgba(255,255,255,.68), 0 0 0 1px rgba(124,79,49,.06);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{
  background:
    radial-gradient(circle at 16% 20%, rgba(255,178,115,.14), transparent 33%),
    radial-gradient(circle at 82% 24%, rgba(214,112,75,.10), transparent 30%),
    linear-gradient(135deg, rgba(255,249,243,.98), rgba(246,236,227,.95));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandGrid{
  opacity:.16;
  background-image:
    linear-gradient(rgba(124,79,49,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,79,49,.05) 1px, transparent 1px);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideNo{
  color:#6c3f26;
  background:linear-gradient(180deg, rgba(255,157,87,.16), rgba(255,231,214,.62));
  border-color:rgba(124,79,49,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideKicker,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard small{
  color:rgba(91,52,31,.72);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy h3,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard strong{
  color:#2f2217;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy p,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard p{
  color:rgba(74,47,31,.82);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideChips span,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{
  background:linear-gradient(180deg, rgba(255,252,249,.82), rgba(250,242,234,.90));
  border-color:rgba(124,79,49,.10);
  box-shadow:0 14px 36px rgba(171,114,65,.08), inset 0 1px 0 rgba(255,255,255,.72);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual{
  background:
    radial-gradient(circle at 30% 32%, rgba(255,178,115,.12), transparent 26%),
    radial-gradient(circle at 72% 24%, rgba(214,112,75,.08), transparent 26%),
    linear-gradient(160deg, rgba(255,252,249,.90), rgba(248,240,232,.94));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual::before{
  background:radial-gradient(circle, rgba(255,190,136,.18), transparent 72%);
  filter:blur(12px);
  opacity:.48;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideOrbit{
  border-color:rgba(124,79,49,.08);
  box-shadow:0 0 0 24px rgba(214,112,75,.03), 0 0 0 56px rgba(255,157,87,.025);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCore{
  background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.98), rgba(255,210,170,.84) 46%, rgba(255,157,87,.26) 76%, transparent 100%);
  box-shadow:0 0 24px rgba(255,157,87,.18), 0 0 72px rgba(255,190,136,.08);
}


/* === PASS96: Vision cards emerge from nothing + copy refine === */
.spx-visionWideProgress{
  display:none;
}
.spx-visionWideHead h2{
  max-width:16ch;
}
.spx-visionWideHead p{
  max-width:34ch;
}
.spx-visionWideScene{
  min-height:84vh;
}
.spx-visionWideScene + .spx-visionWideScene{
  margin-top:-28vh;
}
.spx-visionWideBand{
  opacity:0;
  transform:translateY(128px) scale(.94);
  filter:saturate(.82) blur(0px);
}
.spx-visionWideBand.is-before{
  opacity:.72;
  transform:translateY(-26px) scale(.972);
  filter:saturate(.94);
}
.spx-visionWideBand.is-active{
  opacity:1;
  transform:translateY(0) scale(1);
}
.spx-visionWideBand.is-after{
  opacity:0;
  transform:translateY(130px) scale(.94);
  filter:saturate(.82);
  pointer-events:none;
}
.spx-visionWideShell[data-active-step="1"] .spx-visionWideBand[data-vision-step="1"]{ z-index:4; }
.spx-visionWideShell[data-active-step="2"] .spx-visionWideBand[data-vision-step="1"]{ z-index:2; }
.spx-visionWideShell[data-active-step="2"] .spx-visionWideBand[data-vision-step="2"]{ z-index:4; }
.spx-visionWideShell[data-active-step="3"] .spx-visionWideBand[data-vision-step="1"]{ z-index:1; }
.spx-visionWideShell[data-active-step="3"] .spx-visionWideBand[data-vision-step="2"]{ z-index:2; }
.spx-visionWideShell[data-active-step="3"] .spx-visionWideBand[data-vision-step="3"]{ z-index:4; }
.spx-visionWideCopy h3{
  max-width:11ch;
}
.spx-visionWideCopy p{
  max-width:48ch;
}
.spx-visionWideMiniCard strong{
  font-size:1.04rem;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{
  background:linear-gradient(180deg, rgba(255,250,243,.96), rgba(247,241,232,.94));
  border-color:rgba(130,102,61,.12);
  box-shadow:0 26px 80px rgba(155,124,81,.10), inset 0 1px 0 rgba(255,255,255,.82);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{
  background:
    radial-gradient(circle at 16% 18%, rgba(255,213,145,.20), transparent 34%),
    radial-gradient(circle at 82% 26%, rgba(177,192,255,.16), transparent 30%),
    linear-gradient(135deg, rgba(255,252,247,.98), rgba(247,242,235,.96));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandGrid{
  opacity:.34;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideNo{
  color:#3b2a18;
  background:linear-gradient(135deg, rgba(255,255,255,.84), rgba(247,235,216,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 10px 26px rgba(162,126,73,.10);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideKicker{
  color:rgba(113,77,34,.74);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy h3,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard strong{
  color:#2f2113;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideCopy p,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard p{
  color:rgba(80,61,41,.78);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideChips span,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{
  border-color:rgba(143,110,70,.12);
  background:rgba(255,250,243,.82);
  color:#5b442a;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual{
  background:
    radial-gradient(circle at 30% 35%, rgba(255,215,153,.22), transparent 26%),
    radial-gradient(circle at 72% 24%, rgba(178,193,255,.20), transparent 28%),
    linear-gradient(160deg, rgba(255,248,239,.95), rgba(246,238,226,.90));
  border-color:rgba(143,110,70,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard{
  background:linear-gradient(180deg, rgba(255,252,247,.95), rgba(248,241,231,.93));
  border-color:rgba(143,110,70,.11);
  box-shadow:0 24px 56px rgba(162,126,73,.10), inset 0 1px 0 rgba(255,255,255,.88);
}
@media (max-width: 980px){
  .spx-visionWideScene + .spx-visionWideScene{ margin-top:-16vh; }
  .spx-visionWideBand,
  .spx-visionWideBand.is-before,
  .spx-visionWideBand.is-active,
  .spx-visionWideBand.is-after{
    transform:none;
    opacity:1;
  }
}

/* === PASS97: Vision cards land on the exact same spot === */
body.spx-prealpha .spx-visionWideHead{
  max-width:900px;
  margin-bottom:28px;
}
body.spx-prealpha .spx-visionWideHead h2{
  max-width:17ch;
}
body.spx-prealpha .spx-visionWideHead p{
  max-width:60ch;
  color:rgba(214,225,243,.78);
}
body.spx-prealpha .spx-visionWideShell{
  padding-top:12px;
  padding-bottom:16vh;
}
body.spx-prealpha .spx-visionWideScene{
  min-height:78vh;
}
body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
  margin-top:-56vh;
}
body.spx-prealpha .spx-visionWideBand{
  top:calc(var(--spx-header-height, 84px) + 68px);
  min-height:560px;
  transform:translateY(140px) scale(1);
  opacity:0;
  filter:none;
  transition:transform .9s var(--spx-vision-ease), opacity .4s ease, box-shadow .42s ease, border-color .35s ease;
}
body.spx-prealpha .spx-visionWideBand.is-before{
  transform:translateY(0) scale(1);
  opacity:1;
  filter:none;
}
body.spx-prealpha .spx-visionWideBand.is-active{
  transform:translateY(0) scale(1);
  opacity:1;
  filter:none;
}
body.spx-prealpha .spx-visionWideBand.is-after{
  transform:translateY(150px) scale(1);
  opacity:0;
  filter:none;
  pointer-events:none;
}
body.spx-prealpha .spx-visionWideBand[data-vision-step="1"]{ z-index:1; }
body.spx-prealpha .spx-visionWideBand[data-vision-step="2"]{ z-index:2; }
body.spx-prealpha .spx-visionWideBand[data-vision-step="3"]{ z-index:3; }
body.spx-prealpha .spx-visionWideBand.is-active{ z-index:8 !important; }
body.spx-prealpha .spx-visionWideBand.is-before,
body.spx-prealpha .spx-visionWideBand.is-active{
  box-shadow:0 26px 82px rgba(3,6,14,.24), inset 0 1px 0 rgba(255,255,255,.06);
}
body.spx-prealpha .spx-visionWideCopy h3{
  max-width:12ch;
}
body.spx-prealpha .spx-visionWideCopy p{
  max-width:50ch;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideHead p{
  color:rgba(78,58,38,.82);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{
  background:linear-gradient(180deg, rgba(255,251,246,.98), rgba(247,239,229,.96));
  border-color:rgba(132,96,60,.12);
  box-shadow:0 24px 72px rgba(169,123,73,.10), inset 0 1px 0 rgba(255,255,255,.84);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-before,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-active{
  box-shadow:0 24px 72px rgba(169,123,73,.10), inset 0 1px 0 rgba(255,255,255,.84);
}
@media (max-width: 980px){
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    margin-top:-18vh;
  }
}


/* === PASS98: Vision cards never show stacked above each other === */
body.spx-prealpha .spx-visionWideShell{
  overflow: clip;
}
body.spx-prealpha .spx-visionWideBand{
  transform: translateY(160px) scale(1);
  opacity: 0;
  visibility: hidden;
}
body.spx-prealpha .spx-visionWideBand.is-before{
  transform: translateY(0) scale(1);
  opacity: 0;
  visibility: hidden;
  box-shadow: none;
  pointer-events: none;
}
body.spx-prealpha .spx-visionWideBand.is-active{
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
body.spx-prealpha .spx-visionWideBand.is-after{
  transform: translateY(160px) scale(1);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  box-shadow: none;
}
body.spx-prealpha .spx-visionWideBand[data-vision-step="1"],
body.spx-prealpha .spx-visionWideBand[data-vision-step="2"],
body.spx-prealpha .spx-visionWideBand[data-vision-step="3"]{
  z-index: 1;
}
body.spx-prealpha .spx-visionWideBand.is-active{
  z-index: 8 !important;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-before,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-after{
  box-shadow: none;
}
@media (max-width: 980px){
  body.spx-prealpha .spx-visionWideBand,
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-active,
  body.spx-prealpha .spx-visionWideBand.is-after{
    visibility: visible;
  }
}

/* === PASS99: Vision cards slide over each other on the exact same spot === */
body.spx-prealpha .spx-visionWideShell{
  overflow: clip;
}
body.spx-prealpha .spx-visionWideBand{
  transform: translateY(160px) scale(1);
  opacity: 0;
  visibility: visible;
  will-change: transform, opacity;
}
body.spx-prealpha .spx-visionWideBand.is-active{
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
  z-index: 8 !important;
  pointer-events: auto;
}
body.spx-prealpha .spx-visionWideBand.is-before{
  transform: translateY(0) scale(1);
  opacity: 0;
  visibility: visible;
  z-index: 7 !important;
  pointer-events: none;
  transition:
    transform .72s var(--spx-vision-ease),
    opacity .28s ease .18s,
    box-shadow .28s ease,
    border-color .28s ease;
}
body.spx-prealpha .spx-visionWideBand.is-after{
  transform: translateY(160px) scale(1);
  opacity: 0;
  visibility: visible;
  z-index: 1 !important;
  pointer-events: none;
}
body.spx-prealpha .spx-visionWideBand[data-vision-step="1"],
body.spx-prealpha .spx-visionWideBand[data-vision-step="2"],
body.spx-prealpha .spx-visionWideBand[data-vision-step="3"]{
  inset: auto 0 0 0;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand.is-before,
html[data-spx-theme="dark"] body.spx-prealpha .spx-visionWideBand.is-before{
  box-shadow: none;
}
@media (max-width: 980px){
  body.spx-prealpha .spx-visionWideBand,
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-active,
  body.spx-prealpha .spx-visionWideBand.is-after{
    visibility: visible;
    opacity: 1;
    transform: none;
    z-index: auto !important;
  }
}

/* pass103: true same-position vision overlap */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    position:relative;
    overflow:clip;
    padding-bottom:18vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    position:sticky;
    top:calc(var(--spx-header-height, 84px) + 62px);
    z-index:5;
    width:min(1240px, calc(100vw - 48px));
    min-height:560px;
    height:min(560px, calc(100vh - var(--spx-header-height, 84px) - 96px));
    margin:0 auto;
    overflow:clip;
    isolation:isolate;
    pointer-events:none;
  }
  body.spx-prealpha .spx-visionWideScene{
    position:relative;
    min-height:78vh;
  }
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    margin-top:0;
  }
  body.spx-prealpha .spx-visionWideBand{
    position:absolute;
    inset:0;
    width:100%;
    min-height:100%;
    margin:0;
    transform:translate3d(0, 168px, 0);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:transform .18s linear, opacity .18s linear, visibility 0s linear .18s;
  }
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-active{
    transform:translate3d(0, 0, 0);
    opacity:1;
    visibility:visible;
    transition:transform .18s linear, opacity .18s linear, visibility 0s;
  }
  body.spx-prealpha .spx-visionWideBand.is-after{
    visibility:hidden;
  }
  body.spx-prealpha .spx-visionWideBandBg{
    background:
      radial-gradient(circle at 15% 20%, rgba(115,228,255,.14), transparent 32%),
      radial-gradient(circle at 80% 30%, rgba(177,122,255,.14), transparent 30%),
      linear-gradient(135deg, rgba(11,18,33,.995), rgba(9,12,24,.985));
  }
  html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{
    background:
      radial-gradient(circle at 18% 18%, rgba(97,136,210,.08), transparent 34%),
      radial-gradient(circle at 78% 22%, rgba(137,160,221,.06), transparent 30%),
      linear-gradient(135deg, rgba(248,250,255,.995), rgba(243,246,252,.99));
  }
}


/* === PASS104: Vision cards truly slide over each other on one shared slot === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    overflow:visible;
    padding-bottom:22vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    position:sticky;
    top:calc(var(--spx-header-height, 84px) + 62px);
    z-index:6;
    width:min(1240px, calc(100vw - 48px));
    height:min(560px, calc(100vh - var(--spx-header-height, 84px) - 96px));
    min-height:560px;
    margin:0 auto;
    overflow:visible;
    isolation:isolate;
    pointer-events:none;
  }
  body.spx-prealpha .spx-visionWideScene{
    position:relative;
    min-height:88vh;
  }
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    margin-top:0;
  }
  body.spx-prealpha .spx-visionWideBand{
    position:absolute;
    inset:0;
    width:100%;
    min-height:100%;
    margin:0;
    transform:translate3d(0, 188px, 0);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    will-change:transform, opacity;
    transition:transform .22s linear, opacity .22s linear, visibility 0s linear .22s;
  }
  body.spx-prealpha .spx-visionWideBand.is-before{
    transform:translate3d(0, 0, 0);
    opacity:1;
    visibility:visible;
    pointer-events:none;
    transition:transform .22s linear, opacity .18s linear, visibility 0s;
  }
  body.spx-prealpha .spx-visionWideBand.is-active{
    transform:translate3d(0, 0, 0);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:transform .22s linear, opacity .18s linear, visibility 0s;
  }
  body.spx-prealpha .spx-visionWideBand.is-after{
    transform:translate3d(0, 188px, 0);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
  }
  body.spx-prealpha .spx-visionWideBand.is-before .spx-visionWideBandGrid,
  body.spx-prealpha .spx-visionWideBand.is-before .spx-visionWideVisual{
    opacity:.98;
  }
}

/* === PASS105: Vision single-card smooth stage === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    overflow:visible;
    padding-bottom:18vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    position:sticky;
    top:calc(var(--spx-header-height, 84px) + 62px);
    z-index:6;
    width:min(1240px, calc(100vw - 48px));
    height:min(560px, calc(100vh - var(--spx-header-height, 84px) - 96px));
    min-height:560px;
    margin:0 auto;
    overflow:clip;
    isolation:isolate;
    pointer-events:none;
  }
  body.spx-prealpha .spx-visionWideScene{
    position:relative;
    min-height:72vh;
  }
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{ margin-top:0; }
  body.spx-prealpha .spx-visionWideBand{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    min-height:100%;
    margin:0;
    visibility:hidden;
    opacity:0;
    transform:none !important;
    will-change:opacity;
    transition:opacity .16s linear, visibility 0s linear .16s;
    pointer-events:none;
  }
  body.spx-prealpha .spx-visionWideBand.is-active{
    visibility:visible;
    opacity:1;
    transition:opacity .12s linear;
    pointer-events:auto;
  }
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-after{
    visibility:hidden;
    opacity:0;
    pointer-events:none;
  }
  body.spx-prealpha .spx-visionWideInner{
    min-height:560px;
    height:100%;
    transform:translate3d(0,0,0);
    opacity:1;
    transition:transform .28s cubic-bezier(.2,.8,.2,1), opacity .22s ease;
  }
  body.spx-prealpha .spx-visionWideCopy{
    max-width:620px;
  }
  body.spx-prealpha .spx-visionWideCopy h3{
    max-width:11.5ch;
  }
  body.spx-prealpha .spx-visionWideCopy p{
    max-width:53ch;
  }
}

/* === PASS106: Vision full-card overlap + content rewrite support === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideHead h2{
    max-width: 18ch;
  }
  body.spx-prealpha .spx-visionWideHead p{
    max-width: 74ch;
  }
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom: 16vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    top: calc(var(--spx-header-height, 84px) + 52px);
    width: min(1240px, calc(100vw - 48px));
    height: min(640px, calc(100vh - var(--spx-header-height, 84px) - 72px));
    min-height: 620px;
    overflow: hidden;
    pointer-events: none;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height: 64vh;
  }
  body.spx-prealpha .spx-visionWideBand{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
    margin: 0;
    visibility: hidden;
    opacity: 0;
    transform: translate3d(0, 0, 0);
    will-change: transform, opacity;
    transition: transform .18s linear, opacity .18s linear, visibility 0s linear .18s;
    pointer-events: none;
    overflow: hidden;
    border-radius: 34px;
  }
  body.spx-prealpha .spx-visionWideBand.is-active{
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
  body.spx-prealpha .spx-visionWideBand.is-after,
  body.spx-prealpha .spx-visionWideBand.is-before{
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
  body.spx-prealpha .spx-visionWideInner{
    min-height: 620px;
    height: 100%;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
    gap: clamp(28px, 3vw, 54px);
    align-items: stretch;
    padding: clamp(34px, 4vw, 52px);
    transform: none !important;
    opacity: 1 !important;
  }
  body.spx-prealpha .spx-visionWideCopy{
    max-width: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
  }
  body.spx-prealpha .spx-visionWideCopy h3{
    max-width: 15ch;
    font-size: clamp(2rem, 2.9vw, 3rem);
    line-height: 1.03;
  }
  body.spx-prealpha .spx-visionWideCopy p{
    max-width: 57ch;
    font-size: clamp(1rem, 1.15vw, 1.12rem);
    line-height: 1.72;
  }
  body.spx-prealpha .spx-visionWideChips{
    margin-top: 24px;
    gap: 10px;
  }
  body.spx-prealpha .spx-visionWideChips span{
    max-width: none;
    white-space: nowrap;
  }
  body.spx-prealpha .spx-visionWideVisual{
    min-height: 100%;
  }
  body.spx-prealpha .spx-visionWideMiniCard{
    max-width: 360px;
  }
}


/* === PASS107: Vision true same-slot scroll cards === */
.spx-visionWideProgress{ display:none !important; }
.spx-visionWideShell{ position:relative; }
.spx-visionWideStage{
  position:sticky;
  top:calc(var(--spx-header-height, 84px) + 62px);
  width:min(1240px, calc(100vw - 48px));
  height:620px;
  margin:0 auto;
  overflow:visible;
  isolation:isolate;
}
.spx-visionWideScene{ position:relative; min-height:74vh; }
.spx-visionWideScene + .spx-visionWideScene{ margin-top:0; }
.spx-visionWideBand{
  position:absolute !important;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  margin:0;
  border-radius:32px;
  transform:translate3d(0, 140px, 0);
  opacity:0;
}
.spx-visionWideInner{
  min-height:100%;
  height:100%;
}
.spx-visionWideCopy{ max-width:640px; }
.spx-visionWideCopy h3{ max-width:13ch; }
.spx-visionWideMiniCard{ width:min(320px, calc(100% - 48px)); }
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBand{
  background:linear-gradient(180deg, rgba(252,248,242,.98), rgba(247,241,232,.98));
  border-color:rgba(150,117,72,.14);
  box-shadow:0 24px 64px rgba(129,95,53,.10), inset 0 1px 0 rgba(255,255,255,.82);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideBandBg{
  background:
    radial-gradient(circle at 15% 20%, rgba(255,202,126,.18), transparent 32%),
    radial-gradient(circle at 80% 30%, rgba(214,177,122,.14), transparent 30%),
    linear-gradient(135deg, rgba(252,248,242,.98), rgba(247,241,232,.96));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideVisual,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideChips span,
html[data-spx-theme="light"] body.spx-prealpha .spx-visionWideTag{
  background:rgba(255,251,245,.92);
  border-color:rgba(150,117,72,.14);
  box-shadow:0 14px 36px rgba(129,95,53,.08), inset 0 1px 0 rgba(255,255,255,.82);
}
@media (max-width: 1100px){
  .spx-visionWideStage{ height:640px; }
}
@media (max-width: 780px){
  .spx-visionWideStage{ position:relative; top:auto; height:auto; overflow:visible; width:min(1240px, calc(100vw - 32px)); }
  .spx-visionWideBand{ position:relative !important; inset:auto; height:auto; min-height:520px; opacity:1; transform:none; visibility:visible; }
  .spx-visionWideScene{ min-height:auto; }
  .spx-visionWideScene + .spx-visionWideScene{ margin-top:22px; }
}


/* === PASS108: Vision outer cards own the motion again === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideBand{
    --spx-vision-card-y: 160px;
    --spx-vision-card-opacity: 0;
    --spx-vision-card-visibility: hidden;
    --spx-vision-card-z: 1;
    transform: translate3d(0, var(--spx-vision-card-y), 0) !important;
    opacity: var(--spx-vision-card-opacity) !important;
    visibility: var(--spx-vision-card-visibility) !important;
    z-index: var(--spx-vision-card-z) !important;
    transition:
      transform .44s cubic-bezier(.18,.92,.2,1),
      opacity .40s cubic-bezier(.2,.82,.2,1),
      visibility 0s linear .40s,
      box-shadow .28s ease,
      border-color .28s ease;
    will-change: transform, opacity;
    pointer-events: none;
  }
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-active{
    visibility: visible !important;
  }
  body.spx-prealpha .spx-visionWideBand.is-after{
    visibility: hidden !important;
  }
}


/* === PASS110: Vision cards enter from below the viewport with longer, softer overlap === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    position: relative;
    overflow: visible !important;
    padding-bottom: 24vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    overflow: visible !important;
    height: 620px;
    pointer-events: none;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height: 94vh;
  }
  body.spx-prealpha .spx-visionWideBand{
    transition:
      transform .50s cubic-bezier(.18,.92,.2,1),
      opacity .42s cubic-bezier(.2,.82,.2,1),
      visibility 0s linear .42s,
      box-shadow .30s ease,
      border-color .30s ease;
    will-change: transform, opacity;
  }
}
@media (max-width: 1100px){
  body.spx-prealpha .spx-visionWideScene{
    min-height: 86vh;
  }
}


/* === PASS111: Vision earlier trigger + smoother reverse fade === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom: 22vh;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height: 90vh;
  }
  body.spx-prealpha .spx-visionWideBand{
    transition:
      transform .46s cubic-bezier(.18,.88,.22,1),
      opacity .42s cubic-bezier(.22,.70,.20,1),
      visibility 0s linear .42s,
      box-shadow .26s ease,
      border-color .26s ease;
  }
}
@media (max-width: 1100px){
  body.spx-prealpha .spx-visionWideScene{
    min-height: 84vh;
  }
}

/* === PASS112: Vision headline trim + news showcase rail rework === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideBand{
    transition:
      transform .54s cubic-bezier(.18,.88,.22,1),
      opacity .50s cubic-bezier(.22,.70,.20,1),
      visibility 0s linear .50s,
      box-shadow .28s ease,
      border-color .28s ease;
  }
}

body.spx-prealpha .spx-newsShowcase{
  position:relative;
  overflow:visible;
}
body.spx-prealpha .spx-newsShowcaseHead{
  align-items:flex-end;
  gap:24px;
}
body.spx-prealpha .spx-newsIntro{
  max-width:880px;
}
body.spx-prealpha .spx-newsIntro h2{
  max-width:12ch;
}
body.spx-prealpha .spx-newsIntro p{
  max-width:760px;
}
body.spx-prealpha .spx-newsMetaStrip{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
body.spx-prealpha .spx-newsMetaStrip span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:rgba(219,229,244,.76);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
body.spx-prealpha .spx-newsMetaStrip strong{
  color:#f6fbff;
  font-weight:700;
}
body.spx-prealpha .spx-newsShowcaseFrame{
  --spx-news-section-progress:0;
  position:relative;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(9,14,26,.94), rgba(6,10,20,.98));
  box-shadow:0 30px 90px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06);
  padding:24px 0 18px;
  isolation:isolate;
}
body.spx-prealpha .spx-newsShowcaseGlow,
body.spx-prealpha .spx-newsShowcaseGrid{
  position:absolute;
  inset:0;
  pointer-events:none;
}
body.spx-prealpha .spx-newsShowcaseGlow{
  background:
    radial-gradient(circle at 18% 18%, rgba(86,138,255,.18), transparent 34%),
    radial-gradient(circle at 82% 20%, rgba(177,122,255,.14), transparent 30%),
    radial-gradient(circle at 50% 100%, rgba(111,245,255,.08), transparent 32%);
  opacity:calc(.34 + (var(--spx-news-section-progress) * .5));
  transform:translate3d(0, calc((1 - var(--spx-news-section-progress)) * 26px), 0) scale(calc(.97 + (var(--spx-news-section-progress) * .03)));
}
body.spx-prealpha .spx-newsShowcaseGrid{
  opacity:.16;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:26px 26px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.62), rgba(0,0,0,.18));
}
body.spx-prealpha .spx-newsRailHead{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:0 28px 16px;
}
body.spx-prealpha .spx-newsRailLabel{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:.83rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(214,225,243,.66);
}
body.spx-prealpha .spx-newsRailDot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(135deg, rgba(111,245,255,.95), rgba(177,122,255,.95));
  box-shadow:0 0 0 5px rgba(111,245,255,.08);
}
body.spx-prealpha .spx-newsRailProgress{
  position:relative;
  width:min(240px, 34vw);
  height:3px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
body.spx-prealpha .spx-newsRailProgress i{
  position:absolute;
  inset:0 auto 0 0;
  width:14%;
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(111,245,255,.9), rgba(177,122,255,.92));
  box-shadow:0 0 18px rgba(111,245,255,.25);
  transition:width .4s ease;
}
body.spx-prealpha .spx-newsSwiper{
  position:relative;
  overflow:visible;
  padding:6px 0 14px;
}
body.spx-prealpha .spx-newsTrack{
  display:flex;
  gap:24px;
  overflow:auto;
  padding:10px 20px 22px;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
body.spx-prealpha .spx-newsTrack::-webkit-scrollbar{ display:none; }
body.spx-prealpha .spx-newsSlide{
  flex:0 0 min(560px, 46vw);
  max-width:min(560px, 46vw);
  scroll-snap-align:center;
  opacity:var(--spx-news-card-opacity, .84);
  transform:translate3d(0, var(--spx-news-card-y, 16px), 0) scale(var(--spx-news-card-scale, .97));
  transition:transform .74s cubic-bezier(.2,.84,.18,1), opacity .55s ease, filter .55s ease, box-shadow .55s ease, border-color .35s ease;
  will-change:transform, opacity;
}
body.spx-prealpha .spx-newsCard.spx-newsSlide{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:540px;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(11,17,30,.90), rgba(7,11,23,.98));
  box-shadow:0 22px 64px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
  filter:saturate(.88);
}
body.spx-prealpha .spx-newsSlide.is-active{
  border-color:rgba(122,174,255,.22);
  box-shadow:0 34px 96px rgba(0,0,0,.28), 0 0 0 1px rgba(122,174,255,.08), inset 0 1px 0 rgba(255,255,255,.06);
  filter:none;
}
body.spx-prealpha .spx-newsSlide.is-before,
body.spx-prealpha .spx-newsSlide.is-after{
  filter:saturate(.86) brightness(.96);
}
body.spx-prealpha .spx-newsCardVisual{
  position:relative;
  height:244px;
  background:#0d1321 center/cover no-repeat;
  overflow:hidden;
}
body.spx-prealpha .spx-newsCardVisualShade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(6,10,18,.08) 0%, rgba(6,10,18,.18) 42%, rgba(6,10,18,.76) 100%);
}
body.spx-prealpha .spx-newsCardTopline{
  position:absolute;
  inset:18px 18px auto 18px;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
body.spx-prealpha .spx-newsCardIndex{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  height:34px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(8,12,22,.48);
  color:rgba(242,247,255,.86);
  font-size:.82rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  backdrop-filter:blur(12px);
}
body.spx-prealpha .spx-newsCardBody{
  display:flex;
  flex-direction:column;
  gap:14px;
  flex:1 1 auto;
  padding:22px 22px 20px;
}
body.spx-prealpha .spx-newsMetaRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
body.spx-prealpha .spx-newsMetaMinor{
  color:rgba(208,220,238,.52);
  font-size:.82rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.spx-prealpha .spx-newsCard h3{
  margin:0;
  max-width:16ch;
  font-size:clamp(1.65rem, 2vw, 2.1rem);
  line-height:1.06;
  letter-spacing:-.04em;
}
body.spx-prealpha .spx-newsCard p{
  margin:0;
  flex:1 1 auto;
  color:rgba(214,225,243,.74);
  font-size:1rem;
  line-height:1.8;
}
body.spx-prealpha .spx-newsCardFoot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-top:auto;
}
body.spx-prealpha .spx-newsFootLabel{
  color:rgba(208,220,238,.58);
  font-size:.84rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.spx-prealpha .spx-newsCardFoot .spx-btn{
  backdrop-filter:blur(10px);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsMetaStrip span{
  border-color:rgba(89,112,156,.12);
  background:rgba(255,255,255,.78);
  color:rgba(58,76,109,.72);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsMetaStrip strong{ color:rgba(21,36,61,.92); }
html[data-spx-theme="light"] body.spx-prealpha .spx-newsShowcaseFrame{
  background:linear-gradient(180deg, rgba(247,250,255,.96), rgba(239,244,251,.94));
  border-color:rgba(94,116,152,.12);
  box-shadow:0 26px 72px rgba(28,52,97,.10), inset 0 1px 0 rgba(255,255,255,.74);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsShowcaseGlow{
  background:
    radial-gradient(circle at 18% 18%, rgba(116,144,193,.12), transparent 34%),
    radial-gradient(circle at 82% 20%, rgba(166,149,194,.10), transparent 30%),
    radial-gradient(circle at 50% 100%, rgba(128,184,192,.08), transparent 32%);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsShowcaseGrid{
  opacity:.14;
  background-image:
    linear-gradient(rgba(102,121,155,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(102,121,155,.05) 1px, transparent 1px);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsRailLabel,
html[data-spx-theme="light"] body.spx-prealpha .spx-newsFootLabel,
html[data-spx-theme="light"] body.spx-prealpha .spx-newsMetaMinor{
  color:rgba(74,96,137,.62);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsCard.spx-newsSlide{
  background:linear-gradient(180deg, rgba(252,253,255,.98), rgba(245,248,252,.96));
  border-color:rgba(94,116,152,.12);
  box-shadow:0 22px 56px rgba(33,58,108,.08), inset 0 1px 0 rgba(255,255,255,.76);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsSlide.is-active{
  border-color:rgba(99,126,182,.22);
  box-shadow:0 30px 78px rgba(33,58,108,.12), 0 0 0 1px rgba(105,132,194,.08), inset 0 1px 0 rgba(255,255,255,.78);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsCardIndex{
  border-color:rgba(94,116,152,.14);
  background:rgba(255,255,255,.78);
  color:rgba(43,61,92,.76);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsCardVisualShade{
  background:linear-gradient(180deg, rgba(247,250,255,.04) 0%, rgba(247,250,255,.08) 42%, rgba(244,247,252,.76) 100%);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-newsCard p{
  color:rgba(58,76,109,.74);
}

@media (max-width: 980px){
  body.spx-prealpha .spx-newsShowcaseHead{ align-items:flex-start; }
  body.spx-prealpha .spx-newsSlide{
    flex-basis:min(74vw, 540px);
    max-width:min(74vw, 540px);
  }
}
@media (max-width: 720px){
  body.spx-prealpha .spx-newsMetaStrip{ gap:8px; }
  body.spx-prealpha .spx-newsMetaStrip span{ min-height:34px; padding:0 12px; }
  body.spx-prealpha .spx-newsShowcaseFrame{ padding-top:18px; border-radius:26px; }
  body.spx-prealpha .spx-newsRailHead{
    padding:0 18px 14px;
    align-items:flex-start;
    flex-direction:column;
  }
  body.spx-prealpha .spx-newsRailProgress{ width:100%; }
  body.spx-prealpha .spx-newsTrack{ gap:18px; padding-bottom:18px; }
  body.spx-prealpha .spx-newsSlide{
    flex-basis:min(86vw, 520px);
    max-width:min(86vw, 520px);
  }
  body.spx-prealpha .spx-newsCard.spx-newsSlide{ min-height:500px; }
  body.spx-prealpha .spx-newsCardVisual{ height:220px; }
  body.spx-prealpha .spx-newsCardBody{ padding:20px 18px 18px; }
  body.spx-prealpha .spx-newsCard h3{ max-width:100%; }
}


/* === PASS114: News rail under title, 3.5 visible, full width === */
body.spx-prealpha .spx-newsSimpleShowcase{
  width:100%;
  max-width:none !important;
  margin-inline:0;
  gap:16px;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseHead{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  flex-wrap:nowrap;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseHead h2{
  margin:0;
  max-width:none;
  font-size:clamp(28px, 4vw, 40px);
  line-height:1.06;
  letter-spacing:-.04em;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsArrows{
  margin-left:4px;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseFrame{
  padding-top:10px;
  padding-inline:0;
  border:none;
  background:none;
  box-shadow:none;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseGlow,
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseGrid{
  display:none;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsSwiper{
  padding:0 0 14px;
  overflow:hidden;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsTrack{
  --spx-news-gap:24px;
  gap:var(--spx-news-gap);
  padding:8px 0 22px;
  scroll-snap-type:x mandatory;
}
body.spx-prealpha .spx-newsSimpleShowcase .spx-newsSlide{
  flex:0 0 calc((100% - (var(--spx-news-gap) * 3)) / 3.5);
  max-width:calc((100% - (var(--spx-news-gap) * 3)) / 3.5);
  min-width:0;
  scroll-snap-align:start;
}
@media (max-width: 1180px){
  body.spx-prealpha .spx-newsSimpleShowcase .spx-newsTrack{
    --spx-news-gap:22px;
  }
  body.spx-prealpha .spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - (var(--spx-news-gap) * 2)) / 2.6);
    max-width:calc((100% - (var(--spx-news-gap) * 2)) / 2.6);
  }
}
@media (max-width: 720px){
  body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseHead{
    gap:12px;
  }
  body.spx-prealpha .spx-newsSimpleShowcase .spx-newsShowcaseHead h2{
    font-size:clamp(24px, 7vw, 32px);
  }
  body.spx-prealpha .spx-newsSimpleShowcase .spx-newsTrack{
    --spx-news-gap:18px;
    padding-bottom:18px;
  }
  body.spx-prealpha .spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - var(--spx-news-gap)) / 1.18);
    max-width:calc((100% - var(--spx-news-gap)) / 1.18);
  }
}


/* === PASS115: News title above full-width low rail === */
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase{
  display:grid;
  grid-template-columns:minmax(0,1fr) !important;
  gap:14px;
  align-items:start;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase > .spx-newsShowcaseHead,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase > .spx-newsShowcaseFrame,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase > .spx-emptyNewsCard{
  grid-column:1 / -1;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead{
  width:100%;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseFrame{
  width:100%;
  margin:0;
  padding-top:0;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSwiper{
  width:100%;
  padding:2px 0 8px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
  --spx-news-gap:22px;
  align-items:stretch;
  padding:6px 0 12px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
  flex:0 0 calc((100% - (var(--spx-news-gap) * 3)) / 3.5);
  max-width:calc((100% - (var(--spx-news-gap) * 3)) / 3.5);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide{
  min-height:0;
  border-radius:24px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardVisual,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide .spx-newsCardVisual{
  height:160px;
  min-height:160px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardBody,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide .spx-newsCardBody{
  padding:16px 16px 14px;
  gap:12px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard h3{
  font-size:22px;
  line-height:1.16;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard p{
  line-height:1.65;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot{
  margin-top:auto;
  padding-top:2px;
}
@media (max-width:1180px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{ --spx-news-gap:20px; }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - (var(--spx-news-gap) * 2)) / 2.6);
    max-width:calc((100% - (var(--spx-news-gap) * 2)) / 2.6);
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardVisual,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide .spx-newsCardVisual{
    height:154px;
    min-height:154px;
  }
}
@media (max-width:720px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead{
    gap:12px;
    flex-wrap:wrap;
    justify-content:space-between;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
    --spx-news-gap:16px;
    padding-bottom:14px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - var(--spx-news-gap)) / 1.18);
    max-width:calc((100% - var(--spx-news-gap)) / 1.18);
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardVisual,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide .spx-newsCardVisual{
    height:148px;
    min-height:148px;
  }
}


/* === PASS116: News rail full-bleed right, no frame background, working controls === */
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase{
  max-width:min(1360px, 96vw) !important;
  overflow:visible;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead{
  position:relative;
  z-index:2;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseFrame{
  width:auto;
  margin-right:calc(50% - 50vw);
  padding:0;
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSwiper{
  width:100%;
  padding:2px 0 8px;
  background:transparent !important;
  overflow:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
  --spx-news-gap:20px;
  align-items:stretch;
  padding:6px max(28px, env(safe-area-inset-right, 0px)) 12px 0;
  cursor:grab;
  user-select:none;
  touch-action:pan-y;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack.is-dragging{
  cursor:grabbing;
  scroll-snap-type:none;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack.is-dragging > .spx-newsSlide{
  pointer-events:none;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
  flex:0 0 calc((100% - (var(--spx-news-gap) * 2.35) - max(28px, env(safe-area-inset-right, 0px))) / 3.15);
  max-width:calc((100% - (var(--spx-news-gap) * 2.35) - max(28px, env(safe-area-inset-right, 0px))) / 3.15);
  min-width:360px;
}
@media (max-width:1180px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
    --spx-news-gap:18px;
    padding-right:20px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - (var(--spx-news-gap) * 1.75) - 20px) / 2.3);
    max-width:calc((100% - (var(--spx-news-gap) * 1.75) - 20px) / 2.3);
    min-width:320px;
  }
}
@media (max-width:720px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseFrame{
    margin-right:0;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
    --spx-news-gap:16px;
    padding-right:16px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - var(--spx-news-gap) - 16px) / 1.18);
    max-width:calc((100% - var(--spx-news-gap) - 16px) / 1.18);
  }
}

/* === PASS117: final polish — news cards, smoother motion, better cue/closing/footer === */
body.spx-prealpha [data-reveal]{
  transform:translate3d(0,20px,0);
  transition:opacity .92s var(--spx-ease),transform .92s var(--spx-ease),filter .92s var(--spx-ease);
  will-change:transform,opacity,filter;
  backface-visibility:hidden;
}
body.spx-prealpha [data-reveal].is-visible{transform:translate3d(0,0,0)}

body.spx-prealpha .spx-scrollCue{
  gap:14px;
  padding:14px 18px;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
  border-color:rgba(255,255,255,.12);
  box-shadow:0 18px 52px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(14px);
}
body.spx-prealpha .spx-scrollCueText{
  display:grid;
  gap:2px;
  align-items:start;
}
body.spx-prealpha .spx-scrollCueLabel{
  display:block;
  font-size:14px;
  font-weight:800;
  letter-spacing:.01em;
}
body.spx-prealpha .spx-scrollCueSub{
  display:block;
  color:rgba(202,213,236,.64);
  font-size:12px;
  font-weight:700;
  letter-spacing:.01em;
}
body.spx-prealpha .spx-scrollCueArrow{
  width:12px;
  height:12px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
}

body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase{
  --spx-news-card-radius:26px;
  --spx-news-card-shadow:0 24px 64px rgba(0,0,0,.22);
  --spx-news-accent:rgba(121,214,255,.56);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead{
  align-items:center;
  margin-bottom:4px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSectionHead h2{
  margin:0;
  font-size:clamp(30px,4vw,42px);
  line-height:1.02;
  letter-spacing:-.045em;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseFrame,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseGlow,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseGrid{
  background:transparent !important;
  box-shadow:none !important;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseGlow,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseGrid{
  display:none !important;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrows{
  gap:12px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow{
  position:relative;
  width:52px;
  height:52px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035));
  box-shadow:0 18px 38px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(14px);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  background:radial-gradient(circle at 30% 20%, rgba(124,214,255,.14), transparent 52%);
  opacity:.95;
  pointer-events:none;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow:hover:not(:disabled){
  transform:translateY(-2px) scale(1.01);
  border-color:rgba(146,220,255,.22);
  background:linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.05));
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow:disabled{
  opacity:.34;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrowIcon{
  position:relative;
  display:inline-block;
  width:12px;
  height:12px;
  border-top:2px solid currentColor;
  border-right:2px solid currentColor;
  z-index:1;
  filter:drop-shadow(0 0 10px rgba(121,214,255,.16));
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrowIconPrev{transform:rotate(-135deg) translate(-1px, 1px)}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrowIconNext{transform:rotate(45deg) translate(-1px, 1px)}

body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSwiper{
  overflow:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
  scrollbar-width:none;
  gap:var(--spx-news-gap, 22px);
  align-items:stretch;
  will-change:scroll-position;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack::-webkit-scrollbar{display:none}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
  scroll-snap-align:start;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
  position:relative;
  overflow:hidden;
  border-radius:var(--spx-news-card-radius);
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(121,214,255,.09), transparent 38%),
    linear-gradient(180deg, rgba(12,18,32,.94), rgba(8,11,22,.98));
  box-shadow:var(--spx-news-card-shadow), inset 0 1px 0 rgba(255,255,255,.035);
  min-height:372px;
  transform:translate3d(0, calc(((1 - var(--spx-news-section-progress, 1)) * 24px) + var(--spx-news-card-y, 0px)), 0) scale(var(--spx-news-card-scale, 1)) rotate(var(--spx-news-card-rot, 0deg));
  opacity:calc((.88 + (var(--spx-news-section-progress, 1) * .12)) * var(--spx-news-card-opacity, 1));
  transition:transform .72s var(--spx-ease), opacity .62s var(--spx-ease), box-shadow .36s var(--spx-ease), border-color .36s var(--spx-ease), background .36s var(--spx-ease);
  will-change:transform,opacity;
  backface-visibility:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:linear-gradient(90deg, transparent 0%, rgba(121,214,255,.65) 25%, rgba(255,255,255,.15) 80%, transparent 100%);
  opacity:.92;
  z-index:2;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard::after{
  content:"";
  position:absolute;
  inset:auto -18% -42% auto;
  width:180px;
  height:180px;
  background:radial-gradient(circle, rgba(121,214,255,.13), transparent 68%);
  pointer-events:none;
  opacity:.52;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.is-active{
  border-color:rgba(145,221,255,.18);
  box-shadow:0 30px 78px rgba(0,0,0,.24), 0 0 0 1px rgba(121,214,255,.06), inset 0 1px 0 rgba(255,255,255,.04);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard:hover{
  transform:translate3d(0, calc(((1 - var(--spx-news-section-progress, 1)) * 24px) + var(--spx-news-card-y, 0px) - 4px), 0) scale(calc(var(--spx-news-card-scale, 1) + .01)) rotate(var(--spx-news-card-rot, 0deg));
  border-color:rgba(152,223,255,.20);
  box-shadow:0 34px 88px rgba(0,0,0,.26), 0 0 0 1px rgba(121,214,255,.08), inset 0 1px 0 rgba(255,255,255,.045);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardVisual,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide .spx-newsCardVisual{
  height:150px;
  min-height:150px;
  border-bottom:1px solid rgba(255,255,255,.06);
  background-size:cover;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardVisualShade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(8,11,18,.10) 0%, rgba(8,11,18,.18) 42%, rgba(8,11,18,.74) 100%),
    radial-gradient(circle at 78% 20%, rgba(255,255,255,.16), transparent 36%);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardTopline{
  position:absolute;
  inset:16px 16px auto 16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  z-index:2;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsMetaTag{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(7,10,18,.42);
  backdrop-filter:blur(12px);
  color:rgba(241,246,255,.92);
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardIndex{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:34px;
  padding:0 10px;
  border-radius:12px;
  background:rgba(7,10,18,.44);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(12px);
  color:rgba(245,249,255,.92);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardBody{
  gap:14px;
  padding:18px 18px 18px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsMetaRow{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsMetaDate,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsMetaMinor{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  color:rgba(194,208,232,.72);
  font-size:12px;
  font-weight:800;
  letter-spacing:.03em;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsMetaMinor::before{
  content:"";
  width:4px;
  height:4px;
  border-radius:50%;
  background:rgba(121,214,255,.72);
  margin-right:10px;
  box-shadow:0 0 10px rgba(121,214,255,.42);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard h3{
  margin:0;
  font-size:22px;
  line-height:1.14;
  letter-spacing:-.035em;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard p{
  margin:0;
  color:rgba(202,213,236,.76);
  line-height:1.72;
  font-size:14px;
  font-weight:650;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-top:auto;
  padding-top:4px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsFootLabel{
  color:rgba(194,208,232,.68);
  font-size:12px;
  font-weight:800;
  letter-spacing:.03em;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot .spx-btn{
  min-height:40px;
  padding-inline:14px;
  border-radius:999px;
  border-color:rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot .spx-btn:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(145,221,255,.18);
}
@media (max-width:1180px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
    min-height:348px;
  }
}
@media (max-width:720px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSectionHead h2{
    font-size:clamp(28px,8vw,36px);
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow{
    width:48px;
    height:48px;
    border-radius:16px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
    min-height:332px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot{
    align-items:flex-start;
    flex-direction:column;
  }
}

body.spx-prealpha .spx-closingSection{
  padding-top:10px;
  padding-bottom:18px;
}
body.spx-prealpha .spx-closingCardCentered{
  position:relative;
  max-width:min(1120px, 92vw);
  margin:0 auto;
  text-align:center;
  padding:36px clamp(24px,4vw,54px);
  border-radius:34px;
  overflow:hidden;
}
body.spx-prealpha .spx-closingCardCentered::before{
  content:"";
  position:absolute;
  inset:-20% auto auto 50%;
  width:440px;
  height:440px;
  transform:translateX(-50%);
  background:radial-gradient(circle, rgba(121,214,255,.14), transparent 68%);
  pointer-events:none;
}
body.spx-prealpha .spx-closingCardCentered .spx-panelKicker,
body.spx-prealpha .spx-closingCardCentered h2,
body.spx-prealpha .spx-closingCardCentered p,
body.spx-prealpha .spx-closingCardCentered .spx-heroActions{
  position:relative;
  z-index:1;
}
body.spx-prealpha .spx-closingCardCentered .spx-panelKicker{
  justify-content:center;
  margin-inline:auto;
}
body.spx-prealpha .spx-closingCardCentered h2{
  margin:8px auto 0;
  max-width:16ch;
  font-size:clamp(32px,4.4vw,48px);
  line-height:1.04;
  letter-spacing:-.045em;
}
body.spx-prealpha .spx-closingCardCentered p{
  max-width:760px;
  margin:14px auto 0;
  color:rgba(202,213,236,.76);
}
body.spx-prealpha .spx-closingCardCentered .spx-heroActions{
  justify-content:center;
  margin-top:22px;
}

body.spx-prealpha .spx-footer{
  max-width:min(1240px, 94vw);
  margin:34px auto 0;
  padding:24px clamp(18px,2.8vw,28px) 34px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(10,14,24,.76), rgba(8,10,18,.94));
  box-shadow:0 24px 64px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.03);
  backdrop-filter:blur(16px);
}
body.spx-prealpha .spx-footerBrand{
  gap:16px;
}
body.spx-prealpha .spx-footerBrand span{
  max-width:54ch;
}
body.spx-prealpha .spx-footerLinks{
  justify-content:flex-end;
}
body.spx-prealpha .spx-linkBtn,
body.spx-prealpha .spx-footer a{
  min-height:40px;
  padding:0 15px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.045);
}
@media (max-width:920px){
  body.spx-prealpha .spx-footer{
    justify-content:center;
    text-align:center;
  }
  body.spx-prealpha .spx-footerBrand{
    justify-content:center;
    text-align:center;
  }
  body.spx-prealpha .spx-footerLinks{
    width:100%;
    justify-content:center;
  }
}


/* === PASS119: stable news rail, cleaner explore cue, smoother vision stack === */
body.spx-prealpha .spx-scrollCue{
  gap:12px;
  padding:12px 16px;
}
body.spx-prealpha .spx-scrollCueText{
  display:flex;
  align-items:center;
}
body.spx-prealpha .spx-scrollCueSub{
  display:none !important;
}
body.spx-prealpha .spx-scrollCueArrow{
  position:relative;
  width:18px;
  height:18px;
  border:0;
  transform:none;
}
body.spx-prealpha .spx-scrollCueArrow::before,
body.spx-prealpha .spx-scrollCueArrow::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  border-radius:999px;
}
body.spx-prealpha .spx-scrollCueArrow::before{
  top:0;
  width:2px;
  height:12px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(125,216,255,.92));
  box-shadow:0 0 14px rgba(121,214,255,.18);
}
body.spx-prealpha .spx-scrollCueArrow::after{
  bottom:0;
  width:8px;
  height:8px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:translateX(-50%) rotate(45deg);
}

body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
  scroll-snap-type:x mandatory;
  scroll-padding-left:0;
  scroll-behavior:smooth;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
  flex:0 0 calc((100% - (var(--spx-news-gap, 20px) * 2.5) - max(28px, env(safe-area-inset-right, 0px))) / 3.24);
  max-width:calc((100% - (var(--spx-news-gap, 20px) * 2.5) - max(28px, env(safe-area-inset-right, 0px))) / 3.24);
  min-width:396px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow{
  width:50px;
  height:50px;
  border-radius:17px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrowIcon{
  width:16px;
  height:16px;
  border-top-width:2.5px;
  border-right-width:2.5px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
  min-height:356px;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot{
  justify-content:flex-end;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsFootLabel{
  display:none !important;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardFoot .spx-btn{
  min-width:122px;
}
@media (max-width:1180px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - (var(--spx-news-gap, 18px) * 1.8) - 20px) / 2.18);
    max-width:calc((100% - (var(--spx-news-gap, 18px) * 1.8) - 20px) / 2.18);
    min-width:332px;
  }
}
@media (max-width:720px){
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - var(--spx-news-gap, 16px) - 16px) / 1.14);
    max-width:calc((100% - var(--spx-news-gap, 16px) - 16px) / 1.14);
    min-width:0;
  }
}

body.spx-prealpha .spx-closingCardCentered .spx-panelKicker{
  letter-spacing:.12em;
}
body.spx-prealpha .spx-closingCardCentered h2{
  max-width:14ch;
}
body.spx-prealpha .spx-closingCardCentered p{
  max-width:640px;
}

@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom:26vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    height:640px;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height:96vh;
  }
  body.spx-prealpha .spx-visionWideBand{
    transition:
      transform .72s cubic-bezier(.16,.84,.18,1),
      opacity .66s cubic-bezier(.2,.78,.18,1),
      visibility 0s linear .66s,
      box-shadow .32s ease,
      border-color .32s ease;
  }
}


/* === PASS120: Vision stack smoothing + centered final CTA === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideBand{
    --spx-vision-card-scale: 1;
    transform: translate3d(0, var(--spx-vision-card-y), 0) scale(var(--spx-vision-card-scale)) !important;
    transition:
      box-shadow .28s ease,
      border-color .28s ease,
      background .28s ease !important;
    backface-visibility: hidden;
    transform-style: preserve-3d;
  }
  body.spx-prealpha .spx-visionWideBand.is-before{
    --spx-vision-card-scale: .998;
  }
}

body.spx-prealpha .spx-closingSection{
  display:block !important;
  grid-template-columns:1fr !important;
  max-width:min(1240px, 94vw);
  margin-inline:auto;
}
body.spx-prealpha .spx-closingSection .spx-closingCardCentered{
  width:min(1120px, 100%);
  margin-inline:auto;
}


/* === PASS122: vision overlap really later + footer centering restored === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideScene{
    min-height:108vh;
  }
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom:30vh;
  }
  body.spx-prealpha .spx-visionWideBand{
    transition:none !important;
  }
}

body.spx-prealpha .spx-footer{
  width:min(1380px, calc(100vw - 28px));
  max-width:none;
  margin:34px auto 0;
  left:auto;
  transform:none;
}

@media (max-width: 640px){
  body.spx-prealpha .spx-footer{
    width:calc(100vw - 20px);
    left:auto;
    transform:none;
  }
}


/* === PASS123: Vision motion is fully scroll-mapped + cue arrow reacts to scroll === */
@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom: 34vh;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height: 122vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    height: 640px;
  }
  body.spx-prealpha .spx-visionWideBand{
    --spx-vision-card-y: 220px;
    --spx-vision-card-opacity: 0;
    --spx-vision-card-scale: 1;
    --spx-vision-card-z: 1;
    --spx-vision-card-visibility: hidden;
    transform: translate3d(0, var(--spx-vision-card-y), 0) scale(var(--spx-vision-card-scale)) !important;
    opacity: var(--spx-vision-card-opacity) !important;
    visibility: var(--spx-vision-card-visibility) !important;
    z-index: var(--spx-vision-card-z) !important;
    transition: box-shadow .24s ease, border-color .24s ease, background .24s ease !important;
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform-style: preserve-3d;
  }
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-active{
    visibility: visible !important;
  }
}

body.spx-prealpha .spx-scrollCue{
  position: relative;
  overflow: hidden;
}
body.spx-prealpha .spx-scrollCueArrow{
  opacity: .72;
}
body.spx-prealpha .spx-scrollCueArrow::before,
body.spx-prealpha .spx-scrollCueArrow::after{
  transition: transform .46s cubic-bezier(.2,.84,.2,1), opacity .28s ease;
}
body.spx-prealpha:not(.spx-scroll-started) .spx-scrollCueArrow::before{
  transform: translateX(-50%) translateY(-7px) scaleY(.72);
  opacity: .46;
}
body.spx-prealpha:not(.spx-scroll-started) .spx-scrollCueArrow::after{
  transform: translateX(-50%) translateY(-8px) rotate(45deg);
  opacity: .56;
}
body.spx-prealpha.spx-scroll-started .spx-scrollCueArrow::before,
body.spx-prealpha.spx-scroll-started .spx-scrollCueArrow::after{
  opacity: 1;
}
body.spx-prealpha.spx-scroll-down-active .spx-scrollCueArrow::before{
  transform: translateX(-50%) translateY(5px) scaleY(1.02);
}
body.spx-prealpha.spx-scroll-down-active .spx-scrollCueArrow::after{
  transform: translateX(-50%) translateY(4px) rotate(45deg);
}

/* === PASS124: final vision overlap + explore arrow + early scroll-top fab === */
body.spx-prealpha .spx-scrollCueArrow{
  position:relative;
  width:20px;
  height:24px;
  border:0 !important;
  border-radius:0 !important;
  background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(124,218,255,.96)) center 2px / 2px 11px no-repeat !important;
  transform:none !important;
  opacity:.96;
  overflow:visible;
}
body.spx-prealpha .spx-scrollCueArrow::before,
body.spx-prealpha .spx-scrollCueArrow::after{
  content:"";
  position:absolute;
  left:50%;
  width:8px;
  height:8px;
  margin-left:-4px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  opacity:.95;
}
body.spx-prealpha .spx-scrollCueArrow::before{
  top:9px;
  transform:rotate(45deg);
}
body.spx-prealpha .spx-scrollCueArrow::after{
  top:13px;
  transform:rotate(45deg);
  opacity:.56;
}
body.spx-prealpha:not(.spx-scroll-started) .spx-scrollCueArrow::before{
  transform:translateY(-5px) rotate(45deg);
  opacity:.68;
}
body.spx-prealpha:not(.spx-scroll-started) .spx-scrollCueArrow::after{
  transform:translateY(-7px) rotate(45deg);
  opacity:.28;
}
body.spx-prealpha.spx-scroll-started .spx-scrollCueArrow::before,
body.spx-prealpha.spx-scroll-started .spx-scrollCueArrow::after{
  opacity:1;
}
body.spx-prealpha.spx-scroll-down-active .spx-scrollCueArrow::before{
  transform:translateY(4px) rotate(45deg);
}
body.spx-prealpha.spx-scroll-down-active .spx-scrollCueArrow::after{
  transform:translateY(6px) rotate(45deg);
  opacity:.72;
}

body.spx-prealpha .spx-scrollTopFab{
  z-index:260;
  right:clamp(16px, 2vw, 28px);
  bottom:clamp(18px, 2.4vw, 30px);
}
body.spx-prealpha .spx-scrollTopFab.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

@media (min-width: 981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom:36vh;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height:128vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    height:640px;
    overflow:visible;
  }
  body.spx-prealpha .spx-visionWideBand{
    --spx-vision-card-y: 260px;
    --spx-vision-card-opacity: 0;
    --spx-vision-card-scale: 1;
    --spx-vision-card-z: 1;
    --spx-vision-card-visibility: hidden;
    transform: translate3d(0, var(--spx-vision-card-y), 0) scale(var(--spx-vision-card-scale)) !important;
    opacity: var(--spx-vision-card-opacity) !important;
    visibility: var(--spx-vision-card-visibility) !important;
    z-index: var(--spx-vision-card-z) !important;
    transition: box-shadow .24s ease, border-color .24s ease, background .24s ease !important;
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform-style: preserve-3d;
  }
  body.spx-prealpha .spx-visionWideBand.is-before,
  body.spx-prealpha .spx-visionWideBand.is-active{
    visibility: visible !important;
  }
}

/* === PASS125: cue/static arrow, smoother vision overlap, earlier top-fab, sticky nav, mobile polish === */
body.spx-prealpha .spx-topbar{
  position:sticky;
  top:calc(var(--safeT) + 10px);
  z-index:240;
  width:min(1320px, calc(100vw - 28px));
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  background:linear-gradient(180deg, rgba(9,14,24,.78), rgba(7,11,19,.92));
  backdrop-filter:blur(18px);
  box-shadow:0 18px 48px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-topbar{
  background:linear-gradient(180deg, rgba(255,250,245,.90), rgba(247,240,232,.96));
  border-color:rgba(140,98,66,.12);
  box-shadow:0 18px 44px rgba(163,93,37,.10), inset 0 1px 0 rgba(255,255,255,.78);
}
body.spx-prealpha .spx-scrollCue{
  overflow:visible;
}
body.spx-prealpha .spx-scrollCue::after{
  display:none !important;
}
body.spx-prealpha .spx-scrollCueArrow{
  width:14px;
  height:14px;
  background:none !important;
  border:0 !important;
  opacity:.92;
  animation:none !important;
}
body.spx-prealpha .spx-scrollCueArrow::before,
body.spx-prealpha .spx-scrollCueArrow::after{
  content:"";
  position:absolute;
  width:10px;
  height:10px;
  left:50%;
  margin-left:-5px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  border-radius:0 !important;
  background:none !important;
  box-shadow:none !important;
  transition:none !important;
}
body.spx-prealpha .spx-scrollCueArrow::before{ top:-1px; transform:rotate(45deg); opacity:.96; }
body.spx-prealpha .spx-scrollCueArrow::after{ top:5px; transform:rotate(45deg); opacity:.58; }
body.spx-prealpha:not(.spx-scroll-started) .spx-scrollCueArrow::before,
body.spx-prealpha:not(.spx-scroll-started) .spx-scrollCueArrow::after,
body.spx-prealpha.spx-scroll-started .spx-scrollCueArrow::before,
body.spx-prealpha.spx-scroll-started .spx-scrollCueArrow::after,
body.spx-prealpha.spx-scroll-down-active .spx-scrollCueArrow::before,
body.spx-prealpha.spx-scroll-down-active .spx-scrollCueArrow::after{
  transform:rotate(45deg) !important;
  opacity:inherit;
}
body.spx-prealpha .spx-scrollTopFab{
  width:60px;
  height:60px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(10,14,24,.88), rgba(7,10,17,.96));
  box-shadow:0 24px 58px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06);
}
body.spx-prealpha .spx-scrollTopFabIcon{
  width:14px;
  height:14px;
  border-top:2px solid currentColor;
  border-left:2px solid currentColor;
  transform:rotate(45deg) translateY(2px);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSwiper{
  overflow:hidden;
  touch-action:pan-x pinch-zoom;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
  scroll-snap-type:x proximity;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pinch-zoom;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack.is-dragging{
  scroll-snap-type:none;
  cursor:grabbing;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
  transition:transform .42s var(--spx-ease), opacity .32s ease, box-shadow .28s var(--spx-ease), border-color .28s var(--spx-ease), background .28s var(--spx-ease);
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard:hover{
  transform:translate3d(0, calc(var(--spx-news-card-y, 0px) - 2px), 0) scale(calc(var(--spx-news-card-scale, 1) + .004)) rotate(var(--spx-news-card-rot, 0deg));
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsArrow{
  border-radius:20px;
}
body.spx-prealpha .spx-footer{
  width:min(1480px, calc(100vw - 28px));
  max-width:none;
  margin-inline:auto;
  align-items:center;
}
@media (min-width:981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom:30vh;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height:108vh;
  }
  body.spx-prealpha .spx-visionWideStage{
    top:calc(var(--spx-header-height, 84px) + 54px);
    height:min(66vh, 620px);
    overflow:visible;
  }
  body.spx-prealpha .spx-visionWideBand{
    transition:none !important;
    will-change:transform, opacity;
  }
}
@media (max-width:980px){
  body.spx-prealpha .spx-shell{
    padding:calc(14px + var(--safeT)) calc(14px + var(--safeR)) calc(22px + var(--safeB)) calc(14px + var(--safeL));
  }
  body.spx-prealpha .spx-topbar{
    width:100%;
    top:calc(var(--safeT) + 8px);
    padding:12px;
    border-radius:20px;
    grid-template-columns:1fr auto;
  }
  body.spx-prealpha .spx-main,
  body.spx-prealpha .spx-section,
  body.spx-prealpha .spx-previewStage,
  body.spx-prealpha .spx-footer{
    width:100%;
    max-width:none;
  }
  body.spx-prealpha .spx-heroShell{
    margin-top:26px;
    padding-bottom:10px;
  }
  body.spx-prealpha .spx-kicker,
  body.spx-prealpha .spx-panelKicker{
    letter-spacing:.12em;
  }
  body.spx-prealpha .spx-tagline,
  body.spx-prealpha .spx-lead{
    font-size:15px;
    line-height:1.72;
  }
  body.spx-prealpha .spx-previewStageClean{
    margin-top:24px !important;
  }
  body.spx-prealpha .spx-previewBrowserClean{
    border-radius:22px;
  }
  body.spx-prealpha .spx-previewCaptionRow{
    grid-template-columns:1fr;
    gap:10px;
  }
  body.spx-prealpha .spx-storyRail{
    gap:72px !important;
    margin-top:52px !important;
  }
  body.spx-prealpha .spx-scrollFeature{
    min-height:auto !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
  body.spx-prealpha .spx-scrollFeatureVisual,
  body.spx-prealpha .spx-scrollFeatureCopy{
    position:relative !important;
    top:auto !important;
    min-height:auto !important;
    width:100% !important;
    margin:0 !important;
  }
  body.spx-prealpha .spx-showcaseScene,
  body.spx-prealpha .spx-showcaseBaseFrame,
  body.spx-prealpha .spx-showcasePanel,
  body.spx-prealpha .spx-showcasePanelSettings,
  body.spx-prealpha .spx-showcasePanelLayers{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
  }
  body.spx-prealpha .spx-showcaseScene{
    min-height:auto !important;
  }
  body.spx-prealpha .spx-showcaseBaseFrame{
    aspect-ratio:16 / 10;
  }
  body.spx-prealpha .spx-showcasePanelSettings,
  body.spx-prealpha .spx-showcasePanelLayers{
    position:relative !important;
    inset:auto !important;
    margin-top:14px !important;
  }
  body.spx-prealpha .spx-visionWideHead{
    margin-bottom:18px;
  }
  body.spx-prealpha .spx-visionWideHead h2{
    max-width:none;
    font-size:clamp(28px, 8vw, 40px);
  }
  body.spx-prealpha .spx-visionWideShell,
  body.spx-prealpha .spx-visionWideStage{
    position:relative;
    top:auto;
    width:100%;
    height:auto;
    padding:0;
    overflow:visible;
  }
  body.spx-prealpha .spx-visionWideBand{
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    min-height:auto;
    height:auto;
  }
  body.spx-prealpha .spx-visionWideScene,
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    min-height:auto !important;
    margin-top:18px !important;
  }
  body.spx-prealpha .spx-visionWideInner{
    grid-template-columns:1fr;
    gap:18px;
    padding:22px;
    min-height:auto;
  }
  body.spx-prealpha .spx-visionWideVisual{
    min-height:260px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead{
    align-items:center;
    gap:14px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
    --spx-news-gap:16px;
    padding-bottom:8px;
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex-basis:calc((100% - 12px) / 1.08);
    max-width:calc((100% - 12px) / 1.08);
  }
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
    min-height:334px;
  }
  body.spx-prealpha .spx-closingSection,
  body.spx-prealpha .spx-closingSection .spx-closingCardCentered,
  body.spx-prealpha .spx-footer{
    width:100%;
  }
  body.spx-prealpha .spx-closingCardCentered{
    text-align:center;
  }
  body.spx-prealpha .spx-closingCardCentered .spx-heroActions,
  body.spx-prealpha .spx-footer,
  body.spx-prealpha .spx-footerLinks{
    justify-content:center;
  }
}

/* --- pass125b layers content nudge left (based on user-selected pass125 reference) --- */
@media (min-width:1181px){
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    margin-left:-68px !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    margin-left:-58px !important;
  }
}


/* === PASS147 targeted stability fixes on top of user-selected pass125 base === */
body.spx-prealpha .spx-topbar{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-topbar{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

/* Keep sections centered without shifting the rest of the page */
body.spx-prealpha .spx-visionWideHead{
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center;
}
body.spx-prealpha .spx-visionWideHead p{
  margin-left:auto !important;
  margin-right:auto !important;
}
body.spx-prealpha .spx-visionWideStage,
body.spx-prealpha .spx-visionWideBand,
body.spx-prealpha .spx-closingCardCentered,
body.spx-prealpha .spx-footer{
  margin-left:auto !important;
  margin-right:auto !important;
}
body.spx-prealpha .spx-closingCardCentered,
body.spx-prealpha .spx-closingCardCentered .spx-heroActions,
body.spx-prealpha .spx-footer,
body.spx-prealpha .spx-footerLinks{
  justify-content:center;
  text-align:center;
}

/* Live Layers: only a slight extra move left on desktop, without breaking the mirrored settings layout */
@media (min-width:1181px){
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    margin-left:-68px !important;
    margin-right:0 !important;
  }
}
@media (min-width:1181px) and (max-width:1480px){
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    margin-left:-58px !important;
  }
}

/* Give card 3 more readable hold before the section continues */
@media (min-width:981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom:42vh !important;
  }
  body.spx-prealpha .spx-visionWideScene{
    min-height:116vh !important;
  }
}

/* Mobile header controls */
body.spx-prealpha .spx-themeToggleMobile{
  display:none;
}
@media (max-width:980px){
  body.spx-prealpha .spx-topbar{
    grid-template-columns:1fr auto auto !important;
    align-items:center !important;
  }
  body.spx-prealpha .spx-themeToggleMobile{
    display:inline-flex;
    width:50px;
    height:50px;
    min-width:50px;
    padding:0;
    justify-content:center;
    border-radius:18px;
  }
  body.spx-prealpha .spx-themeToggleMobile .spx-themeCaret{
    display:none !important;
  }
  body.spx-prealpha .spx-topActions .spx-themeToggleWrap{
    display:none !important;
  }
  body.spx-prealpha .spx-topActions[data-mobile-nav]{
    grid-column:1 / -1;
    grid-template-columns:1fr !important;
    width:100%;
  }
  body.spx-prealpha .spx-topActions .spx-btn.top,
  body.spx-prealpha .spx-topActions .spx-navProfileDrop,
  body.spx-prealpha .spx-topActions .spx-navProfileBtn,
  body.spx-prealpha .spx-topActions .spx-btn{
    width:100% !important;
    min-width:0 !important;
    justify-content:center !important;
  }
}


/* === PASS149: Vision heading centered + equal card timing support === */
body.spx-prealpha .spx-visionWideHead{
  max-width: 860px;
  margin: 0 auto 30px;
  text-align: center;
}
body.spx-prealpha .spx-visionWideHead h2,
body.spx-prealpha .spx-visionWideHead p{
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 980px){
  body.spx-prealpha .spx-visionWideHead{
    margin: 0 auto 24px;
    text-align: center;
  }
}

/* === PASS150: re-center sections from Our Vision onward without changing timing === */
@media (min-width:981px){
  body.spx-prealpha .spx-visionWide,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase,
  body.spx-prealpha .spx-closingSection,
  body.spx-prealpha .spx-footer{
    width:min(1320px, calc(100vw - 52px)) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.spx-prealpha .spx-visionWideHead,
  body.spx-prealpha .spx-visionWideShell,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase > .spx-newsShowcaseHead,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase > .spx-newsShowcaseFrame,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase > .spx-emptyNewsCard,
  body.spx-prealpha .spx-closingSection > .spx-closingCardCentered{
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase{
    grid-template-columns:1fr !important;
    justify-items:stretch !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseFrame,
  body.spx-prealpha .spx-closingCardCentered,
  body.spx-prealpha .spx-footer{
    justify-self:center !important;
  }

  body.spx-prealpha .spx-closingCardCentered,
  body.spx-prealpha .spx-closingCardCentered .spx-heroActions,
  body.spx-prealpha .spx-footer,
  body.spx-prealpha .spx-footerLinks{
    justify-content:center !important;
    text-align:center !important;
  }
}

/* --- pass152 layers copy fully back inside viewport, without breaking centered sections --- */
@media (min-width:1181px){
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    grid-column:1 !important;
    justify-self:start !important;
    width:clamp(520px, 36vw, 760px) !important;
    max-width:min(760px, calc(100vw - 56px)) !important;
    margin-left:clamp(12px, 1.8vw, 28px) !important;
    margin-right:auto !important;
    left:auto !important;
    right:auto !important;
  }

  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard.is-visible,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal],
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal]{
    opacity:0;
    transform:translateY(24px);
    filter:blur(8px);
  }

  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard[data-reveal].is-visible{
    opacity:1;
    transform:none;
    filter:none;
  }

  body.spx-prealpha .spx-scrollFeatureLayers .spx-panelKicker,
  body.spx-prealpha .spx-scrollFeatureLayers h2,
  body.spx-prealpha .spx-scrollFeatureLayers p,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-featurePoints{
    max-width:100% !important;
  }
}

@media (min-width:1181px) and (max-width:1480px){
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopy,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers.is-visible{
    width:clamp(480px, 40vw, 700px) !important;
    max-width:min(700px, calc(100vw - 40px)) !important;
    margin-left:clamp(10px, 1.4vw, 20px) !important;
  }
}


/* === PASS154: vision hold + smoother news scroll flow + longer explore cue === */
body.spx-prealpha .spx-scrollCueArrow{
  width:18px;
  height:18px;
  background:none !important;
  border:0 !important;
  opacity:.96;
}
body.spx-prealpha .spx-scrollCueArrow::before,
body.spx-prealpha .spx-scrollCueArrow::after{
  content:"";
  position:absolute;
  left:50%;
  width:10px;
  height:10px;
  margin-left:-5px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  border-radius:0 !important;
  background:none !important;
  box-shadow:none !important;
  transform:rotate(45deg) !important;
  transition:none !important;
}
body.spx-prealpha .spx-scrollCueArrow::before{ top:-1px; opacity:.98; }
body.spx-prealpha .spx-scrollCueArrow::after{ top:5px; opacity:.56; }
body.spx-prealpha .spx-scrollCue::after{ display:none !important; }

body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSwiper,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
  touch-action:pan-x pan-y pinch-zoom;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead,
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseFrame{
  transform:translate3d(0, calc((1 - var(--spx-news-section-progress, 1)) * 18px), 0);
  opacity:calc(.76 + (var(--spx-news-section-progress, 1) * .24));
  transition:transform .62s var(--spx-ease), opacity .52s ease;
  will-change:transform, opacity;
}
body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
  transform:translate3d(0, calc(((1 - var(--spx-news-section-progress, 1)) * 30px) + var(--spx-news-card-y, 0px)), 0) scale(var(--spx-news-card-scale, 1)) rotate(var(--spx-news-card-rot, 0deg));
}
@media (min-width:981px){
  body.spx-prealpha .spx-visionWideShell{
    padding-bottom:34vh;
  }
}

/* === PASS155: mobile story simplification + mobile vision/news refinement === */
@media (max-width:980px){
  body.spx-prealpha .spx-storyRail{
    gap:56px !important;
    margin-top:46px !important;
  }

  body.spx-prealpha .spx-scrollFeatureSettings,
  body.spx-prealpha .spx-scrollFeatureLayers{
    grid-template-columns:1fr !important;
    gap:16px !important;
    padding-inline:0 !important;
    min-height:auto !important;
  }

  body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureVisual,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureVisual{
    display:none !important;
  }

  body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureCopySettings,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyLayers,
  body.spx-prealpha .spx-scrollFeatureSettings .spx-scrollFeatureCopyCard,
  body.spx-prealpha .spx-scrollFeatureLayers .spx-scrollFeatureCopyCard{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    min-height:auto !important;
  }

  body.spx-prealpha .spx-scrollFeatureCopyCard{
    padding:20px 18px !important;
    border-radius:24px !important;
  }

  body.spx-prealpha .spx-scrollFeatureCopy h2{
    font-size:clamp(28px, 8vw, 38px) !important;
    line-height:1.08 !important;
    max-width:14ch !important;
  }

  body.spx-prealpha .spx-scrollFeatureCopy p{
    max-width:none !important;
    font-size:15px !important;
    line-height:1.72 !important;
  }

  body.spx-prealpha .spx-featurePoints{
    gap:10px !important;
  }

  body.spx-prealpha .spx-featurePoint{
    min-height:0 !important;
    padding:14px !important;
    transform:none !important;
  }

  body.spx-prealpha .spx-featurePointBody small{
    line-height:1.55 !important;
  }

  body.spx-prealpha .spx-visionWide{
    width:100% !important;
    max-width:none !important;
  }

  body.spx-prealpha .spx-visionWideShell{
    width:100% !important;
    margin-left:0 !important;
    padding-top:8px !important;
    padding-bottom:34vh !important;
    overflow:visible !important;
  }

  body.spx-prealpha .spx-visionWideStage{
    position:sticky !important;
    top:calc(var(--spx-header-height, 84px) + 42px) !important;
    width:100% !important;
    height:min(72vh, 580px) !important;
    margin:0 auto !important;
    overflow:visible !important;
    isolation:isolate;
  }

  body.spx-prealpha .spx-visionWideScene,
  body.spx-prealpha .spx-visionWideScene + .spx-visionWideScene{
    position:relative !important;
    min-height:86vh !important;
    margin-top:0 !important;
  }

  body.spx-prealpha .spx-visionWideBand{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    margin:0 !important;
    opacity:var(--spx-vision-card-opacity, 0) !important;
    visibility:var(--spx-vision-card-visibility, hidden) !important;
    z-index:var(--spx-vision-card-z, 1) !important;
    transform:translate3d(0, var(--spx-vision-card-y, 180px), 0) scale(var(--spx-vision-card-scale, 1)) !important;
    will-change:transform, opacity;
    transition:box-shadow .24s ease, border-color .24s ease, background .24s ease !important;
  }

  body.spx-prealpha .spx-visionWideInner{
    grid-template-columns:1fr !important;
    min-height:100% !important;
    height:100% !important;
    gap:14px !important;
    padding:20px !important;
    align-content:start !important;
  }

  body.spx-prealpha .spx-visionWideCopy{
    max-width:none !important;
  }

  body.spx-prealpha .spx-visionWideCopy h3{
    max-width:none !important;
    font-size:clamp(1.5rem, 6.8vw, 2.2rem) !important;
  }

  body.spx-prealpha .spx-visionWideCopy p{
    max-width:none !important;
    font-size:15px !important;
    line-height:1.68 !important;
  }

  body.spx-prealpha .spx-visionWideVisual{
    min-height:180px !important;
  }

  body.spx-prealpha .spx-visionWideMiniCard{
    width:min(260px, calc(100% - 36px)) !important;
    right:18px !important;
    bottom:18px !important;
    padding:14px 14px 12px !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase{
    width:100% !important;
    max-width:none !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsShowcaseHead{
    align-items:flex-end !important;
    gap:12px !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSwiper{
    overflow:visible !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsTrack{
    gap:14px !important;
    padding:6px 0 10px !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior-x:contain !important;
    overscroll-behavior-y:auto !important;
    touch-action:pan-x pan-y pinch-zoom !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsSlide{
    flex:0 0 calc((100% - 14px) / 1.5) !important;
    max-width:calc((100% - 14px) / 1.5) !important;
    scroll-snap-align:start !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard{
    min-height:300px !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardVisual,
  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard.spx-newsSlide .spx-newsCardVisual{
    min-height:150px !important;
    height:150px !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCardBody{
    padding:16px !important;
    gap:12px !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard h3{
    font-size:20px !important;
    line-height:1.14 !important;
  }

  body.spx-prealpha .spx-newsSection.spx-newsSimpleShowcase .spx-newsCard p{
    font-size:14px !important;
    line-height:1.62 !important;
  }
}

/* === PASS156: mobile toggle icon purple in dark mode + simplify mobile vision cards === */
@media (max-width:980px){
  html[data-spx-theme="dark"] body.spx-prealpha .spx-themeToggleMobile .spx-themeToggleIconMobile{
    filter: brightness(0) saturate(100%) invert(53%) sepia(64%) saturate(1828%) hue-rotate(230deg) brightness(101%) contrast(98%);
  }

  body.spx-prealpha .spx-visionWideVisual{
    display:none !important;
  }

  body.spx-prealpha .spx-visionWideInner{
    grid-template-columns:1fr !important;
    min-height:100% !important;
    height:100% !important;
    gap:0 !important;
    align-content:start !important;
  }

  body.spx-prealpha .spx-visionWideCopy{
    max-width:none !important;
  }
}

/* === PASS157: restore moon icon color, make mobile menu toggle purple in dark mode === */
@media (max-width:980px){
  html[data-spx-theme="dark"] body.spx-prealpha .spx-themeToggleMobile .spx-themeToggleIconMobile{
    filter:none !important;
  }

  html[data-spx-theme="dark"] body.spx-prealpha .spx-mobileNavToggle{
    border-color:rgba(145,112,255,.34) !important;
    background:linear-gradient(180deg, rgba(63,38,120,.22), rgba(21,14,44,.18)) !important;
    box-shadow:0 16px 36px rgba(49,23,112,.28) !important;
  }

  html[data-spx-theme="dark"] body.spx-prealpha .spx-mobileNavToggle span{
    background:#8f6bff !important;
  }

  html[data-spx-theme="dark"] body.spx-prealpha .spx-mobileNavToggle:hover,
  html[data-spx-theme="dark"] body.spx-prealpha .spx-topbar.is-mobile-open .spx-mobileNavToggle{
    border-color:rgba(145,112,255,.46) !important;
    background:linear-gradient(180deg, rgba(74,47,142,.28), rgba(25,17,52,.22)) !important;
  }
}


/* --- pass158 updates hub + archive rework --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-edge: clamp(18px, 4vw, 44px);
}
body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{
  gap: clamp(28px, 4vw, 46px);
}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar{
  position: sticky;
  top: 0;
  z-index: 90;
  backdrop-filter: blur(18px);
  background: linear-gradient(180deg, rgba(6,10,18,.82), rgba(6,10,18,.34));
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  border: 1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 18% 24%, rgba(124,58,237,.16), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(56,189,248,.12), transparent 30%),
    radial-gradient(circle at 58% 74%, rgba(236,72,153,.08), transparent 26%),
    linear-gradient(180deg, rgba(8,12,23,.88), rgba(6,10,19,.96));
  box-shadow: 0 30px 80px rgba(0,0,0,.24);
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  content:"";
  position:absolute;
  inset:-20% -10%;
  pointer-events:none;
  background:
    radial-gradient(circle at 22% 28%, rgba(138,92,255,.18), transparent 14%),
    radial-gradient(circle at 74% 32%, rgba(86,193,255,.14), transparent 16%),
    radial-gradient(circle at 60% 72%, rgba(255,146,225,.10), transparent 18%);
  opacity:.9;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
  max-width: none;
  padding: clamp(28px, 5vw, 54px);
}
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry{
  max-width: min(1320px, calc(100vw - (var(--spx-updates-edge) * 2)));
  margin: 0 auto;
}
body.spx-prealpha .spx-updatesMosaic{
  display:grid;
  grid-template-columns:minmax(0,1.48fr) minmax(340px,.92fr);
  gap:24px;
  align-items:stretch;
}
body.spx-prealpha .spx-updatesFeatureCard{
  min-height: 100%;
  padding: 0;
  overflow: hidden;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(9,13,24,.90), rgba(7,11,21,.98));
}
body.spx-prealpha .spx-updatesFeatureVisual{
  position:relative;
  min-height: clamp(260px, 34vw, 420px);
  background-position:center;
  background-size:cover;
}
body.spx-prealpha .spx-updatesFeatureShade{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(6,10,18,.12), rgba(6,10,18,.18) 38%, rgba(6,10,18,.78) 100%);
}
body.spx-prealpha .spx-updatesFeatureMeta{
  position:absolute;
  left:20px;
  right:20px;
  top:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  z-index:2;
}
body.spx-prealpha .spx-updatesFeatureBody{
  padding: clamp(22px, 3vw, 32px);
  display:grid;
  gap:14px;
}
body.spx-prealpha .spx-updatesFeatureBody h2{
  margin:0;
  font-size: clamp(30px, 4vw, 46px);
  line-height:1.03;
  letter-spacing:-.05em;
}
body.spx-prealpha .spx-updatesFeatureBody p{
  margin:0;
  max-width: 72ch;
  color: rgba(221,230,245,.80);
  line-height: 1.72;
}
body.spx-prealpha .spx-updatesFeatureActions{ margin-top: 4px; }
body.spx-prealpha .spx-updatesMiniGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:18px;
}
body.spx-prealpha .spx-updatesMiniCard{
  min-height: 0;
  border-radius: 24px;
  overflow: hidden;
  border:1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(11,16,29,.84), rgba(7,11,22,.95));
  box-shadow: 0 18px 46px rgba(0,0,0,.18);
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  transition: transform .32s var(--spx-ease), border-color .32s var(--spx-ease), box-shadow .32s var(--spx-ease);
}
body.spx-prealpha .spx-updatesMiniCard:hover{
  transform: translateY(-4px);
  border-color: rgba(145,180,255,.22);
  box-shadow: 0 24px 52px rgba(0,0,0,.22);
}
body.spx-prealpha .spx-updatesMiniVisual{
  position:relative;
  min-height: 130px;
  background-position:center;
  background-size:cover;
}
body.spx-prealpha .spx-updatesMiniVisual .spx-newsMetaTag{
  position:absolute;
  left:14px;
  top:14px;
}
body.spx-prealpha .spx-updatesMiniBody{
  padding:16px 16px 18px;
  display:grid;
  gap:10px;
}
body.spx-prealpha .spx-updatesMiniBody strong{
  font-size: 17px;
  line-height: 1.18;
  letter-spacing: -.02em;
}
body.spx-prealpha .spx-updatesMiniBody p{
  margin:0;
  color: rgba(216,227,244,.76);
  line-height: 1.6;
  font-size: 14px;
}
body.spx-prealpha .spx-updatesMiniCardEmpty{
  grid-column: span 2;
  min-height: 220px;
}
body.spx-prealpha .spx-updatesArchiveEntryCard{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding: clamp(22px, 3vw, 30px);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(9,13,24,.82), rgba(7,11,20,.96));
}
body.spx-prealpha .spx-updatesArchiveEntryCard h2{
  margin:6px 0 10px;
  font-size: clamp(28px, 3vw, 38px);
  line-height:1.08;
  letter-spacing:-.04em;
}
body.spx-prealpha .spx-updatesArchiveEntryCard p{
  margin:0;
  max-width: 68ch;
  line-height: 1.72;
  color: rgba(216,227,244,.76);
}
body.spx-prealpha .spx-updatesArchiveEntryMeta{
  display:grid;
  gap:12px;
  justify-items:end;
  flex:0 0 auto;
}
body.spx-prealpha .spx-updatesArchiveEntryMeta span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(230,238,250,.84);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.spx-prealpha .spx-updatesArchiveList{
  display:grid;
  gap:18px;
}
body.spx-prealpha .spx-updatesArchiveRow{
  display:grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr) auto;
  align-items:center;
  gap:22px;
  padding:18px;
  border-radius:28px;
  background: linear-gradient(180deg, rgba(9,13,24,.86), rgba(7,11,21,.96));
}
body.spx-prealpha .spx-updatesArchiveRowVisual{
  min-height: 168px;
  border-radius: 20px;
  background-position:center;
  background-size:cover;
}
body.spx-prealpha .spx-updatesArchiveRowBody{
  display:grid;
  gap:12px;
  min-width:0;
}
body.spx-prealpha .spx-updatesArchiveRowMeta{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
body.spx-prealpha .spx-updatesArchiveRowBody h2{
  margin:0;
  font-size: clamp(26px, 3vw, 34px);
  line-height:1.08;
  letter-spacing:-.04em;
}
body.spx-prealpha .spx-updatesArchiveRowBody p{
  margin:0;
  line-height:1.72;
  color: rgba(216,227,244,.78);
}
body.spx-prealpha .spx-updatesArchiveRowActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
body.spx-prealpha .spx-updatesArchivePagination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top: 22px;
}
body.spx-prealpha .spx-updatesArchivePageDots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
body.spx-prealpha .spx-updatesArchivePageDot{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color: inherit;
  text-decoration:none;
  font-weight:800;
}
body.spx-prealpha .spx-updatesArchivePageDot.is-active{
  border-color: rgba(138,92,255,.26);
  background: linear-gradient(180deg, rgba(138,92,255,.18), rgba(69,35,126,.18));
  box-shadow: 0 12px 30px rgba(73,33,138,.18);
}
body.spx-prealpha .spx-btn.is-disabled{
  pointer-events:none;
  opacity:.5;
}
@media (max-width: 1120px){
  body.spx-prealpha .spx-updatesMosaic{
    grid-template-columns:1fr;
  }
  body.spx-prealpha .spx-updatesArchiveEntryCard,
  body.spx-prealpha .spx-updatesArchiveRow{
    grid-template-columns:1fr;
  }
  body.spx-prealpha .spx-updatesArchiveEntryMeta{
    justify-items:start;
  }
  body.spx-prealpha .spx-updatesArchiveRowActions{
    justify-content:flex-start;
  }
}
@media (max-width: 760px){
  body.spx-prealpha .spx-updatesHero,
  body.spx-prealpha .spx-updatesArchiveHero{
    padding: 24px 18px;
    border-radius: 26px;
  }
  body.spx-prealpha .spx-updatesMosaicSection,
  body.spx-prealpha .spx-updatesArchiveListSection,
  body.spx-prealpha .spx-updatesArchiveEntry{
    max-width: calc(100vw - 32px);
  }
  body.spx-prealpha .spx-updatesMiniGrid{
    grid-template-columns:1fr;
  }
  body.spx-prealpha .spx-updatesMiniCardEmpty{ grid-column:auto; }
  body.spx-prealpha .spx-updatesFeatureVisual{
    min-height: 220px;
  }
  body.spx-prealpha .spx-updatesArchiveRow{
    padding:16px;
    border-radius:24px;
  }
  body.spx-prealpha .spx-updatesArchiveRowVisual{
    min-height: 150px;
  }
  body.spx-prealpha .spx-updatesArchivePagination{
    flex-direction:column;
    align-items:stretch;
  }
}

/* --- pass159 updates/archive background + layout polish --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  position:relative;
  overflow-x:hidden;
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before,
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before{
  z-index:-3;
  background:
    radial-gradient(circle at 14% 22%, rgba(112,76,255,.24), transparent 18%),
    radial-gradient(circle at 78% 18%, rgba(66,182,255,.18), transparent 16%),
    radial-gradient(circle at 62% 72%, rgba(255,116,211,.12), transparent 18%),
    radial-gradient(circle at 28% 74%, rgba(94,72,184,.16), transparent 24%),
    radial-gradient(circle at 54% 44%, rgba(18,27,56,.52), transparent 40%),
    linear-gradient(180deg, #040812 0%, #060a15 36%, #070b14 100%);
  filter:saturate(1.08) blur(.2px);
}
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after{
  z-index:-2;
  opacity:.82;
  background:
    radial-gradient(circle at 8% 16%, rgba(255,255,255,.98) 0 1px, transparent 1.7px),
    radial-gradient(circle at 22% 34%, rgba(255,255,255,.82) 0 1.1px, transparent 1.8px),
    radial-gradient(circle at 37% 12%, rgba(183,215,255,.78) 0 1px, transparent 1.7px),
    radial-gradient(circle at 48% 28%, rgba(255,255,255,.92) 0 1.2px, transparent 1.9px),
    radial-gradient(circle at 63% 20%, rgba(161,214,255,.72) 0 1px, transparent 1.7px),
    radial-gradient(circle at 76% 12%, rgba(255,255,255,.86) 0 1.1px, transparent 1.8px),
    radial-gradient(circle at 88% 26%, rgba(255,255,255,.76) 0 1px, transparent 1.7px),
    radial-gradient(circle at 14% 54%, rgba(255,255,255,.78) 0 1px, transparent 1.7px),
    radial-gradient(circle at 27% 68%, rgba(184,214,255,.72) 0 1.1px, transparent 1.8px),
    radial-gradient(circle at 52% 62%, rgba(255,255,255,.84) 0 1px, transparent 1.7px),
    radial-gradient(circle at 74% 58%, rgba(255,255,255,.76) 0 1.1px, transparent 1.8px),
    radial-gradient(circle at 90% 72%, rgba(255,255,255,.7) 0 1px, transparent 1.7px);
  background-size:100% 100%;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{
  opacity:.28;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  position:relative;
  z-index:2;
}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar{
  width:min(1380px, calc(100vw - 40px));
  margin-inline:auto;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  box-sizing:border-box;
  width:min(1360px, calc(100vw - 40px));
  margin-inline:auto;
  border:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 18% 24%, rgba(124,58,237,.20), transparent 30%),
    radial-gradient(circle at 82% 20%, rgba(56,189,248,.15), transparent 28%),
    radial-gradient(circle at 58% 76%, rgba(236,72,153,.10), transparent 22%),
    linear-gradient(180deg, rgba(9,13,25,.82), rgba(7,11,20,.94));
  backdrop-filter:blur(18px);
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
  text-align:center;
  max-width:960px;
  margin-inline:auto;
  padding:clamp(34px, 5vw, 62px) clamp(24px, 4vw, 40px);
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero .spx-kicker,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-kicker,
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero .spx-tagline,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-tagline,
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero .spx-lead,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-lead{
  margin-inline:auto;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero .spx-heroActions,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-heroActions{
  justify-content:center;
}
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry{
  display:block;
  width:min(1360px, calc(100vw - 40px));
  max-width:none;
  margin-inline:auto;
}
body.spx-prealpha .spx-updatesMosaic{
  grid-template-columns:minmax(0,1.26fr) minmax(360px,.94fr);
  gap:28px;
  align-items:stretch;
}
body.spx-prealpha .spx-updatesFeatureCard,
body.spx-prealpha .spx-updatesArchiveEntryCard,
body.spx-prealpha .spx-updatesArchiveRow{
  box-sizing:border-box;
  width:100%;
}
body.spx-prealpha .spx-updatesFeatureCard{
  min-height:100%;
}
body.spx-prealpha .spx-updatesFeatureVisual{
  min-height:clamp(320px, 34vw, 470px);
}
body.spx-prealpha .spx-updatesFeatureBody{
  padding:clamp(26px, 3.2vw, 38px);
  gap:16px;
}
body.spx-prealpha .spx-updatesFeatureBody p{
  max-width:64ch;
}
body.spx-prealpha .spx-updatesMiniGrid{
  gap:20px;
  align-content:start;
}
body.spx-prealpha .spx-updatesMiniCard{
  min-height:252px;
}
body.spx-prealpha .spx-updatesMiniVisual{
  min-height:148px;
}
body.spx-prealpha .spx-updatesMiniBody{
  padding:18px 18px 20px;
  gap:12px;
}
body.spx-prealpha .spx-updatesArchiveEntryCard{
  align-items:center;
  justify-content:space-between;
}
body.spx-prealpha .spx-updatesArchiveEntryCard > :first-child{
  max-width:760px;
}
body.spx-prealpha .spx-updatesArchiveList{
  gap:20px;
}
body.spx-prealpha .spx-updatesArchiveRow{
  grid-template-columns:minmax(240px, 340px) minmax(0, 1fr) auto;
  gap:24px;
  padding:20px;
}
body.spx-prealpha .spx-updatesArchiveRowVisual{
  min-height:184px;
}
body.spx-prealpha .spx-updatesArchivePagination{
  margin-top:26px;
}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  width:min(1360px, calc(100vw - 40px));
  margin-inline:auto;
}

html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::before{
  background:
    radial-gradient(circle at 18% 18%, rgba(247,196,120,.34), transparent 18%),
    radial-gradient(circle at 76% 24%, rgba(236,165,92,.26), transparent 16%),
    radial-gradient(circle at 54% 58%, rgba(224,156,82,.16), transparent 24%),
    radial-gradient(circle at 40% 44%, rgba(255,237,210,.20), transparent 36%),
    linear-gradient(180deg, #f7ecd9 0%, #ecd7b7 28%, #dcc09a 62%, #d0af87 100%);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::after,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::after{
  opacity:.55;
  background:
    radial-gradient(circle at 12% 22%, rgba(255,255,255,.64) 0 1px, transparent 1.9px),
    radial-gradient(circle at 28% 34%, rgba(255,247,228,.48) 0 1.2px, transparent 2px),
    radial-gradient(circle at 42% 18%, rgba(255,255,255,.46) 0 1px, transparent 1.8px),
    radial-gradient(circle at 66% 28%, rgba(255,245,218,.42) 0 1.2px, transparent 2px),
    radial-gradient(circle at 82% 18%, rgba(255,255,255,.50) 0 1px, transparent 1.8px),
    linear-gradient(115deg, rgba(255,244,221,.10) 0%, rgba(255,225,185,.24) 38%, rgba(217,168,104,.14) 62%, rgba(255,245,228,.08) 100%);
  filter:blur(.2px);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-topbar,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-topbar{
  background:linear-gradient(180deg, rgba(247,236,217,.86), rgba(247,236,217,.42));
  border-color:rgba(133,88,34,.10);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  border-color:rgba(145,96,40,.12);
  background:
    radial-gradient(circle at 18% 24%, rgba(247,194,119,.22), transparent 28%),
    radial-gradient(circle at 78% 20%, rgba(236,161,78,.18), transparent 24%),
    radial-gradient(circle at 52% 76%, rgba(194,129,57,.12), transparent 20%),
    linear-gradient(180deg, rgba(255,247,233,.88), rgba(243,228,204,.93));
  box-shadow:0 28px 70px rgba(126,82,28,.12);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesFeatureCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveEntryCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveRow{
  border-color:rgba(145,96,40,.12);
  background:linear-gradient(180deg, rgba(255,250,241,.94), rgba(244,231,211,.96));
  box-shadow:0 20px 48px rgba(124,86,40,.10);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesFeatureShade{
  background:linear-gradient(180deg, rgba(255,246,232,.04), rgba(246,225,194,.12) 40%, rgba(237,208,169,.70) 100%);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesFeatureBody p,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesMiniBody p,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveEntryCard p,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveRowBody p{
  color:rgba(80,59,36,.78);
}

@media (max-width: 1120px){
  body.spx-prealpha .spx-updatesMosaicSection,
  body.spx-prealpha .spx-updatesArchiveListSection,
  body.spx-prealpha .spx-updatesArchiveEntry,
  body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
  body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
  body.spx-prealpha.spx-updatesHubPage .spx-topbar,
  body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
  body.spx-prealpha.spx-updatesHubPage .spx-footer,
  body.spx-prealpha.spx-updatesArchivePage .spx-footer{
    width:calc(100vw - 32px);
  }
  body.spx-prealpha .spx-updatesMosaic{
    grid-template-columns:1fr;
  }
  body.spx-prealpha .spx-updatesMiniGrid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
  body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
    padding:26px 18px 28px;
  }
  body.spx-prealpha .spx-updatesMiniGrid{
    grid-template-columns:1fr;
  }
  body.spx-prealpha .spx-updatesMiniCard{
    min-height:0;
  }
  body.spx-prealpha .spx-updatesFeatureVisual{
    min-height:240px;
  }
  body.spx-prealpha .spx-updatesArchiveRow{
    grid-template-columns:1fr;
  }
}


/* --- pass160 updates cosmos + mars hero refinement --- */
@keyframes spxUpdatesNebulaDrift{
  0%{transform:translate3d(0,0,0) scale(1);opacity:.86}
  50%{transform:translate3d(-1.5%,1.2%,0) scale(1.045);opacity:1}
  100%{transform:translate3d(1.2%,-1.4%,0) scale(1.03);opacity:.9}
}
@keyframes spxUpdatesStarsFloat{
  0%{transform:translate3d(0,0,0);opacity:.7}
  50%{transform:translate3d(0,-10px,0);opacity:.95}
  100%{transform:translate3d(-8px,-18px,0);opacity:.78}
}
@keyframes spxUpdatesStarsTwinkle{
  0%,100%{opacity:.55}
  25%{opacity:.9}
  50%{opacity:.68}
  75%{opacity:1}
}
@keyframes spxMarsDustDrift{
  0%{transform:translate3d(0,0,0) scale(1);opacity:.58}
  50%{transform:translate3d(2.2%,-1.8%,0) scale(1.035);opacity:.82}
  100%{transform:translate3d(-1.8%,1.2%,0) scale(1.02);opacity:.62}
}
@keyframes spxMarsParticleSweep{
  0%{transform:translate3d(-4%,0,0);opacity:.16}
  50%{transform:translate3d(2%, -1.2%,0);opacity:.34}
  100%{transform:translate3d(6%,-2.4%,0);opacity:.2}
}

body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1420px, calc(100vw - 56px));
  overflow-x:hidden;
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before{
  background:
    radial-gradient(circle at 12% 18%, rgba(144,92,255,.30), transparent 0 13%),
    radial-gradient(circle at 24% 28%, rgba(69,124,255,.18), transparent 0 16%),
    radial-gradient(circle at 78% 16%, rgba(87,210,255,.18), transparent 0 12%),
    radial-gradient(circle at 68% 30%, rgba(144,80,255,.12), transparent 0 15%),
    radial-gradient(circle at 54% 56%, rgba(255,115,214,.10), transparent 0 18%),
    radial-gradient(circle at 32% 74%, rgba(85,58,185,.18), transparent 0 22%),
    radial-gradient(circle at 72% 78%, rgba(26,49,114,.28), transparent 0 24%),
    radial-gradient(circle at 50% 48%, rgba(6,18,44,.72), transparent 0 42%),
    linear-gradient(180deg, #02050c 0%, #050915 28%, #060b16 58%, #050811 100%);
  animation:spxUpdatesNebulaDrift 26s ease-in-out infinite alternate;
  filter:saturate(1.14);
}
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after{
  background:
    radial-gradient(circle at 6% 12%, rgba(255,255,255,.98) 0 1px, transparent 1.8px),
    radial-gradient(circle at 14% 22%, rgba(255,255,255,.74) 0 1px, transparent 1.8px),
    radial-gradient(circle at 23% 32%, rgba(197,228,255,.86) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 31% 14%, rgba(255,255,255,.92) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 42% 24%, rgba(173,211,255,.72) 0 1px, transparent 1.8px),
    radial-gradient(circle at 52% 14%, rgba(255,255,255,.88) 0 1.2px, transparent 2px),
    radial-gradient(circle at 61% 30%, rgba(255,255,255,.82) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 73% 18%, rgba(201,228,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 82% 28%, rgba(255,255,255,.88) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 92% 16%, rgba(255,255,255,.8) 0 1px, transparent 1.8px),
    radial-gradient(circle at 10% 58%, rgba(255,255,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 26% 68%, rgba(183,218,255,.72) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 41% 62%, rgba(255,255,255,.84) 0 1px, transparent 1.8px),
    radial-gradient(circle at 57% 72%, rgba(255,255,255,.76) 0 1px, transparent 1.8px),
    radial-gradient(circle at 72% 62%, rgba(191,224,255,.78) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 86% 72%, rgba(255,255,255,.8) 0 1px, transparent 1.8px),
    radial-gradient(circle at 94% 58%, rgba(255,255,255,.72) 0 1px, transparent 1.8px);
  background-size:100% 100%;
  animation:spxUpdatesStarsFloat 30s linear infinite, spxUpdatesStarsTwinkle 7s ease-in-out infinite alternate;
  opacity:.9;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{opacity:.18}
body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{gap:clamp(42px, 5vw, 72px)}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry,
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{width:var(--spx-updates-page-width)}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar{background:linear-gradient(180deg, rgba(6,10,18,.58), rgba(6,10,18,.18));border-color:rgba(255,255,255,.08)}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  overflow:hidden;
  background:
    radial-gradient(circle at 14% 22%, rgba(122,74,255,.18), transparent 0 18%),
    radial-gradient(circle at 82% 20%, rgba(89,210,255,.14), transparent 0 16%),
    radial-gradient(circle at 48% 78%, rgba(255,102,198,.08), transparent 0 18%),
    linear-gradient(180deg, rgba(11,15,28,.50), rgba(7,11,20,.62));
  backdrop-filter:blur(22px);
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  content:"";
  position:absolute;inset:-8% -6%;pointer-events:none;
  background:
    radial-gradient(circle at 16% 30%, rgba(165,96,255,.18), transparent 0 12%),
    radial-gradient(circle at 72% 24%, rgba(112,226,255,.14), transparent 0 10%),
    radial-gradient(circle at 58% 70%, rgba(255,130,223,.10), transparent 0 14%);
  opacity:.95;
  animation:spxUpdatesNebulaDrift 18s ease-in-out infinite alternate;
}
body.spx-prealpha .spx-updatesHero{padding:clamp(26px, 4vw, 42px) clamp(24px, 3.8vw, 42px)}
body.spx-prealpha .spx-updatesArchiveHero{padding:clamp(22px, 3.6vw, 34px) clamp(22px, 3.6vw, 34px)}
body.spx-prealpha .spx-updatesHeroBar{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:16px;
  width:100%;
  margin:0 0 20px;
}
body.spx-prealpha .spx-updatesHeroIntro{
  width:min(100%, 980px);
  margin-inline:auto;
  display:grid;
  gap:14px;
  justify-items:center;
  text-align:center;
}
body.spx-prealpha .spx-updatesHeroIntroArchive{width:min(100%, 860px)}
body.spx-prealpha .spx-updatesHeroTitle{
  margin:0;
  font-size:clamp(34px, 5.4vw, 72px);
  line-height:1.02;
  letter-spacing:-.045em;
  font-weight:700;
}
body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{font-size:clamp(28px, 4.4vw, 54px)}
body.spx-prealpha .spx-updatesHero .spx-tagline,
body.spx-prealpha .spx-updatesArchiveHero .spx-tagline{max-width:760px}
body.spx-prealpha .spx-updatesHero .spx-lead,
body.spx-prealpha .spx-updatesArchiveHero .spx-lead{max-width:780px;font-size:clamp(15px, 1.55vw, 18px)}
body.spx-prealpha .spx-updatesHeroArchiveBtn{justify-self:end}
body.spx-prealpha .spx-updatesMosaicSection{margin-top:clamp(8px, 1.6vw, 16px)}
body.spx-prealpha .spx-updatesArchiveEntry{margin-top:clamp(4px, 1.2vw, 12px); margin-bottom:clamp(14px, 2vw, 24px)}
body.spx-prealpha .spx-updatesMosaic{gap:36px;align-items:stretch}
body.spx-prealpha .spx-updatesMiniGrid{gap:22px}
body.spx-prealpha .spx-updatesArchiveList{gap:24px}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{margin-top:clamp(10px, 1.4vw, 18px)}

html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::before{
  background:
    radial-gradient(circle at 18% 16%, rgba(255,228,171,.34), transparent 0 18%),
    radial-gradient(circle at 72% 18%, rgba(232,150,90,.22), transparent 0 16%),
    radial-gradient(circle at 56% 46%, rgba(198,104,58,.16), transparent 0 20%),
    radial-gradient(circle at 36% 76%, rgba(158,74,38,.18), transparent 0 22%),
    radial-gradient(circle at 78% 78%, rgba(108,43,28,.14), transparent 0 24%),
    linear-gradient(180deg, #f6e6c9 0%, #e8c596 28%, #d08e5d 62%, #a85736 100%);
  animation:spxMarsDustDrift 22s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::after,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::after{
  background:
    linear-gradient(108deg, rgba(255,247,225,.04) 0%, rgba(255,240,216,.14) 16%, rgba(240,165,104,.06) 28%, transparent 34%),
    linear-gradient(112deg, transparent 0%, rgba(210,111,59,.10) 18%, rgba(240,166,98,.16) 34%, transparent 52%),
    linear-gradient(115deg, transparent 10%, rgba(202,90,54,.16) 26%, rgba(235,145,84,.18) 38%, transparent 54%),
    radial-gradient(circle at 14% 24%, rgba(255,246,228,.16) 0 1px, transparent 1.8px),
    radial-gradient(circle at 32% 52%, rgba(255,222,189,.20) 0 1.4px, transparent 2.2px),
    radial-gradient(circle at 58% 28%, rgba(255,234,208,.16) 0 1.1px, transparent 2px),
    radial-gradient(circle at 76% 56%, rgba(255,214,176,.18) 0 1.3px, transparent 2.2px),
    radial-gradient(circle at 88% 32%, rgba(255,236,212,.14) 0 1px, transparent 1.9px);
  opacity:.68;
  filter:blur(.3px);
  animation:spxMarsParticleSweep 12s linear infinite;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-topbar,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-topbar{
  background:linear-gradient(180deg, rgba(249,236,214,.66), rgba(249,236,214,.28));
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:
    radial-gradient(circle at 18% 22%, rgba(255,210,136,.18), transparent 0 20%),
    radial-gradient(circle at 78% 18%, rgba(233,132,78,.14), transparent 0 18%),
    radial-gradient(circle at 46% 80%, rgba(184,96,56,.12), transparent 0 18%),
    linear-gradient(180deg, rgba(255,246,230,.56), rgba(244,222,193,.68));
  border-color:rgba(127,71,35,.12);
  box-shadow:0 28px 70px rgba(122,73,40,.12);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesFeatureCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveEntryCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveRow{
  background:linear-gradient(180deg, rgba(255,249,239,.92), rgba(245,229,205,.95));
}

@media (max-width: 1120px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{--spx-updates-page-width:calc(100vw - 32px)}
  body.spx-prealpha .spx-updatesHeroBar{grid-template-columns:1fr}
  body.spx-prealpha .spx-updatesHeroArchiveBtn{justify-self:start}
}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{--spx-updates-page-width:calc(100vw - 22px)}
  body.spx-prealpha .spx-updatesHero,
  body.spx-prealpha .spx-updatesArchiveHero{padding:20px 16px 24px}
  body.spx-prealpha .spx-updatesHeroTitle{font-size:clamp(28px, 8.6vw, 42px)}
  body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{font-size:clamp(24px, 7.8vw, 34px)}
  body.spx-prealpha .spx-updatesMosaicSection,
  body.spx-prealpha .spx-updatesArchiveListSection,
  body.spx-prealpha .spx-updatesArchiveEntry{margin-top:0}
}


/* --- pass161 cinematic updates/archive backgrounds + compact hero --- */
@keyframes spxDeepFieldDrift{
  0%{transform:translate3d(-1.5%, -1.2%, 0) scale(1.02)}
  50%{transform:translate3d(1.2%, 1.1%, 0) scale(1.05)}
  100%{transform:translate3d(2.1%, -0.8%, 0) scale(1.03)}
}
@keyframes spxDeepFieldPulse{
  0%{opacity:.42; filter:blur(0px) saturate(1.06)}
  50%{opacity:.62; filter:blur(1.8px) saturate(1.18)}
  100%{opacity:.48; filter:blur(.4px) saturate(1.1)}
}
@keyframes spxDeepStarsSweep{
  0%{transform:translate3d(0,0,0) scale(1); opacity:.8}
  50%{transform:translate3d(-1.2%, 1.4%, 0) scale(1.04); opacity:1}
  100%{transform:translate3d(1.6%, -1.1%, 0) scale(1.02); opacity:.86}
}
@keyframes spxDeepDustFlow{
  0%{transform:translate3d(-3%, 0, 0) scale(1.04); opacity:.22}
  50%{transform:translate3d(1.8%, -1.6%, 0) scale(1.08); opacity:.34}
  100%{transform:translate3d(4%, -3%, 0) scale(1.06); opacity:.24}
}
@keyframes spxMarsWindField{
  0%{transform:translate3d(-4%, 0, 0) scale(1.02); opacity:.24}
  50%{transform:translate3d(2.2%, -1.4%, 0) scale(1.06); opacity:.42}
  100%{transform:translate3d(5.2%, -2.8%, 0) scale(1.04); opacity:.28}
}
@keyframes spxMarsDustSpecks{
  0%{transform:translate3d(0,0,0); opacity:.34}
  50%{transform:translate3d(-1.4%, 1.2%, 0); opacity:.58}
  100%{transform:translate3d(2.4%, -1.2%, 0); opacity:.4}
}

body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1460px, calc(100vw - 72px));
}
body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  isolation:isolate;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before,
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after{
  content:"";
  position:fixed;
  inset:-10% -8%;
  pointer-events:none;
  z-index:0;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
  background:
    radial-gradient(40% 34% at 10% 18%, rgba(132,92,255,.34), transparent 58%),
    radial-gradient(36% 30% at 82% 14%, rgba(76,166,255,.26), transparent 54%),
    radial-gradient(28% 26% at 62% 50%, rgba(255,106,216,.18), transparent 56%),
    radial-gradient(42% 38% at 26% 76%, rgba(81,62,184,.24), transparent 58%),
    radial-gradient(34% 28% at 78% 78%, rgba(31,56,136,.22), transparent 56%);
  opacity:.9;
  animation:spxDeepFieldDrift 34s ease-in-out infinite alternate, spxDeepFieldPulse 18s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after{
  background:
    radial-gradient(circle at 4% 10%, rgba(255,255,255,.98) 0 1px, transparent 1.8px),
    radial-gradient(circle at 8% 38%, rgba(218,234,255,.8) 0 1px, transparent 1.8px),
    radial-gradient(circle at 12% 72%, rgba(255,255,255,.9) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 18% 20%, rgba(196,225,255,.82) 0 1.1px, transparent 2px),
    radial-gradient(circle at 22% 48%, rgba(255,255,255,.76) 0 1px, transparent 1.8px),
    radial-gradient(circle at 26% 84%, rgba(255,255,255,.72) 0 1px, transparent 1.8px),
    radial-gradient(circle at 32% 12%, rgba(255,255,255,.92) 0 1px, transparent 1.8px),
    radial-gradient(circle at 36% 56%, rgba(190,223,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 42% 24%, rgba(255,255,255,.86) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 46% 74%, rgba(255,255,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 52% 14%, rgba(205,230,255,.9) 0 1.1px, transparent 2px),
    radial-gradient(circle at 58% 46%, rgba(255,255,255,.8) 0 1px, transparent 1.8px),
    radial-gradient(circle at 62% 82%, rgba(255,255,255,.86) 0 1px, transparent 1.8px),
    radial-gradient(circle at 68% 10%, rgba(255,255,255,.96) 0 1.2px, transparent 2px),
    radial-gradient(circle at 72% 34%, rgba(191,223,255,.76) 0 1px, transparent 1.8px),
    radial-gradient(circle at 78% 62%, rgba(255,255,255,.88) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 84% 22%, rgba(255,255,255,.82) 0 1px, transparent 1.8px),
    radial-gradient(circle at 88% 54%, rgba(219,234,255,.8) 0 1px, transparent 1.8px),
    radial-gradient(circle at 94% 16%, rgba(255,255,255,.9) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 96% 74%, rgba(255,255,255,.74) 0 1px, transparent 1.8px);
  opacity:.94;
  animation:spxDeepStarsSweep 44s linear infinite, spxUpdatesStarsTwinkle 6.5s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before{
  background:
    radial-gradient(36% 28% at 14% 12%, rgba(159,114,255,.28), transparent 58%),
    radial-gradient(26% 24% at 28% 34%, rgba(86,139,255,.18), transparent 54%),
    radial-gradient(22% 18% at 74% 18%, rgba(113,225,255,.18), transparent 52%),
    radial-gradient(28% 24% at 56% 60%, rgba(255,121,216,.12), transparent 54%),
    radial-gradient(32% 28% at 22% 80%, rgba(76,54,165,.20), transparent 58%),
    radial-gradient(34% 30% at 78% 80%, rgba(20,40,108,.26), transparent 58%),
    linear-gradient(180deg, #02040a 0%, #050914 34%, #070c18 62%, #060911 100%);
  filter:saturate(1.18) contrast(1.06);
  animation:spxUpdatesNebulaDrift 42s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after{
  background:
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,.035) 18%, transparent 30%),
    linear-gradient(132deg, transparent 10%, rgba(185,210,255,.05) 26%, transparent 42%),
    radial-gradient(circle at 12% 44%, rgba(255,255,255,.7) 0 1px, transparent 1.8px),
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.56) 0 1px, transparent 1.8px),
    radial-gradient(circle at 68% 42%, rgba(214,228,255,.6) 0 1px, transparent 1.8px),
    radial-gradient(circle at 82% 64%, rgba(255,255,255,.52) 0 1px, transparent 1.8px),
    radial-gradient(circle at 24% 74%, rgba(255,255,255,.5) 0 1px, transparent 1.8px),
    radial-gradient(circle at 56% 82%, rgba(214,228,255,.46) 0 1px, transparent 1.8px);
  opacity:.66;
  animation:spxDeepDustFlow 26s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{opacity:.12;filter:blur(.2px)}
body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{gap:clamp(54px, 6vw, 88px)}
body.spx-prealpha .spx-updatesArchiveEntry{display:none !important}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  width:var(--spx-updates-page-width);
  min-height:auto;
  padding:0;
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(9,14,28,.62), rgba(8,12,22,.44));
  box-shadow:0 28px 90px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05);
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  inset:-10% -8%;
  background:
    radial-gradient(36% 30% at 10% 22%, rgba(163,101,255,.22), transparent 56%),
    radial-gradient(24% 24% at 86% 18%, rgba(109,218,255,.18), transparent 52%),
    radial-gradient(28% 24% at 62% 78%, rgba(255,119,211,.12), transparent 54%);
  animation:spxUpdatesNebulaDrift 24s ease-in-out infinite alternate;
}
body.spx-prealpha .spx-updatesHero,
body.spx-prealpha .spx-updatesArchiveHero{
  padding:clamp(18px, 2.2vw, 24px) clamp(20px, 2.6vw, 30px);
}
body.spx-prealpha .spx-updatesHeroBar{margin:0 0 14px;min-height:42px}
body.spx-prealpha .spx-updatesHeroIntro,
body.spx-prealpha .spx-updatesHeroIntroArchive{
  width:min(100%, 940px);
  gap:8px;
}
body.spx-prealpha .spx-updatesHeroTitle{
  font-size:clamp(28px, 3.9vw, 44px);
  letter-spacing:-.038em;
}
body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{
  font-size:clamp(26px, 3.5vw, 38px);
}
body.spx-prealpha .spx-updatesHero .spx-tagline,
body.spx-prealpha .spx-updatesArchiveHero .spx-tagline{
  margin:0;
  max-width:780px;
  font-size:clamp(14px, 1.45vw, 17px);
  line-height:1.7;
}
body.spx-prealpha .spx-updatesHero .spx-lead,
body.spx-prealpha .spx-updatesArchiveHero .spx-lead{display:none}
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection{margin-top:clamp(4px, 1vw, 12px)}
body.spx-prealpha .spx-updatesMosaic{gap:42px}
body.spx-prealpha .spx-updatesMiniGrid{gap:24px}
body.spx-prealpha .spx-updatesFeatureCard,
body.spx-prealpha .spx-updatesMiniCard,
body.spx-prealpha .spx-updatesArchiveRow{
  backdrop-filter:blur(16px);
  background:linear-gradient(180deg, rgba(14,20,36,.84), rgba(10,14,26,.78));
}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{margin-top:clamp(18px, 2.4vw, 30px)}

html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::before{
  background:
    radial-gradient(44% 34% at 16% 14%, rgba(255,232,177,.38), transparent 58%),
    radial-gradient(30% 26% at 76% 16%, rgba(232,140,82,.28), transparent 54%),
    radial-gradient(28% 24% at 46% 46%, rgba(188,86,48,.20), transparent 56%),
    radial-gradient(42% 30% at 28% 82%, rgba(154,66,37,.26), transparent 58%),
    radial-gradient(38% 28% at 82% 78%, rgba(106,40,27,.22), transparent 56%),
    linear-gradient(180deg, #f6ead5 0%, #e4be8d 26%, #c7774c 58%, #8a452f 100%);
  animation:spxMarsWindField 24s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::after,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::after{
  background:
    linear-gradient(112deg, transparent 0%, rgba(255,233,204,.08) 14%, transparent 28%),
    linear-gradient(118deg, transparent 10%, rgba(228,126,67,.14) 24%, rgba(245,173,111,.12) 36%, transparent 50%),
    linear-gradient(124deg, transparent 18%, rgba(184,83,46,.18) 34%, transparent 48%),
    radial-gradient(circle at 12% 18%, rgba(255,240,220,.22) 0 1px, transparent 1.9px),
    radial-gradient(circle at 30% 46%, rgba(255,219,186,.24) 0 1.3px, transparent 2.2px),
    radial-gradient(circle at 58% 22%, rgba(255,232,205,.18) 0 1.1px, transparent 2px),
    radial-gradient(circle at 72% 58%, rgba(255,214,180,.20) 0 1.2px, transparent 2.2px),
    radial-gradient(circle at 90% 34%, rgba(255,236,214,.18) 0 1px, transparent 1.9px);
  opacity:.82;
  animation:spxMarsDustSpecks 14s linear infinite, spxMarsParticleSweep 10s linear infinite;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
  background:
    radial-gradient(42% 34% at 10% 24%, rgba(255,221,168,.28), transparent 58%),
    radial-gradient(30% 26% at 78% 20%, rgba(218,111,61,.26), transparent 56%),
    radial-gradient(34% 28% at 54% 72%, rgba(165,74,41,.22), transparent 56%),
    radial-gradient(36% 28% at 24% 86%, rgba(129,52,34,.18), transparent 56%);
  opacity:.92;
  animation:spxMarsWindField 20s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-shell::after{
  background:
    radial-gradient(circle at 16% 22%, rgba(255,235,205,.24) 0 1px, transparent 1.8px),
    radial-gradient(circle at 28% 54%, rgba(255,214,180,.28) 0 1.2px, transparent 2px),
    radial-gradient(circle at 44% 16%, rgba(255,232,211,.22) 0 1px, transparent 1.8px),
    radial-gradient(circle at 66% 46%, rgba(255,204,160,.24) 0 1.2px, transparent 2px),
    radial-gradient(circle at 84% 30%, rgba(255,236,214,.20) 0 1px, transparent 1.8px),
    radial-gradient(circle at 90% 68%, rgba(255,212,174,.22) 0 1.1px, transparent 1.9px);
  opacity:.72;
  animation:spxMarsDustSpecks 13s linear infinite;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(180deg, rgba(255,245,228,.68), rgba(242,220,191,.52));
  border-color:rgba(134,70,38,.12);
  box-shadow:0 28px 82px rgba(139,80,46,.14), inset 0 1px 0 rgba(255,255,255,.35);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  background:
    radial-gradient(34% 30% at 14% 22%, rgba(255,205,126,.22), transparent 56%),
    radial-gradient(26% 24% at 82% 20%, rgba(228,130,76,.18), transparent 52%),
    radial-gradient(28% 22% at 56% 80%, rgba(170,84,49,.14), transparent 54%);
}
@media (max-width: 1120px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{--spx-updates-page-width:calc(100vw - 32px)}
}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{--spx-updates-page-width:calc(100vw - 18px)}
  body.spx-prealpha .spx-updatesHero,
  body.spx-prealpha .spx-updatesArchiveHero{padding:16px 14px 18px}
  body.spx-prealpha .spx-updatesHeroTitle{font-size:clamp(24px, 7vw, 34px)}
  body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{font-size:clamp(22px, 6.5vw, 30px)}
  body.spx-prealpha .spx-updatesHeroBar{gap:10px}
  body.spx-prealpha .spx-updatesMiniGrid{gap:16px}
}


/* --- pass162 movie-grade updates/archive scene + compact editorial hero --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1480px, calc(100vw - 72px));
  --spx-updates-mx:0;
  --spx-updates-my:0;
  --spx-updates-scroll:0;
}
body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{
  position:relative;
  gap:clamp(34px, 4.8vw, 72px);
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before,
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after,
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before,
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after,
body.spx-prealpha.spx-updatesHubPage .spx-main::before,
body.spx-prealpha.spx-updatesArchivePage .spx-main::before,
body.spx-prealpha.spx-updatesHubPage .spx-main::after,
body.spx-prealpha.spx-updatesArchivePage .spx-main::after,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::after{
  content:"";
  pointer-events:none;
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before{
  position:fixed;
  inset:-12%;
  z-index:-5;
  background:
    radial-gradient(44% 38% at 10% 14%, rgba(116,82,255,.34), transparent 58%),
    radial-gradient(26% 24% at 26% 34%, rgba(67,162,255,.18), transparent 52%),
    radial-gradient(34% 32% at 82% 16%, rgba(84,205,255,.18), transparent 54%),
    radial-gradient(24% 22% at 56% 44%, rgba(255,118,214,.12), transparent 54%),
    radial-gradient(30% 30% at 18% 80%, rgba(70,53,175,.24), transparent 56%),
    radial-gradient(38% 34% at 78% 84%, rgba(24,42,112,.30), transparent 58%),
    linear-gradient(180deg, #02040a 0%, #040814 34%, #060b17 62%, #070d1a 100%);
  transform:translate3d(calc(var(--spx-updates-mx) * -10px), calc(var(--spx-updates-my) * -8px), 0) scale(1.06);
  filter:saturate(1.18) contrast(1.08);
  animation:spxDeepFieldDrift 34s ease-in-out infinite alternate, spxDeepFieldPulse 14s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after{
  position:fixed;
  inset:-16%;
  z-index:-4;
  background:
    radial-gradient(circle at 3% 8%, rgba(255,255,255,.98) 0 1px, transparent 1.7px),
    radial-gradient(circle at 7% 20%, rgba(214,231,255,.9) 0 1.15px, transparent 1.95px),
    radial-gradient(circle at 12% 44%, rgba(255,255,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 17% 78%, rgba(255,255,255,.92) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 24% 14%, rgba(187,223,255,.78) 0 1px, transparent 1.8px),
    radial-gradient(circle at 29% 36%, rgba(255,255,255,.85) 0 1px, transparent 1.8px),
    radial-gradient(circle at 34% 68%, rgba(210,232,255,.74) 0 1.05px, transparent 1.85px),
    radial-gradient(circle at 41% 22%, rgba(255,255,255,.88) 0 1px, transparent 1.8px),
    radial-gradient(circle at 46% 58%, rgba(255,255,255,.78) 0 1.15px, transparent 2px),
    radial-gradient(circle at 53% 10%, rgba(199,227,255,.82) 0 1.05px, transparent 1.9px),
    radial-gradient(circle at 59% 42%, rgba(255,255,255,.92) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 66% 78%, rgba(255,255,255,.74) 0 1px, transparent 1.75px),
    radial-gradient(circle at 72% 18%, rgba(208,231,255,.76) 0 1px, transparent 1.8px),
    radial-gradient(circle at 77% 56%, rgba(255,255,255,.86) 0 1.1px, transparent 1.9px),
    radial-gradient(circle at 84% 28%, rgba(255,255,255,.8) 0 1px, transparent 1.8px),
    radial-gradient(circle at 89% 64%, rgba(194,226,255,.78) 0 1.05px, transparent 1.85px),
    radial-gradient(circle at 95% 14%, rgba(255,255,255,.92) 0 1.1px, transparent 1.95px),
    radial-gradient(circle at 98% 82%, rgba(255,255,255,.72) 0 1px, transparent 1.8px);
  opacity:.96;
  transform:translate3d(calc(var(--spx-updates-mx) * 16px), calc(var(--spx-updates-my) * 12px), 0) scale(1.08);
  animation:spxDeepStarsSweep 54s linear infinite, spxUpdatesStarsTwinkle 5.5s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
  position:fixed;
  inset:-14%;
  z-index:-3;
  background:
    radial-gradient(40% 32% at 16% 30%, rgba(129,88,255,.30), transparent 56%),
    radial-gradient(34% 28% at 74% 18%, rgba(68,175,255,.20), transparent 54%),
    radial-gradient(26% 24% at 62% 54%, rgba(255,113,211,.12), transparent 54%),
    radial-gradient(32% 30% at 30% 82%, rgba(57,74,194,.18), transparent 58%);
  filter:blur(42px) saturate(1.28);
  opacity:.9;
  transform:translate3d(calc(var(--spx-updates-mx) * -24px), calc(var(--spx-updates-my) * -18px), 0) scale(1.1);
  animation:spxUpdatesNebulaDrift 28s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after{
  position:fixed;
  inset:-8%;
  z-index:-2;
  background:
    linear-gradient(118deg, transparent 0%, rgba(255,255,255,.04) 16%, transparent 28%),
    linear-gradient(124deg, transparent 14%, rgba(155,190,255,.05) 30%, transparent 44%),
    radial-gradient(36% 24% at 18% 72%, rgba(255,255,255,.06), transparent 70%),
    radial-gradient(28% 20% at 80% 28%, rgba(168,211,255,.06), transparent 70%);
  mix-blend-mode:screen;
  opacity:.62;
  transform:translate3d(calc(var(--spx-updates-mx) * 10px), calc(var(--spx-updates-my) * 6px), 0);
  animation:spxDeepDustFlow 22s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage .spx-main::before,
body.spx-prealpha.spx-updatesArchivePage .spx-main::before{
  position:absolute;
  inset:clamp(56px, 8vw, 88px) 0 auto;
  height:clamp(180px, 24vw, 320px);
  z-index:0;
  background:
    radial-gradient(30% 60% at 18% 50%, rgba(110,74,255,.18), transparent 72%),
    radial-gradient(34% 60% at 82% 42%, rgba(66,191,255,.12), transparent 72%),
    radial-gradient(40% 74% at 50% 58%, rgba(255,123,219,.08), transparent 72%);
  filter:blur(18px);
  opacity:.9;
  transform:translate3d(calc(var(--spx-updates-mx) * -14px), calc(var(--spx-updates-scroll) * -8px), 0);
}
body.spx-prealpha.spx-updatesHubPage .spx-main::after,
body.spx-prealpha.spx-updatesArchivePage .spx-main::after{
  position:absolute;
  inset:auto 0 clamp(80px, 10vw, 140px);
  height:clamp(160px, 20vw, 250px);
  z-index:0;
  background:
    radial-gradient(40% 80% at 20% 50%, rgba(255,255,255,.04), transparent 72%),
    radial-gradient(44% 80% at 76% 50%, rgba(111,186,255,.05), transparent 72%);
  opacity:.85;
  filter:blur(14px);
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  position:relative;
  width:var(--spx-updates-page-width);
  padding:0;
  border-radius:24px;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(9,14,27,.72), rgba(8,12,22,.46));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 60px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  position:absolute;
  inset:-30% -20%;
  z-index:0;
  background:
    radial-gradient(34% 36% at 12% 42%, rgba(142,95,255,.18), transparent 58%),
    radial-gradient(28% 30% at 86% 20%, rgba(90,216,255,.16), transparent 56%),
    radial-gradient(28% 24% at 62% 84%, rgba(255,127,216,.10), transparent 58%);
  filter:blur(26px);
  opacity:.85;
  animation:spxUpdatesNebulaDrift 20s ease-in-out infinite alternate;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::after{
  position:absolute;
  inset:0;
  z-index:0;
  background:
    linear-gradient(90deg, transparent 0%, rgba(255,255,255,.05) 15%, transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 48%);
  mix-blend-mode:screen;
  opacity:.42;
}
body.spx-prealpha .spx-updatesHero,
body.spx-prealpha .spx-updatesArchiveHero{
  position:relative;
  z-index:1;
  padding:14px clamp(18px, 2.2vw, 26px) 16px;
}
body.spx-prealpha .spx-updatesHeroBar{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:12px;
  min-height:unset;
  margin:0 0 10px;
}
body.spx-prealpha .spx-updatesHeroIntro,
body.spx-prealpha .spx-updatesHeroIntroArchive{
  width:min(100%, 980px);
  margin:0 auto;
  display:grid;
  gap:6px;
  justify-items:center;
  text-align:center;
}
body.spx-prealpha .spx-updatesHeroTitle{
  margin:0;
  font-size:clamp(24px, 2.9vw, 34px);
  line-height:1.04;
  letter-spacing:-.04em;
}
body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{
  font-size:clamp(22px, 2.6vw, 30px);
}
body.spx-prealpha .spx-updatesHero .spx-tagline,
body.spx-prealpha .spx-updatesArchiveHero .spx-tagline{
  max-width:700px;
  margin:0;
  font-size:clamp(13px, 1.05vw, 15px);
  line-height:1.65;
  opacity:.84;
}
body.spx-prealpha .spx-updatesHeroArchiveBtn{justify-self:end}
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection{
  position:relative;
  z-index:1;
  margin-top:clamp(10px, 1.4vw, 18px);
}
body.spx-prealpha .spx-updatesMosaic{
  gap:clamp(22px, 2.6vw, 34px);
  align-items:stretch;
}
body.spx-prealpha .spx-updatesMiniGrid{
  gap:clamp(16px, 1.8vw, 20px);
}
body.spx-prealpha .spx-updatesArchiveList{
  gap:clamp(16px, 1.8vw, 20px);
}
body.spx-prealpha .spx-updatesFeatureCard,
body.spx-prealpha .spx-updatesMiniCard,
body.spx-prealpha .spx-updatesArchiveRow{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(12,18,33,.84), rgba(8,12,22,.74));
  box-shadow:0 18px 48px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.06);
}
body.spx-prealpha .spx-updatesFeatureCard::before,
body.spx-prealpha .spx-updatesMiniCard::before,
body.spx-prealpha .spx-updatesArchiveRow::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.05), transparent 26%);
  opacity:.7;
}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  position:relative;
  z-index:1;
  width:var(--spx-updates-page-width);
  margin-top:clamp(26px, 3.8vw, 42px);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::before{
  background:
    radial-gradient(44% 36% at 14% 18%, rgba(255,225,172,.46), transparent 58%),
    radial-gradient(30% 30% at 78% 16%, rgba(231,126,72,.30), transparent 54%),
    radial-gradient(34% 28% at 48% 42%, rgba(183,84,46,.22), transparent 56%),
    radial-gradient(42% 32% at 24% 82%, rgba(140,59,35,.28), transparent 58%),
    radial-gradient(38% 30% at 82% 78%, rgba(102,39,28,.24), transparent 56%),
    linear-gradient(180deg, #f7ead6 0%, #ddb27f 26%, #b0613b 62%, #7a3428 100%);
  transform:translate3d(calc(var(--spx-updates-mx) * -8px), calc(var(--spx-updates-my) * -6px), 0) scale(1.05);
  animation:spxMarsWindField 22s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage::after,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage::after{
  background:
    linear-gradient(112deg, transparent 0%, rgba(255,236,210,.08) 16%, transparent 30%),
    linear-gradient(118deg, transparent 12%, rgba(224,118,64,.16) 28%, rgba(244,168,105,.14) 40%, transparent 56%),
    linear-gradient(124deg, transparent 22%, rgba(178,76,42,.20) 36%, transparent 52%),
    radial-gradient(circle at 12% 18%, rgba(255,240,220,.16) 0 1px, transparent 1.8px),
    radial-gradient(circle at 30% 46%, rgba(255,219,186,.22) 0 1.3px, transparent 2.2px),
    radial-gradient(circle at 58% 22%, rgba(255,232,205,.16) 0 1.1px, transparent 2px),
    radial-gradient(circle at 72% 58%, rgba(255,214,180,.20) 0 1.2px, transparent 2.2px),
    radial-gradient(circle at 90% 34%, rgba(255,236,214,.16) 0 1px, transparent 1.9px);
  opacity:.9;
  filter:blur(.25px);
  animation:spxMarsParticleSweep 9s linear infinite, spxMarsDustSpecks 14s linear infinite;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
  background:
    radial-gradient(44% 34% at 12% 24%, rgba(255,213,140,.24), transparent 58%),
    radial-gradient(28% 26% at 82% 22%, rgba(214,106,57,.28), transparent 56%),
    radial-gradient(34% 26% at 56% 74%, rgba(165,71,40,.22), transparent 56%),
    url('../images/mars-texture.webp') center/cover no-repeat;
  background-blend-mode:screen, screen, normal, soft-light;
  filter:blur(20px) saturate(1.12);
  opacity:.48;
  animation:spxMarsWindField 18s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-shell::after{
  background:
    linear-gradient(120deg, transparent 0%, rgba(255,241,223,.08) 16%, transparent 30%),
    linear-gradient(128deg, transparent 18%, rgba(207,91,52,.16) 34%, transparent 48%);
  opacity:.56;
  mix-blend-mode:screen;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-main::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-main::before{
  background:
    radial-gradient(36% 70% at 12% 50%, rgba(255,217,164,.16), transparent 72%),
    radial-gradient(30% 70% at 80% 40%, rgba(225,118,63,.18), transparent 72%),
    radial-gradient(44% 90% at 50% 64%, rgba(138,53,35,.14), transparent 74%);
  filter:blur(16px);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(180deg, rgba(255,246,231,.74), rgba(241,220,193,.56));
  border-color:rgba(138,71,40,.12);
  box-shadow:0 18px 48px rgba(122,73,40,.12), inset 0 1px 0 rgba(255,255,255,.42);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  background:
    radial-gradient(34% 30% at 12% 28%, rgba(255,201,120,.24), transparent 56%),
    radial-gradient(28% 24% at 84% 18%, rgba(227,128,74,.18), transparent 52%),
    radial-gradient(30% 22% at 60% 84%, rgba(170,83,48,.16), transparent 54%);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesFeatureCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesMiniCard,
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesArchiveRow{
  border-color:rgba(136,76,44,.12);
  background:linear-gradient(180deg, rgba(255,250,241,.94), rgba(243,226,202,.92));
  box-shadow:0 18px 44px rgba(143,86,48,.12), inset 0 1px 0 rgba(255,255,255,.44);
}
@media (max-width: 1120px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{--spx-updates-page-width:calc(100vw - 34px)}
}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{--spx-updates-page-width:calc(100vw - 18px)}
  body.spx-prealpha .spx-updatesHero,
  body.spx-prealpha .spx-updatesArchiveHero{padding:14px 14px 15px}
  body.spx-prealpha .spx-updatesHeroBar{grid-template-columns:1fr; gap:8px}
  body.spx-prealpha .spx-updatesHeroArchiveBtn{justify-self:start}
  body.spx-prealpha .spx-updatesHeroTitle{font-size:clamp(22px, 7.5vw, 30px)}
  body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{font-size:clamp(20px, 7vw, 28px)}
  body.spx-prealpha .spx-updatesHero .spx-tagline,
  body.spx-prealpha .spx-updatesArchiveHero .spx-tagline{font-size:13px; line-height:1.55}
}


/* --- pass163 updates/archive use landing cinematic scene --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  background: transparent;
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesArchivePage::before,
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::after{
  content: none !important;
  display: none !important;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{
  opacity: 1 !important;
  filter: saturate(1.04) contrast(1.02);
}
body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  background: transparent;
}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar{
  background: linear-gradient(180deg, rgba(7, 10, 18, 0.18), rgba(7, 10, 18, 0.04)) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-topbar,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-topbar{
  background: linear-gradient(180deg, rgba(255, 245, 236, 0.32), rgba(255, 245, 236, 0.10)) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background: linear-gradient(180deg, rgba(8, 12, 22, 0.36), rgba(8, 12, 22, 0.16)) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.05);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background: linear-gradient(180deg, rgba(255, 249, 242, 0.68), rgba(255, 244, 234, 0.42)) !important;
  border-color: rgba(117, 74, 46, .12) !important;
  box-shadow: 0 24px 80px rgba(112, 72, 46, .12), inset 0 1px 0 rgba(255,255,255,.32);
}

/* --- pass164 updates/archive unified container width --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1200px, calc(100vw - 56px));
}

body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry,
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  width:var(--spx-updates-page-width);
  max-width:var(--spx-updates-page-width);
  margin-inline:auto;
  box-sizing:border-box;
}

body.spx-prealpha .spx-updatesHero,
body.spx-prealpha .spx-updatesArchiveHero,
body.spx-prealpha .spx-updatesMosaic,
body.spx-prealpha .spx-updatesArchiveList,
body.spx-prealpha .spx-updatesArchiveEntryCard{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}

body.spx-prealpha .spx-updatesHeroIntro,
body.spx-prealpha .spx-updatesHeroIntroArchive{
  width:min(100%, 900px);
}

body.spx-prealpha .spx-updatesMosaic{
  grid-template-columns:minmax(0, 1.25fr) minmax(320px, .92fr);
  gap:28px;
}

body.spx-prealpha .spx-updatesMiniGrid{
  gap:18px;
}

body.spx-prealpha .spx-updatesArchiveList{
  gap:18px;
}

body.spx-prealpha .spx-updatesArchiveRow,
body.spx-prealpha .spx-updatesFeatureCard,
body.spx-prealpha .spx-updatesMiniCard,
body.spx-prealpha .spx-updatesArchiveEntryCard{
  width:100%;
  box-sizing:border-box;
}

@media (max-width: 1120px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:min(100%, calc(100vw - 36px));
  }
  body.spx-prealpha .spx-updatesMosaic{
    grid-template-columns:1fr;
    gap:22px;
  }
}

@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:calc(100vw - 22px);
  }
  body.spx-prealpha .spx-updatesHeroIntro,
  body.spx-prealpha .spx-updatesHeroIntroArchive{
    width:100%;
  }
}


/* --- pass165 updates/archive hero icon + left aligned editorial surface --- */
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  width:var(--spx-updates-page-width);
  max-width:var(--spx-updates-page-width);
  margin-inline:auto;
  padding:18px 22px 20px !important;
  background:linear-gradient(180deg, rgba(24,31,52,.86), rgba(16,22,38,.72)) !important;
  border-color:rgba(160,182,255,.16) !important;
  box-shadow:0 26px 80px rgba(2,6,16,.34), inset 0 1px 0 rgba(255,255,255,.07);
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(180deg, rgba(245,234,224,.88), rgba(233,219,206,.72)) !important;
  border-color:rgba(146,96,65,.14) !important;
  box-shadow:0 20px 64px rgba(138,93,62,.12), inset 0 1px 0 rgba(255,255,255,.4);
}
body.spx-prealpha .spx-updatesHeroBar{
  grid-template-columns:1fr auto;
  align-items:center;
  width:100%;
  margin:0 0 12px;
}
body.spx-prealpha .spx-updatesHeroIntro,
body.spx-prealpha .spx-updatesHeroIntroArchive{
  width:100%;
  max-width:none;
  text-align:left !important;
  align-items:flex-start !important;
  justify-items:start !important;
  margin:0;
}
body.spx-prealpha .spx-updatesHeroLeadline{
  display:flex;
  align-items:center;
  gap:14px;
  margin:0 0 10px;
}
body.spx-prealpha .spx-updatesHeroIcon{
  width:44px;
  height:44px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  background:linear-gradient(180deg, rgba(118,137,255,.22), rgba(129,88,255,.14));
  border:1px solid rgba(165,179,255,.2);
  box-shadow:0 12px 34px rgba(70,53,126,.18), inset 0 1px 0 rgba(255,255,255,.08);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesHeroIcon{
  background:linear-gradient(180deg, rgba(220,164,122,.22), rgba(214,126,84,.14));
  border-color:rgba(164,104,63,.16);
  box-shadow:0 12px 30px rgba(151,101,72,.12), inset 0 1px 0 rgba(255,255,255,.36);
}
body.spx-prealpha .spx-updatesHeroIcon img{width:22px;height:22px;display:block;object-fit:contain;}
body.spx-prealpha .spx-updatesHeroTitle{margin:0; text-align:left !important;}
body.spx-prealpha .spx-updatesHero .spx-tagline,
body.spx-prealpha .spx-updatesArchiveHero .spx-tagline{
  max-width:760px;
  text-align:left !important;
  margin:0;
}
body.spx-prealpha .spx-updatesHeroArchiveBtn{justify-self:end;}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
  body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{padding:16px 16px 18px !important;}
  body.spx-prealpha .spx-updatesHeroLeadline{gap:12px; margin-bottom:8px;}
  body.spx-prealpha .spx-updatesHeroIcon{width:38px; height:38px; border-radius:12px;}
  body.spx-prealpha .spx-updatesHeroIcon img{width:19px; height:19px;}
}


/* --- pass166 updates/archive header width + font awesome icon alignment --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1320px, calc(100vw - 56px));
}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry,
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  width:var(--spx-updates-page-width);
  max-width:var(--spx-updates-page-width);
  margin-inline:auto;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
  box-sizing:border-box;
  width:100%;
  max-width:none;
  margin:0;
  padding:clamp(22px, 3.2vw, 34px) clamp(22px, 3vw, 34px);
  text-align:left;
}
body.spx-prealpha .spx-updatesHeroBar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:100%;
  margin:0 0 16px;
}
body.spx-prealpha .spx-updatesHeroBar .spx-kicker,
body.spx-prealpha .spx-updatesHeroBar > div:first-child{
  margin:0;
  text-align:left;
}
body.spx-prealpha .spx-updatesHeroIntro,
body.spx-prealpha .spx-updatesHeroIntroArchive{
  width:100%;
  display:grid;
  gap:12px;
  justify-items:start;
  text-align:left;
}
body.spx-prealpha .spx-updatesHeroLeadline{
  display:flex;
  align-items:center;
  gap:14px;
  width:100%;
  justify-content:flex-start;
}
body.spx-prealpha .spx-updatesHeroIcon{
  width:52px;
  height:52px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 14px 30px rgba(0,0,0,.18);
  color:#dfe9ff;
  flex:0 0 auto;
}
body.spx-prealpha .spx-updatesHeroIcon i{
  font-size:22px;
  line-height:1;
}
body.spx-prealpha .spx-updatesHeroTitle,
body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{
  margin:0;
  text-align:left;
}
body.spx-prealpha .spx-updatesHero .spx-kicker,
body.spx-prealpha .spx-updatesArchiveHero .spx-kicker,
body.spx-prealpha .spx-updatesHero .spx-tagline,
body.spx-prealpha .spx-updatesArchiveHero .spx-tagline,
body.spx-prealpha .spx-updatesHero .spx-lead,
body.spx-prealpha .spx-updatesArchiveHero .spx-lead{
  margin-inline:0;
  text-align:left;
}
body.spx-prealpha .spx-updatesHero .spx-tagline,
body.spx-prealpha .spx-updatesArchiveHero .spx-tagline{
  max-width:760px;
}
body.spx-prealpha .spx-updatesHeroArchiveBtn{
  margin-left:auto;
  flex:0 0 auto;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesHeroIcon{
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.42));
  border-color:rgba(123,73,30,.14);
  color:#9a4c2c;
  box-shadow:0 12px 26px rgba(120,74,33,.14);
}
@media (max-width: 700px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:calc(100vw - 28px);
  }
  body.spx-prealpha .spx-updatesHero,
  body.spx-prealpha .spx-updatesArchiveHero{
    padding:18px;
  }
  body.spx-prealpha .spx-updatesHeroBar{
    gap:10px;
    margin-bottom:12px;
  }
  body.spx-prealpha .spx-updatesHeroLeadline{
    gap:12px;
  }
  body.spx-prealpha .spx-updatesHeroIcon{
    width:44px;
    height:44px;
    border-radius:14px;
  }
  body.spx-prealpha .spx-updatesHeroIcon i{font-size:18px;}
}

/* --- pass167 updates hero width/color + bottom scroll trim --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1200px, calc(100vw - 56px));
}

body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry,
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  width:var(--spx-updates-page-width) !important;
  max-width:var(--spx-updates-page-width) !important;
  margin-inline:auto !important;
  box-sizing:border-box;
}

body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  padding:0 !important;
  background:
    radial-gradient(circle at 12% 26%, rgba(120,86,255,.20), transparent 0 18%),
    radial-gradient(circle at 82% 18%, rgba(76,199,255,.14), transparent 0 16%),
    linear-gradient(180deg, rgba(18,26,48,.92), rgba(11,17,32,.84)) !important;
  border-color:rgba(151,174,255,.18) !important;
  box-shadow:0 28px 86px rgba(1,6,18,.34), inset 0 1px 0 rgba(255,255,255,.07);
}

html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:
    radial-gradient(circle at 14% 24%, rgba(255,209,179,.28), transparent 0 20%),
    radial-gradient(circle at 84% 20%, rgba(255,170,122,.16), transparent 0 18%),
    linear-gradient(180deg, rgba(247,232,220,.96), rgba(233,216,202,.84)) !important;
  border-color:rgba(151,101,72,.16) !important;
  box-shadow:0 22px 74px rgba(128,85,55,.14), inset 0 1px 0 rgba(255,255,255,.42);
}

body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
  width:100%;
  max-width:none;
  margin:0;
  padding:clamp(20px, 3vw, 30px) clamp(20px, 3vw, 30px) !important;
  box-sizing:border-box;
}

body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{
  gap:clamp(34px, 4vw, 52px) !important;
  padding-bottom:0 !important;
}

body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  padding-bottom:calc(10px + var(--safeB)) !important;
}

body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  margin-top:clamp(10px, 1.8vw, 18px) !important;
  padding-bottom:0 !important;
}

@media (max-width: 700px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:calc(100vw - 24px);
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
  body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
    padding:16px !important;
  }
}


/* --- pass168 updates/archive header text cleanup + scene visibility + footer breathing --- */
body.spx-prealpha .spx-updatesHeroBarSolo{
  justify-content:flex-end !important;
}
body.spx-prealpha .spx-updatesHeroBarSolo .spx-updatesHeroArchiveBtn{
  margin-left:auto;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero .spx-tagline{
  display:none !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after,
body.spx-prealpha.spx-updatesHubPage .spx-main::before,
body.spx-prealpha.spx-updatesHubPage .spx-main::after,
body.spx-prealpha.spx-updatesArchivePage .spx-main::before,
body.spx-prealpha.spx-updatesArchivePage .spx-main::after,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::after{
  content:none !important;
  display:none !important;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{
  opacity:1 !important;
  filter:saturate(1.08) contrast(1.04) brightness(1.03) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(180deg, rgba(18,26,48,.74), rgba(11,17,32,.58)) !important;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(180deg, rgba(247,232,220,.82), rgba(233,216,202,.66)) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  margin-top:clamp(18px, 2.8vw, 30px) !important;
  padding:24px 28px 28px !important;
}
@media (max-width:700px){
  body.spx-prealpha.spx-updatesHubPage .spx-footer,
  body.spx-prealpha.spx-updatesArchivePage .spx-footer{
    padding:22px 18px 26px !important;
  }
}

/* --- pass169 updates/archive hero compact gradient + shared landing scene visibility --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1240px, calc(100vw - 56px));
}
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::before,
body.spx-prealpha.spx-updatesArchivePage::after,
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::after{
  display:none !important;
  content:none !important;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{
  opacity:.56 !important;
  filter:saturate(1.08) contrast(1.06) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{
  gap:clamp(26px, 3.4vw, 44px) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  width:var(--spx-updates-page-width) !important;
  padding:16px 20px 18px !important;
  min-height:0 !important;
  border-radius:30px !important;
  overflow:hidden !important;
  background:linear-gradient(135deg, rgba(13,18,34,.88) 0%, rgba(18,27,52,.74) 42%, rgba(11,16,31,.66) 100%) !important;
  border:1px solid rgba(151,124,255,.18) !important;
  box-shadow:0 22px 56px rgba(4,8,18,.26), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(135deg, rgba(255,237,221,.96) 0%, rgba(247,214,183,.90) 44%, rgba(229,171,131,.84) 100%) !important;
  border-color:rgba(163,92,45,.16) !important;
  box-shadow:0 22px 54px rgba(138,88,52,.16), inset 0 1px 0 rgba(255,255,255,.42) !important;
}
body.spx-prealpha .spx-updatesHero,
body.spx-prealpha .spx-updatesArchiveHero{
  padding:0 !important;
}
body.spx-prealpha .spx-updatesHeroBar{
  margin:0 0 10px !important;
  align-items:center !important;
}
body.spx-prealpha .spx-updatesHeroIntro,
body.spx-prealpha .spx-updatesHeroIntroArchive{
  width:100% !important;
  margin:0 !important;
  gap:8px !important;
  justify-items:start !important;
  text-align:left !important;
}
body.spx-prealpha .spx-updatesHeroLeadline{
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  justify-content:flex-start;
}
body.spx-prealpha .spx-updatesHeroTitle{
  margin:0 !important;
  font-size:clamp(28px, 3.8vw, 40px) !important;
  line-height:1.02 !important;
}
body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{
  font-size:clamp(24px, 3.2vw, 34px) !important;
}
body.spx-prealpha .spx-updatesHeroIcon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg, rgba(132,103,255,.22), rgba(86,208,255,.12));
  border:1px solid rgba(150,124,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-updatesHeroIcon{
  background:linear-gradient(135deg, rgba(236,143,88,.18), rgba(255,222,184,.26));
  border-color:rgba(169,96,43,.14);
}
body.spx-prealpha .spx-updatesHeroArchiveBtn{
  justify-self:end !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  padding:28px 30px !important;
}
@media (max-width: 1120px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:calc(100vw - 34px);
  }
}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:calc(100vw - 20px);
  }
  body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
  body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
    padding:14px 14px 16px !important;
    border-radius:22px !important;
  }
  body.spx-prealpha .spx-updatesHeroBar{
    gap:10px !important;
    margin:0 0 8px !important;
  }
  body.spx-prealpha .spx-updatesHeroTitle{
    font-size:clamp(24px, 8vw, 32px) !important;
  }
  body.spx-prealpha .spx-updatesArchiveHero .spx-updatesHeroTitle{
    font-size:clamp(22px, 7vw, 28px) !important;
  }
  body.spx-prealpha .spx-updatesHeroIcon{
    width:38px;
    height:38px;
    border-radius:12px;
  }
}


/* === PASS170: updates page hero/nav alignment + landing scene restore === */
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesHubPage::after{
  content:none !important;
  display:none !important;
}
body.spx-prealpha.spx-updatesHubPage #spxScene{
  opacity:.98 !important;
  filter:saturate(1.04) contrast(1.02);
}
body.spx-prealpha.spx-updatesHubPage .spx-shell{
  background:transparent !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-topbar{
  width:min(1240px, calc(100vw - 40px)) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell.spx-updatesHeroNebula{
  width:min(1240px, calc(100vw - 40px)) !important;
  min-height:auto !important;
  padding:0 !important;
  border-radius:26px !important;
  border:1px solid rgba(255,255,255,.11) !important;
  background:
    linear-gradient(135deg, rgba(20,30,60,.86) 0%, rgba(28,14,58,.78) 42%, rgba(10,14,28,.76) 100%) !important;
  backdrop-filter:blur(16px) saturate(1.08) !important;
  box-shadow:0 24px 64px rgba(0,0,0,.22) !important;
  overflow:hidden !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell.spx-updatesHeroNebula::before{
  content:"" !important;
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 16% 28%, rgba(109,128,255,.24), transparent 26%),
    radial-gradient(circle at 72% 22%, rgba(175,94,255,.18), transparent 24%),
    radial-gradient(circle at 44% 112%, rgba(76,116,255,.14), transparent 42%);
  opacity:1;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell.spx-updatesHeroNebula{
  border-color:rgba(163,103,45,.14) !important;
  background:
    linear-gradient(135deg, rgba(255,244,226,.94) 0%, rgba(245,221,190,.90) 46%, rgba(232,201,164,.88) 100%) !important;
  box-shadow:0 24px 64px rgba(137,88,35,.14) !important;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell.spx-updatesHeroNebula::before{
  background:
    radial-gradient(circle at 18% 24%, rgba(255,205,138,.24), transparent 24%),
    radial-gradient(circle at 74% 24%, rgba(227,149,67,.16), transparent 22%),
    radial-gradient(circle at 38% 110%, rgba(194,104,54,.12), transparent 40%);
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero{
  max-width:none !important;
  padding:22px 26px !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroIntro,
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroIntroInline{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroLeadline,
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroLeadlineInline{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  margin:0 !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroTitleGroup{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroTitle{
  margin:0 !important;
  text-align:left !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn{
  margin-left:auto !important;
  justify-self:auto !important;
  flex:0 0 auto;
}
@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHero{
    padding:18px 16px !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroLeadline,
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroLeadlineInline{
    gap:12px !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroTitleGroup{
    gap:10px;
  }
}


/* --- pass171 updates hero padding/gradient + landing planet visibility + legal footer modal --- */
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  padding:0 !important;
  background:linear-gradient(135deg, rgba(22,32,74,.82) 0%, rgba(14,20,40,.88) 46%, rgba(33,16,58,.80) 100%) !important;
  border-color:rgba(160,182,255,.14) !important;
  box-shadow:0 28px 88px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07) !important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
  padding:22px clamp(24px, 2.8vw, 34px) 24px !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  content:"";
  position:absolute;
  inset:-35% -15%;
  z-index:0;
  background:
    radial-gradient(34% 46% at 10% 34%, rgba(122,91,255,.24), transparent 58%),
    radial-gradient(28% 36% at 86% 18%, rgba(92,212,255,.18), transparent 54%),
    radial-gradient(26% 28% at 62% 84%, rgba(255,127,216,.11), transparent 56%);
  filter:blur(28px);
  opacity:.92;
  animation:spxUpdatesNebulaDrift 22s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  background:linear-gradient(135deg, rgba(255,236,214,.92) 0%, rgba(241,205,170,.82) 48%, rgba(214,133,88,.72) 100%) !important;
  border-color:rgba(153,94,58,.16) !important;
  box-shadow:0 28px 82px rgba(125,76,46,.16), inset 0 1px 0 rgba(255,255,255,.42) !important;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell::before{
  background:
    radial-gradient(34% 34% at 10% 28%, rgba(255,207,134,.26), transparent 58%),
    radial-gradient(28% 30% at 84% 18%, rgba(219,109,63,.22), transparent 54%),
    radial-gradient(30% 24% at 60% 82%, rgba(170,83,48,.18), transparent 56%);
  filter:blur(22px);
  opacity:.82;
}

/* expose the landing scene more clearly on updates/archive and add visible planet presence */
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{
  opacity:.92 !important;
  filter:saturate(1.1) contrast(1.06) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  overflow:visible;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
  content:"" !important;
  position:fixed;
  left:50%;
  bottom:-42vh;
  width:min(1180px, 96vw);
  aspect-ratio:1 / 1;
  transform:translateX(-50%);
  z-index:0;
  pointer-events:none;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 34%, rgba(152,194,255,.16), rgba(76,114,214,.10) 42%, transparent 68%),
    url('../images/earth-texture.png') center/cover no-repeat;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04),
    0 -8px 80px rgba(102,152,255,.18),
    0 0 140px rgba(44,86,186,.18);
  opacity:.54;
  filter:saturate(1.02) contrast(1.04);
  animation:spxUpdatesPlanetFloat 28s ease-in-out infinite alternate;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
  background:
    radial-gradient(circle at 50% 36%, rgba(255,221,173,.18), rgba(219,118,67,.12) 44%, transparent 70%),
    url('../images/mars-texture-user.jpg') center/cover no-repeat;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06),
    0 -8px 80px rgba(216,117,68,.18),
    0 0 140px rgba(124,54,34,.16);
  opacity:.48;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after{
  content:none !important;
  display:none !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main,
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
body.spx-prealpha.spx-updatesHubPage .spx-updatesMosaicSection,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveListSection,
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  position:relative;
  z-index:2;
}

body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  padding-bottom:44px;
}

@keyframes spxUpdatesPlanetFloat{
  0%{transform:translateX(-50%) translateY(0)}
  100%{transform:translateX(-50%) translateY(-12px)}
}

@media (max-width: 760px){
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
  body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
    padding:18px 16px 19px !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
  body.spx-prealpha.spx-updatesArchivePage .spx-shell::before{
    width:min(132vw, 760px);
    bottom:-34vh;
    opacity:.48;
  }
}


/* --- pass174 restore stable updates/archive scene + legal modal --- */
body.spx-prealpha.spx-updatesHubPage,
body.spx-prealpha.spx-updatesArchivePage{
  --spx-updates-page-width:min(1200px, calc(100vw - 56px));
}

/* use the real landing canvas scene, without extra fake page planets or overlays */
body.spx-prealpha.spx-updatesHubPage::before,
body.spx-prealpha.spx-updatesHubPage::after,
body.spx-prealpha.spx-updatesArchivePage::before,
body.spx-prealpha.spx-updatesArchivePage::after,
body.spx-prealpha.spx-updatesHubPage .spx-shell::before,
body.spx-prealpha.spx-updatesHubPage .spx-shell::after,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::before,
body.spx-prealpha.spx-updatesArchivePage .spx-shell::after,
body.spx-prealpha.spx-updatesHubPage .spx-main::before,
body.spx-prealpha.spx-updatesHubPage .spx-main::after,
body.spx-prealpha.spx-updatesArchivePage .spx-main::before,
body.spx-prealpha.spx-updatesArchivePage .spx-main::after{
  content:none !important;
  display:none !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  background:transparent !important;
  overflow:visible !important;
}
body.spx-prealpha.spx-updatesHubPage #spxScene,
body.spx-prealpha.spx-updatesArchivePage #spxScene{
  opacity:.98 !important;
  filter:saturate(1.04) contrast(1.03) brightness(1.02) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-topbar,
body.spx-prealpha.spx-updatesArchivePage .spx-topbar,
body.spx-prealpha.spx-updatesHubPage .spx-heroShell,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell,
body.spx-prealpha .spx-updatesMosaicSection,
body.spx-prealpha .spx-updatesArchiveListSection,
body.spx-prealpha .spx-updatesArchiveEntry,
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  position:relative;
  z-index:2;
  width:var(--spx-updates-page-width) !important;
  max-width:var(--spx-updates-page-width) !important;
  margin-inline:auto !important;
  box-sizing:border-box;
}

/* compact hero, with proper padding and theme-matched gradient */
body.spx-prealpha.spx-updatesHubPage .spx-heroShell.spx-updatesHeroNebula,
body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  padding:0 !important;
  border-radius:28px !important;
  border:1px solid rgba(168,188,255,.14) !important;
  background:
    linear-gradient(135deg, rgba(28,39,82,.88) 0%, rgba(18,24,47,.84) 44%, rgba(26,15,50,.80) 100%) !important;
  box-shadow:0 26px 84px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter:blur(18px) saturate(1.05) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.05) !important;
  overflow:hidden !important;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesHubPage .spx-heroShell.spx-updatesHeroNebula,
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell{
  border-color:rgba(159,102,58,.16) !important;
  background:
    linear-gradient(135deg, rgba(255,239,223,.94) 0%, rgba(245,219,190,.88) 46%, rgba(225,166,123,.78) 100%) !important;
  box-shadow:0 24px 74px rgba(126,82,50,.14), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHero,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero{
  padding:0 !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroIntro.spx-updatesHeroIntroInline,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroIntro{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:20px !important;
  display:grid;
  gap:0;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroLeadlineInline,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroLeadline{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  margin:0 !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroTitleGroup,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroLeadline{
  min-width:0;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroTitle,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroTitle{
  margin:0 !important;
  text-align:left !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroArchiveBtn{
  margin-left:auto !important;
  justify-self:auto !important;
  flex:0 0 auto;
}

body.spx-prealpha.spx-updatesHubPage .spx-main,
body.spx-prealpha.spx-updatesArchivePage .spx-main{
  gap:clamp(30px, 3.8vw, 48px) !important;
  padding-bottom:0 !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-shell,
body.spx-prealpha.spx-updatesArchivePage .spx-shell{
  padding-bottom:calc(18px + var(--safeB)) !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-footer,
body.spx-prealpha.spx-updatesArchivePage .spx-footer{
  margin-top:clamp(18px, 2.4vw, 28px) !important;
  padding:28px 30px 34px !important;
}

/* modal fallback iframe */
.spx-legalFrame{
  width:100%;
  min-height:min(70vh, 760px);
  border:0;
  background:transparent;
  border-radius:0 0 20px 20px;
}

@media (max-width:760px){
  body.spx-prealpha.spx-updatesHubPage,
  body.spx-prealpha.spx-updatesArchivePage{
    --spx-updates-page-width:calc(100vw - 24px);
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroIntro.spx-updatesHeroIntroInline,
  body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroIntro{
    padding:16px !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroLeadlineInline,
  body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroLeadline{
    gap:12px !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-footer,
  body.spx-prealpha.spx-updatesArchivePage .spx-footer{
    padding:24px 18px 30px !important;
  }
}


/* --- pass176 dropdown stacking + archive hero parity + light legal polish --- */
body.spx-prealpha .spx-topbar,
body.spx-prealpha .spx-topActions,
body.spx-prealpha .spx-themeToggleWrap,
body.spx-prealpha .spx-navProfileDrop{
  position:relative;
  z-index:420 !important;
  overflow:visible !important;
}
body.spx-prealpha .spx-topbar{
  z-index:430 !important;
}
body.spx-prealpha .spx-themeMenu,
body.spx-prealpha .spx-navProfileMenu{
  position:absolute;
  z-index:650 !important;
}
body.spx-prealpha .spx-themeMenu{
  top:calc(100% + 10px);
  right:0;
  min-width:220px;
  padding:10px;
  display:grid;
  gap:8px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(10,14,24,.96), rgba(7,10,17,.99));
  box-shadow:0 30px 72px rgba(0,0,0,.38);
  backdrop-filter:blur(16px) saturate(1.08);
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
}
body.spx-prealpha .spx-themeMenu[hidden]{display:none !important;}
body.spx-prealpha .spx-themeMenuItem{
  appearance:none;
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:#fff4e9;
  font-weight:850;
  text-align:left;
  cursor:pointer;
}
body.spx-prealpha .spx-themeMenuItem:hover,
body.spx-prealpha .spx-themeMenuItem.is-active{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,157,87,.18);
}
body.spx-prealpha .spx-themeMenuItem img{
  width:18px;
  height:18px;
  object-fit:contain;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-themeMenu{
  border-color:rgba(196,131,77,.18);
  background:linear-gradient(180deg, rgba(255,248,240,.98), rgba(247,236,223,.98));
  box-shadow:0 22px 60px rgba(163,93,37,.14);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-themeMenuItem{
  background:rgba(255,255,255,.56);
  border-color:rgba(196,131,77,.14);
  color:#4a2d1d;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-themeMenuItem:hover,
html[data-spx-theme="light"] body.spx-prealpha .spx-themeMenuItem.is-active{
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(248,232,214,.92));
  border-color:rgba(196,131,77,.22);
}

html[data-spx-theme="light"] body.spx-prealpha .spx-legalTab{
  color:rgba(108,72,47,.74);
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(245,230,211,.92));
  border-color:rgba(196,131,77,.16);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalTab.is-active,
html[data-spx-theme="light"] body.spx-prealpha .spx-legalTab:hover{
  color:#5b341d;
  border-color:rgba(196,131,77,.26);
  background:linear-gradient(135deg, rgba(255,244,230,.96), rgba(236,195,156,.96));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar-track,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar-track{
  background:linear-gradient(180deg, rgba(252,245,236,.98), rgba(241,224,205,.98));
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar-thumb,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(209,148,96,.72), rgba(186,114,78,.74), rgba(165,86,58,.76));
  border-color:rgba(249,239,228,.96);
  box-shadow:0 0 12px rgba(191,120,70,.14);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar-thumb:hover,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg, rgba(218,157,104,.82), rgba(196,122,85,.84), rgba(173,95,64,.86));
}

body.spx-prealpha.spx-updatesArchivePage .spx-heroShell.spx-updatesArchiveHero{
  padding:0 !important;
  border-radius:28px !important;
  border:1px solid rgba(168,188,255,.14) !important;
  background:linear-gradient(135deg, rgba(28,39,82,.88) 0%, rgba(18,24,47,.84) 44%, rgba(26,15,50,.80) 100%) !important;
  box-shadow:0 26px 84px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter:blur(18px) saturate(1.05) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.05) !important;
  overflow:hidden !important;
}
html[data-spx-theme="light"] body.spx-prealpha.spx-updatesArchivePage .spx-heroShell.spx-updatesArchiveHero{
  border-color:rgba(159,102,58,.16) !important;
  background:linear-gradient(135deg, rgba(255,239,223,.94) 0%, rgba(245,219,190,.88) 46%, rgba(225,166,123,.78) 100%) !important;
  box-shadow:0 24px 74px rgba(126,82,50,.14), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-updatesHeroIntro.spx-updatesHeroIntroInline{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:20px !important;
  display:grid;
  gap:0;
}
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-updatesHeroLeadline.spx-updatesHeroLeadlineInline{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  margin:0 !important;
}
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-updatesHeroTitle,
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-updatesHeroTitleGroup{
  text-align:left !important;
  margin:0 !important;
}
body.spx-prealpha.spx-updatesArchivePage .spx-updatesArchiveHero .spx-updatesHeroArchiveBtn{
  margin-left:auto !important;
}


/* --- pass176b archive button icon + light legal scrollbar polish --- */
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
}
body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn i{
  font-size:14px;
  line-height:1;
}
body.spx-prealpha.spx-updatesArchivePage .spx-updatesHeroTitleGroup{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  min-width:0;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard{
  scrollbar-width:thin;
  scrollbar-color:rgba(196,122,85,.86) rgba(248,236,222,.96);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar{
  width:12px;
  height:12px;
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar-track,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar-track{
  background:linear-gradient(180deg, rgba(253,247,239,1), rgba(239,223,204,.98));
  border-radius:999px;
  border:1px solid rgba(216,182,145,.36);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar-thumb,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(219,163,112,.92), rgba(191,121,84,.9), rgba(171,97,67,.88));
  border:2px solid rgba(251,242,233,.98);
  border-radius:999px;
  box-shadow:0 0 0 1px rgba(179,109,72,.08), 0 4px 12px rgba(169,97,59,.14);
}
html[data-spx-theme="light"] body.spx-prealpha .spx-legalBody::-webkit-scrollbar-thumb:hover,
html[data-spx-theme="light"] body.spx-prealpha .spx-modalCard::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg, rgba(227,171,118,.98), rgba(201,128,90,.96), rgba(177,100,69,.94));
}


/* --- pass185 mobile archive trigger + article page mobile nav parity --- */
@media (max-width:760px){
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn{
    width:46px !important;
    min-width:46px !important;
    height:46px !important;
    min-height:46px !important;
    padding:0 !important;
    border-radius:999px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
    margin-left:auto !important;
    margin-right:0 !important;
    flex:0 0 46px !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn span{
    display:none !important;
  }
  body.spx-prealpha.spx-updatesHubPage .spx-updatesHeroArchiveBtn i{
    margin:0 !important;
    font-size:14px !important;
  }
}
