@font-face { font-family:"WB Preview Futura"; src:url("../fonts/cover-preview/Futura.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Allura"; src:url("../fonts/cover-preview/Allura.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Amatic"; src:url("../fonts/cover-preview/Amatic.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Dancing"; src:url("../fonts/cover-preview/Dancing.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Life Savers"; src:url("../fonts/cover-preview/LifeSavers.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Montserrat"; src:url("../fonts/cover-preview/Montserrat.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Poiret"; src:url("../fonts/cover-preview/Poiret.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Rozha One"; src:url("../fonts/cover-preview/RozhaOne.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Summerlight"; src:url("../fonts/cover-preview/Summerlight.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Trajan Pro"; src:url("../fonts/cover-preview/TrajanPro.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Westerburg"; src:url("../fonts/cover-preview/Westerburg.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"WB Preview Floral Hearts"; src:url("../fonts/cover-preview/FloralHearts%20Regular%20%2B%20Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"WB Preview Hometown"; src:url("../fonts/cover-preview/Hometown.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"WB Preview Birthstone"; src:url("../fonts/cover-preview/Birthstone.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"WB Preview Carrie"; src:url("../fonts/cover-preview/Carrie.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"WB Preview Colombia"; src:url("../fonts/cover-preview/Colombia.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"WB Preview Gloucester"; src:url("../fonts/cover-preview/Gloucester.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"WB Preview Northwest"; src:url("../fonts/cover-preview/Northwest.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }

.mpab-cover-preview-stage {
	display:block;
	position:relative;
	width:100%;
	aspect-ratio:1;
	overflow:hidden;
	background:color-mix(in srgb,var(--mpab-text) 4%,transparent);
	line-height:0;
}

.mpab-cover-preview-image {
	display:block;
	width:100%;
	height:100%;
	object-fit:contain;
}

.mpab-cover-preview-placeholder {
	display:grid;
	position:absolute;
	inset:0;
	place-items:center;
	padding:28px;
	color:var(--mpab-muted);
	font-size:12px;
	font-weight:650;
	letter-spacing:.06em;
	line-height:1.45;
	text-align:center;
	text-transform:uppercase;
}

.mpab-cover-preview-text {
	display:flex;
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	width:var(--mpab-preview-text-width,62%);
	max-width:var(--mpab-preview-text-width,62%);
	flex-direction:column;
	gap:.18em;
	transform:translate(-50%,-50%);
	overflow:visible;
	background:var(--mpab-preview-foil,linear-gradient(105deg,#805514 5%,#c79028 28%,#f2d777 51%,#aa7019 77%,#e7c564 96%));
	background-clip:text;
	color:transparent;
	filter:drop-shadow(0 .6px .25px rgba(55,33,4,.64)) drop-shadow(0 -.4px .2px rgba(255,243,174,.58));
	font-size:11px;
	font-weight:400;
	letter-spacing:.025em;
	line-height:1.05;
	text-align:center;
	white-space:nowrap;
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
}

.mpab-cover-preview-text > span { display:block; min-width:max-content; }
.mpab-cover-preview-text.is-placeholder { opacity:.45; }

.mpab-cover-preview-stage.is-engraving .mpab-cover-preview-text {
	opacity:var(--mpab-preview-engraving-opacity,.45);
	background:linear-gradient(var(--mpab-preview-burn,#34312e),var(--mpab-preview-burn,#34312e));
	background-clip:text;
	filter:blur(var(--mpab-preview-softness,.16px)) drop-shadow(.32px .7px .15px var(--mpab-preview-highlight,rgba(255,255,255,.38))) drop-shadow(-.3px -.62px .15px var(--mpab-preview-shadow,rgba(28,22,18,.62)));
	mix-blend-mode:multiply;
	-webkit-background-clip:text;
}

.mpab-cover-preview-design {
	display:block;
	position:absolute;
	z-index:2;
	top:50%;
	left:50%;
	width:30%;
	aspect-ratio:1;
	transform:translate(-50%,-50%);
	background:var(--mpab-preview-foil,linear-gradient(105deg,#805514 5%,#c79028 28%,#f2d777 51%,#aa7019 77%,#e7c564 96%));
	filter:drop-shadow(0 .5px .25px rgba(55,33,4,.50)) drop-shadow(0 -.32px .18px rgba(255,243,174,.44));
	mask:var(--mpab-preview-design-mask) center / contain no-repeat;
	-webkit-mask:var(--mpab-preview-design-mask) center / contain no-repeat;
}

.mpab-cover-preview-stage.is-engraving .mpab-cover-preview-design {
	opacity:var(--mpab-preview-engraving-opacity,.45);
	background:var(--mpab-preview-burn,#34312e);
	filter:blur(var(--mpab-preview-softness,.16px)) drop-shadow(.55px .85px .18px var(--mpab-preview-highlight,rgba(255,255,255,.38))) drop-shadow(-.52px -.82px .18px var(--mpab-preview-shadow,rgba(28,22,18,.62)));
	mix-blend-mode:multiply;
}

.mpab-cover-preview-design.is-full-cover {
	mask-size:contain;
	-webkit-mask-size:contain;
}

.mpab-cover-preview-stage[data-orientation="landscape"] .mpab-cover-preview-design.is-full-cover,
.mpab-cover-preview-stage[data-orientation="portrait"] .mpab-cover-preview-design.is-full-cover {
	mask-size:100% 100%;
	-webkit-mask-size:100% 100%;
}

.mpab-cover-preview-design[hidden] { display:none !important; }

.mpab-quiet-companion {
	display:grid;
	position:fixed !important;
	z-index:999;
	left:50%;
	bottom:max(12px,env(safe-area-inset-bottom));
	width:min(1000px,calc(100vw - 24px));
	min-height:0;
	min-width:0;
	grid-template-columns:112px minmax(150px,.8fr) minmax(0,2fr);
	grid-template-rows:auto auto;
	column-gap:12px;
	padding:10px;
	transform:translateX(-50%);
	border:1px solid var(--mpab-line);
	border-radius:max(10px,var(--mpab-field-radius));
	background:color-mix(in srgb,#fff 94%,var(--mpab-tint));
	box-shadow:0 18px 55px rgba(20,20,18,.2);
	backdrop-filter:blur(12px);
}

.mpab-builder .mpab-form.has-bottom-companion { padding-bottom:154px !important; }

.mpab-quiet-companion > .mpab-cover-preview-button {
	grid-column:1;
	grid-row:1 / span 2;
}

.mpab-cover-preview-button {
	display:block;
	position:relative;
	width:100%;
	margin:0;
	padding:0;
	overflow:hidden;
	border:0;
	border-radius:max(7px,var(--mpab-field-radius));
	outline:0;
	background:transparent;
	box-shadow:none;
	cursor:zoom-in;
}

.mpab-cover-preview-meta {
	display:flex;
	grid-column:2;
	grid-row:1;
	flex-direction:column;
	justify-content:center;
	min-width:0;
	padding:8px 14px;
	border-left:1px solid var(--mpab-line);
}

.mpab-cover-preview-meta__type,
.mpab-cover-preview-meta__size {
	display:block;
	overflow:hidden;
	color:var(--mpab-text);
	font-size:12px;
	line-height:1.4;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.mpab-cover-preview-meta__type { font-weight:700; }
.mpab-cover-preview-meta__size { font-weight:500; }

.mpab-cover-preview-link {
	align-self:flex-start;
	margin:5px 0 0;
	padding:2px 0;
	border:0;
	border-bottom:1px solid color-mix(in srgb,var(--mpab-text) 32%,transparent);
	border-radius:0;
	color:color-mix(in srgb,var(--mpab-text) 66%,transparent);
	background:transparent;
	box-shadow:none;
	font:inherit;
	font-size:11px;
	font-weight:500;
	letter-spacing:.015em;
	line-height:1.3;
	text-transform:none;
	cursor:pointer;
	transition:color 240ms ease,border-color 240ms ease;
}

.mpab-cover-preview-link:hover,
.mpab-cover-preview-link:focus-visible {
	border-color:var(--mpab-accent);
	color:var(--mpab-accent);
	outline:0;
}

.mpab-cover-preview-button:focus-visible { box-shadow:0 0 0 3px var(--mpab-accent); }
.mpab-cover-preview-button:hover .mpab-cover-preview-image { transform:scale(1.012); }
.mpab-cover-preview-image { transition:transform 180ms ease; }

.mpab-quiet-companion__warning {
	grid-column:2 / -1;
	grid-row:2;
	margin:0 4px 6px !important;
	color:#8b3f1f !important;
	font-size:11px !important;
	font-weight:650;
	line-height:1.45;
}
.mpab-quiet-companion.has-text-warning { border-color:#a85324; }

.mpab-quiet-companion .mpab-album-so-far {
	grid-column:3;
	grid-row:1;
	margin:0;
	overflow:visible;
	border:0;
	border-left:1px solid var(--mpab-line);
	border-radius:0;
	background:transparent;
}

.mpab-quiet-companion .mpab-album-so-far__body {
	display:grid;
	grid-template-columns:minmax(0,1fr);
	align-items:center;
	gap:12px;
	padding:10px 14px;
}

.mpab-quiet-companion .mpab-album-miniature { display:none; }

.mpab-quiet-companion .mpab-album-miniature > span { display:none; }

.mpab-quiet-companion .mpab-album-miniature small {
	display:block;
	font-size:12px;
	line-height:1.45;
}

.mpab-quiet-companion .mpab-album-so-far dl {
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:8px 12px;
}

.mpab-quiet-companion .mpab-album-so-far dt { font-size:8px; }
.mpab-quiet-companion .mpab-album-so-far dd { display:block; font-size:11px; line-height:1.4; }
.mpab-quiet-companion .mpab-progress-swatch { display:none; }

.mpab-cover-preview-button--review { width:min(300px,100%); }
.mpab-review-product .mpab-cover-preview-button--review { margin:0 auto; }

/* Final review: preview on the left, complete order summary on the right. */
.mpab-builder .mpab-review-card {
	grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);
}

.mpab-builder .mpab-review-product {
	align-content:start;
	gap:18px;
	min-height:390px;
	padding:clamp(22px,4vw,38px);
	border-right:1px solid var(--mpab-line);
	border-bottom:0;
}

.mpab-builder .mpab-review-card__details {
	padding-bottom:clamp(18px,3vw,30px);
}

.mpab-builder .mpab-review-card__details > .mpab-summary { margin-top:0; }

/* Pinterest's browser button honours these image attributes; this rule also
   prevents a script-injected control from occupying the preview surface. */
.mpab-cover-preview-stage [data-pin-log],
.mpab-cover-preview-stage .PIN_ieg_permalink,
.mpab-cover-preview-stage .pinit-button { display:none !important; }

.mpab-cover-preview-dialog {
	width:min(92vw,760px);
	max-width:760px;
	max-height:92vh;
	margin:auto;
	padding:0;
	overflow:visible;
	border:1px solid var(--mpab-line);
	border-radius:14px;
	background:#f4f1eb;
	box-shadow:0 30px 100px rgba(0,0,0,.28);
}

.mpab-cover-preview-dialog::backdrop { background:rgba(20,20,18,.66); backdrop-filter:blur(3px); }
.mpab-cover-preview-dialog__panel { display:grid; gap:12px; position:relative; padding:18px; }
.mpab-cover-preview-dialog__close {
	position:absolute;
	z-index:4;
	top:26px;
	right:26px;
	padding:9px 13px;
	border:1px solid rgba(255,255,255,.72);
	border-radius:999px;
	color:#fff;
	background:rgba(25,25,23,.72);
	font:inherit;
	font-size:12px;
	font-weight:700;
	cursor:pointer;
}
.mpab-cover-preview-stage--dialog { width:min(72vh,100%); margin:auto; background:#eee9df; }
.mpab-cover-preview-dialog__title { color:#292b22; font-size:13px; line-height:1.4; text-align:center; }
.mpab-cover-preview-dialog__note {
	max-width:590px;
	margin:-4px auto 2px !important;
	color:#706c66 !important;
	font-size:11px !important;
	line-height:1.5;
	text-align:center;
}

.mpab-personalisation-branch > .mpab-options--four { align-items:stretch; }
.mpab-personalisation-branch > .mpab-options--four > .mpab-option { display:flex; height:100%; }
.mpab-personalisation-branch > .mpab-options--four > .mpab-option > .mpab-option__body { width:100%; height:100%; }
.mpab-personalisation-branch > .mpab-options--four > .mpab-option .mpab-option__copy { height:100%; }

/* Material and cover-colour rows behave as equal-height, full-card controls. */
.mpab-builder .mpab-options--cover-materials,
.mpab-builder .mpab-options--swatches { align-items:stretch; }

.mpab-builder .mpab-options--cover-materials > .mpab-option,
.mpab-builder .mpab-options--swatches > .mpab-option {
	display:flex;
	height:100%;
}

.mpab-builder .mpab-options--cover-materials .mpab-option__body,
.mpab-builder .mpab-options--swatches .mpab-option__body {
	display:flex;
	width:100%;
	height:100%;
	flex-direction:column;
}

.mpab-builder .mpab-options--cover-materials .mpab-option__copy,
.mpab-builder .mpab-options--swatches .mpab-option__copy {
	flex:1;
}

.mpab-builder .mpab-options--cover-materials .mpab-option__copy { padding-right:16px; }

.mpab-builder .mpab-options--swatches .mpab-option__copy {
	min-height:66px;
	align-items:center;
	justify-content:center;
	padding:11px 7px;
	text-align:center;
}

.mpab-builder .mpab-options--cover-materials .mpab-option__mark,
.mpab-builder .mpab-options--swatches .mpab-option__mark { display:none !important; }

/* The complete option card is now the control—no separate radio circles. */
.mpab-builder .mpab-option__mark { display:none !important; }
.mpab-builder .mpab-option__body { cursor:pointer; }
.mpab-builder .mpab-option__copy {
	padding-right:20px;
	padding-left:20px;
}

.mpab-builder .mpab-options--personalisation-methods .mpab-option__copy,
.mpab-builder .mpab-options--presentation .mpab-option__copy,
.mpab-builder .mpab-options--box-colours .mpab-option__copy {
	padding-right:20px;
	padding-left:20px;
}

/* Album selection uses one continuous selected frame around image and text. */
.mpab-builder .mpab-options--album-types .mpab-option__body--visual {
	overflow:hidden;
	border:1px solid var(--mpab-line);
	border-radius:max(8px,var(--mpab-field-radius));
	background:color-mix(in srgb,#fff 96%,var(--mpab-tint));
	box-shadow:0 12px 30px rgba(20,20,18,.08);
}

.mpab-builder .mpab-options--album-types .mpab-option__media {
	border:0;
	border-radius:0;
	box-shadow:none;
}

.mpab-builder .mpab-options--album-types .mpab-option__copy {
	min-height:78px;
	padding:17px 20px;
}

.mpab-builder .mpab-options--album-types .mpab-option input:checked + .mpab-option__body {
	border:2px solid var(--mpab-accent);
	background:var(--mpab-selected-bg);
	box-shadow:0 0 0 2px var(--mpab-accent),0 16px 38px var(--mpab-selected-shadow);
	transform:translateY(-2px);
}

.mpab-builder .mpab-options--album-types .mpab-option input:checked + .mpab-option__body .mpab-option__media {
	border-color:transparent;
	box-shadow:none;
	transform:none;
}

.mpab-builder .mpab-options--font-gallery .mpab-option {
	min-width:0;
}

.mpab-builder .mpab-options--font-gallery .mpab-option__body {
	width:100%;
	cursor:pointer;
}

.mpab-builder .mpab-options--font-gallery .mpab-option__copy {
	display:flex;
	min-width:0;
	min-height:68px;
	align-items:center;
	justify-content:center;
	padding:12px 7px;
	text-align:center;
}

.mpab-builder .mpab-options--font-gallery .mpab-option__copy strong {
	display:block;
	width:100%;
	min-width:0;
	max-width:100%;
	font-size:clamp(11px,1.25vw,14px);
	line-height:1.2;
	overflow-wrap:anywhere;
	word-break:normal;
}

.mpab-builder .mpab-options--font-gallery .mpab-option__mark {
	display:none !important;
}

.mpab-builder .mpab-options--font-gallery .mpab-option input:checked + .mpab-option__body {
	border:2px solid var(--mpab-accent);
	background:var(--mpab-selected-bg);
	box-shadow:0 0 0 2px var(--mpab-accent),0 12px 26px var(--mpab-selected-shadow);
	transform:translateY(-2px);
}

.mpab-builder .mpab-options--font-gallery .mpab-option input:checked + .mpab-option__body .mpab-option__copy {
	background:var(--mpab-accent);
}

.mpab-builder .mpab-options--font-gallery .mpab-option input:checked + .mpab-option__body .mpab-option__copy strong {
	color:var(--mpab-accent-contrast) !important;
}

@media (max-width: 520px) {
	.mpab-builder .mpab-form.has-bottom-companion { padding-bottom:150px !important; }
	.mpab-quiet-companion {
		bottom:max(6px,env(safe-area-inset-bottom));
		width:calc(100vw - 12px);
		grid-template-columns:82px minmax(0,1fr);
		grid-template-rows:auto auto auto;
		column-gap:7px;
		padding:6px;
	}
	.mpab-quiet-companion > .mpab-cover-preview-button { grid-row:1 / span 3; }
	.mpab-cover-preview-meta { grid-column:2; grid-row:1; padding:6px 8px; }
	.mpab-cover-preview-meta__type,
	.mpab-cover-preview-meta__size { font-size:10px; }
	.mpab-quiet-companion__warning { grid-column:2; grid-row:3; }
	.mpab-quiet-companion .mpab-album-so-far { grid-column:2; grid-row:2; }
	.mpab-quiet-companion .mpab-album-so-far__body {
		display:block;
		padding:6px 8px;
	}
	.mpab-quiet-companion .mpab-album-so-far dl { grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px 8px; }
	.mpab-quiet-companion .mpab-album-so-far dt { font-size:7px; }
	.mpab-quiet-companion .mpab-album-so-far dd { font-size:9px; line-height:1.25; }
	.mpab-cover-preview-link { margin-left:1px; font-size:10px; }
	.mpab-builder .mpab-review-product { grid-template-columns:minmax(0,1fr); }
	.mpab-cover-preview-dialog__panel { padding:8px; }
	.mpab-cover-preview-dialog__close { top:16px; right:16px; }
}

@media (max-width: 760px) {
	.mpab-builder .mpab-review-card { grid-template-columns:minmax(0,1fr); }
	.mpab-builder .mpab-review-product {
		grid-template-columns:minmax(90px,125px) minmax(0,1fr);
		justify-items:start;
		min-height:0;
		padding:26px;
		border-right:0;
		border-bottom:1px solid var(--mpab-line);
		text-align:left;
	}
	.mpab-builder .mpab-cover-preview-button--review { width:100%; }
}

@media (max-width: 440px) {
	.mpab-builder .mpab-review-product { grid-template-columns:95px minmax(0,1fr); padding:20px; }
}

@media (prefers-reduced-motion:reduce) {
	.mpab-cover-preview-image,
	.mpab-cover-preview-link { transition:none; }
}
