/* Product page — white minimal shelf aesthetic (matches index / beats / kits) */

body.product-shelf {
  --bg: #f5f4f1;
  --surface: #ffffff;
  --surface2: #eeecea;
  --border: rgba(10, 10, 10, 0.09);
  --text-dim: #999992;
  --commission-font-display: "Space Grotesk", "DM Sans", sans-serif;
  --commission-font-mono: "Space Mono", "DM Mono", monospace;
  --glow-intensity: 0;
  --catalog-bg: #f5f4f1;
  --catalog-ink: #0a0a0a;
  --catalog-ink2: #555550;
  --catalog-ink3: #999992;
  --catalog-border: rgba(10, 10, 10, 0.09);
  --catalog-border2: rgba(10, 10, 10, 0.17);

  background: var(--bg) !important;
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-display) !important;
  font-weight: 400 !important;
}

body.product-shelf.site-shell {
  padding-top: 0 !important;
}

body.product-shelf #main-content,
body.product-shelf .product-page-main {
  padding-top: calc(
    var(--studio-header-stack, 9.75rem) + env(safe-area-inset-top, 0px)
  ) !important;
}

body.product-shelf .grain-overlay,
body.product-shelf .scanline {
  display: none !important;
}

body.product-shelf .branding {
  animation: none !important;
  text-shadow: none !important;
}

/* Loading — in-page skeleton (no full-screen blocker) */
@keyframes product-skeleton-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

body.product-shelf.is-product-loading .product-image-wrapper,
body.product-shelf.is-product-loading #name,
body.product-shelf.is-product-loading #price-display,
body.product-shelf.is-product-loading #desc,
body.product-shelf.is-product-loading #tags,
body.product-shelf.is-product-loading .cover-stat-value,
body.product-shelf.is-product-loading #related-grid {
  color: transparent !important;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    var(--surface2) 0%,
    #f8f7f4 45%,
    var(--surface2) 90%
  ) !important;
  background-size: 200% 100% !important;
  animation: product-skeleton-shimmer 1.35s ease-in-out infinite;
  pointer-events: none;
  user-select: none;
}

body.product-shelf.is-product-loading .product-image-wrapper img {
  opacity: 0 !important;
}

body.product-shelf.is-product-loading #related-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  min-height: 7.5rem;
}

body.product-shelf.is-product-loading #related-grid::before,
body.product-shelf.is-product-loading #related-grid::after {
  content: "";
  display: block;
  min-height: 7.5rem;
  border-radius: 8px;
  background: linear-gradient(
    90deg,
    var(--surface2) 0%,
    #f8f7f4 45%,
    var(--surface2) 90%
  );
  background-size: 200% 100%;
  animation: product-skeleton-shimmer 1.35s ease-in-out infinite;
}

@media (min-width: 640px) {
  body.product-shelf.is-product-loading #related-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  body.product-shelf.is-product-loading .product-image-wrapper,
  body.product-shelf.is-product-loading #name,
  body.product-shelf.is-product-loading #price-display,
  body.product-shelf.is-product-loading #desc,
  body.product-shelf.is-product-loading #tags,
  body.product-shelf.is-product-loading .cover-stat-value,
  body.product-shelf.is-product-loading #related-grid,
  body.product-shelf.is-product-loading #related-grid::before,
  body.product-shelf.is-product-loading #related-grid::after {
    animation: none !important;
  }
}

/* Layout shell */
body.product-shelf .product-page-container {
  max-width: 72rem;
}

