:root { --dark:#16323D; --mint:#7ED6B5; --bg:#F3F5F2; --card:#FBFCFA; --line:#DDE3DF; --ink:#1E3640;
  --muted:#5B6B70; --warm:#FCF1E7; --warm-line:#F1D9C4; --warm-ink:#8A3B12; --red:#B3261E; }
* { box-sizing:border-box; }
body { margin:0; font-family:"IBM Plex Sans", "Segoe UI", Arial, sans-serif; background:var(--bg); color:var(--ink); }
header { background:var(--dark); color:#F3F5F2; padding:14px 24px; display:flex; align-items:center; gap:16px; }
header h1 { font-size:20px; margin:0; font-weight:600; }
header a { color:var(--mint); text-decoration:none; font-size:14px; }
header .sp { flex:1; }
main { display:grid; gap:16px; padding:16px 24px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.card h2 { font-size:15px; margin:0 0 10px; color:var(--dark); }
button { background:var(--dark); color:#F3F5F2; border:0; border-radius:8px; padding:9px 14px; font-size:14px; cursor:pointer; }
button.sec { background:#E4EBE7; color:var(--dark); }
button:disabled { opacity:.45; cursor:default; }
input { border:1px solid var(--line); border-radius:8px; padding:9px 12px; font-size:15px; background:#fff; }
.muted { color:var(--muted); font-size:13px; }
.pill { display:inline-block; padding:2px 8px; border-radius:20px; font-size:12px; background:#E4EBE7; color:var(--dark); }
.pill.warn { background:var(--warm); color:var(--warm-ink); }
.pill.ok { background:#DDF3E9; color:#0F6E56; }
.chat { height:56vh; overflow-y:auto; display:flex; flex-direction:column; gap:8px; padding-right:6px; }
.msg { max-width:78%; padding:9px 13px; border-radius:14px; line-height:1.4; font-size:15px; }
.msg.bot { background:#DDEFE8; align-self:flex-start; border-bottom-left-radius:4px; }
.msg.me { background:var(--dark); color:#F3F5F2; align-self:flex-end; border-bottom-right-radius:4px; }
.msg.partial { opacity:.55; font-style:italic; }
.msg .meta { display:block; font-size:11px; opacity:.7; margin-top:4px; }
.row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.kv { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; font-size:14px; }
.kv b { color:var(--muted); font-weight:500; }
.feed { max-height:60vh; overflow-y:auto; display:flex; flex-direction:column; gap:6px; font-size:13px; }
.feed div { padding:6px 8px; border-left:3px solid var(--line); background:#fff; }
.feed .transfer { border-color:var(--warm-ink); background:var(--warm); }
.feed .mis { border-color:#0F6E56; }
.esc { background:var(--warm); border:1px solid var(--warm-line); border-radius:10px; padding:10px 12px; margin-bottom:8px; font-size:13px; }
.esc.emergency { border-color:var(--red); }
.esc b { color:var(--warm-ink); }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:5px 6px; border-bottom:1px solid var(--line); }
.mic { width:46px; height:46px; border-radius:50%; padding:0; font-size:20px; }
.mic.on { background:var(--red); animation: pulse 1.2s infinite; }
@keyframes pulse { 50% { opacity:.6; } }