.header-box{height:var(--header-height);background-color:var(--color-bg-block);position:absolute;top:0;width:100%;display:grid;grid-template-columns:2fr 1fr;font-size:1.8rem}.header__logo{padding:1rem 2rem;text-align:left;color:var(--color-text-dimmed)}.header__logo-pic{height:2rem;max-width:320px;background-image:var(--logo-url);background-repeat:no-repeat;background-size:contain}.header__options{padding:0 2rem;text-align:right}.header__options-ico{display:inline-block;font-size:2.4rem;position:relative;top:-.2rem;color:var(--color-text);padding-top:1rem;height:100%;margin-left:10px;text-align:center}.header__options-ico:hover{color:var(--color-btn);cursor:pointer}.scrollable{background:var(--color-bg-block);height:auto;padding:2rem 1rem 2rem 2rem;height:100%;display:flex;overflow:auto}.scrollable__content{overflow-y:auto;overflow-x:hidden;padding:0;padding-right:1rem;width:100%}.scrollable__content::-webkit-scrollbar{width:.7rem;cursor:pointer}.scrollable__content::-webkit-scrollbar-track{background-color:var(--color-scrollbar-track)}.scrollable__content::-webkit-scrollbar-thumb{background-color:var(--color-scrollbar);outline:1px solid var(--color-scrollbar)}.moves{font-size:1.4rem;font-family:Fira Mono;text-align:left;background-color:var(--color-bg-input)}.moves__turn{text-align:center}.move{padding:3px}.move__id{display:inline-block;width:4rem;text-align:right;margin-right:2rem;color:var(--color-text)}.move__ply{display:inline-block;width:7rem;color:var(--color-btn)}.move__ply--current{color:var(--color-text);background-color:var(--color-highlight)}.move__ply:hover{text-decoration:underline;cursor:pointer}@media (orientation: portrait){.moves{text-align:left}.move{display:inline-block}.move__id,.move__ply{display:inline;margin-right:.6rem;width:auto}}.controls-box{grid-area:controls;padding:0 2rem 2rem}.controls{background:var(--color-bg-block);padding:2rem;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.controls__button{margin:0;padding:.5rem;font-size:3rem;text-align:center;width:4.4rem;height:4.4rem;border-radius:0}.flip__button{margin-left:3px;padding:.5rem;font-size:3rem;text-align:center;border-radius:5px;width:4.4rem;height:4.4rem}.controls__button:hover{background:var(--color-btn-light);cursor:pointer}.controls__button--last{margin-right:3px;border-top-right-radius:5px;border-bottom-right-radius:5px}.controls__button--first{margin-left:0;border-top-left-radius:5px;border-bottom-left-radius:5px}.info-box{grid-area:controls;padding:0 2rem 2rem}.info{background:var(--color-bg-block);padding:3rem 2rem;font-size:1.4rem;text-align:left}.info__players{position:relative;line-height:2rem;margin-bottom:2rem;padding:0 1rem}.info__rating{font-family:Fira Code,monospace;color:var(--color-text-dimmed);position:absolute;right:1rem}.info__color{border-radius:1rem;padding:0;border:solid 2px var(--color-tab);width:1.4rem;height:1.4rem;margin-right:.8rem}.info__color--white{background-color:#eee}.info__color--black{background-color:#111}.info__event{margin-bottom:1rem}.info__event,.info__site{font-size:1.3rem;line-height:1.5rem;color:var(--color-text);padding:0 1rem}.load{background:var(--color-bg-block);padding:2rem;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.load__game-input{height:50vh;margin-top:2rem}.load__game-input::-webkit-scrollbar{width:.7rem;cursor:pointer}.load__game-input::-webkit-scrollbar-track{box-shadow:inset 0 0 6px #00000080}.load__game-input::-webkit-scrollbar-thumb{background-color:#003b2f;outline:1px solid rgb(0,59,47)}.load__game-btn{width:100%}.load__pgn-file{margin-top:2rem}.load__pgn-file-info{font-size:1.3rem}.load__pgn-file-info p{margin-top:1rem;color:var(--color-text-dimmed)}.load__link-input{margin-top:2rem}.share{border-bottom-left-radius:5px;border-bottom-right-radius:5px}.share__format,.share__size{padding:.8rem;border-radius:0;margin-bottom:1rem;opacity:.5}.share__format{width:33.33%}.share__size{width:20%}.share__format--first,.share__size--first{border-top-left-radius:5px;border-bottom-left-radius:5px}.share__format--last,.share__size--last{border-top-right-radius:5px;border-bottom-right-radius:5px}.share__format--active,.share__size--active{opacity:1}.share__format--active:hover,.share__size--active:hover{cursor:default}.share__btn{margin-bottom:1rem}.header--first{margin-top:0;margin-bottom:2.5rem}.options__button{margin:3px;padding:.5rem;font-size:3rem;text-align:center;border-radius:5px;width:4.4rem;height:4.4rem;opacity:.5}.options__button--active{opacity:1}.options__button:hover{background:var(--color-btn-light);cursor:pointer}.options__button--last{margin-right:0}.options__button--first{margin-left:0}.rotatable{transition:transform .3s}.rotated{transform:rotate(180deg)}.boards{text-align:center;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.boards__ico{margin:.2rem;cursor:pointer;width:8.2rem;height:8.2rem;padding:0;display:inline-block;background-size:contain;background-repeat:no-repeat;border:solid .5rem transparent}.boards__ico--active{cursor:default;border:solid 5px var(--color-frame-marker-active)}.pieces{text-align:center;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.pieces__ico{border:solid 5px transparent;margin:5px;cursor:pointer;width:7.2rem;height:7.2rem;background-color:var(--color-highlight);border-radius:.5rem}.pieces__ico--active{border-color:var(--color-frame-marker-active);cursor:default}.tab{border-bottom-left-radius:0;border-bottom-right-radius:0;height:3.8rem;background:var(--color-tab);min-width:4rem}.tab:hover{background:var(--color-tab-light)}.tab--active{background:var(--color-bg-block);color:var(--color-text);cursor:default}.tab--active:hover{background:var(--color-bg-block)}.game-box{grid-area:moves;padding:2rem;padding-top:var(--header-margin);min-width:37.5rem;height:100vh}@media (orientation: portrait){.game-box{padding:0;height:800px}}.game{height:100%;display:grid;grid-template-rows:3.8rem 19.5rem 1fr 8.4rem}.game-tabs{display:grid;grid-auto-flow:column;grid-template-columns:1fr 1fr;column-gap:.5rem}.span2{grid-row-end:span 2}.span3{grid-row-end:span 3}.setup-box{height:100vh;grid-area:setup;padding:2rem;padding-top:var(--header-margin);min-width:37.5rem}.setup{font-size:1.6rem;height:100%;display:grid;grid-template-rows:3.8rem 1fr}.setup-tabs{display:grid;grid-auto-flow:column;grid-template-columns:1fr 1fr 1fr;column-gap:.5rem}@font-face{font-family:Chess;src:url(chess.ttf) format("ttf")}*{border:0;margin:0;padding:0;box-sizing:border-box;outline:none}html{font-size:10px}body{background-repeat:repeat;background-position:center;text-align:center;font-family:Ubuntu,sans-serif;--header-height: 4rem;--header-margin: 6rem}.dark{background-color:#313742;background-image:url(/img/pattern.png);background-size:12rem;color:#d4dde0;--logo-url: url(/img/logo.svg);--color-btn: rgb(0, 173, 136);--color-btn-light: rgb(0, 207, 162);--color-tab: #899399;--color-tab-light: #a9b4bd;--color-bg-block: #17171f;--color-bg-input: #20242a;--color-border-input: #2d323a;--color-highlight: #ffffff22;--color-text: #aaa;--color-text-contrast: #0e0e13;--color-text-input: #acbddb;--color-text-dimmed: #677794;--color-scrollbar: rgb(0, 59, 47);--color-scrollbar-track: #ffffff22;--color-frame-marker-active: #fff}.light{background-color:#959ea1;background-image:url(/img/pattern-light.png);background-size:12rem;color:#1d1f20;--logo-url: url(/img/logo-dark.svg);--color-btn: rgb(0, 148, 116);--color-btn-light: rgb(0, 114, 89);--color-tab: #5d6468;--color-tab-light: #3e4346;--color-bg-block: #dddddd;--color-bg-input: #eeeeee;--color-border-input: #7f8999;--color-highlight: #00000022;--color-text: rgb(46, 54, 58);--color-text-contrast: #fff;--color-text-input: #46494e;--color-text-dimmed: #767980;--color-scrollbar: rgb(133, 184, 173);--color-scrollbar-track: #00000022;--color-frame-marker-active: #000}button,.upload:before{padding:.8rem;font-family:Ubuntu;font-size:1.5rem;background:var(--color-btn);color:var(--color-text-contrast);border-radius:5px;width:100%}button:hover,.upload:hover:before{background:var(--color-btn-light);cursor:pointer}input,textarea{width:100%;padding:.8rem;font-family:Fira Mono;font-size:1.4rem;margin-bottom:1rem;background:var(--color-bg-input);border:solid 1px var(--color-border-input);color:var(--color-text-input);outline:none;resize:none}input:focus,textarea:focus{border-color:#005744}h2{color:var(--color-text);text-align:left;font-size:1.5rem;margin:2.5rem 0 1.5rem;font-weight:500}h3{color:var(--color-text);text-align:left;font-size:1.6rem;margin:1.5rem 0 1rem;font-weight:500}hr{margin-top:2rem;border-top:solid 1px var(--color-highlight)}a,a:visited,a:active{color:var(--color-btn);text-decoration:none}a:hover{text-decoration:underline}.invisible{opacity:0}.board-box{height:100vh;grid-area:board;padding:var(--header-margin) 0 2rem 0}.board{box-shadow:0 0 2rem #0009;border-radius:5px;max-width:100%;max-height:100%}.double{display:grid;grid-template-columns:1fr 1fr;column-gap:1rem}.layout{display:grid;grid-template-columns:1fr 2fr 1fr;grid-template-rows:1fr;grid-template-areas:"setup board moves" "setup board moves";height:100vh}@media (orientation: landscape) and (max-width: 1536px){html{font-size:9px}}@media (orientation: landscape) and (max-width: 1365px){.layout{grid-template-columns:2fr 1fr;grid-template-areas:"board moves" "board moves"}}@media (orientation: portrait){html{font-size:10px}.layout{grid-template-columns:1fr;grid-template-areas:"board" "moves" "setup"}.moves-box{height:auto}.board-box{height:auto;max-height:100vh;padding:var(--header-height) 0 1rem 0;font-size:0}.board{border-radius:0}.setup-box{height:auto}}::placeholder{color:var(--color-text-dimmed)}