/* finesse · component: sound-toggle · register=brand · states: default hover focus active disabled loading error success */
:is(header,dialog) .sound-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;flex-shrink:0;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-sm,var(--small,7px));background:var(--surface,var(--bg));color:var(--ink);font:inherit;font-size:11px;font-weight:600;line-height:1.3;white-space:nowrap;cursor:pointer;transition:background .15s,transform .15s}:is(header,dialog) .sound-toggle svg{display:block;flex-shrink:0}:is(header,dialog) .sound-toggle .sound-waves{display:none}:is(header,dialog) .sound-toggle.is-on{background:var(--ink);color:var(--surface,var(--bg))}:is(header,dialog) .sound-toggle.is-on .sound-waves{display:block}:is(header,dialog) .sound-toggle.is-on .sound-mute{display:none}:is(header,dialog) .sound-toggle:active{transform:translateY(1px)}:is(header,dialog) .sound-toggle:focus-visible{outline:3px solid var(--accent);outline-offset:4px}:is(header,dialog) .sound-toggle:disabled{opacity:.55;cursor:not-allowed}:is(header,dialog) .sound-toggle[data-state=loading]{min-width:102px}:is(header,dialog) .sound-toggle[data-state=error]{text-decoration:underline;text-underline-offset:3px}@media(hover:hover){:is(header,dialog) .sound-toggle:not(:disabled):hover{filter:brightness(.94)}}@media(max-width:650px){header{flex-wrap:wrap}header nav{flex-wrap:wrap;justify-content:flex-end;margin-left:auto;gap:9px}:is(header,dialog) .sound-toggle{min-height:44px;padding:8px 10px;font-size:10px}}@media(prefers-reduced-motion:reduce){:is(header,dialog) .sound-toggle{transition:none}}

.host-sound-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-shrink:0}.host-top{gap:12px}.host-top>div:first-child{min-width:0}@media(max-width:600px){.host-sound-controls{flex-direction:column-reverse;gap:4px}}