#moho-3d-viewer{
	display:block;
	position:relative;
	width:100%;
	aspect-ratio:1 / 1;
	min-height:360px;
	background:#fafafa;
	margin:0 0 14px;
	--poster-color:#fafafa;
	--progress-bar-color:#5f1b47;
}
#moho-3d-viewer.moho-3d-off{ display:none !important; }
/* Poster of the selected variant, shown while its model downloads */
#moho-3d-viewer .moho-3d-poster{
	position:absolute; inset:0; z-index:2;
	background:#fafafa center / contain no-repeat;
	pointer-events:none;
	opacity:0; transition:opacity .25s ease;
}
#moho-3d-viewer.is-loading .moho-3d-poster{ opacity:1; }
/* Loading overlay: dimmed poster + spinner, label, live % and bar */
#moho-3d-viewer .moho-3d-poster::before{
	content:""; position:absolute; inset:0; background:rgba(250,250,250,.6);
}
#moho-3d-viewer .moho-3d-loader{
	position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
	display:flex; flex-direction:column; align-items:center; gap:14px;
	min-width:200px; padding:22px 28px; box-sizing:border-box;
	background:rgba(255,255,255,.92); border:1px solid #ece5e8;
	font:500 14px/1.2 "Georama", sans-serif; letter-spacing:.02em; color:#333; text-align:center;
}
#moho-3d-viewer .moho-3d-loadtext b{ display:inline-block; min-width:2.6em; text-align:left; color:#5f1b47; font-weight:600; }
#moho-3d-viewer .moho-3d-spinner{
	width:34px; height:34px; border-radius:50%;
	border:3px solid #e3d3dc; border-top-color:#5f1b47;
	animation:moho3dspin .85s linear infinite;
}
#moho-3d-viewer .moho-3d-bar{ display:block; width:100%; height:3px; background:#e9e4e6; overflow:hidden; }
#moho-3d-viewer .moho-3d-bar i{ display:block; width:0; height:100%; background:#5f1b47; transition:width .25s ease; }
@keyframes moho3dspin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ #moho-3d-viewer .moho-3d-spinner{ animation-duration:2.4s; } }
/* the overlay carries the progress now; hide model-viewer's own thin bar */
#moho-3d-viewer{ --progress-bar-color:transparent; --progress-mask:transparent; }
#moho-3d-viewer .moho-3d-hint{
	position:absolute; left:12px; bottom:10px; z-index:3;
	font-size:.72em; color:#666; background:rgba(255,255,255,.75);
	padding:3px 8px; border-radius:12px; pointer-events:none; display:none;
}
#moho-3d-viewer.is-ready .moho-3d-hint{ display:block; }
@media (max-width:768px){ #moho-3d-viewer{ aspect-ratio:auto; height:340px; } }