/*
 * Product page (master plan §11.3, §11.3.1). Tokens only; loaded on product pages only.
 * Operate mode: conventional layout, feedback-only motion. Components come from components.css.
 */

.v-main--product { display: block; }

/* WooCommerce notices: styled in components.css; here only their place in the page. */
.v-main--product :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) { max-width: calc(var(--v-container) + 2 * var(--v-gutter)); margin-inline: auto; padding: var(--v-space-4) var(--v-gutter) 0; }
.v-main--product :is(.woocommerce-notices-wrapper, .woocommerce-NoticeGroup) > :last-child { margin-bottom: 0; }
.v-product__top { padding-block: var(--v-space-5) var(--v-space-10); }
.v-product__crumbs { margin-bottom: var(--v-space-5); }

/* Layout: golden split (gallery 1.618 : info 1), single column below 1024px (§5). */
.v-product__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--v-space-6);
	align-items: start;
}
@media (min-width: 1024px) {
	.v-product__layout { grid-template-columns: minmax(0, 1.618fr) minmax(0, 1fr); gap: var(--v-space-9); }
	.v-product__panel { position: sticky; top: calc(var(--v-header-h) + var(--v-space-5)); }
}

/* ------------------------------------------------------------ Gallery */
.v-gallery { position: relative; min-width: 0; }
.v-gallery__track {
	display: grid;
	gap: var(--v-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}
.v-gallery__item { aspect-ratio: var(--v-card-ratio); background: var(--v-card-image-bg); }
.v-gallery__item[hidden] { display: none; }
.v-gallery__item--empty { display: grid; place-items: center; color: var(--v-text-muted); font-size: var(--v-text-small); }
.v-gallery__zoom {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: zoom-in;
}
.v-gallery__zoom img { width: 100%; height: 100%; object-fit: cover; }
.v-gallery__controls { display: none; }

/* Mobile and tablet: a swipe row with a counter and previous/next buttons (WCAG 2.5.7). */
@media (max-width: 1023px) {
	.v-product__top { padding-top: var(--v-space-4); }
	.v-gallery { margin-inline: calc(var(--v-gutter) * -1); }
	.v-gallery__track {
		grid-auto-flow: column;
		grid-auto-columns: 100%;
		gap: 0;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}
	.v-gallery__track::-webkit-scrollbar { display: none; }
	.v-gallery__item { scroll-snap-align: start; }
	.v-gallery__controls:not([hidden]) {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: var(--v-space-2);
		padding-top: var(--v-space-2);
	}
	.v-gallery__count { min-width: 6ch; font-size: var(--v-text-small); color: var(--v-text-muted); text-align: center; font-variant-numeric: tabular-nums; }
	.v-gallery__step {
		display: grid;
		place-items: center;
		width: var(--v-hit-min);
		height: var(--v-hit-min);
		border: 0;
		background: none;
		color: var(--v-text);
		cursor: pointer;
	}
}
@media (min-width: 768px) and (max-width: 1023px) {
	.v-gallery__track { grid-auto-columns: 62%; gap: var(--v-space-2); }
}

/* Sticky stage (§11.3.2, v1.49), desktop with JavaScript: product.js adds .is-staged. A thumbnail rail
   beside one stage photo; the whole gallery stays in view while the panel scrolls past it.
   Without JavaScript the photos stay stacked (rules above). */
.v-gallery__thumbs { display: none; }
.v-gallery__progress { display: none; }
@media (min-width: 1024px) {
	.v-gallery.is-staged {
		--_stage-h: calc(100svh - var(--wp-admin--admin-bar--height, 0px) - var(--v-header-h) - var(--v-space-5) * 2);
		position: sticky;
		top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--v-header-h) + var(--v-space-5));
		display: grid;
		grid-template-columns: var(--v-thumb-w) minmax(0, 1fr);
		gap: var(--v-space-4);
		align-items: start;
	}
	.v-gallery.is-staged:not(:has(.v-gallery__thumbs)) { grid-template-columns: minmax(0, 1fr); }
	.v-gallery.is-staged .v-gallery__thumbs {
		display: grid;
		gap: var(--v-space-3);
		align-content: start;
		max-height: var(--_stage-h);
		margin: 0;
		padding: 0;
		overflow-y: auto;
		list-style: none;
		scrollbar-width: none;
	}
	.v-gallery.is-staged .v-gallery__thumbs li[hidden] { display: none; }
	.v-gallery__thumb {
		display: block;
		width: 100%;
		aspect-ratio: var(--v-card-ratio);
		padding: 0;
		border: var(--v-hairline) solid transparent;
		background: var(--v-card-image-bg);
		cursor: pointer;
		transition: border-color var(--v-dur-hover) var(--v-ease-out);
	}
	.v-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; opacity: 0.72; transition: opacity var(--v-dur-hover) var(--v-ease-out); }
	.v-gallery__thumb[aria-pressed="true"] { border-color: var(--v-action); }
	.v-gallery__thumb[aria-pressed="true"] img,
	.v-gallery__thumb:hover img { opacity: 1; }
	.v-gallery.is-staged .v-gallery__track { display: block; }
	.v-gallery.is-staged .v-gallery__item { aspect-ratio: auto; background: none; }
	.v-gallery.is-staged .v-gallery__item:not(.is-current) { display: none; }
	.v-gallery.is-staged .v-gallery__zoom {
		width: auto;
		height: var(--_stage-h);
		max-width: 100%;
		aspect-ratio: var(--v-card-ratio);
		margin-inline: 0 auto;   /* one left edge with the breadcrumb (§5.1) */
		overflow: hidden;
		background: var(--v-card-image-bg);
	}
	.v-gallery.is-staged .v-gallery__zoom img { transition: transform var(--v-dur-ui) var(--v-ease-out); }
	.v-gallery.is-staged .v-gallery__zoom.is-zoomed img { transform: scale(var(--v-stage-zoom)); }
}
@media (max-width: 1023px) {
	/* Phones and tablets: a thin Stitch under the swipe row fills to the current photo. */
	.v-gallery__controls:not([hidden]) { position: relative; }
	.v-gallery__controls:not([hidden]) .v-gallery__progress {
		display: block;
		position: absolute;
		inset: 0 0 auto;
		height: var(--v-stitch-width);
		background: repeating-linear-gradient(90deg, var(--v-stitch) 0 var(--v-stitch-dash), transparent 0 calc(var(--v-stitch-dash) + var(--v-stitch-gap)));
		clip-path: inset(0 calc(100% - var(--v-gallery-progress, 0) * 100%) 0 0);
		transition: clip-path var(--v-dur-ui) var(--v-ease-out);
	}
}
@media (prefers-reduced-motion: reduce) {
	.v-gallery__controls .v-gallery__progress,
	.v-gallery.is-staged .v-gallery__zoom img { transition: none; }
}

