/* ==========================================================================
   REBEL RAGS — COMPONENTS  (rr-components.css)
   Every UI part defined ONCE. Consumes tokens only. Reused on every page.
   Change a component here → every instance site-wide updates.
   ========================================================================== */

/* ======================================================================
   BUTTONS  — .rr-btn (+ modifiers)
   ====================================================================== */
.rr-btn {
  --_bg: var(--rr-btn-bg);
  --_ink: var(--rr-btn-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rr-space-1);
  font-family: var(--rr-font-label);
  font-weight: 700;
  font-size: var(--rr-fs-1);
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
  line-height: var(--rr-lh-solid);
  padding: var(--rr-btn-padding);
  background: var(--_bg);
  color: var(--_ink);
  border: var(--rr-bd) solid var(--_bg);
  border-radius: var(--rr-radius-sm);
  cursor: pointer;
  text-decoration: none;
  transition: transform var(--rr-dur-fast) var(--rr-ease),
              box-shadow var(--rr-dur-fast) var(--rr-ease),
              background var(--rr-dur-fast) var(--rr-ease);
  box-shadow: var(--rr-shadow-sm);
}
.rr-btn:hover { background: var(--rr-btn-bg-hover); border-color: var(--rr-btn-bg-hover); color: var(--_ink); text-decoration: none; transform: translate(var(--rr-btn-hover-offset), var(--rr-btn-hover-offset)); box-shadow: var(--rr-shadow); }
.rr-btn:active { transform: translate(0,0); box-shadow: var(--rr-shadow-none); }
.rr-btn:disabled, .rr-btn[aria-disabled="true"] { opacity: var(--rr-disabled-opacity); cursor: not-allowed; transform: none; box-shadow: var(--rr-shadow-none); }

/* Variants — recolour by swapping the local vars only */
.rr-btn--ghost   { --_bg: transparent; --_ink: var(--rr-ink); border-color: var(--rr-border-strong); box-shadow: var(--rr-shadow-none); }
.rr-btn--ghost:hover { --_bg: transparent; --_ink: var(--rr-accent); border-color: var(--rr-accent); box-shadow: var(--rr-shadow-none); }
.rr-btn--outline { --_bg: transparent; --_ink: var(--rr-accent); border-color: var(--rr-accent); box-shadow: var(--rr-shadow-none); }
.rr-btn--outline:hover { --_bg: var(--rr-accent); --_ink: var(--rr-accent-ink); }
.rr-btn--sale    { --_bg: var(--rr-sale); --_ink: var(--rr-sale-ink); }
.rr-btn--paper   { --_bg: var(--rr-paper); --_ink: var(--rr-paper-ink); }

/* Sizes */
.rr-btn--sm  { font-size: var(--rr-fs-0); padding: var(--rr-btn-padding-sm); }
.rr-btn--lg  { font-size: var(--rr-fs-3); padding: var(--rr-btn-padding-lg); }
.rr-btn--block { display: flex; width: 100%; }
.rr-btn--icon { padding: var(--rr-btn-padding-icon); aspect-ratio: var(--rr-square-ratio); }

/* ======================================================================
   LINKS / TEXT UTILITIES
   ====================================================================== */
.rr-link-mono { font-family: var(--rr-font-label); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); font-size: var(--rr-fs-1); }
.rr-muted { color: var(--rr-text-muted); }
.rr-eyebrow { font-family: var(--rr-font-label); font-size: var(--rr-fs-0); text-transform: uppercase; letter-spacing: var(--rr-tracking-mega); color: var(--rr-accent); }

/* ======================================================================
   BADGES / TAGS  — .rr-badge  .rr-tag
   ====================================================================== */
.rr-badge {
  display: inline-flex; align-items: center; gap: var(--rr-badge-gap);
  font-family: var(--rr-font-label); font-weight: 700;
  font-size: var(--rr-fs-0); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide);
  padding: var(--rr-badge-padding); background: var(--rr-accent); color: var(--rr-accent-ink);
  border-radius: var(--rr-radius-sm); line-height: var(--rr-lh-solid);
}
.rr-badge--sale    { background: var(--rr-sale); color: var(--rr-sale-ink); }
.rr-badge--new     { background: var(--rr-paper); color: var(--rr-paper-ink); }
.rr-badge--out     { background: var(--rr-surface-3); color: var(--rr-ink-muted); }
.rr-badge--success { background: var(--rr-success); color: var(--rr-success-ink); }

.rr-tag {
  display: inline-block; font-family: var(--rr-font-label); font-size: var(--rr-fs-0);
  text-transform: uppercase; letter-spacing: var(--rr-tracking-wide);
  padding: var(--rr-tag-padding); border: var(--rr-bd) solid var(--rr-border-strong);
  color: var(--rr-ink-muted); border-radius: var(--rr-radius-pill); background: transparent;
}
.rr-tag:hover, .rr-tag[aria-pressed="true"] { border-color: var(--rr-accent); color: var(--rr-accent); }

/* ======================================================================
   PRICE  — .rr-price
   ====================================================================== */
.rr-price { font-family: var(--rr-font-label); font-weight: 700; color: var(--rr-price); font-size: var(--rr-fs-3); }
.rr-price--was { color: var(--rr-ink-faint); text-decoration: line-through; font-weight: 400; font-size: var(--rr-fs-1); margin-left: var(--rr-price-gap); }

.rr-product-location { display: flex; align-items: center; gap: var(--rr-space-2); margin-top: var(--rr-space-4); padding: var(--rr-space-3); color: var(--rr-accent); font-weight: 700; }
.rr-product-location__icon { display: inline-block; width: var(--rr-checkbox-size); height: var(--rr-checkbox-size); flex: none; }
.rr-product-location__icon svg { width: 100%; height: 100%; }

/* ======================================================================
   CARDS  — .rr-card / product card
   ====================================================================== */
.rr-card {
  background: var(--rr-card-bg);
  border: var(--rr-bd) solid var(--rr-card-border);
  border-radius: var(--rr-radius);
  overflow: hidden;
  transition: transform var(--rr-dur) var(--rr-ease), box-shadow var(--rr-dur) var(--rr-ease), border-color var(--rr-dur) var(--rr-ease);
}
.rr-card:hover { transform: translateY(var(--rr-card-hover-lift)); border-color: var(--rr-accent); box-shadow: var(--rr-shadow); }

/* Product card — legible core; only chrome around it goes wild */
.rr-product {
  position: relative; display: flex; flex-direction: column;
  background: var(--rr-card-bg); border: var(--rr-bd) solid var(--rr-card-border);
  border-radius: var(--rr-radius); overflow: visible;
  transition: transform var(--rr-dur) var(--rr-ease), box-shadow var(--rr-dur) var(--rr-ease), border-color var(--rr-dur) var(--rr-ease);
}
.rr-product::before {
  content: "";
  position: absolute;
  z-index: var(--rr-z-sticky);
  top: var(--rr-tape-card-top);
  left: var(--rr-half);
  width: var(--rr-tape-card-width);
  aspect-ratio: 900 / 191;
  background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat;
  transform: var(--rr-tape-card-transform);
  filter: var(--rr-tape-asset-shadow);
}
.rr-product:nth-child(even)::before { transform: var(--rr-tape-card-transform-alt); }
.rr-product:hover { transform: translateY(var(--rr-card-hover-lift)); border-color: var(--rr-accent); box-shadow: var(--rr-shadow-accent); }
.rr-product__media { position: relative; aspect-ratio: var(--rr-product-media-ratio); background: var(--rr-surface-2); overflow: hidden; border-radius: var(--rr-radius) var(--rr-radius) 0 0; }
.rr-product__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--rr-dur-slow) var(--rr-ease); }
.rr-product:hover .rr-product__media img { transform: scale(var(--rr-product-image-zoom)); }
.rr-product__badges { position: absolute; top: var(--rr-space-2); left: var(--rr-space-2); display: flex; flex-direction: column; gap: var(--rr-space-1); z-index: var(--rr-component-layer); }
.rr-product__fav { position: absolute; top: var(--rr-space-2); right: var(--rr-space-2); z-index: var(--rr-component-layer); background: var(--rr-control-overlay); border: var(--rr-bd) solid var(--rr-border); color: var(--rr-ink); width: var(--rr-favourite-size); height: var(--rr-favourite-size); border-radius: var(--rr-radius-pill); display: grid; place-items: center; cursor: pointer; }
.rr-product__fav[aria-pressed="true"] { background: var(--rr-accent); color: var(--rr-accent-ink); border-color: var(--rr-accent); }
.rr-product__body { padding: var(--rr-space-3); display: flex; flex-direction: column; gap: var(--rr-space-1); }
.rr-product__shop { font-family: var(--rr-font-label); font-size: var(--rr-fs-0); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); color: var(--rr-ink-faint); }
.rr-product__title { font-family: var(--rr-font-body); font-weight: 700; font-size: var(--rr-fs-2); color: var(--rr-ink); line-height: var(--rr-lh-snug); }
.rr-product__title a { color: inherit; }
.rr-product__foot { display: flex; align-items: center; justify-content: space-between; margin-top: var(--rr-space-1); gap: var(--rr-space-2); }

/* ======================================================================
   FORMS  — .rr-field .rr-input .rr-select .rr-checkbox
   ====================================================================== */
.rr-field { display: flex; flex-direction: column; gap: var(--rr-space-1); margin-bottom: var(--rr-space-3); }
.rr-label { font-family: var(--rr-font-label); font-size: var(--rr-fs-0); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); color: var(--rr-ink-muted); }
.rr-input, .rr-select, .rr-textarea {
  width: 100%; background: var(--rr-surface-3); color: var(--rr-ink);
  border: var(--rr-bd) solid var(--rr-border); border-radius: var(--rr-radius-sm);
  padding: var(--rr-input-padding); font-size: var(--rr-fs-2); transition: border-color var(--rr-dur-fast) var(--rr-ease);
}
.rr-input::placeholder, .rr-textarea::placeholder { color: var(--rr-ink-faint); }
.rr-input:focus, .rr-select:focus, .rr-textarea:focus { border-color: var(--rr-accent); outline: none; }
.rr-textarea { min-height: var(--rr-textarea-min-height); resize: vertical; }
.rr-select { appearance: none; background-image: var(--rr-select-arrow-image); background-position: var(--rr-select-arrow-pos-1), var(--rr-select-arrow-pos-2); background-size: var(--rr-select-arrow-size), var(--rr-select-arrow-size); background-repeat: no-repeat; padding-right: var(--rr-select-padding-end); }
.rr-checkbox { display: inline-flex; align-items: center; gap: var(--rr-space-2); cursor: pointer; font-size: var(--rr-fs-1); }
.rr-checkbox input { width: var(--rr-checkbox-size); height: var(--rr-checkbox-size); accent-color: var(--rr-accent); }
.rr-field--error .rr-input { border-color: var(--rr-sale); }
.rr-error-text { color: var(--rr-sale); font-size: var(--rr-fs-1); font-family: var(--rr-font-label); }

/* Quantity stepper */
.rr-qty { display: inline-flex; border: var(--rr-bd) solid var(--rr-border-strong); border-radius: var(--rr-radius-sm); overflow: hidden; }
.rr-qty button { background: var(--rr-surface-2); color: var(--rr-ink); border: 0; width: var(--rr-qty-button-width); cursor: pointer; font-weight: 700; }
.rr-qty button:hover { background: var(--rr-accent); color: var(--rr-accent-ink); }
.rr-qty input { width: var(--rr-qty-input-width); text-align: center; background: var(--rr-surface-3); border: 0; border-left: var(--rr-bd) solid var(--rr-border); border-right: var(--rr-bd) solid var(--rr-border); color: var(--rr-ink); }

/* ======================================================================
   NAV  — .rr-nav  (used inside header/layout)
   ====================================================================== */
.rr-nav { display: flex; align-items: center; gap: var(--rr-space-4); }
.rr-nav a { font-family: var(--rr-font-label); font-size: var(--rr-fs-1); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); color: var(--rr-ink); position: relative; padding: var(--rr-space-1) 0; }
.rr-nav a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: var(--rr-bd-thick); background: var(--rr-accent); transition: width var(--rr-dur) var(--rr-ease); }
.rr-nav a:hover, .rr-nav a[aria-current="page"] { color: var(--rr-accent); text-decoration: none; }
.rr-nav a:hover::after, .rr-nav a[aria-current="page"]::after { width: 100%; }

/* ======================================================================
   BREADCRUMB / PAGINATION
   ====================================================================== */
.rr-breadcrumb { display: flex; gap: var(--rr-space-1); font-family: var(--rr-font-label); font-size: var(--rr-fs-0); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); color: var(--rr-ink-faint); }
.rr-breadcrumb a { color: var(--rr-ink-muted); }
.rr-breadcrumb li::after { content: "/"; margin-left: var(--rr-space-1); color: var(--rr-ink-faint); }
.rr-breadcrumb li:last-child::after { content: ""; }
.rr-breadcrumb ol, .rr-breadcrumb ul { display: flex; gap: var(--rr-space-1); list-style: none; margin: 0; padding: 0; }

.rr-pagination { display: flex; gap: var(--rr-space-1); align-items: center; justify-content: center; margin: var(--rr-space-5) 0; }
.rr-pagination a, .rr-pagination span { min-width: var(--rr-pagination-size); height: var(--rr-pagination-size); display: grid; place-items: center; border: var(--rr-bd) solid var(--rr-border); font-family: var(--rr-font-label); color: var(--rr-ink); border-radius: var(--rr-radius-sm); }
.rr-pagination a:hover { border-color: var(--rr-accent); color: var(--rr-accent); text-decoration: none; }
.rr-pagination [aria-current="page"] { background: var(--rr-accent); color: var(--rr-accent-ink); border-color: var(--rr-accent); }

/* ======================================================================
   ALERTS / EMPTY STATE
   ====================================================================== */
.rr-alert { border: var(--rr-bd) solid var(--rr-border-strong); border-left-width: var(--rr-space-1); border-radius: var(--rr-radius-sm); padding: var(--rr-space-3); background: var(--rr-surface); display: flex; gap: var(--rr-space-2); }
.rr-alert--success { border-left-color: var(--rr-success); }
.rr-alert--error   { border-left-color: var(--rr-sale); }
.rr-alert--info    { border-left-color: var(--rr-accent); }

.rr-empty { text-align: center; padding: var(--rr-space-7) var(--rr-space-3); display: flex; flex-direction: column; align-items: center; gap: var(--rr-space-3); }
.rr-empty__art { font-family: var(--rr-font-display); font-size: var(--rr-fs-8); color: var(--rr-surface-3); line-height: var(--rr-lh-solid); transform: rotate(var(--rr-rot-3)); }

/* ======================================================================
   SECTION HEADER  — reusable "shout" header
   ====================================================================== */
.rr-section { padding: var(--rr-space-6) 0; }
.rr-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--rr-space-3); margin-bottom: var(--rr-space-4); flex-wrap: wrap; }
.rr-section__title { font-size: var(--rr-fs-6); text-transform: uppercase; margin: 0; }
.rr-section__title .rr-accent { color: var(--rr-accent); }

/* ======================================================================
   ZINE PRIMITIVES  — the punk chaos, systematised
   ====================================================================== */

/* Tape strip — real scanned masking-tape asset, never a flat CSS rectangle. */
.rr-tape { position: absolute; width: var(--rr-tape-width); aspect-ratio: 900 / 191; height: auto; background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat; filter: drop-shadow(var(--rr-tape-shadow)); }
.rr-tape--tl { top: var(--rr-tape-edge-offset); left: var(--rr-tape-inline-offset); transform: rotate(var(--rr-rot-3)); }
.rr-tape--tr { top: var(--rr-tape-edge-offset); right: var(--rr-tape-inline-offset); transform: rotate(var(--rr-rot-4)); }
.rr-tape--bl { bottom: var(--rr-tape-edge-offset); left: var(--rr-tape-inline-offset-2); transform: rotate(var(--rr-rot-2)); }

/* Sticker — rotated cut-out label */
.rr-sticker { display: inline-block; font-family: var(--rr-font-display); font-weight: 900; text-transform: uppercase; background: var(--rr-accent); color: var(--rr-accent-ink); padding: var(--rr-sticker-padding); transform: rotate(var(--rr-rot-3)); box-shadow: var(--rr-shadow-sm); letter-spacing: var(--rr-tracking-tight); }
.rr-sticker--paper { background: var(--rr-paper); color: var(--rr-paper-ink); }
.rr-sticker--sale  { background: var(--rr-sale); color: var(--rr-sale-ink); }

/* Torn-edge panel — ragged top & bottom, use for hero/banners */
.rr-torn { position: relative; }
.rr-torn::before, .rr-torn::after { content: ""; position: absolute; left: 0; right: 0; height: var(--rr-torn-edge-height); background: inherit; -webkit-mask: var(--rr-torn-mask) repeat-x; mask: var(--rr-torn-mask) repeat-x; -webkit-mask-size: var(--rr-torn-edge-width) var(--rr-torn-edge-height); mask-size: var(--rr-torn-edge-width) var(--rr-torn-edge-height); }
.rr-torn::before { top: var(--rr-torn-edge-offset); transform: scaleY(-1); }
.rr-torn::after  { bottom: var(--rr-torn-edge-offset); }

