:root[data-skin="colour"]{
  --h-route:#3b82f6;   
  --h-sec:#f43f5e;     
  --h-host:#a855f7;    
  --h-svc:#14b8a6;     
  --h-data:#f59e0b;    
  --h-learn:#ec4899;   

  
  --h-route-t:rgba(59,130,246,.15);  --h-route-e:rgba(59,130,246,.42);
  --h-sec-t:rgba(244,63,94,.14);     --h-sec-e:rgba(244,63,94,.40);
  --h-host-t:rgba(168,85,247,.15);   --h-host-e:rgba(168,85,247,.40);
  --h-svc-t:rgba(20,184,166,.14);    --h-svc-e:rgba(20,184,166,.40);
  --h-data-t:rgba(245,158,11,.14);   --h-data-e:rgba(245,158,11,.40);
  --h-learn-t:rgba(236,72,153,.14);  --h-learn-e:rgba(236,72,153,.40);

  
  --grad:linear-gradient(135deg,var(--accent),var(--h-host));
  --grad-soft:linear-gradient(135deg,var(--tint-accent),var(--h-host-t));
}


:root[data-skin="colour"]{
  --bg:#0a0f1f;
  --panel:#141b33;
  --panel2:#111730;
  --panel3:#1b2444;
  --line:#2a3357;
  --line2:#212a4a;

  --ink:#eef2fc;
  --ink2:#a4b1d4;
  --ink3:#7583ab;
  --ink4:#535f85;

  --accent:#5b8def;
  --accent2:#7ba7f7;
  --accent-ink:#ffffff;
  --ok:#2dd4a7;
  --warn:#fbbf24;
  --bad:#fb7185;
  --idle:#7c89b0;
  --pro:#c084fc;

  
  --area-accounts:#7aa2ff;
  --area-images:#c084fc;
  --area-monitor:#34e2c8;
  --area-market:#fbb040;
  --area-server:#9fb0d9;
  --area-community:#fb7bb4;

  --cable-copper:#8fb0d8;
  --cable-crossover:#5ee0d3;
  --cable-fiber:#f0c14b;
  --cable-serial:#c084fc;
  --cable-console:#98a1b8;
  --cable-coax:#c09070;
  --cable-wireless:#34e2c8;

  --tint-accent:rgba(91,141,239,.16);
  --tint-ok:rgba(45,212,167,.13);
  --tint-warn:rgba(251,191,36,.13);
  --tint-bad:rgba(251,113,133,.13);
  --tint-pro:rgba(192,132,252,.20);
  --edge-accent:rgba(91,141,239,.40);
  --edge-ok:rgba(45,212,167,.36);
  --edge-warn:rgba(251,191,36,.36);
  --edge-bad:rgba(251,113,133,.36);

  
  --term-bg:#060a17;
  --term-ink:#ccd8ef;

  --scroll-thumb:#32406b;
  --grid-dot:#233056;
  --wire:#4166a8;
  --node-edge:#4b6293;

  
  --shadow:0 1px 2px rgba(4,8,22,.45), 0 4px 16px rgba(20,12,60,.38);
  --shadow-l:0 18px 50px rgba(8,6,32,.58);

  
  --brand:#5b8def;
  --brand-d:#7ba7f7;
  --green:#2dd4a7;
  --bg2:#111730;
  --bg3:#1b2444;
  --card:#141b33;
  --muted:#7583ab;
  --code:#060a17;
  --code-ink:#ccd8ef;
  --acbg:#0a0f1f;
  --acbar:#070b18;
  --acline:#2a3357;
  --sb-brand:#5b8def;
  --sb-brand-d:#7ba7f7;
  --sb-ink:#eef2fc;
  --sb-ink2:#a4b1d4;
  --sb-ink3:#7583ab;
  --sb-card:#141b33;
  --sb-line:#2a3357;
  --sb-field:#111730;
}


