.navbar-brand{font-size:1rem;padding:.5rem 0}
.navbar-nav .nav-link{font-weight:500;padding:.5rem 1rem;transition:color .3s ease}
.navbar-nav .nav-link:hover{color:#769656!important}
.navbar-toggler{border:none;padding:.25rem .5rem}
.navbar-toggler:focus{box-shadow:none}
@media (max-width:991px){.navbar-nav .nav-link{padding:.75rem 0;border-bottom:1px solid #f8f9fa}
.navbar-nav .nav-link:last-child{border-bottom:none}
}
.board-container{display:flex;justify-content:center;margin-bottom:20px}
.board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);position:relative;background:#fff;width:100%;max-width:540px;aspect-ratio:1/1}
.square{position:relative;box-sizing:border-box;transition:background .2s;background:transparent!important;border:1px solid #eee}
.square:hover{opacity:0.8}
.board .black{background-color:#769656}
.board .white{background-color:#eeeed2}
.gradi{font-weight:900}
#bL .square{cursor:pointer}
#bL .square.highlight{border:0!important;background:#ff990061!important}
.ksvg{position:relative;z-index:9;width:60%;height:60%;top:20%;left:20%;pointer-events:none;display:block;transition:opacity .2s}
.zernoSvg{position:absolute;z-index:6;width:50%;height:50%;top:25%;left:25%;pointer-events:none;display:block}
.sledSvg{position:absolute;z-index:7;width:70%;height:70%;top:15%;left:15%;pointer-events:none;display:block}
#rC{width:100%;display:flex;justify-content:center;margin-bottom:30px}
#mc{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100000;display:none;background:transparent}
#mV .modal-content{background:linear-gradient(135deg,#ffd700,#ff8c00);border:0;border-radius:20px;padding:20px;box-shadow:0 0 30px #ffd700b3;z-index:10000}
#mV .modal-header{border-bottom:2px solid #ffffff4d}
#mV .modal-title{color:#8b4513;font-weight:900;font-size:2rem;text-shadow:2px 2px 4px #ffffff80}
#mV .modal-body{color:#8b4513;font-weight:600;font-size:1.2rem}
.btn-success{background:linear-gradient(25deg,green,lightgreen);border:none;font-weight:400;padding:10px 25px;color:#fff;border-radius:.5rem;transition:all .3s ease}
.modal{z-index:100001!important}
.modal-backdrop{background-color:#000!important;z-index:1000!important}
.move-number{display:none}
#movesCountText{font-weight:700;color:green}
.first-move{background-color:#9bd99b70!important;border:0}
.board .square.last-move-cell{background-color:#ee82ee6b!important;border:0}
.color-legend{font-size:.9rem}
.color-box{width:16px;height:16px}
.first-move-box{background-color:#9bd99b70!important}
.last-move-box{background-color:#ee82ee6b!important}
.highlight-box{background:#ff990061!important}
.btn-danger{background:linear-gradient(25deg,red,orange);border:none;font-weight:400;padding:10px 25px;color:#fff;border-radius:.5rem;transition:all .3s ease}
.btn-danger:hover,.btn-success:hover{opacity:.8;transform:translateY(-1px)}
.btn-danger:active,.btn-success:active{transform:translateY(0)}
.square .cross{display:none;position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:8}
.square .cross::before,.square .cross::after{content:'';position:absolute;top:50%;left:50%;width:50%;height:3px;background:#dc3545;border-radius:2px}
.square .cross::before{transform:translate(-50%,-50%) rotate(45deg)}
.square .cross::after{transform:translate(-50%,-50%) rotate(-45deg)}
.square.show-cross .cross{display:block}
@media (max-width:1023px){
.board{max-width:420px}
}
@media (max-width:991px){
.board-container{flex-direction:column;gap:20px}
}
@media (max-width:576px){
.lead{font-size:.9rem}
.color-legend{font-size:.8rem}
}
#bL{position:relative}
#bL .square{position:relative}
#bL #L-a1::before,#bL #L-b1::before,#bL #L-c1::before,#bL #L-d1::before,#bL #L-e1::before,#bL #L-f1::before,#bL #L-g1::before,#bL #L-h1::before{content:attr(data-letter);position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);color:#323232;font-size:12px;pointer-events:none;z-index:10;display:none}
#bL #L-a8::after,#bL #L-a7::after,#bL #L-a6::after,#bL #L-a5::after,#bL #L-a4::after,#bL #L-a3::after,#bL #L-a2::after,#bL #L-a1::after{content:attr(data-number);position:absolute;left:-12px;top:50%;transform:translateY(-50%);color:#323232;font-size:12px;pointer-events:none;z-index:10;display:none}
#bL #L-a1::before{content:"a"}
#bL #L-b1::before{content:"b"}
#bL #L-c1::before{content:"c"}
#bL #L-d1::before{content:"d"}
#bL #L-e1::before{content:"e"}
#bL #L-f1::before{content:"f"}
#bL #L-g1::before{content:"g"}
#bL #L-h1::before{content:"h"}
#bL #L-a8::after{content:"8"}
#bL #L-a7::after{content:"7"}
#bL #L-a6::after{content:"6"}
#bL #L-a5::after{content:"5"}
#bL #L-a4::after{content:"4"}
#bL #L-a3::after{content:"3"}
#bL #L-a2::after{content:"2"}
#bL #L-a1::after{content:"1"}
#routeCanvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:5}
.btn-danger.disabled{background:#fff;color:#323232;box-shadow:0 0 0 1px #444}