/* [gate0311] YAS Cloud Portal in the YAS Gate console look (yas-console-ui-kit/yas gate): one theme layer, loaded LAST in the
   shell and injected into every embedded page. Tokens first (light on the root, dark by data-theme), then the shell
   (brand ribbon, grouped page tabs on top, units list on the left, details panel on the right), then components.
   Built from tokens only; the old token names (--bg, --panel, --line, --accent ...) are re-pointed so every page follows. */

/* ------------------------------------------------------------------ tokens: light (extra .gate weight: must beat yx.css html.tx.tx.yx[data-theme=light]) */
html.gate.gate.gate.gate.gate{
 --g-brand:linear-gradient(135deg,#1b6ec2,#0d3b66);--g-brand-h:linear-gradient(135deg,#2079d0,#0f4576);--g-brand-flat:linear-gradient(135deg,#1b6ec2,#134f8f);
 --g-navy:#0d3b66;--g-blue:#1b6ec2;
 --g-on:#fff;--g-on-mut:#eaf2fb;--g-on-fill:rgba(255,255,255,.16);--g-on-fill-h:rgba(255,255,255,.26);--g-on-fill-s:rgba(255,255,255,.28);--g-on-bd:rgba(255,255,255,.30);--g-on-bd-h:rgba(255,255,255,.45);--g-on-ok:#5ee08a;--g-on-ok-h:rgba(94,224,138,.30);
 --g-base:#f4f6fa;--g-raised:#fff;--g-sunken:#f7f9fc;--g-hover:#edfaf3;--g-active:#d9f5e6;--g-field:#fff;--g-scrim:rgba(8,20,36,.5);
 --g-bd:#e3e8f0;--g-bd2:#c9d2df;--g-bd-strong:#75869f;
 --g-text:#101828;--g-text2:#475467;--g-muted:#54637a;
 --g-pri:#0d7a49;--g-pri-bg:#e7f8ef;--g-pri-bd:#a9e3c6;--g-pri-solid:#0d7a49;--g-pri-solid-h:#0a6238;
 --g-ok:#15803d;--g-ok-bg:#f0fdf4;--g-ok-bd:#86efac;
 --g-warn:#b45309;--g-warn-bg:#fffbeb;--g-warn-bd:#fde68a;
 --g-bad:#b91c1c;--g-bad-bg:#fef2f2;--g-bad-bd:#fca5a5;--g-bad-solid:#dc3545;--g-bad-solid-h:#b02a37;
 --g-info:#0a67c2;--g-info-bg:#eaf3fd;--g-info-bd:#bcd4f0;
 --g-neu:#475569;--g-neu-bg:#f1f5f9;--g-neu-bd:#cbd5e1;
 --g-sh-xs:0 1px 2px rgba(16,33,60,.06);--g-sh-sm:0 1px 2px rgba(16,33,60,.06),0 2px 6px rgba(20,40,70,.08);
 --g-sh-lg:0 2px 4px rgba(15,23,42,.05),0 16px 44px rgba(13,59,102,.16);--g-sh-brand:0 1px 6px rgba(13,59,102,.35);
 --g-font:'Cascadia Code','Cascadia Mono','JetBrains Mono',ui-monospace,Consolas,'SF Mono',Menlo,'Liberation Mono',monospace;
 --g-mono:ui-monospace,'Cascadia Code',Consolas,SFMono-Regular,'SF Mono',Menlo,'Liberation Mono',monospace;
 --g-2xs:10.5px;--g-xs:11.5px;--g-sm:12.5px;--g-base-fs:13px;--g-md:14px;--g-lg:16px;--g-xl:19px;--g-2xl:23px;--g-3xl:28px;
 --g-left:248px;--g-right:480px;
 /* the old portal tokens, re-pointed */
 --bg:var(--g-base);--bg2:var(--g-sunken);--bg3:#edf1f7;--panel:var(--g-raised);--panel-s:var(--g-raised);--panel2:var(--g-sunken);
 --glass:var(--g-raised);--glass2:var(--g-sunken);--card:var(--g-raised);
 --line:var(--g-bd);--line2:var(--g-bd2);--text:var(--g-text);--muted:var(--g-muted);--dim:#75869f;
 --accent:var(--g-pri);--accent2:var(--g-pri-solid-h);--acc:var(--g-pri);--acc2:var(--g-pri-solid-h);--soft:rgba(13,122,73,.12);--glow:rgba(13,122,73,.25);
 --ok:var(--g-ok);--warn:var(--g-warn);--bad:var(--g-bad);--off:#94a3b8;--info:var(--g-info);--cyan:#0891b2;--violet:#6d28d9;--blue:var(--g-blue);
 --grad:var(--g-brand);
 --font:var(--g-font);--head:var(--g-font);--mono:var(--g-mono);
 --fs-xs:var(--g-xs);--fs-s:var(--g-sm);--fs:var(--g-base-fs);--fs-m:var(--g-md);--fs-l:var(--g-lg);--fs-xl:var(--g-xl);--fs-2xl:var(--g-2xl);
 --r:8px;--r-s:6px;--r-l:10px;--top:46px;
 --sh:var(--g-sh-sm);--sh-l:var(--g-sh-lg);
 --yx-fx-acc:13,122,73;--yx-fx-cy:10,103,194;--yx-fx-grid:15,23,42;--yx-fx-k:0;
 color-scheme:light}

/* ------------------------------------------------------------------ tokens: dark (the portal default) */
html.gate.gate.gate.gate.gate[data-theme="dark"]{
 --g-on-ok:#5ee08a;
 --g-base:#0a111d;--g-raised:#111c2e;--g-sunken:#0e1727;--g-hover:#1a2740;--g-active:#21324e;--g-field:#0e1727;--g-scrim:rgba(2,8,18,.66);
 --g-bd:rgba(255,255,255,.10);--g-bd2:rgba(255,255,255,.20);--g-bd-strong:rgba(255,255,255,.34);
 --g-text:#e6edf5;--g-text2:#b7c4d6;--g-muted:#93a4b8;
 --g-pri:#4ade80;--g-pri-bg:#0d2a1c;--g-pri-bd:#1c5a3a;--g-pri-solid:#0d7a49;--g-pri-solid-h:#0a6238;
 --g-ok:#4ade80;--g-ok-bg:#0d2a1c;--g-ok-bd:#1c5a3a;
 --g-warn:#fcd34d;--g-warn-bg:#2a1f08;--g-warn-bd:#6b5210;
 --g-bad:#f87171;--g-bad-bg:#2c1315;--g-bad-bd:#6f2b2b;
 --g-info:#7fb2ff;--g-info-bg:#0f2a49;--g-info-bd:#24406e;
 --g-neu:#93a4b8;--g-neu-bg:#16233a;--g-neu-bd:#3a4d66;
 --g-sh-xs:0 1px 2px rgba(0,0,0,.35);--g-sh-sm:0 1px 2px rgba(0,0,0,.35),0 2px 10px rgba(0,0,0,.30);
 --g-sh-lg:0 2px 4px rgba(0,0,0,.35),0 16px 44px rgba(2,8,18,.55);--g-sh-brand:0 1px 6px rgba(0,0,0,.55);
 --bg3:#16233a;--dim:#6b7d93;--off:#4b5a6e;--cyan:#37c8f5;--violet:#a78bfa;--blue:#7fb2ff;
 --soft:rgba(74,222,128,.12);--glow:rgba(74,222,128,.28);
 --yx-fx-acc:74,222,128;--yx-fx-cy:55,200,245;--yx-fx-grid:148,163,184;
 color-scheme:dark}

/* ------------------------------------------------------------------ base */
html.gate.gate.gate body{font-family:var(--g-font);font-size:var(--g-base-fs);line-height:1.45;background:var(--g-base);color:var(--g-text);-webkit-font-smoothing:antialiased}
html.gate.gate.gate h1,html.gate.gate.gate h2,html.gate.gate.gate h3,html.gate.gate.gate h4{font-family:var(--g-font);letter-spacing:0}
html.gate.gate.gate a{color:var(--g-pri)}
html.gate.gate.gate :focus-visible{outline:2px solid var(--g-info);outline-offset:2px}
html.gate.gate.gate #yxBg,html.gate.gate.gate .bgfx{display:none!important}
html.gate.gate.gate *{scrollbar-color:var(--g-bd2) transparent}
html.gate.gate.gate .muted,html.gate.gate.gate .sm,html.gate.gate.gate small{color:var(--g-muted)}

/* ------------------------------------------------------------------ shell: no rail */
html.gate.gate.gate body,html.gate.gate.gate body.rail-open{--side:0px}
html.gate.gate.gate .side{display:none!important}
html.gate.gate.gate .main{margin-left:0!important;height:100vh;height:100dvh}
html.gate.gate.gate .burger,html.gate.gate.gate #burger{display:none!important}
html.gate.gate.gate .scrim{display:none!important}

/* header stack */
html.gate.gate.gate .gt-head{flex:none;position:relative;z-index:40}
/* brand ribbon = the old top bar */
html.gate.gate.gate .topbar{height:46px!important;min-height:46px;padding:0 12px!important;gap:8px!important;background:var(--g-brand)!important;color:var(--g-on);border-bottom:0!important;box-shadow:var(--g-sh-brand);backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.gate.gate.gate .topbar::after{display:none!important}
html.gate.gate.gate .topbar .brand{height:46px;border:0;padding:0 6px 0 0;gap:10px;flex:none}
html.gate.gate.gate .topbar .brand .logo{background:#fff!important;border-radius:6px;padding:2px 4px;box-shadow:none;animation:none}
html.gate.gate.gate .topbar .brand .logo img{height:24px;display:block}
html.gate.gate.gate .topbar .brand .lg-d{display:none}html.gate.gate.gate .topbar .brand .lg-l{display:block}
html.gate.gate.gate .topbar .brand>span:last-child{opacity:1}
html.gate.gate.gate .topbar .brand b{font:650 var(--g-md)/1.1 var(--g-font);color:var(--g-on)}
html.gate.gate.gate .topbar .brand small{font-size:var(--g-2xs);letter-spacing:.06em;color:var(--g-on-mut);opacity:.9;text-transform:uppercase}
html.gate.gate.gate .topbar .ghost{height:30px!important;min-width:30px!important;border-radius:6px!important;color:var(--g-on)!important;background:var(--g-on-fill)!important;border:1px solid var(--g-on-bd)!important;font-size:14px!important}
html.gate.gate.gate .topbar .ghost:hover{background:var(--g-on-fill-h)!important;border-color:var(--g-on-bd-h)!important}
html.gate.gate.gate .topbar .search-btn{height:30px!important;min-width:220px;flex:0 1 320px;border-radius:6px!important;background:var(--g-on-fill)!important;border:1px solid var(--g-on-bd)!important;color:var(--g-on-mut)!important;font:var(--g-sm) var(--g-font)!important;box-shadow:none!important}
html.gate.gate.gate .topbar .search-btn:hover{background:var(--g-on-fill-h)!important;border-color:var(--g-on-bd-h)!important}
html.gate.gate.gate .topbar .search-btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.gate.gate.gate .topbar kbd{background:var(--g-on-fill-s)!important;border-color:var(--g-on-bd)!important;color:var(--g-on)!important}
html.gate.gate.gate .topbar .yx-clock{color:var(--g-on-mut);font:600 var(--g-sm)/1 var(--g-font)}html.gate.gate.gate .topbar .yx-clock b{color:var(--g-on)}
html.gate.gate.gate .topbar .netbadge{background:var(--g-on-fill)!important;border:1px solid var(--g-on-bd)!important;color:var(--g-on)!important;font-size:var(--g-xs)!important}
html.gate.gate.gate .topbar .netbadge:empty{display:none}
html.gate.gate.gate .topbar .yx-slt{background:var(--g-on-fill)!important;border:1px solid var(--g-on-bd)!important;color:var(--g-on)!important}
html.gate.gate.gate .topbar #subslot:empty{display:none}
/* the user chip (moved from the old rail) */
html.gate.gate.gate .topbar .me{border:0;padding:0 0 0 4px;gap:6px;flex:none;flex-direction:row!important;height:46px}
html.gate.gate.gate .topbar .me .av{width:26px;height:26px;border-radius:999px;background:var(--g-on)!important;color:var(--g-navy)!important;font:700 var(--g-xs) var(--g-font);display:grid;place-items:center;box-shadow:none}
html.gate.gate.gate .topbar .me .mename{display:block!important;max-width:150px;line-height:1.1}
html.gate.gate.gate .topbar .me .mename b{font-size:var(--g-sm);color:var(--g-on)}html.gate.gate.gate .topbar .me .mename small{font-size:var(--g-2xs);color:var(--g-on-mut)}
html.gate.gate.gate .topbar .me form{margin:0}

/* nav row: crumb + grouped page tabs */
html.gate.gate.gate .gt-nav{display:flex;align-items:stretch;gap:8px;min-height:38px;padding:0 12px;background:var(--g-raised);border-bottom:1px solid var(--g-bd);font-size:var(--g-sm)}
html.gate.gate.gate .gt-crumb{display:flex;align-items:center;gap:6px;flex:0 1 auto;min-width:0;padding-right:10px;border-right:1px solid var(--g-bd);white-space:nowrap}
html.gate.gate.gate .gt-crumb .gt-cg{font-weight:700;color:var(--g-pri)}html.gate.gate.gate .gt-crumb .gt-cs{opacity:.6;font-size:var(--g-xs)}
html.gate.gate.gate .gt-crumb h1,html.gate.gate.gate #ptitle{font:600 var(--g-sm)/1 var(--g-font)!important;color:var(--g-text);margin:0!important;max-width:none!important;overflow:hidden;text-overflow:ellipsis}
html.gate.gate.gate #nav{flex:1 1 auto;min-width:0;display:flex!important;flex-direction:row!important;align-items:stretch;gap:2px;padding:0!important;overflow:visible!important}
html.gate.gate.gate #nav .gt-grp{position:relative;display:flex;align-items:stretch;gap:1px}
html.gate.gate.gate #nav .navgrp{display:flex!important;align-items:center;gap:5px;height:auto!important;margin:0!important;padding:0 10px!important;background:none!important;cursor:pointer;border-radius:6px 6px 0 0;color:var(--g-text2);font-weight:600;white-space:nowrap;user-select:none}
html.gate.gate.gate #nav .navgrp span{display:inline!important;font-size:var(--g-sm)!important;letter-spacing:0!important;text-transform:none!important;color:inherit!important;opacity:1!important}
html.gate.gate.gate #nav .navgrp::after{content:"▾";font-size:10px;opacity:.6}
html.gate.gate.gate #nav .navgrp:hover{background:var(--g-pri-bg);color:var(--g-pri)}
html.gate.gate.gate #nav .gt-grp.cur>.navgrp{color:var(--g-on);background:var(--g-brand-flat)}
html.gate.gate.gate #nav .gt-grp.cur>.navgrp::after{content:"›";font-size:13px;opacity:.9}
html.gate.gate.gate #nav .gt-grp.has-n>.navgrp::before{content:"";width:7px;height:7px;border-radius:999px;background:var(--g-warn);flex:none}
html.gate.gate.gate #nav a{height:36px!important;align-self:flex-end;padding:0 11px!important;gap:6px!important;border-radius:6px 6px 0 0!important;font-size:var(--g-sm)!important;font-weight:500;color:var(--g-text2)!important;background:none!important;border-bottom:2px solid transparent;transform:none!important}
html.gate.gate.gate #nav a span{opacity:1!important;position:static!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;transform:none!important;font-size:inherit!important;pointer-events:auto!important}
html.gate.gate.gate #nav a i{font-size:13px!important;width:auto!important;color:inherit;filter:none!important}
html.gate.gate.gate #nav a:hover{color:var(--g-pri)!important;background:var(--g-pri-bg)!important}
html.gate.gate.gate #nav a.on{color:var(--g-on)!important;font-weight:700;background:var(--g-brand)!important;box-shadow:inset 0 -3px 0 var(--g-navy)!important}
html.gate.gate.gate #nav a.on::before{display:none!important}
html.gate.gate.gate #nav a .pill{position:static!important;margin-left:2px}
/* pages of the other groups open as a menu under their group name */
html.gate.gate.gate #nav .gt-grp:not(.cur)>a{display:none!important}
html.gate.gate.gate #nav .gt-grp.open:not(.cur)>a{display:flex!important}
html.gate.gate.gate #nav .gt-grp.open:not(.cur){position:relative}
html.gate.gate.gate #nav .gt-grp .gt-menu{display:none}
html.gate.gate.gate #nav .gt-grp.open:not(.cur) .gt-menu{display:flex;flex-direction:column;position:absolute;top:100%;left:0;min-width:220px;padding:4px;background:var(--g-raised);border:1px solid var(--g-bd2);border-radius:8px;box-shadow:var(--g-sh-lg);z-index:200}
html.gate.gate.gate #nav .gt-menu a{height:32px!important;border-radius:6px!important;align-self:stretch;border:0}
html.gate.gate.gate #nav .gt-menu a.on{box-shadow:none!important}

/* sub row: page sub-tabs + open-page tabs */
html.gate.gate.gate .gt-sub{display:flex;align-items:center;gap:8px;min-height:0;padding:0 12px;background:var(--g-sunken);border-bottom:1px solid var(--g-bd)}
html.gate.gate.gate .gt-sub:not(:has(#subslot>*)):has(#tabbar[hidden]),html.gate.gate.gate html.yx-notabs .gt-sub:not(:has(#subslot>*)){display:none}
html.gate.gate.gate .gt-sub #subslot{flex:1 1 auto;min-width:0}
html.gate.gate.gate .gt-sub #subslot:empty{display:none}
html.gate.gate.gate .gt-sub #subslot .tabs{margin:4px 0;border:0;background:none;padding:0}
html.gate.gate.gate #tabbar{flex:1 1 auto;height:30px!important;padding:0!important;background:none!important;border:0!important;backdrop-filter:none!important}
html.gate.gate.gate #tabbar a{font-size:var(--g-xs)!important;border-radius:6px 6px 0 0!important}
html.gate.gate.gate #tabbar a.on{background:var(--g-raised)!important;box-shadow:inset 0 2px 0 var(--g-pri)!important}
html.gate.gate.gate #tabbar a.on::after{display:none}

/* page area */
html.gate.gate.gate #view{padding:12px 14px 20px!important;animation:none!important}
html.gate.gate.gate #view,html.gate.gate.gate #frames,html.gate.gate.gate #errs{transition:margin .18s ease}

/* left: units list */
html.gate.gate.gate #hosts{top:var(--gt-top,120px)!important;left:0!important;bottom:0;width:var(--g-left)!important;background:var(--g-raised)!important;border-right:1px solid var(--g-bd)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;z-index:30;box-shadow:none}
html.gate.gate.gate #hosts .hh{height:38px!important;padding:0 12px!important;background:var(--g-sunken);border-bottom:1px solid var(--g-bd)}
html.gate.gate.gate #hosts .hh b{font-size:var(--g-2xs)!important;letter-spacing:.06em!important;color:var(--g-muted)}
html.gate.gate.gate #hosts .hq input{height:28px}
html.gate.gate.gate #hosts .fold{border-color:var(--g-bd);background:var(--g-raised);border-radius:6px}
html.gate.gate.gate #hosts .fold>.fh{background:var(--g-sunken);font-weight:600;font-size:var(--g-xs)}
html.gate.gate.gate #hosts .hrow.on{background:var(--g-pri-bg)!important;box-shadow:inset 3px 0 0 var(--g-pri)!important}
html.gate.gate.gate #hosts .hrow:hover{background:var(--g-hover)}
html.gate.gate.gate #hosts .hrow .hn{font-size:var(--g-xs)}html.gate.gate.gate #hosts .hrow small{font-size:10px}
html.gate.gate.gate body.hosts-on .main{margin-left:0!important}
html.gate.gate.gate body.hosts-on #view,html.gate.gate.gate body.hosts-on #frames,html.gate.gate.gate body.hosts-on #errs{margin-left:var(--g-left)}
html.gate.gate.gate.yx-hpeek #hosts{display:flex!important;box-shadow:var(--g-sh-lg)!important;z-index:60}

/* right: details panel (unit drawer) */
html.gate.gate.gate .udrawer{top:var(--gt-top,120px)!important;width:min(var(--g-right),100vw)!important;background:var(--g-raised)!important;border-left:1px solid var(--g-bd2)!important;box-shadow:var(--g-sh-lg)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;z-index:35}
html.gate.gate.gate .udrawer .dh{height:44px!important;background:var(--g-sunken)!important;border-bottom:1px solid var(--g-bd)!important;padding:0 12px!important}
html.gate.gate.gate .udrawer .dh h2{font:650 var(--g-md)/1.2 var(--g-font)!important}
html.gate.gate.gate .udrawer .db{padding:10px!important}
html.gate.gate.gate .udrawer .wg{grid-template-columns:1fr 1fr!important}
html.gate.gate.gate .udrawer .wg .w2,html.gate.gate.gate .udrawer .wg .wf{grid-column:1/-1}
html.gate.gate.gate .dscrim.on{background:var(--g-scrim)!important;backdrop-filter:none!important;top:var(--gt-top,0)}
@media (min-width:1440px){
 html.gate.gate.gate.gt-dr .dscrim{display:none!important}
 html.gate.gate.gate.gt-dr #view,html.gate.gate.gate.gt-dr #frames,html.gate.gate.gate.gt-dr #errs{margin-right:var(--g-right)}
 html.gate.gate.gate .udrawer{box-shadow:none!important}
}
@media (max-width:1199px){
 html.gate.gate.gate #hosts{display:none!important}
 html.gate.gate.gate.yx-hpeek #hosts{display:flex!important}
 html.gate.gate.gate body.hosts-on #view,html.gate.gate.gate body.hosts-on #frames,html.gate.gate.gate body.hosts-on #errs{margin-left:0}
}
@media (max-width:1100px){html.gate.gate.gate .topbar .yx-clock,html.gate.gate.gate .topbar .me .mename{display:none!important}html.gate.gate.gate .topbar .search-btn{min-width:0;flex:0 1 200px}}
@media (max-width:860px){html.gate.gate.gate .topbar .brand>span:last-child{display:none}html.gate.gate.gate .topbar .search-btn span{display:none}html.gate.gate.gate .topbar .search-btn{flex:none}}

/* ------------------------------------------------------------------ components */
/* cards */
html.gate.gate.gate .card,html.gate.gate.gate .panel,html.gate.gate.gate .box,html.gate.gate.gate .dpan,html.gate.gate.gate .w,html.gate.gate.gate .yx-tvcard{background:var(--g-raised)!important;border:1px solid var(--g-bd)!important;border-radius:10px;box-shadow:var(--g-sh-xs)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.gate.gate.gate .card>h2:first-child,html.gate.gate.gate .card>h3:first-child,html.gate.gate.gate .yx-ch,html.gate.gate.gate .dpan>h3:first-child,html.gate.gate.gate .dpan>.dh{background:var(--g-sunken);border-bottom:1px solid var(--g-bd)}
html.gate.gate.gate .yx-ch{position:relative;padding-left:20px!important;min-height:44px!important}
html.gate.gate.gate .yx-ch::before{content:"";position:absolute;left:10px;top:50%;width:3px;height:14px;margin-top:-7px;border-radius:999px;background:var(--g-pri);opacity:.85}
html.gate.gate.gate .card h2,html.gate.gate.gate .card h3,html.gate.gate.gate .w h4,html.gate.gate.gate .dpan h3{font-family:var(--g-font)}
html.gate.gate.gate .w h4,html.gate.gate.gate .dpan h3{font-size:var(--g-xs)!important;font-weight:700!important;letter-spacing:.09em;text-transform:uppercase;color:var(--g-text2)}
html.gate.gate.gate .err{background:var(--g-bad-bg);border:1px solid var(--g-bad-bd);color:var(--g-bad);border-radius:8px}
html.gate.gate.gate .empty{color:var(--g-muted)}

/* buttons */
html.gate.gate.gate .btn,html.gate.gate.gate button.btn,html.gate.gate.gate .ib{height:30px;padding:0 12px;border-radius:6px!important;font:600 var(--g-sm)/1 var(--g-font)!important;background:var(--g-raised)!important;color:var(--g-text)!important;border:1px solid var(--g-bd-strong)!important;box-shadow:none!important;transition:background .09s,border-color .09s,color .09s,transform .14s}
html.gate.gate.gate .btn:hover:not([disabled]),html.gate.gate.gate .ib:hover{background:var(--g-hover)!important;border-color:var(--g-pri)!important;color:var(--g-pri)!important;transform:translateY(-1px)}
html.gate.gate.gate .btn.sm{height:26px;padding:0 9px;font-size:var(--g-xs)!important}
html.gate.gate.gate .btn.primary,html.gate.gate.gate .btn.acc,html.gate.gate.gate .ib.acc{background:var(--g-pri-solid)!important;color:#fff!important;border-color:var(--g-pri-solid)!important;filter:none!important}
html.gate.gate.gate .btn.primary:hover,html.gate.gate.gate .btn.acc:hover,html.gate.gate.gate .ib.acc:hover{background:var(--g-pri-solid-h)!important;border-color:var(--g-pri-solid-h)!important;color:#fff!important}
html.gate.gate.gate .btn.danger{background:var(--g-bad-solid)!important;color:#fff!important;border-color:var(--g-bad-solid)!important}
html.gate.gate.gate .btn.danger:hover{background:var(--g-bad-solid-h)!important;border-color:var(--g-bad-solid-h)!important;color:#fff!important}
html.gate.gate.gate .btn.warn{color:var(--g-warn)!important;border-color:var(--g-warn-bd)!important;background:var(--g-warn-bg)!important}
html.gate.gate.gate .btn[disabled]{opacity:.55;transform:none}
html.gate.gate.gate .ghost{color:var(--g-text2)}

/* fields */
html.gate.gate.gate input,html.gate.gate.gate select,html.gate.gate.gate textarea{font-family:var(--g-font)!important;font-size:var(--g-sm);background:var(--g-field)!important;border:1px solid var(--g-bd-strong)!important;color:var(--g-text)!important;border-radius:6px!important}
html.gate.gate.gate input:not([type=checkbox]):not([type=radio]),html.gate.gate.gate select{height:30px}
html.gate.gate.gate input:focus,html.gate.gate.gate select:focus,html.gate.gate.gate textarea:focus{border-color:var(--g-info)!important;box-shadow:0 0 0 3px var(--g-info-bg)!important}
html.gate.gate.gate input[type=checkbox],html.gate.gate.gate input[type=radio]{accent-color:var(--g-pri)}
html.gate.gate.gate .topbar input{background:transparent!important;border:0!important;color:var(--g-on)!important}

/* tabs inside pages */
html.gate.gate.gate .tabs{background:var(--g-raised)!important;border:1px solid var(--g-bd)!important;border-radius:8px!important;padding:2px!important}
html.gate.gate.gate .tabs a{font-size:var(--g-sm)!important;color:var(--g-text2)!important;border-radius:6px!important;padding:5px 11px!important}
html.gate.gate.gate .tabs a:hover{color:var(--g-pri)!important;background:var(--g-pri-bg)!important}
html.gate.gate.gate .tabs a.on{color:var(--g-on)!important;background:var(--g-brand)!important;box-shadow:inset 0 -2px 0 var(--g-navy)!important;font-weight:700}

/* tables: sticky upper-case head on the sunken tint, quiet rows */
html.gate.gate.gate table{font-size:var(--g-sm)}
html.gate.gate.gate table th,html.gate.gate.gate .yx-tbl th,html.gate.gate.gate .yx-tvtbl th{background:var(--g-sunken)!important;color:var(--g-muted)!important;font:700 var(--g-2xs)/1.3 var(--g-font)!important;letter-spacing:.045em;text-transform:uppercase;border-bottom:1px solid var(--g-bd)!important}
html.gate.gate.gate table td{border-bottom:1px solid var(--g-bd);color:var(--g-text)}
html.gate.gate.gate table tbody tr:hover td{background:var(--g-hover)}
html.gate.gate.gate .yx-tbl,html.gate.gate.gate .yx-tvtbl{font-size:var(--g-sm)!important}
html.gate.gate.gate .yx-tbl th.sorted,html.gate.gate.gate .yx-tvtbl th.sorted{color:var(--g-pri)!important}
html.gate.gate.gate .yx-tbl td.c-st,html.gate.gate.gate .yx-tbl td.c-id,html.gate.gate.gate .yx-tvtbl td.c-st,html.gate.gate.gate .yx-tvtbl td.c-opid,html.gate.gate.gate .yx-tvtbl td.c-acts{background:var(--g-raised)}
html.gate.gate.gate .yx-tbl tbody tr:hover td.c-st,html.gate.gate.gate .yx-tbl tbody tr:hover td.c-id,html.gate.gate.gate .yx-tvtbl tbody tr:hover td{background:var(--g-hover)!important}
html.gate.gate.gate .yx-tbl tbody tr.sel td,html.gate.gate.gate .yx-tvtbl tbody tr.sel td{background:var(--g-pri-bg)!important}
html.gate.gate.gate .tablewrap,html.gate.gate.gate .tw,html.gate.gate.gate .yx-tvbody,html.gate.gate.gate .tblwrap{max-width:100%;overflow-x:auto}

/* badges, pills, chips, tags: glyph + word, tinted families */
html.gate.gate.gate .pill{background:var(--g-pri-solid)!important;color:#fff!important;font:700 10px/16px var(--g-font)!important;border-radius:999px}
html.gate.gate.gate .pill.bad{background:var(--g-bad-solid)!important}html.gate.gate.gate .pill.warn{background:var(--g-warn)!important;color:#fff!important}
html.gate.gate.gate[data-theme="dark"] .pill.warn{color:#1a1000!important}
html.gate.gate.gate .tag,html.gate.gate.gate .chip,html.gate.gate.gate .vchip,html.gate.gate.gate .lic{border-radius:999px!important;font-family:var(--g-font)!important;font-size:var(--g-2xs)!important;font-weight:600}
html.gate.gate.gate .tag.ok,html.gate.gate.gate .chip.ok,html.gate.gate.gate .lic.ok{background:var(--g-ok-bg)!important;color:var(--g-ok)!important;border-color:var(--g-ok-bd)!important}
html.gate.gate.gate .tag.warn,html.gate.gate.gate .chip.warn,html.gate.gate.gate .lic.warn{background:var(--g-warn-bg)!important;color:var(--g-warn)!important;border-color:var(--g-warn-bd)!important}
html.gate.gate.gate .tag.bad,html.gate.gate.gate .chip.bad,html.gate.gate.gate .lic.bad{background:var(--g-bad-bg)!important;color:var(--g-bad)!important;border-color:var(--g-bad-bd)!important}

/* KPI / count tiles */
html.gate.gate.gate .kpi,html.gate.gate.gate .tot>div,html.gate.gate.gate .yx-tvchips>*{border-radius:8px}
html.gate.gate.gate .kpi b,html.gate.gate.gate .big{font-family:var(--g-font);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* dialogs, palette, toast, menus */
html.gate.gate.gate dialog,html.gate.gate.gate .palbox,html.gate.gate.gate .pop,html.gate.gate.gate .toast{background:var(--g-raised)!important;color:var(--g-text);border:1px solid var(--g-bd2)!important;border-radius:10px!important;box-shadow:var(--g-sh-lg)!important;backdrop-filter:none!important}
html.gate.gate.gate dialog::backdrop{background:var(--g-scrim)}
html.gate.gate.gate .pal{background:var(--g-scrim)!important;backdrop-filter:none!important}

/* never scroll the whole page sideways */
html.gate.gate.gate body,html.gate.gate.gate .main,html.gate.gate.gate #view{overflow-x:hidden}
html.gate.gate.gate #view img,html.gate.gate.gate #view svg,html.gate.gate.gate #view canvas,html.gate.gate.gate #view video{max-width:100%}
html.gate.gate.gate #view pre{white-space:pre-wrap;word-break:break-word}

/* [gate0311] stage 1 fixes: the crumb names the page only (the group is the highlighted group beside it); the nav row wraps
   instead of running off a narrow screen; Units pages carry their own Systems list, so no empty left column there */
html.gate.gate.gate .gt-crumb .gt-cg,html.gate.gate.gate .gt-crumb .gt-cs{display:none}
@media (max-width:1299px){html.gate.gate.gate .gt-crumb{display:none}}
html.gate.gate.gate body.yx-upage #view,html.gate.gate.gate body.yx-upage #errs{margin-left:0}

/* [gate0311] two-level navigation: groups in the ribbon, the current group's pages as the tab row */
html.gate.gate.gate #nav .navgrp,html.gate.gate.gate #nav a.gt-off{display:none!important}
html.gate.gate.gate #nav{overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin;align-items:flex-end}
html.gate.gate.gate .gt-groups{display:flex;align-items:center;gap:2px;flex:0 1 auto;min-width:0;margin-left:6px}
html.gate.gate.gate .gt-g{position:relative;height:30px;padding:0 12px;border:1px solid transparent;border-radius:6px;background:none;color:var(--g-on-mut);font:600 var(--g-sm)/1 var(--g-font);cursor:pointer;white-space:nowrap}
html.gate.gate.gate .gt-g:hover{background:var(--g-on-fill);border-color:var(--g-on-bd);color:var(--g-on)}
html.gate.gate.gate .gt-g.on{background:var(--g-on-fill-s);border-color:var(--g-on-bd-h);color:var(--g-on);box-shadow:inset 0 -2px 0 var(--g-on)}
html.gate.gate.gate .gt-g.has-n::after{content:"";position:absolute;top:5px;right:4px;width:7px;height:7px;border-radius:999px;background:#fbbf24}
html.gate.gate.gate .topbar .sp{flex:1 1 auto}
html.gate.gate.gate .gt-crumb{display:none}
/* narrow: the groups lead the tab row, on the light ground */
html.gate.gate.gate .gt-nav .gt-groups{margin:0;padding-right:8px;border-right:1px solid var(--g-bd);flex:none;max-width:100%;overflow-x:auto}
html.gate.gate.gate .gt-nav .gt-g{color:var(--g-text2);height:28px}
html.gate.gate.gate .gt-nav .gt-g:hover{background:var(--g-pri-bg);color:var(--g-pri);border-color:transparent}
html.gate.gate.gate .gt-nav .gt-g.on{background:var(--g-brand-flat);color:var(--g-on);box-shadow:none}
html.gate.gate.gate.gt-narrow .gt-nav{flex-wrap:wrap}html.gate.gate.gate.gt-narrow .gt-nav .gt-groups{border-right:0;border-bottom:1px solid var(--g-bd);width:100%;padding:4px 0}
@media (max-width:1599px){html.gate.gate.gate .topbar .yx-clock{display:none!important}}
@media (max-width:1499px){html.gate.gate.gate .topbar .search-btn{min-width:0!important;flex:none!important}html.gate.gate.gate .topbar .search-btn span,html.gate.gate.gate .topbar .search-btn kbd{display:none!important}html.gate.gate.gate .topbar .me .mename{display:none!important}}

/* ------------------------------------------------------------------ [gate0311] stage 2: YAS Gate page anatomy on the
   existing page blocks: page header (title + one-line subtitle left, actions right) -> count tiles -> tabs -> card with
   search/filters in its header -> table in its own scroll box */
html.gate.gate.gate .yx-tvh{gap:10px;padding:0 0 2px}
html.gate.gate.gate .yx-tvt>.yxi{width:34px;height:34px;padding:8px;border-radius:8px;color:var(--g-pri);background:var(--g-pri-bg);box-shadow:inset 0 0 0 1px var(--g-pri-bd)}
html.gate.gate.gate .yx-tvt h2{font:700 var(--g-xl)/1.2 var(--g-font)!important;letter-spacing:0}
html.gate.gate.gate .yx-tvt small{font-size:var(--g-sm);color:var(--g-muted)}
html.gate.gate.gate .yx-btn{height:30px;border-radius:6px;border:1px solid var(--g-bd-strong);background:var(--g-raised);color:var(--g-text);font:600 var(--g-sm)/1 var(--g-font);box-shadow:none}
html.gate.gate.gate .yx-btn:hover{background:var(--g-hover);border-color:var(--g-pri);color:var(--g-pri);box-shadow:none}
html.gate.gate.gate .yx-btn.acc,html.gate.gate.gate .yx-btn.primary,html.gate.gate.gate .yx-btn.pri{background:var(--g-pri-solid)!important;border-color:var(--g-pri-solid)!important;color:#fff!important}
html.gate.gate.gate .yx-ib{width:28px;height:28px;border-radius:6px;border:1px solid var(--g-bd-strong);background:var(--g-raised);color:var(--g-text2)}
html.gate.gate.gate .yx-ib:hover{color:var(--g-pri);border-color:var(--g-pri);background:var(--g-hover);box-shadow:none}
html.gate.gate.gate .yx-seg{border-radius:8px;padding:2px;gap:1px;box-shadow:none;background:var(--g-raised);border:1px solid var(--g-bd)}
html.gate.gate.gate .yx-seg button{font:600 var(--g-sm)/1 var(--g-font);padding:7px 13px;border-radius:6px;color:var(--g-text2)}
html.gate.gate.gate .yx-seg button:hover{color:var(--g-pri);background:var(--g-pri-bg)}
html.gate.gate.gate .yx-seg button.on{color:var(--g-on);background:var(--g-brand);box-shadow:inset 0 -2px 0 var(--g-navy)}
html.gate.gate.gate .yx-tvchips>*{background:var(--g-raised);border:1px solid var(--g-bd);box-shadow:var(--g-sh-xs);border-radius:8px}
html.gate.gate.gate .yx-tvchips>*.on,html.gate.gate.gate .yx-tvchips>*[aria-pressed="true"]{border-color:var(--g-pri);box-shadow:0 0 0 1px var(--g-pri) inset}
html.gate.gate.gate .yx-chip{border-radius:999px;font:600 var(--g-2xs)/1.7 var(--g-font)}
html.gate.gate.gate .yx-chip.ok{background:var(--g-ok-bg);color:var(--g-ok);border-color:var(--g-ok-bd)}
html.gate.gate.gate .yx-chip.warn{background:var(--g-warn-bg);color:var(--g-warn);border-color:var(--g-warn-bd)}
html.gate.gate.gate .yx-chip.bad{background:var(--g-bad-bg);color:var(--g-bad);border-color:var(--g-bad-bd)}
html.gate.gate.gate .yx-search{border-radius:6px;background:var(--g-field);border:1px solid var(--g-bd-strong)}
html.gate.gate.gate .yx-search input{border:0!important;box-shadow:none!important;background:transparent!important}
html.gate.gate.gate .yx-empty{color:var(--g-muted)}

/* wide tables: the important columns only; the rest is in the right details panel (row click) / the licence detail */
/* Units list: hide YAS-Remote ID (4), VPN IP (5), cameras (8), radar (9), last image (12) */
html.gate.gate.gate .yx-ulist table tr.yx-grow>td,html.gate.gate.gate .yx-ulist table tr.yx-ph>td{display:table-cell}
html.gate.gate.gate .yx-ulist table tbody tr[data-k]{cursor:pointer}
/* Licences: board type (5), activated by (6), last check-in (9) go to the licence detail */
html.gate.gate.gate .yx-lictbl tr>:nth-child(5),html.gate.gate.gate .yx-lictbl tr>:nth-child(6),html.gate.gate.gate .yx-lictbl tr>:nth-child(9){display:none}
@media (max-width:1199px){html.gate.gate.gate .yx-lictbl tr>:nth-child(3){display:none}}

/* ------------------------------------------------------------------ [gate0311] stage 3: the "Full console" pages
   (Fleet monitor, Updates/OTA, YAS-SSH, Engineer computers, FTP tester = .app; YAS-VPN / YAS-Remote consoles = .yp-c)
   in YAS Gate order: page header (title left, stamp + actions right) -> count tiles on their own row -> tabs -> content;
   unit list on the left (Fleet monitor rail), details on the right (slide panel). Elements are only re-placed by CSS. */
html.gate.gate.gate .app{grid-template-rows:auto 1fr!important;background:var(--g-base)}
html.gate.gate.gate .app>.top{flex-wrap:wrap;row-gap:8px;min-height:0;padding:10px 14px!important;background:var(--g-raised)!important;border-bottom:1px solid var(--g-bd)!important}
html.gate.gate.gate .app>.top .logo{display:none}
html.gate.gate.gate .app>.top .ttl{font:700 var(--g-xl)/1.2 var(--g-font);color:var(--g-text);order:0}
html.gate.gate.gate .app>.top .sp{order:1;flex:1 1 auto}
html.gate.gate.gate .app>.top .stamp{order:2;font-size:var(--g-xs);color:var(--g-muted)}
html.gate.gate.gate .app>.top>.ib,html.gate.gate.gate .app>.top>button{order:3;height:30px;padding:0 12px;border-radius:6px;font:600 var(--g-sm)/1 var(--g-font)}
html.gate.gate.gate .app>.top .kpis,html.gate.gate.gate .app>.top .ep-k{order:10;flex:1 0 100%;margin:0!important;display:flex;flex-wrap:wrap;gap:8px}
html.gate.gate.gate .kpi{background:var(--g-raised)!important;border:1px solid var(--g-bd)!important;border-radius:8px!important;padding:6px 12px!important;box-shadow:var(--g-sh-xs)!important;gap:6px}
html.gate.gate.gate .kpi b{font:700 var(--g-lg)/1.2 var(--g-font)!important;font-variant-numeric:tabular-nums}
html.gate.gate.gate .kpi span,html.gate.gate.gate .kpi small{font-size:var(--g-xs)!important;color:var(--g-muted)!important}
html.gate.gate.gate .kpi.ok b{color:var(--g-ok)!important}html.gate.gate.gate .kpi.warn b{color:var(--g-warn)!important}html.gate.gate.gate .kpi.bad b{color:var(--g-bad)!important}
html.gate.gate.gate .kpi[data-f],html.gate.gate.gate #hsStats .kpi{cursor:pointer}
html.gate.gate.gate .kpi:hover{border-color:var(--g-pri-bd)!important}
/* tabs row of the consoles */
html.gate.gate.gate .ws>.tabs,html.gate.gate.gate .app .tabs#tabs{background:var(--g-sunken)!important;border:0!important;border-bottom:1px solid var(--g-bd)!important;border-radius:0!important;padding:6px 12px 0!important;margin:0!important;gap:2px}
html.gate.gate.gate .tab{font:500 var(--g-sm)/1 var(--g-font);color:var(--g-text2);padding:8px 13px!important;border-radius:6px 6px 0 0!important;border:0!important}
html.gate.gate.gate .tab:hover{color:var(--g-pri);background:var(--g-pri-bg)}
html.gate.gate.gate .tab.on{color:var(--g-on)!important;background:var(--g-brand)!important;box-shadow:inset 0 -3px 0 var(--g-navy);font-weight:700;top:0!important}
html.gate.gate.gate .pane{padding:12px 14px!important;background:var(--g-base)}
/* left list (Fleet monitor) */
html.gate.gate.gate .rail{background:var(--g-raised)!important;border-right:1px solid var(--g-bd)!important}
html.gate.gate.gate .rsearch input{background:var(--g-field)!important;border:1px solid var(--g-bd-strong)!important;height:30px}
html.gate.gate.gate .rfilt button{border-radius:999px!important;border-color:var(--g-bd)!important;font:600 var(--g-2xs)/1.8 var(--g-font)!important}
html.gate.gate.gate .rfilt button.on{background:var(--g-pri-solid)!important;border-color:var(--g-pri-solid)!important;color:#fff!important}
html.gate.gate.gate .ru{border-radius:6px}
html.gate.gate.gate .ru:hover{background:var(--g-hover)}html.gate.gate.gate .ru.on{background:var(--g-pri-bg)!important;border-color:transparent!important;box-shadow:inset 3px 0 0 var(--g-pri)}
html.gate.gate.gate .rfoot{background:var(--g-sunken)}
/* right details panel of the consoles */
html.gate.gate.gate .slide{background:var(--g-raised)!important;border-left:1px solid var(--g-bd2)!important;box-shadow:var(--g-sh-lg)!important}
html.gate.gate.gate .slide .shead{background:var(--g-sunken);border-bottom:1px solid var(--g-bd);min-height:44px;padding:0 12px}
html.gate.gate.gate .slide .shead b{font:700 var(--g-md)/1.2 var(--g-font)}
/* FTP tester + engineer computers sections as kit cards */
html.gate.gate.gate .ep-sec,html.gate.gate.gate .ft-card{background:var(--g-raised)!important;border:1px solid var(--g-bd)!important;border-radius:10px!important;box-shadow:var(--g-sh-xs)}
html.gate.gate.gate .ep-note{background:var(--g-info-bg);border:1px solid var(--g-info-bd);color:var(--g-text);border-radius:8px}
/* yp-c consoles (YAS-VPN, YAS-Remote console): toolbar row, tiles, cards */
html.gate.gate.gate.yp-c .topbar{background:var(--g-raised)!important;border-bottom:1px solid var(--g-bd)!important;padding:0 10px!important;height:44px!important}
html.gate.gate.gate.yp-c .kpis{gap:8px}
html.gate.gate.gate.yp-c .card.bar{background:var(--g-raised)!important;border-radius:8px!important}
/* yp-c toolbar: search left, actions pushed to the right like the YAS Gate page header */
html.gate.gate.gate.yp-c .topbar>#bellBtn,html.gate.gate.gate.yp-c .topbar>.bell{margin-left:auto}
html.gate.gate.gate.yp-c .topbar .gsearch{flex:0 1 380px}

/* ------------------------------------------------------------------ [gate0311] stage 4: ONE font family + ONE type scale
   on every page (shell, list pages, embedded consoles, legacy pages). Kit scale: 10.5 / 11.5 / 12.5 / 13 / 14 / 16 / 19 / 23 / 28.
   Body 13, controls + table cells 12.5, small / time / meta 11.5, badges + table heads 10.5 caps, card titles 11.5 caps,
   section titles 14, page titles 19, big numbers 23. Weight carries hierarchy, not size. */
html.gate.gate.gate body,html.gate.gate.gate body :not(code):not(pre):not(kbd):not(samp):not(.mono):not(.ip):not(.rid):not(svg):not(svg *):not(i):not(.yxi){font-family:var(--g-font)!important}
html.gate.gate.gate code,html.gate.gate.gate pre,html.gate.gate.gate kbd,html.gate.gate.gate samp,html.gate.gate.gate .mono,html.gate.gate.gate .ip,html.gate.gate.gate .rid,html.gate.gate.gate .hh-mono{font-family:var(--g-mono)!important}
html.gate.gate.gate body{font-size:13px!important;line-height:1.45}
html.gate.gate.gate p,html.gate.gate.gate li,html.gate.gate.gate dd,html.gate.gate.gate dt,html.gate.gate.gate label,html.gate.gate.gate .muted,html.gate.gate.gate .note,html.gate.gate.gate .warnbox,html.gate.gate.gate .empty,html.gate.gate.gate .err,html.gate.gate.gate summary,html.gate.gate.gate .ep-note,html.gate.gate.gate td.muted,html.gate.gate.gate span.muted,html.gate.gate.gate div.note{font-size:13px!important}
html.gate.gate.gate small,html.gate.gate.gate time,html.gate.gate.gate .sm,html.gate.gate.gate .stamp,html.gate.gate.gate .ed-stamp,html.gate.gate.gate .hint,html.gate.gate.gate .rfoot,html.gate.gate.gate .yx-count,html.gate.gate.gate .hh-ips,html.gate.gate.gate .hh-dial,html.gate.gate.gate .mv-steps,html.gate.gate.gate .hh-kv dt,html.gate.gate.gate .hh-kv dd,html.gate.gate.gate .kv b,html.gate.gate.gate .kv span{font-size:11.5px!important}
html.gate.gate.gate td,html.gate.gate.gate td a,html.gate.gate.gate td b,html.gate.gate.gate td span:not([class*="chip"]):not([class*="badge"]):not(.pill):not(.tag),html.gate.gate.gate .hh-mono,html.gate.gate.gate .mono,html.gate.gate.gate .ip,html.gate.gate.gate .rid{font-size:12.5px!important}
html.gate.gate.gate td small,html.gate.gate.gate td time{font-size:11.5px!important}
html.gate.gate.gate th,html.gate.gate.gate .pill,html.gate.gate.gate .badge,html.gate.gate.gate .aw-badge,html.gate.gate.gate .bdg,html.gate.gate.gate .ck,html.gate.gate.gate .tag,html.gate.gate.gate .chip,html.gate.gate.gate .vchip,html.gate.gate.gate .yx-chip,html.gate.gate.gate .lic,html.gate.gate.gate .hs-st,html.gate.gate.gate .uc-cat,html.gate.gate.gate .uc-cat b,html.gate.gate.gate .done,html.gate.gate.gate .cur,html.gate.gate.gate .apb,html.gate.gate.gate .uc-tempchip,html.gate.gate.gate .yx-acount{font-size:10.5px!important}
html.gate.gate.gate button,html.gate.gate.gate .btn,html.gate.gate.gate .ib,html.gate.gate.gate .yx-btn,html.gate.gate.gate .yx-ib,html.gate.gate.gate input,html.gate.gate.gate select,html.gate.gate.gate textarea,html.gate.gate.gate .tabs a,html.gate.gate.gate .tab,html.gate.gate.gate .ed-tabs a,html.gate.gate.gate .yx-seg button,html.gate.gate.gate #nav a,html.gate.gate.gate .gt-g,html.gate.gate.gate .np2b,html.gate.gate.gate .yx-usf,html.gate.gate.gate .x,html.gate.gate.gate .hb a,html.gate.gate.gate .hb button,html.gate.gate.gate .yx-chk,html.gate.gate.gate label.ep-row,html.gate.gate.gate .aw-filt label{font-size:12.5px!important}
html.gate.gate.gate h1,html.gate.gate.gate .ttl,html.gate.gate.gate .yx-tvt h2,html.gate.gate.gate .hs-dhead,html.gate.gate.gate .udrawer .dh h2{font-size:19px!important;font-weight:700!important}
html.gate.gate.gate h2{font-size:16px!important;font-weight:700}
html.gate.gate.gate h3,html.gate.gate.gate .ep-sec h3,html.gate.gate.gate header h3,html.gate.gate.gate form h3,html.gate.gate.gate .yx-ch h3,html.gate.gate.gate .yx-ch b,html.gate.gate.gate .yx-aluh b,html.gate.gate.gate .yx-ush b,html.gate.gate.gate .e2 b,html.gate.gate.gate .u2t b,html.gate.gate.gate .uname b,html.gate.gate.gate .yx-usn b{font-size:14px!important;font-weight:700}
html.gate.gate.gate .card>h2,html.gate.gate.gate .card>h3,html.gate.gate.gate .ch h2,html.gate.gate.gate .w h4,html.gate.gate.gate h4,html.gate.gate.gate .dpan h3,html.gate.gate.gate .yx-usgh b,html.gate.gate.gate .yx-usgh em{font-size:11.5px!important;font-weight:700!important;letter-spacing:.08em;text-transform:uppercase}
html.gate.gate.gate .big,html.gate.gate.gate .kpi b,html.gate.gate.gate .yx-tchip b,html.gate.gate.gate .hh-tile b,html.gate.gate.gate .yx-antile b,html.gate.gate.gate .apo,html.gate.gate.gate .k2n,html.gate.gate.gate .yx-tvchips b,html.gate.gate.gate .tot b{font-size:23px!important;font-weight:700!important;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1.15}
html.gate.gate.gate .kpi span,html.gate.gate.gate .yx-tchip span,html.gate.gate.gate .hh-tile span,html.gate.gate.gate .yx-antile span,html.gate.gate.gate .big small{font-size:11.5px!important}
html.gate.gate.gate .yx-empty b{font-size:14px!important}html.gate.gate.gate .yx-empty span{font-size:13px!important}
html.gate.gate.gate .topbar .brand b{font-size:14px!important}html.gate.gate.gate .topbar .brand small{font-size:10.5px!important}
html.gate.gate.gate svg text{font-family:var(--g-font)}
/* one scroll model (kit): the page scrolls; tables / lists / panels scroll inside their own box with a sticky head */
html.gate.gate.gate .yx-tblw,html.gate.gate.gate .tablewrap,html.gate.gate.gate .tw,html.gate.gate.gate .rlist,html.gate.gate.gate #hosts .hl,html.gate.gate.gate .udrawer .db,html.gate.gate.gate .slide .sbody{overscroll-behavior:contain}
html.gate.gate.gate thead th{position:sticky;top:0;z-index:2}
/* one alignment grid: 12px gutters, blocks on the 4px scale, card bodies 12/14 */
html.gate.gate.gate #view>*+*,html.gate.gate.gate .yx-tv>*+*{margin-top:12px}
html.gate.gate.gate .card,html.gate.gate.gate .w,html.gate.gate.gate .dpan,html.gate.gate.gate .ep-sec,html.gate.gate.gate .ft-card{padding:12px 14px}
html.gate.gate.gate .card.tablewrap,html.gate.gate.gate .card.tw,html.gate.gate.gate .card.np,html.gate.gate.gate .yx-tvcard{padding:0}
/* ONE navigation (stage 4): breadcrumb at the start of the single tab row; no open-pages strip */
html.gate.gate.gate #tabbar.gt-gone,html.gate.gate.gate .gt-sub{display:none!important}
html.gate.gate.gate .gt-crumb{display:flex!important;align-items:center;gap:6px;flex:0 1 auto;min-width:0;max-width:40%;padding:0 12px 0 0;margin-right:4px;border-right:1px solid var(--g-bd);white-space:nowrap;overflow:hidden;font-size:12.5px!important}
html.gate.gate.gate .gt-crumb .gt-trail{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis}
html.gate.gate.gate .gt-crumb a{color:var(--g-pri);font-weight:700;text-decoration:none}
html.gate.gate.gate .gt-crumb a:hover{text-decoration:underline}
html.gate.gate.gate .gt-crumb b{color:var(--g-text);font-weight:600;overflow:hidden;text-overflow:ellipsis}
html.gate.gate.gate .gt-crumb .gt-trail>b:first-child{color:var(--g-pri);font-weight:700}
html.gate.gate.gate .gt-crumb .gt-cs{display:inline!important;opacity:.6;font-size:11.5px}
@media (max-width:1299px){html.gate.gate.gate .gt-crumb{display:flex!important;max-width:100%;flex-basis:100%;border-right:0;border-bottom:1px solid var(--g-bd);padding:6px 0}html.gate.gate.gate .gt-nav{flex-wrap:wrap}}
/* a console's own sub-pages = page tabs at the top of the content */
html.gate.gate.gate .gt-ptabs{flex:none;padding:8px 14px 0}
html.gate.gate.gate .gt-ptabs:not(:has(#subslot>*)){display:none}
html.gate.gate.gate body.hosts-on .gt-ptabs{margin-left:var(--g-left)}
html.gate.gate.gate .gt-ptabs #subslot .tabs{margin:0;display:inline-flex;flex-wrap:wrap}
/* every page tab visible: the tab row wraps instead of hiding tabs off the right edge */
html.gate.gate.gate #nav{flex-wrap:wrap!important;overflow:visible!important;row-gap:0}
html.gate.gate.gate .gt-nav{align-items:flex-end}

/* [gate0311-s5] Units: one clean table */
html.gate.gate.gate .yx-ulist .yx-thumb{width:72px;height:40px;border-radius:6px;background:var(--g-sunken);border:1px solid var(--g-bd)}
html.gate.gate.gate .yx-ulist .yx-thumb0{background:repeating-linear-gradient(135deg,var(--g-sunken) 0 6px,var(--g-raised) 6px 12px)}
html.gate.gate.gate .yx-ulist td.c-id b{display:block;font-size:13px!important;font-weight:700}
html.gate.gate.gate .yx-ulist td small{display:block;color:var(--g-muted)}
html.gate.gate.gate .yx-ulist td.c-id small .yx-cat{font-size:11.5px!important;padding:0;background:none;border:0}
html.gate.gate.gate .yx-ulist td.c-last .yx-chip{margin:0 0 2px}
html.gate.gate.gate .yx-ulist td.c-today b{font-size:13px!important;font-variant-numeric:tabular-nums}html.gate.gate.gate .yx-ulist td.c-today small{display:inline}
html.gate.gate.gate .yx-ulist td.c-today b.c-v{color:var(--g-bad)}
html.gate.gate.gate .yx-hd{display:inline-block;width:9px;height:9px;border-radius:999px;margin-right:6px;background:var(--g-neu);vertical-align:middle}
html.gate.gate.gate .yx-hd.ok{background:var(--g-ok)}html.gate.gate.gate .yx-hd.warn{background:var(--g-warn)}html.gate.gate.gate .yx-hd.bad{background:var(--g-bad)}
html.gate.gate.gate .yx-ulist td.c-act{white-space:nowrap;text-align:right}
html.gate.gate.gate .yx-btn.sm{height:26px;padding:0 10px}
/* Dashboard: units as table rows */
html.gate.gate.gate .s2u .u2g{display:block!important;padding:0!important}
html.gate.gate.gate .d2t{width:100%}
html.gate.gate.gate .d2t tr.u2{cursor:pointer;display:table-row!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important}
html.gate.gate.gate .d2t td{padding:8px 12px!important;vertical-align:middle}
html.gate.gate.gate .d2t td b{font-size:13px!important}html.gate.gate.gate .d2t td small{color:var(--g-muted);margin-left:4px}
html.gate.gate.gate .d2t td:nth-child(2) small{display:block;margin:0}
html.gate.gate.gate .d2t b.v{color:var(--g-bad)}
html.gate.gate.gate .d2t .u2d{display:inline-block;width:9px;height:9px;border-radius:999px;background:var(--g-neu)}
html.gate.gate.gate .d2t tr.ok .u2d{background:var(--g-ok)}html.gate.gate.gate .d2t tr.warn .u2d{background:var(--g-warn)}html.gate.gate.gate .d2t tr.bad .u2d{background:var(--g-bad)}
html.gate.gate.gate .d2t .c2{margin:0 4px 2px 0}
html.gate.gate.gate .d2more{display:block;padding:10px 14px;font-weight:700;border-top:1px solid var(--g-bd);text-decoration:none}
/* Logs: one readable table */
html.gate.gate.gate .yx-lgtbl td{vertical-align:top}
html.gate.gate.gate .yx-lgtbl td.c-t{white-space:nowrap;font-variant-numeric:tabular-nums}html.gate.gate.gate .yx-lgtbl td.c-t small{display:block}
html.gate.gate.gate .yx-lgtbl td.c-what{min-width:280px}
html.gate.gate.gate .yx-lgd{margin-top:2px}html.gate.gate.gate .yx-lgd summary{cursor:pointer;color:var(--g-muted);font-size:11.5px!important}
html.gate.gate.gate .yx-lgd .mono{color:var(--g-text2);word-break:break-all;margin-top:4px}
html.gate.gate.gate .yx-lgtbl tr.yx-grow td{background:var(--g-sunken)!important}
/* approval cards: grow with their text (no clipped facts), facts in the 11.5 meta size */
html.gate.gate.gate .apc{aspect-ratio:auto!important;min-height:0!important}
html.gate.gate.gate .apf{overflow:visible!important}html.gate.gate.gate .apf dt,html.gate.gate.gate .apf dd{font-size:11.5px!important}
html.gate.gate.gate .apo{font-size:19px!important}
html.gate.gate.gate .yx-lgtbl{table-layout:auto;width:100%}
html.gate.gate.gate .yx-lgtbl td{white-space:normal!important;overflow-wrap:anywhere}
html.gate.gate.gate .yx-lgtbl td.c-t,html.gate.gate.gate .yx-lgtbl td:nth-child(5),html.gate.gate.gate .yx-lgtbl td:nth-child(6){white-space:nowrap!important}
html.gate.gate.gate .yx-lgd .mono{white-space:pre-wrap}
/* type filter = compact pills, not big tiles */
html.gate.gate.gate .yx-lgchips{display:flex;flex-wrap:wrap;gap:6px;padding:10px 14px 0}
html.gate.gate.gate .yx-lgchips .yx-tchip{height:28px;padding:0 10px;border-radius:999px;display:inline-flex;align-items:center;gap:6px}
html.gate.gate.gate .yx-lgchips .yx-tchip b{font-size:12.5px!important;font-weight:700!important;letter-spacing:0}
html.gate.gate.gate .yx-lgchips .yx-tchip span{font-size:11.5px!important}
html.gate.gate.gate .yx-lgchips .yx-tchip.on{background:var(--g-pri-solid)!important;border-color:var(--g-pri-solid)!important}
html.gate.gate.gate .yx-lgchips .yx-tchip.on b,html.gate.gate.gate .yx-lgchips .yx-tchip.on span{color:#fff!important}

/* [gate0311-s5] dark-mode contrast: white text never sits on the light "as text" status colours - solid fills instead */
html.gate.gate.gate[data-theme="dark"] .bell b,html.gate.gate.gate[data-theme="dark"] .pill.bad,html.gate.gate.gate[data-theme="dark"] .yx-acount,html.gate.gate.gate[data-theme="dark"] .bd.bad,html.gate.gate.gate[data-theme="dark"] .st.bad{background:var(--g-bad-solid)!important;color:#fff!important}
html.gate.gate.gate[data-theme="dark"] .apok,html.gate.gate.gate[data-theme="dark"] button.on,html.gate.gate.gate[data-theme="dark"] .bd.ok.on,html.gate.gate.gate[data-theme="dark"] .rfilt button.on,html.gate.gate.gate[data-theme="dark"] .yx-usf.on{background:var(--g-pri-solid)!important;color:#fff!important;border-color:var(--g-pri-solid)!important}
html.gate.gate.gate .yx-acount{background:var(--g-bad-solid)!important;color:#fff!important}
html.gate.gate.gate .yx-na{color:var(--g-muted)!important}
html.gate.gate.gate.gate.gate[data-theme="dark"]{--dim:#8596ab}
/* light-mode contrast fixes found by the contrast audit */
html.gate.gate.gate.gate.gate:not([data-theme="dark"]){--c-speed:#b45309;--c-patrol:#1d4ed8;--c-redlight:#b91c1c;--c-other:#6d28d9}
html.gate.gate.gate:not([data-theme="dark"]) .bd.warn{color:#fff!important}
html.gate.gate.gate .yx-feat{color:var(--g-info)!important;background:var(--g-info-bg)!important;border-color:var(--g-info-bd)!important}
html.gate.gate.gate b.bad,html.gate.gate.gate .hw-pill.bad,html.gate.gate.gate .hw-pill{color:var(--g-bad)}
html.gate.gate.gate .yx-usgh em,html.gate.gate.gate .yx-usgh b{color:var(--g-text2)!important}
html.gate.gate.gate .yx-chk{color:var(--g-text)!important}
/* Units LIST page: the table is the one list (YAS Gate) - the Systems side list stays on the unit page only */
html.gate.gate.gate .yx-ulay:has(.yx-ulist){grid-template-columns:minmax(0,1fr)!important;height:auto!important;min-height:0!important}
html.gate.gate.gate .yx-ulay:has(.yx-ulist)>.yx-uside{display:none!important}
/* [gate0311-s6] page header + one tab row + one list at a time (gate-pages.js) */
html.gate.gate.gate .gp-head{margin-bottom:0}
html.gate.gate.gate .gp-head .gp-act{display:inline-flex;gap:8px}
html.gate.gate.gate .gp-tabs{margin-top:10px!important}
html.gate.gate.gate .gp-tabs .gp-n:empty{display:none}
html.gate.gate.gate .grid2.gp-one{grid-template-columns:1fr!important}
html.gate.gate.gate .gp-how{padding:0!important}
html.gate.gate.gate .gp-how>summary{cursor:pointer;padding:12px 14px;font-weight:700;color:var(--g-text2)}
html.gate.gate.gate .gp-how .gp-howb{padding:0 14px 12px}
html.gate.gate.gate .gp-how .gp-howb>*{margin:8px 0 0}
html.gate.gate.gate details.gp-more{margin:4px 0}
html.gate.gate.gate details.gp-more>summary{cursor:pointer;display:inline-block;font-size:11.5px!important;font-weight:600;color:var(--g-pri);list-style:none}
html.gate.gate.gate details.gp-more>summary::before{content:"\24D8  "}
html.gate.gate.gate details.gp-more[open]>summary{margin-bottom:4px}
html.gate.gate.gate .gt-crumb{flex:none!important;max-width:none!important}
html.gate.gate.gate .gt-nav{flex-wrap:wrap}
html.gate.gate.gate #nav{flex:1 1 600px!important}
/* [gate0311-s7] console sections one at a time */
html.gate.gate.gate .gp-hid{display:none!important}
html.gate.gate.gate .gp-ctabs{margin:0 0 12px!important;flex-wrap:wrap;display:inline-flex}
html.gate.gate.gate .ed,html.gate.gate.gate .ec-body,html.gate.gate.gate .ed-main{background:var(--g-base)!important}
/* [gate0311-s7b] Engineer computers: the gate / VPN-rule boxes only show when they have content */
html.gate.gate.gate .ep-box:empty{display:none!important}
html.gate.gate.gate .ep-two:not(:has(.ep-box:not(:empty))){display:none!important}

/* [popup0411] security-key step = pop-up over the sign-in page (gate look, dark + light), text wraps, iPad / phone safe */
html.gate.gate.gate body.yk-open{overflow:hidden}
html.gate.gate.gate body.yk-open .loginwrap{filter:blur(2px) saturate(.85);opacity:.55;pointer-events:none;user-select:none}
html.gate.gate.gate .yk-back{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;background:var(--g-scrim);overflow-y:auto;animation:ykF .14s ease both}
html.gate.gate.gate .yk-box{width:min(460px,100%);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;min-width:0;box-sizing:border-box;background:var(--g-raised);color:var(--g-text);border:1px solid var(--g-bd2);border-radius:10px;box-shadow:var(--g-sh-lg);overflow:hidden;animation:ykR .18s ease both}
html.gate.gate.gate .yk-hd{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--g-sunken);color:var(--g-text);border-bottom:1px solid var(--g-bd)}
html.gate.gate.gate .yk-ic{flex:none;width:30px;height:30px;border-radius:8px;background:var(--g-pri-solid);border:1px solid var(--g-pri-solid);position:relative}
html.gate.gate.gate .yk-ic::before{content:"";position:absolute;left:8px;top:6px;width:12px;height:12px;border:2px solid #fff;border-radius:50%;box-sizing:border-box}
html.gate.gate.gate .yk-ic::after{content:"";position:absolute;left:13px;top:17px;width:3px;height:8px;background:#fff;border-radius:1px}
html.gate.gate.gate .yk-tt{display:flex;flex-direction:column;min-width:0}
html.gate.gate.gate .yk-tt b{font-size:var(--g-lg);line-height:1.25;color:var(--g-text)}
html.gate.gate.gate .yk-tt small{font-size:var(--g-xs);color:var(--g-muted)}
html.gate.gate.gate .yk-bd{padding:14px 16px 6px;overflow-y:auto;min-height:0}
html.gate.gate.gate .yk-bd,html.gate.gate.gate .yk-bd p,html.gate.gate.gate .yk-bd label,html.gate.gate.gate .yk-bd .err,html.gate.gate.gate .yk-bd .note,html.gate.gate.gate .yk-bd summary{overflow-wrap:anywhere;word-break:normal;white-space:normal;max-width:100%}
html.gate.gate.gate .yk-bd .mono{overflow-wrap:anywhere;word-break:break-all}
html.gate.gate.gate .yk-bd form{display:flex;flex-direction:column;gap:10px;margin:8px 0}
html.gate.gate.gate .yk-bd input:not([type=radio]){width:100%;box-sizing:border-box}
html.gate.gate.gate .yk-bd .btn{white-space:normal;height:auto;min-height:38px}
html.gate.gate.gate .yk-bd .err{background:var(--g-bad-bg);border:1px solid var(--g-bad-bd);color:var(--g-bad);border-radius:8px;padding:8px 10px;margin:8px 0}
html.gate.gate.gate .yk-bd .note{background:var(--g-info-bg);border:1px solid var(--g-info-bd);color:var(--g-text);border-radius:8px;padding:8px 10px;margin:8px 0}
html.gate.gate.gate .yk-bd .tf-alt{border-top:1px solid var(--g-bd);padding-top:10px}
html.gate.gate.gate .yk-bd .tf-alt summary{color:var(--g-pri);font-weight:600}
html.gate.gate.gate .yk-bd .tf-why{display:block;padding:8px 10px;border:1px solid var(--g-bd);border-radius:8px;background:var(--g-sunken)}
html.gate.gate.gate .yk-touch{display:flex;justify-content:center;padding:6px 0 10px}
html.gate.gate.gate .yk-touch i{width:46px;height:46px;border-radius:50%;border:2px solid var(--g-pri);background:var(--g-pri-bg);box-shadow:0 0 0 0 var(--glow);animation:ykP 1.6s ease-out infinite}
html.gate.gate.gate .yk-ft{padding:10px 16px 14px;border-top:1px solid var(--g-bd);background:var(--g-sunken)}
html.gate.gate.gate .yk-ft .yk-cancel{display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;white-space:normal;min-height:38px;box-sizing:border-box;background:var(--g-raised);color:var(--g-text);border:1px solid var(--g-bd2)}
html.gate.gate.gate .yk-ft .yk-cancel:hover{background:var(--g-hover)}
@keyframes ykF{from{opacity:0}}@keyframes ykR{from{opacity:0;transform:translateY(8px) scale(.98)}}
@keyframes ykP{0%{box-shadow:0 0 0 0 var(--glow)}70%{box-shadow:0 0 0 14px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media (max-width:480px){html.gate.gate.gate .yk-back{padding:10px;align-items:flex-start}html.gate.gate.gate .yk-box{max-height:none}}
@media (prefers-reduced-motion:reduce){html.gate.gate.gate .yk-back,html.gate.gate.gate .yk-box,html.gate.gate.gate .yk-touch i{animation:none}}