@media (max-width: 640px) {
  body { overflow-x: hidden; }

  section { padding-left: 1rem !important; padding-right: 1rem !important; }

  h1 {
    font-size: 1.75rem !important;
    line-height: 2.1rem !important;
  }

  p.text-lg,
  p[class*="text-lg"] {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
  }

  .max-w-6xl { padding-left: 0 !important; padding-right: 0 !important; }

  .card-bg { padding: 1rem !important; border-radius: 0.75rem !important; }
  .card-inner { padding: 0.75rem !important; }

  .grid.grid-cols-2:not([class*="sm\:grid-cols"]) {
    grid-template-columns: 1fr !important;
  }

  .grid.grid-cols-3,
  .grid[class*="grid-cols-3"] {
    grid-template-columns: 1fr !important;
  }

  .grid.grid-cols-4,
  .grid[class*="grid-cols-4"] {
    grid-template-columns: 1fr 1fr !important;
  }

  .grid.grid-cols-5,
  .grid[class*="grid-cols-5"] {
    grid-template-columns: 1fr 1fr !important;
  }

  .grid.sm\:grid-cols-2 { grid-template-columns: 1fr !important; }
  .grid.sm\:grid-cols-3 { grid-template-columns: 1fr !important; }
  .grid.sm\:grid-cols-4 { grid-template-columns: 1fr 1fr !important; }

  .grid[class*="lg\:grid-cols-3"] {
    grid-template-columns: 1fr !important;
  }

  .course-row,
  .app-row {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
  }

  .bracket-row {
    grid-template-columns: 1.5fr 1fr 1fr !important;
    font-size: 0.7rem !important;
  }

  .amort-row {
    grid-template-columns: 36px 1fr 1fr 1fr !important;
    font-size: 0.65rem !important;
  }

  .info-row {
    padding: 0.5rem 0.75rem !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
  }
  .info-label { font-size: 0.78rem !important; }
  .info-val { font-size: 0.8rem !important; word-break: break-all; }

  .score-card { padding: 0.75rem !important; }

  .stat-label { font-size: 0.6rem !important; }

  .big-num {
    font-size: 2rem !important;
  }

  div[class*="text-5xl"],
  span[class*="text-5xl"],
  div[class*="text-4xl"]:not(h1) {
    font-size: 2rem !important;
  }

  div[class*="text-3xl"],
  span[class*="text-3xl"] {
    font-size: 1.5rem !important;
  }

  div[class*="text-2xl"],
  span[class*="text-2xl"] {
    font-size: 1.25rem !important;
  }

  .mode-tab, .tab-btn, .nisab-btn, .preset-btn, .unit-btn {
    font-size: 0.7rem !important;
    padding: 0.3rem 0.6rem !important;
  }

  .flex.gap-2.flex-wrap { gap: 4px !important; }
  .flex.flex-wrap { gap: 4px !important; }

  canvas {
    max-width: 100% !important;
    height: auto !important;
  }

  table {
    font-size: 0.7rem !important;
  }

  .grid-table {
    font-size: 0.65rem !important;
    overflow-x: auto;
    display: block;
  }
  .grid-table td, .grid-table th {
    padding: 0.25rem 0.3rem !important;
    min-width: 28px !important;
  }

  .bit-cell {
    width: 32px !important;
    height: 32px !important;
    font-size: 0.75rem !important;
  }

  .sens-cell {
    padding: 4px 6px !important;
    font-size: 0.65rem !important;
  }

  .lbl { font-size: 0.65rem !important; }

  .inp, .sel {
    padding: 0.6rem 0.75rem !important;
    font-size: 0.9rem !important;
  }

  button[class*="py-4"] {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
    font-size: 0.9rem !important;
  }

  .section-badge { font-size: 0.65rem !important; padding: 0.2rem 0.5rem !important; }

  .pie-track { width: 100px !important; height: 100px !important; }

  .overflow-x-auto { -webkit-overflow-scrolling: touch; }

  .range-track { height: 24px !important; }
  .range-segment { font-size: 0.55rem !important; }

  .prog-bar { height: 6px !important; }
  .gpa-bar { height: 6px !important; }
  .score-bar { height: 6px !important; }
  .usage-bar { height: 5px !important; }

  input[type=range] { height: 5px !important; }
  input[type=range]::-webkit-slider-thumb { width: 16px !important; height: 16px !important; }

  .donut-ring, svg[viewBox] { max-width: 100% !important; }

  .bmi-gauge { height: 16px !important; }
  .bmi-marker { height: 24px !important; top: -4px !important; }

  .college-row { flex-wrap: wrap !important; padding: 0.4rem 0.5rem !important; font-size: 0.8rem !important; }

  .sec-hdr { font-size: 0.75rem !important; }

  .pb-16 { padding-bottom: 1rem !important; }
  .pb-12 { padding-bottom: 0.75rem !important; }
  .pt-10 { padding-top: 2rem !important; }
  .mb-6 { margin-bottom: 1rem !important; }
  .gap-6 { gap: 0.75rem !important; }
}

@media (max-width: 480px) {
  h1 {
    font-size: 1.4rem !important;
    line-height: 1.7rem !important;
  }

  .card-bg { padding: 0.75rem !important; }

  .grid.grid-cols-2,
  .grid[class*="grid-cols-2"] {
    grid-template-columns: 1fr !important;
  }

  .grid.grid-cols-4,
  .grid[class*="grid-cols-4"] {
    grid-template-columns: 1fr !important;
  }

  .course-row,
  .app-row {
    grid-template-columns: 1fr !important;
  }

  .bracket-row {
    grid-template-columns: 1fr !important;
  }

  .big-num {
    font-size: 1.75rem !important;
  }

  .info-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}