/* Paez440PRO Hardware Blue — reference language: vintage blue rack processors
   Worn powder-coat blue, stainless mounting screws, black hardware controls, cream meters. */
:root{
  --hw-blue-0:#122631;--hw-blue-1:#285469;--hw-blue-2:#397792;--hw-blue-3:#4a8da4;
  --hw-edge:#93b4c0;--hw-silver:#d1d5d7;--hw-dark:#0b1115;--hw-ink:#e9eef0;
  --hw-accent:#56c9f2;--hw-cream:#e7d79b;
}
.paezHardware,
.paezHardware body{background:
  radial-gradient(ellipse at 48% -18%,#214453 0,#0e1b22 46%,#05080a 100%)!important}
.paezHardware body:before{opacity:.23!important;background-image:
  repeating-linear-gradient(92deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px),
  repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 5px)!important}
.paezHardware .tool-top,.paezHardware .topHeader,.paezHardware .vintageBox,
.paezHardware .panel,.paezHardware .vintagePanel,.paezHardware .innerBox,
.paezHardware .metal,.paezHardware .control,.paezHardware .proc,.paezHardware .graphs,
.paezHardware .meters,.paezHardware .tracks,.paezHardware .previewRack,.paezHardware .controlRack{
  border-radius:1px!important;
  border:2px solid var(--hw-edge)!important;
  background:
    radial-gradient(circle at 14% 16%,rgba(255,255,255,.08) 0 1px,transparent 2px 100px),
    radial-gradient(circle at 72% 68%,rgba(0,0,0,.10) 0 1px,transparent 2px 120px),
    repeating-linear-gradient(94deg,rgba(255,255,255,.016) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(0deg,rgba(0,0,0,.055) 0 1px,transparent 1px 3px),
    linear-gradient(180deg,var(--hw-blue-3) 0,var(--hw-blue-2) 10%,var(--hw-blue-1) 58%,#204656 100%)!important;
  box-shadow:inset 0 0 0 2px #071015,inset 0 0 0 3px rgba(215,231,236,.34),
             inset 0 10px 22px rgba(255,255,255,.035),0 7px 16px #000b!important;
  color:var(--hw-ink)!important;
}
.paezHardware .panel:after,.paezHardware .vintagePanel:after{border-color:rgba(235,244,247,.13)!important}
.paezHardware .readout,.paezHardware input,.paezHardware select,.paezHardware textarea{
  border-radius:1px!important;border:1px solid #90a7b0!important;
  background:linear-gradient(#10171b,#070b0e)!important;color:#f6f7f8!important;
  box-shadow:inset 0 2px 7px #000b!important
}
.paezHardware .btn,.paezHardware .metal-btn,.paezHardware .metalBtn,
.paezHardware .control button,.paezHardware .vbtn,.paezHardware .transportBtn,
.paezHardware .wideBtn,.paezHardware .bigAction,.paezHardware .patternGrid button,
.paezHardware .modeButtons button,.paezHardware .quickTimes button,
.paezHardware .zoomControls button,.paezHardware .panelTitle button,.paezHardware .buttonRow button{
  border-radius:1px!important;border:1px solid #9aa4aa!important;color:#f4f4f2!important;
  background:
    linear-gradient(90deg,#0b0e10,#1a1e21 16%,#343b40 48%,#111518 54%,#060809 100%)!important;
  box-shadow:inset 0 0 0 1px #020304,inset 0 1px 1px #fff4,0 2px 4px #0009!important;
  text-shadow:0 1px 1px #000!important;font-weight:900!important
}
.paezHardware .btn.primary,.paezHardware button.primary,.paezHardware .tab.active{
  border-color:#8edaf3!important;box-shadow:inset 0 0 0 1px #020304,0 0 7px rgba(86,201,242,.7)!important
}
.paezHardware input[type=range]{accent-color:#72d7f7!important}
.paezHardware .kpi,.paezHardware .summaryGrid>div{
  border-radius:1px!important;border:1px solid #a9a072!important;
  background:linear-gradient(#eadfab,#c9ba7d)!important;color:#1c2427!important;text-shadow:none!important;
  box-shadow:inset 0 0 0 2px #706940,0 3px 6px #0008!important
}
.paezHardware .kpi .muted,.paezHardware .kpi span,.paezHardware .summaryGrid span{color:#3a403f!important}
.paezHardware .vu,.paezHardware .meter{
  border:2px solid #283239!important;background:#e8d9a1!important;box-shadow:inset 0 0 10px #8d7e4a,0 2px 4px #0009!important
}
.paezHardware .lever,.paezHardware .langAssembly,.paezHardware .langSwitch{
  border-radius:1px!important;background:linear-gradient(#172026,#080c0f)!important;border:1px solid #92a0a7!important
}
.paezHardware .lever:before,.paezHardware .langSwitch i{
  background:linear-gradient(90deg,#d6d7d6,#737a7e 44%,#f0f0ee 52%,#70767a)!important
}
.paezHardware .toolHeading small,.paezHardware .panelTitle em,.paezHardware .subhead{color:#c5f0ff!important}
.paezHardware .statePill,.paezHardware .status-pill{border-radius:1px!important;background:#11191e!important;border-color:#83939b!important}
.paezHardware canvas.scope,.paezHardware .canvasWrap,.paezHardware .previewStage,.paezHardware .countPreview{
  border-radius:1px!important;border:2px solid #6f858f!important;background:#05090b!important;box-shadow:inset 0 0 0 2px #010304!important
}
.paezHardware .tabs{display:none!important}
.paezHardware .landscape,.paezHardware .rotateGate{display:none!important}
.paezHardware .rackBack{display:inline-flex;align-items:center;justify-content:center}
@media(max-width:760px){
 .paezHardware .tool-shell,.paezHardware .toolShell{width:calc(100% - 6px)!important;margin:3px auto 10px!important;padding-left:0!important;padding-right:0!important}
 .paezHardware .tool-top,.paezHardware .topHeader{min-height:62px!important;height:auto!important;padding:6px 8px!important}
 .paezHardware .panel,.paezHardware .vintagePanel{margin-top:5px!important;padding:16px 12px!important}
}
@media(max-width:900px) and (orientation:landscape){
 .paezHardware .tool-top,.paezHardware .topHeader{min-height:54px!important;padding:4px 7px!important}
 .paezHardware .tool-logo,.paezHardware .toolLogo{height:42px!important;width:auto!important;max-width:64px!important}
}

/* Embedded tool module: outer rack owns the master header */
.rackEmbedded .tool-top,.rackEmbedded .topHeader,.rackEmbedded .tabs,.rackEmbedded .section-strip,.rackEmbedded .footer-tool{display:none!important}
.rackEmbedded .tool-shell,.rackEmbedded .toolShell{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
.rackEmbedded .panel,.rackEmbedded .vintagePanel{margin:0!important;min-height:calc(100dvh - 8px);border-width:0!important;box-shadow:none!important}
.rackEmbedded .panel:before,.rackEmbedded .panel:after{display:none!important}
@media(max-width:900px) and (orientation:landscape){
 .rackEmbedded .panel,.rackEmbedded .vintagePanel{padding:12px 14px!important;min-height:100dvh!important}
 .rackEmbedded .grid2,.rackEmbedded .grid3{gap:8px!important}
 .rackEmbedded .control{padding:8px!important}
 .rackEmbedded h2{font-size:clamp(18px,3vw,28px)!important;margin-bottom:8px!important}
}

/* 2026-09-21 Yamaha-reference hardware controls */
.paezHardware .tool-top,.paezHardware .topHeader,.paezHardware .metal,.paezHardware .panel,.paezHardware .vintagePanel,.paezHardware .control{
  position:relative;overflow:hidden;
}
.paezHardware .tool-top:after,.paezHardware .topHeader:after,.paezHardware .metal:after,.paezHardware .panel:before,.paezHardware .vintagePanel:before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    linear-gradient(90deg,rgba(229,235,236,.58),rgba(92,108,114,.18) 3px,transparent 8px) left/9px 100% no-repeat,
    linear-gradient(270deg,rgba(218,226,229,.52),rgba(79,99,107,.18) 3px,transparent 8px) right/9px 100% no-repeat,
    linear-gradient(180deg,rgba(239,242,242,.32),rgba(95,111,117,.14) 2px,transparent 6px) top/100% 7px no-repeat,
    linear-gradient(0deg,rgba(226,232,233,.42),rgba(78,95,102,.18) 2px,transparent 7px) bottom/100% 8px no-repeat,
    repeating-linear-gradient(111deg,transparent 0 29px,rgba(239,243,243,.16) 30px 31px,transparent 32px 71px);
  opacity:.72
}
.paezHardware .lang-switch,.paezHardware .lang,.paezHardware .langAssembly{
  min-height:48px!important;border:0!important;background:transparent!important;box-shadow:none!important;display:flex!important;align-items:center!important;gap:7px!important;
}
.paezHardware .lang-switch .lang-lamp{display:none!important}
.paezHardware .lang-switch .lever,.paezHardware .lang i,.paezHardware .langAssembly .lever{
  width:50px!important;height:44px!important;min-width:50px!important;border-radius:50%!important;border:1px solid #e4e6e6!important;position:relative!important;
  background:radial-gradient(circle at 38% 32%,#f5f5f2 0 17%,#b9bbb9 28%,#747a7d 52%,#dadad6 67%,#575e61 77%,#181c1e 100%)!important;
  box-shadow:inset 0 0 0 2px #414649,0 3px 5px #000b!important;cursor:pointer!important
}
.paezHardware .lang-switch .lever:before,.paezHardware .lang-switch .lever:after,.paezHardware .lang i:before,.paezHardware .lang i:after,.paezHardware .langAssembly .lever:before{
  content:""!important;position:absolute!important;left:17px!important;top:2px!important;width:14px!important;height:31px!important;border-radius:8px 8px 5px 5px!important;
  background:linear-gradient(90deg,#0d1011,#303436 44%,#07090a 56%,#282c2e)!important;border:1px solid #050607!important;
  transform:rotate(-24deg)!important;transform-origin:50% 88%!important;box-shadow:2px 4px 5px #000a!important
}
.paezHardware .lang-switch .lever.en:before,.paezHardware .langAssembly .lever.en:before,.paezHardware .lang.en i:after{transform:rotate(24deg)!important}
.paezHardware .lang i:before{display:none!important}
.paezHardware .pilotLamp,.paezHardware .status i,.paezHardware .langLamp,.paezHardware .lang-lamp{
  display:inline-block;width:17px!important;height:17px!important;border-radius:50%!important;border:2px solid #bfc5c7!important;
  background:radial-gradient(circle at 38% 34%,#ffdbcc 0 7%,#f44a32 16%,#b71912 53%,#4a0907 72%,#160202 100%)!important;
  box-shadow:inset 0 0 0 1px #4b5357,0 0 7px #f43b28aa,0 2px 3px #000a!important
}
.paezHardware .pilotLamp.off,.paezHardware .status i:not(.ready){filter:saturate(.35) brightness(.45);box-shadow:inset 0 0 0 1px #4b5357,0 2px 3px #000a!important}
.selectorKnob,.vintageKnob{
  --ang:-35deg;position:relative;display:grid;place-items:center;width:78px;height:78px;border:0;background:transparent;color:#fff;cursor:ns-resize;touch-action:none
}
.selectorKnob:before,.vintageKnob:before{
  content:"";position:absolute;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 48% 43%,#35393b 0 18%,#171a1c 20% 43%,#050708 48% 57%,#24282a 60% 75%,#080a0b 78% 100%);
  box-shadow:0 5px 7px #000b,inset 0 0 0 1px #545b5f
}
.selectorKnob:after{
  content:"";position:absolute;width:18px;height:52px;border-radius:8px 8px 4px 4px;background:linear-gradient(90deg,#111416,#383d3f 44%,#07090a 54%,#292d2f);
  box-shadow:2px 4px 5px #000a;transform:rotate(var(--ang));transform-origin:50% 78%
}
.vintageKnob:after{
  content:"";position:absolute;width:5px;height:25px;background:#f0eee4;top:13px;left:36px;border-radius:3px;transform:rotate(var(--ang));transform-origin:50% 26px;box-shadow:0 1px 2px #000
}
.selectorScale{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin-top:3px;font-size:9px;font-weight:900;color:#f1f2ed}
.selectorScale span.active{color:#fff;text-shadow:0 0 5px #fff}
.knobCluster{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.knobReadout{font:900 16px ui-monospace,SFMono-Regular,Consolas,monospace;background:#080d10;border:1px solid #9bb0b8;padding:8px 10px;min-width:92px;text-align:center;box-shadow:inset 0 2px 5px #000}
.hardwareToggle{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.hardwareToggle input{position:absolute;opacity:0;pointer-events:none}
.hardwareToggle .toggleBody{position:relative;width:42px;height:38px;border-radius:50%;border:1px solid #ddd;background:radial-gradient(circle,#bfc1c0 0 30%,#6d7477 50%,#d7d8d5 67%,#4f5558 78%);box-shadow:0 2px 4px #000b}
.hardwareToggle .toggleBody:after{content:"";position:absolute;left:14px;top:2px;width:13px;height:27px;border-radius:7px;background:linear-gradient(90deg,#0c0f10,#34383a 45%,#07090a 55%,#25292b);transform:rotate(-21deg);transform-origin:50% 88%;box-shadow:2px 3px 4px #000b}
.hardwareToggle input:checked+.toggleBody:after{transform:rotate(21deg)}
.hardwareToggle input:checked~.pilotLamp{filter:none}
@media(max-width:900px) and (orientation:landscape){
 .paezHardware .panel,.paezHardware .vintagePanel,.paezHardware .control{min-width:0!important}
 .paezHardware .grid2,.paezHardware .grid3,.paezHardware .grid4{gap:7px!important}
 .paezHardware .lang-switch,.paezHardware .lang,.paezHardware .langAssembly{min-height:38px!important}
 .paezHardware .lang-switch .lever,.paezHardware .lang i,.paezHardware .langAssembly .lever{width:39px!important;height:34px!important;min-width:39px!important}
 .paezHardware .lang-switch .lever:before,.paezHardware .lang-switch .lever:after,.paezHardware .lang i:after,.paezHardware .langAssembly .lever:before{left:13px!important;width:11px!important;height:24px!important}
}