/* Grain / halftone / hatch backing panels (chrome only) */
.rr-grain-panel { position: relative; }
.rr-grain-panel::after { content: ""; position: absolute; inset: 0; background-image: var(--rr-grain); opacity: var(--rr-grain-opacity); pointer-events: none; mix-blend-mode: overlay; }
.rr-halftone { background-image: var(--rr-halftone); background-size: var(--rr-halftone-size); }
.rr-hatch { background-image: var(--rr-hatch); }

/* Cut-out / xerox heading — high-contrast paper block behind display type */
.rr-cutout { display: inline-block; background: var(--rr-paper); color: var(--rr-paper-ink); padding: var(--rr-cutout-padding); transform: rotate(var(--rr-rot-1)); box-shadow: var(--rr-shadow-sm); }
.rr-cutout--accent { background: var(--rr-accent); color: var(--rr-accent-ink); }

/* Marquee ticker (announcement bar) — respects reduced-motion via token dur */
.rr-marquee { overflow: hidden; white-space: nowrap; background: var(--rr-accent); color: var(--rr-accent-ink); }
.rr-marquee__track { display: inline-block; padding: var(--rr-space-1) 0; font-family: var(--rr-font-label); font-weight: 700; text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); animation: rr-marquee var(--rr-marquee-duration) linear infinite; }
@keyframes rr-marquee { from { transform: translateX(0); } to { transform: translateX(var(--rr-marquee-distance)); } }
@media (prefers-reduced-motion: reduce) { .rr-marquee__track { animation: none; } }

/* Divider — dashed punk rule with a centred mark */
.rr-divider { display: flex; align-items: center; gap: var(--rr-space-2); color: var(--rr-ink-faint); font-family: var(--rr-font-label); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); font-size: var(--rr-fs-0); }
.rr-divider::before, .rr-divider::after { content: ""; flex: var(--rr-flex-fill); border-top: var(--rr-bd) dashed var(--rr-border-strong); }

/* ======================================================================
   HOME + CONTENT PAGE COMPONENTS
   ====================================================================== */
.rr-home-stats .rr-card,
.rr-home-category,
.rr-home-scenes .rr-card,
.rr-home-trust .rr-card,
.rr-page-shell .rr-card { padding: var(--rr-space-4); }
.rr-home-stats .rr-card { display: grid; gap: var(--rr-space-1); text-align: center; }
.rr-home-stats strong { color: var(--rr-accent); font-family: var(--rr-font-display); font-size: var(--rr-fs-6); line-height: var(--rr-lh-solid); }
.rr-home-stats span,
.rr-home-scenes span,
.rr-home-trust span { color: var(--rr-ink-muted); font-size: var(--rr-fs-1); }
.rr-home-category { display: grid; place-items: center; font-family: var(--rr-font-display); font-size: var(--rr-fs-3); font-weight: 900; text-align: center; text-transform: uppercase; }
.rr-home-scenes .rr-card,
.rr-home-trust .rr-card { display: grid; gap: var(--rr-space-2); color: var(--rr-ink); }
.rr-home-scenes strong,
.rr-home-trust strong { font-family: var(--rr-font-display); font-size: var(--rr-fs-3); text-transform: uppercase; }
.rr-home-category-strip .rr-cluster { justify-content: center; gap: var(--rr-space-2); }
.rr-home-seller-cta { margin-block: var(--rr-space-6); background: var(--rr-accent); color: var(--rr-accent-ink); }
.rr-home-seller-cta .rr-container { position: relative; z-index: var(--rr-component-layer); padding-block: var(--rr-space-6); text-align: center; }
.rr-home-seller-cta h2 { color: var(--rr-accent-ink) !important; }
.rr-home-seller-cta p { max-width: var(--rr-measure-lg); margin-inline: auto; font-family: var(--rr-font-label); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); font-size: var(--rr-fs-1); }
.rr-home-seller-cta .rr-btn { margin-top: var(--rr-space-3); }

/* ======================================================================
   FIGMA HOME SECTIONS  — purple/lavender zine marketplace (2026-08)
   New home: FIND YOUR PEOPLE hero banner, SHOP BY STYLE grid, RECENTLY
   LISTED product cards, category polaroid grids. All colours consume the
   rr-tokens variables. Desktop + mobile.
   ====================================================================== */
.rr-hero--figma { padding-bottom: var(--rr-space-6); overflow: visible; }
.rr-hero.rr-hero--figma {
  overflow: visible;
  border-bottom: 0;
  background:
    var(--rr-bg-deep);
}
/* Figma hero grain + halftone atmosphere */
.rr-grain-panel {
  position: relative;
}
.rr-grain-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    var(--rr-halftone),
    var(--rr-grain);
  background-size: var(--rr-halftone-size), 140px 140px;
  opacity: 0.18;
  pointer-events: none;
  z-index: 0;
  mix-blend-mode: screen;
}
.rr-grain-panel > * {
  position: relative;
  z-index: 1;
}

/* Figma home hero is a single column (tagline + search + collage).
   Do not inherit the old 2-col zine inner (minmax 380px) — that plus
   overflow:hidden clips the search pill on mobile and left-packs desktop. */
.rr-hero--figma .rr-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: stretch;
  align-items: start;
  min-height: 0;
  width: 100%;
  max-width: var(--rr-content);
  min-width: 0;
  margin-inline: auto;
  padding-block: var(--rr-space-5);
  padding-inline: var(--rr-gutter);
  box-sizing: border-box;
  gap: var(--rr-space-4);
  overflow: visible;
}
.rr-hero--figma .rr-hero__copy {
  width: auto;
  max-width: 100%;
  min-width: 0;
  justify-items: stretch;
  justify-self: stretch;
  margin: 0;
}
.rr-hero--figma .rr-hero__tagline {
  max-width: 100%;
}

/* Hero tagline + search bar */
.rr-hero__tagline {
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-5);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-tight);
  color: var(--rr-ink);
  margin: 0;
}
.rr-hero__tagline--script {
  font-family: var(--rr-font-script);
  font-size: clamp(1.65rem, 4.2vw, 2.75rem);
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.01em;
  line-height: 1.15;
  color: var(--rr-ink);
}
.rr-hero__tagline .rr-accent { color: var(--rr-accent); }
.rr-hero__search {
  display: flex; align-items: center; gap: var(--rr-space-2);
  width: auto; max-width: 100%;
  min-width: 0;
  margin: 0;
  box-sizing: border-box;
  padding: var(--rr-space-2) var(--rr-space-2) var(--rr-space-2) var(--rr-space-3);
  background: var(--rr-surface);
  border: var(--rr-bd) solid var(--rr-accent);
  border-radius: var(--rr-radius-pill);
  box-shadow: var(--rr-shadow);
}
.rr-hero__search .rr-btn {
  flex: 0 0 auto;
  white-space: nowrap;
  border-radius: var(--rr-radius-pill);
}
.rr-hero__search-icon { width: 18px; height: 18px; flex: 0 0 auto; color: var(--rr-ink); }
.rr-hero__search-submit {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--rr-ink);
  cursor: pointer;
  flex: 0 0 auto;
}
.rr-hero__search .rr-btn { display: none; }
.rr-hero__search-input {
  flex: 1; min-width: 0; border: 0; background: transparent;
  color: var(--rr-ink); font-family: var(--rr-font-body); font-size: var(--rr-fs-2);
}
.rr-hero__search-input::placeholder { color: var(--rr-ink-faint); }
.rr-hero__search-input:focus { outline: 2px solid var(--rr-accent); outline-offset: 2px; border-radius: var(--rr-radius-sm); }
.rr-hero__banner { margin-top: var(--rr-space-6); }

/* FIND YOUR PEOPLE — Figma torn collage, then Sign In CTA below.
   Latest-items mode keeps that frame and tapes polaroids across it. */
.rr-find-people {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-items: center;
  gap: var(--rr-space-4);
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
}
/* The exported Figma banner is a complete collage: paper, clip, text and art
   are baked in. Keep its torn silhouette unframed. */
.rr-find-people__collage {
  margin: 0;
  line-height: 0;
  width: 100%;
  filter: none;
  position: relative;
}
.rr-find-people__tape { display: none; }
.rr-find-people__collage-img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: cover;
  object-position: center top;
}
.rr-find-people__art {
  position: relative;
  min-height: var(--rr-space-8);
  border-radius: var(--rr-radius);
  background:
    radial-gradient(circle at 30% 30%, var(--rr-accent-hi), transparent 45%),
    radial-gradient(circle at 70% 65%, var(--rr-purple-deep), transparent 55%),
    linear-gradient(160deg, var(--rr-accent), var(--rr-purple-deep));
  opacity: .92;
}
.rr-find-people__copy {
  position: static;
  transform: none;
  z-index: 2;
  display: grid;
  justify-items: center;
  gap: var(--rr-space-3);
  width: min(100% - 2rem, 22rem);
  pointer-events: auto;
}
.rr-find-people__copy .rr-btn { pointer-events: auto; }
.rr-find-people__actions {
  display: flex;
  justify-content: center;
  margin-top: var(--rr-space-4);
}
.rr-btn__icon--img {
  width: 18px;
  height: 18px;
  display: block;
  flex: 0 0 auto;
}
.rr-find-people__title { font-size: var(--rr-fs-7); text-transform: uppercase; line-height: var(--rr-lh-condensed); margin: 0; }
.rr-find-people__sub { font-family: var(--rr-font-label); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); color: var(--rr-ink-muted); max-width: var(--rr-measure-lg); }

/* SHOP BY STYLE grid — Figma HomePage is 4 square sticker tiles across. */
.rr-style-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--rr-space-2);
}
.rr-style-card {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--rr-paper);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  padding: var(--rr-space-2) var(--rr-space-2) 0;
  text-decoration: none;
  transition: transform var(--rr-dur) var(--rr-ease), border-color var(--rr-dur) var(--rr-ease), box-shadow var(--rr-dur) var(--rr-ease);
}
.rr-style-card__art {
  position: relative; display: block;
  width: 100%; aspect-ratio: 4 / 5;
  border-radius: var(--rr-radius-sm);
  background:
    radial-gradient(circle at 70% 20%, var(--rr-accent-hi), transparent 42%),
    radial-gradient(circle at 25% 75%, var(--rr-purple-deep), transparent 50%),
    linear-gradient(160deg, var(--rr-surface-2), var(--rr-surface));
}
.rr-style-card__label {
  display: flex; align-items: center; justify-content: space-between; gap: var(--rr-space-2);
  margin-top: var(--rr-space-2);
  padding: var(--rr-space-2);
  background: #000;
  color: #fff;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-style-card__star, .rr-polaroid__star, .rr-recent-card__star { color: #fff; font-size: var(--rr-fs-1); line-height: 1; }
.rr-style-card:hover { transform: translateY(var(--rr-card-hover-lift)); border-color: var(--rr-accent); box-shadow: var(--rr-shadow-accent); }

/* RECENTLY LISTED product grid */
.rr-recent-grid { display: grid; grid-template-columns: var(--rr-grid-2-columns); gap: var(--rr-space-4); }
.rr-recent-card {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--rr-paper);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  padding: var(--rr-space-2) var(--rr-space-2) 0;
  text-decoration: none;
  transition: transform var(--rr-dur) var(--rr-ease), border-color var(--rr-dur) var(--rr-ease), box-shadow var(--rr-dur) var(--rr-ease);
}
.rr-recent-card__media { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; border-radius: var(--rr-radius-sm); overflow: hidden; background: var(--rr-surface-2); }
.rr-recent-card__image { width: 100%; height: 100%; object-fit: cover; }
.rr-recent-card__placeholder {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 30% 30%, var(--rr-accent-hi), transparent 45%),
    linear-gradient(160deg, var(--rr-surface-2), var(--rr-purple-deep));
}
.rr-recent-card__label {
  display: flex; align-items: center; justify-content: space-between; gap: var(--rr-space-2);
  margin-top: var(--rr-space-2);
  padding: var(--rr-space-2);
  background: #000; color: #fff;
  font-family: var(--rr-font-label); font-size: var(--rr-fs-0); font-weight: 700;
  letter-spacing: var(--rr-tracking-wide); text-transform: uppercase;
}
.rr-recent-card__price { color: var(--rr-accent-hi); white-space: nowrap; }
.rr-recent-card:hover { transform: translateY(var(--rr-card-hover-lift)); border-color: var(--rr-accent); box-shadow: var(--rr-shadow-accent); }
.rr-center { text-align: center; }
.rr-more-link { margin-top: var(--rr-space-4); }

/* LIST YOUR ITEM CTA */
.rr-list-cta { display: flex; justify-content: center; margin-block: var(--rr-space-6); }
.rr-btn--camera { display: inline-flex; align-items: center; gap: var(--rr-space-2); }
.rr-btn__icon { width: 18px; height: 18px; }

/* Category polaroid grids — Figma home rails are 2-up */
.rr-cat-section {
  padding-block: var(--rr-space-4) var(--rr-space-5);
}
.rr-cat-section .rr-section__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--rr-space-3);
  margin-bottom: var(--rr-space-3);
}
.rr-cat-section .rr-section__title {
  margin: 0;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-4);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-home .rr-cat-section .rr-container {
  padding-inline: var(--rr-polaroid-gutter);
}
.rr-recent-rail .rr-section__title {
  font-size: var(--rr-fs-2);
  font-weight: 400;
}
.rr-cat-section .rr-more-link {
  margin: 0;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink-muted);
  text-decoration: none;
}
.rr-cat-section .rr-more-link:hover { color: var(--rr-accent-hi); }
.rr-recent-rail .rr-more-link {
  text-transform: none;
  font-size: var(--rr-fs-1);
}
.rr-cat-section + .rr-cat-section { padding-top: 0; }
.rr-cat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--rr-space-3);
  padding-top: var(--rr-space-2);
  overflow: visible;
}
/* Figma zine: rotate polaroid cards for collage energy */
.rr-cat-grid .rr-polaroid:nth-child(4n+1) { transform: rotate(-1.2deg); }
.rr-cat-grid .rr-polaroid:nth-child(4n+2) { transform: rotate(0.8deg); }
.rr-cat-grid .rr-polaroid:nth-child(4n+3) { transform: rotate(-0.55deg); }
.rr-cat-grid .rr-polaroid:nth-child(4n) { transform: rotate(1deg); }
.rr-cat-grid .rr-polaroid:nth-child(4n+1):hover { transform: rotate(-1.2deg) translateY(var(--rr-card-hover-lift)); }
.rr-cat-grid .rr-polaroid:nth-child(4n+2):hover { transform: rotate(0.8deg) translateY(var(--rr-card-hover-lift)); }
.rr-cat-grid .rr-polaroid:nth-child(4n+3):hover { transform: rotate(-0.55deg) translateY(var(--rr-card-hover-lift)); }
.rr-cat-grid .rr-polaroid:nth-child(4n):hover { transform: rotate(1deg) translateY(var(--rr-card-hover-lift)); }
.rr-polaroid {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--rr-paper);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  padding: var(--rr-space-2) var(--rr-space-2) 0;
  text-decoration: none;
  transition: transform var(--rr-dur) var(--rr-ease), border-color var(--rr-dur) var(--rr-ease), box-shadow var(--rr-dur) var(--rr-ease);
}
.rr-polaroid__art {
  position: relative; display: block;
  width: 100%; aspect-ratio: 4 / 5;
  border-radius: var(--rr-radius-sm);
  background:
    radial-gradient(circle at 72% 22%, var(--rr-accent-hi), transparent 40%),
    radial-gradient(circle at 22% 78%, var(--rr-purple-deep), transparent 52%),
    linear-gradient(150deg, var(--rr-surface-2), var(--rr-surface));
}
/* Legacy art-label bar — caption (Figma polaroid) owns the black strip now. */
.rr-polaroid__art + .rr-polaroid__label {
  display: flex; align-items: center; justify-content: space-between; gap: var(--rr-space-2);
  margin-top: var(--rr-space-2);
  padding: var(--rr-space-2);
  background: #111;
  color: #fff;
  font-family: var(--rr-font-label); font-size: var(--rr-fs-0); font-weight: 700;
  letter-spacing: var(--rr-tracking-wide); text-transform: uppercase;
}
.rr-polaroid:hover { transform: translateY(var(--rr-card-hover-lift)); border-color: var(--rr-accent); box-shadow: var(--rr-shadow-accent); }

/* Mobile: category rails stay 2-up; style stickers stay 4-up like Figma. */
@media (max-width: 900px) {
  .rr-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .rr-hero--figma .rr-hero__inner,
  .rr-hero--figma .rr-hero__banner {
    padding-inline: var(--rr-home-gutter);
  }
  .rr-hero__search {
    gap: var(--rr-space-1);
    padding: var(--rr-space-1) var(--rr-space-1) var(--rr-space-1) var(--rr-space-3);
  }
  .rr-find-people__art { min-height: var(--rr-space-7); }
  .rr-find-people__copy { width: min(100% - 1.5rem, 18rem); }
  .rr-style-grid { gap: var(--rr-space-2); }
  .rr-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rr-space-2); }
  .rr-recent-grid { gap: var(--rr-space-2); }
}


/* ======================================================================
   APPROVED PAGE COMPOSITIONS
   Distinct A3 chrome for content, account, seller, and recovery surfaces.
   ====================================================================== */
