/* Phonophile 3Q deck skin (pp3q 3q5). Visual only: every existing deck element, handler and timing is kept. */
/* rendered layers in the 5:4 box (the open dust cover may rise above the box) */
.wax-deck-stage[data-pp3q-on] .pp3q-layer{position:absolute;left:0;top:-25.0588%;width:100%;height:125.0588%;max-width:none;pointer-events:none;-webkit-user-select:none;user-select:none}
.wax-deck-stage[data-pp3q-on] .pp-plinth{visibility:hidden}
/* flat deck plane -> perspective: matrix3d is written by pp3q.js (same element, same animations, same keys) */
.wax-deck-stage[data-pp3q-on] [data-pp3q=platter],.wax-deck-stage[data-pp3q-on] [data-pp3q=arm]{transform-origin:0 0}
.wax-deck-stage[data-pp3q-on] [data-pp3q=platter]>:not([data-pp3q=disc]){visibility:hidden}
.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .wax-vinyl-body,.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .pp-grooves,.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .pp-vinyl-sheen,
.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .pp-tilt-canvas,.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .pp-tilt-css,.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .wax-vinyl-rings,
.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .wax-vinyl-edge,.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .wax-vinyl-gloss,.wax-deck-stage[data-pp3q-on] [data-pp3q=disc] .wax-disc-lamp{visibility:hidden!important}
.wax-deck-stage[data-pp3q-on] .pp3q-plane{position:absolute;max-width:none;pointer-events:none;-webkit-user-select:none;user-select:none}
.wax-deck-stage[data-pp3q-on] .pp3q-sheen>img{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.wax-deck-stage[data-pp3q-on] .pp3q-sheen>.pp3q-sheen-c{opacity:0.5}
/* tonearm: 63 rendered frames every 0.5 deg (5.0..36.0) follow the needle button's own rotate()+2.2 s transition.
   Exactly one arm bitmap: the nearest frame is drawn into ONE canvas (no blending), the <=0.25 deg leftover is a transform on it.
   The contact shadow is a second canvas on the deck (never transformed), adjacent 0.5-deg frames blended inside it. */
.wax-deck-stage[data-pp3q-on] .pp3q-arm{position:absolute;left:0;top:0;width:100%;height:100%;z-index:59;pointer-events:none}
.wax-deck-stage[data-pp3q-on] .pp3q-arm-c{position:absolute;max-width:none;transform-origin:0 0;will-change:transform;pointer-events:none}
.wax-deck-stage[data-pp3q-on] .pp3q-armsh-c{position:absolute;max-width:none;pointer-events:none}
.wax-deck-stage[data-pp3q-on] [data-pp=needle]{filter:none!important;clip-path:polygon(95.19% -5.00%,16.67% -5.00%,16.67% -0.27%,18.52% 4.21%,26.30% 9.58%,35.56% 14.23%,35.19% 17.20%,30.00% 19.28%,29.63% 20.40%,33.70% 23.12%,41.48% 26.65%,43.70% 33.30%,46.30% 34.50%,54.07% 36.59%,56.67% 39.55%,62.96% 50.29%,65.19% 60.30%,62.96% 68.64%,56.67% 75.21%,49.63% 78.89%,40.37% 80.42%,35.19% 82.02%,34.44% 83.22%,30.74% 84.90%,32.22% 86.75%,31.48% 88.51%,6.67% 98.29%,6.67% 108.78%,8.52% 109.66%,18.89% 111.91%,22.59% 112.15%,38.89% 111.51%,46.30% 111.59%,61.11% 110.22%,65.56% 109.18%,77.41% 104.29%,76.67% 103.01%,67.04% 99.65%,67.41% 96.76%,65.19% 95.48%,65.19% 94.44%,67.78% 93.08%,68.52% 91.47%,75.93% 89.15%,76.67% 86.75%,85.19% 82.66%,90.37% 79.13%,95.56% 72.24%,97.41% 66.39%,95.19% 53.57%,85.56% 37.47%,88.15% 36.19%,99.26% 34.18%,104.44% 32.34%,104.81% 30.02%,100.37% 27.61%,100.00% 25.85%,101.85% 24.81%,110.00% 22.56%,111.85% 18.72%,111.48% 11.59%,107.41% 8.06%,98.52% 3.17%,97.78% -0.99%);-webkit-clip-path:polygon(95.19% -5.00%,16.67% -5.00%,16.67% -0.27%,18.52% 4.21%,26.30% 9.58%,35.56% 14.23%,35.19% 17.20%,30.00% 19.28%,29.63% 20.40%,33.70% 23.12%,41.48% 26.65%,43.70% 33.30%,46.30% 34.50%,54.07% 36.59%,56.67% 39.55%,62.96% 50.29%,65.19% 60.30%,62.96% 68.64%,56.67% 75.21%,49.63% 78.89%,40.37% 80.42%,35.19% 82.02%,34.44% 83.22%,30.74% 84.90%,32.22% 86.75%,31.48% 88.51%,6.67% 98.29%,6.67% 108.78%,8.52% 109.66%,18.89% 111.91%,22.59% 112.15%,38.89% 111.51%,46.30% 111.59%,61.11% 110.22%,65.56% 109.18%,77.41% 104.29%,76.67% 103.01%,67.04% 99.65%,67.41% 96.76%,65.19% 95.48%,65.19% 94.44%,67.78% 93.08%,68.52% 91.47%,75.93% 89.15%,76.67% 86.75%,85.19% 82.66%,90.37% 79.13%,95.56% 72.24%,97.41% 66.39%,95.19% 53.57%,85.56% 37.47%,88.15% 36.19%,99.26% 34.18%,104.44% 32.34%,104.81% 30.02%,100.37% 27.61%,100.00% 25.85%,101.85% 24.81%,110.00% 22.56%,111.85% 18.72%,111.48% 11.59%,107.41% 8.06%,98.52% 3.17%,97.78% -0.99%)}
/* rest position: the app keeps rotate(-7deg) at rest; the 3D deck adds +12.0deg (CSS rotate, composes with transform) only while the
   arm is off the record, so the 3D arm rests at 5.0deg, clear of the volume fader. Same 2.2 s curve on both properties, so the
   combined swing is exactly rotate(5.0 -> 36-10*progress) with the original easing. Playing angles are untouched. */
.wax-deck-stage[data-pp3q-on] [data-pp=needle]{transition:transform 2200ms cubic-bezier(0.16,1,0.3,1),rotate 2200ms cubic-bezier(0.16,1,0.3,1)!important}
.wax-deck-stage[data-pp3q-on] [data-pp=needle][data-on-record="0"]{rotate:12.0deg}
.wax-deck-stage[data-pp3q-on].pp3q-noanim [data-pp=needle]{transition:none!important}
.wax-deck-stage[data-pp3q-on] [data-pp=needle]>img,.wax-deck-stage[data-pp3q-on] [data-pp=needle]>.wax-cw{opacity:0}
/* the 3D headshell + cartridge reach past the button's narrow box: a transparent pseudo-element (part of the same button,
   rotating with it) lets the arm-shaped clip-path above cover them; outside the polygon nothing is hit */
.wax-deck-stage[data-pp3q-on] [data-pp=needle]::after{content:"";position:absolute;left:-100%;right:-100%;top:-5%;bottom:-25%;background:transparent}
/* start/stop: same button, now over the 3D start knob; its LED sits at the knob's LED */
.wax-deck-stage[data-pp3q-on] .wax-start-btn{left:6.490%;top:66.970%;bottom:auto;width:7.155%;height:9.440%;aspect-ratio:auto;background:none!important;box-shadow:none!important;border-radius:40%}
.wax-deck-stage[data-pp3q-on] .wax-start-cap{inset:0;background:none!important;box-shadow:none!important}
.wax-deck-stage[data-pp3q-on] .wax-start-led{left:117.83%;top:61.16%;width:4.5px;height:3px;border-radius:50%}
/* platter LED = the 3D target lamp; when it is on, the lit render of the lamp + strobe dots fades in */
.wax-deck-stage[data-pp3q-on] .wax-platter-led{left:62.379%;top:68.374%;width:4.094%;height:9.104%;aspect-ratio:auto}
.wax-deck-stage[data-pp3q-on] .wax-platter-led>span{opacity:0}
.wax-deck-stage[data-pp3q-on] .pp3q-lamp{position:absolute;left:-489.651%;top:-60.964%;width:850.198%;height:179.619%;max-width:none;opacity:0;transition:opacity .34s;pointer-events:none}
.wax-deck-stage[data-pp3q-on] .wax-platter-led.is-on .pp3q-lamp{opacity:1}
/* volume: same range input, now lying over the 3D fader slot (cap sprite follows its value) */
.wax-deck-stage[data-pp3q-on] .wax-vol{display:block;left:88.987%;top:64.868%;right:auto;bottom:auto;width:9.000%;height:10.756%}
.wax-deck-stage[data-pp3q-on] .wax-vol-ticks,.wax-deck-stage[data-pp3q-on] .wax-vol-icon{visibility:hidden;position:absolute}
.wax-deck-stage[data-pp3q-on] .wax-fader{position:absolute;inset:0;width:100%;height:100%;opacity:0;touch-action:none}
.wax-deck-stage[data-pp3q-on] .wax-fader::-webkit-slider-runnable-track{height:100%;width:100%;background:none;box-shadow:none}
.wax-deck-stage[data-pp3q-on] .wax-fader::-webkit-slider-thumb{height:8.0px;width:100%;margin-left:0}
.wax-deck-stage[data-pp3q-on] .pp3q-fadercap{position:absolute;z-index:21;max-width:none;pointer-events:none}
/* 33/45/78 text badges are decorative (no handlers): the 3D body has its own unlabelled speed keys */
.wax-deck-stage[data-pp3q-on] .wax-speed-btn{opacity:0}
@media (prefers-reduced-motion:reduce){.wax-deck-stage[data-pp3q-on] .pp3q-sheen>img{opacity:0!important}.wax-deck-stage[data-pp3q-on] .pp3q-sheen>.pp3q-sheen-c{opacity:0.5!important}}
