*{box-sizing:border-box;margin:0;font-family:Inter,sans-serif}button{border:0px;border-radius:6px;height:38px;padding:9px 17px;font-size:small;flex-basis:0;color:#fafaf8;white-space:nowrap;cursor:pointer}button:disabled{opacity:.6;cursor:not-allowed;background-color:#777;color:#d3d3d3}body{margin:0;background-color:#fafaf8;font-family:Inter,sans-serif}#root{display:flex;justify-content:center;align-items:center;flex-direction:column}header{display:flex;justify-content:center;align-items:center;height:111px;gap:12px;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;background-color:#fff;width:100%}.page-title{font-style:normal;font-weight:400;font-size:45px;line-height:60px;letter-spacing:-.05em;color:#d17557}header img{height:60px;width:auto;padding-bottom:10px}main{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:48px;padding:36px 63px 111px;max-width:720px;width:100%}.bannerRoot{display:flex;gap:8px;width:100%;background-color:#f0efeb;flex-wrap:wrap;justify-content:space-between;align-items:center;border-radius:8px;padding:28px 42px}.bannerTextContainer{display:flex;flex-direction:column;gap:8px}.bannerTextContainer>h3{font-weight:500;line-height:24px}.bannerTextContainer>p{font-weight:400;font-size:14px;line-height:20px;color:#6b7280}.ingridient-root{display:flex;flex-wrap:wrap;width:100%;gap:12px}.ingridient-input{flex:1;width:100%;border-radius:6px;border:1px solid #d1d5db;stroke-width:1px;height:38px;outline:none;padding:9px 13px;font-size:small;box-shadow:#000;min-width:80px;flex-grow:2}.submit-ingridient-button{background-color:#141413;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:80px;flex-grow:1}.submit-ingridient-button:active{background-color:#353533}.submit-ingridient-button:before{content:"+";padding-right:5px}.text-title{font-style:normal;font-weight:600;font-size:30px;line-height:38px}.text-container{display:flex;flex-direction:column;gap:24px;width:100%}.list-item{display:flex;gap:5px;align-items:center;font-style:normal;font-weight:400;font-size:18px;line-height:28px;color:#475467}.list-item:before{content:"•";padding-right:5px}.remove-button{all:unset;color:#c84141;cursor:pointer;height:1.2em}.remove-button>img{width:100%;height:80%}.list-item .remove-button{display:none}.list-item:focus-within .remove-button,.list-item:hover .remove-button{display:inline;cursor:pointer}.main-section{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:36px;width:100%}.get-recipe-button{background-color:#d17557}.get-recipe-button:active{background-color:#c64}.skeleton-loader{width:100%;position:relative;height:320px}.skeleton-loader:after{content:"";display:block;width:100%;height:100%;position:absolute;left:0;top:0;background-repeat:no-repeat;background-image:linear-gradient(90deg,#fff0),linear-gradient(#aaaaaa 37px,transparent 0),linear-gradient(#aaaaaa 16px,transparent 0),linear-gradient(#aaaaaa 16px,transparent 0),linear-gradient(#aaaaaa 16px,transparent 0),linear-gradient(#aaaaaa 16px,transparent 0),linear-gradient(#aaaaaa 16px,transparent 0),linear-gradient(#aaaaaa 16px,transparent 0),radial-gradient(circle 8px at 8px 8px,#aaaaaa 100%,transparent 0),radial-gradient(circle 8px at 8px 8px,#aaaaaa 100%,transparent 0),radial-gradient(circle 8px at 8px 8px,#aaaaaa 100%,transparent 0),linear-gradient(#aaaaaa 15px,transparent 0);animation-name:fadeInOpacity;animation-direction:alternate;animation-iteration-count:infinite;animation-timing-function:ease-in;animation-duration:2s;background-size:264px 100%,268px 37px,528px 16px,511px 16px,175px 16px,271px 16px,249px 16px,262px 16px,16px 16px,16px 16px,16px 16px,359px 15px,100% 100%;background-position:0 0,0px 0px,0px 61px,0px 91px,0px 145px,27px 175px,27px 199px,27px 223px,5px 175px,5px 199px,5px 223px,0px 264px,0 0}@keyframes fadeInOpacity{0%{opacity:.5}to{opacity:1}}.transition{opacity:0;transform:translateY(8px);animation:transition-enter .36s cubic-bezier(.2,.8,.2,1) forwards}@keyframes transition-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}li,p{font-family:Inter;font-style:normal;font-weight:400;font-size:18px;line-height:28px;color:#475467}
