/* saakshe chat panel — BRUT, on the cockpit's own tokens (light + Obsidian dark).
   All selectors scoped under #sa-chatpane; cockpit styles untouched.
   No private palette: every color/radius/shadow/font is a cockpit var, so the
   panel theme-flips with the cockpit for free. */
#sa-chatpane{
  font:13.5px/1.55 var(--font-body,'Space Grotesk',sans-serif); color:var(--ink,#161410);
  /* no position here — the cockpit mount sets position:fixed and this sheet
     loads after it; a position:relative would drop the pane into flow */
  display:flex; flex-direction:column; background:var(--surface,#FBF7EE);
}
/* grain — paper tooth, light only (Obsidian is a clean terminal field) */
#sa-chatpane::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-theme="dark"] #sa-chatpane::after{display:none}

/* ── the bot mark wears a BLACK (ink) bezel in the chat, ALWAYS —
   the faculty quad-tint (html[data-quad] → yellow/red/…) never recolors it here.
   Its Λ-eyes still animate through the global html[data-bot] reply states. ── */
#sa-chatpane .skbot{color:var(--ink,#141118)}

/* ── the ONE control tab — top right, just under the cockpit topbar: an ink
   plate carrying HISTORY + SETTINGS. No close, no collapse (founder,
   2026-06-12 — the pane never closes on desktop). ── */
#sa-chatpane .ch-head{display:flex;justify-content:flex-end;align-items:center;
  padding:8px 12px 0;background:var(--bg,#F4EEE2);flex:0 0 auto;position:relative;z-index:2}
#sa-chatpane .ch-htab{display:inline-flex;gap:2px;background:var(--ink,#161410);
  border-radius:9px;padding:3px;box-shadow:var(--shadow-sm,2px 2px 0 var(--ink))}
html[data-theme="dark"] #sa-chatpane .ch-htab{background:var(--surface-2,#141B14);
  border:1px solid var(--line,#1E2A20);box-shadow:none}
#sa-chatpane .ch-hbtn{border:0;background:transparent;color:var(--bg,#F4EEE2);
  font:700 9.5px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;
  padding:5px 10px;border-radius:7px;cursor:pointer;display:inline-flex;
  align-items:center;gap:6px;white-space:nowrap}
html[data-theme="dark"] #sa-chatpane .ch-hbtn{color:var(--ink,#D4F5DE)}
#sa-chatpane .ch-hbtn .ic{width:12px;height:12px;stroke:currentColor;fill:none;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#sa-chatpane .ch-hbtn:hover{background:rgba(255,255,255,.16)}
html[data-theme="dark"] #sa-chatpane .ch-hbtn:hover{background:rgba(255,255,255,.07)}
#sa-chatpane .ch-hbtn.on{background:var(--bg,#F4EEE2);color:var(--ink,#161410)}
html[data-theme="dark"] #sa-chatpane .ch-hbtn.on{background:var(--act);color:var(--on-act)}
#sa-chatpane .ch-hbtn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}

/* ── faculty pills, just ABOVE the ask box — free-floating on the feed field,
   NO band behind them (founder, 2026-06-12). A pill drops its agent into the
   ask as an ENTITY CHIP; no saakshe pill — we are always talking to saakshe. ── */
#sa-chatpane .ch-tabs{display:flex;align-items:center;gap:6px;padding:7px 12px 9px;
  border-top:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
  background:var(--bg,#F4EEE2)}
#sa-chatpane .ch-tabs::-webkit-scrollbar{display:none}
#sa-chatpane .ch-tabs > *{flex:0 0 auto}
#sa-chatpane .ch-tab{border:1.5px solid var(--line,#161410);border-radius:var(--radius-pill,999px);
  padding:3px 11px;font:600 10px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;
  cursor:pointer;background:var(--surface-2,#ECE4D3);color:var(--ink,#161410);
  transition:transform .12s, box-shadow .12s}
#sa-chatpane .ch-tab .fdot{display:inline-block;width:8px;height:8px;margin-right:5px;
  vertical-align:0;border:1px solid var(--line)}
#sa-chatpane .ch-tab[data-q="manas"] .fdot{background:var(--manas);border-radius:50%}
#sa-chatpane .ch-tab[data-q="arivu"] .fdot{background:var(--arivu);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:0}
#sa-chatpane .ch-tab[data-q="kalai"] .fdot{background:var(--kalai);clip-path:polygon(50% 0,100% 100%,0 100%);border:0}
#sa-chatpane .ch-tab[data-q="kural"] .fdot{background:var(--kural)}
#sa-chatpane .ch-tab:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-sm,2px 2px 0 var(--ink))}
html[data-theme="dark"] #sa-chatpane .ch-tab:hover{transform:none;box-shadow:none;border-color:var(--ink-2)}
#sa-chatpane .ch-tab.on{background:var(--ink,#161410);color:var(--bg,#F4EEE2)}
html[data-theme="dark"] #sa-chatpane .ch-tab.on{background:var(--act);color:var(--on-act)}
#sa-chatpane .ch-tab:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}

/* ── faculty SKILL flyout: hover/focus a faculty pill → that realm's REAL,
   chat-invokable skills. A click pre-fills the example ask. Brut tokens. ── */
#sa-chatpane .ch-skills{position:fixed;z-index:60;display:none;flex-direction:column;gap:8px;
  max-width:min(300px,calc(100% - 16px));padding:9px 10px 10px;
  border:1.5px solid var(--line,#161410);border-radius:14px;background:var(--surface,#FBF7EE);
  box-shadow:5px 5px 0 var(--ink,#161410)}
#sa-chatpane .ch-skills.on{display:flex;animation:chSkIn .14s ease-out}
@keyframes chSkIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
#sa-chatpane .ch-skhead{display:flex;align-items:center;gap:6px;
  font:700 9.5px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2,#5f5868)}
#sa-chatpane .ch-skhead .fdot{display:inline-block;width:8px;height:8px;border:1px solid var(--line)}
#sa-chatpane .ch-skills[data-q="manas"] .fdot{background:var(--manas);border-radius:50%}
#sa-chatpane .ch-skills[data-q="arivu"] .fdot{background:var(--arivu);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:0}
#sa-chatpane .ch-skills[data-q="kalai"] .fdot{background:var(--kalai);clip-path:polygon(50% 0,100% 100%,0 100%);border:0}
#sa-chatpane .ch-skills[data-q="kural"] .fdot{background:var(--kural)}
#sa-chatpane .ch-skrow{display:flex;flex-wrap:wrap;gap:6px}
#sa-chatpane .ch-skill{border:1.5px solid var(--line,#161410);border-radius:var(--radius-pill,999px);
  padding:5px 11px;font:600 11px var(--font-mono);letter-spacing:.03em;text-transform:lowercase;
  background:var(--bg,#F4EEE2);color:var(--ink,#161410);cursor:pointer;white-space:nowrap;
  box-shadow:var(--shadow-sm,2px 2px 0 var(--ink));transition:transform .1s,box-shadow .1s,background .1s,color .1s}
#sa-chatpane .ch-skill:hover{background:var(--ink,#161410);color:var(--bg,#F4EEE2);transform:translate(-1px,-1px)}
#sa-chatpane .ch-skill:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
/* Obsidian: clean terminal field — hairline, no hard offset shadows */
html[data-theme="dark"] #sa-chatpane .ch-skills{background:var(--surface-2,#141B14);
  border-color:var(--line,#1E2A20);box-shadow:none;border-radius:10px}
html[data-theme="dark"] #sa-chatpane .ch-skill{background:transparent;border-color:var(--ink-2,#7fa089);
  color:var(--ink,#D4F5DE);box-shadow:none}
html[data-theme="dark"] #sa-chatpane .ch-skill:hover{background:var(--act);color:var(--on-act);
  border-color:var(--act);transform:none}
@media(prefers-reduced-motion:reduce){#sa-chatpane .ch-skills.on{animation:none}}

/* ── feed ── */
#sa-chatpane .ch-feed{flex:1;overflow-y:auto;padding:14px;display:flex;
  flex-direction:column;gap:11px;background:var(--bg,#F4EEE2)}

/* ── settings / history modes: the pane's content swaps; sidebar and canvas
   never move. Display-only toggles — the feed DOM is untouched. ── */
#sa-chatpane #sa-ch-settings, #sa-chatpane #sa-ch-history{display:none;flex:1;
  min-height:0;overflow-y:auto;padding:14px;background:var(--bg,#F4EEE2)}
#sa-chatpane.settings-on #sa-ch-settings{display:block}
#sa-chatpane.history-on #sa-ch-history{display:block}
#sa-chatpane.settings-on .ch-feed, #sa-chatpane.history-on .ch-feed{display:none}
#sa-chatpane.settings-on .ch-input, #sa-chatpane.history-on .ch-input{display:none}
#sa-chatpane.settings-on .ch-tabs, #sa-chatpane.history-on .ch-tabs{display:none}
/* history rows — one sitting per row: when · first ask · count */
#sa-chatpane .ch-histlist{display:flex;flex-direction:column;gap:8px}
#sa-chatpane .ch-histrow{display:flex;flex-direction:column;gap:3px;width:100%;
  text-align:left;cursor:pointer;border:1.5px solid var(--line,#161410);
  border-radius:var(--radius-sm,10px);background:var(--surface,#FBF7EE);
  color:var(--ink,#161410);padding:9px 12px;box-shadow:var(--shadow-sm,2px 2px 0 var(--ink));
  transition:transform .1s, box-shadow .1s}
html[data-theme="dark"] #sa-chatpane .ch-histrow{border-width:1px;box-shadow:none}
#sa-chatpane .ch-histrow:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--line)}
html[data-theme="dark"] #sa-chatpane .ch-histrow:hover{transform:none;box-shadow:none;border-color:var(--ink-2)}
#sa-chatpane .ch-histrow:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
#sa-chatpane .ch-histrow .hwhen{font:700 9.5px var(--font-mono);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3,#6B6557)}
#sa-chatpane .ch-histrow .htxt{font:12.5px var(--font-body);line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sa-chatpane .ch-histrow .hct{font:10px var(--font-mono);color:var(--ink-3,#6B6557)}
/* back-to-chat row + fallback note (when the cockpit hasn't shipped
   SK_SETTINGS_HTML yet) */
#sa-chatpane .ch-setsback{display:block;width:100%;text-align:left;margin:0 0 12px;
  border:2px solid var(--line,#161410);border-radius:var(--radius-sm,10px);
  background:var(--surface,#FBF7EE);color:var(--ink,#161410);
  font:700 10px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;
  padding:8px 12px;cursor:pointer;box-shadow:var(--shadow-sm,2px 2px 0 var(--ink))}
#sa-chatpane .ch-setsback:hover{background:var(--ink,#161410);color:var(--bg,#F4EEE2)}
html[data-theme="dark"] #sa-chatpane .ch-setsback{border-width:1px;box-shadow:none}
#sa-chatpane .ch-setsback:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
#sa-chatpane .ch-setsnote{font:11px var(--font-mono);color:var(--ink-3,#6B6557);margin:0 0 10px}
#sa-chatpane .msg{max-width:94%;border:var(--line-w,2.5px) solid var(--line,#161410);
  border-radius:var(--radius,14px);padding:10px 13px;font-size:12.5px;
  background:var(--surface,#FBF7EE);box-shadow:var(--shadow-sm,2px 2px 0 var(--ink))}
#sa-chatpane .msg.hidden-fac{display:none}
@media (prefers-reduced-motion: no-preference){
  /* no-overshoot bezier — a >1 scale mid-flight momentarily clipped the
     user bubble against the feed edge */
  #sa-chatpane .msg{animation:sa-slidein .28s cubic-bezier(.2,.9,.3,1)}
  @keyframes sa-slidein{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
}
#sa-chatpane .msg.user{align-self:flex-end;background:var(--ink,#161410);color:var(--bg,#F4EEE2);
  box-shadow:none;margin-right:2px;max-width:88%}
html[data-theme="dark"] #sa-chatpane .msg.user{background:var(--surface-2);color:var(--ink);border-color:var(--ink-2)}
#sa-chatpane .msg .who{display:flex;align-items:center;gap:8px;font:700 9.5px var(--font-mono);
  text-transform:uppercase;letter-spacing:.12em;margin-bottom:5px;color:var(--ink-3,#6B6557)}
#sa-chatpane .msg.user .who{color:var(--faint,#B7AE9C)}
#sa-chatpane .msg .who .ts{font-weight:400;letter-spacing:.04em;opacity:.7;margin-left:auto}
/* the message avatar — the bot speaks every witness reply */
#sa-chatpane .msg .who .skbot{width:18px;height:18px;border-width:1.8px;border-radius:5px;flex:0 0 auto}
#sa-chatpane .msg p{margin:0;white-space:pre-wrap;overflow-wrap:break-word}
#sa-chatpane .msg p code{font-family:var(--font-mono);font-size:11px;background:var(--surface-2);
  border:1px solid var(--line);border-radius:4px;padding:0 4px}
#sa-chatpane .msg.user p code{background:transparent;border-color:var(--faint)}
#sa-chatpane .msg p a{color:var(--accent);text-decoration:underline}
#sa-chatpane .msg .data{margin-top:8px;background:var(--surface-2,#ECE4D3);
  border:1.5px solid var(--line,#161410);border-radius:var(--radius-sm,10px);
  padding:7px 10px;font:11px var(--font-mono)}
#sa-chatpane .msg .data .row{display:flex;justify-content:space-between;gap:10px;padding:1.5px 0}

/* seeded clarifying questions — one plate per question, numbered */
#sa-chatpane .msg .qseed{display:flex;gap:9px;margin-top:8px;background:var(--surface-2,#ECE4D3);
  border:1.5px solid var(--line,#161410);border-radius:var(--radius-sm,10px);padding:8px 10px}
#sa-chatpane .msg .qseed .qn{flex:0 0 auto;font:700 10px var(--font-mono);color:var(--ink-3,#6B6557);
  border:1.5px solid var(--line,#161410);border-radius:6px;width:18px;height:18px;
  display:inline-flex;align-items:center;justify-content:center;background:var(--surface,#FBF7EE)}
#sa-chatpane .msg .qseed .qt{font-size:12px;line-height:1.5;overflow-wrap:break-word;min-width:0}
#sa-chatpane .msg .qseed .qw{display:block;font-size:11px;color:var(--ink-3,#6B6557);margin-top:3px}

/* suggestion chips (empty state) */
#sa-chatpane .sugs{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
#sa-chatpane .sug{border:1.5px solid var(--line);border-radius:var(--radius-pill,999px);
  background:var(--surface);padding:5px 13px;font:600 10.5px var(--font-mono);
  letter-spacing:.06em;text-transform:uppercase;cursor:pointer;color:var(--ink);
  box-shadow:var(--shadow-sm);transition:transform .1s, box-shadow .1s}
#sa-chatpane .sug:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--line)}
html[data-theme="dark"] #sa-chatpane .sug:hover{transform:none;box-shadow:none;border-color:var(--ink-2)}
#sa-chatpane .sug:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent)}

/* action buttons (presenter blocks) */
#sa-chatpane .acts{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
#sa-chatpane .act{border:1.5px solid var(--line,#161410);border-radius:var(--radius-pill,999px);
  background:var(--surface,#FBF7EE);padding:5px 14px;font:700 10.5px var(--font-mono);
  letter-spacing:.08em;text-transform:uppercase;cursor:pointer;color:var(--ink,#161410);
  box-shadow:var(--shadow-sm,2px 2px 0 var(--ink));
  transition:transform .1s, box-shadow .1s, background .15s}
#sa-chatpane .act:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--line,#161410)}
html[data-theme="dark"] #sa-chatpane .act:hover{transform:none;box-shadow:none;border-color:var(--ink-2)}
#sa-chatpane .act:active{transform:translate(1px,1px);box-shadow:none}
#sa-chatpane .act:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
#sa-chatpane .act.primary{background:var(--act,#CC4632);color:var(--on-act,#fff)}
#sa-chatpane .act.ok{background:var(--tint-green,#D6EDDB)}
#sa-chatpane .act.no,#sa-chatpane .act.blocked{background:var(--tint-rose,#F3D3C9)}
html[data-theme="dark"] #sa-chatpane .act.ok,
html[data-theme="dark"] #sa-chatpane .act.no,
html[data-theme="dark"] #sa-chatpane .act.blocked{color:var(--ink)}
#sa-chatpane .act.done{background:var(--tint-green,#D6EDDB);pointer-events:none;opacity:.6}
#sa-chatpane .act:disabled{pointer-events:none;box-shadow:none;transform:none;cursor:default}
/* superseded rows — an older quote/render offer retired by a newer one
   (same fade idea as .ch-opts.spent); VIEW HDR inside stays clickable */
#sa-chatpane .acts.stale{opacity:.55}
#sa-chatpane .acts .stamp{font:600 9px var(--font-mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3,#6B6557);align-self:center;padding:2px 0}

/* options chips — every answer offers tappable next steps (typing stays open).
   Brut light: 2px border; Obsidian: 1px hairline, flat. Hover inverts. */
#sa-chatpane .ch-opts{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
#sa-chatpane .ch-opt{border:2px solid var(--line,#161410);border-radius:var(--radius-pill,999px);
  background:var(--surface,#FBF7EE);color:var(--ink,#161410);padding:3px 11px;
  font:600 10.5px var(--font-mono);letter-spacing:.03em;cursor:pointer;text-align:left;
  transition:background .12s, color .12s}
html[data-theme="dark"] #sa-chatpane .ch-opt{border-width:1px}
#sa-chatpane .ch-opt:hover{background:var(--ink,#161410);color:var(--bg,#F4EEE2)}
#sa-chatpane .ch-opt:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
/* spent row: one chip fired (or the row was restored) — the moment has passed */
#sa-chatpane .ch-opts.spent{opacity:.45}
#sa-chatpane .ch-opts.spent .ch-opt{pointer-events:none;cursor:default}
#sa-chatpane .ch-opts.spent .ch-opt:hover{background:var(--surface,#FBF7EE);color:var(--ink,#161410)}

/* slider (kalai quote) — proper Brut slider: bordered surface track, square
   ink-edged --act thumb. Every Firefox pseudo styled explicitly (an unstyled
   ::-moz-range-progress was the orange smear under the cost box). */
#sa-chatpane .sld{margin-top:9px;background:var(--surface-2,#ECE4D3);
  border:1.5px solid var(--line,#161410);border-radius:var(--radius-sm,10px);padding:9px 12px}
#sa-chatpane .sld .lab{display:flex;justify-content:space-between;font:700 9.5px var(--font-mono);
  text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px;color:var(--ink-2)}
#sa-chatpane .sld input{width:100%;-webkit-appearance:none;appearance:none;height:22px;
  background:transparent;accent-color:var(--act,#CC4632)}
#sa-chatpane .sld input::-webkit-slider-runnable-track{height:6px;background:var(--surface,#FBF7EE);
  border:1.5px solid var(--line,#161410);border-radius:2px}
#sa-chatpane .sld input::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-5px;
  background:var(--act,#CC4632);border:1.5px solid var(--line,#161410);border-radius:3px;cursor:pointer}
#sa-chatpane .sld input::-moz-range-track{height:6px;background:var(--surface,#FBF7EE);
  border:1.5px solid var(--line,#161410);border-radius:2px}
#sa-chatpane .sld input::-moz-range-progress{height:6px;background:var(--surface,#FBF7EE);border-radius:2px}
#sa-chatpane .sld input::-moz-range-thumb{width:16px;height:16px;background:var(--act,#CC4632);
  border:1.5px solid var(--line,#161410);border-radius:3px;cursor:pointer}
#sa-chatpane .sld input:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent)}
#sa-chatpane .sld .quote{margin-top:6px;font:11px var(--font-mono);display:flex;justify-content:space-between}
#sa-chatpane .sld .quote b{font-size:12.5px}
/* quiet note when the debounced requote fails — the shown cost may be stale */
#sa-chatpane .sld .qerr{margin-top:6px;font:600 9.5px var(--font-mono);letter-spacing:.05em;
  color:var(--sig-red,#A33321)}

/* attachment drop-plate */
#sa-chatpane .drop{margin-top:9px;border:1.5px dashed var(--ink-3);border-radius:var(--radius-sm);
  padding:14px;text-align:center;font:600 10.5px var(--font-mono);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);cursor:pointer;background:var(--surface)}
#sa-chatpane .drop:hover,#sa-chatpane .drop.over{border-color:var(--accent);color:var(--ink)}
#sa-chatpane .drop input{display:none}
#sa-chatpane .filechip{display:inline-flex;align-items:center;gap:8px;margin-top:9px;
  border:1.5px solid var(--line);border-radius:var(--radius-pill);padding:4px 7px 4px 12px;
  font:600 10.5px var(--font-mono);background:var(--tint-green)}
html[data-theme="dark"] #sa-chatpane .filechip{color:var(--ink)}
#sa-chatpane .filechip button{border:0;background:transparent;cursor:pointer;font:inherit;color:inherit;padding:0 3px}

/* typing — the witness thinking */
#sa-chatpane .typing{display:flex;gap:4px;padding:8px 12px;align-self:flex-start;align-items:center}
#sa-chatpane .typing .skbot{width:22px;height:22px;border-width:2px;border-radius:6px;margin-right:6px}
#sa-chatpane .typing .td{width:7px;height:7px;border-radius:50%;background:var(--ink-3,#6B6557)}
@media (prefers-reduced-motion: no-preference){
  #sa-chatpane .typing .td{animation:sa-bnc 1s infinite}
  #sa-chatpane .typing .td:nth-of-type(2){animation-delay:.15s}
  #sa-chatpane .typing .td:nth-of-type(3){animation-delay:.3s}
  @keyframes sa-bnc{0%,100%{transform:none;opacity:.4}50%{transform:translateY(-5px);opacity:1}}
}

/* "new messages" catcher when scrolled up */
#sa-chatpane .newmsgs{position:sticky;bottom:6px;align-self:center;border:1.5px solid var(--line);
  border-radius:var(--radius-pill);background:var(--ink);color:var(--bg);
  font:700 10px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;
  padding:4px 13px;cursor:pointer;box-shadow:var(--shadow-sm)}
html[data-theme="dark"] #sa-chatpane .newmsgs{background:var(--act);color:var(--on-act)}

/* ── input bar — a contenteditable ask box that holds TEXT + ENTITY CHIPS ── */
#sa-chatpane .ch-input{border-top:var(--line-w,2.5px) solid var(--line,#161410);padding:12px 14px;
  display:flex;gap:8px;background:var(--surface,#FBF7EE);align-items:center}
#sa-chatpane .ch-ed{flex:1;min-width:0;border:2px solid var(--line,#161410);
  border-radius:18px;padding:8px 15px;font:12.5px/1.5 var(--font-body);
  background:var(--surface-2,#ECE4D3);color:var(--ink,#161410);cursor:text;
  max-height:96px;overflow-y:auto;white-space:pre-wrap;overflow-wrap:break-word}
#sa-chatpane .ch-ed:empty::before{content:attr(data-ph);color:var(--ink-3);pointer-events:none}
#sa-chatpane .ch-ed:focus-visible{outline:none;border-color:var(--accent,#2A41A0);
  box-shadow:0 0 0 2px var(--accent,#2A41A0)}
/* the entity chip — the agent itself, sitting in the sentence as a pill */
#sa-chatpane .ch-ed .ent{display:inline-flex;align-items:center;gap:5px;
  vertical-align:baseline;margin:0 1px;border:1.5px solid var(--line,#161410);
  border-radius:var(--radius-pill,999px);padding:1px 9px;
  font:600 9.5px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;
  background:var(--surface,#FBF7EE);color:var(--ink,#161410);user-select:all;
  -webkit-user-select:all}
#sa-chatpane .ch-ed .ent .fdot{display:inline-block;width:7px;height:7px;
  border:1px solid var(--line)}
#sa-chatpane .ch-ed .ent[data-q="manas"]{background:var(--tint-amber)}
#sa-chatpane .ch-ed .ent[data-q="arivu"]{background:var(--tint-blue)}
#sa-chatpane .ch-ed .ent[data-q="kalai"]{background:var(--tint-rose)}
#sa-chatpane .ch-ed .ent[data-q="kural"]{background:var(--tint-green)}
#sa-chatpane .ch-ed .ent[data-q="manas"] .fdot{background:var(--manas);border-radius:50%}
#sa-chatpane .ch-ed .ent[data-q="arivu"] .fdot{background:var(--arivu);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:0}
#sa-chatpane .ch-ed .ent[data-q="kalai"] .fdot{background:var(--kalai);clip-path:polygon(50% 0,100% 100%,0 100%);border:0}
#sa-chatpane .ch-ed .ent[data-q="kural"] .fdot{background:var(--kural)}
#sa-chatpane .ch-input button{border:2px solid var(--line,#161410);border-radius:var(--radius-pill,999px);
  background:var(--surface,#FBF7EE);color:var(--ink,#161410);font:700 11px var(--font-mono);
  letter-spacing:.08em;padding:8px 14px;cursor:pointer;box-shadow:var(--shadow-sm,2px 2px 0 var(--ink));
  transition:transform .1s, box-shadow .1s;display:inline-flex;align-items:center;gap:6px}
#sa-chatpane .ch-input button:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--line)}
html[data-theme="dark"] #sa-chatpane .ch-input button:hover{transform:none;box-shadow:none;border-color:var(--ink-2)}
#sa-chatpane .ch-input button:active{transform:translate(1px,1px);box-shadow:none}
#sa-chatpane .ch-input button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
#sa-chatpane .ch-input button:disabled{opacity:.45;pointer-events:none;box-shadow:none}
#sa-chatpane #sa-ch-send{background:var(--act,#CC4632);color:var(--on-act,#fff)}
/* disabled SEND wears surface, not washed-out pink — full --act only when armed */
#sa-chatpane #sa-ch-send:disabled{background:var(--surface-2,#ECE4D3);color:var(--ink-3,#6B6557);
  border-color:var(--line,#161410);opacity:1;box-shadow:none}
#sa-chatpane #sa-ch-mic .ic{width:14px;height:14px;fill:none;stroke:currentColor;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
#sa-chatpane #sa-ch-mic .recdot{display:none;width:8px;height:8px;border-radius:50%;background:var(--sig-red,#A33321)}
#sa-chatpane #sa-ch-mic.rec .recdot{display:inline-block}
@media (prefers-reduced-motion: no-preference){
  #sa-chatpane #sa-ch-mic.rec .recdot{animation:sa-rec 1.1s infinite}
  @keyframes sa-rec{0%,100%{opacity:1}50%{opacity:.3}}
}
#sa-chatpane #sa-ch-mic.kbd .ic{display:none}
#sa-chatpane #sa-ch-mic.kbd::after{content:'⌨';font-size:13px}
/* loading stays CLICKABLE (dimmed) — the founder must always be able to stop */
#sa-chatpane #sa-ch-mic.loading{opacity:.6}

/* the mobile FAB lives outside the pane. Hidden by DEFAULT so it can never
   orphan-float over the feed; cockpit.html's max-width:1099px block only
   POSITIONS it (never sets display), so the narrow-screen show is owned here
   in a matching media query. cockpit's `html.sk-chat-open #sa-chatfab
   {display:none}` outranks the show on specificity, so open-state hiding
   still wins. (This sheet loads AFTER the cockpit inline style.) */
#sa-chatfab{display:none;border:var(--line-w,2.5px) solid var(--line,#161410);border-radius:12px;
  background:var(--surface,#FBF7EE);padding:8px;cursor:pointer;box-shadow:var(--shadow,5px 5px 0 var(--ink))}
@media(max-width:1099px){
  #sa-chatfab{display:inline-flex;align-items:center;justify-content:center}
}
#sa-chatfab:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent,#2A41A0)}
