*{box-sizing:border-box}.app{width:100%;max-width:1200px;margin:0 auto;padding:20px}.header{text-align:center;margin-bottom:40px}.header-link{color:#2c3e50;text-decoration:none;display:inline-block}.header-link:hover{color:#4caf50}.nav-links{display:none}.header h1{color:#ff6b6b;font-size:2.5rem;margin-bottom:10px}.subtitle{color:#666;font-size:1.1rem}.main{min-height:60vh}.search-section{background:#fff;padding:30px;border-radius:15px;box-shadow:0 4px 12px #0000001a;margin-bottom:30px}.input-group{display:flex;gap:10px;margin-bottom:20px}.ingredient-input{flex:1;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .3s}.ingredient-input:focus{outline:none;border-color:#ff6b6b}.input-with-suggestions{flex:1;position:relative;width:100%;max-width:600px;margin:0 auto;box-sizing:border-box}.suggestions-dropdown{position:absolute;top:100%;left:0;right:auto;margin:0 21px;background:#fff;border:1px solid #ddd;border-radius:0 0 12px 12px;box-shadow:0 4px 12px #0000001a;max-height:calc(3 * 2.7rem + 1.5rem);overflow-y:auto;z-index:1000;width:calc(100% - 42px);box-sizing:border-box}.suggestion-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;cursor:pointer;transition:background-color .2s}.suggestion-item:hover{background-color:#f5f5f5}.ingredient-name{font-weight:500;color:#333}.usage-count{font-size:.875rem;color:#666;background-color:#f0f0f0;padding:.25rem .5rem;border-radius:12px}.search-button{background:#ff6b6b;color:#fff;border:none;padding:12px 30px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .3s}.search-button:hover{background:#ff5252}.quick-tags{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.quick-tags span{color:#666;font-size:.9rem}.tag{background:#f0f0f0;color:#333;border:none;padding:6px 12px;border-radius:16px;font-size:.9rem;cursor:pointer;transition:all .3s}.tag:hover{background:#ffecec;color:#ff6b6b}.results-section{margin-top:30px;display:flex;flex-direction:column;align-items:center;max-height:600px;overflow-y:auto;width:100%;padding:0 1rem;position:relative;z-index:50}.results-section h2{color:#333;font-size:1.8rem;margin-bottom:20px;text-align:center}.recipes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;width:100%;max-width:1200px;justify-content:center}.recipe-card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;transition:all .3s}.recipe-card:hover{transform:translateY(-5px);box-shadow:0 4px 16px #00000026}.recipe-card.selected{border:2px solid #ff6b6b}.recipe-card h3{color:#333;margin-top:0;margin-bottom:10px}.match-info{margin-bottom:15px}.score{background:#ffe66d;color:#6d4c41;padding:4px 8px;border-radius:4px;font-size:.9rem;font-weight:600}.ingredients p{font-size:.9rem;color:#666;margin:8px 0 5px}.tag-list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.matched-tag{background:#e8f5e9;color:#2e7d32;padding:4px 8px;border-radius:4px;font-size:.8rem}.missing-tag{background:#ffebee;color:#c62828;padding:4px 8px;border-radius:4px;font-size:.8rem}.recipe-detail{background:#fff;margin-top:30px;padding:30px;border-radius:12px;box-shadow:0 4px 12px #0000001a}.recipe-detail h2{color:#333;margin-top:0}.detail-content{margin:20px 0}.instructions h3{color:#555;font-size:1.3rem;margin-bottom:15px}.instructions p{line-height:1.6;color:#666;white-space:pre-line}.close-button{background:#f0f0f0;color:#666;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;transition:all .3s}.close-button:hover{background:#e0e0e0}.footer{position:fixed;bottom:0;left:0;width:100%;text-align:center;padding:15px 0;color:#666;font-size:.9rem;background-color:#ffffffe6;z-index:99}.modal-content{display:flex;flex-direction:column;gap:20px}.time-and-image-container{display:flex;flex-direction:row;gap:30px;height:auto;width:100%;align-items:stretch}.time-info.detail-time{flex:0 0 auto;min-width:140px;max-width:200px;background:#f8f9fa;padding:20px;border-radius:8px;margin:0;display:flex;flex-direction:column;justify-content:center;gap:60px;box-shadow:0 4px 12px #0000001a;border:1px solid #e9ecef;height:100%}.time-info.detail-time .time-item{display:flex;flex-direction:column;padding:0;gap:8px;width:100%}.time-info.detail-time .label-container{display:flex;align-items:center;gap:5px;width:100%}.time-info.detail-time .time-icon{font-size:16px;line-height:1;flex-shrink:0}.time-info.detail-time .time-label{font-size:.9rem;color:#666;margin:0;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.time-info.detail-time .time-label{font-size:.9rem;color:#666;margin:0;line-height:1}.time-info.detail-time .time-value{font-size:1.1rem;font-weight:600;color:#ff6b6b;margin:0;line-height:1}.recipe-image-container{flex:1;display:flex;justify-content:center;align-items:center;height:100%;max-height:100%;min-height:0;background-color:#f8f9fa;border-radius:12px;overflow:hidden;padding:20px;box-shadow:0 4px 12px #0000001a;border:1px solid #e9ecef}.time-and-image-container{display:flex;gap:20px;width:100%;min-height:0}.image-frame{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:8px;box-shadow:0 4px 12px #0000001a}.recipe-image{width:100%;height:100%;object-fit:cover;transform:scale(1);transform-origin:center;transition:transform .3s ease}.recipe-image:hover{transform:scale(1.05)}@media (max-width: 768px){.modal-content{flex-direction:column}.recipe-image-container{min-height:300px;max-height:450px;height:auto;padding:15px}.recipe-image{max-height:400px;width:100%;height:100%;object-fit:contain}.time-info.detail-time{flex-direction:row;justify-content:space-around;padding:15px}.time-item{flex-direction:row;gap:5px}.time-label{margin-bottom:0}}@media (max-width: 480px){.modal-content{flex-direction:column;gap:15px}.recipe-image-container{min-height:250px;max-height:350px;height:auto;padding:12px}.recipe-image{max-height:300px;width:100%;height:100%;object-fit:contain}}@media (max-width: 440px){.time-and-image-container{flex-direction:row;gap:8px;width:100%;align-items:stretch;height:auto}.time-info.detail-time{padding:2px;flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;justify-content:space-around}.time-item{flex-direction:column;align-items:center;gap:0;padding:0;text-align:center;margin:0}.label-container{display:flex;align-items:center;gap:2px}.time-icon{font-size:10px}.time-label{font-size:9px;margin:0;line-height:1}.time-value{font-size:11px;margin:0;line-height:1;font-weight:500}.recipe-image-container{flex:1;min-width:0;min-height:100px;max-height:140px;padding:4px;display:flex;align-items:center;justify-content:center;height:100%}.image-frame{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.recipe-image{max-height:120px;width:100%;height:100%;object-fit:cover}}.hero-section{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:80vh;padding:2rem 1rem;text-align:center;overflow:hidden}.hero-content{position:relative;z-index:10;max-width:800px;width:100%}.hero-title{font-size:3.5rem;font-weight:800;color:#e63946;margin-bottom:.5rem;letter-spacing:-1px;text-shadow:0px 2px 4px rgba(0,0,0,.1)}.hero-subtitle{font-size:1.2rem;color:#555;margin-bottom:2rem;font-weight:300}.search-container{margin-top:2rem;width:100%}.hero-input{font-size:1.1rem;padding:1rem 1.5rem;border-radius:50px;border:2px solid #e9ecef;box-shadow:0 4px 12px #0000000d;transition:all .3s ease;width:100%}.hero-input:focus{border-color:#e63946;box-shadow:0 0 0 3px #e639461a;outline:none}.hero-button{font-size:1.1rem;padding:1rem 2rem;border-radius:50px;background-color:#e63946;color:#fff;border:none;cursor:pointer;font-weight:600;transition:all .3s ease;box-shadow:0 4px 12px #e639464d}.hero-button:hover{background-color:#d62828;transform:translateY(-2px);box-shadow:0 6px 16px #e6394666}.recipe-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px}.recipe-modal{background:#fff;border-radius:12px;box-shadow:0 10px 30px #0003;width:900px;max-height:90vh;overflow-y:auto;position:relative}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:25px 30px 15px;border-bottom:1px solid #eee;position:sticky;top:0;background:#fff;z-index:10}.modal-title-container{display:flex;align-items:flex-end;gap:12px;flex-grow:1}.modal-header h2{margin:0;font-size:1.8rem;color:#333}.modal-close{background:none;border:none;font-size:2rem;cursor:pointer;color:#999;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;transition:color .2s}.modal-close:hover{color:#333}.modal-content{padding:20px 30px}.image-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000c;display:flex!important;justify-content:center;align-items:center;z-index:9999;padding:20px;opacity:1;visibility:visible}.image-modal-content{position:relative;max-width:90%;max-height:90%;display:flex;justify-content:center;align-items:center}.enlarged-image{max-width:100%;max-height:90vh;width:auto;height:auto;object-fit:contain;border-radius:8px;transform:scale(1.5)}.image-modal-close{position:absolute;top:10px;right:10px;background:none;border:none;font-size:2.5rem;color:#fff;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;z-index:10000}.floating-copy-button{position:absolute;top:20px;right:60px;background-color:#3498db;color:#fff;border:none;border-radius:6px;padding:10px 16px;font-size:.9rem;cursor:pointer;z-index:1001;box-shadow:0 2px 10px #0000001a;transition:all .2s ease}.recipe-modal .floating-copy-button{position:absolute;top:20px;right:60px;z-index:1002}.instructions-with-copy{position:relative;width:100%}.copy-button-steps{background-color:#3498db;color:#fff;border:none;border-radius:6px;padding:10px 16px;font-size:.9rem;cursor:pointer;white-space:nowrap;box-shadow:0 2px 10px #0000001a;transition:all .2s ease;position:absolute;top:0;right:0;z-index:1002}.copy-button-steps:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 4px 15px #00000026}.copy-button-steps.copied{background-color:#27ae60}.floating-copy-button:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 4px 15px #00000026}.floating-copy-button.copied{background-color:#27ae60}.input-with-button{position:relative;display:flex;width:100%;box-sizing:border-box}.ingredient-input.hero-input{flex:1;padding-right:150px;border-radius:50px;border:2px solid #ddd;background-color:#fff}.button-overlay-container{position:absolute;right:2px;top:2px;bottom:2px;display:flex;align-items:center;justify-content:center;z-index:10;width:140px}.search-button.hero-button{width:100%;height:100%;border:none;border-radius:50px;cursor:pointer;font-size:16px;padding:10px;font-weight:700;transition:all .3s ease;text-align:center;display:flex;align-items:center;justify-content:center;white-space:nowrap;background-color:#e74c3c;color:#fff;z-index:10}.search-button.hero-button:hover{background-color:#c0392b;transform:scale(1.05)}.random-recipe-section{position:fixed;bottom:60px;left:50%;transform:translate(-50%);z-index:100;display:flex;justify-content:center;margin:0;width:auto}.random-recipe-button{font-size:1.2rem;padding:1rem 2.5rem;border-radius:50px;background-color:#e63946;color:#fff;border:none;cursor:pointer;font-weight:600;transition:all .3s ease;box-shadow:0 4px 12px #e639464d}.random-recipe-button:hover{background-color:#d62828;color:#fff;transform:translateY(-2px);box-shadow:0 6px 16px #e6394666}@media (min-width: 1440px){.app{max-width:1400px;padding:30px}.hero-title{font-size:4rem}.hero-subtitle{font-size:1.3rem}.hero-input{font-size:1.2rem;padding:1.2rem 1.8rem}.hero-button{font-size:1.2rem;padding:1.2rem 2.5rem}.random-recipe-button{font-size:1.3rem;padding:1.2rem 3rem}.hero-content{max-width:900px}}@media (max-width: 1439px) and (min-width: 1200px){.app{max-width:1200px;padding:25px}.hero-content{max-width:800px}}@media (max-width: 1199px) and (min-width: 1024px){.app{max-width:100%;padding:20px}.hero-title{font-size:3.5rem}.hero-subtitle{font-size:1.2rem}.hero-content{max-width:700px}}@media (max-width: 1023px) and (min-width: 768px){.app{padding:15px}.hero-title{font-size:3rem}.hero-subtitle,.hero-input,.hero-button{font-size:1.1rem}.random-recipe-button{font-size:1.1rem;padding:1rem 2.2rem}.hero-content{max-width:90%}}@media (max-width: 767px) and (min-width: 480px){.app{padding:10px}.hero-section{min-height:65vh;padding:1.5rem 1rem}.hero-title{font-size:2.5rem}.hero-subtitle{font-size:1rem}.hero-input{font-size:1rem;padding:1rem 1.5rem}.hero-button{font-size:1rem;padding:1rem 2rem}.random-recipe-button{font-size:1rem;padding:.9rem 2rem}.hero-content{padding:0 1rem}.input-group{flex-direction:column;gap:15px}.hero-input,.hero-button{width:100%}}@media (max-width: 479px) and (min-width: 360px){.app{padding:8px}.hero-section{min-height:60vh;padding:1rem .5rem}.hero-title{font-size:2.2rem}.hero-subtitle{font-size:.95rem;margin-bottom:1.5rem}.hero-input{font-size:.95rem;padding:.9rem 1.3rem}.hero-button{font-size:.95rem;padding:.9rem 1.8rem}.random-recipe-button{font-size:.95rem;padding:.8rem 1.8rem}.hero-content{padding:0 1rem}.floating-ingredient{font-size:.9rem}}@media (max-width: 359px){.app{padding:5px}.hero-section{min-height:55vh;padding:.5rem .3rem}.hero-title{font-size:1.8rem}.hero-subtitle{font-size:.85rem;margin-bottom:1.2rem}.hero-input{font-size:.85rem;padding:.8rem 1.2rem}.hero-button{font-size:.85rem;padding:.8rem 1.5rem}.random-recipe-button{font-size:.85rem;padding:.7rem 1.5rem}.hero-content{padding:0 .8rem}.floating-ingredient{font-size:.75rem}}.loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center;height:200px;font-size:18px;color:#666}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tabs{display:flex;margin-bottom:20px;border-bottom:2px solid #eee}.tab{padding:10px 20px;background:none;border:none;cursor:pointer;font-size:16px;color:#666;transition:all .3s ease;position:relative}.tab:hover{color:#3498db}.tab.active{color:#3498db;font-weight:700}.tab.active:after{content:"";position:absolute;bottom:-2px;left:0;width:100%;height:2px;background-color:#3498db}.popular-ingredients{margin-top:15px}.popular-ingredients span{font-weight:700;margin-right:10px}.popular-tags{display:inline-flex;flex-wrap:wrap;gap:8px}.popular-tag{background-color:#e3f2fd;color:#1976d2;border:1px solid #bbdefb;border-radius:16px;padding:5px 12px;font-size:14px;cursor:pointer;transition:all .2s ease}.popular-tag:hover{background-color:#bbdefb;transform:translateY(-1px)}.recommended-section{margin-top:20px}.recommended-section h2{font-size:24px;margin-bottom:5px}.recommended-subtitle{color:#666;margin-bottom:20px;font-size:16px}.recommended-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.recommended-card{background:#fff;border-radius:8px;box-shadow:0 2px 10px #00000014;padding:20px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.recommended-card:hover{transform:translateY(-4px);box-shadow:0 6px 20px #0000001f}.details-button{background-color:#3498db;color:#fff;border:none;border-radius:4px;padding:8px 16px;font-size:14px;cursor:pointer;margin-top:15px;transition:background-color .2s ease}.details-button:hover{background-color:#2980b9}.time-info{display:flex;gap:15px;align-items:center;margin:10px 0;font-size:.85rem;color:#666}.time-icon{font-size:16px;margin-right:4px}.time-label{font-size:.85rem;color:#666;margin-bottom:5px}.time-value{font-size:1.1rem;font-weight:600;color:#ff6b6b}.ingredient-count{display:flex;align-items:center;gap:5px;font-size:14px;color:#666;margin-top:5px}.ingredient-icon{font-size:16px}.score.high{color:#27ae60;font-weight:700}.score.medium{color:#f39c12;font-weight:700}.score.low{color:#e74c3c;font-weight:700}.more-tag{background-color:#f8f9fa;color:#6c757d;border:1px solid #dee2e6;border-radius:12px;padding:2px 8px;font-size:12px;margin-left:4px}.matched-section,.missing-section{margin-bottom:15px}.matched-section h4,.missing-section h4{margin-bottom:8px;font-size:16px}.ingredient-tag{background-color:#f8f9fa;color:#495057;border:1px solid #dee2e6;border-radius:16px;padding:4px 12px;font-size:14px;margin:4px;display:inline-block}.instructions-list{display:flex;flex-direction:column;gap:15px}.instruction-step{display:flex;gap:15px;align-items:flex-start}.step-number{background-color:#3498db;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:14px;font-weight:700;flex-shrink:0}.instruction-step p{margin:0;line-height:1.6}.loading{text-align:center;padding:40px;color:#666;font-size:1.2rem}.filter-section{margin:20px 0}.category-filter{display:flex;align-items:center;gap:10px}.category-filter span{color:#666;font-size:.9rem}.category-select{padding:8px 12px;border:1px solid #e0e0e0;border-radius:6px;background:#fff;color:#333;font-size:.9rem;cursor:pointer}.category-select:focus{outline:none;border-color:#ff6b6b}.recipe-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.category-badge{background:#4ecdc4;color:#fff;padding:4px 8px;border-radius:4px;font-size:.75rem;font-weight:600}.category-badge.large{padding:6px 12px;font-size:.9rem}.detail-time{background:#f8f9fa;padding:15px;border-radius:8px;margin:20px 0;flex-wrap:wrap}.time-item{display:flex;flex-direction:row;align-items:center;padding:0;gap:8px;white-space:nowrap}.ingredients-and-instructions{margin:20px 0}.ingredients-section,.instructions{margin-bottom:30px}.ingredients-section h4,.instructions h4{color:#555;font-size:1.3rem;margin-bottom:15px;border-bottom:2px solid #eee;padding-bottom:8px}.section-header{margin-bottom:10px}.section-header h5{margin:0 0 8px;color:#666;font-size:1rem}.all-ingredients{flex-wrap:wrap;gap:8px}@media (min-width: 768px){.ingredients-and-instructions{display:flex;flex-direction:row;gap:30px}.ingredients-section{flex:0 0 300px;min-width:250px}.instructions{flex:1;min-width:0}.ingredients-section{margin-right:0}}.detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #eee}.copy-button{background-color:#3498db;color:#fff;border:none;border-radius:4px;padding:8px 16px;font-size:14px;cursor:pointer;transition:background-color .2s ease}.copy-button:hover{background-color:#2980b9}.copy-button.copied{background-color:#27ae60}@media (prefers-color-scheme: dark){.search-section,.recipe-card,.recipe-detail{background:#2a2a2a;color:#e0e0e0}.header h1{color:#ff8787}.subtitle,.results-section h2,.recipe-card h3,.recipe-detail h2,.instructions h3{color:#e0e0e0}.ingredient-input{background:#3a3a3a;border-color:#555;color:#e0e0e0}.tag{background:#444;color:#e0e0e0}.tag:hover{background:#555}.loading{color:#aaa}.category-select{background:#3a3a3a;border-color:#555;color:#e0e0e0}.time-info{color:#aaa}.detail-time{background:#3a3a3a}.time-label{color:#aaa}.tabs{border-bottom-color:#444}.tab{color:#aaa}.tab:hover,.tab.active{color:#3498db}.popular-tag{background-color:#1a2530;color:#6bb1e0;border-color:#34495e}.popular-tag:hover{background-color:#2c3e50}.recommended-card{background-color:#2a2a2a;border:1px solid #444;box-shadow:0 2px 10px #0000004d}.recommended-card:hover{box-shadow:0 6px 20px #0006}.loading-spinner{border-color:#444;border-top-color:#3498db}.more-tag{background-color:#333;color:#aaa;border-color:#555}.ingredient-tag{background-color:#333;color:#ddd;border-color:#555}.step-number{background-color:#2980b9}.copy-button{background-color:#3498db}.copy-button:hover{background-color:#2980b9}.copy-button.copied{background-color:#27ae60}.recipe-card,.recipe-detail{background-color:#2a2a2a;border:1px solid #444}.category-badge{background-color:#444;color:#ddd}.matched-tag{background-color:#1e4e1e;color:#a8e6cf}.missing-tag{background-color:#4e1e1e;color:#ffb3ba}.close-button,.search-button{background-color:#3498db}.close-button:hover,.search-button:hover{background-color:#2980b9}}.App{padding-top:20px;transition:padding-top .8s cubic-bezier(.4,0,.2,1)}.App.viewing-results{padding-top:0}.hero-section{transform:translateY(0);transition:transform .8s cubic-bezier(.4,0,.2,1);position:relative;z-index:10}.App.viewing-results .hero-section{transform:translateY(-100px)}.results-section{transition:all .8s cubic-bezier(.4,0,.2,1);position:relative;z-index:15}.App.viewing-results .results-section{margin-top:-100px;transform:translateY(-170px);max-height:60vh;z-index:5}.App.viewing-results .random-recipe-section{position:fixed;bottom:60px;right:30px;left:auto;transform:translate(0);z-index:100;transition:all .8s cubic-bezier(.4,0,.2,1)}.results-header{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:1200px;margin-bottom:20px;position:relative;z-index:20}.back-to-search-button{background:#ff6b6b;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:.9rem;cursor:pointer;transition:background .3s,transform .2s;position:relative;z-index:30}.back-to-search-button:active{transform:scale(.95)}.back-to-search-button:hover{background:#ff5252}.animated-background{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:hidden}.floating-item{position:absolute;font-weight:500;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:all .3s ease,transform .5s ease;animation:floatAnimation var(--animation-duration, 15s) ease-in-out infinite;text-shadow:1px 1px 2px rgba(0,0,0,.3);filter:blur(.3px);will-change:transform,opacity}.floating-ingredient{opacity:.4}.floating-ingredient.attracting{animation-duration:1s;animation-timing-function:ease-in-out;opacity:.3}.floating-ingredient.repelling{animation-duration:1.5s;animation-timing-function:ease-out;opacity:.15;transition:opacity .5s ease}.floating-ingredient.merging{color:#f4a261;opacity:.3;transform:scale(1);z-index:5;animation:moveToCenter 1s ease-in-out forwards}.merging-container{position:absolute;pointer-events:none}.merging-ingredient{font-weight:400;opacity:.4;z-index:11}.merging-result{font-weight:400;font-size:1rem;color:#2a9d8f;opacity:.4;z-index:12}.merged-dish{font-weight:700;opacity:.5}@keyframes floatAnimation{0%{transform:translate(0) rotate(0) translate(var(--attraction-speed-x, 0px),var(--attraction-speed-y, 0px))}20%{transform:translate(var(--move-speed-x, 30px),calc(var(--move-speed-y, 20px) * -1)) rotate(var(--rotate-degree-1, 1.5deg)) translate(var(--attraction-speed-x, 0px),var(--attraction-speed-y, 0px))}40%{transform:translate(calc(var(--move-speed-x, 30px) * var(--direction-x-1, .5)),var(--move-speed-y, 20px)) rotate(var(--rotate-degree-2, -1deg)) translate(var(--attraction-speed-x, 0px),var(--attraction-speed-y, 0px))}60%{transform:translate(calc(var(--move-speed-x, 30px) * -1),calc(var(--move-speed-y, 20px) * var(--direction-y-1, .8))) rotate(var(--rotate-degree-3, .5deg)) translate(var(--attraction-speed-x, 0px),var(--attraction-speed-y, 0px))}80%{transform:translate(calc(var(--move-speed-x, 30px) * var(--direction-x-2, -.7)),calc(var(--move-speed-y, 20px) * var(--direction-y-2, -.3))) rotate(var(--rotate-degree-4, -2deg)) translate(var(--attraction-speed-x, 0px),var(--attraction-speed-y, 0px))}to{transform:translate(0) rotate(0) translate(var(--attraction-speed-x, 0px),var(--attraction-speed-y, 0px))}}@keyframes fadeOut{0%{opacity:var(--current-opacity, .4)}to{opacity:0}}@keyframes moveToPosition{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--move-x, 0),var(--move-y, 0)) scale(0);opacity:0}}@keyframes moveToCenter{0%{transform:translate(0) scale(1);opacity:.4}to{transform:translate(0) scale(.5);opacity:0}}@keyframes mergeAnimation{0%{opacity:0;transform:scale(.8)}30%{opacity:.5;transform:scale(1.05);filter:blur(.3px)}70%{opacity:.5;transform:scale(1)}to{opacity:0;transform:scale(.9);filter:blur(.3px)}}@media (max-width: 768px){.floating-item{font-size:.7rem!important}.merging-ingredients{font-size:.8rem!important}.merging-ingredients .ingredient,.merged-dish{padding:1px 5px;border-radius:8px}}*{box-sizing:border-box;margin:0;padding:0}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--primary-color: #e63946;--secondary-color: #f1faee;--dark-color: #1d3557;--light-color: #f8f9fa;--text-color: #333;--text-light: #666}body{margin:0;padding:0;min-width:320px;min-height:100vh;background-color:var(--light-color);color:var(--text-color);overflow-x:hidden}button{font-family:inherit;cursor:pointer;outline:none}a{text-decoration:none;color:inherit}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:0}img{max-width:100%;height:auto}