.screen,.screen__background,.screen__foreground{position:absolute;border-radius:4%;overflow:hidden}.screen__background,.screen__foreground{width:100%;height:100%}.screen__background--credits{background-image:url(/assets/background-credits-C1KCXDT6.webp);background-position:center;background-size:cover}.screen__credits-message{display:block;padding-right:4%;padding-top:22%;font-family:PressStart2p,monospace;font-weight:700;text-align:right;text-transform:uppercase;font-size:8px;line-height:2;color:#fff}.screen__credits-link{color:#ff0}@media (max-width: 375px){.screen__credits-message{font-size:6.5px}}.screen__background--disclaimer{background:#0a0a0a}.screen__disclaimer{padding:5%}.screen__disclaimer-message{font-family:PressStart2P,monospace;display:inline-block;text-align:justify;line-height:2;color:#fff;font-size:clamp(.44rem,1vw,.5rem);text-transform:uppercase;opacity:0;animation:fadeIn 1s ease-in forwards,fadeOut 1s ease-in 5.5s forwards}@keyframes fadeIn{to{opacity:100%}}@keyframes fadeOut{to{opacity:0%}}.screen__hud{display:flex;flex-direction:row;justify-content:space-between;align-items:baseline;position:absolute;width:100%;height:100%;padding-top:2%}.screen__hud-lives,.screen__hud-coins{display:flex;align-items:center;width:fit-content}.screen__hud-lives{padding-left:2%}.screen__hud-coins{justify-content:end;padding-right:2%}.screen__hud-life-icon,.screen__hud-coin-icon,.screen__hud-multiply-icon{display:block}.screen__hud-life-icon,.screen__hud-coin-icon{margin-right:2%}.screen__hud-life-icon{width:13%}.screen__hud-coin-icon{width:11.5%}.screen__hud-multiply-icon{width:10%;margin-right:3%}.screen__hud-number{font-family:PressStart2p,monospace;-webkit-text-stroke-color:black;-webkit-text-stroke-width:1.25px;font-size:.9em;color:#fff;margin-top:1%}@media (max-width: 410px){.screen__hud-number{-webkit-text-stroke-width:1px;font-size:.75em}}.screen__hud-mario-death{position:absolute;top:0;left:0;width:10%;animation:fall 3s linear .5s forwards}@keyframes fall{0%{transform:translateY(0)}to{transform:translateY(1000%)}}.screen__menu{display:flex;height:100%;flex-direction:column;justify-content:space-around;align-items:center}.screen__menu-logo{width:90%}.screen__menu-mario{width:17%}.screen__menu-start{position:relative;top:-5%;font-family:PressStart2p,monospace;font-size:12px;text-transform:uppercase;text-align:center;animation:blink linear infinite 1.5s}@keyframes blink{0%{opacity:100%}to{opacity:0%}}@media (max-width: 374px){.screen__menu-start{font-size:10.5px}}.screen__background--off{background:linear-gradient(180deg,#131313,#000)}.screen__background--menu:before,.screen__background--menu:after,.screen__background--tutorial:before,.screen__background--tutorial:after,.screen__background--overworld:before,.screen__background--overworld:after{content:"";position:absolute;top:0;left:0;width:200%;height:100%;background-repeat:repeat-x;background-size:auto 100%;animation:scroll 8s linear infinite}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-100%)}}.screen__background--menu:after,.screen__background--tutorial:after,.screen__background--overworld:after{left:100%}.screen__background--menu:before,.screen__background--menu:after{background-image:url(/assets/background-menu-CXGS56sX.webp)}.screen__background--tutorial:before,.screen__background--tutorial:after{background-image:url(/assets/background-tutorial-CbhhvZaa.webp)}.screen__background--overworld:before,.screen__background--overworld:after{background-image:url(/assets/background-overworld-C9KSnzep.webp)}.screen__background.paused:before,.screen__background.paused:after{animation-play-state:paused}.screen__background--startup{background-size:cover;background-repeat:no-repeat;background-position:center}.screen__transition{position:absolute;border-radius:4%;width:100%;height:100%;overflow:hidden;pointer-events:none}.screen__transition--fade,.screen__transition--overlay,.screen__transition--slide:before,.screen__transition--close-curtain:before,.screen__transition--open-curtain:before{background:#0a0a0a}.screen__transition--fade,.screen__transition--overlay,.screen__transition--close-curtain{display:flex;justify-content:center;align-items:center}.screen__transition--fade{animation-name:fadeIn;animation-timing-function:ease-in;animation-fill-mode:forwards;opacity:0}@keyframes fadeIn{to{opacity:1}}.screen__transition--overlay{animation-name:fadeOut;animation-timing-function:ease-in;animation-fill-mode:forwards;opacity:1}@keyframes fadeOut{to{opacity:0}}.screen__transition--slide:before{content:"";position:absolute;left:0;width:100%;height:100%;transform:translate(-100%);animation:slideIn 1s linear forwards}@keyframes slideIn{0%{transform:translate(-100%)}to{transform:translate(0)}}.screen__transition--close-curtain:before{content:"";position:absolute;left:0;width:100%;height:100%;transform:translateY(-100%);animation:closeCurtain 2s linear forwards}@keyframes closeCurtain{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.screen__transition--open-curtain:before{content:"";position:absolute;left:0;width:100%;height:100%;transform:translateY(0);animation:openCurtain 3.75s linear forwards}@keyframes openCurtain{0%{transform:translateY(0)}to{transform:translateY(-100%)}}.screen__transition-text{font-size:.7em;text-transform:uppercase;font-family:PressStart2p,monospace;position:relative;bottom:2%;color:#ff0}@media (max-width: 375px){.screen__transition-text{font-size:.5em}}@media (max-width: 410px){.screen__level-start-title{font-size:.6em}}.screen__tutorial{background:#0a0a0a;width:85%;margin:0 auto;position:relative;padding:2% 4% 2.3%;top:4%}.screen__tutorial-message{display:inline-block;text-align:justify;line-height:1.6;font-family:PressStart2p,monospace;color:#fff;font-size:10px}@media (max-width: 375px){.screen__tutorial-message{font-size:8px}}.button{aspect-ratio:1 /1;filter:drop-shadow(0 .2em .2em rgba(0,0,0,.4))}.button,.button__shadow,.button__light,.button__surface,.button__label{position:absolute;border-radius:50%}.button__light,.button__shadow,.button__surface,.button__label{width:84.5%;height:84.5%}.button__light{left:5%;top:5%;background:#bbaa85}.button__light--pressed{background:#9e9071}.button__shadow{left:10%;top:10%;background:#261000}.button__surface{font-size:clamp(12px,50%,29.4px);left:7.5%;top:7.5%;background:#4c4b50;display:flex;justify-content:center;align-items:center;font-family:Inter,sans-serif;color:#2d2f2f;text-shadow:-.015em -.015em 0 #252626,.015em -.015em 0 #252626,-.015em .015em 0 #252626,.015em .015em 0 #252626}.button__surface--pressed{box-shadow:inset .08em .08em .5em #00000087;stroke:#252626}html,body{margin:0;padding:0;height:100%;overflow:hidden}html,body,button,img{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation}#root{display:flex;justify-content:center;align-items:center;height:var(--window-height, 100vh)}body{background-color:#1a1a1a;background-image:repeating-linear-gradient(to right,#303030 0px,#303030 1px,transparent 1px,transparent 25px),repeating-linear-gradient(to bottom,#303030 0px,#303030 1px,transparent 1px,transparent 25px)}h1{margin:0}button{all:unset;cursor:pointer}p{all:unset}@font-face{font-family:PressStart2P;src:url(/fonts/press-start-2p.woff2) format("woff2");font-display:swap}@font-face{font-family:Inter;src:url(/fonts/inter.woff2) format("woff2");font-display:swap}.dpad{position:absolute;aspect-ratio:1 / 1;filter:drop-shadow(0px 0px 9.5px rgba(0,0,0,.5))}.dpad__surface,.dpad__shadow,.dpad__light{position:absolute;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr;grid-template-areas:". up ." "left center right" ". down .";width:100%;height:100%}.dpad__button{background:#4c4b50}.dpad__shadow{top:1.5%;left:1.5%}.dpad__shadow--up-pressed{top:4.5%;left:0}.dpad__shadow--left-pressed{top:0;left:3.5%}.dpad__shadow--right-pressed{top:0;left:-3.5%}.dpad__shadow--down-pressed{left:0;top:-4.5%}.dpad__light{top:-1.5%;left:-1.5%}.dpad__light--up-pressed,.dpad__light--left-pressed,.dpad__light--right-pressed,.dpad__light--down-pressed{display:none}.dpad__shadow-offset{background:#261000}.dpad__light-offset{background:#bbaa85}.dpad__button--up,.dpad__shadow-offset--up,.dpad__light-offset--up{grid-area:up;border-radius:8% 8% 0 0}.dpad__button--left,.dpad__shadow-offset--left,.dpad__light-offset--left{grid-area:left;border-radius:8% 0 0 8%}.dpad__button--center,.dpad__shadow-offset--center,.dpad__light-offset--center{grid-area:center}.dpad__button--right,.dpad__shadow-offset--right,.dpad__light-offset--right{grid-area:right;border-radius:0 8% 8% 0}.dpad__button--down,.dpad__shadow-offset--down,.dpad__light-offset--down{grid-area:down;border-radius:0 0 8% 8%}.gameboy{position:relative;display:flex;justify-content:center;align-self:center;aspect-ratio:430 / 932;height:100%}@media (min-width: 1200px){.gameboy{max-height:932px}}.panel{box-sizing:border-box;display:flex;flex-flow:column;justify-content:space-between;align-self:center;width:33%;height:100%;font-family:Inter,sans-serif;font-size:16px;color:#fff}.panel__text{width:95%;max-width:350px;line-height:1.3}.panel__text-title{margin-bottom:5px}.panel__text-link{font-weight:700;color:#fff}.panel__controls-table{width:200px;text-align:left;line-height:1.5}@media (max-width: 1200px){.panel{display:none}}.light{position:absolute;aspect-ratio:1 / 1;background:linear-gradient(180deg,#121212,#3f3f3f)}.light--power-on{background:linear-gradient(180deg,#d01500,#cd9209);box-shadow:0 0 4px 1px #ce5b05a8}.screen__canvas{position:absolute;border-radius:4%;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}.gameboy__shell{width:100%;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}.preloader{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;width:100vw;background:#000}.preloader__text{color:#fff;font-family:monospace;margin-bottom:10px}.preloader__bar{width:300px;height:20px;border:1px solid #ccc;border-radius:10px;overflow:hidden;background-color:#eee}.preloader__bar-fill{height:100%;background-color:#4caf50;transition:width .2s}.container{width:100%;height:95%;display:flex;justify-content:space-around}.column{width:33%}@media (max-width: 1200px){.container{flex-direction:column;justify-content:center}.column{display:none}}
