/* Generated from reviewed Git blobs; see PROVENANCE.json. No global reset/fonts/network. */
:root {
  --signal-bg: #FFFFFF;
  --signal-surface: #F4F4F5;
  --signal-surface-container: #F4F4F5;
  --signal-line: #DDDDDF;
  --signal-ink: #2A2A2C;
  --signal-body: #3A3A3C;
  --signal-muted: #6E6E73;
  --signal-accent: #F99D32;
  --signal-accent-hover: #E08C25;
  --signal-accent-active: #C97C1E;
  --signal-accent-text: #8A5508;
  --signal-on-accent: #2A2A2C;
  --signal-on-primary: #FFFFFF;
  --signal-success: #2E7D5B;
  --signal-warning: #A9690A;
  --signal-error: #D2392B;
  --signal-info: #2C6B8F;
  --signal-radius-sm: 8px;
  --signal-radius-md: 12px;
  --signal-radius-lg: 20px;
  --signal-radius-pill: 999px;
  --signal-shadow-1: 0 1px 2px rgba(40,36,30,.06);
  --signal-shadow-2: 0 2px 8px rgba(40,36,30,.08);
  --signal-shadow-3: 0 6px 20px rgba(40,36,30,.10);
  --signal-shadow-4: 0 14px 40px rgba(40,36,30,.14);
  --signal-control:44px; --signal-primary-height:48px; --signal-reaction-height:84px; --signal-source-height:104px; --signal-capture-height:240px;
}
.dark, [data-theme="dark"] {
  --signal-bg: #1C1C1E;
  --signal-surface: #2A2A2C;
  --signal-surface-container: #2A2A2C;
  --signal-line: #3E3E42;
  --signal-ink: #FFFFFF;
  --signal-body: #E4E4E6;
  --signal-muted: #9A9A9E;
  --signal-accent: #F99D32;
  --signal-accent-hover: #E08C25;
  --signal-accent-active: #C97C1E;
  --signal-accent-text: #F99D32;
  --signal-on-accent: #2A2A2C;
  --signal-on-primary: #1C1C1E;
  --signal-success: #5FAE86;
  --signal-warning: #D69B43;
  --signal-error: #FF8A80;
  --signal-info: #6FA7C5;
  --signal-shadow-1: 0 1px 2px rgba(0,0,0,.18);
  --signal-shadow-2: 0 2px 8px rgba(0,0,0,.24);
  --signal-shadow-3: 0 6px 20px rgba(0,0,0,.30);
  --signal-shadow-4: 0 14px 40px rgba(0,0,0,.38);
}
/* data-signal attributes are the portable, opt-in API. Important declarations deliberately
   beat legacy monolith/Tailwind utility rules only on explicitly opted-in elements. */
[data-signal="capture"] { box-sizing:border-box!important; min-height:var(--signal-capture-height)!important; padding:16px 12px!important; border:2px solid var(--signal-accent)!important; border-radius:20px!important; background:var(--signal-surface)!important; color:var(--signal-ink)!important; }
[data-signal="reaction-grid"] { display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:6px!important; margin-top:14px!important; }
[data-signal="reaction"] { box-sizing:border-box!important; min-width:0!important; min-height:var(--signal-reaction-height)!important; height:auto!important; padding:8px 3px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:4px!important; border:1px solid var(--signal-line)!important; border-radius:12px!important; background:var(--signal-surface)!important; color:var(--signal-ink)!important; }
[data-signal="reaction-label"] { white-space:nowrap!important; font-size:12px!important; line-height:1.3!important; font-weight:700!important; }
[data-signal="reaction-count"] { font-size:14px!important; line-height:1.3!important; font-weight:700!important; }
[data-signal="sources"] { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; margin-top:16px!important; }
[data-signal="source"] { box-sizing:border-box!important; min-width:0!important; min-height:var(--signal-source-height)!important; height:auto!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:4px!important; padding:8px!important; border:1px solid var(--signal-line)!important; border-radius:12px!important; background:var(--signal-surface)!important; color:var(--signal-ink)!important; white-space:normal!important; }
[data-signal="primary"] { box-sizing:border-box!important; min-height:var(--signal-primary-height)!important; height:auto!important; background:var(--signal-accent)!important; color:var(--signal-on-accent)!important; border-radius:12px!important; font-size:14px!important; font-weight:700!important; }
[data-signal="icon-button"] { box-sizing:border-box!important; min-width:var(--signal-control)!important; min-height:var(--signal-control)!important; border:1px solid var(--signal-line)!important; border-radius:12px!important; color:var(--signal-accent-text)!important; }
[data-signal="icon"] { width:24px!important; height:24px!important; flex-shrink:0!important; color:var(--signal-accent-text)!important; }
[data-signal]:focus-visible { outline:2px solid var(--signal-accent-active)!important; outline-offset:2px!important; }
@media (prefers-reduced-motion:reduce) { [data-signal] { transition:none!important; animation:none!important; } }

