/* Exclusivement le lecteur agrandi et son égaliseur; aucun style du mini-lecteur. */
#fs-player.reign-eq-layout {
  height: 100%;
  height: 100dvh;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  justify-content: flex-start;
  padding: max(52px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
}
#fs-player.reign-eq-layout > * { flex-shrink: 0; }
#fs-player.reign-eq-layout .fs-player__date { margin-top: auto; margin-bottom: 12px; }
#fs-player.reign-eq-layout .fs-player__vinyl { margin-bottom: 14px; }
#fs-player.reign-eq-layout #fs-vinyl.has-cover {
  width: clamp(132px, 22dvh, 200px) !important;
  height: clamp(132px, 22dvh, 200px) !important;
  min-width: 0 !important; min-height: 0 !important;
}
#fs-player.reign-eq-layout .fs-player__title { margin-bottom: 12px; line-height: 1.4; }
#fs-player.reign-eq-layout > .reign-progress { margin-bottom: 12px; }
#fs-player.reign-eq-layout .fs-player__controls { margin-bottom: 14px; }
#fs-player.reign-eq-layout .fs-player__volume { min-height: 32px; }
#fs-player.reign-eq-layout .fs-player__volume input { min-width: 0; }
#fs-player.reign-eq-layout .fs-player__close {
  position: sticky; top: max(16px, env(safe-area-inset-top)); right: auto;
  align-self: flex-end; min-width: 44px; min-height: 44px;
  margin-top: -44px; margin-bottom: 0; z-index: 4;
}
#fs-player .reign-eq {
  --eq-bass: 0;
  --eq-mid: 0;
  --eq-high: 0;
  --eq-energy: 0;
  position: relative;
  z-index: 2;
  isolation: isolate;
  width: 100%;
  max-width: 380px;
  margin: 18px auto auto;
  padding: 12px 0 4px;
  color: #ff2b2b;
  border: 0;
  background: none;
  text-align: center;
  user-select: none;
  -webkit-user-select: none;
}
#fs-player .reign-eq::before {
  content: '';
  position: absolute;
  top: 0; left: 12%; right: 12%; height: 1px;
  background: linear-gradient(90deg, transparent, #712020, #ff2b2b, #712020, transparent);
  opacity: .65;
  pointer-events: none;
}
#fs-player .reign-eq__heading { position: relative; display: flex; align-items: center; justify-content: center; min-height: 28px; }
#fs-player .reign-eq__heading h2 {
  margin: 0; padding: 0 38px;
  font: 400 clamp(.85rem, 3.5vw, 1rem)/1.5 'Cinzel Decorative', serif;
  letter-spacing: 3px;
  color: #ff2b2b;
  text-shadow: 0 0 9px rgba(255,43,43,.22);
}
#fs-player .reign-eq__heading h2::before { content: '◇'; margin-right: 10px; color: #8e2525; font-size: .7em; }
#fs-player .reign-eq__heading h2::after { content: '◇'; margin-left: 10px; color: #8e2525; font-size: .7em; }
#fs-player .reign-eq__reset {
  position: absolute; right: -4px; top: -8px;
  width: 44px; height: 44px; padding: 0;
  border: 0; border-radius: 50%; background: transparent; box-shadow: none;
  color: #b45353; font: 24px/1 system-ui, sans-serif; cursor: pointer;
}
#fs-player .reign-eq__reset:hover { color: #ff2b2b; background: rgba(255,43,43,.04); }
#fs-player .reign-eq__plot { height: 150px; position: relative; margin-top: 4px; }
#fs-player .reign-eq__graph { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
#fs-player .reign-eq__graph path { fill: none; vector-effect: non-scaling-stroke; }
#fs-player .reign-eq__guides { stroke: rgba(255,43,43,.16); stroke-width: 1; stroke-dasharray: 3 5; }
#fs-player .reign-eq__zero { stroke: rgba(255,43,43,.35); stroke-width: 1; stroke-dasharray: 4 5; }
#fs-player .reign-eq__curve { stroke: #ff2b2b; stroke-width: 2; filter: drop-shadow(0 0 3px rgba(255,43,43,.65)); }
#fs-player .reign-eq__mist {
  position: absolute; inset: -12px -10px -6px;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 20% 65%, rgba(170,0,0,calc(.06 + var(--eq-bass) * .65)), transparent 45%),
    radial-gradient(ellipse at 50% 50%, rgba(220,20,20,calc(var(--eq-mid) * .55)), transparent 42%),
    radial-gradient(ellipse at 80% 40%, rgba(255,43,43,calc(.0324 + var(--eq-high) * .5)), transparent 48%);
}
#fs-player .reign-eq__ripple {
  stroke: #b81c1c; stroke-width: 1;
  opacity: calc(var(--eq-energy) * .85);
  filter: drop-shadow(0 0 3px rgba(255,43,43,.45));
}
#fs-player .reign-eq__scale { position: absolute; left: 0; font: 11px/1 system-ui, sans-serif; color: #b65555; transform: translateY(-50%); pointer-events: none; }
#fs-player .reign-eq__scale--top { top: 16.6667%; }
#fs-player .reign-eq__scale--zero { top: 50%; }
#fs-player .reign-eq__scale--bottom { top: 83.3333%; }
#fs-player .reign-eq__point {
  position: absolute; width: 48px; height: 48px;
  transform: translate(-50%, -50%);
  border: 0; border-radius: 50%; outline: none;
  background: transparent; cursor: ns-resize; touch-action: none;
}
#fs-player .reign-eq__point::before {
  content: ''; position: absolute; inset: 14px;
  border-radius: 50%; border: 1px solid #ff9898;
  background: #ff2b2b;
  box-shadow: 0 0 0 5px rgba(255,43,43,.08), 0 0 12px rgba(255,43,43,.45);
  pointer-events: none;
}
#fs-player .reign-eq__point:focus-visible { outline: 1px solid #ff7070; outline-offset: -4px; }
#fs-player .reign-eq__point.is-adjusting::before { box-shadow: 0 0 0 6px rgba(255,43,43,.14), 0 0 16px rgba(255,43,43,.65); }
#fs-player .reign-eq__value {
  position: absolute; bottom: 44px; left: 50%; transform: translateX(-50%);
  padding: 3px 5px; border-radius: 4px; background: #160303;
  color: #ff8888; font: 12px/1.3 system-ui, sans-serif; font-variant-numeric: tabular-nums;
  white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s;
}
#fs-player .reign-eq__point.is-adjusting .reign-eq__value { opacity: 1; }
#fs-player .reign-eq__labels { position: relative; height: 22px; font: 400 .8rem/1.5 'Cinzel Decorative', serif; letter-spacing: 1.5px; }
#fs-player .reign-eq__labels span { position: absolute; transform: translateX(-50%); }
#fs-player .reign-eq__labels span:nth-child(1) { left: 20%; }
#fs-player .reign-eq__labels span:nth-child(2) { left: 50%; }
#fs-player .reign-eq__labels span:nth-child(3) { left: 80%; }
#fs-player .reign-eq__status { margin: 8px 0 0; color: #ce7777; font: 12px/1.5 system-ui, sans-serif; }
#fs-player .reign-eq--unavailable .reign-eq__point { opacity: .45; cursor: default; }
#fs-player .reign-eq__reset:disabled { opacity: .35; cursor: default; }
@media (max-height: 760px) {
  #fs-player.reign-eq-layout { padding-top: max(48px, env(safe-area-inset-top)); }
  #fs-player.reign-eq-layout #fs-vinyl.has-cover { width: clamp(120px, 20dvh, 160px) !important; height: clamp(120px, 20dvh, 160px) !important; }
  #fs-player.reign-eq-layout .fs-player__date { margin-bottom: 10px; }
  #fs-player.reign-eq-layout .fs-player__controls { margin-bottom: 10px; }
  #fs-player .reign-eq { margin-top: 12px; }
  #fs-player .reign-eq__plot { height: 128px; }
}
@media (prefers-reduced-motion: reduce) {
  #fs-player .reign-eq__mist { opacity: .12; }
  #fs-player .reign-eq__ripple { display: none; }
  #fs-player .reign-eq__value { transition: none; }
}
