.showcase-screen{box-sizing:border-box;min-height:100svh;padding:6vh 6%;background:#000;color:#f5f5f5;display:flex;flex-direction:column;justify-content:center;gap:5vh;overflow:hidden}
.showcase-row{min-width:0}
.showcase-row header{display:flex;align-items:center;justify-content:space-between;margin:0 48px 18px}
.showcase-row h2{font:600 clamp(26px,2.4vw,46px)/1.1 system-ui;margin:0;letter-spacing:-.04em}
.showcase-pause{border:0;background:none;color:#a8adb4;font-size:13px;cursor:pointer}
.showcase-rail{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;gap:12px;align-items:center}
.showcase-arrow{width:36px;height:48px;border:0;background:transparent;color:#fff;font-size:36px;cursor:pointer;transition:color .2s,transform .2s}
.showcase-arrow:hover{color:#00aeef;transform:scale(1.12)}
.showcase-viewport{overflow:hidden;touch-action:pan-y}
.showcase-track{display:flex;gap:16px;will-change:transform}
.showcase-card{flex:none;width:var(--card-width,340px);aspect-ratio:16/9;display:block;position:relative;padding:0;border:0;border-radius:0;overflow:hidden;background:#000;color:#92989f;cursor:zoom-in}
.showcase-card img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .45s}
.showcase-card:hover img{transform:scale(1.025)}
.showcase-card:disabled{cursor:default;opacity:1}
.showcase-card span{font:400 13px system-ui;letter-spacing:.08em}
.showcase-row[data-showcase="KSP"] .showcase-card{aspect-ratio:16/9}
.showcase-preview{position:fixed;inset:0;width:100vw;max-width:none;height:100svh;max-height:none;box-sizing:border-box;padding:5vh 5vw;border:0;background:rgba(8,10,13,.96);color:white;overflow:auto}
.showcase-preview::backdrop{background:rgba(0,0,0,.8)}
.showcase-preview img{display:block;max-width:100%;max-height:85svh;width:auto;height:auto;object-fit:contain;margin:auto}
.showcase-preview p{text-align:center;font-size:14px}
.showcase-preview-close{position:fixed;right:20px;top:12px;border:0;background:transparent;color:white;font-size:36px;cursor:pointer}
body:has(.showcase-preview[open]){overflow:hidden}
@media(max-width:760px){.showcase-screen{padding:5vh 3%;gap:7vh}.showcase-row header{margin-inline:36px}.showcase-rail{grid-template-columns:24px minmax(0,1fr) 24px;gap:6px}.showcase-arrow{width:24px}.showcase-card{aspect-ratio:4/3}}
@media(prefers-reduced-motion:reduce){.showcase-card img,.showcase-arrow{transition:none}}