.voice-meter{display:grid;grid-template-columns:minmax(130px,1fr) auto auto;align-items:center;gap:.4rem .75rem;flex-basis:100%;min-width:min(100%,280px);padding:.7rem .8rem;margin:.5rem 0;border:1px solid #bdd4e6;border-radius:10px;background:#f1f7fc;color:#24496b}
.voice-meter[hidden]{display:none}
.voice-meter-signal{font-size:.82rem;font-weight:600}
.voice-meter-signal::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#49799c}
.voice-meter-time{font-variant-numeric:tabular-nums;font-size:1rem;font-weight:700;white-space:nowrap}
.voice-meter-wave{grid-column:1/-1;display:block;width:100%;height:44px;border-radius:4px;background:#fff}
.voice-meter-wave[hidden],.voice-meter-level[hidden]{display:none}
.voice-meter-level{grid-column:1/-1;width:100%;height:7px;accent-color:#287cad}
.voice-meter-cancel{border:1px solid #9fbdd4;border-radius:6px;background:#fff;color:#24496b;padding:.25rem .5rem;font:inherit;font-size:.8rem;cursor:pointer}
.voice-meter-cancel:focus-visible{outline:3px solid #367fae;outline-offset:2px}
.voice-meter[data-voice-state="recording"]{border-color:#488fba}
.voice-meter[data-voice-state="transcribing"] .voice-meter-wave,.voice-meter[data-voice-state="requesting"] .voice-meter-wave{opacity:.5}
.voice-meter-status{grid-column:1/-1;font-size:.82rem}
@media (max-width:480px){.voice-meter{grid-template-columns:minmax(0,1fr) auto;gap:.4rem}.voice-meter-cancel{grid-column:2;grid-row:2}.voice-meter-wave{grid-row:3}}
@media (prefers-reduced-motion:reduce){.voice-meter,.voice-meter *{animation:none!important;transition:none!important}}