:root{
--jv-bg-container:#ffffff;
--jv-bg-container-light:#f8f9fa;
--jv-text-primary:#343a40;
--jv-text-secondary:#6c757d;
--jv-border-light:#e9ecef;
--jv-border-medium:#dee2e6;
--jv-box-shadow-sm:0 2px 10px rgba(0,0,0,0.05);
--jv-box-shadow-md:0 4px 20px rgba(0,0,0,0.08);
--jv-hover-bg:#f8f9fa;
--jv-cell-x-text:#dc3545;
--jv-cell-x-bg:rgba(220,53,69,0.05);
--jv-cell-o-text:#0072bc;
--jv-cell-o-bg:rgba(0,114,188,0.05);
--jv-status-bg:#f8f9fa;
--jv-status-border:#dee2e6;
--jv-timer-inactive-bg:#fff3cd;
--jv-timer-inactive-border:#ffc107;
--jv-timer-inactive-text:#343a40;
--jv-timer-active-bg:#d4edda;
--jv-timer-active-border:#28a745;
--jv-timer-active-text:#155724;
--jv-winning-bg-start:#28a745;
--jv-winning-bg-end:#20c997;
--jv-reset-btn-start:#fd7e14;
--jv-reset-btn-end:#e8590c;
}
[data-theme="dark"]{
--jv-bg-container:#2d2d2d;
--jv-bg-container-light:#3a3a3a;
--jv-text-primary:#e9ecef;
--jv-text-secondary:#adb5bd;
--jv-border-light:#495057;
--jv-border-medium:#495057;
--jv-box-shadow-sm:0 2px 10px rgba(0,0,0,0.3);
--jv-box-shadow-md:0 4px 20px rgba(0,0,0,0.4);
--jv-hover-bg:#3a3a3a;
--jv-cell-x-text:#ff6b6b;
--jv-cell-x-bg:rgba(255,107,107,0.15);
--jv-cell-o-text:#4dabf7;
--jv-cell-o-bg:rgba(77,171,247,0.15);
--jv-status-bg:#3a3a3a;
--jv-status-border:#495057;
--jv-timer-inactive-bg:#4e3e01;
--jv-timer-inactive-border:#f59f00;
--jv-timer-inactive-text:#ffffff;
--jv-timer-active-bg:#254e2d;
--jv-timer-active-border:#43ae55;
--jv-timer-active-text:#ffffff;
--jv-winning-bg-start:#2d5f37;
--jv-winning-bg-end:#40c057;
--jv-reset-btn-start:#ff922b;
--jv-reset-btn-end:#fd7e14;
}
.jogo-da-velha-infinito-container{max-width:600px;margin:0 auto;padding:2rem;background:linear-gradient(135deg,var(--jv-bg-container),var(--jv-bg-container-light));border-radius:1rem;box-shadow:var(--jv-box-shadow-md);border:1px solid var(--jv-border-light);position:relative;overflow:hidden;}
.jogo-da-velha-infinito-options{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:auto auto;gap:1.5rem;margin-bottom:2rem;padding:1.5rem;background:var(--jv-bg-container);border-radius:.75rem;box-shadow:var(--jv-box-shadow-sm);border:1px solid var(--jv-border-light);}
.jogo-da-velha-infinito-options .infinite-mode-wrapper{grid-column:1/-1;display:flex;align-items:center;gap:.75rem;font-weight:600;color:var(--jv-text-primary);font-size:1rem;margin-top:.5rem;min-height:40px;}
.jogo-da-velha-infinito-options label{display:flex;flex-direction:column;gap:.5rem;font-weight:600;color:var(--jv-text-primary);font-size:1rem;}
.jogo-da-velha-infinito-options label span{font-weight:600;color:var(--jv-text-primary);}
.jogo-da-velha-infinito-options select{padding:.75rem 1rem;font-size:1rem;font-weight:500;border:2px solid var(--jv-border-light);border-radius:.5rem;background-color:var(--jv-bg-container);color:var(--jv-text-primary);cursor:pointer;transition:all .3s ease;}
.jogo-da-velha-infinito-options select:focus{outline:none;border-color:var(--primary-green);box-shadow:0 0 0 3px rgba(0,166,81,0.1);}
.jogo-da-velha-infinito-options select:hover{border-color:var(--primary-blue);background-color:var(--jv-hover-bg);}
.jogo-da-velha-infinito-start,.jogo-da-velha-infinito-stop{display:block;margin:0 auto 1.5rem;padding:1rem 2.5rem;font-size:1.1rem;font-weight:700;border:none;border-radius:.75rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px rgba(0,0,0,0.1);min-width:200px;display:flex;align-items:center;justify-content:center;gap:.5rem;}
.jogo-da-velha-infinito-start{background:linear-gradient(135deg,var(--primary-green),var(--primary-blue));color:#fff;}
.jogo-da-velha-infinito-start:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,166,81,0.3);background:linear-gradient(135deg,var(--dark-green),var(--dark-blue));}
.jogo-da-velha-infinito-stop{background:linear-gradient(135deg,var(--danger),#c82333);color:#fff;display:none;}
.jogo-da-velha-infinito-stop:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px rgba(220,53,69,0.3);background:linear-gradient(135deg,#c82333,#bd2130);}
.jogo-da-velha-infinito-start:disabled,.jogo-da-velha-infinito-stop:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.jogo-da-velha-infinito-board{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0 auto 2rem;max-width:350px;padding:1.5rem;background:var(--jv-bg-container);border-radius:1rem;box-shadow:var(--jv-box-shadow-md);border:1px solid var(--jv-border-light);}
.jogo-da-velha-infinito-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:3.5rem;font-weight:900;cursor:pointer;border:0 solid var(--jv-text-primary);background:var(--jv-bg-container);border-radius:0;transition:all .3s ease;position:relative;overflow:hidden;color:var(--jv-text-primary);min-height:80px;font-family:'Courier New',monospace;}
.jogo-da-velha-infinito-cell:nth-child(1){border-right-width:3px;border-bottom-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(2){border-right-width:3px;border-bottom-width:3px;border-left-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(3){border-left-width:3px;border-bottom-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(4){border-right-width:3px;border-bottom-width:3px;border-top-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(5){border:3px solid var(--jv-text-primary);}
.jogo-da-velha-infinito-cell:nth-child(6){border-left-width:3px;border-bottom-width:3px;border-top-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(7){border-right-width:3px;border-top-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(8){border-right-width:3px;border-top-width:3px;border-left-width:3px;}
.jogo-da-velha-infinito-cell:nth-child(9){border-left-width:3px;border-top-width:3px;}
.jogo-da-velha-infinito-cell.x{font-size:65px;color:var(--jv-cell-x-text);background:var(--jv-cell-x-bg);}
.jogo-da-velha-infinito-cell.o{font-size:65px;color:var(--jv-cell-o-text);background:var(--jv-cell-o-bg);}
.jogo-da-velha-infinito-cell:hover{box-shadow:inset 0 0 20px rgba(0,114,188,0.1);background:var(--jv-hover-bg);}
.jogo-da-velha-infinito-cell:hover::before{content:attr(data-preview);position:absolute;font-size:65px;opacity:.25;color:inherit;pointer-events:none;}
.jogo-da-velha-infinito-controls{display:flex;gap:1rem;justify-content:center;margin-bottom:1.5rem;flex-wrap:wrap;}
.jogo-da-velha-infinito-timer{text-align:center;margin-bottom:1.5rem;font-size:1.2rem;font-weight:600;color:var(--jv-timer-inactive-text);padding:1rem;background:linear-gradient(135deg,var(--jv-timer-inactive-bg),#b7a877);border-radius:.75rem;border:2px solid var(--jv-timer-inactive-border);display:flex;align-items:center;justify-content:center;gap:.5rem;opacity:.85;transition:all .3s ease;width:100%;}
.jogo-da-velha-infinito-timer.active{opacity:1;background:linear-gradient(135deg,var(--jv-timer-active-bg),#546558);border-color:var(--jv-timer-active-border);color:var(--jv-timer-active-text)!important;}
.jogo-da-velha-infinito-timer.warning{color:var(--jv-timer-inactive-text)!important;opacity:.9;}
.jogo-da-velha-infinito-timer.active.warning{color:var(--jv-timer-active-text)!important;}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.02);}}
.jogo-da-velha-infinito-score{text-align:center;margin-bottom:1rem;font-size:1.2rem;font-weight:700;color:var(--jv-text-primary);padding:1rem;background:linear-gradient(135deg,var(--jv-bg-container),var(--jv-bg-container-light));border-radius:.75rem;border:1px solid var(--jv-border-light);display:grid;grid-template-columns:auto 1fr 1fr auto;grid-template-rows:auto auto;gap:1rem;align-items:center;}
.jogo-da-velha-infinito-score>svg{grid-column:1;grid-row:1;}
.score-item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.5rem;background:linear-gradient(135deg,var(--jv-bg-container-light),var(--jv-border-light));border:1px solid var(--jv-border-medium);}
.score-x{grid-column:2;grid-row:1;color:var(--jv-cell-x-text);}
.score-o{grid-column:3;grid-row:1;color:var(--primary-blue);}
.jogo-da-velha-infinito-reset-score{grid-column:4;grid-row:1;}
.jogo-da-velha-infinito-status{grid-column:1/-1;text-align:center;font-size:1.1rem;font-weight:700;color:var(--jv-text-primary);padding:.75rem;background:linear-gradient(135deg,var(--jv-status-bg),var(--jv-border-light));border-radius:.5rem;border:1px solid var(--jv-status-border);display:flex;align-items:center;justify-content:center;gap:.5rem;margin:1rem 0 0;margin-bottom: 20px;}
.jogo-da-velha-infinito-reiniciar,.jogo-da-velha-infinito-reset-score{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.9rem;font-weight:600;border:none;border-radius:.5rem;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.jogo-da-velha-infinito-reset-score{background:linear-gradient(135deg,var(--jv-reset-btn-start),var(--jv-reset-btn-end));color:#fff;}
.jogo-da-velha-infinito-reset-score:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px rgba(253,126,20,0.3);background:linear-gradient(135deg,#e8590c,#d63384);}
.jogo-da-velha-infinito-reset-score:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
@media (max-width:768px){
.jogo-da-velha-infinito-container{padding:1.5rem;margin:1rem;}
.jogo-da-velha-infinito-options{grid-template-columns:1fr;gap:1rem;padding:1rem;}
.jogo-da-velha-infinito-options .infinite-mode-wrapper{grid-column:1;margin-top:0;}
.jogo-da-velha-infinito-controls{flex-direction:column;align-items:center;gap:.75rem;}
.jogo-da-velha-infinito-board{max-width:300px;padding:1rem;gap:0;}
.jogo-da-velha-infinito-cell{font-size:2.5rem;min-height:70px;}
.jogo-da-velha-infinito-start{padding:.875rem 2rem;font-size:1rem;min-width:180px;}
.jogo-da-velha-infinito-stop{padding:.875rem 2rem;font-size:1rem;min-width:180px;}
.jogo-da-velha-infinito-timer{font-size:1rem;padding:.875rem;}
.jogo-da-velha-infinito-score{font-size:1rem;padding:.875rem;grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto;gap:.5rem;}
.jogo-da-velha-infinito-score>svg{grid-column:1;grid-row:1;justify-self:center;}
.score-x{grid-column:1;grid-row:2;}
.score-o{grid-column:1;grid-row:3;}
.jogo-da-velha-infinito-reset-score{grid-column:1;grid-row:4;margin:0;padding:.625rem 1.25rem;font-size:.875rem;}
.jogo-da-velha-infinito-status{grid-column:1;font-size:1rem;padding:.75rem;}
.jogo-da-velha-infinito-reiniciar{margin-left:0;margin-top:.5rem;padding:.625rem 1.25rem;font-size:.875rem;}
}
@media (max-width:480px){
.jogo-da-velha-infinito-container{padding:1rem;margin:.5rem;}
.jogo-da-velha-infinito-board{max-width:260px;padding:.75rem;gap:0;}
.jogo-da-velha-infinito-cell{font-size:2rem;min-height:60px;}
.jogo-da-velha-infinito-options{padding:.75rem;}
.jogo-da-velha-infinito-start{padding:.75rem 1.5rem;font-size:.95rem;min-width:160px;}
.jogo-da-velha-infinito-stop{padding:.75rem 1.5rem;font-size:.95rem;min-width:160px;}
}
/* Estados especiais */
.jogo-da-velha-infinito-cell.winning{background:linear-gradient(135deg,var(--jv-winning-bg-start),var(--jv-winning-bg-end));color:#fff;}
.jogo-da-velha-infinito-cell.slide-out{animation:slideOut .5s ease-in-out;}
@keyframes slideOut{0%{opacity:1;transform:scale(1);}100%{opacity:.3;transform:scale(1);}}
.jogo-da-velha-infinito-container{animation:fadeInUp .5s ease-out;}
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.jogo-da-velha-infinito-start.hidden,.jogo-da-velha-infinito-stop.hidden{display:none!important;}
.jogo-da-velha-infinito-start.visible,.jogo-da-velha-infinito-stop.visible{display:flex!important;}
.hidden{display:none!important;}