/* Only the original landing's #platform changes. Chrome matches the selected hero window. */
#platform.pw22-section {
  --pw22-width: min(1260px, calc(100vw - 64px));
  --pw22-gap: 28px;
  --pw22-sticky-top: 88px;
  --pw22-open: 0;
  width: 100%;
  max-width: none;
  padding-top: clamp(96px, 11vw, 158px);
  padding-bottom: 24px;
}

#platform.pw22-section .pw22-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: 42px; }
#platform.pw22-section .pw22-intro .section-heading { flex: 1 1 auto; max-width: 980px; margin-bottom: 0; }
#platform.pw22-section .pw22-intro > a { flex: 0 0 auto; margin-bottom: 7px; font-size: 12px; }
#platform .pw22-tour { position: relative; isolation: isolate; }
#platform .pw22-stage { position: relative; width: var(--pw22-width); margin-inline: auto; min-width: 0; }
#platform .pw22-window { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 0; border: 1px solid #9e8bff45; border-radius: 19px; background: #111318; overflow: hidden; box-shadow: 0 20px 100px #0005, 0 0 65px #9e8bff0e; transform-origin: 50% 0; }
#platform .pw22-chrome { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 18px; min-height: 42px; padding: 10px 20px; border-bottom: 1px solid var(--border); background: #171a21; color: var(--muted); font-size: 11px; line-height: 1.4; }
#platform .pw22-chrome > span { display: flex; align-items: center; gap: 10px; }
#platform .pw22-dots { display: flex; gap: 5px; flex-shrink: 0; }
#platform .pw22-dots i { width: 6px; height: 6px; border: 1px solid #646b7c; border-radius: 50%; }
#platform .pw22-dots i:first-child { background: var(--accent); border-color: var(--accent); }
#platform .pw22-chrome small { font-size: 10px; color: var(--soft); }
#platform .pw22-tabs { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 4px; padding: 10px; border-bottom: 1px solid var(--border); background: #13161c; }
#platform .pw22-tabs button { min-height: 36px; padding: 8px 18px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--muted); font-size: 12px; line-height: 1.35; transform: none; transition: border-color .2s, color .2s; }
#platform .pw22-tabs button[aria-pressed="true"] { border-color: #9e8bff60; color: var(--soft); background: #9e8bff09; }
#platform .pw22-tabs button:focus-visible { outline-offset: 3px; }
#platform .pw22-viewport { position: relative; flex: 1 1 auto; width: 100%; height: clamp(330px, calc(100svh - 275px), 820px); min-height: 230px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; touch-action: pan-x pan-y pinch-zoom; scrollbar-width: thin; scrollbar-color: #6f638f #13161c; }
#platform .pw22-viewport:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
#platform .pw22-rail { display: flex; align-items: stretch; gap: var(--pw22-gap); width: max-content; min-width: 100%; height: 100%; }
#platform .pw22-screen { position: relative; flex: 0 0 calc(var(--pw22-width) - 2px); width: calc(var(--pw22-width) - 2px); height: 100%; min-width: 0; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; transform: none; }
#platform .pw22-shot { position: relative; display: block; width: 100%; height: 100%; overflow: hidden; margin: 0; padding: 0; background: #101318; border: 0; border-radius: 0; cursor: zoom-in; transform: none; }
#platform .pw22-shot > img { display: block; position: absolute; left: 0; top: 0; width: 100%; max-width: none; height: auto; margin: 0; opacity: 1; transform: none; user-select: none; -webkit-user-drag: none; }
#platform .pw22-shot > span { position: absolute; z-index: 2; right: 18px; bottom: 16px; padding: 9px 13px; border: 1px solid #9e8bff70; border-radius: 8px; background: #101318ed; color: var(--soft); font-size: 11px; line-height: 1.4; pointer-events: none; }
#platform .pw22-shot:focus-visible { outline: 2px solid var(--accent); outline-offset: -5px; }
#platform .pw22-caption { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 24px; padding: 18px 4px 0; min-width: 0; }
#platform .pw22-caption > div { min-width: 0; }
#platform .pw22-caption h3 { color: var(--text); font-size: 19px; font-weight: 450; letter-spacing: -.035em; line-height: 1.35; }
#platform .pw22-caption > div p { margin-top: 5px; color: var(--muted); font-size: 12px; line-height: 1.5; }
#platform .pw22-hint { max-width: 255px; color: #848b99; font-size: 10px; line-height: 1.6; }
#platform .pw22-tour:not(.is-enhanced) .pw22-tabs { display: none; }
#platform .pw22-tour:not(.is-enhanced) .pw22-caption > div { display: none; }
#platform .pw22-tour:not(.is-enhanced) .pw22-viewport { height: min(calc((var(--pw22-width) - 2px) * .744), clamp(330px, calc(100svh - 275px), 820px)); min-height: 0; }

