/* Public /content only. Keep Home, the legal readers, shop, and Content Admin unchanged. */
.content-library-page {
    --extras-line: color-mix(in srgb, var(--ink) 15%, transparent);
    --extras-soft: color-mix(in srgb, var(--brand) 6%, var(--panel-strong));
    --extras-accent: color-mix(in srgb, var(--brand) 50%, var(--ink));
    display: grid; gap: clamp(1.7rem, 3vw, 2.6rem); color: var(--ink); padding-block: .25rem 1rem;
}
.content-library-page *, .content-library-page *::before, .content-library-page *::after { box-sizing: border-box; }
.content-library-page :where(h1, h2, h3, p) { margin: 0; }
.content-library-page :where(section, article, nav, div, details, summary, form, label) { min-width: 0; }
.content-library-page [hidden] { display: none !important; }
.content-library-page a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.content-library-page :is(a, button, input, select, summary, [tabindex]):focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
.content-library-page .extras-icon { width: 1.25rem; height: 1.25rem; flex: 0 0 1.25rem; }
.content-library-page .extras-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.content-library-page .extras-kicker { display: flex; align-items: center; gap: .65rem; color: var(--muted); font-size: .74rem; font-weight: 750; line-height: 1.5; letter-spacing: .085em; text-transform: uppercase; }
.content-library-page .extras-brand { display: inline-grid; place-items: center; flex: 0 0 2rem; width: 2rem; height: 2rem; border-radius: .65rem; color: var(--extras-accent); background: var(--extras-soft); border: 1px solid var(--extras-line); font-size: .78rem; font-weight: 850; letter-spacing: -.04em; }
.content-library-page .extras-hero {
    display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .85fr); align-items: center;
    gap: clamp(1.8rem, 4vw, 4rem); padding: clamp(1.25rem, 3vw, 2.5rem);
    border: 1px solid var(--extras-line); border-radius: clamp(1.25rem, 2.2vw, 1.9rem);
    background: var(--panel);
    background: radial-gradient(ellipse at 3% 0%, color-mix(in srgb, var(--brand-2) 11%, transparent), transparent 65%), var(--panel);
    box-shadow: 0 10px 30px color-mix(in srgb, var(--ink) 5%, transparent);
}
.content-library-page .extras-hero h1 { max-width: 16ch; margin-block: 1rem 1.1rem; font-size: clamp(2.5rem, 4.5vw, 4rem); line-height: 1.05; letter-spacing: -.055em; font-weight: 850; text-wrap: balance; overflow-wrap: normal; }
.content-library-page .extras-hero h1 > span { display: block; color: var(--extras-accent); }
.content-library-page .extras-intro { max-width: 48ch; color: var(--muted); font-size: clamp(1rem, 1.5vw, 1.13rem); line-height: 1.65; }
.content-library-page .extras-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-block-start: 1.5rem; }
.content-library-page .extras-action {
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    min-height: 44px; max-width: 100%; padding: .7rem 1rem; margin: 0;
    border: 1px solid var(--extras-line); border-radius: .85rem;
    background: var(--panel-strong); color: var(--ink); font-family: inherit; font-size: .88rem; font-weight: 750; line-height: 1.35;
    text-decoration: none; box-shadow: none; text-align: center; cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}
