.showcase-banner{background:#f3f5f1;color:#20241f;padding:16px 0 18px;border-bottom:1px solid #ccd2c8}.showcase-heading{padding:0 4%;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:12px}.showcase-heading h2{font-size:17px;font-weight:400;margin:0}.showcase-heading h2 strong{font-weight:700}.showcase-actions{display:flex;gap:5px}.showcase-actions button{width:32px;height:32px;display:grid;place-items:center;background:none;border:1px solid #c6cec0;cursor:pointer;color:inherit}.showcase-actions svg{width:16px;height:16px}.showcase-window{overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.showcase-window::-webkit-scrollbar{display:none}.showcase-track{display:flex;width:max-content;gap:14px;padding:0 20px}.showcase-item{width:206px;flex-shrink:0;text-decoration:none;color:inherit;display:block}.showcase-preview{height:116px;overflow:hidden;position:relative;background:#1b2422}.showcase-preview img{width:100%;height:100%;object-fit:cover;object-position:center;animation:showcase-life 8s ease-in-out infinite alternate;animation-delay:var(--delay,0s)}.showcase-preview:after{content:'';position:absolute;inset:0;pointer-events:none;border:1px solid #00000015}.showcase-label{display:flex;align-items:center;justify-content:space-between;margin-top:8px;font-size:11px}.showcase-label svg{width:14px;height:14px}.showcase-label small{font-size:10px;color:#687260}.showcase-item:focus-visible{outline:2px solid #407f63;outline-offset:3px}.showcase-item[data-state=planned] .showcase-preview img{filter:saturate(.55);opacity:.7}.showcase-item[data-state=planned] .showcase-preview>span{position:absolute;left:12px;bottom:12px;font-size:22px;font-weight:700;color:white;text-shadow:0 1px 6px #000}.showcase-banner[data-paused=true] img{animation-play-state:paused}.showcase-item[data-demo=ascii] img{filter:grayscale(1) contrast(1.5)}.showcase-item[data-demo=velvet] img{object-position:center 55%}.showcase-item[data-demo=ink] img{filter:grayscale(1)}@keyframes showcase-life{from{transform:scale(1.02) translateX(-1%)}to{transform:scale(1.12) translateX(1%)}}@media(max-width:650px){.showcase-heading{padding:0 24px}.showcase-heading h2{font-size:14px}.showcase-item{width:176px}.showcase-preview{height:100px}.showcase-banner{padding:12px 0 14px}.showcase-track{gap:12px;padding:0 24px}}@media(prefers-reduced-motion:reduce){.showcase-preview img{animation:none!important}}
.showcase-window{scroll-behavior:auto!important}