/* Scoped addition: keep the current desktop/mobile layouts and colour tokens. */
#mapPanel .spectrum-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#volumeToggle{min-width:44px;justify-content:center;font-weight:500}
#volumeToggle[aria-pressed="true"]{border-color:var(--ink);color:var(--ink)}
#mandorle3D{position:absolute;inset:0;width:100%;height:100%;touch-action:none;background:transparent;cursor:grab}
#mandorle3D:active{cursor:grabbing}
#mandorle3D[hidden],#mandorla[hidden],.volume-tools[hidden],.volume-note[hidden]{display:none!important}
#mapPanel.volume-active .spectrum-tools #spectrumToggle,#mapPanel.volume-active #spectrumNote{display:none!important}
#mapPanel.volume-active .spectrum-tools,#mapPanel.volume-active .map-controls{z-index:4}
.volume-tools{position:absolute;bottom:64px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:4;white-space:nowrap}
.volume-tools button{font:inherit;font-size:11px;color:var(--ink);border:1px solid var(--line);background:var(--color);border-radius:24px;padding:8px 12px;min-height:36px;cursor:pointer}
.volume-tools button[aria-pressed="true"]{border-color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.volume-note{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--ink);white-space:nowrap;margin:0;pointer-events:none}
@media(max-width:720px){.volume-tools{bottom:47px;gap:4px}.volume-tools button{font-size:10px;padding:7px 9px}.volume-note{bottom:22px;font-size:9px}}