/* ============================================================
   下载入口组件 GameDownload
   配色完全沿用本站既有变量，不引入新色系：
     主色   var(--wine) #9a3d35  酒红
     深色   #3b5749               墨绿
     底色   var(--paper) #fffdf8
     描边   var(--line)  #e8e2d7
   ============================================================ */

.dl-block{margin:0}

/* 小标题：用站点的 section-index 风格 */
.dl-heading{
  font-size:10px;font-weight:800;letter-spacing:2px;
  color:var(--wine);margin:0 0 12px;
}

/* 按钮组：站点 .hero-buttons 的排布逻辑 */
.dl-row{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap}

.dl-btn{
  display:inline-flex;align-items:center;gap:11px;
  padding:13px 22px;border-radius:6px;
  font-size:13px;font-weight:750;line-height:1.35;
  text-decoration:none;border:1px solid transparent;
  transition:transform .18s,filter .18s,box-shadow .18s,border-color .18s;
  -webkit-tap-highlight-color:transparent;
}
.dl-btn:hover{transform:translateY(-2px)}
.dl-btn:active{transform:translateY(0)}
.dl-btn:focus-visible{outline:3px solid #d9a266;outline-offset:3px}

.dl-ico-wrap{display:grid;place-items:center;width:19px;height:19px;flex:none}
.dl-ico{width:100%;height:100%;display:block}
.dl-text{display:flex;flex-direction:column;gap:2px;text-align:left}
.dl-text b{font-weight:750;white-space:nowrap}
.dl-text i{font-style:normal;font-size:10px;font-weight:400;letter-spacing:.3px;white-space:nowrap;opacity:.78}

/* ============ V1 渐变流动：方案3 赭石 x 松墨 ============
   安卓 赭石  #9a5530 → #bd7c4a → #dda876
   苹果 松墨  #2e4a3e → #446757 → #6a917c
   两键同机制、反向节奏，避免同步晃动。
   纯 CSS，无 JS。 */
.dl-android,.dl-ios{
  background-size:280% 100%;
  background-position:0% 50%;
  color:#fff;
  animation:dlFlow 4s ease-in-out infinite;
}
.dl-android{
  background-image:linear-gradient(115deg,
    #9a5530 0%,#bd7c4a 25%,#dda876 50%,#bd7c4a 75%,#9a5530 100%);
  box-shadow:0 6px 18px rgba(154,85,48,.18);
}
.dl-ios{
  background-image:linear-gradient(115deg,
    #2e4a3e 0%,#446757 25%,#6a917c 50%,#446757 75%,#2e4a3e 100%);
  box-shadow:0 6px 18px rgba(46,74,62,.18);
  animation-direction:reverse;
}
.dl-android .dl-text i{color:#f7e3d4}
.dl-ios .dl-text i{color:#d5e6db}

@keyframes dlFlow{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* 渐变背景下改用亮度提亮，比换 background 更顺 */
.dl-android:hover{filter:brightness(1.07)}
.dl-ios:hover{filter:brightness(1.1)}
.dl-android:focus-visible{outline-color:#dda876}
.dl-ios:focus-visible{outline-color:#6a917c}

/* 尺寸变体 */
.dl-sm{padding:10px 15px;font-size:12px;gap:9px}
.dl-sm .dl-ico-wrap{width:16px;height:16px}
.dl-sm .dl-text i{font-size:9.5px}

/* 顺序：DOM 里安卓在前；iPhone 上把苹果换到前面 */
.dl-a1{order:1}
.dl-a2{order:2}

/* inline 变体：文章页/分类页用，克制，不抢正文 */
.dl-inline{
  padding:24px 26px;border-radius:8px;
  background:var(--paper);border:1px solid var(--line);
}
.dl-inline .dl-note{max-width:none}
.dl-note{
  font-size:11px;line-height:1.8;color:var(--muted);
  margin:12px 0 0;
}

/* 首页 hero 内：紧跟 hero-buttons，融入版式 */
.hero-dl-wrap{
  margin-top:30px;padding-top:26px;
  border-top:1px solid rgba(155,138,114,.28);
}

/* 下载独立页 */
.dl-page{padding-bottom:22px}
.dl-page-box{
  padding:34px 32px;border-radius:10px;
  background:var(--paper);border:1px solid var(--line);
  box-shadow:var(--shadow);
}
.dl-page-notice{
  margin-top:26px;padding:28px 32px;border-radius:8px;
  background:#edf1e8;border-top:3px solid #8c5746;
}
.dl-page-notice h2{
  font-family:"Songti SC","STSong",serif;
  font-size:24px;margin:0 0 16px;color:#304239;
}
.dl-page-notice ul{margin:0;padding-left:22px}
.dl-page-notice li{
  font-size:13px;line-height:2;color:#5d6a61;margin:5px 0;
}
.dl-page-notice li::marker{color:var(--wine)}
.dl-disclaimer{
  font-size:11px;line-height:2;color:var(--muted);
  padding:0 0 60px;max-width:900px;
}

/* 移动端底部固定栏：默认不输出，调用 game_download('bar') 才启用 */
.dl-bar{display:none}
.dl-bar-space{display:none}
@media (max-width:800px){
  .dl-bar{
    display:block;position:fixed;left:0;right:0;bottom:0;z-index:70;
    padding:10px 15px calc(10px + env(safe-area-inset-bottom,0px));
    background:rgba(251,248,242,.97);
    -webkit-backdrop-filter:saturate(180%) blur(12px);
    backdrop-filter:saturate(180%) blur(12px);
    border-top:1px solid var(--line);
    box-shadow:0 -6px 20px -8px rgba(31,38,34,.16);
  }
  .dl-bar .dl-row{gap:10px}
  .dl-bar .dl-btn{flex:1 1 0;justify-content:center;padding:12px 10px}
  .dl-bar .dl-text i{display:none}
  .dl-bar-space{display:block;height:74px}
  /* iPhone 上苹果优先 */
  .dl-bar .dl-a1{order:2}
  .dl-bar .dl-a2{order:1}
}

/* ---- 响应式 ---- */
@media (max-width:800px){
  .dl-row{gap:10px}
  .dl-btn{padding:12px 17px;font-size:12.5px;gap:9px}
  .dl-ico-wrap{width:17px;height:17px}
  .dl-text i{font-size:9.5px}
  .dl-inline{padding:20px 18px}
  .hero-dl-wrap{margin-top:24px;padding-top:20px}
  .dl-page-box{padding:24px 18px}
  .dl-page-notice{padding:22px 18px}
  .dl-page-notice h2{font-size:20px}
  .dl-page-notice li{font-size:12px;line-height:1.9}
  /* iPhone 上苹果排前 */
  .dl-a1{order:2}
  .dl-a2{order:1}
}

@media (max-width:420px){
  .dl-btn{padding:11px 13px;font-size:12px;gap:8px}
  .dl-text i{font-size:9px}
  .dl-inline{padding:17px 14px}
  .dl-heading{font-size:9px;letter-spacing:1.5px}
}

@media (prefers-reduced-motion:reduce){
  .dl-btn{transition:none}
  .dl-btn:hover{transform:none}
  .dl-android,.dl-ios{animation:none}
  .dl-android:hover,.dl-ios:hover{filter:none}
}
@media print{
  .dl-bar,.dl-wechat-tip{display:none !important}
  .dl-bar-space{display:none !important}
}

/* ---- 微信内置浏览器提示：默认隐藏，JS 在 iOS 微信里点亮 ---- */
.dl-wechat-tip{
  display:none;align-items:flex-start;
  margin:0 0 16px;padding:12px 15px;
  border:1px solid #e0cbb2;border-left:3px solid var(--wine);
  border-radius:6px;background:#faf2e8;
  font-size:12px;line-height:1.75;color:#6b5f52;
}
.dl-wechat-tip b{
  display:inline-grid;place-items:center;flex:none;
  width:16px;height:16px;margin:2px 8px 0 0;
  border-radius:50%;background:var(--wine);color:#fff;
  font-size:10px;font-weight:700;
}
