.page-height {
	min-height: calc(100vh - 3rem - 200px);
}

.logo img {
	height: 200px;
}

.company-name {
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	background-color: rgb(0, 0, 0, 0.8);
	border-radius: 5px;
}

.top-left-image,
.top-right-image,
.bottom-left-image {
	position: absolute;
}

.top-left-image {
	top: 30px;
	left: -150px;
	animation: move infinite 2s alternate;
}

.top-right-image {
	right: -0px;
	/* animation: blink infinite 2s alternate; */
}

.diamond-effect {
	animation: blink infinite 2s alternate;
}

.bottom-left-image {
	bottom: -60px;
	left: -250px;
	animation: move-up-down infinite 3s alternate;
}

#myVideo {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -1;
}

.tab-background {
	/* 两层背景：第一层是内容背景，第二层是渐变边框 */
	background:
		linear-gradient(90deg, #2F282E 0%, #5E5754 100%) padding-box,
		/* 盒子背景 */
		linear-gradient(182.15deg, #E9D2B0 0%, #E9D2B0 100%) border-box;
	/* 渐变边框 */

	padding: 20px 10px;
	max-width: 800px;
	margin: auto;
	transition: 0.5s;

	/* 边框必须透明，才能显示背景的 border-box */
	border: 3px solid transparent;
	border-radius: 12px;
	/* 可选圆角 */
	box-sizing: border-box;

	/* 外部阴影 */
	box-shadow: 0px 0px 10px 2px grey,

		/* 内部阴影（上面白色高光、下面金色阴影） */
		inset 0px 4px 10px 0px #FFFFFFCC,
		inset 0px -6px 10px 0px #E6DAB580;
}



.tab-background:hover {
	box-shadow: 0px 0px 10px 2px white;
}

.tab-icon {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.tab-icon img {
	height: 60px;
	width: 60px;
	background-color: black;
}

.img-60 {
	width: 60px;
	height: 60px;
	object-fit: cover;
}


.tab-text {
	font-size: 24px;
	color: #FFFFFF;
}

#content a {
	text-decoration: none;
}

.swiper.mySwiper img {
	width: 100%;
	height: 200px;
	object-fit: fill;
}

.login-text-100 {
	font-size: 32px;
	font-weight: 700;
}

.input-bg-100 {
	background-color: #3A3A39;
	color: white;
}

.input-bg-100:focus {
	background-color: #3A3A39;
	color: white;
	box-shadow: 0 0 0 .25rem white !important;
}

/* .checkin-row {
	display: flex;
	flex-wrap: wrap;
}

.checkin-day {
	flex: 0 0 14.28%;
	一行 7 个格子
	max-width: 14.28%;
	text-align: center;
	margin-bottom: 5px;
} */



/*.checkin-row-grid {*/
/*    display: flex;*/
/*    flex-wrap: wrap;   */
/*    gap: 10px;         */
/*}*/

/*.checkin-day {*/
/*    flex: 0 0 calc(100% / 7 - 10px); */
/*    box-sizing: border-box;*/
/*}*/
.checkin-row-grid {
	display: grid;
	/*grid-template-columns: repeat(7, 1fr);*/
	/* gap: 10px; */
	/* 格子间距 */
}

.checkin-day img {
	max-width: 60%;
	/* 控制图片大小 */
	height: auto;
}

/* .checkin-img {
	width: 80%;
	height: auto;
	cursor: pointer;
} */
.checkin-img {
	width: 80%;
	height: auto;
	cursor: default;
}

.checkin-day.today-active .checkin-img {
	cursor: pointer;
}

.day-label {
	font-size: 0.75rem;
}

.check-in-bg-100 {
	background-color: #201F17;
}

.font-size-check-100 {
	padding-left: 35px !important;
}

.text-total-check-color-100 {
	background: linear-gradient(180deg, #E1CE8C 0%, #B38D05 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	/* For Firefox */
	color: transparent;
}

.custom-close-checkin {
	width: 26px;
	height: 40px;
	border: none;
	background-size: contain !important;
}

/* .daily-custom-design-100 {
	border-radius: 16px;
	padding: 10px;
	background: linear-gradient(90deg, #2F282E 0%, #5E5754 100%) padding-box;
	border: 1px solid;
	透明边框才能看到外层渐变
} */

.daily-custom-design-100 {
	display: inline-block;
	border-radius: 16px;
	padding: 8px 16px;
	font-size: clamp(14px, 2vw, 20px);
	background: linear-gradient(90deg, #2F282E 0%, #5E5754 100%) padding-box,
		linear-gradient(182.15deg, #F9F9F9 -15.19%, #666666 56.42%) border-box;
	border: 2px solid transparent;
	color: #fff;
	text-align: center;
	max-width: 100%;
	box-sizing: border-box;
}

/* new update 05/09 */
.home-text-design-100 {
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 3.5rem;
	line-height: 1.2;
	letter-spacing: 1px;

	/* 渐变填充文字 */
	background: linear-gradient(90deg, #FFE4C8 0%, #D5AB67 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;

	/* 文字边框 */
	-webkit-text-stroke: 1px #3F2904;

	/* 加强投影层次感 */
	filter: drop-shadow(3px 4px 6px rgba(19, 19, 20, 0.8));
}

.cus-text-design-100 {
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 16px;
	line-height: 100%;

	/* 渐变填充文字 */
	background: linear-gradient(90deg, #FFE4C8 0%, #D5AB67 100%);
	background-clip: text;
	-webkit-text-fill-color: transparent;

	/* 文字边框 */
	-webkit-text-stroke: .2px #3F2904;

	/* 加强投影层次感 */
	filter: drop-shadow(3px 4px 6px rgba(37, 37, 37, 0.8));
}

.cus-custom-design-100 {
    /*width: 144px;*/
    display: inline-block;
	max-width: 100%;
	border-radius: 100px;
	border: 1px solid transparent;
	padding: 8px 60px;
	gap: 10px;
	background: linear-gradient(90deg, #2F282E 0%, #5E5754 100%) padding-box,
		linear-gradient(182.15deg, #F9F9F9 -15.19%, #666666 56.42%) border-box;

	color: #fff;
	text-align: center;
	box-sizing: border-box;
}


.bg-cover {
	background-size: cover;
	/* 居中对齐 */
	background-repeat: no-repeat;
	/* 不重复 */

}

.button-background {
	/* 两层背景：第一层是内容背景，第二层是渐变边框 */
	background:
		linear-gradient(90deg, #2F282E 0%, #5E5754 100%) padding-box,
		/* 盒子背景 */
		linear-gradient(182.15deg, #E9D2B0 0%, #E9D2B0 100%) border-box;
	/* 渐变边框 */

	padding: 5px 20px;
	margin: auto;
	transition: 0.5s;

	/* 边框必须透明，才能显示背景的 border-box */
	border: 3px solid transparent;
	border-radius: 100px;
	/* 可选圆角 */
	box-sizing: border-box;

	/* 外部阴影 */
	box-shadow: 0px 0px 10px 2px grey,

		/* 内部阴影（上面白色高光、下面金色阴影） */
		inset 0px 4px 10px 0px #FFFFFFCC,
		inset 0px -6px 10px 0px #E6DAB580;
}

.arrow-symbol {

	font-size: 20px;
}

/* reward page */


.reward-badge {
	max-width: 100px;
	margin: 10px auto;
}



.reward-badge+h6 {
	font-weight: 800;
	font-size: 16px;
}

.swiper-button-next,
.swiper-button-prev {
	color: #fff;
	/* 箭头颜色 */
	top: 50%;
	/* 垂直居中 */
	transform: translateY(-50%);
}

/* 上下浮动动画 */
@keyframes floatUpDown {

	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(80px);
	}

}


.floating-icon img {
	animation: floatUpDown 10s ease-in-out infinite;
}

/* modal 背景和边框 */
.custom-modal {
	background-color: #201F17;
	border: 5px solid #F2D9BB;
	border-radius: 30px !important;
}

/* Login 按钮适中且清楚 */
.login-btn img {
	max-width: 200px;
	width: 100%;
	filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.5));
}

/* 注册按钮美化 */
.register-btn {
	max-width: 150px;
	border-radius: 12px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.4));
}

.register-btn:hover {
	transform: scale(1.05);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
}




@media (min-width: 1200px) {
	.home-text-design-100 {
		font-size: 3rem;
	}
}

@media (max-width: 768px) {

	.page-height {
		min-height: calc(100vh - 1rem - 100px);
	}

	.tab-background {
		border: 3px solid transparent;
		padding: 10px;
	}

	.tab-icon img {
		height: 35px;
		width: 35px;
		border-radius: 50%;
	}

	.tab-text {
		font-size: 16px;
	}

	.swiper.mySwiper img {
		height: 100px;
	}

	.font-size-check-100 .fs-4 {
		font-size: 1.2rem !important;
	}

	.font-size-check-100 .fs-1 {
		font-size: 2rem !important;
	}

	.checkin-day img {
		max-width: 100%;
		/* 控制图片大小 */
		height: auto;
	}

	.home-text-design-100 {
		font-size: 2.5rem;
	}

	.bg-cover {
		width: 100vw;
		height: 100vh;
		min-height: 100vh;
		background-position: center center;
	}

	.button-background {

		padding: 0px 20px !important;

	}

	.reward-badge {
		max-width: 80px;
	}

	/* .reward-badge+h6 {
		font-size: 10px;
	}  */
	.cus-custom-design-100 {
		/*width: 110px;*/
		display: inline-block;
		max-width: 100%;
		padding: 6px 40px;
		font-size: 12px;
	}

	.cus-text-design-100 {
		-webkit-text-stroke: 0;
	}

	img#checkinBtn {
		width: 150px !important;
	}

	.container.mobile-container-100 {
		line-height: 64px;

	}

	img.d-none.d-md-inline-block.img-fluid {
		width: 35% !important;
	}
	
	.mobile-text {
		font-size: 12px !important;
	}
	
	.button-tablet-login {
		width: 80% !important;
	}

	.button-tablet-login-100 {
		margin-right: -27px;
		margin-top: -22px;
	}


}

@media (max-width: 576px) {
	.font-size-check-100 .fs-4 {
		font-size: 13px !important;
	}

	.font-size-check-100 {
		padding-left: 29px !important;
	}

	.font-size-check-100 .fs-1 {
		font-size: 1.5rem !important;
	}

	.reward-badge {
		max-width: 50px !important;
	}

	.reward-badge+h6 {
		font-size: 10px !important;
	}

	/* 固定按钮层级低一点 */
	.floating-icons {
		z-index: 10;
	}

	/* Swiper 保证在上面 */
	.rewardSwiper {
		position: relative;
		z-index: 20;
	}

	.daily-custom-design-100 {
		padding: 0px 16px;
	}

	.swiper-button-next:after,
	.swiper-rtl .swiper-button-prev:after {
		font-size: 20px !important;
	}

	.swiper-button-prev:after,
	.swiper-rtl .swiper-button-next:after {
		font-size: 20px !important;
	}
	
	.mobile-adjust {
		margin-top: -36px;
	}
	
	
	.login-text-100 {
		font-size: 20px !important;
	}

	.form-label.from-text-100 {
		font-size: 14px !important;
	}

	.form-control.form-control-text {
		font-size: 14px !important;
		padding: 10px 12px !important;
	}

	/* 保持左右并排，但按钮放大一点 */
	.register-btn {
		max-width: 140px;
	}

	.register-text-100 {
		font-size: 13px !important;
	}
	
	.button-background {
		padding: 0px 20px !important;
		font-size: 12px;

	}

	.arrow-symbol {
		font-size: 16px;
	}

	.button-mobile-login {
		width: 60%;
	}

	.button-mobile-login-100 {
		margin-right: -27px;
		margin-top: -22px;
	}
	


}

@media (max-width: 321px) {
	.register-btn {
		height: 35px;
	}
}