.problem-section:where(.astro-kkenpw4h){background:#fef2f2}.problem-demo:where(.astro-kkenpw4h){display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:2rem;margin-top:2rem}.demo-card:where(.astro-kkenpw4h){background:#fff;border-radius:.75rem;padding:2rem;box-shadow:0 2px 12px #00000014}.problem-card:where(.astro-kkenpw4h){border-left:4px solid #dc2626}.solution-card:where(.astro-kkenpw4h){border-left:4px solid #16a34a}.demo-card:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){margin-bottom:1.5rem;font-size:1.125rem}.problem-card:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){color:#991b1b}.solution-card:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){color:#15803d}.problem-list:where(.astro-kkenpw4h),.solution-list:where(.astro-kkenpw4h){list-style:none;padding:0;margin-top:1.5rem;color:#475569}.problem-list:where(.astro-kkenpw4h) li:where(.astro-kkenpw4h),.solution-list:where(.astro-kkenpw4h) li:where(.astro-kkenpw4h){padding:.5rem 0 .5rem 1.5rem;position:relative}.problem-list:where(.astro-kkenpw4h) li:where(.astro-kkenpw4h):before{content:"×";position:absolute;left:0;color:#dc2626;font-weight:700}.solution-list:where(.astro-kkenpw4h) li:where(.astro-kkenpw4h):before{content:"✓";position:absolute;left:0;color:#16a34a;font-weight:700}.packages-section:where(.astro-kkenpw4h){background:#fff}.packages-grid:where(.astro-kkenpw4h){display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem;margin-top:3rem}.package-card-link:where(.astro-kkenpw4h){text-decoration:none;color:inherit;display:block}.package-card:where(.astro-kkenpw4h){background:#fff;border:2px solid #e2e8f0;border-radius:.75rem;padding:2rem;height:100%;transition:all .3s;display:flex;flex-direction:column}.package-card-link:where(.astro-kkenpw4h):hover .package-card:where(.astro-kkenpw4h){transform:translateY(-4px);box-shadow:0 12px 24px #0000001a;border-color:#8b5cf6}.generator-card:where(.astro-kkenpw4h){background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-color:#cbd5e1}.package-header:where(.astro-kkenpw4h){display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem}.package-icon:where(.astro-kkenpw4h){font-size:2.5rem;flex-shrink:0}.package-card:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){color:#1e293b;margin-bottom:.25rem;font-size:1.25rem}.package-name:where(.astro-kkenpw4h){font-size:.85rem;color:#94a3b8;font-family:Courier New,monospace;margin:0}.package-size:where(.astro-kkenpw4h){font-size:1.5rem;font-weight:700;color:#8b5cf6;margin-bottom:1rem}.package-desc:where(.astro-kkenpw4h){color:#64748b;line-height:1.6;margin-bottom:1.5rem;flex-grow:1}.package-badges:where(.astro-kkenpw4h){display:flex;gap:.5rem;flex-wrap:wrap}.badge:where(.astro-kkenpw4h){background:#f1f5f9;color:#475569;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600}.generator-link:where(.astro-kkenpw4h){color:#8b5cf6;font-weight:600;text-decoration:none;display:inline-block;margin-top:1rem}.generator-link:where(.astro-kkenpw4h):hover{text-decoration:underline}.package-guide:where(.astro-kkenpw4h){margin-top:3rem;padding:2rem;background:#f8fafc;border-radius:.75rem;border-left:4px solid #8b5cf6}.package-guide:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){color:#1e293b;margin-bottom:1rem}.package-guide:where(.astro-kkenpw4h) ul:where(.astro-kkenpw4h){list-style:none;padding:0;margin:0}.package-guide:where(.astro-kkenpw4h) li:where(.astro-kkenpw4h){padding:.75rem 0;color:#475569;line-height:1.6}.package-guide:where(.astro-kkenpw4h) code:where(.astro-kkenpw4h){background:#fff;padding:.25rem .5rem;border-radius:.25rem;font-size:.9rem;color:#7c3aed}.package-guide:where(.astro-kkenpw4h) a:where(.astro-kkenpw4h){color:#8b5cf6;text-decoration:none}.package-guide:where(.astro-kkenpw4h) a:where(.astro-kkenpw4h):hover{text-decoration:underline}.getting-started-section:where(.astro-kkenpw4h){background:#f8fafc}.install-section:where(.astro-kkenpw4h){margin-top:2rem;background:#fff;padding:2rem;border-radius:.75rem;box-shadow:0 2px 8px #00000014}.install-section:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){color:#334155;margin-bottom:1rem;font-size:1.25rem}.tabs-container:where(.astro-kkenpw4h){margin-top:2rem}.tabs-header:where(.astro-kkenpw4h){display:flex;gap:.5rem;background:#f8fafc;padding:.5rem;border-radius:.75rem .75rem 0 0;overflow-x:auto;scrollbar-width:none}.tabs-header:where(.astro-kkenpw4h)::-webkit-scrollbar{display:none}.tab-button:where(.astro-kkenpw4h){background:transparent;border:none;padding:.75rem 1.25rem;font-size:.9rem;font-weight:600;color:#64748b;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;border-radius:.5rem}.tab-button:where(.astro-kkenpw4h):hover{color:#1e293b;background:#8b5cf61a}.tab-button:where(.astro-kkenpw4h).active{color:#fff;background:#8b5cf6;box-shadow:0 2px 8px #8b5cf64d}.tabs-content:where(.astro-kkenpw4h){background:#fff;border-radius:0 0 .75rem .75rem;box-shadow:0 4px 16px #0000001a;overflow:hidden}.tab-panel:where(.astro-kkenpw4h){display:none;padding:2rem}.tab-panel:where(.astro-kkenpw4h).active{display:block;animation:fadeIn .3s ease-in-out}.tab-panel:where(.astro-kkenpw4h) h4:where(.astro-kkenpw4h){color:#1e293b;margin-bottom:.5rem}.tab-panel:where(.astro-kkenpw4h) p:where(.astro-kkenpw4h){color:#64748b;margin-bottom:1.5rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.github-link:where(.astro-kkenpw4h){text-align:center;margin-top:2rem;padding-top:2rem;border-top:1px solid #e2e8f0}.github-link:where(.astro-kkenpw4h) a:where(.astro-kkenpw4h){color:#64748b;text-decoration:none;font-weight:500;transition:color .2s}.github-link:where(.astro-kkenpw4h) a:where(.astro-kkenpw4h):hover{color:#8b5cf6}.benefits-section:where(.astro-kkenpw4h){background:#fff}.card-grid:where(.astro-kkenpw4h){display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem}.card:where(.astro-kkenpw4h){background:#fff;border:1px solid #e2e8f0;border-radius:.75rem;padding:2rem;transition:all .3s}.card:where(.astro-kkenpw4h):hover{transform:translateY(-2px);box-shadow:0 8px 16px #0000001a}.card:where(.astro-kkenpw4h) h3:where(.astro-kkenpw4h){color:#1e293b;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.card-icon:where(.astro-kkenpw4h){font-size:1.5rem}.card:where(.astro-kkenpw4h) p:where(.astro-kkenpw4h){color:#64748b;line-height:1.6}.cta-section:where(.astro-kkenpw4h){text-align:center;padding:4rem 2rem;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.cta-section:where(.astro-kkenpw4h) h2:where(.astro-kkenpw4h){font-size:2.5rem;margin-bottom:1rem;color:#fff}.cta-description:where(.astro-kkenpw4h){font-size:1.25rem;margin-bottom:2rem;opacity:.9}.cta-buttons:where(.astro-kkenpw4h){display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}@media(max-width:768px){.problem-demo:where(.astro-kkenpw4h),.packages-grid:where(.astro-kkenpw4h),.card-grid:where(.astro-kkenpw4h){grid-template-columns:1fr}.cta-section:where(.astro-kkenpw4h) h2:where(.astro-kkenpw4h){font-size:2rem}}