body{background-color:#333;justify-content:center;align-items:center;min-height:100vh;margin:5px;display:flex;overflow:hidden}.chessboard{aspect-ratio:1;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);width:100%;max-width:100%;display:grid;box-shadow:0 0 15px #00000080}@media (width>=768px){.chessboard{max-width:500px}}.square{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.square.highlight:after{content:"";background-color:#00000059;border-radius:50%;width:20%;height:20%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.square.highlight.capture:after{content:"";border-radius:50%;width:40%;height:40%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.square.check{background-color:#ff000080}.square img{object-fit:contain;-webkit-user-select:none;user-select:none;width:80%;height:80%}.light{background-color:#f0d9b5}.dark{background-color:#b58863}.game-over-overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:10;background:#00000040;justify-content:center;align-items:center;animation:1s ease-out fadeIn;display:flex;position:fixed;inset:0}.game-over-modal{text-align:center;background:linear-gradient(145deg,#fff,#f1f1f1);border:1px solid #00000014;border-radius:16px;padding:5px 40px 30px;animation:.5s ease-out popIn;box-shadow:0 20px 60px #00000040,0 2px 6px #00000026}.game-over-modal h1{letter-spacing:1px;margin-bottom:15px;font-family:Playfair Display,serif;font-size:2rem;font-weight:700}.game-over-modal button{color:#fff;cursor:pointer;background:#222;border:none;border-radius:10px;margin-top:10px;padding:10px 18px;font-size:1rem;font-weight:600;transition:all .2s}.game-over-modal button:hover{background:#000;transform:translateY(-2px);box-shadow:0 10px 20px #00000040}.game-over-modal button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.game-over-modal.win{background:linear-gradient(145deg,#e6ffe6,#c8f7c8);border:1px solid #00960033}.game-over-modal.win h1{color:#0a7a0a}.game-over-modal.loss{background:linear-gradient(145deg,#ffe6e6,#f7c8c8);border:1px solid #96000033}.game-over-modal.loss h1{color:#7a0a0a}.game-over-modal.draw{background:linear-gradient(145deg,#f0f0f0,#dcdcdc)}.result-text{margin-bottom:10px;font-size:1.2rem;font-weight:600}.result-text.win{color:#0a7a0a}.result-text.loss{color:#7a0a0a}.title-screen{color:#fff;background:#333;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.5s ease-out fadeIn;display:flex}.title-screen h1{margin-bottom:50px;font-family:Playfair Display,serif;font-size:100px}.title-screen button{cursor:pointer;color:#000;background:#fff;border:none;border-radius:10px;margin-top:20px;padding:12px 24px;font-size:16px;transition:transform .15s}.title-screen button:hover{transform:scale(1.05)}.title-screen h3{color:#ccc;font-family:Playfair Display,serif;position:absolute;bottom:30px}.modal-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:10;background:#00000040;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{text-align:center;background:linear-gradient(145deg,#fff,#f1f1f1);border:1px solid #00000014;border-radius:16px;padding:5px 40px 25px;animation:.2s popIn;box-shadow:0 20px 60px #00000040,0 2px 6px #00000026}.modal h2{font-size:"Playfair Display", serif;margin-bottom:15px;font-weight:700}.options{grid-template-columns:repeat(2,90px);justify-content:center;gap:15px;display:grid}.options button:first-child{background:#fff;border-color:#4caf50;transform:translateY(-4px);box-shadow:0 6px 15px #0003}.options:hover button:not(:hover){box-shadow:none;background:#e4e4e4;border-color:#0000;transform:none}.options button:hover{background:#fff;border-color:#4caf50;transform:translateY(-4px);box-shadow:0 6px 15px #0003}.piece-option{cursor:pointer;background:#e4e4e4;border:2px solid #0000;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;padding:12px;transition:all .2s;display:flex}.piece-option img{pointer-events:none;width:50px;height:50px}.piece-option span{text-transform:capitalize;margin-top:6px;font-size:.85rem}.piece-option:active{transform:translateY(0)}