The board was getting vertically squished because aspect-ratio doesn't
work reliably inside flex containers. Switch to the padding-top: 100%
technique with absolute-positioned board inside.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- Remove duplicate static coord elements from game.php (board.js creates them dynamically)
- Force LTR direction on game-layout and board to prevent RTL interference
- Fix piece font-size for proper unicode rendering
- Translate all game UI text to Arabic (status, result, stats)
- Sync move list and status to both desktop and mobile panels
- Improve board colors and spacing
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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

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

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

- Pro board: drag/drop, pre-moves, arrows, highlights, keyboard nav, coords
- Pro timer: Fischer/Bronstein/delay, tenths/hundredths, low-time warnings
- Pro move stack: clickable, scrollable, opening detection (100+ openings)
- Post-game analysis: eval bar, eval graph, move classification, accuracy %
- Puzzle trainer: daily puzzles, streak mode, rush mode, themed puzzles
- Sound system: move/capture/check/castle/game-end via Web Audio API
- Eval bar: real-time position evaluation display
- PGN export, FEN copy, analyze button
- 50 seeded puzzles in database with ELO rating system
- New icons: eye, download, copy, chart, puzzle, brain
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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

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

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

Complete rewrite from React/Vite to PHP/HTML/CSS/JS stack.
- PHP 8.3 Apache Docker setup with routing
- Supabase auth (login/register) working
- Full CSS design system (dark theme, RTL, responsive)
- SVG icon sprite (no emojis)
- Desktop side nav + mobile bottom nav
- All page routes with placeholders
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

In RTL, marginInlineEnd maps to physical left, which pushed
content toward the nav. Using physical marginRight correctly
offsets content away from the right-side nav.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Use CSS variable --desktop-nav-width (72px on lg+) with
marginInlineEnd for RTL-correct nav offset. Content now
truly centers in the remaining viewport space.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Changed lg:mr to lg:pr for nav clearance (RTL-correct), centered
content container at 720px max-width, aligned header to same width.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Content was stretching full-width on 1920px screens. Added
800px max-width centered container in AppShell, fixed nav
overflow for scrollable items.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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

Toned down bg layers (less blue, more neutral dark), replaced
card-based login layout with a clean borderless form using
subtle transparency for inputs.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- Primary CTA: wider (88%), taller (py-6), larger text (xl)
- Secondary CTA: wider (82%), taller (py-5), thicker border
- Time control tiles: bigger (py-5), larger text (base)
- More gap between sections (gap-5) and buttons (gap-5)
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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

- Add 'as const' to transition type literals in variant objects for Framer Motion 12 compatibility
- Replace playSound('click') with playSound('tap') to match sound registry
- Use ENV.SUPABASE_URL instead of protected supabase.supabaseUrl property
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Vibrant, playful design system with thick 3px borders, bold/black
font weights, bouncy spring animations, and saturated colors.
Desktop-friendly with responsive container (480-560px max-width).

- New color palette: brighter gold, vibrant coral/cyan/purple
- Thick bordered cards, push-effect buttons, animated glow rings
- app-container system: centered content, generous gutters
- All 14 pages rewritten with the new design language
- No edge-to-edge elements anywhere
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Phase 5: Real-time multiplayer with matchmaking queue, live clock sync,
and Supabase Realtime for move broadcasting between players.

Phase 7: Friends system with requests/accept/block, notifications with
Realtime subscription, and online presence heartbeat.

Phase 8: Tournaments list with registration and status filters,
leaderboard with time control/period filters and top-3 podium.

Phase 9: Cosmetics shop with rarity system, purchase flow,
daily reward with streak multiplier.

Phase 10: Edit profile modal, recent games on home/profile,
improved settings/404/toast system.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Nginx now serves index.html with no-cache headers so every deploy is
immediately visible. Login/Register pages get floating card treatment
with visible gutters, gold borders, and centered buttons.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

PageTransition now caps at 360px centered, creating visible dark
background gutters on each side. Header and nav are floating pills
with rounded-[18px]. Buttons use w-[85%] not w-full.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Background darkened to #06060E, surface-1 bumped to #141420 for
visible card contrast. Borders brightened to #32324E. All pages
use px-7 (28px) side margins. Cards use full border opacity.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Bottom nav is now floating with rounded corners and shadow.
Header is now a floating pill with rounded corners.
All pages use px-6 (24px) margins for proper inset from edges.
Cards, buttons, and sections all have visible spacing from screen edges.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Buttons: larger padding, min-widths, better gradient variants
Cards: increased p-5 default, softer borders
All pages: px-5 padding, generous gaps, larger touch targets,
proper text hierarchy, section breathing room, bottom clearance.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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

Game: coordinate labels, player panels, captured pieces, move list,
material advantage, glowing turn indicator, tighter layout.
Home: quick actions, daily tips, better empty state, stat card borders.
Play: chess hero card, larger pills, removed debug button.
BotSelect: back nav, difficulty dots, colored avatar fallback.
Profile: XP fix, section dividers, achievements placeholder, better logout.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Add bot selection page with 7 personality bots, wire up game page
to play against bots via the Stockfish API, add routes and navigation.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

- Complete chess board with piece rendering (Unicode fallback)
- Drag-to-select + legal move highlights (gold dots)
- chess.js validation for all moves including promotion
- Game over detection (checkmate, stalemate, draw)
- Result overlay with "new game" option
- Board flip button
- Resign button
- Local play mode accessible from Play page
- Fix profile XP bar padding
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

The anon key in the docs had a stale signature. Found the actual
key by inspecting Kong's declarative config on the server via SSH.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Full project scaffold with React 19, Vite, Tailwind v4, Framer Motion.
EL3AB brand colors (gold/dark theme), Cairo Arabic font, RTL layout.
Animated bottom nav, header with coin display, splash screen.
All pages scaffolded: home, play, matchmaking, profile, tournaments,
friends, leaderboard, notifications, shop, settings.
Auth flow with Supabase (login/register).
Dockerfile + nginx for CapRover deploy on port 80.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>