/* Compact CANIMAPS DIGITAL pattern, with each demo's existing palette. */
#sound-dock{--safe-bottom:max(12px,env(safe-area-inset-bottom));--safe-left:max(12px,env(safe-area-inset-left));--safe-right:max(12px,env(safe-area-inset-right));scroll-margin-bottom:var(--safe-bottom);scroll-margin-left:var(--safe-left);scroll-margin-right:var(--safe-right);position:fixed;z-index:65;left:auto;right:var(--safe-right);bottom:var(--safe-bottom);top:auto;width:max-content;height:52px;display:flex;align-items:center;gap:2px;padding:3px;border:1px solid #ffffff40;border-radius:28px;background:var(--sound-bg);color:var(--sound-fg);box-shadow:0 5px 24px #0003;backdrop-filter:blur(15px);box-sizing:border-box}
#sound-dock[data-theme=paw]{--sound-bg:#254b3ff2;--sound-fg:#f7f3e9;--sound-accent:#e7ba75}
#sound-dock[data-theme=luma]{--sound-bg:#1b1f42ed;--sound-fg:#f3efe5;--sound-accent:#d8b5a2}
#sound-dock[data-theme=silva]{--sound-bg:#122e26f2;--sound-fg:#f3efe5;--sound-accent:#e8b766}
#sound-dock[hidden],#sound-options[hidden],body:has(dialog[open]) #sound-dock{display:none!important}
#sound-dock button{flex:0 0 44px;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;font-size:18px;line-height:1;cursor:pointer}
#sound-dock>button[aria-pressed=true],#sound-dock button[aria-expanded=true]{background:#ffffff14;color:var(--sound-accent)}
#sound-dock button:hover{background:#ffffff18}
#sound-dock button:focus-visible,#sound-dock input:focus-visible{outline:2px solid var(--sound-accent);outline-offset:2px}
#sound-dock svg{width:20px;height:20px;pointer-events:none}
#sound-options{position:absolute;right:0;bottom:calc(100% + 8px);width:210px;max-width:calc(100vw - 24px);padding:12px;border:1px solid #ffffff40;border-radius:18px;background:var(--sound-bg);box-shadow:0 5px 24px #0003;box-sizing:border-box}
#sound-options label{display:block;margin:0 0 4px;font-size:12px;color:inherit}
#sound-options input[type=range]{display:block;width:100%;height:28px;margin:0;accent-color:var(--sound-accent)}
#sound-options .sound-settings-row{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-top:4px}
#sound-options button[aria-pressed=true]{color:var(--sound-accent)}
@media(prefers-reduced-motion:reduce){#sound-dock,#sound-dock *{transition:none}}