/* ------------------------------------------------------------ Buying panel */
.v-product__panel { display: grid; gap: var(--v-space-6); min-width: 0; }
.v-product__head { display: grid; gap: var(--v-space-3); }
.v-product__title { margin: 0; text-wrap: balance; }
.v-nowrap { white-space: nowrap; }
.v-product__intro { color: var(--v-text-muted); max-width: var(--v-measure); }
.v-product__intro p { margin: 0; }

.v-buy { display: grid; gap: var(--v-space-5); }
.v-buy .v-field__error:empty { display: none; }
.v-buy .v-field__error { margin-top: calc(var(--v-space-3) * -1); }
.v-buy__help { display: grid; gap: var(--v-space-2); justify-items: start; margin-top: calc(var(--v-space-2) * -1); }
.v-buy__fit { margin: 0; font-size: var(--v-text-small); color: var(--v-text-muted); }
.v-buy__size-link { min-height: var(--v-hit-min); }
.v-product__unavailable { color: var(--v-text-muted); }

/* ------------------------------------------------------------ Your measurements (§0.3.2.1)
   Everything below switches with CSS :has(), so the form works without JavaScript. */
.v-buy__standard { display: grid; gap: var(--v-space-5); }
.v-mtm { display: none; gap: var(--v-space-5); }
.v-buy:has(input[name="vellren_fit"][value="measure"]:checked) .v-buy__standard { display: none; }
.v-buy:has(input[name="vellren_fit"][value="measure"]:checked) .v-mtm { display: grid; }
.v-mtm__intro { margin: 0; font-size: var(--v-text-small); color: var(--v-text-muted); }

.v-mtm__units { margin: 0; padding: 0; border: 0; }
/* Units: an aligned grid (label column + options), so every row lines up at every width.
   Phones: one row per unit; wide panels: the three units side by side, labels above. */
.v-mtm__unit-row { display: grid; gap: var(--v-space-2); margin-top: var(--v-space-3); }
.v-mtm__unit {
	display: grid;
	grid-template-columns: 5.5rem repeat(2, minmax(0, 4.5rem));
	align-items: center;
	gap: var(--v-space-2);
}
.v-mtm__unit-label { font-size: var(--v-text-small); color: var(--v-text-muted); }
@media (min-width: 1280px) {
	.v-mtm__unit-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--v-space-4); }
	.v-mtm__unit { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.v-mtm__unit-label { grid-column: 1 / -1; }
}

