.showcase{position:relative;min-width:0;margin:0}.showcase-stage{--rx:8deg;--ry:-12deg;position:relative;aspect-ratio:16/11;perspective:1600px;perspective-origin:50% 30%;padding:4% 6% 10% 2%}.showcase-stage:before{content:"";position:absolute;inset:18% 4% 0;z-index:0;background:radial-gradient(60% 50% at 50% 70%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 72%);filter:blur(18px);pointer-events:none}.device{position:absolute;overflow:hidden;background:var(--surface);transform-style:preserve-3d;will-change:transform}.device img{display:block;width:100%;height:auto}.device-browser{border:1px solid var(--line-strong);border-radius:10px;box-shadow:0 30px 60px -20px rgb(0 0 0/.55),inset 0 0 0 1px rgb(255 255 255/.04)}.device-bar{display:flex;align-items:center;justify-content:center;height:26px;padding-inline:10px;background:var(--bg);border-bottom:1px solid var(--line)}.device-url{padding:2px 12px;border-radius:var(--radius-pill);background:var(--surface);font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:.02em}.device{--tx:0px;--ty:0px;--rz:0deg;--s:1;--clip:0%;clip-path:inset(var(--clip) 0 0 0 round 10px)}.device-back{left:18%;top:0;width:70%;opacity:.9;transform:translate3d(var(--tx),var(--ty),0) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(-90px);filter:saturate(.85) brightness(.8)}.device-front{left:2%;top:12%;width:76%;transform:translate3d(var(--tx),var(--ty),0) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(0);z-index:1}.device-phone{right:4%;bottom:2%;width:23%;z-index:2;aspect-ratio:390/844;border:6px solid #0f0c0a;border-radius:26px;box-shadow:0 34px 60px -18px rgb(0 0 0/.65),0 0 0 1px var(--line-strong);clip-path:none;transform:translate3d(var(--tx),var(--ty),0) rotate(var(--rz)) scale(var(--s)) rotateX(calc(var(--rx) * .6)) rotateY(calc(var(--ry) * .6)) translateZ(70px)}.device-phone img{height:100%;object-fit:cover;object-position:top}.showcase figcaption{margin-top:.75rem;font-size:13px;color:var(--muted)}.case-action-link{text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:var(--underline-offset);&:hover{text-decoration-color:currentColor}}@media (width < 48rem){.showcase-stage{--rx:4deg;--ry:-6deg;aspect-ratio:4/3.4}.device-bar{height:20px;padding-inline:6px}.device-url{padding:1px 8px;font-size:8.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-phone{width:27%;border-width:3px;border-radius:14px}}@media (prefers-reduced-motion:reduce){.device{will-change:auto}}