html {
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-size: clamp(15px, 2.6vw, 17px);
}
body {
  overflow-x: hidden;
  max-width: 100%;
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
  font-size: 1rem;
  line-height: 1.5;
}

img, svg, video { max-width: 100%; height: auto; }

.site-title { font-size: clamp(1.35rem, 7vw, 2.2rem) !important; }
.seo-card h1 { font-size: clamp(0.9rem, 3.6vw, 1.2rem) !important; line-height: 1.35; }
.seo-card p { font-size: clamp(0.85rem, 3.2vw, 1rem) !important; }
.warn-banner { font-size: clamp(0.78rem, 3.3vw, 1.05rem) !important; }
.live-updates-bar { font-size: clamp(0.95rem, 4.2vw, 1.4rem) !important; letter-spacing: 0.12em; }
.announcement { font-size: clamp(0.82rem, 3.5vw, 1.1rem) !important; line-height: 1.45; }
.resultboard1 { font-size: clamp(1.35rem, 6.5vw, 2.2rem) !important; }
.resultboard-time { font-size: clamp(1.05rem, 4.2vw, 1.55rem) !important; }
.resultboard { font-size: clamp(1.7rem, 9vw, 2.6rem) !important; }
.updated-line { font-size: clamp(0.75rem, 2.8vw, 0.95rem) !important; }
.date-timeline { font-size: clamp(0.75rem, 3vw, 1rem) !important; }
.game-name { font-size: clamp(0.85rem, 3.4vw, 1.25rem) !important; line-height: 1.25; overflow-wrap: anywhere; }
.game-time { font-size: clamp(0.78rem, 2.8vw, 0.95rem) !important; }
.result-box { font-size: clamp(0.95rem, 4.2vw, 1.3rem) !important; }
.chart-link { font-size: clamp(0.7rem, 2.4vw, 0.8rem) !important; }
.live-badge { font-size: clamp(0.6rem, 2vw, 0.72rem) !important; }
.wa-title { font-size: clamp(1.15rem, 4.6vw, 1.55rem) !important; }
.wa-text { font-size: clamp(1rem, 3.8vw, 1.2rem) !important; }
.wa-btn { font-size: clamp(0.85rem, 3.2vw, 1rem) !important; }
.panel h2,
.chart-banner h2,
.faq-section h2,
.chart-title { font-size: clamp(0.82rem, 3.4vw, 1.15rem) !important; line-height: 1.35; }
.quick-btn { font-size: clamp(0.75rem, 2.8vw, 0.9rem) !important; }
.year-btn { font-size: clamp(0.8rem, 3vw, 1rem) !important; }
.page-card h1 { font-size: clamp(1.15rem, 4.5vw, 1.7rem) !important; }
.page-card p,
.page-card li { font-size: clamp(0.88rem, 3.2vw, 1.05rem) !important; }
.faq-item h3 { font-size: clamp(0.95rem, 3.4vw, 1.15rem) !important; }
.faq-item p { font-size: clamp(0.85rem, 3.1vw, 1rem) !important; }
.collapsible-btn { font-size: clamp(0.9rem, 3.4vw, 1.15rem) !important; }
.legal-note { font-size: clamp(0.72rem, 2.6vw, 0.85rem) !important; }
.footer-links { font-size: clamp(0.8rem, 2.8vw, 0.95rem) !important; }
.main-number { font-size: clamp(0.78rem, 3.2vw, 1.15rem) !important; }
.main-heading { font-size: clamp(1.2rem, 5vw, 2.1rem) !important; }
.highlight { font-size: clamp(0.95rem, 3.8vw, 1.5rem) !important; }
.intro-para { font-size: clamp(0.88rem, 3.3vw, 1.15rem) !important; }

.record-page .result353,
.year-page .result353 { font-size: clamp(1.1rem, 4.6vw, 1.65rem) !important; }
.record-page .seo-intro { font-size: clamp(0.85rem, 3.2vw, 1.05rem) !important; }
.record-mix .chart-title1 { font-size: clamp(0.95rem, 3.4vw, 1.25rem) !important; }
.record-mix .chart-subtitle { font-size: clamp(0.78rem, 2.6vw, 1rem) !important; }
.record-mix .month-nav-btn { font-size: clamp(0.78rem, 2.8vw, 1.05rem) !important; }
.record-nav a { font-size: clamp(0.68rem, 2.6vw, 0.85rem) !important; }
.year-wrap .chart-title { font-size: clamp(0.95rem, 3.8vw, 1.5rem) !important; }
.year-wrap .chart-table th,
.year-wrap .chart-table td { font-size: clamp(0.85rem, 2.8vw, 1.05rem) !important; }
.record-seo h2 { font-size: clamp(0.95rem, 3.5vw, 1.25rem) !important; }
.record-seo p { font-size: clamp(0.85rem, 3.1vw, 1rem) !important; }

