:root{--bluey-blue:#4a90e2;--bingo-orange:#ff8c42;--sunny-yellow:#ffd93d;--grass-green:#6bcf7f;--warm-cream:#fff8e1;--soft-white:#fff;--text-dark:#2c3e50;--text-light:#7f8c8d;--celebration-pink:#ff69b4;--celebration-purple:#9b59b6}.tic-tac-toe-container{background:linear-gradient(135deg,var(--warm-cream)0%,var(--sunny-yellow)100%);min-height:100vh;color:var(--text-dark);font-family:Nunito,sans-serif;overflow-x:hidden}.modal-overlay{z-index:1000;background:rgba(0,0,0,.7);justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-in-out fadeIn;display:flex;position:fixed;top:0;left:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.welcome-modal{background:var(--soft-white);text-align:center;border-radius:25px;width:90%;max-width:500px;padding:40px;animation:.6s ease-out bounceIn;box-shadow:0 20px 60px rgba(0,0,0,.3)}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{transform:scale(1.05)}70%{transform:scale(.9)}to{opacity:1;transform:scale(1)}}.bluey-header h1{color:var(--bluey-blue);text-shadow:2px 2px 4px rgba(0,0,0,.1);margin-bottom:10px;font-family:Fredoka One,cursive;font-size:2.5rem}.header-characters{justify-content:center;gap:20px;margin-bottom:20px;display:flex}.character-badge{cursor:pointer;border-radius:20px;flex-direction:column;align-items:center;padding:15px;transition:all .3s;display:flex}.bluey-badge{background:linear-gradient(135deg,var(--bluey-blue),#6bb6ff);color:#fff}.bingo-badge{background:linear-gradient(135deg,var(--bingo-orange),#ffb366);color:#fff}.character-badge:hover{transform:scale(1.05);box-shadow:0 6px 20px rgba(0,0,0,.2)}.header-character-img{object-fit:cover;border:3px solid rgba(255,255,255,.8);border-radius:15px;width:80px;height:80px;margin-bottom:8px;transition:all .3s}.character-name{text-shadow:1px 1px 2px rgba(0,0,0,.2);font-size:.9rem;font-weight:600}.bluey-header p{color:var(--text-light);margin-bottom:30px;font-size:1.2rem}.setup-form{text-align:left}.input-group{margin-bottom:25px}.input-group label{color:var(--text-dark);margin-bottom:8px;font-size:1.1rem;font-weight:600;display:block}.player-name-input{border:3px solid var(--bluey-blue);border-radius:15px;width:100%;padding:15px;font-family:Nunito,sans-serif;font-size:1.1rem;transition:all .3s}.player-name-input:focus{border-color:var(--bingo-orange);outline:none;box-shadow:0 0 15px rgba(255,140,66,.3)}.difficulty-options{gap:15px;margin-top:10px;display:flex}.difficulty-option{cursor:pointer;flex:1}.difficulty-option input[type=radio]{display:none}.option-card{text-align:center;border:3px solid transparent;border-radius:15px;padding:20px;transition:all .3s}.option-card.bluey-mode{background:linear-gradient(135deg,var(--bluey-blue),#6bb6ff);color:#fff}.option-card.dad-mode{background:linear-gradient(135deg,var(--bingo-orange),#ffb366);color:#fff}.difficulty-option input[type=radio]:checked+.option-card{border-color:var(--sunny-yellow);transform:scale(1.02);box-shadow:0 5px 20px rgba(255,217,61,.5)}.option-card:hover{transform:scale(1.05);box-shadow:0 8px 25px rgba(0,0,0,.15)}.character{margin-bottom:15px}.character-image{object-fit:cover;border:2px solid rgba(255,255,255,.8);border-radius:12px;width:60px;height:60px;transition:all .3s}.option-card h3{text-shadow:1px 1px 2px rgba(0,0,0,.2);margin-bottom:5px;font-size:1.2rem;font-weight:700}.option-card p{opacity:.9;font-size:.9rem}.start-button{background:linear-gradient(135deg,var(--bluey-blue),var(--bingo-orange));color:#fff;cursor:pointer;text-shadow:1px 1px 2px rgba(0,0,0,.2);border:none;border-radius:25px;padding:18px 40px;font-family:Nunito,sans-serif;font-size:1.3rem;font-weight:700;transition:all .3s;box-shadow:0 8px 25px rgba(74,144,226,.3)}.start-button:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(74,144,226,.4)}.start-button:active{transform:translateY(-1px)}.game-container{max-width:1200px;margin:0 auto;padding:20px}.tournament-header{background:var(--soft-white);border-radius:20px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px;padding:25px;display:flex;box-shadow:0 10px 30px rgba(0,0,0,.1)}.player-info h2{color:var(--text-dark);margin-bottom:8px;font-size:1.8rem;font-weight:700}.difficulty-badge{background:linear-gradient(135deg,var(--bluey-blue),#6bb6ff);color:#fff;border-radius:20px;padding:6px 15px;font-size:.9rem;font-weight:600;display:inline-block}.tournament-progress{text-align:center}.game-counter{color:var(--text-dark);margin-bottom:10px;font-size:1.1rem;font-weight:600}.series-score{justify-content:center;align-items:center;gap:15px;display:flex}.score-item{text-align:center}.score-label{color:var(--text-light);margin-bottom:5px;font-size:.9rem;display:block}.score-value{font-size:2rem;font-weight:700;display:block}.player-score .score-value{color:var(--bluey-blue)}.computer-score .score-value{color:var(--bingo-orange)}.score-divider{color:var(--text-light);font-size:1.5rem;font-weight:700}.timer-section{text-align:center}.session-timer{color:var(--text-dark);margin-bottom:5px;font-size:1.2rem;font-weight:700}.game-timer{color:var(--text-light);font-size:1rem}.game-board{background:var(--soft-white);text-align:center;border-radius:20px;margin-bottom:25px;padding:30px;box-shadow:0 10px 30px rgba(0,0,0,.1)}.board-grid{grid-template-columns:repeat(3,1fr);gap:15px;max-width:300px;margin:0 auto 30px;display:grid}.cell{background:linear-gradient(135deg,var(--warm-cream),#fff3e0);border:3px solid var(--bluey-blue);width:80px;height:80px;color:var(--text-dark);cursor:pointer;border-radius:15px;justify-content:center;align-items:center;font-size:2.5rem;font-weight:700;transition:all .3s;display:flex}.cell:hover{background:linear-gradient(135deg,var(--bluey-blue),#6bb6ff);color:#fff;transform:scale(1.05);box-shadow:0 8px 20px rgba(74,144,226,.3)}.cell:disabled{cursor:not-allowed;opacity:.7}.cell:disabled:hover{background:linear-gradient(135deg,var(--warm-cream),#fff3e0);color:var(--text-dark);box-shadow:none;transform:none}.game-controls{flex-wrap:wrap;justify-content:center;gap:15px;display:flex}.control-button{background:linear-gradient(135deg,var(--bluey-blue),#6bb6ff);color:#fff;cursor:pointer;border:none;border-radius:20px;padding:12px 25px;font-family:Nunito,sans-serif;font-size:1rem;font-weight:600;transition:all .3s;box-shadow:0 5px 15px rgba(74,144,226,.3)}.control-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(74,144,226,.4)}.control-button.secondary{background:linear-gradient(135deg,var(--text-light),#95a5a6)}.control-button.secondary:hover{box-shadow:0 8px 20px rgba(127,140,141,.4)}.celebration-modal{z-index:2000;background:rgba(0,0,0,.8);justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-in-out fadeIn;display:flex;position:fixed;top:0;left:0}.celebration-content{background:var(--soft-white);text-align:center;border-radius:25px;width:90%;max-width:400px;padding:40px;animation:.6s ease-out bounceIn;box-shadow:0 20px 60px rgba(0,0,0,.3)}.celebration-emoji{margin-bottom:20px;font-size:4rem;animation:1s infinite bounce}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.celebration-message{color:var(--text-dark);margin-bottom:25px;font-size:1.5rem;font-weight:700}.continue-button{background:linear-gradient(135deg,var(--grass-green),#7ed321);color:#fff;cursor:pointer;border:none;border-radius:25px;padding:15px 30px;font-family:Nunito,sans-serif;font-size:1.2rem;font-weight:700;transition:all .3s;box-shadow:0 8px 25px rgba(108,207,127,.3)}.continue-button:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(108,207,127,.4)}.results-container{background:var(--soft-white);text-align:center;border-radius:25px;max-width:600px;margin:0 auto;padding:40px;box-shadow:0 20px 60px rgba(0,0,0,.1)}.results-trophy{margin-bottom:20px;font-size:4rem;animation:1s infinite bounce}.results-title{color:var(--text-dark);margin-bottom:30px;font-family:Fredoka One,cursive;font-size:2.5rem;font-weight:700}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin-bottom:30px;display:grid}.stat-card{background:linear-gradient(135deg,var(--warm-cream),#fff3e0);border:2px solid var(--bluey-blue);border-radius:15px;padding:20px}.stat-value{margin-bottom:5px;font-size:2.5rem;font-weight:700}.stat-label{color:var(--text-light);font-size:1rem;font-weight:600}.stat-card.player .stat-value{color:var(--bluey-blue)}.stat-card.computer .stat-value{color:var(--bingo-orange)}.stat-card.winrate .stat-value{color:var(--grass-green)}.game-history{margin-bottom:30px}.history-title{color:var(--text-dark);margin-bottom:20px;font-size:1.5rem;font-weight:700}.history-list{flex-direction:column;gap:10px;display:flex}.history-item{background:var(--warm-cream);border:2px solid transparent;border-radius:10px;justify-content:space-between;align-items:center;padding:15px;transition:all .3s;display:flex}.history-item:hover{border-color:var(--bluey-blue);transform:translateY(-2px)}.history-game{color:var(--text-dark);font-weight:600}.history-result{border-radius:15px;padding:5px 12px;font-size:.9rem;font-weight:600}.history-result.win{background:var(--grass-green);color:#fff}.history-result.loss{background:var(--bingo-orange);color:#fff}.history-result.tie{background:var(--text-light);color:#fff}.history-duration{color:var(--text-light);font-size:.9rem;font-weight:600}.play-again-button{background:linear-gradient(135deg,var(--bluey-blue),var(--bingo-orange));color:#fff;cursor:pointer;border:none;border-radius:25px;padding:18px 40px;font-family:Nunito,sans-serif;font-size:1.3rem;font-weight:700;transition:all .3s;box-shadow:0 8px 25px rgba(74,144,226,.3)}.play-again-button:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(74,144,226,.4)}@media (max-width:768px){.tournament-header{text-align:center;flex-direction:column}.series-score{flex-direction:column;gap:10px}.score-divider{display:none}.difficulty-options{flex-direction:column}.game-controls{flex-direction:column;align-items:center}.control-button{width:100%;max-width:200px}.board-grid{gap:10px}.cell{width:70px;height:70px;font-size:2rem}}@media (max-width:480px){.welcome-modal{margin:20px;padding:25px}.bluey-header h1{font-size:2rem}.cell{width:60px;height:60px;font-size:1.8rem}.results-container{margin:20px;padding:25px}.results-title{font-size:2rem}}
