.high-odds-v1{
  --hod-bg:#07101d;
  --hod-panel:#0c1727;
  --hod-panel2:#101f33;
  --hod-line:#21334a;
  --hod-text:#eef5ff;
  --hod-muted:#8fa2b9;
  --hod-gold:#f0c85a;
  --hod-cyan:#69d8ff;
  --hod-green:#63d9a1;
  color:var(--hod-text);
}
.high-odds-v1 *{box-sizing:border-box}
.hod-hero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  padding:26px 28px;
  border:1px solid var(--hod-line);
  border-radius:18px;
  background:
    radial-gradient(circle at 85% 20%,rgba(105,216,255,.12),transparent 28%),
    linear-gradient(135deg,#0d1a2c,#091320);
  box-shadow:0 18px 48px rgba(0,0,0,.18);
}
.hod-eyebrow{
  margin-bottom:7px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  color:var(--hod-gold);
}
.hod-hero h1{
  margin:0;
  font-size:30px;
  line-height:1.2;
}
.hod-hero p{
  max-width:760px;
  margin:10px 0 0;
  color:var(--hod-muted);
  font-size:13px;
  line-height:1.7;
}
.hod-hero-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}
.hod-access-badge,.hod-coverage-badge,.hod-vip-tag,.hod-result-count{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:5px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
.hod-access-badge{
  background:rgba(99,217,161,.12);
  border:1px solid rgba(99,217,161,.35);
  color:#8de9bd;
}
.hod-coverage-badge{
  background:rgba(255,255,255,.04);
  border:1px solid var(--hod-line);
  color:var(--hod-muted);
}
.hod-toolbar{
  margin-top:14px;
  padding:18px;
  border:1px solid var(--hod-line);
  border-radius:16px;
  background:var(--hod-panel);
}
.hod-filter-block+.hod-filter-block{margin-top:13px}
.hod-filter-title{
  margin-bottom:7px;
  font-size:11px;
  font-weight:900;
  color:var(--hod-muted);
  letter-spacing:.05em;
}
.hod-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.hod-chip{
  border:1px solid #2a3d55;
  border-radius:9px;
  background:#0a1422;
  color:#b8c6d8;
  padding:7px 11px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.hod-chip small{
  margin-left:4px;
  color:#8498af;
  font-size:10px;
}
.hod-chip:hover{
  border-color:#49647f;
  color:#fff;
}
.hod-chip.active{
  border-color:rgba(240,200,90,.65);
  background:rgba(240,200,90,.13);
  color:#ffe18a;
}
.hod-chip[disabled]{
  opacity:.35;
  cursor:not-allowed;
}
.hod-status{
  margin-top:12px;
  padding:10px 13px;
  border:1px solid var(--hod-line);
  border-radius:10px;
  background:#0a1422;
  color:var(--hod-muted);
  font-size:12px;
}
.hod-status.error{
  border-color:#713b46;
  color:#ff9aaa;
}
.hod-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:12px;
}
.hod-kpi{
  padding:15px 16px;
  border:1px solid var(--hod-line);
  border-radius:14px;
  background:linear-gradient(180deg,var(--hod-panel2),var(--hod-panel));
}
.hod-kpi span{
  display:block;
  color:var(--hod-muted);
  font-size:11px;
  font-weight:800;
}
.hod-kpi strong{
  display:inline-block;
  margin-top:7px;
  font-size:24px;
  line-height:1;
  color:#fff;
}
.hod-kpi small{
  margin-left:5px;
  color:#8194aa;
  font-size:10px;
}
.hod-main-grid{
  display:grid;
  grid-template-columns:minmax(0,2.2fr) minmax(280px,.8fr);
  gap:12px;
  margin-top:12px;
}
.hod-chart-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:12px;
}
.hod-card{
  border:1px solid var(--hod-line);
  border-radius:16px;
  background:var(--hod-panel);
  overflow:hidden;
}
.hod-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:15px 16px 12px;
  border-bottom:1px solid rgba(63,84,110,.45);
}
.hod-card-head h2{
  margin:0;
  color:#fff;
  font-size:15px;
}
.hod-card-head p{
  margin:5px 0 0;
  color:var(--hod-muted);
  font-size:11px;
  line-height:1.5;
}
.hod-legend{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:5px;
}
.hod-legend span{
  padding:4px 7px;
  border-radius:6px;
  font-size:9px;
  font-weight:900;
}
.hod-legend .l300{background:#f3df6c;color:#b52b20}
.hod-legend .l3000{background:#dcae34;color:#a81717}
.hod-legend .l5000{background:#d9c5ef;color:#9b1717}
.hod-legend .l10000{background:#bfeaff;color:#9b1717}
.hod-distribution{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:9px;
  max-height:660px;
  padding:12px;
  overflow:auto;
}
.hod-day{
  min-width:0;
  border:1px solid #1c2d42;
  border-radius:11px;
  background:#091421;
}
.hod-day-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 9px;
  border-bottom:1px solid #1b2a3d;
  color:#b8c6d8;
  font-size:10px;
  font-weight:900;
}
.hod-event-list{
  display:grid;
  gap:5px;
  padding:7px;
}
.hod-event{
  width:100%;
  border:0;
  border-radius:7px;
  padding:7px 8px;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.hod-event:hover{
  transform:translateY(-1px);
  box-shadow:0 3px 10px rgba(0,0,0,.18);
}
.hod-event-top{
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:10px;
  font-weight:900;
}
.hod-event-payout{
  margin-top:4px;
  font-size:15px;
  font-weight:1000;
}
.hod-event-pattern{
  margin-top:3px;
  font-size:9px;
  opacity:.8;
}
.p300{background:#f3df6c;color:#ad201c}
.p3000{background:#dcae34;color:#9f1111}
.p5000{background:#d9c5ef;color:#971515}
.p10000{background:#bfeaff;color:#971515}
.hod-detail-card{min-height:340px}
.hod-vip-tag{
  background:rgba(240,200,90,.12);
  border:1px solid rgba(240,200,90,.35);
  color:#f6d675;
}
.hod-detail-empty,.hod-detail{
  padding:18px;
  color:var(--hod-muted);
  font-size:12px;
  line-height:1.7;
}
.hod-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.hod-detail-item{
  padding:10px;
  border:1px solid #203249;
  border-radius:9px;
  background:#091421;
}
.hod-detail-item span{
  display:block;
  color:#7f93aa;
  font-size:9px;
}
.hod-detail-item strong{
  display:block;
  margin-top:4px;
  color:#fff;
  font-size:13px;
}
.hod-bars{
  display:grid;
  gap:9px;
  padding:14px 16px 17px;
}
.hod-bar-row{
  display:grid;
  grid-template-columns:52px minmax(0,1fr) 42px;
  align-items:center;
  gap:8px;
  font-size:10px;
}
.hod-bar-label{color:#b7c5d6;font-weight:800}
.hod-bar-track{
  height:8px;
  overflow:hidden;
  border-radius:999px;
  background:#07101b;
}
.hod-bar-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#3177aa,#73d7ff);
}
.hod-bar-value{
  text-align:right;
  color:#eef5ff;
  font-weight:900;
}
.hod-lock-copy{
  padding:18px 8px;
  color:#7f93aa;
  font-size:11px;
  line-height:1.6;
}
.hod-recent-card{margin-top:12px}
.hod-result-count{
  background:#0a1422;
  border:1px solid var(--hod-line);
  color:#b9c8da;
}
.hod-recent-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  padding:12px;
}
.hod-recent-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  align-items:center;
  padding:10px;
  border:1px solid #1e3047;
  border-radius:10px;
  background:#091421;
}
.hod-recent-item strong{
  display:block;
  color:#fff;
  font-size:11px;
}
.hod-recent-item span{
  display:block;
  margin-top:3px;
  color:#8295aa;
  font-size:9px;
}
.hod-recent-pay{
  padding:5px 7px;
  border-radius:6px;
  font-size:11px!important;
  font-weight:900;
}
.hod-data-note{
  display:flex;
  gap:10px;
  margin-top:12px;
  padding:12px 14px;
  border:1px solid var(--hod-line);
  border-radius:12px;
  background:#091421;
  color:#8195ab;
  font-size:10px;
  line-height:1.6;
}
.hod-data-note strong{
  flex:0 0 auto;
  color:#d6e2f0;
}
.hod-empty{
  grid-column:1/-1;
  padding:40px 18px;
  text-align:center;
  color:#71869d;
  font-size:12px;
}
@media(max-width:1100px){
  .hod-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hod-recent-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:780px){
  .hod-hero{flex-direction:column}
  .hod-hero-side{align-items:flex-start}
  .hod-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hod-main-grid{grid-template-columns:1fr}
  .hod-chart-grid{grid-template-columns:1fr}
  .hod-recent-list{grid-template-columns:1fr}
  .hod-data-note{flex-direction:column}
}


/* =========================================================
   AI999 HIGH-ODDS LAB V2  RACE-BY-RACE TRACKER
   ========================================================= */

.hod-view-tabs{
  display:flex;
  gap:10px;
  margin:18px 0 14px;
  padding:6px;
  border:1px solid rgba(148,163,184,.16);
  border-radius:16px;
  background:rgba(15,23,42,.72);
  width:max-content;
  max-width:100%;
}

.hod-view-tab{
  border:0;
  border-radius:12px;
  padding:10px 18px;
  background:transparent;
  color:#94a3b8;
  font-weight:800;
  cursor:pointer;
  transition:.18s ease;
}

.hod-view-tab:hover{
  color:#e2e8f0;
  background:rgba(148,163,184,.08);
}

.hod-view-tab.is-active{
  color:#fff;
  background:linear-gradient(135deg,#2563eb,#7c3aed);
  box-shadow:0 8px 24px rgba(37,99,235,.22);
}

.hod-race-tracker{
  display:none;
}

.high-odds-v1.hod-mode-race .hod-toolbar,
.high-odds-v1.hod-mode-race > .hod-status:not(.hod-race-status),
.high-odds-v1.hod-mode-race > .hod-kpis,
.high-odds-v1.hod-mode-race > .hod-main-grid,
.high-odds-v1.hod-mode-race > .hod-chart-grid,
.high-odds-v1.hod-mode-race > .hod-recent-card{
  display:none !important;
}

.high-odds-v1.hod-mode-race .hod-race-tracker{
  display:block;
}

.hod-race-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  padding:24px;
  margin:0 0 14px;
  border:1px solid rgba(99,102,241,.22);
  border-radius:20px;
  background:
    radial-gradient(circle at 90% 10%,rgba(124,58,237,.18),transparent 32%),
    linear-gradient(145deg,rgba(15,23,42,.96),rgba(15,23,42,.76));
}

.hod-race-head h2{
  margin:3px 0 7px;
  color:#f8fafc;
  font-size:26px;
}

.hod-race-head p{
  margin:0;
  max-width:820px;
  color:#94a3b8;
  line-height:1.65;
}

.hod-eyebrow{
  color:#818cf8;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
}

.hod-race-access{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

.hod-race-controls{
  margin-bottom:14px;
  padding:16px 18px;
  border:1px solid rgba(148,163,184,.14);
  border-radius:18px;
  background:rgba(15,23,42,.82);
}

.hod-race-control-block+.hod-race-control-block{
  margin-top:13px;
  padding-top:13px;
  border-top:1px solid rgba(148,163,184,.1);
}

.hod-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.hod-chip{
  border:1px solid rgba(148,163,184,.17);
  border-radius:999px;
  padding:7px 12px;
  background:#101827;
  color:#cbd5e1;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.hod-chip:hover{
  border-color:rgba(129,140,248,.55);
  color:#fff;
}

.hod-chip.is-active{
  border-color:#818cf8;
  background:rgba(99,102,241,.2);
  color:#fff;
}

.hod-chip:disabled{
  opacity:.38;
  cursor:not-allowed;
}

.hod-month-select{
  min-width:180px;
  border:1px solid rgba(148,163,184,.2);
  border-radius:10px;
  padding:9px 12px;
  background:#0b1220;
  color:#e2e8f0;
  font-weight:700;
}

.hod-race-status{
  margin-bottom:14px;
}

.hod-race-title-row{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-end;
  margin:18px 2px 10px;
}

.hod-race-selected{
  color:#f8fafc;
  font-size:24px;
  font-weight:900;
}

.hod-race-period-label{
  margin-top:3px;
  color:#94a3b8;
  font-size:13px;
}

.hod-race-coverage-note{
  max-width:560px;
  color:#fbbf24;
  font-size:12px;
  line-height:1.5;
  text-align:right;
}

.hod-race-thresholds{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:9px;
  margin-bottom:14px;
}

.hod-threshold-card{
  min-width:0;
  padding:14px;
  border:1px solid rgba(148,163,184,.13);
  border-radius:14px;
  background:rgba(15,23,42,.88);
}

.hod-threshold-card span{
  display:block;
  color:#94a3b8;
  font-size:11px;
  font-weight:800;
}

.hod-threshold-card strong{
  display:block;
  margin:5px 0 3px;
  color:#fff;
  font-size:22px;
}

.hod-threshold-card small{
  display:block;
  color:#64748b;
  line-height:1.4;
}

.hod-threshold-card[data-band="3000"],
.hod-threshold-card[data-band="5000"],
.hod-threshold-card[data-band="10000"]{
  border-color:rgba(250,204,21,.22);
}

.hod-race-grid{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(320px,.8fr);
  gap:14px;
  margin-bottom:14px;
}

.hod-race-grid-secondary{
  grid-template-columns:1fr 1fr;
}

.hod-race-trend{
  overflow-x:auto;
  overflow-y:hidden;
  min-height:244px;
  padding:6px 0 4px;
}

.hod-race-trend svg{
  display:block;
  min-width:100%;
  height:232px;
}

.hod-trend-empty{
  display:grid;
  place-items:center;
  min-height:220px;
  color:#64748b;
}

.hod-mini-count{
  color:#cbd5e1;
  font-size:12px;
  font-weight:800;
}

.hod-cycle-summary{
  display:grid;
  gap:8px;
}

.hod-cycle-row{
  display:grid;
  grid-template-columns:72px 1fr;
  gap:10px;
  padding:10px 11px;
  border:1px solid rgba(148,163,184,.11);
  border-radius:11px;
  background:rgba(2,6,23,.35);
}

.hod-cycle-row strong{
  color:#f8fafc;
}

.hod-cycle-row span{
  color:#94a3b8;
  font-size:12px;
  line-height:1.5;
}

.hod-cycle-unavailable{
  padding:18px;
  border:1px dashed rgba(251,191,36,.3);
  border-radius:12px;
  background:rgba(120,53,15,.08);
  color:#fbbf24;
  line-height:1.65;
}

.hod-monthly-card{
  margin-bottom:14px;
}

.hod-monthly-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
  gap:8px;
}

.hod-month-item{
  padding:11px 12px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:12px;
  background:rgba(2,6,23,.32);
}

.hod-month-item strong{
  display:block;
  color:#e2e8f0;
}

.hod-month-item span{
  display:block;
  margin-top:4px;
  color:#94a3b8;
  font-size:11px;
}

.hod-race-events-card{
  margin-bottom:14px;
}

.hod-race-event-strip{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:4px 0 8px;
  scroll-snap-type:x proximity;
}

.hod-race-event{
  flex:0 0 154px;
  scroll-snap-align:start;
  padding:11px;
  border:1px solid rgba(148,163,184,.13);
  border-radius:12px;
  background:rgba(2,6,23,.42);
}

.hod-race-event .date{
  color:#94a3b8;
  font-size:11px;
}

.hod-race-event .pay{
  margin:5px 0;
  color:#fff;
  font-size:18px;
  font-weight:900;
}

.hod-race-event .pattern{
  color:#cbd5e1;
  font-size:11px;
  line-height:1.55;
}

.hod-race-event .gate{
  margin-top:4px;
  color:#a5b4fc;
  font-size:11px;
  font-weight:800;
}

.hod-race-event.band-3000{
  border-color:rgba(250,204,21,.32);
}

.hod-race-event.band-5000{
  border-color:rgba(192,132,252,.4);
  background:rgba(88,28,135,.09);
}

.hod-race-event.band-10000{
  border-color:rgba(56,189,248,.42);
  background:rgba(14,116,144,.09);
}

.hod-race-disclaimer{
  padding:13px 15px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:12px;
  background:rgba(15,23,42,.6);
  color:#94a3b8;
  font-size:12px;
  line-height:1.6;
}

@media (max-width:1100px){
  .hod-race-thresholds{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .hod-race-grid,
  .hod-race-grid-secondary{
    grid-template-columns:1fr;
  }
}

@media (max-width:720px){
  .hod-race-head{
    flex-direction:column;
  }

  .hod-race-access{
    justify-content:flex-start;
  }

  .hod-race-title-row{
    flex-direction:column;
    align-items:flex-start;
  }

  .hod-race-coverage-note{
    text-align:left;
  }

  .hod-race-thresholds{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .hod-view-tabs{
    width:100%;
  }

  .hod-view-tab{
    flex:1;
  }
}


/* =========================================================
   AI999 HIGH-ODDS LAB V2.1  TREND POINT LABELS
   ========================================================= */

.hod-race-trend{
  padding-bottom:8px;
}

.hod-race-trend svg{
  overflow:visible;
}

.hod-svg-axis{
  stroke:rgba(148,163,184,.20);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}

.hod-svg-line{
  stroke:#818cf8;
  stroke-width:2.2;
  vector-effect:non-scaling-stroke;
}

.hod-trend-point{
  cursor:help;
}

.hod-trend-point circle{
  fill:#f8fafc;
  stroke:#818cf8;
  stroke-width:1.5;
  vector-effect:non-scaling-stroke;
  transition:r .12s ease, filter .12s ease;
}

.hod-trend-point:hover circle{
  r:6.5px;
  filter:drop-shadow(0 0 5px rgba(129,140,248,.75));
}

.hod-svg-date{
  fill:#94a3b8;
  font-size:10px;
  font-weight:800;
  letter-spacing:.01em;
  pointer-events:none;
}

.hod-svg-pay{
  fill:#f8fafc;
  font-size:10px;
  font-weight:900;
  pointer-events:none;
}

@media (max-width:720px){
  .hod-svg-date,
  .hod-svg-pay{
    font-size:9px;
  }
}


/* =========================================================
   AI999 HIGH-ODDS LAB V2.2
   TREND PATTERN + VIP 1G DETAIL
   ========================================================= */

.hod-svg-date,
.hod-svg-pay{
  fill:#f2c94c;
  font-weight:900;
}

.hod-svg-pay{
  font-size:10px;
}

.hod-trend-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.hod-trend-detail-toggle{
  border:1px solid rgba(242,201,76,.42);
  border-radius:999px;
  padding:7px 11px;
  background:rgba(242,201,76,.08);
  color:#f2c94c;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
}

.hod-trend-detail-toggle:hover{
  border-color:#f2c94c;
  background:rgba(242,201,76,.14);
}

.hod-trend-detail-toggle.is-active{
  background:#f2c94c;
  color:#111827;
}

.hod-svg-pattern{
  fill:#cbd5e1;
  font-size:9px;
  font-weight:800;
  pointer-events:none;
}

.hod-svg-gate{
  fill:#a5b4fc;
  font-size:9px;
  font-weight:900;
  pointer-events:none;
}

.hod-trend-point.is-selected circle{
  r:6.5px;
  stroke:#f2c94c;
  stroke-width:2.4;
  filter:drop-shadow(
    0 0 6px rgba(242,201,76,.72)
  );
}

.hod-trend-point:focus{
  outline:none;
}

.hod-trend-point:focus circle{
  stroke:#f2c94c;
  stroke-width:2.4;
}

.hod-trend-point-detail{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px 18px;
  min-height:48px;
  margin:4px 0 0;
  padding:10px 12px;
  border-top:1px solid rgba(148,163,184,.12);
  color:#cbd5e1;
}

.hod-trend-detail-guide{
  color:#64748b;
  font-size:11px;
}

.hod-trend-detail-primary{
  display:flex;
  align-items:center;
  gap:9px;
}

.hod-trend-detail-primary strong{
  color:#f2c94c;
  font-size:12px;
}

.hod-trend-detail-primary b{
  color:#f2c94c;
  font-size:15px;
}

.hod-trend-detail-pattern{
  color:#e2e8f0;
  font-size:12px;
  font-weight:800;
}

.hod-trend-detail-gate{
  color:#a5b4fc;
  font-size:12px;
  font-weight:900;
}

@media (max-width:720px){
  .hod-trend-actions{
    justify-content:flex-start;
  }

  .hod-trend-point-detail{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
  }

  .hod-svg-pattern,
  .hod-svg-gate{
    font-size:8px;
  }
}