@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap";body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f7fb}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}.App{background-color:#565add;width:100%;height:100vh;position:relative;overflow:hidden}.top{margin-left:3rem}.bottom{position:absolute;bottom:-50px;right:3rem}.ui{width:100%;display:flex;justify-content:center;position:absolute;bottom:25px}.ui-box{position:relative;width:320px}.rock_icon{position:absolute;bottom:0px;left:0;margin-bottom:30px}.paper_icon{position:absolute;bottom:0;left:40%;margin-bottom:80px}.scissors_icon{position:absolute;bottom:0;right:0;margin-bottom:30px}.random_icon{position:absolute;bottom:-65px;left:37%}.score{width:100%}.hp-box-user{position:absolute;left:-30px;bottom:35%}.hp-box-inner-user{position:relative;display:flex;flex-direction:column;align-items:center}.user_hp_avatar{position:absolute;top:9vh}.user-hp{-webkit-appearance:none;appearance:none;height:10px;transform:rotate(-90deg)}.cpu{transform:rotate(90deg)}.user-hp::-webkit-progress-bar{background-color:#232586;border-radius:7px}.user-hp::-webkit-progress-value{background-color:#ffb24c;border-radius:7px}.cpu::-webkit-progress-value{background-color:#90c67b;border-radius:7px}.user-hp::-moz-progress-bar{background-color:#232586;border-radius:7px}.user-hp::-moz-progress-value{background-color:#ffb24c;border-radius:7px}.hp-box-cpu{position:absolute!important;right:-30px;top:20%}.cpu_hp_avatar{position:absolute;bottom:9vh}.result{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100vh}.result-msg{font-weight:700;font-size:21px;color:#ffb24c;line-height:25px;margin-top:2rem}.result-score{font-weight:500;font-size:41px;color:#fff;line-height:49px;margin-bottom:2rem}.splash{background-image:url(src/assets/img/splash_bg.svg);height:100vh;background-repeat:no-repeat;background-position:center;background-size:contain;display:flex;align-items:flex-end;justify-content:center;background-color:#f5f7fb}.splash button{border:none;outline:none;background:#f1aa83;border-radius:20px;font-weight:700;font-size:20px;line-height:19px;text-transform:uppercase;color:#b67c62;width:196px;height:53px;margin-bottom:10rem;box-shadow:0 6px #ea9975}.splash button:hover{box-shadow:initial}@media screen and (max-width: 600px){.splash{background-size:cover}}@media screen and (max-height: 700px){.splash button{margin-bottom:5rem;width:calc(196px - 10%);height:43px}.rock_icon,.scissors_icon{margin-bottom:25px}.bottom img{width:90%}.top img{width:45%}.user_hp_avatar{top:12vh}.cpu_hp_avatar{bottom:12vh}.rock_icon{left:50px}.scissors_icon{right:40px}}*{margin:0;padding:0;box-sizing:border-box;font-family:poppins,sans-serif}.App{background-color:#333;width:100%;height:100vh;position:relative;overflow:hidden}.wrapper{margin-top:20rem;display:flex;justify-content:center;align-items:center;text-align:center}.wrapper .static-txt{color:#fff;font-size:60px;font-weight:400}.wrapper .dynamic-txts{margin-left:15px;line-height:90px;height:90px;overflow:hidden}.dynamic-txts li{list-style:none;color:#ff4c29;font-size:60px;font-weight:500;top:0;position:relative;animation:slide 12s steps(4) infinite}@keyframes slide{to{top:-360px}}.dynamic-txts li{position:relative}.dynamic-txts li:after{content:"";position:absolute;left:0;height:100%;width:100%;background-color:#082032;border-left:2px solid #ff4c29;animation:typing 3s steps(10) 4}@keyframes typing{40%,60%{left:calc(100% + 30px)}to{left:0}}.title{-webkit-text-stroke:.1vmin var(--controls-color);font-size:6rem;font-weight:700;color:transparent;background:linear-gradient(40deg,var(--controls),var(--controls-secondary));-webkit-background-clip:text;background-clip:text;text-align:center;display:inline-block;line-height:.75;margin:0 0 4rem;padding:0;transform:rotate(-15deg)}.title span{display:block}.title span:nth-of-type(2){transform:translateY(-10%) rotate(15deg);color:var(--controls)}.hole{fill:#1f1f1f}.hole__lip{fill:#998666}.mole__feature{fill:#1a1a1a}.mole__eyes--crossed,.mole__mole{display:none}.specs__lens{fill:hsla(198,80%,calc((80 - (var(--shades, 0) * 75)) * 1%),calc(.5 + (var(--shades, 0) * .5)));stroke:hsl(var(--accent),25%,calc((30 - (var(--shades, 0) * 30)) * 1%))}.cap__accent{fill:hsl(var(--accent, 10),80%,50%)}.cap__body{fill:#0d0d0d}.specs__glare{fill:hsla(0,0%,100%,calc(.5 + (var(--shades, 0) * .25)))}.specs__bridge{stroke:hsl(var(--accent),25%,calc((30 - (var(--shades, 0) * 30)) * 1%))}.mole__hole{width:20vmin;height:20vmin;position:relative;cursor:none}.mole__hole *{cursor:none}.mole__body{fill:hsl(var(--hue),calc((10 + (var(--golden, 0) * 40)) * 1%),calc(var(--lightness, 65) * 1%))}.mole__white{fill:hsl(40,80%,calc((98 - (var(--golden, 0) * 15)) * 1%))}.mole__whiskers{stroke:hsl(40,calc((0 + (var(--golden, 0) * 35)) * 1%),calc((5 + (var(--golden, 0) * 40)) * 1%))}.mole__shadow{fill:hsl(var(--hue),16%,43%)}.mole__nose{fill:hsl(calc(10 + (var(--golden, 0) * 30)),90%,calc((88 - (var(--golden, 0) * 35)) * 1%))}.mole{position:absolute;height:100%;width:100%}.mole__whack{height:100%;width:100%;border:0;opacity:0;transform:translate(0);position:absolute;top:0;left:0}.mole__points-holder{position:absolute;transform:rotate(calc(var(--angle, 0) * 1deg));transform-origin:50% 200%;pointer-events:none;position:fixed;z-index:10}.mole__points{font-size:clamp(2rem,8vmin,18rem);pointer-events:none;font-weight:700;color:hsl(var(--accent, 0),90%,75%);margin:0;transform:translate(-50%,-200%);-webkit-text-stroke:.1vmin hsl(var(--accent),50%,35%)}.hiscore{text-transform:uppercase;position:fixed;top:1rem;left:1rem;z-index:2}.mallet{height:0;width:0;pointer-events:none;position:fixed;top:calc(var(--y) * 1px);left:calc(var(--x) * 1px);z-index:10;transform:translate(-50%,-50%);display:none}.mallet img{position:absolute;bottom:0;height:18vmin;transform-origin:75% 85%;pointer-events:none}@media (hover: none){.mallet img{display:none}}.main{width:45vw;height:80vh;background-color:#f5f5f5;margin:0 auto;border-radius:5px;display:flex;align-items:center;justify-content:center;flex-direction:column}.dice-container{display:grid;grid-template:auto auto / repeat(5,1fr);gap:20px;margin-bottom:35px}.dice{height:60px;width:60px;box-shadow:0 2px 2px #00000026;display:flex;align-items:center;justify-content:center;border-radius:10px;cursor:pointer;background-color:#fff}.die-num{font-size:2rem}.roll-btn{height:50px;width:150px;border:none;border-radius:6px;background-color:#5035ff;color:#fff;font-size:1.2rem;font-family:Karla,sans-serif;cursor:pointer}.roll-btn:active{box-shadow:inset 5px 5px 10px -3px #000000b3}.title{font-size:40px;margin-bottom:10px}.instructions{font-family:Inter,sans-serif;font-weight:400;margin-top:0;text-align:center;margin-bottom:30px}:root{--controls: hsl(38, 96%, calc((55 + var(--lightness, 0)) * 1%));--controls-secondary: hsl(337, 100%, 50%);--controls-color: hsl(0, 0%, 100%);--sky: hsl(204, 80%, 80%);--grass: hsl(98, 40%, 50%);--dirt: hsl(350, 39%, 20%)}*{box-sizing:border-box}body{min-height:100vh;align-items:center;justify-content:center;overflow:hidden;font-family:Fredoka One,cursive;background:var(--sky)}.moles{display:inline-grid;grid-template-rows:repeat(2,auto);grid-template-columns:repeat(3,auto);grid-gap:0 2vmin;cursor:none}.moles>*:nth-of-type(4),.moles>*:nth-of-type(5){transform:translate(50%,-25%)}main{height:100vh;width:100vw;display:grid;place-items:center;background:linear-gradient(var(--sky) 0 44%,var(--grass) 44%)}button{--controls: hsl(38, 96%, calc((55 + var(--lightness, 0)) * 1%));background:var(--controls);color:var(--controls-color);padding:1rem 2rem;font-family:Fredoka One,cursive;font-weight:700;font-size:1.75rem;border-radius:1rem;border:4px var(--controls-color) solid;white-space:nowrap;cursor:pointer}button:hover{--lightness: 5}button:active{--lightness: -15}.celebration{font-size:4rem;line-height:1;margin:0;padding:0;text-transform:uppercase;text-align:center}.word{display:inline-block;white-space:nowrap}.celebration .char{display:inline-block;color:hsl(calc((360 / var(--char-total)) * var(--char-index)),70%,65%);animation:jump .35s calc(var(--char-index, 0) * -1s) infinite}.countdown-number{font-size:10rem;color:var(--dirt);-webkit-text-stroke:.25rem var(--controls-color);position:fixed;top:50%;left:50%;z-index:12;margin:0;padding:0;transform:translate(-50%,-50%);display:"none"}@keyframes jump{50%{transform:translateY(-25%)}}.icon-button{height:48px;width:48px;outline:transparent;background:none;border:0;display:grid;place-items:center;padding:0;margin:0}.mute-button{position:fixed;bottom:0;right:0;z-index:2}.mute-button:hover~.mallet,.end-button:hover~.mallet{display:none}.end-button{position:fixed;top:0;right:0;z-index:2}.game-info{position:fixed;top:1rem;left:1rem;display:grid;grid-template-columns:repeat(2,auto);grid-template-rows:repeat(2,auto);align-items:center;grid-gap:.5rem 1rem;z-index:2;background:var(--controls-color);border:4px solid var(--controls);border-radius:1rem;padding:1rem;width:190px}.info-screen{z-index:2;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;flex-direction:column}.results{background:var(--controls-color);padding:2rem;border:4px solid var(--controls);border-radius:1rem}.info-screen>*+*{margin-top:1rem}.icon{fill:#383838;stroke-width:20px;overflow:visible;height:24px;width:24px}@media (min-width: 768px){.end-button{top:1rem;right:1rem}.mute-button{bottom:1rem;right:1rem}.icon{height:48px;width:48px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.info__text{font-size:clamp(1rem,5vmin,2rem);line-height:1;color:var(--dirt);margin:0}.boring-text{font-size:2rem;text-align:center}.footer{position:fixed;bottom:0;margin:10px}.footer-container{display:flex;justify-content:center;align-items:center;background-color:#f2f2f254;padding:7px;backdrop-filter:blur(10px);border-radius:10px;z-index:111111}.github a,.website a{display:flex;align-items:center;margin-right:10px;color:#000}.github svg,.website img{width:23px;height:23px;margin-right:5px}p{margin:0;font-size:16px;font-weight:700}