.v-mtm__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v-space-5) var(--v-space-4); }
@media (max-width: 389px) { .v-mtm__grid { grid-template-columns: minmax(0, 1fr); } }
.v-mtm__field .v-field__help { font-size: var(--v-text-label); }
.v-mtm__pair { display: none; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v-space-2); }
.v-field__error:empty { display: none; }

/* Unit switches */
.v-mtm .v-mtm__u-in { display: none; }
.v-mtm:has(input[name="vellren_mtm[units][len]"][value="in"]:checked) .v-mtm__u-cm { display: none; }
.v-mtm:has(input[name="vellren_mtm[units][len]"][value="in"]:checked) .v-mtm__u-in { display: inline; }
.v-mtm:has(input[name="vellren_mtm[units][height]"][value="ftin"]:checked) .v-mtm__metric-h { display: none; }
.v-mtm:has(input[name="vellren_mtm[units][height]"][value="ftin"]:checked) .v-mtm__imperial-h { display: grid; }
.v-mtm:has(input[name="vellren_mtm[units][weight]"][value="st"]:checked) .v-mtm__metric-w { display: none; }
.v-mtm:has(input[name="vellren_mtm[units][weight]"][value="st"]:checked) .v-mtm__imperial-w { display: grid; }

.v-mtm__more { border-top: var(--v-hairline) solid var(--v-border); border-bottom: var(--v-hairline) solid var(--v-border); }
.v-mtm__more > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: var(--v-control-h-lg);
	font-size: var(--v-text-ui);
	font-weight: var(--v-weight-semibold);
	cursor: pointer;
	list-style: none;
}
.v-mtm__more > summary::-webkit-details-marker { display: none; }
.v-mtm__more[open] .v-accordion__icon::after { transform: rotate(0deg); }
.v-mtm__more[open] > :not(summary) { margin-bottom: var(--v-space-5); }
.v-mtm__more > * + * { margin-top: var(--v-space-5); }
.v-mtm__fit { margin: 0; padding: 0; border: 0; }
.v-segment--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--v-space-2); }
.v-mtm__warning { margin: 0; font-size: var(--v-text-small); font-weight: var(--v-weight-semibold); }
.v-mtm__warning:empty { display: none; }
.v-mtm__ack { align-items: flex-start; }
.v-mtm__help { margin: 0; font-size: var(--v-text-small); }

/* ------------------------------------------------------------ Panel additions (§11.3.2) */
.v-product__kicker {
	display: flex;
	flex-wrap: wrap;
	gap: var(--v-space-2);
	margin: 0 0 calc(var(--v-space-1) * -1);
	font-size: var(--v-text-small);
	color: var(--v-text-muted);
}
.v-buy__model { margin: 0; font-size: var(--v-text-small); }
.v-promises { display: grid; margin: 0; padding: 0; list-style: none; border-top: var(--v-hairline) solid var(--v-border); }
.v-promises li { border-bottom: var(--v-hairline) solid var(--v-border); }
.v-promises__row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--v-space-3);
	align-items: start;
	min-height: var(--v-hit-min);
	padding-block: var(--v-space-3);
	color: var(--v-text);
	font-size: var(--v-text-small);
	text-decoration: none;
}
.v-promises__row .v-icon { color: var(--v-text-muted); margin-top: var(--v-space-1); }
.v-promises__row strong { display: block; font-weight: var(--v-weight-semibold); font-size: var(--v-text-ui); }
.v-promises__row span { color: var(--v-text-muted); }
.v-promises__row strong { color: var(--v-text); }
@media (hover: hover) and (pointer: fine) {
	.v-promises__row:hover strong { color: var(--v-link); }
}
.v-product__help { margin: 0; font-size: var(--v-text-small); color: var(--v-text-muted); }

.v-product__details .v-accordion__body > * + * { margin-top: var(--v-space-4); }
.v-product__description > * + * { margin-top: var(--v-space-3); }
.v-flow > * + * { margin-top: var(--v-space-4); }

/* Facts: a definition list grouped by one hairline, not a border under every row (§5 borders). */
.v-facts { display: grid; gap: var(--v-space-2); margin: 0; padding-top: var(--v-space-4); border-top: var(--v-hairline) solid var(--v-border); }
.v-facts__row { display: grid; grid-template-columns: minmax(0, 9rem) minmax(0, 1fr); gap: var(--v-space-4); }
.v-facts dt { color: var(--v-text-muted); }
.v-facts dd { margin: 0; }