body.product-shelf .product-shell {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body.product-shelf .breadcrumb {
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  color: var(--catalog-ink3) !important;
  margin-bottom: 1.5rem !important;
}

body.product-shelf .breadcrumb a {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .breadcrumb a:hover {
  color: var(--catalog-ink) !important;
}

body.product-shelf .breadcrumb span {
  color: var(--catalog-ink) !important;
}

/* Cards */
body.product-shelf .info-card,
body.product-shelf .card-animated-border {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  transform: none !important;
}

body.product-shelf .info-card::before,
body.product-shelf .card-animated-border::before {
  display: none !important;
}

body.product-shelf .info-card:hover,
body.product-shelf .card-animated-border:hover {
  border-color: var(--catalog-border2) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.06) !important;
  transform: translateY(-2px) !important;
}

/* Cover */
body.product-shelf .product-image-wrapper {
  border: 1px solid var(--catalog-border2) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  background: var(--surface2) !important;
  overflow: hidden !important;
}

body.product-shelf .product-image-wrapper:hover {
  border-color: var(--catalog-ink) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
  transform: none !important;
}

body.product-shelf .product-image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: 1 !important;
  filter: none !important;
  position: relative !important;
  z-index: 1 !important;
}

body.product-shelf .cover-overlay {
  display: none !important;
}

body.product-shelf .cover-corner {
  display: none !important;
}

body.product-shelf .play-overlay {
  background: rgba(10, 10, 10, 0.28) !important;
}

body.product-shelf .play-btn-big {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  border: 2px solid var(--catalog-ink) !important;
  box-shadow: none !important;
}

/* Header cards — override dark glass gradient from inline CSS */
body.product-shelf .product-header-card,
body.product-shelf #product-tags-card,
body.product-shelf .product-header-rating {
  background: #fff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--catalog-border) !important;
  box-shadow: none !important;
}

body.product-shelf .product-header-card:hover,
body.product-shelf #product-tags-card:hover,
body.product-shelf .product-header-rating:hover {
  background: #fff !important;
  border-color: var(--catalog-border2) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06) !important;
  transform: translateY(-2px) !important;
}

body.product-shelf #product-tags-card .product-tags-label {
  color: var(--catalog-ink3) !important;
  font-family: var(--commission-font-mono) !important;
}
body.product-shelf .section-eyebrow {
  font-family: var(--commission-font-mono) !important;
  font-size: 9px !important;
  letter-spacing: 0.12em !important;
  color: var(--catalog-ink3) !important;
}

body.product-shelf .product-header-card .section-eyebrow {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
}

body.product-shelf .product-header-title {
  color: var(--catalog-ink) !important;
  text-shadow: none !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
}

body.product-shelf .producer-line.producer-chip {
  background: #dc2626 !important;
  border: 1px solid #991b1b !important;
  border-radius: 4px !important;
  box-shadow: 0 2px 8px rgba(153, 27, 27, 0.18) !important;
  padding: 0.45rem 0.55rem 0.45rem 0.75rem !important;
}

body.product-shelf #producer-line.hidden {
  display: none !important;
}

body.product-shelf .producer-line,
body.product-shelf .producer-line span,
body.product-shelf .producer-line #producer-copy-text {
  color: #fff !important;
  font-family: var(--commission-font-mono) !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
}

body.product-shelf .producer-line .copy-tag-btn {
  background: rgba(255, 255, 255, 0.14) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  color: #fff !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 9px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 3px !important;
}

body.product-shelf .producer-line .copy-tag-btn:hover {
  background: rgba(255, 255, 255, 0.24) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
}

body.product-shelf .producer-line .copy-tag-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.65) !important;
  outline-offset: 2px !important;
}

body.product-shelf .producer-line .copy-tag-flash {
  color: #fff !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 9px !important;
  letter-spacing: 0.12em !important;
}

body.product-shelf .price-display,
body.product-shelf .product-header-card #price-display {
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
  box-shadow: none !important;
}

body.product-shelf .price-display.free {
  color: var(--catalog-ink) !important;
  background: var(--bg) !important;
  border-color: var(--catalog-border2) !important;
}

body.product-shelf .price-display.coin,
body.product-shelf .price-display.paid {
  color: var(--catalog-ink) !important;
  background: var(--bg) !important;
  border-color: var(--catalog-border2) !important;
}

body.product-shelf .product-header-icon-btn,
body.product-shelf .product-header-card .share-product-btn,
body.product-shelf .product-header-card .favorite-btn {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
  color: var(--catalog-ink2) !important;
  border-radius: 4px !important;
}