.rr-tape-card { position: relative; overflow: visible; }
.rr-tape-card::before {
  content: "";
  position: absolute;
  z-index: var(--rr-z-sticky);
  top: var(--rr-tape-card-top);
  left: var(--rr-half);
  width: var(--rr-tape-card-width);
  aspect-ratio: 900 / 191;
  background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat;
  filter: var(--rr-tape-asset-shadow);
  transform: var(--rr-tape-card-transform);
}
.rr-tape-card:nth-child(even)::before { transform: var(--rr-tape-card-transform-alt); }
.rr-about-head,
.rr-contact-head,
.rr-hiw-head,
.rr-account-hero,
.rr-seller-head { position: relative; background: var(--rr-bg-deep); border-bottom: var(--rr-bd) solid var(--rr-accent); }
.rr-about-head__inner,
.rr-contact-head .rr-container,
.rr-hiw-head__inner,
.rr-account-hero .rr-container { position: relative; z-index: var(--rr-component-layer); padding-block: var(--rr-space-7); }
.rr-about-head h1,
.rr-contact-head h1,
.rr-hiw-head h1,
.rr-account-hero h1 { margin: var(--rr-heading-kicker-offset) 0 var(--rr-space-3); font-size: var(--rr-fs-8); text-transform: uppercase; }
.rr-about-prose { display: grid; gap: var(--rr-space-4); justify-items: start; }
.rr-about-values { margin-top: var(--rr-space-6); background: var(--rr-accent); color: var(--rr-accent-ink); }
.rr-about-values .rr-container { position: relative; z-index: var(--rr-component-layer); padding-block: var(--rr-space-6); }
.rr-values { color: var(--rr-accent-ink); }
.rr-values h2 { color: inherit; }
.rr-values__glyph { display: block; font-family: var(--rr-font-display); font-size: var(--rr-fs-7); line-height: var(--rr-lh-solid); }
.rr-contact-card { position: relative; }
.rr-contact-card__body,
.rr-info-panel,
.rr-faq-item { padding: var(--rr-space-4); }
.rr-sticker-float { position: absolute; z-index: var(--rr-z-sticky); top: calc(var(--rr-space-3) * -1); right: var(--rr-space-3); }
.rr-stack--lg { display: grid; align-content: start; gap: var(--rr-space-4); }
.rr-info-row { display: grid; gap: var(--rr-space-1); padding-block: var(--rr-space-3); border-bottom: var(--rr-bd) dashed var(--rr-border); }
.rr-info-row:last-child { border-bottom: 0; }
.rr-hiw-part__head { display: flex; align-items: end; justify-content: space-between; gap: var(--rr-space-3); margin-bottom: var(--rr-space-5); }
.rr-step { position: relative; padding: var(--rr-space-4); overflow: visible; }
.rr-step__num { display: block; color: var(--rr-accent); font-family: var(--rr-font-display); font-size: var(--rr-fs-7); line-height: var(--rr-lh-solid); }
.rr-hiw-note { margin-top: var(--rr-space-5); }
.rr-hiw-actions { margin-top: var(--rr-space-5); }
.rr-toc { margin-bottom: var(--rr-space-6); padding: var(--rr-space-4); border-left-color: var(--rr-accent); }
.rr-toc ol { columns: var(--rr-toc-columns); gap: var(--rr-space-5); margin: 0; padding-left: var(--rr-space-4); }
.rr-toc a { color: var(--rr-ink-muted); font-family: var(--rr-font-label); font-size: var(--rr-fs-1); text-transform: uppercase; }
.rr-toc a:hover { color: var(--rr-accent); }
.rr-404-page {
  overflow-x: clip;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}
.rr-404-page .rr-container {
  width: 100%;
  max-width: min(100%, var(--rr-content-narrow));
  box-sizing: border-box;
  padding-inline: var(--rr-space-3);
}
.rr-404panel {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: var(--rr-space-4) var(--rr-space-3);
  background: var(--rr-surface);
  border: var(--rr-bd) solid var(--rr-accent);
  box-shadow: 4px 4px 0 var(--rr-accent);
  overflow: hidden;
  overflow-wrap: anywhere;
}
.rr-404panel .rr-empty {
  position: relative;
  z-index: var(--rr-component-layer);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding-inline: 0;
}
.rr-404panel .rr-empty__art {
  color: var(--rr-accent);
  text-shadow: var(--rr-shadow);
  max-width: 100%;
  font-size: clamp(2.5rem, 1.6rem + 8vw, 6.5rem);
}
.rr-404panel h1 {
  margin: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: manual;
  line-height: var(--rr-lh-tight);
  font-size: clamp(1.35rem, 0.95rem + 3.4vw, 2.75rem);
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.rr-404panel .rr-link-mono {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}
.rr-404-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  gap: var(--rr-space-2);
}
.rr-404-actions .rr-btn {
  width: 100%;
  max-width: 100%;
  justify-content: center;
  box-sizing: border-box;
}
.rr-404search {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--rr-space-2);
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.rr-404search .rr-input {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.rr-404search .rr-btn {
  width: 100%;
  justify-content: center;
  box-sizing: border-box;
}
@media (min-width: 560px) {
  .rr-404-page .rr-container { padding-inline: var(--rr-gutter); }
  .rr-404panel {
    padding: var(--rr-space-5);
    box-shadow: var(--rr-shadow-accent);
  }
  .rr-404-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
  .rr-404-actions .rr-btn {
    width: auto;
  }
  .rr-404search {
    grid-template-columns: minmax(0, 1fr) auto;
    width: min(100%, var(--rr-measure-lg));
  }
  .rr-404search .rr-btn {
    width: auto;
  }
}
.rr-account-hero { overflow: visible; }
.rr-account-hero .rr-tape { z-index: var(--rr-z-sticky); }
.rr-seller-head { display: flex; align-items: end; justify-content: space-between; gap: var(--rr-space-4); margin-bottom: var(--rr-space-5); padding: var(--rr-space-5); overflow: visible; }
.rr-seller-head__actions { display: flex; flex-wrap: wrap; gap: var(--rr-space-2); position: relative; z-index: var(--rr-component-layer); }
.rr-seller-head__shop { position: relative; z-index: var(--rr-component-layer); }
.rr-product-kicker { position: relative; min-height: var(--rr-space-6); grid-column: var(--rr-grid-full-span); }
.rr-product-kicker .rr-tape { z-index: var(--rr-z-sticky); }
.rr-page-shell__card p { margin: 0; }
.rr-lede { color: var(--rr-ink-muted); font-size: var(--rr-fs-3); line-height: var(--rr-lh-normal); }
.rr-content-form { display: grid; gap: var(--rr-space-2); }
.rr-content-form .rr-btn { justify-self: start; margin-top: var(--rr-space-2); }
.rr-step ol { color: var(--rr-ink-muted); padding-left: var(--rr-space-4); }
.rr-step li + li { margin-top: var(--rr-space-1); }
.rr-step .rr-btn { margin-top: var(--rr-space-3); }
.rr-prose section { border-top: var(--rr-bd) dashed var(--rr-border); margin-top: var(--rr-space-5); padding-top: var(--rr-space-5); }
.rr-prose section:first-of-type { border-top: 0; margin-top: 0; padding-top: 0; }
.rr-prose h2 { font-size: var(--rr-fs-4); }
.rr-prose p,
.rr-prose li { color: var(--rr-ink-muted); max-width: var(--rr-measure-legal); }
.rr-terms-signoff { margin-top: var(--rr-space-6); text-align: center; }
.rr-terms-signoff .tagline { color: var(--rr-accent); font-family: var(--rr-font-display); font-size: var(--rr-fs-3); font-weight: 900; }

/* Content / legal — Figma terms numbered cards (purple system) */
.rr-terms-page { padding-bottom: var(--rr-space-7); }
.rr-terms-head { position: relative; background: var(--rr-bg-deep); border-bottom: var(--rr-bd) solid var(--rr-accent); }
.rr-terms-head__inner { position: relative; z-index: var(--rr-component-layer); padding-block: var(--rr-space-7); display: grid; gap: var(--rr-space-3); justify-items: start; }
.rr-terms-head h1 { margin: 0; font-size: var(--rr-fs-8); text-transform: uppercase; letter-spacing: -0.02em; }
.rr-terms-back { color: var(--rr-accent); font-family: var(--rr-font-label); font-size: var(--rr-fs-1); text-transform: uppercase; letter-spacing: var(--rr-tracking-wide); text-decoration: none; }
.rr-terms-back:hover { color: var(--rr-accent-hi); }
.rr-terms-updated { margin: 0; }
.rr-terms-stack { display: grid; gap: var(--rr-space-4); margin-block: var(--rr-space-5); }
.rr-terms-card { padding: 0; overflow: hidden; }
.rr-terms-card:hover { transform: none; }
.rr-terms-card__head {
  display: flex;
  align-items: center;
  gap: var(--rr-space-3);
  padding: var(--rr-space-4);
  border-bottom: var(--rr-bd) solid color-mix(in srgb, var(--rr-accent) 45%, transparent);
  background: color-mix(in srgb, var(--rr-surface-2) 88%, var(--rr-purple-deep));
}
.rr-terms-card__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem;
  height: 2.4rem;
  padding-inline: var(--rr-space-2);
  background: var(--rr-accent);
  color: var(--rr-accent-ink);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-2);
  font-weight: 900;
  line-height: 1;
  border-radius: 0.35rem;
  box-shadow: var(--rr-shadow-sm);
}
.rr-terms-card__head h2 {
  margin: 0;
  flex: 1;
  font-size: var(--rr-fs-4);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.rr-terms-card__body { padding: var(--rr-space-4); display: grid; gap: var(--rr-space-3); }
.rr-terms-card__body p,
.rr-terms-card__body li { color: var(--rr-ink-muted); max-width: var(--rr-measure-legal); margin: 0; }
.rr-terms-card__body ul { margin: 0; padding-left: var(--rr-space-4); color: var(--rr-ink-muted); }
.rr-terms-card__body li + li { margin-top: var(--rr-space-2); }
.rr-terms-entity {
  margin: 0;
  padding: var(--rr-space-3);
  display: grid;
  gap: var(--rr-space-2);
  background: color-mix(in srgb, var(--rr-surface-3) 80%, var(--rr-lavender));
  border: var(--rr-bd) solid color-mix(in srgb, var(--rr-accent) 35%, transparent);
  border-radius: 0.5rem;
}
.rr-terms-entity__row {
  display: grid;
  grid-template-columns: minmax(8ch, 14ch) minmax(0, 1fr);
  gap: var(--rr-space-2) var(--rr-space-3);
  align-items: baseline;
}
.rr-terms-entity dt {
  margin: 0;
  color: var(--rr-accent-hi);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
}
.rr-terms-entity dd { margin: 0; color: var(--rr-ink); overflow-wrap: anywhere; }
.rr-terms-signoff__meta {
  margin: var(--rr-space-2) 0 0;
  color: var(--rr-ink-faint);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
}
.rr-about-page .rr-text-center,
.rr-how-page .rr-text-center {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rr-space-3);
  justify-content: center;
  align-items: center;
}
@media (max-width: 560px) {
  .rr-terms-entity__row { grid-template-columns: 1fr; }
  .rr-terms-card__head { align-items: flex-start; }
  .rr-terms-head h1 { font-size: clamp(1.6rem, 1.1rem + 4vw, 2.4rem); }
}

/* ======================================================================
   ACCOUNT, SELLER, AND LISTING COMPONENTS
   Surface markers keep these component rules isolated from commerce pages.
   ====================================================================== */
html body.rr-grunge-account .woocommerce-MyAccount-navigation,
html body.rr-grunge-account .woocommerce-MyAccount-content,
html body.rr-grunge-account .woocommerce-form-login,
html body.rr-grunge-account .woocommerce-form-register,
html body.rr-grunge-account .woocommerce-ResetPassword {
  color: var(--rr-ink) !important;
  background: var(--rr-card-bg) !important;
  border: var(--rr-bd) solid var(--rr-card-border) !important;
  border-radius: var(--rr-radius) !important;
  box-shadow: var(--rr-shadow-none) !important;
  padding: var(--rr-space-4) !important;
}
html body.rr-grunge-account .rr-account-hero {
  grid-column: var(--rr-grid-full-span) !important;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  overflow-x: hidden;
}
html body.rr-grunge-account,
html body.rr-grunge-account .woocommerce,
html body.rr-grunge-account .woocommerce-MyAccount-content {
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}
html body.rr-grunge-account .woocommerce-orders-table-responsive,
html body.rr-grunge-account .woocommerce-MyAccount-content table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
html body.rr-grunge-account .woocommerce-MyAccount-content > h2,
html body.rr-grunge-account .woocommerce-MyAccount-content > h3 { padding-bottom: var(--rr-space-3); border-bottom: var(--rr-bd) solid var(--rr-accent); }
html body.rr-grunge-account .woocommerce-Address { padding: var(--rr-space-4); background: var(--rr-surface); border: var(--rr-bd) solid var(--rr-border); }
html body.rr-grunge-account .woocommerce-MyAccount-navigation ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border: 0 !important;
}
html body.rr-grunge-account .woocommerce-MyAccount-navigation li a {
  display: block !important;
  color: var(--rr-ink-muted) !important;
  background: transparent !important;
  border-bottom: var(--rr-bd) solid var(--rr-border) !important;
  padding: var(--rr-space-3) !important;
  font-family: var(--rr-font-label) !important;
  font-size: var(--rr-fs-1) !important;
  letter-spacing: var(--rr-tracking-wide) !important;
  text-transform: uppercase !important;
}
html body.rr-grunge-account .woocommerce-MyAccount-navigation li.is-active a,
html body.rr-grunge-account .woocommerce-MyAccount-navigation li a:hover {
  color: var(--rr-accent) !important;
  background: var(--rr-surface-2) !important;
}
html body.rr-grunge-account .woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--rr-sale) !important; }
html body.rr-grunge-account input,
html body.rr-grunge-account select,
html body.rr-grunge-account textarea,
html body.rr-grunge-seller .rr-seller-dashboard .rr-input,
html body.rr-grunge-seller .rr-seller-dashboard .rr-select,
html body.rr-grunge-listing .rr-listing-form .rr-input,
html body.rr-grunge-listing .rr-listing-form .rr-select,
html body.rr-grunge-listing .rr-listing-form input:not([type="checkbox"]):not([type="radio"]),
html body.rr-grunge-listing .rr-listing-form select,
html body.rr-grunge-listing .rr-listing-form textarea {
  width: 100% !important;
  color: var(--rr-ink) !important;
  background: var(--rr-surface-3) !important;
  border: var(--rr-bd) solid var(--rr-border) !important;
  border-radius: var(--rr-radius-sm) !important;
  box-shadow: var(--rr-shadow-none) !important;
  font-family: var(--rr-font-body) !important;
  padding: var(--rr-input-padding) !important;
}
html body.rr-grunge-account button,
html body.rr-grunge-account .button,
html body.rr-grunge-account .rr-btn,
html body.rr-grunge-seller .rr-seller-dashboard .rr-btn,
html body.rr-grunge-listing .rr-listing-form .rr-btn,
html body.rr-grunge-listing .rr-listing-modal .rr-btn {
  color: var(--rr-accent-ink) !important;
  background: var(--rr-accent) !important;
  border: var(--rr-bd) solid var(--rr-accent) !important;
  border-radius: var(--rr-radius-sm) !important;
  box-shadow: var(--rr-shadow-sm) !important;
  font-family: var(--rr-font-label) !important;
  padding: var(--rr-btn-padding) !important;
  text-transform: uppercase !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  height: auto !important;
}
html body.rr-grunge-account .woocommerce-info,
html body.rr-grunge-account .woocommerce-message,
html body.rr-grunge-account .woocommerce-error,
html body.rr-grunge-account .rr-alert,
html body.rr-grunge-seller .rr-alert,
html body.rr-grunge-listing .rr-alert {
  color: var(--rr-ink) !important;
  background: var(--rr-surface-2) !important;
  border: var(--rr-bd) solid var(--rr-border-strong) !important;
  border-left-color: var(--rr-accent) !important;
  border-radius: var(--rr-radius-sm) !important;
  padding: var(--rr-space-3) !important;
}
html body.rr-grunge-account .woocommerce-error { border-left-color: var(--rr-sale) !important; }
html body.rr-grunge-account .woocommerce-orders-table,
html body.rr-grunge-account .woocommerce-table,
html body.rr-grunge-seller .rr-table {
  width: 100% !important;
  color: var(--rr-ink) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: var(--rr-shadow-none) !important;
}
html body.rr-grunge-account .woocommerce-orders-table th,
html body.rr-grunge-account .woocommerce-table th {
  color: var(--rr-ink-muted) !important;
  background: var(--rr-surface-2) !important;
  border-bottom: var(--rr-bd) solid var(--rr-accent) !important;
  font-family: var(--rr-font-label) !important;
  text-transform: uppercase !important;
}
html body.rr-grunge-account .woocommerce-orders-table td,
html body.rr-grunge-account .woocommerce-table td { border-bottom: var(--rr-bd) solid var(--rr-border) !important; }
html body.rr-grunge-account .woocommerce-orders-table__cell-confirm_items::before {
  content: "Confirm each item only after it reaches you.";
  display: block !important;
  position: static !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  color: var(--rr-ink-muted) !important;
  margin-bottom: var(--rr-space-2) !important;
  font-family: var(--rr-font-label) !important;
  font-size: var(--rr-fs-0) !important;
}
html body.rr-grunge-account .confirm_received.rr-btn {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  position: relative;
  border-left-color: var(--rr-accent) !important;
}
html body.rr-grunge-account .confirm_received.rr-btn:not(.confirmed) {
  pointer-events: auto !important;
  cursor: pointer !important;
  border-left-color: var(--rr-success) !important;
}
html body.rr-grunge-account .confirm_received.rr-btn.confirmed { pointer-events: none !important; cursor: default !important; }
html body.rr-grunge-account .confirm_received.rr-btn.loading::after {
  content: "";
  width: var(--rr-fs-2);
  height: var(--rr-fs-2);
  margin-left: var(--rr-space-2);
  border: var(--rr-bd) solid var(--rr-ink);
  border-top-color: transparent;
  border-radius: var(--rr-radius-pill);
  animation: rr-spin var(--rr-dur-slow) linear infinite;
}
@keyframes rr-spin { to { transform: rotate(var(--rr-spin-turn)); } }

