@import"https://fonts.googleapis.com/css2?family=Neucha&display=swap";#root{font-family:Neucha,serif}body{padding-bottom:5em;height:100vh;background-color:#fff2e1}@media (min-width: 768px){body{margin-left:10em;margin-right:10em}}form{display:flex;align-items:center;justify-content:center;width:100%;max-width:800px;margin:0 auto}input{border:1px solid #ccc;outline:none;padding:16px 15px;font-size:20px;font-family:Neucha,serif;border-radius:25px;flex:1;margin-right:20px;transition:all .3s ease}input::placeholder{color:#888}input:focus{border-color:#af8260;background-color:#fff}button{background-color:#e4c59e;border:1px solid #e4c49e4d;padding:8px;border-radius:25px;cursor:pointer;font-size:10px;color:#fff;transition:background-color .3s ease,transform .2s ease}button:hover{background-color:#af8260;transform:translateY(-2px)}button:active{background-color:#af8260;transform:translateY(1px)}.recipe-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:2em}.recipe-card{display:flex;flex-direction:column;justify-content:space-evenly;background-color:#fff;padding:1em;box-shadow:0 4px 12px #0000001a;position:relative;cursor:pointer;gap:1.5em}.recipe-card h3{font-size:1.5em;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-more-button{font-size:16px;padding:1em;font-weight:700;margin:auto}.app-container{margin-top:40px;display:flex;flex-direction:column;gap:2em}.header{position:relative;width:100%;height:auto;padding:40px 0;background-color:#af8260;border-radius:2em}.header .logo{position:relative;display:block;margin:0 auto;width:80%;max-width:400px;height:auto}.img{position:absolute;top:50%;left:50%;width:2000px;transform:translate(-50%,-50%);color:#000;font-size:5em;text-align:center;padding:.5em 1.5em}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;z-index:1;display:flex;justify-content:center;align-items:center;animation:fadeIn .3s ease-in-out}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;box-shadow:0 10px 30px #0000001a;border-radius:10px;overflow:hidden;animation:modalAppear .3s ease-in-out;max-width:800px;width:95%;background-color:#fff;font-size:1.2em}.modal-header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;background-color:#f8f8f8;padding:20px;border-bottom:1px solid #ddd;font-size:1.5em;font-weight:700;color:#333}.modal-content{padding:25px;background-color:#fff;color:#555;font-size:1.2em;line-height:1.6;border-radius:6px}.close-btn{font-size:32px;font-weight:700;color:#666;cursor:pointer;transition:color .3s}.close-btn:hover{color:#333}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalAppear{0%{transform:translate(-50%,-50%) scale(.9)}to{transform:translate(-50%,-50%) scale(1)}}.tabs{display:flex;gap:2em;cursor:pointer;background-color:#c8c2bc;padding-left:150px;margin:0;font-size:large;height:60px}.tab-active{background-color:#d2665a;color:#000;font-weight:600;border-radius:0 0 20px 20px;height:28px;padding:10px}.tab-active:hover{background-color:#a04747;transform:translateY(-1px)}.tab-s:hover,.tab-f:hover{background-color:#d8a25e;transform:translateY(-1px)}.tab-s,.tab-f{background-color:#fada7a;height:18px;color:#474747d5;border-radius:0 0 20px 20px;padding:10px}.recipe-card-title{display:flex;align-items:center;gap:.5em}