@media (max-width: 767px) {
  :root { --zone-h: 100px; }

  .solo-bottom          { flex-direction: column; height: auto; }
  .solo-bottom-controls { height: auto; }

  .solo-side-zones { flex-direction: row; justify-content: center; }
  .solo-zone-stack { width: 64px; }

  .solo-hand                      { height: var(--zone-h); }
  .solo-hand .solo-card img       { height: 80px; }
  .solo-field-row .solo-card img  { height: 72px; }

  /* Desktop `height: 100%` fills the column flex container, squashing the hand. */
  .solo-btn-end-turn { width: 48px; height: auto; padding: 10px 0; font-size: 0.78rem; }

  /* Desktop context menu is hidden on mobile (bottom sheet replaces it). */
  .solo-ctx-menu { display: none !important; }

  .solo-dialog       { padding: 16px; }
  .solo-preview-img  { max-height: 70vh; }

  .solo-status-bar     { flex-wrap: wrap; gap: 4px; padding: 4px 8px; font-size: 0.75rem; }
  .solo-status-actions { margin-left: auto; }
}