.header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:clamp(.8rem,2vw,1.2rem);box-shadow:0 4px 20px #0000001a;margin:0 auto 2rem;padding:clamp(1rem,3vw,1.5rem);text-align:center;width:min(95%,800px)}.title{background:linear-gradient(90deg,var(--player1),var(--player2));-webkit-background-clip:text;background-clip:text;font-size:clamp(1.8rem,6vw,2.5rem);font-weight:800;line-height:1.2;margin:0 0 .3rem;padding:.2rem 0}.title,.titleQuatroEmLinha{color:#0000;letter-spacing:-.03em}.titleQuatroEmLinha{background:linear-gradient(90deg,#f36,#ff8c00);-webkit-background-clip:text;background-clip:text;display:inline-block;font-size:clamp(.8rem,5.5vw,2rem);font-weight:900;line-height:1.1;margin:.5rem 0;padding:.5rem 0;position:relative;text-shadow:0 2px 8px #ff33664d}.titleQuatroEmLinha:after{background:linear-gradient(90deg,#f36,#ff8c00);border-radius:3px;bottom:0;content:"";height:clamp(2px,.3vw,4px);left:50%;position:absolute;transform:translateX(-50%);width:min(70%,300px)}.subtitleLS{color:var(--text-gray);font-size:clamp(.2rem,3vw,1.8rem);font-weight:600;letter-spacing:clamp(.01em,.2vw,.03em);line-height:1.4;margin:.5rem auto;max-width:90%;opacity:.9}@media (hover:hover){.titleQuatroEmLinha:hover{text-shadow:0 2px 12px #f366;transform:scale(1.02);transition:all .3s ease}}@media (max-width:480px){.header{margin-bottom:1.5rem;padding:.8rem}.titleQuatroEmLinha:after{width:85%}}.footer{color:var(--text-gray);display:flex;flex-direction:column;font-size:.9rem;gap:.5rem;margin-top:auto;padding:2rem;text-align:center}.resultado-container{background:#000000b3}.muda-jogador-container,.resultado-container{align-items:center;display:flex;height:100%;justify-content:center;position:fixed;width:100%;z-index:3000}.muda-jogador-container{background:#0000;border:1px solid #0000;border-radius:12px}.card-resultado{align-items:center;background:#fff;border-radius:1.5rem;box-shadow:0 8px 32px #0000002e;display:flex;flex-direction:column;max-width:400px;padding:2rem;text-align:center;width:90%;z-index:3100}.trofeu{animation:pulse 1s infinite alternate;font-size:4rem}.trofeu,.vencedor{margin-bottom:1rem}.vencedor{color:#6c5ce7;font-size:1.5rem;font-weight:700}.pontuacao{color:#00b894;font-size:1.3rem;font-weight:700;margin-bottom:1.5rem}.botao-fechar{background:linear-gradient(135deg,#6c5ce7,#00b894);border:none;border-radius:2rem;box-shadow:0 4px 15px #6c5ce71f;color:#fff;cursor:pointer;font-size:clamp(1rem,2vw,1.1rem);margin-top:1rem;overflow:hidden;padding:1rem 2rem;position:relative}.botao-fechar:hover{background:linear-gradient(135deg,#00b894,#6c5ce7);box-shadow:0 8px 30px #6c5ce72e;transform:translateY(-2px) scale(1.04)}@media (max-width:600px){.card-resultado{max-width:95vw;padding:1rem}.trofeu{font-size:2.5rem}.vencedor{font-size:1.1rem}.botao-fechar,.pontuacao{font-size:1rem}.botao-fechar{padding:.8rem 1.2rem}}.flex-container{align-items:flex-start;display:flex;justify-content:space-between}.tabuleiro-container{flex:2 1;margin:0 10px}.cell-container{align-items:center;display:flex;flex-direction:column;position:relative}.cell-container2,.cell2{height:100%;position:relative;width:100%}.cell2{background-color:#ffffff1a;border-radius:50%;box-shadow:inset 0 4px 8px #0000004d;cursor:pointer;overflow:hidden;transition:all .3s ease}.cell{aspect-ratio:1/1;box-shadow:inset 0 4px 10px #0006;max-height:120px;max-width:120px;min-height:50px;min-width:50px}.cell,.cell3{background:radial-gradient(circle,#e0e0e0,#b0bec5);border-radius:50%;cursor:pointer;height:100%;transition:all .3s ease-in-out;width:100%}.cell3{align-items:center;box-shadow:inset 0 4px 8px #0006;justify-content:center;position:relative;transition:all .3s ease}.testeRed{background-color:red}.testeYellow{background-color:#ff0}.cellTeste{border-radius:50%;box-shadow:inset 0 2px 6px #0006;cursor:pointer;height:100%;transition:all .3s ease-in-out;width:100%}.cell.first-row{background:radial-gradient(circle,#ffcc80,#ffb74d);border:2px solid #ffa726}.cell:hover{transform:scale(1.1)}.cell.red{background:radial-gradient(circle at 30% 30%,#ff5252,#b71c1c)}.cell.yellow{background:radial-gradient(circle at 30% 30%,#ffee58,#fbc02d)}.cell.highlight{outline:3px solid #fff9}.cell.highlight1{background:linear-gradient(145deg,#4facfe,#00f2fe)}.cell.highlight2{background:linear-gradient(145deg,#00cfff,#8b00ff)}.cell.win{animation:pulsarVitoria 1s infinite alternate;border:2px solid gold;box-shadow:0 0 20px 6px gold}@keyframes pulsarVitoria{0%{transform:scale(1)}to{transform:scale(1.2)}}.cell.bonus{animation:pulse 1.5s infinite;background-color:#ffeb3b;border:2px solid #fbc02d;box-shadow:0 0 10px 2px #fbc02d}@keyframes pulse{0%{box-shadow:0 0 10px 2px #fbc02d;transform:scale(1)}50%{box-shadow:0 0 15px 4px #fbc02d;transform:scale(1.1)}to{box-shadow:0 0 10px 2px #fbc02d;transform:scale(1)}}.form-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#ffffffe6;border:2px solid #ffffff4d;border-radius:1.5rem;box-shadow:0 8px 32px #0000001a;margin:2rem auto;max-width:400px;padding:2rem}.form-title{color:#2d3436;font-size:1.5rem;letter-spacing:1px;margin-bottom:1.5rem;text-align:center;text-transform:uppercase}.player-form{display:flex;flex-direction:column;gap:1.2rem}.input-field{align-items:center;background-color:#ffffffb3;border:2px solid #6c5ce7;border-radius:.8rem;display:flex;gap:.8rem;padding:.8rem 1.2rem}.input-field.disabled{border-color:#00b894}.input-icon{color:#6c5ce7;font-size:1.2rem}.input-field.disabled .input-icon{color:#00b894}.name-input{background:#0000;border:none;color:#2d3436;flex:1 1;font-size:1rem;padding:.2rem}.name-input:focus{outline:none}.name-input::placeholder{color:#636e72;opacity:.7}.form-buttons{display:flex;gap:1rem;margin-top:1rem}.form-button{align-items:center;border:none;border-radius:2rem;box-shadow:0 4px 15px #6c5ce71f;cursor:pointer;display:flex;flex:1 1;font-size:clamp(.9rem,2vw,1.1rem);gap:.5rem;justify-content:center;overflow:hidden;padding:1rem 2rem;position:relative;transition:all .3s ease}.confirm-button,.form-button{background:linear-gradient(135deg,#6c5ce7,#00b894);color:#fff}.confirm-button:hover:enabled{background:linear-gradient(135deg,#00b894,#6c5ce7);box-shadow:0 8px 30px #6c5ce72e;transform:translateY(-2px) scale(1.04)}.cancel-button{background:linear-gradient(135deg,#ff7675,#fdcb6e);color:#fff}.cancel-button:hover:enabled{background:linear-gradient(135deg,#fdcb6e,#ff7675);box-shadow:0 8px 30px #ff76752e;transform:translateY(-2px) scale(1.04)}.form-button:disabled{background:#e0e0e0!important;box-shadow:none;color:#bdbdbd!important;cursor:not-allowed;transform:none}.playerCard{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffffe6;border:1px solid #0000;border-radius:12px;box-shadow:0 4px 10px #0000001a;margin:0 2rem;padding:1rem;transition:all .3s ease;width:170px}.activePlayer1{border-color:#6c5ce7;box-shadow:0 8px 24px #6c5ce733}.activePlayer2{border-color:#00b894}.activePlayer2,.noActive{box-shadow:0 8px 24px #00b89433}.noActive{border-color:#000}.content,.playerBadge{align-items:center;display:flex;flex-direction:column}.content{gap:.5rem}.playerInfo{align-items:center;display:flex;flex-direction:column}.playerName{color:var(--text-gray);font-size:1.2rem;font-weight:600;letter-spacing:.1rem;margin-bottom:.02rem;text-transform:uppercase}.score{color:var(--text-dark);font-size:1rem;font-weight:700;line-height:1}.timerWrapper{border-top:1px solid #0000001a;font-size:.9rem;margin-top:.5rem;padding-top:.5rem;text-align:center;width:100%}.boardContainer{margin:20px auto;perspective:1000px}.board0,.boardContainer{max-width:900px;padding:10px;width:100%}.board0{background-color:#1974a9;margin:auto}.board0,.board1{grid-gap:10px;aspect-ratio:7/7;border:6px solid #070b59;border-radius:12px;box-shadow:0 8px 16px #0006;display:grid;gap:10px;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr)}.board1{background-color:#fff;margin:0 auto}.board1,.board2{max-width:800px;padding:10px;width:100%}.board2{grid-gap:10px;aspect-ratio:7/6;background-color:#1974a9;border:6px solid #070b59;border-radius:12px;box-shadow:0 8px 16px #0006,inset 0 0 30px #0000004d;display:grid;gap:10px;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(6,1fr);overflow:hidden;position:relative}@media (max-width:768px){#board{gap:8px;max-width:600px}}@media (max-width:480px){#board{gap:5px;max-width:90%}}.controle-container{display:flex;gap:1.5rem;justify-content:center;margin:2rem 0}.controle-button{align-items:center;border:none;border-radius:2rem;box-shadow:0 4px 15px #6c5ce71f;color:#fff;cursor:pointer;display:flex;font-size:clamp(.9rem,2vw,1.1rem);gap:.8rem;justify-content:center;overflow:hidden;padding:1rem 2rem;position:relative;transition:all .3s ease}.controle-button,.reiniciar-button{background:linear-gradient(135deg,#6c5ce7,#00b894)}.reiniciar-button:hover:enabled{background:linear-gradient(135deg,#00b894,#6c5ce7);box-shadow:0 8px 30px #6c5ce72e;transform:translateY(-2px) scale(1.04)}.voltar-button{background:linear-gradient(135deg,#ff7675,#fdcb6e)}.voltar-button:hover:enabled{background:linear-gradient(135deg,#fdcb6e,#ff7675);box-shadow:0 8px 30px #ff76752e;transform:translateY(-2px) scale(1.04)}.button-icon{font-size:1.2rem}.controle-button:hover .button-icon{transform:rotate(15deg) scale(1.1)}.controle-button:disabled{background:#e0e0e0!important;border:none!important;box-shadow:none;color:#bdbdbd!important;cursor:not-allowed;transform:none}@media (max-width:600px){.controle-container{align-items:center;flex-direction:column;gap:1rem}.controle-button{font-size:.95rem;max-width:320px;padding:1rem;width:90vw}}:root{--player1:#6c5ce7;--player2:#00b894;--accent:#ff7675;--background:#f8f9fa;--text-dark:#2d3436;--text-gray:#636e72;--board-bg:#e8f4f3;--globalColor:#8a7d7d}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{background:#f8f9fa;background:var(--background);color:#2d3436;color:var(--text-dark);flex-direction:column;font-family:Poppins,sans-serif;min-height:100vh}#root,body{display:flex}#root{flex:1 1;flex-direction:column;margin:0 auto;max-width:1280px;padding:2rem;text-align:center}main{width:100%}.app-container{align-items:center;flex:1 1;flex-direction:column;margin:0 auto;max-width:1200px;min-height:100vh;padding:2rem 1rem;width:100%}.app-container,.main-content{display:flex;justify-content:center}.main-content{flex:1 1;padding:2rem}.start-screen{margin:0 auto;max-width:500px;width:100%}.content-box{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffe6;border:1px solid #fff3;border-radius:.8rem;box-shadow:0 8px 32px #0000001a;display:grid;justify-content:center;max-width:700px;padding:3rem 4rem;text-align:center}.mode-selector-container{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff1a;border:1px solid #fff3;border-radius:1.5rem;box-shadow:0 8px 32px #0000001a;padding:2rem}.mode-buttons-container,.mode-selection,.players-container{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;margin:2rem 0}.mode-buttons-container,.mode-selection{gap:1.5rem}.back-button-container{display:flex;justify-content:center;width:100%}.game-title,.subtitle,.title,.titleModoJogo{color:#2d3436;color:var(--text-dark);font-family:inherit;font-weight:700;letter-spacing:-.05em;margin:.5rem 0;text-align:center}.subtitle,.title{color:#8a7d7d;color:var(--globalColor);font-size:1.1rem;letter-spacing:2px;line-height:1.75em}.titleModoJogo{font-size:clamp(1.2rem,3vw,1.5rem)}.game-title{color:#8a7d7d;color:var(--globalColor);font-size:clamp(.8rem,3.5vw,1.8rem);margin-bottom:2rem;text-shadow:0 2px 4px #0000004d}.back-button,.button,.game-mode-button,.reset-button,.start-game-button{align-items:center;border:none;border-radius:2rem;color:#fff;cursor:pointer;display:flex;font-size:clamp(.8rem,2.5vw,1.1rem);gap:.8rem;justify-content:center;max-width:350px;overflow:hidden;padding:1rem 2rem;position:relative;transition:all .3s ease}.button,.game-mode-button,.reset-button{background:#fff;border:2px solid #6c5ce7;border:2px solid var(--player1);box-shadow:0 4px 15px #6c5ce71a;color:#6c5ce7;color:var(--player1)}.button:hover,.game-mode-button:hover,.reset-button:hover{background:#6c5ce7;background:var(--player1);color:#fff;transform:translateY(-2px) scale(1.04)}.pvp-button{background:#6c5ce7;background:var(--player1);color:#fff}.pvc-button{border-color:#00b894;border-color:var(--player2);box-shadow:0 4px 15px #00b8941a}.pvc-button,.pvc-button:hover{background:#00b894;background:var(--player2);color:#fff}.start-game-button{background:linear-gradient(135deg,#6c5ce7,#00b894);font-size:clamp(1rem,1.5vw,1rem)!important;justify-content:inherit}.start-game-button:hover{box-shadow:0 8px 30px #6c5ce780;transform:translateY(-3px)}.back-button{background:linear-gradient(135deg,#ff7675,#fdcb6e);font-size:1rem;margin-top:1.5rem;padding:.8rem 1.5rem}.back-button:hover{box-shadow:0 4px 15px #ff76754d;transform:translateY(-2px)}.hover-effect{background:linear-gradient(90deg,#0000,#fff3,#0000);height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%}.start-game-button:hover .hover-effect{left:100%}.back-button:before{background:linear-gradient(90deg,#0000,#fff3,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%}.back-button:hover:before{left:100%}.button-icon{font-size:1.2em;transition:transform .3s}.start-game-button:hover .button-icon{transform:rotate(90deg)}.button-text{position:relative;z-index:1}@media (max-width:768px){.mode-buttons-container,.mode-selection,.players-container{align-items:center;flex-direction:column;gap:1rem}.back-button,.button,.game-mode-button,.reset-button,.start-game-button{font-size:1rem;max-width:350px;padding:1rem;width:90vw}}