/* faz1/voice.css (B8) · the voice toggle in the bottom bar, its one-line consent and the live transcript in the caption
   line. Every selector starts with .f1v-. Transitions: none; the level meter reads --f1v-l (0..1) written per frame.
   faz1.css sets "#f1-app button { font: inherit; color: inherit }", which outranks class selectors, hence !important
   on the button text below. */
.f1v-slot { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.f1v-slot:empty { display: none; }
.f1v-talk { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 11px 0 9px;
  border-radius: 9px; border: 1px solid var(--pro-line, #e5e8ee); background: var(--pro-panel, #fff); white-space: nowrap;
  font: 550 13px var(--f1-sans, "Segoe UI", Arial, sans-serif) !important; color: var(--pro-ink, #202630) !important; }
.f1v-talk:hover { border-color: var(--pro-accent, #5267d8); }
.f1v-talk:focus-visible { outline: 2px solid var(--pro-accent, #5267d8); outline-offset: 2px; }
.f1v-talk[disabled] { opacity: .55; cursor: default; }
.f1v-talk[aria-pressed="true"] { background: var(--pro-focus, #edf1ff); border-color: var(--pro-accent, #5267d8); color: var(--pro-accent, #5267d8) !important; }
/* the state dot: grey off, amber connecting, green listening (its halo follows the microphone level), accent speaking */
.f1v-dot { position: relative; width: 9px; height: 9px; border-radius: 50%; flex: none; background: var(--st-wait, #89919d);
  box-shadow: 0 0 0 calc(var(--f1v-l, 0) * 6px) color-mix(in srgb, var(--st-ok, #2a9d6f) 35%, transparent); }
.f1v-talk[data-state="connecting"] .f1v-dot, .f1v-talk[data-state="closing"] .f1v-dot { background: var(--st-warn, #d9a000); }
.f1v-talk[data-state="listening"] .f1v-dot { background: var(--st-ok, #2a9d6f); }
.f1v-talk[data-state="speaking"] .f1v-dot, .f1v-talk[data-state="working"] .f1v-dot { background: var(--pro-accent, #5267d8); }
.f1v-talk[data-state="story"] .f1v-dot { background: var(--st-wait, #89919d); }
/* the one-time consent: one inline line next to the toggle */
.f1v-consent { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-size: 12px; color: var(--pro-text2, #58616f); }
.f1v-consent-t { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 620px; }
.f1v-mini { all: unset; box-sizing: border-box; cursor: pointer; height: 26px; padding: 0 9px; border-radius: 7px; border: 1px solid var(--pro-line, #e5e8ee);
  font: 600 12px var(--f1-sans, "Segoe UI", Arial, sans-serif) !important; color: var(--pro-ink, #202630) !important; background: var(--pro-panel, #fff); }
.f1v-mini.f1v-go { background: var(--pro-accent, #5267d8); border-color: var(--pro-accent, #5267d8); color: #fff !important; }
/* live transcript: replaces the narration caption while a session runs (the narration elements stay, hidden) */
.f1v-cap { display: none; }
.f1v-live > #f1-speaker, .f1v-live > #f1-caption-text { display: none !important; }
.f1v-live > .f1v-cap { display: flex; flex-direction: column; justify-content: center; gap: 1px; min-width: 0; flex: 1; }
.f1v-row { margin: 0; display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.f1v-row b { flex: none; font-size: 10.5px; font-weight: 650; letter-spacing: .05em; border-radius: 6px; padding: 1px 6px;
  color: var(--pro-accent, #5267d8); background: var(--pro-focus, #edf1ff); }
.f1v-row span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 16px; line-height: 1.35; color: var(--pro-ink, #202630); }
.f1v-you b { color: var(--pro-text2, #58616f); background: var(--pro-soft, #f7f8fa); }
.f1v-you span { color: var(--pro-text2, #58616f); font-size: 15px; }
.f1v-state span { color: var(--pro-text2, #58616f); font-size: 15px; }
/* the assistant's highlight ring (voice.js flash): follows its element while cameras move, stays inside the element's
   panel; pulses with the Web Animations API, then holds until the next tool call or a user seek (about 14 s) */
.f1v-fx { position: fixed; left: 0; top: 0; width: 0; height: 0; z-index: 36; pointer-events: none; }
.f1v-flash { position: fixed; left: 0; top: 0; border-radius: 9px; pointer-events: none; box-sizing: border-box;
  border: 3px solid var(--st-warn, #d9a000);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--st-warn, #d9a000) 25%, transparent), 0 0 20px color-mix(in srgb, var(--st-warn, #d9a000) 55%, transparent); }
