/* 长沙鲸跃银河科技有限公司 版权所有 Copyright © 2019-2025 GINHE Co. Ltd. All Rights Reserved */

/* 基础 */
html, body, .container {
	height: 100%;
	font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
	background: #323232;
}

.h4, h4 {
	margin: 1pt 0;
	font-size: 10pt;
}

/* 老模板的 table 布局保留 */
.container {
	display: table;
	vertical-align: middle;
	border: 0;
	border-spacing: 0;
}

/* 旋转动画 */
.glyphicon-spin {
	animation: spin 2000ms infinite linear;
}

@keyframes spin {
	0% {
		transform: rotate(0)
	}

	100% {
		transform: rotate(359deg)
	}
}

@-webkit-keyframes spin {
	0% {
		transform: rotate(0)
	}

	100% {
		transform: rotate(359deg)
	}
}

/* 主容器：禁止在小屏被最小宽度撑偏 */
.wrapper {
	position: relative;
	margin: 0 auto;
	text-align: center;
	min-width: 640px;
	width: 100%;
	height: 480px; /* 运行时会被 JS 改写 */
	max-width: 100%;
	display: block;
	justify-content: center;
	align-items: center;
}

@media (max-width: 1024px) {
	.wrapper {
		min-width: 0 !important;
	}
}
/* 关键覆盖 */

/* 画布样式 */
.emscripten {
	padding-right: 0;
	margin: 0 auto;
	display: block;
	outline: none;
}

#canvas:not([fullscreen]) {
	padding-right: 0;
	margin: 0 auto;
	width: 100%;
}

/* 进度条（Bootstrap 保留） */
.progress {
	background: #f5f5f5;
	border: 0;
	border-radius: 0;
	height: 4px;
}

.progress-bar-custom {
	background: #999;
}

/* 居中工具类 */
.centered-axis-xy {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

/* ===== 修复遮罩与进度条可见性 / 铺满 / 居中 ===== */
#compilingmessage {
	display: grid !important;
	place-items: center !important;
	width: 100dvw !important;
	height: 100dvh !important;
	z-index: 9999 !important;
	padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

#loadingPage {
	display: grid;
	place-items: center;
	grid-auto-rows: min-content;
	min-height: 100%;
}

/* 进度条容器保持可见宽度并水平居中 */
.progress-wrap {
	width: clamp(240px, 80dvw, 375px);
	margin-inline: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* 进度条对比度提升（轨道微亮、填充明显） */
#loadingLine {
	width: 100%;
	height: 7px;
	border-radius: 10px;
	overflow: hidden;
	background: rgba(255,255,255,.25); /* 轨道更显眼 */
	box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);
}

#maskLeftNum {
	height: 100%;
	background: #ffffff; /* 填充白色，和轨道形成对比 */
	transition: width .3s;
}

/* 小屏去掉 wrapper 的最小宽度硬撑 */
@media (max-width: 1024px) {
	.wrapper {
		min-width: 0 !important;
	}
}

@media (max-width: 768px) {
	html, body {
		min-height: 100dvh;
	}

	#mainarea {
		min-height: 100dvh !important;
	}
}

/* 隐藏 UE 模板的加载文案：Compiling WebAssembly / Launching engine 等 */
#loadTasks span[id^="icon_"],
#loadTasks span[id^="load_"] {
	display: none !important;
}

/* 现代浏览器：连父容器一起隐藏，避免空 div 占位 */
#loadTasks > div:has(> span[id^="load_"]) {
	display: none !important;
}

/* 让双指事件都交给 canvas，而不是浏览器页面缩放/回弹 */
#canvas {
	touch-action: none;
	-ms-touch-action: none; /* 旧 Edge */
	overscroll-behavior: none; /* 禁止下拉回弹干扰 */
}