The horizontal-scroll trays clip vertical overflow, so a selected card's lift,
gold outline, and check badge were cut off at the top. Add row headroom and
tuck the check badge inside the card corner. Also make the in-tray cards taller
with a larger rule panel and bigger ability text so descriptions aren't cramped
(widths stay tight so all four shop cards still fit without scrolling).
- A tap on a touch device synthesized mouseenter/mousemove and popped the
hover magnifier on top of the tap-to-magnify overlay — a double image. Gate
the hover preview on real hover capability ((hover: hover)) so touch taps
only open the tap overlay.
- In that overlay the card is large, but its art, power badge, and text were
still the tiny in-tray sizes; restore full-size art/power/damage/name/effect
so the magnified card reads like a real card.
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.
- End-of-battle result is now a centered dialog (Victory/Defeat/Draw) with
'Next round' and 'Not yet'; 'Not yet' dismisses it to rewatch the battle,
and a toolbar button remains to advance. A modal is always fully on screen,
fixing the next-round button being unreachable below the arena on phones.
- Also make the play area genuinely scrollable on phones (stretch the body
so table-main's overflow can engage) as a safety net.
- Collapse the 5-button playback speed picker into one button that cycles
through the options, keeping the battle controls on a single row.
- Topbar: show the round as a die face (1-6 pips) on all screens, move the
room code and Leave into a '...' dropdown menu, and drop the wordmark on
phones so the rail stays one row (die + players + menu).
- On phones, strip battle cards to art + power/damage + name (no suit, tier,
or ability text); the magnified view still shows the full card.
Lock the app to the viewport on screens <=600px wide so the page itself
never scrolls: the topbar becomes a slim rail and the play area fills the
rest. Cards, trays, and type shrink so a shop round or a battle fits on
one screen; the shop and deck rows scroll sideways when a full six-pet
deck outgrows the width, keeping each tray's height fixed. Arrange is the
one screen allowed to scroll past the viewport, since a battle line can
run long.
Prev/next/play-pause/restart and a step counter let a player walk the
battle log manually and replay it before hitting Next. Local-only view
state; nothing is shared or sent to the server.
Record each seat's arranged lineup on the battle result (already public)
and reveal the full deck in a popover when hovering a deck pile in the
battle view — the opponent's included.
When the server's DEBUG env var is on, expose a card catalog endpoint
and a collapsible client panel that drops any pet or food straight into
your deck (free, off-turn). Gated server-side so it is inert in normal
play.
Emit the individual rock-die faces (0/0/1/1/2/2) from the battle
resolver so the client can render a real CSS 3D cube per die that
tumbles and settles on the rolled face, replacing the flat random
damage number. Falls back to the flying-rock cue for older battle logs
without per-die data.
Shrink the oversized emoji art and let the effect text grow into the
freed middle band, centered with safe fallback to top-aligned so long
effects never clip their leading words.
Greyson Parrelli