#upgrades-toggle, #upgrades-close { display: none; }
@media (max-width: 600px) {
  html, body { height: 100%; overflow: hidden; }
  body { display: flex; flex-direction: column; }
  .top { flex: none; height: 44px; padding: 0 7px; gap: 5px; position: relative; }
  .top a { font-size: 12px; white-space: nowrap; }
  .cash { padding: 4px 7px; font-size: 13px; }
  .top button { width: 44px; min-width: 44px; height: 40px; padding: 2px; font-size: 20px; }
  #upgrades-toggle, #upgrades-close { display: block; }
  main { flex: 1; min-height: 0; display: flex; flex-direction: column; }
  .hero { flex: none; height: 56px; min-height: 0; padding: 5px 9px; align-items: center; }
  .hero > div { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 5px; }
  .hero .eyebrow, .hero p { display: none; }
  .hero h1 { margin: 0; font-size: 20px; white-space: nowrap; }
  .stats { gap: 3px; }
  .stats span { padding: 3px 5px; font-size: 10px; }
  .first-order-tip { min-height: 24px; margin: 3px 8px; font-size: 10px; line-height: 1.15; }
  .first-order-tip[hidden] { display: block; visibility: hidden; }
  .content { flex: 1; height: auto; min-height: 0; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); gap: 5px; padding: 3px 7px calc(4px + env(safe-area-inset-bottom)); overflow: hidden; }
  .panel { min-width: 0; min-height: 0; padding: 7px; border-radius: 13px; overflow-y: auto; overscroll-behavior: contain; }
  .section-head h2 { margin: 0 0 4px; font-size: 16px; }
  .section-head span { font-size: 11px; }
  .orders, .dishes, .cooking, #upgrade-list { gap: 4px; }
  .order, .dish, .cook, .upgrade { min-height: 48px; gap: 5px; padding: 4px; border-radius: 9px; }
  .icon { font-size: 22px; }
  .dish button, .cook button, .upgrade button { min-width: 44px; min-height: 44px; padding: 4px 6px; }
  .upgrades { display: none; position: fixed; z-index: 6; left: 7px; right: 7px; bottom: calc(7px + env(safe-area-inset-bottom)); width: auto; max-height: calc(100dvh - 55px); background: #fffaf2; box-shadow: 0 0 0 200vmax #170d1cb8, 0 16px 40px #10071299; }
  .upgrades.open { display: block; }
  .upgrades .section-head { position: sticky; top: -7px; z-index: 1; background: #fffaf2; }
  #upgrades-close { width: 44px; height: 40px; border: 0; border-radius: 9px; background: #eadac9; font-size: 24px; }
  .modal { overflow-y: auto; align-items: flex-start; padding: 7px; }
  .card { margin: auto; max-height: calc(100dvh - 14px); overflow-y: auto; }
  .card img { height: min(25dvh, 140px); }
  .card-body { padding: 12px; }
  .card h2 { font-size: 25px; }
  .card p { margin: 5px 0; font-size: 12px; line-height: 1.35; }
  .card button { min-height: 44px; font-size: 15px; }
}