html body.rr-grunge-account .woocommerce {
  width: 100% !important;
  max-width: var(--rr-content) !important;
}
html body.rr-grunge-account .woocommerce-orders,
html body.rr-grunge-account .woocommerce-orders-table,
html body.rr-grunge-account .woocommerce-orders-table tbody,
html body.rr-grunge-account .woocommerce-orders-table tr,
html body.rr-grunge-account .woocommerce-orders-table td,
html body.rr-grunge-account .order-tracker-wrapper,
html body.rr-grunge-account .tracker,
html body.rr-grunge-account .tracker-containerP {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
html body.rr-grunge-account .woocommerce-orders-table {
  margin-left: 0 !important;
  table-layout: auto !important;
}
html body.rr-grunge-account .woocommerce-orders-table__row td {
  display: block !important;
}
html body.rr-grunge-account .woocommerce-orders-table td {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: normal !important;
}
html body.rr-grunge-account .woocommerce-orders-table td::before {
  position: static !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: normal !important;
}
html body.rr-grunge-account .woocommerce-orders-table__cell-order_tracker::before {
  content: none !important;
}
html body.rr-grunge-account .woocommerce-orders-table a,
html body.rr-grunge-account .woocommerce-orders-table .button,
html body.rr-grunge-account .woocommerce-orders-table .woocommerce-button,
html body.rr-grunge-account .woocommerce-orders-table .rr-btn {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  height: auto !important;
}
html body.rr-grunge-account .rr-badge {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  height: auto !important;
}
html body.rr-grunge-account .rr-tracking-code,
html body.rr-grunge-account .rr-tracking-code p,
html body.rr-grunge-account .rr-tracking-code code,
html body.rr-grunge-account .rr-tracking-meta {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: normal !important;
}
html body.rr-grunge-account .rr-tracking-code code {
  display: inline-block;
  font-size: var(--rr-fs-1);
  padding: 0.15em 0.3em;
}
html body.rr-grunge-account .tracker-containerP {
  display: flex !important;
  gap: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  padding: 12px 8px 16px !important;
}
html body.rr-grunge-account .stepP {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  max-width: 33.33% !important;
}
html body.rr-grunge-account .labelP,
html body.rr-grunge-account .dateP {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: normal !important;
  text-align: center !important;
}
html body.rr-grunge-account .lineP {
  left: calc(50% + 16px) !important;
  width: calc(100% - 32px) !important;
}
html body.rr-grunge-account .rr-order-item-name {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
}
html body.rr-grunge-account .rr-account-hero h1,
html body.rr-grunge-account .rr-cutout {
  overflow-wrap: anywhere;
}

html body.rr-grunge-seller .rr-seller-dashboard {
  color: var(--rr-ink) !important;
  background: var(--rr-bg) !important;
  font-family: var(--rr-font-body) !important;
}
html body.rr-grunge-seller .rr-seller-back-row { max-width: var(--rr-content) !important; margin-inline: auto !important; }
html body.rr-grunge-seller .rr-seller-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--rr-space-2) !important;
  color: var(--rr-ink) !important;
  background: var(--rr-surface) !important;
  border: var(--rr-bd) solid var(--rr-border) !important;
  border-radius: var(--rr-radius) !important;
  padding: var(--rr-space-2) !important;
}
html body.rr-grunge-seller .rr-seller-tabs .tablinksSeller { width: auto !important; float: none !important; }
html body.rr-grunge-seller .rr-seller-dashboard .rr-btn--ghost {
  color: var(--rr-ink) !important;
  background: var(--rr-surface-2) !important;
  border-color: var(--rr-border-strong) !important;
  box-shadow: var(--rr-shadow-none) !important;
}
html body.rr-grunge-seller .rr-seller-tabs .tablinksSeller.active {
  color: var(--rr-accent-ink) !important;
  background: var(--rr-accent) !important;
  border-color: var(--rr-accent) !important;
}
html body.rr-grunge-seller .rr-seller-panel {
  color: var(--rr-ink) !important;
  background: var(--rr-card-bg) !important;
  border: var(--rr-bd) solid var(--rr-card-border) !important;
  border-radius: var(--rr-radius) !important;
  padding: var(--rr-space-4) !important;
}
html body.rr-grunge-seller .rr-seller-panel[hidden] { display: none !important; }
html body.rr-grunge-seller .rr-seller-listing-card,
html body.rr-grunge-seller .rr-seller-order {
  color: var(--rr-ink) !important;
  background: var(--rr-surface) !important;
  border: var(--rr-bd) solid var(--rr-border) !important;
  border-radius: var(--rr-radius-sm) !important;
  box-shadow: var(--rr-shadow-none) !important;
}
html body.rr-grunge-seller .rr-seller-listing-card { position: relative; overflow: visible; }
html body.rr-grunge-seller .rr-seller-listing-card::before {
  content: "";
  position: absolute;
  z-index: var(--rr-z-sticky);
  top: var(--rr-tape-card-top);
  left: var(--rr-half);
  width: var(--rr-tape-card-width);
  aspect-ratio: 900 / 191;
  background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat;
  transform: var(--rr-tape-card-transform);
  filter: var(--rr-tape-asset-shadow);
}
html body.rr-grunge-seller .rr-seller-listing-card__media { background: var(--rr-surface-2) !important; }
html body.rr-grunge-seller .rr-seller-listing-card__media img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
html body.rr-grunge-seller .rr-seller-listing-card__empty { min-height: 100% !important; }
html body.rr-grunge-seller .rr-seller-order__status-title { font-family: var(--rr-font-display) !important; font-size: var(--rr-fs-3) !important; }
html body.rr-grunge-seller .rr-seller-order__status-help { max-width: var(--rr-measure) !important; font-style: italic !important; }
html body.rr-grunge-seller .rr-seller-order__hidden-submit.is-concealed { display: none !important; }
html body.rr-grunge-seller .rr-seller-order__response { display: none; margin-top: var(--rr-space-2) !important; }
html body.rr-grunge-seller .status-tracker {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--rr-space-4) !important;
  color: var(--rr-ink) !important;
  background: var(--rr-surface-2) !important;
  border: var(--rr-bd) solid var(--rr-border) !important;
  border-radius: var(--rr-radius) !important;
  padding: var(--rr-space-3) !important;
}
html body.rr-grunge-seller .status-step input { position: absolute !important; opacity: 0 !important; }
html body.rr-grunge-seller .status-step label { cursor: pointer !important; }
html body.rr-grunge-seller .status-step .circle { border-color: var(--rr-border-strong) !important; background: var(--rr-surface-3) !important; }
html body.rr-grunge-seller .status-step input:checked + label .circle { background: var(--rr-accent) !important; border-color: var(--rr-accent) !important; }
html body.rr-grunge-seller .rr-seller-profile { display: grid !important; gap: var(--rr-space-3) !important; }
html body.rr-grunge-seller .rr-seller-profile .form-group { margin: 0 !important; }
html body.rr-grunge-seller .rr-seller-profile label { color: var(--rr-ink) !important; font-family: var(--rr-font-label) !important; }
html body.rr-grunge-seller .rr-badge { display: inline-flex !important; }
html body.rr-grunge-seller .rr-seller-customer-modal {
  display: none;
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--rr-z-modal) !important;
  background: var(--rr-overlay-bg) !important;
  padding: var(--rr-space-5) !important;
  overflow: auto !important;
}
html body.rr-grunge-seller .rr-seller-customer-card { max-width: var(--rr-content-narrow) !important; margin: auto !important; padding: var(--rr-space-4) !important; }
html body.rr-grunge-seller .rr-seller-customer-card__close { margin-left: auto !important; }
html body.rr-grunge-seller .rr-seller-customer-card__actions { display: flex !important; flex-wrap: wrap !important; gap: var(--rr-space-2) !important; margin-block: var(--rr-space-3) !important; }

html body.rr-grunge-listing .rr-listing-form .rr-listing-shipping-summary { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: var(--rr-space-2) !important; }
html body.rr-grunge-listing .rr-listing-size-block { opacity: 0; width: 0%; overflow: hidden; }
html body.rr-grunge-listing .rr-listing-size-block.is-visible,
html body.rr-grunge-listing .rr-listing-size-block[style*="opacity: 1"] { opacity: 1 !important; width: 100% !important; overflow: visible !important; }
html body.rr-grunge-listing .rr-listing-size-block .labelGothRebelRags { margin: 0 !important; }
html body.rr-grunge-listing .rr-listing-form .image-preview,
html body.rr-grunge-listing .rr-listing-form .gallery-preview { display: flex !important; flex-wrap: wrap !important; gap: var(--rr-space-2) !important; }
html body.rr-grunge-listing .rr-listing-form .image-preview img,
html body.rr-grunge-listing .rr-listing-form .gallery-preview img { max-width: 100% !important; width: 100% !important; height: 100% !important; object-fit: cover !important; border: 0 !important; border-radius: var(--rr-radius-sm) !important; }
html body.rr-grunge-listing .rr-listing-modal {
  display: none;
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--rr-z-modal) !important;
  background: var(--rr-overlay-bg) !important;
  padding: var(--rr-space-5) !important;
}
html body.rr-grunge-listing .rr-listing-modal__content { max-width: var(--rr-content-narrow) !important; margin: auto !important; }

/* Figma list-your-item.png — presentation layer over preserved seller contract */
html body.rr-grunge-listing .rr-listing-hero {
  max-width: var(--rr-content-narrow);
  margin: 0 auto var(--rr-space-4);
  text-align: center;
}
html body.rr-grunge-listing .rr-listing-hero__kicker {
  color: var(--rr-accent-hi) !important;
  margin-bottom: var(--rr-space-1);
}
html body.rr-grunge-listing .rr-listing-hero__title {
  margin: 0 0 var(--rr-space-2);
  font-family: var(--rr-font-display) !important;
  font-size: var(--rr-fs-6) !important;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink) !important;
}
html body.rr-grunge-listing .rr-listing-hero__lede {
  margin: 0 auto;
  max-width: var(--rr-measure);
  color: var(--rr-ink-muted) !important;
}
html body.rr-grunge-listing .rr-listing-card {
  background: var(--rr-surface) !important;
  border: var(--rr-bd) solid var(--rr-border) !important;
  border-radius: var(--rr-radius-lg) !important;
  padding: var(--rr-space-4) !important;
  box-shadow: var(--rr-shadow-none) !important;
}
html body.rr-grunge-listing .rr-listing-form {
  display: grid !important;
  gap: var(--rr-space-4) !important;
}
html body.rr-grunge-listing .rr-listing-field { display: grid; gap: var(--rr-space-1); min-width: 0; }
html body.rr-grunge-listing .rr-listing-field-row { align-items: start; }
html body.rr-grunge-listing .rr-listing-label {
  display: inline-flex;
  align-items: center;
  gap: var(--rr-space-1);
  margin: 0;
  color: var(--rr-ink) !important;
  font-family: var(--rr-font-label) !important;
  font-size: var(--rr-fs-1) !important;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
html body.rr-grunge-listing .rr-listing-label__mark {
  color: var(--rr-accent-hi);
  font-style: normal;
  line-height: 1;
}
html body.rr-grunge-listing .rr-listing-hint {
  margin: 0;
  color: var(--rr-ink-muted) !important;
  font-size: var(--rr-fs-1);
}
html body.rr-grunge-listing .rr-listing-choice-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rr-space-3);
}
html body.rr-grunge-listing .rr-listing-choice {
  display: inline-flex;
  align-items: center;
  gap: var(--rr-space-1);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
}
html body.rr-grunge-listing .rr-listing-auction {
  display: grid;
  gap: var(--rr-space-3);
  margin-top: var(--rr-space-2);
  padding: var(--rr-space-3);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  background: var(--rr-surface-2);
}
html body.rr-grunge-listing .rr-listing-auction.hidden { display: none !important; }
html body.rr-grunge-listing .rr-listing-form .rr-input,
html body.rr-grunge-listing .rr-listing-form .rr-select,
html body.rr-grunge-listing .rr-listing-form .rr-textarea,
html body.rr-grunge-listing .rr-listing-form select,
html body.rr-grunge-listing .rr-listing-form textarea {
  border-color: var(--rr-accent) !important;
  background: var(--rr-surface-3) !important;
}
html body.rr-grunge-listing .rr-listing-price__control {
  position: relative;
  display: grid;
}
html body.rr-grunge-listing .rr-listing-price__control .rr-input { padding-right: 5.5rem !important; }
html body.rr-grunge-listing .rr-listing-price__currency {
  position: absolute;
  right: var(--rr-space-3);
  top: 50%;
  transform: translateY(-50%);
  color: var(--rr-accent-hi);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  letter-spacing: var(--rr-tracking-wide);
  pointer-events: none;
}
html body.rr-grunge-listing .rr-listing-contact {
  display: grid;
  gap: var(--rr-space-2);
  margin-top: var(--rr-space-2);
}
html body.rr-grunge-listing .rr-listing-details > summary {
  cursor: pointer;
  list-style: none;
}
html body.rr-grunge-listing .rr-listing-details > summary::-webkit-details-marker { display: none; }
html body.rr-grunge-listing .rr-listing-details .showDetails {
  margin-left: auto;
  color: var(--rr-ink-muted);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}
html body.rr-grunge-listing .rr-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--rr-space-2);
}
html body.rr-grunge-listing .rr-photo-slot {
  position: relative;
  display: block;
  aspect-ratio: 1;
  min-height: 0;
  margin: 0;
  cursor: pointer;
  border-radius: var(--rr-radius);
  overflow: hidden;
}
html body.rr-grunge-listing .rr-photo-slot__input {
  position: absolute !important;
  inset: 0 !important;
  opacity: 0 !important;
  width: 100% !important;
  height: 100% !important;
  cursor: pointer !important;
  z-index: 2;
}
html body.rr-grunge-listing .rr-photo-slot__frame {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  gap: var(--rr-space-1);
  text-align: center;
  color: var(--rr-accent-hi);
  background: var(--rr-surface-3);
  border: 1px dashed var(--rr-accent);
  border-radius: var(--rr-radius);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
html body.rr-grunge-listing .rr-photo-slot--cover .rr-photo-slot__caption { color: var(--rr-accent-hi); font-weight: 700; }
html body.rr-grunge-listing .rr-photo-slot--ghost { cursor: default; pointer-events: none; }
html body.rr-grunge-listing .rr-photo-slot__preview {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block !important;
  pointer-events: none;
}
html body.rr-grunge-listing .rr-photo-slot.has-preview .rr-photo-slot__frame { opacity: 0.18; }
html body.rr-grunge-listing .rr-photo-gallery-preview {
  margin-top: var(--rr-space-2);
}
html body.rr-grunge-listing .rr-photo-gallery-preview img {
  width: calc((100% - (var(--rr-space-2) * 2)) / 3) !important;
  max-width: none !important;
  aspect-ratio: 1;
  object-fit: cover;
}
html body.rr-grunge-listing .rr-listing-ship-block {
  margin: 0 0 var(--rr-space-2);
  padding: var(--rr-space-3);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  background: var(--rr-surface-2);
}
html body.rr-grunge-listing .rr-listing-ship-block .goth-label {
  display: flex;
  align-items: flex-start;
  gap: var(--rr-space-2);
  margin: var(--rr-space-2) 0 0;
  color: var(--rr-ink);
}
html body.rr-grunge-listing .rr-listing-shipping-note {
  margin: var(--rr-space-2) 0 0;
  color: var(--rr-ink-muted);
  font-size: var(--rr-fs-1);
}
html body.rr-grunge-listing .rr-listing-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--rr-space-2);
  color: var(--rr-accent-hi);
}
html body.rr-grunge-listing .rr-listing-divider span {
  height: 1px;
  background: var(--rr-accent);
  opacity: 0.7;
}
html body.rr-grunge-listing .rr-listing-submit {
  justify-content: center !important;
  min-height: 3rem;
  font-family: var(--rr-font-display) !important;
  letter-spacing: var(--rr-tracking-wide);
}
html body.rr-grunge-listing .rr-listing-form .subCatBox {
  margin-top: var(--rr-space-2);
  display: none;
}
html body.rr-grunge-listing .rr-listing-form #category,
html body.rr-grunge-listing .rr-listing-form .subCatBox select {
  width: 100% !important;
}
html body.rr-grunge-listing .rr-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Figma profile-section.png — seller profile card + polaroid shelf */
html body.rr-grunge-seller .rr-seller-profile-card {
  display: grid !important;
  gap: var(--rr-space-4) !important;
  align-items: stretch !important;
  padding: var(--rr-space-4) !important;
  background: linear-gradient(180deg, var(--rr-purple-deep) 0%, var(--rr-surface) 100%) !important;
  border: var(--rr-bd) solid var(--rr-border) !important;
  border-radius: var(--rr-radius-lg) !important;
  overflow: hidden !important;
}
html body.rr-grunge-seller .rr-seller-profile-card__identity {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--rr-space-3);
  align-items: center;
}
html body.rr-grunge-seller .rr-seller-profile-card__avatar {
  width: 80px;
  height: 80px;
  border-radius: var(--rr-radius-pill);
  overflow: hidden;
  border: 2px solid var(--rr-lavender);
  background: var(--rr-surface-2);
  flex: 0 0 auto;
}
html body.rr-grunge-seller .rr-seller-profile-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
html body.rr-grunge-seller .rr-seller-profile-card__avatar-fallback {
  display: grid;
  place-content: center;
  width: 100%;
  height: 100%;
  color: var(--rr-accent-hi);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-5);
}
html body.rr-grunge-seller .rr-seller-profile-card__name-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--rr-space-2);
}
html body.rr-grunge-seller .rr-seller-profile-card__name {
  margin: 0;
  color: var(--rr-accent-hi) !important;
  font-family: var(--rr-font-display) !important;
  font-size: var(--rr-fs-4) !important;
  line-height: var(--rr-lh-snug);
}
html body.rr-grunge-seller .rr-seller-profile-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: var(--rr-radius-pill);
  background: rgba(196, 181, 253, 0.18);
  color: var(--rr-ink);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
