[hidden] { display: none !important; }
.store-main { min-height: 65vh; }
.store-heading { padding-top: 3rem; padding-bottom: 2rem; border-bottom: 1px solid var(--line); }
.store-heading h1 { font-size: 3rem; max-width: none; }
.store-heading .lead { margin-top: 0.75rem; }
.store-checkout { display: inline-block; margin-top: 1rem; font-weight: 700; text-underline-offset: 4px; }
.store-catalog { padding-top: 1.5rem; padding-bottom: 4rem; }
.store-toolbar { display: flex; gap: 1.25rem; align-items: end; flex-wrap: wrap; margin-bottom: 2rem; }
.store-toolbar label, .variant-label { display: grid; gap: 0.35rem; font-size: 0.8rem; font-weight: 700; }
.store-search { flex: 1; min-width: 180px; max-width: 380px; }
.store-toolbar input, .store-toolbar select, .product-info select {
  width: 100%; min-height: 46px; padding: 0.7rem; border: 1px solid var(--line);
  border-radius: 4px; background: #fff; color: var(--charcoal); font: inherit;
}
.store-toolbar p { margin-left: auto; padding-bottom: 0.7rem; color: var(--muted); font-size: 0.85rem; }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 1.5rem; }
.product-card { min-width: 0; }
.product-card button {
  display: block; width: 100%; padding: 0; text-align: left; font: inherit;
  color: var(--navy); border: 0; background: transparent; cursor: pointer;
}
.product-card img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #fff; border-radius: 6px; }
.product-card h2 { max-width: none; font-size: 1.05rem; text-transform: none; line-height: 1.4; margin-top: 0.85rem; overflow-wrap: anywhere; }
.product-card .product-price { margin-top: 0.3rem; font-size: 0.95rem; }
.product-card .product-options { color: var(--muted); font-size: 0.8rem; margin-top: 0.25rem; }
.product-card button:hover h2 { text-decoration: underline; text-underline-offset: 4px; }
.store-state { text-align: center; padding: 3rem 1rem; display: grid; gap: 0.8rem; justify-items: center; }
.store-state [data-state-title] { font-size: 1.15rem; font-weight: 700; }
.store-state [data-state-copy] { max-width: 48ch; color: var(--muted); }
.store-state a { overflow-wrap: anywhere; font-size: 0.9rem; }
.store-spinner { width: 30px; height: 30px; border: 3px solid var(--silver); border-top-color: var(--blue-deep); border-radius: 50%; animation: store-spin 0.8s linear infinite; }
@keyframes store-spin { to { transform: rotate(360deg); } }
.product-dialog { width: min(940px, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 2.5rem 2rem 2rem; border: 0; border-radius: 8px; color: var(--navy); }
.product-dialog::backdrop { background: rgba(0, 0, 0, 0.65); }
body:has(.product-dialog[open]) { overflow: hidden; }
.dialog-close { position: absolute; top: 0.5rem; right: 0.5rem; width: 40px; height: 40px; padding: 0; font-size: 1.8rem; border: 0; border-radius: 4px; background: var(--soft); color: var(--navy); cursor: pointer; }
.product-detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem; }
.product-media > img { width: 100%; aspect-ratio: 1; object-fit: contain; background: #f5f5f5; border-radius: 6px; }
.product-thumbnails { display: flex; gap: 0.5rem; overflow-x: auto; margin-top: 0.75rem; padding-bottom: 0.5rem; }
.product-thumbnails button { flex: 0 0 64px; width: 64px; height: 64px; padding: 2px; background: #fff; border: 2px solid transparent; border-radius: 4px; cursor: pointer; }
.product-thumbnails button[aria-pressed="true"] { border-color: var(--blue-deep); }
.product-thumbnails img { width: 100%; height: 100%; object-fit: contain; }
.product-info h2 { max-width: none; font-size: 1.65rem; line-height: 1.25; text-transform: none; overflow-wrap: anywhere; }
.product-price { font-weight: 700; font-size: 1.2rem; }
.product-info .product-price { margin: 0.75rem 0 1rem; }
.product-info select { margin-top: 0.35rem; font-size: 0.9rem; }
.product-availability { min-height: 1.5rem; font-size: 0.85rem; margin: 0.5rem 0 1rem; }
.product-info .btn { width: 100%; }
.checkout-note { font-size: 0.75rem; color: var(--muted); margin-top: 0.6rem; }
.share-product { margin-top: 1rem; border: 0; padding: 0.6rem 0; background: transparent; color: var(--navy); font: inherit; font-size: 0.9rem; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.share-status { min-height: 1.5rem; font-size: 0.8rem; }
.product-info h3 { font-size: 0.9rem; margin: 1rem 0 0.6rem; }
.product-description { white-space: pre-line; font-size: 0.9rem; color: var(--muted); overflow-wrap: anywhere; }
.store-main :focus-visible, .product-dialog :focus-visible { outline: 3px solid var(--blue-deep); outline-offset: 4px; }
@media (max-width: 900px) { .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .store-heading { padding-top: 2rem; }
  .store-heading h1 { font-size: 2.5rem; }
  .store-toolbar { gap: 0.75rem; }
  .store-search { min-width: 100%; max-width: none; }
  .store-sort { flex: 1; }
  .product-grid { gap: 1.5rem 0.75rem; }
  .product-card h2 { font-size: 0.9rem; }
  .product-card .product-price { font-size: 0.85rem; }
  .product-dialog { padding: 3rem 1rem 1.5rem; }
  .product-detail { grid-template-columns: 1fr; gap: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { .store-spinner { animation: none; } }
.store-heading { position: relative; }
.cart-toggle { float: right; display: inline-flex; align-items: center; gap: 0.6rem; padding: 0.75rem; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--navy); font: inherit; font-weight: 700; cursor: pointer; }
.cart-toggle [data-cart-count] { display: inline-block; min-width: 1.4rem; text-align: center; }
.cart-dialog { width: min(760px, calc(100% - 24px)); max-height: calc(100dvh - 32px); margin: auto; padding: 2rem; border: 0; border-radius: 6px; color: var(--charcoal); }
.cart-dialog::backdrop { background: rgba(0, 0, 0, 0.65); }
body:has(.cart-dialog[open]) { overflow: hidden; }
.cart-dialog h2 { font-size: 1.7rem; margin-right: 2rem; }
.cart-empty { padding: 2rem 0; color: var(--muted); }
.cart-item { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid var(--line); align-items: start; }
.cart-item > img { width: 88px; height: 88px; object-fit: contain; }
.cart-item h3 { font-size: 0.95rem; line-height: 1.35; }
.cart-item p { font-size: 0.8rem; color: var(--muted); margin-top: 0.3rem; }
.cart-item-actions { display: grid; justify-items: end; gap: 0.5rem; font-size: 0.95rem; }
.remove-item { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 4px; background: var(--soft); cursor: pointer; }
.cart-quantity { display: flex; gap: 0.65rem; align-items: center; font-size: 0.8rem; margin-top: 0.75rem; }
.cart-quantity input { width: 64px; min-height: 38px; padding: 0.35rem; border: 1px solid var(--line); border-radius: 4px; font: inherit; }
.cart-subtotal, .checkout-totals > p:not(.checkout-note) { display: flex; justify-content: space-between; gap: 1rem; margin: 1rem 0; }
.checkout-message, .cart-feedback { font-size: 0.9rem; margin-top: 1rem; }
.cart-feedback:not(:empty), .cart-item .cart-error { color: #9b232b; }
.delivery-form { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.cart-dialog fieldset { padding: 0; border: 0; min-width: 0; }
.cart-dialog legend { font-size: 1.05rem; font-weight: 700; margin-bottom: 1rem; }
.delivery-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.delivery-fields label { display: grid; gap: 0.35rem; font-size: 0.8rem; font-weight: 700; }
.delivery-fields input, .delivery-fields select { width: 100%; min-width: 0; min-height: 46px; padding: 0.7rem; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--charcoal); font: inherit; font-size: 1rem; }
.delivery-fields input[readonly] { background: var(--soft); }
.full-field { grid-column: 1 / -1; }
.delivery-form > .btn { width: 100%; margin-top: 1.25rem; }
.cart-dialog .btn { font-family: inherit; font-size: 0.9rem; }
.cart-dialog .btn-secondary { background: #fff; border-color: var(--line); color: var(--navy); }
.cart-dialog .shipping-rates { margin-top: 1.5rem; }
.shipping-option { display: flex; align-items: center; gap: 0.75rem; padding: 0.8rem 0; border-bottom: 1px solid var(--line); font-size: 0.9rem; cursor: pointer; }
.shipping-option input { width: 18px; height: 18px; min-height: 18px; padding: 0; accent-color: var(--blue-deep); flex-shrink: 0; }
.shipping-option strong { margin-left: auto; white-space: nowrap; }
.checkout-totals > .btn { display: flex; justify-content: center; align-items: center; gap: 0.65rem; width: 100%; margin-top: 1.25rem; }
.cart-dialog button:disabled { opacity: 0.6; cursor: wait; }
.cart-dialog :focus-visible { outline: 3px solid var(--blue-deep); outline-offset: 3px; }
.order-status { margin-top: 1.5rem; border-left: 3px solid var(--blue-deep); padding: 0.5rem 1rem; background: var(--soft); }
.order-status h2 { font-size: 1.1rem; }
.order-status p { margin-top: 0.4rem; font-size: 0.9rem; }
@media (max-width: 600px) {
  .cart-dialog { padding: 2rem 1rem 1rem; }
  .cart-item { grid-template-columns: 56px minmax(0, 1fr) auto; gap: 0.65rem; }
  .cart-item > img { width: 56px; height: 64px; }
  .cart-item-actions { font-size: 0.85rem; }
  .cart-item h3 { font-size: 0.85rem; }
  .delivery-fields { grid-template-columns: minmax(0, 1fr); gap: 0.85rem; }
  .cart-toggle { padding: 0.6rem; font-size: 0.85rem; }
  .cart-dialog h2 { font-size: 1.4rem; }
}