.weekly-page .today-label { font-size: clamp(0.9rem, 3.2vw, 1.15rem) !important; }
.weekly-page .today-number { font-size: clamp(2.4rem, 14vw, 4.25rem) !important; }
.weekly-page .today-date { font-size: clamp(0.78rem, 2.8vw, 0.95rem) !important; }
.weekly-page .btn-primary,
.weekly-page .btn-secondary { font-size: clamp(0.85rem, 3.2vw, 1.05rem) !important; }
.sf-weekly .chart-title { font-size: clamp(0.78rem, 3.2vw, 1.4rem) !important; }
.sf-weekly .chart-title small { font-size: clamp(0.65rem, 2.4vw, 0.9rem) !important; }
.sf-weekly th,
.sf-weekly td { font-size: 22px !important; }
.sf-weekly td.week-col,
.sf-weekly th.week-col { font-size: 13px !important; }
.admin-box { font-size: clamp(0.88rem, 3.2vw, 1.05rem) !important; }
.admin-table { font-size: clamp(0.75rem, 2.8vw, 0.95rem) !important; }

.table-scroll,
.record-mix,
.monthly-chart-container,
.year-wrap,
.sf-weekly,
.admin-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.record-mix .monthly-chart,
.record-mix .monthly-chart.mix-cols-4,
.record-mix .monthly-chart.mix-cols-6,
.sf-weekly table,
.year-wrap .chart-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
}
.record-mix .date-dow { margin-left: 4px; }
.year-wrap .m-short { display: none; }

