/* ── HISTORY PAGE STYLES ──────────────────────────────── */

/* Nav tabs */
.nav-tabs{display:flex;gap:4px}
.nav-tab{font-family:var(--mono);font-size:12px;color:var(--muted);text-decoration:none;padding:5px 14px;border-radius:var(--rs);border:1px solid transparent;transition:all .15s}
.nav-tab:hover{color:var(--text);border-color:var(--border)}
.nav-tab.active{color:var(--text);background:var(--bg3);border-color:var(--bord2)}

/* Period switch */
.period-switch{display:flex;gap:3px}
.period-btn{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);color:var(--muted);font-family:var(--mono);font-size:11px;padding:4px 10px;cursor:pointer;transition:all .15s}
.period-btn.active{color:var(--blue);border-color:var(--blue2);background:rgba(77,159,255,.1)}

/* Cache status */
.cache-status{font-size:10px;color:var(--muted);padding:0 4px}

/* Summary row */
.h-summary{display:flex;gap:8px;margin-bottom:12px}
.h-sum-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px;flex:1}
.h-sum-label{font-size:9px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.h-sum-val{font-family:var(--head);font-size:18px;font-weight:600;color:var(--text)}
.h-sum-val.green{color:var(--green)}.h-sum-val.red{color:var(--red)}.h-sum-val.blue{color:var(--blue)}.h-sum-val.amber{color:var(--amber)}

/* Section title */
.h-section-title{font-family:var(--head);font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px;margin-bottom:10px}
.h-legend{font-size:10px;font-weight:400;color:var(--muted);margin-left:auto;display:flex;gap:8px;align-items:center}
.leg-up{color:var(--green)}.leg-down{color:var(--red)}
.dot.green{background:var(--green)}.dot.purple{background:var(--purple)}

/* Table */
.h-table-section{margin-bottom:14px}
.h-table-wrap{
  overflow-x:auto;
  overflow-y:auto;
  max-height:calc(100vh - 320px);
  border-radius:var(--rs);
  border:1px solid var(--border);
}
.h-table{width:100%;border-collapse:collapse;font-size:12px}
.h-table thead th{
  font-size:9px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;
  padding:7px 10px;text-align:left;
  border-bottom:1px solid var(--border);white-space:nowrap;
  background:var(--bg2);
  position:sticky;top:0;z-index:3;
}
.h-table thead th:first-child{
  position:sticky;top:0;left:0;
  z-index:5;
  background:var(--bg2);
}
.h-table tbody tr{border-bottom:1px solid rgba(255,255,255,.03);transition:background .1s;cursor:pointer}
.h-table tbody tr:hover{background:var(--bg3)}
.h-table td{padding:8px 10px;white-space:nowrap;vertical-align:middle}
.h-table td:first-child{font-weight:500;color:var(--text);position:sticky;left:0;background:var(--bg2);z-index:1}
.h-table tr:hover td:first-child{background:var(--bg3)}
.h-loading{text-align:center;color:var(--muted);padding:40px;font-size:13px}

/* Current slot row */
.h-table tbody tr.current-slot-row td {
  border-bottom: 2px solid rgba(99,120,255,0.55) !important;
}
.h-table tbody tr.current-slot-row td:first-child {
  color: rgba(99,120,255,0.9) !important;
  background: var(--bg2) !important;
}
.h-table tbody tr.current-slot-row td:first-child::after {
  content: ' ●';
  color: rgba(99,120,255,0.7);
  font-size: 7px;
  vertical-align: middle;
}
@keyframes slotFlash {
  0%,100%{background:transparent}
  40%{background:rgba(99,120,255,0.1)}
}
.h-table tbody tr.slot-flash td {
  animation: slotFlash .45s ease 2;
}

/* Jump to current button */
.jump-current-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(99,120,255,0.1);
  border: 1px solid rgba(99,120,255,0.28);
  border-radius: 5px;
  color: rgba(99,120,255,0.8);
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  padding: 3px 10px; cursor: pointer;
  transition: all .15s;
  margin-left: 8px;
}
.jump-current-btn:hover {
  background: rgba(99,120,255,0.18);
  border-color: rgba(99,120,255,0.5);
  color: rgba(99,120,255,1);
}
.jump-live-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(99,120,255,0.9);
  box-shadow: 0 0 5px rgba(99,120,255,0.6);
  animation: pulse 1.5s infinite;
  flex-shrink: 0;
}

/* Up/Down cells */
.up-pct{color:var(--green);font-weight:600}
.down-pct{color:var(--red);font-weight:600}
.neutral-pct{color:var(--muted)}

/* Day cell */
.day-cell{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:36px}
.day-up{font-size:10px;color:var(--green)}
.day-down{font-size:10px;color:var(--red)}
.day-total{font-size:9px;color:var(--muted2)}

/* Bar indicator */
.pct-bar{display:flex;align-items:center;gap:5px}
.pct-bar-inner{height:4px;border-radius:2px;min-width:2px}
.bar-up{background:var(--green2)}.bar-down{background:var(--red2)}

/* Slot detail */
.h-detail-section{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:14px;margin-bottom:14px}
.h-close-btn{margin-left:auto;background:transparent;border:none;color:var(--muted);font-size:14px;cursor:pointer;padding:2px 6px}
.h-close-btn:hover{color:var(--text)}

.h-events-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px;max-height:300px;overflow-y:auto}
.h-event-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:8px 10px;cursor:pointer;transition:all .15s}
.h-event-card:hover{border-color:var(--bord2);background:var(--bg4)}
.h-event-card.up{border-left:3px solid var(--green2)}
.h-event-card.down{border-left:3px solid var(--red2)}
.h-ev-date{font-size:10px;color:var(--muted);margin-bottom:3px}
.h-ev-winner{font-size:12px;font-weight:600}
.h-ev-winner.up{color:var(--green)}.h-ev-winner.down{color:var(--red)}
.h-ev-vol{font-size:10px;color:var(--muted2);margin-top:2px}

/* Market detail */
.h-market-section{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:14px;margin-bottom:14px}
.h-market-grid{display:flex;flex-direction:column;gap:12px}
.h-metrics-row{display:flex;gap:8px;flex-wrap:wrap}
.h-metric{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:8px 12px;flex:1;min-width:100px}
.h-metric-label{font-size:9px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.h-metric-val{font-family:var(--head);font-size:16px;font-weight:600}
.h-metric-val.green{color:var(--green)}.h-metric-val.red{color:var(--red)}.h-metric-val.blue{color:var(--blue)}.h-metric-val.amber{color:var(--amber)}.h-metric-val.purple{color:var(--purple)}

.h-chart-card{background:var(--bg3);border:1px solid var(--border);border-radius:var(--rs);padding:12px}
.h-chart-label{font-size:9px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}

.h-price-events{display:flex;flex-direction:column;gap:4px;max-height:180px;overflow-y:auto}
.h-pe-row{display:flex;align-items:center;gap:8px;font-size:11px;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.h-pe-time{color:var(--muted);min-width:60px}
.h-pe-price{font-weight:600}
.h-pe-delta{font-size:10px}
.h-pe-delta.up{color:var(--green)}.h-pe-delta.down{color:var(--red)}

/* Responsive */
@media(max-width:900px){.h-summary{flex-wrap:wrap}.h-sum-card{flex:1 0 40%}}