@font-face{font-family:Archivo;src:url('/assets/archivo.woff2') format('woff2');font-display:swap}
:root{color-scheme:light;--accent:oklch(43% .077 174);--action:var(--accent);--selection-stroke:oklch(61% .067 174);--page:oklch(94% .012 230);--railbg:oklch(99% .003 220);--surface:oklch(99% .003 220);--border:oklch(90% .012 220);--border2:oklch(82% .022 210);--text:oklch(29% .023 210);--text2:oklch(37% .023 210);--text3:oklch(49% .02 210);--text4:oklch(59% .023 210);--name:var(--text);--node-sh:0 12px 18px -9px rgba(47,70,81,.24),0 4px 7px -4px rgba(47,70,81,.12),inset 0 1px 0 rgba(252,254,255,.9);--soft-sh:0 20px 42px -24px rgba(47,70,81,.23),0 5px 12px -7px rgba(47,70,81,.1);--ff:Archivo,system-ui,sans-serif;--green-bg:oklch(94% .037 167);--green-bd:oklch(84% .05 167);--green-fg:oklch(40% .075 167);--indigo-bg:oklch(94% .03 330);--indigo-bd:oklch(86% .05 330);--indigo-fg:oklch(42% .08 330);--bl-bg:oklch(94% .025 230);--bl-bd:oklch(85% .035 230);--bl-fg:oklch(40% .055 230)}
body{font-weight:400;-webkit-font-smoothing:antialiased}
.topbar{padding:34px 44px 16px;min-height:104px;gap:20px}
.crumbs{font-size:23px;font-weight:600;gap:14px;color:var(--text)}.crumbs .ic{color:var(--accent)}.crumbs .sep{color:var(--text4)}
.topright{font-size:14px;font-weight:500;gap:24px;color:var(--text2)}.demo-label{font-size:12px;color:var(--text3);font-weight:450;background:oklch(97% .009 220);border:1px solid var(--border);padding:9px 13px;border-radius:999px}
.rail,.agentlist,.chips{background:var(--railbg);border:1px solid oklch(99.5% .002 220);box-shadow:var(--soft-sh);border-radius:26px}
.rail{left:40px;width:88px;padding:28px 18px;gap:18px;bottom:36px}.rail .ico{border-radius:18px;opacity:1}.rail .ico svg{opacity:.65;width:42px;height:42px}.rail .ico.active svg{opacity:1}.rail .ico:hover{background:oklch(95% .025 175)}.rail .ico.active{background:oklch(92% .035 175)}
.agentlist{right:40px;width:420px;padding:30px 26px;gap:24px;bottom:36px}
.btn-add,.ad-btn{background:var(--accent);color:oklch(99% .004 175);border:1px solid transparent;border-radius:18px;font-weight:600;box-shadow:0 5px 10px -5px rgba(31,94,83,.3)}
.btn-add{padding:16px 22px;font-size:15px;justify-content:center}.btn-add:hover,.ad-btn:hover{filter:brightness(1.08)}
.search-l,.af-label{font-weight:550;font-size:13px;color:var(--text2)}.searchgroup{gap:10px}
.search input,.cp-search input,.af-input,.af-select{background:oklch(97% .008 225);border-color:var(--border);border-radius:14px;color:var(--text);font-size:14px;min-height:48px}
.search input::placeholder,.cp-search input::placeholder,.af-input::placeholder{color:var(--text4)}.search input:focus,.cp-search input:focus,.af-input:focus,.af-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(26,125,109,.12)}
.iconbtn,.btn-exp,.scroll-dn,.cp-scrolldn{background:var(--surface);color:var(--text2);border-color:var(--border);border-radius:14px;box-shadow:0 3px 6px -4px rgba(47,70,81,.18)}.iconbtn:hover,.btn-exp:hover,.scroll-dn:hover,.cp-scrolldn:hover{background:oklch(94% .014 225)}
.btn-exp{font-size:13px;font-weight:550;padding-inline:14px;min-height:46px}.iconbtn{width:42px;height:46px}
.row{background:transparent;border-radius:14px;padding:11px 8px;margin-bottom:4px;gap:7px}.row:hover{background:oklch(96% .018 180)}.row.sel{background:oklch(94% .027 175);box-shadow:inset 0 0 0 1px oklch(85% .052 175)}.row .nm{font-size:13px;font-weight:550}
.av{background:oklch(95% .015 200);box-shadow:none;overflow:hidden;color:var(--text3);font-weight:600}.av.s{width:32px;height:32px}.av img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none}.row .av{border:2px solid var(--surface);box-shadow:0 2px 4px rgba(47,70,81,.1)}
.badge{font-size:10px;font-weight:550;line-height:17px;padding:2px 8px;border:0}.b-vy{background:transparent;border:1px solid var(--border2);color:var(--text3)}
.chartwrap{padding-top:14px;padding-bottom:24px;margin-bottom:112px}
.cnode,.croot,.ccl{background:var(--surface);border:1px solid oklch(99.5% .002 220);border-radius:30px;box-shadow:var(--node-sh);width:188px;height:170px;padding:16px 18px;gap:7px;display:inline-flex;flex-direction:column;align-items:center;justify-content:center}
.cnode.clk:hover{outline:0;box-shadow:0 0 0 2px oklch(78% .064 175),var(--node-sh)}
.cnode .av,.croot .av{width:76px;height:76px;background:var(--surface);border:6px solid var(--surface);box-shadow:0 5px 10px -4px rgba(47,70,81,.3);overflow:hidden}
.cnode .nm,.croot .nm{font-weight:600;font-size:15px;line-height:20px;letter-spacing:-.15px}.cnode .badge,.croot .badge{font-size:10px;line-height:17px;padding:3px 11px}
.croot,.croot.plain{border:2px solid var(--selection-stroke);box-shadow:0 0 0 3px oklch(61% .067 174 / .045),var(--node-sh)}.croot .av{width:82px;height:82px}.croot .nm{font-size:16px}.croot.plain{background:var(--surface)}
.ccl{gap:12px;background:oklch(98% .006 220);border-radius:28px}.ccl::before{display:none}.ccl:hover{border-color:oklch(75% .07 175)}.ccl .cnt{font-size:15px;font-weight:600}.ccl .vall{font-size:12px;font-weight:550;color:var(--accent)}
.stack{padding-right:10px;margin-bottom:2px}.stack .pa2{width:40px;height:40px;border:3px solid var(--surface);margin-right:-13px;box-shadow:0 3px 6px -3px rgba(47,70,81,.25);overflow:hidden}.stack .pa2 img{width:100%;height:100%;object-fit:cover}.stack .more{width:38px;height:38px;border:3px solid var(--surface);background:oklch(94% .032 78);color:oklch(43% .045 78);font-size:10px;box-shadow:0 3px 6px -3px rgba(47,70,81,.2)}
.cpanel{background:var(--surface);border:1px solid var(--border);border-radius:26px;box-shadow:var(--soft-sh);padding:26px;gap:20px}.cp-head{font-size:14px;font-weight:600;opacity:1}.cp-foot{font-weight:550;padding:6px}.cp-list .row{gap:8px;min-height:50px}.cp-search input{border-radius:12px}
.conn{background:oklch(76% .025 200)}.tri{border-bottom-color:var(--accent)}
.chipsdock{bottom:34px}.chips{padding:13px 18px;gap:3px;border-radius:22px}.chip{background:oklch(94% .025 175);border:1px solid oklch(87% .037 175);padding:10px 12px;border-radius:13px;gap:8px}.chip .num{color:var(--text3);font-size:11px;font-weight:500}.chip .lbl{color:var(--text2);font-size:12px;font-weight:550}.chip .vy{background:var(--surface);color:var(--accent);font-size:10px;padding:0 6px}.chip[aria-pressed=false]{opacity:.48}.chip:hover{filter:brightness(.98)}
.agentdetail{border-radius:26px}.ad-head{padding:26px}.ad-title{font-size:17px;font-weight:600}.ad-body{padding:24px 26px;gap:24px}.ad-name{color:var(--text);font-weight:600;font-size:22px}.ad-mail{color:var(--text3);font-weight:400;margin-top:5px}.ad-id .av{width:78px;height:78px;background:var(--surface);border:5px solid var(--surface);box-shadow:0 5px 12px -5px rgba(47,70,81,.28)}.ad-close{color:var(--text3)}.ad-close:hover{background:oklch(94% .02 175)}
.ad-kpi{background:oklch(97% .009 220);border:0;border-radius:18px;padding:18px 20px;gap:6px}.ad-kpi .lbl{font-size:12px;font-weight:500}.ad-kpi .val{font-weight:600;color:var(--text);font-size:20px;letter-spacing:-.3px}.ad-kpi .chg{font-size:12px;font-weight:500}.chg.up{color:oklch(43% .087 164)}.chg.dn{color:oklch(46% .115 25)}
.ad-info{background:var(--surface);border-color:var(--border);border-radius:18px}.ad-info-head{background:oklch(97% .009 220);font-size:10px;letter-spacing:.07em;font-weight:600;padding:15px 18px}.ad-field{padding:14px 18px}.ad-field .k{font-weight:400;font-size:12px}.ad-field .v{font-weight:550;font-size:13px}
.ad-foot{padding:20px 26px 24px;background:var(--surface)}.ad-btn{font-size:15px;min-height:52px}.af-sec{font-size:12px;font-weight:600;color:var(--text3)}.af-group{gap:9px}.af-sup .af-input{background:oklch(95% .018 180)}
button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Keep the complete overview clear of the fixed role dock on shorter screens. */
.cnode,.croot,.ccl{height:auto;min-height:var(--node-h,170px);padding:var(--node-padding,16px) 16px;gap:var(--node-gap,7px)}
.cnode,.ccl{width:var(--node-w,188px)}
.cnode .av{width:var(--portrait-size,76px);height:var(--portrait-size,76px)}
.croot .av{width:var(--root-portrait-size,82px);height:var(--root-portrait-size,82px)}
.cnode .nm,.ccl .cnt{font-size:var(--node-type,15px)}.croot .nm{font-size:var(--root-type,16px)}
.stack .pa2{width:var(--stack-size,40px);height:var(--stack-size,40px)}

