.chess-3d-container{max-width:900px;margin:20px auto;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#1a2a6c,#2c3e50);border-radius:15px;padding:25px;box-shadow:0 10px 30px rgba(0,0,0,.5);color:#fff}
.chess-header{text-align:center;margin-bottom:25px;padding-bottom:15px;border-bottom:2px solid rgba(255,255,255,.1)}
.chess-header h2{margin:0 0 15px 0;color:#f8f9fa;font-size:28px;text-shadow:0 2px 4px rgba(0,0,0,.5)}
.game-info{display:flex;justify-content:space-between;align-items:center;background:rgba(0,0,0,.2);padding:15px;border-radius:10px}
.btn{background:linear-gradient(to right,#3498db,#2980b9);color:#fff;border:none;padding:12px 20px;border-radius:30px;cursor:pointer;font-size:16px;font-weight:700;transition:all .3s;box-shadow:0 4px 8px rgba(0,0,0,.3)}
.btn:hover{background:linear-gradient(to right,#2980b9,#3498db);transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,.4)}
.btn:active{transform:translateY(0)}
.chess-board-3d{perspective:1200px;margin:30px 0;display:flex;justify-content:center}
.board-wrapper{transform-style:preserve-3d;transform:rotateX(60deg) rotateZ(45deg);transition:transform .7s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 20px 50px rgba(0,0,0,.7)}
.board-wrapper:hover{transform:rotateX(60deg) rotateZ(45deg) translateY(-15px)}
.chess-board{display:inline-block;border:4px solid #5d4037;background:#8d6e63;box-shadow:0 15px 40px rgba(0,0,0,.6)}
.board-row{display:flex}
.board-square{width:60px;height:60px;display:flex;align-items:center;justify-content:center;position:relative;font-size:44px;cursor:pointer;transition:all .25s ease;overflow:hidden}
.board-square::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,.1);opacity:0;transition:opacity .3s}
.board-square:hover::before{opacity:1}
.board-square.white{background-color:#f0d9b5;background-image:linear-gradient(45deg,rgba(0,0,0,.02) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.02) 75%),linear-gradient(45deg,rgba(0,0,0,.02) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.02) 75%);background-size:20px 20px;background-position:0 0,10px 10px}
.board-square.black{background-color:#b58863;background-image:linear-gradient(45deg,rgba(0,0,0,.05) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.05) 75%),linear-gradient(45deg,rgba(0,0,0,.05) 25%,transparent 25%,transparent 75%,rgba(0,0,0,.05) 75%);background-size:20px 20px;background-position:0 0,10px 10px}
.board-square.selected{box-shadow:inset 0 0 0 3px rgba(80,200,120,.9)}
.board-square.valid-move::after{content:"";position:absolute;width:16px;height:16px;background:rgba(0,200,0,.7);border-radius:50%;z-index:1}
.board-square.valid-capture{box-shadow:inset 0 0 0 3px rgba(255,80,80,.9)}
.chess-piece{transition:transform .2s cubic-bezier(.175,.885,.32,1.275);text-shadow:1px 1px 3px rgba(0,0,0,.55);z-index:2;position:relative}
.chess-piece.white{color:#f9f7ed}
.chess-piece.black{color:#111}
.board-square:hover .chess-piece{transform:scale(1.08) translateY(-3px)}
.game-controls{display:flex;justify-content:space-between;margin-top:30px;gap:20px}
.move-history{width:60%;background:rgba(0,0,0,.2);padding:20px;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,.3)}
.move-history h3{margin-top:0;color:#f8f9fa;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:10px}
#ace3d-history{height:200px;overflow-y:auto;border:1px solid rgba(255,255,255,.1);padding:15px;background:rgba(0,0,0,.3);border-radius:8px;color:#e9ecef;font-family:monospace}
.game-status{width:35%;background:rgba(0,0,0,.2);padding:20px;border-radius:10px;display:flex;flex-direction:column;align-items:center;box-shadow:0 5px 15px rgba(0,0,0,.3)}
#ace3d-status{font-weight:700;font-size:20px;margin-bottom:20px;padding:15px;background:rgba(0,0,0,.4);border-radius:8px;text-align:center;width:100%;color:#f8f9fa;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.difficulty{margin:15px 0;width:100%}
.difficulty label{display:block;margin-bottom:8px;font-weight:700}
.difficulty select{width:100%;padding:10px;border-radius:5px;background:rgba(255,255,255,.9);border:1px solid #3498db;font-size:16px}
@media (max-width:768px){.board-square{width:40px;height:40px;font-size:34px}.game-controls{flex-direction:column}.move-history,.game-status{width:100%}.chess-3d-container{padding:15px}.game-info{flex-direction:column;gap:15px}}