* { box-sizing: border-box; }
body { font-family: system-ui, Arial, sans-serif; margin: 0; color: #181818; line-height: 1.5; }
header.site, footer.site { background: #111; color: #fff; padding: 14px 20px; }
header.site a, footer.site a { color: #fff; margin-right: 14px; text-decoration: none; }
main { max-width: 980px; margin: 0 auto; padding: 20px; }
.btn { display: inline-block; padding: 10px 16px; background: #e23; color: #fff; border: 0; border-radius: 6px; cursor: pointer; text-decoration: none; }
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.product-card { border: 1px solid #ddd; border-radius: 8px; padding: 12px; cursor: pointer; }
.product-card img { width: 100%; height: 140px; object-fit: cover; background: #eee; }
.modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: none; align-items: center; justify-content: center; }
.modal-backdrop.open { display: flex; }
.modal { background: #fff; padding: 20px; border-radius: 8px; min-width: 320px; }
.tabs button { margin-right: 8px; }
.tall { min-height: 2200px; }
#debug-overlay { position: fixed; right: 8px; bottom: 8px; background: #000; color: #0f0; padding: 8px; font: 12px monospace; z-index: 9999; max-width: 260px; }
#debug-overlay button { display: block; width: 100%; margin: 2px 0; }