.erbe-gallery { color:#2b2a29; margin:2rem auto; }
.erbe-gallery__intro { font-size:1.1rem; }
.erbe-gallery__filters { display:flex; flex-wrap:wrap; gap:.55rem; margin:1.5rem 0 2rem; }
.erbe-gallery__filters button { padding:.65rem 1rem; border:1px solid #bcb7b0; border-radius:999px; background:#fff; color:#2b2a29; font:inherit; cursor:pointer; }
.erbe-gallery__filters button.is-active { background:#2b2a29; border-color:#2b2a29; color:#fff; }
.erbe-gallery__filters button:focus-visible,.erbe-gallery__photo:focus-visible,.erbe-gallery__close:focus-visible { outline:3px solid #c919c9; outline-offset:3px; }
.erbe-gallery__trade { margin:0 0 3rem; }
.erbe-gallery__trade h2 { border-bottom:4px solid #c919c9; padding-bottom:.5rem; }
.erbe-gallery__group { margin:1rem 0; border:1px solid #ddd6ce; border-radius:.4rem; background:#fffdf9; }
.erbe-gallery__group summary { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem; cursor:pointer; font-weight:700; }
.erbe-gallery__group summary small { font-size:.8rem; white-space:nowrap; font-weight:400; }
.erbe-gallery__group[open] summary { border-bottom:1px solid #ddd6ce; }
.erbe-gallery__note { margin:.75rem 1rem; font-size:.9rem; color:#5b5651; }
.erbe-gallery__grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(145px,1fr)); gap:.75rem; padding:0 1rem 1rem; }
.erbe-gallery__photo { display:block; aspect-ratio:4/3; background:#eee9e2; overflow:hidden; border-radius:.25rem; }
.erbe-gallery__photo img { display:block; width:100%; height:100%; object-fit:cover; }
.erbe-gallery__photo:hover img { transform:scale(1.03); }
.erbe-gallery__compare { max-width:850px; margin:1rem; }
.erbe-gallery__compare-stage { position:relative; overflow:hidden; aspect-ratio:4/3; background:#eee9e2; }
.erbe-gallery__compare-stage img { display:block; width:100%; height:100%; object-fit:cover; }
.erbe-gallery__compare-after,.erbe-gallery__compare-before { position:absolute; inset:0; }
.erbe-gallery__compare-before { clip-path:inset(0 calc(100% - var(--erbe-position)) 0 0); }
.erbe-gallery__compare-label { position:absolute; z-index:2; top:.8rem; padding:.3rem .55rem; background:rgba(43,42,41,.86); color:white; font-size:.8rem; font-weight:700; pointer-events:none; }
.erbe-gallery__compare-label--before { left:.8rem; }
.erbe-gallery__compare-label--after { right:.8rem; }
.erbe-gallery__compare-handle { position:absolute; z-index:2; top:0; bottom:0; left:var(--erbe-position); width:3px; background:#d824d8; transform:translateX(-50%); pointer-events:none; }
.erbe-gallery__compare-handle::after { content:'↔'; position:absolute; top:50%; left:50%; display:grid; place-items:center; width:2.8rem; height:2.8rem; border-radius:50%; background:#2b2a29; color:white; transform:translate(-50%,-50%); }
.erbe-gallery__compare-stage input { position:absolute; z-index:3; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; }
.erbe-gallery__compare-stage:focus-within { outline:3px solid #d824d8; outline-offset:3px; }
.erbe-gallery__compare figcaption { margin:.5rem 0; color:#5b5651; font-size:.9rem; }
.erbe-gallery__dialog { width:min(96vw,1100px); max-height:94vh; padding:1rem; border:0; border-radius:.5rem; background:#1d1c1c; color:#fff; }
.erbe-gallery__dialog::backdrop { background:rgba(0,0,0,.82); }
.erbe-gallery__dialog img { display:block; max-width:100%; max-height:80vh; width:auto; height:auto; margin:1rem auto 0; }
.erbe-gallery__close { display:block; margin-left:auto; padding:.45rem .75rem; border:1px solid #fff; border-radius:.25rem; background:transparent; color:#fff; font:inherit; cursor:pointer; }
@media (max-width:600px) { .erbe-gallery__filters { flex-wrap:nowrap; overflow-x:auto; padding-bottom:.4rem; } .erbe-gallery__filters button { flex:none; } .erbe-gallery__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; } }
@media (prefers-reduced-motion:reduce) { .erbe-gallery__photo img { transition:none; } }