body.product-shelf .product-header-icon-btn:hover,
body.product-shelf .product-header-card .share-product-btn:hover,
body.product-shelf .product-header-card .favorite-btn:hover {
  color: var(--catalog-ink) !important;
  border-color: var(--catalog-border2) !important;
  background: var(--surface2) !important;
  box-shadow: none !important;
}

/* Conversion band */
body.product-shelf .product-conversion-band,
body.product-shelf .product-download-shell.action-shell,
body.product-shelf .action-shell--guest-free {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.product-shelf .product-conversion-stats.cover-stats {
  border: 1px solid var(--catalog-border2) !important;
  background: #fff !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 0 rgba(10, 10, 10, 0.03) inset !important;
}

body.product-shelf .cover-stat-item {
  background: var(--bg) !important;
  border-color: var(--catalog-border) !important;
  border-right: 1px solid var(--catalog-border) !important;
  padding: 0.85rem 0.65rem !important;
}

body.product-shelf .cover-stat-item:last-child {
  border-right: none !important;
}

body.product-shelf .cover-stat-value,
body.product-shelf .product-conversion-stats .cover-stat-value {
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-display) !important;
  font-size: 1.65rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.05 !important;
}

body.product-shelf .cover-stat-label,
body.product-shelf .product-conversion-stats .cover-stat-label {
  color: var(--catalog-ink2) !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 9px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin-top: 0.35rem !important;
}

/* Buttons */
body.product-shelf .btn {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  border: none !important;
  border-radius: 3px !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  box-shadow: none !important;
  text-transform: uppercase !important;
}

body.product-shelf .btn:hover:not(.btn-disabled) {
  background: #222 !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
}

body.product-shelf .btn-secondary,
body.product-shelf .btn.btn-secondary {
  background: transparent !important;
  color: var(--catalog-ink) !important;
  border: 1px solid var(--catalog-border2) !important;
}

body.product-shelf .btn-secondary:hover:not(.btn-disabled) {
  background: var(--surface2) !important;
}

body.product-shelf .btn-disabled {
  background: var(--catalog-ink3) !important;
  opacity: 0.5 !important;
}

/* Player */
body.product-shelf .audio-wrapper {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.product-shelf .audio-wrapper::before {
  display: none !important;
}

body.product-shelf .player-visualizer {
  background: var(--surface2) !important;
  border: 1px solid var(--catalog-border) !important;
}

body.product-shelf .player-toggle {
  border: 1px solid var(--catalog-ink) !important;
  background: var(--bg) !important;
  color: var(--catalog-ink) !important;
}

body.product-shelf .player-toggle:hover {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  box-shadow: none !important;
}

body.product-shelf .player-progress-track {
  background: var(--surface2) !important;
  border: 1px solid var(--catalog-border) !important;
}

body.product-shelf .player-progress-fill {
  background: var(--catalog-ink) !important;
  box-shadow: none !important;
}

body.product-shelf .player-time {
  color: var(--catalog-ink2) !important;
  font-family: var(--commission-font-mono) !important;
}

/* Kit preview stack */
body.product-shelf .kit-preview-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

body.product-shelf .kit-preview-section-label {
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--catalog-ink3) !important;
  margin-bottom: 2px !important;
}

