.speech-controls{--speech-gap:6px;justify-content:start;align-items:center;gap:var(--speech-gap);vertical-align:middle;grid-template-columns:minmax(44px,max-content);width:fit-content;max-width:100%;display:inline-grid}.speech-controls[data-paired=true]{min-width:calc(88px + var(--speech-gap));grid-template-columns:minmax(44px,max-content) 44px}.speech-controls>button{grid-row:1}.speech-controls>button.is-slow{grid-column:2}.speech-controls[data-paired=false]>button{grid-column:1}.speech-button:not(.speech-button-content){--speech-surface:var(--arcade-purple-soft);--speech-foreground:var(--surface-text);border:1px solid var(--arcade-line);background:var(--speech-surface);width:44px;min-width:44px;height:44px;min-height:44px;color:var(--speech-foreground);font:inherit;border-radius:50%;flex:none;justify-content:center;align-items:center;padding:8px;line-height:1;transition:background .16s,border-color .16s,box-shadow .16s;display:inline-flex;position:relative}.speech-button.is-slow:not(.speech-button-content){--speech-surface:var(--arcade-green-soft);--speech-foreground:var(--arcade-green);background:var(--speech-surface);color:var(--speech-foreground)}.speech-button:not(.speech-button-content):hover:not(:disabled){background:var(--speech-surface);color:var(--speech-foreground);border-color:var(--arcade-green);box-shadow:0 0 0 2px var(--arcade-green-soft)}.speech-button:not(.speech-button-content)[aria-pressed=true]{--speech-surface:var(--arcade-green);--speech-foreground:var(--on-vivid);background:var(--speech-surface);color:var(--speech-foreground);border-color:var(--arcade-green)}.speech-button:disabled{opacity:.5;cursor:default}.speech-button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.speech-icon{flex:none;width:24px;height:24px;display:block;overflow:visible}.speech-button-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.speech-controls>small{white-space:normal;overflow-wrap:anywhere;grid-column:1/-1;min-width:0;font-size:12px;line-height:1.4}.speech-button[data-speaking=true] .audio-wave{transform-origin:50%;animation:.85s ease-in-out infinite speech-wave}.speech-button[data-speaking=true] .audio-wave-outer{animation-delay:.16s}.speech-button[data-speaking=true] .audio-turtle-foot{transform-box:fill-box;transform-origin:top;animation:1.1s ease-in-out infinite speech-turtle-step}.speech-button[data-speaking=true] .audio-turtle-back{animation-delay:.55s}.speech-button[data-speaking=true] .audio-stop{animation:1.1s ease-in-out infinite speech-wave}@keyframes speech-wave{0%,to{opacity:.45;transform:scale(.93)}50%{opacity:1;transform:scale(1)}}@keyframes speech-turtle-step{0%,to{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}.speech-button:not(:disabled) .speech-icon{transform-origin:50%;transition:transform .14s ease-out}.speech-button:not(:disabled):active .speech-icon{transform:scale(.84)}.speech-button.is-normal:not(:disabled):not([data-speaking=true]):is(:hover,:focus-visible) .audio-speaker{transform-box:fill-box;transform-origin:50%;animation:.5s ease-out speech-invite}.speech-button.is-normal:not(:disabled):not([data-speaking=true]):is(:hover,:focus-visible) .audio-wave{animation:.6s ease-in-out speech-wave}.speech-button.is-slow:not(:disabled):not([data-speaking=true]):is(:hover,:focus-visible) .audio-turtle-head{transform-box:fill-box;transform-origin:50%;animation:.6s ease-out speech-peek}.speech-button.is-slow:not(:disabled):not([data-speaking=true]):is(:hover,:focus-visible) .audio-turtle-foot{transform-box:fill-box;transform-origin:top;animation:.6s ease-in-out speech-turtle-step}@keyframes speech-invite{0%,to{transform:rotate(0)}30%{transform:rotate(-12deg)}65%{transform:rotate(8deg)}}@keyframes speech-peek{0%,to{transform:translate(0)}45%{transform:translate(2px)rotate(-8deg)}}@media (prefers-reduced-motion:reduce){.speech-button,.speech-button *{transition:none!important;animation:none!important;transform:none!important}}.speech-text-row{flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:6px 10px;min-width:0;max-width:100%;display:flex}.speech-text-row>.speech-controls{flex:none}.speech-text-row>:is(h2,h3,p){margin-block:0}
