.challenge-panel-pro { padding: 22px; border: 1px solid rgba(255,255,255,0.14); background: linear-gradient(180deg, rgba(8,16,10,0.90), rgba(8,12,18,0.92)); box-shadow: 0 10px 40px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.04); margin-bottom: 30px; border-radius:16px;}
.challenge-header-pro { display:flex; justify-content: center; }
.challenge-title-pro { font-size:1.5rem; text-align: center; color: #fff; text-transform: uppercase; font-weight:bold; letter-spacing:1px; text-shadow:0 0 15px rgba(255,255,255,0.3); }
.challenge-top-grid { display:grid; grid-template-columns: 1fr 1fr; gap:16px; margin-bottom:16px; }
@media (max-width: 600px) { .challenge-top-grid { grid-template-columns: 1fr; } }
.challenge-grid-pro { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:16px; margin-bottom:20px; }
.challenge-card-pro { padding: 18px; border-radius: 12px; background: rgba(0,0,0,0.5); display:flex; flex-direction:column; justify-content:center; text-align:center; position: relative; }
.pos-toggle-btn { background: #111; border: 1px solid #444; color: #fff; padding: 4px 10px; border-radius: 6px; cursor: pointer; font-size: 0.8rem; margin-top: 10px; transition: 0.2s; }
.pos-toggle-btn:hover { background: #222; border-color: #666; }
.pos-details-wrap { display: none; margin-top: 12px; padding-top: 12px; border-top: 1px solid #333; text-align: left; }

.challenge-card-pro.rep-side { border: 1px solid rgba(0,255,65,0.3); box-shadow: 0 0 15px rgba(0,255,65,0.1); }
.challenge-card-pro.hl-side { border: 1px solid rgba(0,213,255,0.3); box-shadow: 0 0 15px rgba(0,213,255,0.1); }
.challenge-label-pro { font-size:0.75rem; color:#888; letter-spacing:1px; text-transform:uppercase; margin-bottom:6px; }
.challenge-value-pro { font-size:1.6rem; font-weight:800; color:#fff; }
.challenge-value-pro.green { color:#00ff41; text-shadow:0 0 10px rgba(0,255,65,0.4); }
.challenge-value-pro.red { color:#ff4444; text-shadow:0 0 10px rgba(255,68,68,0.4); }
.challenge-note-pro { margin-top:6px; color:#999; font-size:0.82rem; }
.challenge-race-wrap { padding:16px; border-radius:12px; background: rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.1); }
.challenge-race-head { display:flex; justify-content:space-between; margin-bottom:12px; font-weight:bold;}
.challenge-race-target { color:#ccc; }
.challenge-progress-row { display:flex; align-items:center; gap:12px; margin:10px 0; }
.challenge-progress-label { width:90px; color:#ddd; font-weight:bold; }
.challenge-progress-bar { flex:1; height:14px; border-radius:10px; background:#111; border:1px solid #333; overflow:hidden;}
.challenge-progress-fill { height:100%; width:0%; transition: width .8s ease; }
.challenge-progress-fill.rep-fill { background: linear-gradient(90deg, #00ff41, #00d5ff); }
.challenge-progress-fill.hl-fill { background: linear-gradient(90deg, #00ffff, #0066ff); }
.challenge-progress-value { width:70px; color:#fff; text-align:right; font-weight:bold;}
.challenge-winner-text { margin-top:14px; text-align:center; color:#ddd; font-size:0.9rem; }

.challenge-toggle-btn { padding:10px 16px; border-radius:10px; border:1px solid rgba(159,232,255,0.35); background:rgba(0,213,255,0.14); color:#ffffff; font-weight:800; cursor:pointer; transition:all 0.2s ease; }
.challenge-toggle-btn:hover { background:rgba(0,213,255,0.24); box-shadow:0 0 14px rgba(0,213,255,0.18); }
#tradingPlanTooltip, #challengeProjectionBox { display:none; }
#tradingPlanTooltip.show, #challengeProjectionBox.show { display:block; }


/* ===== Last closed trades (Hyperliquid) ===== */
.closed-trades-wrap { margin-top: 8px; display: flex; flex-direction: column; gap: 5px; }
.ct-empty { font-size: 0.8rem; color: #8fa79a; }
.ct-row {
  display: grid;
  grid-template-columns: 62px 118px minmax(120px, 1fr) 90px 84px 96px 90px;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 0.78rem;
  background: rgba(255, 255, 255, 0.035);
  border-left: 3px solid #666;
}
.ct-row.win  { border-left-color: #00ff41; }
.ct-row.loss { border-left-color: #ff4444; }
.ct-coin { font-weight: 700; color: #fff; }
.ct-dir { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.03em; }
.ct-dir.long  { color: #00ff9d; }
.ct-dir.short { color: #ff8f6b; }
.ct-size, .ct-notional { color: #c9d4cd; }
.ct-notional { text-align: right; }
.ct-pnl { font-weight: 700; text-align: right; }
.ct-row.win  .ct-pnl { color: #00ff41; }
.ct-row.loss .ct-pnl { color: #ff5b5b; }
.ct-fee { color: #90a29a; font-size: 0.72rem; text-align: right; }
.ct-time { color: #7f8f88; font-size: 0.72rem; text-align: right; }

@media (max-width: 900px) {
  .ct-row {
    grid-template-columns: 1fr 1fr;
    row-gap: 3px;
    font-size: 0.74rem;
  }
  .ct-notional, .ct-pnl, .ct-fee, .ct-time { text-align: left; }
}