.bf-explorer{--bf-border:#d8d5cc;--bf-ink:#20241f;--bf-paper:#faf9f5;font:inherit;color:var(--bf-ink);width:100%;margin:1.5rem 0}.bf-explorer *{box-sizing:border-box}.bf-explorer button,.bf-explorer input,.bf-explorer select{font:inherit}.bf-explorer button{background:#263b32;color:white;border:1px solid #263b32;border-radius:3px;padding:.5rem .8rem;cursor:pointer}.bf-explorer button:focus-visible,.bf-explorer input:focus-visible,.bf-explorer summary:focus-visible,.bf-explorer a:focus-visible{outline:3px solid #bd7833;outline-offset:3px}.bf-explorer input[type=search]{width:100%;padding:.7rem;border:1px solid var(--bf-border);background:white;color:#20241f}.bf-explorer label{display:flex;align-items:center;gap:.5rem;font-size:.95rem;line-height:1.5;margin:.4rem 0}.bf-explorer input[type=checkbox]{width:1rem;height:1rem;flex-shrink:0;accent-color:#263b32}.bf-toolbar{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-bottom:1rem}.bf-toolbar>input{flex:1;min-width:180px}.bf-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:2rem}.bf-filters details{border-bottom:1px solid var(--bf-border);padding:.65rem 0}.bf-filters summary{cursor:pointer;font-weight:600;padding:.3rem 0}.bf-options{max-height:240px;overflow:auto;padding:.25rem}.bf-filters fieldset{border:0;padding:0;margin:0}.bf-filters legend{font-weight:600}.bf-chips{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 1rem}.bf-chips button{font-size:.85rem;background:#eceee8;color:#263b32;border-color:#ccd2c9}.bf-count{font-weight:600;margin:0 0 1rem}.bf-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}.bf-card{border:1px solid var(--bf-border);padding:1.2rem;background:var(--bf-paper);border-radius:4px}.bf-card h3{font-size:1.3rem;margin:0 0 .6rem}.bf-card p{font-size:.95rem;line-height:1.5;margin:.4rem 0}.bf-card a{color:#263b32;text-decoration:underline}.bf-card img{width:100%;height:180px;object-fit:cover;margin-bottom:1rem}.bf-card details{font-size:.9rem;margin-top:.75rem}.bf-card summary{cursor:pointer}.bf-badge{display:inline-block;font-size:.8rem;padding:.15rem .5rem;background:#e6ebdf;border-radius:3px;margin:.4rem 0}.bf-warning{background:#fff2d9;padding:.75rem;border-left:3px solid #99641d}.bf-pantry{border:1px solid var(--bf-border);padding:1rem;margin-bottom:1rem;background:var(--bf-paper)}.bf-pantry[hidden]{display:none}.bf-inventory{max-height:200px;overflow:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 .7rem}.bf-small{font-size:.85rem!important;color:#545950}.bf-empty{padding:2rem;border:1px dashed var(--bf-border)}.bf-mobile-toggle{display:none}.bf-more{margin-top:.8rem}.bf-explorer [hidden]{display:none!important}@media(max-width:900px){.bf-layout{grid-template-columns:210px minmax(0,1fr);gap:1rem}.bf-cards{grid-template-columns:1fr}.bf-inventory{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.bf-layout{display:block}.bf-mobile-toggle{display:inline-block}.bf-filters{display:none;margin-bottom:1.5rem}.bf-explorer.bf-filters-open .bf-filters{display:block}.bf-inventory{grid-template-columns:1fr}.bf-toolbar{gap:.5rem}.bf-card{padding:1rem}} 

/* Public archive cards match the Beer Styles reference; filters and private previews retain their layout. */
.bf-explorer[data-preview="false"] .bf-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:44px 38px}
.bf-explorer .bf-card-archive{border:0;border-radius:0;padding:0;background:transparent;min-width:0}
.bf-explorer .bf-card-archive .bf-card-image{display:block;aspect-ratio:4/5;border-radius:16px;overflow:hidden;margin-bottom:22px}
.bf-explorer .bf-card-archive .bf-card-image img{display:block;width:100%;height:100%;object-fit:cover;margin:0}
.bf-explorer .bf-card-archive h3,.bf-explorer .bf-card-archive h3 a{font-family:"Stratum Bold",Stratum,sans-serif;font-size:19px;font-weight:700;line-height:1.35;letter-spacing:.1em;text-transform:uppercase;text-align:center;color:#111;margin:0;text-decoration:none}
.bf-explorer .bf-card-archive h3 a:hover{text-decoration:underline;text-underline-offset:5px}
.bf-explorer .bf-card-archive a:focus-visible{outline:3px solid #a45a22;outline-offset:5px}
@media(max-width:1024px){.bf-explorer[data-preview="false"] .bf-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}}
@media(max-width:767px){.bf-explorer[data-preview="false"] .bf-cards{grid-template-columns:1fr;gap:34px}.bf-explorer .bf-card-archive h3,.bf-explorer .bf-card-archive h3 a{font-size:18px}}
