.example-feed{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.example-feed-card{border:1px solid var(--border);background:var(--card);border-radius:18px;min-width:0;overflow:hidden}.managed-sample{background:#10110e;min-height:0;position:relative;overflow:hidden}.managed-sample video{aspect-ratio:9/14;object-fit:cover;width:100%;height:100%}.sample-play-surface{cursor:pointer;color:#fff;width:100%;position:absolute;inset:0}.sample-play-surface span{opacity:0;background:#0006;border-radius:50%;place-items:center;width:44px;height:44px;margin:auto;display:grid}.sample-play-surface:hover span,.sample-play-surface:focus-visible span,.sample-play-surface[aria-label=Play\ sample] span{opacity:1}.sample-sound{color:#fff;cursor:pointer;background:#0008;border-radius:50%;padding:10px;position:absolute;bottom:14px;right:14px}.sample-error{color:#fff;background:#000c;width:80%;padding:12px;position:absolute;top:45%;left:10%}.example-feed-copy{padding:20px}.example-feed h2{margin:10px 0;font-size:20px;font-weight:650}.example-feed-description{color:var(--muted-foreground);font-size:13px;line-height:1.7}.example-feed-actions{flex-wrap:wrap;align-items:center;gap:14px;margin-top:18px;font-size:12px;display:flex}@media (width>=768px) and (width<=1100px){.example-feed{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=767px){.examples-page{padding:18px 12px 0}.examples-page>header{margin-bottom:15px}.examples-page>header h1{font-size:26px}.examples-page .examples-context{display:none}.example-feed{height:calc(100svh - 220px - env(safe-area-inset-bottom));scroll-snap-type:y mandatory;overscroll-behavior-y:contain;min-height:340px;display:block;overflow-y:auto}.example-feed-card{scroll-snap-align:start;scroll-snap-stop:always;flex-direction:column;height:100%;margin-bottom:16px;display:flex}.example-feed-card .managed-sample{flex:1}.managed-sample video{object-fit:contain;position:absolute;inset:0}.example-feed-copy{padding:12px}.example-feed h2{margin:5px 0;font-size:16px}.example-feed-description{display:none}.example-feed-actions{gap:10px;margin-top:10px;font-size:11px}}.examples-page :is(h1,h2,h3),.example-feed :is(h1,h2,h3){font-family:var(--font-brand), sans-serif}
