/* MegaPets — Kalkulator terrarium */

/* ---------- karta i tokeny ---------- */
.mptcp{
	--mptcp-accent:var(--mp-color-gold,#c79a57);
	--mptcp-accent-dark:var(--mp-color-gold-dark,#b8833e);
	--mptcp-ink:var(--mp-color-dark,#2a221b);
	--mptcp-ink-soft:var(--mp-color-grey,#5b544d);
	--mptcp-line:var(--mp-color-border-subtle,rgba(199,154,87,.24));
	--mptcp-line-strong:var(--mp-color-border-interactive,rgba(184,131,62,.48));
	--mptcp-surface:var(--mp-color-surface,#fff);
	--mptcp-soft:var(--mp-color-background-soft,#f4ece2);
	--mptcp-cream:var(--mp-color-cream,#f7efe2);
	--mptcp-brand:var(--mp-global-color-background-brand,#efe5d7);
	--mptcp-radius:var(--mp-radius-large,12px);
	--mptcp-radius-control:var(--mp-radius,8px);
	--mptcp-radius-sm:var(--mp-radius-small,4px);
	--mptcp-lift:0px;
	position:relative;
	max-width:1320px;
	margin:0 auto;
	box-sizing:border-box;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius);
	background:var(--mptcp-surface);
	box-shadow:var(--mp-shadow,0 8px 24px rgba(0,0,0,.07),0 2px 6px rgba(0,0,0,.04));
	color:var(--mptcp-ink);
	font-family:var(--mp-font-body,"Manrope",Arial,sans-serif);
}
.mptcp *,
.mptcp *::before,
.mptcp *::after{box-sizing:border-box}
.mptcp img{display:block;max-width:100%;height:auto}
.mptcp p{margin:0}
.mptcp :is(button,input){font-family:inherit}
.mptcp button:focus-visible,
.mptcp .mptcp-grip:focus-visible{
	outline:2px solid var(--mp-color-action-primary,#b66d06);
	outline-offset:2px;
}

/* ---------- naglowek ---------- */
.mptcp-head{
	padding:20px 24px 18px;
	border-bottom:var(--mp-border-width,1px) solid var(--mptcp-line-strong);
	border-radius:var(--mptcp-radius) var(--mptcp-radius) 0 0;
	background:linear-gradient(135deg,var(--mptcp-cream),var(--mptcp-brand));
}
.mptcp-brand{
	color:var(--mp-color-action-primary-dark,#a56d24);
	font-size:10.5px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
	letter-spacing:.14em;
	text-transform:uppercase;
}
.mptcp-title{
	margin:7px 0 0;
	color:var(--mp-color-brown-chocolate,#6b5643);
	font-family:var(--mp-font-heading,"Cormorant Garamond",Georgia,"Times New Roman",serif);
	font-size:32px;
	font-weight:var(--mp-font-weight-medium,500);
	line-height:1.05;
}
.mptcp-guide-btn{
	appearance:none;
	position:relative;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	min-width:0;
	padding:8px 10px;
	overflow:hidden;
	border:1px solid color-mix(in srgb,var(--mptcp-accent) 52%,#fff);
	border-radius:var(--mptcp-radius-control);
	background:linear-gradient(110deg,#fffaf0 0%,#f4e4c6 38%,#fff7e7 52%,#ecd09d 72%,#fffaf0 100%);
	background-size:220% 100%;
	box-shadow:0 2px 7px rgba(84,57,32,.09),inset 0 1px 0 rgba(255,255,255,.72);
	color:var(--mp-color-brown-chocolate,#6b5643) !important;
	font-size:12px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
	cursor:pointer;
	transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,filter .18s ease,color .18s ease;
}
.mptcp-guide-btn[hidden]{display:none}
.mptcp-guide-btn > *{position:relative;z-index:1}
.mptcp-guide-btn::after{
	content:"";
	position:absolute;
	top:-45%;
	bottom:-45%;
	left:-32%;
	width:34%;
	background:linear-gradient(90deg,transparent,rgba(255,255,255,.68),transparent);
	transform:translateX(-190%) skewX(-18deg);
	pointer-events:none;
	animation:mptcp-guide-sheen 5.2s ease-in-out infinite;
}
.mptcp-guide-btn:hover{
	transform:translateY(-1px);
	border-color:color-mix(in srgb,var(--mptcp-accent-dark) 62%,#fff);
	box-shadow:0 5px 13px rgba(84,57,32,.14),inset 0 1px 0 rgba(255,255,255,.8);
	filter:saturate(1.04);
}
.mptcp .mptcp-cap-actions .mptcp-guide-btn:is(:hover,:focus,:focus-visible){
	color:var(--mp-color-brown-chocolate,#6b5643) !important;
}
.mptcp .mptcp-cap-actions .mptcp-guide-btn:is(:active,.is-playing){
	color:color-mix(in srgb,var(--mp-color-brown-chocolate,#6b5643) 84%,#2a221b) !important;
}
.mptcp-guide-btn:disabled{cursor:not-allowed;opacity:.62;transform:none}
.mptcp-guide-btn:disabled::after{animation:none}
.mptcp-guide-btn.is-completed::after{animation:none;opacity:0}
.mptcp-guide-btn.is-playing{
	border-color:color-mix(in srgb,var(--mptcp-accent-dark) 62%,#fff);
	background:linear-gradient(110deg,#f9edd8,#ecd09d 48%,#f8e8ca);
}
.mptcp-guide-speaker{
	display:grid;
	place-items:center;
	flex:0 0 auto;
	width:20px;
	height:20px;
	border-radius:50%;
	background:linear-gradient(145deg,var(--mptcp-accent),var(--mptcp-accent-dark));
	box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 2px 5px rgba(121,79,31,.18);
	color:#fff;
}
.mptcp-guide-speaker svg{width:13px;height:13px;overflow:visible}
.mptcp-guide-speaker path{
	fill:currentColor;
	stroke:currentColor;
	stroke-width:1.6;
	stroke-linecap:round;
	stroke-linejoin:round;
}
.mptcp-guide-speaker path + path{fill:none}
@keyframes mptcp-guide-sheen{
	0%{transform:translateX(-190%) skewX(-18deg);opacity:0}
	5%{opacity:.72}
	24%,100%{transform:translateX(470%) skewX(-18deg);opacity:0}
}

/* ---------- uklad i panel sterowania ---------- */
.mptcp-body{
	display:grid;
	grid-template-columns:336px minmax(0,1fr);
	align-items:stretch;
}
.mptcp-panel{
	position:sticky;
	top:var(--mp-site-header-sticky-offset-desktop,80px);
	z-index:4;
	align-self:start;
	height:fit-content;
	max-height:calc(100vh - var(--mp-site-header-sticky-offset-desktop,80px) - 12px);
	max-height:calc(100dvh - var(--mp-site-header-sticky-offset-desktop,80px) - 12px);
	overflow:visible;
}
.mptcp-panel-inner{
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	gap:12px;
	max-height:inherit;
	padding:18px 14px 18px 20px;
	overflow-x:hidden;
	overflow-y:auto;
	scrollbar-gutter:stable;
	direction:rtl;
	scrollbar-width:thin;
	scrollbar-color:var(--mp-scrollbar-thumb-color,rgb(199 154 87 / 42%)) var(--mp-scrollbar-track-color,transparent);
}
.mptcp-panel-inner > *{direction:ltr}
.mptcp-panel-inner::-webkit-scrollbar,
.mptcp-species::-webkit-scrollbar{
	width:var(--mp-scrollbar-size,7px);
	height:var(--mp-scrollbar-size,7px);
}
.mptcp-panel-inner::-webkit-scrollbar-track,
.mptcp-species::-webkit-scrollbar-track{background:var(--mp-scrollbar-track-color,transparent)}
.mptcp-panel-inner::-webkit-scrollbar-thumb,
.mptcp-species::-webkit-scrollbar-thumb{
	border:0;
	border-radius:var(--mp-radius-pill,999px);
	background:var(--mp-scrollbar-thumb-color,rgb(199 154 87 / 42%));
}
.mptcp-panel-inner > .mptcp-block{
	padding:14px 13px;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius-control);
	background:var(--mptcp-surface);
}
.mptcp-panel-inner > .mptcp-block.mptcp-block-gear{background:var(--mptcp-cream)}

.mptcp-panel-inner > .mptcp-block .mptcp-shell-row{margin:0 0 8px}
.mptcp-panel-inner > .mptcp-block .mptcp-label{margin-bottom:9px}
.mptcp-label-species{display:block;margin-top:0}
.mptcp-label .mptcp-sp-latin{
	display:block;
	margin-top:3px;
	color:var(--mp-color-brown-chocolate,#6b5643);
	font-family:var(--mp-font-accent,"Source Serif 4",Georgia,"Times New Roman",serif);
	font-size:12.5px;
	font-weight:var(--mp-font-weight-regular,400);
	font-style:italic;
	font-synthesis:none;
	font-variant-ligatures:common-ligatures;
	line-height:1.25;
	letter-spacing:.01em;
	text-transform:none;
	opacity:.9;
}
.mptcp-label .mptcp-sp-form{display:inline;font:inherit;letter-spacing:inherit;text-transform:none}
.mptcp-step-heading{
	display:inline-block;
	max-width:100%;
	color:var(--mp-color-action-primary-dark,#a56d24);
	font-size:10px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1.15;
	letter-spacing:.065em;
	text-transform:uppercase;
	white-space:nowrap;
	vertical-align:middle;
}
.mptcp-step-title{
	font:inherit;
	letter-spacing:inherit;
	white-space:nowrap;
}
.mptcp-label-hint{
	display:inline-block;
	margin-left:4px;
	color:var(--mptcp-ink-soft);
	font-family:var(--mp-font-accent,"Source Serif 4",Georgia,"Times New Roman",serif);
	font-size:9.35px;
	font-weight:var(--mp-font-weight-regular,400);
	font-style:italic;
	font-synthesis:none;
	line-height:1.1;
	letter-spacing:.01em;
	text-transform:none;
	white-space:nowrap;
	opacity:.86;
}

/* Pola rozmiaru muszli i grubosci podloza. */
.mptcp-stepper{
	display:grid;
	grid-template-columns:40px minmax(0,1fr) 40px;
	gap:6px;
	margin:0 0 18px;
}
.mptcp-block-gear .mptcp-stepper{margin:0}
.mptcp-step{
	width:40px;
	height:40px;
	padding:0;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius-sm);
	background:var(--mptcp-surface);
	color:var(--mp-color-action-primary-dark,#a56d24);
	font-size:19px;
	font-weight:var(--mp-font-weight-regular,400);
	line-height:1;
	cursor:pointer;
	-webkit-tap-highlight-color:transparent;
	transition:border-color var(--mp-duration-fast,.18s) ease,background var(--mp-duration-fast,.18s) ease,color var(--mp-duration-fast,.18s) ease,box-shadow var(--mp-duration-fast,.18s) ease;
}
.mptcp-step:active{
	background:var(--mp-action-quiet-background-active,var(--mptcp-brand));
	color:var(--mp-color-action-primary-active-dark,#8f581b);
}
.mptcp .mptcp-step:focus:not(:active){
	border-color:var(--mptcp-line);
	background:var(--mptcp-surface);
	box-shadow:none;
	color:var(--mp-color-action-primary-dark,#a56d24);
}
.mptcp-stepval{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:3px;
	min-width:0;
	height:40px;
	padding:0 10px;
	overflow:hidden;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius-control);
	background:var(--mptcp-surface);
	color:var(--mptcp-accent-dark);
	font-size:15px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
	transition:border-color var(--mp-duration-fast,.18s) ease,box-shadow var(--mp-duration-fast,.18s) ease;
}
.mptcp-stepval:focus-within{
	border-color:color-mix(in srgb,var(--mptcp-accent) 58%,rgba(107,86,67,.2));
	box-shadow:none;
}
.mptcp-shell-input,
.mptcp-stepval input{
	appearance:none;
	display:block;
	width:2.4em;
	min-width:0;
	height:30px;
	min-height:0;
	margin:0;
	padding:0;
	border:0;
	border-radius:0;
	outline:0;
	background:transparent;
	box-shadow:none;
	color:inherit;
	font:inherit;
	line-height:30px;
	text-align:center;
}
.mptcp .mptcp-shell-input,
.mptcp .mptcp-stepval input{
	width:2.4em !important;
	max-width:2.4em !important;
	height:30px !important;
	min-height:0 !important;
	padding:0 !important;
	border:0 !important;
	color:var(--mptcp-accent-dark) !important;
}
.mptcp :is(.mptcp-shell-input,.mptcp-stepval input,.mptcp-field-val),
.mptcp :is(.mptcp-shell-input,.mptcp-stepval input,.mptcp-field-val):focus,
.mptcp :is(.mptcp-shell-input,.mptcp-stepval input,.mptcp-field-val):focus-visible{
	outline:0 !important;
	border-color:transparent !important;
	box-shadow:none !important;
}
.mptcp .mptcp-unit{
	color:color-mix(in srgb,var(--mptcp-accent-dark) 88%,#6b4a20) !important;
	font-size:11.5px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
}

/* Gatunki. */
.mptcp-species{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	grid-auto-rows:56px;
	gap:6px;
	max-height:131px;
	margin:-10px -7px 0 -10px;
	padding:10px 4px 3px 10px;
	overflow-y:auto;
	scroll-behavior:smooth;
	scrollbar-width:thin;
	scrollbar-color:var(--mp-scrollbar-thumb-color,rgb(199 154 87 / 42%)) var(--mp-scrollbar-track-color,transparent);
}
.mptcp-sp{
	position:relative;
	display:grid;
	place-items:center;
	height:56px;
	padding:4px;
	overflow:hidden;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius-sm);
	background:var(--mp-action-quiet-background,var(--mptcp-soft));
	cursor:pointer;
	transition:border-color var(--mp-duration-fast,.18s) ease,background var(--mp-duration-fast,.18s) ease;
}
.mptcp-sp.is-on{z-index:2;overflow:visible;border-color:var(--mptcp-line-strong);background:var(--mptcp-surface)}
.mptcp-sp-clip{
	display:grid;
	place-items:center;
	width:100%;
	height:100%;
	overflow:hidden;
	border-radius:var(--mptcp-radius-sm);
}
.mptcp-sp img{
	width:auto;
	max-width:100%;
	max-height:45px;
	opacity:.58;
	transition:opacity var(--mp-duration-fast,.18s) ease;
}
.mptcp-sp.is-on img{opacity:1}
.mptcp-sp-no{display:none}
.mptcp-sp.is-on .mptcp-sp-no{
	position:absolute;
	top:-7px;
	left:-7px;
	display:grid;
	place-items:center;
	width:19px;
	height:19px;
	border:var(--mp-border-width,1px) solid var(--mptcp-line-strong);
	border-radius:var(--mp-radius-pill,999px);
	background:var(--mptcp-cream);
	color:var(--mp-color-brown-chocolate,#6b5643);
	font-size:10px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
}

/* Drugi slimak jest opcjonalna kontynuacja pierwszego bloku. */
.mptcp-panel-inner > [data-mptcp="species2-block"]{
	margin-top:-12px;
	padding-top:9px;
	border-top:0;
	border-top-left-radius:0;
	border-top-right-radius:0;
}
.mptcp-panel-inner > .mptcp-block-snail{
	border-bottom:0;
	border-bottom-right-radius:0;
	border-bottom-left-radius:0;
}
.mptcp [data-mptcp="species2-block"].is-off{padding-bottom:10px}
.mptcp [data-mptcp="species2-block"].is-off .mptcp-sp-latin,
.mptcp [data-mptcp="species2-block"].is-off .mptcp-species{display:none}
.mptcp [data-mptcp="species2-block"]:not(.is-off) .mptcp-species{animation:mptcp-reveal .24s ease both}
.mptcp-sp2-head{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:10px;
	margin-bottom:0;
}
.mptcp-sp2-head .mptcp-label{flex:1;min-width:0;margin:0}
.mptcp-sp2-head .mptcp-check{margin-top:-2px}
.mptcp-sp2-head .mptcp-check::before{content:"";position:absolute;inset:-4px}
@keyframes mptcp-reveal{
	from{opacity:0;transform:translateY(-6px)}
	to{opacity:1;transform:none}
}

/* Wyposazenie i przelaczniki. */
.mptcp-block-gear .mptcp-legend{margin:0 0 9px}
.mptcp-block-gear .mptcp-acc-label{margin:18px 0 9px}
.mptcp-acc{display:flex;flex-direction:column;gap:6px}
.mptcp-acc-item{
	display:flex;
	align-items:center;
	gap:8px;
	width:100%;
	height:40px;
	min-height:40px;
	padding:0 10px;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius-control);
	background:var(--mptcp-surface);
	text-align:left;
	cursor:pointer;
	transition:border-color var(--mp-duration-fast,.18s) ease,background var(--mp-duration-fast,.18s) ease;
}
.mptcp-acc-copy{flex:1;min-width:0;text-align:left}
.mptcp-acc-item img{flex:0 0 auto;width:26px;height:26px;object-fit:contain;opacity:.42}
.mptcp-acc-item.is-on img{opacity:1}
.mptcp-acc-name{
	display:block;
	color:var(--mp-color-brown-chocolate,#6b5643);
	font-size:12px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1.25;
	opacity:.58;
	transition:opacity .15s ease;
}
.mptcp-acc-item.is-on{border-color:var(--mptcp-line-strong)}
.mptcp-acc-item.is-on .mptcp-acc-name{opacity:.92}
.mptcp-check{
	position:relative;
	flex:0 0 auto;
	width:31px;
	height:18px;
	padding:0;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mp-radius-pill,999px);
	background:var(--mptcp-soft);
	cursor:pointer;
	transition:border-color var(--mp-duration-fast,.18s) ease,background var(--mp-duration-fast,.18s) ease;
}
.mptcp-check::after{
	content:"";
	position:absolute;
	top:2px;
	left:2px;
	width:12px;
	height:12px;
	border-radius:50%;
	background:color-mix(in srgb,var(--mp-color-gold,#c79a57) 58%,var(--mptcp-surface));
	transition:transform var(--mp-duration-fast,.18s) var(--mp-ease,cubic-bezier(.22,1,.36,1)),background var(--mp-duration-fast,.18s) ease;
}
.mptcp-check.is-on{border-color:var(--mptcp-line-strong);background:var(--mptcp-brand)}
.mptcp-check.is-on::after{transform:translateX(13px);background:var(--mptcp-accent-dark)}
.mptcp-check-acc{pointer-events:none}

/* ---------- wskaznik wyniku ---------- */
.mptcp-cap-slot{
	position:absolute;
	top:18px;
	left:calc(100% + 18px);
	z-index:5;
	height:0;
	margin:0;
}
.mptcp-cap{width:296px;margin:0;padding:0;border:0;background:none}
.mptcp-cap-row{
	display:flex;
	flex-direction:column;
	align-items:stretch;
	gap:7px;
}
.mptcp-cap-actions{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:7px;
	width:100%;
}
.mptcp-cap-actions .mptcp-guide-btn,
.mptcp-cap-actions .mptcp-cta,
.mptcp-cap .mptcp-pill{
	width:100%;
	min-width:0;
	min-height:38px;
	padding:8px 12px;
	border:var(--mp-border-width,1px) solid var(--mptcp-line);
	border-radius:var(--mptcp-radius-control);
	font-size:12px;
	font-weight:var(--mp-font-weight-semibold,600);
}
.mptcp-cap-actions .mptcp-guide-btn{border-color:color-mix(in srgb,var(--mptcp-accent) 52%,#fff)}
.mptcp-cap-actions .mptcp-guide-btn[hidden] + .mptcp-cta{grid-column:1 / -1}
.mptcp-cap-actions .mptcp-guide-btn [data-mptcp="guide-label"]{
	min-width:0;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.mptcp-pill{
	display:flex;
	align-items:center;
	gap:10px;
	border-radius:999px;
}
.mptcp-cap .mptcp-pill{
	position:relative;
	justify-content:center;
	flex:0 0 auto;
	margin:0;
	border-color:color-mix(in srgb,var(--mptcp-pill-dot,var(--mptcp-line-strong)) 42%,var(--mptcp-surface));
	background:color-mix(in srgb,var(--mptcp-pill-bg,var(--mptcp-surface)) 72%,transparent);
	box-shadow:var(--mp-mini-control-secondary-shadow,0 1px 2px rgba(0,0,0,.05));
}
.mptcp-dot{flex:none;width:9px;height:9px;border-radius:50%}
.mptcp-cap .mptcp-dot{position:absolute;top:50%;left:12px;margin-top:-4.5px}
.mptcp-pill-label{
	min-width:0;
	color:inherit;
	font-size:12px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
	white-space:nowrap;
}
.mptcp-pill-vol{
	position:absolute;
	top:50%;
	right:12px;
	transform:translateY(-50%);
	color:inherit;
	font-size:11.5px;
	font-weight:var(--mp-font-weight-bold,700);
	line-height:1;
	opacity:.9;
}
.mptcp-cta{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	flex:none;
	overflow:hidden;
	border-color:color-mix(in srgb,#6f9c3c 52%,#fff);
	background:linear-gradient(135deg,#f2f8e9 0%,#e3efcf 48%,#d4e7b7 100%);
	box-shadow:0 2px 7px rgba(63,83,32,.1),inset 0 1px 0 rgba(255,255,255,.72);
	color:#3f5320 !important;
	line-height:1;
	white-space:nowrap;
	text-overflow:ellipsis;
	cursor:pointer;
	-webkit-tap-highlight-color:transparent;
	transition:background var(--mp-duration-fast,.18s) ease,transform var(--mp-duration-fast,.18s) ease,border-color var(--mp-duration-fast,.18s) ease,box-shadow var(--mp-duration-fast,.18s) ease,color var(--mp-duration-fast,.18s) ease;
}
.mptcp .mptcp-cap-actions .mptcp-cta:is(:hover,:focus,:focus-visible){color:#3f5320 !important}
.mptcp-cta:hover{
	transform:translateY(-1px);
	border-color:#6f9c3c;
	background:linear-gradient(135deg,#eaf5dc 0%,#d9ebbd 52%,#c9e0a5 100%);
	box-shadow:0 5px 13px rgba(63,83,32,.15),inset 0 1px 0 rgba(255,255,255,.76);
}
.mptcp-cta:active{
	transform:translateY(0);
	background:linear-gradient(135deg,#dcecc3,#cbe2a8);
	box-shadow:inset 0 1px 3px rgba(63,83,32,.12);
	color:color-mix(in srgb,#3f5320 86%,#24300f) !important;
}
.mptcp .mptcp-cap-actions .mptcp-cta:active{
	color:color-mix(in srgb,#3f5320 86%,#24300f) !important;
}

/* ---------- scena ---------- */
.mptcp-stage-col{
	position:relative;
	z-index:1;
	display:flex;
	flex-direction:column;
	margin-top:var(--mptcp-lift);
	padding:0 28px 12px 0;
	border-radius:0 0 var(--mptcp-radius) 0;
	background:none;
	transition:margin-top .8s cubic-bezier(.22,.61,.36,1);
}
.mptcp-stage{
	position:relative;
	touch-action:pan-y;
	user-select:none;
}
.mptcp-stage svg{display:block;width:100%;height:auto}
.mptcp-stage .mptcp-front{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.mptcp-layer{position:absolute;inset:0;pointer-events:none}
.mptcp-prop{position:absolute;pointer-events:none}
.mptcp-field{
	position:absolute;
	transform:translate(-50%,8px);
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:3px;
	min-width:68px;
	padding:7px 7px 5px;
	border:1px solid color-mix(in srgb,var(--mptcp-accent) 30%,rgba(40,48,32,.14));
	border-radius:var(--mptcp-radius-control);
	background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(247,239,226,.89));
	box-shadow:0 3px 9px rgba(65,49,31,.1),inset 0 1px 0 rgba(255,255,255,.88);
	white-space:nowrap;
	pointer-events:none;
	transition:border-color var(--mp-duration-fast,.18s) ease,box-shadow var(--mp-duration-fast,.18s) ease,background var(--mp-duration-fast,.18s) ease;
}
.mptcp-stage > .mptcp-field{
	width:68px !important;
	max-width:68px !important;
}
.mptcp-field:focus-within{
	border-color:color-mix(in srgb,var(--mptcp-accent) 58%,rgba(107,86,67,.2));
	background:linear-gradient(145deg,#fff,var(--mptcp-cream));
	box-shadow:0 3px 9px rgba(65,49,31,.1),inset 0 1px 0 #fff;
}
.mptcp-field-label{
	color:var(--mp-color-brown-chocolate,#6b5643);
	font-size:8.25px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1.12;
	letter-spacing:.075em;
	text-transform:uppercase;
	white-space:nowrap;
	opacity:.82;
}
.mptcp-field-val{
	width:50px;
	max-width:50px;
	padding:0;
	border:0;
	border-bottom:1px solid transparent;
	background:none;
	color:var(--mptcp-accent-dark);
	font-size:12.25px;
	font-weight:var(--mp-font-weight-bold,700);
	line-height:1.22;
	letter-spacing:.01em;
	font-variant-numeric:tabular-nums;
	text-align:center;
	cursor:text;
	pointer-events:auto;
}
.mptcp .mptcp-field-val{
	height:auto !important;
	min-height:0 !important;
	padding:0 !important;
	border:0 !important;
	color:var(--mptcp-accent-dark) !important;
}
.mptcp-stage > .mptcp-field > .mptcp-field-val{
	width:50px !important;
	max-width:50px !important;
	padding:0 !important;
	border:0 !important;
}
.mptcp-grip{
	position:absolute;
	display:grid;
	place-items:center;
	width:31px;
	height:31px;
	border-radius:50%;
	box-shadow:0 1px 4px rgba(40,48,32,.22);
	cursor:grab;
	touch-action:none;
}
.mptcp-grip:active{cursor:grabbing}
.mptcp-grip svg{width:17px;height:17px;pointer-events:none}
.mptcp-m-fields{display:none}

/* Finał instrukcji prowadzi złotym kursorem przez wartości, bez ponownego obrysu bryły. */
.mptcp.is-guide-values .mptcp-field.is-guide-value{
	border-color:color-mix(in srgb,var(--mptcp-accent) 46%,rgba(40,48,32,.14));
	box-shadow:0 4px 12px rgba(199,154,87,.14),inset 0 1px 0 rgba(255,255,255,.9);
	transition:border-color .58s ease,box-shadow .58s ease,background .58s ease;
}
.mptcp.is-guide-values .mptcp-field.is-guide-value .mptcp-field-val{
	transition:text-shadow .58s ease;
}
.mptcp.is-guide-values .mptcp-field.is-guide-value::after{
	content:"";
	position:absolute;
	right:7px;
	bottom:3px;
	left:7px;
	height:3px;
	border-radius:3px;
	background:linear-gradient(90deg,transparent 0,var(--mptcp-accent) 22%,#fff0c6 48%,var(--mptcp-accent-dark) 74%,transparent 100%);
	background-size:240% 100%;
	opacity:.2;
	transform:scaleX(.55);
	transform-origin:center;
	transition:opacity .58s ease,transform .58s ease;
	pointer-events:none;
}
.mptcp.is-guide-values .mptcp-field.is-guide-value.is-guide-seen::after{
	opacity:.42;
	transform:scaleX(.78);
}
.mptcp.is-guide-values .mptcp-field.is-guide-value.is-guide-current{
	animation:mptcp-guide-field-warmth 1.8s ease-in-out infinite;
}
.mptcp.is-guide-values .mptcp-field.is-guide-value.is-guide-current::after{
	animation:mptcp-guide-value-sweep 1.8s ease-in-out infinite;
}
.mptcp.is-guide-values .mptcp-field.is-guide-value.is-guide-current .mptcp-field-val{
	animation:mptcp-guide-value-warmth 1.8s ease-in-out infinite;
}
.mptcp.is-guide-paused .mptcp-field.is-guide-value::after,
.mptcp.is-guide-paused .mptcp-field.is-guide-value,
.mptcp.is-guide-paused .mptcp-field.is-guide-value .mptcp-field-val{animation-play-state:paused}
.mptcp.is-guide-values .mptcp-m-fields .mptcp-field.is-guide-value{position:relative}
.mptcp.is-guide-ending .mptcp-field.is-guide-value{
	animation:none;
	border-color:color-mix(in srgb,var(--mptcp-accent) 30%,rgba(40,48,32,.14));
	box-shadow:0 3px 9px rgba(65,49,31,.1),inset 0 1px 0 rgba(255,255,255,.88);
}
.mptcp.is-guide-ending .mptcp-field.is-guide-value::after{
	animation:none;
	opacity:0;
	transform:scaleX(.72);
}
.mptcp.is-guide-ending .mptcp-field.is-guide-value .mptcp-field-val{
	animation:none;
	text-shadow:none;
}
@keyframes mptcp-guide-value-sweep{
	0%,100%{background-position:110% 0;opacity:.38;transform:scaleX(.62)}
	42%{opacity:1}
	72%{background-position:-110% 0;opacity:.88;transform:scaleX(1)}
}
@keyframes mptcp-guide-value-warmth{
	0%,100%{text-shadow:none}
	48%{text-shadow:0 0 10px rgba(199,154,87,.64),0 1px 0 rgba(255,255,255,.88)}
}
@keyframes mptcp-guide-field-warmth{
	0%,100%{box-shadow:0 4px 12px rgba(199,154,87,.14),inset 0 1px 0 rgba(255,255,255,.9)}
	48%{box-shadow:0 7px 19px rgba(199,154,87,.32),inset 0 1px 0 rgba(255,255,255,.96)}
}

/* ---------- informacja pod kalkulatorem ---------- */
.mptcp-note{
	margin:14px 0 0;
	padding:16px 28px 18px;
	border-top:1px solid var(--mp-standard-separator-line-color,rgba(199,154,87,.16));
	border-radius:0 0 var(--mptcp-radius) var(--mptcp-radius);
	background:color-mix(in srgb,var(--mptcp-surface) 78%,var(--mptcp-cream));
}
.mptcp-note-sum{
	display:inline-flex;
	align-items:center;
	gap:8px;
	color:var(--mp-color-action-primary-dark,#a56d24);
	font-size:11px;
	font-weight:var(--mp-font-weight-semibold,600);
	line-height:1;
	letter-spacing:.14em;
	text-transform:uppercase;
	list-style:none;
	cursor:pointer;
}
.mptcp-note-sum::-webkit-details-marker{display:none}
.mptcp-note-sum::before{
	content:"";
	width:6px;
	height:6px;
	margin-bottom:2px;
	border-right:1.4px solid currentColor;
	border-bottom:1.4px solid currentColor;
	transform:rotate(45deg);
	transition:transform .18s ease;
}
.mptcp-note[open] .mptcp-note-sum::before{margin-bottom:-2px;transform:rotate(-135deg)}
.mptcp-note-body{max-width:none;margin-top:18px}
.mptcp-note-body p,
.mptcp-note-vent-txt p{
	color:var(--mptcp-ink-soft);
	font-size:13px;
	line-height:1.55;
}
.mptcp-note-body p{margin:0 0 9px}
.mptcp-note-body p:last-child,
.mptcp-note-vent-txt p:last-child{margin-bottom:0}
.mptcp-note-vent{
	display:grid;
	grid-template-columns:minmax(180px,300px) minmax(0,1fr);
	align-items:start;
	gap:22px;
	margin-top:18px;
	padding-top:16px;
	border-top:1px solid var(--mptcp-line);
}
.mptcp-note-vent-txt{order:2}
.mptcp-note-vent-txt p{position:relative;margin:0 0 10px;padding-left:19px}
.mptcp-note-vent-txt p::before{
	content:"";
	position:absolute;
	top:7px;
	left:2px;
	width:7px;
	height:7px;
	border:1.5px solid var(--mp-color-action-primary-dark,#7a6229);
	border-radius:50%;
	opacity:.7;
}
.mptcp-note-fig{order:1;margin:0}
.mptcp-note-fig img{display:block;width:100%;height:auto;border-radius:var(--mptcp-radius-control)}
.mptcp-note-fig-ph{
	display:none;
	padding:26px 14px;
	border:1px dashed var(--mptcp-line);
	border-radius:var(--mptcp-radius-control);
	background:var(--mptcp-cream);
	color:var(--mp-color-action-primary-dark,#7a6229);
	font-size:11px;
	font-weight:600;
	line-height:1.4;
	letter-spacing:.08em;
	text-align:center;
	text-transform:uppercase;
	opacity:.6;
}

/* ---------- jedna zlota warstwa instrukcji ---------- */
.mptcp-guide-overlay{
	position:absolute;
	inset:0;
	z-index:30;
	pointer-events:none;
	visibility:hidden;
	opacity:0;
	transition:opacity .48s ease,visibility 0s linear .48s;
}
.mptcp-guide-overlay.is-visible{
	visibility:visible;
	opacity:1;
	transition-delay:0s;
}
.mptcp-guide-overlay.is-visible.is-ending{
	visibility:visible;
	opacity:0;
	transition:opacity .58s ease,visibility 0s linear .58s;
}
.mptcp-guide-svg{
	position:absolute;
	inset:0;
	display:block;
	width:100%;
	height:100%;
	overflow:visible;
}
.mptcp-guide-path{
	fill:none;
	stroke-width:2.5;
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-dasharray:1;
	stroke-dashoffset:0;
	vector-effect:non-scaling-stroke;
	filter:drop-shadow(0 1px 4px rgba(151,100,34,.32));
}
.mptcp-guide-path.is-drawing{animation:mptcp-guide-draw 1.05s cubic-bezier(.22,.61,.36,1) .42s both}
@keyframes mptcp-guide-draw{
	from{stroke-dashoffset:1;opacity:.42}
	to{stroke-dashoffset:0;opacity:1}
}
.mptcp-guide-pointer{
	position:absolute;
	left:0;
	top:0;
	transform:translate(-50%,-50%);
	display:block;
	width:21px;
	height:21px;
	border:1px solid rgba(122,79,27,.72);
	border-radius:50%;
	background:radial-gradient(circle at 34% 29%,#fff9e9 0 11%,#e5bf79 17%,#c89548 58%,#976323 100%);
	box-shadow:0 2px 7px rgba(91,55,17,.26),0 0 12px rgba(199,154,87,.22);
	opacity:.97;
	transition:left .42s cubic-bezier(.22,.61,.36,1),top .42s cubic-bezier(.22,.61,.36,1),opacity .2s ease;
}
.mptcp-guide-pointer-glint{
	position:absolute;
	top:3px;
	left:4px;
	width:5px;
	height:5px;
	border-radius:50%;
	background:rgba(255,255,255,.9);
	box-shadow:0 0 5px rgba(255,248,220,.86);
	opacity:.74;
}
.mptcp-guide-overlay.is-visible .mptcp-guide-pointer{will-change:left,top}
.mptcp-guide-overlay.is-visible:not(.is-paused) .mptcp-guide-pointer{animation:mptcp-guide-breathe 1.9s ease-in-out infinite}
.mptcp-guide-overlay.is-visible:not(.is-paused) .mptcp-guide-pointer-glint{animation:mptcp-guide-glint 1.9s ease-in-out infinite}
.mptcp-guide-overlay.is-tracing .mptcp-guide-pointer{animation:none;transition:none}
@keyframes mptcp-guide-breathe{
	0%,100%{filter:brightness(1);box-shadow:0 2px 7px rgba(91,55,17,.26),0 0 10px rgba(199,154,87,.18)}
	50%{filter:brightness(1.09);box-shadow:0 2px 8px rgba(91,55,17,.3),0 0 17px rgba(199,154,87,.4)}
}
@keyframes mptcp-guide-glint{
	0%,100%{opacity:.48}
	45%,60%{opacity:1}
}

/* ---------- stany wskaznika myszy ---------- */
@media (hover:hover) and (pointer:fine){
	.mptcp .mptcp-step:hover:not(:active){
		border-color:var(--mptcp-line-strong);
		background:var(--mp-action-quiet-background-hover,var(--mptcp-cream));
		color:var(--mp-color-action-primary-hover-dark,#985f20);
	}
	.mptcp-sp:not(.is-on):hover{
		border-color:var(--mptcp-line-strong);
		background:var(--mp-action-quiet-background-hover,var(--mptcp-cream));
	}
	.mptcp-sp:not(.is-on):hover img{opacity:.82}
	.mptcp-acc-item:hover{
		border-color:var(--mptcp-line-strong);
		background:var(--mp-action-quiet-background-hover,var(--mptcp-cream));
	}
}

/* ---------- waski uklad ---------- */
.mptcp.is-narrow{--mptcp-lift:0px}
.mptcp.is-narrow .mptcp-head{padding:17px 18px 15px}
.mptcp.is-narrow .mptcp-title{font-size:26px;line-height:1.05}
.mptcp.is-narrow .mptcp-body{display:flex;flex-direction:column}
.mptcp.is-narrow .mptcp-stage-col{
	order:0;
	padding:0 14px 8px;
	transition:none;
}
.mptcp.is-narrow .mptcp-panel{
	position:static;
	order:1;
	max-height:none;
}
.mptcp.is-narrow .mptcp-panel-inner{
	gap:10px;
	max-height:none;
	padding:14px 14px 4px;
	overflow:visible;
	scrollbar-gutter:auto;
	direction:ltr;
}
.mptcp.is-narrow .mptcp-panel-inner > .mptcp-block{padding:13px}
.mptcp.is-narrow .mptcp-panel-inner > [data-mptcp="species2-block"]{margin-top:-10px}
.mptcp.is-narrow .mptcp-cap-slot{
	position:static;
	order:0;
	left:auto;
	top:auto;
	height:auto;
	margin:0 0 8px;
}
.mptcp.is-narrow .mptcp-cap{width:auto}
.mptcp.is-narrow .mptcp-cap .mptcp-pill,
.mptcp.is-narrow .mptcp-cap-actions .mptcp-guide-btn,
.mptcp.is-narrow .mptcp-cap-actions .mptcp-cta{min-height:44px;padding:9px 10px}
.mptcp.is-narrow .mptcp-pill-label{overflow:hidden;text-overflow:ellipsis}
.mptcp.is-narrow .mptcp-stepper{grid-template-columns:44px minmax(0,1fr) 44px}
.mptcp.is-narrow .mptcp-step{width:44px;height:44px}
.mptcp.is-narrow .mptcp-stepval{height:44px}
.mptcp.is-narrow .mptcp-acc-item{height:44px;min-height:44px}
.mptcp.is-narrow .mptcp-sp2-head .mptcp-check::before{inset:-13px -7px}
.mptcp.is-narrow .mptcp-grip{width:28px;height:28px}
.mptcp.is-narrow .mptcp-grip svg{width:16px;height:16px}
.mptcp.is-narrow .mptcp-grip::before{
	content:"";
	position:absolute;
	inset:-9px;
	border-radius:50%;
}
.mptcp.is-narrow .mptcp-m-fields{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,96px));
	justify-content:center;
	gap:8px;
	padding:12px 0 2px;
}
.mptcp.is-narrow .mptcp-m-fields .mptcp-field{
	position:static;
	transform:none;
	align-items:flex-start;
	width:100% !important;
	max-width:100% !important;
	min-width:0;
	min-height:46px;
	padding:8px 9px 7px;
	pointer-events:auto;
}
.mptcp.is-narrow .mptcp-field-label{font-size:8.5px;letter-spacing:.065em}
.mptcp.is-narrow .mptcp-field-val{
	width:100% !important;
	max-width:100% !important;
	font-size:14px;
	line-height:1.18;
	text-align:left;
}
.mptcp.is-narrow .mptcp-note{padding:14px 18px 16px}
.mptcp.is-narrow .mptcp-note-vent{grid-template-columns:1fr;gap:14px}

/* Telefon: spokojna typografia i dwurzędowe listy gatunków przewijane poziomo. */
.mptcp.is-phone{
	border-right:0;
	border-left:0;
	border-radius:0;
}
.mptcp.is-phone .mptcp-head{padding:16px 14px 14px}
.mptcp.is-phone .mptcp-title{font-size:24px}
.mptcp.is-phone .mptcp-stage-col{padding-right:10px;padding-left:10px}
.mptcp.is-phone .mptcp-panel-inner{
	gap:9px;
	padding:12px 12px 5px;
	background:linear-gradient(180deg,color-mix(in srgb,var(--mptcp-cream) 42%,transparent),transparent 72%);
}
.mptcp.is-phone .mptcp-panel-inner > .mptcp-block{
	padding:12px;
	border-color:color-mix(in srgb,var(--mptcp-accent) 24%,rgba(107,86,67,.12));
	border-radius:10px;
	background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(250,246,239,.94));
}
.mptcp.is-phone .mptcp-panel-inner > .mptcp-block.mptcp-block-snail{
	border-bottom-right-radius:0;
	border-bottom-left-radius:0;
}
.mptcp.is-phone .mptcp-panel-inner > [data-mptcp="species2-block"]{
	margin-top:-9px;
	border-top-left-radius:0;
	border-top-right-radius:0;
}
.mptcp.is-phone .mptcp-panel-inner > .mptcp-block.mptcp-block-gear{
	background:linear-gradient(145deg,#fffaf2,var(--mptcp-cream));
}
.mptcp.is-phone .mptcp-species{
	grid-template-columns:none;
	grid-template-rows:repeat(2,56px);
	grid-auto-flow:column;
	grid-auto-columns:calc((100% - 12px)/3);
	grid-auto-rows:auto;
	height:131px;
	max-height:none;
	overflow-x:auto;
	overflow-y:hidden;
	overscroll-behavior-inline:contain;
	scroll-padding-inline:10px;
	scroll-snap-type:x proximity;
	-webkit-overflow-scrolling:touch;
}
.mptcp.is-phone .mptcp-sp{scroll-snap-align:start}
.mptcp.is-phone .mptcp-note-sum{min-height:44px}

.mptcp.is-phone-small .mptcp-cap-actions{gap:6px}
.mptcp.is-phone-small .mptcp-cap-actions .mptcp-guide-btn,
.mptcp.is-phone-small .mptcp-cap-actions .mptcp-cta{
	padding-right:7px;
	padding-left:7px;
	font-size:11px;
}
.mptcp.is-phone-small .mptcp-guide-speaker{width:18px;height:18px}
.mptcp.is-phone-small .mptcp-panel-inner{padding-right:10px;padding-left:10px}
.mptcp.is-phone-small .mptcp-m-fields{gap:5px}
.mptcp.is-phone-small .mptcp-m-fields .mptcp-field{padding:7px 6px 6px}
.mptcp.is-phone-small .mptcp-field-label{font-size:8px;letter-spacing:.045em}
.mptcp.is-phone-small .mptcp-field-val{font-size:13.5px}
.mptcp.is-phone-small .mptcp-step-heading{font-size:9.5px;letter-spacing:.045em}
.mptcp.is-phone-small .mptcp-label-hint{margin-left:3px;font-size:8.65px}

/* Musi zostac na koncu: preferencja systemowa wylacza kazdy ruch interfejsu. */
@media (prefers-reduced-motion:reduce){
	.mptcp *,
	.mptcp *::before,
	.mptcp *::after{
		scroll-behavior:auto !important;
		animation:none !important;
		transition:none !important;
	}
	.mptcp-guide-path.is-drawing{stroke-dashoffset:0 !important;opacity:1 !important}
}