#platform .pw22-tour.is-pinned { height: calc(var(--pw22-stage-height, calc(100svh - 108px)) + var(--pw22-distance, 4400px)); }
#platform .pw22-tour.is-pinned .pw22-stage { position: sticky; top: var(--pw22-sticky-top); display: flex; flex-direction: column; justify-content: center; height: calc(100svh - 108px); padding-block: 12px; }
#platform .pw22-tour.is-pinned .pw22-window { flex: 1 1 auto; max-height: calc(var(--pw22-preview-max, 820px) + 100px); transform: perspective(1400px) rotateX(calc((1 - var(--pw22-open))*10deg)) rotateZ(calc((1 - var(--pw22-open))*-2.3deg)) scale(calc(.92 + var(--pw22-open)*.08)); will-change: transform; }
#platform .pw22-tour.is-pinned .pw22-viewport { min-height: 230px; overflow: hidden; scroll-snap-type: none; scroll-behavior: auto; touch-action: pan-y pinch-zoom; }
#platform .pw22-tour.is-pinned .pw22-rail { transform: translate3d(calc(var(--pw22-position, 0) * -1px), 0, 0); will-change: transform; }
#platform .pw22-tour:not(.is-pinned) .pw22-window { transform: none; }

@media (hover: hover) and (pointer: fine) {
  #platform .pw22-tabs button:hover { border-color: var(--accent); color: var(--text); }
  #platform .pw22-shot:hover > img { opacity: 1; filter: none; }
  #platform .pw22-shot:hover > span { border-color: var(--accent); }
}

@media (max-width: 1100px) {
  #platform.pw22-section .pw22-intro { align-items: flex-start; flex-direction: column; gap: 24px; }
  #platform.pw22-section .pw22-intro > a { margin-bottom: 0; }
  #platform .pw22-caption { gap: 20px; }
  #platform .pw22-hint { max-width: 205px; }
}

@media (max-width: 800px) {
  #platform.pw22-section { --pw22-width: calc(100vw - 32px); --pw22-gap: 16px; --pw22-sticky-top: 76px; padding-top: 90px; padding-bottom: 12px; }
  #platform.pw22-section .pw22-intro { margin-bottom: 30px; gap: 23px; }
  #platform .pw22-window { border-radius: 13px; }
  #platform .pw22-chrome { padding: 10px 13px; min-height: 39px; font-size: 10px; }
  #platform .pw22-tabs { padding: 8px 5px; gap: 0; }
  #platform .pw22-tabs button { padding: 8px 12px; font-size: 11px; }
  #platform .pw22-viewport { height: var(--pw22-static-height, min(54svh, 480px)); min-height: 0; }
  #platform .pw22-shot > img { transform: none; }
  #platform .pw22-shot > span { right: 10px; bottom: 10px; font-size: 10px; padding: 8px 10px; }
  #platform .pw22-caption { flex-direction: column; align-items: flex-start; gap: 10px; padding-top: 16px; }
  #platform .pw22-caption h3 { font-size: 19px; }
  #platform .pw22-caption > div p { font-size: 12px; }
  #platform .pw22-hint { max-width: none; font-size: 10px; }
}

@media (max-width: 520px) {
  #platform.pw22-section { padding-top: 78px; }
  #platform .pw22-chrome small { display: none; }
  #platform .pw22-tabs button { padding: 8px 10px; }
  #platform.pw22-section .pw22-intro > a { font-size: 11px; }
}

@media (max-height: 639px) and (min-width: 801px) {
  #platform .pw22-viewport { height: min(430px, var(--pw22-static-height, 430px)); min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  #platform .pw22-viewport { height: min(600px, var(--pw22-static-height, 600px)); min-height: 0; scroll-behavior: auto; }
  #platform .pw22-shot > img { transform: none; }
  #platform .pw22-tabs button { transition: none; }
}