/* Paez440Pro · piel de controles con los masters comprados (assets/ui-controls/v2, 30-sep-2026).
   Solo piel: la lógica sigue en cada herramienta. */
html body .p440-skin-knob.p440-skin-knob{
  background-repeat:no-repeat!important;background-color:transparent!important;border:0!important;box-shadow:none!important;
  border-radius:50%!important;padding:0!important;cursor:grab;touch-action:none;
}
html body .p440-skin-knob.p440-skin-knob::before,html body .p440-skin-knob.p440-skin-knob::after{display:none!important;content:none!important;}
.p440-skin-knob:active{cursor:grabbing;}
.p440-skin-knob:focus-visible{outline:2px solid rgba(201,187,166,.7);outline-offset:3px;}
.p440-range-hidden{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;}

/* R5 · base de rótulos: un solo color y una sola tipografía para todo rótulo de control */
:root{--p440-label-color:#C9BBA6;--p440-label-font:800 11px/1.15 "Arial Narrow","Roboto Condensed",Arial,sans-serif;--p440-label-track:.06em}

/* Button Package 07: gráfico arriba, label abajo, centrado (librería de controles) */
html body .p440-pkg.p440-pkg{
  width:auto!important;display:inline-flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;gap:5px!important;
  min-width:62px;padding:0 2px!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;
  color:var(--p440-label-color)!important;font:var(--p440-label-font)!important;letter-spacing:var(--p440-label-track);
  text-transform:uppercase;text-shadow:0 1px 2px #000;cursor:pointer;min-height:0!important;
}
html body .p440-pkg.p440-pkg::before{
  content:"";display:block;width:var(--p440-pkg-size,46px);height:var(--p440-pkg-size,46px);flex:0 0 auto;
  background:var(--p440-pkg-img) center top/100% 200% no-repeat;filter:drop-shadow(0 3px 3px rgba(0,0,0,.6));
}
html body .p440-pkg.p440-pkg:active::before,html body .p440-pkg.p440-pkg.is-pressed::before{background-position:center bottom;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6));}
.p440-pkg:disabled{opacity:.45;cursor:default;}
.p440-pkg.gray{--p440-pkg-img:url("/assets/ui-controls/v2/pkg07-gray.webp")}
.p440-pkg.green{--p440-pkg-img:url("/assets/ui-controls/v2/pkg07-green.webp")}
.p440-pkg.orange{--p440-pkg-img:url("/assets/ui-controls/v2/pkg07-orange.webp")}
.p440-pkg.red{--p440-pkg-img:url("/assets/ui-controls/v2/pkg07-red.webp")}
/* POWER = Button-02 (rocker iluminado, 4 cuadros: 0 I apagado · 1 O apagado · 2 I encendido · 3 O encendido).
   RUN = bombillo Kit-40 del start/stop (un solo botón): distinto del power (R7). */
