:root{--bg:#FFFFFF;--side:#F6F7F9;--surface:#FFFFFF;--ink:#0F172A;--muted:#64748B;--line:#E2E8F0;--navy:#0F172A;--on-navy:#FFFFFF;--accent:#2F5BD3;--bad:#B42318;--r:12px;--on-accent:#fff;--graph:#0B1220}
@media (prefers-color-scheme:dark){:root{--bg:#0B0F17;--side:#10151F;--surface:#141B27;--ink:#F1F5F9;--muted:#94A3B8;--line:#232C3B;--navy:#F1F5F9;--on-navy:#0B0F17;--accent:#7FA2FF;--bad:#FF9B8A;--on-accent:#0B0F17}}
*{box-sizing:border-box}html,body{height:100%;margin:0}
body{font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink)}
button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.muted{color:var(--muted)}.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}
svg{flex:none}
.tile{display:inline-grid;place-items:center;border-radius:28%;color:#fff;flex:none}
.shell{display:grid;grid-template-columns:280px 1fr;height:100vh}.shell.has-panel{grid-template-columns:280px 1fr 320px}
.side{background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.side-top{display:flex;align-items:center;gap:8px;padding:14px}.sp{flex:1}
.ibtn{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center}
.ibtn:hover{background:var(--bg)}
.agents{flex:1;overflow:auto;padding:0 8px 8px}
.group{font-size:12px;color:var(--muted);padding:12px 10px 4px}
.agent{display:flex;gap:12px;align-items:center;width:100%;text-align:left;border:0;background:none;padding:8px 10px;border-radius:var(--r)}
.agent:hover{background:var(--bg)}.agent[aria-current=true]{background:var(--surface);box-shadow:inset 3px 0 0 var(--accent),0 0 0 1px var(--line)}
.agent b{display:block;font-weight:600;line-height:1.2}.agent small{display:block;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.acct{display:flex;gap:10px;align-items:center;margin:8px;padding:8px 10px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);width:calc(100% - 16px);text-align:left;position:relative}
.acct small{display:block;color:var(--muted);font-size:12px;line-height:1.2}
.pop{position:absolute;bottom:56px;left:8px;right:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:6px;z-index:8;box-shadow:0 4px 16px rgba(0,0,0,.12)}
.pop button,.menuitem{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:none;padding:8px 10px;border-radius:8px}
.pop button:hover{background:var(--side)}
.main{display:flex;flex-direction:column;min-height:0;min-width:0}
.bar{display:flex;align-items:center;gap:12px;padding:12px 24px;border-bottom:1px solid var(--line)}
.bar h1{font-size:16px;margin:0;font-weight:600}
.chip{display:inline-block;font-size:12px;padding:1px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:var(--surface)}
.chip.ok{color:var(--ink)}.chip.warn{color:var(--bad);border-color:var(--bad)}
.banner{padding:8px 24px;font-size:13px;border-bottom:1px solid var(--line);background:var(--surface);display:flex;gap:12px;align-items:center}
.body{flex:1;overflow:auto;padding:24px}.col{max-width:760px;margin:0 auto}.wide{max-width:1040px;margin:0 auto}
.msgs{display:flex;flex-direction:column;gap:12px}
.msg{max-width:78%;padding:10px 16px;border-radius:18px;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.user{align-self:flex-end;background:var(--accent);color:var(--on-accent)}.msg.agent{align-self:flex-start;background:var(--side)}
.msg small{display:block;margin-top:6px}
.link{border:0;background:none;color:var(--accent);padding:0;text-decoration:underline;text-align:left}
.composer{padding:12px 24px 20px}
.composer .col{display:flex;gap:8px;align-items:flex-end;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:8px 8px 8px 18px}
.composer textarea{flex:1;border:0;background:none;resize:none;max-height:160px;min-height:24px;padding:6px 0}.composer textarea:focus-visible{outline:none}
.send{width:38px;height:38px;border-radius:50%;border:0;background:var(--accent);color:var(--on-accent);display:grid;place-items:center}.send:disabled{opacity:.4}
.btn{padding:8px 16px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);display:inline-flex;gap:8px;align-items:center}
.btn.primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent);font-weight:500}.btn:disabled{opacity:.5;cursor:not-allowed}
.field{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
label.row{display:inline-flex;gap:6px;align-items:center;margin:0 14px 8px 0}
h2{font-size:15px;margin:26px 0 10px;font-weight:600}h2:first-child{margin-top:0}
.empty{text-align:center;margin-top:16vh}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.row2{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
/* passport panel */
.panel{border-left:1px solid var(--line);background:var(--side);overflow:auto;padding:18px}
.tabs{display:flex;gap:4px;margin:14px 0}.tabs button{flex:1;border:1px solid var(--line);background:var(--surface);padding:6px;border-radius:10px;font-size:13px}.tabs button[aria-selected=true]{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.kv{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
/* council room */
.room{display:grid;grid-template-columns:1fr 340px;gap:20px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}
.ptile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 8px;text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center}
.ptile.speaking{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.cap{margin-top:14px;background:var(--navy);color:var(--on-navy);border-radius:var(--r);padding:14px 18px;min-height:96px}
.rchat{display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow:auto}
.bub{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px 12px;font-size:14px;overflow-wrap:anywhere}
.plan li{margin:6px 0;list-style:none;display:flex;gap:8px;align-items:flex-start}
.notebody{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px}
/* brain */
.brain{display:grid;grid-template-columns:270px 1fr 300px;gap:0;flex:1;min-height:0}
.brain>div{overflow:auto;padding:16px}.brain>div+div{border-left:1px solid var(--line)}
.tree summary{cursor:pointer;font-size:12px;color:var(--muted);padding:8px 4px}
.tree .it{display:flex;gap:8px;align-items:center;width:100%;text-align:left;border:0;background:none;padding:5px 8px;border-radius:8px;font-size:14px}
.tree .it:hover,.tree .it[aria-current=true]{background:var(--side)}
.md h3{margin:18px 0 6px;font-size:16px}.md p{margin:8px 0}.md ul{padding-left:20px;margin:6px 0}
.wl{border:0;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);padding:0 5px;border-radius:5px;text-decoration:none}
.wl.dead{color:var(--muted);background:var(--side)}
.hover{position:fixed;z-index:20;max-width:300px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;box-shadow:0 4px 16px rgba(0,0,0,.18);font-size:13px;pointer-events:none}
.gwrap{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:8px 0}
/* modal and drawer */
.scrim{position:fixed;inset:0;background:rgba(10,20,40,.4);z-index:30;display:grid;place-items:center;padding:20px}
.modal{background:var(--bg);border-radius:16px;border:1px solid var(--line);width:min(860px,100%);max-height:90vh;overflow:auto;padding:22px}
.modal-h{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.appcard{display:flex;flex-direction:column;gap:8px}
.swatch{width:28px;height:28px;border-radius:8px;border:2px solid transparent}.swatch[aria-pressed=true]{border-color:var(--ink)}
.picker{display:flex;gap:6px;flex-wrap:wrap}.picker button{border:2px solid transparent;background:none;padding:2px;border-radius:12px}.picker button[aria-pressed=true]{border-color:var(--ink)}
.dscrim{position:fixed;inset:0;background:rgba(10,20,40,.35);z-index:10}
.drawer{position:fixed;top:0;bottom:0;left:0;width:310px;background:var(--side);border-right:1px solid var(--line);z-index:11;padding:14px;overflow:auto}
.drawer h3{font-size:12px;font-weight:500;color:var(--muted);margin:18px 10px 6px}
.ditem{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;background:none;padding:9px 10px;border-radius:10px;border-left:3px solid transparent;text-decoration:none;color:inherit}
.ditem small{display:block;color:var(--muted);font-size:12px;line-height:1.2}.ditem:hover{background:var(--bg)}.ditem[aria-current=true]{background:var(--bg);border-left-color:var(--accent)}
.dicon{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;flex:none}
.m-only{display:none}
@media (max-width:1180px){.shell.has-panel{grid-template-columns:280px 1fr}.panel{display:none}.brain{grid-template-columns:230px 1fr}.brain>div:last-child{display:none}.room{grid-template-columns:1fr}}
@media (max-width:760px){.shell,.shell.has-panel{grid-template-columns:1fr}.side{display:none}.m-only{display:block}.msg{max-width:92%}.brain{grid-template-columns:1fr}.brain>div:first-child{display:none}}
@media (prefers-reduced-motion:no-preference){.msg,.bub{animation:in .16s ease-out}@keyframes in{from{opacity:0;transform:translateY(4px)}}.ptile.speaking{animation:ring 1.6s ease-in-out infinite}@keyframes ring{50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 22%,transparent)}}}

.logo{font-weight:800;font-size:21px;letter-spacing:-.035em;color:var(--ink);display:inline-block;padding:0 2px 1px;border-bottom:3px solid var(--accent)}
.logo-tag{font-size:11px;font-weight:600;color:var(--on-accent);background:var(--accent);border-radius:6px;padding:1px 6px;letter-spacing:.02em}
.side-top{border-bottom:2px solid color-mix(in srgb,var(--accent) 35%,transparent)}
h2{border-left:3px solid var(--accent);padding-left:10px}
.gwrap.dark{background:var(--graph);border-color:#243A63;color:#CFE0FF}.gwrap.dark svg{display:block;max-height:68vh}
.ticker{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:3px;min-height:20px}
.steps li{list-style:none;margin:4px 0;display:flex;gap:8px;align-items:flex-start}
.feed{font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:4px;max-height:34vh;overflow:auto}
.risk-high{color:var(--bad);border-color:var(--bad)}.risk-medium{color:#B7791F;border-color:#B7791F}.risk-low{color:#1B7F79;border-color:#1B7F79}.risk-suspended{color:var(--muted)}
.bar-row{display:grid;grid-template-columns:150px 1fr 40px;gap:8px;align-items:center;font-size:13px;margin:4px 0}
.bar-row i{display:block;height:12px;border-radius:6px;background:var(--accent)}
.check{display:flex;gap:10px;align-items:center;margin:6px 0}.check .tick{width:20px;height:20px;border-radius:6px;border:1px solid var(--line);display:grid;place-items:center;flex:none}.check.done .tick{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.tbl-wrap{overflow:auto}.tbl-wrap td{font-size:14px;vertical-align:middle}
.pre{white-space:pre-wrap;overflow-wrap:anywhere;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:var(--side);border-radius:10px;padding:10px;margin-top:8px}

.appsbtn{display:flex;align-items:center;gap:12px;margin:8px 8px 0;padding:10px 12px;border-radius:var(--r);border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surface));text-align:left;width:calc(100% - 16px)}
.appsbtn small{display:block;color:var(--muted);font-size:12px;line-height:1.2}.appsbtn:hover{background:color-mix(in srgb,var(--accent) 18%,var(--surface))}
.badge{min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:12px;font-weight:600;display:inline-grid;place-items:center}
.quick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 2px}
.qbtn{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--surface);font-size:13px;text-align:left}.qbtn:hover{border-color:var(--accent)}
.screenwin{background:var(--graph);color:#CFE0FF;border:1px solid #243A63;border-radius:12px;overflow:hidden}
.screenbar{display:flex;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid #243A63;font-size:12px}
.screenbody{height:340px;overflow:auto;padding:10px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;display:flex;flex-direction:column;gap:6px}
.sline{display:grid;grid-template-columns:62px 82px 1fr;gap:6px;overflow-wrap:anywhere}.sline b{color:#7FA2FF;font-weight:600}.sline.k-denied b{color:#FF9B8A}.sline.k-write b,.sline.k-tool b{color:#6EE7B7}.sline .muted{color:#7F93B8}
.drop{display:flex;gap:8px;align-items:center;padding:10px;border:1px dashed var(--accent);border-radius:12px;font-size:13px;background:color-mix(in srgb,var(--accent) 6%,transparent)}.drop.over{background:color-mix(in srgb,var(--accent) 18%,transparent)}
.empty-card{max-width:560px;margin:8vh auto;text-align:center}.empty-card .row2{justify-content:center}
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:var(--bg)}.login-card{width:min(420px,100%);padding:26px}
.warn-text{color:var(--bad);font-size:13px}
.brain>div:first-child{padding-top:14px}

.avatar{display:inline-block;flex:none;line-height:0}.avatar svg{overflow:visible}
.stack{display:flex}.stack .avatar{margin-left:-10px}.stack .avatar:first-child{margin-left:0}
.lbox{display:inline-grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;flex:none}.lbox b{color:#0F172A}
.progress{height:8px;border-radius:99px;background:var(--line);overflow:hidden}.progress i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .4s ease}
.progress.hot i{background:#D92D20}.progress.dark{background:#243A63;border-radius:0;height:5px}
.meter{margin:8px;padding:10px 12px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);font-size:13px}
.plan{display:flex;flex-direction:column;gap:8px}.plan.current{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 25%,transparent)}
.plan .price{font-size:28px;font-weight:700;letter-spacing:-.02em}.plan .price small{font-size:14px;font-weight:400;color:var(--muted)}.plan ul{margin:0;padding-left:18px;font-size:14px;flex:1}
.wizard{width:min(980px,100%)}.preset{gap:10px}
.monitor{background:var(--graph);color:#CFE0FF;border:1px solid #243A63;border-radius:12px;overflow:hidden}
.monhead{display:flex;gap:12px;align-items:center;padding:10px 12px;border-bottom:1px solid #243A63}
.monbody{height:240px;overflow:auto;padding:10px 12px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;display:flex;flex-direction:column;gap:5px}
.mbar{display:none;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--side)}
.appsbtn{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}.appsbtn small{color:inherit;opacity:.85}.appsbtn:hover{background:color-mix(in srgb,var(--accent) 88%,#000)}
.appsbtn .chip{background:rgba(255,255,255,.2);color:inherit;border-color:rgba(255,255,255,.4)}
@media (max-width:760px){.mbar{display:flex}}
.av .blink,.av .look,.av .mouth,.av .ring{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){
.av .halo{opacity:0;transform-origin:24px 24px}.av.thinking .halo{animation:halo 1.4s ease-out infinite}
.av .blink{animation:blink 5.5s infinite;animation-delay:var(--bd,0s)}
.av.thinking .blink{animation:blink 3s infinite}.av.thinking .look{animation:look 1.8s ease-in-out infinite}
.av.thinking .mouth{animation:talk .45s ease-in-out infinite alternate}.av.thinking .m-flat{animation-name:talkx}
.av.thinking .ring{transform-origin:24px 24px;transform-box:view-box;animation:spin 3.2s linear infinite}
.av.float{animation:float 4.5s ease-in-out infinite}.avatar:hover .av{transform:rotate(-5deg) scale(1.06);transition:transform .2s}
@keyframes halo{0%{opacity:.7;transform:scale(.9)}100%{opacity:0;transform:scale(1.25)}}
@keyframes blink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.08)}}
@keyframes look{0%,100%{transform:translateX(0)}30%{transform:translateX(-2px)}70%{transform:translateX(2px)}}
@keyframes talk{from{transform:scaleY(.55)}to{transform:scaleY(1.35)}}@keyframes talkx{from{transform:scaleX(.55)}to{transform:scaleX(1.15)}}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}}

.rbox{display:grid;gap:8px}.rbox .field{width:100%}
.reader{border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:10px 0;background:var(--surface);color:var(--ink)}
.rbar{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--side);border-bottom:1px solid var(--line);font-size:12px}
.rdots i{width:8px;height:8px;border-radius:50%;background:var(--line);display:inline-block;margin-right:4px}
.rurl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:2px 8px}
.rbody{padding:12px;font-size:13px;min-height:84px}
@media (prefers-reduced-motion:no-preference){.rbody.reading{animation:rd 1.6s ease-in-out infinite}@keyframes rd{50%{background:color-mix(in srgb,var(--accent) 6%,transparent)}}}
.pflow{font-size:13px;border-left:3px solid var(--accent);padding:2px 0 2px 10px;margin:8px 0}
.pfacts{margin:0 0 10px;padding-left:18px;font-size:12px;color:var(--muted)}.pfacts li{margin:2px 0}
.chan{margin-bottom:14px}.cmsgs{max-height:340px;overflow:auto;display:grid;gap:10px;padding:4px 0}
.cmsg{display:flex;gap:10px;align-items:flex-start}.cdot{width:28px;height:28px;border-radius:50%;background:var(--line);flex:none}
.ctext{white-space:pre-wrap;word-break:break-word;font-size:14px}.cmsg.system .ctext{color:var(--muted);font-style:italic}


