.ogex-val{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding-bottom:30px;
}

.ogex-val-head,
.ogex-val-section,
.ogex-val-overall{
  border:1px solid #294052;
  border-radius:14px;
  background:#09151f;
}

.ogex-val-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:15px;
}

.ogex-val-head>div>span,
.ogex-val-section-head span{
  color:#7891a5;
  font-size:10px;
  font-weight:900;
  letter-spacing:.07em;
}

.ogex-val-head h2{
  margin:4px 0;
  color:#edf6fc;
  font-size:21px;
}

.ogex-val-head p{
  max-width:760px;
  margin:0;
  color:#8ea2b2;
  font-size:12px;
  line-height:1.45;
}

.ogex-val-actions{
  display:flex;
  gap:7px;
  align-items:flex-start;
}

.ogex-val-actions button,
.ogex-val-feed-row,
.ogex-val-asset-row{
  min-height:44px;
  border:1px solid #344c60;
  border-radius:9px;
  background:#0d1c29;
  color:#e7eff6;
  cursor:pointer;
}

.ogex-val-actions button{
  padding:0 12px;
  font-weight:800;
}

.ogex-val-overall{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:12px 14px;
}

.ogex-val-overall span{
  font-size:9px;
  font-weight:900;
  letter-spacing:.07em;
}

.ogex-val-overall strong{
  font-size:17px;
}

.ogex-val-overall small{
  color:#8196a8;
}

.ogex-val-overall.good{
  border-color:#287254;
}

.ogex-val-overall.good strong{
  color:#49dea0;
}

.ogex-val-overall.warn{
  border-color:#79611f;
}

.ogex-val-overall.warn strong{
  color:#ecc453;
}

.ogex-val-overall.bad{
  border-color:#7a363d;
}

.ogex-val-overall.bad strong{
  color:#ff747e;
}

.ogex-val-overall.info strong{
  color:#7cc0e9;
}

.ogex-val-status{
  color:#7f95a6;
  font-size:11px;
}

.ogex-val-cards{
  display:grid;
  grid-template-columns:
    repeat(4,minmax(0,1fr));
  gap:8px;
}

.ogex-val-card{
  padding:10px;
  border:1px solid #273e4e;
  border-radius:10px;
  background:#0a1722;
}

.ogex-val-card span{
  display:block;
  color:#778da0;
  font-size:9px;
  font-weight:850;
}

.ogex-val-card strong{
  display:block;
  margin-top:6px;
  color:#edf5fb;
  font-size:14px;
}

.ogex-val-card.good strong,
.profit{
  color:#47dca0 !important;
}

.ogex-val-card.warn strong{
  color:#eac452;
}

.ogex-val-card.bad strong,
.loss{
  color:#ff747e !important;
}

.ogex-val-card.info strong{
  color:#76bde8;
}

.ogex-val-section{
  padding:13px;
}

.ogex-val-section-head{
  margin-bottom:10px;
}

.ogex-val-section-head h3{
  margin:3px 0 0;
  color:#edf5fb;
  font-size:16px;
}

.ogex-val-safety{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.ogex-val-chip{
  display:inline-flex;
  min-height:30px;
  align-items:center;
  padding:0 9px;
  border:1px solid #334b5e;
  border-radius:999px;
  background:#0a1722;
  color:#a7b7c4;
  font-size:10px;
  font-weight:900;
}

.ogex-val-chip.good{
  border-color:#277153;
  color:#48dda0;
}

.ogex-val-chip.warn{
  border-color:#755e1e;
  color:#e9c34f;
}

.ogex-val-chip.bad{
  border-color:#703a40;
  color:#ff7880;
}

.ogex-val-chip.info{
  border-color:#315e7b;
  color:#75bce7;
}

.ogex-val-provider{
  padding:11px;
  border:1px solid #2d4658;
  border-radius:9px;
  font-size:11px;
  line-height:1.45;
}

.ogex-val-provider.info{
  color:#8facc0;
}

.ogex-val-provider.bad{
  border-color:#6f3d42;
  color:#ef858b;
}

.ogex-val-note{
  margin-top:8px;
  color:#718799;
  font-size:10px;
  line-height:1.4;
}

.ogex-val-latency{
  display:grid;
  grid-template-columns:
    repeat(5,minmax(0,1fr));
  gap:7px;
}

.ogex-val-latency-card{
  padding:9px;
  border:1px solid #273d4e;
  border-radius:9px;
  background:#0a1722;
}

.ogex-val-latency-card span,
.ogex-val-latency-card small{
  display:block;
  color:#778c9e;
  font-size:9px;
}

.ogex-val-latency-card strong{
  display:block;
  margin:5px 0;
  color:#eef5fa;
  font-size:13px;
}

.ogex-val-assets,
.ogex-val-feed{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.ogex-val-asset-row{
  display:grid;
  grid-template-columns:
    1.2fr repeat(5,1fr);
  gap:8px;
  align-items:center;
  padding:8px 10px;
  text-align:left;
}

.ogex-val-feed-row{
  display:grid;
  grid-template-columns:
    1.7fr repeat(5,1fr);
  gap:8px;
  align-items:center;
  padding:8px 10px;
  text-align:left;
}

.ogex-val-feed-row div span{
  display:block;
  color:#74899b;
  font-size:9px;
}

.ogex-val-error{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:9px;
  border:1px solid #6c3d42;
  border-radius:8px;
  color:#ef858b;
}

.ogex-val-empty{
  padding:14px;
  border:1px dashed #314859;
  border-radius:9px;
  color:#8297a7;
}

.ogex-val-json{
  max-height:560px;
  overflow:auto;
  padding:10px;
  background:#06111a;
  border:1px solid #293e4d;
  border-radius:8px;
  color:#aebfcb;
  font-size:11px;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}


@media(max-width:900px){

  .ogex-val-cards{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .ogex-val-latency{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}


@media(max-width:700px){

  .ogex-val-head{
    flex-direction:column;
  }

  .ogex-val-actions{
    width:100%;
    display:grid;
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .ogex-val-actions button:last-child{
    grid-column:1/-1;
  }

  .ogex-val-asset-row,
  .ogex-val-feed-row{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}


@media(max-width:460px){

  .ogex-val-cards,
  .ogex-val-latency,
  .ogex-val-asset-row,
  .ogex-val-feed-row{
    grid-template-columns:1fr;
  }
}