:root{--primary-color: #D17557;--primary-hover: #e88b6b;--bg-color: #1C1917;--card-bg: #292524;--text-main: #E7E5E4;--text-muted: #A8A29E;--input-bg: #292524;--border-color: #44403C;--chip-bg: #431407;--chip-text: #FDBA74;--button-bg: #D17557;--button-text: #FFFFFF;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 4px 6px -2px rgba(0, 0, 0, .2);--radius: 8px}*{box-sizing:border-box}body{margin:0;font-family:Inter,sans-serif;background-color:var(--bg-color);color:var(--text-main);-webkit-font-smoothing:antialiased;min-height:100vh}header{display:flex;justify-content:center;align-items:center;gap:12px;height:80px;background-color:var(--card-bg);border-bottom:1px solid var(--border-color);box-shadow:var(--shadow-sm);margin-bottom:40px}header>img{width:45px}header>h1{font-weight:600;font-size:1.5rem;color:var(--text-main);letter-spacing:-.5px}main{padding:0 15px 60px;max-width:750px;margin:0 auto}.add-ingredient-form{display:flex;justify-content:center;gap:12px;height:48px;margin-bottom:40px}.add-ingredient-form>input{border-radius:var(--radius);border:1px solid var(--border-color);background-color:var(--input-bg);color:var(--text-main);padding:9px 16px;box-shadow:var(--shadow-sm);flex-grow:1;min-width:150px;font-size:1rem;transition:border-color .2s}.add-ingredient-form>input::placeholder{color:#78716c}.add-ingredient-form>input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #d1755733}.add-ingredient-form>button{font-family:Inter,sans-serif;border-radius:var(--radius);border:none;background-color:var(--button-bg);color:var(--button-text);padding:0 28px;font-size:.9rem;font-weight:600;cursor:pointer;transition:background-color .2s}.add-ingredient-form>button:hover{background-color:var(--primary-hover)}.add-ingredient-form>button:before{content:"+";margin-right:6px}section>h2{font-size:1.25rem;font-weight:700;margin-bottom:1rem;color:var(--text-main)}ul.ingredients-list{margin-bottom:48px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:12px}ul.ingredients-list>li{background-color:var(--chip-bg);color:var(--chip-text);border:1px solid #572818;padding:8px 18px;border-radius:50px;font-weight:600;font-size:.95rem;box-shadow:var(--shadow-sm);animation:popIn .3s cubic-bezier(.175,.885,.32,1.275) forwards}@keyframes popIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.get-recipe-container{display:flex;justify-content:space-between;align-items:center;border-radius:var(--radius);background:linear-gradient(135deg,#431407,#292524);border:1px solid var(--primary-color);padding:24px 32px;box-shadow:var(--shadow-md);margin-bottom:40px}.get-recipe-container h3{font-size:1.2rem;font-weight:700;margin:0 0 4px;color:#fff}.get-recipe-container p{color:#d6d3d1;font-size:.9rem;margin:0}.get-recipe-container button{border:none;border-radius:var(--radius);background-color:var(--primary-color);color:#fff;padding:12px 24px;font-family:Inter,sans-serif;font-size:.9rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .2s;margin-left:20px;box-shadow:0 4px 6px #0000004d}.get-recipe-container button:hover{background-color:var(--primary-hover);transform:translateY(-2px)}.suggested-recipe-container{background-color:var(--card-bg);padding:45px;border-radius:var(--radius);box-shadow:var(--shadow-md);position:relative;overflow:hidden;color:var(--text-muted);border:1px solid var(--border-color)}.suggested-recipe-container:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#d17557,#ea580c)}.suggested-recipe-container h2{font-family:Inter,sans-serif;font-weight:700;font-size:1.75rem;margin-top:0;margin-bottom:1.5rem;color:var(--text-main)}.suggested-recipe-container p,.suggested-recipe-container li{font-family:Merriweather,serif;color:#d6d3d1;line-height:1.8;font-size:1.05rem}.suggested-recipe-container strong{color:#fff;font-weight:700}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:50px}.loader{width:45px;height:45px;border:4px solid #44403C;border-top:4px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:15px}.loading-container p{color:var(--text-muted)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}