/* Compact single-line title used in place of the original hero copy. */
.intro-simple { padding: 38px 0 28px; }
.intro-simple h1 { margin: 0; font-size: 34px; letter-spacing: -1.5px; white-space: nowrap; }
.header-reset { color: #526e43; }
.layout { margin-top: 28px; }

/* Phone-first adjustments. Desktop styling remains in style.css. */
@media (max-width: 760px) {
  main { padding: 22px 14px 16px; }
  .logo { font-size: clamp(18px, 6.2vw, 24px); white-space: nowrap; }
  .header-reset { font-size: 11px; padding: 6px 9px; }
  .intro { padding: 32px 5px 24px; }
  .intro h1 { font-size: 36px; }
  .intro-simple { padding: 25px 0 20px; }
  .intro-simple h1 { font-size: clamp(22px, 8.1vw, 30px); letter-spacing: -1.2px; }
  .layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .layout { margin-top: 20px; }
  .card { padding: 21px 16px; border-radius: 18px; }
  .fixed-numbers, .exclusions { gap: 5px; }
  .fixed-numbers input, .exclusions input { padding: 11px 0; font-size: 16px; }
  .row-labels, .weight-row { grid-template-columns: 64px minmax(0, 1fr) 30px; gap: 7px; }
  .ball { width: 35px; height: 35px; font-size: 14px; }
  .balls { gap: 4px; }
  .ticket { padding: 18px 0; }
  .preview-balls i { width: 40px; height: 40px; }
}

@media (max-width: 360px) {
  main { padding-inline: 10px; }
  .card { padding-inline: 12px; }
  .ball { width: 33px; height: 33px; font-size: 13px; }
  .balls { gap: 3px; }
}