body.product-shelf .kit-preview-count {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .kit-preview-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

body.product-shelf .kit-preview-track-label {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
  padding: 0 2px;
}

body.product-shelf .kit-preview-track-num {
  flex-shrink: 0;
  font-family: var(--commission-font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  color: var(--catalog-ink3) !important;
}

body.product-shelf .kit-preview-track-name {
  flex: 1;
  min-width: 0;
  font-family: var(--commission-font-display) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--catalog-ink) !important;
  line-height: 1.35 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.product-shelf .kit-preview-audio-block {
  width: 100%;
  min-width: 0;
}

body.product-shelf .kit-preview-visualizer {
  height: 88px !important;
  min-height: 72px !important;
}

body.product-shelf .kit-preview-audio-block .player-controls-row {
  gap: 10px !important;
}

body.product-shelf .kit-preview-audio-block .player-toggle {
  min-width: 48px !important;
  min-height: 48px !important;
  flex-shrink: 0 !important;
  touch-action: manipulation;
}

body.product-shelf .kit-preview-audio-block .player-progress-track {
  min-width: 0 !important;
  min-height: 44px !important;
  flex: 1 1 8rem !important;
}

body.product-shelf .kit-preview-audio-block .player-time {
  flex: 0 0 auto !important;
  font-size: 11px !important;
  min-width: 5.5rem !important;
  text-align: right !important;
}

/* Stats */
body.product-shelf .stats-grid .stat-box {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
}

body.product-shelf .stat-box::before {
  display: none !important;
}

body.product-shelf .stat-value,
body.product-shelf .stats-grid .stat-value {
  color: var(--catalog-ink) !important;
}

body.product-shelf .stat-label {
  color: var(--catalog-ink3) !important;
  font-family: var(--commission-font-mono) !important;
}

/* Tags */
body.product-shelf .genre-tag {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
  color: var(--catalog-ink2) !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  padding: 6px 10px !important;
}

body.product-shelf .genre-tag:hover {
  border-color: var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
  box-shadow: none !important;
}

/* Sections */
body.product-shelf .studio-section {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.product-shelf .studio-section::before {
  display: none !important;
}

/* License block sits in conversion column — no outer frame around the heading */
body.product-shelf #license-section.studio-section {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.product-shelf .studio-section-title,
body.product-shelf #related-products-section .studio-section-title {
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  color: var(--catalog-ink3) !important;
  border-bottom-color: var(--catalog-border) !important;
}

body.product-shelf #license-section > .studio-section-title {
  border: none !important;
  border-bottom: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding-bottom: 0 !important;
  margin-bottom: 0.85rem !important;
}

/* License */
body.product-shelf .license-card {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.product-shelf .license-card:hover,
body.product-shelf .license-card.featured {
  border-color: var(--catalog-border2) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05) !important;
}

body.product-shelf .license-card.featured::before {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
}

body.product-shelf .license-name {
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-display) !important;
}

body.product-shelf .license-price.free,
body.product-shelf .license-price.basic,
body.product-shelf .license-price.premium,
body.product-shelf .license-price.exclusive {
  color: var(--catalog-ink) !important;
}

