:root{--void0:#07080d;--void1:#0d0f17;--void2:#161a28;--grid3:#2a3048;--grid4:#5c6684;--ink:#e6f1ff;--muted:#8a93ad;--cyan:#00f0ff;--magenta:#ff2e88;--volt:#c6ff3d;--ok:#3dffa8;--warn:#ffb020;--down:#ff4d5e;
--display:"Chakra Petch","Rajdhani",system-ui,sans-serif;--sans:"IBM Plex Sans",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--void0);color:var(--ink);font:15px/22px var(--sans)}
a{color:var(--cyan)}a:hover{color:var(--ink)}
h1,h2{font-family:var(--display);margin:0}
.wrap{max-width:1200px;margin:0 auto;padding:40px 24px 64px;display:flex;flex-direction:column;gap:56px}
.wrap.wide{max-width:1360px;padding-top:24px;gap:40px}
.label{font:500 12px/16px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.label.cyan{color:var(--cyan)}
header.top{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:24px;padding-bottom:32px;border-bottom:1px solid var(--grid3)}
header.top.slim{align-items:center;padding-bottom:20px}
.brand{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none}
.brand b{font:700 28px/1 var(--display);letter-spacing:-.01em}
.brand small{display:block;font:500 12px/16px var(--mono);letter-spacing:.12em;color:var(--cyan);margin-top:6px}
.mark{width:56px;height:56px;border:1px solid var(--cyan);display:flex;align-items:center;justify-content:center;clip-path:polygon(10px 0,100% 0,100% 100%,0 100%,0 10px)}
.act{transition:background .12s,color .12s}
.act:hover{background:var(--void2);color:var(--cyan)}
:focus-visible{outline:none;box-shadow:0 0 0 1px var(--cyan),0 0 18px rgba(0,240,255,.35)}
.btn{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 12px 0 6px;background:var(--void1);border:1px solid var(--grid4);border-radius:2px;color:var(--ink);cursor:pointer;font:inherit}
.btn .av{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:1px solid var(--cyan);background:var(--void0);color:var(--cyan)}
.navlink{display:flex;align-items:center;gap:6px;min-height:48px;padding:0 14px;color:var(--ink);text-decoration:none;font:500 12px var(--mono);letter-spacing:.12em}
.menu{position:absolute;right:0;top:calc(100% + 8px);z-index:5;min-width:200px;display:flex;flex-direction:column;background:var(--void2);border:1px solid var(--grid4)}
.menu[hidden]{display:none}
.menu a{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;color:var(--ink);text-decoration:none}
.menu a+a{border-top:1px solid var(--grid3)}
svg.i{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:square;flex:none}
.eyebrow{display:flex;flex-direction:column;gap:8px}
h1.page{font-size:40px;line-height:44px;font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
.tile{display:flex;flex-direction:column;background:var(--void1);border:1px solid var(--grid3);border-top:2px solid var(--c,var(--cyan));transition:border-color .14s}
.tile:hover{border-color:var(--grid4)}
.tile .main{flex-grow:1;display:flex;flex-direction:column;gap:20px;padding:24px 16px 20px;color:var(--ink);text-decoration:none}
.tile .main:hover{background:var(--void2)}
.tile .ico{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid var(--grid3);background:var(--void0);color:var(--c,var(--cyan))}
.tile .top{display:flex;justify-content:space-between;align-items:flex-start;color:var(--muted)}
.tile h2{font-size:22px;line-height:28px;font-weight:600}
.tile p{margin:6px 0 0;color:var(--muted)}
.tile .bar{display:flex;border-top:1px solid var(--grid3)}
.tile .bar>*{flex:1 1 0;min-height:48px;display:flex;align-items:center;justify-content:center;gap:6px;background:transparent;border:0;color:var(--ink);cursor:pointer;text-decoration:none;font:500 12px var(--mono);letter-spacing:.12em}
.tile .bar>*+*{border-left:1px solid var(--grid3)}
footer.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:24px;border-top:1px solid var(--grid3)}
.faq{position:fixed;inset:0;z-index:10;display:flex;justify-content:flex-end;background:rgba(7,8,13,.78)}
.faq[hidden]{display:none}
.faq .scrim{position:absolute;inset:0;background:transparent;border:0;cursor:default}
.faq aside{position:relative;width:100%;max-width:440px;height:100%;overflow-y:auto;background:var(--void1);border-left:1px solid var(--grid3);border-top:2px solid var(--c);padding:24px;display:flex;flex-direction:column;gap:24px}
.faq h2{font-size:28px;line-height:32px}
.faq .x{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--grid4);border-radius:2px;color:var(--ink);cursor:pointer}
.faq dl{margin:0}.faq dl>div{padding:16px 0;border-top:1px solid var(--grid3)}.faq dt{font-weight:600}.faq dd{margin:6px 0 0;color:var(--muted)}
/* monitor */
.panel{background:var(--void1);border:1px solid var(--grid3);border-top:2px solid var(--c,var(--cyan));padding:16px;display:flex;flex-direction:column;gap:16px}
.panel>.hd{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px}
.panel h2{font-size:22px;line-height:28px;font-weight:600}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,560px),1fr));gap:24px}
.stack{display:flex;flex-direction:column;gap:24px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.kpi{background:var(--void1);border:1px solid var(--grid3);padding:16px;display:flex;flex-direction:column;gap:8px}
.kpi.hero{border-color:var(--ok);box-shadow:0 0 18px rgba(61,255,168,.18);clip-path:polygon(12px 0,100% 0,100% 100%,0 100%,0 12px)}
.kpi.hero.bad{border-color:var(--down);box-shadow:0 0 18px rgba(255,77,94,.2)}
.kpi.hero .big{color:var(--ok)}.kpi.hero.bad .big{color:var(--down)}
.big{font:600 32px/36px var(--display);display:flex;align-items:center;gap:10px}.big small{font-size:16px;color:var(--muted);margin-left:4px}
.sub{font-size:13px;line-height:18px;color:var(--muted)}
.mono{font-family:var(--mono)}
.groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:0 8px;border-top:1px solid var(--grid3)}
.row:hover{background:var(--void2)}
.row b{font-weight:600;display:block}
.badge{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border:1px solid var(--ok);border-radius:2px;font:500 12px/16px var(--mono);letter-spacing:.12em;color:var(--ok);flex:none}
.badge.down{border-color:var(--down);color:var(--down)}.badge.warn{border-color:var(--warn);color:var(--warn)}.badge.na{border-color:var(--grid4);color:var(--muted)}
.meter{display:flex;flex-direction:column;gap:6px}.meter>div:first-child{display:flex;justify-content:space-between;gap:12px}
.track{position:relative;height:6px;background:var(--void2)}.fill{height:6px;background:var(--cyan)}.fill.volt{background:var(--volt)}
.tick{position:absolute;top:-3px;width:2px;height:12px;background:var(--warn)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.stats .v{font:600 22px/28px var(--display)}.stats .m{font:500 18px/26px var(--mono)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:var(--void0);border:1px solid var(--grid3);padding:12px;display:flex;flex-direction:column;gap:10px}
.kv{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:13px;line-height:20px}.kv span:nth-child(odd){color:var(--muted)}.kv span:nth-child(even){font-family:var(--mono)}
.scroll{overflow-x:auto}
table{width:100%;min-width:720px;border-collapse:collapse;font-size:14px}th{text-align:left;padding:8px;font:500 12px var(--mono);letter-spacing:.12em;color:var(--muted)}td{padding:10px 8px;border-top:1px solid var(--grid3);color:var(--muted)}td:first-child{color:var(--ink);font-weight:600}
.live{display:flex;align-items:center;gap:8px}.live i{display:block;width:8px;height:8px;background:var(--ok);animation:p 2s ease-in-out infinite}
.live.stale i{background:var(--warn);animation:none}
@keyframes p{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.live i{animation:none}.act{transition:none}}
.stacks{display:flex;gap:8px;flex-wrap:wrap}
.stacks a{display:flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--grid3);border-radius:2px;color:var(--ink);text-decoration:none;font:500 12px var(--mono);letter-spacing:.12em}
.stacks a:hover{background:var(--void2);color:var(--cyan)}
.stacks a[aria-current]{border-color:var(--cyan);color:var(--cyan)}
.agents{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.agent{display:flex;flex-direction:column;gap:14px;padding:16px;background:var(--void0);border:1px solid var(--grid3)}
.ini{width:40px;height:40px;flex:none;display:flex;align-items:center;justify-content:center;border:1px solid var(--grid4);background:var(--void1);font:600 18px var(--display);color:var(--cyan)}
.tag{display:inline-flex;align-self:flex-start;padding:2px 8px;border:1px solid var(--c,var(--muted));border-radius:2px;font:500 12px/16px var(--mono);letter-spacing:.12em;color:var(--c,var(--muted))}
.dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;font-size:13px;line-height:20px}.dl dt{color:var(--muted)}.dl dd{margin:0;font-family:var(--mono)}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:24px;align-items:start}
.thread{display:flex;flex-direction:column;gap:10px;padding:12px 0;border-top:1px solid var(--grid3)}
.chip{display:inline-flex;gap:6px;padding:4px 8px;background:var(--void0);border:1px solid var(--grid3);font:12px/16px var(--mono)}
.feed{margin:0;padding:0;list-style:none}.feed li{display:flex;flex-direction:column;gap:6px;padding:12px 8px;border-top:1px solid var(--grid3)}.feed li:hover{background:var(--void2)}
