/* Library extension of the approved Esty guide page. */
[hidden] { display: none !important; }
button { cursor: pointer; }
.category-range { margin-top: 18px; color: var(--muted); font-size: 0.9375rem; display:flex; align-items:center; gap:10px; }
.library-intro { padding-bottom: 42px; }
.library-facts { display:flex; gap:12px; margin-top:16px; font-size:0.9375rem !important; color:var(--primary) !important; }
.library-search { max-width: 780px; margin-bottom: 44px; }
.search-field { min-width: 0; }
.search-field > label { display:block; margin-bottom:10px; font-size:1rem; font-weight:600; }
.search-input { display:flex; align-items:center; gap:14px; min-height:62px; border:1px solid #dce3eb; border-radius:10px; background:var(--surface); padding:0 19px; }
.search-input:focus-within { outline:2px solid var(--primary); outline-offset:3px; }
.search-input > svg { color:var(--primary); }
.search-input input { min-width:0; width:100%; flex:1; padding:15px 0; background:transparent; border:0; color:var(--ink); border-radius:0; outline:none; font-size:1.125rem; line-height:1.5; }
.search-input input:focus-visible { outline:none; }
.search-input input::placeholder { color:var(--muted); opacity:1; }
.search-input input::-webkit-search-cancel-button { display:none; }
.clear-search,.text-button { background:none; border:0; color:var(--primary); padding:8px 5px; min-height:44px; font-size:0.9375rem; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.clear-search { flex-shrink:0; }
.search-feedback { min-height:26px; margin-top:10px; font-size:0.875rem; color:var(--muted); }
.featured-guide { display:grid; grid-template-columns:1.12fr 1fr; gap:50px; align-items:center; padding:28px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.featured-image { display:block; position:relative; overflow:hidden; border-radius:9px; background:var(--film); }
.featured-image img { width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; transition:transform .25s ease; }
.featured-image:hover img { transform:none; }
.watch-label { position:absolute; bottom:16px; right:16px; display:inline-flex; align-items:center; gap:9px; min-height:40px; padding:7px 14px; border-radius:100px; font-size:0.875rem; color:var(--surface); background:rgba(23,36,59,.94); }
.watch-label svg { width:17px; height:17px; }
.featured-copy { padding-inline-end:24px; }
.featured-copy h2 { font-size:1.9375rem; line-height:1.4; letter-spacing:-.025em; margin-bottom:12px; }
.featured-copy > p:not(.eyebrow) { color:var(--muted); font-size:1.125rem; line-height:1.75; max-width:36ch; }
.featured-copy .text-link { margin-top:16px; font-size:1rem; }
.category-section { padding-top:72px; }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); }
.category-card { min-height:245px; display:flex; flex-direction:column; padding:25px 25px 23px; border-bottom:1px solid var(--line); position:relative; transition:background .18s ease; }
.category-card:not(:nth-child(3n)) { border-inline-end:1px solid var(--line); }
.category-card:hover { background:var(--surface); }
.category-topline { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:0.8125rem; gap:10px; margin-bottom:17px; }
.category-topline bdi { color:var(--primary); font-variant-numeric:tabular-nums; }
.category-topline svg { width:19px; height:19px; color:var(--primary); transition:transform .18s ease; }
.category-card:hover .category-topline svg { transform:none; }
.category-card h3 { font-size:1.4375rem; line-height:1.45; letter-spacing:-.02em; margin-bottom:9px; }
.category-card > p { font-size:1rem; color:var(--muted); line-height:1.7; }
.category-foot { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:auto; padding-top:22px; color:var(--primary); font-size:0.8125rem; }
.category-foot > span+span::before { content:'·'; margin-inline-end:9px; color:var(--muted); }
.search-results { padding-top:10px; padding-bottom:30px; min-height:250px; }
.result-list { border-top:1px solid var(--line); }
.search-result { display:grid; grid-template-columns:48px minmax(0,1fr) 24px; align-items:center; gap:22px; padding:23px 14px; border-bottom:1px solid var(--line); }
.search-result:hover { background:var(--surface); }
.search-result-copy { min-width:0; display:grid; }
.result-category { font-size:0.8125rem; color:var(--primary); margin-bottom:4px; }
.search-result strong { font-family:Heebo,sans-serif; font-size:1.25rem; font-weight:500; line-height:1.55; }
.search-result-copy > span:last-child { font-size:1rem; color:var(--muted); margin-top:5px; }
.empty-results { color:var(--muted); padding:28px 0; font-size:1.0625rem; }
.empty-results a { color:var(--primary); text-decoration:underline; text-underline-offset:4px; }
.guide-tools { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:30px; }
.guide-tools .search-field { max-width:620px; }
.guide-tools .search-input { min-height:52px; padding-inline:14px; }
.guide-tools .search-input input { font-size:1rem; padding-block:12px; }
.guide-tools .search-field > label { font-size:0.875rem; margin-bottom:7px; }
.details-actions { display:flex; align-items:center; gap:8px; color:var(--muted); padding-bottom:3px; white-space:nowrap; }
#category-feedback { margin-bottom:20px; }
.transcript { margin-top:16px; max-width:830px; font-size:0.9375rem; color:var(--muted); }
.transcript summary { width:fit-content; cursor:pointer; min-height:44px; padding:10px 0; text-decoration:underline; text-underline-offset:4px; }
.transcript > div { padding:10px 18px 16px; border-inline-start:1px solid var(--line); }
.transcript p+p { margin-top:8px; }
.category-pagination { display:grid; grid-template-columns:1fr 1fr; gap:35px; padding-block:45px 60px; }
.category-pagination a { display:flex; flex-direction:column; align-items:flex-start; padding-block:12px; }
.category-pagination a:last-child { align-items:flex-end; text-align:end; }
.category-pagination span { color:var(--muted); font-size:0.875rem; margin-bottom:6px; }
.category-pagination strong { font-family:Heebo,sans-serif; font-size:1.125rem; font-weight:500; }
.category-pagination a:hover strong { color:var(--primary); }
.site-footer p { font-size:0.875rem; }
.site-footer a { gap:10px; }
.guides-page .site-footer { flex-wrap:wrap; padding-bottom:132px; }
.footer-legal { display:flex; flex-wrap:wrap; gap:10px 24px; flex-basis:100%; padding-top:12px; border-top:1px solid var(--line); }
.footer-legal a { min-height:44px; display:inline-flex; align-items:center; text-decoration:underline; text-underline-offset:4px; }
html[data-access-contrast] .guides-page { --paper:#fff; --surface:#fff; --ink:#101820; --muted:#101820; --primary:#101820; --line:#687587; --film:#101820; background:var(--paper); color:var(--ink); }
html[data-access-contrast] .guides-page #main .film-heading :is(h2,span),
html[data-access-contrast] .guides-page #main .watch-label { color:#fff; }
html[data-access-size]:not([data-access-size="100"]) .guides-page :is(.site-header,.eyebrow,.library-facts,.category-range,.film-heading,.details-actions,.category-topline) { flex-wrap:wrap; }
html[data-access-size]:not([data-access-size="100"]) .guides-page :is(.intro,.featured-guide,.category-grid,.guide-tools,.guide-result,.category-pagination) { grid-template-columns:minmax(0,1fr); }
html[data-access-size]:not([data-access-size="100"]) .guides-page :is(.intro-copy,.intro-aside,.featured-copy,.guide-body,.category-card,.category-pagination a) { min-width:0; overflow-wrap:anywhere; }
html[data-access-size]:not([data-access-size="100"]) .guides-page h1 { overflow-wrap:anywhere; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .category-card { border-inline-end:0; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .guide summary { grid-template-columns:max-content minmax(0,1fr) 34px; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .guide-body { padding-inline:18px; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .guide-steps li { padding-inline-start:2.5rem; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .step-number { width:1.5625rem; height:1.5625rem; top:.25rem; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .search-result { grid-template-columns:max-content minmax(0,1fr) 24px; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .details-actions { white-space:normal; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .watch-label { position:static; border-radius:0; justify-content:center; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .category-pagination a:last-child { align-items:flex-start; text-align:start; }
@media(max-width:950px) {
 .featured-guide { gap:28px; padding:22px; }
 .featured-copy { padding-inline-end:0; }
 .featured-copy h2 { font-size:1.625rem; }
 .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .category-card:not(:nth-child(3n)) { border-inline-end:0; }
 .category-card:nth-child(odd) { border-inline-end:1px solid var(--line); }
 .category-card { min-height:225px; }
}
@media(max-width:700px) {
 .featured-guide { grid-template-columns:1fr; gap:23px; padding:18px; }
 .featured-copy { padding:0 5px 5px; }
 .featured-copy h2 { font-size:1.75rem; }
 .featured-copy > p:not(.eyebrow) { max-width:none; font-size:1.0625rem; }
 .guide-tools { grid-template-columns:1fr; gap:8px; }
 .details-actions { justify-content:flex-end; }
}
@media(max-width:600px) {
 .header-label { display:none; }
 .library-intro { padding-bottom:29px; }
 .library-facts { margin-top:12px; font-size:0.875rem !important; }
 .library-search { margin-bottom:26px; }
 .search-field > label { font-size:0.9375rem; }
 .search-input { min-height:56px; gap:10px; padding-inline:14px; }
 .search-input input { font-size:1rem; padding-block:14px; }
 .search-input > svg { width:20px; height:20px; }
 .search-feedback { font-size:0.8125rem; margin-top:8px; }
 .featured-guide { padding:12px; border-radius:12px; gap:20px; }
 .featured-copy { padding:0 8px 8px; }
 .featured-copy h2 { font-size:1.6875rem; }
 .watch-label { right:10px; bottom:10px; font-size:0.75rem; padding:5px 11px; min-height:36px; }
 .category-section { padding-top:45px; }
 .category-grid { grid-template-columns:1fr; }
 .category-card,.category-card:nth-child(odd) { border-inline-end:0; min-height:0; padding:23px 5px; }
 .category-topline { margin-bottom:12px; }
 .category-card h3 { font-size:1.375rem; margin-bottom:6px; }
 .category-foot { padding-top:15px; font-size:0.8125rem; }
 .search-result { grid-template-columns:29px minmax(0,1fr) 19px; gap:12px; padding:20px 3px; }
 .search-result strong { font-size:1.0625rem; }
 .search-result-copy > span:last-child { font-size:0.9375rem; }
 .search-results .section-heading { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
 .category-range { margin-top:13px; font-size:0.875rem; }
 .category-pagination { gap:20px; padding-block:29px 38px; }
 .category-pagination span { font-size:0.75rem; }
 .category-pagination strong { font-size:1rem; }
 .site-footer { flex-wrap:wrap; }
 .site-footer p { font-size:0.75rem; }
 .site-footer a { gap:5px; }
}
@media(prefers-reduced-motion:reduce) {
 .featured-image img,.category-card,.category-topline svg { transition:none; }
 .featured-image:hover img,.category-card:hover .category-topline svg { transform:none; }
}
@media print {
 .library-search,.search-results,.guide-tools,.search-feedback,.category-pagination,.transcript { display:none; }
 .category-grid { grid-template-columns:repeat(2,1fr); }
 .category-card { break-inside:avoid; }
 .guide[open] { background:white; }
}

/* The guide library uses the same restrained tokens as the public site. */
.guides-page .site-header { min-height:96px; gap:24px; }
.guides-page .intro { padding-block:64px 48px; gap:64px; }
.guides-page h1 { font-size:clamp(2.25rem,4vw,3.25rem); letter-spacing:-.025em; }
.guides-page .intro-aside > p { font-size:1.125rem; }
.guides-page .eyebrow { margin-bottom:16px; }
.guides-page .section-heading { margin-bottom:24px; gap:32px; }
.guides-page .section-heading h2 { font-size:1.75rem; }
.guides-page .written-guides { padding-top:64px; }
.guides-page .film-heading { padding:16px 24px; border-radius:20px 20px 0 0; }
.guides-page .film-frame { border-width:8px; border-top:0; border-radius:0 0 20px 20px; box-shadow:0 8px 24px rgba(23,36,59,.08); }
.guides-page .film-caption { padding-top:16px; gap:24px; }
.guides-page .search-input { border-radius:12px; min-height:56px; padding-inline:16px; }
.guides-page .search-input input { padding-block:12px; }
.guides-page .featured-guide { border:0; border-radius:0; background:transparent; padding:0; gap:48px; }
.guides-page .featured-image { border:1px solid var(--line); border-radius:20px; box-shadow:0 8px 24px rgba(23,36,59,.06); }
.guides-page .featured-copy { padding-inline-end:0; }
.guides-page .category-section { padding-top:64px; }
.guides-page .category-card { padding:24px; min-height:224px; }
.guides-page .category-card:hover { background:#fff; }
.guides-page .guide-list { display:grid; gap:16px; border:0; }
.guides-page .guide { background:var(--surface); border:1px solid var(--line); border-radius:20px; }
.guides-page .guide summary { min-height:96px; padding:24px; gap:24px; grid-template-columns:40px minmax(0,1fr) 32px; border-radius:20px; }
.guides-page .guide[open] summary { border-radius:20px 20px 0 0; }
.guides-page .guide-number { font-size:1.125rem; }
.guides-page .guide-title { font-size:1.25rem; }
.guides-page .guide-toggle { width:32px; height:32px; border-radius:12px; }
.guides-page .guide-toggle::before,.guides-page .guide-toggle::after { top:15px; left:9px; }
.guides-page .guide-body { padding:0 32px 32px; }
.guides-page .guide-steps { max-width:none; }
.guides-page .guide-steps li { max-width:76ch; margin-bottom:16px; padding-inline-start:40px; }
.guides-page .guide-steps .step-number { border-radius:8px; color:var(--muted); }
.guides-page .guide-result { max-width:none; gap:24px; margin-top:24px; padding-top:24px; }
.guides-page .guide-tip { max-width:none; margin-top:24px; padding:16px 24px; border-radius:0 12px 12px 0; }
.guides-page .guide-end { max-width:none; margin-top:16px; }
.guide-figure { margin:0 0 32px; }
.guide-image-link { display:block; position:relative; border:1px solid var(--line); border-radius:20px; overflow:hidden; background:var(--paper); box-shadow:0 8px 24px rgba(23,36,59,.06); }
.guide-image-link img { width:100%; height:auto; aspect-ratio:auto; }
.image-expand { display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 16px; border-top:1px solid var(--line); background:var(--surface); color:var(--primary); font-size:.875rem; font-weight:600; }
.image-expand svg { width:18px; height:18px; }
.guide-image-link:hover .image-expand { background:var(--paper); }
.guide-figure figcaption { padding:16px 4px 0; font-size:1rem; line-height:1.65; }
.guide-figure figcaption p { max-width:80ch; }
.image-disclosure { display:block; margin-top:8px; font-size:.8125rem; color:var(--muted); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html.image-viewer-open { overflow:hidden; }
.image-viewer { width:min(1328px,calc(100% - 48px)); max-width:none; max-height:calc(100dvh - 48px); margin:auto; padding:0; border:1px solid var(--line); border-radius:20px; background:var(--surface); color:var(--ink); box-shadow:0 24px 64px rgba(23,36,59,.2); }
.image-viewer::backdrop { background:rgba(23,36,59,.72); }
.image-viewer-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:16px 24px; border-bottom:1px solid var(--line); }
.image-viewer-toolbar h2 { font-size:1.125rem; }
.image-viewer-close { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:44px; min-height:44px; padding:8px 16px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:var(--surface); cursor:pointer; font-size:1rem; }
.image-viewer-stage { background:var(--paper); padding:16px; max-height:65dvh; overflow:auto; overscroll-behavior:contain; }
.image-viewer-stage:focus-visible { outline:3px solid var(--primary); outline-offset:-3px; }
.image-viewer-stage img { display:block; width:100%; min-width:900px; max-width:none; height:auto; margin:auto; }
.image-viewer-footer { display:flex; justify-content:space-between; align-items:start; flex-wrap:wrap; gap:16px 32px; padding:16px 24px 24px; }
.image-viewer-footer p { max-width:80ch; flex:1 1 24ch; font-size:1rem; }
.image-viewer-footer a { display:inline-flex; min-height:44px; align-items:center; font-size:.9375rem; color:var(--primary); text-decoration:underline; text-underline-offset:4px; }
html[data-access-contrast] .guides-page .image-viewer { background:#fff; color:#101820; }
html[data-access-contrast] .guides-page :is(.guide-image-link,.image-viewer-close,.image-viewer-toolbar) { border-color:#101820; }
html[data-access-size]:not([data-access-size="100"]) .guides-page :is(.image-viewer-toolbar,.image-viewer-footer) { flex-wrap:wrap; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .image-viewer-toolbar h2 { overflow-wrap:anywhere; }
html[data-access-size]:not([data-access-size="100"]) .guides-page .guide-image-link { overflow:visible; }
@media(max-width:850px) {
 .guides-page .intro { gap:32px; padding-block:48px 32px; }
 .guides-page .guide-body { padding-inline:24px; }
 .guides-page .featured-guide { gap:32px; }
}
@media(max-width:600px) {
 .guides-page .page-width { width:calc(100% - 32px); }
 .guides-page .site-header { min-height:80px; gap:16px; }
 .guides-page .intro { gap:24px; padding-block:32px; }
 .guides-page h1 { font-size:2.25rem; }
 .guides-page h1 span { font-size:1.5rem; }
 .guides-page .film-heading { padding:16px; flex-wrap:wrap; }
 .guides-page .film-frame { border-width:4px; border-top:0; }
 .guides-page .film-caption { gap:8px; }
 .guides-page .written-guides,.guides-page .category-section { padding-top:48px; }
 .guides-page .section-heading h2 { font-size:1.5rem; }
 .guides-page .featured-guide { gap:24px; }
 .guides-page .featured-copy { padding:0; }
 .guides-page .category-card { padding:24px 8px; min-height:0; }
 .guides-page .guide summary { padding:16px; gap:8px; grid-template-columns:24px minmax(0,1fr) 28px; min-height:0; }
 .guides-page .guide-title { font-size:1.0625rem; }
 .guides-page .guide-number { font-size:1rem; }
 .guides-page .guide-toggle { width:28px; height:28px; }
 .guides-page .guide-toggle::before,.guides-page .guide-toggle::after { top:13px; left:8px; width:10px; }
 .guides-page .guide-body { padding:8px 16px 24px; }
 .guides-page .guide-steps li { font-size:1.0625rem; padding-inline-start:32px; }
 .guides-page .guide-tip { padding:16px; }
 .guide-figure { margin-bottom:24px; }
 .guide-image-link { border-radius:12px; }
 .guide-figure figcaption { padding-top:12px; font-size:.9375rem; }
 .image-expand { font-size:.8125rem; padding-inline:8px; }
 .image-viewer { width:calc(100% - 16px); max-height:calc(100dvh - 16px); border-radius:20px; }
 .image-viewer-toolbar { padding:16px; gap:16px; }
 .image-viewer-toolbar h2 { font-size:1rem; }
 .image-viewer-close { padding:8px; }
 .image-viewer-close span { display:none; }
 .image-viewer-stage { padding:8px; max-height:55dvh; }
 .image-viewer-footer { padding:16px; }
 .image-viewer-footer p { font-size:.9375rem; }
}
@media print {
 .image-viewer,.image-expand { display:none; }
 .guide-figure { break-inside:avoid; }
 .guide-image-link { box-shadow:none; }
}

/* Keep mobile assistance controls in a reserved header slot, clear of video controls. */
.guides-page .skip-link { position:fixed; z-index:1200; }
@media(max-width:850px) {
 html { scroll-padding-top:calc(var(--guide-header-height,96px) + 16px); }
 .guides-page .site-header { position:sticky; top:0; z-index:100; width:100%; max-width:none; min-height:80px; margin:0; padding:12px 24px; gap:12px; flex-wrap:wrap; background:var(--surface); }
 .guides-page .site-header .brand { flex-shrink:0; }
 .guides-page .site-header .public-tools { position:static; flex-direction:row; flex-shrink:0; gap:8px; margin-inline-start:auto; }
 .guides-page .site-header .public-tools > :is(a,button) { width:48px; height:48px; min-width:48px; min-height:48px; box-shadow:none; }
 .guides-page .guide { scroll-margin-top:0; }
 .guides-page .site-footer { padding-bottom:32px; }
}
@media(max-width:600px) {
 .guides-page .site-header { padding-inline:16px; }
}
@media print {
 .guides-page .site-header { position:static; }
 .guides-page .public-tools { display:none; }
}
