#product-quantity-calculator {
  box-sizing: border-box;
  width: 100%;
  max-width: 640px;
  margin: 1.5rem 0;
  padding: clamp(16px, 4vw, 28px);
  border: 1px solid #c7d9cd;
  border-radius: 16px;
  background: #f5f9f5;
  color: #23352b;
  font-family: system-ui, Arial, sans-serif;
  overflow-wrap: anywhere;
}
#product-quantity-calculator * { box-sizing: border-box; min-width: 0; }
#product-quantity-calculator label { display: block; margin: 16px 0 8px; font-size: 1rem; font-weight: 700; }
#product-quantity-calculator :is(input, select, button) {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 48px;
  padding: 12px;
  border: 1px solid #758a7d;
  border-radius: 8px;
  color: #23352b;
  background: #fff;
  font: inherit;
  font-size: 1rem;
}
#product-quantity-calculator [aria-invalid="true"] { border: 2px solid #a72b25; }
#product-quantity-calculator button { margin-top: 20px; border-color: #1b563e; background: #1b563e; color: #fff; font-weight: 700; cursor: pointer; white-space: normal; }
#product-quantity-calculator button:disabled { background: #e0e8e2; border-color: #758a7d; color: #435a4b; cursor: default; }
#product-quantity-calculator button:enabled:hover { background: #14432f; }
#product-quantity-calculator :is(input, select, button):focus-visible { outline: 3px solid #1b563e; outline-offset: 3px; }
#product-quantity-calculator p { line-height: 1.5; }
#product-quantity-calculator #pq-error { margin: 12px 0; }
#product-quantity-calculator #pq-result { margin-top: 20px; padding: 16px; border: 1px solid #c7d9cd; border-radius: 8px; background: #fff; }
#product-quantity-calculator #pq-result[hidden] { display: none; }
#product-quantity-calculator output { font-weight: 700; overflow-wrap: anywhere; white-space: normal; }