/* =========================================================================
   FACTORIZE SWIPE
   -------------------------------------------------------------------------
   Colour and shape come from custom properties on the root (see
   inc/render.php for the contract). Resolution order, most specific first:

     --fzsw-*        set by the settings screen, the block, an Elementor style
                     control or your own CSS
     --fzsw-auto-*   derived by the script from the page the deck sits on
                     (theme mode)
     theme tokens    Elementor globals, theme.json presets, Factorize themes
     fallbacks       a neutral light scheme

   Themes style bare <button>s aggressively (colours with !important, hover
   fills, uppercase, letter-spacing). Every control here therefore sets its
   own colours with !important at a specificity those rules cannot reach.
   ========================================================================= */

.fzsw {
	--_accent: var(--fzsw-accent, var(--e-global-color-accent, var(--wp--preset--color--primary, var(--wp--preset--color--accent-1, var(--ia-wine, var(--et-accent, #1f2937))))));
	--_pass: var(--fzsw-pass, #b42318);
	--_keep: var(--fzsw-keep, #157f3b);
	--_ink: var(--fzsw-ink, var(--fzsw-auto-ink, #1f1d1a));
	--_card: var(--fzsw-card, var(--fzsw-auto-card, #ffffff));
	--_surface: var(--fzsw-surface, var(--fzsw-auto-surface, var(--_card)));
	--_muted: var(--fzsw-muted, color-mix(in srgb, var(--_ink) 62%, var(--_card)));
	--_line: color-mix(in srgb, var(--_ink) 14%, var(--_card));
	--_soft: color-mix(in srgb, var(--_ink) 6%, var(--_card));
	--_on-accent: var(--fzsw-on-accent, #ffffff);
	--_on-pass: var(--fzsw-on-pass, #ffffff);
	--_on-keep: var(--fzsw-on-keep, #ffffff);
	--_radius: var(--fzsw-radius, 18px);
	--_btn-radius: 999px;
	--_shadow: 0 10px 30px rgba(0, 0, 0, .12), 0 2px 6px rgba(0, 0, 0, .06);
	--_body-h: 64px;
	--_ratio: 0.75;            /* card width / image height */

	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	width: 100%;
	max-width: 560px;
	height: min(var(--fzsw-h, 680px), calc(100svh - 24px));
	min-height: 420px;
	margin: 0 auto;
	padding: 10px 0 6px;
	color: var(--_ink);
	font-family: inherit;
	line-height: 1.3;
	text-align: left;
	-webkit-user-select: none;
	user-select: none;
	/* A card flying off must not widen the page (a sideways jiggle on phones);
	   it fades as it goes, so ending at the deck's edge reads the same. */
	overflow-x: clip;
	overflow-clip-margin: 28px;
}
.fzsw *, .fzsw *::before, .fzsw *::after { box-sizing: border-box; }
.fzsw--layout-screen { height: var(--fzsw-fit-h, calc(100svh - 150px)); }
.fzsw--font-system { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
.fzsw--shape-rounded { --_btn-radius: 12px; }
.fzsw--shape-square { --_btn-radius: 3px; }
.fzsw--shadow-none { --_shadow: none; }
.fzsw--shadow-strong { --_shadow: 0 18px 44px rgba(0, 0, 0, .22), 0 4px 10px rgba(0, 0, 0, .1); }
.fzsw--ratio-4-5 { --_ratio: 0.8; }
.fzsw--ratio-1-1 { --_ratio: 1; }
.fzsw--ratio-2-3 { --_ratio: 0.6667; }
.fzsw-notice { padding: 12px 14px; border: 1px dashed currentColor; border-radius: 8px; opacity: .8; }

.fzsw__icon { display: block; flex: 0 0 auto; }

/* --- Progress ------------------------------------------------------------ */
.fzsw__progress { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; margin: 0 0 10px; }
.fzsw__progress-bar { flex: 1; height: 4px; border-radius: 2px; overflow: hidden; background: var(--_line); }
.fzsw__progress-fill { height: 100%; width: 0; background: var(--_accent); transition: width .25s ease; }
.fzsw__progress-text { flex: 0 0 auto; font-size: 13px; line-height: 1; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--_muted); }

/* --- Stack and cards ----------------------------------------------------- */
.fzsw__feed { position: relative; flex: 1 1 auto; min-height: 0; container-type: size; }
.fzsw__stack { position: absolute; inset: 0; }
.fzsw__card {
	/* the widest card whose image fits beside the name strip */
	--w: min(100cqw, 440px, calc((100cqh - var(--_body-h)) * var(--_ratio)));
	position: absolute;
	inset: 0;
	margin: auto;
	width: var(--w);
	height: calc(var(--w) / var(--_ratio) + var(--_body-h));
	max-width: 100%;
	max-height: 100%;
	display: flex;
	flex-direction: column;
	background: var(--_card);
	border-radius: var(--_radius);
	box-shadow: var(--_shadow);
	overflow: hidden;
	touch-action: none;           /* the card owns every gesture on it */
	cursor: grab;
	will-change: transform;
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
}
@supports not (width: 1cqw) {
	.fzsw__card { --w: min(78vw, 360px, calc((100vh - 330px) * var(--_ratio))); }
}
.fzsw__card:active { cursor: grabbing; }
.fzsw__card.is-top { z-index: 3; }
.fzsw__card.is-next { z-index: 2; pointer-events: none; }
.fzsw__card.is-leaving { z-index: 4; pointer-events: none; }
.fzsw__card:not(.is-top):not(.is-next):not(.is-leaving) { visibility: hidden; }

.fzsw__media { position: relative; flex: 1 1 auto; min-height: 0; width: 100%; background: var(--_soft); overflow: hidden; }
.fzsw .fzsw__photo {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	border: 0;
	border-radius: 0;
	object-fit: cover;
	-webkit-user-drag: none;
	pointer-events: none;
}
.fzsw--fit-contain .fzsw__photo { object-fit: contain; }

.fzsw__badge {
	position: absolute;
	top: 12px;
	left: 12px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--_accent);
	color: var(--_on-accent);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

/* Swipe stamps fade in with the drag (--keep / --pass, 0..1). */
.fzsw__stamp {
	position: absolute;
	top: 18px;
	padding: 4px 12px;
	border: 3px solid currentColor;
	border-radius: 8px;
	background: rgba(255, 255, 255, .9);
	font-size: 22px;
	font-weight: 800;
	letter-spacing: .08em;
	line-height: 1.1;
	text-transform: uppercase;
	pointer-events: none;
	opacity: 0;
}
.fzsw__stamp--keep { left: 16px; color: var(--_keep); transform: rotate(-12deg); opacity: var(--keep, 0); }
.fzsw__stamp--pass { right: 16px; color: var(--_pass); transform: rotate(12deg); opacity: var(--pass, 0); }
.fzsw__card.is-keep .fzsw__stamp--keep,
.fzsw__card.is-pass .fzsw__stamp--pass { opacity: 1; }

.fzsw__body {
	flex: 0 0 var(--_body-h);
	height: var(--_body-h);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 0 16px;
	border-top: 1px solid var(--_line);
}
.fzsw__text { min-width: 0; }
.fzsw .fzsw__cat {
	margin: 0 0 2px;
	font-size: 11px;
	line-height: 1.2;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--_muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.fzsw .fzsw__title {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: 17px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: 0;
	text-transform: none;
	color: var(--_ink);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.fzsw .fzsw__price {
	flex: 0 0 auto;
	margin: 0;
	font-size: 19px;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums;
	color: var(--_ink);
}
.fzsw__stars { position: relative; display: inline-block; width: 70px; height: 13px; margin-top: 3px; background: linear-gradient(90deg, var(--_line) 0 100%); -webkit-mask: var(--fzsw-star-mask); mask: var(--fzsw-star-mask); }
.fzsw__stars > span { position: absolute; inset: 0 auto 0 0; background: #e0a100; }
.fzsw { --fzsw-star-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 70 13'><g fill='black'><path id='s' d='M6.5 0l1.9 4.1 4.6.5-3.4 3.1.9 4.5-4-2.3-4 2.3.9-4.5L0 4.6l4.6-.5z'/><use href='%23s' x='14'/><use href='%23s' x='28'/><use href='%23s' x='42'/><use href='%23s' x='56'/></g></svg>") left center / 70px 13px no-repeat; }

/* --- End of the round ---------------------------------------------------- */
.fzsw__end {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 24px;
	text-align: center;
	background: var(--_card);
	border: 1px solid var(--_line);
	border-radius: var(--_radius);
}
.fzsw__end[hidden] { display: none; }
.fzsw .fzsw__end-title { margin: 0; font-size: 26px; font-weight: 700; line-height: 1.15; color: var(--_ink); }
.fzsw .fzsw__end-sub { margin: 0 0 8px; font-size: 15px; color: var(--_muted); }
.fzsw__end-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.fzsw .fzsw__end-link { margin-top: 4px; font-size: 14px; color: var(--_muted); text-decoration: underline; text-underline-offset: 3px; }
.fzsw .fzsw__end-link:hover { color: var(--_ink); }

/* Placed automatically into the shop or homepage (Placement settings). */
.fzsw-auto { margin: 0 auto 32px; max-width: 560px; }
.fzsw-auto--shop_bottom, .fzsw-auto--home_bottom { margin: 32px auto 0; }
.fzsw-auto__title { margin: 0 0 12px; text-align: center; }

/* --- Buttons: a full reset, then our own look ----------------------------- */
.fzsw button.fzsw__btn,
.fzsw button.fzsw__close,
.fzsw button.fzsw__pick-add,
.fzsw button.fzsw__pick-remove,
.fzsw button.fzsw__notice-close {
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: auto;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0 18px;
	border: 2px solid transparent;
	border-radius: var(--_btn-radius);
	box-shadow: none !important;
	text-shadow: none;
	font-family: inherit;
	font-size: 15px;
	font-style: normal;
	font-weight: 600;
	letter-spacing: .01em;
	line-height: 1;
	text-transform: none;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	opacity: 1;
	transform: none;
	transition: background-color .15s ease, border-color .15s ease, transform .12s ease, filter .15s ease;
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
}
.fzsw button.fzsw__btn { min-height: 46px; }
.fzsw button.fzsw__btn:active:not(:disabled) { transform: scale(.96); }
.fzsw button:focus-visible,
.fzsw a:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--_accent) 70%, #2563eb);
	outline-offset: 2px;
}
.fzsw button:disabled { cursor: not-allowed; }
/* Themes ring every focused button; opening the panel by tap focuses its
   close button, which should not draw a ring. Keyboard focus still does. */
.fzsw button:focus:not(:focus-visible),
.fzsw a:focus:not(:focus-visible) { outline: none !important; box-shadow: none !important; }

.fzsw__controls { flex: 0 0 auto; padding-top: 16px; }
.fzsw__row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; }
.fzsw__row:not(:has(.fzsw__btn--undo)) { grid-template-columns: 1fr 1fr; }

.fzsw .fzsw__row button.fzsw__btn--pass,
.fzsw .fzsw__row button.fzsw__btn--keep {
	min-height: 54px;
	font-size: 17px;
	font-weight: 700;
	letter-spacing: .02em;
}
.fzsw .fzsw__row button.fzsw__btn--pass { background: var(--_pass) !important; border-color: var(--_pass) !important; color: var(--_on-pass) !important; }
.fzsw .fzsw__row button.fzsw__btn--keep { background: var(--_keep) !important; border-color: var(--_keep) !important; color: var(--_on-keep) !important; }
.fzsw .fzsw__row button.fzsw__btn--pass:hover,
.fzsw .fzsw__row button.fzsw__btn--keep:hover { filter: brightness(.9); }

.fzsw .fzsw__row button.fzsw__btn--undo {
	width: 48px;
	height: 48px;
	min-height: 48px;
	padding: 0;
	border-radius: 50%;
	background: var(--_card) !important;
	border-color: var(--_line) !important;
	color: var(--_ink) !important;
}
.fzsw .fzsw__row button.fzsw__btn--undo:hover:not(:disabled) { background: var(--_soft) !important; }
.fzsw .fzsw__row button.fzsw__btn--undo:disabled { color: color-mix(in srgb, var(--_ink) 35%, var(--_card)) !important; }

.fzsw__bar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: 10px; }
.fzsw .fzsw__bar button.fzsw__btn--picks {
	background: var(--_card) !important;
	border-color: var(--_ink) !important;
	color: var(--_ink) !important;
}
.fzsw .fzsw__bar button.fzsw__btn--picks:hover { background: var(--_soft) !important; }
.fzsw .fzsw__btn--picks .fzsw__icon { width: 18px; height: 18px; color: var(--_accent); }
.fzsw__count {
	min-width: 24px;
	height: 24px;
	padding: 0 7px;
	border-radius: 12px;
	background: var(--_accent);
	color: var(--_on-accent);
	font-size: 13px;
	font-weight: 700;
	line-height: 24px;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.fzsw button.fzsw__btn--all,
.fzsw button.fzsw__btn--primary {
	background: var(--_accent) !important;
	border-color: var(--_accent) !important;
	color: var(--_on-accent) !important;
	font-weight: 700;
}
.fzsw button.fzsw__btn--all:hover:not(:disabled),
.fzsw button.fzsw__btn--primary:hover { filter: brightness(.9); }
.fzsw .fzsw__btn--all .fzsw__icon { width: 18px; height: 18px; }
.fzsw button.fzsw__btn--all:disabled:not(.is-busy) {
	background: var(--_soft) !important;
	border-color: var(--_line) !important;
	color: color-mix(in srgb, var(--_ink) 70%, var(--_card)) !important;   /* disabled, still legible */
}
.fzsw button.fzsw__btn--all.is-busy { cursor: progress; opacity: .92; }
.fzsw button.fzsw__btn--ghost { background: var(--_card) !important; border-color: var(--_ink) !important; color: var(--_ink) !important; }
.fzsw button.fzsw__btn--ghost:hover { background: var(--_soft) !important; }

/* --- Picks panel: a bottom sheet on phones, a side drawer on desktop ----- */
.fzsw-portal {
	/* the twin root the panel lives in (see swipe.js): not a layout box */
	overflow: visible;
	position: static;
	display: block;
	width: 0;
	height: 0;
	min-height: 0;
	max-width: none;
	margin: 0;
	padding: 0;
}
.fzsw__overlay { position: fixed; inset: 0; z-index: 100000; background: rgba(15, 14, 12, .45); opacity: 0; transition: opacity .22s ease; }
.fzsw__overlay.is-open { opacity: 1; }
.fzsw__overlay[hidden], .fzsw__panel[hidden] { display: none; }

.fzsw__panel {
	position: fixed;
	z-index: 100001;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	max-height: 86svh;
	max-height: 86dvh;
	background: var(--_surface);
	color: var(--_ink);
	border-radius: 20px 20px 0 0;
	box-shadow: 0 -12px 40px rgba(0, 0, 0, .18);
	padding-bottom: env(safe-area-inset-bottom, 0px);
	transform: translateY(100%);
	transition: transform .26s cubic-bezier(.2, .7, .3, 1);
	text-align: left;
	-webkit-user-select: text;
	user-select: text;
}
.fzsw__panel.is-open { transform: none; }
@media (min-width: 720px) {
	.fzsw__panel { top: 0; left: auto; width: 420px; max-height: none; border-radius: 0; box-shadow: -12px 0 40px rgba(0, 0, 0, .16); transform: translateX(100%); }
}
/* In an editor or the settings preview the panel stays inside the deck. */
.fzsw--preview { transform: translateZ(0); }
.fzsw--preview .fzsw__overlay, .fzsw--preview .fzsw__panel { position: absolute; }
.fzsw--preview .fzsw__panel { top: auto; left: 0; right: 0; width: auto; max-height: 86%; border-radius: 20px 20px 0 0; transform: translateY(100%); }
.fzsw--preview .fzsw__panel.is-open { transform: none; }

.fzsw__panel-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 12px 12px 20px; border-bottom: 1px solid var(--_line); }
.fzsw .fzsw__panel-title { margin: 0; padding: 0; font-family: inherit; font-size: 19px; font-style: normal; font-weight: 700; letter-spacing: 0; text-transform: none; line-height: 1.2; color: var(--_ink); }
.fzsw__panel-n { color: var(--_muted); font-weight: 500; }
.fzsw button.fzsw__close {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 50%;
	background: var(--_soft) !important;
	border-color: transparent !important;
	color: var(--_ink) !important;
}
.fzsw button.fzsw__close:hover { background: var(--_line) !important; }

/* The podium scrolls away with the picks rather than holding its place. */
.fzsw__scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.fzsw__list { padding: 4px 16px; }

/* Your taste — the three categories kept most, as a podium (2nd, 1st, 3rd). */
.fzsw__taste { padding: 10px 20px 0; background: var(--_soft); border-bottom: 1px solid var(--_line); }
.fzsw__taste[hidden] { display: none; }
.fzsw .fzsw__taste-label { margin: 0 0 6px; font-size: 11px; font-weight: 600; letter-spacing: .12em; line-height: 1; text-align: center; text-transform: uppercase; color: var(--_muted); }
.fzsw .fzsw__podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 6px; max-width: 300px; margin: 0 auto; padding: 0; list-style: none; }
.fzsw .fzsw__step { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 0; list-style: none; }
.fzsw__step::before, .fzsw__step::marker { content: none; }
.fzsw__step-name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0 0 4px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: .02em;
	text-align: center;
	overflow-wrap: anywhere;
	color: var(--_ink);
}
.fzsw__step-block { display: flex; align-items: flex-start; justify-content: center; padding-top: 4px; border-radius: 6px 6px 0 0; font-size: 15px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.fzsw__step--1 .fzsw__step-block { height: 42px; background: var(--_accent); color: var(--_on-accent); }
.fzsw__step--2 .fzsw__step-block { height: 30px; background: color-mix(in srgb, var(--_ink) 20%, var(--_card)); color: var(--_ink); }
.fzsw__step--3 .fzsw__step-block { height: 22px; background: color-mix(in srgb, var(--_ink) 11%, var(--_card)); color: var(--_ink); font-size: 13px; }
.fzsw__step.is-empty .fzsw__step-block { background: transparent; border: 1.5px dashed var(--_line); border-bottom: 0; color: var(--_muted); }
.fzsw__step.is-empty .fzsw__step-name::before { content: "\00a0"; }

.fzsw__pick { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--_soft); transition: opacity .22s ease, background-color .2s ease; }
.fzsw__pick:last-child { border-bottom: 0; }
.fzsw__pick.is-added { background: color-mix(in srgb, var(--_keep) 10%, var(--_surface)); }
.fzsw__pick.is-gone { opacity: 0; }
.fzsw__pick-thumb { flex: 0 0 60px; display: block; }
.fzsw .fzsw__pick-thumb img { display: block; width: 60px; height: 80px; max-width: none; margin: 0; object-fit: cover; border-radius: 8px; background: var(--_soft); }
.fzsw__pick-body { flex: 1 1 auto; min-width: 0; }
.fzsw .fzsw__pick-title { display: block; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--_ink) !important; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fzsw .fzsw__pick-price { margin: 2px 0 0; font-size: 15px; font-weight: 700; color: var(--_ink); }
.fzsw__pick-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.fzsw__pick-added { font-size: 14px; font-weight: 600; color: var(--_keep); white-space: nowrap; }

/* Always visible — a phone has no hover to reveal them. */
.fzsw button.fzsw__pick-remove {
	width: 42px;
	height: 42px;
	padding: 0;
	border-radius: 50%;
	background: var(--_surface) !important;
	border-color: color-mix(in srgb, var(--_pass) 30%, var(--_surface)) !important;
	color: var(--_pass) !important;
}
.fzsw button.fzsw__pick-remove:hover { border-color: var(--_pass) !important; }
.fzsw button.fzsw__pick-add {
	height: 42px;
	padding: 0 14px 0 11px;
	gap: 6px;
	font-size: 14px;
	font-weight: 700;
	background: var(--_keep) !important;
	border-color: var(--_keep) !important;
	color: var(--_on-keep) !important;
}
.fzsw button.fzsw__pick-add:hover { filter: brightness(.9); }
.fzsw button.is-busy { opacity: .7; cursor: progress; }
.fzsw a.fzsw__pick-choose {
	display: inline-flex;
	align-items: center;
	height: 42px;
	padding: 0 14px;
	border: 2px solid var(--_ink);
	border-radius: var(--_btn-radius);
	color: var(--_ink) !important;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.fzsw .fzsw__empty,
.fzsw .fzsw__note { margin: 0; padding: 36px 8px; text-align: center; font-size: 15px; line-height: 1.5; color: var(--_muted); }
.fzsw .fzsw__note { padding: 12px 8px; font-size: 13px; }

.fzsw__panel-foot { flex: 0 0 auto; display: flex; flex-direction: column; gap: 10px; padding: 14px 16px 16px; border-top: 1px solid var(--_line); background: var(--_soft); }
.fzsw .fzsw__total { display: flex; justify-content: space-between; align-items: baseline; margin: 0; font-size: 15px; color: var(--_muted); }
.fzsw .fzsw__total strong { font-size: 18px; color: var(--_ink); font-variant-numeric: tabular-nums; }
.fzsw button.fzsw__btn--block { width: 100%; min-height: 52px; font-size: 16px; }
.fzsw button.fzsw__btn--clear { width: 100%; min-height: 44px; background: var(--_surface) !important; border-color: var(--_line) !important; color: var(--_ink) !important; }
.fzsw button.fzsw__btn--clear:hover { background: var(--_soft) !important; }
.fzsw button.fzsw__btn--clear.is-armed { border-color: var(--_pass) !important; color: var(--_pass) !important; }

html.fzsw-locked, html.fzsw-locked body { overflow: hidden; }

/* --- Notice ------------------------------------------------------------- */
.fzsw__notice {
	position: fixed;
	z-index: 100002;
	left: 50%;
	bottom: calc(var(--et-bottombar-h, 0px) + env(safe-area-inset-bottom, 0px) + 16px);
	display: flex;
	align-items: center;
	gap: 12px;
	width: max-content;
	max-width: calc(100vw - 24px);
	padding: 10px 8px 10px 16px;
	border-radius: 12px;
	background: #1c1b19;
	color: #fff;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 12px);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.fzsw--preview .fzsw__notice { position: absolute; }
.fzsw__notice.is-shown { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition: opacity .2s ease, transform .2s ease; }
.fzsw .fzsw__notice-text { margin: 0; font-size: 14px; line-height: 1.35; color: #fff; }
.fzsw a.fzsw__notice-link { flex: 0 0 auto; font-size: 14px; font-weight: 700; color: #fff !important; text-decoration: underline; text-underline-offset: 3px; }
.fzsw button.fzsw__notice-close { width: 34px; height: 34px; padding: 0; border-radius: 50%; background: rgba(255, 255, 255, .14) !important; border-color: transparent !important; color: #fff !important; }

/* --- Small phones -------------------------------------------------------- */
@media (max-width: 380px) {
	.fzsw { --_body-h: 58px; }
	.fzsw button.fzsw__btn { font-size: 14px; padding: 0 12px; }
	.fzsw .fzsw__row button.fzsw__btn--pass,
	.fzsw .fzsw__row button.fzsw__btn--keep { min-height: 50px; font-size: 16px; }
	.fzsw__row { gap: 10px; }
	.fzsw .fzsw__cat { display: none; }
	.fzsw .fzsw__title { font-size: 16px; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
	.fzsw .fzsw__price { font-size: 17px; }
}
@media (max-width: 359px) {
	.fzsw__bar .fzsw__icon { display: none; }
	.fzsw__bar button.fzsw__btn { padding: 0 8px; gap: 6px; }
}
@media (max-height: 620px) {
	.fzsw__controls { padding-top: 12px; }
	.fzsw .fzsw__row button.fzsw__btn--pass,
	.fzsw .fzsw__row button.fzsw__btn--keep { min-height: 48px; }
	.fzsw .fzsw__row button.fzsw__btn--undo { width: 44px; height: 44px; min-height: 44px; }
	.fzsw button.fzsw__btn { min-height: 42px; }
	.fzsw__bar { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
	.fzsw__card, .fzsw__panel, .fzsw__notice, .fzsw__overlay { transition-duration: .01ms !important; }
}
@media print { .fzsw { display: none; } }
