:root{
  --navy:#2F5AA8; --navy-2:#1B3768; --teal:#16A7B8; --teal-2:rgba(22,167,184,.14);
  --bg:#06090F; --surface:#0F1726; --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.06);
  --text:#F2F5FA; --muted:#A9B4C6; --faint:#6E7A8F;
  --no:#F08A8A; --no-bg:rgba(240,120,120,.08); --pol:#F2C979; --pol-bg:rgba(232,176,75,.08); --idea:#B7A9FF; --idea-bg:rgba(122,90,200,.12);
  --r:16px; --shadow:0 30px 60px -40px rgba(0,0,0,.8);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Inter Tight",system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
.mono,code,pre{font-family:"JetBrains Mono",ui-monospace,monospace}
.muted{color:var(--muted)} .tiny{font-size:12px} .hidden{display:none!important} .grow{flex:1}
h1{font-size:44px;letter-spacing:-.035em;font-weight:500;line-height:1.05}
h2{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:12px}

/* top bar */
.top{position:sticky;top:0;z-index:10;background:rgba(6,9,15,.72);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line)}
.topin{max-width:1480px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:14px}
.logo img{height:30px;display:block}
.tag{font-size:13px;color:var(--muted);border-left:1px solid var(--line);padding-left:14px}
.conn{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:var(--surface)}
.conn i{width:8px;height:8px;border-radius:50%;background:var(--faint)}
.conn.ok i{background:var(--teal)} .conn.err i{background:var(--no)}

.page{max-width:1480px;margin:0 auto;padding:24px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}

