:root{--mid-gray: #dfe4ea;--mid-dark-gray: rgb(164, 176, 190);--dark-gray: rgb(47, 53, 66);--light-gray: #f1f2f6;--white: #fff;--black: #000;--text: #2f3542;--brand: #0652DD;--red: #ff5e57;--brand-dark: #3c40c6;--sale: #70a1ff;--purchase: #ff7f50;--green: #2ed573;--width: auto;--popover-shadow: 0px 0px 10px 1px rgba(164, 176, 190, .69);--gold: #eccc68;--orange: #ffa502}@font-face{font-family:Open Sauce;src:url(../../../fonts/Manrope-VariableFont_wght.ttf) format("truetype");font-weight:1 1000}body,html{margin:0;padding:0;font-family:Open Sauce,sans-serif;font-size:1rem;line-height:1.5;color:#333;background-color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%;overflow-x:hidden;font-weight:600!important}h1{font-size:1.2rem}.columns{display:flex;flex-direction:row}.form-field{display:flex;flex-direction:column-reverse}.form-field label{margin-top:2rem;font-weight:500;transition:color .13s ease;padding-bottom:1rem;font-weight:600}.form-field>input{outline:none;padding:.75rem 1rem;font-size:1rem;font-family:Josefin Sans,sans-serif;color:var(--text);background-color:var(--light-gray);transition:all .2s ease;border-radius:.25rem;position:relative;overflow:hidden;border:none;box-shadow:inset 0 -503px 0 -500px var(--mid-dark-gray)}.form-field>input.rounded{border-radius:2rem}.form-field>input:focus{border-color:var(--light-gray);box-shadow:inset 0 -503px 0 -500px var(--brand)}.form-field>input:focus+label{color:var(--brand)}.form-field__error{padding-top:.5rem;padding-bottom:.5rem;padding-left:1rem;font-size:.8rem;height:1rem;color:var(--red);display:block}.create{cursor:pointer;display:flex;align-items:center;color:var(--white);position:fixed;right:1rem;bottom:1rem;padding:var(--padding);border-radius:10px;background-color:var(--brand)}.badge{padding:.25rem .5rem;border-radius:1rem;width:max-content}.badge--success{background-color:var(--green);color:var(--white)}.padding-xs{padding:.5rem}.padding-sm{padding:1rem}.padding-m{padding:2rem}.padding-l{padding:4rem}.padding-h-xs{padding:0 .5rem}.padding-h-sm{padding:0 1rem}.padding-h-m{padding:0 2rem}.padding-h-lg{padding:0 4rem}.padding-v-xs{padding:.5rem 0}.padding-v-sm{padding:1rem 0}.padding-v-m{padding:2rem 0}.padding-v-lg{padding:4rem 0}.padding-t-xs{padding-top:.5rem}.padding-t-sm{padding-top:1rem}.padding-t-m{padding-top:2rem}.padding-t-lg{padding-top:4rem}.padding-b-xs{padding-bottom:.5rem}.padding-b-sm{padding-bottom:1rem}.padding-b-m{padding-bottom:2rem}.padding-b-lg{padding-bottom:4rem}.padding-l-xs{padding-left:.5rem}.padding-l-sm{padding-left:1rem}.padding-l-m{padding-left:2rem}.padding-l-lg{padding-left:4rem}.padding-r-xs{padding-right:.5rem}.padding-r-sm{padding-right:1rem}.padding-r-m{padding-right:2rem}.padding-r-lg{padding-right:4rem}.margin-h-sm{margin:0 1rem}.margin-h-m{margin:0 2rem}.margin-h-lg{margin:0 4rem}.margin-v-sm{margin:1rem 0}.margin-v-m{margin:2rem 0}.margin-v-lg{margin:4rem 0}.margin-t-sm{margin-top:1rem}.margin-t-m{margin-top:2rem}.margin-t-lg{margin-top:4rem}.margin-b-sm{margin-bottom:1rem}.margin-b-m{margin-bottom:2rem}.margin-b-lg{margin-bottom:4rem}.margin-l-sm{margin-left:1rem}.margin-l-m{margin-left:2rem}.margin-l-lg{margin-left:4rem}.margin-r-sm{margin-right:1rem}.margin-r-m{margin-right:2rem}.margin-r-lg{margin-right:4rem}.page{min-height:100vh;display:flex;flex-direction:column}.page__header{padding:1rem;display:flex;justify-content:flex-start;flex-direction:row;align-items:center}.page__body{padding:1rem}.searchbar{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;width:100%;margin-bottom:1rem}.searchbar input{width:50%;padding:.5rem;border-radius:.25rem;border:2px solid var(--mid-gray);box-sizing:border-box;font-size:1rem;outline:none;color:var(--text)}.card-container{display:flex;flex-wrap:wrap;align-items:center}.card{border:2px solid var(--mid-gray);box-sizing:border-box;padding:1rem;border-radius:1rem;margin:1rem 0}.card__header{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.disabled{opacity:.8;pointer-events:none}.inout-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;height:100%;padding:1rem;box-sizing:border-box}.inout-container__left,.inout-container__right{flex:1 1;height:100%;background-color:var(--background);border-radius:10px;border:2px solid var(--mid-gray);padding:1rem;box-sizing:border-box}.inout-container__left .input:not(:first-child),.inout-container__right .input:not(:first-child){border-top:2px solid var(--mid-gray);margin-top:1rem}.inout-container__center{width:25%;height:100%;background-color:var(--background);border-radius:10px;margin:0 1rem;display:flex;flex-direction:row;justify-content:center}.hint{margin-top:-1.25rem;margin-bottom:1rem;padding-top:-.5rem;font-size:.8rem;color:var(--mid-dark-gray)}.game-badge{padding:.5rem 2rem .5rem 1rem;border:2px solid var(--mid-dark-gray);border-radius:1rem;color:var(--dak-gray);font-weight:700;font-size:.75rem;position:relative}.game-badge:after{position:absolute;right:.75rem;top:.85rem;height:.5rem;width:.5rem;border-radius:.75rem;background-color:var(--red);content:""}.game-badge:not(.game-badge--inactive):after{background-color:var(--green)}.game-badge:not(.game-badge--inactive):before{position:absolute;right:.75rem;top:.85rem;height:.5rem;width:.5rem;border-radius:.75rem;background-color:var(--green);content:"";animation:pulse 2s infinite}.bottom-button-navigation{display:flex;flex-direction:row;justify-content:space-between;position:fixed;bottom:0;left:0;width:calc(100% - 2rem);box-sizing:border-box;margin:0rem 1rem 1em;-webkit-backface-visibility:hidden;box-shadow:var(--popover-shadow);border-radius:1rem;background-color:var(--white)}.clickable{cursor:pointer}.color--danger{color:var(--red)}.color--brand{color:var(--brand)}.text--bold{font-weight:700}.text--small{font-size:.75rem}.text--medium{font-size:1rem}.text--large{font-size:1.25rem}.text--lighter{color:var(--mid-dark-gray)}.text--light{color:var(--mid-gray)}.badge{padding:.25rem .5rem;border:2px solid var(--mid-gray);border-radius:1rem;width:max-content;font-size:.75rem}.badge--success{background-color:var(--green);color:var(--white);border:2px solid transparent}.badge--brand{background-color:var(--brand);color:var(--white);border:2px solid transparent}.badge--danger{background-color:var(--red);color:var(--white);border:2px solid transparent}.badge--warning{background-color:var(--orange);color:var(--white);border:2px solid transparent}.badge--sale{background-color:var(--sale);color:#fff;border:2px solid transparent}.badge--purchase{background-color:var(--purchase);color:#fff;border:2px solid transparent}.flex{display:flex}.flex--row{flex-direction:row}.flex--column{flex-direction:column}.update-splash{position:absolute;top:0;left:0;z-index:400;height:100%;width:100%;color:var(--white);text-transform:capitalize;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:3rem;transition:opacity .2s ease-in-out;pointer-events:none;opacity:0}.update-splash h3{font-size:1.5rem}.update-splash--success{background-color:var(--green)}.update-splash--fail{background-color:var(--red)}.update-splash.active{opacity:1;pointer-events:all}.floating-action{position:fixed;bottom:1rem;width:calc(100% - 2rem);left:1rem;box-shadow:var(--popover-shadow);border-radius:1rem;box-sizing:border-box;background-color:var(--white)}.header{display:flex;flex-direction:row;background-color:var(--light-gray);border-radius:5rem;margin:auto;height:max-content;justify-content:space-between;padding:.5rem}.header__item{display:flex;flex-direction:column;justify-content:center;text-align:center;position:relative;text-decoration:none;font-weight:600;color:var(--dark-gray);text-transform:capitalize;padding:.75rem}.header__item:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);height:.25rem;width:1rem;border-radius:1rem;background-color:var(--brand);opacity:0;transition:opacity .2s ease-in-out}.header__item--highlighted{background-color:var(--brand);color:var(--white);border-radius:5rem;padding:.75rem}.header__item.active{color:var(--brand)}.header__item.active:after{opacity:1}.empty-splash{padding:8rem 1rem 0;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;box-sizing:border-box;text-align:center}