/* Content keeps its intrinsic size; the tree measures this complete box. */
.cnode>*,.croot>*,.ccl>*{flex-shrink:0}
.cnode .nm,.croot .nm{max-width:100%;white-space:normal;text-align:center;overflow-wrap:anywhere}
.cpanel{animation:none}
.cp-scrolldn{display:flex;visibility:hidden;flex-shrink:0}
.cp-scrolldn.show{visibility:visible}

/* Immediate, labelled navigation on pointer hover and keyboard focus. */
.rail .ico{position:relative}
.rail-tooltip{position:absolute;left:calc(100% + 16px);top:50%;transform:translate(4px,-50%);z-index:10;pointer-events:none;white-space:nowrap;padding:11px 15px;border-radius:11px;background:var(--text);color:var(--surface);font:550 13px/18px var(--ff);box-shadow:0 5px 15px oklch(29% .023 210 / .15);opacity:0;visibility:hidden;transition:opacity .14s ease,transform .14s ease,visibility .14s}
.rail .ico:is(:hover,:focus-visible):not(.tooltip-dismissed) .rail-tooltip{opacity:1;visibility:visible;transform:translate(0,-50%)}
body:has(.demo-notice[open]) .rail-tooltip{opacity:0;visibility:hidden}
.demo-notice{position:fixed;inset:0;margin:auto;width:440px;max-width:calc(100% - 48px);padding:36px;border:1px solid var(--border);border-radius:28px;background:var(--surface);color:var(--text);box-shadow:0 24px 64px -20px oklch(29% .023 210 / .3)}
.demo-notice::backdrop{background:oklch(21% .02 210 / .26)}
.demo-notice h2{margin:0;padding-right:24px;font:600 27px/1.2 var(--ff);letter-spacing:-.5px}
.demo-notice p{margin:16px 0 30px;color:var(--text3);font-size:15px;line-height:1.6}
.demo-notice-x{position:absolute;top:14px;right:14px;width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:12px;background:transparent;color:var(--text3)}
.demo-notice-x svg{width:20px;height:20px}.demo-notice-x:hover{background:var(--page)}
.demo-notice-dismiss{min-height:48px;padding:12px 20px;border:0;border-radius:14px;background:var(--accent);color:var(--surface);font:550 14px/20px var(--ff)}
.demo-notice-dismiss:hover{filter:brightness(1.08)}
.row .nm .search-match{font-weight:800;color:var(--text)}