@media (prefers-color-scheme: light){
  :root[data-skin="colour"]:not([data-theme="dark"]){
    --bg:#f4f6fd;
    --panel:#ffffff;
    --panel2:#edf1fb;
    --panel3:#e3e9f9;
    --line:#d8e0f2;
    --line2:#e6ebf7;

    --ink:#111830;
    --ink2:#465170;
    --ink3:#6b7699;
    --ink4:#95a0bd;

    --accent:#2b52c8;
    --accent2:#1f3fa8;
    --accent-ink:#ffffff;
    --ok:#087f5b;
    --warn:#8a5a06;
    --bad:#c02649;
    --idle:#78849f;
    --pro:#7c3aed;

    --h-route:#1d4ed8;
    --h-sec:#be123c;
    --h-host:#7e22ce;
    --h-svc:#0f766e;
    --h-data:#b45309;
    --h-learn:#be185d;

    --h-route-t:rgba(29,78,216,.09);   --h-route-e:rgba(29,78,216,.30);
    --h-sec-t:rgba(190,18,60,.08);     --h-sec-e:rgba(190,18,60,.28);
    --h-host-t:rgba(126,34,206,.08);   --h-host-e:rgba(126,34,206,.28);
    --h-svc-t:rgba(15,118,110,.08);    --h-svc-e:rgba(15,118,110,.28);
    --h-data-t:rgba(180,83,9,.09);     --h-data-e:rgba(180,83,9,.30);
    --h-learn-t:rgba(190,24,93,.08);   --h-learn-e:rgba(190,24,93,.28);

    --tint-accent:rgba(43,82,200,.08);
    --tint-ok:rgba(8,127,91,.08);
    --tint-warn:rgba(138,90,6,.10);
    --tint-bad:rgba(192,38,73,.07);
    --tint-pro:rgba(124,58,237,.10);
    --edge-accent:rgba(43,82,200,.28);
    --edge-ok:rgba(8,127,91,.26);
    --edge-warn:rgba(138,90,6,.28);
    --edge-bad:rgba(192,38,73,.24);

    --shadow:0 1px 2px rgba(23,32,64,.06), 0 6px 18px rgba(40,30,110,.09);
    --shadow-l:0 18px 50px rgba(30,24,90,.18);
    --scroll-thumb:#c2cce4;
    --grid-dot:#d3dcf1;
    --wire:#8299c6;
    --node-edge:#a6b3d0;
    
    --area-accounts:#1b4ae0;
    --area-images:#8534e8;
    --area-monitor:#0e8f82;
    --area-market:#b45c08;
    --area-server:#4b5a7a;
    --area-community:#cf1668;
    --cable-copper:#2f5fa8;
    --cable-crossover:#0d8f85;
    --cable-fiber:#a9760f;
    --cable-serial:#7a2fe0;
    --cable-console:#5b6478;
    --cable-coax:#8a5530;
    --cable-wireless:#0b8f7a;

    --brand:#2b52c8;
    --brand-d:#1f3fa8;
    --green:#087f5b;
    --bg2:#edf1fb;
    --bg3:#e3e9f9;
    --card:#ffffff;
    --muted:#6b7699;
    --acbg:#edf1fb;
    --acbar:#141b33;
    --acline:#d8e0f2;
    --sb-brand:#2b52c8;
    --sb-brand-d:#1f3fa8;
    --sb-ink:#111830;
    --sb-ink2:#465170;
    --sb-ink3:#6b7699;
    --sb-card:#ffffff;
    --sb-line:#d8e0f2;
    --sb-field:#f9fbff;
  }
}
:root[data-skin="colour"][data-theme="light"]{
  --bg:#f4f6fd;
  --panel:#ffffff;
  --panel2:#edf1fb;
  --panel3:#e3e9f9;
  --line:#d8e0f2;
  --line2:#e6ebf7;

  --ink:#111830;
  --ink2:#465170;
  --ink3:#6b7699;
  --ink4:#95a0bd;

  --accent:#2b52c8;
  --accent2:#1f3fa8;
  --accent-ink:#ffffff;
  --ok:#087f5b;
  --warn:#8a5a06;
  --bad:#c02649;
  --idle:#78849f;
  --pro:#7c3aed;

  --h-route:#1d4ed8;
  --h-sec:#be123c;
  --h-host:#7e22ce;
  --h-svc:#0f766e;
  --h-data:#b45309;
  --h-learn:#be185d;

  --h-route-t:rgba(29,78,216,.09);   --h-route-e:rgba(29,78,216,.30);
  --h-sec-t:rgba(190,18,60,.08);     --h-sec-e:rgba(190,18,60,.28);
  --h-host-t:rgba(126,34,206,.08);   --h-host-e:rgba(126,34,206,.28);
  --h-svc-t:rgba(15,118,110,.08);    --h-svc-e:rgba(15,118,110,.28);
  --h-data-t:rgba(180,83,9,.09);     --h-data-e:rgba(180,83,9,.30);
  --h-learn-t:rgba(190,24,93,.08);   --h-learn-e:rgba(190,24,93,.28);

  --tint-accent:rgba(43,82,200,.08);
  --tint-ok:rgba(8,127,91,.08);
  --tint-warn:rgba(138,90,6,.10);
  --tint-bad:rgba(192,38,73,.07);
  --tint-pro:rgba(124,58,237,.10);
  --edge-accent:rgba(43,82,200,.28);
  --edge-ok:rgba(8,127,91,.26);
  --edge-warn:rgba(138,90,6,.28);
  --edge-bad:rgba(192,38,73,.24);

  --shadow:0 1px 2px rgba(23,32,64,.06), 0 6px 18px rgba(40,30,110,.09);
  --shadow-l:0 18px 50px rgba(30,24,90,.18);
  --scroll-thumb:#c2cce4;
  --grid-dot:#d3dcf1;
  --wire:#8299c6;
  --node-edge:#a6b3d0;
  
  --area-accounts:#1b4ae0;
  --area-images:#8534e8;
  --area-monitor:#0e8f82;
  --area-market:#b45c08;
  --area-server:#4b5a7a;
  --area-community:#cf1668;
  --cable-copper:#2f5fa8;
  --cable-crossover:#0d8f85;
  --cable-fiber:#a9760f;
  --cable-serial:#7a2fe0;
  --cable-console:#5b6478;
  --cable-coax:#8a5530;
  --cable-wireless:#0b8f7a;

  --brand:#2b52c8;
  --brand-d:#1f3fa8;
  --green:#087f5b;
  --bg2:#edf1fb;
  --bg3:#e3e9f9;
  --card:#ffffff;
  --muted:#6b7699;
  --acbg:#edf1fb;
  --acbar:#141b33;
  --acline:#d8e0f2;
  --sb-brand:#2b52c8;
  --sb-brand-d:#1f3fa8;
  --sb-ink:#111830;
  --sb-ink2:#465170;
  --sb-ink3:#6b7699;
  --sb-card:#ffffff;
  --sb-line:#d8e0f2;
  --sb-field:#f9fbff;
}




[data-skin="colour"] body{
  background-color:var(--bg);
  background-image:
    radial-gradient(1100px 620px at 8% -14%, var(--h-route-t), transparent 60%),
    radial-gradient(900px 540px at 96% -8%, var(--h-host-t), transparent 58%);
  background-attachment:fixed;
  background-repeat:no-repeat;
}


[data-skin="colour"] .nb-head{
  background-image:linear-gradient(100deg,var(--h-route-t),transparent 42%,var(--h-host-t));
  border-bottom-color:var(--edge-accent);
}

[data-skin="colour"] .nb-brand .nb-word i,
[data-skin="colour"] .nb-brand .nb-word u{
  background:linear-gradient(120deg,var(--accent),var(--h-host));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--accent);
}

[data-skin="colour"] .nb-nav a.on{
  background:none;
  color:var(--accent);
  box-shadow:inset 0 -2px 0 var(--accent);
}

[data-skin="colour"] .nb-nav a:hover{background:var(--h-route-t);color:var(--accent)}



[data-skin="colour"] .nb-btn.pri,
:root[data-skin="colour"]:not([data-app]):not([data-sim]) .btn.pri,
:root[data-skin="colour"]:not([data-app]):not([data-sim]) .b.pri{
  background-image:linear-gradient(135deg,var(--accent),var(--h-host));
  border-color:transparent;
  box-shadow:0 2px 12px var(--tint-accent);
}



[data-skin="colour"] .nb-card,
[data-skin="colour"] .card,
[data-skin="colour"] .feat,
[data-skin="colour"] .plan,
[data-skin="colour"] .half{
  position:relative;overflow:hidden;
}
[data-skin="colour"] .nb-card::before,
[data-skin="colour"] .card::before,
[data-skin="colour"] .feat::before,
[data-skin="colour"] .plan::before,
[data-skin="colour"] .half::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--accent),var(--h-host));
  opacity:.75;
}

[data-skin="colour"] .half.free::before{background:linear-gradient(90deg,var(--ok),var(--h-svc))}
[data-skin="colour"] .half.pro::before {background:linear-gradient(90deg,var(--pro),var(--h-learn))}
[data-skin="colour"] .plan.mark::before{background:linear-gradient(90deg,var(--h-data),var(--h-sec))}
[data-skin="colour"] .plan.mark{box-shadow:0 0 0 3px var(--tint-accent),var(--shadow)}


