/* Quorum — session-tab UI */
:root {
  --bg:     #faf8f5;
  --raised: #fffdfa;
  --panel:  #f4f1ec;
  --border: #e3ddd3;
  --ink:    #1a1410;
  --muted:  #5b5247;
  --subtle: #9a9186;
  --accent: #c46b2a;
  --accent2:#a35015;
  --green:  #2f8f5b;
  --red:    #b3261e;
  --serif:  "Fraunces", Georgia, serif;
  --sans:   "DM Sans", system-ui, sans-serif;
  --mono:   "JetBrains Mono", ui-monospace, monospace;
  --r: 2px;
  --sl: 230px;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body { background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 14px; overflow: hidden; }

/* ── nav ───────────────────────────────────────────────────────────────── */
.nav { display:flex; align-items:center; gap:14px; height:46px; padding:0 18px; border-bottom:1px solid var(--border); background:var(--raised); flex-shrink:0; }
.brand { font-family:var(--serif); font-size:18px; font-weight:600; color:var(--accent); }
.nav-tag { font-family:var(--mono); font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--subtle); }
.nav-right { margin-left:auto; display:flex; align-items:center; gap:10px; }
.session-key { display:flex; align-items:stretch; height:27px; }
.session-key input { width:190px; border:1px solid var(--border); border-right:0; background:var(--panel); color:var(--ink); padding:5px 8px; outline:none; font:10px var(--mono); }
.session-key input:focus { border-color:var(--accent); }
.session-key button { border:1px solid var(--accent); background:transparent; color:var(--accent); padding:0 8px; cursor:pointer; font:8px var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.session-key button:hover { background:var(--accent); color:#fff; }
.key-state { font:8px var(--mono); color:var(--subtle); letter-spacing:.05em; white-space:nowrap; }
.key-state.ready { color:var(--green); }
.qwen-badge { font-family:var(--mono); font-size:8px; letter-spacing:.14em; text-transform:uppercase; padding:2px 8px; border:1px solid var(--border); color:var(--subtle); }
.health-dot { width:7px; height:7px; border-radius:50%; background:var(--subtle); }
.health-dot.ok { background:var(--green); }
.health-dot.err { background:var(--red); }

/* ── shell ──────────────────────────────────────────────────────────────── */
.shell { display:flex; flex-direction:column; height:calc(100vh - 46px); overflow:hidden; }

/* ── config strip ───────────────────────────────────────────────────────── */
.config-strip {
  flex-shrink:0; border-bottom:1px solid var(--border);
  background:var(--raised); padding:10px 18px 12px;
  display:flex; flex-direction:column; gap:9px;
  max-height:220px; overflow-y:auto;
}

/* header row: QUORUM brand + subtitle + mode toggle */
.cs-header { display:flex; align-items:baseline; gap:12px; }
.cs-brand {
  font-family:var(--serif); font-size:17px; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--accent);
  flex-shrink:0;
}
.cs-sub {
  font-family:var(--mono); font-size:8px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--subtle); flex:1;
}
.mode-toggle { display:flex; align-items:center; gap:6px; cursor:pointer; user-select:none; flex-shrink:0; margin-left:auto; }
.mode-label { font-family:var(--mono); font-size:8.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--subtle); }
.toggle-btn { font-family:var(--mono); font-size:8.5px; letter-spacing:.12em; text-transform:uppercase; padding:3px 9px; border:1px solid var(--border); background:transparent; color:var(--subtle); border-radius:var(--r); cursor:pointer; transition:background .12s, color .12s, border-color .12s; }
.toggle-btn.on { background:var(--accent); color:#fff; border-color:var(--accent); }

/* domain chips */
.dchips { display:flex; flex-wrap:wrap; gap:5px; }
.dchip {
  font-family:var(--mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase;
  padding:5px 9px; border:1px solid var(--accent); color:var(--accent);
  cursor:pointer; border-radius:var(--r); user-select:none;
  transition:background .1s, color .1s;
}
.dchip:hover { background:var(--accent); color:#fff; }
.dchip.sel { background:var(--accent); color:#fff; }
.dchip.locked { opacity:.45; cursor:not-allowed; pointer-events:none; }

/* question row (manual mode): input + button + opt fields on one line */
.question-row { display:flex; gap:8px; align-items:center; }
.question-input { flex:1; padding:8px 12px; border:1px solid var(--border); background:var(--panel); color:var(--ink); border-radius:var(--r); outline:none; font:inherit; font-size:14px; }
.question-input:focus { border-color:var(--accent); }
.question-input:disabled { opacity:.45; }

/* Decision brief and Auto settings share one compact row. */
.brief-options-row { display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:8px; }
.auto-opts-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }

/* countdown bar */
.countdown-bar {
  display:flex; align-items:center; gap:8px;
  background:var(--ink); color:#fff;
  padding:7px 12px; border-radius:var(--r);
  font-family:var(--mono); font-size:10px; flex-shrink:0;
}
.cd-main { font-size:11px; }
.cd-main strong { font-size:16px; color:var(--accent); margin:0 1px; }
.cd-hint { color:#aaa; font-size:9px; }
.cd-cancel {
  font-family:var(--mono); font-size:9px; padding:2px 7px;
  border:1px solid #555; background:transparent; color:#aaa;
  cursor:pointer; border-radius:var(--r); margin-left:4px;
}
.cd-cancel:hover { border-color:#fff; color:#fff; }

/* option labels */
.opt-label {
  font-family:var(--mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--subtle); display:inline-flex; align-items:center; gap:5px;
}
.opt-label input {
  width:56px; font-family:var(--mono); font-size:12px; padding:4px 6px;
  border:1px solid var(--border); background:var(--panel); color:var(--ink);
  border-radius:var(--r); outline:none;
}
.opt-label input:focus { border-color:var(--accent); }
.err-inline { font-size:11px; color:var(--red); }

/* key row */
.key-row { display:flex; align-items:center; gap:8px; }
.key-icon { font-family:var(--mono); font-size:12px; color:var(--subtle); flex-shrink:0; }
.key-field-wrap { position:relative; flex:1; min-width:0; display:flex; }
.key-input {
  flex:1; padding:6px 50px 6px 10px; border:1px solid var(--border);
  background:var(--panel); color:var(--ink); border-radius:var(--r);
  outline:none; font:var(--mono); font-size:11px; letter-spacing:.02em;
}
.key-input:focus { border-color:var(--accent); }
.key-show {
  position:absolute; right:0; top:0; bottom:0;
  font-family:var(--mono); font-size:8px; letter-spacing:.1em; text-transform:uppercase;
  padding:0 8px; border:none; border-left:1px solid var(--border);
  background:transparent; color:var(--subtle); cursor:pointer;
}
.key-show:hover { color:var(--ink); }
.provider-badge {
  font-family:var(--mono); font-size:8px; letter-spacing:.14em; text-transform:uppercase;
  padding:3px 8px; border:1px solid var(--border); color:var(--subtle);
  border-radius:var(--r); flex-shrink:0; white-space:nowrap; transition:all .15s;
}

/* ── main area ──────────────────────────────────────────────────────────── */
.main-area { display:flex; flex:1; min-height:0; overflow:hidden; }

/* ── session list (left) ────────────────────────────────────────────────── */
.session-list { width:var(--sl); flex-shrink:0; border-right:1px solid var(--border); background:var(--raised); display:flex; flex-direction:column; overflow:hidden; }
.sl-head { padding:10px 13px 8px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:7px; flex-shrink:0; }
.sl-title { font-family:var(--mono); font-size:8px; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); flex:1; }
.sl-count { font-family:var(--mono); font-size:9px; padding:1px 6px; border:1px solid var(--border); color:var(--subtle); }
.sl-body { flex:1; overflow-y:auto; }
.sl-empty { padding:18px 13px; font-size:11.5px; color:var(--subtle); line-height:1.65; }

/* session items */
.si { padding:10px 13px 10px 16px; border-bottom:1px solid var(--border); cursor:pointer; transition:background .1s; position:relative; }
.si:hover { background:var(--panel); }
.si.active { background:var(--panel); }
.si.active::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--accent); }
.si-domain { font-family:var(--mono); font-size:7.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:3px; display:flex; align-items:center; gap:6px; }
.si-dot { width:5px; height:5px; border-radius:50%; display:inline-block; background:var(--subtle); }
.si-dot.running { background:var(--accent); animation:pulse 1.1s ease-in-out infinite; }
.si-dot.done { background:var(--green); }
.si-dot.error { background:var(--red); }
.si-issue { font-size:11px; color:var(--muted); line-height:1.4; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.55)} }

