/* Paez440PRO Rack Shell — 12U / six 2U modules */
:root{--rack-accent:#48bfff;--rack-accent-rgb:72,191,255;--rack-bg:#050708;--rack-metal:#20262a;--rack-silver:#b9c1c6}
.rackApp{min-height:100dvh;background:radial-gradient(ellipse at 50% -10%,#273137 0,#11161a 40%,#050708 82%);color:#f4f6f7;font-family:"Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif}
.rackShell{width:min(1180px,calc(100% - 18px));margin:10px auto 24px}
.rackMaster{display:grid;grid-template-columns:minmax(260px,1fr) auto auto auto;gap:10px;align-items:center;min-height:78px;padding:9px 12px;border:2px solid var(--rack-silver);background:linear-gradient(115deg,#3b444a,#20262a 52%,#14191c);box-shadow:inset 0 0 0 2px #07090b,inset 0 0 0 3px #687078,0 8px 22px #000c}
.rackBrand{display:flex;align-items:center;gap:11px;min-width:0}.rackLogo{width:74px;height:56px;object-fit:cover;border:1px solid #d1d7db;background:#0b0d0f;box-shadow:inset 0 0 0 2px #ffffff24,0 3px 7px #000}
.rackBrand b{display:block;font-size:23px;line-height:1;letter-spacing:.035em}.rackBrand small{display:block;margin-top:6px;font-size:10px;font-weight:900;letter-spacing:.18em;color:#dbe0e3}
.rackBtn,.rackLang{min-height:42px;padding:7px 12px;border:2px solid #aab3b9;border-radius:0;color:#fff;background:linear-gradient(#555d64 0,#2b3136 46%,#101417 52%,#343a40 100%);box-shadow:inset 0 0 0 2px #0c1013,inset 0 1px 2px #fff5,0 3px 5px #000a;font:900 12px inherit;letter-spacing:.04em;cursor:pointer}
.rackLang{display:flex;align-items:center;gap:8px}.rackLang i{width:34px;height:16px;border-radius:9px;background:#090c0e;box-shadow:inset 0 3px 6px #000;position:relative}.rackLang i:after{content:"";position:absolute;left:3px;top:2px;width:12px;height:12px;border-radius:50%;background:var(--rack-accent);box-shadow:0 0 8px rgba(var(--rack-accent-rgb),.9)}
.rackLauncher{margin-top:10px;padding:8px;height:calc(100dvh - 118px);min-height:480px;max-height:760px;overflow:hidden;border:2px solid #aeb6bb;background:linear-gradient(#20262b,#0a0e11);box-shadow:inset 0 0 0 2px #353d44,0 10px 26px #000b}
.rackRail{display:grid;grid-template-rows:repeat(6,minmax(0,1fr));gap:4px;height:100%}.rackUnit{position:relative;min-height:0;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:10px 15px;border:2px solid #8f989f;background:linear-gradient(180deg,#3b4349 0,#1d2328 17%,#0e1215 72%,#262d32 100%);box-shadow:inset 0 0 0 2px #080b0d,inset 0 0 0 3px #50585f,0 4px 8px #000a;color:#fff;text-align:left;cursor:pointer;touch-action:none}
.rackUnit:before,.rackUnit:after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;top:9px;background:radial-gradient(circle at 38% 35%,#d6d8d9 0 16%,#5d6266 22% 50%,#0b0d0e 55% 61%,#9da1a4 64% 73%,#292d30 78%)}.rackUnit:before{left:9px}.rackUnit:after{right:9px}
.rackUnit:hover,.rackUnit:focus-visible{border-color:var(--rack-accent);box-shadow:inset 0 0 0 2px #080b0d,inset 0 0 0 3px rgba(var(--rack-accent-rgb),.38),0 0 12px rgba(var(--rack-accent-rgb),.28)}
.rackUnit.locked{opacity:.5;cursor:default}.rackHandle{font-size:25px;color:#9aa4aa;cursor:grab;user-select:none;padding:12px 6px}.rackHandle:active{cursor:grabbing}.rackUnitNum{font-size:10px;color:#96a1a7;letter-spacing:.16em}.rackUnitTitle{display:block;font-size:clamp(16px,2.2vw,25px);font-weight:900;letter-spacing:.055em;text-transform:uppercase}.rackUnitSub{display:block;margin-top:5px;color:#aeb8bd;font-size:10px;letter-spacing:.055em}.rackLamp{width:11px;height:11px;border-radius:50%;background:#111;border:1px solid #737b80}.rackUnit:not(.locked) .rackLamp{background:var(--rack-accent);box-shadow:0 0 9px var(--rack-accent)}
.rackU{position:absolute;right:34px;bottom:8px;color:#69747b;font:900 9px ui-monospace,monospace;letter-spacing:.12em}.rackBack[hidden]{display:none!important}
.rackModuleBody{display:none}.rackModuleBody.active{display:block}.rackLauncher.hidden{display:none!important}
.rackLegacyHost{margin-top:10px;height:calc(100dvh - 110px);min-height:520px;border:2px solid #89939a;background:#07090a;box-shadow:inset 0 0 0 2px #11171b,0 9px 25px #000c}.rackLegacyHost iframe{width:100%;height:100%;border:0;background:#080b0d}
@media(max-width:860px){.rackShell{width:calc(100% - 8px);margin:4px auto 14px}.rackMaster{grid-template-columns:1fr auto auto;min-height:68px;padding:7px}.rackLogo{width:58px;height:44px}.rackBrand b{font-size:18px}.rackBrand small{font-size:8px}.rackMaster .installRack{display:none}.rackBtn,.rackLang{min-height:38px;padding:6px 9px;font-size:10px}.rackUnit{min-height:72px;grid-template-columns:35px 1fr auto;padding:8px 11px}.rackUnitTitle{font-size:17px}}
@media(max-width:560px){.rackMaster{grid-template-columns:1fr auto}.rackMaster .helpRack{display:none}.rackLang{grid-column:2}.rackUnit{min-height:68px}.rackUnitSub{font-size:9px}.rackLegacyHost{height:calc(100dvh - 88px);min-height:420px}}

/* Fixed 12U rack: six equal 2U faces, no overlapping and no rack-page scrolling */
.rackLauncher,.rackRail,.rackUnit{min-width:0}
.rackUnit>span:nth-child(2){min-width:0}
.rackUnitTitle,.rackUnitSub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-device-class="desktop"] .rackLauncher{height:min(760px,calc(100dvh - 118px))}
@media (pointer:coarse){.rackLauncher{height:calc(100dvh - 96px);min-height:0;max-height:none}.rackUnit{padding-top:6px;padding-bottom:6px}}
@media(max-width:560px){.rackLauncher{height:calc(100dvh - 78px);min-height:0;max-height:none;margin-top:4px;padding:4px}.rackRail{gap:3px}.rackUnit{padding:5px 9px}.rackUnitTitle{font-size:15px}.rackUnitSub{font-size:8px}.rackHandle{font-size:20px}}

/* 2026-09-20 hardware-blue rack correction */
.rackApp{background:radial-gradient(ellipse at 50% -16%,#214453 0,#0d1a21 46%,#05080a 100%)!important}
.rackMaster,.rackLauncher{
  border:2px solid #9fb7c0!important;
  background:
    repeating-linear-gradient(94deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(0deg,rgba(0,0,0,.07) 0 1px,transparent 1px 3px),
    linear-gradient(180deg,#4b8ca3 0,#39778f 12%,#28586c 58%,#1d4353 100%)!important;
  box-shadow:inset 0 0 0 2px #071015,inset 0 0 0 3px #6f909c,0 9px 22px #000c!important
}
.rackUnit{
  border:2px solid #88a8b4!important;
  background:
    radial-gradient(circle at 14% 20%,rgba(255,255,255,.08) 0 1px,transparent 2px 90px),
    radial-gradient(circle at 76% 72%,rgba(0,0,0,.12) 0 1px,transparent 2px 120px),
    repeating-linear-gradient(96deg,rgba(255,255,255,.014) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(0deg,rgba(0,0,0,.065) 0 1px,transparent 1px 3px),
    linear-gradient(180deg,#4b91aa 0,#397b94 14%,#2b6176 60%,#204b5d 100%)!important;
  box-shadow:inset 0 0 0 2px #0a171d,inset 0 0 0 3px #6d94a2,0 4px 8px #000b!important;
  grid-template-columns:46px minmax(0,1fr) auto auto!important;
  padding-left:42px!important;padding-right:42px!important
}
.rackUnit:hover,.rackUnit:focus-visible{
  border-color:#b6deeb!important;box-shadow:inset 0 0 0 2px #0a171d,inset 0 0 0 3px #8ab9c8,0 0 13px rgba(90,201,242,.38)!important
}
.rackUnit.locked{filter:saturate(.45) brightness(.66)}
.rackLamp{width:12px!important;height:12px!important;border:1px solid #d7e6eb!important;background:#152027!important;box-shadow:inset 0 0 4px #000!important}
.rackUnit:not(.locked) .rackLamp{background:#67d7ff!important;box-shadow:0 0 9px #67d7ff,inset 0 0 2px #fff!important}
.rackHandle{color:#d2d9dc!important;text-shadow:0 1px 1px #000}
.rackBtn,.rackLang{
  border:1px solid #a7b1b6!important;border-radius:1px!important;
  background:linear-gradient(90deg,#0b0e10,#242a2f 18%,#3a4248 48%,#13171a 54%,#080a0b)!important;
  box-shadow:inset 0 0 0 1px #020304,inset 0 1px 1px #fff4,0 3px 5px #0009!important
}
.rackScrew{position:absolute;width:15px;height:15px;border-radius:50%;z-index:5;
  background:radial-gradient(circle at 34% 30%,#fff 0 7%,#dfe2e3 9% 18%,#777e82 42%,#2a2f32 66%,#c8ccce 74%,#4e5559 100%);
  box-shadow:0 1px 2px #000c,inset 0 0 0 1px #2d3336;pointer-events:none}
.rackScrew:after{content:"";position:absolute;left:3px;right:3px;top:6px;height:2px;background:#3a4144;transform:rotate(-22deg);box-shadow:0 1px #eef0f0}
.rackScrew.tl{left:10px;top:9px}.rackScrew.bl{left:10px;bottom:9px}.rackScrew.tr{right:10px;top:9px}.rackScrew.br{right:10px;bottom:9px}
.rackMove{display:grid;grid-template-columns:26px 26px;gap:4px;align-items:center}
.rackMove [data-dir]{width:26px;height:30px;padding:0;border:1px solid #9ba7ac;border-radius:1px;color:#fff;
 background:linear-gradient(#30373b,#0a0d0f);box-shadow:inset 0 0 0 1px #020304;font-weight:900;cursor:pointer}
.rackMove [data-dir]:active{transform:translateY(1px)}
.rackOpenSwitch{display:flex;align-items:center;gap:6px;color:#e9edef;font-size:8px;font-weight:900;letter-spacing:.08em}
.rackOpenSwitch i{display:block;width:13px;height:29px;border-radius:3px;border:1px solid #b8bec1;
 background:linear-gradient(90deg,#d9dbda,#666d71 42%,#f1f1ee 50%,#707679);transform:rotate(-10deg);box-shadow:0 2px 3px #000}
.rackUnit.locked .rackOpenSwitch i{transform:rotate(10deg);opacity:.4}
@media(max-width:560px){
 .rackUnit{grid-template-columns:30px minmax(0,1fr) auto!important;padding-left:34px!important;padding-right:34px!important}
 .rackMove{display:none}.rackOpenSwitch b{display:none}.rackOpenSwitch i{height:24px}
 .rackScrew{width:12px;height:12px}.rackScrew:after{left:2px;right:2px;top:5px}.rackScrew.tl,.rackScrew.bl{left:8px}.rackScrew.tr,.rackScrew.br{right:8px}
}

/* 2026-09-20 proof correction: exactly four stainless screws per 2U face */
.rackUnit:before,.rackUnit:after{content:none!important;display:none!important}
.rackMove [data-dir]{display:grid;place-items:center;width:26px;height:30px;padding:0;border:1px solid #9ba7ac;border-radius:1px;color:#fff;background:linear-gradient(#30373b,#0a0d0f);box-shadow:inset 0 0 0 1px #020304;font-weight:900;cursor:pointer;user-select:none}
@media(max-width:900px) and (orientation:landscape){
  .rackShell{width:calc(100% - 6px);margin:3px auto 6px}
  .rackMaster{min-height:54px;padding:4px 7px}
  .rackLegacyHost{height:calc(100dvh - 66px);min-height:0;margin-top:4px}
  body.rackToolOpen{overflow:hidden}
}

/* 2026-09-21 reference pass: direct drag, worn rack edges, no extra OPEN/move controls */
.rackHandle,.rackMove,.rackOpenSwitch{display:none!important}
.rackUnit{grid-template-columns:minmax(0,1fr) auto!important;touch-action:none;cursor:grab!important;padding-left:42px!important;padding-right:42px!important;overflow:hidden}
.rackUnit.dragging{cursor:grabbing!important;opacity:.82;transform:scale(.995);z-index:20}
.rackUnit>span:nth-child(2){grid-column:1}
.rackLamp{grid-column:2}
.rackUnit:before{
 content:""!important;display:block!important;position:absolute!important;inset:0!important;pointer-events:none!important;z-index:3!important;
 border:0!important;border-radius:0!important;
 background:
 linear-gradient(90deg,rgba(224,232,233,.72),rgba(94,109,114,.25) 3px,transparent 8px) left/10px 100% no-repeat,
 linear-gradient(270deg,rgba(224,232,233,.65),rgba(88,104,111,.23) 3px,transparent 8px) right/10px 100% no-repeat,
 linear-gradient(180deg,rgba(229,235,236,.45),rgba(94,108,114,.20) 2px,transparent 6px) top/100% 7px no-repeat,
 linear-gradient(0deg,rgba(222,229,231,.55),rgba(73,91,99,.20) 2px,transparent 7px) bottom/100% 8px no-repeat,
 repeating-linear-gradient(104deg,transparent 0 23px,rgba(235,239,239,.25) 24px 25px,transparent 26px 58px)!important;
 box-shadow:inset 0 0 0 1px rgba(245,248,248,.18)!important;opacity:.78!important
}
.rackUnit:after{content:""!important;display:block!important;position:absolute!important;left:7px;right:7px;bottom:2px;height:2px!important;top:auto!important;border:0!important;border-radius:0!important;background:repeating-linear-gradient(90deg,#d5dcde 0 4px,#667a82 5px 9px,transparent 10px 19px)!important;opacity:.42}
.rackLang{padding:4px 8px!important;gap:7px!important}
.rackLang i{width:46px!important;height:40px!important;border-radius:50%!important;border:1px solid #e0e3e4!important;
 background:radial-gradient(circle at 38% 32%,#f4f4f1 0 18%,#b7b9b7 30%,#73797c 53%,#d9d9d5 68%,#565d60 76%,#1a1e20 100%)!important;
 box-shadow:inset 0 0 0 2px #404548,0 2px 4px #000b!important;position:relative!important
}
.rackLang i:after{content:""!important;position:absolute!important;left:16px!important;top:2px!important;width:14px!important;height:28px!important;border-radius:7px 7px 5px 5px!important;
 background:linear-gradient(90deg,#111416,#35393b 45%,#080a0b 55%,#2a2e30)!important;border:1px solid #070809!important;
 transform:rotate(-24deg)!important;transform-origin:50% 86%!important;box-shadow:2px 4px 5px #000a!important
}
.rackLang.en i:after{transform:rotate(24deg)!important}
@media(max-width:900px) and (orientation:landscape){
 .rackShell{width:calc(100% - 6px)!important;margin:3px auto 5px!important}
 .rackMaster{min-height:48px!important;height:48px!important;padding:3px 6px!important;gap:5px!important}
 .rackLogo{height:38px!important;width:50px!important}.rackBrand b{font-size:15px!important}.rackBrand small{font-size:7px!important}
 .rackBtn{min-height:32px!important;padding:4px 7px!important;font-size:9px!important}.rackLang{min-height:36px!important;padding:1px 5px!important}
 .rackLang i{width:37px!important;height:32px!important}.rackLang i:after{left:12px!important;width:12px!important;height:23px!important}
 .rackLauncher{height:calc(100dvh - 57px)!important;min-height:0!important;max-height:none!important;margin-top:3px!important;padding:3px!important}
 .rackRail{grid-template-rows:repeat(6,minmax(0,1fr))!important;gap:2px!important}
 .rackUnit{min-height:0!important;padding:3px 35px!important}
 .rackUnitTitle{font-size:clamp(11px,2.4vh,14px)!important}.rackUnitSub{font-size:7px!important;margin-top:1px!important}.rackUnitNum{font-size:7px!important}.rackU{font-size:7px!important;bottom:4px!important}
 .rackScrew{width:10px!important;height:10px!important}.rackScrew:after{top:4px!important}
}

/* 2026-09-21 photoreal rack face pass */
.rackMaster{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 14% 12%,rgba(255,255,255,.09) 0 .7px,transparent 1.2px),
    radial-gradient(circle at 72% 78%,rgba(0,0,0,.17) 0 .7px,transparent 1.2px),
    repeating-linear-gradient(97deg,rgba(255,255,255,.014) 0 1px,transparent 1px 4px),
    linear-gradient(180deg,#2e729b 0,#205f87 13%,#184c6e 57%,#123a54 100%)!important;
  background-size:61px 53px,79px 73px,auto,auto!important
}
.rackMaster:before{content:"";position:absolute;inset:0;pointer-events:none;background:
 linear-gradient(90deg,rgba(231,237,238,.52),rgba(103,115,120,.18) 3px,transparent 9px) left/10px 100% no-repeat,
 linear-gradient(270deg,rgba(231,237,238,.44),rgba(103,115,120,.15) 3px,transparent 9px) right/10px 100% no-repeat,
 linear-gradient(180deg,rgba(239,242,243,.35),transparent 6px) top/100% 7px no-repeat,
 linear-gradient(0deg,rgba(231,236,238,.38),transparent 6px) bottom/100% 7px no-repeat,
 repeating-linear-gradient(111deg,transparent 0 29px,rgba(231,235,235,.15) 30px 31px,transparent 32px 73px);opacity:.84}
.rackMaster>*{position:relative;z-index:2}
.audioRackShell .rackMaster{grid-template-columns:minmax(250px,1fr) auto auto auto auto auto auto;min-height:96px;padding:10px 18px 10px 22px}
.rackTagline{font-size:8px;line-height:1.45;letter-spacing:.24em;color:#d8e6eb;font-weight:900}
.masterPilot{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 36% 28%,#fff1ec 0 8%,#ff6759 20%,#d5160f 56%,#560400 100%);border:1px solid #e4d5d2;box-shadow:0 0 12px #ff493e}
.rackLogo{object-fit:contain!important;background:linear-gradient(#8f979b,#3c4448)!important;filter:grayscale(1) contrast(1.25) brightness(1.22);mix-blend-mode:screen}
.audioRackShell .rackLauncher{background:linear-gradient(#0f151a,#05080a)!important;border-color:#5d6870!important}
.audioRackShell .rackRail{gap:4px}
.audioRackShell .rackUnit{
  display:grid!important;grid-template-columns:48px minmax(145px,240px) minmax(0,1fr) 42px!important;align-items:center!important;gap:13px!important;
  min-height:0!important;padding:8px 24px 8px 30px!important;
  border:1px solid #6e7d85!important;border-radius:2px!important;
  background:
   radial-gradient(circle at 13% 14%,rgba(255,255,255,.08) 0 .6px,transparent 1px),
   radial-gradient(circle at 73% 76%,rgba(0,0,0,.15) 0 .7px,transparent 1.2px),
   repeating-linear-gradient(97deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px),
   linear-gradient(180deg,#2b6f98 0,#205e85 14%,#194e70 58%,#133e59 100%)!important;
  background-size:57px 51px,83px 79px,auto,auto!important;
  box-shadow:inset 0 0 0 2px #071117,inset 0 0 0 3px rgba(218,232,237,.22),0 4px 8px #000a!important
}
.audioRackShell .rackUnit:before{opacity:.92!important}
.audioRackShell .rackUnitNum{display:grid!important;place-items:center!important;width:40px;height:40px;color:#16415a!important;background:linear-gradient(#eef2f3,#b8c1c4)!important;border:1px solid #f7f8f8!important;box-shadow:inset 0 0 0 1px #77858c,0 2px 4px #0007!important;font-size:24px!important;letter-spacing:0!important;font-weight:900!important}
.rackUnitText{min-width:0;display:block}.audioRackShell .rackUnitTitle{font-size:clamp(20px,2.2vw,29px)!important;text-transform:none!important;font-style:italic;letter-spacing:-.025em!important;line-height:1!important}.audioRackShell .rackUnitSub{font-size:8px!important;letter-spacing:.18em!important;color:#d1e0e6!important;margin-top:5px!important}
.rackPreview{min-width:0;display:flex;align-items:center;justify-content:space-evenly;gap:13px;height:74px}
.rackPreview i{display:inline-block;position:relative;font-style:normal;flex:0 0 auto}
.rackPreview .pilot{width:22px;height:22px;border-radius:50%;border:1px solid #ddd}.rackPreview .pilot.red{background:radial-gradient(circle at 36% 28%,#fff 0 7%,#ff7668 17%,#e11d15 52%,#600400 100%);box-shadow:0 0 11px #ff3126}.rackPreview .pilot.tiny{width:10px;height:10px}
.rackPreview .toggle{width:30px;height:36px;border-radius:50%;background:radial-gradient(circle,#bfc2c1 0 31%,#6d7376 52%,#d7d8d5 67%,#4f5659 79%);box-shadow:0 2px 4px #000b}.rackPreview .toggle:after{content:"";position:absolute;left:9px;top:2px;width:11px;height:25px;border-radius:7px;background:linear-gradient(90deg,#0d1011,#35393b 45%,#07090a 55%,#25292b);transform:rotate(-19deg);transform-origin:50% 88%;box-shadow:2px 3px 4px #000b}
.rackPreview .selector{width:58px;height:58px;border-radius:50%;background:radial-gradient(circle,#1f2326 0 28%,#090b0d 30% 46%,#30363a 48% 57%,#0b0d0f 60%);box-shadow:0 5px 8px #000b}.rackPreview .selector:after{content:"";position:absolute;left:22px;top:4px;width:15px;height:45px;border-radius:7px;background:linear-gradient(90deg,#141719,#373b3e 46%,#08090a 55%,#292d30);transform:rotate(19deg);transform-origin:50% 78%;box-shadow:2px 3px 4px #000b}.rackPreview .smallSelector{transform:scale(.8)}
.rackPreview .knob{width:54px;height:54px;border-radius:50%;border:4px solid #12171a;box-shadow:0 5px 8px #000a,inset 0 0 0 2px #9da7ab}.rackPreview .knob.blue{background:radial-gradient(circle at 39% 33%,#4cc5ff 0 7%,#1798db 22%,#0865a2 66%,#073b61 100%)}.rackPreview .knob:after{content:"";position:absolute;left:24px;top:6px;width:3px;height:19px;background:#edf4f6;transform:rotate(21deg);transform-origin:50% 100%;box-shadow:0 0 2px #000}.rackPreview .knob.small{width:46px;height:46px}.rackPreview .knob.small:after{left:20px;height:16px}
.rackPreview .display{min-width:104px;padding:8px 11px;border:2px solid #75838a;background:linear-gradient(#111a20,#061017);box-shadow:inset 0 0 12px #000,0 2px 4px #0008;color:#d8e9f2;font:700 12px ui-monospace,SFMono-Regular,Consolas,monospace;text-align:right;line-height:1.35}.rackPreview .display b{font-size:16px}.rackPreview .smallDisplay{min-width:72px}.rackPreview .tuner{min-width:115px;color:#e6eef2}
.rackPreview .miniGraph{width:min(38vw,300px);height:64px;border:2px solid #74828a;background:#071017;box-shadow:inset 0 0 12px #000;overflow:hidden}.rackPreview .miniGraph.bars{background:
 linear-gradient(90deg,transparent 7%,#258ed1 7% 10%,transparent 10% 14%,#299fe7 14% 18%,transparent 18% 22%,#2ba9f4 22% 26%,transparent 26% 31%,#258ed1 31% 34%,transparent 34% 39%,#1b76b2 39% 42%,transparent 42% 48%,#17689c 48% 51%,transparent 51% 58%,#145b89 58% 61%,transparent 61% 69%,#124d74 69% 72%,transparent 72%),#071017}
.rackPreview .miniGraph.impulse:before{content:"";position:absolute;left:10px;right:10px;top:31px;height:1px;background:#2f9ce2;box-shadow:25px -22px 0 #48b7ff,31px 16px 0 #359ddc,37px -10px 0 #2c8bc6,43px 7px 0 #2479ac}
.rackPreview .vuMini{width:145px;height:68px;border:5px solid #121619;background:linear-gradient(#eadca7,#cbbf89);box-shadow:inset 0 0 12px #7e7043,0 2px 5px #0008}.rackPreview .vuMini:before{content:"20 10 7 5 3 2 1 0 1 2 3";position:absolute;left:8px;right:8px;top:8px;color:#241b0d;font:700 8px Arial;letter-spacing:1px}.rackPreview .vuMini b{position:absolute;width:2px;height:55px;background:#241b0d;bottom:-9px;left:48%;transform-origin:bottom;transform:rotate(-43deg)}
.rackPreview .push{width:44px;height:44px;border-radius:50%;border:5px solid #4c3d37;box-shadow:0 4px 7px #0008}.rackPreview .redPush{background:radial-gradient(circle at 35% 28%,#ff6d67,#c31814 45%,#580100 78%)}
.rackGrip{height:70px;width:34px;border:1px solid #151b1f;background:linear-gradient(#245a78,#102d42);display:grid!important;place-items:center!important;color:#dce6ea;font-size:12px;box-shadow:inset 0 0 0 2px #08141a}.rackGrip b{font-size:18px}.rackGrip i{font-style:normal;font-size:11px}
.audioRackShell .rackUnit.locked{opacity:.7!important;filter:saturate(.7) brightness(.75)!important}
@media(max-width:850px){
 .audioRackShell .rackMaster{grid-template-columns:minmax(140px,1fr) auto auto!important;min-height:70px!important}.rackTagline,.masterPilot,.audioRackShell .helpRack{display:none!important}
 .audioRackShell .rackUnit{grid-template-columns:34px minmax(92px,150px) minmax(0,1fr) 30px!important;gap:6px!important;padding:5px 16px!important}
 .audioRackShell .rackUnitNum{width:30px;height:30px;font-size:18px!important}.audioRackShell .rackUnitTitle{font-size:15px!important}.audioRackShell .rackUnitSub{font-size:6px!important}
 .rackPreview{height:55px;gap:7px}.rackPreview .pilot{width:15px;height:15px}.rackPreview .toggle{width:22px;height:28px}.rackPreview .toggle:after{left:7px;width:8px;height:19px}
 .rackPreview .selector{width:42px;height:42px}.rackPreview .selector:after{left:16px;width:11px;height:32px}.rackPreview .knob{width:40px;height:40px;border-width:3px}.rackPreview .knob:after{left:18px;height:14px}.rackPreview .knob.small{width:36px;height:36px}.rackPreview .knob.small:after{left:16px;height:12px}
 .rackPreview .display{min-width:76px;padding:4px 6px;font-size:9px}.rackPreview .display b{font-size:11px}.rackPreview .miniGraph{height:47px;max-width:190px}.rackPreview .vuMini{width:100px;height:50px;border-width:4px}.rackPreview .vuMini b{height:39px}.rackPreview .push{width:34px;height:34px}.rackGrip{width:27px;height:54px}
}
@media(max-width:560px){
 .audioRackShell .rackMaster{grid-template-columns:minmax(125px,1fr) auto!important}.audioRackShell .installRack{display:none!important}
 .audioRackShell .rackUnit{grid-template-columns:30px 92px minmax(0,1fr) 26px!important;padding:4px 12px!important}.audioRackShell .rackUnitTitle{font-size:13px!important}
 .rackPreview{justify-content:flex-start;overflow:hidden}.rackPreview .miniGraph{width:130px}.rackPreview .selector,.rackPreview .knob.small:nth-of-type(n+4),.rackPreview .display.smallDisplay{display:none}.rackGrip{height:48px}
}

/* 2026-09-21 realistic hardware master pass */
.rackShell{position:relative;padding:6px;background:linear-gradient(90deg,#6b7073,#20262a 1.1%,#080b0d 2.2%,#080b0d 97.8%,#20262a 98.9%,#6b7073);border:1px solid #858b8e;box-shadow:0 24px 60px #000b,inset 0 0 0 2px #040506}
.rackMaster{position:relative;overflow:hidden;min-height:96px!important;padding:12px 54px!important;border:1px solid #7e8a91!important;background:
radial-gradient(circle at 16% 18%,rgba(255,255,255,.08) 0 1px,transparent 1.7px),
radial-gradient(circle at 75% 65%,rgba(25,19,12,.28) 0 1px,transparent 1.7px),
repeating-linear-gradient(97deg,rgba(255,255,255,.016) 0 1px,transparent 1px 5px),
linear-gradient(180deg,#2d719d 0,#255f88 16%,#1e557a 58%,#17435f 100%)!important;
box-shadow:inset 0 0 0 2px #07131a,inset 0 0 0 3px rgba(220,230,235,.34),0 4px 8px #000a!important}
.rackMaster:after{content:"";position:absolute;inset:0;pointer-events:none;background:
linear-gradient(90deg,rgba(241,235,220,.58),transparent 8px) left/10px 100% no-repeat,
linear-gradient(270deg,rgba(241,235,220,.48),transparent 8px) right/10px 100% no-repeat,
linear-gradient(180deg,rgba(235,227,210,.48),transparent 5px) top/100% 7px no-repeat,
linear-gradient(0deg,rgba(235,227,210,.5),transparent 6px) bottom/100% 8px no-repeat,
repeating-linear-gradient(113deg,transparent 0 31px,rgba(232,222,199,.12) 32px 33px,transparent 34px 74px);opacity:.7}
.rackBrand{position:relative;z-index:4}.rackLogo{width:128px!important;height:64px!important;object-fit:contain!important;padding:6px!important;border:2px solid #a8aaa7!important;background:linear-gradient(#90989a,#4e5557 48%,#252a2d)!important;filter:grayscale(1) contrast(1.45) brightness(1.38)!important;mix-blend-mode:screen!important;box-shadow:inset 0 0 0 2px #292f31,inset 0 0 0 3px #b1b2ad,0 4px 8px #000a!important}
.rackBrand b{font-size:28px!important;font-style:italic!important;text-shadow:0 2px 0 #12364d,0 3px 7px #000}.rackBrand small{letter-spacing:.28em!important;color:#d5e0e5!important}
.rackBtn,.rackLang{position:relative;z-index:4}
.rackLauncher{position:relative;overflow:hidden!important;border:1px solid #77848c!important;background:linear-gradient(90deg,#30363a,#0b0f12 3%,#070a0c 97%,#30363a)!important;box-shadow:inset 0 0 0 2px #020304,0 8px 18px #000b!important;padding:5px!important}
.rackUnit{border:1px solid #79868e!important;background:
radial-gradient(circle at 15% 18%,rgba(255,255,255,.08) 0 1px,transparent 1.7px),
radial-gradient(circle at 78% 66%,rgba(28,20,13,.3) 0 1px,transparent 1.7px),
repeating-linear-gradient(97deg,rgba(255,255,255,.016) 0 1px,transparent 1px 5px),
linear-gradient(180deg,#2d719d 0,#245f89 15%,#1f557b 58%,#194764 100%)!important;
box-shadow:inset 0 0 0 2px #07131a,inset 0 0 0 3px rgba(212,226,233,.34),0 3px 6px #000a!important}
.rackUnitTitle{font-size:clamp(18px,2.1vw,27px)!important;font-style:italic!important;text-shadow:0 2px 0 #16364b,0 3px 6px #000}.rackUnitSub{color:#d0dde3!important;letter-spacing:.16em!important}
.rackUnitNum{display:inline-grid!important;place-items:center!important;width:34px;height:34px!important;margin-right:10px!important;background:linear-gradient(#e3e6e7,#b7bec1)!important;border:1px solid #edf0ef!important;box-shadow:inset 0 0 0 1px #707b81,0 2px 3px #0007!important;color:#17405c!important;font-size:16px!important;font-weight:900!important}
.rackLamp{width:18px!important;height:18px!important;background:radial-gradient(circle at 35% 28%,#dcffd6 0 8%,#62ff35 20%,#1a9b08 58%,#0b3507 100%)!important;border:1px solid #98a39f!important;box-shadow:0 0 12px #41ff22,0 0 0 2px #39413f!important}
.rackUnit.locked .rackLamp{background:radial-gradient(circle at 36% 28%,#d8d8d8 0 6%,#35383a 18%,#0e1011 68%)!important;box-shadow:0 0 0 2px #3a4145!important}
.rackScrew{width:16px!important;height:16px!important;background:radial-gradient(circle at 34% 29%,#f8f8f6 0 8%,#c8c9c6 13%,#71777a 43%,#212629 66%,#c9cccd 76%,#4c5357 100%)!important}
.rackScrew:after{left:3px!important;right:3px!important;top:7px!important;background:#272d30!important;transform:rotate(-25deg)!important;box-shadow:0 1px #e6e8e8!important}
.rackUnit:before{opacity:.72!important;background:
linear-gradient(90deg,rgba(244,235,216,.62),transparent 8px) left/10px 100% no-repeat,
linear-gradient(270deg,rgba(244,235,216,.52),transparent 8px) right/10px 100% no-repeat,
linear-gradient(180deg,rgba(235,227,210,.48),transparent 5px) top/100% 7px no-repeat,
linear-gradient(0deg,rgba(235,227,210,.52),transparent 6px) bottom/100% 8px no-repeat,
repeating-linear-gradient(113deg,transparent 0 29px,rgba(234,224,203,.12) 30px 31px,transparent 32px 70px)!important}
@media(max-width:760px){
 .rackShell{padding:3px!important;border-left:0;border-right:0}.rackMaster{min-height:76px!important;padding:6px 12px 6px 34px!important}
 .rackLogo{width:94px!important;height:50px!important}.rackBrand b{font-size:18px!important}.rackBrand small{font-size:7px!important}
 .rackLauncher{height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important}
 .rackRail{grid-template-rows:none!important;grid-auto-rows:minmax(86px,auto)!important;height:auto!important}
 .rackUnit{min-height:86px!important;padding:8px 36px!important}.rackUnitTitle{font-size:17px!important}.rackUnitSub{font-size:7px!important}
}


/* D020/D019 owner review — keep AudioTools440Pro module labels complete. */
.audioRackShell .rackUnitTitle,
.audioRackShell .rackUnitSub{
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  max-width:none!important;
}
.audioRackShell .rackUnitTitle{
  text-transform:none!important;
  overflow-wrap:normal!important;
}
.audioRackShell .rackUnitSub{
  overflow-wrap:normal!important;
}


/* Owner rule 2026-09-26 — powered module separator glow.
   AudioTools440Pro = blue. Other product colors are intentionally not implemented here yet. */
.audioRackShell .rackUnit.rackPowerOn::after{
  background:repeating-linear-gradient(90deg,
    rgba(220,247,255,.98) 0 4px,
    rgba(85,201,241,.98) 5px 9px,
    transparent 10px 19px)!important;
  opacity:1!important;
  box-shadow:
    0 0 5px rgba(85,201,241,.95),
    0 0 12px rgba(85,201,241,.78),
    0 3px 16px rgba(37,155,215,.48)!important;
}
.audioRackShell .rackUnit.rackPowerOn{
  --rack-accent:#55c9f1;
  --rack-accent-rgb:85,201,241;
}

/* =========================================================
   OFFICIAL RACK ART v1 — wired 2026-09-28
   Source: shared/design-system/rack/v1/assets/
   Artwork keeps its native proportions; live UI sits above it.
   ========================================================= */
.rackRail .rackUnit{background-color:#153e58!important;background-position:center!important;background-repeat:no-repeat!important;background-size:100% auto!important}
.rackRail .rackUnit:nth-child(1){background-image:url("/shared/design-system/rack/v1/assets/2U-cuerpo/2U-BODY-RACK-TOOLS-01.png")!important}
.rackRail .rackUnit:nth-child(2){background-image:url("/shared/design-system/rack/v1/assets/2U-cuerpo/2U-BODY-RACK-TOOLS-02.png")!important}
.rackRail .rackUnit:nth-child(3){background-image:url("/shared/design-system/rack/v1/assets/2U-cuerpo/2U-BODY-RACK-TOOLS-03.png")!important}
.rackRail .rackUnit:nth-child(4){background-image:url("/shared/design-system/rack/v1/assets/2U-cuerpo/2U-BODY-RACK-TOOLS-04.png")!important}
.rackRail .rackUnit:nth-child(5){background-image:url("/shared/design-system/rack/v1/assets/2U-cuerpo/2U-BODY-RACK-TOOLS-05.png")!important}
.rackRail .rackUnit:nth-child(6){background-image:url("/shared/design-system/rack/v1/assets/2U-cuerpo/2U-BODY-RACK-TOOLS-06.png")!important}
/* Screws/handles are painted in the official 2U art; do not double-render synthetic screws. */
.rackRail .rackUnit .rackScrew{display:none!important}
.rackRail .rackUnit:before,.rackRail .rackUnit:after{content:none!important;display:none!important}

/* Official 1U base under every rack window. */
.rackShell:after{content:"";display:block;width:100%;aspect-ratio:1086/160;margin-top:4px;background:url("/shared/design-system/rack/v1/assets/base/BASE-FOOTER-RACK-TOOLS.png") center/contain no-repeat;pointer-events:none}

/* Scroll equipment: no rack handles. TOP and BOTTOM keep their native aspect;
   the MIDDLE tile repeats vertically without seam. */
body[data-rack-key="stage-plot"] .rackLegacyHost,
body[data-rack-key="match-tool"] .rackLegacyHost,
body[data-rack-key="lighting-tools"][data-rack-module="match"] .rackLegacyHost,
body[data-rack-key="video-tools"] #mapping{
  border:0!important;
  box-shadow:none!important;
  background-color:#17212a!important;
  background-image:
    url("/shared/design-system/rack/v1/assets/scroll/SCROLL-PANEL-TOP.png"),
    url("/shared/design-system/rack/v1/assets/scroll/SCROLL-PANEL-BOTTOM.png"),
    url("/shared/design-system/rack/v1/assets/scroll/SCROLL-PANEL-MIDDLE-TILE.png")!important;
  background-position:top center,bottom center,center top!important;
  background-size:100% auto,100% auto,100% auto!important;
  background-repeat:no-repeat,no-repeat,repeat-y!important;
}
body[data-rack-key="stage-plot"] .rackLegacyHost,
body[data-rack-key="match-tool"] .rackLegacyHost,
body[data-rack-key="lighting-tools"][data-rack-module="match"] .rackLegacyHost{padding:4.8% 4.2%!important;height:auto!important;min-height:calc(100dvh - 110px)!important}
body[data-rack-key="stage-plot"] .rackLegacyHost iframe,
body[data-rack-key="match-tool"] .rackLegacyHost iframe,
body[data-rack-key="lighting-tools"][data-rack-module="match"] .rackLegacyHost iframe{min-height:calc(100dvh - 210px);background:transparent!important}

/* Pixel Mapping is a native long workspace, so its own live content rides directly on the scroll panel. */
body[data-rack-key="video-tools"] #mapping{padding:5.2% 4.5%!important}

/* Canonical 9-slice screen frame for reusable live screens. */
.innerBox,.scopeDeck,.previewStage,.canvasWrap,.countPreview{
  border-style:solid!important;
  border-width:28px!important;
  border-image:url("/shared/design-system/rack/v1/assets/ventana/VENTANA-PANTALLA-9SLICE.png") 56 fill / 28px round!important;
}