@import "https://fonts.googleapis.com/css2?family=Fraunces:wght@600;700;800&family=Work+Sans:wght@400;500;600&display=swap";@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}.absolute{position:absolute}.relative{position:relative}.container{width:100%}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.flex{display:flex}.grid{display:grid}.h-\[200px\]{height:200px}.w-full{width:100%}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-full{border-radius:3.40282e38px}.border-4{border-style:var(--tw-border-style);border-width:4px}.border-\[\#e2c6a3\]{border-color:#e2c6a3}.border-transparent{border-color:#0000}.border-t-\[\#a85b2f\]{border-top-color:#a85b2f}.bg-\[\#f3ece2\]{background-color:#f3ece2}.text-center{text-align:center}.text-\[\#43372b\]{color:#43372b}.text-\[\#a34a2f\]{color:#a34a2f}.opacity-0{opacity:0}.opacity-50{opacity:.5}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}@keyframes fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{opacity:0;animation:.5s ease-out forwards fade-in}.animate-fade-in-up{animation:.6s ease-out forwards fade-in-up}:root{--ink:#2b241b;--muted:#6b5f4b;--paper:#fbf7f0;--border:#eadfce;--clay:#c87954;--clay-dark:#a65b3d;--sage:#7f8559;--sun:#d9aa5f;--espresso:#3b3026;--shadow:0 18px 40px #241c141f;--sans:"Work Sans", system-ui, "Segoe UI", sans-serif;--heading:"Fraunces", "Times New Roman", serif;--mono:ui-monospace, Consolas, monospace;font:18px/155% var(--sans);letter-spacing:.2px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (width<=1024px){:root{font-size:16px}}#root{text-align:center;box-sizing:border-box;flex-direction:column;width:100%;max-width:100%;min-height:100svh;margin:0 auto;display:flex}body{background:var(--paper);margin:0}h1,h2{font-family:var(--heading);color:var(--ink);font-weight:700}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--ink);border-radius:4px;display:inline-flex}code{background:#f3ede3;padding:4px 8px;font-size:15px;line-height:135%}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}.app-shell{min-height:100svh;color:var(--ink);background:linear-gradient(120deg,#f7f1e8 0%,#f3e4cf 45%,#eadac6 100%);position:relative;overflow:hidden}.app-shell:before,.app-shell:after{content:"";filter:blur(80px);opacity:.45;pointer-events:none;border-radius:50%;width:620px;height:620px;position:absolute;inset:auto}.app-shell:before{background:radial-gradient(circle,#d9aa5f,#0000 65%);top:-240px;right:-200px}.app-shell:after{background:radial-gradient(circle,#c87954,#0000 65%);bottom:-260px;left:-220px}.app-container{z-index:1;max-width:1200px;margin:0 auto;padding:32px 20px 72px;position:relative}.hero{text-align:center;margin:12px auto 48px}.hero-badge{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);background:#ffffffb3;border:1px solid #c6956566;border-radius:999px;align-items:center;gap:10px;margin-bottom:18px;padding:8px 16px;font-size:13px;display:inline-flex}.hero-title{font-family:var(--heading);color:var(--espresso);margin:0 0 12px;font-size:clamp(40px,6vw,64px);line-height:1.02}.hero-subtitle{max-width:640px;color:var(--muted);margin:0 auto 18px}.hero-stats{box-shadow:var(--shadow);background:#ffffffb3;border:1px solid #c8965f66;border-radius:999px;flex-wrap:wrap;gap:12px;padding:10px;display:inline-flex}.stat-pill{color:var(--muted);background:#f8f1e8e6;border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-size:14px;display:inline-flex}.stat-value{color:var(--clay-dark);font-weight:700}.state-card{box-shadow:var(--shadow);background:#ffffffb3;border:1px solid #dcc2a299;border-radius:24px;flex-direction:column;align-items:center;gap:14px;padding:24px 28px;display:inline-flex}.meals-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;display:grid}.meal-card{box-shadow:var(--shadow);background:#ffffffe6;border:1px solid #d6bd9eb3;border-radius:24px;flex-direction:column;transition:transform .35s,box-shadow .35s;display:flex;overflow:hidden}.meal-card:hover{transform:translateY(-8px);box-shadow:0 24px 48px #31261a2e}.meal-media{position:relative;overflow:hidden}.meal-media img{object-fit:cover;width:100%;height:200px;transition:transform .6s}.meal-card:hover .meal-media img{transform:scale(1.05)}.meal-tag{color:#f9f4ed;letter-spacing:.04em;background:#7b8559eb;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;position:absolute;top:16px;right:16px}.meal-content{flex-direction:column;flex:1;gap:12px;padding:18px 18px 20px;display:flex}.meal-title{font-family:var(--heading);color:var(--espresso);margin:0;font-size:20px}.meal-description{color:var(--muted);margin:0;font-size:14px;line-height:1.55}.meal-actions{gap:10px;margin-top:auto;display:flex}.meal-button{color:#fff7ec;letter-spacing:.03em;text-transform:uppercase;background:linear-gradient(135deg,#b5652e 0%,#8a4a24 100%);border:1px solid #b3764c99;border-radius:999px;flex:1;padding:10px 14px;font-size:13px;font-weight:600;transition:transform .2s,box-shadow .2s}.meal-button:hover{transform:translateY(-1px);box-shadow:0 10px 18px #72432247}.meal-button.secondary{color:var(--clay-dark);background:0 0}.pager{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:44px;display:flex}.pager-button{color:var(--espresso);background:#fffc;border:1px solid #c6956599;border-radius:999px;padding:12px 22px;font-weight:600;transition:transform .2s,box-shadow .2s}.pager-button.primary{color:#fef7ee;background:linear-gradient(135deg,#b5652e,#6b7a4b);border-color:#0000}.pager-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.pager-button:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 12px 20px #4c382433}.pager-pill{color:var(--muted);background:#ffffffb3;border:1px solid #c6956566;border-radius:999px;padding:12px 18px;font-weight:600}.pager-pill strong{color:var(--clay-dark)}.modal-backdrop{z-index:20;background:#211a12a6;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-card{background:#fff8ef;border:1px solid #c6956566;border-radius:28px;flex-direction:column;width:min(920px,100%);max-height:90vh;display:flex;position:relative;overflow:hidden;box-shadow:0 28px 60px #140e0859}.modal-close{cursor:pointer;z-index:2;width:36px;height:36px;color:var(--espresso);background:#ffffffd9;border:none;border-radius:999px;font-size:18px;position:absolute;top:16px;right:16px;box-shadow:0 8px 18px #140e0840}.modal-hero{height:280px;position:relative;overflow:hidden}.modal-hero img,.modal-image-fallback{object-fit:cover;width:100%;height:100%}.modal-image-fallback{background:linear-gradient(120deg,#f1e5d6,#e3c8a6);justify-content:center;align-items:center;font-size:56px;display:flex}.modal-hero-overlay{text-align:left;color:#fff7ec;background:linear-gradient(#140e0800 15%,#140e08bf 100%);flex-direction:column;justify-content:flex-end;padding:24px;display:flex;position:absolute;inset:0}.modal-hero-overlay h2{color:#fff7ec;margin:0 0 8px;font-size:clamp(24px,3vw,36px)}.modal-meta{flex-wrap:wrap;gap:10px;font-size:14px;display:flex}.modal-meta span{background:#fff7ec33;border:1px solid #fff7ec59;border-radius:999px;padding:6px 12px}.modal-body{text-align:left;padding:24px 28px 12px;overflow-y:auto}.modal-body h3{color:var(--espresso);margin:18px 0 10px;font-size:18px}.modal-tags{flex-wrap:wrap;gap:10px;display:flex}.modal-tags span{color:var(--clay-dark);background:#b3764c26;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600}.modal-ingredients{color:var(--muted);margin:0;padding:0 0 0 16px}.modal-ingredients li{margin-bottom:6px}.modal-instructions{color:var(--muted);white-space:pre-line}.modal-actions{border-top:1px solid #c6956559;gap:12px;padding:16px 28px 24px;display:flex}.modal-actions a{color:var(--clay-dark);background:#b3764c26;border:1px solid #b3764c4d;border-radius:999px;padding:10px 16px;font-weight:600;text-decoration:none}.modal-actions a:hover{background:#b3764c40}@media (width<=768px){.modal-hero{height:220px}.modal-card{max-height:92vh}.modal-actions{flex-direction:column}.hero{margin-bottom:36px}.hero-stats{border-radius:24px}.meals-grid{gap:18px}}
