@import"https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";:root{color-scheme:light dark;--main-background: #d9d6d2;--main-color: #1d1e1e;--main-border-100: hsla(130, 97%, 24%, 1);--main-border: hsla(180, 2%, 12%, .5);--main-border-selected: hsla(130, 97%, 24%, .5);--main-linear-gradient: linear-gradient(0deg, #5ccdf080 .5rem, transparent 1rem);--main-linear-gradient-2: linear-gradient(0deg, #5ccdf080 .5rem, transparent 1.2rem);--main-linear-gradient-3: linear-gradient(0deg, #5ccdf080 .1rem, transparent .7rem);--main-linear-gradient-3-danger: linear-gradient(0deg, #ee1c2780 .1rem, transparent .7rem);--main-accent: #5ccdf0;--main-accent-danger: #ee1c27;--main-modal-overlay: hsla(180, 2%, 12%, .6)}[data-theme=dark]{--main-background: #1d1e1e;--main-color: #d9d6d2;--main-border: hsla(34, 8%, 84%, .5);--main-linear-gradient: linear-gradient(0deg, #00c3ff40 .5rem, transparent 1rem);--main-linear-gradient-2: linear-gradient(0deg, #00c3ff40 .5rem, transparent 1.2rem);--main-linear-gradient-3: linear-gradient(0deg, #00c3ff40 .1rem, transparent .7rem);--main-modal-overlay: hsla(34, 8%, 84%, .6)}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Noto Sans,Arial,Helvetica,sans-serif;color:var(--main-color);background-color:var(--main-background)}h1,h2,h3,h4,h5,h6{text-align:center}a{width:100%;text-decoration:none;font-family:Noto Sans,Arial,Helvetica,sans-serif}button{font-family:Noto Sans,Arial,Helvetica,sans-serif;color:var(--main-color);cursor:pointer}input,textarea{color:var(--main-color)}svg{width:auto;height:1rem;color:var(--main-color)}#root{position:relative;display:flex;flex-direction:column;width:100%;min-height:100vh}.main-container{display:flex;flex-direction:column;align-items:center;flex-grow:1;padding:1rem}.card-list-container{display:flex;flex-direction:column;gap:1rem}.recipe-selector-container{display:flex;justify-content:center;gap:1rem;max-width:768px}.recipe-selector-btn{display:flex;flex-direction:column;justify-content:center;gap:1rem;padding:1rem;width:100%;font-weight:700;color:var(--main-color);background:none;border:2px solid var(--main-border);overflow:hidden;cursor:pointer}.recipe-selector-btn-selected{border-color:var(--main-border-selected)}.recipe-selector-img{width:100%;transition:transform .4s ease-in}.recipe-selector-btn:hover>.recipe-selector-img{transform:scale(1.05)}.recipe-selector-form-container{display:flex;flex-direction:column;gap:1rem;padding:1rem;width:100%;max-width:768px}.recipe-selector-highlight{position:relative;padding-right:.5rem;background-image:var(--main-linear-gradient)}.recipe-selector-form,.create-recipe-form{display:flex;flex-direction:column}.recipe-selector-form-control{display:flex;border-bottom:2px solid var(--main-border-selected)}.recipe-selector-input{margin:0 1rem;padding-left:.5rem;max-width:4rem;font-weight:700;text-align:center;background:none;outline:none;border:none;border-left:2px solid var(--main-border-selected);border-right:2px solid var(--main-border-selected)}.recipe-selector-footnote{margin-bottom:1rem;font-size:.8rem;font-weight:300;font-style:italic}.recipe-selector-list-item{font-size:1rem}.recipe-selector-list-item:before{content:" + ";color:var(--main-accent);font-size:1.2rem;font-weight:700}.recipe-selector-space{margin-left:.5rem}.continue-btn-container{display:flex;justify-content:center;align-self:center;width:75%;border-bottom:2px solid var(--main-border-selected)}.continue-btn{position:relative;margin-top:1rem;padding:.5rem 3rem;width:fit-content;font-size:1.2rem;text-transform:uppercase;color:var(--main-color);background-color:transparent;border:none;border-left:2px solid var(--main-border-selected);border-right:2px solid var(--main-border-selected);overflow:hidden;cursor:pointer}.continue-btn:after{content:"";position:absolute;left:0;bottom:0;width:0%;height:100%;background-image:var(--main-linear-gradient-2);transition:width .4s ease-in-out}.continue-btn:target:after,.continue-btn:hover:after,.continue-btn:focus:after,.continue-btn:focus-visible:after,.continue-btn:active:after{width:100%}.instruction-container,.detail-page-container{display:flex;flex-direction:column}.detail-page-container{max-width:768px}.instruction-title,.detail-title{margin-bottom:.5rem;font-size:1.5rem;font-weight:700;color:#1d1e1e}.instruction-subtitle{margin-bottom:1rem;text-align:center;font-size:1.2rem;font-weight:300;font-style:italic}.instruction-subtitle-highlight{padding:0 .5rem;background-image:var(--main-linear-gradient)}.instruction-list{padding:1rem;list-style-position:inside;list-style-type:korean-hangul-formal}.instruction-list-item{margin:.5rem 0}.instruction-list-item::marker{color:var(--main-accent-danger);font-weight:700}.instruction-list-checkbox{accent-color:var(--main-accent)}.continue-btn-container-lg{width:90%}.create-recipe-container{display:flex;flex-direction:column;width:100%;max-width:768px}.create-recipe-title{text-align:center;margin-bottom:1rem;font-size:1.5rem;font-weight:700;color:var(--main-color)}.create-recipe-input{padding:0 .5rem;height:2rem;font-size:1rem;margin-bottom:1.25rem;background:transparent;border:2px solid var(--main-border-selected);border-top:none}.create-recipe-input:target,.create-recipe-input:hover,.create-recipe-input:focus,.create-recipe-input:focus-visible,.create-recipe-input:active,.create-recipe-textarea:target,.create-recipe-textarea:hover,.create-recipe-textarea:focus,.create-recipe-textarea:focus-visible{outline:2px solid var(--main-border-selected)}.create-recipe-textarea{padding:0 .5rem;font-size:1rem;margin-bottom:1.25rem;background:transparent;border:2px solid var(--main-border-selected);border-top:none}.not-found-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.not-found-img{width:50%}@media (min-width: 425px){.continue-btn-container{width:100%}}@media (min-width: 768px){.card-list-container{flex-direction:row;flex-wrap:wrap}.recipe-selector-form-control{max-width:60%}.continue-btn-container{width:40%;max-width:30rem}.continue-btn-container-lg{width:80%;max-width:36rem}}@media (min-width: 1440px){.recipe-selector-form-control{max-width:35%}}.recipe-selected-btn-container{display:flex;justify-content:center;gap:1rem;padding:1rem}.recipe-selected-btn{width:100%;margin:1rem 0;padding:1rem}.container-flex-column-p-1{display:flex;flex-direction:column;padding:1rem}.form-control{margin-bottom:1rem}.card-container{position:relative;display:flex;flex-direction:column;padding:.25rem;border:2px solid var(--main-border);transition:border-color .3s ease-out;overflow:hidden}.card-container:target,.card-container:hover,.card-container:focus,.card-container:focus-visible,.card-container:active{border-color:var(--main-border-selected)}.card-content{display:flex;gap:.5rem}.card-image-container{display:flex;justify-content:center;align-items:center;width:48%;aspect-ratio:4/3;overflow:hidden}.card-image{width:100%}.card-description{padding-right:.25rem;display:flex;flex-direction:column;width:52%}.card-description-title{margin-bottom:.5rem;font-size:1.5rem;text-align:left}.card-controls{display:flex;align-items:center;justify-content:center}.card-controls{display:flex;gap:.5rem}.card-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;background:none;border:none;overflow:hidden}.card-btn:after{content:"";position:absolute;left:0;bottom:0;width:0%;height:100%;background-image:var(--main-linear-gradient-3);transition:width .4s ease-in-out}.btn-danger:after{background-image:var(--main-linear-gradient-3-danger)}.card-btn:target:after,.card-btn:hover:after,.card-btn:focus:after,.card-btn:focus-visible:after,.card-btn:active:after{width:100%}.card-icon{width:auto;height:1rem}@media (min-width: 768px){.card-container{width:47%}}@media (min-width: 1024px){.card-container{width:31%}}.detail-container{display:grid;grid-template-columns:48% 48%;grid-template-rows:auto;grid-template-areas:"detailImage detailTitle" "detailIngredient detailIngredient";gap:1rem;margin-top:1rem;padding-bottom:1rem}.detail-image-container{grid-area:detailImage}.detail-image{width:100%}.detail-description-container{grid-area:detailTitle}.detail-description-title{font-size:1.2rem;font-weight:600;text-align:left}.detail-description-mini{font-size:1rem;font-weight:300;font-style:italic;margin-bottom:1rem}.detail-ingredient-container{grid-area:detailIngredient}.detail-table{width:100%;border-bottom:1px solid var(--main-border-100)}.detail-table-title{font-weight:700;border-bottom:1px solid var(--main-border-100)}.detail-table-title-item{padding-bottom:1rem}.detail-table-ingredient-item{padding:.25rem}.add-note-btn-container{display:flex;justify-content:center;align-self:center;margin-bottom:2rem;width:75%;border-bottom:2px solid var(--main-border-selected)}.add-note-btn{position:relative;display:flex;align-items:center;gap:1rem;margin-top:1rem;padding:.5rem 3rem;width:fit-content;font-size:1.2rem;text-transform:uppercase;color:var(--main-color);background-color:transparent;border:none;border-left:2px solid var(--main-border-selected);border-right:2px solid var(--main-border-selected);overflow:hidden;cursor:pointer}.add-note-btn-img{height:2rem;width:auto}.note-list-container{display:flex;flex-direction:column;align-items:center;gap:1rem}.note-container{position:relative;display:flex;gap:.5rem;padding:.25rem;width:100%;border:2px solid var(--main-border);transition:border-color .3s ease-out;overflow:hidden}.note-image-container{width:50%}.note-image{width:100%;aspect-ratio:4/3}.note-description{display:flex;flex-direction:column;flex-grow:1}.note-description-title{font-weight:700;margin-bottom:1rem}.note-description-content{flex-grow:1;padding-bottom:.5rem}.modal-container,.modal-overlay{z-index:8;width:100dvw;height:100dvh;top:0;left:0;right:0;bottom:0;position:fixed;overflow:hidden}.modal-overlay{background:var(--main-modal-overlay);-webkit-backdrop-filter:blur(.2rem);backdrop-filter:blur(.2rem)}.modal-content{z-index:9;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:.5rem;padding:1rem;width:80%;max-width:768px;background:var(--main-background);border-radius:.25rem}.modal-title{font-size:1.2rem;font-weight:700;margin-bottom:1rem}.btn-modal-close{position:absolute;display:flex;justify-content:center;align-items:center;top:.5rem;right:.5rem;padding:.5rem;background-color:transparent;border:2px solid var(--main-border-selected);border-top:none}@media (min-width: 425px){.note-image-container{width:40%}}@media (min-width: 768px){.note-image-container{width:30%}}body.active-modal{overflow-y:hidden}.add-note-form{display:flex;flex-direction:column}.add-note-input{padding:0 .5rem;height:2rem;font-size:1rem;margin-bottom:1.25rem;background:transparent;border:2px solid var(--main-border-selected);border-top:none}.add-note-textarea{padding:0 .5rem;font-size:1rem;margin-bottom:1.25rem;background:transparent;border:2px solid var(--main-border-selected);border-top:none}.add-note-input:target,.add-note-input:hover,.add-note-input:focus,.add-note-input:focus-visible,.add-note-input:active,.add-note-textareaa:target,.add-note-textarea:hover,.add-note-textarea:focus,.add-note-textarea:focus-visible,.add-note-textarea:target{outline:2px solid var(--main-border-selected)}.add-note-form-btn{display:flex;justify-content:center;align-self:center;margin-top:1rem;padding:.5rem 3rem;width:fit-content;font-size:1.2rem;font-weight:700;text-transform:uppercase;color:var(--main-color);background-color:transparent;border:2px solid var(--main-border-selected);border-top:none;overflow:hidden;cursor:pointer}.header-container{display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding-top:1rem;height:fit-content;border-bottom:2px solid var(--main-border-selected)}.logo-container{display:flex;justify-content:center;align-items:center;gap:1rem;padding:0 1rem}.logo-container a{width:fit-content;display:flex;justify-content:center;align-items:center;gap:1rem;padding:0 1rem}.logo{width:3rem;height:3rem}.logo-title{padding:0 .25rem;width:fit-content;font-size:1.8rem;text-transform:uppercase;font-weight:700;color:var(--main-color);background-image:var(--main-linear-gradient)}.menu-container{display:flex;align-items:center;width:100%}.nav-container{display:flex;justify-content:space-between;align-items:center;margin-top:1rem;width:100%}.nav-btn{position:relative;display:flex;flex-direction:column;gap:.25rem;padding:.5rem;width:100%;font-size:.8rem;text-decoration:none;text-transform:uppercase;background:none;border:none;overflow:hidden}.nav-btn-accent{border-left:2px solid var(--main-border-selected);border-right:2px solid var(--main-border-selected)}.nav-btn:after{content:"";position:absolute;left:0;bottom:0;width:0%;height:100%;background-image:var(--main-linear-gradient-2);transition:width .4s ease-in-out}.nav-btn:target:after,.nav-btn:hover:after,.nav-btn:focus:after,.nav-btn:focus-visible:after,.nav-btn:active:after{width:100%}.nav-icon{height:1rem}@media (min-width: 768px){.header-container{flex-direction:row;padding-right:1rem}.menu-container{width:fit-content}.nav-container{margin-top:0;width:fit-content}.nav-btn{min-width:7.25rem}}.dark-mode-btn{display:none;align-items:center;justify-content:center;margin:0 .5rem;padding:.25rem;width:fit-content;height:fit-content;background:transparent;border:none}.dark-mode-btn-footer{display:flex;margin:0 1rem}.dark-mode-btn svg{height:1.3rem}@media (min-width: 1024px){.dark-mode-btn{display:flex}.dark-mode-btn-footer{display:none}}.btn-chat-open{z-index:10;position:fixed;width:7rem;height:7rem;right:1rem;bottom:2rem;display:flex;flex-direction:column;align-items:center;color:#1d1e1e;background-color:var(--main-accent);border:1px solid #1d1e1e;border-radius:5px}.btn-chat-image{width:4rem}.gemini-container{z-index:10;position:fixed;width:80%;right:1rem;bottom:2rem;display:flex;flex-direction:column;align-items:center;padding:1rem;color:#1d1e1e;background-color:var(--main-accent);border:1px solid #1d1e1e;border-radius:5px}.gemini-controls{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:1rem;width:100%}.gemini-title{font-size:1.2rem;font-weight:500;text-align:left;margin-bottom:0}.gemini-close-button{width:2rem;background:none;border:none}.gemini-loader-container{display:flex;align-items:center;justify-content:center}.gemini-loader{width:48px;height:48px;border:5px solid var(--main-border-selected);border-bottom-color:transparent;border-radius:50%;display:inline-block;margin:auto;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.gemini-response{margin-bottom:1rem;width:100%;font-size:1rem;line-height:1.5}.gemini-question{margin-top:.5rem;margin-bottom:1.25rem;padding:0 .5rem;width:100%;height:3rem;font-size:1rem;color:#1d1e1e;background:transparent;border:2px solid var(--main-border-selected);border-top:none}.gemini-question:hover,.gemini-question:target,.gemini-question:focus,.gemini-question:focus-visible{outline:2px solid var(--main-border-selected)}.gemini-close-button{font-size:1rem}.gemini-btn-container{display:flex;justify-content:center;width:80%;border-bottom:2px solid var(--main-border-selected)}.gemini-btn{padding:0 .5rem;height:2rem;font-size:1rem;font-weight:700;color:#1d1e1e;background:transparent;border:2px solid var(--main-border-selected);border-top:none;border-bottom:none}@media (min-width: 768px){.gemini-container{width:50%}}@media (min-width: 1440px){.gemini-container{width:33%}}.footer{padding-top:3rem}.footer-container{display:flex;align-items:center;padding:1rem;border-top:2px solid var(--main-border-selected);font-size:.8rem}.footer-link{color:var(--main-color);font-weight:600}.toast-container{z-index:10;position:fixed;top:1rem;right:1rem;display:flex;padding:1rem .5rem 1rem 1rem;width:fit-content;color:#027916;background-color:#a1f2ae;border:2px solid hsl(130,97%,24%);border-radius:.5rem}.toast-btn{display:flex;align-items:center;justify-content:center;width:fit-content;height:fit-content;color:#027916;background-color:transparent;border:none}.toast-danger{color:#ee1b26;background-color:#f8abae;border:2px solid hsl(357,86%,52%)}.toast-danger .toast-btn{color:#ee1b26}