body.product-shelf .license-features {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .license-features li::before {
  color: var(--catalog-ink) !important;
}

body.product-shelf .license-btn {
  background: transparent !important;
  border: 1px solid var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 11px !important;
}

body.product-shelf .license-btn:hover {
  border-color: var(--catalog-ink) !important;
  color: var(--catalog-ink) !important;
}

body.product-shelf .license-btn.free-btn {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  border-color: var(--catalog-ink) !important;
}

body.product-shelf .license-btn.basic-btn,
body.product-shelf .license-btn.exclusive-btn {
  background: var(--bg) !important;
  color: var(--catalog-ink) !important;
  border-color: var(--catalog-border2) !important;
}

/* Description */
body.product-shelf .desc-card {
  background: #fff !important;
  border-color: var(--catalog-border) !important;
}

body.product-shelf .desc-card-label {
  color: var(--catalog-ink3) !important;
  font-family: var(--commission-font-mono) !important;
}

body.product-shelf .desc-body {
  color: var(--catalog-ink2) !important;
  font-family: var(--commission-font-display) !important;
}

/* Free terms */
body.product-shelf .free-terms-card {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
  color: var(--catalog-ink) !important;
  padding-bottom: 3.25rem !important;
}

body.product-shelf .free-terms-badge {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  border: none !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
}

body.product-shelf .free-terms-text {
  color: var(--catalog-ink2) !important;
  font-size: 0.875rem !important;
}

body.product-shelf .free-terms-item--allowed .free-terms-marker {
  color: #15803d !important;
}

body.product-shelf .free-terms-item--restricted .free-terms-marker {
  color: #b91c1c !important;
}

body.product-shelf .free-terms-item--restricted .free-terms-text {
  color: #991b1b !important;
}

body.product-shelf .free-terms-item--allowed + .free-terms-item--restricted {
  border-top-color: var(--catalog-border) !important;
}

body.product-shelf .free-terms-footnote {
  color: var(--catalog-ink3) !important;
  border-top-color: var(--catalog-border) !important;
}

body.product-shelf .free-terms-contact-card {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
  box-shadow: none !important;
}

body.product-shelf .free-terms-contact-text {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .free-terms-contact-text a {
  color: var(--catalog-ink) !important;
  border-bottom-color: var(--catalog-border2) !important;
}

body.product-shelf .free-terms-contact-text a:hover {
  color: var(--catalog-ink) !important;
  border-bottom-color: var(--catalog-ink) !important;
}

body.product-shelf .beat-download-hero__ribbon {
  border-color: var(--catalog-border2) !important;
  background: var(--bg) !important;
  color: var(--catalog-ink2) !important;
}

body.product-shelf .beat-download-hero__title {
  color: var(--catalog-ink) !important;
}

body.product-shelf .beat-download-hero__sub,
body.product-shelf .beat-download-hero__prop {
  color: var(--catalog-ink2) !important;
  border-color: var(--catalog-border) !important;
  background: var(--bg) !important;
}

/* Rating */
body.product-shelf .product-header-rating .product-rating-label {
  color: var(--catalog-ink3) !important;
  font-family: var(--commission-font-mono) !important;
}

body.product-shelf .rating-avg-num {
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-display) !important;
}

body.product-shelf .rating-star {
  border: 1px solid var(--catalog-border2) !important;
  background: #fff !important;
  color: var(--catalog-ink3) !important;
  box-shadow: none !important;
}

body.product-shelf .rating-star:hover {
  border-color: var(--catalog-ink) !important;
  color: #b45309 !important;
  background: var(--bg) !important;
  box-shadow: none !important;
}

body.product-shelf .rating-star.active {
  color: #b45309 !important;
  border-color: #d97706 !important;
  background: #fffbeb !important;
  box-shadow: none !important;
}

body.product-shelf .rating-star:disabled {
  opacity: 0.45 !important;
}

body.product-shelf .rating-star:disabled:hover {
  border-color: var(--catalog-border) !important;
  color: var(--catalog-ink3) !important;
  background: #fff !important;
}

body.product-shelf .rating-meta,
body.product-shelf .rating-lock-note {
  color: var(--catalog-ink2) !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 11px !important;
}

body.product-shelf .rating-lock-note {
  border-top-color: var(--catalog-border) !important;
}

body.product-shelf .post-download-review {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
}

body.product-shelf .post-download-review__eyebrow {
  color: var(--catalog-ink3) !important;
  font-family: var(--commission-font-mono) !important;
}

body.product-shelf .post-download-review__title {
  color: var(--catalog-ink) !important;
}

body.product-shelf .post-download-review__sub,
body.product-shelf .post-download-review__login {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .post-download-review__login a {
  color: var(--catalog-ink) !important;
}

body.product-shelf .post-download-review__thanks {
  color: #15803d !important;
}

body.product-shelf .post-download-review__jump {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .post-download-review__jump:hover {
  color: var(--catalog-ink) !important;
}

body.product-shelf #coin-price-amount {
  color: var(--catalog-ink) !important;
}

body.product-shelf .coin-price-label {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .sample-list {
  color: var(--catalog-ink2) !important;
}

/* Related */
body.product-shelf #related-products-section {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

body.product-shelf .related-card {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.product-shelf .related-card:hover {
  border-color: var(--catalog-border2) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06) !important;
  transform: translateY(-2px) !important;
}

body.product-shelf .related-image-wrap {
  border: 1px solid var(--catalog-border) !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

body.product-shelf .related-title {
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-display) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

body.product-shelf .related-meta,
body.product-shelf .related-empty {
  color: var(--catalog-ink3) !important;
  font-family: var(--commission-font-mono) !important;
}

body.product-shelf .related-tag,
body.product-shelf .related-meta-tag {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border) !important;
  color: var(--catalog-ink2) !important;
}

body.product-shelf .related-price-badge {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
}

body.product-shelf #related-products-section .more-beats-btn {
  background: transparent !important;
  border: 1px solid var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.08em !important;
  border-radius: 3px !important;
}

body.product-shelf #related-products-section .more-beats-btn:hover {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
}

/* Scheduled / promos */
body.product-shelf #scheduled-beat-countdown {
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-mono) !important;
}

