@import "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@import "https://fonts.cdnfonts.com/css/sf-pro-display";header,header.header-nolist{justify-content:center;align-items:center;width:100%;height:72px;margin-bottom:0;display:flex}header{justify-content:space-between}header nav{z-index:1000;background-color:#fff;justify-content:space-between;align-items:center;width:100%;height:72px;padding:.875em;display:flex;position:fixed;top:0;left:0}header nav button{background:inherit;cursor:pointer;border:none;align-items:center;display:flex}@media (width>=768px){header{height:108px}header nav{height:108px;padding-inline:1.75em}header img{transform:scale(1.5)}}.loading-container{flex-direction:column;justify-content:center;align-items:center;gap:1rem;width:100%;height:90dvh;display:flex}.loading-container>svg{width:100px;height:100px}.loading-container>h1{color:#1c1c1c;font-size:2rem;font-weight:600}h1{font-family:SF Compact,sans-serif;font-weight:600}h1>span:not(:last-child){margin:0 .5px}h1>span:last-child{margin-left:.5px}@media (width>=768px){h1{font-size:3rem}}.red{color:#ff2d55}.green{color:#34c759}.orange{color:#ff9500}.purple{color:#af52de}.blue{color:#506eec}main.login{padding-inline:1rem;color:#2b2b2f;letter-spacing:.5px;justify-content:flex-start;align-items:center;height:calc(100dvh - 72px);min-height:600px;padding-bottom:2rem;font-family:SF Compact,sans-serif;display:flex}@media (width>=768px){main.login{height:calc(100dvh - 108px);min-height:670px}}main.login>section{flex-direction:column;justify-content:center;height:100%;display:flex}main.login form.login-form{border-radius:16px;flex-direction:column;width:100%;min-width:280px;max-width:500px;padding-block:1rem 2rem;padding-inline:1rem;display:flex;position:relative;margin-top:3.5rem!important}@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}form.login-form:after{content:"";z-index:-2000;background-image:conic-gradient(from var(--angle),#ff2d55 10%, #ff9500 35%, #34c759, #506eec 72% 75%, #af52de 95%);border-radius:16px;width:calc(100% + 10px);height:calc(100% + 10px);animation:8s linear infinite spinning-bg;position:absolute;top:-5px;left:-5px}form.login-form:before{content:"";z-index:-1000;-webkit-backdrop-filter:blur(20px);background:linear-gradient(#ffffffb3,#ffffffb3);border-radius:16px;width:calc(100% + 10px);height:calc(100% + 10px);position:absolute;top:-5px;left:-5px;box-shadow:0 4px 30px #0000001a}@keyframes spinning-bg{0%{--angle:0deg}to{--angle:360deg}}.login-form>h2{background-color:#fff;width:max-content;padding:.25rem .5rem;font-size:1.5rem;font-weight:600;position:relative;top:-2.125rem;left:1rem;box-shadow:-.25px .25px 5px #b7b7c1}.login-form>h2:after{content:"";z-index:-500;background-image:conic-gradient(from var(--angle),#ff2d55 10%, #ff9500 35%, #34c759, #506eec 72% 75%, #af52de 95%);width:calc(100% + 4px);height:calc(100% + 4px);animation:8s linear infinite spinning-bg;position:absolute;top:-2px;left:-2px}.login-form>label{flex-direction:column;gap:.75rem;margin-bottom:1.25rem;font-size:1.25rem;font-weight:500;display:flex}.login-form>label>span{-webkit-backdrop-filter:blur(5px);background:linear-gradient(#f6f5f599,#f6f5f599);border-radius:4px;width:max-content;padding:.125rem .33rem;box-shadow:-.25px .25px 4px #b7b7c1}.login-form input{letter-spacing:.5px;background-color:#f6f5f5;border:1px solid #d3d3d3;border-radius:6px;width:clamp(248px,468px,77.5vw);padding:.5rem .75rem;font-family:inherit;font-size:1.25rem;box-shadow:-.25px .25px 2.5px #e5e5e8}.login-form input:hover{background-color:#e2e1e1}.login-form input:focus{border-color:none;background-color:#e2e1e1;outline:none;box-shadow:0 0 0 2px #fff,0 0 0 6px #506eec}@property --angle2{syntax:"<angle>";inherits:false;initial-value:0deg}.login-form button{background-color:#24a043;background-image:conic-gradient(from var(--angle2),#ff2d55 10%, #ff9500 35%, #34c759, #506eec 72% 75%, #af52de 95%);color:#fff;text-shadow:.25px .25px #1c1c1e;border:none;border-radius:8px;height:48px;margin-top:1.25rem;font-family:SF Compact,sans-serif;font-size:1.5rem;font-weight:600;animation:4s linear infinite spinning-btn;position:relative;box-shadow:-2px 2px 10px #707077}.login-form button:after{content:"";background-image:#ffffff40;-webkit-backdrop-filter:blur(30px);border-radius:8px;width:100%;height:100%;position:absolute;top:0;left:0}.login-form button>span{z-index:1000;height:max-content;margin:auto;position:absolute;inset:0}@keyframes spinning-btn{0%{--angle2:0deg}to{--angle2:360deg}}p#signin-error{color:#ff2d55;letter-spacing:.1px;font-size:1.25rem;font-weight:500;line-height:1.4}.row{border:.5px #c7c7cc;border-top-style:solid;justify-content:space-between;align-items:center;padding:.15625rem 0 .15625rem 10px;font-family:SF Pro Display,sans-serif;display:flex;position:relative}.row:last-child{border-style:solid none}.row>div:first-child{align-items:center;display:flex}.row>div:last-child{align-items:center;gap:15px;display:flex}.row img{width:20px}.item-name{margin-right:10px;font-size:1rem;line-height:1.25}.item-amount{letter-spacing:1%;color:#48484a;background-color:#f2f2f7;border-radius:8px;padding:.272727rem .454545rem;font-size:.6875rem;font-weight:700;line-height:1.18182}.item-avatar{color:#fff;text-align:center;background-color:#f07a05;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-weight:700;display:flex}.item-avatar:has(.user-img){background-color:#0000}div.edit-btn-container{width:22px;margin-top:3px}.edit-btn{cursor:pointer;background-color:#fff;border:none}.edit-btn img{pointer-events:none}.hr{border-top:2px solid #8e8e93;height:.1px}.checked{color:#8e8e93;background-color:#c7c7cc}.checked .hr{width:78%;display:block;position:absolute;top:50%;left:50px}.checked .item-amount{color:#8e8e93;background-color:#c7c7cc}.checkbox-wrapper-15{align-items:center;gap:.625em;margin:.1875rem .875rem 0 .6rem;display:flex}.checkbox-wrapper-15 .cbx{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.checkbox-wrapper-15 .cbx span{vertical-align:middle;display:inline-block;transform:translate(0,0)}.checkbox-wrapper-15 .cbx span:first-child{vertical-align:middle;border:1px solid #b9b8c3;border-radius:50%;width:20px;height:20px;transition:all .2s;position:relative;transform:scale(1)}.checkbox-wrapper-15 .cbx span:first-child svg{z-index:1;fill:none;stroke:#fff;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16px;transition:all .3s .1s;position:absolute;top:4.5px;left:3px;transform:translate(0,0)}.checkbox-wrapper-15 .cbx span:first-child:before{content:"";opacity:1;background:#506eec;border-radius:50%;width:100%;height:100%;transition-delay:.2s;display:block;transform:scale(0)}.checkbox-wrapper-15 .cbx span:last-child:after{content:"";transform-origin:0 0;background:#b9b8c3;width:100%;height:1px;position:absolute;top:8px;left:0;transform:scaleX(0)}.checkbox-wrapper-15 .inp-cbx:checked+.cbx span:first-child svg{stroke-dashoffset:0}.checkbox-wrapper-15 .inp-cbx:checked+.cbx span:first-child:before{opacity:0;transition:all .6s;transform:scale(2.2)}.checkbox-wrapper-15 .inp-cbx:checked+.cbx span:last-child{color:#b9b8c3;transition:all .3s}.checkbox-wrapper-15 .inp-cbx:checked+.cbx span:last-child:after{transition:all .3s}.checkbox-wrapper-15{margin-bottom:.3em}@keyframes check-15{50%{transform:scale(1.2)}}.checkbox-wrapper-15 .inp-cbx:checked+.cbx span:first-child{border-color:var(--cat-primary);background:var(--cat-primary);animation:.6s check-15}.green-cat{--cat-primary:#34c759}.orange-cat{--cat-primary:#ff9500}.red-cat{--cat-primary:#ff2d55}.blue-cat{--cat-primary:#007aff}.purple-cat{--cat-primary:#af52de}.frozen-cat{--cat-primary:#5392b6}.others-cat{--cat-primary:#8e8e93}.category h2{align-items:center;margin-top:19px;margin-left:17.5px;padding:.625rem 0;font-family:SF Compact,sans-serif;font-size:1.625rem;font-weight:400;display:flex}.category h2>img{margin-right:10px}.label{border-radius:999px;flex-direction:column;width:5px;height:100%;display:flex;position:absolute;top:0;left:0}.transparent{background-color:#0000;width:5px;height:2px}.not-transparent{z-index:1;border-radius:999px;width:5px;height:100%}.category h2{color:var(--cat-primary)}.category .not-transparent{background-color:var(--cat-primary)}.category>div{position:relative}main{flex-direction:column;justify-content:space-between;min-height:calc(100dvh - 72px);display:flex}@media (width>=768px){main{min-height:calc(100dvh -108px)}}main>div:first-child{flex-direction:column;align-items:center;display:flex}.categories-container{width:95.2%;padding-right:.75rem}@media (width>=767px){.categories-container{grid-gap:2em;grid-template-rows:auto;grid-template-columns:1fr 1fr;padding-top:.5em;grid-auto-flow:dense!important;display:grid!important}}@media (width>=1280px){.categories-container{grid-template-columns:1fr 1fr 1fr;gap:2em;padding-top:1em;display:grid!important}}.add-btn-container{width:58px;height:58px;position:fixed;bottom:34px;right:17px}.add-item{z-index:1000;background:#007aff;border:none;border-radius:50%;justify-content:center;align-items:center;width:58px;height:58px;display:flex;position:relative;box-shadow:0 4px 15px #00000020}.add-item img{margin-top:5px}.action-button-container{background:linear-gradient(#fff,#e9e9e9,#c4c4c4);width:100%}.action-button-container>div{flex-direction:column;gap:.4375em;width:max-content;padding:2.375em 1.75em;display:flex}.action-button-container>div button{border-radius:999px;align-self:center;padding:0 1.5em;font-family:SF Pro Display,sans-serif;font-size:1rem;font-weight:600;line-height:2}.action-button-container>div button:first-child{color:#944c0d;background-color:#f2c94c;border:3px solid #944c0d}.action-button-container>div button:last-child{color:#1c1c1e;background-color:#ff3b30;border:3px solid #3a3a3c}.add-message{color:#8e8e93;text-align:center;flex-direction:column;padding:1em;font-family:SF Compact,sans-serif;font-size:1.33rem;font-weight:600;display:flex;transform:translateY(70%)}.add-message>*{align-self:center}.add-message p:last-of-type{margin:1rem 0 1.5rem}.no-space-between{justify-content:flex-start}dialog{z-index:2000;background-color:#f2f2f7;border:none;border-radius:15px;width:85%;max-width:500px;margin:auto;padding:2em;font-family:SF Compact,sans-serif;font-weight:600;position:fixed;inset:0;box-shadow:-3px 5px 20px}::backdrop{opacity:.5;background-image:linear-gradient(45deg,#999,#888,#777,#666)}dialog button{color:#fff;border:none;border-radius:7px;width:30%;min-width:110px;max-width:300px;padding:10px;font-family:SF Pro Display,sans-serif;font-size:1rem;font-weight:600}dialog div{justify-content:space-between;margin-top:1.5em;display:flex}dialog div button:first-child{background-color:#3fbc55}dialog div button:last-child{background-color:#f04450}.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form{flex-direction:column;justify-content:center;display:flex}:is(.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form) h3{margin-bottom:1em;font-size:1.5rem}:is(.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form) label{cursor:pointer;margin-right:.25em;font-size:1.25rem}:is(.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form) label:not(:first-child){margin-top:1em}:is(.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form) input{background-color:#f2f2f7;border:2px solid #8e8e93;border-radius:7px;width:100%;margin-top:.5em;padding:.33em .5em;font-size:1.125rem}:is(.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form) input::placeholder{color:#888;font-family:inherit;font-size:1rem}:is(.add-dialog form,.update-dialog form,.login-dialog form,.password-dialog form) select{background-color:#f2f2f7;border:2px solid #8e8e93;border-radius:7px;width:70%;max-width:200px;margin-top:.25em;padding:7px;font-family:SF Pro Display,sans-serif;font-size:.9375rem;font-weight:500}.delete-dialog p{font-size:1.25rem}.login-dialog p{margin-top:1em;font-size:.875rem}.menu{white-space:nowrap;z-index:1000;background-color:#fff;flex-direction:column;justify-content:space-between;width:0%;max-width:500px;min-height:100dvh;padding-block:1.5em 2em;font-family:SF Pro Display,sans-serif;font-weight:400;transition:width 1s ease-in-out;display:flex;position:fixed;top:0;left:0;overflow-x:hidden;box-shadow:0 0 30px #00000020}.menu>section{padding-inline:2em}.profile-container{text-align:center;color:#fff;background-color:#f07a05;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin-top:2em;padding:0;font-size:2rem;font-weight:700;display:flex}.profile-container:has(.user-img){background-color:#fff}.user-img{background-position:50%;background-size:cover;border-radius:50%;width:100%;height:100%;box-shadow:.25px .25px 1px #00000005}.close-menu-container{justify-content:flex-end;display:flex}.close-menu{background-color:#0000;border:none}.close-menu>img{rotate:180deg}.greeting{font-size:1.5rem}.auth-container{flex-direction:column;align-items:flex-start;gap:1em;margin-top:2em;padding-inline:2rem;display:flex}@media (width>=768px){.auth-container{flex-direction:row}}.logout-btn{color:#1c1c1e;background-color:#e93d52;border:none;border-radius:8px;justify-content:center;align-items:center;gap:1rem;width:200px;height:80px;font-family:inherit;font-size:1.75rem;font-weight:500;display:flex;box-shadow:0 0 3px .5px gray}.settings-btn{background:#d3d3d3;border:none;border-radius:8px;justify-content:center;align-items:center;gap:1rem;width:200px;height:80px;font-family:inherit;font-size:1.25rem;font-weight:500;display:flex;box-shadow:0 0 3px .5px gray}.auth-container a,.auth-container a:visited{text-decoration:none;color:#1c1c1e!important}.search-container{white-space:nowrap;scrollbar-width:none;z-index:1000;background-color:#fff;flex-direction:column;width:0%;max-width:500px;min-height:100dvh;font-family:SF Pro Display,sans-serif;font-weight:400;transition:width 1s ease-in-out;display:flex;position:fixed;top:0;right:0;overflow:hidden scroll;box-shadow:0 4px 4px #00000025}.search-container div{padding:0 1em}.search-container label{color:#c77700;font-size:1em}.search-container input{border:2px solid #8e8e93;border-radius:10px;width:90%;margin:1em 0 1.5em;padding:.5em .75em;font-family:inherit;font-size:1em}.search-container>div:first-child{margin-top:1.33em}.search-container>div:nth-child(2){flex-direction:column;align-items:center;display:flex}.recipe{color:#000;grid:auto/22px 1fr;align-items:center;gap:.75em;display:grid;padding:0!important}.recipes-list{color:#8e8e93;white-space:wrap;flex-direction:column;justify-content:center;gap:1em;margin-left:1em;padding:0 2em 1em;display:flex}.no-results-msg{flex-direction:column;align-items:center;display:flex;padding:0!important}.no-results-msg img{margin-top:4em}button[data-recipe]{color:#fff;background:#007aff;border:none;border-radius:50%;justify-content:center;align-self:center;align-items:center;width:22px;height:22px;font-size:1rem;font-weight:400;display:flex}button[data-recipe]:disabled{background-color:#8e8e93}.close-search{background-color:#0000;border:none}main.settings{color:#1c1c1e;justify-content:flex-start;align-items:center;height:calc(100dvh - 72px);font-family:SF Compact,sans-serif}main.settings>div{width:100%;max-width:500px;height:100%}main.settings h1{margin-block:1.5rem;font-weight:600}main.settings nav{width:100%}main.settings nav a{text-align:center;color:gray;width:50%;box-shadow:inset 0 -4px #4b89e1;box-shadow:none;background:#aee5f440;padding-block:.75rem;font-family:SF Compact,sans-serif;font-size:1.25rem;font-weight:500;text-decoration:none;display:inline-block;color:#1c1c1e!important}main.settings nav a:visited{color:#1c1c1e;text-decoration:none}.settings-outlet-wrapper{flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:2rem 2.5rem 2rem 2rem;display:flex}.settings-outlet-wrapper a{color:gray;border-bottom:1px solid gray;align-self:center;width:max-content;padding-left:1.25rem;font-size:1rem;text-decoration:none;display:inline-block;position:relative}.settings-outlet-wrapper a:visited{color:gray;text-decoration:none}.settings-outlet-wrapper a:before{content:"←";align-items:center;font-size:1rem;display:flex;position:absolute;top:-5%;left:0}.profile-form h2,.password-form h2{margin-bottom:1.25rem;padding-left:.5rem;font-size:1.5rem;font-weight:500;line-height:1;position:relative}.profile-form h2:before,.password-form h2:before{content:"";background-color:#4b89e1;width:5px;height:100%;position:absolute;top:0;left:-5px}.profile-form p,.password-form p{color:#fa5252;margin-top:1rem;font-size:1rem;line-height:1.4}.profile-form>div:first-of-type{margin-bottom:2.5rem}.avatar-container{text-align:center;color:#fff;background-color:#f07a05;border-radius:50%;justify-content:center;align-items:center;width:96px;height:96px;padding:0;font-size:3rem;font-weight:700;display:flex;box-shadow:-1px -1px 5px gray}.avatar-label{border-radius:50%;width:96px;height:96px;position:relative}.avatar-label:after{pointer-events:all;content:"";z-index:1000;background-color:#e4e4e4;background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='iso-8859-1'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20fill='%23000000'%20version='1.1'%20id='Capa_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='80%25'%20height='80%25'%20viewBox='0%200%20528.899%20528.899'%20xml:space='preserve'%3e%3cg%3e%3cpath%20d='M328.883,89.125l107.59,107.589l-272.34,272.34L56.604,361.465L328.883,89.125z%20M518.113,63.177l-47.981-47.981%20c-18.543-18.543-48.653-18.543-67.259,0l-45.961,45.961l107.59,107.59l53.611-53.611%20C532.495,100.753,532.495,77.559,518.113,63.177z%20M0.3,512.69c-1.958,8.812,5.998,16.708,14.811,14.565l119.891-29.069%20L27.473,390.597L0.3,512.69z'/%3e%3c/g%3e%3c/svg%3e");background-position:50%;background-repeat:no-repeat;background-size:60%;border-radius:50%;width:32px;height:32px;position:absolute;top:70px;left:64px;box-shadow:-1px -1px 2px gray}.avatar-container.image{letter-spacing:.25px;font-size:.75rem;font-weight:400}.avatar-label{position:relative}.avatar-label>input{display:none;position:absolute;top:0;left:0}.name-input-container>div{align-items:center;gap:.5rem;display:flex}.name-input,.password-form input{color:#1c1c1e;border:1px solid #1c1c1e;border-radius:6px;padding:.75rem .5rem;font-family:inherit;font-size:1.125rem}.name-input:disabled{color:gray;border-color:gray}@media (width<=380px){.name-input{max-width:190px}}.edit-name-btn{border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;display:flex;box-shadow:0 0 2px #1c1c1e}.edit-name-btn>img{pointer-events:none;width:50%;height:50%}.settings-btn-container{justify-content:space-around;margin-block:4rem 2rem;display:flex}.save-btn,.cancel-btn{color:#fff;background-color:#10a64a;border:none;border-radius:8px;padding:.5rem 1rem;font-family:inherit;font-size:1.25rem}@media (width<=350px){.settings-btn-container{gap:1.125rem}.save-btn,.cancel-btn{font-size:1.125rem}}.save-btn{background-color:#10a64a}.cancel-btn{background-color:#f24444}.password-form h4,.profile-form h4{font-family:inherit;font-weight:400;line-height:1.3}.profile-form h4{margin-bottom:1.5rem}.password-form label{flex-direction:column;gap:.5rem;font-size:1.125rem;font-weight:500;display:flex}.password-input-container{flex-direction:column;gap:1rem;margin-top:2rem;display:flex}.password-form .settings-btn-container{justify-content:flex-start}.password-form{position:relative}.toast{margin:0 auto;text-align:center;background-color:#10a64a;width:90%;max-width:350px;margin-block:2rem;padding:.75rem;font-size:1.125rem;box-shadow:0 0 2px #1c1c1e}.toast p{color:#fff!important}.main-404{flex-direction:column;justify-content:center;align-items:center;gap:1rem;font-family:SF Compact,sans-serif;display:flex}.main-404>h1{font-size:4rem}.main-404>p{letter-spacing:.25px}.main-404>a,.main-404 a:visited{color:#fff;background-image:linear-gradient(135deg,#ff2d55,#ff9500 25%,#34c759 50%,#506eec 75%,#af52de);border-radius:8px;margin-top:.5rem;padding:1rem 1rem 1rem 2.25rem;font-size:1.25rem;text-decoration:none;position:relative}.main-404>a:before{content:"←";align-items:center;font-size:1.25rem;display:flex;position:absolute;top:30%;left:.66rem}@font-face{font-family:SF Compact;src:url(./fonts/sf-compact-regular.woff)}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh}img{pointer-events:none}button:disabled{cursor:not-allowed}.list{float:column;gap:1.75em;display:flex}button{cursor:pointer}dialog{max-width:500px}.plate-icon{margin-top:1em!important}button:hover,button:active{opacity:.9;transform:scale(.9)}.greeting{margin-top:.66em}img{display:block}