:root { --bg-page:#f4f5f7; --bg-card:#fff; --text-main:#18181b; --text-muted:#71717a; --border-subtle:#e4e4e7; }
body { background-color:var(--bg-page); color:var(--text-main); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans SC",sans-serif; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; line-height:1.6; }
.studio-card { background-color:#fff; border:1px solid #e4e4e7; border-radius:4px; box-shadow:0 1px 3px rgba(0,0,0,.02); transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.studio-card:hover { border-color:#a1a1aa; box-shadow:0 4px 16px rgba(0,0,0,.04); }
.btn-solid,.btn-outline { font-weight:500; padding:.5rem 1.15rem; border-radius:3px; transition:all .15s ease; white-space:nowrap; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.btn-solid { background:#18181b; color:#fff; letter-spacing:.02em; }.btn-solid:hover { background:#27272a; }
.btn-outline { background:#fff; color:#18181b; border:1px solid #d4d4d8; }.btn-outline:hover { background:#fafafa; border-color:#71717a; }
.pdp-spec-btn[aria-pressed="true"], .pdp-spec-btn[aria-pressed="true"]:hover { background:#18181b; color:#fff; border-color:#18181b; }
.pdp-spec-btn:focus-visible { outline:2px solid #52525b; outline-offset:2px; }
#toast-container { position:fixed; bottom:2rem; right:2rem; z-index:9999; display:flex; flex-direction:column; gap:.5rem; pointer-events:none; }
.toast-item { background:#18181b; color:#fff; padding:.75rem 1.25rem; border-radius:4px; font-size:.8125rem; box-shadow:0 10px 25px -5px rgba(0,0,0,.2); display:flex; align-items:center; gap:.625rem; opacity:0; transform:translateY(8px); transition:all .2s cubic-bezier(.16,1,.3,1); pointer-events:auto; border-left:3px solid #2d5043; }
.toast-item.show { opacity:1; transform:translateY(0); }
.shop-n-loading { color:var(--text-muted); font-size:.75rem; padding:1rem; text-align:center; }.shop-n-error { color:#b91c1c; font-size:.75rem; padding:1rem; text-align:center; }.shop-n-error button { margin-left:.5rem; text-decoration:underline; }
.shop-n-thumb-fallback { display:flex; align-items:center; justify-content:center; color:#a1a1aa; font-size:.75rem; background:#f4f4f5; }

.shop-n-detail-image { max-width: 100%; height: auto; }

/* Keep the store callout readable and category tabs usable on narrow screens. */
.studio-card.shop-n-store-callout { background:#18181b; border-color:#27272a; }
.shop-n-store-callout .btn-solid { background:#fff; color:#18181b; }
.shop-n-store-callout .btn-solid:hover { background:#f4f4f5; }
#home-cat-tabs { max-width:100%; overflow-x:auto; }
#home-cat-tabs .home-tab { flex:0 0 auto; white-space:nowrap; }

@media (max-width: 767px) {
  .shop-n-header-inner { gap: .5rem; }
  .shop-n-brand { flex: 1 1 auto; min-width: 0; }
  .shop-n-brand-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #header-user-zone { gap: .5rem; }
}
