.media-library{grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr));gap:2rem 1.5rem;margin:0;padding:0;list-style:none;display:grid}.media-library>li{align-content:start;gap:.75rem;min-width:0;display:grid}.media-preview{aspect-ratio:4/5;border:1px solid var(--border);background:var(--bg-card);color:var(--text-bright);border-radius:12px;display:block;position:relative;overflow:hidden}.media-preview img{object-fit:contain;width:100%;height:100%;display:block;position:absolute;inset:0}.media-preview-play{border:1px solid var(--border-strong);background:var(--bg-card);width:44px;height:44px;color:var(--text-bright);border-radius:50%;place-items:center;display:grid;position:absolute;inset-block-end:.75rem;inset-inline-start:.75rem}.media-preview-play svg{fill:currentColor;width:24px;height:24px}.media-formats{flex-wrap:wrap;gap:.5rem;display:flex}.media-formats a{border:1px solid var(--border-strong);background:var(--bg-card);min-height:44px;color:var(--text-bright);border-radius:8px;flex:6.5rem;justify-content:center;align-items:center;padding:.65rem 1rem;font-size:1.125rem;font-weight:700;line-height:1.3;text-decoration:none;display:flex}.media-formats a:hover{background:var(--bg-elevated)}.media-preview:focus-visible,.media-formats a:focus-visible{outline:3px solid var(--text-bright);outline-offset:3px}@media (forced-colors:active){.media-preview,.media-preview-play,.media-formats a{color:canvastext;background:canvas;border-color:buttontext}}