/* ------------------------------------------------------------ Story zone (§11.3.2, v1.50) */
/* Highlight: heading · text · portrait, vertically centred (owner reference); phones: stacked. */
.v-pdp-highlight__grid { display: grid; gap: var(--v-space-6); align-items: center; }
.v-pdp-highlight__head { display: grid; gap: var(--v-space-4); }
.v-pdp-highlight__label { display: flex; align-items: center; gap: var(--v-space-3); margin: 0; color: var(--v-text-muted); }
.v-pdp-highlight__rule {
	width: var(--v-space-7);
	height: var(--v-stitch-width);
	background: repeating-linear-gradient(90deg, var(--v-stitch) 0 var(--v-stitch-dash), transparent 0 calc(var(--v-stitch-dash) + var(--v-stitch-gap)));
}
.v-pdp-highlight__title { margin: 0; font-size: var(--v-text-h1); line-height: var(--v-lh-h1); text-wrap: balance; }
.v-pdp-highlight__text { display: grid; gap: var(--v-space-5); justify-items: start; }
.v-pdp-highlight__text p { margin: 0; max-width: 42ch; color: var(--v-text-muted); }
.v-pdp-highlight__media { position: relative; margin: 0; aspect-ratio: var(--v-card-ratio); overflow: hidden; background: var(--v-card-image-bg); }
.v-pdp-story-frame { position: absolute; inset: 0; display: block; }
.v-pdp-story-frame[hidden] { display: none; }
.v-pdp-story-frame img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 768px) {
	.v-pdp-highlight__grid { grid-template-columns: minmax(0, 1.618fr) minmax(0, 1fr); column-gap: var(--v-space-9); }
	.v-pdp-highlight__head { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
	.v-pdp-highlight__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr); column-gap: var(--v-space-9); }
	.v-pdp-highlight__head { grid-column: auto; }
}

/* Wearing edit: one real, selected-colour product image becomes the hinge between three ordinary
   dressing settings. The button state enhances server-rendered notes without hiding them at first paint. */
.v-pdp-wear { overflow: clip; background: var(--v-surface); }
.v-pdp-wear__head { display: grid; gap: var(--v-space-4); max-width: var(--v-measure); margin-bottom: var(--v-space-9); }
.v-pdp-wear__head h2 { margin: 0; font-size: var(--v-text-h1); line-height: var(--v-lh-h1); text-wrap: balance; }
.v-pdp-wear__head p { max-width: var(--v-measure); margin: 0; color: var(--v-text-muted); }
.v-pdp-wear__grid { display: grid; gap: var(--v-space-7); align-items: start; }
.v-pdp-wear__choices ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.v-pdp-wear__choices li { border-top: var(--v-hairline) solid var(--v-border); }
.v-pdp-wear__choices li:last-child { border-bottom: var(--v-hairline) solid var(--v-border); }
.v-pdp-wear__choices button {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--v-space-2) var(--v-space-4);
	align-items: center;
	width: 100%;
	min-height: var(--v-hit-min);
	padding-block: var(--v-space-4);
	padding-inline: 0;
	border: 0;
	color: var(--v-text);
	background: none;
	font: inherit;
	text-align: start;
	text-decoration: none;
	cursor: pointer;
}
.v-pdp-wear__choices span { font-size: var(--v-text-small); color: var(--v-text-muted); }
.v-pdp-wear__choices strong { grid-row: 2; font-family: var(--v-font-display); font-size: var(--v-text-h3); font-weight: var(--v-weight-regular); line-height: var(--v-lh-h3); letter-spacing: var(--v-track-h2); }
.v-pdp-wear__choices .v-btn__arrow { grid-column: 2; grid-row: 1 / span 2; }
.v-pdp-wear__choices button[aria-pressed="true"] { color: var(--v-link); }
.v-pdp-wear__choices button[aria-pressed="true"] strong { text-decoration: underline; text-decoration-color: var(--v-stitch); text-decoration-thickness: var(--v-stitch-width); text-underline-offset: var(--v-space-2); }
.v-pdp-wear__media { margin: 0; }
.v-pdp-wear__stage { position: relative; display: block; aspect-ratio: var(--v-card-ratio); overflow: hidden; background: var(--v-card-image-bg); }
.v-pdp-wear__media figcaption { display: block; min-height: var(--v-control-h); margin: 0; padding-top: var(--v-space-3); border-top: var(--v-hairline) solid var(--v-border-strong); color: var(--v-text); font-size: var(--v-text-small); }
.v-pdp-wear__media figcaption [hidden] { display: none; }
.v-pdp-wear__notes { display: grid; gap: var(--v-space-6); align-content: start; }
.v-pdp-wear__notes article { display: grid; gap: var(--v-space-4); padding-top: var(--v-space-5); border-top: var(--v-hairline) solid var(--v-border-strong); }
.v-pdp-wear__notes h3 { margin: 0; font-size: var(--v-text-h2); line-height: var(--v-lh-heading); text-wrap: balance; }
.v-pdp-wear__notes p { max-width: var(--v-measure); margin: 0; color: var(--v-text-muted); }
.v-pdp-wear__fit { justify-self: start; margin-top: var(--v-space-2); }
.v-pdp-wear.is-enhanced [data-v-wear-panel][hidden] { display: none; }
@media (min-width: 768px) {
	.v-pdp-wear__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--v-space-8); }
	.v-pdp-wear__notes { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
	.v-pdp-wear__fit { grid-column: 2; }
}
@media (min-width: 1024px) {
	.v-pdp-wear__head { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); max-width: none; align-items: end; }
	.v-pdp-wear__head p { justify-self: end; }
	.v-pdp-wear__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 5fr); column-gap: var(--v-space-8); }
	.v-pdp-wear__media { margin-top: calc(0px - var(--v-space-7)); }
	.v-pdp-wear__notes { grid-column: auto; grid-template-columns: 1fr; padding-top: var(--v-space-8); }
	.v-pdp-wear__fit { grid-column: auto; }
}

