/* Shared dashboard typography lift.
   Keeps the dashboard pages easier to read without resizing Jessie. */

body {
  text-size-adjust: 100%;
  overflow-x: clip;
}

html,
body {
  max-width: 100%;
}

header h1 {
  font-size: 22px !important;
}

header .badge,
.badge-dc,
.badge-tg,
.nav-tab .soon,
.pill,
.er-badge,
.risk-pill,
.split-card .eyebrow,
.operator-card .eyebrow,
.comparison-kicker,
.comparison-badge,
.comparison-control span,
.keyword-tag .cnt,
.bot-badge,
.rec-card .priority,
.ref-link {
  font-size: 12px !important;
}

.nav-tab,
.action-btn,
.refresh-btn,
.date-preset,
.date-input,
.review-input,
.comparison-select,
.comparison-control input {
  font-size: 14px !important;
}

.last-updated,
.label,
.sub,
.section-note,
.section-label,
.comparison-meta,
.comparison-top-meta,
.product-empty,
.product-item span,
.source-bar-meta,
.review-status,
.review-preview,
.ref-link {
  font-size: 13px !important;
}

table,
th,
td,
.keyword-tag,
.split-card p,
.operator-card p,
.operator-card .micro,
.hero-copy p,
.rec-card p,
.module-card p,
.comparison-insight-headline,
.comparison-rec-item h6,
.comparison-rec-item p,
.page-title,
.token-chip,
.addr-link,
.mono,
.insight-box,
.product-item strong {
  font-size: 14px !important;
}

.section-head h3,
.chart-card h3,
.tweets-card h3,
.table-card h3,
.section-card h3,
.comparison-title,
.split-card h3,
.operator-card h4,
.rec-card h4,
.module-card h4 {
  font-size: 16px !important;
  line-height: 1.4;
}

.stat-card .label,
.mini-card .label {
  font-size: 13px !important;
}

.stat-card .sub,
.mini-card .sub {
  font-size: 12px !important;
}

.nav-tab {
  padding: 10px 16px !important;
}

.action-btn,
.refresh-btn {
  padding: 7px 14px !important;
}

.date-preset,
.date-input,
.review-input,
.comparison-select,
.comparison-control input {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.value,
.stat-card .value,
.mini-card .value,
.product-summary-card .value,
.comparison-board .mini-card .value {
  font-size: clamp(24px, 2.5vw, 34px) !important;
  line-height: 1.25;
}

body [style*="font-size:10px"] {
  font-size: 12px !important;
}

body [style*="font-size:11px"] {
  font-size: 13px !important;
}

body [style*="font-size:12px"] {
  font-size: 14px !important;
}

body [style*="font-size:13px"] {
  font-size: 15px !important;
}

body [style*="font-size:14px"] {
  font-size: 16px !important;
}

body [style*="font-size:15px"] {
  font-size: 17px !important;
}

body [style*="font-size:16px"] {
  font-size: 18px !important;
}

body [style*="font-size:18px"] {
  font-size: 20px !important;
}

body [style*="font-size:20px"] {
  font-size: 24px !important;
}

@media (max-width: 768px) {
  html,
  body {
    overflow-x: hidden !important;
  }

  body {
    width: 100%;
    max-width: 100%;
  }

  header {
    padding: 12px !important;
    gap: 10px !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;
  }

  header > * {
    min-width: 0;
  }

  header h1 {
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 18px !important;
    line-height: 1.2;
  }

  .action-bar,
  .action-group {
    width: 100%;
    margin-left: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px !important;
  }

  .header-links {
    width: 100%;
    margin-left: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
  }

  .action-btn,
  .refresh-btn {
    width: 100%;
    min-height: 40px;
    padding: 8px 8px !important;
    font-size: 11px !important;
    line-height: 1.25;
    white-space: normal;
    text-align: center;
    float: none !important;
  }

  .tweets-card,
  .table-card,
  .section-card,
  .table-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  nav.tab-bar,
  .nav-bar {
    width: 100%;
    max-width: 100vw;
    padding: 0 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap;
    scrollbar-width: none;
  }

  nav.tab-bar::-webkit-scrollbar,
  .nav-bar::-webkit-scrollbar {
    display: none;
  }

  .tweets-card table,
  .table-card table,
  .section-card table,
  .table-scroll table {
    min-width: 540px;
  }

  .container {
    width: 100%;
    max-width: 100%;
    padding: 12px 10px !important;
    overflow-x: clip;
  }

  .nav-tab,
  .date-preset,
  .date-input,
  .review-input,
  .comparison-select,
  .comparison-control input,
  table,
  th,
  td,
  .keyword-tag,
  .split-card p,
  .operator-card p,
  .operator-card .micro,
  .hero-copy p,
  .rec-card p,
  .module-card p,
  .comparison-insight-headline,
  .comparison-rec-item h6,
  .comparison-rec-item p,
  .page-title,
  .token-chip,
  .addr-link,
  .mono,
  .insight-box,
  .product-item strong {
    font-size: 12px !important;
  }

  .last-updated,
  .label,
  .sub,
  .section-note,
  .section-label,
  .comparison-meta,
  .comparison-top-meta,
  .product-empty,
  .product-item span,
  .source-bar-meta,
  .review-status,
  .review-preview,
  .ref-link {
    font-size: 11px !important;
  }

  .section-head h3,
  .chart-card h3,
  .tweets-card h3,
  .table-card h3,
  .section-card h3,
  .comparison-title,
  .split-card h3,
  .operator-card h4,
  .rec-card h4,
  .module-card h4 {
    font-size: 14px !important;
  }

  .nav-tab {
    flex: 0 0 auto;
    padding: 8px 11px !important;
    font-size: 11px !important;
  }

  .value,
  .stat-card .value,
  .mini-card .value,
  .product-summary-card .value,
  .comparison-board .mini-card .value {
    font-size: clamp(20px, 5.2vw, 26px) !important;
  }

  .stats-grid,
  .mini-grid,
  .growth-grid,
  .source-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .charts-grid,
  .hero-grid,
  .split-grid,
  .operator-grid,
  .rec-grid,
  .module-grid,
  .comparison-grid,
  .comparison-controls,
  .review-form,
  body [style*="grid-template-columns:minmax(0, 1fr) auto"] {
    grid-template-columns: 1fr !important;
  }

  .section-head,
  .comparison-board-head,
  .source-bar-meta {
    flex-direction: column;
    align-items: flex-start !important;
  }

  .comparison-badges {
    justify-content: flex-start !important;
  }

  .date-bar {
    align-items: center;
  }

  .chart-wrap {
    height: 180px !important;
  }
}

@media (max-width: 480px) {
  .stats-grid,
  .mini-grid,
  .growth-grid,
  .source-grid {
    grid-template-columns: 1fr !important;
  }

  .action-bar,
  .action-group {
    grid-template-columns: 1fr !important;
  }
}
