@import"https://fonts.googleapis.com/css2?family=Roboto&display=swap";*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;font-family:roboto,sans-serif;--text-high-color: hsl(0, 0%, 100%, .87);--text-med-color: hsl(0, 0%, 100%, .6);--text-low-color: hsl(0, 0%, 100%, .38);--bg-high-color: hsl(0, 0%, 25%);--bg-med-color: hsl(0, 0%, 19%);--bg-low-color: hsl(0, 0%, 9%);--accent-color-red: hsl(356, 45%, 52%);--accent-color-yellow: hsl(60, 45%, 52%);--accent-color-green: hsl(120, 45%, 52%);--accent-filter-red: brightness(0) saturate(100%) invert(38%) sepia(43%) saturate(855%) hue-rotate(307deg) brightness(91%) contrast(86%);--bg-low-filter: brightness(0) saturate(100%) invert(0%) sepia(2%) saturate(5744%) hue-rotate(60deg) brightness(130%) contrast(82%);--bg-med-filter: brightness(0) saturate(100%) invert(12%) sepia(0%) saturate(125%) hue-rotate(265deg) brightness(99%) contrast(82%);--bg-high-filter: brightness(0) saturate(100%) invert(25%) sepia(0%) saturate(157%) hue-rotate(292deg) brightness(95%) contrast(95%);--text-med-filter: invert(100%) opacity(.6);--g2048-text-dark: hsl(43, 0%, 25%);--g2048-text-light: hsl(0, 0%, 88%);--g2048-color-2: hsl(202, 45%, 65%);--g2048-color-4: hsl(71, 45%, 65%);--g2048-color-8: hsl(153, 45%, 65%);--g2048-color-16: hsl(244, 45%, 65%);--g2048-color-32: hsl(25, 45%, 55%);--g2048-color-64: hsl(0, 45%, 55%);--g2048-color-128: hsl(118, 40%, 50%);--g2048-color-256: hsl(218, 40%, 50%);--g2048-color-512: hsl(58, 50%, 50%);--g2048-color-1024: hsl(293, 40%, 48%);--g2048-color-2048: hsl(158, 40%, 48%)}html.light{--text-high-color: hsl(0, 0%, 0%, .87);--text-med-color: hsl(0, 0%, 0%, .6);--text-low-color: hsl(0, 0%, 0%, .38);--bg-high-color: hsl(0, 0%, 98%);--bg-med-color: hsl(0, 0%, 95%);--bg-low-color: hsl(0, 0%, 90%);--accent-color-red: hsl(356, 75%, 42%);--accent-color-yellow: hsl(60, 75%, 35%);--accent-color-green: hsl(120, 65%, 20%);--accent-filter-red: brightness(0) saturate(100%) invert(13%) sepia(82%) saturate(4954%) hue-rotate(350deg) brightness(84%) contrast(89%);--bg-low-filter: brightness(0) saturate(100%) invert(99%) sepia(1%) saturate(3723%) hue-rotate(225deg) brightness(110%) contrast(80%);--bg-med-filter: brightness(0) saturate(100%) invert(99%) sepia(13%) saturate(361%) hue-rotate(252deg) brightness(117%) contrast(90%);--bg-high-filter: brightness(0) saturate(100%) invert(99%) sepia(0%) saturate(7500%) hue-rotate(195deg) brightness(118%) contrast(96%);--text-med-filter: brightness(0) opacity(.6)}main{width:100%;height:calc(100vh - 66px);overflow-y:auto;scrollbar-width:thin;scroll-behavior:smooth;scrollbar-color:var(--accent-color-red) rgb(0,0,0,0)}#root{max-width:100vw;min-height:100vh;display:grid;grid-template-rows:min-content 1fr min-content;background-color:var(--bg-low-color)}header{display:flex;justify-content:space-evenly;align-items:center;padding:.5rem 0;background-color:var(--bg-med-color);color:var(--accent-color-red);position:relative}header>a{text-decoration:none;color:var(--accent-color-red)}.logo-wrapper{display:flex;align-items:center;gap:1rem}.logo-title{font-size:clamp(1.5rem,1rem + 1.5vw,2rem);font-weight:700}.logo-img{max-width:50px;max-height:50px}.logo-img img{width:100%;height:100%;filter:var(--accent-filter-red)}.header-nav{display:flex;gap:2rem}header nav a{color:var(--accent-filter-red);text-decoration:none;font-weight:700}header nav a:hover,header nav a:focus{text-decoration:underline}header .options{display:flex;align-items:center;gap:3rem}.header-menu-btn{display:none;width:35px;background:none;border:none;cursor:pointer;border:1px solid var(--bg-med-color);border-radius:5px}.header-menu-btn:focus,.header-menu-btn:hover{border-color:var(--accent-color-red)}.header-menu-btn>img{pointer-events:none;width:100%;filter:var(--accent-filter-red);cursor:pointer}.header-nav.show{display:flex;animation-name:drop-down;animation-fill-mode:backwards;animation-timing-function:ease-out;transform-origin:top;animation-duration:.2s}@keyframes drop-down{0%{transform:scaleY(0)}70%{transform:scaleY(1.1)}to{transform:scaleY(1)}}@media only screen and (max-width:800px){.header-nav{position:absolute;top:100%;left:0;background-color:var(--bg-high-color);width:100%;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem 0;gap:1.5rem;z-index:3;display:none}.header-menu-btn{display:flex}}@media only screen and (max-width:500px){.logo-title{display:none}}.toggle-btn{border:none;background-color:var(--accent-color-red);cursor:pointer;border-radius:20px;padding:.2rem;width:clamp(40px,35px + 1vw,50px);height:clamp(20px,10px + 1vw,25px);position:relative}.toggle-btn .toggle-btn-toggle{height:100%;background-color:var(--text-med-color);width:40%;border-radius:50%;position:relative;z-index:1;transition:transform .1s ease-in-out}.toggle-btn.on .toggle-btn-toggle{transform:translate(150%)}.toggle-images{position:absolute;width:100%;height:100%;display:flex;padding:.2rem;justify-content:space-between;top:0;left:0;-webkit-user-select:none;user-select:none}.toggle-btn.on .light-img,.toggle-btn .dark-img{visibility:hidden}.toggle-btn .light-img,.toggle-btn.on .dark-img{visibility:visible}.light-img,.dark-img{transition:all .1s ease-in-out}.dark-img{filter:var(--bg-med-filter);transform:rotate(30deg)}.light-img{filter:invert(100%) opacity(.6)}.wordle-main{width:100%;display:flex;flex-direction:column;justify-content:center;gap:clamp(1rem,.2rem + 1vw,2rem);align-items:center;position:relative}.wordle-board{display:flex;flex-direction:column;gap:.5rem;position:relative}.show-wordle-rules{position:absolute;top:-1%;right:-15%;width:35px;display:flex;background:none;border:none;cursor:pointer;border-radius:5px}.show-wordle-rules img{width:100%;filter:var(--text-med-filter)}.show-wordle-rules:hover,.show-wordle-rules:focus{background-color:var(--bg-med-color)}@media only screen and (max-width:450px){.show-wordle-rules{top:-12%;right:1%}}.wordle-input{width:fit-content;display:flex;gap:.5rem;outline:none;cursor:default;-webkit-user-select:none;user-select:none}.wordle-input .input-letter{display:flex;justify-content:center;align-items:center;width:clamp(50px,40px + 1vw,65px);height:clamp(50px,40px + 1vw,65px);border:2px solid var(--text-med-color);border-radius:5px;font-size:clamp(1rem,.6rem + 1.5vw,2rem);font-weight:700;color:var(--text-med-color);background-color:var(--bg-low-color)}.wordle-input .input-letter.wrong{color:var(--bg-low-color);background-color:var(--text-med-color);border:none;will-change:transform;animation-name:wrong-flip;animation-duration:1s;animation-fill-mode:backwards;animation-timing-function:linear}.wordle-input .input-letter.right-letter{background-color:var(--accent-color-yellow);color:var(--bg-low-color);border:none;will-change:transform;animation-name:right-letter-flip;animation-duration:1s;animation-fill-mode:backwards;animation-timing-function:linear}.wordle-input .input-letter.correct{background-color:var(--accent-color-green);color:var(--bg-low-color);border:none;will-change:transform;animation-name:correct-flip;animation-duration:1s;animation-fill-mode:backwards;animation-timing-function:linear}@keyframes wrong-flip{0%{border:2px solid var(--text-med-color);color:var(--text-med-color);background-color:var(--bg-low-color);transform:rotateX(0) perspective(10px)}50%{border:2px solid var(--text-med-color);color:var(--text-med-color);background-color:var(--bg-low-color);transform:rotateX(-90deg) perspective(10px)}51%{color:var(--bg-low-color);background-color:var(--text-med-color);border:none;transform:rotateX(-90deg) perspective(10px)}to{color:var(--bg-low-color);background-color:var(--text-med-color);border:none;transform:rotateX(0) perspective(10px)}}@keyframes right-letter-flip{0%{border:2px solid var(--text-med-color);color:var(--text-med-color);background-color:var(--bg-low-color);transform:rotateX(0) perspective(10px)}50%{border:2px solid var(--text-med-color);color:var(--text-med-color);background-color:var(--bg-low-color);transform:rotateX(-90deg) perspective(10px)}51%{color:var(--bg-low-color);background-color:var(--accent-color-yellow);border:none;transform:rotateX(-90deg) perspective(10px)}to{color:var(--bg-low-color);background-color:var(--accent-color-yellow);border:none;transform:rotateX(0) perspective(10px)}}@keyframes correct-flip{0%{border:2px solid var(--text-med-color);color:var(--text-med-color);background-color:var(--bg-low-color);transform:rotateX(0) perspective(10px)}50%{border:2px solid var(--text-med-color);color:var(--text-med-color);background-color:var(--bg-low-color);transform:rotateX(-90deg) perspective(10px)}51%{background-color:var(--accent-color-green);color:var(--bg-low-color);border:none;transform:rotateX(-90deg) perspective(10px)}to{background-color:var(--accent-color-green);color:var(--bg-low-color);border:none;transform:rotateX(0) perspective(10px)}}.wordle-popup{position:absolute;background-color:var(--accent-color-red);border-radius:5px;padding:.5rem 1rem;color:var(--bg-low-color);font-weight:700;display:flex;align-items:center;gap:.5rem;top:clamp(2%,1.5% + 1vw,5%);z-index:1}.wordle-popup.fade-out{animation-name:fade-out;animation-delay:.5s;animation-duration:1s;animation-fill-mode:forwards;animation-timing-function:linear}.wordle-popup button{background:none;border:none;display:flex;padding:.2rem 0 .2rem .2rem;width:25px;cursor:pointer}.wordle-popup button img{width:100%}html.light .wordle-popup button img{filter:invert() opacity(.8)}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.wordle-keyboard{display:flex;flex-direction:column;align-items:center;gap:clamp(.2rem,.1rem + 1vw,.6rem)}.wordle-keyboard-keys{display:flex;align-items:center;justify-content:center;gap:clamp(.2rem,0rem + 1vw,.6rem);width:100%}.w-keyboard-key{border:2px solid var(--text-med-color);border-radius:5px;font-size:clamp(.8rem,.5rem + .6vw,1.4rem);font-weight:700;cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-med-color);display:flex;justify-content:center;align-items:center;width:clamp(28px,20px + 1.5vw,51px);height:clamp(55px,45px + 1vw,65px);flex-shrink:0}.w-keyboard-key.enter{flex-grow:1;flex-shrink:1;flex-basis:100%;font-size:clamp(.6rem,.3rem + 1vw,1rem)}.w-keyboard-key.backspace{flex-basis:100%;flex-grow:1;flex-shrink:1;--filter: var(--text-med-filter)}.w-keyboard-key.backspace img{width:35%;filter:var(--filter)}.w-keyboard-key.pressed{background-color:var(--accent-color-red);color:var(--bg-low-color);border-color:var(--accent-color-red)}.w-keyboard-key.backspace.pressed,.w-keyboard-key.backspace.wrong,.w-keyboard-key.backspace.right-letter,.w-keyboard-key.backspace.correct{--filter: var(--bg-low-filter)}.w-keyboard-key.wrong{color:var(--bg-low-color);background-color:var(--text-med-color);border:none;opacity:.1}.w-keyboard-key.right-letter{color:var(--bg-low-color);background-color:var(--accent-color-yellow);border:none;opacity:1}.w-keyboard-key.correct{color:var(--bg-low-color);background-color:var(--accent-color-green);border:none;opacity:1}.loading-main{display:flex;gap:2rem;flex-direction:column;align-items:center;padding-top:2rem;position:relative}.loading-img-wrapper{width:clamp(100px,90px + 2vw,120px)}.loading-img-wrapper img{width:100%;filter:var(--accent-filter-red) brightness(.8)}.loading-spinner-wrapper{width:clamp(40px,30px + 1vw,50px);position:relative}.loading-spinner-wrapper .circle-img{position:absolute;width:100%;filter:var(--bg-med-filter)}.loading-spinner-wrapper .spinner-img{width:100%;filter:var(--accent-filter-red) brightness(.8);animation-name:spin;animation-duration:2.5s;animation-iteration-count:infinite}@keyframes spin{0%{transform:rotate(0)}50%{transform:rotate(90deg)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.wordle-rules-popup{position:absolute;background-color:var(--bg-high-color);display:flex;flex-direction:column;gap:.5rem;padding:1rem;color:var(--text-med-color);top:5%;border-radius:10px;z-index:1}.wordle-rules-popup .exit-wrapper{width:100%;display:flex;justify-content:end}.wordle-rules{display:flex;flex-direction:column;gap:1rem}.wordle-rules ul{padding-left:1rem;display:flex;flex-direction:column;gap:.5rem}.wordle-rules li{width:clamp(30ch,25ch + 2vw,45ch)}.examples-title,.wordle-rules-popup .title{font-size:1.2rem;font-weight:700}.examples-title{margin-top:.5rem}.example-img-wrapper{width:min(250px,100%)}.example-img-wrapper img{width:100%}.wordle-rules-popup button{background:none;border:none;cursor:pointer;width:30px;display:flex}.wordle-rules-popup button img{filter:var(--text-med-filter)}.wordle-rules-popup.hidden{display:none}main.sudoku{display:flex;justify-content:center;align-items:center;position:relative}.sudoku-game{width:100%;height:100%;display:flex;justify-content:center;align-items:center;gap:1rem}.sudoku-board{display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);border:2px solid var(--bg-high-color);border-color:var(--text-med-color)}.sudoku-board .sudoku-cell{background-color:var(--bg-low-color);border:1px solid var(--text-low-color);width:clamp(35px,30px + 1vw,60px);height:clamp(35px,30px + 1vw,60px);color:var(--text-med-color);font-size:clamp(1rem,.8rem + 1vw,1.6rem);font-style:italic;display:flex;flex-wrap:wrap;gap:.1rem;justify-content:center;align-items:center;cursor:default;position:relative}.sudoku-cell .cell-note{font-size:clamp(.5rem,.1rem + .7vw,.8rem);font-weight:700;font-style:normal;pointer-events:none}.sudoku-cell[data-row="2"],.sudoku-cell[data-row="5"]{border-bottom-width:2px;border-bottom-color:var(--text-med-color)}.sudoku-cell[data-row="3"],.sudoku-cell[data-row="6"]{border-top-width:2px;border-top-color:var(--text-med-color)}.sudoku-cell[data-col="2"],.sudoku-cell[data-col="5"]{border-right-width:2px;border-right-color:var(--text-med-color)}.sudoku-cell[data-col="3"],.sudoku-cell[data-col="6"]{border-left-width:2px;border-left-color:var(--text-med-color)}.sudoku-cell[data-row="0"]{border-top-width:2px;border-top-color:var(--text-med-color)}.sudoku-cell[data-col="0"]{border-left-width:2px;border-left-color:var(--text-med-color)}.sudoku-cell[data-col="8"]{border-right-width:2px;border-right-color:var(--text-med-color)}.sudoku-cell[data-row="8"]{border-bottom-width:2px;border-bottom-color:var(--text-med-color)}.sudoku-cell.active-cell{background-color:var(--accent-color-red)}.sudoku-cell.highlighted-cell{background-color:var(--accent-color-green)}.sudoku-cell.filled-cell{font-style:normal;font-weight:700;color:var(--text-high-color)}.sudoku-btns{display:flex;flex-direction:column;gap:.5rem}.sudoku-num-btn{cursor:pointer;border:none;font-weight:700;color:var(--text-med-color);background-color:var(--bg-low-color);width:70px;height:70px;font-size:clamp(32px,25px + 1vw,35px);border:2px solid var(--text-med-color);border-radius:10px;display:flex;justify-content:center;align-items:center}.sudoku-num-btn[data-num="1"]:before{content:"1";display:block}.sudoku-num-btn[data-num="2"]:before{content:"2";display:block}.sudoku-num-btn[data-num="3"]:before{content:"3";display:block}.sudoku-num-btn[data-num="4"]:before{content:"4";display:block}.sudoku-num-btn[data-num="5"]:before{content:"5";display:block}.sudoku-num-btn[data-num="6"]:before{content:"6";display:block}.sudoku-num-btn[data-num="7"]:before{content:"7";display:block}.sudoku-num-btn[data-num="8"]:before{content:"8";display:block}.sudoku-num-btn[data-num="9"]:before{content:"9";display:block}.sudoku-num-btn.all-nums-placed:before{content:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z'%20/%3e%3c/svg%3e");display:inline-block;width:70%;height:70%;filter:var(--text-med-filter)}.sudoku-num-btn:hover,.sudoku-num-btn:active{background-color:var(--accent-color-red)}.sudoku-btns .num-btns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.5rem}.sudoku-btns .edit-btns{width:100%;display:flex;justify-content:center;gap:1rem}.edit-btns>button{background-color:var(--bg-low-color);border:2px solid var(--text-med-color);border-radius:10px;width:50px;display:flex;padding:.4rem;cursor:pointer}.edit-btns>button:hover,.edit-btns>button:active{background-color:var(--accent-color-red)}.edit-btns>button>img{width:100%;height:100%;filter:var(--text-med-filter);pointer-events:none}.sudoku-note-btn{display:flex;justify-content:center;align-items:center}.sudoku-note-btn:before{content:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M20.71,7.04C21.1,6.65%2021.1,6%2020.71,5.63L18.37,3.29C18,2.9%2017.35,2.9%2016.96,3.29L15.12,5.12L18.87,8.87M3,17.25V21H6.75L17.81,9.93L14.06,6.18L3,17.25Z'%20/%3e%3c/svg%3e");display:inline;width:90%;filter:var(--text-med-filter)}.sudoku-note-btn.note-mode:before{content:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M18.66,2C18.4,2%2018.16,2.09%2017.97,2.28L16.13,4.13L19.88,7.88L21.72,6.03C22.11,5.64%2022.11,5%2021.72,4.63L19.38,2.28C19.18,2.09%2018.91,2%2018.66,2M3.28,4L2,5.28L8.5,11.75L4,16.25V20H7.75L12.25,15.5L18.72,22L20,20.72L13.5,14.25L9.75,10.5L3.28,4M15.06,5.19L11.03,9.22L14.78,12.97L18.81,8.94L15.06,5.19Z'%20/%3e%3c/svg%3e")}.sudoku-board-wrapper{display:flex;flex-direction:column;gap:1rem}.sudoku-game-options{display:flex;gap:1rem}.sudoku-game-options>button{cursor:pointer;background-color:var(--bg-low-color);border:2px solid var(--text-med-color);border-radius:10px;color:var(--text-med-color);font-family:roboto;font-size:1rem;font-weight:700;padding:.5rem 1rem}.sudoku-game-options>button:active,.sudoku-game-options>button:hover{background-color:var(--accent-color-red)}@media only screen and (max-width:800px){.sudoku-game{flex-direction:column}.sudoku-btns .num-btns{display:flex}.num-btns .sudoku-num-btn{border:none;width:initial;height:initial;padding:.3rem}.sudoku-num-btn.all-nums-placed:before{width:18px;height:100%}.sudoku-btns{flex-direction:column-reverse}}main.g2048{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;overflow-x:hidden;width:100vw;position:relative}.g2048-board{background-color:var(--text-low-color);position:relative;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);justify-content:center;align-content:center;border-radius:20px;--gap: clamp(4px, 2px + 1vw, 8px);gap:var(--gap);padding:var(--gap);--cell-width: clamp(60px, 38px + 7vw, 100px);--cell-height: clamp(60px, 38px + 7vw, 100px);--cell-border-radius: 15px}.g2048-cell{width:var(--cell-width);height:var(--cell-height);background-color:var(--bg-med-color);border-radius:var(--cell-border-radius)}html.light .g2048-cell{background-color:var(--text-low-color)}.g2048-game{display:flex;flex-direction:column;gap:1rem;align-items:center}.g2048-game .side-btns-wrapper{display:flex;gap:1rem;align-items:center}.g2048-game-wrapper{display:flex;flex-direction:column;align-items:center;gap:1rem;touch-action:none}.g2048-scores{display:flex;gap:1rem;color:var(--text-med-color)}.swipe-btn{width:100px;height:40px;cursor:pointer;background-color:var(--text-med-color);border:none;display:flex;border-radius:10px;outline:none}.swipe-btn img{pointer-events:none;filter:var(--accent-filter-red);width:100%;height:100%}.swipe-up img{transform:scaleX(1.5)}.swipe-down img{transform:rotate(180deg) scaleX(1.5)}.swipe-left,.swipe-right{width:40px;height:100px}.swipe-left img{transform:rotate(-90deg) scaleX(1.5)}.swipe-right img{transform:rotate(90deg) scaleX(1.5)}.swipe-btn:active,.swipe-btn:hover,.swipe-btn:focus{background-color:var(--text-low-color)}.g2048-game-options{position:absolute;width:fit-content;top:5%;left:10%;display:flex;flex-direction:column;gap:1rem}.g2048-game-options{display:flex;gap:1rem;align-items:center}.g2048-game-options button{cursor:pointer;background-color:var(--bg-low-color);border:2px solid var(--text-med-color);font-size:1rem;font-family:roboto;font-weight:700;padding:.5rem 1rem;border-radius:10px;color:var(--text-med-color);outline:none}.g2048-game-options button:hover,.g2048-game-options button:focus,.g2048-game-options button:active{background-color:var(--accent-color-red)}.target-btn{display:flex;flex-direction:column;gap:.2rem}.target-btn[data-target="2048"]:after{content:"2048";display:block}.target-btn[data-target="1024"]:after{content:"1024";display:block}.target-btn[data-target="512"]:after{content:"512";display:block}.g2048-scores{position:absolute;top:50%;left:10.5%;display:flex;flex-direction:column;gap:1rem}.target-num-popup{position:fixed;z-index:1;background-color:var(--bg-high-color);border-radius:10px;padding:1rem;top:20%;color:var(--text-high-color);display:flex;flex-direction:column;gap:1rem;border:2px solid var(--text-high-color)}.target-num-popup button{cursor:pointer;padding:.5rem 1rem;font-size:1rem;font-weight:700;border:none;background-color:var(--text-med-color);border-radius:10px;color:var(--bg-high-color)}.target-num-popup p{pointer-events:none;font-weight:700}.target-num-popup button:focus,.target-num-popup button:hover{background-color:var(--accent-color-red)}.target-num-popup.hidden{display:none}.g2048-scores div{font-weight:700;background-color:var(--bg-med-color);padding:.5rem 1rem;border-radius:10px}.g2048-game-options .g2048-help-btn{width:40px;padding:.1rem;display:flex}.g2048-game-options .g2048-help-btn img{filter:var(--text-med-filter);pointer-events:none}@media only screen and (max-width:1000px){.swipe-btn{display:none}.g2048-game-options{position:absolute;width:fit-content;top:5%;left:0;right:0;margin:0 auto;flex-direction:row}.g2048-scores{bottom:5%;top:initial;flex-direction:row;left:0;right:0;width:fit-content;margin:0 auto}}.g2048-tile-board{position:absolute;top:0;left:0;width:100%;height:100%;padding:.5rem}.g2048-tile{width:var(--cell-width);height:var(--cell-height);border-radius:var(--cell-border-radius);position:absolute;transition:all .1s ease-in-out}.g2048-tile[data-row="0"]{top:var(--gap)}.g2048-tile[data-row="1"]{top:calc((var(--gap) * 2) + var(--cell-height))}.g2048-tile[data-row="2"]{top:calc(50% + (var(--gap)/2))}.g2048-tile[data-row="3"]{top:calc((var(--gap) * 4) + (var(--cell-height) * 3))}.g2048-tile[data-col="0"]{left:var(--gap)}.g2048-tile[data-col="1"]{left:calc((var(--gap) * 2) + var(--cell-width))}.g2048-tile[data-col="2"]{left:calc(50% + (var(--gap)/2))}.g2048-tile[data-col="3"]{left:calc((var(--gap) * 4) + (var(--cell-width) * 3))}.g2048-tile:before{content:"";display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:calc(var(--cell-border-radius) - 2px);font-family:roboto}.g2048-tile[data-num="2"]:before{content:"2";background-color:var(--g2048-color-2);font-size:clamp(2rem,1.5rem + 3vw,3rem);font-weight:700;color:var(--g2048-text-dark);animation-name:pop-in;animation-fill-mode:backwards;animation-duration:.1s;animation-timing-function:ease-in}.g2048-tile[data-num="4"]:before{content:"4";background-color:var(--g2048-color-4);font-size:clamp(2rem,1.5rem + 3vw,3rem);font-weight:700;color:var(--g2048-text-dark)}.g2048-tile[data-num="8"]:before{content:"8";background-color:var(--g2048-color-8);font-size:clamp(2rem,1.5rem + 3vw,3rem);font-weight:700;color:var(--g2048-text-dark)}.g2048-tile[data-num="16"]:before{content:"16";background-color:var(--g2048-color-16);font-size:clamp(1.8rem,1.2rem + 3vw,2.7rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="32"]:before{content:"32";background-color:var(--g2048-color-32);font-size:clamp(1.8rem,1.2rem + 3vw,2.7rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="64"]:before{content:"64";background-color:var(--g2048-color-64);font-size:clamp(1.8rem,1.2rem + 3vw,2.7rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="128"]:before{content:"128";background-color:var(--g2048-color-128);font-size:clamp(1.6rem,1rem + 3vw,2.3rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="256"]:before{content:"256";background-color:var(--g2048-color-256);font-size:clamp(1.6rem,1rem + 3vw,2.3rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="512"]:before{content:"512";background-color:var(--g2048-color-512);font-size:clamp(1.6rem,1rem + 3vw,2.3rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="1024"]:before{content:"1024";background-color:var(--g2048-color-1024);font-size:clamp(1.3rem,.8rem + 3vw,2rem);font-weight:700;color:var(--g2048-text-light)}.g2048-tile[data-num="2048"]:before{content:"2048";background-color:var(--g2048-color-2048);font-size:clamp(1.3rem,.8rem + 3vw,2rem);font-weight:700;color:var(--g2048-text-light)}@keyframes pop-in{0%{transform:scale(0);opacity:0}80%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:1}}.g2048-rules-popup{position:absolute;left:0;right:0;width:fit-content;margin:0 auto;top:20%;z-index:1;background-color:var(--bg-high-color);color:var(--text-med-color);padding:1rem;border-radius:10px;border:2px solid var(--text-med-color)}.g2048-rules-popup :nth-child(2){font-weight:700;font-size:1.1rem;margin-bottom:1rem}.g2048-rules-popup p{margin-bottom:1rem;max-width:35ch}.g2048-rules-popup .exit-wrapper{display:flex;width:100%;justify-content:end}.exit-wrapper button{width:30px;background:none;border:none;cursor:pointer;--filter: var(--text-med-filter)}.exit-wrapper button:focus,.exit-wrapper button:hover{--filter: var(--accent-filter-red)}.exit-wrapper button img{pointer-events:none;filter:var(--filter)}.g2048-rules-popup.hidden{display:none}main.home-page{display:flex;flex-direction:column;align-items:center;gap:2rem;padding-top:4rem;padding-bottom:3rem}.site-title{font-size:clamp(1.2rem,1rem + 2vw,2rem);font-weight:700;color:var(--accent-color-red)}.page-tiles{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center}.project-link{text-decoration:none;color:var(--text-high-color);outline:none;--scale: scale(1)}.project-link:focus,.project-tile:hover{--scale: scale(1.1)}.project-tile{display:flex;flex-direction:column;background-color:var(--bg-high-color);padding:1rem;border-radius:10px;gap:1rem;border:2px solid var(--accent-color-red);transform:var(--scale);will-change:transform;transition:transform .1s linear}html.light .project-tile{box-shadow:0 2px 10px #000}.project-img-wrapper{width:clamp(220px,210px + 10vw,280px);height:clamp(220px,210px + 10vw,280px);border:2px solid var(--text-med-color);border-radius:10px;overflow:hidden}.project-img-wrapper img{width:100%;height:100%}.project-tile p{width:100%;display:flex;justify-content:center;font-weight:700;font-size:clamp(1.2rem,1rem + 1vw,2rem)}