*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background-color:#f0f0f0;min-height:100vh;display:flex;justify-content:center;align-items:center}.game-container{width:100%;max-width:1200px;padding:20px;margin:0 auto;position:relative}.boards-container{display:flex;justify-content:center;gap:40px;margin-bottom:20px;position:relative;z-index:1}.board-section{flex:0 1 auto;text-align:center;position:relative;overflow:hidden}.board-section h2{margin-bottom:10px;color:#2c3e50}.game-instructions{background-color:#f8f9fa;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a;max-width:400px;margin:0 auto 20px}.start-instructions{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;padding:25px;border-radius:12px;text-align:center;box-shadow:0 4px 15px #e74c3c4d;animation:pulse 2s infinite}.start-instructions h2{margin:0 0 10px;font-size:1.8rem;font-weight:700}.start-hint{margin:0;font-size:1.1rem;opacity:.9}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.game-board{display:grid!important;grid-template-columns:repeat(10,1fr)!important;gap:1px!important;width:400px;height:400px;background-color:#34495e;padding:2px;border:2px solid #2c3e50;border-radius:8px;box-shadow:0 4px 8px #0000001a;overflow:hidden}.tile{aspect-ratio:1;background-color:#ecf0f1;border:1px solid #bdc3c7;cursor:pointer;display:flex;justify-content:center;align-items:center;font-size:1rem;transition:all .2s;border-radius:2px;position:relative;z-index:1}.tile:hover{background-color:#d6dbdf;transform:scale(1.05);z-index:2;box-shadow:0 2px 4px #0000001a}.tile.ship{background-color:#2ecc71;border-color:#27ae60;box-shadow:inset 0 0 5px #0003}.tile.hit{background-color:#e74c3c;border-color:#c0392b}.tile.miss{background-color:#95a5a6;border-color:#7f8c8d}.trivia-section{flex:1;padding:20px;background-color:#fff;border-radius:10px;box-shadow:0 0 10px #0000001a}#questionContainer{margin-bottom:20px}#questionText{margin:15px 0;font-size:18px}#answersContainer{display:grid;grid-template-columns:1fr;gap:10px}.answer-btn{padding:10px;border:1px solid #ccc;border-radius:5px;background-color:#fff;cursor:pointer;transition:background-color .3s}.answer-btn:hover{background-color:#f0f0f0}.ship-placement{margin:20px 0;display:flex;gap:10px;justify-content:center}.ship-button{padding:1rem;background-color:#3498db;color:#fff;cursor:grab;border-radius:6px;border:none;font-size:1rem;transition:all .2s;box-shadow:0 2px 4px #0000001a;-webkit-user-select:none;user-select:none}.ship-button:hover{background-color:#2980b9;transform:translate(5px);box-shadow:0 4px 8px #00000026}.ship-button.selected{background-color:#2ecc71;cursor:grabbing;box-shadow:0 4px 8px #2ecc714d}.ship-button.dragging{opacity:.5;cursor:grabbing;transform:scale(1.05);box-shadow:0 6px 12px #0003}.direction-toggle{padding:1rem;background-color:#3498db;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:1rem;transition:all .2s;box-shadow:0 2px 4px #0000001a;margin-left:10px}.direction-toggle:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.direction-toggle.vertical{background-color:#2ecc71}.direction-toggle.vertical:hover{background-color:#27ae60}#startGameButton{padding:10px 20px;background-color:#4caf50;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px;margin-top:20px}#startGameButton:disabled{background-color:#ccc;cursor:not-allowed}.tile.incorrect{position:relative}.tile.incorrect:after{content:"✗";color:red;font-size:20px}.tile.hit:after{content:"✗";color:#fff;font-size:20px}.tile.miss:after{content:"○";color:#006400;font-size:20px}.tile.valid-placement{background:#2ecc714d;border:2px solid #2ecc71;box-shadow:0 0 5px #2ecc7180}.tile.invalid-placement{background:#e74c3c4d;border:2px solid #e74c3c;box-shadow:0 0 5px #e74c3c80}.multiplayer-options{background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 0 10px #0000001a;max-width:600px;margin:0 auto 20px;position:relative;z-index:10}.lobby-buttons{display:flex;flex-direction:column;gap:15px;margin-bottom:20px}.lobby-btn{padding:12px 24px;background-color:#3498db;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:16px;transition:background-color .3s}.lobby-btn:hover{background-color:#2980b9}.join-game-container{display:flex;gap:10px}.game-code-input{flex:1;padding:12px;border:1px solid #ddd;border-radius:6px;font-size:16px}.lobby-status{text-align:center;padding:20px;background-color:#f8f9fa;border-radius:8px;margin-top:20px}.lobby-status h3{color:#2c3e50;margin-bottom:15px}.players-list{margin:20px 0}.player-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background-color:#fff;border-radius:6px;margin-bottom:10px;box-shadow:0 2px 4px #0000000d}.ready-status{padding:5px 10px;border-radius:4px;font-size:14px}.ready-status.ready{background-color:#2ecc71;color:#fff}.ready-btn{padding:12px 24px;background-color:#2ecc71;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:16px;transition:all .3s}.ready-btn:hover{background-color:#27ae60}.ready-btn.ready{background-color:#e74c3c}.ready-btn.ready:hover{background-color:#c0392b}.game-mode-options{background-color:#fff;padding:30px;border-radius:10px;box-shadow:0 0 10px #0000001a;max-width:400px;margin:0 auto 20px;text-align:center}.game-mode-options h2{color:#2c3e50;margin-bottom:20px;font-size:24px}.mode-buttons{display:flex;flex-direction:column;gap:15px}.mode-btn{padding:15px 30px;font-size:18px;border:none;border-radius:6px;cursor:pointer;transition:all .3s;background-color:#3498db;color:#fff}.mode-btn:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}