:root{--color-black: #121212;--color-dark-grey: #2c2c2c;--color-grey: #444;--color-red: #c62828;--color-beige: #f5f5dc;--color-white: #ffffff;--color-overlay: rgba(0, 0, 0, .6)}*{box-sizing:border-box;margin:0;padding:0}html,body{font-family:serif;background:var(--color-black);color:var(--color-beige);height:100%;overflow-x:hidden}body{position:relative;min-height:100vh;font-family:Geneva,Verdana,sans-serif;color:var(--color-beige);margin:0;background:url(/assets/GPT_BG-Cmm2mzvx.png) no-repeat center center fixed;background-size:cover;overflow-x:hidden}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);z-index:-1;pointer-events:none}header{position:fixed;top:0;width:100%;padding:1rem 2rem;background-color:#000000a1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--color-beige);z-index:100;text-align:center;border-bottom:1px solid var(--color-grey)}header h1{font-size:2rem;color:var(--color-red)}.main-card{max-width:800px;margin:12rem auto 2rem;background-color:#1c1c1ce6;border-radius:16px;padding:2rem;box-shadow:0 8px 24px #000000e6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;flex-direction:column;gap:2rem}.input-row{display:flex;gap:1rem;width:100%}.input-row input{flex:1;padding:.75rem 1rem;border:none;border-radius:8px;background-color:var(--color-grey);color:var(--color-white);font-size:1rem}.input-row input::placeholder{color:var(--color-beige);opacity:.7}.input-row button{background-color:var(--color-red);color:var(--color-beige);padding:.75rem 1.2rem;border:none;font-family:Georgia,serif;font-weight:600;border-radius:8px;font-size:1rem;cursor:pointer;transition:background .3s ease}.input-row button:hover{background-color:#ec9616;color:var(--color-dark-grey)}.ingredients-section{background-color:#f5f5dc1a;border-left:4px solid var(--color-red);padding:1rem 1.5rem;border-radius:12px;color:var(--color-beige);gap:1rem}.ingredients-section h2{color:var(--color-beige);margin-bottom:.9rem}.ingredients-section ul{list-style-type:disc;padding-left:1.75rem;margin:.5rem 0 1rem}.ingredients-section li{font-family:Verdana,sans-serif;margin-bottom:.5rem}.ingredients-section button{font-family:Georgia,serif;font-weight:600;background-color:var(--color-red);color:var(--color-white);padding:.5rem 1rem;border:none;border-radius:6px;cursor:pointer;transition:background .3s ease}.ingredients-section button:hover{background-color:#b71c1c}.get-recipe-container{background-color:#f5f5dccc;border:1px solid var(--color-red);border-radius:12px;padding:1rem 1.5rem;margin-top:1.5rem;color:var(--color-dark-grey);display:flex;justify-content:space-between;align-items:center;gap:1rem;box-shadow:0 4px 10px #c6282833;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.get-recipe-container h3{font-family:Georgia,serif;margin:0;color:var(--color-red);font-size:1.25rem}.get-recipe-container p{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;color:var(--color-dark-grey);font-size:1rem;opacity:.85;flex:1}.get-recipe-container button{background-color:var(--color-red);color:var(--color-beige);border:none;border-radius:8px;padding:.6rem 1.2rem;cursor:pointer;font-size:1rem;transition:background-color .3s ease}.get-recipe-container button:hover{background-color:#ec9616;color:var(--color-dark-grey)}.recipe-section{background-color:#ffffff0a;border:1px solid var(--color-grey);border-left:6px solid var(--color-red);border-radius:16px;padding:2rem;color:var(--color-beige);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 6px 16px #00000080;margin-top:2rem}.recipe-section h3{color:var(--color-red);font-size:1.5rem;margin-bottom:1rem}.recipe-section p,.recipe-section li{font-size:1rem;line-height:1.7;margin-bottom:.75rem;color:var(--color-beige);font-family:serif}.recipe-section ul{list-style:disc;padding-left:1.5rem}.loader-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-black);color:var(--color-beige);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:999;opacity:1;transition:opacity .5s ease}.loader-overlay.fade-out{opacity:0;pointer-events:none}.spinner{width:48px;height:48px;border:6px solid var(--color-beige);border-top:6px solid var(--color-red);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem;font-family:Georgia,serif;font-weight:600}@keyframes spin{to{transform:rotate(360deg)}}.app-content{opacity:0;animation:fadeIn .8s ease forwards;animation-delay:.2s}@keyframes fadeIn{to{opacity:1}}
