/* HUD buttons (mute, nudge, pause) on the cabinet. */
#btns{display:flex;gap:12px;}
/* botão de gabinete: vidro escuro, aro cromado e ícone na cor neon da mesa (os dourados pareciam brinquedo) */
.mb{width:44px;height:44px;border-radius:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;padding:0;border:2px solid transparent;
  color:var(--neon);font-family:var(--f-plate);font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;line-height:1;
  text-shadow:0 0 6px var(--neon);transition:transform .22s cubic-bezier(.3,1.7,.5,1),box-shadow .15s;
  background:radial-gradient(circle at 38% 30%,#1c2638,#0a0f1a 62%,#03050a) padding-box,var(--chrome) border-box;
  box-shadow:0 0 0 1px #000,0 6px 14px rgba(0,0,0,.6),inset 0 0 10px color-mix(in srgb,var(--neon) 22%,transparent),0 0 12px var(--neon-soft);}
.mb:hover{box-shadow:0 0 0 1px #000,0 6px 14px rgba(0,0,0,.6),inset 0 0 14px color-mix(in srgb,var(--neon) 38%,transparent),0 0 18px var(--neon-soft);}
.mb:active{transform:scale(.92);transition-duration:.05s;}
.mb svg{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px var(--neon));}
.mb svg .fill{fill:currentColor;stroke:none;} .mb svg .thin{stroke-width:1.6;opacity:.75;} .mb svg .off{display:none;}
.mb[aria-pressed="true"] svg .off{display:inline;} .mb[aria-pressed="true"] svg .on{display:none;}
.mb .lbl{display:none;} .mb kbd{font:700 11px var(--f-plate);padding:2px 5px;border-radius:4px;border:1px solid color-mix(in srgb,var(--neon) 55%,transparent);margin-left:4px;color:#fff;text-shadow:none;}
body.wide .mb{width:auto;padding:0 14px 0 11px;height:40px;} body.wide .mb .lbl{display:inline;}
body.wide #btns.icons .mb{width:44px;height:44px;padding:0;} body.wide #btns.icons .mb .lbl{display:none;}
.mb.kick{animation:mbKick .45s ease-out;} @keyframes mbKick{0%{box-shadow:0 0 0 1px #000,0 0 0 0 var(--neon);}100%{box-shadow:0 0 0 1px #000,0 0 0 14px transparent;}}
body.calm .mb.kick{animation:none;} body.calm .mb{transition:none;}
.mb[aria-pressed="true"]{color:#7d8aa0;text-shadow:none;box-shadow:0 0 0 1px #000,0 6px 14px rgba(0,0,0,.6);} .mb[aria-pressed="true"] svg{filter:none;}
.mb:focus-visible,.btn:focus-visible,.tog:focus-visible{outline:2px solid var(--neon);outline-offset:4px;}
/* End of css/hud.css */