Tic-Tac-Toe

Tic-Tac-Toe — A Polished Browser Game with Unbeatable AI

Tic-Tac-Toe is a production-quality, framework-free game built entirely with vanilla HTML, CSS, and JavaScript. It goes far beyond a simple grid exercise — pairing a flexible dual-mode gameplay system with three progressively challenging AI tiers, an immersive audio engine, and fluid CSS animation transitions that make every screen change feel cinematic.

• Three-Tier AI Engine: Ships with three distinct opponent personalities — Lucid AI plays randomly for beginners; Nuanced AI actively blocks the player and seizes winning moves; Esoteric AI is fully unbeatable, powered by the classic Minimax algorithm with depth-adjusted scoring for provably optimal play in every game state.
• Local Multiplayer Mode: Two players enter custom names (up to 8 characters) and compete on the same device, with active-turn highlighted via color-coded border indicators to prevent confusion.
• Live Session Score Card: A persistent, match-by-match results table tracks cumulative wins across an entire session and computes a final overall winner, accessible at any time via the Score Card toggle panel.
• Immersive Audio System: Features unique click sounds for each marker, dedicated win and tie audio effects, and a looping background music track with an independent volume slider — all music state persisted across page reloads via localStorage.
• Visual Strike Line Renderer: Dynamically draws the correct winning strike line across all 8 possible win combinations — rows, columns, and both diagonals — precisely aligned over the board on every screen size.
• Polished UI Interactions: Implements smooth CSS keyframe menu-in and menu-out transitions on every screen change, a hover preview system that previews the marker before placement, and a full-screen toggle for an arcade-style immersive experience.