.mcpr3d-open,
.mcpr3d-inline,
.mcpr3d-inline *{
	box-sizing:border-box;
}

.mcpr3d-open{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	min-height:48px;
	padding:0 20px;
	color:#217faa;
	background:#fff;
	border:1px solid #8ec9e5;
	border-radius:9px;
	box-shadow:0 7px 16px rgba(58,160,216,.12);
	font:inherit;
	font-size:15px;
	font-weight:800;
	cursor:pointer;
	transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.mcpr3d-open:hover,
.mcpr3d-open:focus-visible,
.mcpr3d-open.is-active{
	color:#fff;
	background:#3AA0D8;
	border-color:#3AA0D8;
	box-shadow:0 9px 20px rgba(58,160,216,.24);
	outline:0;
	transform:translateY(-1px);
}
.mcpr3d-open svg{
	width:19px;
	height:19px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.8;
	stroke-linecap:round;
	stroke-linejoin:round;
}
.mcpr-product-card__actions{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:10px;
}

.mcpr-product-card__main-image{
	position:relative;
}
.mcpr-product-card__main-image.mcpr3d-active>img{
	visibility:hidden;
}
.mcpr3d-inline{
	position:absolute;
	inset:0;
	z-index:1;
	display:none;
	overflow:hidden;
	background:
		radial-gradient(circle at 50% 82%,rgba(202,216,223,.72) 0,rgba(227,234,237,.30) 32%,transparent 60%),
		linear-gradient(180deg,#fff 0%,#edf3f5 100%);
	border-radius:inherit;
	isolation:isolate;
}
.mcpr3d-active>.mcpr3d-inline{
	display:block;
}
.mcpr3d-inline:fullscreen,
.mcpr3d-inline:-webkit-full-screen{
	position:fixed;
	inset:0;
	display:block;
	width:100vw;
	height:100vh;
	border-radius:0;
	background:
		radial-gradient(circle at 50% 82%,rgba(202,216,223,.72) 0,rgba(227,234,237,.30) 32%,transparent 60%),
		linear-gradient(180deg,#fbfdfe 0%,#e9f0f3 100%);
}

.mcpr3d-canvas{
	display:block;
	width:100%;
	height:100%;
	cursor:grab;
	touch-action:none;
	outline:0;
	user-select:none;
}
.mcpr3d-canvas:active{cursor:grabbing}
.mcpr3d-canvas:focus-visible{box-shadow:inset 0 0 0 3px rgba(58,160,216,.38)}

.mcpr3d-tools{
	position:absolute;
	top:12px;
	right:12px;
	z-index:3;
	display:flex;
	gap:7px;
	pointer-events:none;
}
.mcpr3d-tool{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:39px;
	height:39px;
	padding:0;
	color:#26343c;
	background:rgba(255,255,255,.94);
	border:1px solid rgba(91,113,125,.22);
	border-radius:10px;
	box-shadow:0 5px 15px rgba(25,43,54,.09);
	cursor:pointer;
	pointer-events:auto;
	transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease;
}
.mcpr3d-tool:hover,
.mcpr3d-tool:focus-visible{
	color:#3AA0D8;
	border-color:rgba(58,160,216,.52);
	outline:0;
	transform:translateY(-1px);
}
.mcpr3d-tool.is-active{
	color:#fff;
	background:#3AA0D8;
	border-color:#3AA0D8;
}
.mcpr3d-tool svg{
	display:block;
	width:19px;
	height:19px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.8;
	stroke-linecap:round;
	stroke-linejoin:round;
}

.mcpr3d-segmented{
	position:absolute;
	left:50%;
	bottom:12px;
	z-index:3;
	display:inline-flex;
	padding:4px;
	background:rgba(233,240,243,.95);
	border:1px solid rgba(103,126,138,.14);
	border-radius:10px;
	box-shadow:0 5px 16px rgba(25,43,54,.10);
	transform:translateX(-50%);
}
.mcpr3d-mode{
	min-height:36px;
	padding:0 14px;
	color:#53616c;
	background:transparent;
	border:0;
	border-radius:7px;
	font:inherit;
	font-size:12px;
	font-weight:800;
	white-space:nowrap;
	cursor:pointer;
}
.mcpr3d-mode[aria-pressed="true"]{
	color:#fff;
	background:#3AA0D8;
	box-shadow:0 4px 11px rgba(58,160,216,.24);
}
.mcpr3d-mode:focus-visible{outline:2px solid #217faa;outline-offset:2px}

.mcpr3d-hint{
	position:absolute;
	left:12px;
	bottom:68px;
	z-index:2;
	max-width:calc(100% - 24px);
	padding:6px 9px;
	color:#66757e;
	background:rgba(255,255,255,.86);
	border-radius:999px;
	box-shadow:0 4px 13px rgba(25,43,54,.07);
	font-size:10px;
	font-weight:750;
	line-height:1.3;
	pointer-events:none;
	transition:opacity .25s ease;
}
.mcpr3d-inline.has-interacted .mcpr3d-hint{opacity:0}
.mcpr3d-touch-hint{display:none}

.mcpr3d-error{
	position:absolute;
	inset:0;
	z-index:4;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:28px;
	color:#725151;
	background:#f8fbfc;
	font-weight:700;
	text-align:center;
}
.mcpr3d-error[hidden]{display:none}

@media(hover:none),(pointer:coarse){
	.mcpr3d-desktop-hint{display:none}
	.mcpr3d-touch-hint{display:inline}
}
@media(max-width:700px){
	.mcpr3d-tools{top:9px;right:9px;gap:5px}
	.mcpr3d-tool{width:36px;height:36px}
	.mcpr3d-segmented{bottom:9px;max-width:calc(100% - 18px)}
	.mcpr3d-mode{min-width:0;padding:0 10px;font-size:11px}
	.mcpr3d-hint{display:none}
}
@media(prefers-reduced-motion:reduce){
	.mcpr3d-open,.mcpr3d-tool,.mcpr3d-hint{transition:none}
}
