:root{--board-dark:#3e2723;--board-light:tan}body{margin:0;overflow:hidden}@font-face{font-family:Sherlock;src:url(/SherlockHolmes-d93Bl.ttf)format("truetype")}@font-face{font-family:Sherlock;src:url(/SherlockHolmes-d93Bl.ttf)format("truetype")}.board{border-radius:10px;grid-template-rows:repeat(4,clamp(40px,8vw,64px));grid-template-columns:repeat(4,clamp(40px,8vw,64px));gap:4px;padding:8px;transition:transform .16s;display:grid;position:relative;transform:translateY(-8px);box-shadow:0 20px 35px #0006,0 6px 12px #00000040}.board--player:hover{animation:1.8s ease-in-out infinite alternate blueGlow}.board--opponent:hover{animation:1.8s ease-in-out infinite alternate redGlow}@keyframes blueGlow{0%{box-shadow:0 0 8px #64beff59,0 8px 16px #0000004d}to{box-shadow:0 0 28px #64beffd9,0 0 45px #64beff73,0 28px 45px #00000073}}.cell{background-color:#00000014;width:clamp(40px,8vw,64px);height:clamp(40px,8vw,64px)}.board--dark{background-color:var(--board-dark);background-image:url(/dark-wood.png);background-repeat:repeat;background-size:cover}.board--light{background-color:var(--board-light);background-image:url(/tileable_wood_texture.webp)}@keyframes redGlow{0%{box-shadow:0 0 8px #ff505059,0 8px 16px #0000004d}to{box-shadow:0 0 28px #ff5050d9,0 0 45px #ff505073,0 28px 45px #00000073}}@media (width<=430px){.board{grid-template-rows:repeat(4,clamp(15px,10vw,44px));grid-template-columns:repeat(4,clamp(15px,10vw,44px));gap:2px;padding:6px}.cell{width:clamp(15px,10vw,44px);height:clamp(15px,10vw,44px)}}.board-wrapper{position:relative}button{background:0 0}.highlighted,.board--light .highlighted{background-color:#00000059;box-shadow:inset 0 0 10px #fff6}.board--dark .highlighted{background-color:#ffffff59;box-shadow:inset 0 0 10px #0006}.stone{object-fit:contain;width:100%;height:100%}.stone--BLACK{background:#111}.stone--WHITE{background:#eee}.move-arrow-overlay{pointer-events:none;z-index:20;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.move-arrow{stroke-width:5px;stroke-linecap:round;filter:drop-shadow(0 2px 4px #000000a6);opacity:.8}.move-arrow.passive{stroke:#7dd3fc}.move-arrow.aggressive{stroke:#f87171}.arrow-head.passive{fill:#7dd3fc}.arrow-head.aggressive{fill:#f87171}.boards{grid-template-columns:repeat(2,auto);justify-content:center;align-items:center;gap:2rem;width:100%;display:grid}.game-space{background-image:radial-gradient(circle,#000000a6 0%,#00000073 35%,#0003 100%),url(/joinGameBg.png);background-position:50% 8%;background-repeat:no-repeat;background-size:cover;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:100vh;display:flex;position:relative}.game-state-dialog{border:4px solid #5a3f25;outline:1px solid #ffffff26;justify-content:center;align-items:center;width:13rem;height:4rem;font-family:Noto Sans Georgian,serif;font-weight:700;display:flex;position:absolute;bottom:2rem;right:3.5rem;box-shadow:0 12px 30px #00000073,0 4px 8px #00000040}.text-dialog{justify-content:center;align-items:center;width:100%;height:100%;font-size:1.1rem;display:flex}.game-id-dialog{border:4px solid #5a3f25;outline:1px solid #ffffff26;justify-content:center;align-items:center;width:13rem;height:4rem;font-family:Noto Sans Georgian,serif;font-weight:700;display:flex;position:absolute;top:2rem;left:2rem;box-shadow:0 12px 30px #00000073,0 4px 8px #00000040}@media (width<=768px){.boards{grid-template-columns:repeat(2,auto);gap:1rem}.board,.board:hover{transform:none}.game-id-dialog{width:13rem;height:4rem;padding:0;font-size:1rem;top:2rem;left:2rem;right:auto}.game-state-dialog{width:13rem;height:4rem;padding:0;font-size:1rem;inset:auto 2rem 2rem auto}.game-space{background-image:radial-gradient(circle,#000000a6 0%,#00000073 35%,#0003 100%),url(/MobileBg.png)}}.game-error-message{color:#fff;text-align:center;background:#5a0a0ae6;border:1px solid #821414cc;border-radius:.4rem;width:min(32rem,90vw);margin:.75rem auto;padding:.75rem 1rem}.game-error-card{text-align:center;width:min(28rem,90vw);margin:4rem auto;padding:2rem}.game-over-container{z-index:9999;background:#000c;justify-content:center;align-items:center;animation:3s ease-in fadeIn;display:flex;position:fixed;inset:0}.game-over-card{flex-direction:column;justify-content:center;align-items:center;width:min(28rem,90vw);height:35%;display:flex}.game-over-button-container{justify-content:space-between;width:75%;display:flex}.game-over-button{color:#f7ead7;cursor:pointer;background:linear-gradient(#5f371ef2,#3c2012f2);border:2px solid #231208d9;border-radius:.3rem;padding:.8rem 1.2rem;font-size:1.05rem;font-weight:700;transition:transform .12s,box-shadow .12s;box-shadow:0 5px #231208cc}.game-over-button:hover{transform:translateY(-2px);box-shadow:0 7px #231208cc}.game-over-button:active{transform:translateY(3px);box-shadow:0 2px #231208cc}.game-over-message{font-size:xx-large;font-weight:bolder}@keyframes fadeIn{0%{opacity:0}to{opacity:.8}}.rematch-error{color:#f7ead7;text-align:center;background:#781914f2;border:2px solid #3c0a08e6;border-radius:.3rem;padding:.8rem 1.2rem;font-weight:700;animation:.35s shake;position:absolute;top:2rem;box-shadow:0 4px #2d0805cc}*{box-sizing:border-box}.home-page{background-image:radial-gradient(circle,#000000a6 0%,#00000073 35%,#0003 100%),url(/joinGameBg.png);background-position:50% 8%;background-repeat:no-repeat;background-size:cover;flex-direction:column;align-items:center;width:100%;min-height:100vh;display:flex}.wood-pattern{color:#000;background-color:#8b5e3c;background-image:url(/tileable_wood_texture.webp);background-repeat:repeat;background-size:cover;border:2px solid #0003;font-family:Noto Sans Georgian,serif;box-shadow:0 6px 20px #00000059}.title-container{justify-content:center;align-items:center;width:30rem;margin-top:2rem;display:flex}.title{padding:1rem;font-size:3rem;font-weight:700}.start-game{cursor:pointer;width:20rem;height:5rem;margin-top:4rem;font-size:1.1rem;font-weight:700}.or-container{justify-content:center;align-items:center;width:3rem;height:2rem;margin-top:3rem;font-weight:700;display:flex}.input-field{width:20rem;height:2rem;margin-top:1rem}.input{width:100%;height:100%}.join-button{cursor:pointer;width:10rem;margin-top:1rem;font-size:1.1rem;font-weight:700}.start-game,.join-button{transition:transform .2s,box-shadow .2s}.start-game:hover,.join-button:hover{transform:translateY(-4px);box-shadow:0 12px 24px #00000059,0 4px 8px #0003}.stats-container{margin:.8rem;display:flex}.win-number{font-size:xx-large}.win-stats{flex-direction:column;justify-content:center;align-items:center;width:9rem;margin:1rem;padding:.5rem;font-weight:700;display:flex}.game-count{padding:.25rem}.login{justify-content:center;align-items:center;width:5rem;height:2rem;margin:.5rem;font-weight:700;transition:transform .2s,box-shadow .2s;display:flex;position:absolute}.login:hover{transform:translateY(-4px)}.how-to-play{justify-content:center;align-items:center;height:2rem;margin:.5rem;padding:.5rem;font-weight:700;transition:transform .2s,box-shadow .2s;display:flex;position:absolute;right:0}.how-to-play:hover{transform:translateY(-4px)}.login-bg{z-index:1000;background-color:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.form-bg{border-radius:.4rem;width:min(24rem,90vw);height:auto;padding:2rem}.form-content{flex-direction:column;gap:1rem;display:flex}.form-inputs{color:#000;background:#ffffff59;border:2px solid #3c231473;border-radius:.3rem;outline:none;width:100%;padding:.8rem 1rem;font-size:1rem}.form-inputs:focus{background:#ffffff8c;border-color:#28140acc;box-shadow:0 0 0 3px #4628142e}.form-inputs::placeholder{color:#000000a6}.form-login{color:#f7ead7;cursor:pointer;background:linear-gradient(#5f371ef2,#3c2012f2);border:2px solid #231208d9;border-radius:.3rem;width:100%;padding:.8rem 1rem;font-size:1.05rem;font-weight:700;transition:transform .12s,box-shadow .12s;box-shadow:0 5px #231208cc}.form-login:hover{transform:translateY(-2px);box-shadow:0 7px #231208cc}.form-login:active{transform:translateY(3px);box-shadow:0 2px #231208cc}.toggle-auth{color:#231208cc;cursor:pointer;background:0 0;border:none;padding:0;font-size:.9rem;text-decoration:underline}.toggle-auth:hover{color:#140a05}.shake{border:2px solid red;animation:.35s shake}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.login-error-message{color:red;justify-content:center;font-size:large;display:flex}