[data-skin="colour"] .feat .ic{
  border-color:transparent;color:#fff;
  box-shadow:0 3px 12px rgba(0,0,0,.18);
}
[data-skin="colour"] .feat:nth-child(6n+1) .ic{background:linear-gradient(135deg,var(--h-route),var(--accent))}
[data-skin="colour"] .feat:nth-child(6n+2) .ic{background:linear-gradient(135deg,var(--h-svc),var(--ok))}
[data-skin="colour"] .feat:nth-child(6n+3) .ic{background:linear-gradient(135deg,var(--h-host),var(--pro))}
[data-skin="colour"] .feat:nth-child(6n+4) .ic{background:linear-gradient(135deg,var(--h-data),var(--warn))}
[data-skin="colour"] .feat:nth-child(6n+5) .ic{background:linear-gradient(135deg,var(--h-sec),var(--bad))}
[data-skin="colour"] .feat:nth-child(6n+6) .ic{background:linear-gradient(135deg,var(--h-learn),var(--h-host))}


[data-skin="colour"] .feat .ic.art{box-shadow:none;border-width:1px;border-style:solid}
[data-skin="colour"] .feat:nth-child(6n+1) .ic.art{background:var(--h-route-t);border-color:var(--h-route-e)}
[data-skin="colour"] .feat:nth-child(6n+2) .ic.art{background:var(--h-svc-t);  border-color:var(--h-svc-e)}
[data-skin="colour"] .feat:nth-child(6n+3) .ic.art{background:var(--h-host-t); border-color:var(--h-host-e)}
[data-skin="colour"] .feat:nth-child(6n+4) .ic.art{background:var(--h-data-t); border-color:var(--h-data-e)}
[data-skin="colour"] .feat:nth-child(6n+5) .ic.art{background:var(--h-sec-t);  border-color:var(--h-sec-e)}
[data-skin="colour"] .feat:nth-child(6n+6) .ic.art{background:var(--h-learn-t);border-color:var(--h-learn-e)}


[data-skin="colour"] .nb-ask{color:var(--h-host);border-color:var(--h-host-e)}
[data-skin="colour"] .nb-ask:hover{background:var(--h-host-t);color:var(--h-host)}
[data-skin="colour"] .nb-bell{color:var(--h-data)}
[data-skin="colour"] .nb-bell:hover{background:var(--h-data-t);color:var(--h-data)}
[data-skin="colour"] .nb-bell .dot{background:var(--h-sec);box-shadow:0 0 0 2px var(--panel)}
[data-skin="colour"] #nbLang{color:var(--h-svc)}
[data-skin="colour"] #nbLang:hover{background:var(--h-svc-t);color:var(--h-svc)}

[data-skin="colour"] #nbTheme .sun{color:var(--h-data)}
[data-skin="colour"] #nbTheme .moon{color:var(--h-route)}
[data-skin="colour"] #nbTheme:hover{background:var(--tint-accent)}
[data-skin="colour"] .nb-search:focus-within{
  border-color:var(--accent);box-shadow:0 0 0 3px var(--tint-accent);
}


[data-skin="mono"] .nb-bell .dot{background:var(--ink);box-shadow:0 0 0 2px var(--panel)}


[data-skin="colour"] .hero{
  background-image:
    radial-gradient(900px 460px at 12% -20%, var(--h-route-t), transparent 62%),
    radial-gradient(760px 420px at 88% -10%, var(--h-host-t), transparent 60%),
    radial-gradient(600px 320px at 50% 110%, var(--h-svc-t), transparent 70%);
  border-bottom-color:var(--edge-accent);
}
[data-skin="colour"] .hero h1 em{
  background:linear-gradient(110deg,var(--accent),var(--h-host) 55%,var(--h-learn));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}




[data-skin="colour"] .stat{
  position:relative;overflow:hidden;
  background-image:linear-gradient(135deg,var(--h-route-t),transparent 70%);
  border-color:var(--h-route-e);
}
[data-skin="colour"] .stat b{color:var(--h-route)}
[data-skin="colour"] .stat:nth-child(4n+2){
  background-image:linear-gradient(135deg,var(--h-svc-t),transparent 70%);
  border-color:var(--h-svc-e);
}
[data-skin="colour"] .stat:nth-child(4n+2) b{color:var(--h-svc)}
[data-skin="colour"] .stat:nth-child(4n+3){
  background-image:linear-gradient(135deg,var(--h-host-t),transparent 70%);
  border-color:var(--h-host-e);
}
[data-skin="colour"] .stat:nth-child(4n+3) b{color:var(--h-host)}
[data-skin="colour"] .stat:nth-child(4n+4){
  background-image:linear-gradient(135deg,var(--h-data-t),transparent 70%);
  border-color:var(--h-data-e);
}
[data-skin="colour"] .stat:nth-child(4n+4) b{color:var(--h-data)}


[data-skin="colour"] .portal,
[data-skin="colour"] .op-tabs{
  border-bottom-color:transparent;
  background-image:linear-gradient(90deg,var(--edge-accent),var(--h-host-e),transparent);
  background-size:100% 1px;background-repeat:no-repeat;background-position:bottom;
}
[data-skin="colour"] .portal button.on,
[data-skin="colour"] .op-tabs button.on{
  background:var(--tint-accent);
  border-radius:var(--r-sm) var(--r-sm) 0 0;
  border-bottom-color:var(--accent);
}
[data-skin="colour"] .portal button .c{
  background:var(--tint-accent);color:var(--accent);
}


[data-skin="colour"] .t th,
[data-skin="colour"] table.tbl th{
  background-image:linear-gradient(180deg,var(--tint-accent),transparent);
  color:var(--accent);
  border-bottom-color:var(--edge-accent);
}
[data-skin="colour"] .t tr.sel td{background:var(--tint-accent)}


[data-skin="colour"] .trail .row{border-left:3px solid transparent;padding-left:9px}
[data-skin="colour"] .trail .row.bad {border-left-color:var(--bad); background:var(--tint-bad)}
[data-skin="colour"] .trail .row.warn{border-left-color:var(--warn);background:var(--tint-warn)}
[data-skin="colour"] .trail .row.ok  {border-left-color:var(--ok);  background:var(--tint-ok)}
[data-skin="colour"] .trail .row.info{border-left-color:var(--accent)}