/* Before you decide: heading beside a 2 × 2 of answers, hairline above each (not cards). */
.v-pdp-decide__grid { display: grid; gap: var(--v-space-8); }
.v-pdp-decide__head { display: grid; gap: var(--v-space-4); align-content: start; }
.v-pdp-decide__head h2 { margin: 0; text-wrap: balance; }
.v-pdp-decide__lead { margin: 0; max-width: var(--v-measure); color: var(--v-text-muted); }
.v-pdp-decide__list { display: grid; gap: var(--v-space-8) var(--v-space-9); margin: 0; padding: 0; list-style: none; }
.v-pdp-decide__item {
	display: grid;
	gap: var(--v-space-3);
	align-content: start;
	justify-items: start;
	padding-top: var(--v-space-5);
	border-top: var(--v-hairline) solid var(--v-border-strong);
}
.v-pdp-decide__icon { color: var(--v-text-muted); }
.v-pdp-decide__q { margin: 0; font-family: var(--v-font-body); font-size: var(--v-text-h4); font-weight: var(--v-weight-bold); line-height: var(--v-lh-ui); letter-spacing: 0; }
.v-pdp-decide__a { margin: 0; max-width: var(--v-measure); color: var(--v-text-muted); }
@media (min-width: 768px) {
	.v-pdp-decide__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	.v-pdp-decide__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--v-space-9); }
	.v-pdp-decide__head { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--v-header-h) + var(--v-space-5)); }
}

.v-product__faq-grid { display: grid; gap: var(--v-space-6); }
@media (min-width: 1024px) {
	.v-product__faq-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.618fr); gap: var(--v-space-9); align-items: start; }
}