/* ask */
.ask{padding:28px 30px 22px;max-width:980px;margin:24px auto}
.askhead p{margin-top:8px;max-width:640px}
.lbl{display:block;font-size:13px;font-weight:600;color:var(--muted);margin:20px 0 6px}
textarea,select,input{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:11px 13px;outline:none;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;font-size:16px;line-height:1.5}
textarea:focus,select:focus,input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(10,130,145,.14)}
.examples{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.examples button{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:5px 12px;font-size:13px;color:var(--muted);cursor:pointer}
.examples button:hover{border-color:var(--teal);color:var(--teal)}
.row{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.field{min-width:180px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;padding:3px;background:var(--bg)}
.seg button{border:0;background:transparent;padding:7px 14px;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;color:var(--muted)}
.seg button.on{background:var(--surface);color:var(--navy);box-shadow:0 1px 3px rgba(20,33,58,.12)}
.seg button:disabled{opacity:.45;cursor:not-allowed}
.primary{border:0;cursor:pointer;background:linear-gradient(100deg,#16A7B8,#2F6FD0);color:#fff;font-weight:600;border-radius:999px;padding:12px 24px;transition:transform .15s,box-shadow .15s;box-shadow:0 10px 30px -10px rgba(22,167,184,.75)}
.primary:hover{transform:translateY(-1px)} .primary:disabled{opacity:.5;cursor:progress}
.ghost{border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer}
.ghost:hover{border-color:var(--teal);color:var(--teal)}
.hint{margin-top:12px;font-size:13px;color:var(--muted);min-height:20px}
.hint.err{color:var(--no)}

/* workspace */
.ws{display:grid;grid-template-columns:230px minmax(0,1fr) 340px;gap:18px;align-items:start}
.agents,.side .card{padding:18px}
.agents{position:sticky;top:74px}
.agents ul{list-style:none;display:flex;flex-direction:column;gap:4px}
.agent{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;transition:background .2s}
.agent .av{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff;flex:none}
.agent .nm{font-weight:700;font-size:14px;line-height:1.2}
.agent .rl{font-size:12px;color:var(--muted);line-height:1.25}
.agent .ct{margin-left:auto;font-size:12px;color:var(--faint)}
.agent.active{background:var(--teal-2)}
.agent.active .av{box-shadow:0 0 0 3px rgba(10,130,145,.25);animation:breathe 1.2s ease-in-out infinite}
@keyframes breathe{50%{box-shadow:0 0 0 6px rgba(10,130,145,.08)}}
.legend{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line-2);font-size:12px;color:var(--muted)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}
.dot.ok{background:var(--teal)} .dot.no{background:var(--no)} .dot.pol{background:var(--pol)}

.flow{padding:20px 22px;min-height:70vh}
.flowhead{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding-bottom:16px;border-bottom:1px solid var(--line-2)}
.flowhead h2{font-size:18px;color:var(--text);font-weight:700;margin:2px 0 0;line-height:1.35;max-width:720px}
.eyebrowless{font-size:13px}
.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.controls select{width:auto;padding:6px 8px;font-size:13px}
.toggle{font-size:13px;color:var(--muted);display:flex;gap:6px;align-items:center;cursor:pointer}
.toggle input{width:auto}

/* timeline */
.timeline{list-style:none;position:relative;margin-top:18px}
.timeline::before{content:"";position:absolute;left:15px;top:6px;bottom:6px;width:2px;background:var(--line-2)}
.node{position:relative;padding:0 0 14px 44px;animation:in .35s ease both}
@keyframes in{from{opacity:0;transform:translateY(6px)}}
.node .pin{position:absolute;left:5px;top:10px;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800;box-shadow:0 0 0 4px var(--surface)}
.node .box{border:1px solid var(--line);border-radius:10px;padding:11px 14px;background:var(--surface);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.node .box:hover{border-color:rgba(255,255,255,.2)}
.node.sel .box{border-color:var(--teal);box-shadow:0 0 0 3px rgba(10,130,145,.12)}
.node .meta{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--faint)}
.node .meta .who{font-weight:700;color:var(--muted)}
.node .ttl{font-weight:700;margin-top:2px}
.node .det{color:var(--muted);font-size:14px;margin-top:3px}
.node.read{padding-bottom:6px}
.node.read .box{padding:5px 12px;border-style:dashed;background:transparent}
.node.read .ttl{font-weight:500;font-size:13px;color:var(--muted);margin:0}
.node.read .meta{display:none}
.node.question .box{background:var(--surface);border-color:rgba(255,255,255,.16)}
.node.question .ttl{font-size:16px}
.node.ok .box{border-color:rgba(22,167,184,.45);background:rgba(22,167,184,.08)}
.node.no .box{border-color:rgba(240,120,120,.4);background:var(--no-bg)}
.node.pol .box{border-color:rgba(232,176,75,.4);background:var(--pol-bg)}
.node.reopen .box{border-color:rgba(232,176,75,.4);background:var(--pol-bg)}
.node.decision .box{border-color:rgba(122,90,200,.4);background:var(--idea-bg)}
.node.decision .det{font-style:italic;color:var(--idea)}
.opts{display:grid;gap:8px;margin-top:10px}
.opt{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:9px 11px;background:var(--surface)}
.opt .oid{font:600 12px "JetBrains Mono",monospace;color:var(--navy);background:var(--bg);border-radius:6px;padding:2px 7px}
.opt .otx{font-size:13px;color:var(--muted)}
.opt .ogain{font-size:12px;color:var(--muted);text-align:right;white-space:nowrap}
.opt .gbar{display:block;height:4px;border-radius:2px;background:var(--line-2);margin-top:4px;width:72px;margin-left:auto}
.opt .gbar i{display:block;height:100%;border-radius:2px;background:var(--teal)}
.opt.chosen{border-color:var(--teal);box-shadow:inset 3px 0 0 var(--teal)}
.opt.chosen .oid::after{content:" ✓";color:var(--teal)}
.opt.rejected{opacity:.55}
.why{margin-top:10px;font-size:13px;color:var(--text);border-left:3px solid var(--teal);padding:2px 0 2px 10px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.chip{font-size:12px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;background:var(--surface);color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{font:600 11px "JetBrains Mono",monospace;border-radius:6px;padding:2px 7px;background:var(--teal-2);color:var(--teal)}
.badge.no{background:rgba(240,120,120,.15);color:var(--no)} .badge.pol{background:rgba(232,176,75,.15);color:var(--pol)}
.empty{padding:40px 0;text-align:center}

/* side */
.side{display:flex;flex-direction:column;gap:18px;position:sticky;top:74px}
.stats dl{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.stats dt{font-size:12px;color:var(--muted)} .stats dd{font-size:26px;font-weight:500;letter-spacing:-.03em}
.bar{height:6px;border-radius:3px;background:var(--line-2);margin-top:14px;overflow:hidden}
.bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--navy),var(--teal));transition:width .4s}
.inspector #insp{font-size:13px}
.inspector .k{font-size:12px;color:var(--faint);margin-top:10px}
.inspector pre{font-size:11.5px;background:var(--bg);border:1px solid var(--line-2);border-radius:8px;padding:10px;white-space:pre-wrap;word-break:break-word;max-height:260px;overflow:auto;margin-top:4px}
.claims ul{list-style:none;display:flex;flex-direction:column;gap:10px;max-height:300px;overflow:auto}
.claims li{font-size:13px;border-left:3px solid var(--teal);padding:2px 0 2px 10px}
.claims li b{font:600 12px "JetBrains Mono",monospace;color:var(--navy)}
.foot{max-width:1480px;margin:0 auto;padding:18px 24px 30px;display:flex;justify-content:space-between;color:var(--faint);font-size:12px}

@media (max-width:1180px){.ws{grid-template-columns:1fr 320px}.agents{display:none}}
@media (max-width:820px){.ws{grid-template-columns:1fr}.side{position:static}.flowhead{flex-direction:column}.page{padding:14px}.ask{padding:20px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* dark editorial layer */
body{background:radial-gradient(90% 50% at 50% -10%,rgba(27,55,104,.45),transparent 60%),var(--bg);min-height:100vh}
.top{border-bottom-color:var(--line)}
.logo img{height:26px}
.navlink{font-size:14px;color:var(--muted)} .navlink:hover{color:var(--text)}
.ask{border-radius:22px;background:rgba(18,26,42,.62);backdrop-filter:blur(14px)}
.askhead h1{font-family:"Instrument Serif",serif;font-weight:400;font-size:56px;letter-spacing:-.02em}
textarea,select,input{background:rgba(255,255,255,.04)}
select option{background:#0F1726}
.seg{background:rgba(255,255,255,.05)} .seg button.on{background:rgba(255,255,255,.14);color:var(--text);box-shadow:none}
.ghost{background:transparent;border-color:var(--line);border-radius:999px} .ghost:hover{border-color:var(--teal);color:var(--teal)}
.examples button{background:rgba(255,255,255,.04);border-radius:999px}
.flowhead h2{font-weight:500;font-size:19px}
.node .pin{box-shadow:0 0 0 4px var(--surface)}
.node .box{transition:border-color .15s,box-shadow .15s,transform .2s}
.node .box:hover{transform:translateX(2px)}
.node.ok .pin{animation:stampIn .5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes stampIn{from{transform:scale(2);opacity:0}}
.node.ok .box{animation:okGlow 1.6s ease-out both}
@keyframes okGlow{from{box-shadow:0 0 0 0 rgba(22,167,184,.55)}to{box-shadow:0 0 0 14px rgba(22,167,184,0)}}
.opt .gbar i{animation:gbar 1s cubic-bezier(.2,.8,.2,1) both} @keyframes gbar{from{width:0}}
.opt .oid,.badge,.inspector pre{background:rgba(255,255,255,.06)}
.badge{color:var(--teal);background:var(--teal-2)}
.agent .av{border-radius:10px}
.claims li{animation:in .4s ease both}
code.ident{color:#BFEFF4;font-family:"JetBrains Mono",monospace;font-size:.86em;background:none;border:0;padding:0}
.katex{font-size:1.04em}
.node.question .ttl .katex,.flowhead h2 .katex{font-size:1.06em}
.conn{background:transparent}