/* WaliedCheetos - doc: TAQA design POC styles. Tokens follow the shared HERE/TAQA styling (index.css / sidebar.css):
   white panels, #3F444D text, #4A86FF accent, blue-teal gradient line, FiraGO / Segoe UI. Layout: header, map stage with a
   compact left sidebar + compact right options panel, and a docked, resizable bottom panel for all detail. */
:root{--bg:#fff;--bg2:#FAFCFD;--bg3:#F2F5F9;--tx:#3F444D;--tx2:#6d7178;--tx3:#9aa0a8;--line:#E3E8EF;--accent:#4A86FF;--accent2:#48DAD0;--grad:linear-gradient(90deg,#4A86FF,#48DAD0);
--ok:#1FA971;--warn:#E8A33D;--bad:#E05050;--info:#4A86FF;--T:#E8833A;--R:#4A86FF;--G:#9B59D0;--shadow:0 6px 24px rgba(30,45,70,.12);--r:10px;--dock-h:38vh;
--font:FiraGO,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
@media (prefers-color-scheme:dark){:root{--bg:#1C2028;--bg2:#222731;--bg3:#2A303B;--tx:#E6E9EE;--tx2:#AAB2BD;--tx3:#7C8591;--line:#343B47;--shadow:0 6px 24px rgba(0,0,0,.4)}}
*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:var(--font);font-size:13px;color:var(--tx);background:var(--bg);-webkit-font-smoothing:antialiased;overflow:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:6px 10px;transition:.15s}
button:hover{border-color:var(--accent)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.primary:hover{filter:brightness(1.07)}
button.ghost{border-color:transparent;background:transparent}button:disabled{opacity:.45;cursor:not-allowed}
.gradient-line{height:4px;background:var(--grad)}
/* WaliedCheetos - doc: Header */
#top{height:52px;display:flex;align-items:center;gap:14px;padding:0 14px;border-bottom:1px solid var(--line);background:var(--bg);position:relative;z-index:30}
#top img{height:26px}#top .sep{width:1px;height:26px;background:var(--line)}
#top h1{font-size:15px;font-weight:600;margin:0;white-space:nowrap}#top .sub{color:var(--tx2);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#top .grow{flex:1}#runBadge{flex:none}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:2px 9px;font-size:11px;font-weight:600;background:var(--bg3);color:var(--tx2);white-space:nowrap}
.badge.ok{background:rgba(31,169,113,.12);color:var(--ok)}.badge.warn{background:rgba(232,163,61,.15);color:#B8761A}.badge.bad{background:rgba(224,80,80,.12);color:var(--bad)}.badge.info{background:rgba(74,134,255,.12);color:var(--accent)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--tx3)}.dot.live{background:var(--ok);box-shadow:0 0 0 0 rgba(31,169,113,.6);animation:pulse 1.6s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(31,169,113,0)}100%{box-shadow:0 0 0 0 rgba(31,169,113,0)}}
/* WaliedCheetos - doc: Main column: stage (map) + dock */
#main{position:absolute;top:52px;left:0;right:0;bottom:0;display:flex;flex-direction:column}
#stage{position:relative;flex:1;min-height:160px}#map{position:absolute;inset:0}
#dock{height:var(--dock-h);min-height:42px;background:var(--bg);border-top:1px solid var(--line);display:flex;flex-direction:column;position:relative;z-index:20;box-shadow:0 -6px 18px rgba(30,45,70,.07)}
#dock.collapsed{height:42px!important}
#dock .handle{position:absolute;top:-5px;left:0;right:0;height:10px;cursor:ns-resize;z-index:2}
#dock .handle::after{content:"";position:absolute;left:50%;top:3px;width:44px;height:4px;border-radius:4px;background:var(--line);transform:translateX(-50%)}
#dock .handle:hover::after{background:var(--accent)}
.tabbar{display:flex;align-items:center;gap:2px;padding:0 10px;height:42px;border-bottom:1px solid var(--line);flex:none;overflow-x:auto;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tab{border:0;background:none;border-radius:0;padding:12px 12px 10px;color:var(--tx2);font-weight:500;border-bottom:2px solid transparent;white-space:nowrap;display:flex;gap:6px;align-items:center}
.tab:hover{color:var(--tx)}.tab.on{color:var(--tx);border-bottom-color:var(--accent)}.tab .cnt{font-size:10px;background:var(--bg3);border-radius:999px;padding:0 6px}
.tabbar .grow{flex:1}.tabbar .tools{display:flex;gap:4px;align-items:center}
.dockbody{flex:1;overflow:auto;padding:12px 14px}
.pane{display:none}.pane.on{display:block}
/* WaliedCheetos - doc: Floating panels over the map */
.panel{position:absolute;background:var(--bg);border-radius:var(--r);box-shadow:var(--shadow);z-index:10;display:flex;flex-direction:column;max-height:calc(100% - 24px);overflow:hidden}
#side{left:12px;top:12px;width:330px;bottom:12px}#side.min{bottom:auto}
#side .body{overflow:auto;padding:12px 14px;flex:1}
#side .hd{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--bg2);border-bottom:1px solid var(--line)}
#side .hd b{font-size:13px}
#opts{right:12px;top:12px;width:288px}
#opts .body{overflow:auto;padding:10px 12px}
.sect{margin:0 0 14px}.sect>h3{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--tx2);margin:0 0 8px;font-weight:600;display:flex;align-items:center;justify-content:space-between}
textarea.brief{width:100%;min-height:120px;resize:vertical;border:1px solid var(--line);border-radius:8px;padding:8px;background:var(--bg2);font-size:12px;line-height:1.45}
.row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.row.end{justify-content:flex-end}.muted{color:var(--tx2)}.small{font-size:11px}.tiny{font-size:10px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:7px 9px;min-width:0}
.card .k{font-size:10px;color:var(--tx2);text-transform:uppercase;letter-spacing:.04em}.card .v{font-size:16px;font-weight:600;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card .s{font-size:11px;color:var(--tx2);margin-top:1px}
.card.wide{grid-column:span 2}.card.accent{border-left:3px solid var(--accent)}
.steps{list-style:none;margin:0;padding:0}
.steps li{display:flex;gap:8px;align-items:flex-start;padding:5px 0;border-bottom:1px dashed var(--line)}
.steps li:last-child{border-bottom:0}.steps .ic{width:18px;height:18px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:10px;border:1.5px solid var(--line);color:var(--tx3);margin-top:1px}
.steps li.active .ic{border-color:var(--accent);color:var(--accent);animation:pulse2 1.4s infinite}.steps li.done .ic{background:var(--ok);border-color:var(--ok);color:#fff}.steps li.error .ic{background:var(--bad);border-color:var(--bad);color:#fff}
.steps li.gate .ic{border-radius:4px}.steps .t{font-weight:500}.steps .s{font-size:11px;color:var(--tx2)}
@keyframes pulse2{50%{box-shadow:0 0 0 4px rgba(74,134,255,.18)}}
/* WaliedCheetos - doc: Option rows (right panel) */
.opt{border:1px solid var(--line);border-radius:9px;padding:8px 10px;margin-bottom:7px;cursor:pointer;position:relative;transition:.15s}
.opt:hover{border-color:var(--accent)}.opt.on{box-shadow:0 0 0 2px var(--accent) inset;border-color:transparent}
.opt .nm{display:flex;align-items:center;gap:7px;font-weight:600}.opt .sw{width:12px;height:12px;border-radius:3px}
.opt .tag{font-size:11px;color:var(--tx2);margin:2px 0 4px}.opt .meta{display:flex;justify-content:space-between;font-size:11px;color:var(--tx2)}
.opt .role{position:absolute;right:8px;top:7px}.opt.na{opacity:.5;cursor:default}
.ibtn{width:17px;height:17px;border-radius:50%;padding:0;font-size:10px;font-weight:700;display:inline-grid;place-items:center;border:1px solid var(--line);color:var(--tx2);background:var(--bg)}
.pop{position:fixed;z-index:60;background:var(--bg);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:10px;padding:10px 12px;max-width:300px;font-size:12px;line-height:1.45}
.rec{background:linear-gradient(135deg,rgba(74,134,255,.08),rgba(72,218,208,.08));border:1px solid rgba(74,134,255,.25);border-radius:9px;padding:8px 10px;font-size:12px}
/* WaliedCheetos - doc: Map controls */
#viewbar{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:9;display:flex;gap:6px;align-items:center;background:var(--bg);border-radius:999px;box-shadow:var(--shadow);padding:5px 8px}
#viewbar select,#viewbar button{border-radius:999px;padding:4px 10px;font-size:12px}#viewbar .on{background:var(--accent);color:#fff;border-color:var(--accent)}
#legend{position:absolute;left:354px;bottom:12px;z-index:9;background:var(--bg);border-radius:9px;box-shadow:var(--shadow);padding:8px 10px;font-size:11px;min-width:170px}
#legend .bar{height:8px;border-radius:4px;margin:4px 0 2px}#legend .lbls{display:flex;justify-content:space-between;color:var(--tx2)}
#legend .it{display:flex;align-items:center;gap:6px;margin-top:3px}#legend .ln{width:18px;height:3px;border-radius:2px}
#layers{position:absolute;right:312px;bottom:12px;z-index:9;background:var(--bg);border-radius:9px;box-shadow:var(--shadow);padding:6px 8px;font-size:11px;display:flex;flex-direction:column;gap:3px}
#layers label{display:flex;gap:6px;align-items:center;cursor:pointer;white-space:nowrap}
#drawhint{position:absolute;top:58px;left:50%;transform:translateX(-50%);z-index:9;background:#3F444D;color:#fff;border-radius:999px;padding:6px 14px;font-size:12px;display:none}
/* WaliedCheetos - doc: Gate modal */
#gate{position:fixed;top:52px;left:0;right:0;bottom:0;z-index:40;display:none;align-items:center;justify-content:center;background:rgba(25,32,44,.28);backdrop-filter:blur(2px)}
#gate.on{display:flex}#gate .box{width:min(820px,94%);max-height:90%;display:flex;flex-direction:column;overflow:auto;background:var(--bg);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
#gate .gh{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}#gate .gh .who{display:flex;align-items:center;gap:8px}
#gate .gb{padding:14px 18px;overflow:auto;flex:1}#gate .gf{padding:12px 18px;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center;justify-content:flex-end;background:var(--bg2)}
.dec{display:grid;grid-template-columns:1fr 180px;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line);align-items:center}.dec .src{font-size:11px;color:var(--tx2)}
.dec select,.dec input,.inp{width:100%;border:1px solid var(--line);border-radius:7px;padding:6px 8px;background:var(--bg)}
.altpick{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.altpick label{border:1px solid var(--line);border-radius:10px;padding:10px;cursor:pointer;display:block}
.altpick label:has(input:checked){box-shadow:0 0 0 2px var(--accent) inset;border-color:transparent}.altpick .h{display:flex;gap:6px;align-items:center;font-weight:600}
/* WaliedCheetos - doc: Dock content */
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:12px}.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.box{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);min-width:0}.box h4{margin:0 0 8px;font-size:12px;font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:6px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:12px}
table.t{width:100%;border-collapse:collapse;font-size:12px}table.t th{text-align:left;font-weight:600;color:var(--tx2);font-size:11px;border-bottom:1px solid var(--line);padding:5px 6px;position:sticky;top:0;background:var(--bg)}
table.t td{padding:5px 6px;border-bottom:1px solid var(--line);vertical-align:top}table.t tr:hover td{background:var(--bg2)}table.t .n{text-align:right;font-variant-numeric:tabular-nums}
.scroll{max-height:260px;overflow:auto}.chk{display:flex;gap:8px;align-items:flex-start;padding:4px 0}.chk .st{flex:none;width:44px}
.empty{color:var(--tx2);padding:24px;text-align:center}.empty b{display:block;color:var(--tx);margin-bottom:4px}
svg text{font-family:var(--font)}.chart{width:100%;height:auto;display:block}
.hbar{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:12px}.hbar .lb{width:130px;flex:none;color:var(--tx2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hbar .tr{flex:1;height:10px;background:var(--bg3);border-radius:5px;overflow:hidden}.hbar .fl{height:100%;border-radius:5px}.hbar .vl{width:90px;text-align:right;font-variant-numeric:tabular-nums}
.st-TAQA_DOC{color:var(--ok)}.st-ASSUMED{color:#B8761A}.st-PENDING_TAQA{color:var(--bad)}.st-ILLUSTRATIVE{color:var(--G)}.st-CALCULATED{color:var(--accent)}
/* WaliedCheetos - doc: Agent Studio */
.studio{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);grid-template-rows:minmax(0,1fr);gap:12px;height:100%;min-height:240px}
#pane-studio.on{height:100%}
.studio .left{display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0}.studio .right{display:grid;grid-template-rows:minmax(0,44%) minmax(0,1fr);gap:8px;min-height:0}
.phases{display:flex;gap:3px}.phases .ph{flex:1;height:22px;border-radius:5px;background:var(--bg3);font-size:9.5px;display:flex;align-items:center;justify-content:center;color:var(--tx3);overflow:hidden;white-space:nowrap;position:relative}
.phases .ph.active{background:rgba(74,134,255,.15);color:var(--accent);font-weight:600}.phases .ph.active::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--grad);animation:sweep 1.2s linear infinite}
.phases .ph.done{background:rgba(31,169,113,.14);color:var(--ok)}.phases .ph.gate{border:1px dashed var(--tx3)}.phases .ph.gate.active{border-color:var(--warn);background:rgba(232,163,61,.15);color:#B8761A}
@keyframes sweep{0%{transform:scaleX(0);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}51%{transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
.graphwrap{position:relative;flex:1;min-height:220px;background:radial-gradient(ellipse at center,rgba(74,134,255,.06),transparent 70%);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.graphwrap svg{position:absolute;inset:0;width:100%;height:100%}
.counters{display:flex;gap:14px;font-size:11px;color:var(--tx2);flex-wrap:wrap}.counters b{color:var(--tx);font-size:13px}
.board{border:1px solid var(--line);border-radius:10px;padding:8px 10px;overflow:auto;max-height:100%}.board .ar{display:flex;gap:7px;align-items:center;padding:3px 0;font-size:12px;color:var(--tx3)}
.board .ar.on{color:var(--tx);animation:pop .5s}.board .ar .m{width:14px;height:14px;border-radius:4px;border:1.5px solid var(--line);flex:none;display:grid;place-items:center;font-size:9px}
.board .ar.on .m{background:var(--ok);border-color:var(--ok);color:#fff}.board .ar .by{margin-left:auto;font-size:10px;color:var(--tx3)}
@keyframes pop{0%{transform:scale(.97);background:rgba(72,218,208,.25)}100%{transform:none;background:none}}
.feed{border:1px solid var(--line);border-radius:10px;overflow:auto;padding:4px 8px;min-height:0}
.msg{display:flex;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.4}.msg:last-child{border-bottom:0}
.msg .av{width:30px;height:20px;border-radius:5px;flex:none;font-size:9px;font-weight:700;color:#fff;display:grid;place-items:center}
.msg .who{font-weight:600;font-size:11px}.msg.tool .tx{font-family:ui-monospace,Consolas,monospace;font-size:11px;color:var(--tx2)}.msg.finding .tx{color:#B8761A}.msg.error .tx{color:var(--bad)}.msg.handoff .tx{color:var(--tx2);font-style:italic}
.node-g{transition:opacity .3s}.node-g .halo{opacity:0}.node-g.active .halo{opacity:1;animation:halo 1.6s ease-out infinite}.node-g.active .spin{opacity:1;animation:spin 1.6s linear infinite}
.node-g .spin{opacity:0;transform-box:fill-box;transform-origin:center}
@keyframes halo{0%{r:30;opacity:.55}100%{r:52;opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}
.edge{stroke:var(--line);stroke-width:1.5;fill:none}.edge.hot{stroke:url(#eg);stroke-width:3}
.bubble{font-size:10.5px}
/* WaliedCheetos - doc: Map popups */
.maplibregl-popup-content{border-radius:10px!important;box-shadow:var(--shadow)!important;padding:10px 12px!important;background:var(--bg)!important;color:var(--tx);max-width:340px;font-size:12px}
.maplibregl-popup-tip{border-top-color:var(--bg)!important;border-bottom-color:var(--bg)!important}
.pp h5{margin:0 0 4px;font-size:13px;display:flex;gap:6px;align-items:center}.pp .kv{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:6px 0}.pp .kv span:nth-child(odd){color:var(--tx2)}
.pp .why{background:var(--bg2);border-left:3px solid var(--accent);padding:5px 8px;margin-top:6px;border-radius:0 6px 6px 0;font-size:11.5px}.pp .rule{font-size:10.5px;color:var(--tx2);margin-top:3px}
.pp .act{margin-top:6px;display:flex;gap:6px}.pp .act button{font-size:11px;padding:4px 8px}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#3F444D;color:#fff;padding:8px 14px;border-radius:8px;z-index:80;font-size:12px;box-shadow:var(--shadow)}
.toast.bad{background:var(--bad)}
@media (max-width:1100px){#side{width:290px}#opts{width:250px}#legend{left:312px}#layers{right:272px}.studio{grid-template-columns:1fr;grid-template-rows:auto;height:auto}#pane-studio.on{height:auto}.graphwrap{min-height:280px;flex:none}.studio .right{grid-template-rows:auto 320px}}
@media (max-width:760px){#side{width:calc(100% - 24px);bottom:auto;max-height:45%}#opts{display:none}#legend,#layers{display:none}#top .sub{display:none}}
/* WaliedCheetos - doc: Gate 2 sits low so the candidate layouts stay visible on the map while choosing. */
#gate.low{align-items:flex-end;padding-bottom:18px;background:rgba(25,32,44,.12);backdrop-filter:none}