.v-product__related-title { margin-bottom: var(--v-space-8); }
/* "You may also like" + "Shop all jackets" on one baseline (the link sits on the heading's right edge). */
.v-product__rail-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--v-space-3) var(--v-space-6); margin-bottom: var(--v-space-8); }
.v-product__rail-head .v-product__related-title { margin-bottom: 0; }
.v-product__rail {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--v-space-6) var(--v-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 1024px) {
	.v-product__rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ------------------------------------------------------------ Sticky buy bar (§11.3.2): every width */
.v-sticky-buy {
	position: fixed;
	inset: auto 0 0 0;
	z-index: var(--v-z-header);
	padding-block: var(--v-space-3) calc(var(--v-space-3) + env(safe-area-inset-bottom, 0px));
	background: var(--v-surface);
	border-top: var(--v-hairline) solid var(--v-border);
	transform: translateY(100%);
	transition: transform var(--v-dur-bar-out) var(--v-ease-out), visibility 0s linear var(--v-dur-bar-out);
	visibility: hidden;
}
.v-sticky-buy[hidden] { display: none; }
.v-sticky-buy.is-shown { transform: none; visibility: visible; transition-duration: var(--v-dur-ui), 0s; transition-delay: 0s; }
.v-sticky-buy__inner { display: flex; align-items: center; gap: var(--v-space-4); }
.v-sticky-buy__meta {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: var(--v-space-3);
	min-width: 0;
	min-height: var(--v-hit-min);
	padding: 0;
	border: 0;
	background: none;
	color: var(--v-text);
	text-align: left;
	cursor: pointer;
}
.v-sticky-buy__thumb { flex: 0 0 auto; width: var(--v-control-h); aspect-ratio: var(--v-card-ratio); overflow: hidden; background: var(--v-card-image-bg); }
.v-sticky-buy__thumb img { width: 100%; height: 100%; object-fit: cover; }
.v-sticky-buy__text { display: grid; min-width: 0; }
.v-sticky-buy__name,
.v-sticky-buy__choice { overflow: hidden; font-size: var(--v-text-small); text-overflow: ellipsis; white-space: nowrap; }
.v-sticky-buy__name { font-weight: var(--v-weight-semibold); }
.v-sticky-buy__choice { color: var(--v-text-muted); }
.v-sticky-buy__choice-price { display: none; }
.v-sticky-buy__dates,
.v-sticky-buy__price { flex: 0 0 auto; margin: 0; font-size: var(--v-text-small); white-space: nowrap; }
.v-sticky-buy__price { font-weight: var(--v-weight-semibold); font-variant-numeric: tabular-nums; }
.v-sticky-buy__dates { display: none; color: var(--v-text-muted); }
.v-sticky-buy .v-btn { flex: 0 0 auto; }
@media (max-width: 599px) {
	.v-sticky-buy__thumb { display: none; }
	.v-sticky-buy__price { display: none; }       /* the price shows in the choice line on phones */
	.v-sticky-buy__choice-price { display: inline; }
}
@media (min-width: 1024px) {
	.v-sticky-buy__dates { display: block; }
}
/* Focus is never hidden behind the bar (WCAG 2.4.11). */
html.v-has-sticky-buy { scroll-padding-bottom: calc(var(--v-control-h-lg) + var(--v-space-8)); }

/* ------------------------------------------------------------ Photo viewer (native dialog) */
.v-lightbox {
	width: 100vw;
	max-width: 100vw;
	height: 100dvh;
	max-height: 100dvh;
	margin: 0;
	padding: 0;
	border: 0;
	background: var(--v-surface);
	color: var(--v-text);
	overscroll-behavior: contain;
}
.v-lightbox::backdrop { background: var(--v-scrim); }
.v-lightbox[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.v-lightbox__bar { display: flex; align-items: center; justify-content: space-between; padding: var(--v-space-2) var(--v-space-5); }
.v-lightbox__count { margin: 0; font-size: var(--v-text-small); color: var(--v-text-muted); font-variant-numeric: tabular-nums; }
.v-lightbox__stage { overflow: auto; display: grid; place-items: center; touch-action: pan-x pan-y pinch-zoom; }
.v-lightbox__stage img { max-width: none; width: min(100%, var(--v-lightbox-img-max)); height: auto; }
.v-lightbox__step {
	position: absolute;
	top: 50%;
	display: grid;
	place-items: center;
	width: var(--v-hit-min);
	height: var(--v-hit-min);
	border: 0;
	background: var(--v-surface);
	color: var(--v-text);
	cursor: pointer;
	transform: translateY(-50%);
}
.v-lightbox__step[hidden] { display: none; }
.v-lightbox__step--prev { left: var(--v-space-3); }
.v-lightbox__step--next { right: var(--v-space-3); }

@media (prefers-reduced-motion: reduce) {
	.v-sticky-buy { transform: none; opacity: 0; transition: opacity var(--v-dur-bar-out) linear, visibility 0s linear var(--v-dur-bar-out); }
	.v-sticky-buy.is-shown { opacity: 1; }
}

/* ------------------------------------------------------------ Reviews (§11.15). Stars (.v-stars) are a component (components.css). */
/* Rating summary under the product name: one link to the reviews. */
.v-rating-link {
	display: inline-flex;
	align-items: center;
	gap: var(--v-space-2);
	min-height: var(--v-hit-min);
	color: var(--v-text);
	font-size: var(--v-text-small);
	font-variant-numeric: tabular-nums;
	text-decoration: none;
}
.v-rating-link span { text-decoration: underline; text-underline-offset: 0.2em; text-decoration-color: var(--v-border-strong); }
@media (hover: hover) and (pointer: fine) {
	.v-rating-link:hover span { text-decoration-color: currentColor; }
}

/* Section: summary 1 : list 1.618 (golden split, §5), stacked below 1024px. */
.v-reviews__grid { display: grid; gap: var(--v-space-9); }
@media (min-width: 1024px) {
	.v-reviews__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.618fr); gap: var(--v-space-10); align-items: start; }
	.v-reviews__summary { position: sticky; top: calc(var(--v-header-h) + var(--v-space-6)); }
}
.v-reviews__summary { display: grid; gap: var(--v-space-6); align-content: start; }
.v-reviews__score { display: grid; gap: var(--v-space-3); }
.v-reviews__average { display: grid; gap: var(--v-space-1); margin: 0; }
.v-reviews__average strong { font-size: var(--v-text-price); font-weight: var(--v-weight-semibold); font-variant-numeric: tabular-nums; }
.v-reviews__average span { color: var(--v-text-muted); font-size: var(--v-text-small); }

