@charset "UTF-8";.square-11{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 0)}.square-12{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 1)}.square-13{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 2)}.square-14{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 3)}.square-15{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 4)}.square-16{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 5)}.square-17{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 6)}.square-18{top:calc(100% / var(--rows) * 0);left:calc(100% / var(--cols) * 7)}.square-21{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 0)}.square-22{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 1)}.square-23{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 2)}.square-24{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 3)}.square-25{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 4)}.square-26{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 5)}.square-27{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 6)}.square-28{top:calc(100% / var(--rows) * 1);left:calc(100% / var(--cols) * 7)}.square-31{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 0)}.square-32{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 1)}.square-33{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 2)}.square-34{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 3)}.square-35{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 4)}.square-36{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 5)}.square-37{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 6)}.square-38{top:calc(100% / var(--rows) * 2);left:calc(100% / var(--cols) * 7)}.square-41{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 0)}.square-42{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 1)}.square-43{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 2)}.square-44{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 3)}.square-45{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 4)}.square-46{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 5)}.square-47{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 6)}.square-48{top:calc(100% / var(--rows) * 3);left:calc(100% / var(--cols) * 7)}.square-51{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 0)}.square-52{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 1)}.square-53{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 2)}.square-54{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 3)}.square-55{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 4)}.square-56{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 5)}.square-57{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 6)}.square-58{top:calc(100% / var(--rows) * 4);left:calc(100% / var(--cols) * 7)}.square-61{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 0);border-radius:0 0 0 4.2px}.square-62{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 1)}.square-63{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 2)}.square-64{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 3)}.square-65{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 4)}.square-66{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 5)}.square-67{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 6)}.square-68{top:calc(100% / var(--rows) * 5);left:calc(100% / var(--cols) * 7)}.square-71{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 0)}.square-72{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 1)}.square-73{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 2)}.square-74{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 3)}.square-75{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 4)}.square-76{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 5)}.square-77{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 6)}.square-78{top:calc(100% / var(--rows) * 6);left:calc(100% / var(--cols) * 7)}.square-81{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 0)}.square-82{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 1)}.square-83{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 2)}.square-84{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 3)}.square-85{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 4)}.square-86{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 5)}.square-87{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 6)}.square-88{top:calc(100% / var(--rows) * 7);left:calc(100% / var(--cols) * 7)}.piece.wp{background-image:var(--wp)}.piece.bp{background-image:var(--bp)}.piece.wr{background-image:var(--wr)}.piece.br{background-image:var(--br)}.piece.wn{background-image:var(--wn)}.piece.bn{background-image:var(--bn)}.piece.wb{background-image:var(--wb)}.piece.bb{background-image:var(--bb)}.piece.wq{background-image:var(--wq)}.piece.bq{background-image:var(--bq)}.piece.wk{background-image:var(--wk)}.piece.bk{background-image:var(--bk)}.ReactModalPortal{position:absolute;height:100vh;width:100vw;pointer-events:none}.ReactModal__Overlay{--delay: .6s;opacity:0;transition:opacity .2s ease-in-out;background:#000000b3;z-index:500;position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;pointer-events:all}.ReactModal__Overlay:has(>.delay),.ReactModal__Content:has(.delay){transition-delay:var(--delay)}.ReactModal__Overlay--after-open{opacity:1}.ReactModal__Overlay--before-close{opacity:0;transition-delay:0ms}.ReactModal__Content{background:transparent;border:none;outline:none;max-width:450px;width:90%;padding:0;display:flex;flex-direction:column;align-items:center;box-shadow:5px 5px 10px #00000080;transform:translateY(-100px);opacity:0;transition:transform .4s ease-in-out,opacity .4s ease-in-out}.ReactModal__Content--after-open{transform:translateY(0);opacity:1}.ReactModal__Content--before-close{transform:translateY(-20px);opacity:0;transition-delay:0ms}.modal-content{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1em;max-height:80vh;background-color:var(--bg2);border-radius:5px 5px 0 0;padding:1em;width:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#555 var(--bg3)}.board-prev{aspect-ratio:16/5;width:100%;position:relative;background-image:var(--board);background-size:25%;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:pixelated;border-radius:5px;-webkit-user-select:none;user-select:none}.board-prev>.piece{cursor:auto}.modal-items{width:100%;display:flex;flex-direction:column;gap:.5em}.modal-item{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.text-item{font-weight:700}.theme-selector{flex-basis:180px}.modal-footer{display:grid;grid-template-columns:1fr 1fr;justify-content:center;padding:1em;width:100%;gap:1em;border-radius:0 0 5px 5px;background-color:var(--bg)}.modal-footer:has(>.alone){grid-template-columns:repeat(auto-fit,minmax(100px,250px))}.modal-bttn{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-grow:1;background-color:var(--bg2);border-radius:10px;padding:1rem;font-size:1.1em;font-weight:700;text-transform:uppercase;transition:all .2s ease}.modal-bttn.save{background-color:#45753c}.modal-bttn:hover:not(:disabled){filter:brightness(1.05)}.modal-bttn:disabled{opacity:.5;cursor:not-allowed}.modal-content>h2{font-size:3em}.modal-content>.won-text{font-size:1.3em}select{text-transform:capitalize;border:none;width:100%}select,::picker(select){appearance:base-select}select{background:var(--bg3);padding:10px;transition:.4s}select:hover,select:focus{filter:brightness(1.1)}select::picker-icon{color:var(--text);transition:.4s rotate}select:open::picker-icon{rotate:180deg}::picker(select){border:none}option{display:flex;justify-content:flex-start;gap:20px;color:var(--text);background:var(--bg3);padding:10px;transition:.4s}option:not(option:last-of-type){border-bottom:none}option:nth-of-type(odd){background:var(--bg2)}option:hover,option:focus{filter:brightness(1.2)}option:checked{font-weight:700}option::checkmark{content:"";order:1;margin-left:auto}::picker(select){opacity:0;transition:all .4s allow-discrete}::picker(select):popover-open{opacity:1}@starting-style{::picker(select):popover-open{opacity:0}}::picker(select){top:calc(anchor(bottom) + 1px);left:anchor(10%)}@media (max-width: 500px){.ReactModal__Content{font-size:1.4em;display:flex}}.main-game{position:relative;display:flex;align-items:center;justify-content:center;gap:5%;max-width:450px;width:90vw}.board,.captured{position:relative;background-image:var(--board);image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:pixelated;border-radius:5px}.board{aspect-ratio:4/6;flex-grow:4;background-size:50%}.captured{aspect-ratio:1/4;flex-grow:1;background-size:200%}.piece,.highlight,.hint,.capture-hint,.hover{aspect-ratio:1/1;width:25%;display:flex;justify-content:center;align-items:center;position:absolute;background-size:contain;background-position:bottom;background-repeat:no-repeat;cursor:grab;cursor:-webkit-grab;touch-action:none;will-change:transform}.captured-piece:nth-of-type(1){top:0%}.captured-piece:nth-of-type(2){top:25%}.captured-piece:nth-of-type(3){top:50%}.captured-piece:nth-of-type(4){top:75%}.hint{background-color:var(--trans-black);padding:8%}.capture-hint{border:5px solid var(--trans-black)}.capture-hint,.hint{background-clip:content-box;border-radius:50%;pointer-events:none}.piece{z-index:100}.captured-piece{width:100%;z-index:250}.text{display:flex;align-items:center;justify-content:center;height:calc(100%/6);padding:1em;text-align:center;background-color:var(--bg3);position:absolute;z-index:200}.text.description{font-weight:700;width:100%;transform:translateY(100%)}.text.name{font-size:1.5em;font-weight:700;width:75%;transform:translateY(500%)}.highlight{background-color:#ffbf47;opacity:.5;z-index:10}.hover{box-shadow:inset 0 0 0 5px #fff;z-index:20}.dragging{cursor:grabbing;z-index:300}.game-header{width:60%;display:flex;align-items:center;flex-direction:row;justify-content:space-evenly;border-radius:5px;background-color:var(--bg3);padding:1em .5em;margin:0 auto 1em}.bttn-header{display:flex;transition:all .2s ease}.bttn-header:disabled{opacity:.5;cursor:not-allowed}.bttn-header:hover:not(:disabled){filter:brightness(1.2)}.bttn-icon{font-size:1.5rem}.reset-bttn{font-size:1.5em}.center-anchor{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%)}@media (max-width: 500px){.game-header{width:100%}.main-game{flex-direction:column-reverse;gap:1em}.bttn-icon{font-size:2rem}.board{width:100%}.captured{aspect-ratio:4/1;width:100%;background-size:50%}.captured-piece{width:25%}.captured-piece:nth-of-type(1){top:auto;left:0%}.captured-piece:nth-of-type(2){top:auto;left:25%}.captured-piece:nth-of-type(3){top:auto;left:50%}.captured-piece:nth-of-type(4){top:auto;left:75%}}:root{--font-main: system-ui, Avenir, Helvetica, Arial, sans-serif;--cols: 4;--rows: 6;--trans-black: rgba(0, 0, 0, .2)}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;margin:0;padding:0}body{display:flex;flex-direction:column;align-items:center;justify-content:center}input,button{appearance:none;background:none;border:none;cursor:pointer}html{--bg: #1e1e1e;--bg2: #3c3d3f;--bg3: #292929;--text: #dde1e9}body,button,input,textarea,a{color:var(--text);font-family:var(--font-main)}html,body{height:100dvh;background:var(--bg);font-size:18px;line-height:1}.home-footer{position:fixed;display:flex;flex-direction:row-reverse;align-items:center;justify-content:end;font-size:inherit;gap:.75rem;bottom:20px;right:20px;z-index:400}.svg-footer{--size: 2.5rem;height:var(--size);width:var(--size);cursor:pointer}.home-footer>*{opacity:1;transition:all .2s ease}.home-footer a:hover,.home-footer button:hover{opacity:.8}.button-footer{display:flex}@media (max-width: 500px){.svg-footer{--size: 2rem}html,body{height:auto;font-size:1rem}body{padding:2rem 0}}