html body.rr-grunge-seller .rr-seller-profile-card__verified {
  display: inline-grid;
  place-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: var(--rr-radius-pill);
  background: var(--rr-lavender);
  color: var(--rr-bg-deep);
  font-size: var(--rr-fs-1);
  font-weight: 700;
}
html body.rr-grunge-seller .rr-seller-profile-card__lede { margin: var(--rr-space-1) 0 0; }
html body.rr-grunge-seller .rr-seller-profile-card__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--rr-space-2);
}
html body.rr-grunge-seller .rr-seller-stat {
  display: grid;
  gap: var(--rr-space-0);
  justify-items: center;
  padding: var(--rr-space-3) var(--rr-space-2);
  background: #ffffff;
  color: #141414;
  border-radius: var(--rr-radius);
}
html body.rr-grunge-seller .rr-seller-stat__value {
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-4);
  line-height: 1;
  color: #141414;
}
html body.rr-grunge-seller .rr-seller-stat__label {
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: #6b6b6b;
}
html body.rr-grunge-seller .rr-seller-stat__star { color: #f5a623; margin-right: 0.15em; }
html body.rr-grunge-seller .rr-seller-items-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--rr-space-2);
  margin-bottom: var(--rr-space-4);
  padding: var(--rr-space-3);
  background: #ffffff;
  color: #141414;
  border-radius: var(--rr-radius);
}
html body.rr-grunge-seller .rr-seller-items-banner__title {
  margin: 0;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-2);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: #141414;
}
html body.rr-grunge-seller .rr-seller-items-banner__count { margin: 0; color: #6b6b6b !important; }
html body.rr-grunge-seller .rr-seller-items-grid {
  background: var(--rr-bg-deep);
  border-radius: var(--rr-radius);
  padding: var(--rr-space-3);
}
html body.rr-grunge-seller .rr-polaroid-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html body.rr-grunge-seller .rr-polaroid-card::before { display: none !important; }
html body.rr-grunge-seller .rr-seller-listing-card__link {
  display: grid;
  gap: var(--rr-space-2);
  color: inherit;
  text-decoration: none;
}
html body.rr-grunge-seller .rr-polaroid-card__media {
  position: relative;
  background: #111 !important;
  border: 10px solid #ffffff;
  border-bottom-width: 42px;
  border-radius: 2px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35);
}
html body.rr-grunge-seller .rr-polaroid-card__star {
  position: absolute;
  right: 0.35rem;
  bottom: -1.85rem;
  color: #222;
  font-size: 1rem;
  line-height: 1;
}
html body.rr-grunge-seller .rr-polaroid-card__info {
  display: grid;
  gap: 0.15rem;
  padding-inline: 0.15rem;
}
html body.rr-grunge-seller .rr-polaroid-card__title {
  margin: 0;
  color: var(--rr-ink) !important;
  font-family: var(--rr-font-body) !important;
  font-size: var(--rr-fs-2) !important;
  font-weight: 700;
}
html body.rr-grunge-seller .rr-polaroid-card__price {
  margin: 0;
  color: var(--rr-accent-hi) !important;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
}
html body.rr-grunge-seller .rr-polaroid-card__meta {
  margin: 0;
  color: var(--rr-ink-muted) !important;
  font-size: var(--rr-fs-0);
}
html body.rr-grunge-seller .rr-seller-items-empty {
  grid-column: 1 / -1;
  display: grid;
  gap: var(--rr-space-3);
  justify-items: start;
  padding: var(--rr-space-4);
  color: var(--rr-ink-muted);
}

@media (max-width: 720px) {
  html body.rr-grunge-seller .rr-seller-profile-card__identity {
    grid-template-columns: auto 1fr;
  }
  html body.rr-grunge-seller .rr-seller-head__actions {
    grid-column: 1 / -1;
  }
  html body.rr-grunge-listing .rr-photo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  html body.rr-grunge-listing .rr-photo-gallery-preview img {
    width: calc((100% - var(--rr-space-2)) / 2) !important;
  }
}

/* ======================================================================
   COMMERCE COMPONENTS
   Plugin-owned markup receives rr-* classes; WooCommerce markup is styled
   only in the labelled rr-overrides section below.
   ====================================================================== */
.rr-commerce-filter { margin-block: var(--rr-space-4); }
.rr-commerce-subcategories { display: inline-flex; flex-wrap: wrap; gap: var(--rr-space-1); }
.rr-commerce-subcategory,
.rr-commerce-back { cursor: pointer; }
.rr-commerce-current-bid { color: var(--rr-ink-muted); margin-bottom: var(--rr-space-2); }
.rr-commerce-product { min-width: 0; }
.rr-commerce-product .imageWrapper { position: relative; height: 100%; }
.rr-commerce-product .cardPrice { margin: 0; }
.rr-commerce-action { display: block; margin-top: var(--rr-space-2); }
.rr-commerce-action > a { width: 100%; }
.rr-commerce-shipping { padding: var(--rr-space-3); margin-block: var(--rr-space-3); overflow: visible; }
.rr-commerce-shipping .shipH4 { margin: 0 0 var(--rr-space-2); }
.rr-commerce-shipping .custom-dropdown { position: relative; user-select: none; }
.rr-commerce-shipping .selected-option { cursor: pointer; }
.rr-commerce-shipping .dropdown-options {
  display: block;
  position: absolute;
  inset: 100% 0 auto;
  overflow-y: auto;
  z-index: var(--rr-component-layer);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  box-shadow: var(--rr-shadow);
}
.rr-commerce-shipping .dropdown-options[hidden] { display: none; }
.rr-commerce-shipping .dropdown-option { padding: var(--rr-space-2); cursor: pointer; color: var(--rr-ink); }
.rr-commerce-shipping .dropdown-option:hover { background: var(--rr-accent); color: var(--rr-accent-ink); }
.rr-commerce-shipping .dropdown-option { width: 100%; text-align: left; border: 0; background: var(--rr-surface); }
.rr-commerce-shipping .rr-commerce-shipping-price { font-weight: 900; }
html body.rr-grunge-commerce .my-share-button { width: 100%; }
html body.rr-grunge-commerce .my-share-button img { width: var(--rr-checkbox-size); height: var(--rr-checkbox-size); }
html body.rr-grunge-commerce .glow { color: var(--rr-ink); margin-block: var(--rr-space-2); }
html body.rr-grunge-commerce .stepP.activeP .circleP { background: var(--rr-accent); border-color: var(--rr-ink); }
html body.rr-grunge-commerce #bidAmount:focus,
html body.rr-grunge-commerce #bidAmount:active {
  border-color: var(--rr-accent);
  box-shadow: var(--rr-glow-accent);
  background: var(--rr-surface-2);
}
html body.rr-grunge-commerce .rr-auction-auth-actions { display: grid; gap: var(--rr-space-3); margin-block: var(--rr-space-3); max-width: var(--rr-measure-sm); }
html body.rr-grunge-commerce .rr-auction-auth-actions h4 { margin: 0; }
html body.rr-grunge-commerce .rr-auction-auth-actions .rr-btn { width: fit-content; }
html body.rr-grunge-commerce .rr-auction-signup { border-color: var(--rr-accent); box-shadow: var(--rr-shadow-accent); }

/* ======================================================================
   rr-overrides — WooCommerce-owned shop/product/cart/checkout DOM
   Core forms and controls remain generated by WooCommerce. These selectors
   map that stable output onto Rebel Rags tokens without replacing controls.
   ====================================================================== */
html body.rr-grunge-commerce .woocommerce,
html body.rr-grunge-commerce .wc-block-components-form,
html body.rr-grunge-commerce .wc-block-cart,
html body.rr-grunge-commerce .wc-block-checkout,
html body.rr-grunge-commerce .woocommerce-order {
  color: var(--rr-ink);
}
html body.rr-grunge-commerce .woocommerce-message,
html body.rr-grunge-commerce .woocommerce-info,
html body.rr-grunge-commerce .woocommerce-error,
html body.rr-grunge-commerce .wc-block-components-notice-banner {
  background: var(--rr-surface);
  color: var(--rr-ink);
  border: var(--rr-bd) solid var(--rr-border-strong);
  border-left-color: var(--rr-accent);
  border-radius: var(--rr-radius-sm);
  box-shadow: var(--rr-shadow-sm);
}
html body.rr-grunge-commerce .woocommerce-error { border-left-color: var(--rr-sale); }
html body.rr-grunge-commerce .woocommerce a.button,
html body.rr-grunge-commerce .woocommerce button.button,
html body.rr-grunge-commerce .woocommerce input.button,
html body.rr-grunge-commerce .wc-block-components-button,
html body.rr-grunge-commerce .wp-element-button {
  background: var(--rr-btn-bg);
  color: var(--rr-btn-ink);
  border: var(--rr-bd) solid var(--rr-btn-bg);
  border-radius: var(--rr-radius-sm);
  box-shadow: var(--rr-shadow-sm);
  font-family: var(--rr-font-label);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
}
html body.rr-grunge-commerce .woocommerce a.button:hover,
html body.rr-grunge-commerce .woocommerce button.button:hover,
html body.rr-grunge-commerce .woocommerce input.button:hover,
html body.rr-grunge-commerce .wc-block-components-button:hover,
html body.rr-grunge-commerce .wp-element-button:hover {
  background: var(--rr-btn-bg-hover);
  color: var(--rr-btn-ink);
  border-color: var(--rr-btn-bg-hover);
}
html body.rr-grunge-commerce .woocommerce input.input-text,
html body.rr-grunge-commerce .woocommerce textarea,
html body.rr-grunge-commerce .woocommerce select,
html body.rr-grunge-commerce .wc-block-components-text-input input,
html body.rr-grunge-commerce .wc-block-components-combobox-control input,
html body.rr-grunge-commerce .wc-block-components-address-form select,
html body.rr-grunge-commerce .wc-block-components-quantity-selector input {
  background: var(--rr-surface-3);
  color: var(--rr-ink);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius-sm);
  box-shadow: var(--rr-shadow-none);
}
html body.rr-grunge-commerce .woocommerce input.input-text:focus,
html body.rr-grunge-commerce .woocommerce textarea:focus,
html body.rr-grunge-commerce .woocommerce select:focus,
html body.rr-grunge-commerce .wc-block-components-text-input input:focus,
html body.rr-grunge-commerce .wc-block-components-combobox-control input:focus {
  border-color: var(--rr-accent);
  outline: none;
}
html body.rr-grunge-commerce .wc-block-components-radio-control__input,
html body.rr-grunge-commerce input[type="radio"],
html body.rr-grunge-commerce input[type="checkbox"] { accent-color: var(--rr-accent); }

html body.rr-grunge-commerce.single-product div.product .product_title,
html body.rr-grunge-commerce.single-product div.product .price,
html body.rr-grunge-commerce.single-product div.product .woocommerce-product-details__short-description,
html body.rr-grunge-commerce.single-product div.product .product_meta {
  color: var(--rr-ink);
  background: transparent;
  border-radius: 0;
  box-shadow: var(--rr-shadow-none);
}
html body.rr-grunge-commerce.single-product div.product .price { font-family: var(--rr-font-label); color: var(--rr-accent); }
html body.rr-grunge-commerce.single-product div.product .woocommerce-product-gallery,
html body.rr-grunge-commerce.single-product div.product .woocommerce-tabs,
html body.rr-grunge-commerce.single-product div.product section.related {
  background: var(--rr-surface);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  padding: var(--rr-space-4);
}
html body.rr-grunge-commerce.single-product div.product .rr-pdp__info.summary,
html body.rr-grunge-commerce.single-product div.product .summary.rr-pdp__info {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  overflow: visible;
  max-height: none;
}
html body.rr-grunge-commerce.single-product div.product .woocommerce-product-gallery img {
  border-radius: var(--rr-radius-sm);
}
html body.rr-grunge-commerce.single-product div.product .woocommerce-product-gallery { position: relative; overflow: visible; transform: var(--rr-home-card-rotation-1); }
html body.rr-grunge-commerce.single-product div.product .woocommerce-product-gallery::before {
  content: "";
  position: absolute;
  z-index: var(--rr-z-sticky);
  top: var(--rr-tape-card-top);
  left: var(--rr-half);
  width: var(--rr-tape-width);
  aspect-ratio: 900 / 191;
  background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat;
  transform: var(--rr-tape-card-transform);
  filter: var(--rr-tape-asset-shadow);
}
html body.rr-grunge-commerce.single-product div.product form.cart { border-top: var(--rr-bd) dashed var(--rr-border); padding-top: var(--rr-space-3); }
html body.rr-grunge-commerce.single-product div.product .quantity .qty { color: var(--rr-ink); background: var(--rr-surface-3); }
html body.rr-grunge-commerce .rr-sold-badge { background: var(--rr-surface-3); color: var(--rr-ink-muted); }

html body.rr-grunge-commerce.woocommerce-cart .wp-block-woocommerce-empty-cart-block,
html body.rr-grunge-commerce.woocommerce-cart .wc-block-cart,
html body.rr-grunge-commerce.woocommerce-cart .wc-block-grid__product,
html body.rr-grunge-commerce.woocommerce-cart .cart-empty,
html body.rr-grunge-commerce.woocommerce-cart .rr-graveyard-cart,
html body.rr-grunge-commerce.woocommerce-checkout .wc-block-checkout,
html body.rr-grunge-commerce.woocommerce-checkout .rr-checkout,
html body.rr-grunge-commerce.woocommerce-checkout .woocommerce-order {
  background: transparent;
  color: var(--rr-ink);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
html body.rr-grunge-commerce.woocommerce-cart .wc-block-cart__main,
html body.rr-grunge-commerce.woocommerce-checkout .wc-block-checkout__main { min-width: 0; }
html body.rr-grunge-commerce .wc-block-components-sidebar { position: relative; overflow: visible; box-shadow: var(--rr-shadow-accent); }
html body.rr-grunge-commerce .wc-block-components-sidebar::before {
  content: "";
  position: absolute;
  z-index: var(--rr-z-sticky);
  top: var(--rr-tape-card-top);
  left: var(--rr-half);
  width: var(--rr-tape-card-width);
  aspect-ratio: 900 / 191;
  background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat;
  transform: var(--rr-tape-card-transform-alt);
  filter: var(--rr-tape-asset-shadow);
}
html body.rr-grunge-commerce .wc-block-cart__totals-title,
html body.rr-grunge-commerce .wc-block-checkout__title,
html body.rr-grunge-commerce .wc-block-components-title { font-family: var(--rr-font-display) !important; text-transform: uppercase !important; }
html body.rr-grunge-commerce .wc-block-cart-items__row,
html body.rr-grunge-commerce .wc-block-components-order-summary-item,
html body.rr-grunge-commerce .wc-block-components-totals-wrapper,
html body.rr-grunge-commerce .woocommerce-order-details tr {
  border-color: var(--rr-border);
}
html body.rr-grunge-commerce .wc-block-components-product-name,
html body.rr-grunge-commerce .wc-block-components-formatted-money-amount,
html body.rr-grunge-commerce .wc-block-components-product-metadata,
html body.rr-grunge-commerce .wc-block-components-title,
html body.rr-grunge-commerce .woocommerce-order a { color: var(--rr-ink); }
html body.rr-grunge-commerce .wc-block-components-product-name:hover,
html body.rr-grunge-commerce .woocommerce-order a:hover { color: var(--rr-accent); }
html body.rr-grunge-commerce .wc-block-components-checkout-step,
html body.rr-grunge-commerce .wc-block-components-checkout-order-summary-block,
html body.rr-grunge-commerce .wc-block-components-payment-methods,
html body.rr-grunge-commerce .wc-block-components-radio-control-accordion-option {
  background: var(--rr-surface-2);
  color: var(--rr-ink);
  border-color: var(--rr-border);
  border-radius: var(--rr-radius-sm);
}

/* =====================================================================
   Figma Graveyard Cart — presentation shell (classic WC cart templates)
   ===================================================================== */
html body.rr-grunge-commerce .rr-graveyard-cart-hero,
html body.rr-grunge-commerce .rr-checkout-hero {
  width: 100%;
  max-width: var(--rr-content-narrow);
  margin: 0 auto var(--rr-space-4);
  padding: var(--rr-space-4) var(--rr-gutter) 0;
}
html body.rr-grunge-commerce .rr-graveyard-cart-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: var(--rr-space-1);
  margin: 0 0 var(--rr-space-2);
  padding: 0.25rem 0.5rem;
  border: var(--rr-bd) solid var(--rr-cart-accent);
  border-radius: var(--rr-radius-sm);
  background: var(--rr-cart-accent-soft);
  color: var(--rr-cart-accent);
  font-family: var(--rr-font-label);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
html body.rr-grunge-commerce .rr-graveyard-cart-hero__badge-count,
html body.rr-grunge-commerce .rr-graveyard-cart-hero__badge-label {
  color: inherit;
}
html body.rr-grunge-commerce .rr-graveyard-cart-hero__title,
html body.rr-grunge-commerce .rr-checkout-hero__title {
  margin: 0;
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-5);
  font-weight: 900;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink);
  line-height: var(--rr-lh-tight);
}
html body.rr-grunge-commerce .rr-graveyard-cart-hero__count {
  display: inline-grid;
  place-items: center;
  min-width: 1.75rem;
  height: 1.75rem;
  padding: 0 var(--rr-space-1);
  border-radius: var(--rr-radius-pill);
  background: var(--rr-accent);
  color: var(--rr-accent-ink);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  font-weight: 700;
}
html body.rr-grunge-commerce .rr-graveyard-cart-hero__tagline,
html body.rr-grunge-commerce .rr-checkout-hero__tagline {
  margin: var(--rr-space-1) 0 0;
  color: var(--rr-ink-muted);
  font-size: var(--rr-fs-1);
}

