@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;700;900&display=swap";:root{--primary:#ff4757;--accent:#ffa502;--glass:#ffffffb3;--glass-border:#ffffff4d;--text-dark:#2f3542;--gradient-bg:linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);--card-shadow:0 20px 40px #0000001a}body{background-color:#f1f2f6;background-image:radial-gradient(at 0 0,#ff475726 0,#0000 50%),radial-gradient(at 100% 0,#4ecdc426 0,#0000 50%),radial-gradient(at 100% 100%,#ffa50226 0,#0000 50%),radial-gradient(at 0 100%,#70a1ff26 0,#0000 50%);background-attachment:fixed;min-height:100vh;margin:0;font-family:Outfit,sans-serif;overflow-x:hidden}.app-header{text-align:center;perspective:1000px;padding:60px 20px}.app-header h1{background:linear-gradient(90deg,#ff4757,#ffa502);-webkit-text-fill-color:transparent;letter-spacing:-2px;-webkit-background-clip:text;margin:0;font-size:clamp(2.5rem,8vw,4.5rem);font-weight:900;animation:3s ease-in-out infinite titleFloat}@keyframes titleFloat{0%,to{transform:translateY(0)rotateX(0)}50%{transform:translateY(-10px)rotateX(5deg)}}.subtitle{color:var(--text-dark);opacity:.7;font-size:1.2rem;font-weight:300}.meal-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:40px;max-width:1300px;margin:0 auto;padding:0 20px 100px;display:grid}.meal-card{background:var(--glass);-webkit-backdrop-filter:blur(15px);border:1px solid var(--glass-border);box-shadow:var(--card-shadow);border-radius:30px;flex-direction:column;transition:all .5s cubic-bezier(.175,.885,.32,1.275);animation:.8s ease-out backwards cardEntrance;display:flex;position:relative;overflow:hidden}@keyframes cardEntrance{0%{opacity:0;transform:scale(.9)translateY(30px)}to{opacity:1;transform:scale(1)translateY(0)}}.meal-card:hover{border-color:var(--primary);transform:scale(1.03)translateY(-15px);box-shadow:0 30px 60px #ff475733}.card-image{height:250px;position:relative;overflow:hidden}.card-image img{object-fit:cover;width:100%;height:100%;transition:transform .8s cubic-bezier(.2,1,.3,1)}.meal-card:hover .card-image img{transform:scale(1.1)rotate(2deg)}.category-badge{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:#fff;text-transform:uppercase;z-index:2;background:#0009;border-radius:12px;padding:6px 15px;font-size:.7rem;font-weight:700;position:absolute;bottom:20px;left:20px}.card-content{flex-direction:column;flex-grow:1;padding:25px;display:flex}.meal-title{color:var(--text-dark);margin-bottom:8px;font-size:1.5rem;font-weight:700;line-height:1.2}.area-tag{color:var(--primary);text-transform:uppercase;letter-spacing:1px;margin-bottom:15px;font-size:.8rem;font-weight:700;display:block}.meal-desc{color:#57606f;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-bottom:25px;font-size:.95rem;display:-webkit-box;overflow:hidden}.card-footer{align-items:center;gap:15px;margin-top:auto;display:flex}.view-btn{background:var(--text-dark);color:#fff;cursor:pointer;border:none;border-radius:15px;flex:1;padding:12px 25px;font-weight:600;transition:all .3s}.view-btn:hover{background:var(--primary);box-shadow:0 10px 20px #ff47574d}.youtube-link{color:#fff;background:red;border-radius:15px;justify-content:center;align-items:center;width:45px;height:45px;font-size:0;text-decoration:none;transition:all .3s;display:flex}.youtube-link:before{content:"▶";font-size:1.2rem}.youtube-link:hover{transform:rotate(15deg)scale(1.1);box-shadow:0 5px 15px #f006}.spinner{border:4px solid #0000;border-top-color:var(--primary);border-bottom-color:var(--accent);border-radius:50%;width:80px;height:80px;margin:0 auto;animation:1s linear infinite steamSpin}@keyframes steamSpin{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.2)}to{transform:rotate(360deg)scale(1)}}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#f1f2f6}::-webkit-scrollbar-thumb{background:linear-gradient(var(--primary), var(--accent));border-radius:10px}