body { padding: 0; margin: 0; }
html, body { width: 100%; height: 100%; overflow: hidden; background: #FFF; }

#unity-container {
	position: absolute; 
	inset: 0; 
	background: linear-gradient(170deg, #000000 0%, #000000 30%,#2d2d2d 100%);
}

/* 캔버스 중앙 정렬 */
#unity-canvas { 
	background: #000000;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

#unity-loading-bar { 
	position: fixed; 
	left: 50%; 
	top: 50%; 
	transform: translate(-50%, -60%); 
	display: none;
	z-index: 10;
	width: 430px;
	max-width: 90vw;
}

#unity-logo { 
	width: 100%;
  max-width: 430px;
  height: auto;
  aspect-ratio: 430 / 352;
  margin: 0 auto;
	background: url('dd-logo-dark.png') no-repeat center;
	background-size: contain;
	animation: logoFloat 3s ease-in-out infinite;
}

@keyframes logoFloat {
  0%, 100% {
    transform: translateY(0);
    opacity: 0.8;
  }
  50% {
    transform: translateY(-6px);
    opacity: 1;
  }
}

#unity-progress-bar-empty { 
	width: 100%;
	height: 24px; 
	position: relative;
	background: url('progress-bar-empty-dark.png') no-repeat center;
	background-size: auto 100%;
}

#unity-progress-bar-full { 
	width: 0%; 
	height: 16px;
	margin-top: 4px;
	position: absolute;
	background: url('progress-bar-full-dark.png') no-repeat left center;
	transition: width 0.3s ease;
}

/* Footer 캔버스 하단에 위치 (JS로 계산) */
#unity-footer { 
	position: relative;
	height: 50px; 
	background-color: #FFF;
}

.unity-mobile #unity-footer { 
	display: none;
}

#unity-logo-title-footer { 
	float:left;
	width: 450px; 
	height: 50px; 
	background: url('logo-title-dd.png') no-repeat center;
}

#unity-build-title { 
	line-height: 50px; 
	font-family: arial; 
	font-size: 18px;
	color: #fff;
	margin: 0 10px;
}

#unity-fullscreen-button { 
	cursor: pointer; 
	float: right;
	width: 50px; 
	height: 50px; 
	background: url('fullscreen-button.png') no-repeat center;
}

#unity-warning { 
	position: absolute; 
	left: 50%; 
	top: 5%; 
	transform: translate(-50%); 
	background: white; 
	padding: 10px; 
	display: none;
	z-index: 10;
}