html body.rr-grunge-commerce .rr-graveyard-cart {
  width: 100%;
  max-width: var(--rr-content-narrow);
  margin: 0 auto;
  padding: 0 var(--rr-gutter) var(--rr-space-6);
  display: grid;
  gap: var(--rr-space-4);
}
html body.rr-grunge-commerce .rr-graveyard-cart__items {
  display: grid;
  gap: var(--rr-space-3);
  border: 0;
  background: transparent;
}
html body.rr-grunge-commerce .rr-graveyard-cart__item {
  display: grid;
  grid-template-columns: var(--rr-cart-thumb-size) minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  background: #121214;
  border: var(--rr-bd) solid #27272a;
  border-radius: 8px;
  box-shadow: none;
}
html body.rr-grunge-commerce .rr-graveyard-cart__thumb,
html body.rr-grunge-commerce .rr-graveyard-cart__thumb img {
  width: var(--rr-cart-thumb-size);
  height: var(--rr-cart-thumb-height);
  object-fit: cover;
  border-radius: 4px;
  background: var(--rr-surface-3);
  display: block;
}
html body.rr-grunge-commerce .rr-graveyard-cart__body {
  display: grid;
  gap: var(--rr-space-2);
  min-width: 0;
}
html body.rr-grunge-commerce .rr-graveyard-cart__cat {
  margin: 0;
  color: var(--rr-cart-accent);
  font-family: var(--rr-font-label);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
html body.rr-grunge-commerce .rr-graveyard-cart__title,
html body.rr-grunge-commerce .rr-graveyard-cart__body .product-name a,
html body.rr-grunge-commerce .rr-graveyard-cart__body .product-name {
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: var(--rr-fs-2);
  font-weight: 700;
  text-decoration: none;
  line-height: var(--rr-lh-snug);
}
html body.rr-grunge-commerce .rr-graveyard-cart__title:hover,
html body.rr-grunge-commerce .rr-graveyard-cart__body .product-name a:hover {
  color: var(--rr-accent-hi);
}
html body.rr-grunge-commerce .rr-graveyard-cart__size,
html body.rr-grunge-commerce .rr-graveyard-cart__body .variation,
html body.rr-grunge-commerce .rr-graveyard-cart__body dl.variation {
  margin: 0;
  color: var(--rr-ink-muted);
  font-size: var(--rr-fs-1);
}
html body.rr-grunge-commerce .rr-graveyard-cart__price,
html body.rr-grunge-commerce .rr-graveyard-cart__price .amount,
html body.rr-grunge-commerce .rr-graveyard-cart__price bdi {
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: 13px;
  font-weight: 700;
}
html body.rr-grunge-commerce .rr-graveyard-cart__price-row,
html body.rr-grunge-commerce .rr-graveyard-cart__body > .rr-graveyard-cart__price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rr-space-2);
  width: 100%;
}
/* When price + qty are siblings, pack them like Figma */
html body.rr-grunge-commerce .rr-graveyard-cart__body {
  grid-template-columns: 1fr;
}
html body.rr-grunge-commerce .rr-graveyard-cart__body .rr-graveyard-cart__price,
html body.rr-grunge-commerce .rr-graveyard-cart__body .rr-graveyard-cart__qty {
  align-self: end;
}
html body.rr-grunge-commerce .rr-graveyard-cart__body:has(> .rr-graveyard-cart__price):has(> .rr-graveyard-cart__qty) {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "meta meta"
    "meta meta"
    "meta meta"
    "price qty";
  column-gap: var(--rr-space-2);
  row-gap: 2px;
}
html body.rr-grunge-commerce .rr-graveyard-cart__body:has(> .rr-graveyard-cart__price):has(> .rr-graveyard-cart__qty) > :not(.rr-graveyard-cart__price):not(.rr-graveyard-cart__qty) {
  grid-column: 1 / -1;
}
html body.rr-grunge-commerce .rr-graveyard-cart__body:has(> .rr-graveyard-cart__price):has(> .rr-graveyard-cart__qty) > .rr-graveyard-cart__price {
  grid-area: price;
}
html body.rr-grunge-commerce .rr-graveyard-cart__body:has(> .rr-graveyard-cart__price):has(> .rr-graveyard-cart__qty) > .rr-graveyard-cart__qty {
  grid-area: qty;
  justify-self: end;
}
html body.rr-grunge-commerce .rr-graveyard-cart__qty .quantity {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 0;
  padding: 4px 8px;
  background: #080809;
  border: var(--rr-bd) solid #27272a;
  border-radius: 4px;
  overflow: hidden;
}
html body.rr-grunge-commerce .rr-graveyard-cart__qty .quantity .qty,
html body.rr-grunge-commerce .rr-graveyard-cart__qty input.qty {
  width: 1.5rem;
  min-height: 1.25rem;
  margin: 0;
  border: 0;
  background: transparent;
  color: var(--rr-ink);
  text-align: center;
  font-family: var(--rr-font-label);
  font-size: 11px;
  font-weight: 700;
  -moz-appearance: textfield;
}
html body.rr-grunge-commerce .rr-graveyard-cart__qty .quantity .qty::-webkit-outer-spin-button,
html body.rr-grunge-commerce .rr-graveyard-cart__qty .quantity .qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
html body.rr-grunge-commerce .rr-graveyard-cart__remove-btn,
html body.rr-grunge-commerce .rr-graveyard-cart__remove a.remove {
  display: inline-grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 6px;
  border: var(--rr-bd) solid #27272a;
  border-radius: 4px;
  background: transparent;
  color: var(--rr-ink-muted);
  font-size: 0.85rem;
  line-height: 1;
  text-decoration: none;
  opacity: 1;
}
html body.rr-grunge-commerce .rr-graveyard-cart__remove-btn:hover,
html body.rr-grunge-commerce .rr-graveyard-cart__remove a.remove:hover {
  color: var(--rr-cart-accent);
  background: var(--rr-cart-accent-soft);
}

html body.rr-grunge-commerce .rr-graveyard-cart__actions {
  display: none; /* Figma cart has no coupon/update row */
}
html body.rr-grunge-commerce .rr-graveyard-cart__coupon {
  display: none;
}
html body.rr-grunge-commerce .rr-graveyard-cart__coupon .input-text {
  min-width: 10rem;
  flex: 1 1 10rem;
}
html body.rr-grunge-commerce .rr-graveyard-cart__update {
  background: var(--rr-surface-2) !important;
  color: var(--rr-ink) !important;
  border-color: var(--rr-border-strong) !important;
}

html body.rr-grunge-commerce .rr-graveyard-cart__collaterals,
html body.rr-grunge-commerce .rr-graveyard-cart__totals {
  width: 100%;
}
html body.rr-grunge-commerce .rr-graveyard-cart__totals {
  padding-top: var(--rr-space-3);
  border-top: var(--rr-bd) solid var(--rr-border);
}
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 var(--rr-space-4);
}
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table th,
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table td {
  padding: var(--rr-space-2) 0;
  border: 0;
  background: transparent;
  color: var(--rr-ink-muted);
  font-size: var(--rr-fs-2);
  font-weight: 500;
  vertical-align: middle;
}
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table th {
  text-align: left;
}
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table td {
  text-align: right;
  color: var(--rr-ink);
  font-weight: 700;
}
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table tr.order-total th,
html body.rr-grunge-commerce .rr-graveyard-cart__totals-table tr.order-total td {
  color: var(--rr-ink);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-3);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
  padding-top: var(--rr-space-3);
}
html body.rr-grunge-commerce .rr-graveyard-cart__shipping-slot {
  display: inline-block;
  width: 3.5rem;
  height: 1.1rem;
  border: var(--rr-bd) solid var(--rr-sale);
  border-radius: var(--rr-radius-sm);
  vertical-align: middle;
}
html body.rr-grunge-commerce .rr-graveyard-cart__checkout {
  display: grid;
  gap: var(--rr-space-2);
}
html body.rr-grunge-commerce .rr-graveyard-cart__cta,
html body.rr-grunge-commerce .rr-graveyard-cart__checkout .checkout-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 3.25rem;
  padding: 16px !important;
  background: var(--rr-cart-accent) !important;
  color: var(--rr-cart-accent-ink) !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none;
  font-family: var(--rr-font-label) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase !important;
  text-decoration: none !important;
}
html body.rr-grunge-commerce .rr-graveyard-cart__cta:hover,
html body.rr-grunge-commerce .rr-graveyard-cart__checkout .checkout-button:hover {
  background: #ff1493 !important;
  border-color: transparent !important;
  color: var(--rr-cart-accent-ink) !important;
}
html body.rr-grunge-commerce .rr-graveyard-cart__cta-lock {
  font-size: 1rem;
  line-height: 1;
}
html body.rr-grunge-commerce .rr-graveyard-cart--empty {
  text-align: center;
  padding: var(--rr-space-5) var(--rr-gutter);
  display: grid;
  gap: var(--rr-space-4);
  justify-items: center;
}
html body.rr-grunge-commerce .rr-graveyard-cart__empty-mark {
  width: 4.5rem;
  height: 4.5rem;
  border: var(--rr-bd) dashed var(--rr-cart-accent);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--rr-cart-accent);
  font-size: 1.75rem;
  background: var(--rr-cart-accent-soft);
}
html body.rr-grunge-commerce .rr-graveyard-cart__empty-title {
  margin: 0;
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-4);
  font-weight: 900;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink);
}
html body.rr-grunge-commerce .rr-graveyard-cart__empty-copy {
  margin: 0;
  max-width: 28ch;
  color: var(--rr-ink-muted);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
html body.rr-grunge-commerce .woocommerce-info.cart-empty,
html body.rr-grunge-commerce .cart-empty.woocommerce-info {
  display: none;
}
html body.rr-grunge-commerce .rr-graveyard-cart__return {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  background: var(--rr-cart-accent) !important;
  color: var(--rr-cart-accent-ink, #fff) !important;
  border-color: var(--rr-cart-accent) !important;
  border-radius: var(--rr-radius-pill);
  font-family: var(--rr-font-label);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--rr-cart-accent) 25%, transparent);
}

/* Classic WC cart table fallback (if shortcode path still emits table) */
html body.rr-grunge-commerce.woocommerce-cart table.shop_table.cart:not(.rr-graveyard-cart__totals-table) {
  width: 100%;
  border: 0;
  background: transparent;
}
html body.rr-grunge-commerce.woocommerce-cart table.shop_table.cart thead {
  display: none;
}

/* Checkout Figma presentation shell */
html body.rr-grunge-commerce .rr-checkout {
  width: 100%;
  max-width: var(--rr-content);
  margin: 0 auto;
  padding: 0 var(--rr-gutter) var(--rr-space-6);
}
html body.rr-grunge-commerce .rr-checkout__form {
  display: grid;
  gap: var(--rr-space-4);
}
html body.rr-grunge-commerce .rr-checkout__customer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--rr-space-4);
}
html body.rr-grunge-commerce .rr-checkout__billing,
html body.rr-grunge-commerce .rr-checkout__shipping,
html body.rr-grunge-commerce .rr-checkout__review {
  background: var(--rr-surface);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius-lg);
  padding: var(--rr-space-4);
}
html body.rr-grunge-commerce .rr-checkout__review-title,
html body.rr-grunge-commerce .rr-checkout h3 {
  margin: 0 0 var(--rr-space-3);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-4);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
  color: var(--rr-ink);
}
html body.rr-grunge-commerce .rr-checkout #place_order,
html body.rr-grunge-commerce .rr-checkout .wc-block-components-checkout-place-order-button {
  width: 100%;
  min-height: 3.25rem;
  background: var(--rr-accent) !important;
  color: var(--rr-accent-ink) !important;
  border-color: var(--rr-accent) !important;
  border-radius: var(--rr-radius-lg) !important;
  font-family: var(--rr-font-label) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: var(--rr-tracking-wide);
  box-shadow: var(--rr-glow-accent);
}

@media (max-width: 900px) {
  html body.rr-grunge-commerce .rr-checkout__customer {
    grid-template-columns: var(--rr-grid-1-column);
  }
  html body.rr-grunge-commerce .rr-graveyard-cart,
  html body.rr-grunge-commerce .rr-graveyard-cart-hero,
  html body.rr-grunge-commerce .rr-checkout,
  html body.rr-grunge-commerce .rr-checkout-hero {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  html body.rr-grunge-commerce .rr-graveyard-cart__item {
    grid-template-columns: 64px minmax(0, 1fr) auto;
    gap: var(--rr-space-2);
  }
  html body.rr-grunge-commerce .rr-graveyard-cart__thumb,
  html body.rr-grunge-commerce .rr-graveyard-cart__thumb img {
    width: 64px;
    height: 64px;
  }
  /* Stack coupon + update so 390px viewport does not clip totals/CTA */
  html body.rr-grunge-commerce .rr-graveyard-cart__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--rr-space-2);
    width: 100%;
    min-width: 0;
  }
  html body.rr-grunge-commerce .rr-graveyard-cart__coupon {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    min-width: 0;
    flex: none;
  }
  html body.rr-grunge-commerce .rr-graveyard-cart__coupon .input-text,
  html body.rr-grunge-commerce .rr-graveyard-cart__coupon .button,
  html body.rr-grunge-commerce .rr-graveyard-cart__update {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }
  html body.rr-grunge-commerce .rr-graveyard-cart__collaterals,
  html body.rr-grunge-commerce .rr-graveyard-cart__totals,
  html body.rr-grunge-commerce .rr-graveyard-cart__totals-table,
  html body.rr-grunge-commerce .rr-graveyard-cart__checkout,
  html body.rr-grunge-commerce .rr-graveyard-cart__cta,
  html body.rr-grunge-commerce .rr-graveyard-cart__checkout .checkout-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  html body.rr-grunge-commerce .rr-graveyard-cart__totals-table th,
  html body.rr-grunge-commerce .rr-graveyard-cart__totals-table td {
    word-break: break-word;
  }
}

html body.rr-grunge-commerce.woocommerce-checkout .loaderBlock {
  background: var(--rr-overlay-bg);
  backdrop-filter: blur(var(--rr-header-blur));
}
html body.rr-grunge-commerce.woocommerce-checkout .loader {
  width: var(--rr-product-avatar-size);
  height: var(--rr-product-avatar-size);
  border: var(--rr-bd-thick) solid var(--rr-border-strong);
  border-top-color: var(--rr-accent);
  border-radius: var(--rr-radius-pill);
  box-shadow: var(--rr-glow-accent);
}
html body.rr-grunge-commerce.woocommerce-checkout .loaderBlock[hidden] { display: none !important; }
html body.rr-grunge-commerce.woocommerce-order-received .woocommerce-thankyou-order-received {
  color: var(--rr-accent);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-5);
  font-weight: 900;
  text-align: center;
}
html body.rr-grunge-commerce.woocommerce-order-received .woocommerce-order h2 {
  color: var(--rr-ink);
  border-bottom: var(--rr-bd) solid var(--rr-accent);
  padding-bottom: var(--rr-space-2);
}
html body.rr-grunge-commerce.woocommerce-order-received .woocommerce-order-overview,
html body.rr-grunge-commerce.woocommerce-order-received .woocommerce-order-details { list-style: none; }
html body.rr-grunge-commerce.woocommerce-order-received #congrats-message {
  background: var(--rr-paper);
  color: var(--rr-paper-ink);
  border-radius: var(--rr-radius);
  box-shadow: var(--rr-shadow);
  padding: var(--rr-space-5);
  text-align: center;
}


