:root{--bg:#f7f7fb;--card:white;--text:#171717;--pri:#ee4d2d;--mut:#777}body.dark{--bg:#111827;--card:#1f2937;--text:#f9fafb;--mut:#cbd5e1}*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}.top{position:sticky;top:0;z-index:10;background:var(--card);display:flex;justify-content:space-between;align-items:center;padding:18px 7%;box-shadow:0 3px 20px #0001}.search{display:flex;gap:10px;align-items:center}.search input,.panel input,.panel textarea,dialog input,dialog textarea{padding:12px;border:1px solid #ddd;border-radius:12px;width:100%}button,.top a{background:var(--pri);color:white;border:0;border-radius:12px;padding:12px 18px;text-decoration:none;font-weight:700;cursor:pointer}.hero{margin:25px auto;max-width:1100px;border-radius:28px;padding:70px;background:linear-gradient(120deg,#fff3ef,#ffe8db);box-shadow:0 10px 30px #0001}.hero h1{font-size:46px;margin:10px 0;max-width:650px}.hero p{color:#555;max-width:600px}main{max-width:1100px;margin:auto;padding:20px}.cats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}.cat{background:var(--card);padding:12px 18px;border-radius:999px;box-shadow:0 4px 15px #0001;cursor:pointer}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}.card,.panel{background:var(--card);border-radius:22px;padding:16px;box-shadow:0 10px 30px #0001}.card img{width:100%;height:165px;object-fit:cover;border-radius:16px}.badge{display:inline-block;background:#fff0e9;color:var(--pri);padding:6px 10px;border-radius:999px;font-size:12px}.price{color:var(--pri);font-size:22px;font-weight:900}.mut{color:var(--mut)}.cartBtn{position:fixed;right:25px;bottom:25px;border-radius:999px;box-shadow:0 10px 30px #0003}dialog{border:0;border-radius:24px;max-width:520px;width:92%;padding:24px;background:var(--card);color:var(--text)}#cartItems{max-height:260px;overflow:auto}.row{display:flex;justify-content:space-between;gap:12px;padding:10px;border-bottom:1px solid #eee}.hide{display:none}footer{text-align:center;padding:40px;color:var(--mut)}@media(max-width:700px){.hero{padding:35px;margin:15px}.hero h1{font-size:32px}.top{padding:14px;gap:10px;flex-wrap:wrap}}