.navbar-links{display:flex;place-content:center;gap:1rem}.header{width:100%;border-radius:0 0 var(--border-radius-medium) var(--border-radius-medium);background-color:var(--color-tertiary)}.header-container{display:flex;justify-content:center;align-items:center;margin:var(--spacing-medium) var(--spacing-large)}.header-app-name{color:var(--color-primary);font-size:var(--font-size-large);font-weight:var(--font-weight-bold)}.navbar{margin-left:var(--spacing-large);margin-right:auto}.header-light-dark-mode{display:grid;place-content:center;width:40px;height:40px;margin:0 var(--spacing-medium);border-radius:50%;transition:opacity .1s ease-in-out}.header-light-dark-mode .tabler-icon-sun{display:block}.header-light-dark-mode .tabler-icon-sun-filled,.header-light-dark-mode .tabler-icon-moon,.header-light-dark-mode .tabler-icon-moon-filled{display:none}.header-light-dark-mode:hover{opacity:.7}.header-light-dark-mode:hover .tabler-icon-sun-filled{display:block}.header-light-dark-mode:hover .tabler-icon-sun,.header-light-dark-mode:hover .tabler-icon-moon,.header-light-dark-mode:hover .tabler-icon-moon-filled{display:none}.header-auth{display:flex;justify-content:center;align-items:center;gap:var(--spacing-small)}.header-auth-sign-up{border:1px solid var(--color);border-radius:var(--border-radius-medium)}.header-auth-login,.header-auth-sign-up{padding:var(--spacing-small);font-size:var(--font-size-small);font-weight:var(--font-weight-bold);line-height:var(--font-size-medium);transition:opacity .2s ease-in-out;cursor:pointer}.header-auth-login:hover,.header-auth-sign-up:hover{opacity:.7}@media (prefers-color-scheme: dark){.header{background-color:var(--color-quaternary)}.header-light-dark-mode .tabler-icon-moon{display:block}.header-light-dark-mode .tabler-icon-sun,.header-light-dark-mode .tabler-icon-sun-filled,.header-light-dark-mode .tabler-icon-moon-filled{display:none}.header-light-dark-mode:hover .tabler-icon-moon-filled{display:block}.header-light-dark-mode:hover .tabler-icon-sun,.header-light-dark-mode:hover .tabler-icon-sun-filled,.header-light-dark-mode:hover .tabler-icon-moon{display:none}}.turn-info{display:flex;justify-content:space-around;align-items:center;padding:16px;border-radius:var(--border-radius-medium);background-color:var(--color-tertiary);box-shadow:0 4px 8px #00000080}.turn-info span{margin:10px 0}.turn-info-time{width:30%;text-align:center;font-size:1.5em;font-weight:700;color:var(--color-secondary)}.turn-info-player{font-size:1.25em;font-weight:700}.turn-info-piece-set{display:flex;align-items:center;font-size:1.2em}.turn-info-piece-set:before{content:"";width:18px;height:18px;margin-right:10px;border:1px solid rgba(0,0,0,.8235294118);border-radius:50%}.turn-info-piece-set.piece-set--is-light:before{background-color:#fff;border:.1px solid rgba(0,0,0,.5)}.turn-info-piece-set.piece-set--is-dark:before{background-color:#000;border:.1px solid rgba(255,255,255,.5)}@media (prefers-color-scheme: dark){.turn-info{background-color:var(--color-quaternary)}.turn-info-piece-set:before{border-color:#ffffffd2}}.checkerboard-guides{display:grid;color:var(--color-tertiary);background-color:var(--color-quaternary);border-radius:var(--border-radius-medium)}.checkers--is-local-mode .checkerboard-guides{grid-template-areas:". guide-top ." "guide-left checkerboard guide-right" ". guide-bottom ."}.checkerboard-guides{grid-template-areas:". . ." "guide-left checkerboard ." ". guide-bottom .";grid-template-columns:auto auto auto;width:-moz-fit-content;width:fit-content}.guide{display:flex;width:-moz-fit-content;width:fit-content}.guide span{display:grid;place-content:center}.vertical-guide{flex-direction:column}.vertical-guide span{width:40px;height:75px}.horizontal-guide{flex-direction:row}.horizontal-guide span{width:75px;height:40px}.reversed-guide span{transform:rotate(180deg)}.vertical-guide{grid-area:guide-left}.horizontal-guide{grid-area:guide-bottom}.vertical-guide.reversed-guide{grid-area:guide-right}.horizontal-guide.reversed-guide{grid-area:guide-top}.checkerboard{grid-area:checkerboard}.piece{width:80%;height:80%;border-radius:50%}.piece.piece-light{background-color:#fff;color:#000}.piece.piece-dark{background-color:#000;color:#fff;transform:rotate(180deg)}.piece--is-king{position:relative}.piece--is-king:before{content:"";position:absolute;left:-10%;width:120%;height:120%;background-color:orange;clip-path:polygon(50% 10%,55% 20%,65% 20%,60% 30%,70% 40%,50% 60%,30% 40%,40% 30%,35% 20%,45% 20%)}.square{width:75px;height:75px;display:grid;place-items:center}.square--is-movable{position:relative;cursor:pointer}.square--is-movable:before{content:"";position:absolute;width:95%;height:95%;border-radius:50%;border:4px dashed #70b9e9;animation:rotateBorder 5s linear infinite}.square--is-active{position:relative;cursor:pointer}.square--is-active:before{content:"";position:absolute;width:95%;height:95%;border-radius:50%;border:4px dashed #ece362;animation:rotateBorder 5s linear reverse infinite}.square--is-possible-move,.square--is-immediate-move{position:relative;cursor:pointer}.square--is-possible-move:after,.square--is-immediate-move:after{content:"";position:absolute;width:100%;height:100%;background-color:#70b9e9;border-radius:12px}.square--is-possible-move:after{opacity:.3}.square--is-immediate-move:after{opacity:.6}.square-light{background-color:#e8cfad;color:#000}.square-dark{background-color:#a67d61}@keyframes rotateBorder{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.checkerboard{display:grid;grid-template-columns:repeat(8,1fr);width:-moz-fit-content;width:fit-content;border-radius:var(--border-radius-medium);overflow:hidden}.checkerboard-shadow{position:relative;width:-moz-fit-content;width:fit-content;border-radius:var(--border-radius-medium)}.checkerboard-shadow:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:8px;box-shadow:0 4px 8px #00000080;pointer-events:none;z-index:-1}.checkers--is-local-mode{--animation-time: 1.25s}.checkers--is-local-mode.checkers--is-light-turn:not(.checkers--is-initial-turn) .checkerboard-shadow:before{animation:hide-on-rotate-dark-to-light var(--animation-time) ease-in-out}.checkers--is-local-mode.checkers--is-light-turn:not(.checkers--is-initial-turn) .checkerboard-container{transform:rotate(0);animation:rotate-dark-to-light var(--animation-time) ease-in-out}.checkers--is-local-mode.checkers--is-dark-turn:not(.checkers--is-initial-turn) .checkerboard-shadow:before{animation:hide-on-rotate-light-to-dark var(--animation-time) ease-in-out}.checkers--is-local-mode.checkers--is-dark-turn:not(.checkers--is-initial-turn) .checkerboard-container{transform:rotate(180deg);animation:rotate-light-to-dark var(--animation-time) ease-in-out}@keyframes hide-on-rotate-dark-to-light{0%{opacity:1;transform:scale(1)}20%{opacity:0;transform:scale(.6)}80%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes hide-on-rotate-light-to-dark{0%{opacity:1;transform:scale(1)}20%{opacity:0;transform:scale(.6)}80%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes rotate-light-to-dark{0%{transform:scale(1) rotate(0)}20%{transform:scale(.6) rotate(0)}80%{transform:scale(.6) rotate(180deg)}to{transform:scale(1) rotate(180deg)}}@keyframes rotate-dark-to-light{0%{transform:scale(1) rotate(180deg)}20%{transform:scale(.6) rotate(180deg)}80%{transform:scale(.6) rotate(0)}to{transform:scale(1) rotate(0)}}.game-status{display:flex;flex-direction:column;gap:var(--spacing-large);width:100%;min-width:-moz-fit-content;min-width:fit-content;max-width:250px;height:-moz-fit-content;height:fit-content;padding:var(--spacing-large);border-radius:var(--border-radius-medium);background-color:var(--color-tertiary);box-shadow:0 4px 8px #00000080}.game-status-title{font-size:var(--font-size-large);font-weight:700;color:var(--color-secondary)}.game-status-info{display:flex;flex-direction:column;gap:.5rem}.game-status-item{display:flex;align-items:center;width:100%}.game-status-label{margin-right:var(--spacing-small);font-weight:700}.game-status-player.piece-light .game-status-value,.game-status-player.piece-dark .game-status-value{display:flex;align-items:center}.game-status-player.piece-light:before,.game-status-player.piece-dark:before{content:"";width:var(--spacing-medium);height:var(--spacing-medium);margin-right:var(--spacing-small);border:1px solid rgba(0,0,0,.8235294118);border-radius:50%}.game-status-player.piece-light:before{background-color:#fff;border:.1px solid rgba(0,0,0,.5)}.game-status-player.piece-dark:before{background-color:#000;border:.1px solid rgba(255,255,255,.5)}.game-status-item-multiple,.game-status-value-multiple{display:flex;flex-direction:column;gap:.25rem}.game-status-value-multiple{margin-left:var(--spacing-medium)}@media (prefers-color-scheme: dark){.game-status{background-color:var(--color-quaternary)}.game-status-player:after{border-color:#ffffffd2}}.move-log,.move-log-content{display:flex;flex-direction:column;gap:var(--spacing-small)}.move-log{padding:var(--spacing-large);border-radius:var(--border-radius-medium);background-color:var(--color-tertiary);box-shadow:0 4px 8px #00000080}.move-log-label{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.move-log-content{max-width:195.48px;min-height:calc(1.5rem + var(--spacing-small) * 2);max-height:152px;margin:var(--spacing-small) 0;padding:var(--spacing-small);overflow:auto;border-radius:var(--border-radius-medium);background-color:#242424e3;color:var(--color-tertiary)}.move-log-move,.move-log-move-value,.move-history-log-move,.move-history-log-captured-piece{display:flex;align-items:center}.possible-move-item,.move-history-log-move,.move-history-log-captured-piece{gap:.25rem}.move-log-move{gap:var(--spacing-small);width:-moz-fit-content;width:fit-content;font-size:.9rem}.move-log-move-label{--size: 1.5rem;display:grid;place-content:center;width:var(--size);height:var(--size);border-radius:50%;background-color:var(--color-tertiary);color:#242424e3;text-align:center;font-size:var(--font-size-small);font-weight:700}.move-history-log-item{gap:.5rem;width:-moz-fit-content;width:fit-content}.move-history-log-item:before{--size: .75rem;content:"";width:var(--size);height:var(--size);border-radius:50%}.move-history-log-item.turn-light:before{background-color:#fff;border:.1px solid rgba(0,0,0,.5)}.move-history-log-item.turn-dark:before{background-color:#000;border:.1px solid rgba(255,255,255,.5)}.move-history-log-captured-piece span{white-space:nowrap}@media (prefers-color-scheme: dark){.move-log{background-color:var(--color-quaternary)}}.play{margin:0 auto}.game{display:grid;grid-template-areas:". turn-info ." "game-info checkers .";grid-template-columns:repeat(3,1fr);gap:1.5rem;margin:var(--spacing-large) 0}.game-turn-info{grid-area:turn-info;width:70%;margin:0 auto}.game-info{grid-area:game-info;display:flex;flex-direction:column;gap:1rem;margin-left:auto}.game-info .move-log{height:100%}.game-checkers{grid-area:checkers;margin:0 auto}:root{--color-primary: #fa7d35;--color-secondary: #fa9053;--color-tertiary: #f4f4f4;--color-quaternary: #171717;--bg-color-light: #ffffff;--bg-color-dark: #242424;--color: #213547;--bg-color: var(--bg-color-light);--font-size-small: .75rem;--font-size-medium: 1rem;--font-size-large: 1.5rem;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-bold: 700;--spacing-small: .5rem;--spacing-medium: 1rem;--spacing-large: 1.5rem;--border-radius-small: .25rem;--border-radius-medium: .5rem;--border-radius-large: 1rem;font-family:Poppins,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:16px;line-height:24px;font-weight:400;color-scheme:light dark;color:var(--color);background-color:var(--bg-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{margin:0;display:flex;justify-content:center;min-width:320px;min-height:100vh}a{text-decoration:inherit;color:inherit}ul{list-style-type:none}button{font-family:inherit;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;background-color:inherit;border:none;cursor:pointer}button:focus{outline:none}*{padding:0;margin:0}*,:before,:after{box-sizing:border-box}#root{display:flex;flex-direction:column;width:100%}@media (prefers-color-scheme: dark){:root{--color: rgba(255, 255, 255, .87);--bg-color: var(--bg-color-dark)}}