/* Wondering Imp v0.8.22 — browse-first listings with on-demand filters */

/* Keep Browse focused on the newest live listings. Search and Filters are the
   only controls shown before the results; the full filter controls stay hidden
   until the collector asks for them. */
#browse.page{padding-top:22px}

.browse-quickbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  margin:0 0 8px;
}

#browse .browse-listing-search{
  width:100%;
  min-width:0;
  margin:0;
}

.browse-filter-toggle{
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  white-space:nowrap;
  padding:0 17px;
  background:#fffdf8;
  color:var(--forest,#12372f);
}
.browse-filter-toggle .filter-icon{font-size:18px;line-height:1}
.browse-filter-toggle .filter-count{
  display:inline-grid;
  place-items:center;
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  background:var(--forest,#12372f);
  color:#fff;
  font-size:11px;
  font-weight:900;
}
.browse-filter-toggle.has-active{
  border-color:#b68a3c;
  background:#fff6df;
}

#discoverFiltersPanel[hidden]{display:none!important}
.browse-filter-drawer{
  margin:0 0 10px;
  padding:14px;
  background:#fffaf0;
  border:1px solid var(--line,#e1d8c8);
  border-radius:16px;
  box-shadow:0 8px 24px rgba(27,50,42,.045);
}
.browse-filter-drawer-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:11px;
}
.browse-filter-drawer-head strong{display:block;color:var(--forest,#12372f);font-size:15px}
.browse-filter-drawer-head span{display:block;margin-top:3px;color:var(--muted,#6f7b75);font-size:11px;line-height:1.4}
.discover-filter-categories{display:grid;gap:7px;margin-bottom:10px}
.discover-filter-categories>strong{font-size:11px;color:var(--muted,#6f7b75);letter-spacing:.3px}
#browse .discover-filter-categories .filters{justify-content:flex-start}
#browse .discover-filter-panel{
  margin:0;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
}
.browse-filter-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:11px;
  padding-top:11px;
  border-top:1px solid var(--line,#e1d8c8);
}
.browse-filter-actions .gold{min-width:132px}

#browse .discover-results-bar{
  margin:7px 2px 10px;
}
@media(max-width:780px){
  #browse.page{padding-top:12px}
  .browse-quickbar{gap:8px;margin-bottom:6px}
  #browse .browse-listing-search{min-height:48px}
  .browse-filter-toggle{min-height:48px;padding:0 13px;border-radius:13px}
  .browse-filter-toggle .filter-label{font-size:13px}
  .browse-filter-drawer{padding:12px;margin-bottom:8px}
  .browse-filter-drawer-head span{font-size:10px}
  #browse .discover-results-bar{
    margin:5px 2px 9px;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:8px;
  }
  #browse .discover-results-bar span{font-size:10px;text-align:right}
  .browse-filter-actions{position:sticky;bottom:88px;background:#fffaf0;padding-bottom:2px}
}

@media(max-width:440px){
  .browse-filter-toggle{padding:0 11px}
  .browse-filter-toggle .filter-icon{font-size:17px}
  .browse-filter-toggle .filter-label{font-size:12px}
  #browse .discover-results-bar span{display:none}
}


/* === Wondering Imp v0.8.24 — responsive listing detail, photo viewer and faster image delivery === */
.product-art.has-photo{position:relative;overflow:hidden;background:linear-gradient(110deg,#eee8dc 8%,#f8f4eb 18%,#eee8dc 33%);background-size:200% 100%;animation:wiImageSkeleton 1.25s linear infinite}
.product-art.has-photo img{display:block;animation:none}
@keyframes wiImageSkeleton{to{background-position-x:-200%}}

#itemModal{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
#itemModal .modal-card{width:min(790px,100%);max-width:100%;max-height:calc(100dvh - max(20px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)));overflow-x:hidden}
#itemModal .listing-detail-grid{grid-template-columns:minmax(260px,330px) minmax(0,1fr);align-items:start}
#itemModal .listing-detail-copy{min-width:0;overflow-wrap:anywhere}
#itemModal .listing-detail-copy h2{margin-top:10px}
#itemModal .listing-detail-value{font-size:24px}
.listing-main-photo{appearance:none;border:0;padding:0;margin:0;width:100%;min-width:0;background:#eee8dc;border-radius:18px;overflow:hidden;position:relative;display:grid;place-items:center;cursor:zoom-in}
.listing-main-photo img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain;background:#f2eee5}
.listing-main-photo>span{position:absolute;right:10px;bottom:10px;border-radius:999px;padding:7px 10px;background:rgba(10,35,29,.86);color:#fff;font-size:10px;font-weight:900;letter-spacing:.2px;box-shadow:0 3px 12px #0003}
#itemModal .listing-detail-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
#itemModal .listing-detail-actions button{width:100%;min-width:0;min-height:48px;white-space:normal;overflow-wrap:anywhere;line-height:1.15;padding:11px 8px}
#itemModal .listing-report-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px}
#itemModal .listing-report-actions button{min-width:0;width:100%;white-space:normal;padding:9px 6px}
.listing-photo-section{margin-top:18px;padding-top:15px;border-top:1px solid var(--line,#dfd5c3)}
.listing-photo-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:9px}
.listing-photo-section-head strong{color:var(--forest,#12372f);font-size:13px}
.listing-photo-section-head span{color:var(--muted,#718078);font-size:10px;text-align:right}
.listing-thumb-strip{display:flex;gap:9px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.listing-detail-thumb{appearance:none;width:86px;min-width:86px;height:86px;padding:0;border:2px solid transparent;border-radius:13px;overflow:hidden;background:#ede8de;color:#51635a;font-weight:900;font-size:10px;display:grid;place-items:center;scroll-snap-align:start}
.listing-detail-thumb.active{border-color:#c69a3d}
.listing-detail-thumb img{width:100%;height:100%;object-fit:cover;display:block}

body.photo-viewer-open{overflow:hidden;touch-action:none}
.photo-viewer{position:fixed;inset:0;z-index:500;display:none;background:#08120f;color:#fff;padding:calc(env(safe-area-inset-top) + 8px) max(10px,env(safe-area-inset-right)) calc(env(safe-area-inset-bottom) + 10px) max(10px,env(safe-area-inset-left));grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:52px minmax(0,1fr) 52px;gap:8px;overscroll-behavior:contain}
.photo-viewer.show{display:grid}
.photo-viewer-topbar{grid-column:1/-1;display:flex;align-items:center;gap:12px;min-width:0;padding:2px 2px 4px}
.photo-viewer-topbar>div{min-width:0;display:flex;flex-direction:column}
.photo-viewer-topbar strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.photo-viewer-topbar span{font-size:10px;color:#b7c6c0;margin-top:2px}
.photo-viewer-close{width:44px;height:44px;border-radius:50%;border:1px solid #ffffff33;background:#ffffff12;color:#fff;font-size:28px;line-height:1;display:grid;place-items:center;flex:none}
.photo-viewer-stage{grid-column:2;grid-row:2;min-width:0;min-height:0;overflow:hidden;display:grid;place-items:center;border-radius:12px;background:#030706;touch-action:none;cursor:zoom-in;position:relative}
.photo-viewer-stage.is-zoomed{cursor:grab}
.photo-viewer-canvas{position:absolute;inset:0;min-width:0;min-height:0;overflow:hidden}
.photo-viewer-image-anchor{position:absolute;left:50%;top:50%;width:1px;height:1px;transform:translate(-50%,-50%);transform-origin:center center;pointer-events:none}
.photo-viewer-stage img{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;transform-origin:center center;will-change:transform;user-select:none;-webkit-user-drag:none;transition:transform .08s ease-out;pointer-events:none}
.photo-viewer-nav{align-self:center;width:44px;height:54px;border-radius:14px;border:1px solid #ffffff2b;background:#ffffff10;color:#fff;font-size:34px;display:grid;place-items:center;padding:0}
.photo-viewer-prev{grid-column:1;grid-row:2}.photo-viewer-next{grid-column:3;grid-row:2}
.photo-viewer-bottom{grid-column:1/-1;grid-row:3;min-width:0;display:grid;gap:6px}
.photo-viewer-bottom small{text-align:center;color:#9fb2aa;font-size:9px}
.photo-viewer-thumbs{display:flex;justify-content:center;gap:7px;overflow-x:auto;padding:3px 0;scrollbar-width:none}
.photo-viewer-thumbs::-webkit-scrollbar{display:none}
.photo-viewer-thumb{appearance:none;width:54px;min-width:54px;height:54px;border-radius:9px;border:2px solid transparent;background:#18231f;color:#d6dfdb;overflow:hidden;padding:0;font-size:9px;font-weight:900;display:grid;place-items:center}
.photo-viewer-thumb.active{border-color:#efc55b}
.photo-viewer-thumb img{width:100%;height:100%;object-fit:cover}

@media(max-width:780px){
  #itemModal{align-items:flex-start;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
  #itemModal .modal-card{width:100%;border-radius:22px;padding:18px 16px 20px;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 16px);margin:0;overscroll-behavior:contain}
  #itemModal .modal-x{right:12px;top:12px;width:42px;height:42px;z-index:8;background:#f4efe5}
  #itemModal .listing-detail-grid{grid-template-columns:1fr;gap:18px;width:100%;min-width:0}
  #itemModal .listing-detail-copy{width:100%;max-width:100%}
  .listing-main-photo{border-radius:15px;width:100%;max-width:100%}
  .listing-main-photo img{width:100%;max-height:52dvh;object-fit:contain}
  #itemModal .listing-detail-copy h2{font-size:clamp(29px,9vw,42px);line-height:1.03;margin:12px 0 16px;padding-right:0}
  #itemModal .listing-detail-copy p{line-height:1.45}
  #itemModal .listing-detail-actions{grid-template-columns:1fr 1fr;margin-top:14px}
  #itemModal .listing-detail-actions button{font-size:13px;min-height:54px}
  #itemModal .listing-report-actions{grid-template-columns:1fr 1fr}
  #itemModal .listing-report-actions button:last-child{grid-column:1/-1}
  .listing-photo-section-head{align-items:flex-start;flex-direction:column;gap:3px}
  .listing-photo-section-head span{text-align:left}
  .listing-detail-thumb{width:74px;min-width:74px;height:74px}
  .photo-viewer{grid-template-columns:40px minmax(0,1fr) 40px;padding-top:calc(env(safe-area-inset-top) + 5px);gap:5px}
  .photo-viewer-nav{width:38px;height:48px;border-radius:12px;font-size:30px}
  .photo-viewer-stage{border-radius:8px}
}
@media(max-width:430px){
  #itemModal .listing-detail-actions{grid-template-columns:1fr 1fr}
  #itemModal .listing-detail-actions button{padding:10px 6px;font-size:12px}
  .listing-main-photo>span{font-size:9px;padding:6px 8px}
  .photo-viewer-thumb{width:48px;min-width:48px;height:48px}
}
@media(prefers-reduced-motion:reduce){.product-art.has-photo{animation:none}.photo-viewer-stage img{transition:none}}


/* === Wondering Imp v0.8.25 — staged desktop photo zoom + true drag/pan === */
.photo-viewer-stage.is-zoomed{cursor:grab}
.photo-viewer-stage.is-dragging{cursor:grabbing}
.photo-viewer-stage.is-dragging img{transition:none}
.photo-viewer-tools{display:flex;align-items:center;justify-content:center;gap:7px;min-height:34px}
.photo-viewer-tool{appearance:none;border:1px solid #ffffff33;background:#ffffff10;color:#fff;border-radius:10px;height:32px;min-width:38px;padding:0 10px;font:800 13px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;display:grid;place-items:center}
.photo-viewer-tool:hover{background:#ffffff1c}
.photo-viewer-tool:disabled{opacity:.35;cursor:default}
.photo-viewer-zoom-level{min-width:52px;text-align:center;color:#d7e2dd;font:800 11px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-variant-numeric:tabular-nums}
.photo-viewer-bottom small.desktop-gallery-help{font-size:9px}
@media(max-width:680px){.photo-viewer-tools{gap:5px}.photo-viewer-tool{height:30px;min-width:34px;padding:0 8px}.photo-viewer-bottom small.desktop-gallery-help{font-size:8px}}

/* v0.8.26 — keep desktop gallery image anchored to stage centre at every zoom level. */

/* === Wondering Imp v0.8.28 — centred staged zoom with free desktop pan === */
.photo-viewer-image-anchor{contain:layout paint;backface-visibility:hidden}

/* === Wondering Imp v0.8.29 — gallery unclipped high-zoom pan ===
   v0.8.28 used paint containment on the centre anchor. Paint containment clips
   descendants to the anchor's fitted 100% box, so at 200%+ the transformed image
   looked as though its side edges were being stopped even while the zoom counter
   continued rising. Keep the anchor centred but allow the scaled image to paint
   outside it; the outer gallery canvas remains the intentional viewport clip. */
.photo-viewer-image-anchor{
  contain:none;
  overflow:visible;
}


/* v0.8.30 — keep collector-profile safety controls clear of the modal close button. */
#collectorProfileModal .modal-card.wide-modal{overflow-x:hidden}
#collectorProfileModal .modal-x{z-index:12}
#collectorProfileModal .public-profile-head.expanded{position:relative;padding-right:62px}
@media(max-width:780px){
  #collectorProfileModal .public-profile-head.expanded{padding-right:54px}
  #collectorProfileModal .public-profile-safety{padding-right:0;max-width:100%}
}