/* satta-fast.com phone charts: full table on screen, no swipe */
@media (max-width: 768px) {
  .record-mix,
  .record-mix.wrap {
    padding-left: 4px !important;
    padding-right: 4px !important;
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
  }
  .record-mix .table-scroll,
  .sf-weekly .table-scroll,
  .year-wrap .table-scroll {
    overflow-x: auto;
    width: 100%;
  }
  .record-mix .export-btn { margin: 0 6px 8px; padding: 8px 12px; font-size: 14px; }
  .record-mix .chart-header { padding: 10px 6px !important; }
  .record-mix .chart-title1 {
    letter-spacing: 0 !important;
    line-height: 1.25;
    overflow-wrap: anywhere;
    font-size: 18px !important;
  }
  .record-mix .chart-subtitle {
    letter-spacing: 0;
    line-height: 1.3;
    font-size: 14px !important;
  }
  .record-mix .column-header {
    padding: 10px 6px !important;
    font-size: 12px !important;
    overflow-wrap: anywhere;
  }
  .record-mix .date-cell,
  .record-mix .result-cell {
    padding: 6px 4px !important;
    font-size: 17px !important;
    line-height: 1.2;
    overflow: hidden;
  }
  .record-mix .result-cell,
  .record-mix .column-header {
    white-space: nowrap;
  }
  .record-mix .doubled {
    display: inline-block;
    padding: 0 !important;
    font-size: 19px !important;
  }
  .record-mix .date-num { display: inline; font-weight: 800; }
  .record-mix .date-dow {
    display: inline;
    margin-left: 3px;
    font-size: 0.78em;
    font-weight: 600;
  }
  .record-mix .month-nav-btn {
    padding: 15px 8px !important;
    letter-spacing: 0 !important;
    font-size: 16px !important;
  }

  .record-mix .monthly-chart.mix-cols-6 .column-header {
    padding: 10px 6px !important;
    font-size: 12px !important;
  }
  .record-mix .monthly-chart.mix-cols-6 .date-cell,
  .record-mix .monthly-chart.mix-cols-6 .result-cell {
    padding: 8px 6px !important;
    font-size: 13px !important;
  }
  .record-mix .monthly-chart.mix-cols-6 .doubled { font-size: 15px !important; }
  .record-mix .monthly-chart.mix-cols-6 .date-num,
  .record-mix .monthly-chart.mix-cols-6 .date-dow {
    display: block;
    margin-left: 0;
  }

  .weekly-page .sf-box {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  .weekly-page .sf-box.sf-weekly { padding-left: 6px !important; padding-right: 6px !important; }
  .sf-weekly th,
  .sf-weekly td {
    padding: 12px 6px !important;
    font-size: 19px !important;
  }
  .sf-weekly td.week-col,
  .sf-weekly th.week-col {
    font-size: 11px !important;
    padding: 8px 2px !important;
    max-width: none;
  }

  .year-wrap {
    padding-left: 4px !important;
    padding-right: 4px !important;
    margin-left: 0;
    margin-right: 0;
  }
  .year-wrap .chart-table th,
  .year-wrap .chart-table td {
    padding: 8px 2px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 480px) {
  .record-mix .chart-title1 { font-size: 17px !important; }
  .record-mix .chart-subtitle { font-size: 15px !important; }
  .record-mix .column-header {
    padding: 8px 4px !important;
    font-size: 13px !important;
  }
  .record-mix .date-cell,
  .record-mix .result-cell {
    padding: 4px 2px !important;
    font-size: 16px !important;
  }
  .record-mix .doubled { font-size: 19px !important; }
  .record-mix .date-num,
  .record-mix .date-dow {
    display: block;
    margin-left: 0;
    line-height: 1.15;
  }
  .record-mix .date-dow { font-size: 10px; font-weight: 700; }

  .record-mix .monthly-chart.mix-cols-6 .chart-title1 { font-size: 16px !important; }
  .record-mix .monthly-chart.mix-cols-6 .chart-subtitle { font-size: 12px !important; }
  .record-mix .monthly-chart.mix-cols-6 .column-header {
    padding: 8px 4px !important;
    font-size: 11px !important;
  }
  .record-mix .monthly-chart.mix-cols-6 .date-cell,
  .record-mix .monthly-chart.mix-cols-6 .result-cell {
    padding: 6px 4px !important;
    font-size: 12px !important;
  }
  .record-mix .monthly-chart.mix-cols-6 .doubled { font-size: 14px !important; }

  .sf-weekly th,
  .sf-weekly td {
    padding: 10px 4px !important;
    font-size: 17px !important;
  }
  .sf-weekly .d-full { display: none; }
  .sf-weekly .d-short { display: inline; }
  .sf-weekly td.week-col,
  .sf-weekly th.week-col { display: none; }

  .year-wrap .m-full { display: none; }
  .year-wrap .m-short { display: inline; }
  .year-wrap .chart-table th,
  .year-wrap .chart-table td,
  .year-wrap .chart-table .number-cell.doubled {
    padding: 6px 1px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 900px) {
  .wrap { padding: 0 10px; }
  .logo-mark { max-width: min(220px, 78vw); max-height: 180px; }
  .seo-card { margin: 10px; padding: 12px 12px 14px; }
  .announcement { padding: 0 6px; }
  .warn-banner { padding: 10px 8px; }
  .live-updates-bar { padding: 10px 8px; border-radius: 0; }
  .result-section { margin: 14px 8px; padding: 22px 12px 18px; }
  .date-timeline {
    display: block;
    width: calc(100% - 20px);
    max-width: 520px;
    margin: 0 auto;
    padding: 12px 12px;
    line-height: 1.55;
    white-space: normal;
  }
  .date-divider { display: inline; margin: 0 6px; }
  .chart-banner { margin: 0 10px 16px; padding: 12px; }
  .chart-banner h2 { line-height: 1.45; text-transform: none; }
  .panel { margin: 14px 8px; padding: 16px 10px; }
  .quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .quick-btn { padding: 12px 8px; }
  .years-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .year-btn { padding: 10px 6px; }
  .page-card { margin: 12px 8px; padding: 16px 12px; }
  .faq-section { margin: 16px 10px 24px; }
  .collapsible-btn { padding: 12px 14px; }
  .footer-links { gap: 10px 12px; }
  footer { padding: 20px 12px calc(90px + env(safe-area-inset-bottom)); }
}

@media (max-width: 768px) {
  .games-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 8px;
  }
  .game-card { padding: 12px 8px 10px; }
  .game-results-container { gap: 4px; margin-top: 12px; }
  .result-box {
    min-width: 0;
    flex: 1 1 42px;
    padding: 7px 4px;
  }
  .live-badge { width: 40px; height: 18px; }
  .chart-link { padding: 5px 8px; }
  .number-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
  .number-box { padding: 10px 4px; }
  .wa-wrap { padding: 16px 10px; }
  .wa-banner { width: 100%; }
  .refresh-btn { right: 10px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .round-refresh-btn { width: 54px; height: 54px; }
  .round-refresh-btn svg { width: 22px; height: 22px; }
  .admin-box { margin: 20px 10px; padding: 16px; max-width: none; }
  .admin-table { min-width: 480px; }
}

@media (max-width: 480px) {
  .logo-mark { max-width: min(190px, 82vw); max-height: 160px; }
  .resultboard1 { margin: 10px 0 4px; }
  .resultboard { margin: 6px 0 12px; }
  .updated-line { padding: 0 8px; }
  .result-box { padding: 6px 2px; }
  .date-timeline { padding: 10px 8px; }
  .date-highlight { display: inline; }
  .quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-btn { padding: 10px 6px; }
  .years-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .family-strip { margin: 12px 6px; padding: 10px 8px; }
  .number-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
  .bulb { width: 9px; height: 9px; }
}

@media (max-width: 360px) {
  .games-grid { gap: 4px; padding: 6px; }
  .game-card { padding: 10px 4px 8px; border-radius: 4px; }
  .live-badge { display: none; }
  .years-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 901px) {
  .games-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

@media (hover: none) {
  .game-card:hover,
  .quick-btn:hover,
  .year-btn:hover { transform: none; }
  .wa-btn { animation: none; }
}
