/* theme.css — tokens, base, rail, topbar, shell, shared controls (light/dark via tokens only) */
/* ============ PULSE THEME · tokens ============ */
:root{color-scheme:light;
 --bg:#F4F4F2;--bg-2:#ECECE9;--panel:rgba(255,255,255,.72);--panel-2:#FFFFFF;--raise:#FFFFFF;--inset:rgba(20,20,20,.045);--editor:#FFFFFF;
 --line:rgba(20,20,20,.09);--line-2:rgba(20,20,20,.16);--spec:rgba(255,255,255,.9);
 --ink:#15161A;--ink-2:#5C6070;--ink-3:#8A8E9C;
 --accent:#E0921A;--accent-2:#F5A623;--accent-ink:#1A1200;--accent-soft:rgba(224,146,26,.13);--accent-line:rgba(224,146,26,.38);--glow:rgba(224,146,26,.28);
 --ice:#2F6FD6;--ice-soft:rgba(47,111,214,.1);--ice-line:rgba(47,111,214,.3);--mint:#149A6A;--mint-soft:rgba(20,154,106,.1);--rose:#C8517D;--rose-soft:rgba(200,81,125,.1);--violet:#6C5CE7;--violet-soft:rgba(108,92,231,.1);
 --good:#149A6A;--warn:#B7791F;--crit:#D64545;--good-soft:rgba(20,154,106,.1);--warn-soft:rgba(183,121,31,.1);--crit-soft:rgba(214,69,69,.1);
 --shadow:0 16px 40px rgba(20,20,20,.1);--shadow-s:0 4px 14px rgba(20,20,20,.07);--tile:#15161A;
 --ui:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
 --r:14px;--rs:10px;--rl:18px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;
 --bg:#0B0C10;--bg-2:#0F1015;--panel:rgba(255,255,255,.04);--panel-2:rgba(255,255,255,.065);--raise:#171921;--inset:rgba(0,0,0,.28);--editor:rgba(0,0,0,.3);
 --line:rgba(255,255,255,.09);--line-2:rgba(255,255,255,.16);--spec:rgba(255,255,255,.14);
 --ink:#F3F3F1;--ink-2:#A8ACB8;--ink-3:#6F7486;
 --accent:#F5A623;--accent-2:#FFC96B;--accent-ink:#1A1200;--accent-soft:rgba(245,166,35,.15);--accent-line:rgba(245,166,35,.4);--glow:rgba(245,166,35,.35);
 --ice:#8FC1FF;--ice-soft:rgba(143,193,255,.13);--ice-line:rgba(143,193,255,.32);--mint:#4FD39F;--mint-soft:rgba(79,211,159,.12);--rose:#F29AB5;--rose-soft:rgba(242,154,181,.12);--violet:#B3A8F7;--violet-soft:rgba(179,168,247,.12);
 --good:#4FD39F;--warn:#F5C542;--crit:#FF7A7A;--good-soft:rgba(79,211,159,.12);--warn-soft:rgba(245,197,66,.12);--crit-soft:rgba(255,122,122,.12);
 --shadow:0 16px 40px rgba(0,0,0,.4);--shadow-s:0 4px 14px rgba(0,0,0,.25);--tile:#1C1D24}}
:root[data-theme="dark"]{color-scheme:dark;
 --bg:#0B0C10;--bg-2:#0F1015;--panel:rgba(255,255,255,.04);--panel-2:rgba(255,255,255,.065);--raise:#171921;--inset:rgba(0,0,0,.28);--editor:rgba(0,0,0,.3);
 --line:rgba(255,255,255,.09);--line-2:rgba(255,255,255,.16);--spec:rgba(255,255,255,.14);
 --ink:#F3F3F1;--ink-2:#A8ACB8;--ink-3:#6F7486;
 --accent:#F5A623;--accent-2:#FFC96B;--accent-ink:#1A1200;--accent-soft:rgba(245,166,35,.15);--accent-line:rgba(245,166,35,.4);--glow:rgba(245,166,35,.35);
 --ice:#8FC1FF;--ice-soft:rgba(143,193,255,.13);--ice-line:rgba(143,193,255,.32);--mint:#4FD39F;--mint-soft:rgba(79,211,159,.12);--rose:#F29AB5;--rose-soft:rgba(242,154,181,.12);--violet:#B3A8F7;--violet-soft:rgba(179,168,247,.12);
 --good:#4FD39F;--warn:#F5C542;--crit:#FF7A7A;--good-soft:rgba(79,211,159,.12);--warn-soft:rgba(245,197,66,.12);--crit-soft:rgba(255,122,122,.12);
 --shadow:0 16px 40px rgba(0,0,0,.4);--shadow-s:0 4px 14px rgba(0,0,0,.25);--tile:#1C1D24}
/* ============ base ============ */
*{box-sizing:border-box}[hidden]{display:none!important}
html,body{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 var(--ui);-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .25s,color .25s}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0;padding:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}::selection{background:var(--accent);color:var(--accent-ink)}
h1,h2,h3,h4{margin:0;letter-spacing:-.025em;text-wrap:balance;font-weight:700}h1{font-size:32px;line-height:1.08}h2{font-size:21px;line-height:1.15}h3{font-size:15.5px}p{margin:0}
.eyebrow{font:600 10.5px/1 var(--ui);letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}.muted{color:var(--ink-2)}.mini{font:500 10.5px var(--mono);color:var(--ink-3)}.hint{font-size:12px;color:var(--ink-3);line-height:1.5}.num{font-variant-numeric:tabular-nums}
#atmos{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.shell{position:relative;z-index:1;display:grid;grid-template-columns:216px 1fr;min-height:100vh}
/* rail */
.rail{background:color-mix(in srgb,var(--bg-2) 68%,transparent);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-right:1px solid var(--line);padding:16px 12px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh}
.logo{display:flex;align-items:center;gap:10px;padding:4px 6px}.logo svg{width:36px;height:36px;flex:none;border-radius:11px;box-shadow:var(--shadow-s)}
.logo b{font-size:14px;font-weight:700;display:block;line-height:1.05;letter-spacing:-.02em}.logo small{display:block;color:var(--ink-3);font-size:10.5px;margin-top:3px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--rs);color:var(--ink-2);text-decoration:none;font-weight:600;font-size:13.5px;position:relative;transition:background .15s,color .15s}
.nav a svg{width:17px;height:17px;flex:none;opacity:.75}.nav a:hover{background:var(--inset);color:var(--ink)}
.nav a.on{background:var(--panel-2);color:var(--ink);box-shadow:inset 0 1px 0 var(--spec),var(--shadow-s)}.nav a.on::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:var(--accent)}.nav a.on svg{opacity:1;color:var(--accent)}
.rail .foot{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.live{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-2);padding:8px 10px;border:1px solid var(--line);border-radius:var(--rs);background:var(--panel)}
.live .dot{width:7px;height:7px;border-radius:50%;background:var(--good);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(79,211,159,.5)}70%{box-shadow:0 0 0 7px rgba(79,211,159,0)}100%{box-shadow:0 0 0 0 rgba(79,211,159,0)}}
/* topbar */
.main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:12px;padding:11px 22px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}
.crumbs{font-size:13px;color:var(--ink-3)}.crumbs b{color:var(--ink);font-weight:600}
.bsw{display:inline-flex;background:var(--inset);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px}
.bsw button{display:flex;align-items:center;gap:7px;padding:6px 12px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--ink-2);transition:all .15s}
.bsw button i{width:7px;height:7px;border-radius:50%;flex:none}.bsw button.on{background:var(--raise);color:var(--ink);box-shadow:inset 0 1px 0 var(--spec),var(--shadow-s)}
.spacer{flex:1}
.iconbtn{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;color:var(--ink-2)}.iconbtn:hover{color:var(--ink);border-color:var(--line-2)}.iconbtn svg{width:16px;height:16px}
.content{padding:22px 22px 60px;display:flex;flex-direction:column;gap:18px}
.screen{display:none}.screen.on{display:block;animation:fade .28s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* controls */
.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:var(--rs);border:1px solid var(--line-2);background:var(--panel-2);color:var(--ink);font-weight:600;font-size:13px;line-height:1;box-shadow:inset 0 1px 0 var(--spec);transition:transform .12s,background .12s,border-color .12s}
.btn:hover{background:var(--raise);border-color:var(--line-2)}.btn:active{transform:translateY(1px)}
.btn.primary{background:linear-gradient(180deg,var(--accent-2),var(--accent));color:var(--accent-ink);border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 22px var(--glow)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink-2);box-shadow:none}.btn.ghost:hover{background:var(--inset);color:var(--ink)}
.btn.sm{padding:6px 10px;font-size:12px;border-radius:8px}.btn.xl{padding:15px 22px;font-size:15px;border-radius:13px}.btn svg{width:14px;height:14px}.btn[disabled]{opacity:.5;cursor:not-allowed}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;border:1px solid var(--line);background:var(--inset);font-size:11.5px;font-weight:600;color:var(--ink-2);line-height:1.2;white-space:nowrap}
.chip i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.chip.accent{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft)}.chip.ice{color:var(--ice);border-color:var(--ice-line);background:var(--ice-soft)}.chip.good{color:var(--good);border-color:transparent;background:var(--good-soft)}.chip.warn{color:var(--warn);border-color:transparent;background:var(--warn-soft)}.chip.crit{color:var(--crit);border-color:transparent;background:var(--crit-soft)}.chip.rose{color:var(--rose);border-color:transparent;background:var(--rose-soft)}.chip.mono{font-family:var(--mono);font-weight:500}
.panel{background:var(--panel);backdrop-filter:blur(16px) saturate(135%);-webkit-backdrop-filter:blur(16px) saturate(135%);border:1px solid var(--line);border-radius:var(--rl);padding:18px;box-shadow:inset 0 1px 0 var(--spec),var(--shadow-s)}
.panel-h{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}.panel-h h3{flex:1 1 auto}
.card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.row{display:flex;align-items:center;gap:10px}.row.wrap{flex-wrap:wrap}.grid{display:grid;gap:14px}
.input,select.input,textarea.input{width:100%;background:var(--inset);border:1px solid var(--line);border-radius:var(--rs);padding:10px 12px;font-size:13px;color:var(--ink)}.input:focus{border-color:var(--accent);outline:0}
.toggle{width:38px;height:22px;border-radius:999px;background:var(--inset);border:1px solid var(--line-2);position:relative;flex:none;transition:background .2s}
.toggle::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--ink-2);transition:transform .2s,background .2s}
.toggle.on{background:var(--accent);border-color:transparent}.toggle.on::after{transform:translateX(16px);background:#fff}
.tbl{width:100%;border-collapse:collapse;font-size:13px}.tbl th{text-align:left;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:600;padding:8px 10px;border-bottom:1px solid var(--line)}.tbl td{padding:10px;border-bottom:1px solid var(--line)}.tbl tr:last-child td{border-bottom:0}
.scroll-x{overflow-x:auto}
.thumb{border-radius:10px;background:linear-gradient(135deg,var(--raise),var(--bg-2));border:1px solid var(--line);position:relative;overflow:hidden;flex:none}.thumb.v{width:54px;height:96px}.thumb.sq{width:64px;height:64px}
.thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 60%,var(--accent-soft),transparent 70%)}
.thumb .t{position:absolute;left:6px;bottom:6px;font:600 9.5px var(--mono);color:var(--ink);background:var(--raise);padding:2px 5px;border-radius:4px;z-index:1;border:1px solid var(--line)}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;display:flex;flex-direction:column;gap:4px}.kpi .label{font-size:12px;color:var(--ink-2)}.kpi .value{font:600 28px/1 var(--ui);letter-spacing:-.02em}.kpi .delta{font-size:12px;color:var(--ink-3)}
.meter{height:5px;border-radius:999px;background:var(--accent-soft);overflow:hidden}.meter i{display:block;height:100%;border-radius:999px;background:var(--accent);transition:width .5s}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:var(--raise);border:1px solid var(--line-2);color:var(--ink);padding:10px 16px;border-radius:13px;font-size:13px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s;z-index:100;display:flex;gap:8px;align-items:center}.toast.on{opacity:1;transform:translate(-50%,0)}.toast i{width:8px;height:8px;border-radius:50%;background:var(--good)}
.angle{border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;background:var(--panel-2);display:flex;flex-direction:column;gap:5px;text-align:left;transition:.15s}.angle b{font-size:12.5px}.angle small{font-size:11.5px;color:var(--ink-2)}.angle .sc{display:flex;align-items:center;gap:6px;font:500 10.5px var(--mono);color:var(--ink-3)}.angle .sc .meter{flex:1;height:3px}.angle:hover{border-color:var(--line-2);transform:translateY(-1px)}
.angles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.evq{border-left:2px solid var(--mint);padding:4px 10px;font-size:12.5px;color:var(--ink-2);display:flex;flex-direction:column;gap:2px}.evq b{color:var(--ink);font-weight:500;font-style:italic}.evq small{font:500 10.5px var(--mono);color:var(--ink-3)}
.node{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;display:flex;flex-direction:column;gap:4px}.node b{font-size:12.5px}.node small{font-size:11px;color:var(--ink-3);line-height:1.4}.node .svc{font:500 10.5px var(--mono);color:var(--ice)}
.bars{display:flex;flex-direction:column;gap:9px}.bar-row{display:grid;grid-template-columns:200px 1fr 48px;gap:10px;align-items:center;font-size:12.5px}.bar-row .lbl{color:var(--ink-2)}.bar-row .trk{height:12px}.bar-row .trk i{display:block;height:100%;background:var(--ice);border-radius:0 4px 4px 0}.bar-row .trk i.acc{background:var(--accent)}.bar-row .v{font:500 12px var(--mono);text-align:right}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:900px){.shell{grid-template-columns:1fr}.rail{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;border-right:0;border-bottom:1px solid var(--line)}.rail .foot{margin-top:0;flex-direction:row}.nav{flex-direction:row;flex-wrap:wrap}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.angles{grid-template-columns:1fr}}