.v-reviews__bars { display: grid; gap: var(--v-space-2); margin: 0; padding: 0; list-style: none; font-size: var(--v-text-small); font-variant-numeric: tabular-nums; }
.v-reviews__bars li { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) 2rem; align-items: center; gap: var(--v-space-3); }
.v-reviews__bar { height: var(--v-space-1); background: var(--v-sand); }
.v-reviews__bar span { display: block; width: var(--v-bar, 0%); height: 100%; background: var(--v-text); }
.v-reviews__bar-count { text-align: right; color: var(--v-text-muted); }

/* Fit bar: three equal cells; the answer most buyers gave is filled in Ink and named in text above. */
.v-fitbar { padding-top: var(--v-space-6); border-top: var(--v-hairline) solid var(--v-border); }
.v-fitbar__title { margin: 0 0 var(--v-space-4); font-weight: var(--v-weight-semibold); }
.v-fitbar__scale { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--v-hairline-strong); margin: 0; padding: 0; list-style: none; }
.v-fitbar__scale li { display: grid; gap: var(--v-space-1); align-content: start; font-size: var(--v-text-small); }
.v-fitbar__cell { height: var(--v-space-2); margin-bottom: var(--v-space-2); background: var(--v-sand); }
.v-fitbar__scale .is-most .v-fitbar__cell { background: var(--v-text); }
.v-fitbar__scale .is-most .v-fitbar__label { font-weight: var(--v-weight-semibold); }
.v-fitbar__count { color: var(--v-text-muted); font-variant-numeric: tabular-nums; }

/* Filter by size bought: a plain GET form. */
.v-reviews__filter { display: flex; flex-wrap: wrap; align-items: end; gap: var(--v-space-3); margin-bottom: var(--v-space-6); }
.v-reviews__filter .v-field { flex: 1 1 10rem; max-width: 16rem; }
.v-reviews__showing { margin: 0 0 var(--v-space-4); color: var(--v-text-muted); font-size: var(--v-text-small); }

/* List: one hairline between reviews, no boxes. */
.v-reviews__list { margin: 0; padding: 0; list-style: none; }
.v-review { display: grid; gap: var(--v-space-3); padding-block: var(--v-space-6); border-top: var(--v-hairline) solid var(--v-border); }
.v-review:first-child { padding-top: 0; border-top: 0; }
.v-review__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-2) var(--v-space-3); font-size: var(--v-text-small); }
.v-review__rating { font-weight: var(--v-weight-semibold); font-variant-numeric: tabular-nums; }
.v-review__date { margin-left: auto; color: var(--v-text-muted); }
.v-review__by { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-2) var(--v-space-3); margin: 0; }
.v-review__verified { display: inline-flex; align-items: center; gap: var(--v-space-1); color: var(--v-text-muted); font-size: var(--v-text-small); }
.v-review__verified .v-icon { color: var(--v-success); }
.v-review__facts { display: flex; flex-wrap: wrap; gap: var(--v-space-1) var(--v-space-6); margin: 0; font-size: var(--v-text-small); }
.v-review__facts div { display: flex; gap: var(--v-space-2); }
.v-review__facts dt { color: var(--v-text-muted); }
.v-review__facts dd { margin: 0; font-weight: var(--v-weight-semibold); }
.v-review__text { max-width: var(--v-measure); }
.v-review__text > * + * { margin-top: var(--v-space-3); }
.v-reviews__more { margin: var(--v-space-4) 0 0; }

/* Write a review (verified buyers only). */
.v-review-form { display: grid; gap: var(--v-space-6); max-width: 40rem; margin-top: var(--v-space-9); padding-top: var(--v-space-8); border-top: var(--v-hairline) solid var(--v-border); }
.v-reviews__main > .v-review-form:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.v-review-form__heading { margin: 0; }
.v-review-form__lead,
.v-review-form__note { margin: 0; color: var(--v-text-muted); font-size: var(--v-text-small); }
.v-review-form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.v-review-form legend { padding: 0; }
.v-review-form .v-pill input[aria-invalid="true"] + span { border-color: var(--v-field-error); }
.v-reviews__empty { max-width: 24rem; color: var(--v-text-muted); }
.v-review-form .v-btn { justify-self: start; }
.v-review-form--done { gap: var(--v-space-2); }
.v-review-form--done p { margin: 0; }
.v-review-form__title { display: flex; align-items: center; gap: var(--v-space-2); font-weight: var(--v-weight-semibold); }
.v-review-form__title .v-icon { color: var(--v-success); }

