@layer starlight,reset,tokens,base;@layer components{.vid-grid{gap:var(--canon-space-3) var(--col-gap);grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none;display:grid}.vid-grid:is([data-count="1"],[data-count="2"]){grid-template-columns:minmax(0,1fr)}.vid-grid:is([data-count="1"],[data-count="2"]) .vid{column-gap:var(--col-gap);row-gap:var(--canon-space-1);grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-content:start;display:grid}.vid-grid:is([data-count="1"],[data-count="2"]) .vid>*{grid-column:2}.vid-grid:is([data-count="1"],[data-count="2"]) .vid>.vid-thumb{grid-area:1/1/span 4}.vid-grid:is([data-count="1"],[data-count="2"]) .vid-where{margin-left:0}.vid-grid>li{min-width:0;display:flex}.vid{gap:var(--canon-space-1);flex-direction:column;width:100%;min-width:0;display:flex;position:relative}.vid-thumb{aspect-ratio:16/9;background:var(--tape-ground);border-radius:3px;margin:0;position:relative;overflow:hidden}.vid-thumb :is(picture,img){width:100%;height:100%;display:block}.vid-thumb img{object-fit:cover}.vid-thumb-empty{width:100%;height:100%;color:var(--tape-ink);place-items:center;display:grid}.vid-play{left:var(--canon-space-1);bottom:var(--canon-space-1);aspect-ratio:1;width:2.75rem;color:var(--on-amber);background:var(--amber);transition:scale var(--duration-control) var(--ease-standard);border-radius:50%;place-items:center;display:grid;position:absolute}.vid-play .icon{fill:currentColor;translate:1px}.vid-dur{right:var(--canon-space-1);bottom:var(--canon-space-1);padding:.15rem var(--canon-space-n1);font-family:var(--font-mono-stack);font-size:var(--type-micro);font-variant-numeric:tabular-nums;color:var(--tape-ink);background:var(--tape-ground);position:absolute}.vid-title{font-family:var(--font-serif-stack);font-weight:420;font-size:var(--canon-type-1-3);letter-spacing:-.012em;text-wrap:balance;margin:0;line-height:1.15}.vid-link{color:var(--ink);text-decoration:none}.vid-link:after{content:"";z-index:1;position:absolute;inset:0}.vid-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}.vid:hover .vid-title{text-decoration:underline;-webkit-text-decoration-color:var(--amber);text-decoration-color:var(--amber);text-underline-offset:.18em;text-decoration-thickness:1px}.vid:is(:hover,:focus-within) .vid-play{scale:1.08}.vid-meta{max-width:none;font-family:var(--font-mono-stack);font-size:var(--type-micro);color:var(--ink-3);font-variant-numeric:tabular-nums;flex-wrap:wrap;align-items:baseline;gap:0 .35em;margin:0;display:flex}.vid-where{margin-left:auto}.vid-where .icon{vertical-align:-.08em;display:inline-block}.vid-more{gap:var(--canon-space-1) var(--canon-space-3);margin-top:var(--canon-space-3);flex-wrap:wrap;display:flex}.vd-scope{color:var(--ink-3);max-width:52ch}.vd-empty{color:var(--ink-3)}@media (width<=1099px){.vid-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=699px){.vid-grid,.vid-grid:is([data-count="1"],[data-count="2"]){grid-template-columns:minmax(0,1fr);max-width:none}.vid-grid:is([data-count="1"],[data-count="2"]) .vid{display:flex}}@media (forced-colors:active){.vid-play,.vid-dur{forced-color-adjust:none}}}@layer scenes,utilities;
