html{font-size:16px;box-sizing:border-box}body{font-family:"Arial",sans-serif;background-color:#424242;margin:0;padding:0}#app{overflow:hidden;width:100vw;height:100vh}.instruction{font-size:2rem}.header{position:fixed;width:100%;padding-top:1rem;padding-bottom:1rem;background-color:#000;margin-top:0;transition:all .5s ease-in-out}.header.hidden{margin-top:-6rem}.header-first{z-index:10;width:100%}.header-second{z-index:9;margin-top:5rem;background-color:#303030}.content{position:relative;padding:2rem 0}.ingredients-chosen,.dish-types-chosen{display:grid;grid-template-columns:auto auto auto auto auto;grid-gap:1rem;justify-content:center}.ingredients-chosen .ingredient,.ingredients-chosen .dish-type,.dish-types-chosen .ingredient,.dish-types-chosen .dish-type{border-color:#fff;border-style:solid}.ingredients-chosen .ingredient.is-empty,.ingredients-chosen .dish-type.is-empty,.dish-types-chosen .ingredient.is-empty,.dish-types-chosen .dish-type.is-empty{border-style:dashed;border-color:#fff}.dish-types-chosen{grid-template-columns:auto}.ingredients,.dish-types,.generating-title{position:absolute;left:0;right:0;top:6rem;display:grid;grid-template-columns:auto auto auto auto auto;grid-gap:1rem;justify-content:center;transition:all 1.5s ease-in-out}.ingredients.hidden,.dish-types.hidden,.generating-title.hidden{top:-40rem}.dish-types{top:11rem}.generating-title{top:11rem;grid-template-columns:auto;color:#fff;padding:2rem;font-size:1.2rem;text-align:center}.ingredient,.dish-type{z-index:0;display:inline-block;text-align:center;border-radius:50%;font-size:2rem;line-height:3rem;width:3rem;height:3rem;border:2px solid #000;cursor:pointer;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:all .2s cubic-bezier(0, 1, 1, 1)}.ingredient .label-first-letter,.dish-type .label-first-letter{pointer-events:none}.ingredient .label,.dish-type .label{position:absolute;top:0;left:0;z-index:1;font-size:1rem;line-height:1rem;display:none;border:2px solid #000;background-color:#fff;padding:.5rem 1rem;border-radius:1rem;white-space:nowrap}.ingredient .label .tip,.dish-type .label .tip{position:absolute;top:calc(-0.5rem + 1.5px);left:calc(50% - .5rem + 1px);width:.5rem;height:.5rem;background-color:#fff;border:2px solid #000;border-right:0;border-bottom:0;rotate:45deg}.ingredient:focus,.dish-type:focus{outline:none !important}.ingredient.is-active,.dish-type.is-active{z-index:100;transform:scale(2)}.ingredient.is-active .label,.dish-type.is-active .label{display:block}.ingredient.dairy,.dish-type.dairy{background-color:#f0fff0}.ingredient.vegetables,.dish-type.vegetables{background-color:#228b22}.ingredient.fish,.dish-type.fish{background-color:#1e90ff}.ingredient.meat,.dish-type.meat{background-color:#b43104}.ingredient.fruits,.dish-type.fruits{background-color:hotpink}.ingredient.eggs,.dish-type.eggs{background-color:#fce6c9}.ingredient.nuts,.dish-type.nuts{background-color:#8b5a2b}.ingredient.grains,.dish-type.grains{background-color:wheat}.ingredient.herbs,.dish-type.herbs{background-color:#165e00}.ingredient.used,.dish-type.used{cursor:unset;background-color:#ccc}.ingredient.has-icon,.dish-type.has-icon{background:none;border:0}.dish-type.oven{background-color:#b43104}.dish-type.stovetop{background-color:#f0fff0}.dish-type.salad{background-color:#228b22}.dish-type.soup{background-color:wheat}.dish-type.other{background-color:hotpink}