.p440-pkg.power{--p440-pkg-img:url("/assets/ui-controls/v2/button02.webp");--p440-pkg-size:50px}
html body .p440-pkg.p440-pkg.power::before{background-size:100% 400%!important;background-position:center 33.333%!important;}
html body .p440-pkg.p440-pkg.power.is-on::before{background-position:center 66.667%!important;}
.p440-pkg.run{--p440-pkg-img:url("/assets/ui-controls/v2/kit40-power.webp");--p440-pkg-size:50px}
html body .p440-pkg.p440-pkg.run.is-on::before{background-position:center bottom;}
.p440-pkg.toggle{--p440-pkg-img:url("/assets/ui-controls/v2/button08-steel.webp")}
html body .p440-pkg.p440-pkg.toggle.is-on::before{background-position:center bottom;}
.p440-pkg.latch{--p440-pkg-img:url("/assets/ui-controls/v2/kit04-pedal.webp")}
html body .p440-pkg.p440-pkg.latch.is-on::before,html body .p440-pkg.p440-pkg.latch.active::before,html body .p440-pkg.p440-pkg.toggle.active::before{background-position:center bottom;}
.p440-pkg.latch.small{--p440-pkg-img:url("/assets/ui-controls/v2/kit04-button.webp");--p440-pkg-size:34px}
html body .p440-pkg.p440-pkg.latch.active{color:#fff!important}

/* Medidores */
.p440-meter{display:block;background-repeat:no-repeat;margin:0 auto;}
.p440-meter.vu06{width:var(--p440-meter-size,220px);aspect-ratio:1/1;}
.p440-meter.viewmeter01{width:var(--p440-meter-size,220px);aspect-ratio:250/160;}

/* Luz de línea detrás de la unidad encendida (Audio azul, Video verde, Lighting magenta, Calculator blanco) */
.p440-line-audio{--p440-line:#2e9bff}.p440-line-video{--p440-line:#34d27a}.p440-line-lighting{--p440-line:#ff2fb3}.p440-line-calculator{--p440-line:#f4f4f4}
.p440-unit-on{box-shadow:0 0 0 1px color-mix(in srgb,var(--p440-line) 55%,transparent),0 0 28px 6px color-mix(in srgb,var(--p440-line) 45%,transparent)!important;transition:box-shadow .25s ease;}
html body .p440-pkg.p440-pkg:focus:not(:focus-visible){outline:none!important;}
html body .p440-pkg.p440-pkg:focus-visible{outline:2px solid rgba(201,187,166,.7)!important;outline-offset:3px;}
.p440-vu-host{margin:0 0 10px;}

/* LightingTools · switches DMX = Button-08 (arriba ON, abajo OFF). Solo piel: .dip/.on los sigue manejando app.js */
html body .dip-bank .dip .dip-track{width:46px!important;height:46px!important;margin:4px auto!important;padding:0!important;border:0!important;border-radius:0!important;background:url("/assets/ui-controls/v2/button08-steel.webp") center top/100% 200% no-repeat!important;box-shadow:none!important}
html body .dip-bank .dip.on .dip-track{background-position:center bottom!important}
html body .dip-bank .dip .dip-knob{display:none!important}
html body .p440-pkg.lever-action::after{display:none!important;content:none!important}

/* Perillas y selectores (P440Controls.knob) · rótulo único debajo (R4/R5) */
.p440k-wrap{position:relative;display:inline-flex;flex-direction:column;align-items:center}
.p440k{position:relative;touch-action:none;cursor:ns-resize;border-radius:50%;outline:none;background-repeat:no-repeat}
.p440k:focus-visible{box-shadow:0 0 0 2px rgba(127,208,255,.85)}
.p440k-fine{position:absolute;right:-6px;top:-4px;width:9px;height:9px;border-radius:50%;background:#1a262e;box-shadow:0 0 0 1px #000,inset 0 1px 1px #fff3}
.p440k-wrap.fine .p440k-fine{background:#ffb13b;box-shadow:0 0 0 1px #000,0 0 8px #ffb13b}
.p440k-val{margin-top:3px;font:700 12px/1 "Courier New",monospace;color:#9fe0ff;text-shadow:0 0 6px rgba(46,155,255,.5);letter-spacing:0;text-transform:none}
.p440k-marks{display:flex;justify-content:space-between;width:118%;margin-bottom:2px;font:var(--p440-label-font);font-size:9px;color:var(--p440-label-color);letter-spacing:.03em}
.p440k-marks i{font-style:normal;opacity:.55}.p440k-marks i.on{opacity:1;color:#fff;text-shadow:0 0 6px rgba(46,155,255,.9)}
.p440-lbl{display:block;margin-top:5px;text-align:center;color:var(--p440-label-color);font:var(--p440-label-font);letter-spacing:var(--p440-label-track);text-transform:uppercase;text-shadow:0 1px 2px #000;white-space:nowrap}
