/* I3 — S12 상점 + 구매 시트. mockup/screens-more.css의 상점 부분을 sh- 접두사로 옮김. 토큰 조합만. */
.sh-stack { display: grid; gap: var(--stack-gap); }
.sh-stack--tight { gap: var(--space-1); }
.sh-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.sh-coin { width: 18px; height: 18px; flex: none; }

.sh-balance { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.sh-balance__num { display: inline-flex; align-items: center; gap: var(--space-1); margin: 0; }
.sh-balance__num .sh-coin { width: 28px; height: 28px; }

.sh-cats { scroll-snap-type: x mandatory; }
.sh-cat { flex: none; scroll-snap-align: start; }
.sh-cat[aria-selected="true"] { background: var(--color-primary-soft); border-color: var(--color-primary); color: var(--color-primary-text); font-weight: var(--font-weight-bold); }

.sh-card-tags { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1); min-height: 22px; }
.sh-need { font-size: var(--font-size-2xs); color: var(--color-text-sub); }

.sh-buy-head { display: flex; align-items: center; gap: var(--space-4); }
.sh-buy-thumb { width: 88px; height: 88px; flex: none; border-radius: var(--radius-md); display: grid; place-items: center; overflow: hidden; background: var(--color-surface-sunken); }
.sh-buy-thumb img { width: 64px; height: 64px; }
.sh-buy-thumb--wide img { width: 100%; height: 100%; object-fit: cover; }
.sh-kv { display: grid; gap: var(--space-2); margin: 0; }
.sh-kv > div { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); font-variant-numeric: tabular-nums; }
.sh-kv dt { color: var(--color-text-sub); }
.sh-kv dd { margin: 0; font-weight: var(--font-weight-bold); }
.sh-stepper { display: inline-flex; align-items: center; gap: var(--space-2); }
.sh-stepper output { min-width: 2ch; text-align: center; font-size: var(--font-size-2xl); font-weight: var(--font-weight-heavy); font-variant-numeric: tabular-nums; }
.sh-stepper .ds-icon-btn { border: var(--border-width) solid var(--color-border-strong); font-size: var(--font-size-xl); }