/* Prove7 Control Chat — Option A "Governed Console" components.
   All colors via theme.css vars (light+dark). Navy chrome is a brand constant. */
*{box-sizing:border-box}
[hidden]{display:none !important}
body{margin:0;font:14px/1.55 var(--sans);background:var(--page);color:var(--ink);
  -webkit-font-smoothing:antialiased;transition:background .3s,color .2s}
.sp{flex:1}
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.kv{font-size:12.5px;color:var(--muted)}

/* Top chrome (always navy) */
.top{display:flex;align-items:center;gap:16px;background:var(--chrome);color:var(--on-chrome);padding:0 22px;height:60px}
.brand{display:inline-flex;align-items:center;gap:10px}
.brand .mark{height:26px;width:auto;display:block}
.brand .wordmark{height:17px;width:auto;display:block}
.brand small{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--steel-100);font-weight:600}
.brand.big .mark{height:38px}.brand.big .wordmark{height:24px}
.ctx{color:var(--chrome-sub);font-size:13px;border-left:1px solid var(--chrome-line);padding-left:16px}
.ctx b{color:#e7edf8;font-weight:600}
.iconbtn{width:34px;height:34px;border-radius:9px;background:transparent;border:1px solid var(--chrome-line);
  color:var(--chrome-sub);cursor:pointer;display:grid;place-items:center;font-size:15px}
.iconbtn:hover{color:#fff;border-color:#3a5890}
.who{display:flex;align-items:center;gap:11px;background:#12294d;border:1px solid var(--chrome-line);border-radius:12px;padding:6px 7px 6px 12px}
.who .av{width:32px;height:32px;border-radius:9px;background:linear-gradient(160deg,#2f4d86,#20386a);display:grid;place-items:center;font-weight:700;font-size:12px;color:#dbe6ff}
.who .nm{font-weight:600;font-size:13px;line-height:1.2;color:#fff}
.who .rl{font-size:11px;color:var(--chrome-sub)}
.who .sw{margin-left:5px;background:#1c3966;border:1px solid #35578e;color:#cfe0ff;border-radius:8px;padding:6px 10px;font-size:11.5px;cursor:pointer}

.primary{background:var(--accent);color:var(--accent-ink);border:0;border-radius:10px;padding:12px 20px;font-weight:700;font-size:14px;cursor:pointer}
.primary:disabled{opacity:.5;cursor:default}
/* ── Consolidated login — split-panel (brand/hero left, form right), like the platform ── */
.gate{position:fixed;inset:0;height:100vh;z-index:100;display:block}
.loginSplit{display:grid;grid-template-columns:1.05fr .95fr;height:100vh;background:var(--surface)}

/* Left — dark branded hero */
.loginHero{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:22px;padding:64px 60px;color:#e9eef7;background:radial-gradient(120% 120% at 15% 0%,#12294d 0%,#0a182b 55%,#070f1d 100%)}
.loginHero .brand{margin-bottom:6px}
.loginHero .brand small{color:#9fb3d6}
.heroTitle{font-size:38px;line-height:1.12;font-weight:800;letter-spacing:-.02em;margin:0;color:#fff}
.heroSub{max-width:440px;color:#a7b7d4;font-size:14.5px;line-height:1.6;margin:0}
.heroChips{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.hchip{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#cdd9ef;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:7px 13px}
.hchip::before{content:"";width:6px;height:6px;border-radius:50%;background:#6f9bff;flex:none}

/* Right — the form pane */
.loginPane{display:grid;place-items:safe center;padding:40px 24px;background:var(--surface);overflow:auto}
.loginBox{width:100%;max-width:360px}
.loginTitle{font-size:26px;font-weight:800;letter-spacing:-.02em;margin:0 0 6px;color:var(--ink)}
.loginSub{color:var(--muted);font-size:14px;margin:0 0 26px}

.loginError{background:rgba(220,38,38,.08);border:1px solid #dc2626;color:#dc2626;border-radius:9px;padding:9px 12px;font-size:12.5px;margin:0 0 16px}

.loginForm{display:flex;flex-direction:column}
.loginForm label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:0 0 7px}
.loginForm > input,.pwWrap{margin-bottom:16px}
.loginForm input{width:100%;box-sizing:border-box;background:var(--surface);border:1px solid var(--line-2,var(--line));border-radius:10px;padding:12px 13px;color:var(--ink);font-size:14px;transition:border-color .12s,box-shadow .12s}
.loginForm input::placeholder{color:var(--muted);opacity:.7}
.loginForm input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(111,139,184,.22)}
.pwWrap{position:relative}
.pwWrap input{margin-bottom:0;padding-right:42px}
.pwToggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--muted);cursor:pointer;padding:6px;border-radius:8px;display:grid;place-items:center}
.pwToggle:hover{color:var(--ink)}
.pwToggle.on{color:var(--accent)}

.btnFull{width:100%;box-sizing:border-box}
.btnPrimary{margin-top:2px;background:var(--accent);color:var(--accent-ink);border:0;border-radius:10px;padding:13px 20px;font-weight:700;font-size:14px;cursor:pointer;transition:filter .12s}
.btnPrimary:hover{filter:brightness(1.06)}
.btnPrimary:disabled{opacity:.6;cursor:default}

.loginDivider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.08em;margin:22px 0 16px}
.loginDivider::before,.loginDivider::after{content:"";flex:1;height:1px;background:var(--line)}

/* SSO buttons — a row of provider tiles (icon over label), like the platform login */
.ssoRow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ssoRow:has(.ssoBtn:only-child){grid-template-columns:1fr}
.ssoBtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-decoration:none;background:var(--surface);color:var(--ink);border:1px solid var(--line-2,var(--line));border-radius:11px;padding:14px 8px;font-weight:600;font-size:13px;cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s}
.ssoBtn:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.ssoBtn .ssoIcon{width:20px;height:20px;color:var(--ink-2)}
.loginBox .fine{color:var(--muted);font-size:11.5px;margin:20px 0 0;line-height:1.5;text-align:center}

/* Narrow screens — hide the hero, center the form */
@media (max-width:860px){
  .loginSplit{grid-template-columns:1fr}
  .loginHero{display:none}
}

/* Workspace 3-col */
.wrap{display:grid;grid-template-columns:250px 1fr 340px;height:calc(100vh - 60px)}
.col{overflow:auto;padding:20px 18px}
.left{background:var(--band);border-right:1px solid var(--line)}
.right{background:var(--band);border-left:1px solid var(--line)}
.model{width:100%;border:1px solid var(--line-2);border-radius:var(--r);padding:9px;font-size:13px;background:var(--surface);color:var(--ink)}
.toolList .tool{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;margin-bottom:9px;font-size:13.5px;font-weight:500;color:var(--ink);box-shadow:var(--shadow)}
.tool .d{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.scope{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:6px 14px;box-shadow:var(--shadow)}
.scope .row{display:flex;justify-content:space-between;font-size:12.5px;padding:8px 0;border-top:1px solid var(--line)}
.scope .row:first-child{border-top:0}
.scope .k{color:var(--muted)} .scope .v{color:var(--ink);font-weight:600} .scope .v.no{color:var(--muted);font-weight:500}

/* Chat */
.center{display:flex;flex-direction:column;min-height:0;background:var(--surface)}
.chat{flex:1;overflow:auto;padding:26px 30px}
.turn,.msg{max-width:780px;margin-left:auto;margin-right:auto}
.msg{margin-bottom:20px}
.msg.user{display:flex;justify-content:flex-end}
.msg.user .b{background:var(--user-bubble);color:var(--user-ink);border-radius:14px 14px 4px 14px;padding:12px 16px;max-width:74%;font-size:14px}
.msg.a .from{font-size:12px;color:var(--muted);margin:0 2px 8px;display:flex;align-items:center;gap:8px}
.msg.a .from .pill{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--steel);border:1px solid var(--line-2);border-radius:20px;padding:2px 8px}
.msg.a .b{font-size:14.5px;line-height:1.62;color:var(--ink);white-space:pre-wrap;word-wrap:break-word}
.msg.a .b .cursor{display:inline-block;width:7px;background:var(--muted);animation:blink 1s steps(2) infinite;margin-left:1px}
@keyframes blink{50%{opacity:0}}
.redact{background:var(--warnbg);color:var(--warn);border:1px solid var(--warnline);border-radius:5px;padding:0 5px;font-size:12px}
.tbl{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin:14px 0 4px;box-shadow:var(--shadow)}
.tbl table{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th{text-align:left;background:var(--surface-2);color:var(--muted);font-family:var(--mono);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:9px 14px}
.tbl td{padding:10px 14px;border-top:1px solid var(--line);color:var(--ink-2)}
.tbl td.n{text-align:right;font-variant-numeric:tabular-nums}
.banner{display:flex;gap:9px;align-items:flex-start;border-radius:var(--r);padding:10px 13px;margin-top:14px;font-size:13px;border:1px solid}
.banner.ok{background:var(--okbg);border-color:var(--okline);color:var(--ok)}
.banner.warn{background:var(--warnbg);border-color:var(--warnline);color:var(--warn)}
.banner.block{background:var(--blockbg);border-color:var(--blockline);color:var(--block)}
.banner b{color:inherit}
.composer{border-top:1px solid var(--line);padding:15px 22px;display:flex;gap:12px;background:var(--surface)}
.composer input{flex:1;border:1px solid var(--line-2);border-radius:12px;padding:12px 16px;font-size:14px;background:var(--surface);color:var(--ink)}
.composer input::placeholder{color:var(--faint)}
.send{padding:0 22px}
.foot{font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:var(--muted);text-align:center;padding:9px;border-top:1px solid var(--line);background:var(--band)}

/* Audit trail rail */
.audit .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin-bottom:12px;overflow:hidden;box-shadow:var(--shadow)}
.audit .hd{display:flex;justify-content:space-between;align-items:center;padding:10px 13px;border-bottom:1px solid var(--line)}
.verdict{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;padding:3px 9px;border-radius:6px}
.v-ok{background:var(--okbg);color:var(--ok);border:1px solid var(--okline)}
.v-partial{background:var(--warnbg);color:var(--warn);border:1px solid var(--warnline)}
.v-block{background:var(--blockbg);color:var(--block);border:1px solid var(--blockline)}
.audit .tm{font-size:11px;color:var(--muted)}
.audit .bd{padding:11px 13px;font-size:12.5px;color:var(--ink-2)}
.audit .bd b{color:var(--ink)} .audit .bd .r{margin-top:5px}

.mode{position:fixed;right:14px;bottom:10px;font-family:var(--mono);font-size:10px;color:var(--warn);
  background:var(--warnbg);border:1px solid var(--warnline);border-radius:6px;padding:4px 9px}

/* Governed tool steps — chips shown while the assistant uses tools. */
.msg.a .tools{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 8px}
.toolchip{font-family:var(--mono);font-size:11px;padding:3px 9px;border-radius:999px;
  background:var(--surface);border:1px solid var(--line);color:var(--ink-2)}
.toolchip[data-status="running"]{opacity:.75}
.toolchip[data-status="done"]{border-color:var(--ok,#2c8a5b);color:var(--ok,#2c8a5b)}
.toolchip[data-status="blocked"]{border-color:var(--warnline,#b04a4a);color:var(--warn,#b04a4a)}
.toolchip[data-status="error"]{border-color:var(--warnline,#b58a2a);color:var(--warn,#b58a2a)}

/* ─────────────────────────────────────────────────────────────────────────
   Responsive — reduced form factors (tablet + phone). The 3-column console
   collapses to a single scrolling column (chat first, then tools, then audit),
   the top chrome wraps, and the login form stays comfortably readable.
   ───────────────────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  /* Top chrome: wrap instead of overflowing; drop the non-essential context label. */
  .top { height: auto; flex-wrap: wrap; padding: 10px 14px; gap: 10px; }
  .ctx { display: none; }
  .who .rl { display: none; }

  /* Console: single column, natural height, page scrolls. Chat first. */
  .wrap { display: flex; flex-direction: column; height: auto; min-height: calc(100vh - 56px); }
  .center { order: -1; min-height: 62vh; }
  .col { overflow: visible; padding: 16px 14px; }
  .left { border-right: 0; border-bottom: 1px solid var(--line); }
  .right { border-left: 0; border-top: 1px solid var(--line); }

  .chat { padding: 16px 14px; }
  .msg.user .b { max-width: 88%; }
  .composer { padding: 12px 14px; gap: 8px; }
  .send { padding: 0 16px; }
}

@media (max-width: 520px) {
  /* Phone: tighter login, brand + hero already collapsed to the form pane. */
  .loginPane { padding: 28px 18px; }
  .loginTitle { font-size: 22px; }
  .ssoRow { gap: 8px; }
  .ssoBtn { padding: 12px 6px; font-size: 12px; }
  .heroTitle { font-size: 30px; }
}

/* ── Multi-agent surface: grouped tools (folded by default) + per-tool access buttons ── */
.toolList .tgroup{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);margin-bottom:9px;overflow:hidden;box-shadow:var(--shadow)}
.toolList .tgroup-h{display:flex;align-items:center;gap:8px;padding:10px 12px;cursor:pointer;user-select:none}
.toolList .tgroup-h:hover{background:var(--surface-2,var(--band))}
.tgroup-name{font-weight:700;font-size:12.5px;color:var(--ink)}
.tgroup-count{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--muted);background:var(--band);border:1px solid var(--line);border-radius:20px;padding:1px 8px}
.tgroup-car{color:var(--muted);font-size:10px;transition:transform .15s}
.tgroup:not(.folded) .tgroup-car{transform:rotate(90deg)}
.tgroup-body{border-top:1px solid var(--line)}
.tgroup.folded .tgroup-body{display:none}
.tgroup-body .tool{border:0;border-bottom:1px solid var(--line);border-radius:0;margin:0;box-shadow:none}
.tgroup-body .tool:last-child{border-bottom:0}
.tool .d.danger{background:var(--danger)}
.tool .tool-nm{flex:1;min-width:0;font-size:12px;line-height:1.3;overflow-wrap:anywhere;font-family:var(--mono,monospace)}
.acc{flex:none;font-size:9px;font-weight:700;letter-spacing:.02em;border-radius:20px;padding:2px 8px;white-space:nowrap}
.acc.on{color:#166534;background:rgba(22,163,74,.10);border:1px solid rgba(22,163,74,.35)}
.acc.off{color:var(--muted);background:var(--band);border:1px solid var(--line)}

/* ══ Increment 2 — elegant multi-chat/task workspace (matches docs/mockups/control-chat-elegant.html) ══ */
.cw-app{display:grid;grid-template-columns:248px 1fr 320px;height:calc(100vh - 56px);background:#f6f8fb;color:#0f172a}
/* LEFT rail */
.cw-rail{background:#fbfcfe;border-right:1px solid #e6eaf0;display:flex;flex-direction:column;min-height:0}
.cw-newbtn{margin:12px;padding:9px 12px;border:1px solid #e6eaf0;border-radius:10px;background:#fff;font-weight:600;font-size:13px;display:flex;align-items:center;gap:8px;cursor:pointer;color:#0f172a}
.cw-newbtn:hover{border-color:#c9d3e0;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.cw-plus{width:18px;height:18px;border-radius:5px;background:#0b1f3a;color:#fff;display:grid;place-items:center;font-size:12px;line-height:1}
.cw-scroll{overflow:auto;padding:0 8px 12px;min-height:0}
.cw-sec{font-size:10.5px;letter-spacing:.13em;color:#94a3b8;text-transform:uppercase;padding:12px 8px 6px;font-weight:700}
.cw-list{display:flex;flex-direction:column;gap:2px}
.cw-item{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:9px;cursor:pointer;color:#334155;font-size:13px}
.cw-item:hover{background:#eef2f7}
.cw-item.active{background:#e7eefb;color:#12305a;font-weight:600}
.cw-item .cw-ic{width:15px;height:15px;flex:0 0 auto;color:#94a3b8}
.cw-item .cw-tt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-item .cw-st{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.cw-st.run{background:#f59e0b}.cw-st.done{background:#16a34a}.cw-st.wait{background:#94a3b8}
.cw-item .cw-appr{color:#b45309;font-style:normal;font-size:11px}
/* CENTER */
.cw-center{display:flex;flex-direction:column;min-width:0;min-height:0;background:#fff}
.cw-hd{padding:14px 22px;border-bottom:1px solid #e6eaf0;display:flex;align-items:center;gap:10px}
.cw-ti{font-weight:700;font-size:15px;color:#0f172a}
.cw-pill{font-size:10px;font-weight:700;letter-spacing:.05em;color:#166534;background:#ecfdf5;border:1px solid #a7f3d0;border-radius:999px;padding:2px 8px}
.cw-hd .cw-sp{flex:1}
.cw-model{border:1px solid #e6eaf0;border-radius:8px;padding:6px 8px;font-size:12px;background:#fff;color:#475569}
.cw-center .chat{flex:1;overflow:auto;padding:22px;min-height:0;background:#fff}
.cw-composer{border-top:1px solid #e6eaf0;padding:14px 18px;display:flex;gap:10px;background:#fff}
.cw-composer input{flex:1;border:1px solid #e6eaf0;border-radius:10px;padding:11px 13px;font-size:13.5px;outline:none;color:#0f172a;background:#fff}
.cw-composer input:focus{border-color:#2563eb}
.cw-send{background:#0b1f3a;color:#fff;border:none;border-radius:10px;padding:0 22px;font-weight:600;cursor:pointer}
.cw-send:disabled{opacity:.5;cursor:default}
.cw-foot{font-size:11px;color:#94a3b8;text-align:center;padding:8px;background:#fff}
/* RIGHT tabs */
.cw-side{background:#fbfcfe;border-left:1px solid #e6eaf0;display:flex;flex-direction:column;min-height:0}
.cw-tabs{display:flex;border-bottom:1px solid #e6eaf0;padding:0 8px}
.cw-tab{padding:12px 12px;font-size:12px;font-weight:600;color:#64748b;cursor:pointer;border-bottom:2px solid transparent}
.cw-tab.active{color:#0b1f3a;border-bottom-color:#0b1f3a}
.cw-hint{font-size:10.5px;color:#94a3b8;padding:4px 4px 10px}
/* tool groups (right pane) — mockup-exact */
.toolList .tgroup{margin-bottom:8px;border:1px solid #e6eaf0;border-radius:11px;overflow:hidden;background:#fff;box-shadow:none}
.toolList .tgroup-h{display:flex;align-items:center;gap:9px;padding:10px 11px;cursor:pointer}
.toolList .tgroup-h:hover{background:#f6f9fd}
.tgroup .cw-logo{width:19px;height:19px;border-radius:5px;display:grid;place-items:center;font-size:9.5px;font-weight:800;color:#fff;flex:0 0 auto}
.cw-lg-gov{background:#334155}.cw-lg-snow{background:#0b8a6b}.cw-lg-sf{background:#0d9dda}.cw-lg-other{background:#64748b}
.tgroup .tgroup-name{font-weight:700;font-size:12.5px;color:#0f172a}
.tgroup .tgroup-sub{font-size:10px;color:#94a3b8}
.tgroup .tgroup-count{margin-left:auto;font-size:10.5px;color:#64748b;background:#eef2f7;border:1px solid #e6eaf0;border-radius:999px;padding:1px 8px}
.tgroup .tgroup-car{color:#94a3b8;font-size:10px;transition:transform .15s}
.tgroup:not(.folded) .tgroup-car{transform:rotate(90deg)}
.tgroup-body{border-top:1px solid #e6eaf0}
.tgroup.folded .tgroup-body{display:none}
.tgroup-body .tool{display:flex;align-items:center;gap:8px;padding:8px 11px;border:0;border-bottom:1px solid #f1f5f9;border-radius:0;margin:0;box-shadow:none;background:#fff}
.tgroup-body .tool:last-child{border-bottom:0}
.tool .d{width:7px;height:7px;border-radius:50%;background:#16a34a;flex:0 0 auto}
.tool .d.danger{background:#dc2626}
.tool .tool-nm{flex:1;min-width:0;font-size:12px;line-height:1.3;overflow-wrap:anywhere;font-family:var(--mono,ui-monospace,Menlo,monospace);color:#0f172a}
.acc{flex:none;font-size:9.5px;font-weight:700;letter-spacing:.02em;border-radius:999px;padding:3px 9px;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.acc::before{content:"";width:6px;height:6px;border-radius:50%}
.acc.on{color:#166534;background:#ecfdf5;border:1px solid #a7f3d0}
.acc.on::before{background:#16a34a}
.acc.off{color:#64748b;background:#e2e8f0;border:1px solid #d7dee7}
.acc.off::before{background:#94a3b8}

/* Collapsible panels — full-width chat when the rail and/or tools are hidden */
.cw-app.rail-hidden{grid-template-columns:0 1fr 320px}
.cw-app.rail-hidden .cw-rail{display:none}
.cw-app.side-hidden{grid-template-columns:248px 1fr 0}
.cw-app.side-hidden .cw-side{display:none}
.cw-app.rail-hidden.side-hidden{grid-template-columns:0 1fr 0}
.cw-collapse{margin-left:8px;width:30px;height:28px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#e6eaf0;font-size:14px;line-height:1;cursor:pointer;display:inline-grid;place-items:center}
.cw-collapse:hover{background:rgba(255,255,255,.14)}

/* ══ Slice 1 — governed markdown rendering, tool trace, message toolbar ══════
   Everything here is theme-driven (theme.css vars) so light and dark both hold.
   Rendered agent output is produced by web/public/markdown.js, which escapes every
   leaf string — these rules style markup this product emits, never model HTML. */

/* The bubble now holds real blocks, so drop the pre-wrap used for plain text. */
.msg.a .b.md{white-space:normal}
.msg.a .b.md > :first-child{margin-top:0}
.msg.a .b.md > :last-child{margin-bottom:0}

.md-p{margin:0 0 10px}
.md-h{margin:16px 0 6px;line-height:1.3;color:var(--ink);font-weight:700}
.md-h1{font-size:18px}.md-h2{font-size:16px}.md-h3{font-size:15px}
.md-h4,.md-h5,.md-h6{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.md-hr{border:0;border-top:1px solid var(--line);margin:16px 0}
.md-link{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent}
.md-link:hover{border-bottom-color:currentColor}
.md-emoji{font-size:1.15em;line-height:1}

.md-ul,.md-ol{margin:0 0 10px;padding-left:20px}
.md-li{margin:0 0 4px}
.md-ul .md-ul,.md-ol .md-ol,.md-ul .md-ol,.md-ol .md-ul{margin:4px 0 0}
.md-task{list-style:none;margin-left:-20px;display:flex;align-items:flex-start;gap:8px}
.md-check{margin-top:3px;flex:0 0 auto}
.md-task-done > span{color:var(--muted);text-decoration:line-through}

.md-quote{margin:0 0 12px;border-left:3px solid var(--line-2);padding:2px 0 2px 13px;color:var(--ink-2)}
.md-quote .md-p:last-child{margin-bottom:0}
.md-callout{margin:0 0 12px;border-left:3px solid;border-radius:0 var(--r) var(--r) 0;padding:10px 13px}
.md-callout .md-p:last-child{margin-bottom:0}
.md-callout-note{border-color:var(--accent);background:var(--surface-2);color:var(--ink-2)}
.md-callout-ok{border-color:var(--ok);background:var(--okbg);color:var(--ink-2)}
.md-callout-warn{border-color:var(--warn);background:var(--warnbg);color:var(--ink-2)}
.md-callout-danger{border-color:var(--block);background:var(--blockbg);color:var(--ink-2)}

.md-code{font-family:var(--mono);font-size:12.5px;background:var(--surface-2);border:1px solid var(--line);
  border-radius:5px;padding:1px 5px;color:var(--ink)}
.md-pre{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin:0 0 12px;background:var(--surface)}
.md-pre-h{display:flex;align-items:center;gap:8px;padding:6px 11px;background:var(--surface-2);
  border-bottom:1px solid var(--line)}
.md-pre-lang{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.md-pre-wait{margin-left:auto;font-size:11px;color:var(--muted)}
.md-pre pre{margin:0;padding:11px 12px;overflow-x:auto}
.md-pre code{font-family:var(--mono);font-size:12.5px;line-height:1.65;color:var(--ink)}
.md-pre-partial{border-style:dashed}
.md-copy{margin-left:auto;font:inherit;font-size:11px;background:var(--surface);border:1px solid var(--line-2);
  color:var(--ink-2);border-radius:6px;padding:2px 9px;cursor:pointer}
.md-copy:hover{border-color:var(--accent);color:var(--ink)}
.md-source{margin:0;padding:12px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);
  font-family:var(--mono);font-size:12.5px;line-height:1.7;color:var(--ink-2);white-space:pre-wrap;overflow-x:auto}

.md-tablewrap{border:1px solid var(--line);border-radius:var(--r);overflow:auto;margin:0 0 4px;box-shadow:var(--shadow)}
.md-table{width:100%;border-collapse:collapse;font-size:13.5px}
.md-table th{position:sticky;top:0;text-align:left;background:var(--surface-2);color:var(--muted);
  font-family:var(--mono);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:9px 14px;white-space:nowrap}
.md-table td{padding:9px 14px;border-top:1px solid var(--line);color:var(--ink-2)}
/* md-num is tabular-figure styling ONLY — the renderer decides alignment per column (inline
   style="text-align:right" on genuine number columns). It must NOT set text-align itself, or a
   lone number in a mixed key/value column would right-align against its left-aligned neighbours. */
.md-table td.md-num{font-variant-numeric:tabular-nums;font-family:var(--mono);font-size:12.5px}
.md-more{display:inline-block;margin:8px 0 12px;font:inherit;font-size:12px;background:var(--surface);
  border:1px solid var(--line-2);color:var(--ink-2);border-radius:8px;padding:5px 11px;cursor:pointer}
.md-more:hover{border-color:var(--accent);color:var(--ink)}

/* Record / policy chips promoted out of plain text — click to copy. */
.md-chip{font-family:var(--mono);font-size:11.5px;border-radius:5px;padding:1px 6px;cursor:pointer;
  border:1px solid var(--line-2);background:var(--surface-2);color:var(--ink-2)}
.md-chip:hover{border-color:var(--accent);color:var(--ink)}
.md-chip-policy{border-style:dashed}

/* Message header + hover toolbar */
.msg.a .from{align-items:center}
.msg.a .from .from-nm{font-weight:600;color:var(--ink-2)}
.msg.a .from .from-sp{flex:1}
.msgbar{display:flex;gap:4px;opacity:0;transition:opacity .12s}
.msg.a:hover .msgbar,.msgbar:focus-within{opacity:1}
.msgbtn{font:inherit;font-size:11px;background:var(--surface);border:1px solid var(--line);color:var(--ink-2);
  border-radius:7px;padding:3px 9px;cursor:pointer}
.msgbtn:hover{border-color:var(--accent);color:var(--ink)}
.msgbtn.on{background:var(--surface-2);border-color:var(--accent);color:var(--ink)}

/* Governed tool trace — one row per tool call, collapsed unless something was blocked. */
.trace{margin:0 0 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface-2);overflow:hidden}
.trace.has-block{border-color:var(--blockline)}
.trace-h{display:flex;align-items:center;gap:8px;padding:7px 11px;cursor:pointer;user-select:none;
  font-size:12px;color:var(--ink-2);list-style:none}
.trace-h::-webkit-details-marker{display:none}
.trace-h::before{content:"▸";color:var(--muted);font-size:10px;transition:transform .15s}
.trace[open] .trace-h::before{transform:rotate(90deg)}
.trace-sum{font-weight:600}
.trace-b{list-style:none;margin:0;padding:2px 11px 9px}
.trace-row{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:12.5px;color:var(--ink-2)}
.trace-nm{font-family:var(--mono);font-size:12px;color:var(--ink)}
.trace-st{margin-left:auto;font-size:11.5px;color:var(--muted)}
.trace-dot{width:7px;height:7px;border-radius:50%;background:var(--muted);flex:0 0 auto}
.trace-row[data-status="run"] .trace-dot{background:var(--warn)}
.trace-row[data-status="ok"] .trace-dot{background:var(--ok)}
.trace-row[data-status="warn"] .trace-dot{background:var(--warn)}
.trace-row[data-status="block"] .trace-dot{background:var(--block)}
.trace-row[data-status="block"] .trace-st{color:var(--block);font-weight:600}

/* ══ Rail actions, approvals and toasts — P1–P3 surfaced ════════════════════
   Theme-driven so light and dark both hold. The approval sheet is the only
   modal in the surface; everything else is inline in the rail. */

/* Chat rows: pin marker + the ⋯ actions button that appears on hover. */
.cw-item{position:relative}
.cw-item .cw-pin{color:#2563eb;font-size:9px;line-height:1;flex:0 0 auto}
.cw-item .cw-more{opacity:0;flex:0 0 auto;width:20px;height:20px;border:0;border-radius:6px;background:transparent;
  color:#64748b;cursor:pointer;font-size:14px;line-height:1;display:grid;place-items:center}
.cw-item:hover .cw-more,.cw-item .cw-more:focus-visible{opacity:1}
.cw-item .cw-more:hover{background:#e2e8f0;color:#0f172a}

/* The row's action menu. */
.cw-menu{position:absolute;right:6px;top:28px;z-index:30;min-width:150px;background:#fff;border:1px solid #d7dee7;
  border-radius:9px;box-shadow:0 10px 26px rgba(15,23,42,.16);padding:4px;display:flex;flex-direction:column}
.cw-menu button{text-align:left;border:0;background:transparent;padding:7px 9px;border-radius:6px;font:inherit;
  font-size:12.5px;color:#0f172a;cursor:pointer}
.cw-menu button:hover{background:#f1f5f9}

/* Task rows: a gated item is a decision, not a chore — it reads differently. */
.cw-item.cw-gated{background:#fffaf0;border:1px solid #f0d9ae}
.cw-item.cw-gated:hover{background:#fff4e0}
.cw-st.appr{background:#b45309}
.cw-over{color:#b42318;font-style:normal;font-size:11px}
.cw-partial{font-size:11px;color:#8a5a12;background:#fdf4e3;border:1px solid #efdcae;border-radius:8px;
  padding:6px 9px;margin:2px 2px 8px}

/* Header badge — the count of decisions waiting on this person. */
.cw-badge{background:#fffaf0;border:1px solid #f0c9a0;color:#93370d;border-radius:999px;padding:5px 11px;
  font-size:12px;font-weight:700;cursor:pointer;margin-left:auto}
.cw-badge:hover{background:#fff1dc}

/* Approval sheet. */
.cw-sheet-wrap{position:fixed;inset:0;z-index:200;background:rgba(15,23,42,.45);display:grid;place-items:start center;
  padding-top:12vh}
.cw-sheet{width:min(560px,92vw);background:var(--surface,#fff);color:var(--ink,#0f172a);border-radius:13px;
  box-shadow:0 22px 50px rgba(15,23,42,.3);overflow:hidden}
.cw-sheet-h{display:flex;align-items:center;gap:9px;padding:14px 16px;border-bottom:1px solid var(--line,#e6eaf0)}
.cw-sheet-h strong{font-size:15px;flex:1;min-width:0}
.cw-risk{font-size:10.5px;font-weight:700;letter-spacing:.04em;background:var(--warnbg,#fdf4e3);
  color:var(--warn,#8a5a12);border:1px solid var(--warnline,#efdcae);border-radius:999px;padding:2px 9px}
.cw-sheet-x{border:0;background:transparent;color:var(--muted,#7a89a3);cursor:pointer;font-size:13px}
.cw-sheet-b{padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.cw-sheet-b p{margin:0;color:var(--ink-2,#43536e);font-size:13.5px}
.cw-kv{font-size:12.5px;color:var(--muted,#7a89a3)}
.cw-kv code{font-family:var(--mono,monospace);font-size:12px;background:var(--surface-2,#f8fafd);
  border:1px solid var(--line,#e6eaf0);border-radius:5px;padding:1px 6px;color:var(--ink,#0f172a)}
.cw-lbl{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#7a89a3)}
.cw-sheet-b textarea{width:100%;box-sizing:border-box;border:1px solid var(--line-2,#d3dbe8);border-radius:9px;
  padding:9px 11px;font:inherit;font-size:13px;background:var(--surface,#fff);color:var(--ink,#0f172a);resize:vertical}
.cw-sheet-f{display:flex;align-items:center;gap:9px;padding:13px 16px;border-top:1px solid var(--line,#e6eaf0);
  background:var(--surface-2,#f8fafd)}
.cw-sheet-note{font-size:11.5px;color:var(--muted,#7a89a3);flex:1;min-width:0}
.cw-btn{border:1px solid var(--line-2,#d3dbe8);background:var(--surface,#fff);color:var(--ink,#0f172a);
  border-radius:9px;padding:9px 15px;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.cw-btn:disabled{opacity:.55;cursor:default}
.cw-btn-go{background:#0f7a46;border-color:#0f7a46;color:#fff}
.cw-btn-go:hover:not(:disabled){filter:brightness(1.06)}

/* Toast — one plain sentence, never a status code. */
.cw-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:300;max-width:min(520px,92vw);
  background:#0f172a;color:#fff;border-radius:10px;padding:11px 16px;font-size:13px;
  box-shadow:0 12px 30px rgba(15,23,42,.35)}

/* ── Rail: section headers, the archive shelf, inline rename ───────────────
   Tokens only (see theme.css) so both themes follow without a second rule. */

/* The row is the menu's anchor — without this the actions menu escapes its chat. */
.cw-item{position:relative}

.cw-sec{display:flex;align-items:center;gap:8px}
.cw-sec>span:first-child{display:flex;align-items:center;gap:7px}
.cw-cnt{font-size:10px;letter-spacing:0;font-weight:700;color:var(--muted);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--pill);padding:1px 6px}
.cw-sec-act{margin-left:auto;border:0;background:transparent;font:inherit;font-size:10px;
  letter-spacing:.09em;font-weight:700;color:var(--muted);cursor:pointer;padding:2px 5px;border-radius:6px}
.cw-sec-act:hover{color:var(--ink);background:var(--surface-2)}
.cw-sec-act[aria-pressed="true"]{color:var(--accent);background:var(--surface-2)}

/* An archived chat reads as put away, not as a live conversation. */
.cw-item.cw-arch{opacity:.72}
.cw-item.cw-arch .cw-tt{text-decoration:none;font-style:italic}
.cw-item.cw-arch:hover{opacity:1}

/* Rename happens in the row itself — no browser dialog. */
.cw-rename{flex:1;min-width:0;font:inherit;font-size:13px;color:var(--ink);background:var(--surface);
  border:1px solid var(--accent);border-radius:7px;padding:3px 7px;outline:none}

/* A toast can carry one way back from what just happened. The toast keeps the fixed dark
   chrome of the rule above in both themes, so its action colour is literal by design. */
.cw-toast{display:flex;align-items:center;gap:14px}
.cw-toast-act{border:0;background:transparent;font:inherit;font-size:12.5px;font-weight:700;
  color:#9ec5ff;cursor:pointer;padding:2px 4px;border-radius:6px;white-space:nowrap}
.cw-toast-act:hover{text-decoration:underline}

/* ── Approval sheet: provenance, the change itself, dual control ───────────
   An approver reads this before they sign, so everything the platform sent is on screen. */
.cw-prov{font-size:11.5px;color:var(--muted);margin:-2px 0 10px}

.cw-ctx{border:1px solid var(--line);border-radius:10px;background:var(--surface-2);
  padding:8px 10px;margin:0 0 10px}
.cw-ctx-h{font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  color:var(--muted);margin-bottom:5px}
.cw-ctx-r{display:flex;gap:10px;align-items:baseline;padding:2px 0;font-size:12.5px}
.cw-ctx-k{flex:0 0 36%;color:var(--muted)}
.cw-ctx-v{flex:1;min-width:0;color:var(--ink);font-family:var(--mono);font-size:11.5px;
  word-break:break-word}

/* The dual-control state. A decision that releases the action is never a quiet one. */
.cw-dc{border-radius:10px;padding:8px 11px;margin:0 0 10px;font-size:12.5px;line-height:1.45}
.cw-dc-info{background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2)}
.cw-dc-warn{background:var(--warnbg);border:1px solid var(--warnline);color:var(--warn);font-weight:600}
.cw-dc blockquote{margin:6px 0 0;padding-left:9px;border-left:2px solid currentColor;
  font-weight:400;font-style:italic;opacity:.9}