.media-platform-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ui-space-5)}.media-platform-card{min-width:0}.media-platform-card-action{display:block;width:100%;padding:0;border:0;color:inherit;text-align:left;background:transparent;cursor:pointer}.media-platform-card-action:focus-visible{outline:3px solid var(--ui-color-focus);outline-offset:4px;border-radius:var(--ui-radius-lg)}.media-platform-frame{position:relative;display:grid;place-items:center;overflow:hidden;width:100%;border:1px solid var(--ui-color-border);border-radius:var(--ui-radius-lg);background:var(--ui-color-surface-raised)}.media-platform-frame img,.media-platform-frame video{width:100%;height:100%;object-fit:cover}.media-platform-card.is-locked .media-platform-frame img{filter:blur(14px);transform:scale(1.08)}.media-platform-placeholder{max-width:18ch;padding:20px;color:var(--ui-color-muted);text-align:center}.media-platform-badge,.media-platform-lock{position:absolute;padding:6px 9px;border-radius:var(--ui-radius-pill);color:#fff;background:rgba(23,23,25,.78);font-size:var(--ui-font-xs);font-weight:900}.media-platform-badge.type{top:10px;left:10px}.media-platform-badge.duration{right:10px;bottom:10px}.media-platform-lock{right:10px;bottom:10px}.media-platform-card-copy{display:grid;gap:5px;padding:12px 2px}.media-platform-card-copy>span{display:-webkit-box;overflow:hidden;color:var(--ui-color-muted);font-size:var(--ui-font-sm);-webkit-box-orient:vertical;-webkit-line-clamp:2}.media-platform-skeleton{aspect-ratio:4/5;border-radius:var(--ui-radius-lg);background:linear-gradient(90deg,var(--ui-color-surface-raised),var(--ui-color-primary-soft),var(--ui-color-surface-raised));background-size:200% 100%;animation:ui-shimmer 1.3s linear infinite}.media-platform-state{grid-column:1/-1;padding:48px 24px;border:1px dashed var(--ui-color-border);border-radius:var(--ui-radius-lg);color:var(--ui-color-muted);text-align:center;background:var(--ui-color-surface)}.media-platform-state h3{margin:0 0 8px;color:var(--ui-color-text)}.media-platform-state p{margin:0}.media-platform-filters{margin-bottom:var(--ui-space-5)}.media-platform-filters label{display:grid;gap:8px;max-width:480px;color:var(--ui-color-muted);font-size:var(--ui-font-sm);font-weight:700}.media-platform-viewer{position:fixed;z-index:var(--ui-z-dialog);inset:0;display:grid;grid-template-columns:56px minmax(0,1fr) 56px;grid-template-rows:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:24px;color:#fff;background:rgba(10,8,9,.92)}.media-platform-viewer[hidden]{display:none}.media-platform-viewer-close{grid-column:3;justify-self:end}.media-platform-viewer-previous{grid-column:1;grid-row:2}.media-platform-viewer-next{grid-column:3;grid-row:2}.media-platform-viewer-close,.media-platform-viewer-previous,.media-platform-viewer-next{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(255,255,255,.35);border-radius:50%;color:#fff;background:rgba(0,0,0,.35);font-size:24px;cursor:pointer}.media-platform-viewer-content{grid-column:2;grid-row:2;display:grid;place-items:center;min-width:0;min-height:0;height:100%}.media-platform-viewer-content img,.media-platform-viewer-content video{max-width:100%;max-height:calc(100vh - 150px);object-fit:contain}.media-platform-viewer-title{grid-column:2;grid-row:3;margin:0;text-align:center}.media-platform-viewer-locked{display:grid;place-items:center;width:min(620px,100%);aspect-ratio:16/9;border:1px solid rgba(255,255,255,.25);border-radius:var(--ui-radius-lg);background:rgba(255,255,255,.08);font-size:var(--ui-font-lg);font-weight:800}.media-viewer-open{overflow:hidden}
@media(max-width:999px){.media-platform-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:639px){.media-platform-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.media-platform-viewer{grid-template-columns:44px minmax(0,1fr) 44px;padding:12px}.media-platform-viewer-close,.media-platform-viewer-previous,.media-platform-viewer-next{width:42px;height:42px}.media-platform-card-copy>span{display:none}}
@media(max-width:359px){.media-platform-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.media-platform-skeleton{animation-duration:.01ms;animation-iteration-count:1}}
