UNO refactor (stage 2): responsive list/grid screens + chat

Make all menu screens use the width on desktop/landscape and the UNO panels:
- Shop item grid 3→up to 6 cols; BuyCoins packs 2→4 cols on lg.
- Lobby: panel league pick (2-col) + 2-col CTA buttons.
- Achievements / Notifications / Leaderboard / Friends lists → responsive
  grids (1 col mobile, 2 cols on lg); glass→panel on section containers.
- Chat: centered max-w-3xl column on desktop, green send button.
All responsive for mobile + desktop. tsc + build clean.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/components/screens/OnlineLobbyScreen.tsx

@@ -67,12 +67,12 @@ export function OnlineLobbyScreen() {
       <ScreenHeader title={t("lobby.title")} right={<CoinsPill />} />
 
       {/* league pick (only for ranked) */}
-      <div className="glass rounded-2xl p-4 mb-4">
+      <div className="panel rounded-2xl p-4 mb-4">
         <div className="flex items-center gap-1.5 text-sm text-cream/70 mb-2.5">
           <Trophy className="size-4 text-gold-400" />
           {t("lobby.chooseLeague")}
         </div>
-        <div className="space-y-2">
+        <div className="grid gap-2 sm:grid-cols-2">
           {MATCH_LEAGUES.map((l) => {
             const locked = level < l.minLevel;
             const active = l.id === leagueId;
@@ -123,11 +123,11 @@ export function OnlineLobbyScreen() {
         )}
       </div>
 
-      <div className="space-y-3">
+      <div className="grid gap-3 sm:grid-cols-2">
         <motion.button
           whileTap={{ scale: 0.985 }}
           onClick={onRandom}
-          className="press-3d btn-gold w-full rounded-3xl p-5 flex items-center gap-4 text-start"
+          className="btn-gold w-full rounded-3xl p-5 flex items-center gap-4 text-start"
         >
           <span className="grid size-12 place-items-center rounded-2xl bg-black/15 text-[#2a1f04]">
             <Trophy className="size-6" />
@@ -145,7 +145,7 @@ export function OnlineLobbyScreen() {
         <motion.button
           whileTap={{ scale: 0.985 }}
           onClick={onCreate}
-          className="press-3d glass w-full rounded-3xl p-5 flex items-center gap-4 text-start"
+          className="press-3d panel w-full rounded-3xl p-5 flex items-center gap-4 text-start"
         >
           <span className="grid size-12 place-items-center rounded-2xl bg-teal-500/15 text-teal-300">
             <Users className="size-6" />