:root {
  --bg:#0b1020;
  --bg2:#0e1428;
  --panel:#131a30;
  --panel-hi:#1b2440;
  --line:#26304d;
  --line2:#334065;
  --tx:#e6ebf5;
  --tx2:#9aa7c2;
  --tx3:#6b7899;
  --ok:#34d399;
  --warn:#fbbf24;
  --crit:#f87171;
  --unk:#a78bfa;
  --acc:#38bdf8;
  --r:12px;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
}
body {
  background:
    radial-gradient(
      1100px 600px at 82% -8%,
      rgba(56, 189, 248, .10),
      transparent 60%),
    radial-gradient(
      900px 500px at 8% 105%,
      rgba(167, 139, 250, .08),
      transparent 60%),
    var(--bg);
  color: var(--tx);
  font:
    15px/1.55 -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Inter,
    sans-serif;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
a {
  color: inherit;
}
.mono {
  font-family:
    ui-monospace,
    SFMono-Regular,
    "SF Mono",
    Menlo,
    monospace;
  font-size: .9em;
}
.shell {
  display: flex;
  min-height: 100vh;
}
.side {
  width: 236px;
  flex: 0 0 236px;
  background: rgba(11, 16, 32, .72);
  border-right: 1px solid var(--line);
  padding: 20px 14px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}
.brand {
  display: block;
  padding: 2px 6px 0;
  text-decoration: none;
}
.brand img.logo {
  width: 150px;
  height: auto;
  display: block;
}
.brand img.mark {
  display: none;
  width: 34px;
  height: 34px;
  margin: 0 auto;
  border-radius: 9px;
  background: #fff;
}
.sidetgl {
  position: absolute;
  top: 16px;
  right: 10px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid var(--line2);
  border-radius: 7px;
  background: var(--panel);
  color: var(--tx3);
  font: inherit;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sidetgl:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.nav a .ini {
  display: none;
  flex: none;
  width: 28px;
  height: 22px;
  border-radius: 6px;
  background: var(--panel-hi);
  color: var(--tx2);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .03em;
  align-items: center;
  justify-content: center;
}
.nav a.on .ini {
  background: var(--acc);
  color: #06121e;
}
html.sidechiusa .side {
  width: 64px;
  flex: 0 0 64px;
  padding: 18px 8px;
}
html.sidechiusa .brand {
  padding: 0;
}
html.sidechiusa .brand img.logo {
  display: none;
}
html.sidechiusa .brand img.mark {
  display: block;
}
html.sidechiusa .prod,
html.sidechiusa .ver,
html.sidechiusa .navlabel,
html.sidechiusa .side .foot .who,
html.sidechiusa .nav a .ico,
html.sidechiusa .nav a .nm {
  display: none;
}
html.sidechiusa .nav a {
  justify-content: center;
  padding: 7px 2px;
}
html.sidechiusa .nav a.on {
  box-shadow: none;
}
html.sidechiusa .nav a .ini {
  display: flex;
}
html.sidechiusa .sidetgl {
  position: static;
  margin: 12px auto 10px;
}
html.sidechiusa .side .foot {
  padding: 12px 0 0;
  text-align: center;
}
html.sidechiusa .side .foot .linkbtn {
  padding: 5px 7px;
  font-size: 11px;
}
.prod {
  color: var(--tx3);
  font-size: 10px;
  letter-spacing: .14em;
  margin: 9px 0 3px 8px;
  font-weight: 600;
}
.prod b {
  color: var(--tx2);
  font-weight: 700;
}
.ver {
  display: inline-block;
  color: var(--tx3);
  font-size: 10.5px;
  margin: 0 0 16px 8px;
  font-variant-numeric: tabular-nums;
  text-decoration: none;
}
a.ver {
  border-bottom: 1px dotted var(--line);
}
a.ver:hover {
  color: var(--acc);
  border-bottom-color: var(--acc);
}
.navlabel {
  color: var(--tx3);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: 14px 10px 6px;
  font-weight: 600;
}
.nav a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border-radius: 9px;
  color: var(--tx2);
  text-decoration: none;
  font-size: 13.5px;
  margin-bottom: 1px;
  transition: background .13s, color .13s;
}
.nav a:hover {
  background: var(--panel);
  color: var(--tx);
}
.nav a.on {
  background: var(--panel-hi);
  color: var(--tx);
  font-weight: 600;
  box-shadow: inset 2px 0 0 var(--acc);
}
.nav a .ico {
  width: 16px;
  text-align: center;
  opacity: .75;
  font-size: 13px;
}
.side .foot {
  position: sticky;
  top: 100%;
  padding: 14px 10px 0;
  border-top: 1px solid var(--line);
  margin-top: 18px;
}
.side .foot .who {
  font-size: 12px;
  color: var(--tx2);
  word-break: break-all;
  margin-bottom: 8px;
}
.linkbtn {
  background: none;
  border: 1px solid var(--line2);
  color: var(--tx2);
  border-radius: 8px;
  padding: 5px 10px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
}
.linkbtn:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.main {
  flex: 1;
  min-width: 0;
  padding: 26px 30px 60px;
}
.wrap {
  max-width: 1220px;
  margin: 0 auto;
}
.crumb {
  color: var(--tx3);
  font-size: 12.5px;
  margin-bottom: 8px;
}
.crumb a {
  color: var(--tx2);
  text-decoration: none;
}
.crumb a:hover {
  color: var(--acc);
}
h1 {
  font-size: 24px;
  margin: 0 0 4px;
  letter-spacing: -.02em;
  font-weight: 650;
}
.clihead {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}
.clilogo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--line2);
  border-radius: 10px;
  padding: 7px 11px;
  flex: none;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .25);
}
.clilogo img {
  display: block;
  height: 30px;
  width: auto;
  max-width: 190px;
  object-fit: contain;
}
.clihead h1 {
  margin: 0;
}
@media (max-width:560px) {
  .clilogo img {
    height: 24px;
    max-width: 150px;
  }
}
h2 {
  font-size: 15px;
  margin: 30px 0 12px;
  letter-spacing: -.01em;
  font-weight: 650;
  display: flex;
  align-items: center;
  gap: 9px;
}
h2 .cnt {
  color: var(--tx3);
  font-weight: 500;
  font-size: 12.5px;
}
.sub {
  color: var(--tx2);
  font-size: 13px;
  margin: 0 0 18px;
}
.sub .fresh {
  color: var(--tx3);
}
.pagehead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.pagehead .phtitle {
  min-width: 0;
}
.gsearch {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 470px;
  min-width: 250px;
  margin: 1px 0 18px;
}
.gsico {
  position: absolute;
  left: 11px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--tx3);
  font-size: 16px;
  line-height: 1;
  pointer-events: none;
}
.gsq {
  flex: 1;
  min-width: 0;
  background: var(--panel);
  border: 1px solid var(--line);
  color: var(--tx);
  border-radius: 10px;
  padding: 9px 12px 9px 31px;
  font: inherit;
  font-size: 13.5px;
}
.gsq:focus {
  outline: none;
  border-color: var(--acc);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, .12);
}
.gsq::placeholder {
  color: var(--tx3);
}
.gsgo {
  background: var(--panel-hi);
  border: 1px solid var(--line2);
  color: var(--tx2);
  border-radius: 10px;
  padding: 9px 14px;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  white-space: nowrap;
}
.gsgo:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.gsres {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: min(70vh, 460px);
  overflow-y: auto;
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 12px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .45);
  padding: 5px;
}
.gsres[hidden] {
  display: none;
}
.gsg {
  color: var(--tx3);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 600;
  padding: 9px 10px 4px;
}
.gso {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
}
.gso:hover,
.gso.on {
  background: var(--panel-hi);
}
.gso .t {
  font-size: 13px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family:
    ui-monospace,
    SFMono-Regular,
    "SF Mono",
    Menlo,
    monospace;
}
.gso .d {
  font-size: 11.5px;
  color: var(--tx3);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gso .c {
  margin-left: auto;
  font-size: 11px;
  color: var(--tx2);
  white-space: nowrap;
  padding-left: 8px;
}
.gsmsg {
  padding: 10px;
  font-size: 12.5px;
  color: var(--tx2);
}
.gsmore {
  padding: 1px 10px 8px;
  font-size: 11px;
  color: var(--tx3);
}
.rlist {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
a.ritem {
  display: flex;
  align-items: baseline;
  gap: 12px;
  text-decoration: none;
  color: inherit;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 13px;
  transition: border-color .12s, background .12s;
}
a.ritem:hover {
  border-color: var(--acc);
  background: var(--panel-hi);
}
.ritem .rmain {
  min-width: 0;
  flex: 1;
}
.ritem .rt {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  font-size: 13.5px;
}
.ritem .rname {
  font-weight: 600;
}
.ritem .rd {
  color: var(--tx3);
  font-size: 12px;
  margin-top: 3px;
  word-break: break-word;
}
.ritem .rc {
  color: var(--tx2);
  font-size: 12px;
  white-space: nowrap;
}
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 16px 18px;
}
.note {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 14px 16px;
  color: var(--tx2);
  font-size: 13.5px;
}
.note.warn {
  background: rgba(251, 191, 36, .07);
  border-color: rgba(251, 191, 36, .3);
  color: #fde68a;
}
.note.info {
  background: rgba(56, 189, 248, .06);
  border-color: rgba(56, 189, 248, .25);
  color: #bae6fd;
}
.kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(152px, 1fr));
  gap: 10px;
  margin: 18px 0 4px;
}
.kpi {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 13px 15px;
  display: block;
  text-decoration: none;
  color: inherit;
  position: relative;
  transition:
    border-color .12s,
    transform .12s,
    background .12s;
}
a.kpi:hover {
  border-color: var(--acc);
  background: var(--panel2,var(--panel));
  transform: translateY(-1px);
}
a.kpi::after {
  content: "↗";
  position: absolute;
  top: 9px;
  right: 11px;
  font-size: 11px;
  color: var(--tx3);
  opacity: 0;
  transition: opacity .12s;
}
a.kpi:hover::after {
  opacity: 1;
}
.kpi .n {
  font-size: 25px;
  font-weight: 680;
  letter-spacing: -.03em;
  line-height: 1.15;
}
.kpi .l {
  color: var(--tx3);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .09em;
  margin-top: 3px;
  font-weight: 600;
}
.n.ok {
  color: var(--ok);
}
.n.warn {
  color: var(--warn);
}
.n.crit {
  color: var(--crit);
}
.n.unk {
  color: var(--unk);
}
.n.acc {
  color: var(--acc);
}
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(288px, 1fr));
  gap: 13px;
}
a.ccard {
  display: block;
  text-decoration: none;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 16px 18px 15px;
  position: relative;
  overflow: hidden;
  transition:
    border-color .14s,
    transform .14s,
    background .14s;
}
a.ccard:hover {
  border-color: var(--acc);
  transform: translateY(-2px);
  background: var(--panel-hi);
}
a.ccard .nm {
  font-weight: 640;
  font-size: 15.5px;
  letter-spacing: -.01em;
}
a.ccard .meta {
  color: var(--tx3);
  font-size: 12px;
  margin-top: 4px;
  display: flex;
  gap: 7px;
  align-items: center;
}
a.ccard::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: transparent;
}
a.ccard.sev-ok::before {
  background: var(--ok);
}
a.ccard.sev-warn::before {
  background: var(--warn);
}
a.ccard.sev-crit::before {
  background: var(--crit);
}
a.ccard.sev-unk::before {
  background: var(--line2);
}
.chead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.chead .cid {
  min-width: 0;
}
.chead .envdot {
  margin-top: 5px;
}
.envdot.crit {
  background: var(--crit);
  box-shadow: 0 0 12px var(--crit);
}
.envdot.warn {
  background: var(--warn);
  box-shadow: 0 0 12px var(--warn);
}
.envdot.unk {
  background: var(--line2);
  box-shadow: none;
}
.cstats {
  display: flex;
  gap: 20px;
  margin-top: 14px;
}
.cstat b {
  display: block;
  font-size: 21px;
  font-weight: 680;
  letter-spacing: -.03em;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
}
.cstat b.acc {
  color: var(--acc);
}
.cstat b.ok {
  color: var(--ok);
}
.cstat b.warn {
  color: var(--warn);
}
.cstat b.crit {
  color: var(--crit);
}
.cstat b.dim {
  color: var(--tx3);
}
.cstat span {
  display: block;
  color: var(--tx3);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  margin-top: 2px;
  font-weight: 600;
}
.cbar {
  display: flex;
  height: 5px;
  border-radius: 99px;
  background: var(--line);
  overflow: hidden;
  margin-top: 13px;
}
.cbar i {
  display: block;
  height: 100%;
}
.cbar i.ok {
  background: var(--ok);
}
.cbar i.warn {
  background: var(--warn);
}
.cbar i.crit {
  background: var(--crit);
}
.cbar i.unk {
  background: var(--unk);
}
.cbadges {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 11px;
}
.cnote {
  color: var(--tx3);
  font-size: 11.5px;
  margin-top: 9px;
  line-height: 1.45;
}
.csec {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
}
.csec b {
  font-weight: 650;
}
.cempty {
  color: var(--tx3);
  font-size: 12.5px;
  margin-top: 13px;
}
.tbl {
  border: 1px solid var(--line);
  border-radius: var(--r);
  overflow: hidden;
  background: var(--panel);
}
.tbl .scroll {
  overflow-x: auto;
}
.tbl.alta .scroll {
  max-height: min(64vh, 540px);
  overflow: auto;
  overscroll-behavior: contain;
}
.tbl.alta thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--bg2);
}
table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13px;
}
th,
td {
  padding: 9px 13px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
th {
  background: var(--bg2);
  color: var(--tx3);
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .07em;
  white-space: nowrap;
}
tbody tr:last-child td {
  border-bottom: 0;
}
tbody tr:hover {
  background: var(--panel-hi);
}
td a {
  color: var(--tx);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
td a:hover {
  color: var(--acc);
  border-bottom-color: var(--acc);
}
.nw {
  white-space: nowrap;
}
.dim {
  color: var(--tx3);
}
.trunc {
  max-width: 34ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tx2);
}
.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.b {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .02em;
  white-space: nowrap;
}
.b.ok {
  background: rgba(52, 211, 153, .14);
  color: var(--ok);
}
.b.dism {
  background: #1b2440;
  color: var(--tx3);
  border: 1px solid var(--line2);
}
.tag.dism {
  background: #1b2440;
  color: var(--tx3);
  border: 1px solid var(--line2);
}
.n.dim {
  color: var(--tx3);
}
.b.warn {
  background: rgba(251, 191, 36, .14);
  color: var(--warn);
}
.b.crit {
  background: rgba(248, 113, 113, .14);
  color: var(--crit);
}
.b.unk {
  background: rgba(167, 139, 250, .14);
  color: var(--unk);
}
.b.cli {
  background: rgba(56, 189, 248, .14);
  color: var(--acc);
}
.cbar i.cli {
  background: var(--acc);
}
.protline {
  font-size: 15.5px;
  margin: 18px 0 0;
  line-height: 1.55;
}
.protline b {
  font-weight: 680;
  letter-spacing: -.01em;
}
.protline b.ok {
  color: var(--ok);
}
.protline b.cli {
  color: var(--acc);
}
.protline b.crit {
  color: var(--crit);
}
.protline b.unk {
  color: var(--unk);
}
.tag {
  background: var(--line);
  color: var(--tx3);
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 5px;
  font-weight: 600;
  letter-spacing: .02em;
  vertical-align: middle;
}
.tag.warn {
  background: rgba(251, 191, 36, .14);
  color: var(--warn);
}
.ruoli {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 11px 0 0;
}
.ruolo {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 650;
  padding: 5px 11px 5px 9px;
  border-radius: 999px;
  background: var(--panel-hi);
  color: var(--tx);
  border: 1px solid var(--line2);
  white-space: nowrap;
  cursor: help;
}
.ruolo .ic {
  width: 15px;
  height: 15px;
  flex: none;
}
.ruolo .det {
  font-weight: 500;
  opacity: .82;
}
.ruolo.r-db {
  background: rgba(52, 211, 153, .13);
  border-color: rgba(52, 211, 153, .34);
  color: #a7f3d0;
}
.ruolo.r-app {
  background: rgba(56, 189, 248, .13);
  border-color: rgba(56, 189, 248, .34);
  color: #bae6fd;
}
.ruolo.r-applicazione {
  background: rgba(167, 139, 250, .15);
  border-color: rgba(167, 139, 250, .38);
  color: #ddd6fe;
}
.ruolo.r-web {
  background: rgba(251, 191, 36, .13);
  border-color: rgba(251, 191, 36, .34);
  color: #fde68a;
}
.ruolo.r-sap {
  background: rgba(251, 191, 36, .13);
  border-color: rgba(251, 191, 36, .34);
  color: #fde68a;
}
.ruolo.r-mail {
  background: rgba(244, 114, 182, .13);
  border-color: rgba(244, 114, 182, .34);
  color: #fbcfe8;
}
.ruolo.r-dc,
.ruolo.r-dns,
.ruolo.r-dhcp {
  background: rgba(148, 163, 184, .14);
  border-color: rgba(148, 163, 184, .34);
  color: #e2e8f0;
}
.ruolo.r-backup {
  background: rgba(45, 212, 191, .13);
  border-color: rgba(45, 212, 191, .34);
  color: #99f6e4;
}
.ruolo.r-monitor {
  background: rgba(129, 140, 248, .14);
  border-color: rgba(129, 140, 248, .36);
  color: #c7d2fe;
}
.ruolo.r-container {
  background: rgba(56, 189, 248, .13);
  border-color: rgba(56, 189, 248, .34);
  color: #bae6fd;
}
.ruolo.r-virt,
.ruolo.r-vcenter {
  background: rgba(244, 114, 182, .12);
  border-color: rgba(244, 114, 182, .32);
  color: #fbcfe8;
}
.ruolo.r-cluster {
  background: rgba(45, 212, 191, .12);
  border-color: rgba(45, 212, 191, .32);
  color: #99f6e4;
}
.ruolodesc {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 14px 0 20px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tx);
  max-width: 78ch;
}
.ruolodesc .osbolla {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #eef1f7;
  border: 1px solid var(--line2);
  flex: none;
  margin-top: -5px;
}
.ruolodesc .osmark {
  width: 25px;
  height: 25px;
  margin: 0;
  flex: none;
}
.bar {
  height: 5px;
  border-radius: 99px;
  background: var(--line);
  overflow: hidden;
  min-width: 78px;
  margin-top: 5px;
}
.bar i {
  display: block;
  height: 100%;
  border-radius: 99px;
}
.bar i.ok {
  background: var(--ok);
}
.bar i.warn {
  background: var(--warn);
}
.bar i.crit {
  background: var(--crit);
}
.bar i.unk {
  background: var(--line2);
}
.pct {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  font-size: 12.5px;
}
.pct.ok {
  color: var(--ok);
}
.pct.warn {
  color: var(--warn);
}
.pct.crit {
  color: var(--crit);
}
.pct.unk {
  color: var(--tx3);
}
.tools {
  display: flex;
  gap: 9px;
  margin-bottom: 11px;
  flex-wrap: wrap;
}
.search {
  flex: 1;
  min-width: 190px;
  max-width: 340px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 7px 12px;
  color: var(--tx);
  font: inherit;
  font-size: 13px;
}
.search:focus {
  outline: none;
  border-color: var(--acc);
}
.search::placeholder {
  color: var(--tx3);
}
.osmark {
  width: 13px;
  height: 13px;
  vertical-align: -2px;
  margin-right: 6px;
  flex: none;
}
.chip .osmark {
  margin-right: 5px;
}
details.sez {
  margin-top: 22px;
}
details.sez > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  font-weight: 600;
  padding: 9px 0;
  user-select: none;
}
details.sez > summary::-webkit-details-marker {
  display: none;
}
details.sez > summary::before {
  content: "▸";
  color: var(--tx3);
  font-size: 11px;
  transition: transform .12s;
}
details.sez[open] > summary::before {
  transform: rotate(90deg);
}
details.sez > summary:hover {
  color: var(--acc);
}
details.sez > summary .cnt {
  font-weight: 400;
}
details.sez .note {
  margin-bottom: 11px;
}
.calbar {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 11px;
}
.calbar .seg {
  display: inline-flex;
  border: 1px solid var(--line2);
  border-radius: 9px;
  overflow: hidden;
}
.calbar .seg a {
  padding: 5px 13px;
  font-size: 12.5px;
  color: var(--tx2);
  text-decoration: none;
  border-right: 1px solid var(--line2);
}
.calbar .seg a:last-child {
  border-right: none;
}
.calbar .seg a:hover {
  background: var(--panel);
  color: var(--tx);
}
.calbar .seg a.on {
  background: var(--panel-hi);
  color: var(--tx);
  font-weight: 650;
}
.calbar .navg {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.calbar .navg a {
  width: 26px;
  height: 26px;
  line-height: 24px;
  text-align: center;
  border-radius: 8px;
  border: 1px solid var(--line2);
  color: var(--tx2);
  text-decoration: none;
  font-size: 15px;
}
.calbar .navg a:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.calbar .navg b {
  font-size: 13.5px;
  font-weight: 650;
  min-width: 170px;
  text-align: center;
}
.calbar .oggi {
  font-size: 12.5px;
  color: var(--tx2);
  text-decoration: none;
  border: 1px solid var(--line2);
  border-radius: 8px;
  padding: 5px 11px;
}
.calbar .oggi:hover {
  border-color: var(--acc);
  color: var(--tx);
}
table.cal {
  border-collapse: collapse;
}
table.cal th.d {
  padding: 6px 0 8px;
  text-align: center;
  font-weight: 600;
  line-height: 1.15;
}
table.cal th.d i {
  display: block;
  font-style: normal;
  font-size: 9.5px;
  color: var(--tx3);
  text-transform: uppercase;
  letter-spacing: .04em;
}
table.cal th.d b {
  display: block;
  font-size: 12px;
  color: var(--tx2);
  font-weight: 600;
}
table.cal th.d.today b {
  color: var(--acc);
}
table.cal th.jobcol,
table.cal td.jobcol {
  text-align: left;
  min-width: 250px;
  max-width: 340px;
}
table.cal td.jobcol {
  padding-top: 7px;
  padding-bottom: 7px;
}
table.cal td.jobcol .jn {
  font-size: 12.5px;
  color: var(--tx);
  word-break: break-word;
}
table.cal td.jobcol .jm {
  font-size: 11.5px;
  color: var(--tx2);
  margin-top: 2px;
}
table.cal td.jobcol .jm a {
  color: var(--tx2);
}
table.cal td.jobcol .cadb {
  display: inline-block;
  padding: 0 7px;
  border-radius: 99px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-right: 5px;
  background: var(--panel-hi);
  color: var(--tx2);
  border: 1px solid var(--line2);
}
table.cal th.esiti,
table.cal td.esiti {
  text-align: right;
  font-size: 11.5px;
  white-space: nowrap;
  padding-left: 14px;
}
table.cal td.esiti .ok {
  color: var(--ok);
}
table.cal td.esiti .crit {
  color: var(--crit);
}
table.cal td.c {
  padding: 3px 2px;
  text-align: center;
  width: 22px;
  min-width: 22px;
}
table.cal td.c i,
.callegend i.sw {
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 4px;
  margin: 0 auto;
}
table.cal td.wk,
table.cal th.wk {
  border-left: 1px solid var(--line);
}
table.cal-mese th.d i {
  display: none;
}
table.cal-mese th.d,
table.cal-mese td.c {
  width: 24px;
  min-width: 24px;
}
table.cal th.we,
table.cal td.we {
  background: rgba(255, 255, 255, .028);
}
table.cal td.c.today i,
table.cal th.d.today {
  box-shadow: 0 0 0 1px rgba(56, 189, 248, .5);
}
table.cal-settimana td.c {
  width: auto;
}
table.cal-settimana td.c i {
  width: 100%;
  height: 26px;
  border-radius: 6px;
}
.c.ok i,
.sw.ok {
  background: var(--ok);
}
.c.warn i,
.sw.warn {
  background: var(--warn);
}
.c.crit i,
.sw.crit {
  background: var(--crit);
}
.c.unk i,
.sw.unk {
  background: var(--unk);
}
.c.miss i,
.sw.miss {
  background: transparent;
  border: 1.5px solid var(--crit);
}
.c.fut i,
.sw.fut {
  background: transparent;
  border: 1.5px solid var(--acc);
  opacity: .7;
}
.c.unmeas i,
.sw.unmeas {
  background:
    repeating-linear-gradient(
      45deg,
      var(--line2),
      var(--line2) 2px,
      transparent 2px,
      transparent 5px);
}
.c.none i,
.sw.none {
  background: rgba(255, 255, 255, .05);
}
table.cal tr.cad-monthly td.jobcol {
  box-shadow: inset 2px 0 0 var(--unk);
}
table.cal tr.cad-monthly .cadb {
  background: rgba(167, 139, 250, .16);
  color: var(--unk);
  border-color: rgba(167, 139, 250, .4);
}
table.cal tr.cad-monthly td.c.fut i {
  border-color: var(--unk);
  opacity: 1;
}
table.cal tr.cad-monthly td.c.miss i {
  border-color: var(--crit);
  box-shadow: 0 0 0 1px rgba(167, 139, 250, .45);
}
table.cal tr.cad-unknown .cadb,
table.cal tr.cad-manual .cadb {
  color: var(--tx3);
}
.callegend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-top: 11px;
  font-size: 11.5px;
  color: var(--tx2);
}
.callegend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
tr.grp {
  cursor: pointer;
}
tr.grp:hover {
  background: rgba(255, 255, 255, .03);
}
tr.grp .arrow {
  color: var(--tx3);
  font-size: 10px;
  display: inline-block;
  transition: transform .12s;
}
tr.grp.open .arrow {
  transform: rotate(90deg);
}
th.w1,
td.w1 {
  width: 22px;
  padding-left: 11px;
  padding-right: 0;
}
tr.pathrow {
  display: none;
}
tr.pathrow.shown {
  display: table-row;
}
tr.pathrow td {
  background: rgba(255, 255, 255, .015);
  font-size: 12px;
  padding-top: 4px;
  padding-bottom: 4px;
}
.pathcell {
  display: inline-block;
  margin-right: 16px;
  color: var(--tx3);
}
.pathcell:first-child {
  color: var(--tx2);
}
.dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
  gap: 2px 26px;
}
.dl div {
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
}
.dl dt {
  color: var(--tx3);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
}
.dl dd {
  margin: 2px 0 0;
  font-size: 13.5px;
  word-break: break-word;
}
.secgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 13px;
}
.login {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.loginbox {
  width: 100%;
  max-width: 372px;
}
.loginbox .card {
  padding: 30px 30px 26px;
}
.loginbox h1 {
  font-size: 21px;
  margin-bottom: 3px;
}
label {
  display: block;
  font-size: 12px;
  color: var(--tx2);
  margin: 14px 0 5px;
  font-weight: 600;
}
input[type=email],
input[type=password] {
  width: 100%;
  padding: 10px 12px;
  border-radius: 9px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  color: var(--tx);
  font: inherit;
  font-size: 14px;
}
input:focus {
  outline: none;
  border-color: var(--acc);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, .12);
}
.btn {
  width: 100%;
  margin-top: 20px;
  background: var(--acc);
  color: #04263a;
  font-weight: 680;
  border: 0;
  border-radius: 9px;
  padding: 11px;
  cursor: pointer;
  font-size: 14px;
  font-family: inherit;
}
.btn:hover {
  filter: brightness(1.08);
}
.err {
  background: rgba(248, 113, 113, .1);
  border: 1px solid rgba(248, 113, 113, .35);
  color: #fca5a5;
  padding: 9px 12px;
  border-radius: 9px;
  font-size: 13px;
  margin-top: 14px;
}
.hint {
  color: var(--tx3);
  font-size: 11.5px;
  text-align: center;
  margin: 16px 0 0;
}
.cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
}
.cat {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 13px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--tx2);
  font: inherit;
  font-size: 13px;
  font-weight: 550;
  cursor: pointer;
  transition: all .13s;
}
.cat:hover {
  border-color: var(--line2);
  color: var(--tx);
}
.cat b {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--tx);
}
.cat.on {
  border-color: var(--acc);
  background: var(--panel-hi);
  color: var(--tx);
}
.cat::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--line2);
}
.cat-win::before {
  background: #38bdf8;
}
.cat-lnx::before {
  background: #fbbf24;
}
.cat-unix::before {
  background: #f472b6;
}
.cat-net::before {
  background: #a78bfa;
}
.cat-fw::before {
  background: #f87171;
}
.cat-sto::before {
  background: #34d399;
}
.cat-oth::before {
  background: var(--tx3);
}
.cat-dism::before {
  background: var(--line2);
}
.cat-vmw::before {
  background: #2dd4bf;
}
.cat-web::before {
  background: #22d3ee;
}
.cat-pwr::before {
  background: #f59e0b;
}
.chip {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  background: var(--panel-hi);
  color: var(--tx2);
  border: 1px solid var(--line);
}
.chip.cat-win {
  color: #7dd3fc;
}
.chip.cat-lnx {
  color: #fcd34d;
}
.chip.cat-unix {
  color: #f9a8d4;
}
.chip.cat-net {
  color: #c4b5fd;
}
.chip.cat-fw {
  color: #fca5a5;
}
.chip.cat-sto {
  color: #6ee7b7;
}
.chip.cat-vmw {
  color: #5eead4;
}
.chip.cat-web {
  color: #67e8f9;
}
.chip.cat-pwr {
  color: #fcd34d;
}
.chip.cat-bck {
  color: #5eead4;
}
.chip.cat-prn {
  color: #e2e8f0;
}
.chip.cat-app {
  color: #bef264;
}
.chip.cat-srv {
  color: #fdba74;
}
.chip.cat-tape {
  color: #a5b4fc;
}
.chip.cat-vtl {
  color: #f0abfc;
}
th[data-menu] {
  position: relative;
  cursor: pointer;
  user-select: none;
  padding-right: 34px;
}
th[data-menu]:hover {
  color: var(--tx2);
}
th[data-menu]::after {
  content: "⌄";
  position: absolute;
  right: 9px;
  top: 50%;
  transform: translateY(-60%);
  font-size: 13px;
  opacity: .45;
}
th[data-menu].sorted::after {
  content: "▲";
  font-size: 8px;
  opacity: 1;
  color: var(--tx);
  transform: translateY(-50%);
}
th[data-menu].sorted.desc::after {
  content: "▼";
}
th[data-menu].filtered {
  color: var(--acc);
}
th[data-menu].filtered::before {
  content: "●";
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-55%);
  font-size: 8px;
  color: var(--acc);
}
.fmenu {
  position: fixed;
  z-index: 60;
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 9px;
  padding: 9px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .5);
  width: 270px;
  display: none;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}
