:root{--green:#008751;--gold:#FCD116;--bg:#f6fff7;--text:#0f172a;--muted:#6b7280}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text)}
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(90deg,var(--green),#0a8a5a);color:#fff}
.brand{font-size:18px;font-weight:900;letter-spacing:.3px}
.actions{display:flex;gap:8px;align-items:center}
.install{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;padding:6px 10px;border-radius:10px}
.container{max-width:980px;margin:0 auto;padding:14px}
h2{margin:8px 0 6px} .muted{color:var(--muted)}
.card{background:#fff;border:1px solid #eaf4ee;border-radius:12px;padding:12px;box-shadow:0 10px 30px rgba(2,6,23,.06)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.product{overflow:hidden;border-radius:12px}
.product img{width:100%;height:120px;object-fit:cover}
.btn{background:var(--green);color:#fff;border:0;border-radius:10px;padding:10px 14px;cursor:pointer}
.list{margin-top:12px;display:grid;gap:8px}
.badge{display:inline-block;background:#ecfccb;color:#166534;padding:6px 10px;border-radius:999px;font-size:12px}
.bottombar{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #e6e6e6;display:flex;justify-content:space-around;padding:8px 0;z-index:20}
.navbtn{background:transparent;border:0;padding:8px 6px;font-weight:800;color:#1f2937}
.navbtn.active{color:var(--green)}
.tab{display:none;padding-bottom:80px}.tab.active{display:block}
input,select{padding:10px;border:1px solid #e5e7eb;border-radius:10px;width:100%;margin:6px 0}
.foot{text-align:center;color:var(--muted);padding:12px 8px;margin-bottom:60px}