:root{font-family:system-ui,Jost;color-scheme:light dark;color:#fff;background-color:#0d0d0d;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{height:100%;margin:0;padding:0;font-family:Jost,"M PLUS Rounded 1c",sans-serif}#root{height:100vh;min-width:325px;max-width:18.5vw;margin:10px auto;display:flex;flex-direction:column;overflow:hidden;-webkit-user-select:none;-ms-user-select:none;user-select:none;--green-primary: hsl(95, 50%, 35%);--green-dark: hsl(95, 50%, 20%);--black-primary: hsl(0, 0%, 5%);--gray-primary: hsl(0, 0%, 40%)}.page-fade{opacity:1;transition:opacity .25s}.page-fade-hidden{opacity:0;pointer-events:none}.guess-fade{opacity:1;transition:opacity .25s}.guess-fade-hidden{opacity:0;pointer-events:none}@keyframes shake{0%{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}to{transform:translate(0)}}.shake{animation:shake .25s}button{all:unset;cursor:pointer}input{all:unset;caret-color:var(--gray-primary)}input::placeholder{color:var(--gray-primary);opacity:1}input::-webkit-input-placeholder,input::-moz-placeholder,input:-ms-input-placeholder,input:-moz-placeholder{color:var(--gray-primary)}.break{border-bottom:white 2px solid;width:100%}.main-container{display:flex;flex-direction:column;flex:1;height:100%;overflow:hidden}.title{display:flex;align-items:center;justify-content:center;text-align:center;font-size:clamp(50px,3vw,100px);font-weight:700;height:10%}.game,.help,.stats{flex:1;display:flex;flex-direction:column;width:100%;height:80%}.product-display{flex:none;display:flex;flex-direction:column;align-items:center;background-color:var(--green-primary);margin:10px;padding:10px;border-radius:10px;height:45%}.product-image{display:flex;overflow:hidden;justify-content:center;align-items:center;width:100%;height:77.5%;margin-bottom:10px;border-radius:10px;background-color:#fff;flex-shrink:0}.product-image img{width:85%;height:90%;object-fit:contain;display:block}.product-name{display:flex;justify-content:center;align-items:center;width:90%;height:18%;flex-shrink:0;text-align:center}.product-name h1,.product-name h1 span{font-size:clamp(17.5px,.75vw,35px);font-weight:700;text-align:center;width:100%;line-height:.95}.game-info{display:flex;flex-direction:column;justify-content:center;font-size:clamp(15px,1vw,25px);font-weight:700;line-height:1.2;text-align:center;width:100%;height:10vh}.guess-container{flex:none;justify-content:center;overflow-y:auto;display:flex;flex-direction:column;align-items:center;width:100%;height:35%;padding:5px 0}.guess-entry,.guess-entry-empty{display:flex;align-items:center;width:100%;height:100%;margin:3px 0;gap:5px}.guess-entry .price,.guess-entry .hint{background-color:var(--green-primary);border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;height:100%;line-height:100%;overflow:hidden;white-space:nowrap;color:#fff}.guess-entry-empty{background-color:var(--gray-primary);border-radius:10px}.guess-entry .price{width:75%;font-size:2vh}.hint{width:25%}.hint.win,.hint.perfect{background-color:#218c29}.hint.near{background-color:#bfa900}.hint.far{background-color:#b22222}.hint.perfect{background-color:#2070df}.input-container,.share-button{display:flex;align-items:center;justify-content:center;width:95%;height:10%;gap:5px;box-sizing:border-box;margin:5px auto 0}.input-field,.input-button{display:flex;align-items:center;justify-content:center;text-align:center;border-radius:10px;font-size:clamp(12px,.75vw,25px);font-weight:700;height:100%}.input-field{width:60%;background-color:#fff;color:var(--black-primary)}.input-button{width:40%;background-color:var(--green-primary);color:#fff;box-shadow:inset 0 0 0 2.5px #fff}.input-button:active,.share-button:active{transform:scale(.95)}.share-button{background-color:var(--green-primary);color:#fff;border-radius:10px;font-size:clamp(14px,1vw,25px);font-weight:700;box-shadow:inset 0 0 0 2.5px #fff}.share-button i{margin-left:10px}.help p{font-size:1.95vh;line-height:2vh;margin:.5vh 0;text-align:center}.help .hint-container{display:flex;gap:5vh;justify-content:center;align-items:center;height:5vh;margin:1.5vh 0}.help .hint{display:inline-flex;justify-content:center;align-items:center;text-align:center;height:4vh;border-radius:10px}.stats h2{font-size:2.25vh;font-weight:700;margin:1vh 0;text-align:center;justify-content:center;display:flex}.stats .stats-container,.stats .stats-distribution{display:flex;flex-direction:column;align-items:center;width:100%}.stats .stats-container{height:35vh;margin-bottom:2vh}.stats .stats-distribution{height:25vh}.stats .stat-item{display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:1.5vh;border-radius:10px;background-color:var(--green-primary);width:75%;height:14%;margin:.5vh;box-sizing:border-box;overflow:hidden;line-height:2vh;text-align:center;flex-shrink:0}.stats .stat-item .stat-label{font-weight:700;font-size:1.75vh}.stats .stats-distribution{margin-top:1vh}.stats .bar-item{display:flex;align-items:center;width:75%;height:10%;margin:1vh 0;box-sizing:border-box}.stats .bar-item .bar-label{font-weight:700;font-size:2vh}.stats .bar-item .bar-fill{width:100%;height:100%;border-radius:10px;background-color:var(--green-primary);margin-left:2vh;font-size:2vh}.stats .bar-item .bar-value{justify-content:right;margin-left:1.5vh;margin-right:.75vh}.stats .bar-item .bar-label,.stats .bar-item .bar-value{display:flex;align-items:center;height:100%}.bottom-bar{display:flex;flex-direction:column;align-items:center;margin:20px;font-size:10px;color:var(--gray-primary);height:10%}.bottom-bar .button-container{display:flex;justify-content:center;gap:20px;font-size:25px;color:#fff;margin-bottom:5px}.bottom-bar button:hover{transform:scale(1.25);transition:transform .2s}.bottom-bar .credits{display:flex;text-align:center;line-height:10px}
