/* Local review: WUYT recipe collection, using the existing brand system. */
.library-home-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:36px; margin-bottom:34px; }
.library-home-heading .section-title { margin:14px 0; }
.library-home-heading .section-lead { max-width:580px; margin:0; }
.library-browse { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:52px; padding:14px 22px; border:1px solid var(--border-medium); border-radius:var(--radius-full); color:var(--accent-copper); font-size:14px; font-weight:600; white-space:nowrap; transition:background .2s,border-color .2s; }
.library-browse:hover { background:var(--bg-card-hover); border-color:var(--accent-copper); }
.library-next { display:flex; align-items:center; gap:24px; padding:18px; margin-bottom:36px; border:1px solid var(--border-medium); border-radius:18px; background:linear-gradient(110deg,#211b16,#171615); }
.library-next img { width:82px; height:105px; flex:0 0 82px; border-radius:10px; object-fit:cover; }
.library-next-copy { flex:1; min-width:0; }
.library-next .section-eyebrow { margin-bottom:10px; font-size:11px; letter-spacing:.12em; }
.library-next .section-eyebrow span { color:var(--text-muted); }
.library-next h3 { margin-bottom:6px; font-family:var(--font-display); font-size:23px; line-height:1.25; }
.library-next-copy > p:last-child { color:var(--text-muted); font-size:13px; }
.library-next > a { display:inline-flex; min-height:44px; align-items:center; gap:16px; padding:10px 14px; color:var(--accent-copper); font-size:13px; font-weight:600; }
.library-home-bottom { text-align:center; padding-top:44px; }
.library-home-bottom p { margin-bottom:16px; color:var(--text-muted); }
.library-main { padding-top:145px; padding-bottom:84px; background:radial-gradient(ellipse at 85% 0,rgba(163,93,41,.10),transparent 45%); }
.library-intro { padding-bottom:48px; }
.library-breadcrumb { display:inline-flex; gap:12px; align-items:center; margin-bottom:44px; font-size:12px; color:var(--text-muted); }
.library-breadcrumb > span:last-child { color:var(--accent-copper); }
.library-intro .section-eyebrow { display:block; font-size:12px; letter-spacing:.2em; }
.library-intro h1 { font-family:var(--font-display); font-size:clamp(40px,5.3vw,72px); line-height:1.08; font-weight:600; letter-spacing:-.045em; margin:18px 0 22px; }
.library-intro h1 em { font-style:normal; color:var(--accent-copper); }
.library-lead { font-size:17px; line-height:1.8; color:var(--text-muted); }
.library-collection-note { display:flex; align-items:center; gap:9px; margin-top:28px; font-size:12px; color:var(--text-muted); }
.library-dot { width:6px; height:6px; background:var(--accent-copper); border-radius:50%; box-shadow:0 0 12px #e9b78355; }
.library-filters { display:grid; grid-template-columns:minmax(240px,2fr) repeat(3,minmax(130px,1fr)) auto; align-items:end; gap:18px; padding:24px; border:1px solid var(--border-medium); border-radius:18px; background:var(--bg-surface); }
.library-filters label { display:block; min-width:0; }
.library-filters label > span:first-child { display:block; color:var(--text-muted); font-size:11px; font-weight:500; letter-spacing:.03em; margin-bottom:10px; }
.library-filters select,.library-filters input { min-width:0; width:100%; height:48px; border:1px solid var(--border-medium); border-radius:8px; background:#100f0e; color:var(--text-cream); font:13px var(--font-body); padding:0 12px; color-scheme:dark; }
.library-filters input { padding-left:42px; }
.library-filters input::placeholder { color:#b0a396; }
.library-search-input { display:block; position:relative; }
.library-search-input svg { position:absolute; top:14px; left:13px; width:20px; height:20px; color:var(--accent-copper); pointer-events:none; }
.library-search-submit { height:48px; padding:0 18px; border:0; border-radius:8px; background:var(--accent-copper); color:#15110e; font:600 13px var(--font-body); cursor:pointer; }
.library-search-submit:hover { background:var(--accent-gold); }
.library-results-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:30px 0 24px; scroll-margin-top:110px; outline:none; }
.library-results-toolbar > p { font-size:13px; color:var(--text-muted); }
.library-results-actions { display:flex; align-items:center; gap:20px; }
.library-sort { display:flex; align-items:center; gap:10px; font-size:12px; color:var(--text-muted); }
.library-sort select { font:500 12px var(--font-body); color:var(--text-cream); background:var(--bg-obsidian); border:0; padding:12px 22px 12px 4px; color-scheme:dark; }
#library-clear { background:none; border:0; color:var(--accent-copper); font:12px var(--font-body); min-height:44px; cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
.library-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px 22px; }
.library-card { min-width:0; display:flex; flex-direction:column; border:1px solid var(--border-subtle); border-radius:14px; overflow:hidden; background:var(--bg-card); transition:transform .2s,border-color .2s; }
.library-card:hover { transform:translateY(-4px); border-color:var(--border-glow); }
.library-poster { position:relative; display:block; aspect-ratio:4/5; overflow:hidden; background:var(--bg-castiron); }
.library-poster::after { content:""; position:absolute; inset:50% 0 0; background:linear-gradient(transparent,rgba(0,0,0,.7)); pointer-events:none; }
.library-poster img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 35%; transition:transform .3s; }
.library-card:hover .library-poster img { transform:scale(1.03); }
.library-play { position:absolute; right:14px; bottom:14px; z-index:1; display:grid; place-items:center; width:36px; height:36px; border:1px solid #ffffff66; border-radius:50%; background:#100e0daa; color:var(--text-cream); font-size:12px; padding-left:2px; }
.library-poster-label { position:absolute; bottom:24px; left:16px; z-index:1; color:var(--text-cream); font-size:9px; font-weight:600; letter-spacing:.14em; }
.library-card-body { padding:20px 18px 0; flex:1; display:flex; flex-direction:column; }
.library-card-kicker { color:var(--accent-copper); font-size:10px; letter-spacing:.09em; text-transform:uppercase; margin-bottom:10px; }
.library-card h2 { font-family:var(--font-display); font-size:18px; font-weight:500; line-height:1.35; margin-bottom:12px; }
.library-card h2 a { color:var(--text-cream); }
.library-card h2 a:hover { color:var(--accent-copper); }
.library-card time { display:block; font-size:10px; color:var(--text-muted); margin-top:auto; margin-bottom:18px; }
.library-card-actions { display:flex; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid var(--border-subtle); }
.library-card-actions a { display:flex; gap:8px; align-items:center; min-height:52px; color:var(--accent-copper); font-size:11px; font-weight:500; }
.library-card-actions a:last-child { color:var(--text-cream); }
.library-pagination { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:44px; }
.library-pagination a,.library-pagination > span { min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border-medium); border-radius:8px; padding:10px 14px; font-size:12px; }
.library-pagination a { color:var(--text-muted); }
.library-pagination a:hover { border-color:var(--accent-copper); color:var(--text-cream); }
.library-pagination a[aria-current="page"] { border-color:var(--accent-copper); background:var(--accent-copper); color:#17110d; font-weight:600; }
.library-pagination > span[aria-disabled="true"] { color:#908276; border-color:var(--border-subtle); }
.library-pagination .pagination-gap { border:none; min-width:12px; padding:0; }
.library-endnote { text-align:center; font-size:12px; line-height:1.8; color:var(--text-muted); margin-top:24px; }
.library-empty { text-align:center; padding:90px 20px; border:1px dashed var(--border-medium); border-radius:14px; }
.library-empty h2 { font:500 28px var(--font-display); margin:14px 0; }
.library-empty > p:not(.section-eyebrow) { font-size:14px; line-height:1.8; color:var(--text-muted); }
.library-empty button { margin-top:24px; min-height:48px; padding:12px 22px; border:0; border-radius:999px; font:600 13px var(--font-body); color:#17110d; background:var(--accent-copper); cursor:pointer; }
.library-noscript { padding:20px 0; color:var(--text-muted); font-size:13px; }
.library-detail-back { padding-bottom:16px; }
.library-detail-back a { display:inline-flex; align-items:center; min-height:44px; font-size:13px; color:var(--accent-copper); }
[hidden] { display:none !important; }
.library-main a:focus-visible,.library-main button:focus-visible,.library-main input:focus-visible,.library-main select:focus-visible,.library-home a:focus-visible { outline:2px solid var(--accent-copper); outline-offset:4px; }
@media (max-width:1100px) {
  .library-filters { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .library-search { grid-column:span 2; }
  .library-filters label:nth-child(2) { grid-column:auto; }
  .library-filters .library-search-submit { grid-column:3; }
  .library-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .library-main { padding-top:118px; }
  .library-next > a { align-self:flex-end; }
  .library-next h3 { font-size:20px; }
  .library-home-heading { align-items:flex-start; flex-direction:column; gap:22px; }
}
@media (max-width:700px) {
  .library-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px; }
  .library-intro { padding-bottom:30px; }
  .library-breadcrumb { margin-bottom:30px; }
  .library-intro h1 { font-size:43px; }
  .library-lead { font-size:14px; }
  .library-filters { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 12px; padding:18px; }
  .library-search { grid-column:span 2; }
  .library-filters .library-search-submit { grid-column:2; }
  .library-next { display:grid; grid-template-columns:62px minmax(0,1fr); gap:12px 16px; padding:16px; }
  .library-next img { width:62px; height:80px; flex-basis:62px; }
  .library-next-copy { flex:1; }
  .library-next > a { grid-column:2; padding:0; min-height:44px; margin-left:0; }
  .library-next h3 { font-size:17px; }
  .library-next .section-eyebrow { font-size:9px; line-height:1.7; }
  .library-next .section-eyebrow span { display:block; }
  .library-next-copy > p:last-child { font-size:11px; }
  .library-card-body { padding:14px 12px 0; }
  .library-card h2 { font-size:15px; }
  .library-card-kicker { font-size:9px; line-height:1.5; }
  .library-card-actions { flex-wrap:wrap; gap:0; }
  .library-card-actions a { min-height:44px; font-size:10px; }
  .library-card-actions a:first-child { margin-right:10px; }
  .library-poster-label { left:10px; bottom:20px; font-size:8px; }
  .library-play { width:30px; height:30px; right:10px; bottom:12px; font-size:10px; }
  .library-results-toolbar { align-items:flex-start; gap:12px; }
  .library-results-actions { align-items:flex-end; flex-direction:column-reverse; gap:0; }
  .library-sort { gap:5px; }
  .library-sort span { display:none; }
  .library-results-toolbar > p { padding-top:13px; font-size:11px; }
  .library-pagination { gap:5px; }
  .library-pagination a,.library-pagination > span { padding:10px; }
}
@media (max-width:350px) {
  .library-grid { grid-template-columns:1fr; }
  .library-intro h1 { font-size:36px; }
}
@media (prefers-reduced-motion:reduce) {
  .library-card,.library-poster img { transition:none; }
}
/* Related recipe links are present in HTML for readers and crawlers. */
.related-recipes{padding:3rem 0;border-top:1px solid rgba(225,168,104,.18)}
.related-recipes h2{font-family:Outfit,Inter,sans-serif;font-size:clamp(1.6rem,3vw,2.3rem);margin:0 0 1.5rem}
.related-recipes ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;margin:0 0 1.5rem}
.related-recipes li{display:flex;gap:1rem;align-items:flex-start;min-width:0}
.related-recipe-image{flex:0 0 90px}
.related-recipe-image img{width:90px;height:160px;object-fit:cover;border-radius:12px}
.related-recipes h3{margin:0 0 .5rem;font-size:1.1rem;line-height:1.4}
.related-recipes h3 a{color:inherit;text-decoration:none}
.related-recipes p{font-size:.85rem;color:var(--text-muted,#b8b6b2);margin:.5rem 0}
.related-recipes a{color:var(--accent,#e1a868);overflow-wrap:anywhere}
.related-recipes a:focus-visible{outline:2px solid #e1a868;outline-offset:4px}
@media(max-width:900px){.related-recipes ul{grid-template-columns:1fr;gap:1.5rem}}