/* ======================================================================
   FIGMA SHOP / TAXONOMY — style hub, polaroid category cards, product polaroids
   ====================================================================== */
.rr-style-hub {
  padding-block: var(--rr-space-6) var(--rr-space-4);
  background: var(--rr-bg-deep);
}
.rr-style-hub__title,
.rr-shop-head__title,
.rr-product-grid--polaroid > .mainCatName.rr-section__title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--rr-space-2);
  margin: 0 0 var(--rr-space-3);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-2);
  font-weight: 400;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  text-align: left;
  color: var(--rr-ink);
}
.rr-style-hub__star,
.rr-polaroid__star {
  color: var(--rr-ink-muted);
  font-size: 0.7em;
  line-height: 1;
}
.rr-style-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--rr-space-2);
}
.rr-style-chip {
  display: grid;
  place-items: center;
  min-height: 4.5rem;
  padding: var(--rr-space-3);
  border: var(--rr-bd) solid var(--rr-border-strong);
  background: var(--rr-surface);
  color: var(--rr-ink);
  text-decoration: none;
  text-align: center;
  transition: border-color var(--rr-dur) var(--rr-ease), background var(--rr-dur) var(--rr-ease), color var(--rr-dur) var(--rr-ease);
}
.rr-style-chip:hover,
.rr-style-chip:focus-visible {
  border-color: var(--rr-accent);
  background: var(--rr-surface-2);
  color: var(--rr-accent-hi);
  outline: none;
}
.rr-style-chip__label {
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-3);
  font-weight: 900;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}

/* Figma SHOP BY STYLE — each illustrated asset is the complete tile.
   Do not wrap it in a second polaroid, tape or paper border. */
.rr-style-tile {
  display: block;
  min-width: 0;
  text-decoration: none;
  color: var(--rr-ink);
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  cursor: pointer;
  transition: transform var(--rr-dur) var(--rr-ease);
}
button.rr-style-tile {
  width: 100%;
  font: inherit;
  appearance: none;
  -webkit-appearance: none;
}
.rr-style-tile[aria-pressed="true"] .rr-style-tile__media {
  box-shadow: 0 0 0 2px var(--rr-bg), 0 0 0 4px var(--rr-accent);
}
.rr-style-tile__media {
  display: block;
  width: 100%;
  /* Figma home + shop stickers are square illustrated tiles on a dark field. */
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 0;
  background: transparent;
}
.rr-style-tile__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.rr-style-tile__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.rr-style-tile:hover,
.rr-style-tile:focus-visible {
  transform: translateY(-2px);
  outline: none;
}
.rr-style-hub__title {
  font-family: var(--rr-font-label);
}
.rr-style-hub__subtitle {
  margin: var(--rr-space-5) 0 var(--rr-space-3);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-3);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  text-align: center;
  color: var(--rr-ink);
}
.rr-section__title {
  font-family: var(--rr-font-label);
}

/* Fixed List your lot — stays on screen while the home page scrolls */
.rr-list-lot {
  display: none;
}
.rr-list-cta {
  display: flex;
  justify-content: center;
  margin: var(--rr-space-4) 0 var(--rr-space-5);
}
.rr-list-item {
  display: inline-flex;
  align-items: center;
  gap: var(--rr-space-2);
  padding: 0.7em 1.4em;
  background: #fff;
  color: var(--rr-accent);
  border: 2px solid var(--rr-accent);
  border-radius: var(--rr-radius-pill);
  box-shadow:
    0 0 0 4px var(--rr-purple-glow),
    0 8px 22px var(--rr-purple-glow);
  font-family: var(--rr-font-label);
  font-weight: 800;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  text-decoration: none;
}
.rr-list-item:hover { color: var(--rr-accent); }
html body.home .rr-home { padding-bottom: var(--rr-space-6); }

.rr-category-hub {
  padding-block: var(--rr-space-4) var(--rr-space-5);
}
.rr-category-hub__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--rr-space-3);
}
@media (min-width: 900px) {
  .rr-category-hub__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--rr-space-4); }
}
.rr-category-hub__return {
  margin: var(--rr-space-5) 0 0;
}
.rr-return-link {
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink-muted);
  text-decoration: none;
}
.rr-return-link:hover { color: var(--rr-accent-hi); }

/* Polaroid category card */
.rr-polaroid {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  text-align: left;
  overflow: visible;
}
/* Figma polaroid tape is a short horizontal strip across the top edge. */
.rr-polaroid__clip {
  position: absolute;
  z-index: 3;
  top: var(--rr-polaroid-tape-top);
  left: 50%;
  width: var(--rr-polaroid-tape-width);
  height: var(--rr-polaroid-tape-height);
  transform: translateX(-50%) rotate(-6deg);
  background: url("../images/figma/chrome/polaroid-tape-wide.png") center / 100% 100% no-repeat;
  filter: var(--rr-tape-asset-shadow);
  pointer-events: none;
}
.rr-polaroid:nth-child(even) .rr-polaroid__clip {
  transform: translateX(-50%) rotate(5deg);
}
.rr-polaroid:nth-child(3n) .rr-polaroid__clip {
  transform: translateX(-50%) rotate(-2deg);
}
.rr-polaroid__clip::after { display: none; }
.rr-polaroid__frame {
  display: grid;
  gap: var(--rr-space-2);
  padding: var(--rr-space-2) var(--rr-space-2) var(--rr-space-3);
  background: var(--rr-paper);
  color: var(--rr-paper-ink);
  box-shadow: var(--rr-shadow);
  clip-path: polygon(
    1% 2%, 4% 0, 97% 1%, 100% 4%, 99% 96%, 96% 100%, 3% 99%, 0 95%
  );
}
.rr-polaroid__photo {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1.05;
  overflow: hidden;
  background: #050505;
  border: 1px solid rgba(0,0,0,.35);
}
.rr-polaroid .rr-sold-badge {
  position: absolute;
  top: 0.45rem;
  left: 0.45rem;
  z-index: 1;
  padding: 0.2rem 0.45rem;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  background: #111;
  color: #fff;
}
/* These cards render real WooCommerce product images. Frame exports are never
   placed in this slot: cover preserves the Figma card crop. */
.rr-polaroid__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: contrast(1.05) saturate(0.92);
}
.rr-polaroid--crop-0 .rr-polaroid__photo img { object-position: 18% 22%; }
.rr-polaroid--crop-1 .rr-polaroid__photo img { object-position: 78% 18%; }
.rr-polaroid--crop-2 .rr-polaroid__photo img { object-position: 50% 70%; }
.rr-polaroid--crop-3 .rr-polaroid__photo img { object-position: 12% 78%; }
.rr-polaroid--crop-4 .rr-polaroid__photo img { object-position: 86% 62%; }
.rr-polaroid--crop-5 .rr-polaroid__photo img { object-position: 48% 12%; }
.rr-polaroid__photo--empty {
  background:
    radial-gradient(circle at 30% 20%, rgba(168,85,247,.18), transparent 45%),
    #050505;
}
.rr-polaroid__caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rr-space-1);
  min-height: 1.6rem;
  margin-top: 0.15rem;
  padding: 0.2rem 0.1rem 0;
  background: transparent;
  color: var(--rr-paper-ink);
}
html body.rr-grunge-site a.rr-polaroid .rr-polaroid__caption,
html body.rr-grunge-site a.rr-polaroid .rr-polaroid__label,
html body.rr-grunge-site a.rr-polaroid .rr-polaroid__star {
  color: var(--rr-paper-ink);
}
.rr-polaroid__label {
  display: inline;
  margin: 0;
  padding: 0;
  background: transparent;
  color: var(--rr-paper-ink);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  text-align: left;
  line-height: 1.15;
}
.rr-polaroid__star {
  color: var(--rr-paper-ink);
  opacity: 1;
  flex: 0 0 auto;
}
.rr-polaroid:hover .rr-polaroid__frame,
.rr-polaroid:focus-visible .rr-polaroid__frame {
  box-shadow: var(--rr-shadow-accent);
  outline: none;
}

/* Live Woo filter rail (preserved openCategory buttons) */
.rr-shop-filters--figma .rr-filter-rail {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--rr-space-2);
  overflow-x: auto;
  padding-bottom: var(--rr-space-2);
  scrollbar-width: thin;
}
.rr-shop-filters--figma .rr-filter-chip {
  flex: 0 0 auto;
  white-space: nowrap;
}
.rr-shop-filters--figma .rr-filter-chip.active,
.rr-shop-filters--figma .rr-filter-chip.is-active {
  background: var(--rr-accent);
  color: var(--rr-accent-ink);
  border-color: var(--rr-accent);
}

/* Polaroid product cards */
.rr-product--polaroid {
  position: relative;
  display: grid;
  gap: var(--rr-space-2);
  padding: var(--rr-space-2) var(--rr-space-2) var(--rr-space-3);
  background: var(--rr-paper);
  color: var(--rr-paper-ink);
  border: 0;
  box-shadow: var(--rr-shadow);
  clip-path: polygon(
    0.8% 1.5%, 3% 0, 98% 0.8%, 100% 3%, 99.2% 97%, 97% 100%, 2% 99%, 0 96%
  );
}
.rr-product--polaroid .rr-product__tape {
  position: absolute;
  z-index: 2;
  top: -0.45rem;
  left: 50%;
  width: 2.6rem;
  height: 0.85rem;
  transform: translateX(-50%) rotate(-2deg);
  background: rgba(255,255,255,.72);
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
}
.rr-product--polaroid .rr-product__link {
  display: grid;
  gap: var(--rr-space-2);
  color: inherit;
  text-decoration: none;
}
.rr-product--polaroid .rr-product__media,
.rr-product--polaroid .imageWrapper {
  aspect-ratio: 1 / 1.08;
  overflow: hidden;
  background: #0a0a0a;
  border: 1px solid rgba(0,0,0,.28);
}
.rr-product--polaroid .rr-product__media img,
.rr-product--polaroid .imageWrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.rr-product--polaroid .rr-product__body,
.rr-product--polaroid .containerCard {
  display: grid;
  gap: 0.2rem;
  padding: 0 var(--rr-space-1);
  color: var(--rr-paper-ink);
}
.rr-product--polaroid .rr-product__shop,
.rr-product--polaroid .rr-card-label {
  margin: 0;
  color: rgba(20,20,20,.62);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-product--polaroid .rr-product__title,
.rr-product--polaroid .cardTitle {
  margin: 0;
  color: var(--rr-paper-ink);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-2);
  font-weight: 800;
  line-height: var(--rr-lh-snug);
  text-transform: none;
}
.rr-product--polaroid .rr-price,
.rr-product--polaroid .cardPrice {
  margin: 0;
  color: var(--rr-paper-ink);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  font-weight: 700;
}
.rr-product--polaroid .rr-product__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rr-space-2);
  padding-inline: var(--rr-space-1);
}
.rr-product--polaroid .rr-commerce-action { margin-top: 0; width: 100%; }
.rr-product--polaroid .rr-btn {
  background: var(--rr-paper-ink);
  color: var(--rr-paper);
  border-color: var(--rr-paper-ink);
}
.rr-product--polaroid .rr-btn:hover {
  background: var(--rr-accent);
  border-color: var(--rr-accent);
  color: var(--rr-accent-ink);
}
.rr-product-grid--polaroid > .mainCatName {
  grid-column: 1 / -1;
}
.rr-home-style-hub { margin-block: var(--rr-space-5); }

/* ======================================================================
   PRODUCT DETAIL (Figma Product Info)
   Polaroid gallery + buy box. Commerce hooks keep native add-to-cart POST.
   ====================================================================== */
