.site-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:420px){.site-tabs a{font-size:.78rem;padding-inline:2px}}
@media(max-width:360px){.site-tabs a{font-size:.68rem}}
.page-heading{width:min(100%,720px);margin:0 auto;padding:22px 16px 0}.page-heading h1{margin:12px 0 0;font-family:var(--disp);font-size:clamp(30px,7vw,42px);font-weight:400}.back-home{color:var(--muted);font-size:.82rem;text-underline-offset:3px}
.shop-intro{margin-bottom:18px}.shop-intro p{margin:5px 0 0;color:var(--muted)}
.filter-row{display:flex;gap:8px;overflow:auto;padding:2px 0 16px}.filter-button{border:1px solid var(--line);border-radius:999px;background:var(--paper2);color:var(--ink);padding:8px 13px;white-space:nowrap;cursor:pointer}.filter-button.active{border-color:var(--accent);background:var(--accent);color:var(--on-solid)}
.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.product-card{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--card);box-shadow:var(--shadow-sm)}.product-card button{width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer}.product-image{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--paper2)}.product-placeholder{display:grid;place-items:center;width:100%;aspect-ratio:4/3;background:var(--paper2);color:var(--muted);font-size:.85rem}.product-copy{padding:14px}.product-copy h2,.product-copy h3{margin:7px 0 3px;font-size:1.05rem;overflow-wrap:anywhere}.price{margin:0;font-family:var(--mono);font-weight:600}.product-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:.75rem}.status-badge{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:4px 8px;background:var(--paper2);font-size:.72rem;font-weight:700}.status-badge.available{border-color:var(--accent);color:var(--accent)}.status-badge.reserved{color:#94711d}.status-badge.sold{color:var(--muted)}
.product-detail{display:grid;gap:16px}.image-gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.image-gallery img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--line);border-radius:7px}.image-gallery img:first-child{grid-column:1/-1;aspect-ratio:4/3}.detail-copy{white-space:pre-wrap;overflow-wrap:anywhere}.detail-list{display:grid;gap:8px;margin:0}.detail-list div{display:grid;grid-template-columns:90px 1fr;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line)}.detail-list dt{color:var(--muted)}.detail-list dd{margin:0;overflow-wrap:anywhere}
.dialog{width:min(92vw,620px);max-height:88vh;padding:0;border:1px solid var(--ink);border-radius:14px;background:var(--card);color:var(--ink);box-shadow:var(--shadow);overflow:auto}.dialog::backdrop{background:rgba(var(--sh-rgb),.58)}.dialog-inner{padding:20px}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.dialog-head h2{margin:0;font-family:var(--disp);font-weight:400}.dialog-actions,.admin-actions{display:flex;flex-wrap:wrap;gap:8px}.form-grid{display:grid;gap:14px}.field{display:grid;gap:6px}.field label{font-weight:700}.field small{color:var(--muted)}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);border-radius:7px;background:var(--paper2);color:var(--ink);padding:11px}.field textarea{min-height:140px;resize:vertical}.primary-button,.quiet-button,.danger-button{min-height:42px;border:1px solid var(--line);border-radius:7px;padding:9px 13px;cursor:pointer}.primary-button{border-color:var(--accent);background:var(--accent);color:var(--on-solid)}.quiet-button{background:var(--paper2);color:var(--ink)}.danger-button{border-color:var(--danger);background:var(--danger-soft);color:var(--danger)}button:disabled{opacity:.55;cursor:not-allowed}.form-status{min-height:1.5em;margin:0;color:var(--muted)}
.empty-box,.error-box{padding:24px;border:1px dashed var(--line);border-radius:10px;background:var(--paper2);text-align:center}.error-box{border-color:var(--danger);color:var(--danger)}.loading{padding:32px;text-align:center;color:var(--muted)}
.admin-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}.admin-toolbar h2{margin:0;font-family:var(--disp);font-weight:400}.admin-list{display:grid;gap:12px}.admin-row,.admin-panel,.inquiry-card{padding:16px;border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:var(--shadow-sm)}.admin-row h3,.inquiry-card h3{margin:8px 0 4px}.admin-tabs{display:flex;gap:8px;margin-bottom:16px}.admin-tabs button{flex:1}.admin-detail{display:grid;gap:16px}.admin-images{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.admin-image{position:relative}.admin-image img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px}.admin-image button{position:absolute;right:5px;top:5px}.inquiry-card p{white-space:pre-wrap;overflow-wrap:anywhere}.inquiry-meta{color:var(--muted);font-size:.78rem}.turnstile-wrap{min-height:70px}.privacy-note{margin:0;color:var(--muted);font-size:.76rem}
@media(max-width:560px){.site-tabs a{font-size:13px;padding-inline:3px}.filter-row{flex-wrap:wrap;overflow:visible}.product-grid{grid-template-columns:1fr}.dialog-inner{padding:15px}.detail-list div{grid-template-columns:76px 1fr}.admin-images{grid-template-columns:repeat(2,1fr)}}
@media(max-width:340px){.site-tabs a{font-size:12px}.page-shell{padding-inline:11px}}

/* 시각 리마스터 — "굿즈 수집 슬리브 / 상품 보관 카드" 컨셉.
   기존 product-card/product-image/dialog 클래스는 그대로 두고 추가 클래스만
   겹쳐 꾸민다. app.js의 API 호출·admin 동작은 변경하지 않았다. */
.sleeve-card{
  border-color:var(--line2);
  transition:transform .15s ease,box-shadow .15s ease;
}
.sleeve-card:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(var(--sh-rgb),.12)}
.sleeve-image,.sleeve-placeholder{
  padding:6px;
  background:var(--paper);
  box-sizing:border-box;
  box-shadow:inset 0 0 0 1px var(--line2),inset 0 0 0 7px var(--paper);
}
.sleeve-gallery img{border-radius:9px}

/* 필터 = 바인더 탭처럼 */
.shop-filter-tabs .filter-button{border-radius:8px 8px 3px 3px;border-bottom:3px solid transparent}
.shop-filter-tabs .filter-button.active{border-bottom-color:var(--accent-deep)}

/* 상태 마커 — 점 하나로 "판매 중"을 조용히 강조 */
.status-badge.available::before{
  content:"";
  display:inline-block;
  width:6px;height:6px;
  margin-right:5px;
  border-radius:50%;
  background:var(--accent);
}

/* 빈 상태도 수집 폴더처럼 */
.shop-empty-box{border-width:1.5px}

@media (prefers-reduced-motion: reduce){
  .sleeve-card{transition:none}
  .sleeve-card:hover{transform:none}
}
