/* HYPE Fundamentals: desktop-only compact benchmark, 1061px+.
   DO NOT change mobile/tablet (<1061px). Loaded after the responsive sheets. */
@media (min-width:1061px) {
  .hero-layout {
    grid-template-columns:minmax(0,1.55fr) minmax(365px,1.25fr) !important;
    gap:14px;
    align-items:start;
  }
  .hero-layout > .hero-panel,
  .hero-layout > aside.score-context {
    height:auto !important;
    min-height:0 !important;
    align-self:start;
  }
  .hero-panel {
    padding:17px 18px 13px !important;
  }
  /* Duplicate score stays in the DOM because hero() still updates it. */
  .hero-panel .hero-top > .subtle-label,
  .hero-panel .hero-price-line > .verdict-box {
    display:none !important;
  }
  .hero-panel .hero-price-line {
    margin:14px 0 12px !important;
    gap:12px !important;
    align-items:center;
  }
  .hero-panel .price-stack {
    min-width:0;
    flex:0 0 auto;
  }
  .hero-panel .sparkline-wrap {
    min-width:90px;
    min-height:72px;
  }
  .hero-panel .hero-metrics-header {
    margin:4px 0 7px !important;
  }
  .hero-panel .hero-stat-grid {
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:5px !important;
  }
  .hero-panel .hero-stat {
    padding:10px 7px !important;
    min-width:0;
    min-height:92px !important;
  }
  .hero-panel .hero-stat-value {
    font-size:clamp(17px,1.7vw,25px) !important;
    margin:6px 0 3px !important;
    overflow-wrap:anywhere;
    font-variant-numeric:tabular-nums;
  }
  .hero-panel .hero-stat-hint {
    font-size:9px;
    line-height:1.25;
  }
  /* Compact but retain both usable supply choices. */
  .hero-panel .hero-stat button {
    padding:4px 5px;
    min-width:0;
  }
  /* The existing tabs are moved here by desktop-timeframe-location.js. */
  .hero-panel .price-stack > .period-tabs {
    display:flex;
    flex-wrap:nowrap;
    gap:3px;
    margin-top:11px;
    max-width:100%;
  }
  .hero-panel .price-stack > .period-tabs button {
    font-size:10px;
    padding:6px 7px;
    white-space:nowrap;
  }
  /* Wider, shorter scorecard without removing any rationale. */
  .hero-layout > aside.score-context {
    padding:16px 18px !important;
    gap:9px !important;
  }
  .hero-layout .score-context .section-head h3 {
    font-size:18px;
  }
  .hero-layout .score-context .score-record-panel {
    gap:7px;
  }
  .hero-layout .score-context .score-record-categories {
    gap:5px;
  }
  .hero-layout .score-context .score-record-category {
    padding:7px 9px;
  }
  .hero-layout .score-context .score-record-category p {
    margin-top:4px;
    font-size:10px;
    line-height:1.28;
  }
  .hero-layout .score-context .score-record-progress {
    margin-top:5px;
  }
  .hero-layout .score-context .score-record-note {
    padding-top:6px;
    line-height:1.3;
  }
  .tokens-panel {
    margin-top:12px !important;
  }
}

@media (min-width:1061px) and (max-width:1250px) {
  .hero-layout {
    grid-template-columns:minmax(0,1.65fr) minmax(330px,1fr) !important;
  }
  .hero-panel .hero-stat-value {
    font-size:clamp(15px,1.55vw,21px) !important;
  }
  .hero-panel .hero-stat-hint {
    font-size:8px;
  }
}