.rr-pdp-main {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  background: var(--rr-bg);
  color: var(--rr-ink);
}
.rr-pdp {
  position: relative;
  padding-block: var(--rr-space-5) var(--rr-space-7);
}
.rr-pdp__shell {
  width: min(100% - (var(--rr-space-4) * 2), var(--rr-content));
  margin-inline: auto;
}
.rr-pdp__grid {
  display: grid;
  grid-template-columns: var(--rr-grid-1-column);
  gap: var(--rr-space-5);
  align-items: start;
}
.rr-pdp__gallery {
  display: grid;
  gap: var(--rr-space-3);
  justify-items: center;
}
.rr-pdp__polaroid {
  position: relative;
  width: min(100%, var(--rr-pdp-max-polaroid));
  margin: 0;
  padding: var(--rr-space-3) var(--rr-space-3) var(--rr-space-5);
  background: var(--rr-paper);
  color: var(--rr-paper-ink);
  border: var(--rr-bd) solid var(--rr-border-strong);
  box-shadow: var(--rr-shadow);
  transform: var(--rr-pdp-polaroid-tilt);
}
.rr-pdp__tape {
  position: absolute;
  z-index: var(--rr-component-layer);
  top: calc(var(--rr-space-2) * -1);
  left: var(--rr-half);
  width: var(--rr-pdp-tape-width);
  aspect-ratio: var(--rr-pdp-tape-ratio);
  background: url("../images/rr-masking-tape.png") center / 100% 100% no-repeat;
  transform: var(--rr-pdp-tape-tilt);
  filter: var(--rr-tape-asset-shadow);
  pointer-events: none;
}
.rr-pdp__polaroid-frame {
  position: relative;
  overflow: hidden;
  aspect-ratio: var(--rr-product-gallery-ratio);
  background: var(--rr-surface-2);
  border: var(--rr-bd) solid var(--rr-pdp-frame-border);
}
.rr-pdp__image,
.rr-pdp__polaroid-frame img,
.rr-pdp__polaroid-frame .woocommerce-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rr-pdp__sold {
  position: absolute;
  z-index: calc(var(--rr-component-layer) + 1);
  top: var(--rr-space-4);
  left: var(--rr-space-2);
  transform: var(--rr-pdp-sold-tilt);
}
.rr-pdp__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rr-space-2);
  justify-content: center;
  width: min(100%, var(--rr-pdp-max-polaroid));
}
.rr-pdp__thumb {
  width: var(--rr-pdp-thumb-size);
  aspect-ratio: var(--rr-square-ratio);
  overflow: hidden;
  border: var(--rr-bd) solid var(--rr-border);
  background: var(--rr-surface-2);
  box-shadow: var(--rr-shadow-sm);
}
.rr-pdp__thumb[aria-current="true"] {
  border-color: var(--rr-accent);
  outline: var(--rr-bd) solid var(--rr-pdp-thumb-outline);
  outline-offset: var(--rr-bd);
}
.rr-pdp__thumb-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rr-pdp__info {
  display: grid;
  gap: var(--rr-space-3);
  min-width: 0;
}
.rr-pdp__title {
  margin: 0;
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-5);
  font-weight: 800;
  line-height: var(--rr-lh-snug);
  letter-spacing: var(--rr-tracking-tight);
  text-transform: uppercase;
  color: var(--rr-ink);
}
.rr-pdp__price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--rr-space-2);
}
.rr-pdp__price,
.rr-pdp__price .amount,
.rr-pdp .price,
.rr-pdp .price .amount {
  margin: 0;
  color: var(--rr-accent) !important;
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-4);
  font-weight: 800;
}
.rr-pdp__share .my-share-button {
  display: inline-flex;
  align-items: center;
  gap: var(--rr-space-1);
}
.rr-pdp__share .glow {
  margin: var(--rr-space-1) 0 0;
  color: var(--rr-ink-muted);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-pdp__area {
  display: grid;
  gap: var(--rr-pdp-micro-gap);
}
.rr-pdp__area-label,
.rr-pdp__section-label {
  margin: 0;
  color: var(--rr-ink-muted);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-0);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-pdp__area-value {
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: var(--rr-fs-2);
}
.rr-pdp__size {
  margin: 0;
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: var(--rr-fs-2);
}
.rr-pdp__description,
.rr-pdp__measurements {
  display: grid;
  gap: var(--rr-space-2);
}
.rr-pdp__description-body {
  max-width: var(--rr-measure);
  color: var(--rr-ink);
  font-family: var(--rr-font-body);
  font-size: var(--rr-fs-2);
  line-height: var(--rr-lh-normal);
}
.rr-pdp__description-body p { margin: 0 0 var(--rr-space-2); }
.rr-pdp__description-body p:last-child { margin-bottom: 0; }
.rr-pdp__meas-grid {
  display: grid;
  grid-template-columns: var(--rr-pdp-meas-columns);
  gap: var(--rr-space-2);
  margin: 0;
}
.rr-pdp__meas-cell {
  display: grid;
  gap: var(--rr-pdp-cell-gap);
  padding: var(--rr-space-2);
  background: var(--rr-surface-2);
  border: var(--rr-bd) solid var(--rr-border);
  border-radius: var(--rr-radius);
  text-align: center;
  justify-items: center;
}
.rr-pdp__meas-label {
  margin: 0;
  color: var(--rr-ink-muted);
  font-family: var(--rr-font-label);
  font-size: 10px;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-pdp__meas-value {
  margin: 0;
  color: var(--rr-ink);
  font-family: var(--rr-font-display);
  font-size: var(--rr-fs-3);
  font-weight: 900;
}
.rr-pdp__buy {
  display: grid;
  gap: var(--rr-space-3);
  margin-top: var(--rr-space-2);
}
.rr-pdp__return {
  margin: var(--rr-space-4) 0 0;
}
.rr-pdp__buy .rr-single-add-to-cart,
.rr-pdp__buy form.cart {
  display: grid;
  gap: var(--rr-space-3);
}
.rr-pdp__buy .single_add_to_cart_button,
.rr-pdp__buy .rr-btn--primary {
  width: 100%;
  justify-content: center;
  min-height: var(--rr-pdp-buy-min-height);
  font-family: var(--rr-font-label);
  font-weight: 700;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
}
.rr-pdp .product_meta { display: none; }
.rr-pdp .product_meta a { color: var(--rr-accent); }
.rr-product-kicker {
  width: min(100% - (var(--rr-space-4) * 2), var(--rr-content));
  margin: var(--rr-space-4) auto 0;
  display: flex;
  justify-content: flex-end;
  gap: var(--rr-space-2);
  pointer-events: none;
}

/* Keep Figma Product Info single-column at all breakpoints */
@media (min-width: 900px) {
  .rr-pdp__grid {
    grid-template-columns: 1fr;
    gap: var(--rr-space-5);
    max-width: 28rem;
    margin-inline: auto;
  }
  .rr-pdp__gallery { justify-items: center; position: static; }
  .rr-pdp__polaroid {
    width: min(100%, var(--rr-pdp-max-polaroid));
    transform: var(--rr-pdp-polaroid-tilt-lg);
  }
  .rr-pdp__thumbs { width: min(100%, var(--rr-pdp-max-polaroid)); justify-content: center; }
  .rr-pdp__title { font-size: var(--rr-fs-5); }
}

@media (max-width: 640px) {
  .rr-pdp { padding-block: var(--rr-space-4) var(--rr-space-6); }
  .rr-pdp__meas-grid { grid-template-columns: var(--rr-pdp-meas-mobile-columns); }
  .rr-pdp__polaroid { transform: var(--rr-pdp-polaroid-tilt-sm); }
}

/* ======================================================================
   2.0.38 — Latest-items banner (Figma polaroids) + Find your style
   ====================================================================== */
.rr-find-people--latest {
  display: grid;
  gap: var(--rr-space-3);
  width: 100%;
}
.rr-find-people--latest .rr-find-people__banner-frame {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.rr-find-people--latest:has(.rr-latest-loop) .rr-find-people__tape {
  display: block;
  position: absolute;
  z-index: 3;
  top: var(--rr-polaroid-tape-top);
  left: 50%;
  width: var(--rr-polaroid-tape-width);
  height: var(--rr-polaroid-tape-height);
  transform: translateX(-50%) rotate(-6deg);
  background: url("../images/figma/chrome/polaroid-tape-wide.png") center / 100% 100% no-repeat;
  filter: var(--rr-tape-asset-shadow);
  pointer-events: none;
}
.rr-latest-loop__eyebrow {
  margin: 0;
  font-family: var(--rr-font-label);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink-muted);
}
.rr-latest-loop {
  width: 100%;
  overflow: hidden;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.rr-latest-loop__viewport {
  overflow: hidden;
  width: 100%;
}
.rr-latest-loop__track {
  display: flex;
  gap: var(--rr-space-3);
  width: max-content;
  padding: var(--rr-space-4) var(--rr-space-3) var(--rr-space-3);
  animation: rr-latest-loop 42s linear infinite;
}
.rr-latest-loop:hover .rr-latest-loop__track {
  animation-play-state: paused;
}
@keyframes rr-latest-loop {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .rr-latest-loop__track { animation: none; flex-wrap: wrap; width: 100%; }
}
.rr-latest-loop__track > .rr-polaroid--loop {
  flex: 0 0 10.5rem;
  width: 10.5rem;
  max-width: 10.5rem;
}
[data-rr-buy-price][hidden] { display: none !important; }
.rr-find-style {
  display: grid;
  gap: var(--rr-space-4);
}
.rr-find-style .rr-section__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--rr-space-3);
  flex-wrap: wrap;
}
.rr-find-style__hint {
  margin: 0;
  color: var(--rr-ink-muted);
  font-size: var(--rr-fs-1);
  max-width: var(--rr-measure-lg);
}
.rr-find-style__group { display: grid; gap: var(--rr-space-2); }
.rr-find-style__label {
  margin: 0;
  font-family: var(--rr-font-label);
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
  font-size: var(--rr-fs-1);
  color: var(--rr-ink-muted);
}
.rr-latest-loop__price {
  font-family: var(--rr-font-display);
  font-weight: 800;
  color: var(--rr-accent);
  font-size: var(--rr-fs-2);
}

.rr-find-style {
  display: grid;
  gap: var(--rr-space-4);
  padding-block: var(--rr-space-5);
}
.rr-find-style__hint {
  margin: 0;
  color: var(--rr-ink-muted);
  font-size: var(--rr-fs-1);
  max-width: var(--rr-measure-lg);
}
.rr-find-style__group { display: grid; gap: var(--rr-space-2); }
.rr-find-style__label {
  margin: 0;
  font-family: var(--rr-font-label);
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
  font-size: var(--rr-fs-1);
}
.rr-find-style__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rr-space-2);
}
.rr-find-style__subgroup {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rr-space-2);
  width: 100%;
  margin-bottom: var(--rr-space-2);
}
.rr-find-style__subgroup-label {
  flex: 0 0 100%;
  margin: var(--rr-space-2) 0 0;
  font-size: var(--rr-fs-0);
  color: var(--rr-ink-muted);
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
}
.rr-find-style__chip {
  appearance: none;
  border: var(--rr-bd) solid var(--rr-border-strong);
  background: var(--rr-paper);
  color: var(--rr-paper-ink);
  color-scheme: light;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
  padding: 0.55rem 0.85rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}
.rr-find-style__chip--media { padding-left: 0.45rem; }
.rr-find-style__chip-img {
  width: 1.75rem;
  height: 1.75rem;
  object-fit: cover;
  border: var(--rr-bd) solid var(--rr-border);
}
.rr-find-style__chip:hover:not([aria-pressed="true"]) {
  color: var(--rr-paper-ink);
}
.rr-find-style__chip[aria-pressed="true"] {
  background: var(--rr-accent);
  color: var(--rr-accent-ink);
  border-color: var(--rr-accent);
}
.rr-find-style__subs[hidden] { display: none !important; }
.rr-find-style__subs.is-open { display: grid; }
.rr-find-style__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rr-space-2);
}

.rr-listing-genre-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
  gap: var(--rr-space-2);
}
html body.rr-grunge-listing .rr-listing-genre-grid .rr-listing-choice {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: var(--rr-bd) solid var(--rr-border);
  padding: 0.55rem 0.75rem;
  background: var(--rr-paper);
  color: var(--rr-paper-ink);
  color-scheme: light;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}
.rr-view-all { display: grid; gap: var(--rr-space-4); padding-bottom: var(--rr-space-6); }
.rr-view-all .rr-cat-grid {
  padding-inline: 0;
  padding-bottom: var(--rr-space-4);
}

/* Shop: Figma SHOP BY STYLE first; chip filters sit in a compact disclosure. */
.rr-shop-filters {
  margin: 0 auto var(--rr-space-4);
}
.rr-shop-filters__summary {
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink);
  cursor: pointer;
  list-style: none;
  padding: var(--rr-space-2) 0;
  border-bottom: var(--rr-bd) solid var(--rr-border);
}
.rr-shop-filters__summary::-webkit-details-marker { display: none; }
.rr-shop-filters .rr-find-style {
  padding-top: var(--rr-space-3);
}
.rr-shop-filters .rr-find-style__hint { color: var(--rr-ink-muted); }

/* Figma Product Info — hide zine kicker; larger distressed price */
.rr-pdp .rr-product-kicker { display: none; }
.rr-pdp__price,
.rr-pdp .price,
.rr-pdp .price .amount {
  font-size: var(--rr-fs-6);
  font-weight: 900;
  letter-spacing: var(--rr-tracking-tight);
  filter: contrast(1.15) saturate(0.85);
}
.rr-pdp__area {
  display: flex;
  align-items: center;
  gap: var(--rr-space-2);
  padding-bottom: var(--rr-space-3);
  border-bottom: 2px solid var(--rr-accent);
}
.rr-pdp__area-label { color: var(--rr-accent); }
.rr-pdp__area-pin {
  display: inline-flex;
  color: var(--rr-accent);
  flex: none;
}
.rr-pdp__area-pin svg { display: block; }
.rr-pdp__section-label { color: var(--rr-accent); }
.rr-pdp__condition {
  margin: 0;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink-muted);
}
.rr-pdp__meas-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rr-pdp__buy .single_add_to_cart_button,
.rr-pdp__buy .rr-btn--primary {
  background: var(--rr-accent);
  color: #fff;
  border-color: var(--rr-accent);
}

/* Graveyard Cart qty steppers */
html body.rr-grunge-commerce .rr-graveyard-cart__qty .rr-qty {
  display: inline-flex;
  align-items: stretch;
  border: var(--rr-bd) solid var(--rr-border-strong);
  background: var(--rr-surface-2);
}
html body.rr-grunge-commerce .rr-graveyard-cart__qty .rr-qty button {
  width: 2rem;
  background: transparent;
  color: var(--rr-ink);
  border: 0;
  cursor: pointer;
  font-weight: 700;
}
html body.rr-grunge-commerce .rr-graveyard-cart__qty .rr-qty input.qty {
  width: 2.25rem;
  border: 0;
  background: transparent;
  color: var(--rr-ink);
  text-align: center;
}

/* 2.0.20 — Figma polaroid listed cards + shop page title */
.rr-polaroid--listed .rr-polaroid__frame {
  background: color-mix(in srgb, var(--rr-accent) 28%, var(--rr-paper));
}
.rr-polaroid--listed .rr-polaroid__photo {
  border-color: var(--rr-accent);
}
.rr-style-hub--page .rr-style-hub__title {
  justify-content: flex-start;
}
.rr-style-hub .rr-container,
.rr-home .rr-container {
  padding-inline: var(--rr-home-gutter);
}
.rr-hero--figma .rr-hero__inner,
.rr-hero--figma .rr-hero__banner {
  padding-inline: var(--rr-home-gutter);
}
.rr-style-hub__more-wrap {
  display: flex;
  justify-content: flex-end;
  margin: var(--rr-space-3) 0 0;
}
.rr-style-hub__more {
  margin: 0;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: none;
  color: var(--rr-ink-muted);
  text-decoration: none;
}
.rr-style-hub__more:hover,
.rr-style-hub__more:focus-visible {
  color: var(--rr-ink);
  outline: none;
}

/* 2.0.21 — Figma shop is tiles + RETURN; hide Virtue/Woo loop chrome */
body.woocommerce-shop .woocommerce-category-filter,
body.post-type-archive-product .woocommerce-category-filter,
body.woocommerce-shop #filtered-products,
body.post-type-archive-product #filtered-products,
body.woocommerce-shop .woocommerce-result-count,
body.woocommerce-shop .woocommerce-ordering,
body.woocommerce-shop .woocommerce-pagination,
body.woocommerce-shop ul.products,
body.post-type-archive-product ul.products,
body.woocommerce-shop .woocommerce-products-header,
body.woocommerce-shop .page-header,
body.woocommerce-shop h1.page-title,
body.woocommerce-shop .woocommerce-info,
body.woocommerce-shop .woocommerce-noreviews {
  display: none !important;
}

/* Virtue shop loop is #product_wrapper + .product_item, not ul.products */
body.woocommerce-shop #product_wrapper,
body.post-type-archive-product #product_wrapper,
body.woocommerce-shop .product_item,
body.post-type-archive-product .product_item {
  display: none !important;
}

.rr-pdp__gallery { order: 0; }
.rr-pdp__info { order: 1; }
.rr-pdp__buy { order: 2; }
.rr-pdp__return { order: 3; }

/* 2.0.21 — Figma Product Info: ATC + RETURN must stay on-screen */
html body.rr-grunge-commerce.single-product .rr-pdp,
html body.rr-grunge-commerce.single-product .rr-pdp__shell,
html body.rr-grunge-commerce.single-product .rr-pdp__grid,
html body.rr-grunge-commerce.single-product .rr-pdp__buy,
html body.rr-grunge-commerce.single-product .rr-pdp__info {
  overflow: visible !important;
  max-height: none !important;
}
html body.rr-grunge-commerce.single-product .rr-pdp__buy,
html body.rr-grunge-commerce.single-product .rr-pdp__buy .rr-single-add-to-cart,
html body.rr-grunge-commerce.single-product .rr-pdp__buy form.cart,
html body.rr-grunge-commerce.single-product .rr-pdp__return {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}
html body.rr-grunge-commerce.single-product .rr-pdp__buy .quantity {
  display: none !important;
}
html body.rr-grunge-commerce.single-product .rr-pdp__buy .single_add_to_cart_button,
html body.rr-grunge-commerce.single-product .rr-pdp__buy .rr-btn--primary {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100%;
  min-height: var(--rr-pdp-buy-min-height);
  background: var(--rr-accent) !important;
  color: #fff !important;
  border-color: var(--rr-accent) !important;
  gap: var(--rr-space-2);
}
html body.rr-grunge-commerce.single-product .rr-pdp__buy .single_add_to_cart_button::before {
  content: "";
  width: 1.15rem;
  height: 1.15rem;
  flex: none;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M5 8h14l-1 11H6L5 8Z'/><path d='M9 9V6a3 3 0 0 1 6 0v3'/></svg>") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><path d='M5 8h14l-1 11H6L5 8Z'/><path d='M9 9V6a3 3 0 0 1 6 0v3'/></svg>") center / contain no-repeat;
}
.rr-pdp__return .rr-return-link {
  color: var(--rr-ink);
  font-size: var(--rr-fs-2);
}
html body.rr-grunge-commerce.single-product .rr-pdp__return {
  justify-items: end;
  text-align: right;
}
html body.rr-grunge-commerce.single-product .related.products,
html body.rr-grunge-commerce.single-product .upsells.products,
html body.rr-grunge-commerce.single-product .woocommerce-tabs {
  display: none !important;
}

/* 2.0.23 — Figma Product Info: no leftover Woo/Virtue/auction chrome */
html body.rr-grunge-commerce.single-product .rr-pdp .rr-product-location,
html body.rr-grunge-commerce.single-product .rr-pdp .product-size,
html body.rr-grunge-commerce.single-product .rr-pdp p.stock,
html body.rr-grunge-commerce.single-product .rr-pdp .stock,
html body.rr-grunge-commerce.single-product .rr-pdp .quantity,
html body.rr-grunge-commerce.single-product .rr-auction-auth-actions,
html body.rr-grunge-commerce.single-product .rr-pdp .glass-card {
  display: none !important;
}

/* 2.0.23 — Figma has header cart only; hide Virtue sticky bag/profile */
html body .aci-cart,
html body .aci-account-icon,
html body a.aci-cart-icon {
  display: none !important;
}

/* 2.0.24 — Figma frames: marketplace strip is HomePage-only */
html body.rr-grunge-site:not(.home) .rr-mkt-banner {
  display: none !important;
}
html body.rr-grunge-site {
  overflow-x: hidden;
}
.rr-style-empty {
  display: grid;
  justify-items: center;
  padding: var(--rr-space-4) 0 var(--rr-space-6);
}
.rr-style-empty__sticker {
  width: min(100%, 11rem);
  height: auto;
  display: block;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .45));
}

/* 2.0.25 — Figma remaining screens: favourites, terms, listing, leftover Woo titles */
html body.rr-grunge-site .titleclass,
html body.rr-grunge-site #pageheader,
html body.rr-grunge-site .kad-page-title,
html body.woocommerce-cart .entry-header,
html body.woocommerce-cart h1.entry-title,
html body.page .entry-header {
  display: none !important;
}
html body.rr-grunge-commerce.single-product .single_add_to_cart_button {
  text-transform: uppercase !important;
}
html body.rr-grunge-listing .rr-listing-label__mark {
  display: none;
}
html body.rr-grunge-listing .rr-listing-hero {
  text-align: left;
}
html body.rr-grunge-listing .rr-listing-hero .rr-category-hub__return {
  margin: 0 0 var(--rr-space-3);
}
html body.rr-grunge-listing .rr-listing-submit {
  text-transform: uppercase;
  letter-spacing: var(--rr-tracking-wide);
}
.rr-favourites {
  padding: var(--rr-space-4) 0 var(--rr-space-8);
}
.rr-favourites__title {
  margin: 0 0 var(--rr-space-5);
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-2);
  font-weight: 400;
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink);
}
.rr-favourites__empty {
  display: grid;
  justify-items: center;
  gap: var(--rr-space-4);
  padding: var(--rr-space-6) 0;
  text-align: center;
}
.rr-favourites__mark {
  font-size: 3rem;
  line-height: 1;
  color: var(--rr-accent);
}
.rr-favourites__copy {
  margin: 0;
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-1);
  letter-spacing: var(--rr-tracking-wide);
  text-transform: uppercase;
  color: var(--rr-ink-muted);
}
html body.rr-grunge-site .rr-terms-head {
  border-bottom: 0;
}
html body.rr-grunge-site .rr-terms-head h1 {
  font-family: var(--rr-font-label);
  font-size: var(--rr-fs-2);
  font-weight: 400;
  letter-spacing: var(--rr-tracking-wide);
}


