.lobby{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px}.lobby h1{margin-bottom:40px;color:#333}.lobby h2{margin-bottom:30px;color:#555}.menu-buttons{display:flex;gap:20px}.menu-buttons button{padding:15px 40px;font-size:18px;background-color:#4caf50;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s}.menu-buttons button:hover{background-color:#45a049}.form{display:flex;flex-direction:column;gap:15px;min-width:300px}.form input{padding:12px;font-size:16px;border:2px solid #ddd;border-radius:6px;outline:none}.form input:focus{border-color:#4caf50}.button-group{display:flex;gap:10px;margin-top:10px}.button-group button{flex:1;padding:12px;font-size:16px;border:none;border-radius:6px;cursor:pointer;transition:background-color .3s}.button-group button:first-child{background-color:#4caf50;color:#fff}.button-group button:first-child:hover{background-color:#45a049}.button-group button:last-child{background-color:#f44336;color:#fff}.button-group button:last-child:hover{background-color:#da190b}.waiting{text-align:center}.waiting .room-code{font-size:24px;font-weight:700;color:#4caf50;margin:20px 0;padding:15px;background-color:#f0f0f0;border-radius:8px}.game-info{position:fixed;top:10px;right:10px;background-color:#fff;padding:15px;border-radius:8px;box-shadow:0 2px 10px #0000001a}.game-info p{margin:5px 0}.game-info .turn{font-weight:700;color:#4caf50}.choose-side-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;background-color:#f0f0f0;border-radius:10px;box-shadow:0 4px 12px #0000001a;text-align:center}.wheel-wrapper{position:relative;width:300px;height:300px;margin:20px 0}.wheel{width:100%;height:100%;border-radius:50%;border:2px solid #333;position:relative;overflow:hidden;background:conic-gradient(from 0deg,#fff 0deg 180deg,#fff 180deg 360deg)}.wheel.winner-host{background:conic-gradient(from 0deg,#fcc 0deg 180deg,#ccf 180deg 360deg)}.wheel.winner-guest{background:conic-gradient(from 0deg,#ccf 0deg 180deg,#fcc 180deg 360deg)}.wheel:after{content:"";position:absolute;width:1px;height:100%;background-color:#000;left:50%;top:0;transform:translate(-50%);z-index:5}.half{position:absolute;width:50%;height:100%;display:flex;align-items:center;justify-content:center;font-size:1.5em;font-weight:700}.half-1{left:0;transform:rotate(-90deg) translate(75px);color:#0c0100}.half-2{right:0;transform:rotate(90deg) translate(-75px);color:#0c0100}.pointer{position:absolute;top:-10px;left:50%;transform:translate(-50%);width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-top:25px solid #e67e22;z-index:10}.spin-button{padding:10px 20px;font-size:1.2em;cursor:pointer;border:none;background-color:#2ecc71;color:#fff;border-radius:5px;transition:background-color .3s}.spin-button:disabled{background-color:#95a5a6;cursor:not-allowed}.spin-button:hover:not(:disabled){background-color:#27ae60}.result{margin-top:20px;font-size:1.5em;color:#34495e}.countdown-message{margin-top:20px;font-size:1.3em;color:#34495e;font-weight:700}.formation-select-container{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:600px;margin:40px auto;background-color:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a}.subtitle{color:#666;margin-bottom:20px}.opponent-formation-preview{margin-bottom:20px;padding:10px;border:1px solid #ddd;border-radius:4px;background-color:#f9f9f9;text-align:center}.opponent-formation-preview h4{margin:0 0 5px;color:#333}.opponent-formation-preview p{margin:0;font-weight:700;color:#e74c3c}.formations-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;width:100%}.formation-card{border:2px solid #ccc;border-radius:8px;padding:15px;cursor:pointer;transition:all .2s ease-in-out;text-align:center;position:relative}.formation-card:hover{border-color:#3498db;transform:translateY(-3px)}.formation-card.selected{border-color:#2ecc71;background-color:#e8f8ef;box-shadow:0 0 10px #2ecc7180}.formation-card.disabled{cursor:not-allowed;opacity:.6}.formation-name{font-size:1.2em;font-weight:700;margin-bottom:10px}.formation-pattern{display:flex;justify-content:center;gap:10px}.piece-slot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff}.piece-slot.type-0{background-color:#c0392b}.piece-slot.type-2{background-color:#2980b9}.check-mark{position:absolute;top:10px;right:10px;font-size:1.5em;color:#2ecc71}.submit-button{margin-top:30px;padding:12px 25px;font-size:1.1em;font-weight:700;cursor:pointer;border:none;background-color:#3498db;color:#fff;border-radius:5px;transition:background-color .3s}.submit-button:hover{background-color:#2980b9}.waiting-message{margin-top:30px;font-size:1.2em;color:#555;font-weight:700}.timer{padding:10px;border:2px solid #ccc;border-radius:8px;text-align:center;width:180px;margin:10px;background-color:#f9f9f9;transition:all .3s ease}.timer.active{border-color:#4caf50;box-shadow:0 0 10px #4caf5080}.timer h2{margin-top:0;font-size:1.2em}.time-display{font-size:2.5em;font-family:Orbitron,sans-serif;margin:10px 0;color:#333}.timer.active .time-display{color:#000}.byoyomi-display{font-size:1em;color:#d9534f;font-weight:700}.chat-container{display:flex;flex-direction:column;height:400px;max-height:400px;border:1px solid #ccc;border-radius:8px;overflow:hidden;background-color:#f9f9f9;width:100%;box-sizing:border-box}.messages{flex-grow:1;padding:10px;overflow-y:auto}.message{margin-bottom:8px;line-height:1.4;padding:8px 12px;border-radius:15px;max-width:80%;word-wrap:break-word;align-self:flex-start;background-color:#e9e9eb;color:#000}.message.my-message{align-self:flex-end;background-color:#007bff;color:#fff}.message .nickname{font-weight:700;margin-right:5px;display:block;font-size:.9em;margin-bottom:3px}.message .timestamp{font-size:.8em;color:#888;margin-left:10px;display:inline-block;margin-top:4px}.message.my-message .timestamp{color:#f0f0f0}.chat-form{display:flex;padding:10px;border-top:1px solid #ccc;background-color:#fff}.chat-form input{flex-grow:1;border:1px solid #ddd;padding:8px;border-radius:4px;margin-right:10px}.chat-form button{padding:8px 12px;border:none;background-color:#007bff;color:#fff;border-radius:4px;cursor:pointer;transition:background-color .2s}.chat-form button:hover{background-color:#0056b3}.board-container{display:inline-block;padding:4px 0 0;background:url(/images/%EC%9E%A5%EA%B8%B0%ED%8C%90.png) no-repeat 2px 0px;background-color:#cfa63e59;background-size:74.4%;box-shadow:0 12px 24px #00000059;transition:transform .3s ease;height:765px}.board-container.rotated{transform:rotate(180deg)}.board{display:grid;grid-template-columns:repeat(12,93px);grid-template-rows:repeat(10,76px);position:relative}.cell{position:relative}.piece{position:absolute;width:61px;height:61px;top:50%;left:50%;cursor:grab;z-index:10;object-fit:contain;filter:saturate(1.2) contrast(1.15) brightness(1.05);transition:filter .2s ease;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.piece.king{width:72px;height:72px}.piece.soldier,.piece.officer{width:45px;height:45px}.piece:hover{z-index:20;filter:saturate(1.3) contrast(1.2) brightness(1.15)}.piece:active{cursor:grabbing}.cell:hover{background-color:#ffffc826}.moving-piece-overlay{position:absolute;object-fit:contain;filter:saturate(1.2) contrast(1.15) brightness(1.05)}.game-setup-container{display:flex;justify-content:center;align-items:flex-start;gap:40px;padding:40px;width:100%;min-width:fit-content}.game-layout{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:20px;padding:20px;width:100%;min-width:fit-content}.side-panel{display:flex;flex-direction:column;gap:20px;width:250px;height:773px;justify-content:space-between}.timers-panel{display:flex;flex-direction:column;gap:10px}.game-over-panel{display:flex;flex-direction:column;align-items:center;text-align:center;gap:15px}.game-over-panel h3{font-size:1.5em;margin:0}.game-over-panel button{padding:10px 20px;font-size:1em;cursor:pointer;border:1px solid #ccc;border-radius:5px;background-color:#f0f0f0}.game-over-panel button:hover{background-color:#e0e0e0}.game-over-panel button:disabled{cursor:not-allowed;opacity:.6}
