*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #f0f7e8;--bg-alt: #e8f2dc;--surface: #ffffff;--surface-hover: #f8faf5;--border: #c8ddb0;--border-light: #ddeacc;--text: #2d4a22;--text-secondary: #4a6b3a;--text-muted: #7a9968;--accent: #5ca941;--accent-hover: #4d9235;--accent-light: #e0f0d4;--yellow: #f5c842;--yellow-light: #fef3c7;--blue: #5ba4cf;--blue-light: #dbeafe;--pink: #e88ea0;--pink-light: #fce7f3;--orange: #e8913a;--orange-light: #ffedd5;--radius: 16px;--radius-sm: 10px;--shadow: 0 2px 12px rgba(45, 74, 34, .08);--shadow-hover: 0 4px 20px rgba(45, 74, 34, .14)}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg);color:var(--text);min-height:100vh}#root{width:100%;max-width:960px;margin:0 auto;padding:2rem 1.5rem}.app{display:flex;flex-direction:column;gap:2rem}.hero{text-align:center;padding:3rem 1.5rem;background:linear-gradient(135deg,#5ca941,#7bc462,#5ca941);border-radius:var(--radius);color:#fff;position:relative;overflow:hidden;box-shadow:0 4px 24px #5ca9414d}.hero:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 60%);pointer-events:none}.hero-leaf{font-size:3rem;margin-bottom:.75rem;animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.hero-title{font-size:2.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;text-shadow:0 2px 8px rgba(0,0,0,.15)}.hero-subtitle{font-size:1.25rem;font-weight:700;margin-top:.5rem;opacity:.95}.hero-tagline{font-size:.9rem;font-weight:400;margin-top:.75rem;opacity:.8}.category-nav{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}.category-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.6rem 1.25rem;font-family:Nunito,sans-serif;font-size:.875rem;font-weight:700;cursor:pointer;border-radius:100px;border:2px solid var(--border);background:var(--surface);color:var(--text-secondary);transition:all .2s ease;box-shadow:var(--shadow)}.category-btn:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px);box-shadow:var(--shadow-hover)}.category-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 2px 12px #5ca9414d}.category-btn-emoji{font-size:1rem}.loading{text-align:center;padding:3rem 1rem;color:var(--text-muted)}.loading-leaf{font-size:2rem;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-message{text-align:center;padding:2rem;background:#fef2f2;border:2px solid #fecaca;border-radius:var(--radius);color:#991b1b}.error-message button{margin-top:1rem;padding:.5rem 1.5rem;font-family:Nunito,sans-serif;font-weight:700;border:2px solid #fecaca;background:#fff;border-radius:100px;cursor:pointer;color:#991b1b;transition:all .2s}.error-message button:hover{background:#fecaca}.guides-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.guide-card{background:var(--surface);border:2px solid var(--border-light);border-radius:var(--radius);padding:1.5rem;transition:all .2s ease;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:.75rem}.guide-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:var(--accent)}.guide-header{display:flex;justify-content:space-between;align-items:flex-start}.guide-emoji{font-size:1.75rem}.guide-badges{display:flex;gap:.4rem}.badge{display:inline-block;padding:.2rem .6rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;border-radius:100px}.badge-beginner{background:var(--accent-light);color:var(--accent)}.badge-intermediate{background:var(--yellow-light);color:#92400e}.badge-advanced{background:var(--pink-light);color:#9d174d}.badge-category{background:var(--blue-light);color:#1e40af}.guide-title{font-size:1.1rem;font-weight:800;line-height:1.3;color:var(--text)}.guide-description{font-size:.875rem;line-height:1.65;color:var(--text-secondary);flex-grow:1}.guide-footer{display:flex;justify-content:space-between;align-items:center;padding-top:.5rem;border-top:1px solid var(--border-light)}.guide-game{font-size:.75rem;font-weight:600;color:var(--text-muted)}.empty-state{grid-column:1 / -1;text-align:center;padding:3rem 1rem;color:var(--text-muted);font-size:1rem}.site-footer{text-align:center;padding:2rem 1rem 1rem;color:var(--text-muted);font-size:.875rem}.footer-note{font-size:.75rem;margin-top:.25rem;opacity:.7}@media(max-width:640px){#root{padding:1rem}.hero{padding:2rem 1rem}.hero-title{font-size:1.75rem}.hero-subtitle{font-size:1rem}.guides-grid{grid-template-columns:1fr}.category-nav{gap:.4rem}.category-btn{padding:.5rem 1rem;font-size:.8rem}}