/* Star input: native radios drawn as stars. Every star up to the chosen one fills in Hide (a
   selected state, §3) through :has(); the number is shown in text. Hover previews on fine pointers. */
.v-rate__stars { display: flex; flex-wrap: wrap; align-items: center; gap: var(--v-space-1); }
.v-rate__star { position: relative; display: grid; place-items: center; width: var(--v-hit-min); height: var(--v-hit-min); cursor: pointer; }
.v-rate__star input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.v-rate__star svg { width: var(--v-space-7); height: var(--v-space-7); fill: none; stroke: var(--v-muted); stroke-width: var(--v-hairline-strong); pointer-events: none; } /* instant: only transform, opacity and clip-path animate (§7.3) */
.v-rate__star:has(input:focus-visible) { outline: var(--v-hairline-strong) solid var(--v-focus); outline-offset: calc(var(--v-hairline-strong) * -1); }
.v-rate__star:has(input[aria-invalid="true"]) svg { stroke: var(--v-field-error); }
.v-rate__stars:has(input:checked) .v-rate__star svg { fill: var(--v-hide); stroke: var(--v-hide); }
.v-rate__stars .v-rate__star:has(input:checked) ~ .v-rate__star svg { fill: none; stroke: var(--v-muted); }
@media (hover: hover) and (pointer: fine) {
	.v-rate__stars.v-rate__stars:has(.v-rate__star:hover) .v-rate__star svg { fill: var(--v-hide-deep); stroke: var(--v-hide-deep); }
	.v-rate__stars.v-rate__stars .v-rate__star:hover ~ .v-rate__star svg { fill: none; stroke: var(--v-muted); }
}
.v-rate__value { margin-left: var(--v-space-2); font-size: var(--v-text-small); font-weight: var(--v-weight-semibold); font-variant-numeric: tabular-nums; }
.v-rate__value span { display: none; }
.v-rate__stars:has(input[value="1"]:checked) .v-rate__value [data-n="1"],
.v-rate__stars:has(input[value="2"]:checked) .v-rate__value [data-n="2"],
.v-rate__stars:has(input[value="3"]:checked) .v-rate__value [data-n="3"],
.v-rate__stars:has(input[value="4"]:checked) .v-rate__value [data-n="4"],
.v-rate__stars:has(input[value="5"]:checked) .v-rate__value [data-n="5"] { display: inline; }

/* The FAQ right after the reviews: both sit on Paper, so one hairline separates them. */
/* Reviews, then the Stitch, then the FAQ: the divider takes the place of the section gap. */
.v-reviews + .v-product__faq { padding-top: 0; }
.v-product__faq-cut { margin-bottom: var(--v-section-y); }

/* Review photos (§11.15, v1.29): square thumbnails in a row, each a link to the full photo. */
.v-review__photos { display: flex; flex-wrap: wrap; gap: var(--v-space-2); margin: 0; padding: 0; list-style: none; }
.v-review__photos a { display: block; width: var(--v-space-12); aspect-ratio: 1; background: var(--v-sand); }
.v-review__photos img { width: 100%; height: 100%; object-fit: cover; }
.v-review__photos a:focus-visible { outline: var(--v-hairline-strong) solid var(--v-focus); outline-offset: var(--v-hairline-strong); }

/* File field: the native control (keyboard, screen readers and phone photo pickers work as users
   expect), framed like the other fields; the button part takes the secondary button look. */
.v-file {
	width: 100%;
	min-height: var(--v-field-h);
	padding: var(--v-space-2);
	border: var(--v-hairline) solid var(--v-field-border);
	background: var(--v-field-bg);
	color: var(--v-text);
	font-size: var(--v-text-small);
}
.v-file::file-selector-button {
	min-height: var(--v-hit-min);
	margin-right: var(--v-space-3);
	padding-inline: var(--v-space-4);
	border: var(--v-hairline) solid var(--v-btn-secondary-border);
	border-radius: var(--v-radius);
	background: var(--v-surface);
	color: var(--v-btn-secondary-text);
	font: inherit;
	font-weight: var(--v-weight-semibold);
	cursor: pointer;
}
.v-file:focus-visible { border-color: var(--v-field-border-focus); }
.v-file[aria-invalid="true"] { border-color: var(--v-field-error); }