/* ---- minimal reset ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,p,figure,blockquote,dl,dd,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
body{min-height:100vh;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,picture,svg,video{display:block;max-width:100%}
input,button,textarea,select{font:inherit;color:inherit}
/* padding:0 matters — the UA gives buttons ~0 6px, which silently ate 12px
   of a fixed-width icon button and clipped the glyph inside it. */
button{background:none;border:0;padding:0;cursor:pointer}
a{color:inherit;text-decoration:none}
/* the hidden attribute must beat component display rules (.empty, .cart-layout, .card…) */
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}