body.product-shelf #scheduled-beat-banner {
  background: #fff !important;
  border: 1px solid var(--catalog-border2) !important;
  color: var(--catalog-ink2) !important;
  border-radius: 4px !important;
}

body.product-shelf #scheduled-beat-banner a,
body.product-shelf #scheduled-beat-banner button {
  border-color: var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
}

/* Mobile download bar */
body.product-shelf .beat-mobile-dl-bar,
body.product-shelf .beat-bottom-nudge {
  background: rgba(245, 244, 241, 0.96) !important;
  border-top: 1px solid var(--catalog-border) !important;
  color: var(--catalog-ink) !important;
  backdrop-filter: blur(12px);
}

body.product-shelf .beat-bottom-nudge p {
  color: var(--catalog-ink2) !important;
}

/* Modals */
body.product-shelf .download-thank-you-card,
body.product-shelf .already-downloaded-card,
body.product-shelf .beat-email-gate-sheet {
  background: #fff !important;
  border: 1px solid var(--catalog-border) !important;
  color: var(--catalog-ink) !important;
}

body.product-shelf .download-thank-you-backdrop,
body.product-shelf .beat-email-gate-backdrop {
  background: rgba(10, 10, 10, 0.35) !important;
}

body.product-shelf .beat-email-gate-sheet h2 {
  color: var(--catalog-ink) !important;
}

body.product-shelf .beat-email-gate-sheet p.lead {
  color: var(--catalog-ink2) !important;
}

body.product-shelf .beat-email-gate-input {
  background: var(--bg) !important;
  border-color: var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
  font-family: var(--commission-font-display) !important;
}

body.product-shelf .beat-email-gate-input:focus {
  background: #fff !important;
  border-color: var(--catalog-ink) !important;
  box-shadow: 0 0 0 3px rgba(10, 10, 10, 0.08) !important;
}

body.product-shelf .beat-email-gate-trust {
  border-top-color: var(--catalog-border) !important;
  color: var(--catalog-ink3) !important;
}

body.product-shelf .beat-email-gate-sheet #beat-gate-submit.btn {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  font-family: var(--commission-font-mono) !important;
}

body.product-shelf .beat-email-gate-sheet #beat-gate-submit.btn:hover:not(.btn-disabled) {
  background: #222 !important;
}

/* Admin dock — keep usable */
body.product-shelf #product-admin-dock {
  background: #fff !important;
  border-top-color: var(--catalog-border2) !important;
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.08) !important;
}

body.product-shelf #product-admin-dock .admin-edit-panel-header,
body.product-shelf #product-admin-dock .admin-edit-panel-actions {
  background: #fff !important;
  border-color: var(--catalog-border) !important;
}

body.product-shelf #admin-edit-product-btn {
  background: var(--bg) !important;
  border-color: var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
  box-shadow: none !important;
}

body.product-shelf #admin-dock-done {
  background: var(--catalog-ink) !important;
  color: var(--bg) !important;
  border-color: var(--catalog-ink) !important;
}

body.product-shelf #admin-dock-header-cancel,
body.product-shelf #admin-dock-cancel {
  color: var(--catalog-ink2) !important;
  border-color: var(--catalog-border2) !important;
}

/* Inputs in admin */
body.product-shelf #product-admin-dock input,
body.product-shelf #product-admin-dock textarea,
body.product-shelf #product-admin-dock select {
  background: var(--bg) !important;
  border: 1px solid var(--catalog-border2) !important;
  color: var(--catalog-ink) !important;
}

/* Footer links */
body.product-shelf .shelf-site-footer a.hover\:text-white:hover {
  color: var(--catalog-ink) !important;
}

