:root{color-scheme:light;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.6;--green-50: #f0fdf4;--green-100: #dcfce7;--green-200: #bbf7d0;--green-600: #16a34a;--green-700: #15803d;--green-800: #166534;--amber-50: #fffbeb;--amber-100: #fef3c7;--amber-600: #d97706;--rose-50: #fff1f2;--rose-100: #ffe4e6;--rose-600: #e11d48;--sky-50: #f0f9ff;--sky-100: #e0f2fe;--sky-600: #0284c7;--violet-50: #f5f3ff;--violet-100: #ede9fe;--violet-600: #7c3aed}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:#fafaf9;color:#1c1917}.app{min-height:100vh}.hero{background:linear-gradient(135deg,#ecfdf5,#f0fdf4 40%,#fffbeb);padding:3.5rem 1.5rem 3rem;text-align:center;border-bottom:1px solid #d1fae5}.hero-emoji{font-size:3rem;margin-bottom:.75rem;display:block}.hero h1{font-size:2.25rem;font-weight:700;letter-spacing:-.03em;color:#14532d;margin-bottom:.5rem}.hero p{font-size:1.1rem;color:#44403c;max-width:36rem;margin:0 auto}.search-bar{max-width:28rem;margin:1.5rem auto 0;position:relative}.search-bar input{width:100%;padding:.75rem 1rem .75rem 2.75rem;border:1px solid #d6d3d1;border-radius:9999px;font-size:.95rem;background:#fff;color:#1c1917;outline:none;transition:border-color .2s}.search-bar input:focus{border-color:#16a34a;box-shadow:0 0 0 3px #16a34a1a}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#a8a29e;font-size:1rem;pointer-events:none}.categories{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;padding:1.5rem 1.5rem 0;max-width:48rem;margin:0 auto}.cat-pill{padding:.4rem 1rem;border-radius:9999px;border:1px solid #d6d3d1;background:#fff;font-size:.85rem;cursor:pointer;transition:all .2s;color:#44403c;font-weight:500}.cat-pill:hover{border-color:#16a34a;color:#16a34a}.cat-pill.active{background:#16a34a;color:#fff;border-color:#16a34a}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem;max-width:64rem;margin:2rem auto;padding:0 1.5rem 3rem}.card{background:#fff;border:1px solid #e7e5e4;border-radius:1rem;padding:1.5rem;transition:box-shadow .2s,transform .2s;cursor:default}.card:hover{box-shadow:0 8px 24px #0000000f;transform:translateY(-2px)}.card-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.card-emoji{font-size:2rem;width:3rem;height:3rem;display:grid;place-items:center;border-radius:.75rem;flex-shrink:0}.card h2{font-size:1.15rem;font-weight:650;color:#1c1917;line-height:1.3}.card-category{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;margin-top:.15rem;display:inline-block;padding:.1rem .5rem;border-radius:9999px}.card p{font-size:.9rem;color:#57534e;margin-bottom:1rem;line-height:1.6}.benefits{list-style:none;padding:0;margin:0 0 1rem}.benefits li{font-size:.85rem;color:#44403c;padding:.3rem 0 .3rem 1.5rem;position:relative}.benefits li:before{content:"✓";position:absolute;left:0;color:#16a34a;font-weight:700}.how-to{background:#fafaf9;border-radius:.5rem;padding:.75rem 1rem;font-size:.85rem;color:#57534e;border:1px solid #f5f5f4}.how-to strong{display:block;color:#1c1917;margin-bottom:.25rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}.tag-badge{display:inline-block;font-size:.7rem;padding:.15rem .5rem;border-radius:9999px;margin-right:.35rem;margin-top:.5rem;font-weight:500}.footer{text-align:center;padding:2rem 1rem;color:#a8a29e;font-size:.8rem;border-top:1px solid #e7e5e4;background:#fff}.no-results{grid-column:1 / -1;text-align:center;padding:3rem 1rem;color:#a8a29e}.no-results span{font-size:2.5rem;display:block;margin-bottom:.5rem}@media(max-width:640px){.hero h1{font-size:1.75rem}.grid{grid-template-columns:1fr}}