/* --- v14 polish: enterprise look, motion --- */
.card { border-radius: 14px; box-shadow: 0 1px 2px rgba(15,39,64,.06); transition: transform .15s ease, box-shadow .15s ease; }
.card:hover { box-shadow: 0 8px 22px rgba(15,39,64,.10); }
.hero { background: linear-gradient(135deg, #0F2740 0%, #2F5BD3 100%) !important; color: #fff !important; border: 0 !important; }
.hero h2 { color: #fff !important; }
.hero .muted { color: rgba(255,255,255,.78) !important; }
.chip { border-radius: 999px; }
.btn { border-radius: 10px; transition: transform .12s ease, filter .12s ease; }
.btn:hover { filter: brightness(1.05); }
.btn:active { transform: translateY(1px); }
.cmsg { border-radius: 10px; transition: background .2s ease; }
.ptile.speaking { animation: cfaPulse 1.4s ease-in-out infinite; }
@keyframes cfaPulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.06); opacity: .82; } }
.gwrap svg circle { transition: r .25s ease; }
.modal, .scrim, .drawer, .hover { animation: cfaFade .22s ease; }
@keyframes cfaFade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.tile { border-radius: 9px; }
.field, textarea.field, select.field { border-radius: 10px; }
.side, .drawer { backdrop-filter: blur(6px); }


