/* R31 — uniquement la platine de référence et les boutons de sélection Sound Room. */

/* Platine : proportions horizontales, noyer sombre, disque dominant et filet bronze. */
.source-deck.turntable {
  aspect-ratio: 1.46 / 1 !important;
  border: 2px solid rgba(8, 6, 5, .94) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(ellipse at 28% 3%, rgba(255, 232, 207, .055), transparent 35%),
    radial-gradient(ellipse at 82% 88%, rgba(0, 0, 0, .34), transparent 46%),
    repeating-linear-gradient(0deg, rgba(222, 181, 144, .018) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(91deg, rgba(8, 4, 3, .12) 0 1px, transparent 1px 20px),
    linear-gradient(112deg, #30251f 0%, #211713 44%, #130d0b 100%) !important;
  box-shadow:
    0 2px 0 rgba(161, 117, 78, .20),
    0 7px 0 #0d0907,
    0 14px 0 #050403,
    0 38px 72px rgba(0, 0, 0, .52),
    inset 0 0 0 1px rgba(211, 164, 119, .18),
    inset 0 1px 0 rgba(255, 238, 217, .07),
    inset 0 -2px 0 rgba(0, 0, 0, .72) !important;
}

.source-deck.turntable::before {
  inset: 7px !important;
  border: 1px solid rgba(185, 138, 96, .13) !important;
  border-radius: 24px !important;
  background: linear-gradient(112deg, rgba(255, 240, 220, .035), transparent 31% 76%, rgba(0, 0, 0, .18)) !important;
  opacity: 1 !important;
}

.source-deck.turntable::after {
  left: 5px !important;
  right: 5px !important;
  bottom: -14px !important;
  height: 17px !important;
  border-radius: 0 0 24px 24px !important;
  background: linear-gradient(180deg, #17100d, #070504 76%, #030202) !important;
  box-shadow: 0 13px 24px rgba(0, 0, 0, .48), inset 0 1px rgba(199, 150, 104, .08) !important;
}

.source-deck .wood-specular {
  opacity: .045 !important;
}

.source-deck .noise {
  opacity: .014 !important;
}

.source-deck .record-wrap {
  width: 59% !important;
  left: 3.8% !important;
  top: 6.5% !important;
  transform: none !important;
}

.source-deck .record-shadow {
  left: 3% !important;
  right: 3% !important;
  bottom: -2.6% !important;
  height: 8% !important;
  filter: blur(7px) !important;
}

.source-deck .platter {
  inset: 0 !important;
  background:
    repeating-conic-gradient(from 0deg, rgba(255, 225, 186, .13) 0 .09deg, rgba(37, 25, 18, .22) .09deg .30deg),
    radial-gradient(circle, #c39a69 0 84%, #765134 85.2% 88%, #1b1714 89% 94%, #060504 95% 100%) !important;
  box-shadow:
    0 13px 23px rgba(0, 0, 0, .64),
    0 4px 6px rgba(0, 0, 0, .48),
    inset 0 0 0 1px rgba(255, 229, 195, .32),
    inset 0 -3px 8px rgba(0, 0, 0, .48) !important;
}

.source-deck .platter::before {
  opacity: .34 !important;
}

.source-deck .platter-glint {
  opacity: .13 !important;
}

.source-deck .rubber {
  inset: 2.1% !important;
  background: radial-gradient(circle, #181716 0 80%, #090807 88%, #030303 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025), inset 0 -3px 7px rgba(0, 0, 0, .76) !important;
}

.source-deck .record-thickness {
  inset: 4.1% !important;
  transform: translateY(2px) !important;
  background: #020202 !important;
}

.source-deck .vinyl {
  inset: 4.1% !important;
  background:
    radial-gradient(circle at 31% 21%, rgba(255, 255, 255, .075), transparent 12%),
    conic-gradient(from 208deg, transparent 0 9%, rgba(255, 255, 255, .018) 14%, rgba(255, 255, 255, .07) 19%, transparent 27% 61%, rgba(255, 255, 255, .025) 67%, transparent 75%),
    radial-gradient(circle, #121212 0%, #0a0a0a 45%, #050505 77%, #010101 100%) !important;
  box-shadow:
    0 5px 9px rgba(0, 0, 0, .64),
    inset 0 0 0 1px rgba(255, 255, 255, .07),
    inset 0 -7px 13px rgba(0, 0, 0, .70) !important;
}

.source-deck .vinyl::before {
  inset: 1.5% !important;
  background:
    repeating-radial-gradient(circle, transparent 0 1.15px, rgba(255, 255, 255, .020) 1.35px, rgba(0, 0, 0, .24) 1.55px, transparent 1.78px),
    repeating-radial-gradient(circle, transparent 0 15px, rgba(255, 255, 255, .014) 15.35px, rgba(0, 0, 0, .18) 15.7px, transparent 16.25px) !important;
  opacity: .86 !important;
}

.source-deck .vinyl::after {
  inset: 8% !important;
  background: repeating-radial-gradient(circle, transparent 0 17px, rgba(255, 255, 255, .016) 17.35px, rgba(0, 0, 0, .15) 17.7px, transparent 18.3px) !important;
  opacity: .42 !important;
}

.source-deck .fixed-light {
  inset: 4.1% !important;
  background: linear-gradient(121deg, transparent 22%, rgba(255, 255, 255, .018) 31%, rgba(255, 255, 255, .085) 40%, rgba(255, 255, 255, .16) 43%, rgba(255, 255, 255, .026) 49%, transparent 59%) !important;
  opacity: .56 !important;
}

.source-deck .label {
  width: 23% !important;
  left: 38.5% !important;
  top: 38.5% !important;
  color: #ead1ae !important;
  background:
    radial-gradient(circle at 32% 25%, rgba(255, 255, 255, .065), transparent 32%),
    repeating-linear-gradient(1deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 4px),
    radial-gradient(circle, #69402f 0%, #4a2b21 68%, #2b1712 100%) !important;
  box-shadow: 0 0 0 1px rgba(225, 183, 139, .16), 0 0 0 3px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .045) !important;
}

.source-deck .spindle {
  background: radial-gradient(circle at 33% 27%, #f3d7b1, #b27b49 37%, #644127 67%, #21140d) !important;
}

.source-deck .tonearm {
  filter: saturate(.96) contrast(1.04) drop-shadow(0 4px 3px rgba(0, 0, 0, .44)) !important;
}

.source-deck .screw {
  background: radial-gradient(circle at 32% 27%, #efd4aa 0 10%, #ae7a48 31%, #5c3923 61%, #17100c 100%) !important;
}

/* Sélection Sound Room : quatre grands boutons réellement centrés. */
.sound-room-page .music-section-heading,
.sound-room-page .action-grid {
  width: min(100%, 680px) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.sound-room-page .action-card {
  min-height: 108px !important;
  grid-template-columns: 64px minmax(0, 1fr) 32px !important;
  gap: 18px !important;
  padding: 19px 23px !important;
}

.sound-room-page .action-card__icon {
  width: 64px !important;
  height: 64px !important;
}

.sound-room-page .action-card__copy strong {
  font-size: 21px !important;
}

@media (max-width: 760px) {
  .source-deck.turntable {
    width: min(94vw, 410px) !important;
    aspect-ratio: 1.46 / 1 !important;
    border-radius: 22px !important;
  }

  .source-deck.turntable::before {
    inset: 5px !important;
    border-radius: 18px !important;
  }

  .source-deck .record-wrap {
    width: 59% !important;
    left: 3.8% !important;
    top: 6.5% !important;
  }

  .sound-room-page .action-grid {
    width: min(100%, 390px) !important;
    justify-self: center !important;
  }

  .sound-room-page .action-card {
    min-height: 94px !important;
    grid-template-columns: 58px minmax(0, 1fr) 28px !important;
    gap: 15px !important;
    padding: 16px 18px !important;
  }

  .sound-room-page .action-card__icon {
    width: 58px !important;
    height: 58px !important;
  }

  .sound-room-page .action-card__copy strong {
    font-size: 20px !important;
  }
}

@media (max-width: 390px) and (max-height: 720px) {
  .source-deck.turntable {
    width: min(92vw, 360px) !important;
    aspect-ratio: 1.46 / 1 !important;
  }

  .sound-room-page .action-card {
    min-height: 90px !important;
  }
}