/* ── session viewer (right) ─────────────────────────────────────────────── */
.session-viewer { flex:1; min-width:0; display:flex; flex-direction:column; overflow:hidden; }

.sv-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; flex:1; gap:9px; color:var(--subtle); }
.sve-glyph { font-size:30px; color:var(--border); }
.sve-title { font-family:var(--serif); font-size:19px; color:var(--muted); }
.sve-sub { font-size:12px; text-align:center; line-height:1.7; max-width:300px; }

.sv-content { display:flex; flex-direction:column; flex:1; min-height:0; overflow:hidden; }

/* session header */
.sv-header { padding:11px 18px 10px; border-bottom:1px solid var(--border); background:var(--raised); flex-shrink:0; }
.svh-issue { font-family:var(--serif); font-size:15px; color:var(--ink); line-height:1.4; margin-bottom:5px; }
.svh-meta { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.svh-domain { font-family:var(--mono); font-size:7.5px; letter-spacing:.14em; text-transform:uppercase; padding:2px 7px; border:1px solid var(--accent); color:var(--accent); }
.svh-status { font-family:var(--mono); font-size:7.5px; letter-spacing:.1em; text-transform:uppercase; padding:2px 7px; border:1px solid var(--border); color:var(--subtle); }
.svh-status.running { border-color:var(--accent); color:var(--accent); }
.svh-status.done { border-color:var(--green); color:var(--green); }
.svh-status.error { border-color:var(--red); color:var(--red); }
.svh-bq { font-family:var(--mono); font-size:9px; color:var(--subtle); margin-left:auto; }

/* progress bar */
.sv-progress { padding:6px 18px 7px; flex-shrink:0; border-bottom:1px solid var(--border); background:var(--raised); }
.svp-track { height:3px; background:var(--panel); border-radius:var(--r); overflow:hidden; margin-bottom:4px; }
.svp-fill { height:100%; width:0; background:var(--accent); transition:width .4s; }
.svp-label { font-family:var(--mono); font-size:8.5px; color:var(--subtle); display:flex; align-items:center; gap:5px; }

/* stage tabs */
.stage-tabs { display:flex; border-bottom:1px solid var(--border); background:var(--raised); flex-shrink:0; overflow-x:auto; }
.stab {
  font-family:var(--mono); font-size:8.5px; letter-spacing:.12em; text-transform:uppercase;
  padding:9px 13px; border:none; border-bottom:2px solid transparent;
  background:transparent; color:var(--subtle); cursor:pointer; white-space:nowrap;
  transition:color .1s, border-color .1s;
}
.stab:hover { color:var(--muted); }
.stab.active { color:var(--accent); border-bottom-color:var(--accent); }
.stab.lit { color:var(--muted); }

/* stage content */
.stcontent { flex:1; overflow-y:auto; padding:16px 18px; }
.stcontent[style*="display:none"] { display:none !important; }

/* ── Questions stage ────────────────────────────────────────────────────── */
.stage-empty { font-size:12px; color:var(--subtle); padding:10px 0; }
.subq { border-bottom:1px solid var(--border); }
.subq:last-child { border-bottom:none; }
.sqhead { display:flex; align-items:flex-start; gap:7px; padding:8px 0; cursor:pointer; user-select:none; }
.sqhead:hover .sqtext { color:var(--ink); }
.sqcaret { color:var(--subtle); font-size:9px; margin-top:3px; transition:transform .14s; flex-shrink:0; }
.sqcaret.open { transform:rotate(90deg); }
.sqnum { font-family:var(--mono); font-size:9px; color:var(--accent); flex-shrink:0; }
.sqnum.g { color:var(--green); }
.sqtext { font-size:13px; color:var(--muted); flex:1; line-height:1.5; }
.sqstate { margin-left:auto; font-family:var(--mono); font-size:8px; color:var(--subtle); white-space:nowrap; flex-shrink:0; padding-left:8px; }
.sqstate.g { color:var(--green); }
.sqbody { display:none; font-size:12.5px; color:var(--muted); line-height:1.55; padding:0 0 10px 22px; white-space:pre-wrap; }
.sqbody.open { display:block; }

/* ── Orchestra stage ────────────────────────────────────────────────────── */
.hypo { padding:10px 13px; border-left:3px solid var(--accent); background:var(--panel); border-radius:var(--r); font-size:13px; color:var(--muted); line-height:1.55; margin-bottom:14px; }
.agents-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:9px; }
.agent { border:1px solid var(--border); border-radius:var(--r); padding:10px 12px; background:var(--bg); transition:border-color .2s; }
.agent.running { border-color:var(--accent); }
.agent.done { border-color:var(--green); }
.ahead { display:flex; align-items:center; gap:6px; cursor:pointer; margin-bottom:3px; }
.adom { font-family:var(--mono); font-size:8.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); }
.arole { font-family:var(--serif); font-size:13px; flex:1; }
.amodel { font-family:var(--mono); font-size:7px; padding:1px 4px; flex-shrink:0; }
.amodel.qwen, .amodel.configured { border:1px solid var(--accent); color:var(--accent); }
.astate { font-family:var(--mono); font-size:8px; color:var(--subtle); }
.astate.g { color:var(--green); }
.acaret { color:var(--subtle); font-size:8px; transition:transform .14s; }
.acaret.open { transform:rotate(90deg); }
.abody { display:none; margin-top:5px; }
.abody.open { display:block; }
.asum { font-size:12px; color:var(--muted); line-height:1.5; }
.agent ul { margin:5px 0 0; padding-left:13px; }
.agent li { font-size:11px; color:var(--muted); line-height:1.45; }

