html[data-theme=light]{--primary-color: white;--secondary-color: #1f2722;--tertiary-color-0: #57e991;--tertiary-color-1: #33b065;--tertiary-color-2: #329359;--tertiary-color-3: #166937;--darkshade-color-4: #313131;--darkshade-color-3: #444;--darkshade-color-2: #626262;--darkshade-color-1: #808080;--lightshade-color-1: #b3b3b3;--lightshade-color-2: #c3c3c3;--lightshade-color-3: #dfdfdf;--lightshade-color-4: #f3f3f3}html[data-theme=dark]{--primary-color: #1f2722;--secondary-color: white;--tertiary-color-0: #166937;--tertiary-color-1: #329359;--tertiary-color-2: #33b065;--tertiary-color-3: #57e991;--darkshade-color-4: #f3f3f3;--darkshade-color-3: #dfdfdf;--darkshade-color-2: #c3c3c3;--darkshade-color-1: #b3b3b3;--lightshade-color-1: #808080;--lightshade-color-2: #626262;--lightshade-color-3: #444;--lightshade-color-4: #313131}*{margin:0;padding:0;box-sizing:border-box}html{font-size:62.5%}body{font-family:Red Hat Text,sans-serif;font-size:1.6rem;background-color:var(--primary-color);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body>div{min-height:100vh;display:flex;flex-direction:column}body>div main{text-align:center}h1,h2,h3{display:block;font-family:Red Hat Text,sans-serif;font-weight:500;color:var(--tertiary-color-1)}h1{font-size:3.6rem;text-transform:uppercase;margin:2.6rem 0}h2{font-size:2.8rem;margin:2rem 0}h3{font-size:2.2rem;margin:1.6rem 0}a{display:inline-block;font-weight:500;text-decoration:none}li{list-style:none}p{margin:1rem 0}img{display:block;width:100%;max-height:100%}button{display:inline-block}button:hover{cursor:pointer}input,select,textarea{display:inline-block;border:none;font-family:Red Hat Text,sans-serif}textarea{display:block;resize:none}::placeholder{font-weight:400;color:var(--darkshade-color-1)}.header{height:40px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;background-color:var(--lightshade-color-3)}.header .nav{display:flex;justify-content:space-between;align-items:center;height:100%;width:100%;padding:0 1rem}@media screen and (min-width: 768px){.header .nav{padding:0 2rem}}.header .nav .logo_ctn{display:flex;height:32px;width:32px}@media screen and (min-width: 768px){.header .nav .logo_ctn{margin-left:1rem}}.header .nav .title{position:absolute;left:calc(50% - 60px);transform:translate(-50%) translate(60px);font-size:min(8vw,3.6rem);letter-spacing:2px;-webkit-text-stroke:1px var(--tertiary-color-3);white-space:nowrap;color:var(--tertiary-color-2)}@media screen and (min-width: 768px){.header .nav .title{font-size:3.6rem;transform:translate(-50%) translate(60px) scaleX(1.3)}}.header .nav .toggle_theme_btn{position:absolute;top:6px;right:40px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:none;font-size:1.8rem;color:var(--secondary-color);background-color:var(--primary-color);transition:color .3s}.header .nav .toggle_theme_btn:hover{color:var(--tertiary-color-2)}.header .nav .menu{position:absolute;top:-16rem;left:0;right:0;display:flex;flex-direction:column;width:100%;padding:.8rem 0 1rem;background-color:var(--darkshade-color-1);transition:transform 5s ease-out;z-index:101}@media screen and (min-width: 768px){.header .nav .menu{left:unset;width:200px}}.header .nav .menu>li>button{display:block;width:calc(50% - .8rem);margin:.4rem auto;padding:.6rem 0;outline:1px solid #fff;outline-offset:-1px;border:none;border-radius:.6rem;font-family:Red Hat Text,sans-serif;font-size:1.6rem;font-weight:500;text-align:center;text-decoration:none;text-transform:uppercase;color:var(--tertiary-color-2);background-color:var(--primary-color);transition:all .4s}@media screen and (min-width: 768px){.header .nav .menu>li>button{width:calc(100% - 2rem)}}.header .nav .menu>li>button:hover{color:var(--primary-color);background-color:var(--tertiary-color-2)}.header .nav .show_menu{transform:translateY(16rem) translateY(40px);transition:transform 5s ease-out}.burger_btn{position:absolute;top:2px;right:2px;display:flex;align-items:center;justify-content:center;height:36px;width:36px;border:none;border-radius:9px;color:var(--secondary-color);background-color:transparent;z-index:10;transition:color .4s}.burger_btn:hover{color:var(--tertiary-color-2)}.burger_btn>svg{font-size:2.4rem}.home_section{display:flex;flex-direction:column;align-items:center;margin:0 0 1rem;padding:0 2rem}@media screen and (min-width: 768px){.home_section{flex-direction:row;flex-wrap:wrap;align-items:flex-start;justify-content:center;margin:0 auto;padding:0 4rem 2rem}}.home_section>*{width:100%}.home_section .chess_section{order:1;aspect-ratio:1;margin:2rem auto 0}@media screen and (min-width: 768px){.home_section .chess_section{width:400px;height:440px;margin:2rem 2rem 4rem}}@media screen and (min-width: 768px){.home_section .no_player_info{height:400px}}.home_section .notation_section{order:2}@media screen and (min-width: 768px){.home_section .notation_section{order:3}}.home_section .right_section{order:3;display:inline-flex;flex-direction:column;margin:0}@media screen and (min-width: 768px){.home_section .right_section{order:2;justify-content:space-between;width:calc(100% - 400px - 4rem);max-width:300px;margin:2rem 0}}.home_section .right_section .status_section{margin-top:2rem}.modal_ctn{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background-color:#00000080;z-index:101}.modal_ctn .modal{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:flex-start;width:80%;max-width:460px;max-height:calc(100% - 106.6666666667px);padding:1.5rem 1rem 1rem;border-radius:8px;text-align:left;background-color:var(--primary-color)}@media screen and (min-width: 768px){.modal_ctn .modal{max-width:500px;padding:2rem}}.modal_ctn .modal .close_btn{position:absolute;top:-36px;left:50%;transform:translate(-50%);border:none;font-size:30px;color:#fff;background-color:transparent}.modal_ctn .modal>*{overflow-y:auto;white-space:break-spaces;word-break:break-word}.chess_section{box-shadow:6px 6px 12px 3px var(--darkshade-color-1)}.chess_section .chess_set{position:relative;outline:1px solid var(--darkshade-color-4)}.chess_section .chess_set .chessboard{width:100%;height:100%;position:relative;display:grid;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);grid-template-areas:"a8 b8 c8 d8 e8 f8 g8 h8" "a7 b7 c7 d7 e7 f7 g7 h7" "a6 b6 c6 d6 e6 f6 g6 h6" "a5 b5 c5 d5 e5 f5 g5 h5" "a4 b4 c4 d4 e4 f4 g4 h4" "a3 b3 c3 d3 e3 f3 g3 h3" "a2 b2 c2 d2 e2 f2 g2 h2" "a1 b1 c1 d1 e1 f1 g1 h1";gap:0;z-index:10}@media screen and (min-width: 768px){.chess_section .chess_set .chessboard{width:100%;height:100%;padding:1rem}}.chess_section .chess_set .chessboard .square{width:100%;aspect-ratio:1}.chess_section .chess_set .chessboard .square img{position:relative;z-index:-9}.chess_section .chess_set .chessboard .dark{background-color:var(--lightshade-color-1)}.chess_section .chess_set .chessboard .light{background-color:var(--lightshade-color-3)}.chess_section .chess_set .pieces_ctn{position:absolute;top:0;left:0;width:100%;height:100%;z-index:20}@media screen and (min-width: 768px){.chess_section .chess_set .pieces_ctn{width:calc(100% - 2rem);height:calc(100% - 2rem);margin:1rem}}.chess_section .chess_set .pieces_ctn .pieces{position:relative;width:100%;height:100%}.chess_section .chess_set .pieces_ctn .pieces .piece{position:absolute;width:12.5%;height:12.5%}.chess_section .chess_set .pieces_ctn .pieces .piece:hover{cursor:grab}@media screen and (min-width: 768px){.chess_section .chess_set .pieces_ctn .pieces .piece{width:calc((100% - 2rem)/8);height:calc((100% - 2rem)/8)}}.chess_section .chess_set .board_notation{position:absolute;top:0;left:0;display:none}@media screen and (min-width: 768px){.chess_section .chess_set .board_notation{display:grid;grid-template-columns:1rem auto 1rem;grid-template-rows:1rem auto 1rem;width:100%;height:100%}}.chess_section .chess_set .board_notation>*{width:100%;height:100%;display:flex;font-weight:500;font-size:1rem;color:var(--secondary-color)}.chess_section .chess_set .board_notation>*:first-child{grid-row:1/2;grid-column:2/3;justify-content:space-around}.chess_section .chess_set .board_notation>*:nth-child(2){grid-row:2/3;grid-column:1/2;flex-direction:column;justify-content:space-around}.chess_section .chess_set .board_notation>*:nth-child(3){grid-row:2/3;grid-column:3/4;flex-direction:column;justify-content:space-around}.chess_section .chess_set .board_notation>*:last-child{grid-row:3/4;grid-column:2/3;justify-content:space-around}.chess_section .flipped,.chess_section .flipped .pieces_ctn .pieces .piece{transform:rotate(180deg)}.chess_section .flipped .board_notation>* *{transform:rotate(180deg)}.piece{display:flex;align-items:center;justify-content:center;transition:left .3s,bottom .3s,opacity .5s}.piece>img{width:95%;height:95%}.spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px}@media screen and (min-width: 768px){.spinner{width:80px;height:80px}}.spinner>path:first-child{stroke:var(--tertiary-color-2)}.spinner>path:last-child{stroke:var(--tertiary-color-1);fill:var(--tertiary-color-3);-webkit-animation:spin 1.5s linear infinite;-moz-animation:spin 1.5s linear infinite;-o-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite}@keyframes spin{0%{transform-origin:50% 50%;transform:rotate(0)}to{transform-origin:50% 50%;transform:rotate(360deg)}}.player_info{display:flex;justify-content:space-between;height:20px;width:100%;padding:0 1rem;outline:1px solid var(--darkshade-color-4);font-size:1.4rem}@media screen and (min-width: 768px){.player_info{width:400px;font-size:1.6rem}}.player_info .value{font-weight:500}.white{background-color:#fff}.white .value{font-weight:600}.black{color:#fff;background-color:#626262}.notation_section{display:inline-flex;flex-direction:column;margin:2rem 1rem;outline:1px solid grey;box-shadow:4px 4px 8px 2px var(--darkshade-color-1)}@media screen and (min-width: 768px){.notation_section{width:730px;margin:0 1rem 0 2rem}}.notation_section .control_panel{background-color:var(--lightshade-color-4)}.notation_section .control_panel .control_ctn{display:flex;justify-content:space-between;margin:10px 5px}.notation_section .control_panel .control_ctn+.control_ctn{margin-top:.5rem}.notation_section .control_panel .control_ctn .open_btn,.notation_section .control_panel .control_ctn button{display:flex;justify-content:center;align-items:center;height:20px;margin:0 5px;border:1px solid var(--tertiary-color-3);border-radius:2px;box-shadow:2px 2px 2px var(--darkshade-color-2);text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:all .4s;padding:0 6px;font-weight:600;font-size:1.4rem;letter-spacing:1px;color:var(--tertiary-color-3);background-color:var(--lightshade-color-4)}@media screen and (min-width: 768px){.notation_section .control_panel .control_ctn .open_btn,.notation_section .control_panel .control_ctn button{font-size:1.4rem}}.notation_section .control_panel .control_ctn .functions_btn{display:flex;align-items:center}.notation_section .control_panel .control_ctn .functions_btn .open_btn{color:#6d4b00}.notation_section .control_panel .control_ctn .functions_btn .open_btn::file-selector-button{background-color:#57e991}.notation_section .control_panel .control_ctn .functions_btn .open_btn::file-selector-button::content{content:"OPEN"}.notation_section .control_panel .control_ctn .functions_btn .open_btn>span{display:none}.notation_section .control_panel .control_ctn .functions_btn .load_btn{color:var(--tertiary-color-3)}.notation_section .control_panel .control_ctn .functions_btn .load_btn:hover{background-color:var(--tertiary-color-1)}.notation_section .control_panel .control_ctn .functions_btn .clear_btn{color:#e71369}.notation_section .control_panel .control_ctn .functions_btn .flip_board_btn{color:#00f}.notation_section .control_panel .control_ctn .nav_btn{display:flex;align-items:center}.notation_section .control_panel .control_ctn .nav_btn>button{display:flex;justify-content:center;align-items:center;height:20px;border:1px solid var(--tertiary-color-3);border-radius:2px;box-shadow:2px 2px 2px var(--darkshade-color-2);text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:all .4s;width:25px;margin:0 4px;font-size:1.4rem;color:var(--darkshade-color-2);background-color:var(--lightshade-color-2)}@media screen and (min-width: 768px){.notation_section .control_panel .control_ctn .nav_btn>button{width:30px;margin:0 5px}}.notation_section .notation{width:100%;padding:5px}.notation_section .notation>textarea{width:100%;height:100%;padding:.5rem;box-shadow:inset 0 0 4px var(--darkshade-color-1);resize:none;font-weight:500;font-size:1.6rem}.status_section{display:inline-block;padding:.5rem;outline:1px solid grey;box-shadow:3px 3px 6px 2px var(--lightshade-color-1);background-color:var(--lightshade-color-3)}.status_section .status_txt_ctn{width:100%;height:100%;padding:1rem;border-radius:8px;box-shadow:inset 0 0 5px 2px var(--darkshade-color-2);background-color:var(--secondary-color)}.status_section .status_txt_ctn .status_txt{width:100%;height:100%;font-family:Chakra Petch,sans-serif;font-size:1.4rem;color:var(--tertiary-color-0);text-shadow:0 0 8px var(--tertiary-color-2),0 0 16px var(--primary-color);background-color:transparent;overflow-y:scroll}.status_section .status_txt_ctn .status_txt::-webkit-scrollbar{width:8px}.status_section .status_txt_ctn .status_txt::-webkit-scrollbar-track{background:var(--lightgrey-color-1)}.status_section .status_txt_ctn .status_txt::-webkit-scrollbar-thumb{background:var(--lightgrey-color-2)}.status_section .status_txt_ctn .status_txt::-webkit-scrollbar-thumb:hover{background:var(--lightgrey-color-3)}.infobar{position:relative;min-height:36px;padding:1rem 3.5rem 1rem 1rem;outline:1px solid var(--lightshade-color-1);box-shadow:3px 3px 6px 2px var(--lightshade-color-1);background-color:#abc6b6}.infobar .no_info{margin:0;font-size:1.2rem}.infobar .collapse_btn{position:absolute;top:7px;right:7px;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:none;color:var(--secondary-color);background-color:var(--lightshade-color-4)}.infobar_details,.infobar_data_ctn{width:100%;text-align:left}.infobar_details .tag,.infobar_data_ctn .tag{margin:0;font-size:1.2rem}.infobar_details .tag>*+*,.infobar_data_ctn .tag>*+*{margin-left:.5rem}.infobar_details .tag .value,.infobar_data_ctn .tag .value{font-weight:500}.settings{width:100%;height:100%}.settings>h2{margin-top:0;text-align:center}.settings_ctn{display:flex;align-items:center;padding:.5rem}.settings_ctn>button{margin-left:1rem}.switch_btn{position:relative;width:36px;height:20px;border-radius:10px;border:none;background-color:var(--lightshade-color-1);transition:background-color .3s,outline .1s}.switch_btn:hover{outline:2px solid var(--tertiary-color-3)}.switch_btn .thumb{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background-color:var(--primary-color);transition:left .3s,background-color .3s}.toggled{background-color:var(--tertiary-color-1)}.toggled .thumb{left:calc(100% - 17px)}.db{width:100%;height:100%;padding-bottom:2rem}.db button{border:none;font-weight:600}.db>h2{margin-top:0;text-align:center}.db .list,.db .list .sublist,.db .list .sublist .subsublist{padding-left:2rem}.navigation{margin:2rem 0 0;padding:0 .5rem .5rem;outline:1px solid grey;box-shadow:4px 4px 8px 2px var(--darkshade-color-1)}.navigation .control_panel{display:flex;justify-content:space-between;margin:10px 5px}.navigation .control_panel button{display:flex;justify-content:center;align-items:center;height:20px;margin:0 5px;border:1px solid var(--tertiary-color-3);border-radius:2px;box-shadow:2px 2px 2px var(--darkshade-color-2);text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:all .4s;padding:0 6px;font-weight:600;font-size:1.4rem;letter-spacing:1px;color:var(--tertiary-color-3);background-color:var(--lightshade-color-4)}@media screen and (min-width: 768px){.navigation .control_panel button{font-size:1.4rem}}.navigation .control_panel .functions_btn{display:flex;align-items:center}.navigation .control_panel .functions_btn .flip_board_btn{color:#00f}.navigation .control_panel .nav_btn{display:flex;align-items:center}.navigation .control_panel .nav_btn>button{display:flex;justify-content:center;align-items:center;height:20px;border:1px solid var(--tertiary-color-3);border-radius:2px;box-shadow:2px 2px 2px var(--darkshade-color-2);text-transform:uppercase;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:all .4s;width:25px;margin:0 4px;font-size:1.4rem;color:var(--darkshade-color-2);background-color:var(--lightshade-color-2)}@media screen and (min-width: 768px){.navigation .control_panel .nav_btn>button{width:30px;margin:0 5px}}.navigation .moves_section{min-height:40px;max-height:300px;display:flex;padding:.5rem 1rem 3rem;overflow-y:scroll;box-shadow:inset 0 0 4px var(--darkshade-color-1);background-color:#fff}.navigation .moves_section>*{display:flex;flex-direction:column;align-items:center}.navigation .moves_section>*>span:last-child:after{content:"";display:block;height:.5em;width:100%}.navigation .moves_section>* .active{width:100%;font-weight:600;background-color:#abc6b6}.navigation .moves_section .move_number{width:20%;min-width:30px}.navigation .moves_section .white_move,.navigation .moves_section .black_move{width:40%}.footer{display:flex;flex-direction:column;align-items:center;height:30px;overflow:hidden;margin-top:auto;font-size:1.4rem;text-align:center;background-color:var(--primary-color)}.footer p{display:block;font-size:1.2rem;color:var(--darkshade-color-1)}