html[data-theme] .content-library-page .extras-action.extras-action-primary { background: var(--ink) !important; color: var(--panel-strong) !important; border-color: var(--ink) !important; }
.content-library-page .extras-action-secondary { background: transparent; }
.content-library-page .extras-text-link {
    display: inline-flex; align-items: center; justify-content: flex-start; gap: .4rem;
    min-height: 44px; padding: .4rem 0; margin: 0; max-width: 100%; border: 0; border-radius: .3rem;
    background: transparent; color: var(--ink); box-shadow: none; font-family: inherit; font-size: .84rem; font-weight: 650; line-height: 1.45;
    text-decoration: underline; text-decoration-color: transparent; text-underline-offset: .2em; cursor: pointer;
}
.content-library-page .extras-text-link > .extras-icon { width: 1rem; height: 1rem; flex-basis: 1rem; }
.content-library-page .extras-explore { border-inline-start: 1px solid var(--extras-line); padding-inline-start: clamp(1.25rem, 2.6vw, 2.4rem); }
.content-library-page .extras-explore > .extras-kicker { margin-block-end: .65rem; }
.content-library-page .extras-explore-link { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .8rem; padding-block: 1rem; border-block-end: 1px solid var(--extras-line); border-radius: .25rem; }
.content-library-page .extras-explore-link:last-child { border-block-end: 0; padding-block-end: .35rem; }
.content-library-page .extras-explore-link strong { display: block; font-size: .99rem; line-height: 1.35; font-weight: 750; }
.content-library-page .extras-explore-link small { display: block; margin-block-start: .3rem; color: var(--muted); font-size: .8rem; line-height: 1.6; }
.content-library-page .extras-explore-icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: .8rem; background: var(--extras-soft); color: var(--extras-accent); }
.content-library-page .extras-explore-link > .extras-icon { width: 1rem; height: 1rem; flex-basis: 1rem; color: var(--muted); }
.content-library-page .extras-collection, .content-library-page .extras-entry { scroll-margin-block-start: 9rem; }
.content-library-page .extras-collection { border-radius: .85rem; }
.content-library-page .extras-collection-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1rem; margin-block-end: 1rem; }
.content-library-page .extras-collection-heading h2 { font-size: clamp(1.3rem, 2.2vw, 1.7rem); line-height: 1.25; font-weight: 800; letter-spacing: -.025em; }
.content-library-page .extras-collection-heading p { margin-block-start: .4rem; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.content-library-page .extras-collection-heading .extras-result-count { margin: 0; font-size: .81rem; white-space: nowrap; }
/* Search is one clear field; optional controls expand in-flow, never over the cards. */
.content-library-page .extras-tools { margin: 0 0 1.25rem; padding: 0; }
.content-library-page .extras-tools-top { display: flex; align-items: center; gap: 1rem; }
.content-library-page .extras-search { position: relative; display: flex; align-items: center; gap: .65rem; flex: 1 1 auto; margin: 0; }
.content-library-page .extras-search > .extras-icon { position: absolute; inset-inline-start: .95rem; color: var(--muted); pointer-events: none; }
.content-library-page .extras-search input { width: 100%; min-width: 0; min-height: 48px; margin: 0; padding: .8rem 1rem .8rem 2.85rem; padding-inline-start: 2.85rem; padding-inline-end: 1rem; border: 1px solid var(--extras-line); border-radius: .9rem; background: var(--panel); color: var(--ink); font-family: inherit; font-size: 1rem; line-height: 1.5; box-shadow: none; }
.content-library-page .extras-search input::placeholder { color: var(--muted); opacity: 1; }
.content-library-page .extras-reset { flex: 0 0 auto; }
.content-library-page .extras-filters { margin-block-start: .4rem; border: 0; border-radius: .85rem; padding: 0; background: transparent; }
.content-library-page .extras-filters > summary { display: flex; align-items: center; gap: .5rem; width: fit-content; min-height: 44px; padding: .5rem .2rem; border-radius: .4rem; color: var(--ink); font-size: .84rem; font-weight: 650; cursor: pointer; list-style: none; }
.content-library-page summary::-webkit-details-marker { display: none; }
.content-library-page .extras-filters > summary > .extras-icon { width: 1rem; height: 1rem; flex-basis: 1rem; }
.content-library-page .extras-filters > summary > .extras-icon:last-child { transition: transform .16s ease; }
.content-library-page .extras-filters[open] > summary > .extras-icon:last-child { transform: rotate(180deg); }
.content-library-page .extras-filter-count { display: inline-grid; place-items: center; min-width: 1.35rem; height: 1.35rem; padding-inline: .3rem; border: 1px solid var(--extras-line); border-radius: 99px; background: var(--extras-soft); color: var(--extras-accent); font-size: .75rem; }
.content-library-page .extras-filter-fields { display: flex; flex-wrap: wrap; gap: .9rem; padding: 1rem; margin-block-start: .2rem; border: 1px solid var(--extras-line); border-radius: .85rem; background: var(--panel); }
.content-library-page .extras-filter-fields label { display: grid; gap: .45rem; flex: 1 1 180px; margin: 0; color: var(--muted); font-size: .8rem; font-weight: 650; }
.content-library-page .extras-filter-fields select { width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: .65rem .8rem; border: 1px solid var(--extras-line); border-radius: .65rem; background: var(--panel-strong); color: var(--ink); font-family: inherit; font-size: 1rem; line-height: 1.5; box-shadow: none; }
/* Cards have one surface, and actions point to real media instead of placeholder reloads. */
.content-library-page .extras-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 1.1rem; }
.content-library-page .extras-entry { display: flex; flex-direction: column; margin: 0; min-width: 0; border: 1px solid var(--extras-line); border-radius: 1.15rem; background: var(--panel); box-shadow: 0 4px 16px color-mix(in srgb, var(--ink) 3%, transparent); }
.content-library-page .extras-entry:target { outline: 2px solid var(--extras-accent); outline-offset: 4px; }
.content-library-page .extras-media { position: relative; flex: 0 0 auto; width: 100%; aspect-ratio: 16 / 9; border-start-start-radius: inherit; border-start-end-radius: inherit; overflow: hidden; background: var(--extras-soft); border-block-end: 1px solid var(--extras-line); }
.content-library-page .extras-media :is(img, video) { display: block; width: 100%; height: 100%; max-width: 100%; aspect-ratio: 16 / 9; object-fit: contain; margin: 0; border: 0; border-radius: 0; }
.content-library-page .extras-media video { background: #080808; }
.content-library-page .extras-preview-link { display: block; height: 100%; }
.content-library-page .extras-preview-link:focus-visible { outline-offset: -5px; }
.content-library-page .extras-preview-fallback { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .65rem; width: 100%; height: 100%; padding: 1rem; color: var(--muted); font-size: .8rem; }
.content-library-page .extras-preview-fallback > .extras-icon { width: 2rem; height: 2rem; flex-basis: 2rem; color: var(--extras-accent); }
.content-library-page .extras-entry-body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: stretch; gap: .65rem; padding: 1.15rem; }
.content-library-page .extras-entry-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem .8rem; margin-block-end: .2rem; }
.content-library-page .extras-format-label, .content-library-page .extras-access-label { display: inline-flex; align-items: center; gap: .4rem; color: var(--muted); font-size: .73rem; font-weight: 650; line-height: 1.5; }
.content-library-page .extras-format-label > .extras-icon, .content-library-page .extras-access-label > .extras-icon { width: .98rem; height: .98rem; flex-basis: .98rem; }
.content-library-page .extras-access-label.is-locked { color: var(--extras-accent); }
.content-library-page .extras-entry h3 { font-size: 1.16rem; font-weight: 800; line-height: 1.35; letter-spacing: -.02em; overflow-wrap: anywhere; }
.content-library-page .extras-entry-category { color: var(--extras-accent); font-size: .77rem; line-height: 1.5; font-weight: 650; overflow-wrap: anywhere; }
.content-library-page :is(.extras-description-text, .extras-description-excerpt, .extras-description > p) { color: var(--muted); font-size: .9rem; line-height: 1.7; white-space: pre-line; overflow-wrap: anywhere; }
.content-library-page .extras-description { margin: 0; padding: 0; border: 0; background: transparent; border-radius: .35rem; }
.content-library-page .extras-description > summary { margin: 0; padding: 0; list-style: none; cursor: pointer; border-radius: .35rem; }
.content-library-page .extras-description-excerpt { display: block; }
.content-library-page .extras-description-toggle { display: inline-flex; gap: .4rem; align-items: center; min-height: 44px; color: var(--ink); font-size: .82rem; font-weight: 650; }
.content-library-page .extras-description-toggle > .extras-icon { width: 1rem; height: 1rem; flex-basis: 1rem; }
.content-library-page .extras-when-open, .content-library-page .extras-description[open] .extras-description-excerpt, .content-library-page .extras-description[open] .extras-when-closed { display: none; }
.content-library-page .extras-description[open] .extras-when-open { display: inline; }
.content-library-page .extras-description[open] .extras-description-toggle > .extras-icon { transform: rotate(180deg); }
.content-library-page .extras-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; margin-block: .3rem; }
.content-library-page .extras-tag { display: inline-block; padding: .2rem .5rem; max-width: 100%; border-radius: .4rem; background: var(--extras-soft); color: var(--muted); font-size: .71rem; line-height: 1.5; overflow-wrap: anywhere; }
.content-library-page .extras-more-tags { display: block; padding: 0; margin: 0; border: 0; background: transparent; max-width: 100%; }
.content-library-page .extras-more-tags > summary { display: inline-flex; align-items: center; min-height: 44px; padding-inline: .3rem; font-size: .73rem; line-height: 1.5; color: var(--ink); cursor: pointer; list-style: none; border-radius: .35rem; }
.content-library-page .extras-more-tags[open] { flex-basis: 100%; }
.content-library-page .extras-more-tags > div { display: flex; flex-wrap: wrap; gap: .35rem .5rem; }
.content-library-page .extras-entry-footer { padding-block-start: .5rem; margin-block-start: auto; border-block-start: 1px solid var(--extras-line); }
.content-library-page .extras-entry-actions { display: flex; flex-wrap: wrap; gap: .15rem 1rem; }
.content-library-page .extras-lock-message { margin-block-start: .2rem; color: var(--muted); font-size: .8rem; line-height: 1.6; }
.content-library-page :is(.extras-empty, .extras-no-results) { display: flex; align-items: flex-start; gap: 1.2rem; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--extras-line); border-radius: 1.25rem; background: var(--panel); }
.content-library-page .extras-empty-icon { display: grid; place-items: center; flex: 0 0 3.25rem; width: 3.25rem; height: 3.25rem; color: var(--extras-accent); border-radius: 1rem; background: var(--extras-soft); }
.content-library-page .extras-empty-icon > .extras-icon { width: 1.5rem; height: 1.5rem; }
.content-library-page :is(.extras-empty, .extras-no-results) h3 { font-size: 1.17rem; font-weight: 750; line-height: 1.35; letter-spacing: -.02em; }
.content-library-page :is(.extras-empty, .extras-no-results) p { max-width: 65ch; margin-block: .55rem .4rem; color: var(--muted); font-size: .93rem; line-height: 1.7; }
.content-library-page .extras-no-results { flex-direction: column; align-items: center; gap: .8rem; padding-block: 2rem; text-align: center; }
.content-library-page .extras-no-results p { margin: 0; }
.content-library-page .extras-no-results .extras-action { margin-block-start: .3rem; }
.content-library-page .extras-help { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .3rem 1.5rem; padding-block-start: .65rem; border-block-start: 1px solid var(--extras-line); }
.content-library-page .extras-access-help { flex: 1 1 320px; max-width: 82ch; padding: 0; border: 0; background: transparent; }
.content-library-page .extras-access-help > summary { display: inline-flex; align-items: center; justify-content: space-between; gap: .7rem; min-height: 44px; padding: .4rem 0; border-radius: .35rem; color: var(--ink); font-size: .85rem; font-weight: 650; list-style: none; cursor: pointer; }
.content-library-page .extras-access-help > summary .extras-icon { width: 1rem; height: 1rem; flex-basis: 1rem; }
.content-library-page .extras-access-help[open] > summary .extras-icon { transform: rotate(180deg); }
.content-library-page .extras-access-help > div { padding-block: .15rem .6rem; color: var(--muted); font-size: .83rem; line-height: 1.7; }
.content-library-page .extras-access-help p + p { margin-block-start: .6rem; }
@media (hover: hover) {
    .content-library-page .extras-action:hover { transform: translateY(-2px); border-color: var(--ink); }
    .content-library-page .extras-action-primary:hover { opacity: .9; }
    .content-library-page .extras-text-link:hover, .content-library-page .extras-explore-link:hover strong { text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: .2em; }
    .content-library-page .extras-explore-link:hover > .extras-icon { color: var(--ink); }
    .content-library-page :is(.extras-filters > summary, .extras-access-help > summary, .extras-more-tags > summary):hover { color: var(--extras-accent); }
}
@media (max-width: 1000px) {
    .content-library-page .extras-hero { grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr); gap: 1.5rem; }
    .content-library-page .extras-hero h1 { font-size: clamp(2.5rem, 5.3vw, 3.4rem); }
    .content-library-page .extras-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .content-library-page .extras-hero { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
    .content-library-page .extras-hero h1 { font-size: clamp(2.4rem, 6.5vw, 3.5rem); }
    .content-library-page .extras-explore { padding: 1.2rem 0 0; border-inline-start: 0; border-block-start: 1px solid var(--extras-line); }
    .content-library-page .extras-explore { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem 1.1rem; }
    .content-library-page .extras-explore > .extras-kicker { flex-basis: 100%; margin-block-end: .2rem; }
    .content-library-page .extras-explore-link { grid-template-columns: auto minmax(0, 1fr); gap: .4rem; min-height: 44px; padding-block: .3rem; border: 0; }
    .content-library-page .extras-explore-link strong { font-size: .82rem; }
    .content-library-page .extras-explore-link small, .content-library-page .extras-explore-link > .extras-icon { display: none; }
    .content-library-page .extras-explore-icon { width: 1.4rem; height: 1.4rem; background: transparent; border-radius: .2rem; }
    .content-library-page .extras-explore-icon > .extras-icon { width: 1rem; height: 1rem; flex-basis: 1rem; }
}
@media (max-width: 600px) {
    .content-library-page { gap: 1.6rem; }
    .content-library-page .extras-hero { padding: 1.15rem; }
    .content-library-page .extras-hero h1 { margin-block: .8rem; font-size: clamp(2.15rem, 8.8vw, 3rem); }
    .content-library-page .extras-intro { font-size: .96rem; }
    .content-library-page .extras-actions { margin-block-start: 1.15rem; }
    .content-library-page .extras-grid { grid-template-columns: minmax(0, 1fr); }
    .content-library-page .extras-tools-top { flex-wrap: wrap; gap: .15rem .75rem; }
    .content-library-page .extras-search { flex-basis: 100%; }
    .content-library-page .extras-filters { margin-block-start: .2rem; }
    .content-library-page .extras-filter-fields { padding: .8rem; gap: .8rem; }
    .content-library-page .extras-filter-fields label { flex-basis: 100%; }
    .content-library-page .extras-empty { flex-direction: column; gap: .9rem; }
    .content-library-page .extras-help { gap: .1rem 1rem; }
    .content-library-page .extras-access-help { flex-basis: 100%; }
    .content-library-page .extras-search input { font-size: 1rem; }
}
@media (max-width: 370px) {
    .content-library-page .extras-action { flex: 1 1 100%; }
    .content-library-page .extras-explore-link { gap: .6rem; }
    .content-library-page .extras-explore-icon { width: 1.4rem; height: 1.4rem; }
}
@media (prefers-reduced-motion: reduce) {
    .content-library-page *, .content-library-page *::before, .content-library-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
    .content-library-page .extras-action:hover { transform: none; }
}
html[data-motion-preference="reduce"] .content-library-page *, html[data-motion-preference="none"] .content-library-page *, body.a11y-reduced-motion .content-library-page *, body.a11y-no-motion .content-library-page * { animation: none !important; transition: none !important; }
@media (forced-colors: active) {
    .content-library-page :is(.extras-hero, .extras-entry, .extras-action, .extras-empty, .extras-no-results, .extras-filter-fields) { border-color: CanvasText; }
    .content-library-page :is(a, button, summary):focus-visible { outline-color: Highlight; }
}
@media print {
    .content-library-page :is(.extras-actions, .extras-explore, .extras-tools, .extras-help, .extras-entry-actions) { display: none !important; }
    .content-library-page .extras-hero { display: block; padding: 0 0 1rem; border: 0; box-shadow: none; }
    .content-library-page .extras-hero h1 { max-width: none; font-size: 2rem; }
    .content-library-page .extras-grid { display: block; }
    .content-library-page .extras-entry { break-inside: avoid; margin-block-end: 1rem; box-shadow: none; }
    .content-library-page .extras-media { max-height: 200px; width: min(100%, 360px); border: 0; }
    .content-library-page .extras-entry-footer { margin-block-start: 0; }
}