/* ── Coordinator stage ──────────────────────────────────────────────────── */
.blk { margin-bottom:12px; }
.blk b { display:block; font-family:var(--mono); font-size:8.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--subtle); margin-bottom:5px; }
.blk ul { padding-left:15px; }
.blk li { font-size:13px; color:var(--muted); line-height:1.5; margin-bottom:3px; }

/* ── Findings stage ─────────────────────────────────────────────────────── */
.finding { display:flex; gap:10px; padding:9px 0; border-bottom:1px solid var(--border); }
.finding:last-child { border-bottom:none; }
.finding-left { display:flex; flex-direction:column; align-items:center; gap:3px; flex-shrink:0; width:52px; }
.finding-dom { font-family:var(--mono); font-size:7.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); text-align:center; word-break:break-all; }
.finding-src { font-family:var(--mono); font-size:7px; color:var(--green); }
.finding-txt { font-size:12.5px; color:var(--muted); line-height:1.5; flex:1; }

/* ── Report stage ───────────────────────────────────────────────────────── */
.report-dl { margin-bottom:14px; }
.report { max-width:700px; }
.report h1 { font-family:var(--serif); font-size:21px; margin:.3em 0; }
.report h2 { font-family:var(--serif); font-size:16px; margin:1.2em 0 .3em; color:var(--accent2); }
.report h3 { font-family:var(--sans); font-size:14px; font-weight:600; margin:.9em 0 .2em; }
.report p, .report li { font-size:13.5px; line-height:1.65; color:var(--muted); }
.report ul { padding-left:18px; margin:.4em 0; }
.report code { font-family:var(--mono); font-size:11.5px; background:var(--panel); padding:1px 4px; border-radius:2px; }

