.demo-section:has(.showcase){width:min(1120px,100% - 48px)}.showcase .example-title{margin-bottom:10px}.showcase-intro{text-align:center;color:#aebed5;margin-bottom:25px;font-size:12px}.showcase-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none;display:grid}.showcase-item{min-width:0}.showcase-tile{text-align:left;width:100%;color:var(--text);cursor:pointer;background:0 0;border:0;border-radius:16px;padding:0;display:block}.showcase-media{aspect-ratio:9/16;background:#071323;border:1px solid #4274b0;border-radius:15px;transition:border-color .2s,box-shadow .2s;display:block;position:relative;overflow:hidden;box-shadow:0 8px 26px #0060ca14}.showcase-loop,.showcase-fallback{object-fit:cover;width:100%;height:100%;display:block}.showcase-tile:hover .showcase-media{border-color:#91d6ff;box-shadow:0 0 25px #137cfd38}.showcase-badge{color:#e3f0ff;letter-spacing:.35px;background:#030a16d9;border:1px solid #d9ebff38;border-radius:6px;padding:3px 7px;font-size:9px;font-weight:700;position:absolute;top:9px;left:9px}.showcase-play{color:#d9f2ff;background:#061224c9;border:1px solid #dbedff73;border-radius:50%;place-items:center;width:33px;height:33px;display:grid;position:absolute;bottom:9px;right:9px}.showcase-business,.showcase-city,.showcase-style{display:block}.showcase-business{color:#eef5ff;margin-top:12px;font-size:12px;font-weight:800;line-height:1.5}.showcase-city{color:#99bfe8;margin-top:2px;font-size:11px}.showcase-style{color:#9dafc7;overflow-wrap:anywhere;margin-top:7px;font-size:10px;line-height:1.65}.showcase-disclaimer{text-align:center;color:#96accb;margin-top:25px;font-size:10px}.showcase-viewer{color:#fff;overscroll-behavior:contain;background:0 0;border:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;position:fixed;inset:0;overflow:hidden}.showcase-viewer[open]{place-items:center;display:grid}.showcase-viewer::backdrop{-webkit-backdrop-filter:blur(12px);background:#01040bee}.showcase-viewer-panel{width:min(45dvh,90vw);position:relative}.showcase-viewer-panel h2{font:700 11px/1.5 var(--body);letter-spacing:.3px;text-align:center;color:#dae9ff;position:absolute;bottom:calc(100% + 12px);left:0;right:0}.showcase-full{aspect-ratio:9/16;background:#030710;border-radius:12px;width:100%;height:auto;max-height:80dvh;display:block;box-shadow:0 0 0 1px #659cd04d,0 16px 70px #000b}.showcase-close{z-index:2;right:max(16px, env(safe-area-inset-right));top:max(16px, env(safe-area-inset-top));color:#fff;background:#10223bed;border:1px solid #a8cef777;border-radius:50%;place-items:center;width:50px;height:50px;display:grid;position:absolute;box-shadow:0 3px 25px #0008}.showcase-close:hover{background:#20497b}.showcase-playback-message{text-align:center;color:#d4e4fc;font-size:11px;line-height:1.5;position:absolute;top:calc(100% + 9px);left:0;right:0}@media (max-width:900px){.showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:600px){.demo-section:has(.showcase){width:calc(100% - 40px)}.showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 14px}.showcase-business{font-size:11px}.showcase-style{font-size:9px}.showcase-intro{font-size:11px}.showcase-viewer-panel{width:min(45dvh,90vw)}.showcase-badge{font-size:8px}.showcase-close{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right))}}@media (prefers-reduced-motion:reduce){.showcase-media{transition:none}}