:root{--bg:#0f1115;--fg:#e6e6e6;--mut:#8a8f98;--acc:#4cc2ff}
body{margin:0;font:14px system-ui,sans-serif;background:var(--bg);color:var(--fg)}
.topbar{display:flex;gap:1rem;align-items:center;padding:.4rem .8rem;border-bottom:1px solid #222;position:sticky;top:0;background:var(--bg)}
.topbar nav a{color:var(--mut);margin-right:.6rem;text-decoration:none}.topbar nav a:hover{color:var(--fg)}
.sa-bar{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.sa-bar button{background:#1b1f27;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.3rem .6rem;cursor:pointer}
.sa-bar button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.sa-bar button[aria-pressed=true]{border-color:var(--acc);color:var(--acc)}
#sa-halo{width:12px;height:12px;border-radius:50%;background:var(--acc);opacity:calc(.2 + var(--lvl,0));transform:scale(calc(1 + var(--lvl,0)));transition:all .1s}
.sa-chatform{display:flex;gap:.3rem}.sa-chatform input{min-width:18rem;background:#14171d;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.3rem .5rem}
.sa-login input{width:9rem;background:#14171d;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.3rem}
.sa-transcript{font-size:13px;max-height:5rem;overflow:auto;padding:.2rem .8rem;color:var(--mut)}.sa-transcript .u{color:var(--fg)}.sa-transcript .a{color:var(--acc)}.sa-transcript .e{color:#ff7b7b}
main{padding:1rem}.muted{color:var(--mut)}
/* canvas page */
.canvas-page{height:100vh;display:flex;flex-direction:column;overflow:hidden}
.layout{display:grid;grid-template-columns:300px 1fr;flex:1;min-height:0}
.side{border-right:1px solid #222;padding:.5rem;overflow:auto;font-size:13px}.side-head{display:flex;gap:.3rem;align-items:center;margin-bottom:.4rem}
.dash-form{display:flex;gap:.3rem;margin:.3rem 0}.dash-form input{flex:1;background:#14171d;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.2rem}
.dash-list{display:flex;flex-direction:column;gap:.1rem;margin:.3rem 0 .6rem}.dash-list a{color:var(--mut);text-decoration:none;padding:.15rem .3rem;border-radius:4px}.dash-list a:hover,.dash-list a:focus-visible{color:var(--fg);background:#1b1f27}.dash-list a[aria-current=page]{color:var(--acc);font-weight:600}
.side select{background:#14171d;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.2rem}.side button{background:#1b1f27;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.2rem .5rem}
.activity .act{padding:.1rem 0;border-bottom:1px dotted #222;white-space:pre-wrap;word-break:break-word}.act.tool_call{color:#c9d1ff}.act.tool_result{color:var(--mut)}.act.assistant_delta,.act.assistant_message{color:var(--fg)}.act.wire_fired{color:#ffd27b}
.canvas{position:relative;overflow:auto;background:radial-gradient(#1a1e26 1px,transparent 1px) 0 0/24px 24px}
.win{position:absolute;display:flex;flex-direction:column;background:#14171d;border:1px solid #2a2f3a;border-radius:8px;box-shadow:0 6px 24px #0008;overflow:hidden;min-width:180px}
.win:focus-visible{outline:2px solid var(--acc)}.win[data-status=filling],.win[data-status=live]{border-color:#3b5a7a}.win[data-status=error]{border-color:#7a3b3b}.win.pulse{box-shadow:0 0 0 3px #ffd27b88}
.win-head{display:flex;gap:.4rem;align-items:center;padding:.25rem .5rem;background:#1b1f27;cursor:move;user-select:none}.win-title{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.win-kind{color:var(--mut);font-size:11px}
.win-actions button{background:none;border:none;color:var(--mut);cursor:pointer;padding:0 .2rem}.win-actions button:hover,.win-actions button:focus-visible{color:var(--fg)}.badge{font-size:10px;color:#ffd27b}
.win-body{flex:1;overflow:auto;padding:.4rem .6rem;min-height:0}.win[data-state=min] .win-body{display:none}
.win-resize{position:absolute;right:0;bottom:0;width:14px;height:14px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 50%,#444 50%)}
.html-frame{width:100%;height:100%;border:0;background:#fff}
.md h1,.md h2,.md h3{margin:.4rem 0}.md pre{background:#0c0e12;padding:.4rem;overflow:auto;border-radius:6px}.md code{background:#0c0e12;padding:0 .2rem;border-radius:3px}.md table{border-collapse:collapse}.md td,.md th{border:1px solid #333;padding:.15rem .4rem}.md img{max-width:100%}
.wires .wire-row{display:flex;gap:.4rem;align-items:center;padding:.15rem 0}.wire-form{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.4rem}.wire-form input,.wire-form select{background:#14171d;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.2rem}
.conn{margin-left:auto;color:var(--mut);font-size:12px}.conn[data-state=ok]{color:#7bd88f}
#sa-toasts{position:fixed;right:1rem;bottom:1rem;display:flex;flex-direction:column;gap:.4rem;z-index:1000}.toast{background:#1b1f27;border:1px solid #333;border-left:3px solid var(--acc);padding:.5rem .8rem;border-radius:6px;max-width:24rem}.toast.error{border-left-color:#ff7b7b}
.modal-backdrop{position:fixed;inset:0;background:#0009;display:grid;place-items:center;z-index:1001}.modal{background:#14171d;border:1px solid #333;border-radius:8px;padding:1rem;min-width:18rem}.modal-actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:.8rem}.modal button{background:#1b1f27;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.3rem .7rem}
/* board + settings */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:.8rem;overflow-x:auto}.col h2{font-size:13px;text-transform:uppercase;color:var(--mut)}.card{background:#14171d;border:1px solid #2a2f3a;border-radius:8px;padding:.6rem;margin-bottom:.6rem;font-size:13px}.card h3{margin:0 0 .3rem;font-size:14px}.card select{background:#1b1f27;color:var(--fg);border:1px solid #333}
.settings .setting{display:grid;grid-template-columns:14rem 1fr auto;gap:.4rem;align-items:center;margin:.4rem 0}.settings .setting small{grid-column:2;color:var(--mut)}.settings input{background:#14171d;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.3rem}.providers td,.providers th{padding:.2rem .6rem;text-align:left;border-bottom:1px solid #222}.ledger{font-size:12px;overflow:auto}
@media (max-width:800px){.layout{grid-template-columns:1fr}.side{max-height:35vh;border-right:0;border-bottom:1px solid #222}.sa-chatform input{min-width:10rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.pr-actions{display:flex;gap:.6rem;align-items:center;margin:.4rem 0}.pr-actions button{background:#1b1f27;color:var(--fg);border:1px solid #333;border-radius:6px;padding:.3rem .6rem}.diff{font-size:12px;max-height:40vh;overflow:auto;background:#0c0e12;padding:.4rem}.diff .add{color:#7bd88f}.diff .del{color:#ff7b7b}.diff .hunk{color:#8fb4ff}