/* CLASS Configuration Portal — design tokens and components.
   Source of truth: docs/design (Sutherland UI Standards). Light theme by default; body.t-dark switches to dark.
   No inline styles anywhere: the Content-Security-Policy forbids them, so every style lives here. */
html,body{margin:0;height:100%}
.app{--bg:#F2F3F6;--surface:#FFFFFF;--surface-2:#F6F7F9;--surface-3:#ECEEF2;--border:#E1E3E8;--border-strong:#C5C7C5;--text:#1B1A2E;--text-2:#454F52;--muted:#5F6A6D;--primary:#2E79BB;--primary-h:#25659E;--link:#2468A6;--primary-soft:#E7F0F9;--navy:#26235D;--navy-2:#1C1A4A;--navy-3:#353172;--red:#DE1B54;--red-btn:#C8174A;--red-text:#B0123F;--red-soft:#FCE8EE;--orange:#F99F42;--orange-text:#8F4C00;--orange-soft:#FEF1E2;--green:#6CC049;--green-text:#2C7314;--green-soft:#E9F6E3;--yellow:#F7D752;--yellow-soft:#FEF8D8;--violet:#5B4FC4;--shadow:0 1px 2px rgba(20,18,60,.06),0 1px 3px rgba(20,18,60,.05);font-family:"Proxima Nova",Figtree,Arial,sans-serif;color:var(--text);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
.app.t-dark{--bg:#100F22;--surface:#18172F;--surface-2:#1F1E3A;--surface-3:#28274A;--border:#2D2C52;--border-strong:#45446E;--text:#ECECF5;--text-2:#C7C8DA;--muted:#A0A2BA;--link:#7FB3E6;--primary-soft:#1D3150;--navy:#141331;--navy-2:#0B0A1E;--navy-3:#2A2860;--red-text:#FF7FA2;--red-soft:#3A1628;--orange-text:#FFB774;--orange-soft:#3A2814;--green-text:#94DB77;--green-soft:#1B3317;--yellow-soft:#37311A;--shadow:none}
.app *{box-sizing:border-box}
.app a{color:var(--link)}
.app a:hover{color:var(--primary-h)}
.app.t-dark a:hover{color:#A5CBF0}
.mono{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:12px}
svg.i{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}
h1,h2,h3,h4{margin:0}
.top{min-height:56px;background:var(--navy-2);color:#fff;display:flex;align-items:center;gap:14px;padding:8px 16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;padding-right:6px}
.app .brand,.app .brand:hover{color:#fff}
.brand .bt{font-weight:800;letter-spacing:.06em;font-size:15px}
.brand .bs{font-weight:500;font-size:14px;color:#CFCDEA}
.env{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:12px;border:1px solid #F15C87;color:#FF9FBB;font-size:11px;font-weight:700;letter-spacing:.08em}
.env .dot{width:7px;height:7px;border-radius:50%;background:#F15C87}
.tsel{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 10px;border-radius:4px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#E6E5F5;font:inherit;font-size:13px;cursor:pointer}
.gsearch{flex:1 1 260px;max-width:520px;display:flex;align-items:center;gap:8px;height:36px;padding:0 10px;border-radius:4px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#BDBBDA}
.gsearch input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font:inherit;font-size:13.5px}
.gsearch input::placeholder{color:#AFADD0}
.gsearch kbd{font-family:inherit;font-size:11px;border:1px solid rgba(255,255,255,.22);border-radius:3px;padding:1px 5px;color:#CFCDEA}
.tr{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.idle,.conn{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#CFCDEA}
.idle b{color:#fff;font-weight:500}
.conn{color:#A9E290}
.ib{position:relative;width:36px;height:36px;border-radius:4px;border:0;background:transparent;color:#E6E5F5;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.bdg{position:absolute;top:3px;right:2px;min-width:16px;height:16px;border-radius:8px;background:var(--red);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid var(--navy-2)}
.um{display:inline-flex;align-items:center;gap:8px;background:transparent;border:0;color:#fff;font:inherit;cursor:pointer;padding:2px 4px;text-align:left}
.umt{display:flex;flex-direction:column;line-height:1.15}
.umt b{font-size:13px}
.umt small{font-size:11.5px;color:#BDBBDA}
.body{display:flex;flex-wrap:wrap;flex:1;align-items:stretch}
.nav{background:var(--navy);color:#D3D2EA;flex:1 0 236px;max-width:100%;padding:10px 0 20px;display:flex;flex-direction:column}
@media (min-width:900px){.nav{flex:0 0 236px}}
.nav-g{padding:16px 20px 6px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#9C9AC9;font-weight:700}
.app .nv{display:flex;align-items:center;gap:11px;min-height:34px;margin:1px 10px;padding:0 10px;border-radius:4px;color:#D8D7EE;text-decoration:none;font-size:13.5px}
.app .nv:hover{background:rgba(255,255,255,.06);color:#fff}
.app .nv.on{background:var(--navy-3);color:#fff;font-weight:600}
.nv.on svg{color:#FF7FA2}
.nv svg{color:#A9A7D3}
.nb{margin-left:auto;min-width:20px;height:18px;border-radius:9px;background:rgba(255,255,255,.12);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 6px;color:#fff}
.nav-foot{margin-top:auto;padding:20px 20px 0;font-size:11.5px;color:#A6A4CF;line-height:1.4}
.app .nav-foot a{color:#CFCDEA}
.page{flex:999 1 560px;min-width:0;padding:20px 28px 48px}
.crumb{font-size:12.5px;color:var(--muted);display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.app .crumb a{text-decoration:none}
.h1{font-size:24px;font-weight:700;letter-spacing:-.01em;margin-top:4px}
.sub{color:var(--muted);font-size:13px;margin-top:4px;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
.ph{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px}
.acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:34px;padding:0 14px;border-radius:4px;font-family:inherit;font-size:13px;font-weight:600;border:1px solid transparent;cursor:pointer;background:#E8E8E8;color:#454F52;white-space:nowrap;text-decoration:none;line-height:1}
.app .btn-primary,.app .btn-primary:hover{background:var(--primary);color:#fff}
.app .btn-primary:hover{background:var(--primary-h)}
.app .btn-outline{background:transparent;border-color:var(--primary);color:var(--link)}
.app .btn-secondary{background:var(--surface);color:var(--text-2);border-color:var(--border-strong)}
.app .btn-danger{background:var(--red-btn);color:#fff}
.app .btn-danger-o{background:transparent;color:var(--red-text);border-color:var(--red-text)}
.app .btn-ghost{background:transparent;color:var(--text-2)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn-sm{height:28px;padding:0 10px;font-size:12px}
.btn-icon{width:34px;padding:0}
.btn-sm.btn-icon{width:28px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow);min-width:0}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.card-h h3{font-size:15px;font-weight:700}
.card-b{padding:16px}
.eyebrow{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.kpi{padding:16px}
.kpi .v{font-size:28px;font-weight:700;letter-spacing:-.02em;margin-top:6px;line-height:1.1}
.kpi .d{font-size:12.5px;color:var(--muted);margin-top:6px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tbox{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{background:var(--surface-3);text-align:left;font-weight:600;color:var(--text-2);font-size:12px;padding:0 12px;height:40px;white-space:nowrap}
.tbl th .s{display:inline-flex;align-items:center;gap:4px}
.tbl td{padding:0 12px;height:44px;border-top:1px solid var(--border);white-space:nowrap}
.tbl tbody tr:nth-child(even) td{background:var(--surface-2)}
.tbl .app-link,.app .tbl a.lk{color:var(--link);font-weight:600;text-decoration:none}
.tbl tr.sel td{background:var(--primary-soft)!important}
.tbl tr.flash td{background:#E3EEFA!important}
.t-dark .tbl tr.flash td{background:#1E3352!important}
.tbl td.num,.tbl th.num{text-align:right}
.pill{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:11px;font-size:12px;font-weight:600;white-space:nowrap}
.pill .dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.p-green{background:var(--green-soft);color:var(--green-text)}
.p-red{background:var(--red-soft);color:var(--red-text)}
.p-orange{background:var(--orange-soft);color:var(--orange-text)}
.p-blue{background:var(--primary-soft);color:var(--link)}
.p-gray{background:var(--surface-3);color:var(--text-2)}
.p-violet{background:#EEECFB;color:#4B40AE}
.t-dark .p-violet{background:#2A2650;color:#B9B1FF}
.chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 6px 0 10px;border-radius:4px;background:var(--surface-3);color:var(--text-2);font-size:12.5px;border:1px solid var(--border)}
.chip b{color:var(--text)}
.chip button{border:0;background:transparent;color:var(--muted);width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.av{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;border:2px solid var(--surface);flex:none;letter-spacing:.02em}
.top .av{border-color:var(--navy-2)}
.av-sm{width:24px;height:24px;font-size:10px}
.avs{display:inline-flex;align-items:center}
.avs .av+.av{margin-left:-8px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.lbl{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.input{height:36px;border:1px solid var(--border-strong);border-radius:4px;padding:0 10px;background:var(--surface);color:var(--text);font-family:inherit;font-size:13.5px;width:100%;min-width:0}
.input:focus{outline:2px solid var(--primary);outline-offset:-1px}
textarea.input{height:auto;padding:8px 10px;resize:vertical}
.input.mono{font-size:12.5px}
.input.chg{border-color:var(--orange);background:var(--orange-soft)}
.sel-wrap{position:relative}
select.input{appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 15px) 16px,calc(100% - 10px) 16px;background-size:5px 5px;background-repeat:no-repeat}
.help{font-size:12px;color:var(--muted)}
.ro{font-size:14px;color:var(--text);min-height:20px}
.sw{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:13.5px}
.sw input{position:absolute;opacity:0;width:36px;height:20px;margin:0}
.sw .tk{width:36px;height:20px;border-radius:10px;background:var(--border-strong);position:relative;flex:none;transition:background .15s}
.sw .tk::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:left .15s}
.sw input:checked+.tk{background:var(--primary)}
.sw input:checked+.tk::after{left:18px}
.app input[type=checkbox],.app input[type=radio]{accent-color:#2E79BB;width:16px;height:16px;margin:0;cursor:pointer}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);overflow-x:auto}
.app .tab{display:inline-flex;align-items:center;gap:7px;padding:10px 14px;font-size:13.5px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;text-decoration:none;white-space:nowrap;margin-bottom:-1px}
.app .tab.on{color:var(--text);border-bottom-color:var(--primary)}
.tab .ct{font-size:11px;font-weight:700;background:var(--surface-3);color:var(--text-2);border-radius:9px;padding:1px 7px}
.alert{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:5px;font-size:13px}
.alert b{display:block;font-size:13.5px;margin-bottom:1px}
.alert .x{margin-left:auto;border:0;background:transparent;color:inherit;cursor:pointer;padding:2px;display:inline-flex}
.a-warn{background:var(--yellow);color:#1B1A2E}
.a-info{background:var(--primary);color:#fff}
.a-ok{background:#4F9E2F;color:#fff}
.a-err{background:var(--red-btn);color:#fff}
.a-soft{background:var(--primary-soft);color:var(--text);border:1px solid #C9DDF0}
.t-dark .a-soft{border-color:#2B4A72}
.toast{position:absolute;right:24px;bottom:24px;width:390px;max-width:calc(100% - 32px);background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:0 12px 32px rgba(20,18,60,.22);display:flex;gap:12px;padding:14px 14px 14px 16px;z-index:5}
.toast .ti{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none}
.toast p{margin:2px 0 8px;font-size:12.5px;color:var(--text-2)}
.toast b{font-size:13.5px}
.toast .x{border:0;background:transparent;color:var(--muted);cursor:pointer;align-self:flex-start;display:inline-flex;padding:2px}
.bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.bar>span{display:block;height:100%;border-radius:3px;background:var(--primary)}
.steps{display:flex;align-items:center;gap:0;flex-wrap:wrap}
.step{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--muted)}
.step .n{width:22px;height:22px;border-radius:50%;border:2px solid var(--border-strong);display:flex;align-items:center;justify-content:center;font-size:11px;flex:none;background:var(--surface)}
.step.done{color:var(--text)}
.step.done .n{background:var(--primary);border-color:var(--primary);color:#fff}
.step.cur{color:var(--link)}
.step.cur .n{border-color:var(--primary);color:var(--link)}
.step-l{flex:1 1 24px;min-width:16px;height:2px;background:var(--border-strong);margin:0 10px}
.step-l.done{background:var(--primary)}
.secret{display:flex;align-items:center;gap:10px;min-height:36px;padding:6px 6px 6px 10px;border:1px dashed var(--border-strong);border-radius:4px;background:var(--surface-2);min-width:0}
.secret .mask{font-family:"JetBrains Mono",monospace;letter-spacing:.12em;color:var(--text-2);font-size:12px}
.secret .meta{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}
.wo{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:3px;background:var(--navy);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;flex:none}
.t-dark .wo{background:#3A3780}
.live-dot{width:8px;height:8px;border-radius:50%;background:#4FAF2A;box-shadow:0 0 0 3px rgba(79,175,42,.2);display:inline-block}
.feed{list-style:none;margin:0;padding:0}
.feed li{display:flex;gap:12px;padding:12px 16px;border-top:1px solid var(--border);font-size:13px}
.feed li:first-child{border-top:0}
.feed .t{color:var(--muted);font-size:12px;margin-top:2px}
.kv{display:grid;grid-template-columns:minmax(110px,auto) 1fr;gap:9px 14px;font-size:13px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis}
.tool{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 16px}
.search{display:flex;align-items:center;gap:8px;height:36px;padding:0 10px;border:1px solid var(--border-strong);border-radius:4px;background:var(--surface);color:var(--muted);flex:0 1 300px;min-width:180px}
.search input{border:0;outline:0;background:transparent;font:inherit;font-size:13.5px;color:var(--text);flex:1;min-width:0}
.pager{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}
.pg{display:flex}
.app .pg a{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:34px;padding:0 12px;border:1px solid var(--border);margin-left:-1px;text-decoration:none;color:var(--link);font-size:13px;background:var(--surface)}
.app .pg a.on{background:var(--primary);border-color:var(--primary);color:#fff}
.app .pg a.dis{color:var(--muted)}
.ico-tile{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
.savebar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--border);background:var(--surface-2);border-radius:0 0 6px 6px}
.diff-del{background:#FDECEF;color:#8A0F33}
.diff-add{background:#E6F5DE;color:#1F5C0B}
.t-dark .diff-del{background:#3A1628;color:#FFB3C6}
.t-dark .diff-add{background:#1B3317;color:#B8EBA3}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mut{color:var(--muted)}
.lock{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:12px}
.edit-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--orange-text)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.node{position:absolute;width:220px;height:60px;background:var(--surface);border:1px solid var(--border-strong);border-radius:6px;display:flex;align-items:center;gap:10px;padding:0 12px;box-shadow:0 1px 3px rgba(20,18,60,.08)}
.node.selected{border:2px solid var(--primary);box-shadow:0 0 0 4px rgba(46,121,187,.18)}
.node.remote{border:2px solid #5B4FC4}
.nic{width:30px;height:30px;border-radius:5px;display:flex;align-items:center;justify-content:center;color:#fff;flex:none}
.nt{font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ns{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.el{position:absolute;font-size:11px;font-weight:600;background:var(--surface);padding:1px 6px;border-radius:3px;border:1px solid var(--border);color:var(--text-2);white-space:nowrap}
.pal{display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid var(--border);border-radius:4px;background:var(--surface);font-size:12.5px;cursor:grab}
.pal .nic{width:22px;height:22px;border-radius:4px}
.matrix td{text-align:center}
.matrix td:first-child{text-align:left}
.matrix tr.grp td{background:var(--surface-3)!important;font-weight:700;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-2);height:34px}
.na{color:var(--border-strong)}

/* ---- Font Awesome 5 icons in place of the design's inline SVGs ---- */
.nv i{width:16px;text-align:center;color:#A9A7D3;font-size:14px}
.nv.on i{color:#FF7FA2}
.top i{font-size:14px}
.btn i{font-size:13px}

/* ---- layout utilities (replace the design's inline styles) ---- */
.app-root{min-height:100vh;display:flex;flex-direction:column;background:var(--bg)}
.row{display:flex;align-items:center;gap:8px}
.wrap{flex-wrap:wrap}
.grow{flex:1}
.gap-16{gap:16px}
.mt-16{margin-top:16px}
.mb-16{margin-bottom:16px}
.ink{color:var(--text)}
.sub-unit{font-size:18px;color:var(--muted);font-weight:600}
.status-dot{display:inline-flex;align-items:center;gap:7px}
.toast-region{position:fixed;right:24px;bottom:24px;display:flex;flex-direction:column;gap:12px;z-index:50}
.toast-region .toast{position:static}
.app .nv.nv-soon{opacity:.55;cursor:default}
.app .nv.nv-soon:hover{background:transparent;color:#D8D7EE}
.conn.off{color:#BDBBDA}

/* ---- sign-in, password change, error pages (design screen 01) ---- */
.login{display:flex;flex-wrap:wrap;min-height:100vh;background:var(--surface)}
.login-hero{flex:1 1 520px;background:#1C1A4A;color:#fff;padding:48px 56px;display:flex;flex-direction:column;gap:32px;position:relative;overflow:hidden}
.login-ring{position:absolute;right:-120px;top:-80px;width:520px;height:520px;border-radius:50%;border:70px solid rgba(222,27,84,.12)}
.login-brand{display:flex;align-items:center;gap:12px;position:relative}
.login-brand .bt{font-weight:800;letter-spacing:.06em;font-size:18px}
.login-brand .bs{font-size:17px;color:#CFCDEA}
.login-brand-dark .bt{color:var(--text)}
.login-brand-dark .bs{color:var(--muted)}
.login-pitch{margin-top:auto;position:relative;max-width:520px}
.login-pitch h1{font-size:40px;line-height:1.12;font-weight:800;letter-spacing:-.02em}
.login-pitch p{color:#CFCDEA;font-size:16px;margin:16px 0 0}
.login-modules{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 24px;position:relative;font-size:14px;color:#E6E5F5}
.login-modules li{display:flex;gap:10px;align-items:center}
.login-modules i{width:18px;text-align:center}
.login-foot{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:12px;color:#9C9AC9;position:relative}
.login-panel{flex:1 1 480px;display:flex;align-items:center;justify-content:center;padding:48px 24px;background:var(--surface)}
.login-panel-full{flex-basis:100%;min-height:100vh;background:var(--bg)}
.login-panel-full .login-form{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:32px;box-shadow:var(--shadow)}
.login-form{width:100%;max-width:420px;display:flex;flex-direction:column;gap:18px}
.login-form h2{font-size:26px;font-weight:700}
.login-form p{margin:6px 0 0;font-size:14px}
.login-legal{font-size:12px;color:var(--muted);border-top:1px solid var(--border);padding-top:16px}
.btn-lg{height:42px;font-size:14px}
.inline{display:inline!important}
.acts-end{justify-content:flex-end}

/* ---- account menu ---- */
.um-menu{position:relative}
.um-menu summary{list-style:none;cursor:pointer}
.um-menu summary::-webkit-details-marker{display:none}
.av-user{background:#2E79BB}
.um-pop{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;color:var(--text);z-index:40;padding:6px}
.um-pop-head{display:flex;flex-direction:column;padding:8px 10px 10px;border-bottom:1px solid var(--border);margin-bottom:6px}
.um-item{width:100%;justify-content:flex-start}

/* ---- modal (design screen 10) ---- */
.modal-backdrop{position:fixed;inset:0;background:rgba(16,15,34,.55);display:flex;align-items:center;justify-content:center;padding:24px;z-index:100}
.modal-backdrop[hidden]{display:none}
.modal{width:100%;max-width:480px;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.modal-head{padding:24px 24px 8px;display:flex;gap:16px}
.modal-head h2{font-size:19px;font-weight:700}
.modal-head p{margin:6px 0 0;color:var(--text-2);font-size:14px}
.modal-body{padding:8px 24px 0 84px}
.modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:20px 24px 24px}
.ico-warn{background:var(--orange-soft);color:var(--orange-text);font-size:20px}
.idle-countdown{font-size:40px;font-weight:500;letter-spacing:.02em;color:var(--text);margin-bottom:8px}
.bar-warn{background:var(--orange)!important;width:100%}

/* ---- phase 2: dashboard, security screens ---- */
.av-ok{background:#2E79BB}
.av-bad{background:var(--red-btn)}
.kv-tight{margin:0;grid-template-columns:auto 1fr;align-items:center}
.role-list{list-style:none;margin:0;padding:6px;font-size:13px}
.app .role-list a{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:4px;color:var(--text);text-decoration:none}
.app .role-list a:hover{background:var(--surface-2)}
.app .role-list a.on{background:var(--primary-soft);color:var(--link);font-weight:600}
.side{flex:1 1 240px;min-width:0}
.main-col{flex:999 1 680px;min-width:0}
.cols{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.check-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--border);border-radius:4px;background:var(--surface-2);font-size:13px;cursor:pointer}
.matrix th.c,.matrix td.c{text-align:center;width:92px}
.matrix .exec{font-size:11.5px;color:var(--muted)}
.member-row{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--border);font-size:13px}
.member-row:first-child{border-top:0}
.member-row form{margin-left:auto}
.inline-form{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;padding:12px 16px;border-top:1px solid var(--border)}
.inline-form .field{flex:1 1 200px}
.section-title{font-size:13px;font-weight:700;padding:12px 16px 0;color:var(--text-2)}
.input-sm{height:32px}
.danger-zone{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px}

/* ---- phase 3: configuration manager ---- */
.tsel-menu{position:relative}
.tsel-menu summary{list-style:none}
.tsel-menu summary::-webkit-details-marker{display:none}
.tenant-pop{left:0;right:auto;max-height:360px;overflow:auto}
.app .um-item.on{background:var(--primary-soft);color:var(--link)}
.type-tabs{margin-bottom:16px}
.folder-tree{list-style:none;margin:0;padding:8px 6px;font-size:13px}
.app .folder-tree a{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:4px;color:var(--text);text-decoration:none}
.app .folder-tree a:hover{background:var(--surface-2)}
.app .folder-tree a.on{background:var(--primary-soft);color:var(--link);font-weight:600}
.app .folder-tree a.d1{padding-left:26px}.app .folder-tree a.d2{padding-left:44px}.app .folder-tree a.d3{padding-left:62px}.app .folder-tree a.d4{padding-left:80px}
.app .th-sort{color:inherit;text-decoration:none;display:inline-flex;gap:5px;align-items:center}
.app .th-sort.on{color:var(--text)}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px 24px}
.fields .ro{word-break:break-word}
.detail-sections{display:flex;flex-direction:column;gap:16px}
.link-chips{display:flex;flex-wrap:wrap;gap:6px}
.app .link-chips a,.link-chips span.chip{text-decoration:none}
.kv-section{border-top:1px solid var(--border)}
.kv-section:first-child{border-top:0}
.kv-head{padding:10px 16px;font-weight:700;font-size:13px;background:var(--surface-2)}
.kv-table td:first-child{width:34%}
.empty{padding:14px 16px;color:var(--muted);font-size:13px}
.secret-inline{display:inline-flex;align-items:center;gap:8px}
.ico-navy{background:var(--navy)}
.state-filter{width:auto}
.mt-6{margin-top:6px}
.bulk-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 16px;border-top:1px solid var(--border);background:var(--surface-2)}
.check-col{width:36px}
.new-row td{background:var(--primary-soft)!important}
.kv-new{border-top:1px solid var(--border)}
.kv-new-row{display:grid;grid-template-columns:1fr 1fr 2fr;gap:8px;padding:8px 16px}
.kv-new [data-kv-add-row]{margin:0 16px}
.kv-hint{padding:0 16px 12px;margin:0}
.hist{border-top:1px solid var(--border)}
.hist:first-of-type{border-top:0}
.hist-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px}
.search-group{margin-bottom:16px}
.search-hit{display:flex;gap:10px;align-items:center;padding:10px 16px;border-top:1px solid var(--border);font-size:13.5px}
.search-hit:first-child{border-top:0}

/* ---- phase 4: live collaboration ---- */
@keyframes live-flash{from{background:#FFF1B8}to{background:transparent}}
.live-flash,.live-flash td{animation:live-flash 3s ease-out}
.t-dark .live-flash,.t-dark .live-flash td{animation:none;outline:2px solid var(--orange)}
.remote-changed .input,.remote-changed select.input{border-color:var(--orange);box-shadow:0 0 0 2px var(--orange-soft)}
.presence{min-height:28px}
.presence .av{cursor:default;background:#5B4FC4}
.av-edit{box-shadow:0 0 0 2px var(--orange)}
.row-presence{display:inline-flex;margin-left:8px;vertical-align:middle}
.row-presence .av{width:20px;height:20px;font-size:8px;border-width:1px}
.conflicts{border-color:var(--red-text)}
.conflicts h3{color:var(--red-text);display:flex;gap:8px;align-items:center}
.conflict{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--border)}
.conn.on{color:#A9E290}
.toast-region .toast{animation:none}
.ti-live{background:var(--primary-soft);color:var(--link)}

/* ---- phase 5: administrator ---- */
.section-tabs{margin-bottom:16px}
.kv-tool{border-bottom:1px solid var(--border)}
.kv-grid{display:flex;flex-wrap:wrap}
.kv-names{flex:1 1 180px;border-right:1px solid var(--border);padding:8px 6px;display:flex;flex-direction:column;gap:2px;font-size:13px}
.app .kv-names a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 8px;border-radius:4px;color:var(--text);text-decoration:none}
.app .kv-names a.on{background:var(--primary-soft);color:var(--link);font-weight:600}
.app .kv-names a.kv-default{color:var(--muted);font-style:italic}
.kv-count{display:inline-flex;gap:5px;align-items:center;font-size:12px}
.kv-panels{flex:999 1 480px;min-width:0}
.kv-default td{color:var(--muted)}
.status-actions{display:flex;gap:8px;flex-wrap:wrap}
.dep-group{border-top:1px solid var(--border)}
.dep-group:first-child{border-top:0}

/* ---- Composer (screen 05) ---- */
.composer{display:flex;flex-wrap:wrap;min-height:700px;overflow:hidden}
.cmp-palette{flex:1 1 200px;max-width:260px;background:var(--surface-2);border-right:1px solid var(--border);padding:14px 12px;display:flex;flex-direction:column;gap:6px}
.cmp-group{margin:8px 2px 2px}
.app .pal{color:var(--text);text-align:left;font:inherit;font-size:12.5px;width:100%}
.app .pal:hover:not(:disabled){border-color:var(--primary)}
.app .pal:disabled{cursor:default;opacity:.7}
.nic-flow{background:#26235D}.nic-voice{background:#8F4C00}.nic-routing{background:#2E79BB}.nic-data{background:#2C7314}
.cmp-main{flex:999 1 560px;min-width:0;display:flex;flex-direction:column}
.cmp-tool{padding:8px 12px;border-bottom:1px solid var(--border);gap:6px}
.cmp-canvas{flex:none;height:max(520px,calc(100vh - 300px));overflow:auto;position:relative;background-color:var(--surface-2);background-image:radial-gradient(var(--border-strong) 1px,transparent 1px);background-size:20px 20px;outline-offset:-3px}
.cmp-stage{position:relative;transform-origin:0 0;width:900px;height:680px}
.cmp-edges{position:absolute;inset:0;overflow:visible;pointer-events:none}
.cmp-edge{fill:none;stroke:#8C9598;stroke-width:1.6}
.cmp-edge.on{stroke:var(--primary);stroke-width:2.4}
.cmp-edge-hit{stroke:transparent;stroke-width:12;pointer-events:stroke;cursor:pointer}
.cmp-edge-draft{stroke:var(--primary);stroke-dasharray:5 4}
.cmp-arrow{fill:#6E797C}
.cmp-loading{position:absolute;top:16px;left:16px;color:var(--muted);font-size:13px}
.cmp-loading[hidden]{display:none}
.composer .node{cursor:pointer;user-select:none;touch-action:none}
.composer .node:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.composer .node.cmp-warn-b{border-color:var(--orange)}
.composer .node.cmp-err{border-color:var(--red)}
.composer .node.selected{border-color:var(--primary)}
.cmp-node-text{min-width:0;flex:1}
.cmp-mark-warn{color:var(--orange-text);font-size:12px}
.cmp-mark-err{color:var(--red-text);font-size:12px}
.cmp-remote-tag{position:absolute;left:-2px;top:-20px;background:#5B4FC4;color:#fff;font-size:10.5px;font-weight:700;padding:2px 6px;border-radius:3px 3px 3px 0;white-space:nowrap}
.cmp-port{position:absolute;bottom:-6px;width:12px;height:12px;border-radius:50%;background:var(--surface);border:2px solid var(--border-strong);cursor:crosshair;touch-action:none}
.cmp-port.on{background:var(--border-strong)}
.cmp-port:hover{border-color:var(--primary);background:var(--primary)}
.el.cmp-el{transform:translate(-50%,-50%);pointer-events:none;z-index:1}
.cmp-foot{display:flex;flex-wrap:wrap;align-items:center;gap:18px;padding:10px 14px;border-top:1px solid var(--border);font-size:12.5px}
.cmp-ok{color:var(--green-text);font-weight:600}
.cmp-bad{color:var(--red-text);font-weight:600}
.cmp-warn{color:var(--orange-text);font-weight:600}
.app .cmp-issue{background:none;border:0;padding:0;font:inherit;text-align:left;cursor:pointer;color:var(--muted)}
.app .cmp-issue:hover{color:var(--link);text-decoration:underline}
.cmp-issue[hidden]{display:none}
.cmp-props{flex:1 1 320px;max-width:420px;border-left:1px solid var(--border);display:flex;flex-direction:column}
.cmp-props-body{display:flex;flex-direction:column;gap:14px}
.cmp-props-body .field{display:flex;flex-direction:column;gap:5px}
.cmp-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cmp-pairs{display:flex;flex-direction:column;gap:6px}
.cmp-pair{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:center}
.cmp-pair .input{height:32px}
.cmp-own-issues{list-style:none;margin:0;padding:10px 12px;border:1px solid var(--border);border-radius:4px;background:var(--surface-2);display:flex;flex-direction:column;gap:6px;font-size:12.5px}
.cmp-sim{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:24px}
.cmp-sim .fields{display:flex;flex-direction:column;gap:14px}
.cmp-sim .field{display:flex;flex-direction:column;gap:5px}
.cmp-trace{margin:10px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:13px}
.app .cmp-trace-node{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--link);cursor:pointer}
.cmp-tests{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:13px}
.cmp-test{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
@media (max-width:900px){.cmp-palette,.cmp-props{max-width:none}}
.fields-col{display:flex;flex-direction:column;gap:14px}
.fields-col .field{display:flex;flex-direction:column;gap:5px}
.diff-sum{flex-wrap:wrap;gap:16px;font-size:13px;font-weight:600}
.app [hidden]{display:none!important}
.cmp-palette .search{flex:none;height:32px}

/* ---- Organization: tenant › line of business › team (CR-4, screens 03 and 19) ---- */
.ou{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:5px;color:#fff;flex:none;font-size:11px}
.ou-sm{width:16px;height:16px;border-radius:4px;font-size:8px}
.ou-t{background:#26235D}.ou-l{background:#2E79BB}.ou-m{background:#5B4FC4}
.lvl{font-size:9.5px;font-weight:800;letter-spacing:.08em;padding:1px 5px;border-radius:3px;flex:none}
.lvl-t{background:#26235D;color:#fff}.lvl-l{background:var(--primary-soft);color:var(--link)}.lvl-m{background:#EEECFB;color:#4B40AE}
.app.t-dark .lvl-m{background:#2A2650;color:#B9B1FF}
.tz{font-size:10.5px;color:var(--muted);font-family:"JetBrains Mono",monospace;white-space:nowrap;margin-left:auto}
.ouchip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;white-space:nowrap}
.app a.ouchip{color:var(--text);text-decoration:none}
.app a.ouchip:hover span:last-child{text-decoration:underline}
.ouchip-lg{font-size:14px;font-weight:600}
.h1-unit{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.org-tree li.unit a{font-weight:600}
.org-tree li.objf a{color:var(--text-2)}
.org-tree li.objf a i{color:var(--muted)}
.org-tree .ou-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.org-tree .ct2{margin-left:auto;color:var(--muted);font-size:12px;font-weight:400}
.org-legend{padding:10px 14px 14px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px;font-size:11.5px;color:var(--muted)}
.org-legend-row{flex-wrap:wrap;gap:10px}
.app a.sw-link{color:var(--text);text-decoration:none;font-size:13px}
.sw .tk.on{background:var(--primary)}
.sw .tk.on::after{left:18px}
.org-stored{margin:0;white-space:pre-wrap;font-size:12px;color:var(--text-2);background:var(--surface-2)}
.tbl tr.row-total td{font-weight:700}
.field>label.row,.field>label.sw{font-size:13.5px;letter-spacing:0;text-transform:none;color:var(--text);font-weight:400}
.side:has(.org-tree){flex:1 1 340px}
/* ---- Sign-in methods on the sign-in page (CR-1, screen 01) ---- */
.sso-buttons{display:flex;flex-direction:column;gap:10px}
.app .sso-btn,.sso-btn{justify-content:flex-start;gap:10px}
.sso-or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px}
.sso-or::before,.sso-or::after{content:"";flex:1;height:1px;background:var(--border)}
.login-local{padding:0;margin:0}
.is-hidden{display:none!important}
.field-wide{grid-column:1/-1}
.help.block{display:block}
.side-note{padding:10px 14px 14px;margin:0;border-top:1px solid var(--border)}
.savebar-row{border-top:1px solid var(--border);align-items:center;gap:8px}
.policy-block{border-top:1px solid var(--border);display:flex;flex-direction:column;gap:12px}
.policy-block h3{margin:0}
.policy-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
/* CR-9: what a known option key does, under the key (the key cell is monospace) */
.kv-key-help{font-family:"Proxima Nova",Figtree,Arial,sans-serif;white-space:normal;margin-top:2px}
/* CR-6 licensing */
.seg{display:inline-flex;border:1px solid var(--border-strong);border-radius:4px;overflow:hidden}
.seg .btn{border-radius:0;border:0;height:32px}
.seg .btn+.btn{border-left:1px solid var(--border-strong)}
.seg .btn.on,.seg .btn[aria-pressed=true]{background:var(--primary);color:#fff}
.meter{display:flex;flex-direction:column;gap:4px;white-space:nowrap}
.meter .mv{display:flex;align-items:center;gap:5px}
.meter svg{display:block}
.m-track{fill:var(--surface-3)}
.m-within{fill:#4F9E2F}.m-near{fill:var(--orange)}.m-over{fill:var(--red-btn)}
.t-over{color:var(--red-text)}.t-near{color:var(--orange-text)}.t-within{color:var(--green-text)}
.lvl-1>td:first-child{padding-left:30px}.lvl-2>td:first-child{padding-left:48px}
.tz-line{display:block;margin:2px 0 0 28px}
.tree-toggle{display:inline-flex;width:16px;justify-content:center;color:var(--muted);text-decoration:none}
.tree-spacer{display:inline-block;width:16px}
.chart{display:flex;gap:10px;padding:8px 16px 4px}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.c-grid{stroke:var(--border);stroke-width:1}
.c-axis{fill:var(--muted);font:11px "JetBrains Mono",monospace}
.c-bar{fill:var(--primary)}.c-bar-over{fill:var(--red-btn)}.c-bar-sel{stroke:var(--text);stroke-width:2}
.c-bar-link:hover .c-bar,.c-bar-link:hover .c-bar-over{opacity:.8}
.c-ent{stroke:var(--text-2);stroke-width:1.5;stroke-dasharray:6 4}
.c-ent-label{fill:var(--text);font:600 11.5px "Proxima Nova",Figtree,Arial,sans-serif}
.c-line{fill:none;stroke:#2E79BB;stroke-width:2}
.c-mark{stroke:var(--border-strong);stroke-width:1}
.c-peak{fill:var(--text);font:600 11px "Proxima Nova",Figtree,Arial,sans-serif}
.lg{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--text-2)}
.lg-sw{width:12px;height:12px;border-radius:3px;display:inline-block;background:var(--primary)}
.lg-sw.over{background:var(--red-btn)}
.lg-dash{width:18px;border-top:2px dashed var(--text-2);display:inline-block}
.codeblock{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:12px;padding:12px 14px;background:var(--surface-3);border-radius:4px;white-space:pre;overflow-x:auto;line-height:1.55;margin:0}
.radio-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;border:0;padding:0;margin:0}
.radio-card{padding:12px 14px;display:flex;gap:10px;align-items:flex-start;cursor:pointer;border:1px solid var(--border);border-radius:6px;background:var(--surface)}
.radio-card:has(input:checked){border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}
.feed li.on{background:var(--primary-soft)}
.feed li.on b,.feed li.on a{color:var(--link)}
.feed a.item{display:flex;gap:10px;justify-content:space-between;width:100%;color:inherit;text-decoration:none}
.pill-xs{height:18px;font-size:10.5px}
.split{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.split>.side{flex:1 1 280px}
.split>.main{flex:999 1 660px;min-width:0}
.kpi .v .u{font-size:16px;font-weight:600;color:var(--muted);margin-left:4px}
.kpi .v.money{font-size:22px}
.calc{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:11.5px}
.dropdown{position:relative;display:inline-block}
.dropdown>summary{list-style:none;cursor:pointer}
.dropdown>summary::-webkit-details-marker{display:none}
.dropdown[open]>.menu{position:absolute;right:0;top:calc(100% + 4px);z-index:20;min-width:240px;background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow);padding:6px;display:flex;flex-direction:column;gap:2px}
.menu a,.menu button{display:block;text-align:left;width:100%;padding:7px 10px;border-radius:4px;font-size:13px;color:var(--text);text-decoration:none;background:none;border:0;cursor:pointer;font-family:inherit}
.menu a:hover,.menu button:hover{background:var(--surface-2)}
.menu .help{padding:2px 10px 6px}
.panel-form{padding:16px;display:flex;flex-direction:column;gap:14px}
.key-once{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:13px;padding:10px 12px;background:var(--surface-3);border-radius:4px;word-break:break-all;user-select:all}
.feed a.item .t{display:block}
.feed a.item>span:first-child{min-width:0}
.tbl .input.num-in{width:96px;min-width:96px}
figure.chart{margin:0}
.chart .c-axis{font-size:15px}
.chart .c-ent-label,.chart .c-peak{font-size:15px}
/* CR-8 monitoring */
.st{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;white-space:nowrap}
.st .sq{width:10px;height:10px;border-radius:3px;flex:none;display:inline-block}
.st-run{color:var(--green-text)}.st-run .sq{background:#4F9E2F}
.st-deg{color:var(--orange-text)}.st-deg .sq{background:var(--orange)}
.st-down{color:var(--red-text)}.st-down .sq{background:var(--red-btn)}
.st-unk{color:var(--muted)}.st-unk .sq{background:var(--border-strong)}
.st-start{color:var(--link)}.st-start .sq{background:var(--primary)}
.sev{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:4px;font-size:11.5px;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.sev-c{background:var(--red-btn);color:#fff}.sev-ma{background:var(--orange);color:#1B1A2E}.sev-mi{background:var(--yellow);color:#1B1A2E}
.tl svg{display:block}
.tl-run{fill:#4F9E2F}.tl-deg{fill:var(--orange)}.tl-down{fill:var(--red-btn)}.tl-start{fill:var(--primary)}.tl-unk{fill:var(--border-strong)}.tl-none{fill:var(--surface-3)}
.map-wrap{overflow-x:auto;background:var(--surface-2);background-image:radial-gradient(var(--border) 1px,transparent 1px);background-size:20px 20px;padding:12px}
.map-wrap svg{display:block;margin:0 auto;max-width:100%;height:auto}
.mn-box{fill:var(--surface);stroke:var(--border-strong);stroke-width:1}
.mn-box.down{stroke:var(--red-btn);stroke-width:2}.mn-box.deg{stroke:var(--orange);stroke-width:2}
.mn-ring.st-run{fill:#4F9E2F}.mn-ring.st-deg{fill:var(--orange)}.mn-ring.st-down{fill:var(--red-btn)}.mn-ring.st-unk{fill:var(--border-strong)}.mn-ring.st-start{fill:var(--primary)}
.mn-name{fill:var(--text);font:700 13px "Proxima Nova",Figtree,Arial,sans-serif}
.mn-meta{fill:var(--muted);font:11.5px "Proxima Nova",Figtree,Arial,sans-serif}
.mn-st{font:700 11.5px "Proxima Nova",Figtree,Arial,sans-serif}
.mn-st.st-run{fill:var(--green-text)}.mn-st.st-deg{fill:var(--orange-text)}.mn-st.st-down{fill:var(--red-text)}.mn-st.st-unk{fill:var(--muted)}.mn-st.st-start{fill:var(--link)}
.mn-edge{stroke:#8C9598;stroke-width:1.6;fill:none}.mn-edge.bad{stroke:var(--red-btn);stroke-width:2}
.mn-glyph{fill:#fff;font:700 11px "Proxima Nova",Figtree,Arial,sans-serif}
.feed-tight li{padding:6px 16px;font-size:12.5px}
.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px;padding:16px;border-top:1px solid var(--border)}
.detail-grid h4{margin:0 0 8px;font-size:13px}
tr.expand>td{white-space:normal;background:var(--surface)}
.wrap-any{white-space:pre-wrap;word-break:break-all}
.bulk-bar-dark{display:flex;gap:10px;align-items:center;background:var(--navy);color:#fff;padding:8px 16px}
.bulk-bar-dark .btn{background:rgba(255,255,255,.12);color:#fff}
.cond-box{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:6px;background:var(--surface-2);font-size:13.5px}
.cond-box .input{width:auto;min-width:72px}
.opt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
.opt-grid label,.opt-row label{display:flex;gap:6px;align-items:center}
.ico-host{width:32px;height:32px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:#26235D;flex:none}
.ico-host.agentless{background:#6E797C}
.mon-tree{list-style:none;margin:0;padding:0}
.mon-tree li{display:flex;gap:8px;align-items:center;padding:6px 14px;font-size:13px}
.mon-tree li.child{padding-left:34px}
.mon-tree li.on{background:var(--primary-soft)}
.mon-tree a{color:inherit;text-decoration:none}
.top-ev{display:flex;flex-direction:column;gap:10px;font-size:12.5px}
.top-ev .row{justify-content:space-between}

/* object picker (js/picker.js) */
.picker{position:relative;display:flex;flex-direction:column;gap:4px;min-width:200px;flex:1}
.picker-list{position:absolute;top:calc(100% + 2px);left:0;right:0;z-index:50;margin:0;padding:4px;list-style:none;max-height:320px;overflow:auto;box-shadow:0 6px 20px rgba(20,18,60,.16)}
.picker-sm .picker-list{top:34px}
.picker-opt{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding:7px 10px;border-radius:4px;cursor:pointer;font-size:13px}
.picker-opt.on,.picker-opt:hover{background:var(--primary-soft)}
.picker-name{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker-meta{color:var(--muted);font-size:11.5px;white-space:nowrap}
.picker-foot{padding:7px 10px 4px;color:var(--muted);font-size:12px;border-top:1px solid var(--border);margin-top:4px}
.picker-all{background:none;border:0;padding:0;color:var(--link);font:inherit;cursor:pointer;text-decoration:underline}
.picker.invalid .picker-q{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}