.dj-booth{color:#faf8ed;background:#0c0c0e;padding:48px max(5vw,50vw - 650px);scroll-margin-top:92px}.dj-booth h2{color:#dfff00;margin:0;font-size:clamp(28px,4vw,56px)}.dj-booth>p{margin:12px 0 24px}.dj-rig{grid-template-columns:minmax(0,1fr) minmax(0,1.064fr) minmax(0,1fr);align-items:start;gap:12px;display:grid}.dj-turntable,.dj-mixer-photo{background:#181818;border-radius:8px;position:relative;overflow:hidden}.dj-turntable img,.dj-mixer-photo img{width:100%;height:auto;display:block}.dj-record{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;border-radius:50%;place-items:center;width:69%;height:76%;display:grid;position:absolute;top:7%;left:5%}.dj-record span{aspect-ratio:1;color:#dfff00;text-indent:1.6em;background:radial-gradient(circle,#b9ae99 0 4%,#151413 5% 65%,#dfff00 67% 68%,#171615 70%);border-radius:50%;place-items:center;width:35%;font-weight:900;display:grid}.dj-record.spinning span{animation:1.8s linear infinite dj-spin}.dj-record.held span{transform:rotate(var(--spin,0deg));animation:none}@keyframes dj-spin{to{transform:rotate(1turn)}}.dj-start{color:#141414;background:linear-gradient(#e1dcd0,#8e8980);border:1px solid #141414;border-radius:4px;min-height:34px;padding:5px 9px;font-weight:800;position:absolute;bottom:7%;left:2.5%}.dj-start[aria-pressed=true]{background:#dfff00}.dj-track{overflow-wrap:anywhere;margin:10px 0 5px;font-weight:700}.dj-file{gap:5px;font-size:13px;display:grid}.dj-file input{width:100%;font-size:12px}.dj-controls{background:#1b1a18;border-radius:0 0 8px 8px;gap:9px;padding:14px;display:grid}.dj-controls label{gap:4px;font-size:13px;display:grid}.dj-controls input{accent-color:#dfff00;width:100%}.dj-vu{background:#131414;grid-template-rows:repeat(12,1fr);grid-template-columns:repeat(2,1fr);grid-auto-flow:column;gap:2px;width:9.4%;height:29%;padding:1px;display:grid;position:absolute;top:21%;left:70.3%;transform:rotate(180deg)}.dj-vu i{background:#272b22;border-radius:1px}.dj-vu i.lit{background:#9aff38;box-shadow:0 0 5px #9aff38}.dj-vu i.lit:nth-child(12n+10),.dj-vu i.lit:nth-child(12n+11){background:#ffd341;box-shadow:0 0 5px #ffd341}.dj-vu i.lit:nth-child(12n){background:#ff5140;box-shadow:0 0 5px #ff5140}@media (max-width:670px){.dj-rig{grid-template-columns:repeat(2,minmax(0,1fr))}.dj-mixer{grid-area:2/1/auto/-1;justify-self:center;width:100%;max-width:380px}}@media (prefers-reduced-motion:reduce){.dj-record.spinning span{animation:none}}.dj-record{animation-duration:1.8s}.dj-record.spinning span{animation-duration:inherit}.dj-tonearm{pointer-events:none;filter:drop-shadow(2px 3px 3px #000a);width:100%;height:100%;position:absolute;inset:0}.dj-arm-handle,.dj-power,.dj-light,.dj-rpm,.dj-pitch{margin:0;position:absolute}.dj-arm-handle{cursor:grab;touch-action:none;background:0 0;border:0;border-radius:50%;width:12%;height:12%;transform:translate(-50%,-50%)}.dj-arm-handle:active{cursor:grabbing}.dj-power,.dj-light{aspect-ratio:1;background:0 0;border:0;border-radius:50%;width:8%}.dj-power{top:72%;left:1.4%}.dj-power[aria-pressed=false]{background:#0007}.dj-light{top:85%;left:51.6%}.dj-rpm{color:#171514;background:#b5ac99;border:1px solid #222;border-radius:2px;width:6.7%;height:3.2%;padding:0;font:700 clamp(6px,1vw,10px)/1 sans-serif;top:90%}.dj-rpm[aria-pressed=true]{background:#dfff00}.dj-rpm-33{left:15.7%}.dj-rpm-45{left:23%}.dj-pitch{-webkit-appearance:none;appearance:none;writing-mode:vertical-lr;cursor:ns-resize;touch-action:none;direction:ltr;background:0 0;width:4.6%;height:28%;top:53%;right:2.2%}.dj-pitch::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:repeating-linear-gradient(#d4cabb 0 2px,#888073 3px 4px);border:1px solid #47403a;border-radius:2px;width:100%;height:12px}.dj-pitch::-moz-range-thumb{background:#b7ad9e;border:1px solid #47403a;border-radius:2px;width:100%;height:12px}.dj-vu{width:12%;height:32%;top:24%;left:73%}.dj-cue{background:0 0;border:0;border-radius:5px;width:6%;height:10%;position:absolute;top:28%;left:91%}.dj-cue[aria-pressed=true]{background:#dfff0026;outline:1px solid #dfff00}.dj-start{width:8%;height:6.2%;min-height:0;padding:0;font-size:clamp(6px,.85vw,12px);bottom:8.5%;left:4.1%}:is(.dj-arm-handle:focus-visible,.dj-cue:focus-visible,.dj-power:focus-visible,.dj-light:focus-visible,.dj-pitch:focus-visible){outline-offset:2px;outline:2px solid #dfff00}.dj-start:before{content:"";pointer-events:none;border-radius:4px;position:absolute;inset:-20%;box-shadow:0 0 0 3px #252321}@media (min-width:671px){.dj-rig{grid-template-columns:minmax(0,1fr) minmax(0,1.064fr) minmax(0,1fr);gap:clamp(4px,1vw,12px)}}.dj-pitch{z-index:2;border-radius:3px;width:7%;right:1%}.dj-pitch::-webkit-slider-thumb{background:repeating-linear-gradient(#ebe2d2 0 2px,#847b6f 3px 4px);height:clamp(9px,1.5vw,18px);box-shadow:0 2px 4px #000}.dj-pitch::-moz-range-thumb{background:repeating-linear-gradient(#ebe2d2 0 2px,#847b6f 3px 4px);height:clamp(9px,1.5vw,18px);box-shadow:0 2px 4px #000}.dj-channel-fader{-webkit-appearance:none;appearance:none;writing-mode:vertical-lr;cursor:ns-resize;touch-action:none;direction:rtl;background:linear-gradient(90deg,#2d2d2a 42%,#090909 43% 57%,#2d2d2a 58%);border:0;border-radius:3px;width:3.9%;height:25%;margin:0;position:absolute;top:64%}.dj-channel-fader::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:repeating-linear-gradient(#ede5c9 0 2px,#a99f84 3px 4px);border:1px solid #807867;border-radius:3px;width:100%;height:22%;min-height:9px;box-shadow:1px 2px 3px #000}.dj-channel-fader::-moz-range-thumb{background:repeating-linear-gradient(#ede5c9 0 2px,#a99f84 3px 4px);border:1px solid #807867;border-radius:3px;width:100%;height:clamp(9px,1.3vw,17px);box-shadow:1px 2px 3px #000}.dj-channel-fader:focus-visible{outline-offset:2px;outline:2px solid #dfff00}.dj-vu{background:0 0;column-gap:87%;width:11.7%;height:32.2%;padding:0;top:23.8%;left:75%}.dj-pitch::-webkit-slider-thumb{width:clamp(12px,2vw,25px)}.dj-pitch::-moz-range-thumb{width:clamp(12px,2vw,25px)}.dj-light{cursor:pointer;width:5.4%;top:85.6%;left:52.8%}.dj-light[aria-pressed=true]{background:radial-gradient(circle at 40% 38%,#fff9d3 0 28%,#d4bc85 35%,#73654c 65%,#3b352d 72%);box-shadow:0 0 8px #ffdf92}.dj-target-beam{pointer-events:none;mix-blend-mode:screen;background:conic-gradient(from 290deg at 55.5% 88%,#0000 0deg,#ffdb864d 23deg,#0000 47deg);position:absolute;inset:0;-webkit-mask-image:radial-gradient(33% 33% at 55.5% 88%,#000,#0000);mask-image:radial-gradient(33% 33% at 55.5% 88%,#000,#0000)}.dj-crossfader{-webkit-appearance:none;appearance:none;cursor:ew-resize;touch-action:none;background:linear-gradient(#30302e 41%,#080808 42% 60%,#30302e 61%);border:0;border-radius:3px;width:13.6%;height:6.8%;margin:0;position:absolute;top:89.3%;left:22.6%}.dj-crossfader::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:repeating-linear-gradient(90deg,#ebe3c6 0 2px,#a99e83 3px 4px);border:1px solid #827966;border-radius:3px;width:17%;height:clamp(9px,1.8vw,23px);box-shadow:1px 2px 3px #000}.dj-crossfader::-moz-range-thumb{background:repeating-linear-gradient(90deg,#ebe3c6 0 2px,#a99e83 3px 4px);border:1px solid #827966;border-radius:3px;width:17%;height:clamp(9px,1.8vw,23px);box-shadow:1px 2px 3px #000}.dj-crossfader:focus-visible{outline-offset:2px;outline:2px solid #dfff00}.dj-pitch-scale{color:#e4dbca;pointer-events:none;background:#211e1a;flex-direction:column;justify-content:space-between;align-items:center;width:3.4%;height:28%;font:clamp(5px,.72vw,10px)/1 monospace;display:flex;position:absolute;top:53.2%;left:89.8%}.dj-turntable{aspect-ratio:730/670}.dj-turntable img{object-fit:fill;height:100%}.dj-record{aspect-ratio:1;width:66.6%;height:auto;top:6.7%;left:6.3%}.dj-mixer-photo{aspect-ratio:482/310}.dj-mixer-photo img{object-fit:fill;height:100%}.dj-eq{background:#1b1a18;border-radius:0 0 8px 8px;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:9px 5px;display:grid}.dj-eq label{text-align:center;gap:3px;font-size:clamp(9px,1.2vw,13px);display:grid}.dj-eq input{accent-color:#dfff00;width:100%;min-width:0;margin:0}.dj-eq output{color:#dfff00;font-variant-numeric:tabular-nums}.dj-mixer-eq{aspect-ratio:1;background:radial-gradient(circle at 32% 27%,#666,#272727 52%,#0a0a0a 77%);border-radius:50%;width:4%;position:absolute;transform:translate(-50%,-50%);box-shadow:0 2px 3px #000}.dj-mixer-eq-0{left:24%}.dj-mixer-eq-1{left:34.5%}.dj-mixer-eq-band-0{top:40%}.dj-mixer-eq-band-1{top:33%}.dj-mixer-eq-band-2{top:26%}.dj-mixer-eq span{border-radius:inherit;pointer-events:none;position:absolute;inset:0}.dj-mixer-eq span:before{content:"";background:#dfff00;border-radius:2px;width:8%;height:28%;position:absolute;top:8%;left:46%}.dj-mixer-eq input{opacity:0;cursor:ew-resize;touch-action:none;width:100%;height:100%;margin:0;position:absolute;inset:0}.dj-mixer-eq:focus-within{outline:2px solid #dfff00}.dj-mixer-photo{--cap-ridges:repeating-linear-gradient(#efff76 0 2px, #c1da00 2px 3px, #dfff00 3px 5px);--cap-edge:#657600;--cap-shadow:inset 0 1px 1px #f8ffab, 0 2px 3px #000d}.dj-mixer-eq{background:radial-gradient(circle at 35% 28%,#f6ff8c,#dfff00 49%,#8eaa00 74%,#435100 77%);width:4.6%;box-shadow:0 0 0 1px #191b12,0 2px 4px #000d}.dj-mixer-eq span:before{background:#202510}.dj-channel-fader,.dj-crossfader{box-shadow:inset 0 0 0 1px #111,0 0 0 1px #55534b}.dj-channel-fader::-webkit-slider-thumb{background:var(--cap-ridges);border-color:var(--cap-edge);box-shadow:var(--cap-shadow)}.dj-crossfader::-webkit-slider-thumb{background:var(--cap-ridges);border-color:var(--cap-edge);box-shadow:var(--cap-shadow)}.dj-channel-fader::-moz-range-thumb{background:var(--cap-ridges);border-color:var(--cap-edge);box-shadow:var(--cap-shadow)}.dj-crossfader::-moz-range-thumb{background:var(--cap-ridges);border-color:var(--cap-edge);box-shadow:var(--cap-shadow)}.dj-mixer-photo{container-type:inline-size}.dj-channel-fader{width:3.1%;height:27.5%;top:62%}.dj-channel-fader-0{left:22.15%}.dj-channel-fader-1{left:32.65%}.dj-master-0{left:74.15%}.dj-master-1{left:84.85%}.dj-channel-fader::-webkit-slider-thumb{box-sizing:border-box;height:5.1cqw;min-height:0}.dj-channel-fader::-moz-range-thumb{box-sizing:border-box;height:5.1cqw}.dj-vertical-fader{background:linear-gradient(90deg,#0000 35%,#090909 36% 64%,#0000 65%);width:3.1%;height:19%;position:absolute;top:66%}.dj-fader-cap{pointer-events:none;box-sizing:border-box;border:1px solid var(--cap-edge);background:var(--cap-ridges);width:100%;height:5.1cqw;box-shadow:var(--cap-shadow);border-radius:3px;position:absolute;left:0;transform:translateY(-50%)}.dj-vertical-fader input{writing-mode:vertical-lr;opacity:0;cursor:ns-resize;direction:rtl;width:100%;height:calc(100% + 5.1cqw);margin:0;position:absolute;inset:-2.55cqw 0}.dj-vertical-fader:focus-within .dj-fader-cap{outline:2px solid #fff}.dj-rpm{font-size:clamp(3px,.47vw,7px)}.dj-pitch-scale{font-size:clamp(3px,.45vw,7px)}.dj-playlist{gap:5px;min-width:0;margin:8px 0;font-size:13px;display:grid}.dj-playlist select{color:#faf8ed;background:#1b1a18;border:1px solid #77745f;border-radius:5px;width:100%;min-width:0;padding:8px}.dj-tempo{flex-wrap:wrap;align-items:center;gap:8px;padding:8px 5px;display:flex}.dj-tempo output{color:#dfff00;font:700 14px/1.2 monospace}.dj-tempo button{color:#151600;background:#dfff00;border:1px solid #a5bd00;border-radius:5px;min-height:30px;font-weight:800}.dj-tempo button:disabled{opacity:.45}.dj-rim{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.dj-rim ellipse{pointer-events:stroke;cursor:grab;touch-action:none}.dj-rim ellipse:active{cursor:grabbing}.dj-record span,.dj-record.held span,.dj-rim-rotation{transform:rotate(var(--record-rotation,0turn))}@media (prefers-reduced-motion:reduce){.dj-record span,.dj-record.held span,.dj-rim-rotation{transform:none}}.dj-strobe-dots{transform:rotate(var(--strobe-rotation,0turn))}@media (prefers-reduced-motion:reduce){.dj-strobe-dots{transform:none}}@media (max-width:670px){.dj-deck{flex-direction:column;min-width:0;display:flex}.dj-tempo{text-align:center;flex-direction:column;order:-1;align-items:stretch;padding:0 0 8px}.dj-tempo button{width:100%;min-height:44px}}
