.ogex-v5-panel{
  margin:10px 0;
  padding:12px;
  border:1px solid #21465d;
  border-radius:9px;
  background:#05131d;
}

.ogex-v5-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}

.ogex-v5-head small{
  color:#6f8ea2;
  font-size:8px;
  font-weight:900;
  letter-spacing:.14em;
}

.ogex-v5-head h3{
  margin:2px 0 0;
}

.ogex-v5-head>div:last-child{
  display:flex;
  gap:6px;
  align-items:center;
}

.ogex-v5-head button{
  margin:0;
}

.ogex-v5-pill{
  border:1px solid #345b75;
  border-radius:999px;
  padding:5px 8px;
  font-size:8px;
  font-weight:900;
}

.ogex-v5-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:8px;
  margin-top:9px;
}

.ogex-v5-card{
  border:1px solid #19394d;
  border-radius:7px;
  background:#071822;
  padding:9px;
}

.ogex-v5-card h4{
  margin:0 0 7px;
  font-size:10px;
  color:#b9cedb;
}

.ogex-v5-rsi{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:5px;
}

.ogex-v5-rsi>div{
  display:grid;
  grid-template-columns:auto auto;
  align-items:center;
  gap:4px;
  padding:5px;
  border:1px solid #17364a;
  border-radius:5px;
}

.ogex-v5-rsi>div>span:first-child{
  grid-column:1/-1;
  color:#7492a5;
  font-size:8px;
}

.ogex-v5-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  display:inline-block;
  background:#73808a;
}

.ogex-v5-dot.bull{
  background:#38d87f;
}

.ogex-v5-dot.bear{
  background:#ff6171;
}

.ogex-v5-dot.neutral{
  background:#e6ad36;
}

.ogex-v5-kv{
  display:grid;
  grid-template-columns:1fr auto;
  gap:5px 10px;
  font-size:9px;
}

.ogex-v5-kv span{
  color:#7895a7;
}

.ogex-v5-kv b{
  color:#d7e5ed;
  text-align:right;
}

.ogex-v5-score{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  margin-top:8px;
}

.ogex-v5-score>div{
  border:1px solid #19394d;
  border-radius:6px;
  padding:6px;
}

.ogex-v5-score span{
  display:block;
  color:#718fa2;
  font-size:7px;
  font-weight:900;
}

.ogex-v5-score b{
  font-size:9px;
}

.ogex-v5-panel pre{
  max-height:360px;
  overflow:auto;
  background:#020a0f;
  border:1px solid #18384b;
  border-radius:6px;
  padding:8px;
  color:#70e5ac;
  font-size:8px;
}

.ogex-v5-chart-badge{
  position:absolute;
  z-index:60;
  top:7px;
  left:7px;
  min-width:150px;
  padding:6px 8px;
  border:1px solid #2c5a76;
  border-radius:6px;
  background:rgba(3,13,20,.93);
  pointer-events:none;
}

.ogex-v5-chart-badge span{
  display:block;
  color:#6f8da0;
  font-size:7px;
  font-weight:900;
  letter-spacing:.1em;
}

.ogex-v5-chart-badge b{
  display:block;
  color:#dceaf4;
  font-size:10px;
}

.ogex-v5-chart-badge small{
  color:#829eaf;
  font-size:7px;
}

.ogex-v5-popup{
  position:fixed;
  z-index:120000;
  top:18px;
  right:18px;
  width:min(400px,calc(100vw - 24px));
  padding:12px;
  border:1px solid #31566e;
  border-radius:10px;
  background:rgba(3,14,22,.98);
  box-shadow:0 24px 65px rgba(0,0,0,.62);
  opacity:0;
  transform:translateY(-10px);
  pointer-events:none;
  transition:.14s;
}

.ogex-v5-popup.show{
  opacity:1;
  transform:none;
  pointer-events:auto;
}

.ogex-v5-popup-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
}

.ogex-v5-popup-head small{
  display:block;
  color:#7996a8;
  font-size:8px;
}

.ogex-v5-popup-head strong{
  font-size:16px;
}

.ogex-v5-popup-head button{
  margin:0;
  width:28px;
  padding:2px;
  background:transparent;
  border:0;
  font-size:20px;
}

.ogex-v5-popup-body{
  display:grid;
  grid-template-columns:1fr auto;
  gap:6px 12px;
  margin-top:10px;
  padding:9px;
  border:1px solid #18384b;
  border-radius:7px;
}

.ogex-v5-popup-body span{
  color:#7895a7;
  font-size:9px;
}

.ogex-v5-popup-body b{
  font-size:10px;
  text-align:right;
}

.ogex-v5-popup footer{
  margin-top:8px;
  color:#809caf;
  font-size:8px;
}

@media(max-width:850px){
  .ogex-v5-grid{
    grid-template-columns:1fr;
  }

  .ogex-v5-score{
    grid-template-columns:repeat(2,1fr);
  }

  .ogex-v5-rsi{
    grid-template-columns:repeat(3,1fr);
  }

  .ogex-v5-head{
    align-items:flex-start;
    flex-direction:column;
  }
}