.fmenu.open {
  display: block;
}
.fmenu input[type=text] {
  width: 100%;
  padding: 6px 9px;
  border-radius: 7px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  color: var(--tx);
  font: inherit;
  font-size: 12.5px;
  text-transform: none;
  letter-spacing: 0;
}
.fmenu input[type=text]:focus {
  outline: none;
  border-color: var(--acc);
}
.fmenu .fhint {
  color: var(--tx3);
  font-size: 10.5px;
  margin-top: 7px;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  line-height: 1.45;
}
.fsort {
  display: flex;
  gap: 6px;
  margin-bottom: 8px;
}
.fsort button {
  flex: 1;
  padding: 5px 0;
  border-radius: 7px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  color: var(--tx2);
  font: inherit;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: 0;
  text-transform: none;
}
.fsort button:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.fsort button.on {
  border-color: var(--acc);
  background: var(--panel-hi);
  color: var(--tx);
}
.facts {
  display: flex;
  gap: 9px;
  align-items: center;
  margin: 8px 1px 5px;
  font-size: 11px;
  color: var(--tx3);
  font-weight: 400;
}
.facts button {
  background: none;
  border: 0;
  color: var(--acc);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  padding: 0;
  text-transform: none;
  letter-spacing: 0;
}
.facts button:hover {
  text-decoration: underline;
}
.facts .fsel {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
}
.flist {
  max-height: 252px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-top: 1px solid var(--line);
  padding-top: 5px;
}
.flist label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 5px;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 400;
  color: var(--tx2);
  cursor: pointer;
}
.flist label:hover {
  background: var(--panel-hi);
}
.flist label.zero {
  opacity: .42;
}
.flist input[type=checkbox] {
  margin: 0;
  flex: none;
  accent-color: var(--acc);
}
.flist .fv {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.flist .fn {
  font-variant-numeric: tabular-nums;
  font-size: 11px;
  color: var(--tx3);
}
.flist .fnone {
  color: var(--tx3);
  font-size: 11.5px;
  padding: 4px 5px;
}
.colswrap {
  position: relative;
  display: inline-block;
}
.colsbtn.on {
  border-color: var(--acc);
  color: var(--tx);
}
.colspanel {
  position: absolute;
  z-index: 60;
  top: calc(100% + 6px);
  left: 0;
  width: 268px;
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 9px;
  padding: 9px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .5);
  display: none;
}
.colspanel.open {
  display: block;
}
.colslist {
  max-height: 340px;
  overflow-y: auto;
}
.colsit {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 3px 4px;
  border-radius: 6px;
  font-size: 12.5px;
  color: var(--tx2);
}
.colsit:hover {
  background: var(--panel-hi);
}
.colsit.drag {
  opacity: .45;
}
.colsit.over {
  box-shadow: inset 0 2px 0 var(--acc);
}
.colsit .gr {
  cursor: grab;
  color: var(--tx3);
  font-size: 12px;
  flex: none;
  line-height: 1;
}
.colsit .nm {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.colsit input[type=checkbox] {
  margin: 0;
  flex: none;
  accent-color: var(--acc);
}
.colsit .mv {
  background: none;
  border: 0;
  color: var(--tx3);
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  padding: 0 1px;
  line-height: 1;
}
.colsit .mv:hover {
  color: var(--tx);
}
.colsit .mv[disabled] {
  opacity: .25;
  cursor: default;
}
.colsacts {
  display: flex;
  gap: 9px;
  align-items: center;
  margin: 2px 1px 7px;
  font-size: 11px;
  color: var(--tx3);
}
.colsacts button {
  background: none;
  border: 0;
  color: var(--acc);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  padding: 0;
}
.colsacts button:hover {
  text-decoration: underline;
}
.colshint {
  color: var(--tx3);
  font-size: 10.5px;
  margin-top: 7px;
  line-height: 1.45;
  border-top: 1px solid var(--line);
  padding-top: 6px;
}
.ftxt {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 7px;
  padding: 4px 7px;
  border-radius: 7px;
  background: var(--panel-hi);
  border: 1px solid var(--line2);
  font-size: 11.5px;
  color: var(--acc);
  font-weight: 400;
}
.ftxt span {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ftxt button {
  background: none;
  border: 0;
  color: var(--tx3);
  cursor: pointer;
  font: inherit;
  padding: 0 2px;
}
.ftxt button:hover {
  color: var(--tx);
}
.ico2d {
  display: inline-block;
  width: 38px;
  height: auto;
  vertical-align: middle;
}
.ico2d.big {
  width: 64px;
}
.fabwrap {
  margin: 6px 0 14px;
  padding: 0;
  overflow-x: auto;
}
.fabmap {
  display: block;
  width: 100%;
  min-width: 760px;
  height: auto;
}
.fabmap a {
  cursor: pointer;
}
.fabmap .fm-off {
  display: none;
}
.fabmap .fm-sto,
.fabmap .fm-fab {
  cursor: pointer;
}
.fabmap .fm-sto:hover,
.fabmap .fm-fab:hover {
  opacity: .85;
}
.fabmap .fm-fab.fm-on {
  filter: drop-shadow(0 0 6px rgba(56, 189, 248, .45));
}
.fabmap {
  transition: none;
}
.fabhint {
  color: var(--tx3);
  font-size: 11.5px;
  margin: 2px 0 0;
}
.env {
  border: 1px solid var(--line);
  border-radius: 14px;
  margin-bottom: 14px;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      var(--panel) 0%,
      var(--bg2) 100%);
}
.env.crit {
  border-color: rgba(248, 113, 113, .45);
}
.env.warn {
  border-color: rgba(251, 191, 36, .4);
}
.envhead {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 16px 18px;
  background: none;
  border: 0;
  color: var(--tx);
  font: inherit;
  cursor: pointer;
  text-align: left;
}
.envhead:hover {
  background: rgba(255, 255, 255, .02);
}
.envdot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: 0 0 10px;
  background: var(--ok);
  box-shadow: 0 0 12px var(--ok);
}
.env.crit .envdot {
  background: var(--crit);
  box-shadow: 0 0 12px var(--crit);
}
.env.warn .envdot {
  background: var(--warn);
  box-shadow: 0 0 12px var(--warn);
}
.envtitle {
  flex: 1;
  font-size: 17px;
  font-weight: 660;
  letter-spacing: -.01em;
}
.envtitle small {
  display: block;
  color: var(--tx3);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  margin-top: 2px;
}
.marchio {
  margin-left: 10px;
  color: var(--tx2);
  display: inline-block;
  vertical-align: middle;
}
.marchio .marchiosvg {
  width: auto;
  display: block;
}
.marchio .marchiosvg.colore {
  color: inherit;
}
.brandhead {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 2px 0 14px;
}
.brandhead .marchio {
  margin-left: 0;
  color: var(--tx);
}
.brandhead .nome {
  font-size: 19px;
  font-weight: 650;
  letter-spacing: -.01em;
}
.brandhead .sep {
  width: 1px;
  height: 22px;
  background: var(--line2);
  flex: none;
  margin: 0 4px;
}
.gest {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.gest .marchiosvg {
  width: auto;
  display: block;
  flex: none;
}
.sezmarca {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  padding-left: 11px;
  border-left: 1px solid var(--line2);
  margin-left: 2px;
}
.sezmarca .marchiosvg {
  width: auto;
  display: block;
  flex: none;
}
details.sez > summary .ic {
  width: 15px;
  height: 15px;
  flex: none;
  color: var(--tx3);
}
details.sez > summary:hover .ic {
  color: inherit;
}
details.sez > summary .marchiosvg {
  width: auto;
  display: block;
  flex: none;
}
.prodrow {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 14px;
}
.prodtile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 230px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  color: var(--tx);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.prodtile:hover {
  border-color: var(--acc);
}
.prodtile:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.prodmark {
  display: flex;
  align-items: center;
  min-height: 30px;
}
.prodmark .marchio {
  margin-left: 0;
}
.prodnome {
  font-size: 16px;
  font-weight: 660;
  letter-spacing: -.01em;
}
.prodmeta {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--tx3);
  font-size: 12px;
}
.prodstat {
  display: flex;
  gap: 6px;
}
.sysdlg {
  width: min(1180px, 94vw);
  max-width: 100%;
  max-height: 90vh;
  max-height: 90dvh;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line2);
  border-radius: 16px;
  background: var(--panel);
  color: var(--tx);
}
.sysdlg:not([open]) {
  display: none;
}
.sysdlg::backdrop {
  background: rgba(3, 7, 18, .62);
}
@media (prefers-reduced-motion:no-preference) {
  .sysdlg,
  .sysdlg::backdrop {
    transition:
      opacity .18s ease,
      transform .18s ease,
      overlay .18s allow-discrete,
      display .18s allow-discrete;
  }
  .sysdlg {
    opacity: 0;
    transform: translateY(10px) scale(.99);
  }
  .sysdlg[open] {
    opacity: 1;
    transform: none;
  }
  .sysdlg::backdrop {
    opacity: 0;
  }
  .sysdlg[open]::backdrop {
    opacity: 1;
  }
  @starting-style {
    .sysdlg[open] {
      opacity: 0;
      transform: translateY(10px) scale(.99);
    }
    .sysdlg[open]::backdrop {
      opacity: 0;
    }
  }
}
.sysdlghead {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  flex: 0 0 auto;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.sysdlghead .envtitle {
  min-width: 0;
}
.sysdlgbody {
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.sysdlgx {
  background: none;
  border: 1px solid var(--line2);
  border-radius: 9px;
  color: var(--tx3);
  font-size: 15px;
  line-height: 1;
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 auto;
  cursor: pointer;
}
.sysdlgx:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.sysdlgx:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.sysdlg .envbody {
  padding: 6px 18px 18px;
}
html.dlgaperta,
html.dlgaperta body {
  overflow: hidden;
}
html.dlgaperta body {
  position: fixed;
  width: 100%;
}
.envtitle small a.mono {
  color: inherit;
  border-bottom: 1px dotted var(--line2);
}
.envtitle small a.mono:hover {
  color: var(--acc);
  border-bottom-color: var(--acc);
}
.envtitlelink {
  color: inherit;
  text-decoration: none;
}
.envtitlelink:hover {
  color: var(--acc);
}
.stosysname a {
  color: inherit;
  text-decoration: none;
}
.stosysname a:hover {
  color: var(--acc);
}
.compchip {
  background: none;
  font: inherit;
  cursor: pointer;
}
.compchip.on {
  border-color: var(--acc);
  color: var(--acc);
  box-shadow: 0 0 0 1px var(--acc) inset;
}
.complink {
  background: none;
  border: 0;
  padding: 0;
  color: var(--tx);
  cursor: pointer;
  text-align: left;
}
.complink:hover {
  color: var(--acc);
}
.ldval-wide {
  flex: 0 0 84px;
}
.sysblocco + .sysblocco {
  border-top: 1px solid var(--line);
  margin-top: 6px;
}
.sysblhead {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px 2px;
  flex-wrap: wrap;
}
.sysblhead .envtitle {
  font-size: 15px;
  min-width: 0;
}
@media (max-width:720px) {
  .prodtile {
    min-width: 0;
    flex: 1 1 100%;
    padding: 14px;
  }
  .sysdlg {
    width: 100%;
    max-width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    border: 0;
    border-radius: 0;
  }
  .sysdlghead {
    padding: 12px 14px;
    gap: 10px;
    padding-top: calc(12px + env(safe-area-inset-top));
  }
  .sysdlgbody {
    padding-bottom: env(safe-area-inset-bottom);
  }
  .sysdlg .envbody {
    padding: 6px 14px 18px;
  }
  .sysblhead {
    padding: 12px 14px 2px;
    gap: 10px;
  }
  .sysdlg .row2,
  .sysdlg .sysmap {
    grid-template-columns: 1fr;
  }
  @media (prefers-reduced-motion:no-preference) {
    .sysdlg {
      transform: translateY(100%);
    }
    @starting-style {
      .sysdlg[open] {
        transform: translateY(100%);
      }
    }
  }
}
.envstat {
  display: flex;
  gap: 7px;
}
.envchev {
  color: var(--tx3);
  font-size: 17px;
  transition: transform .2s;
}
.env.open .envchev {
  transform: rotate(180deg);
}
.envbody {
  display: none;
  padding: 0 18px 18px;
}
.env.open .envbody {
  display: block;
}
.sys {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.sys.crit {
  border-left: 3px solid var(--crit);
}
.sys.warn {
  border-left: 3px solid var(--warn);
}
.sys.ok {
  border-left: 3px solid var(--ok);
}
.syshead {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.plat {
  background:
    linear-gradient(
      135deg,
      #0ea5e9,
      #2563eb);
  color: #fff;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .1em;
  padding: 3px 9px;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(37, 99, 235, .4);
}
.sysname {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--tx);
}
.sysdesc {
  color: var(--tx2);
  font-size: 12.5px;
}
.syscount {
  margin-left: auto;
  font-size: 12px;
}
.ic {
  width: 17px;
  height: 17px;
  display: block;
}
.nico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  flex: 0 0 32px;
  background: var(--panel-hi);
  color: var(--tx2);
}
.nico.r-db {
  background: rgba(52, 211, 153, .14);
  color: #6ee7b7;
}
.nico.r-app {
  background: rgba(56, 189, 248, .14);
  color: #7dd3fc;
}
.nico.r-frontend {
  background: rgba(251, 191, 36, .14);
  color: #fcd34d;
}
.nico.r-mgmt {
  background: rgba(167, 139, 250, .14);
  color: #c4b5fd;
}
.nico.r-storage {
  background: rgba(45, 212, 191, .14);
  color: #5eead4;
}
.nico.r-net {
  background: rgba(148, 163, 184, .14);
  color: #cbd5e1;
}
.nico.r-infra {
  background: rgba(244, 114, 182, .14);
  color: #f9a8d4;
}
.ntext {
  min-width: 0;
  flex: 1;
}
.flow {
  display: flex;
  align-items: stretch;
  gap: 0;
  overflow-x: auto;
  padding-bottom: 4px;
}
.col {
  min-width: 186px;
  flex: 1;
}
.colname {
  color: var(--tx3);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 700;
  margin-bottom: 9px;
  text-align: center;
}
.arrow {
  width: 34px;
  flex: 0 0 34px;
  position: relative;
  align-self: center;
  height: 2px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--line2));
  margin-top: 14px;
}
.arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: -4px;
  border: 5px solid transparent;
  border-left-color: var(--line2);
}
.node {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px 11px;
  margin-bottom: 7px;
  transition: all .13s;
}
.node:hover {
  border-color: var(--acc);
  transform: translateY(-1px);
}
.node.ok {
  box-shadow: inset 3px 0 0 var(--ok);
}
.node.crit {
  box-shadow: inset 3px 0 0 var(--crit);
}
.node.warn {
  box-shadow: inset 3px 0 0 var(--warn);
}
.node.unk {
  box-shadow: inset 3px 0 0 var(--unk);
}
.nname {
  display: block;
  font-size: 12px;
  word-break: break-all;
  font-weight: 600;
}
.nrole {
  display: block;
  color: var(--tx3);
  font-size: 10.5px;
  margin-top: 3px;
}
.nrole i {
  opacity: .7;
  font-style: normal;
}
.syslinks {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid var(--line);
}
.linkpill {
  background: var(--panel-hi);
  border: 1px solid var(--line2);
  border-radius: 99px;
  padding: 3px 11px;
  font-size: 11.5px;
  color: var(--tx2);
}
.linkpill b {
  color: var(--tx);
  font-family:
    ui-monospace,
    Menlo,
    monospace;
  font-weight: 600;
}
.editbox {
  margin-top: 22px;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--panel);
  padding: 13px 16px;
}
.editbox summary {
  cursor: pointer;
  color: var(--tx2);
  font-size: 13.5px;
  font-weight: 600;
}
.editbox summary:hover {
  color: var(--tx);
}
.linkrow {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  font-size: 12px;
  border-bottom: 1px solid var(--line);
}
.linkrow button {
  margin-left: auto;
  padding: 2px 8px;
}
.frm label {
  display: block;
  font-size: 11px;
  color: var(--tx3);
  margin: 11px 0 4px;
  text-transform: uppercase;
  letter-spacing: .07em;
  font-weight: 600;
}
.frm input,
.frm select {
  width: 100%;
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  color: var(--tx);
  font: inherit;
  font-size: 13px;
}
.frm input:focus,
.frm select:focus {
  outline: none;
  border-color: var(--acc);
}
.frm .btn {
  margin-top: 16px;
  padding: 9px;
}
.frow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.stosys {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 17px 19px 20px;
  margin-bottom: 16px;
  background:
    linear-gradient(
      180deg,
      var(--panel) 0%,
      var(--bg2) 100%);
}
details.stosys:not([open]) {
  padding-bottom: 17px;
}
.stohead {
  display: flex;
  align-items: center;
  gap: 13px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
summary.stohead {
  list-style: none;
  cursor: pointer;
  user-select: none;
  margin-bottom: 0;
}
summary.stohead::-webkit-details-marker {
  display: none;
}
summary.stohead::after {
  content: "▸";
  color: var(--tx3);
  font-size: 12px;
  margin-left: 2px;
  transition: transform .12s;
  flex: none;
}
details.stosys[open] > summary.stohead {
  margin-bottom: 6px;
}
details.stosys[open] > summary.stohead::after {
  transform: rotate(90deg);
}
summary.stohead:hover .stotitle {
  color: var(--acc);
}
summary.stohead .stotitle a {
  position: relative;
  z-index: 1;
}
details.stosys.nofold > summary.stohead {
  cursor: default;
  pointer-events: none;
}
details.stosys.nofold > summary.stohead a {
  pointer-events: auto;
}
details.stosys.nofold > summary.stohead::after {
  display: none;
}
details.stosys.nofold > summary.stohead:hover .stotitle {
  color: inherit;
}
.stoacts {
  display: flex;
  gap: 14px;
  margin: 0 0 12px;
}
.stoacts button {
  background: none;
  border: 0;
  color: var(--acc);
  font: inherit;
  font-size: 11.5px;
  cursor: pointer;
  padding: 0;
}
.stoacts button:hover {
  text-decoration: underline;
}
.stohead .envdot {
  background: var(--ok);
  box-shadow: 0 0 12px var(--ok);
}
.stohead .envdot.warn {
  background: var(--warn);
  box-shadow: 0 0 12px var(--warn);
}
.stohead .envdot.crit {
  background: var(--crit);
  box-shadow: 0 0 12px var(--crit);
}
.stohead .envdot.unk {
  background: var(--unk);
  box-shadow: 0 0 12px var(--unk);
}
.stotitle {
  flex: 1;
  min-width: 180px;
  font-size: 16px;
  font-weight: 660;
  letter-spacing: -.01em;
}
.stotitle a {
  text-decoration: none;
}
.stotitle a:hover {
  color: var(--acc);
}
.stotitle small {
  display: block;
  color: var(--tx3);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  margin-top: 2px;
}
.stostat {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.stocap {
  width: 200px;
  flex: none;
}
.stocapn {
  display: flex;
  align-items: baseline;
  gap: 7px;
  font-size: 11.5px;
  margin-bottom: 4px;
}
.stocapn .pct {
  font-size: 12.5px;
}
.stocap .bar {
  margin: 0;
}
@media (max-width:720px) {
  .stocap {
    width: 100%;
    order: 3;
  }
}
.stokpi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(122px, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.stokpi .kpi {
  padding: 10px 12px;
}
h3.stosec {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--tx3);
  font-weight: 700;
  margin: 20px 0 8px;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
h3.stosec .cnt {
  color: var(--tx3);
  font-weight: 500;
  font-size: 11.5px;
  text-transform: none;
  letter-spacing: 0;
}
.kvline {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 13px;
  font-size: 11.5px;
  color: var(--tx3);
  margin-top: 3px;
}
.kvline b {
  color: var(--tx2);
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.tabs {
  display: flex;
  gap: 3px;
  border-bottom: 1px solid var(--line);
  margin: 18px 0 4px;
}
.tabs a {
  padding: 8px 15px;
  color: var(--tx2);
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 550;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color .13s, border-color .13s;
}
.tabs a:hover {
  color: var(--tx);
}
.tabs a.on {
  color: var(--acc);
  border-bottom-color: var(--acc);
}
.row2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 13px;
  margin-top: 14px;
}
.chartcol {
  display: grid;
  grid-template-columns: 1fr;
  gap: 13px;
  margin-top: 14px;
}
.row3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(275px, 1fr));
  gap: 13px;
}
.cardtitle {
  color: var(--tx3);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 700;
  margin-bottom: 13px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.cardtitle .cnt {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  font-size: 11.5px;
}
.donutrow {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.legend {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 12.5px;
}
.legend li {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 3.5px 0;
  color: var(--tx2);
}
.legend li b {
  color: var(--tx);
  margin-left: auto;
  padding-left: 14px;
  font-variant-numeric: tabular-nums;
}
.legend i {
  width: 9px;
  height: 9px;
  border-radius: 2.5px;
  flex: 0 0 9px;
}
.legend.inline {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-top: 11px;
}
.legend.inline li {
  padding: 0;
}
.legend.inline li b {
  margin-left: 0;
}
.chartcard {
  padding: 16px 18px 13px;
}
.chartcard .legend.inline li,
.fsv .legend.inline li,
.fsv svg .ser {
  cursor: pointer;
}
.chartcard svg .ser,
.fsv svg .ser {
  transition: opacity .12s;
}
.chartcard.iso svg .ser,
.fsv.iso svg .ser {
  opacity: .12;
}
.chartcard.iso svg .ser.on,
.fsv.iso svg .ser.on {
  opacity: 1;
}
.chartcard.iso .legend.inline li,
.fsv.iso .legend.inline li {
  opacity: .4;
}
.chartcard.iso .legend.inline li.on,
.fsv.iso .legend.inline li.on {
  opacity: 1;
  font-weight: 650;
}
.chartcard .isohint {
  display: none;
  font-size: 11.5px;
  color: var(--tx3);
  margin-top: 8px;
}
.chartcard.iso .isohint {
  display: block;
}
.chart {
  width: 100%;
  height: auto;
  display: block;
}
.chart .tk2 {
  display: none;
}
.fsv .chart .tk2 {
  display: inline;
}
.chartcard {
  position: relative;
}
.chartcard .chart {
  cursor: zoom-in;
}
.zoomhint {
  position: absolute;
  top: 11px;
  right: 12px;
  background: none;
  border: 0;
  padding: 2px 5px;
  color: var(--tx3);
  font: inherit;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
  opacity: .7;
  border-radius: 6px;
}
.zoomhint:hover {
  opacity: 1;
  color: var(--acc);
  background: var(--panel-hi);
}
.cross {
  position: absolute;
  z-index: 6;
  pointer-events: none;
  background: var(--bg2);
  border: 1px solid var(--line2);
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 12px;
  color: var(--tx);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
  white-space: nowrap;
  transform: translateX(-50%);
}
.cross .t {
  color: var(--tx3);
  font-size: 11px;
  margin-bottom: 5px;
  font-variant-numeric: tabular-nums;
}
.cross .r {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 1.5px 0;
}
.cross .r i {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  flex: 0 0 8px;
}
.cross .r b {
  margin-left: auto;
  padding-left: 16px;
  font-variant-numeric: tabular-nums;
}
.cross .r em {
  margin-left: auto;
  padding-left: 16px;
  font-style: normal;
  color: var(--tx3);
  font-size: 11px;
}
.cross .r b + em {
  margin-left: 0;
  padding-left: 7px;
}
.fsv {
  position: fixed;
  inset: 0;
  z-index: 120;
  background: rgba(7, 11, 22, .94);
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 20px 20px;
}
.fsv .fsbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.fsv .fstitle {
  font-size: 15px;
  font-weight: 700;
}
.fsv .fsrange {
  color: var(--tx2);
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
}
.fsv .fsspin {
  color: var(--acc);
  font-size: 12px;
  display: none;
}
.fsv.load .fsspin {
  display: inline;
}
.fsv .fsbtns {
  margin-left: auto;
  display: flex;
  gap: 6px;
}
.fsv .fsbtns button {
  padding: 5px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--tx2);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
}
.fsv .fsbtns button:hover:not(:disabled) {
  border-color: var(--line2);
  color: var(--tx);
}
.fsv .fsbtns button:disabled {
  opacity: .35;
  cursor: default;
}
.fsv .fsbody {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 14px 16px;
}
.fsv .fsbody .chart {
  cursor: crosshair;
  touch-action: none;
  max-height: calc(100vh - 210px);
}
.fsv .fsmsg {
  color: var(--tx2);
  font-size: 13px;
  margin: 0;
  text-align: center;
  max-width: 52ch;
}
.fsv .fslegend {
  margin: 0;
  justify-content: center;
}
.fsv .fshint {
  color: var(--tx3);
  font-size: 11.5px;
  text-align: center;
}
.fsv .fssel {
  position: absolute;
  top: 14px;
  bottom: 14px;
  background: rgba(56, 189, 248, .16);
  border-left: 1px solid var(--acc);
  border-right: 1px solid var(--acc);
  pointer-events: none;
  display: none;
}
body.fsopen {
  overflow: hidden;
}
@media (max-width:700px) {
  .fsv {
    padding: 12px;
  }
  .fsv .fsbtns {
    width: 100%;
    margin-left: 0;
  }
}
.topl {
  list-style: none;
  margin: 0;
  padding: 0;
}
.topl li {
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
}
.topl li:last-child {
  border-bottom: 0;
}
.tl-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
}
.tl-head a {
  text-decoration: none;
  font-size: 12.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tl-head a:hover {
  color: var(--acc);
}
.tl-sub {
  color: var(--tx3);
  font-size: 11px;
  margin-top: 1px;
}
.topl .bar {
  margin-top: 5px;
}
.probs {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 12.5px;
}
.probs li {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
}
.probs li:last-child {
  border-bottom: 0;
}
.probs a {
  text-decoration: none;
  flex: 0 0 auto;
}
.probs a:hover {
  color: var(--acc);
}
.probs .svc {
  color: var(--tx2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}
.osl {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
}
.osl li {
  border-bottom: 1px solid var(--line);
}
.osl li:last-child {
  border-bottom: 0;
}
.osl li a {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 6.5px 0;
  color: var(--tx);
  text-decoration: none;
}
.osl li a:hover {
  color: var(--acc);
}
.osl li a:hover .dim {
  color: var(--acc);
}
.osl li b {
  font-variant-numeric: tabular-nums;
}
.ranges {
  display: flex;
  gap: 5px;
  margin: 0 0 13px;
  flex-wrap: wrap;
}
.ranges a {
  padding: 4.5px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--tx2);
  text-decoration: none;
  font-size: 12.5px;
  font-weight: 550;
  background: var(--panel);
  transition: all .13s;
}
.ranges a:hover {
  border-color: var(--line2);
  color: var(--tx);
}
.ranges a.on {
  background: var(--acc);
  border-color: var(--acc);
  color: #04263a;
  font-weight: 700;
}
.ranges .comprange {
  padding: 4.5px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--tx2);
  font-size: 12.5px;
  font-weight: 550;
  background: var(--panel);
  cursor: pointer;
  transition: all .13s;
}
.ranges .comprange:hover {
  border-color: var(--line2);
  color: var(--tx);
}
.ranges .comprange.on {
  background: var(--acc);
  border-color: var(--acc);
  color: #04263a;
  font-weight: 700;
}
.more {
  display: inline-block;
  margin-top: 11px;
  color: var(--acc);
  text-decoration: none;
  font-size: 12.5px;
  font-weight: 600;
}
.more:hover {
  text-decoration: underline;
}
.pwa {
  position: fixed;
  left: 10px;
  right: 10px;
  bottom: 10px;
  z-index: 60;
  display: none;
  align-items: center;
  gap: 11px;
  background: var(--panel-hi);
  border: 1px solid var(--line2);
  border-radius: 14px;
  padding: 11px 12px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .5);
}
.pwa.on {
  display: flex;
}
.pwa img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex: 0 0 40px;
}
.pwa .txt {
  flex: 1;
  min-width: 0;
}
.pwa .txt b {
  display: block;
  font-size: 13.5px;
}
.pwa .txt span {
  display: block;
  color: var(--tx2);
  font-size: 12px;
  margin-top: 2px;
}
.pwa .go {
  background: var(--acc);
  color: #04263a;
  border: 0;
  border-radius: 9px;
  padding: 8px 14px;
  font-weight: 700;
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
}
.pwa .no {
  background: none;
  border: 0;
  color: var(--tx3);
  font-size: 19px;
  line-height: 1;
  padding: 4px 3px;
  cursor: pointer;
  font-family: inherit;
}
.pwa .no:hover {
  color: var(--tx2);
}
@media (min-width:821px) {
  .pwa.on {
    display: none;
  }
}
.rel {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 760px;
}
.relbox {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 16px 18px;
}
.relhead {
  display: flex;
  align-items: baseline;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.relver {
  font-size: 16px;
  font-weight: 700;
  color: var(--acc);
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
}
.reldate {
  color: var(--tx3);
  font-size: 12.5px;
}
.relbody {
  font-size: 13.5px;
  line-height: 1.62;
  color: var(--tx2);
}
.relbody p {
  margin: 0 0 10px;
}
.relbody p:last-child {
  margin-bottom: 0;
}
.relbody b {
  color: var(--tx);
  font-weight: 650;
}
.relbody ul {
  margin: 0 0 10px;
  padding-left: 20px;
}
.relbody li {
  margin-bottom: 3px;
}
.relbody code {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 12.5px;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 1px 5px;
  color: var(--tx);
}
.relbody pre {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 11px 13px;
  overflow: auto;
  margin: 0 0 10px;
}
.relbody pre code {
  background: none;
  border: 0;
  padding: 0;
  font-size: 12.5px;
}
@media (max-width:820px) {
  .gsearch {
    flex: 1 1 100%;
    max-width: none;
  }
  .shell {
    flex-direction: column;
  }
  .side {
    width: auto;
    flex: none;
    height: auto;
    position: static;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .side .foot {
    position: static;
  }
  .nav {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }
  .main {
    padding: 20px 16px 44px;
  }
  .sidetgl {
    display: none;
  }
  html.sidechiusa .side {
    width: auto;
    flex: none;
    padding: 20px 14px;
  }
  html.sidechiusa .brand {
    padding: 2px 6px 0;
  }
  html.sidechiusa .brand img.logo {
    display: block;
  }
  html.sidechiusa .brand img.mark {
    display: none;
  }
  html.sidechiusa .prod,
  html.sidechiusa .ver,
  html.sidechiusa .navlabel,
  html.sidechiusa .side .foot .who {
    display: block;
  }
  html.sidechiusa .nav a {
    justify-content: flex-start;
    padding: 8px 10px;
  }
  html.sidechiusa .nav a .ico,
  html.sidechiusa .nav a .nm {
    display: inline;
  }
  html.sidechiusa .nav a .ini {
    display: none;
  }
  html.sidechiusa .side .foot {
    text-align: left;
  }
}
:root {
  --bg:#080d17;
  --bg2:#0c1322;
  --panel:#101a2c;
  --panel2:#16223a;
  --panel-hi:#1a2740;
  --line:#1e2b42;
  --line2:#2b3a58;
  --tx:#e9eef8;
  --tx2:#9db0cf;
  --tx3:#697a9b;
  --ok:#33cf8b;
  --warn:#f0b429;
  --crit:#f76b6b;
  --unk:#9b8cf5;
  --acc:#35a9e8;
  --okbg:rgba(51,207,139,.14);
  --warnbg:rgba(240,180,41,.14);
  --critbg:rgba(247,107,107,.14);
  --unkbg:rgba(155,140,245,.16);
  --accbg:rgba(53,169,232,.14);
  --neubg:rgba(255,255,255,.05);
  --brandchip:#0a1020;
  --shadow:0 14px 38px rgba(0,0,0,.5);
  --r:12px;
  --rowpy:5px;
}
:root[data-theme=light] {
  --bg:#f2f5fa;
  --bg2:#e9eef6;
  --panel:#fff;
  --panel2:#f4f7fc;
  --panel-hi:#eaf1fa;
  --line:#dce3ef;
  --line2:#c3cfe2;
  --tx:#0e1729;
  --tx2:#4c5b78;
  --tx3:#78879f;
  --ok:#0b8f5a;
  --warn:#a06c00;
  --crit:#cf3535;
  --unk:#5b46c9;
  --acc:#0a6fbd;
  --okbg:rgba(11,143,90,.10);
  --warnbg:rgba(160,108,0,.12);
  --critbg:rgba(207,53,53,.10);
  --unkbg:rgba(91,70,201,.10);
  --accbg:rgba(10,111,189,.10);
  --neubg:rgba(14,23,41,.045);
  --shadow:0 10px 26px rgba(14,23,41,.12);
}
:root[data-dens=normale] {
  --rowpy:8px ;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
}
body {
  background: var(--bg);
  color: var(--tx);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  font:
    13px/1.5 "IBM Plex Sans",
    system-ui,
    -apple-system,
    "Segoe UI",
    sans-serif;
}
:root[data-dens=normale] body {
  font-size: 14px;
}
a {
  color: var(--acc);
  text-decoration: none;
}
a:hover {
  color: var(--tx);
}
.mono {
  font-family:
    "IBM Plex Mono",
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: .92em;
}
::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}
::-webkit-scrollbar-thumb {
  background: var(--line2);
  border-radius: 99px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
.top {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  gap: 14px;
  height: 54px;
  padding: 0 16px;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
}
.top .brand {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
  padding: 5px 10px;
  border-radius: 9px;
  background: var(--brandchip);
}
.top .brand img {
  height: 20px;
  width: auto;
  display: block;
}
.top .prod {
  flex: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  color: var(--tx3);
  white-space: nowrap;
}
.top .who {
  text-align: right;
  line-height: 1.25;
}
.top .who b {
  display: block;
  font-size: 12px;
  font-weight: 600;
}
.top .who span {
  display: block;
  font-size: 10px;
  color: var(--tx3);
}
.iconbtn {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  border: 1px solid var(--line2);
  background: var(--panel2);
  color: var(--tx2);
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
}
.iconbtn:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.cliswitch {
  position: relative;
  flex: none;
}
.cliswitch > button {
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: 250px;
  padding: 6px 11px;
  border-radius: 9px;
  border: 1px solid var(--line2);
  background: var(--panel2);
  color: var(--tx);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.cliswitch .menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  width: 280px;
  z-index: 60;
  padding: 6px;
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 11px;
  box-shadow: var(--shadow);
}
.cliswitch .menu a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 9px;
  border-radius: 8px;
  color: var(--tx);
  font-size: 13px;
}
.cliswitch .menu a:hover,
.cliswitch .menu a.on {
  background: var(--panel-hi);
}
.gsearch {
  position: relative;
  flex: 1 1 420px;
  max-width: 520px;
  min-width: 160px;
  margin: 0;
}
.gsq {
  width: 100%;
  padding: 8px 11px 8px 30px;
  border-radius: 9px;
  border: 1px solid var(--line);
  background: var(--panel2);
  color: var(--tx);
  font: inherit;
  font-size: 13px;
}
.gsq:focus {
  outline: none;
  border-color: var(--acc);
  box-shadow: 0 0 0 3px var(--accbg);
}
.gsico {
  position: absolute;
  left: 11px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--tx3);
  font-size: 14px;
  pointer-events: none;
}
.gsres {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 60vh;
  overflow-y: auto;
  z-index: 60;
  padding: 5px;
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 11px;
  box-shadow: var(--shadow);
}
.gso {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 9px;
  border-radius: 8px;
  color: var(--tx);
}
.gso:hover,
.gso.on {
  background: var(--panel-hi);
}
.shell {
  display: flex;
  min-height: calc(100vh - 54px);
  align-items: stretch;
}
.side {
  flex: 0 0 212px;
  width: 212px;
  position: sticky;
  top: 54px;
  height: calc(100vh - 54px);
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border-right: 1px solid var(--line);
}
html.sidechiusa .side {
  flex-basis: 58px;
  width: 58px;
}
.navlabel {
  color: var(--tx3);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .11em;
  font-weight: 700;
  padding: 4px 9px 6px;
}
.nav {
  flex: 1;
  padding: 12px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nav a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 9px;
  border-radius: 9px;
  color: var(--tx2);
  font-size: 13px;
}
.nav a:hover {
  background: var(--panel2);
  color: var(--tx);
}
.nav a.on {
  background: var(--panel-hi);
  color: var(--tx);
  font-weight: 600;
  box-shadow: inset 2px 0 0 var(--acc);
}
.nav a .cnt {
  margin-left: auto;
  font-size: 10.5px;
  color: var(--tx3);
  font-variant-numeric: tabular-nums;
}
html.sidechiusa .nav a {
  justify-content: center;
}
html.sidechiusa .nav a .nm,
html.sidechiusa .nav a .cnt,
html.sidechiusa .navlabel {
  display: none;
}
.side .foot {
  padding: 10px 8px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.linkbtn {
  background: none;
  border: 1px solid var(--line2);
  color: var(--tx2);
  border-radius: 8px;
  padding: 6px 10px;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.linkbtn:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.main {
  flex: 1;
  min-width: 0;
  padding: 20px 24px 56px;
}
.wrap {
  max-width: 1360px;
  margin: 0 auto;
}
.crumb {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--tx3);
  font-size: 11.5px;
  margin-bottom: 5px;
}
h1 {
  margin: 0;
  font-size: 23px;
  font-weight: 600;
  letter-spacing: -.02em;
}
h1.mono {
  font-size: 21px;
}
.sub {
  color: var(--tx2);
  font-size: 12.5px;
  margin: 5px 0 0;
}
.fresh {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 11px;
  border-radius: 9px;
  background: var(--panel);
  border: 1px solid var(--line);
  color: var(--tx2);
  font-size: 11.5px;
}
.fresh::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ok);
}
.clilogo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--line2);
  border-radius: 9px;
  padding: 6px 10px;
  flex: none;
}
.clilogo img {
  display: block;
  height: 22px;
  width: auto;
  max-width: 170px;
  object-fit: contain;
}
h2 {
  font-size: 14px;
  margin: 22px 0 9px;
  font-weight: 600;
  letter-spacing: -.01em;
  display: flex;
  align-items: baseline;
  gap: 9px;
}
h2 .cnt {
  color: var(--tx3);
  font-weight: 400;
  font-size: 11.5px;
}
.tabswrap {
  position: relative;
  margin: 16px 0 2px;
}
.tabswrap::after {
  content: "›";
  position: absolute;
  right: 2px;
  top: 9px;
  color: var(--tx3);
  font-size: 12px;
  pointer-events: none;
}
.tabs {
  display: flex;
  gap: 2px;
  overflow-x: auto;
  padding-right: 26px;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
.tabs::-webkit-scrollbar {
  display: none;
}
.tabs a {
  display: flex;
  align-items: center;
  padding: 8px 13px;
  margin-bottom: -1px;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  color: var(--tx2);
  font-size: 13px;
  font-weight: 500;
}
.tabs a:hover {
  color: var(--tx);
}
.tabs a.on {
  color: var(--tx);
  font-weight: 600;
  border-bottom-color: var(--acc);
}
.tabs a .n {
  margin-left: 6px;
  padding: 0 5px;
  border-radius: 99px;
  background: var(--critbg);
  color: var(--crit);
  font-size: 10px;
  font-weight: 700;
}
.kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(126px, 1fr));
  gap: 8px;
  margin: 16px 0 0;
}
.kpi {
  display: block;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  color: inherit;
  text-align: left;
}
a.kpi:hover {
  border-color: var(--acc);
}
.kpi .n {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.kpi .l {
  color: var(--tx3);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-top: 2px;
  line-height: 1.3;
}
.n.ok {
  color: var(--ok);
}
.n.warn {
  color: var(--warn);
}
.n.crit {
  color: var(--crit);
}
.n.unk {
  color: var(--unk);
}
.n.acc {
  color: var(--acc);
}
.n.dim {
  color: var(--tx3);
}
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 14px 16px;
}
.cardtitle {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--tx3);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 700;
}
.cardtitle .cnt {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  font-size: 11.5px;
}
.note {
  margin-top: 12px;
  padding: 11px 13px;
  border-radius: 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  color: var(--tx2);
  font-size: 12.5px;
  line-height: 1.5;
}
.note.warn {
  background: var(--warnbg);
  border-color: var(--line2);
}
.note.info {
  background: var(--accbg);
  border-color: var(--line2);
}
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 14px;
}
a.ccard {
  display: block;
  position: relative;
  overflow: hidden;
  padding: 15px 17px 13px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background:
    linear-gradient(
      180deg,
      var(--panel) 0%,
      var(--bg2) 130%);
  color: var(--tx);
}
a.ccard:hover {
  border-color: var(--acc);
}
a.ccard.sev-crit {
  border-color: color-mix(in oklab, var(--crit) 42%, var(--line));
}
.ccard .nm {
  font-size: 15.5px;
  font-weight: 650;
  letter-spacing: -.01em;
}
.ccard .meta {
  color: var(--tx3);
  font-size: 11px;
  margin-top: 1px;
}
.ring {
  position: relative;
  width: 58px;
  height: 58px;
  flex: none;
  border-radius: 50%;
}
.ring .hole {
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: var(--panel);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13.5px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}
.cstats {
  display: flex;
  gap: 16px;
  text-align: right;
  margin-left: auto;
}
.cstat b {
  display: block;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
.cstat span {
  display: block;
  color: var(--tx3);
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin-top: 1px;
}
.cbar {
  display: flex;
  height: 5px;
  border-radius: 99px;
  overflow: hidden;
  background: var(--line);
  margin-top: 14px;
}
.cbar i {
  display: block;
  height: 100%;
}
.cbar i.ok {
  background: var(--ok);
}
.cbar i.warn {
  background: var(--warn);
}
.cbar i.crit {
  background: var(--crit);
}
.cbar i.unk {
  background: var(--unk);
}
.csevs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 13px;
  margin-top: 9px;
  font-size: 11px;
  color: var(--tx2);
}
.csevs span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.csevs i {
  width: 7px;
  height: 7px;
  border-radius: 2px;
  flex: none;
}
.cempty {
  margin-top: 14px;
  padding: 16px 13px;
  border-radius: 10px;
  border: 1px dashed var(--line2);
  color: var(--tx3);
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}
.cnote {
  margin-top: 11px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
  color: var(--tx3);
  font-size: 11.5px;
  line-height: 1.45;
}
.envdot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex: none;
  background: var(--ok);
  box-shadow: 0 0 10px var(--ok);
}
.envdot.warn {
  background: var(--warn);
  box-shadow: 0 0 10px var(--warn);
}
.envdot.crit {
  background: var(--crit);
  box-shadow: 0 0 10px var(--crit);
}
.envdot.unk {
  background: var(--unk);
  box-shadow: 0 0 10px var(--unk);
}
.envdot.none {
  background: var(--line2);
  box-shadow: none;
}
.b {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 99px;
  font-size: 10.5px;
  font-weight: 700;
  white-space: nowrap;
}
.b.ok {
  background: var(--okbg);
  color: var(--ok);
}
.b.warn {
  background: var(--warnbg);
  color: var(--warn);
}
.b.crit {
  background: var(--critbg);
  color: var(--crit);
}
.b.unk {
  background: var(--unkbg);
  color: var(--unk);
}
.b.dism {
  background: var(--neubg);
  color: var(--tx3);
  border: 1px solid var(--line2);
}
.tag {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 5px;
  background: var(--neubg);
  color: var(--tx3);
  font-size: 10px;
  font-weight: 700;
}
.tag.warn {
  background: var(--warnbg);
  color: var(--warn);
}
.chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 1px 7px;
  border-radius: 6px;
  background: var(--neubg);
  border: 1px solid var(--line);
  color: var(--tx2);
  font-size: 10.5px;
  font-weight: 600;
}
.chip .osmark,
.chip .ic {
  width: 13px;
  height: 13px;
  flex: none;
}
.ruoli {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 16px 0 0;
}
.ruolo {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 11px 4px 9px;
  border-radius: 99px;
  font-size: 12px;
  font-weight: 600;
  cursor: help;
  border: 1px solid var(--line2);
  background: var(--neubg);
  color: var(--tx);
}
.ruolo .ic {
  width: 15px;
  height: 15px;
  flex: none;
}
.ruolo.r-db {
  background: var(--okbg);
  color: var(--ok);
}
.ruolo.r-app,
.ruolo.r-applicazione,
.ruolo.r-container {
  background: var(--accbg);
  color: var(--acc);
}
.ruolo.r-web,
.ruolo.r-sap {
  background: var(--warnbg);
  color: var(--warn);
}
.ruolo.r-monitor,
.ruolo.r-virt,
.ruolo.r-vcenter {
  background: var(--unkbg);
  color: var(--unk);
}
.ruolodesc {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 14px 0 0;
  font-size: 13.5px;
  line-height: 1.55;
  max-width: 80ch;
}
.ruolodesc .osbolla {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #eef1f7;
  border: 1px solid var(--line2);
  flex: none;
}
.ruolodesc .osmark {
  width: 20px;
  height: 20px;
}
.tbl {
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--panel);
  overflow: hidden;
}
.tbl .scroll {
  overflow-x: auto;
}
table {
  border-collapse: collapse;
  width: 100%;
  font-size: 12.5px;
}
th,
td {
  padding: var(--rowpy) 10px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid var(--line);
}
th {
  background: var(--bg2);
  color: var(--tx3);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  white-space: nowrap;
}
tbody tr:nth-child(even) {
  background: var(--panel2);
}
tbody tr:hover {
  background: var(--panel-hi);
}
tbody tr:last-child td {
  border-bottom: 0;
}
td a {
  color: var(--tx);
  font-weight: 600;
}
td a:hover {
  color: var(--acc);
}
.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.nw {
  white-space: nowrap;
}
.dim {
  color: var(--tx3);
}
.tools {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 9px;
}
.search {
  flex: 1;
  min-width: 180px;
  max-width: 320px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--tx);
  font: inherit;
  font-size: 12.5px;
}
.search:focus {
  outline: none;
  border-color: var(--acc);
}
.cats {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 0 10px;
}
.cat {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border-radius: 9px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--tx2);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
}
.cat.on {
  border-color: var(--acc);
  background: var(--panel-hi);
  color: var(--tx);
}
.cat::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: var(--line2);
}
.cat-win::before {
  background: #38bdf8;
}
.cat-lnx::before {
  background: #fbbf24;
}
.cat-vmw::before {
  background: #2dd4bf;
}
.cat-net::before {
  background: #a78bfa;
}
.cat-sto::before {
  background: #34d399;
}
.cat-fw::before {
  background: #f87171;
}
.cat-web::before {
  background: #22d3ee;
}
.cat-pwr::before {
  background: #f59e0b;
}
.cat-unix::before {
  background: #f472b6;
}
.cat-bck::before {
  background: #14b8a6;
}
.cat-prn::before {
  background: #cbd5e1;
}
.cat-app::before {
  background: #84cc16;
}
.cat-srv::before {
  background: #fb923c;
}
.cat-tape::before {
  background: #818cf8;
}
.cat-vtl::before {
  background: #e879f9;
}
.cat-dism::before {
  background: var(--line2);
}
.fmenu,
.colspanel {
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 10px;
  box-shadow: var(--shadow);
  padding: 9px;
}
.chartcard {
  position: relative;
  padding: 12px 14px 10px;
}
.chartbox {
  display: flex;
  gap: 8px;
}
.chartaxis {
  flex: none;
  width: 32px;
  height: 184px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: right;
  color: var(--tx3);
  font-size: 9.5px;
  font-variant-numeric: tabular-nums;
}
.chart {
  display: block;
  width: 100%;
  height: 184px;
}
.chart .grid {
  stroke: var(--line);
  stroke-width: 1;
  stroke-dasharray: 2 6;
}
.chart .ser {
  fill: none;
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-linecap: round;
  transition: opacity .12s;
}
.chart .area {
  opacity: .16;
}
.chartcard.iso .ser {
  opacity: .10;
}
.chartcard.iso .ser.on {
  opacity: 1;
}
.chartcard.iso .area {
  opacity: 0;
}
.chartcard.iso .area.on {
  opacity: .16;
}
.chartticks {
  display: flex;
  justify-content: space-between;
  color: var(--tx3);
  font-size: 9.5px;
  margin-top: 4px;
}
.legend {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  margin: 10px 0 0;
  padding: 0;
}
.legend li {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 3px 10px;
  border-radius: 99px;
  border: 1px solid var(--line);
  color: var(--tx2);
  font-size: 11.5px;
  cursor: pointer;
}
.legend li.on {
  border-color: currentColor;
  background: var(--panel2);
  font-weight: 600;
}
.legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: none;
}
.legend b {
  color: var(--tx);
  font-variant-numeric: tabular-nums;
}
.donutrow {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}
.donut {
  position: relative;
  width: 132px;
  height: 132px;
  flex: none;
  border-radius: 50%;
}
.donut .hole {
  position: absolute;
  inset: 19px;
  border-radius: 50%;
  background: var(--panel);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.donut .hole b {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.donut .hole span {
  color: var(--tx3);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
}
.topl {
  list-style: none;
  margin: 0;
  padding: 0;
}
.topl li {
  padding: 5px 0;
  border-bottom: 1px solid var(--line);
}
.topl li:last-child {
  border-bottom: 0;
}
.bar {
  height: 4px;
  border-radius: 99px;
  background: var(--line);
  overflow: hidden;
  margin-top: 4px;
}
.bar i {
  display: block;
  height: 100%;
}
.bar i.ok {
  background: var(--ok);
}
.bar i.warn {
  background: var(--warn);
}
.bar i.crit {
  background: var(--crit);
}
.bar i.unk {
  background: var(--line2);
}
.bar i.acc {
  background: var(--acc);
}
.tl-head .pname {
  font-size: 12.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pct {
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.pct.ok {
  color: var(--ok);
}
.pct.warn {
  color: var(--warn);
}
.pct.crit {
  color: var(--crit);
}
.pct.unk {
  color: var(--tx3);
}
table.cal th.d {
  padding: 6px 0 7px;
  text-align: center;
}
table.cal th.d i {
  display: block;
  font-style: normal;
  font-size: 8.5px;
  color: var(--tx3);
  text-transform: uppercase;
}
table.cal th.d b {
  display: block;
  font-size: 11px;
  color: var(--tx2);
  font-weight: 600;
}
table.cal th.d.today b {
  color: var(--acc);
}
table.cal td.c {
  padding: 3px 2px;
  text-align: center;
  width: 22px;
}
table.cal td.c i,
.callegend i.sw {
  display: block;
  width: 13px;
  height: 13px;
  border-radius: 4px;
  margin: 0 auto;
}
table.cal th.we,
table.cal td.we {
  background: var(--neubg);
}
.c.ok i,
.sw.ok {
  background: var(--ok);
}
.c.warn i,
.sw.warn {
  background: var(--warn);
}
.c.crit i,
.sw.crit {
  background: var(--crit);
}
.c.unk i,
.sw.unk {
  background: var(--unk);
}
.c.run i,
.sw.run {
  background: transparent;
  border: 2.5px solid var(--acc);
}
.c.miss i,
.sw.miss {
  background: transparent;
  border: 1.5px solid var(--crit);
}
.c.fut i,
.sw.fut {
  background: transparent;
  border: 1.5px solid var(--acc);
  opacity: .7;
}
.c.unmeas i,
.sw.unmeas {
  background:
    repeating-linear-gradient(
      45deg,
      var(--line2),
      var(--line2) 2px,
      transparent 2px,
      transparent 5px);
}
.c.none i,
.sw.none {
  background: var(--neubg);
}
.callegend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 10px;
  font-size: 11.5px;
  color: var(--tx2);
}
.callegend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.env {
  border: 1px solid var(--line);
  border-radius: 13px;
  overflow: hidden;
  background: var(--panel);
  margin-bottom: 12px;
}
.env.crit {
  border-color: var(--crit);
}
.envhead {
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  padding: 14px 16px;
  border: 0;
  background: none;
  color: var(--tx);
  font: inherit;
  cursor: pointer;
  text-align: left;
}
.envhead:hover {
  background: var(--panel2);
}
.envtitle {
  flex: 1;
  min-width: 0;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: -.01em;
}
.envtitle small {
  display: block;
  color: var(--tx3);
  font-size: 11.5px;
  font-weight: 400;
  margin-top: 2px;
}
.envchev {
  color: var(--tx3);
  font-size: 15px;
  transition: transform .18s;
}
.env.open .envchev {
  transform: rotate(180deg);
}
.envbody {
  display: none;
  padding: 0 16px 16px;
}
.env.open .envbody {
  display: block;
}
.fabwrap {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  overflow-x: auto;
}
.fabnode {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  text-align: center;
  border-radius: 9px;
  border: 1.4px solid var(--line2);
  background: var(--panel);
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
}
.fabnode.on {
  border-color: var(--acc);
}
.fabnode small {
  color: var(--tx3);
  font-size: 10px;
  font-weight: 400;
  margin-top: 2px;
}
details.sez > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 0;
  font-size: 13.5px;
  font-weight: 600;
  user-select: none;
}
details.sez > summary::-webkit-details-marker {
  display: none;
}
details.sez > summary::before {
  content: "▸";
  color: var(--tx3);
  font-size: 10px;
  transition: transform .12s;
}
details.sez[open] > summary::before {
  transform: rotate(90deg);
}
details.sez > summary .cnt {
  color: var(--tx3);
  font-size: 11.5px;
  font-weight: 400;
}
.login {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
}
.loginart {
  position: relative;
  overflow: hidden;
  padding: 44px 52px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background:
    linear-gradient(
      160deg,
      #081020 0%,
      #0b1a33 55%,
      #08111f 100%);
  color: #eef3fb;
}
.loginart h1 {
  font-size: 40px;
  line-height: 1.05;
  font-weight: 600;
  letter-spacing: -.03em;
  margin: 12px 0 14px;
}
.loginart p {
  color: #93a7c6;
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
.loginart .spirale {
  position: absolute;
  right: -140px;
  bottom: -160px;
  width: 560px;
  opacity: .06;
  filter: invert(1);
}
.loginbox {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
}
.loginbox .inner {
  width: 100%;
  max-width: 352px;
}
label {
  display: block;
  font-size: 11px;
  color: var(--tx3);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  margin: 13px 0 5px;
}
input[type=email],
input[type=password],
input[type=text] {
  width: 100%;
  padding: 9px 11px;
  border-radius: 9px;
  border: 1px solid var(--line2);
  background: var(--panel);
  color: var(--tx);
  font: inherit;
  font-size: 13.5px;
}
input:focus {
  outline: none;
  border-color: var(--acc);
  box-shadow: 0 0 0 3px var(--accbg);
}
.btn {
  width: 100%;
  margin-top: 18px;
  padding: 11px;
  border: 0;
  border-radius: 9px;
  background: var(--acc);
  color: #04263a;
  font: inherit;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
}
.btn:hover {
  filter: brightness(1.06);
}
.btn.ghost {
  background: var(--panel);
  border: 1px solid var(--line2);
  color: var(--tx);
}
.err {
  margin-top: 14px;
  padding: 9px 12px;
  border-radius: 9px;
  background: var(--critbg);
  border: 1px solid var(--line2);
  color: var(--crit);
  font-size: 13px;
}
.hint {
  color: var(--tx3);
  font-size: 11.5px;
  margin: 14px 0 0;
  line-height: 1.5;
}
@media (max-width:900px) {
  .top {
    gap: 9px;
    padding: 0 10px;
  }
  .top .prod,
  .top .who {
    display: none;
  }
  .gsearch {
    flex: 1 1 100%;
    order: 5;
    max-width: none;
  }
  .shell {
    flex-direction: column;
  }
  .side {
    position: static;
    flex: none;
    width: auto;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .nav {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .main {
    padding: 16px 12px 44px;
  }
}
.cliswitch > summary {
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: 250px;
  padding: 6px 11px;
  border-radius: 9px;
  border: 1px solid var(--line2);
  background: var(--panel2);
  color: var(--tx);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}
.cliswitch > summary::-webkit-details-marker {
  display: none;
}
.cliswitch > summary::after {
  content: "⌄";
  color: var(--tx3);
  margin-left: auto;
  font-size: 12px;
}
.cliswitch > summary:hover {
  border-color: var(--acc);
}
.cliswitch > summary .nm {
  overflow: hidden;
  text-overflow: ellipsis;
}
.cliswitch[open] > summary {
  border-color: var(--acc);
}
.cliswitch .menu .nm {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cliswitch .menu .tuttii {
  margin-top: 4px;
  border-top: 1px solid var(--line);
  border-radius: 0 0 8px 8px;
  color: var(--acc);
  font-weight: 600;
}
.topright {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-left: auto;
  flex: none;
}
.topright form {
  margin: 0;
  display: flex;
}
.ver {
  display: block;
  text-align: center;
  color: var(--tx3);
  font-size: 10.5px;
  font-variant-numeric: tabular-nums;
  text-decoration: none;
}
a.ver:hover {
  color: var(--acc);
}
html.sidechiusa .ver {
  font-size: 9.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fresh.warn {
  background: var(--warnbg);
  border-color: var(--line2);
  color: var(--tx);
}
.fresh.warn::before {
  background: var(--warn);
}
.fresh.unk {
  background: var(--neubg);
  border-color: var(--line2);
}
.fresh.unk::before {
  background: var(--tx3);
}
.cliswitch > summary {
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: 250px;
  padding: 6px 11px;
  border-radius: 9px;
  border: 1px solid var(--line2);
  background: var(--panel2);
  color: var(--tx);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
}
.cliswitch > summary::-webkit-details-marker {
  display: none;
}
.cliswitch > summary::after {
  content: "⌄";
  color: var(--tx3);
  margin-left: auto;
  font-size: 12px;
}
.cliswitch > summary:hover,
.cliswitch[open] > summary {
  border-color: var(--acc);
}
.cliswitch > summary .nm {
  overflow: hidden;
  text-overflow: ellipsis;
}
.cliswitch .menu .nm {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cliswitch .menu .tuttii {
  margin-top: 4px;
  border-top: 1px solid var(--line);
  border-radius: 0 0 8px 8px;
  color: var(--acc);
  font-weight: 600;
}
.topright {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-left: auto;
  flex: none;
}
.topright form {
  margin: 0;
  display: flex;
}
.ver {
  display: block;
  text-align: center;
  color: var(--tx3);
  font-size: 10.5px;
  font-variant-numeric: tabular-nums;
  text-decoration: none;
}
a.ver:hover {
  color: var(--acc);
}
html.sidechiusa .ver {
  font-size: 9.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.envdot {
  background: var(--line2);
  box-shadow: none;
}
.envdot.ok {
  background: var(--ok);
  box-shadow: 0 0 10px var(--ok);
}
.envdot.warn {
  background: var(--warn);
  box-shadow: 0 0 10px var(--warn);
}
.envdot.crit {
  background: var(--crit);
  box-shadow: 0 0 10px var(--crit);
}
.envdot.unk {
  background: var(--unk);
  box-shadow: 0 0 10px var(--unk);
}
.envdot.none {
  background: var(--line2);
  box-shadow: none;
}
.fresh.warn {
  background: var(--warnbg);
  border-color: var(--line2);
  color: var(--tx);
}
.fresh.warn::before {
  background: var(--warn);
}
.fresh.unk {
  background: var(--neubg);
  border-color: var(--line2);
}
.fresh.unk::before {
  background: var(--tx3);
}
.pwa.on {
  display: flex;
}
.env[open] .envchev {
  transform: rotate(180deg);
}
.env[open] .envbody {
  display: block;
}
.env.warn {
  border-color: var(--warn);
}
.fsv .fsbody {
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
}
.fsv .chartbox {
  flex: 1;
  min-height: 0;
}
.fsv .chartaxis {
  height: auto;
}
.fsv .chart {
  height: auto;
  flex: 1;
  min-height: 0;
  max-height: calc(100vh - 210px);
  cursor: crosshair;
  touch-action: none;
}
.login {
  align-items: stretch;
  justify-content: stretch;
  padding: 0;
}
a.ccard::before {
  display: none;
}
.chip .ic {
  display: inline-block;
  vertical-align: -2px;
}
.chip .osmark {
  margin-right: 0;
}
dd > .ic,
dd > .osmark {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: -2px;
  margin-right: 6px;
}
.cfilters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 18px 0 14px;
}
.cfilters button,
.cfilters a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border-radius: 9px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--tx2);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
  text-decoration: none;
}
.cfilters button:hover,
.cfilters a:hover {
  border-color: var(--line2);
  color: var(--tx);
}
.cfilters button.on,
.cfilters a.on {
  border-color: var(--acc);
  background: var(--panel-hi);
  color: var(--tx);
}
.cfilters button b,
.cfilters a b {
  font-variant-numeric: tabular-nums;
  color: var(--tx);
}
.cfilters .cdato {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border-radius: 9px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--tx2);
  font-size: 12.5px;
  cursor: default;
}
.cfilters .cdato b {
  font-variant-numeric: tabular-nums;
  color: var(--tx);
}
.albox {
  margin: 22px 0;
}
.albox + .albox {
  border-top: 1px solid var(--line);
  padding-top: 6px;
}
.alhead {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.alhead h2 {
  margin: 0;
}
.alper {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.alper button {
  padding: 3px 9px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--tx3);
  font: inherit;
  font-size: 11.5px;
  cursor: pointer;
}
.alper button:hover {
  border-color: var(--line2);
  color: var(--tx2);
}
.alper button.on {
  border-color: var(--acc);
  background: var(--panel-hi);
  color: var(--tx);
}
.alsep {
  margin-top: 26px;
}
.chead {
  display: flex;
  align-items: center;
  gap: 10px;
}
.cid {
  min-width: 0;
  flex: 1;
}
.chero {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 15px;
}
.cheroL {
  line-height: 1.2;
  min-width: 0;
}
.cheroL .t {
  font-size: 12.5px;
  font-weight: 600;
}
.cheroL .meta {
  color: var(--tx3);
  font-size: 10.5px;
  margin-top: 2px;
}
.cstats-full {
  width: 100%;
  margin-left: 0;
  justify-content: space-between;
  text-align: left;
}
.csparkbox {
  margin-top: 13px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.sparkhead {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.sparkhead span {
  color: var(--tx3);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 700;
}
.sparkhead b {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: var(--tx2);
}
.sparkhead b.crit {
  color: var(--crit);
}
.sparkhead b.warn {
  color: var(--warn);
}
.sparkhead b.ok {
  color: var(--ok);
}
.sparkhead b.unk,
.sparkhead b.dim {
  color: var(--tx3);
}
.sparkhead span .sw {
  display: inline-block;
  vertical-align: -1px;
  margin-right: 1px;
}
.sparkhead b em {
  font-style: normal;
}
.sparkhead b em.warn {
  color: var(--warn);
}
.sparkhead b em.crit {
  color: var(--crit);
}
svg.spark {
  display: block;
  width: 100%;
  height: 34px;
  margin-top: 5px;
}
.sparknone {
  color: var(--tx3);
  font-size: 11px;
  margin-top: 6px;
}
@media (max-width:900px) {
  .login {
    grid-template-columns: 1fr;
  }
  .loginart {
    display: none;
  }
  .loginbox {
    padding: 24px 16px;
  }
}
.sysmap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
  gap: 12px;
  margin: 14px 0 8px;
}
.sysmapcard {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 12px 14px;
}
.sysmaphead {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 9px;
}
.sysmaphead .ico2d {
  width: 30px;
  flex: 0 0 30px;
}
.sysmaplbl {
  font-weight: 650;
  font-size: 13.5px;
  flex: 1;
  line-height: 1.25;
}
.sysmapchips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.syschip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family:
    ui-monospace,
    SFMono-Regular,
    "SF Mono",
    Menlo,
    monospace;
  font-size: 11px;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: inherit;
  text-decoration: none;
}
.syschip:hover {
  border-color: var(--tx3);
}
.syschip.vip {
  border-color: var(--acc);
  background: var(--accbg);
}
.vipmark {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--acc);
  border: 1px solid var(--acc);
  border-radius: 4px;
  padding: 0 3px;
  line-height: 1.5;
}
.tag.vip {
  background: var(--accbg);
  color: var(--acc);
}
.vipsez {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.viplbl {
  font-size: 11px;
  color: var(--tx3);
  text-transform: uppercase;
  letter-spacing: .07em;
  font-weight: 600;
  margin-bottom: 8px;
}
.vipchips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
@media (max-width:820px) {
  .vipsez {
    grid-template-columns: 1fr;
  }
}
.sdot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: 0 0 7px;
  background: var(--ok);
}
.sdot.warn {
  background: var(--warn);
}
.sdot.crit {
  background: var(--crit);
}
.sdot.unk {
  background: var(--tx3);
}
.ldrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 5px 0;
}
.ldhost {
  flex: 0 0 150px;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ldtrack {
  flex: 1;
  height: 8px;
  background: var(--line);
  border-radius: 4px;
  overflow: hidden;
}
.ldfill {
  height: 100%;
  background: var(--acc);
  border-radius: 4px;
}
.ldfill.warn {
  background: var(--warn);
}
.ldfill.crit {
  background: var(--crit);
}
.ldval {
  flex: 0 0 42px;
  text-align: right;
  font-size: 11px;
  color: var(--tx2);
}
.ldval.warn {
  color: var(--warn);
}
.ldval.crit {
  color: var(--crit);
}
.stomapwrap {
  margin: 14px 0 4px;
}
.stomap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}
.stovgs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.stovg {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 11px 13px;
}
.stovghead {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.stovgname {
  font-weight: 650;
  font-size: 13px;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stovgnum {
  font-size: 19px;
  font-weight: 650;
  line-height: 1.1;
}
.stovgnum small {
  font-size: 11.5px;
  font-weight: 400;
  color: var(--tx2);
}
.stovgmeta {
  font-size: 11.5px;
  color: var(--tx2);
  margin-top: 6px;
  line-height: 1.45;
}
.stobar {
  height: 6px;
  background: var(--line);
  border-radius: 3px;
  overflow: hidden;
  margin-top: 7px;
}
.stobarfill {
  height: 100%;
  background: var(--acc);
  border-radius: 3px;
}
.stobarfill.warn {
  background: var(--warn);
}
.stobarfill.crit {
  background: var(--crit);
}
.stostem {
  width: 2px;
  height: 16px;
  background: var(--line);
  margin: 0 auto;
}
.stosys {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 12px 14px;
}
.stosysid {
  display: flex;
  align-items: center;
  gap: 12px;
}
.stosysid .ico2d {
  width: 40px;
  flex: 0 0 40px;
}
.stosystxt {
  flex: 1;
  min-width: 0;
}
.stosysname {
  font-weight: 650;
  font-size: 14.5px;
  line-height: 1.2;
}
.stosyssub {
  font-size: 11.5px;
  color: var(--tx2);
  margin-top: 2px;
}
.stosyslink {
  font-size: 11.5px;
  color: var(--tx2);
  text-decoration: none;
  white-space: nowrap;
}
.stosyslink:hover {
  color: var(--tx);
}
.stofacts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.stofact {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--tx2);
  padding: 3px 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.stofact b {
  font-weight: 600;
  color: var(--tx);
}
.stopools {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.stopool {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 11px 13px;
}
.stopoolhead {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.stopoolhead .mono {
  flex: 1;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stopoolpct {
  font-size: 15px;
  font-weight: 650;
}
.stopoolpct.warn {
  color: var(--warn);
}
.stopoolpct.crit {
  color: var(--crit);
}
.stopoolmeta {
  font-size: 11.5px;
  color: var(--tx2);
  margin-top: 6px;
  line-height: 1.45;
}
:root[data-theme=light] .note.warn {
  background: rgba(251, 191, 36, .16);
  border-color: rgba(180, 120, 10, .36);
  color: #7c4a03;
}
:root[data-theme=light] .note.info {
  background: rgba(56, 189, 248, .13);
  border-color: rgba(10, 111, 189, .32);
  color: #0b4f77;
}
:root[data-theme=light] .ruolo.r-db {
  color: #065f46;
}
:root[data-theme=light] .ruolo.r-app {
  color: #075985;
}
:root[data-theme=light] .ruolo.r-applicazione {
  color: #5b21b6;
}
:root[data-theme=light] .ruolo.r-web,
:root[data-theme=light] .ruolo.r-sap {
  color: #7c4a03;
}
:root[data-theme=light] .ruolo.r-mail {
  color: #9d174d;
}
:root[data-theme=light] .ruolo.r-dc,
:root[data-theme=light] .ruolo.r-dns,
:root[data-theme=light] .ruolo.r-dhcp {
  color: #334155;
}
:root[data-theme=light] .ruolo.r-backup {
  color: #115e59;
}
:root[data-theme=light] .ruolo.r-monitor {
  color: #3730a3;
}
:root[data-theme=light] .ruolo.r-container {
  color: #075985;
}
:root[data-theme=light] .ruolo.r-virt,
:root[data-theme=light] .ruolo.r-vcenter {
  color: #9d174d;
}
:root[data-theme=light] .ruolo.r-cluster {
  color: #115e59;
}
:root[data-theme=light] .chip.cat-win {
  color: #075985;
}
:root[data-theme=light] .chip.cat-lnx {
  color: #7c4a03;
}
:root[data-theme=light] .chip.cat-unix {
  color: #9d174d;
}
:root[data-theme=light] .chip.cat-net {
  color: #5b21b6;
}
:root[data-theme=light] .chip.cat-fw {
  color: #991b1b;
}
:root[data-theme=light] .chip.cat-sto {
  color: #065f46;
}
:root[data-theme=light] .chip.cat-vmw {
  color: #115e59;
}
:root[data-theme=light] .chip.cat-web {
  color: #155e75;
}
:root[data-theme=light] .chip.cat-pwr {
  color: #7c4a03;
}
:root[data-theme=light] .chip.cat-bck {
  color: #115e59;
}
:root[data-theme=light] .chip.cat-prn {
  color: #334155;
}
:root[data-theme=light] .chip.cat-app {
  color: #3f6212;
}
:root[data-theme=light] .chip.cat-srv {
  color: #9a3412;
}
:root[data-theme=light] .chip.cat-tape {
  color: #3730a3;
}
:root[data-theme=light] .chip.cat-vtl {
  color: #86198f;
}
:root[data-theme=light] .nico.r-db {
  color: #065f46;
}
:root[data-theme=light] .nico.r-app {
  color: #075985;
}
:root[data-theme=light] .nico.r-frontend {
  color: #7c4a03;
}
:root[data-theme=light] .nico.r-mgmt {
  color: #5b21b6;
}
:root[data-theme=light] .nico.r-storage {
  color: #115e59;
}
:root[data-theme=light] .nico.r-net {
  color: #334155;
}
:root[data-theme=light] .nico.r-infra {
  color: #9d174d;
}
:root[data-theme=light] .err {
  background: rgba(248, 113, 113, .13);
  border-color: rgba(153, 27, 27, .34);
  color: #991b1b;
}
.nav a .ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  opacity: 1;
  color: var(--tx3);
  font-size: 11px;
  font-weight: 700;
}
.nav a .ico svg {
  width: 18px;
  height: 18px;
  display: block;
}
.nav a:hover .ico,
.nav a.on .ico {
  color: var(--acc);
}
.nav a .ico.sigla {
  flex-basis: 26px;
  width: 26px;
  height: 20px;
  border-radius: 6px;
  background: var(--panel2);
  color: var(--tx2);
  font-size: 10.5px;
  letter-spacing: .03em;
}
.nav a.on .ico.sigla {
  background: var(--acc);
  color: #06121e;
}
html.sidechiusa .side {
  padding: 0;
}
html.sidechiusa .nav {
  padding: 12px 6px;
}
html.sidechiusa .nav a {
  justify-content: center;
  gap: 0;
  padding: 9px 0;
}
html.sidechiusa .nav a .ico {
  display: inline-flex;
  flex-basis: 22px;
  width: 22px;
  height: 22px;
}
html.sidechiusa .nav a .ico svg {
  width: 22px;
  height: 22px;
}
html.sidechiusa .nav a .ico.sigla {
  flex-basis: 28px;
  width: 28px;
  height: 22px;
  font-size: 11px;
}
html.sidechiusa .nav a .ini {
  display: none;
}
html.sidechiusa .nav a.on {
  box-shadow: inset 2px 0 0 var(--acc);
}
html.sidechiusa .side .foot {
  padding: 10px 6px;
  text-align: center;
}
html.sidechiusa .side .foot .linkbtn {
  padding: 6px 0;
  font-size: 12px;
  width: 100%;
}
@media (max-width:900px) {
  #sidetgl {
    display: none;
  }
  html.sidechiusa .side {
    flex: none;
    width: auto;
    padding: 0;
  }
  html.sidechiusa .nav {
    padding: 12px 8px;
  }
  html.sidechiusa .nav a {
    justify-content: flex-start;
    gap: 9px;
    padding: 7px 9px;
  }
  html.sidechiusa .nav a .nm,
  html.sidechiusa .navlabel {
    display: block;
  }
  html.sidechiusa .nav a .cnt {
    display: inline;
  }
  html.sidechiusa .nav a .ico {
    flex-basis: 18px;
    width: 18px;
    height: 18px;
  }
  html.sidechiusa .nav a .ico svg {
    width: 18px;
    height: 18px;
  }
  html.sidechiusa .side .foot {
    text-align: left;
  }
}
.ambiente {
  margin-top: 6px;
}
.ambiente + .ambiente {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.ambnome {
  color: var(--tx2);
  font-size: 12.5px;
  font-weight: 650;
  margin-bottom: 12px;
}
.risorse {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
}
.risorsa {
  text-align: center;
}
.risorsa svg {
  display: block;
  margin: 0 auto;
}
.rnome {
  color: var(--tx3);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 700;
  margin-top: 8px;
}
.rnum {
  color: var(--tx);
  font-size: 12.5px;
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
}
.rnum.over {
  color: var(--crit);
}
.rnota {
  color: var(--tx3);
  font-size: 11px;
  line-height: 1.35;
  margin-top: 5px;
}
.rnota.over {
  color: var(--warn);
}
.alimcard {
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: var(--panel);
  padding: 14px 16px 16px;
  margin-bottom: 14px;
}
.alimcard + .alimcard {
  margin-top: 2px;
}
.alimhead {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.alimhead .envtitle {
  min-width: 0;
  flex: 1 1 260px;
}
.alimhead .envstat {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.alimbox {
  margin: 10px 0 4px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
.alimschema {
  display: block;
  width: 100%;
  height: auto;
  min-width: 680px;
}
.alimtab td,
.alimtab th {
  white-space: nowrap;
}
.alimchips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 10px;
}
.alimflusso {
  stroke-dasharray: 14 20;
  stroke-dashoffset: 0;
  opacity: .95;
}
@media (prefers-reduced-motion:no-preference) {
  .alimflusso {
    animation: alimscorre 1.4s linear infinite;
  }
}
@keyframes alimscorre {
  to {
    stroke-dashoffset: -34;
  }
}
@media (max-width:900px) {
  .alimcard {
    padding: 12px;
  }
  .alimhead {
    gap: 8px;
  }
}
.firmadesc {
  color: var(--tx3);
  font-size: 11px;
  white-space: nowrap;
  margin-left: 8px;
}
.frm textarea {
  width: 100%;
  padding: 8px 11px;
  border-radius: 9px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  color: var(--tx);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  resize: vertical;
  min-height: 66px;
}
.frm textarea:focus {
  outline: none;
  border-color: var(--acc);
  box-shadow: 0 0 0 3px var(--accbg);
}
.schedadic .sdazioni {
  display: flex;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;
  margin-top: 9px;
}
.schedadic .sdazioni .dim {
  font-size: 11.5px;
}
.schedadic .sdruolo {
  display: flex;
  gap: 9px;
  align-items: center;
  flex-wrap: wrap;
}
.schedadic .sdruolo select {
  width: auto;
  min-width: 190px;
  flex: 0 0 auto;
}
.schedadic .sdruolo input[type=text] {
  flex: 1 1 260px;
  min-width: 0;
}
.schedadic .sdruolo button {
  flex: 0 0 auto;
}
.schedadic .sdlabel {
  display: block;
  font-size: 11px;
  color: var(--tx3);
  margin: 20px 0 6px;
  text-transform: uppercase;
  letter-spacing: .07em;
  font-weight: 600;
}
.schedadic .sdlista .linkrow {
  gap: 11px;
  flex-wrap: wrap;
}
.schedadic .sdlista .linkrow form {
  margin-left: auto;
  flex: 0 0 auto;
}
.schedadic .sdlista .ruolo {
  flex: 0 0 auto;
}
@media (max-width:640px) {
  .schedadic .sdruolo select,
  .schedadic .sdruolo input[type=text] {
    flex: 1 1 100%;
  }
  .schedadic .sdlista .linkrow form {
    margin-left: 0;
  }
}
.sysmodrow {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin: 0;
}
.sysmodrow input[type=text],
.sysmodrow select {
  flex: 1 1 150px;
  min-width: 0;
  width: auto;
  padding: 6px 9px;
  border-radius: 8px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  color: var(--tx);
  font: inherit;
  font-size: 12.5px;
}
.sysmodrow input[type=text]:focus,
.sysmodrow select:focus {
  outline: none;
  border-color: var(--acc);
}
.sysmodrow button {
  flex: 0 0 auto;
}
.sysmodchk {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  font-size: 11px;
  color: var(--tx3);
  white-space: nowrap;
  cursor: pointer;
}
.sysmodchk input {
  margin: 0;
  accent-color: var(--acc);
}
.sysmodrow select {
  flex: 0 1 260px;
}
.sysmod .sysmodlbl {
  display: block;
  font-size: 11px;
  color: var(--tx3);
  margin: 20px 0 7px;
  text-transform: uppercase;
  letter-spacing: .07em;
  font-weight: 600;
}
.sysmod td .sysmodrow input[type=text] {
  flex: 1 1 120px;
}
.sysmod td form {
  margin: 0;
}
.sysmod td {
  vertical-align: middle;
}
@media (max-width:720px) {
  .sysmodrow input[type=text],
  .sysmodrow select {
    flex: 1 1 100%;
  }
  .sysmodrow button {
    width: 100%;
  }
}
.tapecard {
  background: var(--panel);
  border: 1px solid var(--line2);
  border-radius: 14px;
  padding: 16px 16px 10px;
  margin: 0 0 18px;
}
.tapecard-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.tapecard-head h2 {
  margin: 0;
  font-size: 16px;
}
.opgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 8px;
}
.oplbl {
  font-size: 11px;
  letter-spacing: .09em;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 8px;
}
.oplbl.out {
  color: var(--crit);
}
.oplbl.in {
  color: var(--ok);
}
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tapechip {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid var(--line2);
  background: var(--bg2);
  cursor: pointer;
  font: inherit;
  color: var(--tx);
  min-width: 118px;
  text-align: left;
}
.tapechip .bc {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .03em;
}
.tapechip .pos {
  font-size: 11px;
  color: var(--tx3);
}
.tapechip.out {
  border-left: 4px solid var(--crit);
}
.tapechip.in {
  border-left: 4px solid var(--ok);
}
.tapechip.done {
  opacity: .38;
}
.tapechip.done .bc {
  text-decoration: line-through;
}
.opnone {
  color: var(--tx2);
  font-size: 13px;
  margin: 4px 0;
}
@media (max-width:720px) {
  .opgrid {
    grid-template-columns: 1fr;
  }
  .tapechip {
    flex: 1 1 calc(50% - 8px);
  }
  .tapechip .bc {
    font-size: 18px;
  }
}
.wikihead {
  margin: 2px 0 16px;
}
.wikihead h1 {
  margin: 0 0 8px;
}
.wikimeta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
}
.wikibody {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 22px 26px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--tx2);
  max-width: 980px;
}
.wikibody h1,
.wikibody h2,
.wikibody h3,
.wikibody h4 {
  color: var(--tx);
  letter-spacing: -.01em;
  margin: 22px 0 10px;
}
.wikibody h1 {
  font-size: 22px;
}
.wikibody h2 {
  font-size: 18px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 6px;
}
.wikibody h3 {
  font-size: 15.5px;
}
.wikibody h4 {
  font-size: 14px;
}
.wikibody h1:first-child,
.wikibody h2:first-child,
.wikibody h3:first-child {
  margin-top: 0;
}
.wikibody p {
  margin: 0 0 12px;
}
.wikibody ul,
.wikibody ol {
  margin: 0 0 12px;
  padding-left: 24px;
}
.wikibody li {
  margin-bottom: 4px;
}
.wikibody li > ul,
.wikibody li > ol {
  margin-top: 4px;
  margin-bottom: 0;
}
.wikibody li > p {
  margin-bottom: 6px;
}
.wikibody strong {
  color: var(--tx);
  font-weight: 650;
}
.wikibody a {
  color: var(--acc,#7cc4ff);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.wikibody code {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    monospace;
  font-size: 12.5px;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 1px 5px;
  color: var(--tx);
}
.wikibody pre {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 12px 14px;
  overflow: auto;
  margin: 0 0 14px;
}
.wikibody pre code {
  background: none;
  border: 0;
  padding: 0;
  font-size: 12.5px;
  line-height: 1.5;
}
.wikibody blockquote {
  margin: 0 0 14px;
  padding: 10px 14px;
  border-left: 4px solid var(--line2);
  background: var(--bg2);
  border-radius: 0 9px 9px 0;
}
.wikibody blockquote p:last-child {
  margin-bottom: 0;
}
.wikibody blockquote.is-info {
  border-left-color: var(--info,#60a5fa);
}
.wikibody blockquote.is-success {
  border-left-color: var(--ok);
}
.wikibody blockquote.is-warning {
  border-left-color: var(--warn);
}
.wikibody blockquote.is-danger {
  border-left-color: var(--crit);
}
.wikibody table {
  border-collapse: collapse;
  margin: 0 0 14px;
  font-size: 13px;
  max-width: 100%;
  display: block;
  overflow: auto;
}
.wikibody th,
.wikibody td {
  border: 1px solid var(--line);
  padding: 6px 10px;
  text-align: left;
  vertical-align: top;
}
.wikibody th {
  background: var(--bg2);
  color: var(--tx);
  font-weight: 600;
}
.wikibody img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--line);
  margin: 4px 0 12px;
}
.wikibody hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 18px 0;
}
.wikibody del {
  color: var(--tx3);
}
.wikibody input[type=checkbox] {
  vertical-align: middle;
  margin-right: 4px;
}
.wimg-missing {
  color: var(--tx3);
  font-style: italic;
}
.wikiazioni {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 22px;
  align-items: center;
  margin: 0 0 16px;
  padding: 12px 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
.wikiaz {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
}
.wikiaz select {
  font: inherit;
  font-size: 12.5px;
  color: var(--tx);
  background: var(--bg2);
  border: 1px solid var(--line2);
  border-radius: 7px;
  padding: 4px 8px;
}
.wikiaz .linkbtn.primary {
  background: var(--acc);
  color: #fff;
  border-color: var(--acc);
}
.wikiagg {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.wikiagg .linkbtn {
  padding: 0 6px;
  line-height: 1.4;
}
.wikilist {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 10px;
}
.wikilistitem {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--tx);
  text-decoration: none;
  font-weight: 600;
}
.wikilistitem svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--tx3);
}
.wikilistitem:hover {
  border-color: var(--acc);
}
.wikiproc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 8px 12px;
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 12.5px;
}
.wikiproc.insys {
  margin: 6px 0 10px;
}
.wikiproclbl {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--tx3);
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-weight: 650;
}
.wikiproclbl svg {
  width: 14px;
  height: 14px;
}
.wikiprocitem {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--panel);
  border: 1px solid var(--line2);
  color: var(--tx);
  text-decoration: none;
}
.wikiprocitem:hover {
  border-color: var(--acc);
}
.wikiprocitem.nonvis {
  opacity: .6;
  border-style: dashed;
}
.delivcard {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 0 1 460px;
  min-width: 260px;
  margin: 1px 0 18px;
  padding: 12px 16px;
  border-radius: 12px;
  background: var(--panel);
  border: 1px solid var(--acc);
  color: var(--tx);
  text-decoration: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 18%, transparent);
}
.delivcard:hover {
  filter: brightness(1.06);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--acc) 28%, transparent);
}
.delivcard .dvic {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--acc);
  color: #04263a;
}
.delivcard .dvic svg {
  width: 24px;
  height: 24px;
  display: block;
}
.delivcard .dvtx {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.delivcard .dvtx b {
  font-size: 15px;
  font-weight: 680;
}
.delivcard .dvtx small {
  color: var(--tx2);
  font-size: 12px;
  white-space: normal;
}
.delivcard .dvgo {
  margin-left: auto;
  font-size: 22px;
  color: var(--acc);
  flex: 0 0 auto;
}
.iconbtn.deliv {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--tx2);
  line-height: 1;
}
.iconbtn.deliv svg {
  width: 16px;
  height: 16px;
  display: block;
}
.iconbtn.deliv:hover {
  border-color: var(--acc);
  color: var(--acc);
}
.pwrlist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 12px;
  margin-top: 10px;
}
.pwr {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--panel-hi);
}
.pwrhead {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  align-items: baseline;
  font-size: 12.5px;
  margin-bottom: 8px;
}
.pwrhead .dim {
  font-size: 11.5px;
}
.pwrrow {
  display: grid;
  grid-template-columns: 34px 1fr;
  column-gap: 10px;
  align-items: center;
  margin-top: 6px;
}
.pwrlab {
  color: var(--tx3);
  font-size: 10.5px;
  letter-spacing: .08em;
  font-weight: 700;
}
.pwrbar {
  height: 10px;
  border-radius: 99px;
  background: var(--line);
  overflow: hidden;
}
.pwrbar i {
  display: block;
  height: 100%;
  border-radius: 99px;
}
.pwrbar i.acc {
  background: var(--acc);
}
.pwrbar i.warn {
  background: var(--warn);
}
.pwrbar i.crit {
  background: var(--crit);
}
.pwrval {
  grid-column: 2;
  font-size: 11.5px;
  color: var(--tx2);
  margin-top: 3px;
  font-variant-numeric: tabular-nums;
}
.pwrval b {
  color: var(--tx);
}
.pwrlpar {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
}
.pwrlpar .lp {
  font-size: 11px;
  padding: 2px 7px;
  border-radius: 6px;
  border: 1px solid var(--line2);
  color: var(--tx2);
  white-space: nowrap;
}
.pwrlpar .lp b {
  color: var(--tx);
  font-weight: 600;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
}
.pwrlpar .lp i {
  font-style: normal;
  color: var(--tx3);
}
.pwrlpar .lp.off {
  border-style: dashed;
  opacity: .7;
}
.pwrlpar .lp.off b {
  color: var(--tx3);
}
.dh {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: var(--panel-hi);
  margin-top: 10px;
}
.dhtop {
  display: grid;
  grid-template-columns: minmax(240px, 1.4fr) auto minmax(220px, 1fr);
  gap: 18px;
  align-items: center;
}
@media (max-width:760px) {
  .dhtop {
    grid-template-columns: 1fr;
  }
}
.dhstato {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.dhdot {
  width: 14px;
  height: 14px;
  border-radius: 99px;
  margin-top: 4px;
  flex: none;
  background: var(--tx3);
}
.dhstato.ok .dhdot {
  background: var(--acc);
  box-shadow: 0 0 0 0 var(--acc);
  animation: dhpulse 2.4s ease-out infinite;
}
.dhstato.warn .dhdot {
  background: var(--warn);
}
.dhstato.crit .dhdot {
  background: var(--crit);
  animation: dhpulse 1.2s ease-out infinite;
}
@keyframes dhpulse {
  0% {
    box-shadow: 0 0 0 0 rgba(52, 211, 153, .55);
  }
  100% {
    box-shadow: 0 0 0 12px rgba(52, 211, 153, 0);
  }
}
.dhstato.crit .dhdot {
  animation-name: dhpulsec;
}
@keyframes dhpulsec {
  0% {
    box-shadow: 0 0 0 0 rgba(248, 113, 113, .6);
  }
  100% {
    box-shadow: 0 0 0 12px rgba(248, 113, 113, 0);
  }
}
@media (prefers-reduced-motion:reduce) {
  .dhdot {
    animation: none !important;
  }
}
.dhst {
  font-size: 17px;
  font-weight: 700;
  color: var(--tx);
}
.dhstato .dim {
  font-size: 12px;
  margin-top: 2px;
}
.dhhost {
  font-size: 11.5px;
  color: var(--tx3);
  margin-top: 6px;
}
.dhnums {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.dhnums div {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 10px;
}
.dhnums b {
  display: block;
  font-size: 20px;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
}
.dhnums span {
  font-size: 11px;
  color: var(--tx3);
}
.dhsez {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 16px 0 8px;
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--tx3);
}
.dhwifi {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--acc);
  stroke-width: 2;
  stroke-linecap: round;
}
.dhwifi circle {
  fill: var(--acc);
  stroke: none;
}
.dhgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 10px;
}
.dht {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px 11px;
  background: var(--panel);
}
.dht.wifi {
  border-color: color-mix(in srgb, var(--acc) 45%, var(--line));
}
.dhthead {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
  font-size: 12.5px;
  margin-bottom: 7px;
}
.dhthead b {
  color: var(--tx);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dhthead .dim {
  font-size: 11px;
}
.dhtval {
  font-size: 11.5px;
  color: var(--tx2);
  margin-top: 5px;
  font-variant-numeric: tabular-nums;
}
.dhtval b {
  color: var(--tx);
}
.dhtrange {
  font-size: 10.5px;
  color: var(--tx3);
  margin-top: 3px;
}
.dhcont {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.dhc b {
  display: block;
  font-size: 18px;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
}
.dhc span {
  display: block;
  font-size: 11.5px;
  color: var(--tx2);
}
.dhc i {
  font-style: normal;
  font-size: 10.5px;
  color: var(--tx3);
}
.retebox {
  margin-bottom: 14px;
}
.retescroll {
  overflow-x: auto;
  padding-bottom: 6px;
}
.rete {
  padding: 14px 4px 4px;
}
.retetop {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.retev {
  width: 2px;
  min-height: 22px;
  background: var(--line2);
  position: relative;
}
.retev span {
  position: absolute;
  left: 10px;
  top: 3px;
  white-space: nowrap;
  font-size: 10.5px;
  color: var(--tx3);
}
.retecloud {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 600;
  color: var(--tx2);
  padding: 6px 14px;
  border: 1px dashed var(--line2);
  border-radius: 99px;
}
.retecloud svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: var(--tx2);
  stroke-width: 1.6;
}
.rdot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 99px;
  background: var(--tx3);
  margin-right: 6px;
  flex: none;
}
.h-ok .rdot {
  background: var(--acc);
}
.h-warn .rdot {
  background: var(--warn);
}
.h-crit .rdot {
  background: var(--crit);
}
.h-crit .rdot {
  box-shadow: 0 0 0 3px rgba(248, 113, 113, .25);
}
.retefw {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel-hi);
  font-size: 12.5px;
}
.retecore {
  min-width: 320px;
  max-width: 560px;
  padding: 10px 14px;
  border: 2px solid color-mix(in srgb, var(--acc) 55%, var(--line));
  border-radius: 12px;
  background: var(--panel-hi);
  text-align: center;
}
.retecore.h-crit {
  border-color: var(--crit);
}
.retecore.h-warn {
  border-color: var(--warn);
}
.retecore .rtitle {
  justify-content: center;
  font-size: 14px;
}
.rtitle {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12.5px;
  font-weight: 600;
}
.rtitle a {
  color: var(--tx);
}
.rbadge {
  margin-left: 6px;
  font-size: 9.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 5px;
  background: var(--acc);
  color: #04121f;
  font-weight: 700;
}
.retecore .dim,
.retenodo .dim {
  font-size: 11px;
  margin-top: 2px;
}
.retelinee {
  display: block;
  width: 100%;
  height: 70px;
}
.retecols {
  display: grid;
  gap: 10px;
  align-items: start;
}
.retecol {
  border-top: 3px solid var(--line2);
  padding-top: 8px;
}
.retecolh {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px;
  font-size: 11.5px;
  margin-bottom: 8px;
}
.retecolh b {
  color: var(--tx);
}
.retecolh span {
  color: var(--tx3);
  font-size: 10.5px;
}
.retecol:has(.retecolh.h-crit) {
  border-top-color: var(--crit);
}
.retecol:has(.retecolh.h-warn) {
  border-top-color: var(--warn);
}
.retecol:has(.retecolh.h-ok) {
  border-top-color: var(--acc);
}
.retenodo {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 9px;
  background: var(--panel-hi);
  margin-bottom: 8px;
}
.retenodo.h-crit {
  border-color: var(--crit);
}
.retenodo.h-warn {
  border-color: var(--warn);
}
.rup {
  font-size: 10.5px;
  color: var(--tx3);
  margin-top: 4px;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
}
.rchips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}
.rchip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  padding: 2px 7px;
  border-radius: 6px;
  border: 1px solid var(--line2);
  color: var(--tx2);
  white-space: nowrap;
}
.rchip.ap {
  border-color: color-mix(in srgb, var(--acc) 50%, var(--line2));
  color: var(--tx);
}
.rchip.switch {
  border-style: dashed;
}
.rchip.porta {
  background: var(--line);
}
.rwifi {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: var(--acc);
  stroke-width: 2.2;
  stroke-linecap: round;
}
.rwifi circle {
  fill: var(--acc);
  stroke: none;
}
.retefigli {
  margin: 8px 0 0 8px;
  padding-left: 9px;
  border-left: 2px solid var(--line2);
}
.retefigli .retenodo {
  margin-bottom: 6px;
  background: var(--panel);
}
.reteiso {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 12px;
  font-size: 11.5px;
}
.dht.sap-warn {
  border-color: var(--warn);
}
.dht.sap-crit {
  border-color: var(--crit);
}
.dht.sap-unk {
  opacity: .75;
}
.nsc {
  --nsok:var(--ok);
  --nsw:var(--warn);
  --nsc:var(--crit);
  --nsu:var(--tx3);
  padding: 18px 20px 16px;
}
.nshead {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.nssub {
  font-size: 12px;
  color: var(--tx3);
  margin-top: 3px;
}
.nsbuild {
  display: inline-flex;
  gap: 6px;
  align-items: baseline;
  font-size: 11.5px;
  padding: 5px 10px;
  border-radius: 99px;
  border: 1px solid var(--line2);
  background: var(--panel-hi);
  white-space: nowrap;
}
.nsbuild b {
  color: var(--tx);
}
.nshero {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(420px, 1.6fr);
  gap: 14px;
  align-items: stretch;
}
@media (max-width:900px) {
  .nshero {
    grid-template-columns: 1fr;
  }
}
.nsstato {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--nsok) 12%, var(--panel-hi)),
      var(--panel-hi) 70%);
}
.nsstato.warn {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--nsw) 16%, var(--panel-hi)),
      var(--panel-hi) 70%);
  border-color: color-mix(in srgb, var(--nsw) 35%, var(--line));
}
.nsstato.crit {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--nsc) 18%, var(--panel-hi)),
      var(--panel-hi) 70%);
  border-color: color-mix(in srgb, var(--nsc) 40%, var(--line));
}
.nsring {
  width: 38px;
  height: 38px;
  border-radius: 99px;
  flex: none;
  display: grid;
  place-items: center;
  border: 2px solid color-mix(in srgb, var(--nsok) 40%, transparent);
}
.nsring span {
  width: 14px;
  height: 14px;
  border-radius: 99px;
  background: var(--nsok);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--nsok) 60%, transparent);
  animation: nspulse 2.6s ease-out infinite;
}
.nsstato.warn .nsring {
  border-color: color-mix(in srgb, var(--nsw) 45%, transparent);
}
.nsstato.warn .nsring span {
  background: var(--nsw);
  animation: none;
}
.nsstato.crit .nsring {
  border-color: color-mix(in srgb, var(--nsc) 50%, transparent);
}
.nsstato.crit .nsring span {
  background: var(--nsc);
  animation-duration: 1.3s;
}
@keyframes nspulse {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 0%, transparent);
  }
  70% {
    box-shadow: 0 0 0 10px transparent;
  }
}
@media (prefers-reduced-motion:reduce) {
  .nsring span {
    animation: none !important;
  }
}
.nsst {
  font-size: 18px;
  font-weight: 700;
  color: var(--tx);
  letter-spacing: -.01em;
}
.nsdet {
  font-size: 12.5px;
  color: var(--tx2);
  margin-top: 3px;
  line-height: 1.4;
}
.nskpi {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width:640px) {
  .nskpi {
    grid-template-columns: repeat(2, 1fr);
  }
}
.nsk {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 13px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--panel-hi);
}
.nsk span {
  font-size: 10.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tx3);
  font-weight: 600;
}
.nsk b {
  font-size: 24px;
  line-height: 1.05;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.nsk b small {
  font-size: 14px;
  color: var(--tx3);
  font-weight: 600;
}
.nsk i {
  font-style: normal;
  font-size: 11px;
  color: var(--tx3);
}
.nsk.warn {
  border-color: color-mix(in srgb, var(--nsw) 45%, var(--line));
}
.nsk.warn b {
  color: var(--nsw);
}
.nsbar {
  height: 6px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--nsc) 35%, var(--line));
  overflow: hidden;
  margin-top: 2px;
}
.nsbar i {
  display: block;
  height: 100%;
  border-radius: 99px;
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--nsok) 75%, #fff 0%),
      var(--nsok));
}
.nsbar:not(.part) {
  background: var(--line);
}
.nsprot {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 14px 0 4px;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 12.5px;
  color: var(--tx);
  border: 1px solid color-mix(in srgb, var(--nsok) 35%, var(--line));
  background: color-mix(in srgb, var(--nsok) 9%, var(--panel));
}
.nsprot svg {
  width: 20px;
  height: 20px;
  flex: none;
  fill: color-mix(in srgb, var(--nsok) 22%, transparent);
  stroke: var(--nsok);
  stroke-width: 1.6;
  stroke-linejoin: round;
}
.nsprot svg .tk {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
}
.nsprot.warn {
  border-color: color-mix(in srgb, var(--nsw) 40%, var(--line));
  background: color-mix(in srgb, var(--nsw) 9%, var(--panel));
}
.nsprot.warn svg {
  stroke: var(--nsw);
  fill: color-mix(in srgb, var(--nsw) 22%, transparent);
}
.nsprot.crit {
  border-color: color-mix(in srgb, var(--nsc) 45%, var(--line));
  background: color-mix(in srgb, var(--nsc) 10%, var(--panel));
}
.nsprot.crit svg {
  stroke: var(--nsc);
  fill: color-mix(in srgb, var(--nsc) 22%, transparent);
}
.nsprot.unk svg {
  stroke: var(--nsu);
  fill: none;
}
.nspairs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(520px, 1fr));
  gap: 14px;
  margin-top: 14px;
}
@media (max-width:620px) {
  .nspairs {
    grid-template-columns: 1fr;
  }
}
.nspair {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px;
  background: var(--panel-hi);
}
.nspair.warn {
  border-color: color-mix(in srgb, var(--nsw) 30%, var(--line));
}
.nspair.crit {
  border-color: color-mix(in srgb, var(--nsc) 40%, var(--line));
}
.nspairh {
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--tx3);
  margin: 0 4px 8px;
}
.nsnodes {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  align-items: stretch;
}
.nsnodes.n2 {
  grid-template-columns: 1fr 18px 1fr;
}
@media (max-width:620px) {
  .nsnodes.n2 {
    grid-template-columns: 1fr;
  }
  .nslink {
    display: none;
  }
}
.nslink {
  display: flex;
  align-items: center;
  justify-content: center;
}
.nslink span {
  width: 100%;
  height: 2px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--line2) 0 4px,
      transparent 4px 7px);
}
.nsnode {
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 11px 12px 10px;
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 9px;
  position: relative;
  overflow: hidden;
}
.nsnode::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--nsok);
  opacity: .85;
}
.nsnode.warn::before {
  background: var(--nsw);
}
.nsnode.crit::before {
  background: var(--nsc);
}
.nsnode.unk::before {
  background: var(--nsu);
}
.nsnh {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.nsnh a {
  font-weight: 700;
  color: var(--tx);
  font-size: 12.5px;
}
.nsrole {
  font-size: 9.5px;
  letter-spacing: .07em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 99px;
  color: var(--tx3);
  border: 1px solid var(--line2);
}
.nsrole.pri {
  color: var(--acc);
  border-color: color-mix(in srgb, var(--acc) 50%, var(--line2));
  background: color-mix(in srgb, var(--acc) 12%, transparent);
}
.nschk {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.nschk li {
  display: grid;
  grid-template-columns: 16px auto 1fr;
  gap: 8px;
  align-items: center;
  font-size: 11.8px;
  padding: 4px 0;
  border-bottom: 1px dashed color-mix(in srgb, var(--line) 70%, transparent);
}
.nschk li:last-child {
  border-bottom: 0;
}
.nschk .l {
  color: var(--tx2);
}
.nschk .v {
  text-align: right;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nschk .v.warn {
  color: var(--nsw);
  font-weight: 600;
}
.nschk .v.crit {
  color: var(--nsc);
  font-weight: 600;
}
.nschk .v.unk {
  color: var(--tx3);
}
.nsi {
  width: 15px;
  height: 15px;
  fill: none;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nsi.ok {
  stroke: var(--nsok);
}
.nsi.ok circle {
  fill: color-mix(in srgb, var(--nsok) 16%, transparent);
}
.nsi.warn {
  stroke: var(--nsw);
}
.nsi.warn .f {
  fill: color-mix(in srgb, var(--nsw) 18%, transparent);
}
.nsi.crit {
  stroke: var(--nsc);
}
.nsi.crit circle {
  fill: color-mix(in srgb, var(--nsc) 16%, transparent);
}
.nsi.unk {
  stroke: var(--nsu);
}
.nsbk {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 8px 10px;
  border-radius: 9px;
  background: var(--panel-hi);
}
.nsbk.passivo {
  font-size: 11px;
  color: var(--tx3);
  font-style: italic;
}
.nsbkh {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--tx3);
}
.nsbkh b {
  color: var(--tx);
  font-variant-numeric: tabular-nums;
}
.nsiss {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.nsis {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 8px;
  align-items: start;
  padding: 7px 9px;
  border-radius: 9px;
  font-size: 11.5px;
  background: color-mix(in srgb, var(--nsw) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--nsw) 28%, transparent);
}
.nsis.crit {
  background: color-mix(in srgb, var(--nsc) 9%, transparent);
  border-color: color-mix(in srgb, var(--nsc) 32%, transparent);
}
.nsis span {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.nsis b {
  color: var(--tx);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nsis em {
  font-style: normal;
  color: var(--tx2);
}
.nsfoot {
  font-size: 10.5px;
  color: var(--tx3);
  margin-top: auto;
}
.nsevh {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 22px 0 10px;
}
.nsevh h4 {
  margin: 0;
  font-size: 13px;
  color: var(--tx);
  font-weight: 700;
}
.nsonly {
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--acc);
  padding: 2px 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--acc) 12%, transparent);
}
.nstl {
  display: flex;
  flex-direction: column;
}
.nsday {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 6px;
}
.nsday:first-child {
  margin-top: 0;
}
.nsday span {
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--tx2);
  white-space: nowrap;
}
.nsday::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line);
}
.nsev {
  display: grid;
  grid-template-columns: 48px 22px 1fr;
  gap: 0 8px;
}
.nsevt {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
  text-align: right;
  padding-top: 9px;
}
.nsevdot {
  display: flex;
  justify-content: center;
  position: relative;
}
.nsevdot::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--line);
}
.nsevdot span {
  position: relative;
  margin-top: 12px;
  width: 10px;
  height: 10px;
  border-radius: 99px;
  background: var(--tx3);
  box-shadow: 0 0 0 3px var(--panel);
}
.nsev.crit .nsevdot span {
  background: var(--nsc);
  box-shadow: 0 0 0 3px var(--panel), 0 0 0 6px color-mix(in srgb, var(--nsc) 22%, transparent);
}
.nsev.warn .nsevdot span {
  background: var(--nsw);
}
.nsev.ok .nsevdot span {
  background: var(--nsok);
}
.nsev.info .nsevdot span {
  background: var(--acc);
}
.nsevb {
  margin: 4px 0 8px;
  padding: 8px 12px 9px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--panel-hi);
}
.nsev.crit .nsevb {
  border-color: color-mix(in srgb, var(--nsc) 35%, var(--line));
  background: color-mix(in srgb, var(--nsc) 6%, var(--panel-hi));
}
.nsevtop {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.nsevtop b {
  font-size: 12.8px;
  color: var(--tx);
}
.nsbadge {
  font-size: 9.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  white-space: nowrap;
}
.nsbadge.crit {
  color: var(--nsc);
  background: color-mix(in srgb, var(--nsc) 15%, transparent);
}
.nsbadge.warn {
  color: var(--nsw);
  background: color-mix(in srgb, var(--nsw) 15%, transparent);
}
.nsbadge.ok {
  color: var(--nsok);
  background: color-mix(in srgb, var(--nsok) 14%, transparent);
}
.nsbadge.info {
  color: var(--acc);
  background: color-mix(in srgb, var(--acc) 14%, transparent);
}
.nsevm {
  font-size: 11px;
  color: var(--tx3);
  margin-top: 2px;
}
.nsevm .sep {
  margin: 0 6px;
}
.nsevb p {
  margin: 5px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--tx2);
}
@media (max-width:560px) {
  .nsev {
    grid-template-columns: 40px 18px 1fr;
  }
}
.nsnote {
  margin-top: 14px;
  font-size: 11.5px;
  color: var(--tx3);
}
.nsnote summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--tx2);
}
.nsnote p {
  margin: 6px 0 0;
  line-height: 1.5;
}
.nsx .ns3dwrap {
  position: relative;
  margin: 2px 0 16px;
}
.nsx .ns3d {
  --ok:#34d399;
  --warn:#fbbf24;
  --crit:#f87171;
  --unk:#64748b;
  position: relative;
  height: 600px;
  border-radius: 16px;
  overflow: hidden;
  background:
    radial-gradient(
      120% 90% at 38% 30%,
      #14305c 0%,
      #0a1730 48%,
      #050b18 100%);
  border: 1px solid rgba(96, 165, 250, .22);
  box-shadow: inset 0 0 80px rgba(2, 6, 23, .9), 0 20px 50px -25px rgba(2, 6, 23, .8);
  color: #dbe7ff;
  user-select: none;
  -webkit-user-select: none;
}
.nsx .ns3d::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255, 255, 255, .018) 0 1px,
      transparent 1px 3px);
}
.nsx .ns3d-view {
  position: absolute;
  inset: 0;
  perspective: 1500px;
  perspective-origin: 50% 28%;
  touch-action: pan-y;
  cursor: grab;
}
.nsx .ns3d-view.grab {
  cursor: grabbing;
}
.nsx .ns3d-world {
  position: absolute;
  left: 50%;
  top: 56%;
  width: 1000px;
  height: 660px;
  margin: -330px 0 0 -500px;
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
}
.nsx .ns3d-world * {
  box-sizing: border-box;
}
.nsx .ns3d-floor {
  position: absolute;
  inset: -160px;
  border-radius: 50%;
  background:
    linear-gradient(rgba(96, 165, 250, .10) 1px, transparent 1px) 0 0/40px 40px,
    linear-gradient(
      90deg,
      rgba(96, 165, 250, .10) 1px,
      transparent 1px) 0 0/40px 40px;
  -webkit-mask-image:
    radial-gradient(
      closest-side,
      #000 55%,
      transparent 100%);
  mask-image:
    radial-gradient(
      closest-side,
      #000 55%,
      transparent 100%);
}
.nsx .ns3d-plat {
  position: absolute;
  --c:var(--ok);
  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--c) 45%, transparent);
  background:
    linear-gradient(
      180deg,
      rgba(20, 40, 80, .35),
      rgba(12, 24, 50, .7));
  box-shadow: 0 0 60px -10px color-mix(in srgb, var(--c) 35%, transparent), inset 0 0 40px color-mix(in srgb, var(--c) 10%, transparent);
}
.nsx .ns3d-plat.warn {
  --c:var(--warn);
}
.nsx .ns3d-plat.crit {
  --c:var(--crit);
}
.nsx .ns3d-plat.unk {
  --c:var(--unk);
}
.nsx .ns3d-flab {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 12px;
  text-align: center;
  font:
    700 10px/1 ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  letter-spacing: .16em;
  color: color-mix(in srgb, var(--c) 70%, #cfe0ff);
  opacity: .6;
}
.nsx .ns3d-gate {
  position: absolute;
  width: 0;
  height: 0;
}
.nsx .ns3d-gate span {
  position: absolute;
  left: -90px;
  top: -14px;
  width: 180px;
  height: 28px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font:
    800 12px/1 ui-monospace,
    Menlo,
    monospace;
  letter-spacing: .3em;
  color: #7dd3fc;
  border: 1px solid rgba(125, 211, 252, .55);
  background: rgba(8, 47, 73, .6);
  box-shadow: 0 0 30px rgba(56, 189, 248, .45);
}
.nsx .b3 {
  position: absolute;
  transform-style: preserve-3d;
}
.nsx .b3 .f {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.nsx .b3 .fr {
  transform-origin: 50% 100%;
  transform: rotateX(-90deg);
}
.nsx .b3 .bk {
  transform-origin: 50% 0;
  transform: rotateX(90deg);
}
.nsx .b3 .rt {
  transform-origin: 100% 50%;
  transform: rotateY(90deg);
}
.nsx .b3 .lt {
  transform-origin: 0 50%;
  transform: rotateY(-90deg);
}
.nsx .node {
  --c:var(--ok);
  cursor: pointer;
}
.nsx .node.warn {
  --c:var(--warn);
}
.nsx .node.crit {
  --c:var(--crit);
}
.nsx .node.unk {
  --c:var(--unk);
}
.nsx .node .f {
  background:
    linear-gradient(
      180deg,
      #1d2e52,
      #0e1830);
  border: 1px solid rgba(148, 163, 184, .30);
}
.nsx .node .rt,
.nsx .node .lt {
  background:
    linear-gradient(
      90deg,
      #0d1730,
      #16264a);
}
.nsx .node .top {
  background:
    linear-gradient(
      135deg,
      #2a4478,
      #152850);
  border: 1px solid color-mix(in srgb, var(--c) 70%, transparent);
  box-shadow: 0 0 34px -2px color-mix(in srgb, var(--c) 75%, transparent), inset 0 0 18px color-mix(in srgb, var(--c) 25%, transparent);
}
.nsx .node.sec .top {
  background:
    linear-gradient(
      135deg,
      #1f3258,
      #122240);
  box-shadow: 0 0 18px -6px color-mix(in srgb, var(--c) 60%, transparent);
}
.nsx .node.sel .top {
  border: 2px solid #93c5fd;
  box-shadow: 0 0 44px 2px rgba(147, 197, 253, .55), inset 0 0 22px rgba(147, 197, 253, .3);
}
.nsx .nsf {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 10px;
  font:
    700 10px/1 ui-monospace,
    Menlo,
    monospace;
  color: #cfe0ff;
}
.nsx .nsf b {
  flex: 1;
  text-align: center;
  letter-spacing: .06em;
  font-size: 10px;
}
.nsx .nsvent {
  width: 26px;
  height: 60%;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(148, 163, 184, .35) 0 2px,
      transparent 2px 5px);
  border-radius: 2px;
}
.nsx .nsleds {
  display: flex;
  gap: 4px;
}
.nsx .nsleds i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--unk);
  box-shadow: 0 0 6px var(--unk);
}
.nsx .nsleds i.ok {
  background: var(--ok);
  box-shadow: 0 0 7px var(--ok);
}
.nsx .nsleds i.warn {
  background: var(--warn);
  box-shadow: 0 0 8px var(--warn);
  animation: ns3blink 1.4s steps(2) infinite;
}
.nsx .nsleds i.crit {
  background: var(--crit);
  box-shadow: 0 0 9px var(--crit);
  animation: ns3blink .8s steps(2) infinite;
}
.nsx .nstop {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.nsx .nsglyph {
  font:
    800 9px/1 ui-monospace,
    Menlo,
    monospace;
  letter-spacing: .25em;
  color: color-mix(in srgb, var(--c) 55%, #e2ecff);
}
.nsx .vip {
  --c:#1fb89a;
  cursor: default;
}
.nsx .vip.warn {
  --c:var(--warn);
}
.nsx .vip.crit {
  --c:var(--crit);
}
.nsx .vip.unk,
.nsx .vip.vuoto {
  --c:#4b5b78;
}
.nsx .vip .top {
  background: color-mix(in srgb, var(--c) 92%, #fff);
  box-shadow: 0 0 10px -2px var(--c);
}
.nsx .vip .fr,
.nsx .vip .bk {
  background: color-mix(in srgb, var(--c) 62%, #020617);
}
.nsx .vip .rt,
.nsx .vip .lt {
  background: color-mix(in srgb, var(--c) 42%, #020617);
}
.nsx .vip.warn .top,
.nsx .vip.crit .top {
  animation: ns3glow 1.6s ease-in-out infinite;
}
.nsx .vip:hover .top {
  background: #fff;
}
.nsx .ns3d-ln {
  position: absolute;
  height: 2px;
  transform-origin: 0 50%;
  background:
    linear-gradient(
      90deg,
      rgba(56, 189, 248, .05),
      rgba(56, 189, 248, .55));
  pointer-events: none;
}
.nsx .ns3d-ln.fl {
  background:
    linear-gradient(
      90deg,
      rgba(52, 211, 153, .5),
      rgba(52, 211, 153, .08));
}
.nsx .ns3d-ln.atk {
  height: 3px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--crit) 0 14px,
      transparent 14px 22px);
  box-shadow: 0 0 14px var(--crit);
  animation: ns3flow .5s linear infinite;
}
.nsx .ns3d-ha {
  position: absolute;
  --c:var(--ok);
  height: 8px;
  border-radius: 4px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--c) 0 8px,
      transparent 8px 14px);
  background-size: 14px 8px;
  box-shadow: 0 0 16px color-mix(in srgb, var(--c) 70%, transparent);
  animation: ns3ha 1s linear infinite;
}
.nsx .ns3d-ha.warn {
  --c:var(--warn);
}
.nsx .ns3d-ha.crit {
  --c:var(--crit);
}
.nsx .ns3d-pt {
  position: absolute;
  left: 0;
  top: 0;
  width: 7px;
  height: 7px;
  margin: -3.5px;
  border-radius: 50%;
  background: #bae6fd;
  box-shadow: 0 0 10px 3px rgba(56, 189, 248, .85);
  pointer-events: none;
}
.nsx .ns3d-pt.atk {
  background: #fecaca;
  box-shadow: 0 0 12px 4px rgba(248, 113, 113, .95);
}
.nsx .ns3d-ring {
  position: absolute;
  width: 240px;
  height: 240px;
  margin: -120px 0 0 -120px;
  border-radius: 50%;
  border: 2px solid var(--crit);
  box-shadow: 0 0 24px var(--crit), inset 0 0 24px rgba(248, 113, 113, .4);
  animation: ns3ring 2.4s ease-out infinite;
  pointer-events: none;
}
.nsx .ns3d-ring.r2 {
  animation-delay: 1.2s;
}
.nsx .ns3d-shield {
  position: absolute;
  width: 190px;
  height: 190px;
  margin: -95px 0 0 -95px;
  border-radius: 50%;
  pointer-events: none;
  background:
    radial-gradient(
      circle,
      rgba(248, 113, 113, .0) 45%,
      rgba(248, 113, 113, .22) 70%,
      rgba(248, 113, 113, 0) 72%);
}
.nsx .ns3d-bb {
  position: absolute;
  width: 0;
  height: 0;
  transform-style: preserve-3d;
  pointer-events: none;
}
.nsx .ns3d-bb > div {
  position: absolute;
  left: 0;
  bottom: 0;
  transform: translateX(-50%);
  white-space: nowrap;
  text-align: center;
  padding: 5px 10px;
  border-radius: 9px;
  background: rgba(6, 12, 26, .82);
  border: 1px solid rgba(148, 163, 184, .32);
  color: #e6efff;
  font:
    700 12px/1.25 ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .8);
}
.nsx .ns3d-bb em {
  display: block;
  font: 600 9px/1.3 system-ui, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  opacity: .65;
  font-style: normal;
}
.nsx .ns3d-bb .nsbbn.warn {
  border-color: rgba(251, 191, 36, .6);
}
.nsx .ns3d-bb .nsbbn.crit {
  border-color: rgba(248, 113, 113, .7);
}
.nsx .ns3d-bb .nsbbc {
  background: rgba(6, 40, 34, .8);
  border-color: rgba(52, 211, 153, .5);
  font-size: 15px;
}
.nsx .ns3d-bb .nsbba {
  background: rgba(60, 8, 16, .9);
  border-color: var(--crit);
  color: #ffe4e6;
  max-width: 280px;
  white-space: normal;
  box-shadow: 0 0 26px rgba(248, 113, 113, .55);
  font-size: 12px;
  width: 260px;
}
.nsx .ns3d-bb .nsbba em {
  opacity: .95;
  text-transform: none;
  letter-spacing: 0;
  font-size: 11px;
  margin-top: 3px;
}
.nsx .ns3d-bb .nsbba small {
  display: block;
  font: 500 10px/1.3 system-ui, sans-serif;
  opacity: .7;
  margin-top: 3px;
}
.nsx .ns3d-hud {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.nsx .ns3d-hud.tl {
  left: 20px;
  top: 18px;
  max-width: min(46%, 480px);
}
.nsx .ns3d-eyebrow {
  font: 700 10px/1.4 system-ui, sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #8fb4ff;
}
.nsx .ns3d-eyebrow .mono {
  letter-spacing: .02em;
  text-transform: none;
  color: #cfe0ff;
}
.nsx .ns3d-stato {
  --c:var(--ok);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
  font: 800 26px/1.15 system-ui, sans-serif;
  color: #fff;
  text-shadow: 0 0 24px color-mix(in srgb, var(--c) 55%, transparent);
}
.nsx .ns3d-stato.warn {
  --c:var(--warn);
}
.nsx .ns3d-stato.crit {
  --c:var(--crit);
}
.nsx .ns3d-stato.unk {
  --c:var(--unk);
}
.nsx .ns3d-pulse {
  position: relative;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--c);
  box-shadow: 0 0 14px var(--c);
  flex: none;
}
.nsx .ns3d-pulse::after {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px solid var(--c);
  animation: ns3pulse 1.8s ease-out infinite;
}
.nsx .ns3d-det {
  margin-top: 6px;
  font: 500 13px/1.4 system-ui, sans-serif;
  color: #b6c8ea;
}
.nsx .ns3d-hud.bl {
  left: 20px;
  bottom: 16px;
  right: 360px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.nsx .ns3d-prot {
  --c:var(--ok);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 10px;
  font: 600 12px/1.3 system-ui, sans-serif;
  color: #e6fff5;
  background: color-mix(in srgb, var(--c) 14%, rgba(6, 12, 26, .75));
  border: 1px solid color-mix(in srgb, var(--c) 45%, transparent);
}
.nsx .ns3d-prot.warn {
  --c:var(--warn);
  color: #fff7e0;
}
.nsx .ns3d-prot.crit {
  --c:var(--crit);
  color: #ffe4e6;
}
.nsx .ns3d-prot.unk {
  --c:var(--unk);
  color: #e2e8f0;
}
.nsx .ns3d-prot svg {
  width: 18px;
  height: 18px;
  flex: none;
  fill: color-mix(in srgb, var(--c) 22%, transparent);
  stroke: var(--c);
  stroke-width: 1.6;
}
.nsx .ns3d-prot svg .tk {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nsx .ns3d-leg {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font: 600 11px/1 system-ui, sans-serif;
  color: #9fb6dd;
}
.nsx .ns3d-leg span {
  display: flex;
  align-items: center;
  gap: 6px;
}
.nsx .ns3d-leg i {
  width: 9px;
  height: 9px;
  border-radius: 2px;
  background: #1fb89a;
  box-shadow: 0 0 8px #1fb89a;
}
.nsx .ns3d-leg i.warn {
  background: var(--warn);
  box-shadow: 0 0 8px var(--warn);
}
.nsx .ns3d-leg i.crit {
  background: var(--crit);
  box-shadow: 0 0 8px var(--crit);
}
.nsx .ns3d-legh {
  opacity: .75;
  font-weight: 500;
}
.nsx .ns3d-hint {
  position: absolute;
  z-index: 2;
  right: 350px;
  bottom: 18px;
  font: 600 10px/1 system-ui, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #6f8bbd;
  pointer-events: none;
}
.nsx .ns3d-reset {
  position: absolute;
  z-index: 3;
  right: 350px;
  top: 18px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, .35);
  background: rgba(6, 12, 26, .7);
  color: #cfe0ff;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.nsx .ns3d-reset:hover {
  border-color: #93c5fd;
  box-shadow: 0 0 16px rgba(147, 197, 253, .4);
}
.nsx .ns3d-reset svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nsx .ns3d-tip {
  position: absolute;
  z-index: 4;
  display: none;
  pointer-events: none;
  padding: 7px 10px;
  border-radius: 9px;
  background: rgba(3, 8, 20, .94);
  border: 1px solid rgba(148, 163, 184, .4);
  font: 500 12px/1.35 system-ui, sans-serif;
  color: #e6efff;
  box-shadow: 0 10px 30px -10px #000;
  max-width: 280px;
}
.nsx .ns3d-tip.on {
  display: block;
}
.nsx .ns3d-tip b {
  display: block;
  font-size: 12px;
}
.nsx .ns3d-tip span {
  color: #9fb6dd;
}
.nsx .ns3d-tip .ok {
  color: var(--ok);
}
.nsx .ns3d-tip .warn {
  color: var(--warn);
}
.nsx .ns3d-tip .crit {
  color: var(--crit);
}
.nsx .ns3d-side {
  --ok:#34d399;
  --warn:#fbbf24;
  --crit:#f87171;
  --unk:#64748b;
  position: absolute;
  z-index: 3;
  top: 14px;
  right: 14px;
  bottom: 14px;
  width: 320px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  color: #dbe7ff;
}
.nsx .ns3d-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.nsx .nsk3 {
  position: relative;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(8, 16, 34, .72);
  border: 1px solid rgba(148, 163, 184, .22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.nsx .nsk3 span {
  display: block;
  font: 700 9.5px/1.2 system-ui, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8fa9d6;
}
.nsx .nsk3 b {
  display: block;
  margin-top: 4px;
  font: 800 26px/1 system-ui, sans-serif;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
.nsx .nsk3 i {
  display: block;
  margin-top: 4px;
  font: 500 11px/1.2 system-ui, sans-serif;
  font-style: normal;
  color: #8fa9d6;
}
.nsx .nsk3.warn {
  border-color: rgba(251, 191, 36, .55);
  box-shadow: 0 0 22px -8px rgba(251, 191, 36, .6);
}
.nsx .nsk3.warn b {
  color: var(--warn);
}
.nsx .nsbar3 {
  height: 5px;
  margin-top: 7px;
  border-radius: 3px;
  background: rgba(148, 163, 184, .18);
  overflow: hidden;
}
.nsx .nsbar3 i {
  display: block;
  height: 100%;
  margin: 0;
  border-radius: 3px;
  background:
    linear-gradient(
      90deg,
      #10b981,
      #34d399);
  box-shadow: 0 0 10px rgba(52, 211, 153, .7);
}
.nsx .nsbar3.part i {
  background:
    linear-gradient(
      90deg,
      #10b981,
      #34d399 90%,
      var(--warn));
}
.nsx .ns3d-panel {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(8, 16, 34, .78);
  border: 1px solid rgba(148, 163, 184, .22);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  font: 500 12px/1.4 system-ui, sans-serif;
  scrollbar-width: thin;
}
.nsx .nsp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 10px;
}
.nsx .nsp-chips button {
  --c:var(--ok);
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .25);
  background: transparent;
  color: #b6c8ea;
  font:
    600 10px/1 ui-monospace,
    Menlo,
    monospace;
  cursor: pointer;
}
.nsx .nsp-chips button.warn {
  --c:var(--warn);
}
.nsx .nsp-chips button.crit {
  --c:var(--crit);
}
.nsx .nsp-chips button.unk {
  --c:var(--unk);
}
.nsx .nsp-chips button i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c);
  box-shadow: 0 0 6px var(--c);
}
.nsx .nsp-chips button.on {
  background: rgba(147, 197, 253, .15);
  border-color: #93c5fd;
  color: #fff;
}
.nsx .nsp-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.nsx .nsp-h a {
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  text-decoration: none;
}
.nsx .nsp-h a:hover {
  text-decoration: underline;
}
.nsx .nsp-role {
  font: 700 9px/1 system-ui, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, .35);
  color: #9fb6dd;
}
.nsx .nsp-role.pri {
  border-color: #60a5fa;
  color: #bfdbfe;
  background: rgba(59, 130, 246, .15);
}
.nsx .nsp-ck {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nsx .nsp-ck li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px dashed rgba(148, 163, 184, .16);
}
.nsx .nsp-ck li:last-child {
  border-bottom: 0;
}
.nsx .nsp-ck i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: none;
  background: var(--unk);
}
.nsx .nsp-ck i.ok {
  background: var(--ok);
  box-shadow: 0 0 8px var(--ok);
}
.nsx .nsp-ck i.warn {
  background: var(--warn);
  box-shadow: 0 0 8px var(--warn);
}
.nsx .nsp-ck i.crit {
  background: var(--crit);
  box-shadow: 0 0 8px var(--crit);
}
.nsx .nsp-ck span {
  color: #9fb6dd;
}
.nsx .nsp-ck b {
  margin-left: auto;
  text-align: right;
  font-weight: 600;
  color: #e6efff;
}
.nsx .nsp-ck b.warn {
  color: var(--warn);
}
.nsx .nsp-ck b.crit {
  color: var(--crit);
}
.nsx .nsp-ck b.unk {
  color: #94a3b8;
}
.nsx .nsp-bk {
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 10px;
  background: rgba(15, 30, 60, .6);
}
.nsx .nsp-bk > div:first-child {
  display: flex;
  justify-content: space-between;
  color: #9fb6dd;
}
.nsx .nsp-bk b {
  color: #fff;
}
.nsx .nsp-pas {
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 10px;
  background: rgba(15, 30, 60, .45);
  color: #8fa9d6;
  font-style: italic;
}
.nsx .nsp-is {
  --c:var(--warn);
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--c) 45%, transparent);
  background: color-mix(in srgb, var(--c) 9%, transparent);
}
.nsx .nsp-is.crit {
  --c:var(--crit);
}
.nsx .nsp-is b {
  display: block;
  color: #fff;
  font-size: 11px;
}
.nsx .nsp-is em {
  font-style: normal;
  color: #cbd5e1;
}
.nsx .nsp-al {
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 10px;
  border: 1px solid var(--crit);
  background: rgba(127, 29, 29, .35);
  color: #ffe4e6;
  box-shadow: 0 0 20px -6px rgba(248, 113, 113, .6);
}
.nsx .nsp-al b {
  display: block;
  font-size: 11px;
  letter-spacing: .06em;
  color: #fecaca;
}
.nsx .nsp-f {
  margin-top: 10px;
  font-size: 11px;
  color: #6f8bbd;
}
.nsx .ns3dwrap.stack .ns3d-side {
  position: static;
  width: auto;
  margin-top: 10px;
}
.nsx .ns3dwrap.stack .ns3d-kpis {
  grid-template-columns: repeat(4, 1fr);
}
.nsx .ns3dwrap.stack .ns3d-panel {
  background: #0b1428;
}
.nsx .ns3dwrap.stack .nsk3 {
  background: #0b1428;
}
.nsx .ns3dwrap.stack .ns3d-hud.bl {
  right: 16px;
}
.nsx .ns3dwrap.stack .ns3d-hint {
  display: none;
}
.nsx .ns3dwrap.stack .ns3d-reset {
  right: 14px;
}
.nsx .ns3dwrap.stack .ns3d-stato {
  font-size: 20px;
}
.nsx .ns3dwrap.stack .ns3d-hud.tl {
  max-width: calc(100% - 70px);
}
@media (max-width:560px) {
  .nsx .ns3dwrap.stack .ns3d-kpis {
    grid-template-columns: 1fr 1fr;
  }
  .nsx .ns3d-legh {
    display: none;
  }
  .nsx .ns3d-det {
    display: none;
  }
}
@keyframes ns3blink {
  50% {
    opacity: .35;
  }
}
@keyframes ns3glow {
  50% {
    box-shadow: 0 0 22px 6px var(--c);
    background: #fff;
  }
}
@keyframes ns3flow {
  to {
    background-position: 22px 0;
  }
}
@keyframes ns3ha {
  to {
    background-position: 14px 0;
  }
}
@keyframes ns3ring {
  0% {
    transform: scale(.25);
    opacity: 1;
  }
  100% {
    transform: scale(1.25);
    opacity: 0;
  }
}
@keyframes ns3pulse {
  0% {
    transform: scale(.6);
    opacity: 1;
  }
  100% {
    transform: scale(1.6);
    opacity: 0;
  }
}
@media (prefers-reduced-motion:reduce) {
  .nsx .ns3d * {
    animation: none !important;
  }
}
.nsx .ns3dwrap.stack .ns3d-leg {
  display: none;
}
.nsx .ns3dwrap.stack .ns3d-prot {
  font-size: 11px;
  padding: 6px 10px;
}
.nsx .ns3dwrap.stack .ns3d-det {
  font-size: 12px;
}
.nsx .ns3dwrap.stack .ns3d {
  height: 520px;
}
.nsx .ns3d-view {
  cursor: default;
}
.nsx .nsleds i.warn,
.nsx .nsleds i.crit,
.nsx .ns3d-pulse::after {
  animation: none;
}
.nsx .ns3d-vipbase {
  position: absolute;
  border-radius: 10px;
  background: rgba(8, 28, 46, .6);
  border: 1px solid rgba(45, 212, 191, .28);
  box-shadow: inset 0 0 30px rgba(45, 212, 191, .08);
}
.nsx .vip {
  --c:#2aa98f;
}
.nsx .vip .top {
  background: color-mix(in srgb, var(--c) 82%, #0b1f2a);
  box-shadow: none;
  border: 1px solid rgba(255, 255, 255, .06);
}
.nsx .vip.warn .top,
.nsx .vip.crit .top {
  background: color-mix(in srgb, var(--c) 90%, #fff);
  box-shadow: 0 0 12px 0 color-mix(in srgb, var(--c) 70%, transparent);
  border: 0;
  animation: none;
}
.nsx .vip:hover .top {
  background: #e0f2fe;
}
.nsx .ns3d-bb .nsbbv {
  border-color: var(--warn);
  background: rgba(58, 40, 6, .92);
  color: #fff7e0;
  font-size: 11px;
}
.nsx .ns3d-bb .nsbbv.crit {
  border-color: var(--crit);
  background: rgba(60, 8, 16, .92);
  color: #ffe4e6;
}
.nsx .ns3d-bb .nsbbv em {
  text-transform: none;
  letter-spacing: 0;
  opacity: .9;
  font-size: 10px;
}
.nsx .ns3d-bb .nsbbc.ko {
  border-color: rgba(251, 191, 36, .6);
  background: rgba(40, 30, 6, .88);
}
.nsx .nssent {
  margin: 4px 0 18px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}
.nsx .nssent-h {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.nsx .nssent-h h4 {
  margin: 0 0 2px;
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 9px;
}
.nsx .nssent-h h4::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--nsok);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--nsok) 20%, transparent);
}
.nsx .nssent-h > div > span {
  font-size: 12px;
  color: var(--tx2);
}
.nsx .nssent-badge {
  flex: none;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 11px;
  border-radius: 999px;
  letter-spacing: .03em;
}
.nsx .nssent-badge.ok {
  color: var(--nsok);
  background: color-mix(in srgb, var(--nsok) 14%, transparent);
}
.nsx .nssent-badge.warn {
  color: var(--nsw);
  background: color-mix(in srgb, var(--nsw) 16%, transparent);
}
.nsx .nsnov {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.nsx .nsnov-i {
  --c:var(--nsw);
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--c) 40%, transparent);
  background: color-mix(in srgb, var(--c) 7%, transparent);
}
.nsx .nsnov-i.crit {
  --c:var(--nsc);
}
.nsx .nsnov-i.info {
  --c:var(--acc);
}
.nsx .nsnov-i.unk {
  --c:var(--nsu);
}
.nsx .nsnov-i > .nsi {
  flex: none;
  margin-top: 2px;
}
.nsx .nsnov-b {
  flex: 1;
  min-width: 0;
}
.nsx .nsnov-t {
  display: flex;
  gap: 10px;
  align-items: baseline;
  flex-wrap: wrap;
}
.nsx .nsnov-t b {
  font-size: 13px;
}
.nsx .nsnov-t .mono {
  font-size: 11px;
  color: var(--tx2);
}
.nsx .nsnov-b p {
  margin: 3px 0 0;
  font-size: 13px;
  line-height: 1.45;
}
.nsx .nsnov-c {
  margin-top: 7px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--tx2);
  display: flex;
  gap: 10px;
}
.nsx .nsnov-c b {
  flex: none;
  color: var(--c);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding-top: 2px;
}
.nsx .nsnov-ok {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 12px;
  margin-bottom: 14px;
  font-size: 13px;
  background: color-mix(in srgb, var(--nsok) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--nsok) 30%, transparent);
}
.nsx .nsmxw {
  overflow-x: auto;
}
.nsx .nsmx {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.nsx .nsmx th {
  font-weight: 600;
  color: var(--tx2);
  text-align: center;
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
  white-space: nowrap;
}
.nsx .nsmx th:first-child,
.nsx .nsmx td:first-child {
  text-align: left;
  white-space: nowrap;
}
.nsx .nsmx td {
  padding: 6px 8px;
  border-bottom: 1px dashed var(--line);
  text-align: center;
}
.nsx .nsmx tr:last-child td {
  border-bottom: 0;
}
.nsx .nsmx td .nsi {
  width: 16px;
  height: 16px;
  vertical-align: middle;
}
.nsx .nsblind {
  margin-top: 12px;
  display: flex;
  gap: 10px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--tx2);
  padding: 9px 12px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--nsu) 10%, transparent);
}
.nsx .nsblind b {
  flex: none;
  color: var(--tx);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding-top: 2px;
}
.nsi.info {
  stroke: var(--acc);
}
.nsi.info circle {
  fill: color-mix(in srgb, var(--acc) 14%, transparent);
}
.nsx .nsevh h4 small {
  font-weight: 500;
  color: var(--tx2);
  font-size: 12px;
  margin-left: 6px;
}
.nsx .ns3d-bb .nsbbv {
  text-align: left;
  white-space: nowrap;
}
.nsx .ns3d-bb .nsbbv b {
  display: block;
  margin-bottom: 2px;
}
.nsx .ns3d-anc {
  position: absolute;
  width: 0;
  height: 0;
}
.nsx .ns3d-lab {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  z-index: 1;
  pointer-events: none;
  transform: none;
}
.nsx .ns3d-lab > div {
  left: auto;
  bottom: auto;
  transform: none;
}
.nsx .ns3d-lab > i {
  position: absolute;
  height: 1px;
  background: rgba(148, 163, 184, .6);
  transform-origin: 0 0;
}
.nsx .ns3d-view {
  cursor: grab;
}
.nsx .ns3d-view.grab {
  cursor: grabbing;
}
.nsx .ns3d-lab {
  transition: opacity .15s;
}
.nspage .nsx .ns3d {
  height: 680px;
}
.nsx .b3 .f {
  padding: 0;
  margin: 0;
  gap: 0;
  z-index: auto;
  min-width: 0;
  min-height: 0;
}
.nspage .nsintro {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 16px;
  margin: 0 0 18px;
  align-items: stretch;
}
.nspage .nsscopo,
.nspage .nscve {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 16px;
  margin: 0;
}
.nspage .nsscopo {
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.nspage .nsbox-h {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.nspage .nsbox-ico {
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: var(--acc);
  background: var(--accbg);
}
.nspage .nsbox-ico svg {
  width: 22px;
  height: 22px;
}
.nspage .nsscopo h2 {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 700;
  color: var(--tx);
}
.nspage .nsscopo p {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--tx2);
}
.nspage .nsscopo-l {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
  gap: 8px 12px;
}
.nspage .nsscopo-l li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--panel2);
  border: 1px solid var(--line);
  font-size: 13px;
  line-height: 1.35;
  color: var(--tx);
}
.nspage .nsscopo-l li em {
  font-style: normal;
  color: var(--tx3);
}
.nspage .nsscopo-l b {
  flex: none;
  min-width: 48px;
  text-align: center;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 3px 0;
  border-radius: 999px;
}
.nspage .nsscopo-l b.crit {
  color: var(--crit);
  background: var(--critbg);
}
.nspage .nsscopo-l b.warn {
  color: var(--warn);
  background: var(--warnbg);
}
.nspage .nsscopo .nsscopo-no {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 12.5px;
  color: var(--tx3);
}
.nspage .nsscopo-no svg {
  flex: none;
  width: 16px;
  height: 16px;
  margin-top: 1px;
}
.nspage .nscve {
  --s:var(--ok);
  --sbg:var(--okbg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.nspage .nscve.warn {
  --s:var(--warn);
  --sbg:var(--warnbg);
}
.nspage .nscve.crit {
  --s:var(--crit);
  --sbg:var(--critbg);
  border-color: var(--crit);
  box-shadow: 0 0 0 1px var(--crit), 0 10px 28px var(--critbg);
}
.nspage .nscve-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  background: var(--sbg);
  border-bottom: 1px solid var(--line);
}
.nspage .nscve-scudo {
  flex: none;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: var(--s);
  background: var(--panel);
  box-shadow: inset 0 0 0 1.5px var(--s);
}
.nspage .nscve-scudo svg {
  width: 32px;
  height: 32px;
}
.nspage .nscve.crit .nscve-scudo {
  color: #fff;
  background: var(--crit);
  box-shadow: none;
}
.nspage .nscve-tit {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.nspage .nscve-eti {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--tx3);
}
.nspage .nscve-tit strong {
  font-size: 23px;
  line-height: 1.2;
  font-weight: 700;
  color: var(--s);
}
.nspage .nscve-sotto {
  font-size: 13px;
  line-height: 1.45;
  color: var(--tx2);
}
.nspage .nscve-meta {
  margin: 0;
  padding: 16px 22px 2px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 20px;
}
.nspage .nscve-meta dt {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--tx3);
  margin: 0 0 4px;
}
.nspage .nscve-meta dd {
  margin: 0;
  font-size: 13.5px;
  color: var(--tx);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.nspage .nscve-meta small {
  color: var(--tx3);
  font-size: 12px;
}
.nspage .nscve-meta a {
  color: var(--acc);
  font-weight: 600;
  text-decoration: none;
}
.nspage .nscve-meta a:hover {
  text-decoration: underline;
}
.nspage .nscve-meta .mono {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 12.5px;
}
.nspage .nscve-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ok);
}
.nspage .nscve-dot.warn {
  background: var(--warn);
}
.nspage .nspill {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.nspage .nspill.crit {
  color: var(--crit);
  background: var(--critbg);
}
.nspage .nspill.warn {
  color: var(--warn);
  background: var(--warnbg);
}
.nspage .nscve-avviso {
  margin: 10px 22px 0;
  padding: 8px 12px;
  border-radius: 10px;
  background: var(--warnbg);
  color: var(--warn);
  font-size: 12.5px;
  font-weight: 600;
}
.nspage .nscve-app {
  list-style: none;
  margin: 0;
  padding: 14px 22px 20px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
}
.nspage .nscve-app li {
  --a:var(--ok);
  --abg:var(--okbg);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 10px;
  row-gap: 1px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--a);
  background: var(--panel2);
}
.nspage .nscve-app li.warn,
.nspage .nscve-app li.unk {
  --a:var(--warn);
  --abg:var(--warnbg);
}
.nspage .nscve-app li.crit {
  --a:var(--crit);
  --abg:var(--critbg);
  background: var(--critbg);
}
.nspage .nscve-app .h {
  grid-column: 1;
  grid-row: 1;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-weight: 600;
  font-size: 12.5px;
  color: var(--tx);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nspage .nscve-app .v {
  grid-column: 1;
  grid-row: 2;
  font-size: 12px;
  color: var(--tx3);
}
.nspage .nscve-app b {
  grid-column: 2;
  grid-row: 1/3;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--a);
  background: var(--abg);
  white-space: nowrap;
}
.nspage .nscve-app li.ok b::before {
  content: "✓ ";
}
.nspage .nscve-app li.crit b,
.nspage .nscve-app li.warn b {
  color: #fff;
  background: var(--a);
}
.nspage .nscve-app li.crit b::before,
.nspage .nscve-app li.warn b::before {
  content: "! ";
}
@media (max-width:1180px) {
  .nspage .nsintro {
    grid-template-columns: 1fr;
  }
}
@media (max-width:640px) {
  .nspage .nsscopo-l {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
  }
  .nspage .nscve-meta {
    grid-template-columns: 1fr;
  }
}
.s3 {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  margin: 0 0 18px;
  overflow: hidden;
}
.s3-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
}
.s3-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 650;
  color: var(--tx);
  letter-spacing: -.01em;
}
.s3-sub {
  margin: 3px 0 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--tx2);
}
.s3-sub b {
  color: var(--tx);
  font-weight: 600;
}
.s3-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 14px;
  align-items: stretch;
}
.s3.stack .s3-body {
  grid-template-columns: minmax(0, 1fr);
}
.s3-stage {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  min-height: 280px;
  background:
    radial-gradient(
      120% 90% at 50% 0%,
      #16224a 0%,
      #0b1226 55%,
      #070b18 100%);
  border: 1px solid #223056;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.s3-stage canvas {
  display: block;
  cursor: grab;
  touch-action: pan-y;
}
.s3-stage.grab canvas {
  cursor: grabbing;
}
.s3-cov {
  position: absolute;
  left: 12px;
  top: 10px;
  display: flex;
  flex-direction: column;
  pointer-events: none;
}
.s3-cov b {
  font-size: 34px;
  line-height: 1;
  font-weight: 700;
  color: #e6ebf5;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.s3-cov b small {
  font-size: .5em;
  font-weight: 600;
  margin-left: 1px;
  color: #9aa7c2;
}
.s3-cov span {
  margin-top: 4px;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #9aa7c2;
}
.s3-reset {
  position: absolute;
  right: 10px;
  top: 10px;
  font: inherit;
  font-size: 12px;
  color: #cbd5f5;
  background: rgba(15, 23, 48, .72);
  border: 1px solid #2c3a66;
  border-radius: 999px;
  padding: 7px 12px;
  cursor: pointer;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.s3-reset:hover {
  color: #fff;
  border-color: #4b62a8;
}
.s3-hint {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 8px;
  text-align: center;
  font-size: 11px;
  color: #7f8db0;
  pointer-events: none;
}
.s3-tip {
  position: absolute;
  display: none;
  pointer-events: none;
  background: rgba(10, 15, 32, .94);
  border: 1px solid #2c3a66;
  border-radius: 8px;
  padding: 6px 9px;
  font-size: 12px;
  color: #e6ebf5;
  white-space: nowrap;
  z-index: 2;
}
.s3-tip.on {
  display: block;
}
.s3-tip span {
  display: block;
  color: #9aa7c2;
  margin-top: 2px;
}
.s3-leg {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin: 10px 2px 0;
  padding: 0;
  list-style: none;
  font-size: 12px;
  color: var(--tx2);
}
.s3-leg li {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.s3-leg i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  flex: none;
}
.s3-leg i.gh {
  background: rgba(248, 113, 113, .22);
  border: 1px solid #f87171;
}
.s3-leg i.gw {
  background: rgba(251, 191, 36, .22);
  border: 1px solid #fbbf24;
}
.s3-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.s3-k {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.s3-k a,
.s3-k div {
  display: block;
  text-decoration: none;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  min-width: 0;
}
.s3-k b {
  display: block;
  font-size: 22px;
  line-height: 1.1;
  font-weight: 700;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
}
.s3-k span {
  display: block;
  margin-top: 3px;
  font-size: 11.5px;
  color: var(--tx2);
}
.s3-k .ok b {
  color: var(--ok);
}
.s3-k .crit b {
  color: var(--crit);
}
.s3-k .warn b {
  color: var(--warn);
}
.s3-panel {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
  font-size: 13px;
  color: var(--tx);
  min-width: 0;
  flex: 1;
}
.s3p-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.s3p-h a {
  color: var(--acc);
  font-weight: 600;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.s3pill {
  flex: none;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid currentColor;
}
.s3pill.ok {
  color: var(--ok);
}
.s3pill.warn {
  color: var(--warn);
}
.s3pill.crit {
  color: var(--crit);
}
.s3p-l {
  list-style: none;
  margin: 0;
  padding: 0;
}
.s3p-l li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 5px 0;
  border-top: 1px solid var(--line);
}
.s3p-l span {
  color: var(--tx2);
  flex: none;
}
.s3p-l b {
  font-weight: 600;
  text-align: right;
  min-width: 0;
  overflow-wrap: anywhere;
}
.s3p-l b.crit {
  color: var(--crit);
}
.s3p-l b.warn {
  color: var(--warn);
}
.s3p-l b.dim {
  color: var(--tx2);
  font-weight: 500;
}
.s3p-n,
.s3p-e {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--tx2);
}
.s3p-t {
  margin: 12px 0 6px;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--tx2);
}
.s3p-top {
  list-style: none;
  margin: 0;
  padding: 0;
}
.s3p-top button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  font: inherit;
  font-size: 13px;
  color: var(--tx);
  background: none;
  border: 0;
  border-radius: 7px;
  padding: 7px 6px;
  cursor: pointer;
  text-align: left;
  min-height: 36px;
}
.s3p-top button:hover,
.s3p-top button.on {
  background: rgba(56, 189, 248, .10);
}
.s3p-top i {
  width: 9px;
  height: 9px;
  border-radius: 2px;
  flex: none;
}
.s3p-top span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.s3p-top b {
  font-variant-numeric: tabular-nums;
  color: var(--crit);
}
.s3.stack {
  padding: 12px;
}
.s3.stack .s3-k {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.s3.stack .s3-k b {
  font-size: 18px;
}
@media (max-width:520px) {
  .s3.stack .s3-k {
    grid-template-columns: 1fr 1fr;
  }
  .s3-cov b {
    font-size: 30px;
  }
  .s3-head h2 {
    font-size: 17px;
  }
}
.s3-foot {
  margin: 8px 2px 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--tx2);
}
.st3 .s3-leg i.st3-arc {
  height: 2px;
  width: 14px;
  border-radius: 2px;
  background: #7dd3fc;
  box-shadow: 0 0 6px #38bdf8;
}
.st3-pools {
  list-style: none;
  margin: 0;
  padding: 0;
}
.st3-pools li {
  padding: 7px 0;
  border-top: 1px solid var(--line);
}
.st3-pools li:first-child {
  border-top: 0;
  padding-top: 0;
}
.st3-pn {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}
.st3-pn span {
  min-width: 0;
  overflow-wrap: anywhere;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 12.5px;
}
.st3-pn b {
  flex: none;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.st3-pn b.ok,
.s3p-top b.ok {
  color: var(--ok);
}
.st3-pn b.warn,
.st3 .s3p-top b.warn {
  color: var(--warn);
}
.st3-pn b.crit,
.st3 .s3p-top b.crit {
  color: var(--crit);
}
.st3 .s3p-top b {
  color: var(--tx);
}
.st3-bar {
  height: 6px;
  border-radius: 3px;
  background: var(--line);
  overflow: hidden;
  margin: 5px 0 4px;
}
.st3-bar i {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--tx2);
}
.st3-bar i.ok {
  background: var(--ok);
}
.st3-bar i.warn {
  background: var(--warn);
}
.st3-bar i.crit {
  background: var(--crit);
}
.st3-pd {
  font-size: 12px;
  line-height: 1.4;
  color: var(--tx2);
}
.st3 .s3p-top span {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.st3 .s3p-top span span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.st3 .s3p-top small {
  font-size: 11.5px;
  color: var(--tx2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.st3 .s3p-l span .mono {
  color: var(--tx);
}
.st3 .s3p-l b.ok {
  color: var(--ok);
}
.st3 .s3p-n a {
  color: var(--acc);
  text-decoration: none;
}
.st3 .s3p-n.st3-ev {
  color: var(--warn);
}
.salanno {
  font-size: 13px;
  font-weight: 650;
  color: var(--tx3);
  margin: 18px 0 8px;
  letter-spacing: .02em;
}
.sallist {
  display: grid;
  gap: 8px;
}
.salitem {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
}
.salitem svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--tx3);
}
.salitem .per {
  font-weight: 650;
  min-width: 132px;
}
.salitem .tit {
  flex: 1;
  min-width: 0;
  color: var(--tx2);
}
.salitem .az {
  display: flex;
  gap: 8px;
  flex: none;
}
.salitem a.linkbtn,
.salaz a.linkbtn {
  text-decoration: none;
  display: inline-block;
}
.salaz {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.salaz form {
  margin: 0;
}
.salaz .linkbtn.primary,
.salform .linkbtn.primary {
  background: var(--acc);
  color: #fff;
  border-color: var(--acc);
}
.salaz details summary {
  list-style: none;
  cursor: pointer;
  display: inline-block;
}
.salaz details summary::-webkit-details-marker {
  display: none;
}
.salaz details[open] {
  display: flex;
  gap: 6px;
  align-items: center;
}
.salaz .linkbtn.peric {
  border-color: var(--crit);
  color: var(--crit);
}
.salform {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: flex-end;
  margin: 8px 0 20px;
}
.salform label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--tx3);
}
.salform input[type=text],
.salform input[type=number],
.salform input[type=file],
.salform select {
  width: auto;
  font: inherit;
  font-size: 13px;
  color: var(--tx);
  background: var(--bg2);
  border: 1px solid var(--line2);
  border-radius: 8px;
  padding: 7px 9px;
}
.salform .tit input {
  min-width: 280px;
}
@media (max-width:640px) {
  .salitem {
    flex-wrap: wrap;
  }
  .salitem .per {
    min-width: 0;
  }
  .salitem .tit {
    flex-basis: 100%;
    order: 3;
  }
  .salform .tit,
  .salform .tit input {
    min-width: 0;
    width: 100%;
  }
}
.bkp .bkerr {
  margin-top: 14px;
  line-height: 1.55;
}
.bkp .bkerr b {
  color: var(--tx);
}
.bkhero {
  margin-top: 16px;
  padding: 18px 20px 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
.bktiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}
.bkt {
  padding: 12px 14px;
  border-radius: 10px;
  background: var(--neubg);
  border: 1px solid var(--line);
  min-width: 0;
}
.bkt b {
  display: block;
  font-size: 26px;
  font-weight: 650;
  letter-spacing: -.02em;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.bkt span {
  display: block;
  margin-top: 4px;
  font-size: 11.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tx3);
}
.bkt.ok b {
  color: var(--ok);
}
.bkt.ok {
  background: var(--okbg);
  border-color: transparent;
}
.bkt.crit b {
  color: var(--crit);
}
.bkt.crit {
  background: var(--critbg);
  border-color: transparent;
}
.bkt.unk b {
  color: var(--unk);
}
.bkt.unk {
  background: var(--unkbg);
  border-color: transparent;
}
.bkt.cli b {
  color: var(--acc);
}
.bkt.cli {
  background: var(--accbg);
  border-color: transparent;
}
.bkt.na b {
  color: var(--tx2);
}
.bkhero .cbar {
  margin-top: 14px;
  height: 6px;
}
.bkfonti {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 4px;
  margin-top: 14px;
}
.bkfonti .lbl {
  font-size: 11.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tx3);
  margin-right: 6px;
}
.bkfonti .sezmarca:first-of-type {
  border-left: 0;
  padding-left: 0;
  margin-left: 0;
}
.bkhero .sub {
  margin-top: 12px;
}
.bkp > .note {
  margin-top: 12px;
}
.bkp details.sez {
  margin-top: 12px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 0 18px;
}
.bkp details.sez > summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
  padding: 14px 26px 14px 0;
  position: relative;
  font-size: 15px;
  font-weight: 600;
  color: var(--tx);
}
.bkp details.sez > summary::before {
  content: none;
}
.bkp details.sez > summary::after {
  content: "";
  position: absolute;
  right: 4px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--tx3);
  border-bottom: 2px solid var(--tx3);
  transform: translateY(-70%) rotate(45deg);
  transition: transform .15s;
}
.bkp details.sez[open] > summary::after {
  transform: translateY(-30%) rotate(-135deg);
}
.bkp details.sez > summary:hover {
  color: var(--acc);
}
.bkp details.sez > summary .cnt {
  font-size: 12.5px;
  font-weight: 400;
  color: var(--tx3);
}
.bkp details.sez[open] > summary {
  border-bottom: 1px solid var(--line);
  margin-bottom: 14px;
}
.bkp details.sez[open] {
  padding-bottom: 16px;
}
.bkp details.sez.daverificare {
  border-color: var(--crit);
  border-color: color-mix(in srgb, var(--crit) 45%, var(--line));
}
.bkp details.sez details.sez {
  background: var(--panel2,var(--bg2));
}
.bkp details.sez .tbl {
  margin-top: 0;
}
.bkp .bkcal .calbar {
  margin-top: 0;
}
@media (max-width:640px) {
  .bktiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .bkt b {
    font-size: 22px;
  }
  .bkhero {
    padding: 14px;
  }
  .bkp details.sez {
    padding: 0 12px;
  }
}
.svctags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0 4px;
}
.svctags.sm {
  margin: 5px 0 0;
  gap: 4px;
}
.svctag {
  font-size: 12px;
  line-height: 1.5;
  padding: 1px 8px;
  border-radius: 10px;
  border: 1px solid var(--line2);
  color: var(--tx2);
  white-space: nowrap;
}
.svctags.sm .svctag {
  font-size: 11px;
  padding: 0 6px;
}
.svctag b {
  font-weight: 600;
  color: var(--tx1,inherit);
}
.svctag.mod {
  border-style: dashed;
}
.bk3 {
  margin-top: 16px;
}
.bk3 .s3-body {
  align-items: start;
}
.bk3 .s3-panel {
  overflow-y: auto;
  overscroll-behavior: contain;
}
.bk3 .s3-leg i.bk3-srv {
  background: linear-gradient(#34477a, #18213d);
  border: 1px solid #94a3c8;
}
.bk3 .s3-leg i.bk3-rep {
  background: linear-gradient(transparent 40%, #38bdf8 40%);
  border: 1px solid #93c5fd;
}
.bk3 .s3-leg i.bk3-imm {
  background: #5eead4;
  border-radius: 3px 3px 2px 2px;
}
.bk3 .s3-leg i.bk3-tap {
  background: linear-gradient(#4b3d82, #221b40);
  border: 1px solid #c4b5fd;
}
.bk3 .s3-leg i.bk3-l {
  height: 0;
  width: 16px;
  border-radius: 0;
  background: none;
  border-top: 2px dashed #94a3b8;
}
.bk3 .s3-leg i.bk3-lt {
  border-top-style: dotted;
}
.bk3 .s3-k b small {
  font-size: .55em;
  font-weight: 600;
  color: var(--tx2);
}
.bk3 .s3p-h .bk3-n {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.bk3-esiti {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin: 10px 0 2px;
}
.bk3-esiti div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px 4px;
  text-align: center;
  min-width: 0;
}
.bk3-esiti b {
  display: block;
  font-size: 17px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.bk3-esiti span {
  display: block;
  font-size: 10.5px;
  color: var(--tx2);
  margin-top: 1px;
}
.bk3-esiti .ok b {
  color: var(--ok);
}
.bk3-esiti .warn b {
  color: var(--warn);
}
.bk3-esiti .crit b {
  color: var(--crit);
}
.bk3-esiti .run b {
  color: var(--acc);
}
.bk3-jl {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 12.5px;
}
.bk3-jl li {
  padding: 4px 0 4px 10px;
  border-top: 1px solid var(--line);
  position: relative;
  overflow-wrap: anywhere;
}
.bk3-jl li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--tx3);
}
.bk3-jl li.crit::before {
  background: var(--crit);
}
.bk3-jl li.warn::before {
  background: var(--warn);
}
.bk3-jl li.dim {
  color: var(--tx2);
}
.bk3-jl li.dim::before {
  display: none;
}
.bk3 .st3-pools li {
  padding: 7px 0;
  border-top: 1px solid var(--line);
}
.bk3 .st3-pools li:first-child {
  border-top: 0;
  padding-top: 0;
}
.bk3 .st3-pn {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}
.bk3 .st3-pn span {
  min-width: 0;
  overflow-wrap: anywhere;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 12px;
}
.bk3 .st3-pn b {
  flex: none;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.bk3 .st3-pn b.ok {
  color: var(--ok);
}
.bk3 .st3-pn b.warn {
  color: var(--warn);
}
.bk3 .st3-pn b.crit {
  color: var(--crit);
}
.bk3 .st3-bar {
  height: 6px;
  border-radius: 3px;
  background: var(--line);
  overflow: hidden;
  margin: 5px 0 4px;
}
.bk3 .st3-bar.bk3-big {
  height: 10px;
  border-radius: 5px;
  margin: 4px 0 6px;
}
.bk3 .st3-bar i {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--tx2);
}
.bk3 .st3-bar i.ok {
  background: var(--acc);
}
.bk3 .st3-bar i.warn {
  background: var(--warn);
}
.bk3 .st3-bar i.crit {
  background: var(--crit);
}
.bk3 .st3-pd {
  font-size: 12px;
  line-height: 1.4;
  color: var(--tx2);
}
.bk3 .s3p-top span {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.bk3 .s3p-top small {
  font-size: 11.5px;
  color: var(--tx2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bk3 .s3p-top b.ok {
  color: var(--ok);
}
.bk3 .s3p-top b.warn {
  color: var(--warn);
}
.bk3 .s3p-l b.ok {
  color: var(--ok);
}
.bk3 .s3p-n a {
  color: var(--acc);
  text-decoration: none;
}
.bk3 .s3p-n.crit {
  color: var(--crit);
}
.bk3 .s3p-l a {
  color: var(--acc);
  text-decoration: none;
}
.cal2-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0 0 10px;
}
.cal2-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cal2-chips button {
  font: inherit;
  font-size: 12.5px;
  color: var(--tx2);
  background: var(--neubg,transparent);
  border: 1px solid var(--line2);
  border-radius: 99px;
  padding: 5px 11px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
}
.cal2-chips button b {
  font-weight: 650;
  color: var(--tx);
  font-variant-numeric: tabular-nums;
}
.cal2-chips button:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.cal2-chips button.on {
  background: var(--panel-hi);
  border-color: var(--acc);
  color: var(--tx);
}
.cal2-chips button.attn {
  border-color: color-mix(in srgb, var(--crit) 55%, var(--line2));
}
.cal2-chips button.attn b {
  color: var(--crit);
}
.cal2-chips button.attn.on {
  background: var(--critbg,rgba(248,113,113,.14));
  border-color: var(--crit);
}
.cal2-q {
  flex: 1 1 220px;
  min-width: 180px;
  max-width: 360px;
  font: inherit;
  font-size: 13px;
  color: var(--tx);
  background: var(--bg);
  border: 1px solid var(--line2);
  border-radius: 9px;
  padding: 7px 11px;
  min-height: 34px;
}
.cal2-q:focus {
  outline: none;
  border-color: var(--acc);
}
.cal2-all {
  font: inherit;
  font-size: 12.5px;
  color: var(--tx2);
  background: none;
  border: 1px solid var(--line2);
  border-radius: 9px;
  padding: 6px 11px;
  cursor: pointer;
  min-height: 32px;
}
.cal2-all:hover {
  border-color: var(--acc);
  color: var(--tx);
}
table.cal2 {
  width: 100%;
}
table.cal2 td.jobcol {
  min-width: 280px;
  max-width: 380px;
}
table.cal2 thead th {
  position: sticky;
  top: 0;
  background: var(--panel);
  z-index: 2;
}
table.cal2 tr.cal2-tot td {
  border-bottom: 2px solid var(--line2);
  padding-top: 6px;
  padding-bottom: 8px;
}
table.cal2 tr.cal2-tot td.jobcol b {
  display: block;
  font-size: 13px;
  color: var(--tx);
}
table.cal2 tr.cal2-tot td.jobcol span {
  display: block;
  font-size: 11px;
  color: var(--tx3);
}
table.cal2 td.c.agg i,
table.cal2 td.c.agg.aggwa i,
table.cal2 td.c.agg.aggcr i {
  height: 20px;
  border-radius: 4px;
}
table.cal-settimana.cal2 td.c.agg i {
  height: 28px;
}
table.cal2 tr.cal2-gh td {
  background: var(--panel-hi);
  border-top: 1px solid var(--line2);
}
table.cal2 tbody.cal2-g:first-of-type tr.cal2-gh td {
  border-top: 0;
}
.cal2-tog {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  font: inherit;
  color: var(--tx);
  background: none;
  border: 0;
  padding: 4px 0;
  cursor: pointer;
  text-align: left;
  min-height: 34px;
}
.cal2-car {
  flex: none;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--tx2);
  border-bottom: 2px solid var(--tx2);
  transform: rotate(-45deg);
  transition: transform .15s;
  margin: 0 3px 0 2px;
}
tbody.cal2-g.open .cal2-car,
table.cal2.filtro .cal2-car {
  transform: rotate(45deg);
}
.cal2-gn {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.cal2-gn b {
  font-size: 13.5px;
  font-weight: 650;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
}
.cal2-gn small {
  font-size: 11px;
  color: var(--tx3);
}
.cal2-gc {
  margin-left: auto;
  font-size: 11.5px;
  color: var(--tx2);
  white-space: nowrap;
  padding-left: 8px;
}
.cal2-gc em {
  font-style: normal;
  color: var(--crit);
  font-weight: 600;
}
table.cal2:not(.filtro) tbody.cal2-g:not(.open) tr.cal2-r:not(.attn) {
  display: none;
}
table.cal2 tr.cal2-r.hid {
  display: none !important;
}
table.cal2 tr.cal2-r td.jobcol {
  padding-left: 22px;
}
table.cal2 tr.cal2-r.a2 td.jobcol {
  box-shadow: inset 3px 0 0 var(--crit);
}
table.cal2 tr.cal2-r.a1 td.jobcol {
  box-shadow: inset 3px 0 0 var(--warn);
}
table.cal2 tr.cal2-r.nostorico td.c i {
  opacity: .55;
}
table.cal2 td.jobcol .jn {
  display: flex;
  align-items: baseline;
  gap: 7px;
  min-width: 0;
}
table.cal2 td.jobcol .jn .mono {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
table.cal2 td.jobcol .jm {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 8px;
}
table.cal2 td.jobcol .tgt {
  font-size: 11px;
  color: var(--tx3);
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  overflow-wrap: anywhere;
}
.kb {
  flex: none;
  font-size: 9.5px;
  font-weight: 650;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 5px;
  border: 1px solid var(--line2);
  color: var(--tx2);
}
.kb.k-copia {
  color: #5eead4;
  border-color: rgba(94, 234, 212, .4);
  background: rgba(94, 234, 212, .08);
}
.kb.k-nastro {
  color: #c4b5fd;
  border-color: rgba(196, 181, 253, .45);
  background: rgba(196, 181, 253, .08);
}
.kb.k-agent {
  color: #fdba74;
  border-color: rgba(253, 186, 116, .45);
  background: rgba(253, 186, 116, .08);
}
.kb.k-backup {
  color: #93c5fd;
  border-color: rgba(147, 197, 253, .4);
  background: rgba(147, 197, 253, .08);
}
:root[data-theme=light] .kb.k-copia {
  color: #0f766e;
}
:root[data-theme=light] .kb.k-nastro {
  color: #6d28d9;
}
:root[data-theme=light] .kb.k-agent {
  color: #c2410c;
}
:root[data-theme=light] .kb.k-backup {
  color: #1d4ed8;
}
.callegend i.sw.agg {
  border-radius: 3px;
}
@media (max-width:640px) {
  table.cal2 td.jobcol {
    min-width: 200px;
  }
  .cal2-gc {
    display: none;
  }
  .cal2-q {
    max-width: none;
  }
}
.nt {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.nt-sez {
  min-width: 0;
}
.nt-h {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
  color: var(--tx);
}
.nt-h4 {
  margin: 18px 0 8px;
  font-size: 13.5px;
  font-weight: 650;
  color: var(--tx);
  display: flex;
  align-items: center;
  gap: 8px;
}
.nt-h4 .cnt {
  font-weight: 500;
  color: var(--tx3);
}
.nt-sub {
  margin: 4px 0 10px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--tx2);
  max-width: 900px;
}
.nt-sub b.ok {
  color: var(--ok);
}
.nt-sub b.warn {
  color: var(--warn);
}
.nt-sub b.crit {
  color: var(--crit);
}
.nt-map {
  overflow-x: auto;
}
.nt-map table {
  border-collapse: separate;
  border-spacing: 4px;
  width: 100%;
}
.nt-map th {
  font-weight: 500;
  text-align: left;
  white-space: nowrap;
  padding: 0 10px 0 0;
}
.nt-map tbody th b {
  display: block;
  font-size: 12.5px;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  color: var(--tx);
}
.nt-map tbody th small {
  display: block;
  font-size: 10.5px;
  color: var(--tx3);
}
.nt-map tr.tot th b {
  font-family: inherit;
  font-weight: 650;
}
.nt-map thead th {
  text-align: center;
  padding: 0;
}
.nt-map thead th a {
  display: block;
  text-decoration: none;
  color: var(--tx2);
  padding: 2px 0;
  border-radius: 6px;
}
.nt-map thead th i {
  display: block;
  font-style: normal;
  font-size: 9.5px;
  text-transform: uppercase;
  color: var(--tx3);
}
.nt-map thead th b {
  display: block;
  font-size: 12px;
  font-weight: 600;
}
.nt-map thead th.sel a {
  background: var(--accbg,rgba(56,189,248,.14));
  color: var(--acc);
}
.nt-map thead th.oggi b {
  color: var(--acc);
}
.nt-map td {
  padding: 0;
  min-width: 30px;
}
.nc {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  border-radius: 7px;
  text-decoration: none;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #fff;
  transition: transform .1s, box-shadow .1s;
}
.nc:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}
.nc.ok {
  background: var(--ok);
}
.nc.wa {
  background: var(--warn);
  color: #1f1300;
}
.nc.cr {
  background: var(--crit);
}
.nc.rn {
  background: transparent;
  border: 2px solid var(--acc);
}
.nc.vuota {
  background: var(--neubg,rgba(255,255,255,.05));
  border: 1px dashed var(--line2);
}
.nt-map tr.tot .nc {
  height: 36px;
  font-size: 13px;
}
.nt-map td.sel .nc {
  box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--acc);
}
.nt-sel {
  background: var(--panel2,var(--bg2));
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 16px;
}
.nt-selh {
  display: flex;
  align-items: center;
  gap: 10px;
}
.nt-selh .nt-h {
  flex: 1;
  text-align: center;
  font-size: 16px;
}
.nt-nav {
  width: 32px;
  height: 32px;
  line-height: 30px;
  text-align: center;
  border-radius: 9px;
  border: 1px solid var(--line2);
  color: var(--tx2);
  text-decoration: none;
  font-size: 18px;
}
.nt-nav:hover {
  border-color: var(--acc);
  color: var(--tx);
}
.nt-nav.off {
  opacity: .3;
}
.nt-kpi {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.nt-kpi div {
  flex: 1 1 110px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px 12px;
  min-width: 0;
}
.nt-kpi b {
  display: block;
  font-size: 22px;
  line-height: 1.1;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--tx);
}
.nt-kpi b small {
  font-size: .55em;
  font-weight: 600;
  color: var(--tx2);
}
.nt-kpi span {
  display: block;
  margin-top: 2px;
  font-size: 11.5px;
  color: var(--tx2);
}
.nt-kpi .ok b {
  color: var(--ok);
}
.nt-kpi .warn b {
  color: var(--warn);
}
.nt-kpi .crit b {
  color: var(--crit);
}
.nt-kpi .run b {
  color: var(--acc);
}
.nt-kpi .big {
  flex: 1.4 1 150px;
}
.nt-kpi .big b {
  font-size: 28px;
}
.nt-tl {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 6px 6px 2px;
  overflow: hidden;
}
.nt-tl svg {
  display: block;
  width: 100%;
  height: auto;
}
.nt-buio {
  fill: rgba(56, 100, 200, .07);
}
:root[data-theme=light] .nt-buio {
  fill: rgba(30, 64, 175, .06);
}
.nt-ora {
  stroke: var(--line);
  stroke-width: 1;
}
.nt-oral {
  fill: var(--tx3);
  font-size: 11px;
  text-anchor: middle;
  font-family: system-ui, sans-serif;
}
.nt-lane {
  fill: var(--bg);
  stroke: var(--line);
  stroke-width: 1;
  opacity: .55;
}
.nt-ln {
  fill: var(--tx);
  font-size: 13px;
  font-weight: 650;
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
}
.nt-ls {
  fill: var(--tx2);
  font-size: 11px;
  font-family: system-ui, sans-serif;
}
.nt-bar {
  stroke: rgba(0, 0, 0, .15);
  stroke-width: .5;
  cursor: default;
}
.nt-bar:hover {
  stroke: var(--tx);
  stroke-width: 1.5;
}
.nt-bar.b-ok {
  fill: var(--ok);
}
.nt-bar.b-warn {
  fill: var(--warn);
}
.nt-bar.b-crit {
  fill: var(--crit);
}
.nt-bar.b-run {
  fill: var(--acc);
}
.nt-bar.b-unk {
  fill: #94a3b8;
}
.nt-bar.b-copia {
  fill-opacity: .5;
}
.callegend i.sw.nt-copia {
  background: var(--ok);
  opacity: .5;
}
.nt-leg {
  margin-top: 8px;
}
table.nt-pr td {
  vertical-align: middle;
}
.nt-tg {
  font-size: 11px;
  color: var(--tx3);
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  margin-top: 2px;
}
.nt-strip {
  display: inline-flex;
  gap: 2px;
  vertical-align: middle;
}
.nt-strip i {
  display: block;
  width: 9px;
  height: 16px;
  border-radius: 2px;
  background: var(--neubg,rgba(255,255,255,.06));
  border: 1px solid var(--line);
}
.nt-strip i.ok {
  background: var(--ok);
  border-color: transparent;
}
.nt-strip i.wa {
  background: var(--warn);
  border-color: transparent;
}
.nt-strip i.cr {
  background: var(--crit);
  border-color: transparent;
}
.nt-strip i.rn {
  border-color: var(--acc);
}
.nt-strip i.un {
  background: #94a3b8;
  border-color: transparent;
}
.nt-strip i.sel {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
}
.nt-ok {
  margin: 12px 0 2px;
  font-size: 13px;
  color: var(--ok);
}
.nt-ric {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
  gap: 8px;
}
.nt-ric li {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--panel2,var(--bg2));
  border: 1px solid var(--line);
  border-left: 3px solid var(--crit);
  border-radius: 10px;
  padding: 9px 12px;
  min-width: 0;
}
.nt-rn {
  flex: none;
  text-align: center;
  width: 44px;
}
.nt-rn b {
  display: block;
  font-size: 22px;
  line-height: 1;
  font-weight: 750;
}
.nt-rn small {
  font-size: 10px;
  color: var(--tx3);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.nt-rj {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nt-rj > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nt-rj small {
  font-size: 11px;
  color: var(--tx3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bkp details.nt-griglia {
  margin-top: 18px;
  border-top: 1px solid var(--line);
  padding-top: 4px;
}
.bkp details.nt-griglia > summary {
  cursor: pointer;
  padding: 10px 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--tx);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.bkp details.nt-griglia > summary::-webkit-details-marker {
  display: none;
}
.bkp details.nt-griglia > summary::before {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--tx3);
  border-bottom: 2px solid var(--tx3);
  transform: rotate(-45deg);
  transition: transform .15s;
}
.bkp details.nt-griglia[open] > summary::before {
  transform: rotate(45deg);
}
.bkp details.nt-griglia > summary .cnt {
  font-size: 12.5px;
  font-weight: 400;
  color: var(--tx3);
}
@media (max-width:640px) {
  .nt-ric {
    grid-template-columns: 1fr;
  }
  .nt-map td {
    min-width: 24px;
  }
  .nc {
    height: 26px;
  }
  .nt-selh .nt-h {
    font-size: 14px;
  }
}
.dg {
  margin: 22px 0 10px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel,var(--bg2));
}
.dg .nt-h .cnt {
  font-weight: 500;
  color: var(--tx3);
  font-size: 12.5px;
  margin-left: 6px;
}
.dg-g {
  margin-top: 14px;
  border-left: 3px solid var(--crit);
  padding-left: 12px;
}
.dg-g.dg-altro {
  border-left-color: var(--tx3);
}
.dg-sp {
  margin: 2px 0 8px;
  color: var(--tx2);
  font-size: 13px;
}
.dg-list {
  display: grid;
  gap: 6px;
}
.dg-vm {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel2,var(--bg2));
}
.dg-vm.ko {
  border-color: color-mix(in srgb, var(--crit) 45%, var(--line));
}
.dg-vm summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  padding: 8px 12px;
  cursor: pointer;
  list-style: none;
}
.dg-vm summary::-webkit-details-marker {
  display: none;
}
.dg-n {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.dg-n small {
  font-size: 11.5px;
  overflow-wrap: anywhere;
}
.dg-f {
  font-size: 12.5px;
  color: var(--tx2);
}
.dg-b {
  padding: 4px 12px 12px;
  font-size: 13px;
}
.dg-b p {
  margin: 6px 0;
}
.dg-mo .mono,
.dg-rg li,
.dg-in li {
  font-size: 12px;
  overflow-wrap: anywhere;
}
.dg-rg,
.dg-in ul {
  margin: 4px 0 0;
  padding-left: 18px;
}
.dg-in {
  margin-top: 8px;
}
.dg-tag {
  display: inline-block;
  font-size: 11.5px;
  padding: 2px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--crit) 14%, transparent);
  color: var(--tx);
  text-decoration: none;
  white-space: nowrap;
}
@media (max-width:640px) {
  .dg {
    padding: 12px;
  }
  .dg-vm summary {
    padding: 8px 10px;
  }
}
.dg-vm.rec {
  opacity: .72;
  border-style: dashed;
}
.dg-f .ok {
  color: var(--ok);
}