/* Browser voice demo; inherits the site's five colors and two typefaces. */
button[data-voice-demo] { font-family: inherit; cursor: pointer; }
.site-header__call[data-voice-demo] { color: var(--ink); background: transparent; border: 0; border-bottom: var(--rule-weight) solid var(--rule-strong); }
.action[data-voice-demo], .callbar__call[data-voice-demo] { border: 0; }
.callbar--voice { grid-template-columns: 1fr; }
.voice-dialog { width: min(34rem, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); overflow: auto; margin: auto; padding: var(--space-6); border: 1px solid var(--rule-strong); background: var(--chalk); color: var(--ink); font-family: var(--font-body); }
.voice-dialog::backdrop { background: color-mix(in oklab, var(--slate) 70%, transparent); }
.voice-dialog h2 { font-family: var(--font-display); font-size: var(--text-2xl); line-height: var(--leading-tight); margin-block: var(--space-5) var(--space-4); }
.voice-dialog p { margin-block: var(--space-4); }
.voice-dialog__close { display: block; margin-left: auto; }
.voice-dialog button { font: inherit; cursor: pointer; min-height: 44px; padding: var(--space-2) var(--space-4); border: 1px solid var(--rule-strong); border-radius: var(--radius-control); background: var(--fog); color: var(--ink); }
.voice-dialog .voice-dialog__start { background: var(--action); color: var(--action-ink); border-color: var(--action); }
.voice-dialog button:disabled { opacity: .6; cursor: wait; }
.voice-dialog button:focus-visible, [data-voice-demo]:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.voice-dialog__controls { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.voice-dialog__status { border-block: 1px solid var(--rule); padding-block: var(--space-4); }
.voice-dialog__note { font-size: var(--text-sm); color: var(--ink-soft); }
.voice-dialog [hidden] { display: none; }