/* Shared capture controls; optional Finish is an app capability, not added behavior. */
[data-signal="capture-controls"] { display:grid!important; grid-template-columns:minmax(0,1fr) 88px 44px!important; align-items:center!important; gap:8px!important; width:100%!important; min-width:0!important; }
[data-signal="capture-controls"] > [data-signal-slot="record"] { grid-column:1!important; grid-row:1!important; min-width:0!important; }
[data-signal="capture-controls"] > [data-signal-slot="language"] { grid-column:2!important; grid-row:1!important; min-width:0!important; width:100%!important; }
[data-signal="capture-controls"] > [data-signal-slot="reset"] { grid-column:3!important; grid-row:1!important; min-width:0!important; width:44px!important; }
[data-signal="capture-controls"] > [data-signal-slot="finish"] { grid-column:4!important; grid-row:1!important; min-width:0!important; width:44px!important; }
[data-signal="capture-controls"]:has(> [data-signal-slot="finish"]:not([hidden])) { grid-template-columns:minmax(76px,1fr) 76px 40px 44px!important; gap:6px!important; }
[data-signal="capture-controls"]:has(> [data-signal-slot="finish"]:not([hidden])) > [data-signal-slot="reset"] { width:40px!important; }
[data-signal="language-trigger"] { box-sizing:border-box!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; gap:3px!important; min-height:44px!important; padding:4px!important; border:1px solid var(--signal-line)!important; border-radius:12px!important; background:var(--signal-surface)!important; color:var(--signal-ink)!important; white-space:nowrap!important; font-size:12px!important; }
[data-signal="language-flag"] { width:24px!important; height:18px!important; object-fit:contain!important; flex-shrink:0!important; }
[data-signal="language-dialog"], [data-signal="language-panel"] { box-sizing:border-box!important; width:min(360px,calc(100vw - 24px))!important; max-width:100%!important; max-height:calc(100dvh - 24px)!important; overflow:auto!important; padding:16px!important; border:2px solid var(--signal-accent)!important; border-radius:16px!important; background:var(--signal-surface)!important; color:var(--signal-ink)!important; font:14px/1.5 system-ui,sans-serif!important; }
[data-signal="language-dialog"] { margin:auto!important; }
[data-signal="language-dialog"]::backdrop { background:rgba(0,0,0,.6); }
[data-signal="language-panel"] { margin-top:8px!important; }
[data-signal="language-dialog"][hidden], [data-signal="language-panel"][hidden] { display:none!important; }
[data-signal="language-heading"], [data-signal="language-field"], [data-signal="language-actions"] { display:flex!important; align-items:center!important; gap:8px!important; }
[data-signal="language-heading"] { justify-content:space-between!important; margin-bottom:12px!important; }
[data-signal="language-heading"] h2 { margin:0!important; font:700 18px/1.3 system-ui,sans-serif!important; }
[data-signal="language-heading"] button { width:44px!important; min-height:44px!important; font-size:24px!important; }
[data-signal="language-dialog"] > label, [data-signal="language-panel"] > label { display:block!important; margin:12px 0!important; font-weight:600!important; }
[data-signal="language-field"] { margin-top:4px!important; }
[data-signal="language-field"] select { box-sizing:border-box!important; min-width:0!important; width:100%!important; min-height:44px!important; border:1px solid var(--signal-line)!important; border-radius:8px!important; background:var(--signal-bg)!important; color:var(--signal-ink)!important; font:14px/1.4 system-ui,sans-serif!important; }
[data-signal="language-actions"] { margin-top:16px!important; justify-content:center!important; flex-wrap:wrap!important; }
[data-signal="language-actions"] button { min-height:44px!important; min-width:96px!important; }
[data-signal="language-heading"] button, [data-signal="language-actions"] button { cursor:pointer; border:1px solid var(--signal-line); border-radius:8px; background:var(--signal-bg); color:var(--signal-ink); }

