/* BA · AV's filter rail + AX's genre shelves. Page parts in assets/components/archive.css.
   Tweaks here: a narrower rail on desktop, and a tidier, less chunky phone layout. */

/* ---------- desktop: rail width set by request (was 18rem; +30% = 23.4rem) */
.rail-wrap { grid-template-columns: 23.4rem minmax(0, 1fr); }
.rail { padding: 1.4rem 1.2rem; }
.rail .ctl__search input { padding: 0.55rem 1rem; font-size: 0.95rem; }
.rail .chip { font-size: 0.82rem; }

/* ---------- tablet: rail on top, filters in a tidy row */
@media (max-width: 64em) {
  .rail-wrap { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- phones: compact head, one-row search + Filters, smaller cards */
@media (max-width: 44em) {
  .ah { padding-block: 1.1rem 1.3rem; }
  .ah .lbl { display: none; }
  .ah h1 { font-size: 2.3rem; margin: 0 0 0.3rem; }
  .ah__sub { font-size: 0.9rem; }

  .rail { padding: 0.75rem clamp(0.75rem, 3vw, 1.5rem); }
  .rail .ctl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.6rem 0.5rem; align-items: center; }
  .rail .ctl__search label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .rail .ctl__search input { padding: 0.45rem 0.85rem; }
  .rail .ctl__toggle { grid-column: 2; grid-row: 1; padding: 0.4rem 0.8rem; border-width: 2px; font-size: 0.85rem; }
  .rail .ctl__group, .rail .ctl__sort, .rail .ctl__clear { grid-column: 1 / -1; }
  .rail .ctl legend, .rail .ctl label { font-size: 0.68rem; margin-bottom: 0.3rem; }

  .archive .ar:has(.ar--shelves) .ar__bar { padding: 0.7rem clamp(0.75rem, 3vw, 1.5rem) 0; margin-bottom: 0.7rem; }
  .ar__count strong { font-size: 1.2rem; }
  .shelf { padding: 1rem 0 0.8rem; }
  .shelf h2 { font-size: 1.6rem; margin-bottom: 0.6rem; padding: 0 clamp(0.75rem, 3vw, 1.5rem); }
  .shelf h2 small { font-size: 0.7rem; }
  .track { grid-auto-columns: 62%; gap: 0.6rem; padding: 0.2rem clamp(0.75rem, 3vw, 1.5rem) 0.8rem; scroll-padding: 0 clamp(0.75rem, 3vw, 1.5rem); }

  .rc a { border-width: 3px; border-radius: 22px; }
  .rc figure { margin: 0.45rem 0.45rem 0; border-radius: 14px; aspect-ratio: 3 / 2; }
  .rc__b { gap: 0.25rem; padding: 0.55rem 0.7rem 0.75rem; }
  .rc .rv-film { font-size: 1.05rem; }
  .rc .stars { font-size: 0.85rem; }
  .rc .rv-head { font-size: 0.85rem; }
  .rc .rv-dek { font-size: 0.76rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .rc .rv-meta, .rc .rv-dir { font-size: 0.64rem; }
}