:root {
	--primary-orange: #FF6B00;
	--bg-color: #FFFFFF;
	--text-main: #1F2937;
	--text-sub: #6B7280;
	--btn-bg: #EFF1F5;
	--btn-blue: #1E90FF;
}
* { margin: 0; padding: 0; box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
body { background: #f5f5f5; display: flex; justify-content: center; }
.app-container { width: 100%; max-width: 480px; background: var(--bg-color); min-height: 100vh; padding: 31px; position: relative; }

/* --- 恢复为常规小尺寸、紧凑型 Header --- */
header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 20px;
	padding-top: 20px;
}
.logo { height: 42px; margin-top: -28px; }
.nav-links {
	display: flex;
	gap: 20px; /* 间距恢复为常规 20px */
	font-size: 20px; /* 字号恢复为常规 16px */
	font-weight: 600;
	color: #000;
}
.nav-links a {
	text-decoration: none;
	color: #000;
}
.nav-links a.active {color: #eb6a2e; border-bottom: 2px solid #eb6a2e;}

/* Recommended Section */
.section-title { display: flex; justify-content: space-between; align-items: center; font-size: 18px; font-weight: 600; margin: 15px 0; }
.recommend-card { border-radius: 14px; overflow: hidden; margin-bottom: 20px; background: #fff; cursor: pointer;-webkit-tap-highlight-color: transparent; }
.game-card:active {
    background-color: transparent;
}
.recommend-img { border-radius: 14px;width: 99.2%; height: auto; display: block; object-fit: cover;  box-shadow: -1px -1px 8px rgba(0,0,0,0.14), 0 3px 6px rgba(0,0,0,0.2); }
.recommend-info { padding: 10px 0; display: flex; align-items: center; gap: 15px; }
.recommend-icon { width: 62px; height: 62px; border-radius: 16px; object-fit: cover;box-shadow: -1px -1px 5px rgba(0,0,0,0.14), 0 3px 4px rgba(0,0,0,0.2); }
.recommend-text { flex: 1;height: 68px; }
.recommend-title { font-weight: 600; font-size: 1.058rem;margin: 5px 0; }
.recommend-sub { font-size: 12px; color: var(--text-sub); margin-top: 4px;}
.recommend-text .btn-install { margin-top: 4px; padding: 4px 18px; font-size: 14sspx;width: 88px; }
.btn-install { background: #E0EAF7; border: none; padding: 8px 20px; border-radius: 12px; font-size: 14px; font-weight: 500; color: #333; cursor: pointer; }

/* Game Grid */
.game-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 10px;margin-bottom: 44px; }
.game-card { display: flex; flex-direction: column; align-items: flex-start; cursor: pointer; }
.game-icon-wrap {
	width: 100%;
	position: relative;
	margin-bottom: 8px;
	margin-top: 8px;
	margin-bottom: 14px;
}
.game-icon {
	width: 100%;
	aspect-ratio: 1/1;
	border-radius: 18px;
	object-fit: cover;
	display:block;
	position: relative;
	z-index:2;
	box-shadow: -1px -1px 8px rgba(0,0,0,0.14),
	0 3px 6px rgba(0,0,0,0.2);
}
/*.game-icon { width: 100%; aspect-ratio: 1/1; border-radius: 18px; object-fit: cover; margin-bottom: 8px;margin-top: 8px; }*/
/* 红箭头指向的底部阴影层 #EBEDF3 */
.game-icon-shadow {
	position: absolute;
	left: 1px;
	right: -1px;
	top: 3px;
	bottom: -3px;
	background-color: #EBEDF3;
	border-radius: 15px;
	z-index: 1;
}
.game-name { font-size: 13px; text-align: left; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-weight: 500; }
.game-card .btn-install { margin-top: 10px; width: 78%; align-self: flex-start; font-size: 14px; padding: 4px 0; background: #E0EAF7; border: none; border-radius: 12px; font-weight: 500; color: #333; cursor: pointer;margin: 0 auto; }

@media only screen and (max-width:380px) {
	.recommend-title { font-weight: 600; font-size: .92rem;margin: 5px 0; }
	.game-card .btn-install { margin-top: 10px; width: 78%; align-self: flex-start; font-size: 12px; padding: 4px 0; background: #E0EAF7; border: none; border-radius: 12px; font-weight: 500; color: #333; cursor: pointer;margin: 0 auto; }
	.recommend-text .btn-install { margin-top: 4px; padding: 4px 18px; font-size: 12px;width: 88px; }
}


/* Download Overlay */
#download-overlay { position: fixed; bottom: -100px; left: 0; width: 100%; display: flex; justify-content: center; transition: bottom 0.3s ease-in-out; z-index: 999; }
#download-overlay.active { bottom: 20px; }
.download-bar { background: #1F2937; color: #fff; padding: 15px 25px; border-radius: 30px; width: 90%; max-width: 440px; display: flex; flex-direction: column; align-items: center; box-shadow: 0 4px 10px rgba(0,0,0,0.2); }
.download-progress { width: 100%; height: 4px; background: #555; border-radius: 2px; margin-top: 8px; overflow: hidden; }
.download-progress-inner { height: 100%; background: var(--btn-blue); width: 0%; animation: loading 3s forwards; }
@keyframes loading { 0% { width: 0%; } 100% { width: 100%; } }
.dec-box{
	height: 66px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 100%;
}

/* 动态插入的下载进度样式 */
.local-download-bar{
	margin-top:2px;
}
.local-download-progress{
	width:78%;
	height:3px;
	background:#555;
	border-radius:3px;
	overflow:hidden;
}
.local-download-progress-inner{
	height:100%;
	width:0;
	background:#2575e7;
	border-radius:3px;
}
@keyframes localLoading {
	0% { width:0; }
	100% { width:100%; }
}

/** Recommend **/
.local-download-bar-recommend{
	margin-top:4px;
}
.local-download-progress-recommend{
	width:72px;
	height:3px;
	background:#555;
	border-radius:3px;
	overflow:hidden;
}
.local-download-progress-inner-recommend{
	height:100%;
	width:0;
	background:#2575e7;
	border-radius:3px;
}
@keyframes localLoading {
	0% { width:0; }
	100% { width:100%; }
}
.btn-install {
	position: relative;
	overflow: hidden;
}
.btn-progress-wrap {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.15);
}
.btn-progress-wrap.active {
	display:block;
	color: #fff;
}
.btn-progress-bar {
	height:100%;
	width:0%;
	background-color:#28c740; /*绿色进度*/
	transition: none;
}
.btn-install .btn-text {
	position: relative;
	z-index:2;
}
.dec-box .btn-install span.cur {
	color: #fff;
}
.btn-install {
	position: relative;
	overflow: hidden;
}
.btn-progress-wrap-recommend {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.15);
}
.btn-progress-wrap-recommend.active {
	display: block;
}
.btn-progress-bar-recommend {
	height: 100%;
	width: 0%;
	background-color: #28c740; /*绿色进度*/
}
.btn-install .btn-text {
	position: relative;
	z-index: 2;
}
.btn-install .btn-text.cur {
	color: #fff;
}

/**底部**/
.flyfox-footer {
  width: 100%;
  background: #ffffff;
  padding: 32px 20px;
  box-sizing: border-box;
  margin-top: 60px;
}

.footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  gap: 48px;
}

.footer-logo {
  flex-shrink: 0;
  margin-top: 8px;
}
.footer-logo img {
  height: auto;
  max-height: 80px;
}

.footer-right {
  flex: 1;
}

.footer-nav {
  display: flex;
  gap: 60px;
  font-family: "Roboto", system-ui, sans-serif;
  font-weight: 500;
  font-size: 27px;
  color: #5f6368;
  margin-bottom: 16px;
}
.footer-nav a {
  color: #5f6368;
  text-decoration: none;
}

.footer-cookie-text {
  font-family: "Adobe Heiti Std", sans-serif;
  font-size: 16.5px;
  color: #5f6368;
  line-height: 1.55;
}

/* 移动端自动换行修复，防止挤乱 */
@media (max-width: 900px) {
  .footer-inner {
    flex-direction: column;
    gap:24px;
  }
  .footer-nav {
    gap:32px;
    font-size:22px;
  }
}