/* Minimal voice concepts: shared modal behavior from design.md, loan palette by user request. */
.voice-dialog,.voice-launcher,.voice-wave { --panel:#111315; --panel-2:#202326; --hover:#2b3034; --border:#34393d; --text:#f6f7f8; --text-dim:#a6afb7; --text-faint:#8b959e; --accent:#f5c542; --on-accent:#111315; --bad:#fb8b85; font-family:'IBM Plex Sans',system-ui,sans-serif; }
.voice-dialog { box-sizing:border-box; width:min(420px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); padding:0; border:1px solid var(--border); border-radius:22px; color:var(--text); background:var(--panel); box-shadow:0 24px 64px #0008; overflow:hidden; }
.voice-dialog[open] { display:flex; flex-direction:column; }
.voice-dialog::backdrop { background:#000a; }
.voice-header { display:flex; align-items:center; gap:12px; padding:18px 20px 12px; flex:none; }
.voice-dialog h2 { flex:1; margin:0; font-size:24px; font-weight:700; letter-spacing:-.015em; line-height:1.2; }
.voice-dialog svg:not(.voice-waveform) { width:22px; height:22px; flex:none; }
.voice-body { padding:0 20px 16px; overflow:auto; min-height:0; overscroll-behavior:contain; }
.voice-dialog p { color:var(--text-dim); font-size:13px; line-height:1.5; margin:10px 0; overflow-wrap:anywhere; }
.voice-dialog button { display:inline-flex; align-items:center; justify-content:center; gap:8px; box-sizing:border-box; min-width:44px; min-height:44px; padding:10px 12px; border:1px solid var(--border); border-radius:12px; background:var(--panel-2); color:var(--text); font:600 14px 'IBM Plex Sans',system-ui,sans-serif; cursor:pointer; }
.voice-dialog button:hover:not(:disabled) { background:var(--hover); }
.voice-dialog button:disabled { opacity:.45; cursor:default; }
.voice-header > button { background:transparent; border:0; color:var(--text-dim); padding:8px; }
.voice-dialog button.voice-primary,.voice-dialog button[aria-pressed=true]:not([data-voice-action=play-audio]) { background:var(--accent); border-color:var(--accent); color:var(--on-accent); }
.voice-dialog button.voice-primary:hover:not(:disabled) { background:var(--accent); filter:brightness(1.06); }
.voice-dialog label { display:block; color:var(--text-dim); font-size:12px; font-weight:500; margin:10px 0; }
.voice-dialog input:not([type=checkbox]):not([type=range]),.voice-dialog select,.voice-dialog textarea { box-sizing:border-box; display:block; width:100%; min-height:44px; margin-top:5px; border:1px solid var(--border); border-radius:11px; padding:8px 10px; color:var(--text); background:var(--panel-2); font:500 15px 'IBM Plex Sans',system-ui,sans-serif; }
.voice-dialog textarea { resize:vertical; min-height:72px; }
.voice-dialog input[type=checkbox] { width:20px; height:20px; vertical-align:middle; margin-right:6px; accent-color:var(--accent); }
.voice-dialog fieldset { border:0; padding:0; margin:0; min-width:0; }
.voice-dialog details { margin-top:10px; padding-top:4px; border-top:1px solid var(--border); }
.voice-dialog summary { cursor:pointer; display:flex; align-items:center; min-height:44px; font-size:12px; color:var(--text-dim); gap:8px; }
.voice-dialog summary::before { content:'+'; font-size:18px; }
.voice-dialog details[open]>summary::before { content:'−'; }
.voice-footer { display:flex; gap:10px; padding:12px 20px 18px; flex:none; flex-wrap:wrap; background:var(--panel); }
.voice-footer > .voice-primary,.voice-footer > [data-voice-action=close] { flex:1; }
.voice-footer .voice-hint { width:100%; margin:0; order:-1; font-size:12px; text-align:center; color:var(--text-faint); }
.voice-hint:empty { display:none; }
.voice-confirm { width:100%; padding:12px; border-radius:14px; background:var(--panel-2); border:1px solid var(--accent); }
.voice-confirm .voice-actions { display:flex; gap:8px; }
.voice-confirm .voice-actions > button { flex:1; }
.voice-review,.voice-status:not(:empty) { padding:10px 12px; border-radius:12px; background:var(--panel-2); border-left:3px solid var(--accent); margin:8px 0; }
.voice-status:empty { display:none; }
.voice-status.is-error { border-left-color:var(--bad); }
.voice-review ul { padding-left:16px; margin:4px 0; font-size:12px; }
.voice-review label { margin:6px 0; }
.voice-field-issue { display:block; font-size:12px; margin:6px 0; }
.voice-identity-card { display:flex; align-items:center; gap:10px; padding:10px; background:var(--panel-2); border-radius:14px; min-width:0; }
.voice-avatar { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:var(--accent); color:var(--on-accent); font-size:14px; font-weight:600; flex:none; }
.voice-person { display:flex; flex-direction:column; flex:1; gap:3px; text-align:left; min-width:0; }
.voice-person strong { font-size:15px; overflow-wrap:anywhere; }
.voice-code,.voice-time { font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text-dim); }
.voice-search { position:relative; margin:6px 0 14px !important; }
.voice-search > svg { position:absolute; left:12px; top:12px; color:var(--text-dim); }
.voice-search input { padding-left:42px !important; }
.voice-all { max-height:360px; overflow:auto; overscroll-behavior:contain; }
.voice-all h3 { font-size:12px; color:var(--text-dim); font-weight:500; }
.voice-choices { display:grid; gap:7px; }
.voice-choices > div[hidden] { display:none; }
.voice-choices button { width:100%; padding:0; justify-content:space-between; text-align:left; }
.voice-choices .voice-identity-card { flex:1; background:transparent; }
.voice-choices button[aria-pressed=true] .voice-avatar { background:var(--on-accent); color:var(--accent); }
.voice-choices button[aria-pressed=true] .voice-code { color:#514017; }
.voice-choices button > svg { margin-right:12px; }
.voice-all > [data-voice-action=choose] { display:flex; width:100%; margin-top:8px; color:var(--accent); border:0; background:transparent; }
.voice-media,.voice-sr { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.voice-player { padding:18px 0 8px; }
.voice-waveform { display:block; width:100%; height:70px; fill:var(--accent); }
.voice-player-controls { display:flex; align-items:center; gap:12px; margin-top:14px; }
.voice-player-controls > button { width:48px; height:48px; border-radius:50%; padding:10px; }
.voice-player-controls input { flex:1; min-width:0; accent-color:var(--accent); height:32px; }
.voice-expiry { display:flex; align-items:center; gap:10px; border-top:1px solid var(--border); padding-top:16px; }
.voice-retention { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px; margin:14px 0 24px; }
.voice-retention > button { min-width:0; padding:8px 2px; display:flex; flex-direction:column; gap:2px; font-size:18px; min-height:62px; }
.voice-retention > button span { font-size:10px; }
.voice-storage-meter label { color:var(--text); font-size:14px; }
.voice-storage-meter meter { width:100%; height:22px; accent-color:var(--accent); }
.voice-storage-meter meter::-webkit-meter-bar { background:var(--panel-2); border:0; border-radius:20px; }
.voice-storage-meter meter::-webkit-meter-optimum-value { background:var(--accent); border-radius:20px; }
.voice-storage-meter meter::-moz-meter-bar { background:var(--accent); border-radius:20px; }
.voice-dialog[data-voice-view=loan] { --panel:#f5c542; --text:#111315; --text-dim:#262a2d; --text-faint:#3d3830; --border:#c39b2d; background:var(--panel); }
.voice-dialog[data-voice-view=loan] .voice-identity-card { background:#111315; color:#f6f7f8; }
.voice-dialog[data-voice-view=loan] .voice-identity-card .voice-code { color:#a6afb7; }
.voice-dialog[data-voice-view=loan] .voice-identity-card button { color:#f6f7f8; background:#202326; border-color:#34393d; }
.voice-loan-fields { margin-top:10px !important; }
.voice-field-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.voice-dialog[data-voice-view=loan] .voice-field { background:#111315; color:#a6afb7; padding:7px 10px; border-radius:11px; margin:7px 0; }
.voice-dialog[data-voice-view=loan] .voice-field input,.voice-dialog[data-voice-view=loan] .voice-field select { color:#f6f7f8; background:transparent; margin:0; padding:2px 0; min-height:28px; border:0; font-size:16px; }
.voice-dialog[data-voice-view=loan] select option { background:#111315; color:#f6f7f8; }
.voice-dialog[data-voice-view=loan] .voice-field-principal { position:relative; background:transparent; color:#111315; padding:2px 0; margin:10px 0 4px; }
.voice-field-principal::before { content:'$'; position:absolute; top:21px; left:0; font-size:36px; font-weight:700; }
.voice-dialog[data-voice-view=loan] .voice-field-principal input { font-size:36px; font-weight:700; line-height:1.1; color:#111315; padding-left:26px; min-height:48px; }
.voice-field-principal input::-webkit-inner-spin-button { appearance:none; }
.voice-field-principal input { appearance:textfield; }
.voice-totals { display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; padding:12px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.voice-totals > div { display:flex; flex-direction:column; gap:5px; }
.voice-totals > div+div { border-left:1px solid var(--border); padding-left:14px; }
.voice-totals span { font-size:12px; }
.voice-totals strong { font-size:20px; font-weight:700; overflow-wrap:anywhere; }
.voice-totals strong span { font-size:16px; }
.voice-dialog[data-voice-view=loan] button.voice-primary { background:#111315; color:#f5c542; border-color:#111315; }
.voice-dialog[data-voice-view=loan] button.voice-primary:hover:not(:disabled) { background:#202326; }
.voice-dialog[data-voice-view=loan] .voice-footer > [data-voice-action=close] { flex:0 0 44px; background:var(--panel); color:#111315; padding:8px; }
.voice-dialog[data-voice-view=loan] .voice-review,.voice-dialog[data-voice-view=loan] .voice-status,.voice-dialog[data-voice-view=loan] .voice-confirm { background:#111315; color:#f6f7f8; }
.voice-dialog[data-voice-view=loan] .voice-review label,.voice-dialog[data-voice-view=loan] .voice-confirm p { color:#f6f7f8; }
.voice-dialog[data-voice-view=loan] .voice-review input { accent-color:#f5c542; }
.voice-dialog[data-voice-view=loan] .voice-field-issue { color:#ffb6b1; }
.voice-dialog[data-voice-view=loan] .voice-field-principal .voice-field-issue,.voice-dialog[data-voice-view=loan] .voice-loan-fields > .voice-field-issue { color:#762415; }
.voice-dialog[data-voice-view=loan] .voice-loan-options button { color:#f6f7f8; border-color:#34393d; }
.voice-dialog[data-voice-view=loan] .voice-confirm button { color:#f6f7f8; border-color:#34393d; }
.voice-dialog[data-voice-view=loan] .voice-confirm .voice-primary { color:#111315; background:#f5c542; }
.voice-launcher { position:fixed; right:18px; bottom:calc(82px + env(safe-area-inset-bottom)); z-index:1100; display:flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:999px; min-height:48px; padding:12px 18px; background:var(--accent); color:#111315; font-weight:600; cursor:pointer; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.voice-launcher[hidden] { display:none; }
.voice-launcher svg { width:22px; height:22px; }
.voice-launcher[aria-pressed=true] { box-shadow:0 0 0 6px #f5c54233; }
.voice-wave { position:fixed; right:18px; bottom:calc(150px + env(safe-area-inset-bottom)); z-index:1101; width:250px; max-width:calc(100vw - 36px); box-sizing:border-box; border:1px solid var(--border); border-radius:22px; padding:20px; background:var(--panel); color:var(--accent); box-shadow:0 16px 40px #0007; pointer-events:none; display:flex; flex-direction:column; align-items:center; gap:14px; }
.voice-wave[hidden] { display:none; }
.voice-live-mic { display:grid; place-items:center; width:64px; height:64px; border-radius:50%; background:var(--accent); color:#111315; }
.voice-live-mic svg { width:30px; height:30px; }
.voice-wave > div { display:flex; justify-content:center; align-items:center; height:44px; gap:4px; }
.voice-wave i { width:4px; height:calc(6px + var(--voice-level,0) * 34px); border-radius:9px; background:var(--accent); transition:height .08s linear; }
.voice-wave i:nth-child(2n) { height:calc(6px + var(--voice-level,0) * 22px); }
.voice-wave i:nth-child(3n) { height:calc(6px + var(--voice-level,0) * 12px); }
.voice-wave [role=status] { font-size:14px; font-weight:600; }
.voice-record-ready { display:grid; place-items:center; padding:30px; color:var(--accent); }
.voice-dialog :focus-visible,.voice-launcher:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.voice-dialog[data-voice-view=loan] :focus-visible { outline-color:#111315; }
.voice-dialog[data-voice-view=loan] .voice-field :focus-visible { outline-color:#f5c542; }
@media(max-width:640px) { .voice-dialog { width:calc(100vw - 16px); margin:auto 8px 8px; max-height:calc(100dvh - 16px); } .voice-header { padding:16px 16px 12px; } .voice-body { padding:0 16px 12px; } .voice-footer { padding:10px 16px max(14px,env(safe-area-inset-bottom)); } }
@media(max-width:360px) { .voice-dialog h2 { font-size:22px; } .voice-totals strong { font-size:17px; } }
@media(prefers-reduced-motion:reduce) { .voice-dialog *, .voice-wave i { animation:none !important; transition:none !important; } .voice-wave i { height:12px; } }
.employee-voice-name { display:flex; flex-direction:column; gap:6px; margin:16px 0; }
.employee-voice-name > button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 14px; border:1px solid #34393d; border-radius:12px; background:#111315; color:#f5c542; font:600 14px 'IBM Plex Sans',system-ui,sans-serif; cursor:pointer; }
.employee-voice-name > button:disabled { opacity:.45; cursor:default; }
.employee-voice-name svg { width:20px; height:20px; }
.employee-voice-name > span { color:#94a3b8; font-size:12px; }
.voice-name-dialog h3 { font-size:14px; margin-top:20px; }
.voice-name-audio { color-scheme:dark; display:block; width:100%; height:44px; margin:12px 0; }
.voice-name-variants > div { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:6px 0; padding:6px 8px 6px 12px; background:var(--panel-2); border-radius:12px; }
.voice-name-variants > div > span { overflow-wrap:anywhere; min-width:0; }
.voice-name-meter { margin:14px 0; color:var(--accent); }
.voice-name-meter > span { display:block; height:8px; margin-top:8px; border-radius:8px; background:var(--accent); transform:scaleX(max(.03,var(--level,0))); transform-origin:left; transition:transform .08s linear; }
.voice-remember { min-height:44px; display:flex !important; align-items:center; }
@media(prefers-reduced-motion:reduce) { .voice-name-meter > span { transition:none; transform:scaleX(.5); } }
