Add touch-friendly shop interactions on phones.

A phone has no hover to preview a card, so tapping now opens a magnified,
fully-readable view with the actions that fit it instead of acting blind:

- Shop card: tap to see it big, then Buy (or read it even when unaffordable).
- Your deck card: tap to see it big, then Sell it, or Select to enter a
  bulk-selection mode where taps toggle pets (no magnify) and the action bar
  offers Sell / Triple / Cancel.

Desktop keeps click-to-buy and click-to-select unchanged; the new behavior is
gated on a max-width:600px media query via a small useMediaQuery hook.

web/src/styles.css

@@ -3047,6 +3047,32 @@ h3 {
     font-size: 0.86rem;
   }
 
+  /* Tap-to-magnify overlay: the card shown big and centered with its actions.
+     Overrides the shrunk card sizes/fonts — reading the card is the point. */
+  .card-focus {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 16px;
+    max-width: 92vw;
+  }
+  .card-focus .card {
+    width: min(66vw, 230px);
+    height: min(58vh, 312px);
+  }
+  .card-focus .card-name {
+    font-size: 0.95rem;
+  }
+  .card-focus .card-effect {
+    font-size: 0.66rem;
+  }
+  .card-focus-actions {
+    display: flex;
+    gap: 10px;
+    flex-wrap: wrap;
+    justify-content: center;
+  }
+
   /* --- avocado / trumpet / mana trays --- */
   .avocado-zone {
     padding: 8px 10px 10px;