/* ── Chat stage ─────────────────────────────────────────────────────────── */
.stchat { padding:0; display:flex; flex-direction:column; }
.chatlog { flex:1; overflow-y:auto; padding:14px 18px; display:flex; flex-direction:column; gap:9px; }
.chat-empty { margin:auto; text-align:center; color:var(--subtle); font-size:12px; }
.msg { max-width:96%; }
.msg.you { align-self:flex-end; }
.msg.you .b { background:var(--accent); color:#fff; padding:7px 11px; font-size:12.5px; border-radius:var(--r); }
.msg.ai .b { background:var(--panel); color:var(--ink); border:1px solid var(--border); padding:9px 12px; font-size:12.5px; white-space:pre-wrap; border-radius:var(--r); }
.msg .recall { font-family:var(--mono); font-size:8px; color:var(--subtle); margin-top:4px; }
.chat-foot { display:flex; gap:7px; padding:10px 18px; border-top:1px solid var(--border); flex-shrink:0; }
.chat-foot input { flex:1; padding:8px 11px; border:1px solid var(--border); background:var(--panel); color:var(--ink); border-radius:var(--r); outline:none; font:inherit; font-size:13px; }
.chat-foot input:focus { border-color:var(--accent); }
.chat-foot input:disabled { opacity:.4; }

/* ── shared ─────────────────────────────────────────────────────────────── */
.btn { font-family:var(--mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; padding:7px 12px; border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:var(--r); cursor:pointer; }
.btn:disabled { opacity:.45; cursor:not-allowed; }
.run-estimate { font-family:var(--mono); font-size:8.5px; color:var(--subtle); white-space:nowrap; }
.brief-toggle-row { display:flex; align-items:center; gap:9px; }
.brief-toggle { border:0; background:transparent; color:var(--accent); font:500 9px var(--mono); letter-spacing:.1em; text-transform:uppercase; cursor:pointer; padding:2px 0; }
.brief-toggle span { display:inline-block; transition:transform .15s; }
.brief-toggle[aria-expanded="true"] span { transform:rotate(180deg); }
.brief-hint { color:var(--subtle); font-size:11px; }
.brief-panel { margin-top:8px; padding:10px; border:1px solid var(--border); background:var(--raised); border-radius:var(--r); }
.brief-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.brief-grid label { color:var(--subtle); display:flex; flex-direction:column; gap:4px; font:8px var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.brief-grid input, .brief-grid select, .brief-grid textarea { width:100%; border:1px solid var(--border); background:var(--bg); color:var(--ink); padding:6px 7px; font:12px var(--sans); letter-spacing:normal; text-transform:none; outline:none; border-radius:var(--r); }
.brief-grid textarea { min-height:52px; resize:vertical; }
.brief-grid input:focus, .brief-grid select:focus, .brief-grid textarea:focus { border-color:var(--accent); }
.brief-actions { display:flex; align-items:center; gap:8px; margin-top:8px; }
.assumptions, .clarifications { margin-top:8px; font-size:11px; color:var(--muted); line-height:1.45; }
.assumptions b, .clarifications b { display:block; color:var(--subtle); font:8px var(--mono); letter-spacing:.1em; text-transform:uppercase; margin-bottom:3px; }
.clarification { padding:5px 0; border-top:1px solid var(--border); }
.clarification button { color:var(--accent); border:0; background:transparent; cursor:pointer; font:8px var(--mono); padding:0; }
@media (max-width:700px) { .brief-grid { grid-template-columns:1fr; } }
.run-controls { display:flex; gap:6px; padding:0 14px 9px; border-bottom:1px solid var(--border); }
.run-controls .btn { padding:4px 7px; font-size:7.5px; background:var(--panel); color:var(--accent); }
.run-controls .btn.danger { color:#a94435; border-color:#a94435; }
.dissent-card { border:1px solid var(--border); border-left:3px solid var(--subtle); padding:9px 11px; margin-bottom:8px; background:var(--panel); border-radius:var(--r); }
.dissent-card.disputed { border-left-color:#a94435; }
.dissent-card.supported { border-left-color:var(--green); }
.dissent-card .dc-id { font-family:var(--mono); font-size:8px; color:var(--accent); }
.dissent-card .dc-claim { font-size:12.5px; color:var(--muted); line-height:1.45; margin:4px 0; }
.dissent-card .dc-vote { font-size:11px; color:var(--muted); padding:3px 0; }
.spin { display:inline-block; width:8px; height:8px; border:1.5px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:sp .7s linear infinite; vertical-align:-1px; margin-right:4px; }
@keyframes sp { to { transform:rotate(360deg); } }