.mc3d-viewer{
	--mc3d-blue:#3AA0D8;
	--mc3d-ink:#26343c;
	position:relative;
	width:100%;
	height:410px;
	min-height:320px;
	overflow:hidden;
	border-radius:13px;
	background:
		radial-gradient(circle at 50% 83%,rgba(205,216,222,.70) 0,rgba(222,230,234,.26) 30%,transparent 57%),
		linear-gradient(180deg,#fbfdfe 0%,#eef3f5 100%);
	isolation:isolate;
}
.mc3d-canvas{
	display:block;
	width:100%;
	height:100%;
	cursor:grab;
	touch-action:none;
	outline:0;
	user-select:none;
}
.mc3d-canvas:active{cursor:grabbing}
.mc3d-canvas:focus-visible{box-shadow:inset 0 0 0 3px rgba(58,160,216,.38)}
.mc3d-toolbar{
	position:absolute;
	top:12px;
	right:12px;
	z-index:3;
	display:flex;
	gap:7px;
	pointer-events:none;
}
.mc3d-tool{
	width:39px;
	height:39px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:0;
	border:1px solid rgba(91,113,125,.22);
	border-radius:10px;
	background:rgba(255,255,255,.92);
	color:var(--mc3d-ink);
	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;
}
.mc3d-tool:hover,.mc3d-tool:focus-visible{
	color:var(--mc3d-blue);
	border-color:rgba(58,160,216,.52);
	outline:0;
	transform:translateY(-1px);
}
.mc3d-tool.is-active{
	color:#fff;
	background:var(--mc3d-blue);
	border-color:var(--mc3d-blue);
}
.mc3d-tool svg{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mc3d-badge{
	position:absolute;
	top:14px;
	left:14px;
	z-index:2;
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:6px 9px;
	border:1px solid rgba(58,160,216,.22);
	border-radius:999px;
	background:rgba(255,255,255,.88);
	color:#2c7fae;
	font-size:11px;
	font-weight:900;
	letter-spacing:.08em;
	text-transform:uppercase;
	box-shadow:0 4px 12px rgba(25,43,54,.06);
	pointer-events:none;
}
.mc3d-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mc3d-blue);box-shadow:0 0 0 3px rgba(58,160,216,.13)}
.mc3d-hint{
	position:absolute;
	left:50%;
	bottom:12px;
	z-index:2;
	transform:translateX(-50%);
	max-width:calc(100% - 26px);
	padding:7px 11px;
	border-radius:999px;
	background:rgba(255,255,255,.84);
	color:#66757e;
	font-size:11px;
	font-weight:750;
	line-height:1.3;
	text-align:center;
	white-space:nowrap;
	box-shadow:0 4px 13px rgba(25,43,54,.07);
	pointer-events:none;
	transition:opacity .25s ease;
}
.mc3d-viewer.has-interacted .mc3d-hint{opacity:0}
.mc3d-touch-hint{display:none}
.mc3d-empty{
	position:absolute;
	inset:0;
	z-index:2;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:70px 24px 48px;
	color:#69747c;
	font-weight:750;
	text-align:center;
	pointer-events:none;
}
.mc3d-viewer.has-model .mc3d-empty{display:none}
.mc3d-viewer:not(.has-model) .mc3d-toolbar,.mc3d-viewer:not(.has-model) .mc3d-hint{display:none}
.mc3d-viewer:fullscreen,.mc3d-viewer:-webkit-full-screen{
	width:100vw;
	height:100vh;
	border-radius:0;
	background:linear-gradient(180deg,#fbfdfe 0%,#e9f0f3 100%);
}
@media(max-width:650px){
	.mc3d-viewer{height:330px;min-height:290px;border-radius:10px}
	.mc3d-toolbar{top:9px;right:9px;gap:5px}
	.mc3d-tool{width:37px;height:37px}
	.mc3d-badge{top:10px;left:10px}
	.mc3d-hint{bottom:9px;font-size:10px;white-space:normal;width:max-content}
}
@media(hover:none),(pointer:coarse){
	.mc3d-desktop-hint{display:none}
	.mc3d-touch-hint{display:inline}
}
@media(prefers-reduced-motion:reduce){
	.mc3d-tool,.mc3d-hint{transition:none}
}
