.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px}.login-card{background:#fff;padding:40px;border-radius:8px;box-shadow:0 2px 10px #0000001a;width:100%;max-width:400px}.login-card h1{text-align:center;margin-bottom:10px;color:#333}.login-card h2{text-align:center;margin-bottom:30px;color:#666;font-weight:400}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#333;font-weight:500}.form-group input{width:100%}.primary-button{width:100%;background-color:#4a90e2;color:#fff;padding:12px;font-size:16px;margin-top:10px}.switch-form{text-align:center;margin-top:20px;color:#666}.link-button{background:none;color:#4a90e2;text-decoration:underline;padding:0;font-size:inherit}.link-button:hover{color:#357abd}.lobby-container{max-width:1200px;margin:0 auto;padding:20px}.lobby-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.lobby-header h1{color:#333}.user-info{display:flex;align-items:center;gap:15px}.create-game-form{background:#fff;padding:30px;border-radius:8px;margin-bottom:30px;box-shadow:0 2px 10px #0000001a}.create-game-form h2{margin-bottom:20px;color:#333}.form-row{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.games-list h2{margin-bottom:20px;color:#333}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.game-card{background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 10px #0000001a}.game-card h3{margin-bottom:15px;color:#333}.game-info{margin-bottom:15px;color:#666;font-size:14px}.game-info div{margin-bottom:5px}.game-actions{display:flex;gap:10px}.primary-button{background-color:#4a90e2;color:#fff}.primary-button:hover{background-color:#357abd}.secondary-button{background-color:#666;color:#fff}.secondary-button:hover{background-color:#555}.no-games{text-align:center;padding:40px;color:#666;background:#fff;border-radius:8px}.game-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:20px;background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 10px #0000001a}.info-section h3{margin-bottom:10px;color:#333;font-size:16px}.player-list{display:flex;flex-direction:column;gap:5px}.player{padding:5px 10px;background-color:#f5f5f5;border-radius:4px;font-size:14px}.player.connected{background-color:#e8f5e9}.player.disconnected{background-color:#ffebee;opacity:.7}.game-board-container{max-width:1400px;margin:0 auto;padding:20px}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.back-button{background-color:#666;color:#fff}.connection-status{font-size:14px;color:#666}.board-wrapper{display:flex;justify-content:center;margin:20px 0;overflow-x:auto}.game-board{display:grid;gap:2px;background-color:#999;padding:2px;border:2px solid #666;min-width:fit-content}.cell{width:30px;height:30px;background-color:#ccc;border:1px solid #999;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;cursor:pointer;-webkit-user-select:none;user-select:none}.cell:hover:not(.revealed):not(.flagged){background-color:#ddd}.cell.revealed{background-color:#fff;cursor:default}.cell.flagged{background-color:gold}.cell.mine{background-color:red}.cell.number-1{color:#00f}.cell.number-2{color:green}.cell.number-3{color:red}.cell.number-4{color:navy}.cell.number-5{color:maroon}.cell.number-6{color:teal}.cell.number-7{color:#000}.cell.number-8{color:gray}.game-over{text-align:center;padding:20px;font-size:24px;font-weight:700;margin:20px 0;border-radius:8px}.game-over.won{background-color:#d4edda;color:#155724}.game-over.lost{background-color:#f8d7da;color:#721c24}.spectator-notice{text-align:center;padding:15px;background-color:#fff3cd;color:#856404;border-radius:4px;margin-top:20px}.not-joined{text-align:center;padding:40px;background:#fff;border-radius:8px;margin:20px 0}.error-message{background-color:#fee;color:#c33;padding:12px;border-radius:4px;margin-bottom:20px;border:1px solid #fcc}@media (max-width: 768px){.cell{width:25px;height:25px;font-size:12px}}.App{min-height:100vh}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5}#root{min-height:100vh}button{cursor:pointer;border:none;padding:8px 16px;border-radius:4px;font-size:14px;font-weight:500}button:hover{opacity:.9}button:disabled{opacity:.5;cursor:not-allowed}input{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}input:focus{outline:none;border-color:#4a90e2}