[data-skin="colour"] .nb-badge.free{background:linear-gradient(135deg,var(--ok),var(--h-svc));color:#fff}
[data-skin="colour"] .nb-badge.pro{background:linear-gradient(135deg,var(--pro),var(--h-learn));color:#fff}
[data-skin="colour"] .nb-badge.enterprise{background:linear-gradient(135deg,var(--h-route),var(--h-host));color:#fff}
[data-skin="colour"] .nb-badge.admin{background:linear-gradient(135deg,var(--accent),var(--h-route));color:#fff}
[data-skin="colour"] .pill.adm{background-image:linear-gradient(135deg,var(--accent),var(--h-host));border-color:transparent}


[data-skin="colour"] .adminbar{
  background-image:linear-gradient(100deg,var(--tint-ok),var(--h-svc-t) 60%,transparent);
  border-color:var(--edge-ok);
}


[data-skin="colour"] .nb-note{border-left-width:3px}
[data-skin="colour"] .nb-note.info{border-left-color:var(--accent)}
[data-skin="colour"] .nb-note.ok  {border-left-color:var(--ok)}
[data-skin="colour"] .nb-note.warn{border-left-color:var(--warn)}
[data-skin="colour"] .nb-note.bad {border-left-color:var(--bad)}


[data-skin="colour"] .prog i{background-image:linear-gradient(90deg,var(--accent),var(--h-host))}


[data-skin="colour"] .banner,
[data-theme="dark"][data-skin="colour"] .banner{
  background-image:linear-gradient(120deg,var(--accent),var(--h-host) 52%,var(--h-learn));
}
[data-skin="colour"] .tag.brand {background:var(--h-route-t);border-color:var(--h-route-e);color:var(--h-route)}
[data-skin="colour"] .tag.green {background:var(--h-svc-t);  border-color:var(--h-svc-e);  color:var(--h-svc)}
[data-skin="colour"] .tag.accent{background:var(--h-data-t); border-color:var(--h-data-e); color:var(--h-data)}
[data-skin="colour"] .rep       {background:var(--h-data-t); border-color:var(--h-data-e); color:var(--h-data)}
[data-skin="colour"] .rep.silver{background:var(--panel2);   border-color:var(--line);     color:var(--ink2)}
[data-skin="colour"] .rep.gold  {background:var(--h-data-t); border-color:var(--h-data-e); color:var(--warn)}


[data-skin="colour"] .ntype:hover{border-color:var(--h-route-e);background:var(--h-route-t)}
[data-skin="colour"] .ntype.pick{border-color:var(--accent);background:var(--tint-accent)}







:root[data-skin="mono"]{
  --bg:#0c0c0d;
  --panel:#171718;
  --panel2:#121213;
  --panel3:#212123;
  --line:#333336;
  --line2:#262628;

  --ink:#f2f2f3;
  --ink2:#b4b4b8;
  --ink3:#85858b;
  --ink4:#5d5d63;

  --accent:#e8e8ea;
  --accent2:#ffffff;
  --accent-ink:#0c0c0d;
  --ok:#ffffff;
  --warn:#c8c8cc;
  --bad:#ffffff;
  --idle:#75757b;
  --pro:#d6d6da;

  
  --area-accounts:#e8e8ea;
  --area-images:#d6d6da;
  --area-monitor:#c8c8cc;
  --area-market:#b4b4b8;
  --area-server:#9a9aa0;
  --area-community:#d6d6da;

  
  --cable-copper:#b4b4b8;
  --cable-crossover:#d6d6da;
  --cable-fiber:#e8e8ea;
  --cable-serial:#c8c8cc;
  --cable-console:#85858b;
  --cable-coax:#9a9aa0;
  --cable-wireless:#d6d6da;

  --tint-accent:rgba(255,255,255,.10);
  --tint-ok:rgba(255,255,255,.09);
  --tint-warn:rgba(255,255,255,.07);
  --tint-bad:rgba(255,255,255,.14);
  --tint-pro:rgba(255,255,255,.10);
  --edge-accent:rgba(255,255,255,.34);
  --edge-ok:rgba(255,255,255,.34);
  --edge-warn:rgba(255,255,255,.26);
  --edge-bad:rgba(255,255,255,.55);

  --term-bg:#000000;
  --term-ink:#dcdcde;

  --shadow:0 1px 2px rgba(0,0,0,.5), 0 4px 14px rgba(0,0,0,.4);
  --shadow-l:0 16px 44px rgba(0,0,0,.66);
  --scroll-thumb:#3c3c40;
  --grid-dot:#2b2b2e;
  --wire:#6e6e74;
  --node-edge:#7d7d84;

  --brand:#f2f2f3;
  --brand-d:#ffffff;
  --green:#e2e2e5;
  --bg2:#121213;
  --bg3:#212123;
  --card:#171718;
  --muted:#85858b;
  --code:#000000;
  --code-ink:#dcdcde;
  --acbg:#0c0c0d;
  --acbar:#000000;
  --acline:#333336;
  --sb-brand:#f2f2f3;
  --sb-brand-d:#ffffff;
  --sb-ink:#f2f2f3;
  --sb-ink2:#b4b4b8;
  --sb-ink3:#85858b;
  --sb-card:#171718;
  --sb-line:#333336;
  --sb-field:#121213;
}


@media (prefers-color-scheme: light){
  :root[data-skin="mono"]:not([data-theme="dark"]){
    --bg:#f7f7f8;
    --panel:#ffffff;
    --panel2:#f0f0f1;
    --panel3:#e6e6e8;
    --line:#d9d9dd;
    --line2:#e8e8ea;

    --ink:#0d0d0e;
    --ink2:#44444a;
    --ink3:#6c6c73;
    --ink4:#9a9aa1;

    --accent:#111113;
    --accent2:#000000;
    --accent-ink:#ffffff;
    --ok:#000000;
    --warn:#3c3c41;
    --bad:#000000;
    --idle:#8e8e95;
    --pro:#2a2a2e;

    --tint-accent:rgba(0,0,0,.06);
    --tint-ok:rgba(0,0,0,.05);
    --tint-warn:rgba(0,0,0,.08);
    --tint-bad:rgba(0,0,0,.11);
    --tint-pro:rgba(0,0,0,.07);
    --edge-accent:rgba(0,0,0,.26);
    --edge-ok:rgba(0,0,0,.30);
    --edge-warn:rgba(0,0,0,.22);
    --edge-bad:rgba(0,0,0,.52);

    --shadow:0 1px 2px rgba(0,0,0,.07), 0 4px 14px rgba(0,0,0,.07);
    --shadow-l:0 16px 44px rgba(0,0,0,.18);
    --scroll-thumb:#c4c4c9;
    --grid-dot:#dcdce0;
    --wire:#9a9aa1;
    --node-edge:#b4b4ba;
    
    --area-accounts:#2c2c30;
    --area-images:#3f3f45;
    --area-monitor:#53535a;
    --area-market:#67676e;
    --area-server:#7a7a81;
    --area-community:#3f3f45;
    --cable-copper:#5a5a61;
    --cable-crossover:#3f3f45;
    --cable-fiber:#2c2c30;
    --cable-serial:#4c4c53;
    --cable-console:#86868c;
    --cable-coax:#6e6e75;
    --cable-wireless:#3f3f45;

    --brand:#111113;
    --brand-d:#000000;
    --green:#1c1c1f;
    --bg2:#f0f0f1;
    --bg3:#e6e6e8;
    --card:#ffffff;
    --muted:#6c6c73;
    --acbg:#f0f0f1;
    --acbar:#0d0d0e;
    --acline:#d9d9dd;
    --sb-brand:#111113;
    --sb-brand-d:#000000;
    --sb-ink:#0d0d0e;
    --sb-ink2:#44444a;
    --sb-ink3:#6c6c73;
    --sb-card:#ffffff;
    --sb-line:#d9d9dd;
    --sb-field:#fbfbfc;
  }
}
:root[data-skin="mono"][data-theme="light"]{
  --bg:#f7f7f8;
  --panel:#ffffff;
  --panel2:#f0f0f1;
  --panel3:#e6e6e8;
  --line:#d9d9dd;
  --line2:#e8e8ea;

  --ink:#0d0d0e;
  --ink2:#44444a;
  --ink3:#6c6c73;
  --ink4:#9a9aa1;

  --accent:#111113;
  --accent2:#000000;
  --accent-ink:#ffffff;
  --ok:#000000;
  --warn:#3c3c41;
  --bad:#000000;
  --idle:#8e8e95;
  --pro:#2a2a2e;

  --tint-accent:rgba(0,0,0,.06);
  --tint-ok:rgba(0,0,0,.05);
  --tint-warn:rgba(0,0,0,.08);
  --tint-bad:rgba(0,0,0,.11);
  --tint-pro:rgba(0,0,0,.07);
  --edge-accent:rgba(0,0,0,.26);
  --edge-ok:rgba(0,0,0,.30);
  --edge-warn:rgba(0,0,0,.22);
  --edge-bad:rgba(0,0,0,.52);

  --shadow:0 1px 2px rgba(0,0,0,.07), 0 4px 14px rgba(0,0,0,.07);
  --shadow-l:0 16px 44px rgba(0,0,0,.18);
  --scroll-thumb:#c4c4c9;
  --grid-dot:#dcdce0;
  --wire:#9a9aa1;
  --node-edge:#b4b4ba;
  
  --area-accounts:#2c2c30;
  --area-images:#3f3f45;
  --area-monitor:#53535a;
  --area-market:#67676e;
  --area-server:#7a7a81;
  --area-community:#3f3f45;
  --cable-copper:#5a5a61;
  --cable-crossover:#3f3f45;
  --cable-fiber:#2c2c30;
  --cable-serial:#4c4c53;
  --cable-console:#86868c;
  --cable-coax:#6e6e75;
  --cable-wireless:#3f3f45;

  --brand:#111113;
  --brand-d:#000000;
  --green:#1c1c1f;
  --bg2:#f0f0f1;
  --bg3:#e6e6e8;
  --card:#ffffff;
  --muted:#6c6c73;
  --acbg:#f0f0f1;
  --acbar:#0d0d0e;
  --acline:#d9d9dd;
  --sb-brand:#111113;
  --sb-brand-d:#000000;
  --sb-ink:#0d0d0e;
  --sb-ink2:#44444a;
  --sb-ink3:#6c6c73;
  --sb-card:#ffffff;
  --sb-line:#d9d9dd;
  --sb-field:#fbfbfc;
}


[data-skin="mono"] .nb-note.ok,
[data-skin="mono"] .msg.ok,
[data-skin="mono"] .trail .row.ok .what b{font-weight:700}
[data-skin="mono"] .nb-note.warn,
[data-skin="mono"] .trail .row.warn .what b{font-weight:700}


[data-skin="mono"] .nb-note.bad,
[data-skin="mono"] .msg.bad{
  background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:600;
}
[data-skin="mono"] .nb-note.bad code{background:rgba(255,255,255,.18)}
[data-skin="mono"] .trail .row.bad{border-left:3px solid var(--ink);padding-left:9px}
[data-skin="mono"] .trail .row.bad .what b{font-weight:700;text-decoration:underline;
  text-underline-offset:2px}


[data-skin="mono"] .nb-badge{
  background:transparent;border:1px solid var(--line);color:var(--ink2);
}
[data-skin="mono"] .nb-badge.pro,
[data-skin="mono"] .nb-badge.enterprise{
  background:var(--ink);color:var(--bg);border-color:var(--ink);
}
[data-skin="mono"] .pill.adm{background:var(--ink);color:var(--bg);border-color:var(--ink)}
[data-skin="mono"] .pill.off{text-decoration:line-through;color:var(--ink3)}


[data-skin="mono"] .hero,
[data-skin="mono"] body,
[data-skin="mono"] .nb-head,
[data-skin="mono"] .banner,
[data-skin="mono"] .sheen,
[data-skin="mono"] .wrap::before{
  background-image:none !important;
}

[data-skin="mono"] .nb-btn.pri,
:root[data-skin="mono"]:not([data-app]):not([data-sim]) .btn.pri,
:root[data-skin="mono"]:not([data-app]):not([data-sim]) .b.pri{
  background:var(--accent);color:var(--accent-ink);border-color:var(--accent);
  background-image:none;
}
[data-skin="mono"] .prog i{background:var(--ink)}


[data-skin="mono"] svg.nbart,
[data-skin="mono"] .op-logo img,
[data-skin="mono"] .nb-av-btn img,
[data-skin="mono"] .logoprev img,
[data-skin="mono"] .shot img,
[data-skin="mono"] figure img{
  filter:grayscale(1) contrast(1.06);
}


[data-skin="mono"] .nb-note.ok,
[data-skin="mono"] .nb-note.warn{color:var(--ink)}
[data-skin="mono"] .adminbar{color:var(--ink2);background:var(--panel2);border-color:var(--line)}
[data-skin="mono"] .adminbar b{color:var(--ink)}
[data-skin="mono"] .nb-nav a .tag.pro{background:var(--panel3);color:var(--ink2)}
[data-skin="mono"] .nb-nav a.on .tag{background:rgba(255,255,255,.22)}
[data-skin="mono"] .t tr.sel td{background:var(--tint-accent)}
[data-skin="mono"] .badge.admin{background:var(--panel3);color:var(--ink)}
[data-skin="mono"] .msg.ok{background:var(--panel2);color:var(--ink);border:1px solid var(--line)}
[data-skin="mono"] .nb-signin .err{color:var(--ink);background:var(--panel2);border-left-color:var(--ink)}


[data-skin="colour"] .nb-nav a .tag.pro{background:var(--h-host-t);color:var(--pro)}
[data-skin="colour"] .badge.admin{background:var(--h-svc-t);color:var(--h-svc)}


[data-skin="mono"] .btn-primary,
[data-skin="mono"] .btn-green,
[data-skin="mono"] .btn-nav,
[data-skin="mono"] .btn-p,
[data-skin="mono"] .btn-g,
[data-skin="mono"] .pbtn.on,
[data-skin="mono"] .chip.on,
[data-skin="mono"] .cat.on,
[data-skin="mono"] .tbtn.on,
[data-skin="mono"] .modesw button.on,
[data-skin="mono"] .lnav a.on,
[data-skin="mono"] .dashnav a.on,
[data-skin="mono"] .acnav a.on,
[data-skin="mono"] .savemark.on,
[data-skin="mono"] .fchip,
[data-skin="mono"] .ribbon,
[data-skin="mono"] .win-t,
[data-skin="mono"] .billsw .save,

[data-skin="mono"] .btn-accent,
[data-skin="mono"] .dd-menu .cnt,
[data-skin="mono"] .badge.got .ico{
  background:var(--ink);border-color:var(--ink);color:var(--bg);
}
[data-skin="mono"] .savemark:hover{background:var(--panel3);color:var(--ink)}

[data-skin="mono"] .banner{background:var(--ink);color:var(--bg)}
[data-skin="mono"] .banner a{color:var(--bg)}


[data-skin="mono"] svg.cover{filter:grayscale(1) contrast(1.04)}

[data-skin="mono"] svg.avatar{filter:grayscale(1) contrast(1.08)}

[data-skin="mono"] .nb-brand svg,
[data-skin="mono"] .mark svg,
[data-skin="mono"] .nb-signin .mark svg{filter:grayscale(1) contrast(1.1)}


[data-skin="mono"] .tag.brand,
[data-skin="mono"] .tag.green,
[data-skin="mono"] .tag.accent,
[data-skin="mono"] .rep,
[data-skin="mono"] .rep.silver,
[data-skin="mono"] .rep.gold{
  background:transparent;border-color:var(--line);color:var(--ink2);
}
[data-skin="mono"] mark{background:var(--panel3);color:var(--ink)}


[data-skin="mono"] .term,
[data-skin="mono"] .console{filter:grayscale(1)}





html:root[data-skin="colour"]{
  --sb-brand:#5b8def; --sb-brand-d:#7ba7f7;
  --sb-ink:#eef2fc;   --sb-ink2:#a4b1d4; --sb-ink3:#7583ab;
  --sb-bg:#0a0f1f;    --sb-card:#141b33; --sb-line:#2a3357; --sb-field:#111730;
}
@media (prefers-color-scheme: light){
  html:root[data-skin="colour"]:not([data-theme="dark"]){
    --sb-brand:#2b52c8; --sb-brand-d:#1f3fa8;
    --sb-ink:#111830;   --sb-ink2:#465170; --sb-ink3:#6b7699;
    --sb-bg:#f4f6fd;    --sb-card:#ffffff; --sb-line:#d8e0f2; --sb-field:#f9fbff;
  }
}
html:root[data-skin="colour"][data-theme="light"]{
  --sb-brand:#2b52c8; --sb-brand-d:#1f3fa8;
  --sb-ink:#111830;   --sb-ink2:#465170; --sb-ink3:#6b7699;
  --sb-bg:#f4f6fd;    --sb-card:#ffffff; --sb-line:#d8e0f2; --sb-field:#f9fbff;
}
html:root[data-skin="mono"]{
  --sb-brand:#f2f2f3; --sb-brand-d:#ffffff;
  --sb-ink:#f2f2f3;   --sb-ink2:#b4b4b8; --sb-ink3:#85858b;
  --sb-bg:#0c0c0d;    --sb-card:#171718; --sb-line:#333336; --sb-field:#121213;
}
@media (prefers-color-scheme: light){
  html:root[data-skin="mono"]:not([data-theme="dark"]){
    --sb-brand:#111113; --sb-brand-d:#000000;
    --sb-ink:#0d0d0e;   --sb-ink2:#44444a; --sb-ink3:#6c6c73;
    --sb-bg:#f7f7f8;    --sb-card:#ffffff; --sb-line:#d9d9dd; --sb-field:#fbfbfc;
  }
}
html:root[data-skin="mono"][data-theme="light"]{
  --sb-brand:#111113; --sb-brand-d:#000000;
  --sb-ink:#0d0d0e;   --sb-ink2:#44444a; --sb-ink3:#6c6c73;
  --sb-bg:#f7f7f8;    --sb-card:#ffffff; --sb-line:#d9d9dd; --sb-field:#fbfbfc;
}


[data-skin="colour"] .go{
  background-image:linear-gradient(135deg,var(--accent),var(--h-host));
}


[data-skin="mono"] .go,
[data-skin="mono"] .nb-signin .go{
  background:var(--ink);color:var(--bg);background-image:none;
}





.nb-thememenu{
  display:none;position:absolute;right:0;top:calc(100% + 8px);z-index:140;
  min-width:232px;padding:10px;border-radius:var(--r);
  background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-l);
}
.nb-thememenu.on{display:block}
.nb-themewrap{position:relative;display:inline-flex}
.nb-thememenu .grp{
  font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink3);margin:8px 4px 6px;
}
.nb-thememenu .grp:first-child{margin-top:2px}
.nb-thememenu .row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}
.nb-thememenu .row.looks{grid-template-columns:1fr}
.nb-thememenu button{
  display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;
  border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--panel2);color:var(--ink2);
  font:inherit;font-size:12.5px;text-align:left;cursor:pointer;
}
.nb-thememenu .row:not(.looks) button{justify-content:center;gap:0;padding:7px 4px;font-size:12.5px}
.nb-thememenu button:hover{border-color:var(--accent);color:var(--ink)}
.nb-thememenu button.on{
  border-color:var(--accent);color:var(--ink);background:var(--tint-accent);font-weight:600;
}