/* --- v15 design system: tokens, skeletons, empty states, view motion --- */
:root { --rad: 12px; --rad-sm: 8px; --shadow-1: 0 1px 2px rgba(15,39,64,.06); --shadow-2: 0 8px 22px rgba(15,39,64,.10);
        --fs-xs: 11px; --fs-sm: 13px; --fs-md: 15px; --fs-lg: 20px; --fs-xl: 26px; }
.card, .modal, .drawer { border-radius: var(--rad); }
.btn, .field, textarea.field, select.field, .chip { border-radius: var(--rad-sm); }
.skel { display:block; background: linear-gradient(90deg, rgba(140,160,200,.14) 25%, rgba(140,160,200,.32) 50%, rgba(140,160,200,.14) 75%);
        background-size: 200% 100%; animation: cfaShimmer 1.2s infinite; border-radius: var(--rad-sm); }
@keyframes cfaShimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.empty { text-align:center; padding:40px 12px; color: var(--muted, #7C8BA5); }
.empty svg { opacity:.45; margin-bottom:10px; }
.empty h3 { margin:4px 0; color: var(--text, #0F2740); }
.gwrap .skel { height: 520px; }


/* --- v17: brain rail (Obsidian-like) --- */
.it .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; display: inline-block; }
.it { display: flex; align-items: center; gap: 6px; }
.chip { white-space: nowrap; }
.chip.muted { opacity: .6; }

html { scroll-behavior: smooth; }
html { scroll-behavior: smooth; }


/* --- v19: overlay container for drawer and modals --- */
#overlay { position: fixed; inset: 0; z-index: 80; pointer-events: none; }
#overlay > * { pointer-events: auto; }
.modal, .scrim { animation: cfaFade .18s ease; }


/* --- v20: council boardroom --- */
.council-room { display: flex; flex-direction: column; gap: 14px; }
.council-head h2 { font-size: 20px; line-height: 1.35; }
.council-stage { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 14px; align-items: start; }
@media (max-width: 980px) { .council-stage { grid-template-columns: 1fr; } }
.council-board { position: sticky; top: 12px; }
.board-list { display: flex; flex-direction: column; gap: 8px; }
.board-tile { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel, #fff); cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.board-tile:hover { transform: translateY(-1px); box-shadow: var(--shadow-2); }
.board-tile.current { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.board-tile.speaking { animation: cfaPulse 1.4s ease-in-out infinite; }
.board-avatar { display: inline-flex; padding: 3px; border-radius: 50%; box-shadow: 0 0 0 2px var(--c, #2F5BD3); }
.board-meta { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.board-meta b { font-size: 14px; }
.board-meta .muted { font-size: 11px; }
.transcript-card { padding: 12px; }
.transcript { max-height: 52vh; overflow: auto; display: flex; flex-direction: column; gap: 10px; padding: 6px 2px; scroll-behavior: smooth; }
.turn { display: flex; gap: 10px; padding: 10px; border-radius: 12px; background: rgba(140,160,200,.08); }
.turn.latest { background: rgba(47,91,211,.10); box-shadow: inset 0 0 0 1px rgba(47,91,211,.25); }
.turn-body { min-width: 0; }
.turn-text { margin-top: 4px; white-space: pre-wrap; }
.turn.latest .turn-text:empty::after { content: '▍'; animation: cfaBlink 1s steps(2) infinite; }
@keyframes cfaBlink { 50% { opacity: 0; } }
.waiting { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 28px 0; }
.dots { display: flex; gap: 6px; }
.dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); opacity: .4; animation: cfaPulse 1.2s ease-in-out infinite; }
.dots i:nth-child(2) { animation-delay: .2s; }
.dots i:nth-child(3) { animation-delay: .4s; }
.resolution { padding: 18px; border-top: 3px solid var(--accent); }
.resolution h2 { margin-top: 14px; }
.stance-row { display: flex; align-items: center; gap: 10px; margin: 6px 0; }
.stance-bar { flex: 1; height: 10px; border-radius: 999px; background: rgba(140,160,200,.18); overflow: hidden; }
.stance-bar i { display: block; height: 100%; border-radius: 999px; transition: width .4s ease; }


/* --- v21: council polish --- */
.rise { animation: cfaRise .28s ease both; }
@keyframes cfaRise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.round-sep { display: flex; align-items: center; gap: 10px; margin: 14px 0 6px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted, #7C8BA5); }
.round-sep::before, .round-sep::after { content: ''; flex: 1; height: 1px; background: rgba(140,160,200,.28); }
.stance-move { animation: cfaFlip .35s ease; }
@keyframes cfaFlip { 0% { transform: scale(.9); opacity: .4; } 60% { transform: scale(1.04); } 100% { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .rise, .turn, .board-tile, .board-tile.speaking, .stance-move, .dots i, .modal, .drawer, .dscrim, .card.appcard { animation: none !important; }
  .turn.latest .turn-text:empty::after { animation: none !important; content: ''; }
}


/* --- v22: deep research --- */
.depth-card { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; text-align: left; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel, #fff); cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.depth-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-2); }
.depth-card.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.depth-card .muted { font-size: 11px; }
.research-run { padding: 14px; margin-bottom: 12px; border-left: 3px solid var(--accent); }
.research-head { padding: 14px; margin-bottom: 10px; }


/* --- v23: research agent browser --- */
.research-browser { padding: 12px; margin: 12px 0; }
.browser-bar { display: flex; align-items: center; gap: 10px; margin: 8px 0; padding: 6px 10px; border-radius: 999px; background: rgba(140,160,200,.14); }
.browser-dots { display: inline-flex; gap: 5px; }
.browser-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(140,160,200,.55); }
.browser-dots i:first-child { background: #E06C60; }
.browser-dots i:nth-child(2) { background: #E3B341; }
.browser-dots i:nth-child(3) { background: #4CAF7D; }
.browser-url { flex: 1; font-size: 11px; color: var(--muted, #7C8BA5); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.browser-page { padding: 10px 12px; border-radius: 10px; background: rgba(140,160,200,.08); min-height: 64px; }


/* --- v24: notifications --- */
.bell { position: relative; }
.bell .badge { position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #B5543C; color: #fff; font-size: 10px; line-height: 16px; text-align: center; }
.notif-item { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel, #fff); margin-bottom: 8px; cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; }
.notif-item:hover { transform: translateY(-1px); box-shadow: var(--shadow-2); }
.notif-item.read { opacity: .62; }


/* --- v25: deep research templates --- */
.mode-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin: 10px 0; }
.mode-card { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; text-align: left; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel, #fff); cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.mode-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-2); }
.mode-card.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.mode-card .muted { font-size: 11px; line-height: 1.4; }


/* --- v26: agent context menu + team pop-in --- */
.ctxscrim { position: fixed; inset: 0; z-index: 90; }
.ctxmenu { position: fixed; z-index: 91; min-width: 210px; background: var(--panel, #fff); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-2); padding: 6px; animation: cfaFade .12s ease; }
.ctxhead { padding: 6px 10px 8px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted, #7C8BA5); border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.ctxitem { display: block; width: 100%; text-align: left; padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; font: inherit; cursor: pointer; }
.ctxitem:hover { background: rgba(140,160,200,.16); }
.ctxitem.danger { color: #B5543C; }
.udot { width: 7px; height: 7px; border-radius: 50%; background: #B5543C; display: inline-block; margin-left: 6px; vertical-align: middle; }
.tsel-list { display: flex; flex-direction: column; gap: 6px; max-height: 220px; overflow: auto; margin-top: 10px; }
.tsel { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; cursor: pointer; }
.tsel:hover { background: rgba(140,160,200,.12); }