.hero{background:var(--paper);border-bottom:1px solid var(--hairline);padding:var(--space-7) var(--space-6)}
.hero .crumbs{color:var(--bronze);display:flex;gap:var(--space-2);margin-bottom:var(--space-4)}
.hero .crumbs span{color:var(--muted)}
.hero p{max-width:680px;color:var(--ink-soft);margin-top:var(--space-3)}
.hero.centered{text-align:center}
.hero.centered p{margin-inline:auto}

.tb{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) var(--space-6);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);background:var(--paper)}
.tb .views{display:flex;gap:var(--space-2);color:var(--muted)}
.tb .views button{width:28px;height:28px;display:grid;place-items:center}.tb .views button[aria-pressed=true]{color:var(--ink)}
.tb .views svg{width:16px;height:16px}
.tb .count{color:var(--muted)}
.tb .sort{display:flex;align-items:center;gap:var(--space-3);color:var(--muted)}
.tb .sel{display:inline-flex;align-items:center;gap:var(--space-2);height:32px;padding:0 var(--space-3) 0 var(--space-4);border:1px solid var(--rule);border-radius:var(--radius-pill);color:var(--ink)}
.tb .sel svg{width:14px;height:14px}

.sb{width:220px;display:flex;flex-direction:column;gap:var(--space-5)}
.sb .grp h4{display:flex;justify-content:space-between;align-items:center;color:var(--ink);margin-bottom:var(--space-2)}
.sb .grp h4 svg{width:12px;height:12px;color:var(--muted)}
.sb .sw{display:grid;grid-template-columns:repeat(6,18px);gap:var(--space-2)}

.cat{display:grid;grid-template-columns:220px 1fr;gap:var(--space-6);padding:var(--space-6)}
.grid{display:grid;grid-template-columns:repeat(var(--cols,4),1fr);gap:var(--space-5)}
.chips{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-5)}
body.filters-hidden .cat{grid-template-columns:1fr}body.filters-hidden .sb{display:none}
/* masonry view: columns instead of rows, art keeps its orientation */
.grid.masonry{display:block;columns:var(--cols,4);column-gap:var(--space-5)}
.grid.masonry .p{break-inside:avoid;margin-bottom:var(--space-6)}
.grid.masonry .art[data-o=vertical]{aspect-ratio:4/5}.grid.masonry .art[data-o=horizontal]{aspect-ratio:5/4}.grid.masonry .art[data-o=panoramic]{aspect-ratio:2/1}.grid.masonry .art[data-o=square]{aspect-ratio:1}
.check input{position:absolute;opacity:0;width:0;height:0}.check{position:relative;cursor:pointer}
.sb{width:auto}
@media (max-width:900px){
  .cat{grid-template-columns:1fr;padding:var(--space-4)}.grid{grid-template-columns:repeat(2,1fr)}.grid.masonry{columns:2}.tb{flex-wrap:wrap;gap:var(--space-3)}
  /* filters become a bottom sheet */
  .sb{display:none;position:fixed;left:0;right:0;bottom:0;top:15vh;z-index:45;background:var(--paper);padding:var(--space-5) var(--space-4) var(--space-8);overflow:auto;box-shadow:0 -12px 40px rgba(0,0,0,.18);border-radius:16px 16px 0 0;max-height:none}
  body.filters-shown .sb{display:flex}body.filters-shown{overflow:hidden}
  .sb::before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:var(--rule);margin:-8px auto 16px}
  .sb .sheet-close{display:block;position:sticky;bottom:0;margin-top:var(--space-4)}
}