/* ── MOBILE (product page) ── */
@media (max-width: 768px) {
  html:has(body.product-shelf) {
    scroll-padding-top: calc(
      var(--studio-header-stack, var(--shelf-header-stack, 13.5rem)) +
        env(safe-area-inset-top, 0px)
    );
  }

  body.product-shelf {
    overflow-x: clip;
  }

  body.product-shelf #main-content,
  body.product-shelf .product-page-main {
    padding-top: calc(
      var(--studio-header-stack, var(--shelf-header-stack, 13.5rem)) +
        env(safe-area-inset-top, 0px)
    ) !important;
  }

  body.product-shelf .mobile-header-shell {
    gap: 8px 10px !important;
    padding-bottom: 8px !important;
  }

  body.product-shelf .mobile-header-actions-track {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    padding-block: 4px !important;
  }

  body.product-shelf .shelf-header-extra,
  body.product-shelf .tools-dropdown-root {
    display: inline-flex !important;
  }

  body.product-shelf .mobile-header-actions-track > .header-btn,
  body.product-shelf
    .mobile-header-actions-track
    .tools-dropdown-root
    > .header-btn,
  body.product-shelf #auth-btn.header-btn,
  body.product-shelf .mobile-header-meta .mobile-header-auth-btn,
  body.product-shelf #cart-header-btn.header-btn {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 10px 14px !important;
    font-size: 11px !important;
    border-radius: 3px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: var(--catalog-ink2) !important;
    box-shadow: none !important;
    flex-shrink: 0;
    scroll-snap-align: start;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  body.product-shelf #auth-btn.header-btn {
    border-color: var(--catalog-border2) !important;
    background: #fff !important;
    color: var(--catalog-ink) !important;
  }

  body.product-shelf .tools-dropdown-panel {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: calc(
      var(--studio-header-stack, var(--shelf-header-stack, 13.5rem)) +
        env(safe-area-inset-top, 0px) + 4px
    ) !important;
    min-width: 0 !important;
    max-height: min(60vh, 360px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  body.product-shelf .tools-dropdown-panel a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    padding: 12px 16px !important;
  }

  body.product-shelf .product-shell {
    padding: 0.85rem !important;
  }

  body.product-shelf .breadcrumb {
    font-size: 9px !important;
    line-height: 1.55 !important;
    margin-bottom: 1rem !important;
    word-break: break-word;
  }

  body.product-shelf .product-image-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  body.product-shelf .product-header-title {
    font-size: clamp(1.5rem, 7vw, 2rem) !important;
    word-break: break-word;
    hyphens: auto;
  }

  body.product-shelf .product-header-icon-btn,
  body.product-shelf .product-header-card .share-product-btn,
  body.product-shelf .product-header-card .favorite-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 10px !important;
  }

  body.product-shelf .rating-star {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    font-size: 1.35rem !important;
  }

  body.product-shelf .rating-stars {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px !important;
  }

  body.product-shelf .rating-avg-row {
    justify-content: center !important;
  }

  body.product-shelf .btn,
  body.product-shelf #download-btn,
  body.product-shelf .license-btn {
    min-height: 48px !important;
  }

  body.product-shelf #download-btn,
  body.product-shelf .product-download-shell #download-btn {
    width: 100% !important;
    max-width: none !important;
  }

  body.product-shelf .license-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body.product-shelf .license-btn {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.product-shelf .license-card {
    padding: 1.1rem !important;
  }

  body.product-shelf .related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body.product-shelf .related-card {
    max-width: none !important;
    width: 100% !important;
    min-height: 48px !important;
  }

  body.product-shelf .related-title {
    white-space: normal !important;
    font-size: 13px !important;
    text-transform: none !important;
    letter-spacing: -0.01em !important;
  }

  body.product-shelf .related-image-wrap {
    max-height: none !important;
  }

  body.product-shelf #related-products-section {
    padding: 1rem !important;
    margin-top: 1rem !important;
  }

  body.product-shelf #related-products-section .more-beats-btn {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    text-align: center !important;
  }

  body.product-shelf .cover-stat-item {
    border-color: var(--catalog-border) !important;
    padding: 0.75rem 0.55rem !important;
  }

  body.product-shelf .cover-stat-value,
  body.product-shelf .product-conversion-stats .cover-stat-value {
    font-size: 1.45rem !important;
  }

  body.product-shelf .cover-stat-label,
  body.product-shelf .product-conversion-stats .cover-stat-label {
    font-size: 8px !important;
  }

  body.product-shelf .producer-line.producer-chip {
    max-width: 100%;
  }

  body.product-shelf .product-conversion-band,
  body.product-shelf .product-download-shell.action-shell {
    padding: 1rem !important;
  }

  body.product-shelf .free-terms-text {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  body.product-shelf .free-terms-card {
    padding-bottom: 2.5rem !important;
  }

  body.product-shelf .genre-tag {
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 12px !important;
  }

  body.product-shelf #tags {
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  body.product-shelf .audio-wrapper {
    padding: 1rem !important;
  }

  body.product-shelf .player-toggle {
    min-width: 48px !important;
    min-height: 48px !important;
    flex-shrink: 0 !important;
  }

  body.product-shelf .player-progress-track {
    min-width: 0 !important;
    min-height: 44px !important;
  }

  body.product-shelf .player-controls-row {
    gap: 10px !important;
  }

  body.product-shelf .beat-mobile-dl-bar {
    padding: 0 12px !important;
  }

  body.product-shelf .beat-mobile-dl-bar__btn {
    max-width: none !important;
    width: 100% !important;
    min-height: 52px !important;
    padding: 0.9rem 1.25rem !important;
    font-size: 1rem !important;
    background: var(--catalog-ink) !important;
    color: var(--bg) !important;
    border: none !important;
    border-radius: 3px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  }

  body.product-shelf .beat-mobile-dl-bar__btn:hover {
    transform: none !important;
    background: #222 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14) !important;
  }

  body.product-shelf .beat-bottom-nudge {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.product-shelf .beat-nudge-cta {
    min-height: 48px !important;
  }

  body.product-shelf .shelf-site-footer .shelf-page-wrap {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  body.product-shelf .shelf-site-footer {
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.product-shelf .post-download-review {
    padding: 1rem !important;
  }

  body.product-shelf .desc-body {
    font-size: 15px !important;
    line-height: 1.65 !important;
  }
}

@media (max-width: 480px) {
  body.product-shelf .product-shell {
    padding: 0.65rem !important;
  }

  body.product-shelf .product-header-card,
  body.product-shelf #product-tags-card,
  body.product-shelf .product-header-rating {
    padding: 1rem !important;
  }

  body.product-shelf .related-grid {
    grid-template-columns: 1fr !important;
  }

  body.product-shelf .product-conversion-stats.cover-stats,
  body.product-shelf .cover-stats {
    grid-template-columns: 1fr !important;
  }

  body.product-shelf .cover-stat-value,
  body.product-shelf .product-conversion-stats .cover-stat-value {
    font-size: 1.75rem !important;
  }

  body.product-shelf .stats-grid {
    grid-template-columns: 1fr !important;
  }

  body.product-shelf .player-visualizer {
    height: 72px !important;
    max-height: 72px !important;
  }

  body.product-shelf .kit-preview-visualizer {
    height: 72px !important;
    max-height: 72px !important;
  }

  body.product-shelf .kit-preview-audio-block .player-progress-track {
    flex: 1 1 100% !important;
    order: 2 !important;
  }

  body.product-shelf .kit-preview-audio-block .player-time {
    width: 100% !important;
    order: 3 !important;
    text-align: left !important;
  }

  body.product-shelf .rating-avg-num {
    font-size: 2rem !important;
  }

  body.product-shelf .stat-value {
    font-size: 1.75rem !important;
  }
}

@media (hover: none) {
  body.product-shelf .info-card:hover,
  body.product-shelf .card-animated-border:hover,
  body.product-shelf .product-image-wrapper:hover,
  body.product-shelf .related-card:hover,
  body.product-shelf .license-card:hover,
  body.product-shelf .btn:hover:not(.btn-disabled) {
    transform: none !important;
    box-shadow: none !important;
  }

  body.product-shelf .related-card:active,
  body.product-shelf .license-card:active {
    transform: scale(0.98) !important;
  }
}
