.brand-mark svg{width:34px;height:34px;stroke:none;display:block}.brand-mark{flex-shrink:0;background:linear-gradient(145deg,#7151f0,#474de0);box-shadow:inset 0 0 0 1px #ffffff20}
.game-feature.showcase{padding:0;min-width:0;overflow:hidden;background:var(--surface);border-color:#434054;box-shadow:0 20px 65px #0002}
.showcase-window{overflow:hidden;touch-action:pan-y}.showcase-track{display:flex;transition:transform .65s cubic-bezier(.22,.68,.24,1);will-change:transform}
.showcase-slide{--accent:#ab9bff;box-sizing:border-box;flex:0 0 100%;min-width:0;padding:28px;display:flex;flex-direction:column;background:radial-gradient(ellipse at 100% 15%,#7754ff26,transparent 70%),#12131f;color:#f4f3fc}
.showcase-slide.social{--accent:#f29bc7;background:radial-gradient(ellipse at 100% 15%,#d843962b,transparent 70%),#17121e}.showcase-slide.create{--accent:#7edcdb;background:radial-gradient(ellipse at 100% 15%,#21a4ae26,transparent 70%),#10191f}.showcase-slide.ai{--accent:#acb8ff;background:radial-gradient(ellipse at 100% 15%,#516eea33,transparent 70%),#131522}
.showcase-overline{display:flex;justify-content:space-between;gap:12px;color:#aaa8bd;font-size:.75rem;letter-spacing:.09em}.showcase-overline span:last-child{white-space:nowrap}
.showcase-body{flex:1;padding:34px 0 28px}.showcase-body h2{font-size:clamp(2rem,3.1vw,3rem);line-height:1.15;letter-spacing:-.055em;margin:0 0 20px;color:var(--accent);font-weight:800}.showcase-body p{font-size:1rem;line-height:1.7;color:#c1bed1;max-width:38ch;margin:0 0 25px}
.showcase-chips{display:flex;gap:8px;flex-wrap:wrap}.showcase-chips span{border:1px solid #ffffff20;border-radius:6px;background:#ffffff04;color:#d1cfe0;font-size:.75rem;padding:8px 10px;letter-spacing:.035em}
.showcase-bottom{display:flex;align-items:flex-start;flex-direction:column;gap:14px}.showcase-bottom .primary-button{min-height:46px;font-size:.9rem;padding:12px 18px}.showcase-bottom small{font-size:.75rem;color:#aaa7bd;line-height:1.5}
.showcase-controls{padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--border);background:var(--surface)}
.showcase-controls button{cursor:pointer;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:8px;min-width:40px;height:40px}.showcase-arrows{display:flex;gap:7px}.showcase-arrows button{font-size:1.25rem}.showcase-controls button:hover{background:#7754ff20;border-color:#9481da}.showcase-controls button:focus-visible{outline:2px solid #b4a0ff;outline-offset:3px}
.showcase-dots{display:flex;gap:0}.showcase-dots button{min-width:30px;width:30px;border:0;display:grid;place-items:center}.showcase-dots button span{width:6px;height:6px;border-radius:20px;background:#747086;transition:width .25s,background .25s}.showcase-dots button[aria-current=true] span{width:20px;background:#ab94ff}.showcase-pause{font-size:.9rem}
@media(max-width:760px){.showcase-slide{padding:24px}.showcase-body{padding:28px 0 24px}.showcase-body h2{font-size:2.25rem}.showcase-controls{padding:12px 18px}}
@media(max-width:370px){.brand .brand-mark{display:grid}.showcase-slide{padding:20px}.showcase-body h2{font-size:2rem}.showcase-overline{font-size:.7rem}.showcase-controls{gap:5px;padding:10px}.showcase-dots button{min-width:26px;width:26px}}
@media(prefers-reduced-motion:reduce){.showcase-track,.showcase-dots button span{transition:none}}
