
    /* ── Heatmap Hero ────────────────────────────────────────── */
    .hm-hero {
      padding: 64px 40px 44px;
      background: linear-gradient(180deg, #031226 0%, var(--bg-0) 100%);
      border-bottom: 1px solid var(--border);
      position: relative;
      overflow: hidden;
    }
    .hm-hero::after {
      content: 'HEAT';
      position: absolute;
      right: -10px; bottom: -24px;
      font-family: 'Orbitron', sans-serif;
      font-size: clamp(70px, 12vw, 180px);
      font-weight: 900;
      color: transparent;
      -webkit-text-stroke: 1px rgba(54,63,89,0.35);
      letter-spacing: 10px;
      user-select: none; pointer-events: none;
      line-height: 1;
    }
    .hm-hero-inner { max-width: 1400px; margin: 0 auto; position: relative; z-index: 1; }
    .hm-hero h1 {
      font-family: 'Rajdhani', sans-serif;
      font-size: 52px; font-weight: 700;
      letter-spacing: 4px; text-transform: uppercase;
      color: var(--text-1); margin-bottom: 10px; line-height: 1;
    }
    .hm-hero h1 span { color: var(--gold); }
    .hm-hero p { font-size: 15px; color: var(--text-2); max-width: 560px; margin-bottom: 0; line-height: 1.75; }

    .hm-main { max-width: 1400px; margin: 0 auto; padding: 40px 40px 80px; }

    /* Controls bar */
    .hm-controls {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 24px;
      flex-wrap: wrap;
      gap: 16px;
    }
    .hm-title {
      font-family: 'Rajdhani', sans-serif;
      font-size: 14px; font-weight: 700;
      letter-spacing: 2px; text-transform: uppercase;
      color: var(--text-3);
    }
    /* Sharp range tabs */
    .hm-range-tabs {
      display: flex;
      gap: 2px;
      background: var(--bg-3);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 2px;
    }
    .hm-range-tab {
      border: none; background: transparent;
      color: var(--text-3);
      font-size: 10px; font-weight: 700;
      letter-spacing: 1px; text-transform: uppercase;
      padding: 5px 14px; border-radius: 2px;
      cursor: pointer; transition: all .15s;
    }
    .hm-range-tab.active { background: var(--gold); color: #080808; }
    .hm-range-tab:hover:not(.active) { color: var(--text-1); }

    /* Leaderboard */
    .leaderboard-card {
      background: var(--bg-2);
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 28px;
      position: relative;
    }
    .leaderboard-card::before {
      content: '';
      position: absolute; top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, var(--gold-dim), transparent);
      border-radius: var(--radius-lg) var(--radius-lg) 0 0;
      pointer-events: none;
    }
    .leaderboard-title {
      font-family: 'Rajdhani', sans-serif;
      font-size: 14px; font-weight: 700;
      letter-spacing: 2px; text-transform: uppercase;
      color: var(--text-3); margin-bottom: 20px;
    }

    /* ── Hype / Sentiment ────────────────────────────────────── */
    .hype-flame-badge {
      display: inline-flex;
      align-items: center;
      gap: 2px;
      line-height: 1;
      cursor: default;
      user-select: none;
      flex-shrink: 0;
    }
    .hype-bar-wrap { flex: 1; height: 3px; background: var(--bg-4); border-radius: 0; overflow: hidden; min-width: 60px; }
    .hype-bar-fill { height: 100%; border-radius: 0; transition: width .4s; }
    .hype-bar-fill.hype-viral  { background: linear-gradient(90deg, #e74c3c, #c0392b); }
    .hype-bar-fill.hype-hot    { background: linear-gradient(90deg, #e67e22, #d35400); }
    .hype-bar-fill.hype-trend  { background: linear-gradient(90deg, #363F59, #6889A6); }
    .hype-bar-fill.hype-stable { background: var(--bg-4); }
    .hype-score-num { font-family:'Rajdhani',sans-serif; font-size:13px; font-weight:700; color:var(--text-2); min-width:26px; text-align:right; }

    /* Sentiment panel */
    .sentiment-section { max-width: 1400px; margin: 0 auto; padding: 0 40px 80px; }
    .sentiment-section-title {
      font-family:'Rajdhani',sans-serif; font-size:28px; font-weight:700;
      letter-spacing:3px; text-transform:uppercase; color:var(--text-1); margin-bottom:6px;
    }
    .sentiment-section-title span { color:var(--gold); }
    .sentiment-section-sub { font-size:13px; color:var(--text-3); margin-bottom:28px; line-height: 1.7; max-width: 640px; }
    .sentiment-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }

    /* Sentiment card — left accent bar */
    .sentiment-card {
      background: var(--bg-2);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 20px;
      transition: border-color .2s;
      position: relative;
      overflow: hidden;
    }
    .sentiment-card::before {
      content: '';
      position: absolute; top: 0; left: 0;
      width: 3px; height: 100%;
      background: var(--gold-dim);
      transition: background .2s;
      pointer-events: none;
    }
    .sentiment-card:hover { border-color: var(--border-hover); }
    .sentiment-card:hover::before { background: var(--gold); }

    .sentiment-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:14px; padding-left:10px; }
    .sentiment-make { font-size:9px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--text-3); margin-bottom:3px; }
    .sentiment-model { font-family:'Rajdhani',sans-serif; font-size:20px; font-weight:700; color:var(--text-1); }
    .sentiment-signals { border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:10px 0 10px 10px; margin-bottom:12px; display:flex; flex-direction:column; gap:6px; }
    .signal-row { display:flex; justify-content:space-between; align-items:center; }
    .signal-label { font-size:11px; letter-spacing:.5px; color:var(--text-3); }
    .signal-val { font-family:'Rajdhani',sans-serif; font-size:14px; font-weight:700; color:var(--text-1); }
    .signal-val.up { color:var(--green-l); }
    .sentiment-alert {
      font-size:12px; color:var(--text-2); line-height:1.6; margin-bottom:14px;
      padding:8px 10px 8px 12px; background:rgba(196,221,242,0.04);
      border-left:2px solid var(--gold-dim); margin-left: 0;
    }
    .sentiment-alert-icon { margin-right:5px; }

    /* Hype meter — flat precision bars */
    .hype-meter { }
    .hype-meter-label {
      display:flex; justify-content:space-between;
      font-size:9px; letter-spacing:1.5px; text-transform:uppercase;
      color:var(--text-3); margin-bottom:6px; padding-left: 10px;
    }
    .hype-meter-label span { color:var(--text-2); font-weight:700; }
    .hype-meter-track { height:3px; background:var(--bg-4); border-radius:0; overflow:hidden; }
    .hype-meter-fill { height:100%; border-radius:0; transition:width .5s; }
    .hype-meter-fill.hype-viral  { background:linear-gradient(90deg,#e74c3c,#c0392b); }
    .hype-meter-fill.hype-hot    { background:linear-gradient(90deg,#e67e22,#d35400); }
    .hype-meter-fill.hype-trend  { background:linear-gradient(90deg,#363F59,#6889A6); }
    .hype-meter-fill.hype-stable { background:var(--bg-4); }

    @media (max-width: 768px) {
      .hm-hero { padding: 48px 20px 32px; }
      .hm-main { padding: 28px 20px 60px; }
      .sentiment-section { padding-left: 20px; padding-right: 20px; }
    }