/* Source selection: one full-width audio hero followed by two secondary sources. */
[data-signal="source-hero"] { box-sizing:border-box!important; display:flex!important; width:100%!important; min-height:112px!important; align-items:center!important; justify-content:center!important; gap:12px!important; padding:20px 16px!important; border:2px solid var(--signal-accent)!important; border-radius:20px!important; background:var(--signal-surface)!important; color:var(--signal-ink)!important; font:700 20px/1.3 system-ui,sans-serif!important; white-space:nowrap!important; }
[data-signal="source-hero"] [data-signal="icon"] { width:32px!important; height:32px!important; }
[data-signal="source-hero"][hidden], [data-signal="capture"][hidden] { display:none!important; }
[data-signal="capture"][data-signal-empty="true"] { min-height:0!important; }
[data-signal="capture"][data-signal-empty="true"] [data-signal="reaction-grid"] { display:none!important; }
[data-signal="capture-controls"] > [data-signal-slot="record"], [data-signal="capture-controls"] > [data-signal-slot="record"] span { white-space:nowrap!important; overflow-wrap:normal!important; word-break:normal!important; flex-wrap:nowrap!important; }
[data-signal="capture-controls"] > [data-signal-slot="record"] { padding:8px!important; gap:4px!important; }

/* Active recording: larger timer and pause glyph, with safe narrow-row sizing. */
[data-signal="capture-controls"] > [data-signal-slot="record"][aria-label="Pause recording"] { font-size:20px!important; line-height:1.2!important; padding:2px!important; gap:3px!important; container-type:inline-size; container-name:signal-active-record; }
[data-signal-slot="record"][aria-label="Pause recording"] svg { width:24px!important; height:24px!important; flex-shrink:0!important; }
[data-signal-slot="record"][aria-label="Pause recording"] span { font-size:20px!important; line-height:1.2!important; }
[data-signal="capture-controls"]:has(> [data-signal-slot="finish"]:not([hidden])) { grid-template-columns:minmax(96px,1fr) 64px 40px 44px!important; gap:2px!important; }
[data-signal="capture-controls"]:has(> [data-signal-slot="finish"]:not([hidden])) [data-signal="language-flag"] { width:20px!important; height:15px!important; }
@container signal-active-record (max-width:110px) { [data-signal-slot="record"][aria-label="Pause recording"] span { font-size:18px!important; } }
@container signal-active-record (max-width:100px) { [data-signal-slot="record"][aria-label="Pause recording"] span { font-size:16px!important; } }

/* Keep spoken and transcript flags visible, including same-language pairs. */
[data-signal="language-arrow"] { flex-shrink:0!important; line-height:1!important; }
[data-signal="capture-controls"]:has(> [data-signal-slot="finish"]:not([hidden])) [data-signal="language-trigger"] { padding:2px!important; gap:2px!important; }
[data-signal="capture-controls"]:has(> [data-signal-slot="finish"]:not([hidden])) [data-signal="language-arrow"] { font-size:10px!important; }
