.dsp-speech{display:flex;width:fit-content;max-width:100%;margin:6px 0 0;align-self:flex-start;justify-self:start;text-align:left}
.dsp-speech:has(+ .sn-ai:not([hidden])){float:left;margin-right:8px}

.dsp-speech ~ .sn-ai-note,.dsp-speech ~ .sn-ai-status,.dsp-speech ~ .dsp-speech-note,.dsp-speech ~ .hint,.dsp-speech ~ .error-box{clear:both}

.dsp-mic{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:9.6em;min-height:32px;margin:0;padding:5px 12px;border:1px solid var(--line-strong);border-radius:var(--kit-radius);background:var(--kit-card-bg);color:var(--text);font-size:12.5px;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;white-space:nowrap;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.dsp-mic:hover{background:var(--surface-hover)}
.dsp-mic-icon{width:15px;height:15px;flex:none}
.dsp-mic-icon--stop{display:none}

.dsp-speech[data-state=starting] .dsp-mic,.dsp-speech[data-state=listening] .dsp-mic{background:var(--tone-bad-bg);border-color:var(--tone-bad-fg);color:var(--tone-bad-fg)}
.dsp-speech[data-state=starting] .dsp-mic,.dsp-speech[data-state=stopping] .dsp-mic{cursor:progress}
.dsp-speech[data-state=stopping] .dsp-mic{opacity:.7}
.dsp-speech[data-state=listening] .dsp-mic-icon--mic{display:none}
.dsp-speech[data-state=listening] .dsp-mic-icon--stop{display:block;animation:dsp-speech-pulse 1.4s ease-in-out infinite}
@keyframes dsp-speech-pulse{50%{opacity:.35}}

.dsp-speech-live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.dsp-speech-note{margin:6px 0 0;font-size:12px;line-height:1.5;color:var(--text-muted);text-align:left}
.dsp-speech-note[data-tone=warn]{color:var(--tone-warn-fg)}
.dsp-speech-note[data-tone=bad]{color:var(--tone-bad-fg)}


@media (max-width:850px),(pointer:coarse){
  .dsp-mic{min-height:44px;padding:8px 14px;font-size:13px}
  .dsp-mic-icon{width:17px;height:17px}
  .dsp-speech.dsp-speech + .sn-ai{min-height:44px}
}
@media print{.dsp-speech,.dsp-speech-note{display:none!important}}


html[data-theme="lcars"] .dsp-mic{padding:6px 16px 5px 22px;border:0;border-radius:16px 3px 3px 16px;background:var(--lc-raised);box-shadow:inset 8px 0 0 var(--lc-ice);color:var(--lc-ice);font:600 14px/1.1 var(--lc-display);letter-spacing:.08em;text-transform:uppercase}
html[data-theme="lcars"] .dsp-mic:hover{background:var(--lc-steel);color:var(--lc-ink)}
html[data-theme="lcars"] .dsp-speech[data-state=starting] .dsp-mic,html[data-theme="lcars"] .dsp-speech[data-state=listening] .dsp-mic{background:var(--tone-bad-bg);box-shadow:inset 8px 0 0 var(--tone-bad-fg);color:var(--tone-bad-fg)}
html[data-theme="lcars"] .dsp-speech-note{font:600 12px/1.4 var(--lc-display);letter-spacing:.08em;text-transform:uppercase}
@media (max-width:850px),(pointer:coarse){html[data-theme="lcars"] .dsp-mic{padding:8px 16px 7px 22px}}