*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#648187;min-height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:1rem}.game-container{background:#fff;border-radius:1rem;box-shadow:0 20px 60px #0000004d;padding:1.5rem;max-width:650px;margin:0 auto;width:100%}.game-header{display:flex;align-items:center;justify-content:center;gap:2rem;margin-bottom:1rem;flex-wrap:wrap}.turn-indicator{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#f0f0f0;border-radius:2rem}.turn-label{font-size:1rem;color:#666;font-weight:500}.current-player{font-size:1.5rem;font-weight:700;min-width:1.5rem;text-align:center}.current-player.player-x{color:#e74c3c}.current-player.player-o{color:#3498db}.hamburger-button{background:#fff;border:1px solid #ddd;border-radius:.3rem;padding:.5rem .75rem;font-size:1.5rem;cursor:pointer;transition:all .2s;min-width:2.5rem;text-align:center}.hamburger-button:hover{border-color:#999;background:#f9f9f9}.hamburger-button:focus{outline:none;border-color:#eb5e00;box-shadow:0 0 3px #eb5e004d}.controls-fieldset{border:1px solid #ddd;border-radius:.5rem;padding:0;background:#fff;max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease-out,opacity .3s ease-out,padding .3s ease-out}.controls-fieldset.open{max-height:300px;opacity:1;padding:1rem}.controls-legend{display:none}.controls{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap}.game-size-select-group,.obstacle-select-group{display:flex;align-items:center;gap:.5rem}.game-size-select-group label,.obstacle-select-group label{font-size:.95rem;color:#333;font-weight:500;white-space:nowrap}.game-size-select-group select,.obstacle-select-group select{padding:.5rem .75rem;border:1px solid #ccc;border-radius:.3rem;font-size:.95rem;font-family:inherit;cursor:pointer;background:#fff;color:#333;transition:all .2s}.game-size-select-group select:hover,.obstacle-select-group select:hover{border-color:#999;background:#f9f9f9}.game-size-select-group select:focus,.obstacle-select-group select:focus{outline:none;border-color:#eb5e00;box-shadow:0 0 3px #eb5e004d}.reset-button{padding:.75rem 1.5rem;background:#eb5e00;color:#fff;border:none;border-radius:.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.reset-button:hover{background:#d64a00;transform:translateY(-2px);box-shadow:0 4px 12px #eb5e0066}.reset-button:active{transform:translateY(0)}.game-main{display:flex;justify-content:center;align-items:center}.grid-container{display:grid;grid-template-columns:repeat(15,1fr);grid-template-rows:repeat(15,1fr);gap:2px;background:#ddd;border:2px solid #999;border-radius:.5rem;padding:2px;width:100%;max-width:600px;aspect-ratio:1 / 1}.grid-container.size-3{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}.grid-container.size-10{grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr)}.grid-container.size-15{grid-template-columns:repeat(15,1fr);grid-template-rows:repeat(15,1fr)}.cell{background:#fff;display:flex;justify-content:center;align-items:center;cursor:pointer;font-size:1.2rem;font-weight:700;transition:background .2s;-webkit-user-select:none;user-select:none}.cell:hover:not(.occupied){background:#f8f8ff}.cell.occupied{cursor:not-allowed}.cell[data-value=X]{color:#e74c3c}.cell[data-value=O]{color:#3498db}.cell.obstacle{background:#4a5a6e;color:#fff;cursor:not-allowed;display:flex;justify-content:center;align-items:center}.cell.obstacle:before{content:"💣";font-weight:700}.cell.winning-cell{background:linear-gradient(135deg,gold,#ffed4e);animation:winningPulse .8s ease-in-out infinite;box-shadow:0 0 15px #ffd70099;border-radius:4px}@keyframes winningPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@media (max-width: 767px){.game-container{padding:1rem}.turn-indicator{padding:.5rem 1rem}.turn-label{font-size:.875rem}.current-player{font-size:1.25rem}.reset-button{padding:.625rem 1.25rem;font-size:.875rem}.grid-container{max-width:100%;gap:1px}.cell{font-size:.875rem}}@media (min-width: 768px) and (max-width: 1023px){.grid-container{max-width:500px}.cell{font-size:1rem}}@media (min-width: 1024px){.game-container{padding:1.5rem}.grid-container{max-width:600px}.cell{font-size:1.5rem}}@media (max-width: 359px){.game-container{padding:.75rem}.turn-indicator{padding:.375rem .75rem}.turn-label{font-size:.75rem}.current-player{font-size:1rem}.reset-button{padding:.5rem 1rem;font-size:.75rem}.cell{font-size:.75rem}}.game-result-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1000;justify-content:center;align-items:center;animation:fadeIn .3s ease-out}.game-result-modal.visible{display:flex}.modal-content{background:#fff;padding:2.5rem 3rem;border-radius:1rem;box-shadow:0 20px 60px #00000080;text-align:center;animation:slideDown .4s ease-out;max-width:90%}.modal-title{font-size:2.5rem;color:#333;margin-bottom:1.5rem;font-weight:700}.modal-button{padding:.875rem 2rem;background:#eb5e00;color:#fff;border:none;border-radius:.5rem;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .2s}.modal-button:hover{background:#d64a00;transform:translateY(-2px);box-shadow:0 4px 12px #eb5e0066}.modal-button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 767px){.modal-content{padding:2rem}.modal-title{font-size:1.75rem}.modal-button{padding:.75rem 1.5rem;font-size:1rem}}@media (max-width: 359px){.modal-content{padding:1.5rem}.modal-title{font-size:1.5rem}.modal-button{padding:.625rem 1.25rem;font-size:.875rem}}.footer{margin-top:1rem;padding:.75rem 1rem;text-align:center;border-top:1px solid #e0e0e0;background-color:#fafafa;border-radius:.5rem}.footer p{margin:0;font-size:.85rem;color:#666;line-height:1.6;word-break:break-word}.footer a{color:#06c;text-decoration:none;transition:color .2s ease;cursor:pointer}.footer a:hover{color:#049;text-decoration:underline}.footer a:visited{color:#6b5b95}@media (max-width: 767px){.footer{margin-top:2rem;padding:1.5rem 1rem}.footer p{font-size:.75rem}}@media (max-width: 359px){.footer{padding:1rem .5rem}.footer p{font-size:.7rem}}