.content-library-page { margin: 0; background: #050708; color: #f5f5f5; font-family: system-ui, sans-serif; }
.content-library { max-width: 1280px; margin: 0 auto; padding: 32px 24px; }
.content-library h1 { margin: 0 0 12px; font-size: 24px; line-height: 1.4; }
.content-library > p { color: #b8b8b8; line-height: 1.6; }
.content-library-links { display: flex; flex-wrap: wrap; gap: 16px; margin: 16px 0 24px; }
.content-library-links a { color: inherit; text-underline-offset: 4px; }
.content-library__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 16px; }
.content-library__grid--short { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.content-library__pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 32px 0; }
.content-library__pagination a, .content-library__pagination span { padding: 12px; color: inherit; }
.content-library__pagination [aria-current="page"] { background: var(--color-accent-cyan, var(--color-brand-primary, #7d64ff)); color: #111; border-radius: 8px; }
.content-library a:focus-visible { outline: 2px solid var(--color-accent-cyan, var(--color-brand-primary, #7d64ff)); outline-offset: 4px; }
@media (max-width: 1024px) {
    .content-library__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .content-library__grid--short { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
    .content-library { padding: 24px 16px; }
    .content-library__grid, .content-library__grid--short { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; }
    .content-library :is(.pc-long-video-card, .pc-short-video-card) { display: flex; min-width: 0; flex-direction: column; gap: 8px; color: inherit; text-decoration: none; }
    .content-library :is(.pc-long-video-card__cover, .pc-short-video-card__cover) { position: relative; display: block; width: 100%; overflow: hidden; border-radius: 8px; background: #151719; }
    .content-library .pc-long-video-card__cover { aspect-ratio: 16 / 9; }
    .content-library .pc-short-video-card__cover { aspect-ratio: 3 / 4; }
    .content-library :is(.pc-long-video-card__image, .pc-short-video-card__image) { display: block; width: 100%; height: 100%; object-fit: cover; }
    .content-library :is(.pc-long-video-card__shade, .pc-short-video-card__shade) { position: absolute; inset: auto 0 0; height: 48px; background: linear-gradient(transparent, rgba(0, 0, 0, .8)); pointer-events: none; }
    .content-library :is(.pc-long-video-card__meta, .pc-short-video-card__meta) { position: absolute; right: 8px; bottom: 4px; left: 8px; display: flex; justify-content: space-between; gap: 4px; font-size: 12px; color: #fff; }
    .content-library .pc-long-video-card__badges { position: absolute; top: 4px; left: 4px; }
    .content-library .pc-long-video-card__badge { padding: 2px 4px; border-radius: 4px; background: #333; color: #fff; font-size: 10px; }
    .content-library :is(.pc-long-video-card__title, .pc-short-video-card__title) { display: -webkit-box; overflow: hidden; overflow-wrap: anywhere; font-size: 14px; line-height: 20px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
}