.nb-thememenu .sw{
  flex:0 0 auto;width:26px;height:16px;border-radius:4px;
  border:1px solid rgba(128,128,128,.45);
}

.nb-thememenu .sw.classic{background:linear-gradient(135deg,#0b1220 0 38%,#4b7fd6 38% 62%,#f5f7fb 62%)}
.nb-thememenu .sw.colour {background:linear-gradient(135deg,#3b82f6,#a855f7 55%,#14b8a6)}
.nb-thememenu .sw.mono   {background:linear-gradient(90deg,#000 0 34%,#8a8a8a 34% 67%,#fff 67%)}






:root{
  --lift:rgba(255,255,255,.06);
  --lift2:rgba(255,255,255,.03);
  --glass:rgba(17,26,43,.72);
  --grad:linear-gradient(135deg,#4b7fd6,#6d9ae6 60%,#3fb9d4);
  --glow:0 0 0 3px rgba(75,127,214,.22);
  --glow-ok:0 0 10px rgba(52,211,153,.5);
  --glow-bad:0 0 10px rgba(248,113,113,.5);
  --wash1:rgba(75,127,214,.10);
  --wash2:rgba(109,154,230,.07);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --lift:rgba(255,255,255,.9);
    --lift2:rgba(255,255,255,.6);
    --glass:rgba(255,255,255,.82);
    --glow:0 0 0 3px rgba(43,92,187,.18);
    --glow-ok:0 0 10px rgba(15,157,98,.34);
    --glow-bad:0 0 10px rgba(210,63,63,.34);
    --wash1:rgba(43,92,187,.06);
    --wash2:rgba(75,127,214,.04);
  }
}
:root[data-theme="light"]{
  --lift:rgba(255,255,255,.9);
  --lift2:rgba(255,255,255,.6);
  --glass:rgba(255,255,255,.82);
  --glow:0 0 0 3px rgba(43,92,187,.18);
  --glow-ok:0 0 10px rgba(15,157,98,.34);
  --glow-bad:0 0 10px rgba(210,63,63,.34);
  --wash1:rgba(43,92,187,.06);
  --wash2:rgba(75,127,214,.04);
}


:root[data-skin="colour"]{
  --glass:rgba(20,27,51,.72);
  --glow:0 0 0 3px rgba(59,130,246,.24);
  --wash1:rgba(59,130,246,.14);
  --wash2:rgba(168,85,247,.11);
}
@media (prefers-color-scheme: light){
  :root[data-skin="colour"]:not([data-theme="dark"]){
    --glass:rgba(255,255,255,.84);
    --wash1:rgba(59,130,246,.07);
    --wash2:rgba(168,85,247,.06);
  }
}
:root[data-skin="colour"][data-theme="light"]{
  --glass:rgba(255,255,255,.84);
  --wash1:rgba(59,130,246,.07);
  --wash2:rgba(168,85,247,.06);
}


:root[data-skin="mono"]{
  --grad:linear-gradient(135deg,#f5f5f5,#9a9a9a);
  --glow:0 0 0 3px rgba(255,255,255,.22);
  --glow-ok:0 0 10px rgba(255,255,255,.45);
  --glow-bad:0 0 10px rgba(255,255,255,.45);
  --wash1:rgba(255,255,255,.05);
  --wash2:rgba(255,255,255,.03);
}
@media (prefers-color-scheme: light){
  :root[data-skin="mono"]:not([data-theme="dark"]){
    --grad:linear-gradient(135deg,#2a2a2a,#6a6a6a);
    --glow:0 0 0 3px rgba(0,0,0,.18);
    --glow-ok:0 0 10px rgba(0,0,0,.3);
    --glow-bad:0 0 10px rgba(0,0,0,.3);
    --wash1:rgba(0,0,0,.04);
    --wash2:rgba(0,0,0,.025);
  }
}
:root[data-skin="mono"][data-theme="light"]{
  --grad:linear-gradient(135deg,#2a2a2a,#6a6a6a);
  --glow:0 0 0 3px rgba(0,0,0,.18);
  --glow-ok:0 0 10px rgba(0,0,0,.3);
  --glow-bad:0 0 10px rgba(0,0,0,.3);
  --wash1:rgba(0,0,0,.04);
  --wash2:rgba(0,0,0,.025);
}



:root:not([data-app]):not([data-sim]) body{
  background-color:var(--bg);
  background-image:
    radial-gradient(1100px 700px at 12% -8%,  var(--wash1), transparent 60%),
    radial-gradient(900px 620px at 100% 0%,   var(--wash2), transparent 58%);
  background-attachment:fixed;
  background-repeat:no-repeat;
}


:root:not([data-app]):not([data-sim]) .card,
:root:not([data-app]):not([data-sim]) .nb-card,
:root:not([data-app]):not([data-sim]) .moncard,
:root:not([data-app]):not([data-sim]) .plan,
:root:not([data-app]):not([data-sim]) .tile{
  position:relative;
  background:linear-gradient(180deg,var(--lift2),transparent 42%),var(--panel);
  border:1px solid var(--line);
  box-shadow:var(--shadow), inset 0 1px 0 var(--lift);
  transition:box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}

:root:not([data-app]):not([data-sim]) .tile:hover{
  transform:translateY(-2px);
  border-color:var(--edge-accent);
  box-shadow:var(--shadow-l), inset 0 1px 0 var(--lift);
}
:root:not([data-app]):not([data-sim]) .plan.mine{
  border-color:var(--edge-accent);
  box-shadow:var(--shadow-l), inset 0 1px 0 var(--lift), 0 0 0 1px var(--edge-accent);
}


:root:not([data-app]):not([data-sim]) .nb-head,
:root:not([data-app]):not([data-sim]) .bar,
:root:not([data-app]):not([data-sim]) .capbar,
:root:not([data-app]):not([data-sim]) .adminbar{
  background:var(--panel);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 var(--lift2), var(--shadow);
}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  :root:not([data-app]):not([data-sim]) .nb-head,
  :root:not([data-app]):not([data-sim]) .bar{
    background:var(--glass);
    -webkit-backdrop-filter:saturate(1.5) blur(14px);
    backdrop-filter:saturate(1.5) blur(14px);
  }
}



:root:not([data-app]):not([data-sim]) .btn.pri,
:root:not([data-app]):not([data-sim]) .nb-btn.pri,
:root:not([data-app]):not([data-sim]) .go{
  background:var(--grad);
  border-color:transparent;
  color:#fff;
}


:root:not([data-app]):not([data-sim]) .nb-brand .nb-word i,
:root:not([data-app]):not([data-sim]) .nb-brand .nb-word u,
:root:not([data-app]):not([data-sim]) .brand .nb-word i,
:root:not([data-app]):not([data-sim]) .brand .nb-word u{
  background:var(--grad);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
:root:not([data-app]):not([data-sim]) .nb-badge.pro,
:root:not([data-app]):not([data-sim]) .nb-badge.enterprise,
:root:not([data-app]):not([data-sim]) .badge.pro,
:root:not([data-app]):not([data-sim]) .badge.enterprise,
:root:not([data-app]):not([data-sim]) .pill.admin{
  background:var(--grad); color:#fff; border-color:transparent;
  box-shadow:0 1px 6px rgba(139,92,246,.4);
}





:root:not([data-app]):not([data-sim]) .dot.on,
:root:not([data-app]):not([data-sim]) .dot.online,
:root:not([data-app]):not([data-sim]) .led.on,
:root:not([data-app]):not([data-sim]) .pill.ready{ box-shadow:var(--glow-ok); }
:root:not([data-app]):not([data-sim]) .dot.error,
:root:not([data-app]):not([data-sim]) .led.error,
:root:not([data-app]):not([data-sim]) .pill.error{ box-shadow:var(--glow-bad); }

:root:not([data-app]):not([data-sim]) .dot.warn,
:root:not([data-app]):not([data-sim]) .dot.connecting,
:root:not([data-app]):not([data-sim]) .pill.pending{ animation:nbPulse 1.6s ease-in-out infinite; }
@keyframes nbPulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(255,192,67,.5); }
  50%    { box-shadow:0 0 10px 2px rgba(255,192,67,.45); }
}


:root:not([data-app]):not([data-sim]) :is(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
  box-shadow:var(--glow);
  border-radius:var(--r-sm);
}


:root:not([data-app]):not([data-sim]) .msg{
  border-left:3px solid var(--line);
  box-shadow:var(--shadow), inset 0 1px 0 var(--lift2);
}
:root:not([data-app]):not([data-sim]) .msg.ok  { border-left-color:var(--ok); }
:root:not([data-app]):not([data-sim]) .msg.warn{ border-left-color:var(--warn); }
:root:not([data-app]):not([data-sim]) .msg.bad { border-left-color:var(--bad); }
:root:not([data-app]):not([data-sim]) .msg.info{ border-left-color:var(--accent); }


:root:not([data-app]):not([data-sim]) .tbl thead th,
:root:not([data-app]):not([data-sim]) .montbl thead th{
  background:linear-gradient(180deg,var(--panel3),var(--panel2));
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:1;
}
:root:not([data-app]):not([data-sim]) .tbl tbody tr:hover,
:root:not([data-app]):not([data-sim]) .montbl tbody tr:hover{ background:var(--tint-accent); }


:root:not([data-app]):not([data-sim]) .trail-org{
  border-bottom:none;
  background:linear-gradient(90deg,var(--tint-accent),transparent 70%);
  border-radius:var(--r-sm);
  padding:9px 10px;
}
:root:not([data-app]):not([data-sim]) .trail-org-name{
  background:var(--grad);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
:root:not([data-app]):not([data-sim]) .trail-person[open]>summary{ background:var(--panel2); }




@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  :root:not([data-app]):not([data-sim]) .tile:hover{ transform:none; }
}






:root:not([data-sim]):not([data-app]) :is(.btn, .btn-primary, .btn-ghost, .btn-accent,
  .btn-green, .btn-nav, .btn-sm, .btn-xs, .nb-btn, .go, .authgo,
  .winbtn, .gospill){
  border-radius:var(--r-sm);
  font-family:var(--sans);
  transition:box-shadow .15s ease, color .15s ease, border-color .15s ease;
  cursor:pointer;
}


:root:not([data-sim]):not([data-app]) :is(.btn, .btn-sm, .btn-xs, .nb-btn){
  --_bg:var(--panel2);
  background:var(--_bg);
  border:1px solid var(--line);
  color:var(--ink);
}

:root:not([data-sim]):not([data-app]) .btn-ghost{
  --_bg:var(--card, var(--panel2));
  background:var(--_bg);
  border:1px solid var(--line);
  color:var(--ink);
}

:root:not([data-sim]):not([data-app]) :is(.btn.pri, .nb-btn.pri, .btn-primary, .btn-accent,
  .go, .authgo){
  --_bg:var(--grad);
  background:var(--_bg);
  border:1px solid transparent;
  color:#fff;
  font-weight:600;
}
:root:not([data-sim]):not([data-app]) :is(.btn-green, .btn-nav){
  --_bg:var(--ok);
  background:var(--_bg);
  border:1px solid var(--ok);
  color:#06231a;
  font-weight:600;
}


:root:not([data-theme="dark"]):not([data-sim]):not([data-app]) :is(.btn-green, .btn-nav),
:root:not([data-theme="dark"]):not([data-sim]):not([data-app]) :is(.btn-green, .btn-nav):hover{ color:#fff; }


:root:not([data-sim]):not([data-app]) :is(.btn, .btn-sm, .btn-xs, .nb-btn, .btn-ghost):hover{
  background:var(--_bg);
  border-color:var(--line);
  color:var(--ink);
  box-shadow:inset 0 -2px 0 var(--accent);
}

:root:not([data-sim]):not([data-app]) :is(.btn.pri, .nb-btn.pri, .btn-primary, .btn-accent,
  .go, .authgo):hover{
  background:var(--_bg);
  color:#fff;
  box-shadow:inset 0 -2px 0 rgba(255,255,255,.9);
}
:root:not([data-sim]):not([data-app]) :is(.btn-green, .btn-nav):hover{
  background:var(--_bg);
  color:#06231a;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.5);
}

:root:not([data-sim]):not([data-app]) :is(.btn, .nb-btn).danger:hover{
  background:var(--_bg);
  border-color:var(--line);
  color:var(--bad);
  box-shadow:inset 0 -2px 0 var(--bad);
}


:root:not([data-sim]):not([data-app]) :is(.btn, .btn-sm, .btn-xs, .nb-btn, .btn-ghost):active{
  background:var(--_bg);
  box-shadow:inset 0 -3px 0 var(--accent2, var(--accent));
}
:root:not([data-sim]):not([data-app]) :is(.btn.pri, .nb-btn.pri, .btn-primary, .btn-accent,
  .go, .authgo):active{
  background:var(--_bg);
  box-shadow:inset 0 -3px 0 #fff;
}
:root:not([data-sim]):not([data-app]) :is(.btn-green, .btn-nav):active{
  background:var(--_bg);
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.6);
}
:root:not([data-sim]):not([data-app]) :is(.btn, .nb-btn).danger:active{
  background:var(--_bg);
  box-shadow:inset 0 -3px 0 var(--bad);
}


:root:not([data-sim]):not([data-app]) :is(.btn, .nb-btn, .btn-ghost).on,
:root:not([data-sim]):not([data-app]) :is(.btn, .nb-btn).active,
:root:not([data-sim]):not([data-app]) :is(.btn, .nb-btn, .btn-ghost)[aria-pressed="true"]{
  background:var(--_bg);
  color:var(--ink);
  box-shadow:inset 0 -2px 0 var(--accent);
  font-weight:600;
}


:root:not([data-sim]):not([data-app]) :is(.btn, .btn-primary, .btn-ghost, .btn-accent,
  .btn-green, .btn-nav, .btn-sm, .btn-xs, .nb-btn, .go, .authgo,
  .winbtn, .gospill):focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}


:root:not([data-sim]):not([data-app]) :is(.btn, .btn-primary, .btn-ghost, .btn-accent,
  .btn-green, .btn-nav, .btn-sm, .btn-xs, .nb-btn, .go, .authgo):disabled{
  opacity:.45; cursor:not-allowed;
}
:root:not([data-sim]):not([data-app]) :is(.btn, .btn-primary, .btn-ghost, .btn-accent,
  .btn-green, .btn-nav, .nb-btn, .go, .authgo):disabled:hover{
  background:var(--_bg); box-shadow:none; color:inherit;
}


:root:not([data-sim]):not([data-app]) .winbtn:hover{ box-shadow:inset 0 -2px 0 var(--accent); }
:root:not([data-sim]):not([data-app]) .gospill{ --_bg:var(--panel2); }
:root:not([data-sim]):not([data-app]) .gospill:hover{ background:var(--_bg); box-shadow:inset 0 -2px 0 var(--accent); }
:root:not([data-sim]):not([data-app]) .gospill.on{ background:var(--_bg); box-shadow:inset 0 -2px 0 var(--accent);
                                   font-weight:600; color:var(--ink); }