/* 标题栏与悬浮下载区的响应式样式 */
.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  width: 100%;
  padding: 0 max(24px, calc((100% - 1180px) / 2));
  background: rgba(255, 250, 246, .9);
  border-bottom: 1px solid rgba(238, 224, 216, .8);
  backdrop-filter: blur(12px);
}

.site-header .brand { font-size: 22px; }

.site-header .brand::after {
  padding: 4px 8px;
  border-radius: 99px;
  background: #fff0e8;
  color: #c96850;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  content: "ANDROID";
}

/* 所有下载入口使用统一的高识别度主操作样式 */
.header-download.download-action,
.button-primary.download-action {
  border-color: #ea6f59;
  background: linear-gradient(110deg, #ff9a71, #ef5e54, #ff8d67);
  background-size: 200% 100%;
  color: #fff;
  box-shadow: 0 8px 18px rgba(216, 84, 67, .28);
  animation: download-shift 4s ease-in-out infinite;
}

.header-download.download-action:hover,
.button-primary.download-action:hover { color: #fff; }
.button-primary.download-action span { border-left-color: rgba(255, 255, 255, .45); }

.text-link--dark.download-action {
  padding: 10px 14px;
  border: 1px solid #ec705c;
  border-bottom: 1px solid #ec705c;
  border-radius: 12px;
  background: #ef715c;
  color: #fff;
  box-shadow: 0 7px 14px rgba(207, 76, 60, .2);
}

.text-link--dark.download-action b { color: #fff; }

.button-light.download-action {
  border-color: #fff;
  background: linear-gradient(110deg, #fffdf9, #ffe5d8, #fffdf9);
  background-size: 200% 100%;
  box-shadow: 0 9px 20px rgba(164, 74, 57, .24);
  animation: download-shift 4s ease-in-out infinite;
}

.download-action {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: transform .2s, box-shadow .2s;
}

.download-action::after {
  position: absolute;
  z-index: 0;
  top: -170%;
  left: -75%;
  width: 38%;
  height: 440%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent);
  content: "";
  opacity: .85;
  pointer-events: none;
  transform: rotate(20deg);
  animation: download-sweep 2.7s ease-in-out infinite;
}

.download-action > span,
.download-action > b { position: relative; z-index: 1; }
.download-action:hover { transform: translateY(-2px); }

.fixed-download {
  position: fixed;
  z-index: 25;
  right: 22px;
  bottom: 22px;
  display: flex;
  gap: 11px;
  align-items: center;
  padding: 9px 10px 9px 11px;
  border: 1px solid #f1d9ce;
  border-radius: 18px;
  background: linear-gradient(105deg, #fffaf7 8%, #ffe0d1 46%, #fff7f2 72%, #ffd7c6);
  background-size: 260% 100%;
  box-shadow: 0 12px 30px rgba(124, 74, 57, .14);
  backdrop-filter: blur(12px);
  overflow: hidden;
  isolation: isolate;
  animation: download-panel-shine 3s ease-in-out infinite;
}

.fixed-download::before {
  position: absolute;
  z-index: 0;
  top: -80%;
  left: -25%;
  width: 70%;
  height: 240%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 191, 151, .42), rgba(255, 236, 224, 0) 68%);
  animation: download-glow 3.8s ease-in-out infinite;
  content: "";
}

.fixed-download > * { position: relative; z-index: 1; }

.fixed-download-logo { flex: 0 0 auto; }

.fixed-download-copy { display: grid; gap: 2px; }
.fixed-download-copy b { color: #493d3b; font-size: 12px; }
.fixed-download-copy small { color: #958582; font-size: 10px; }

.fixed-download a {
  padding: 10px 13px;
  border-radius: 12px;
  background: linear-gradient(135deg, #ff805f, #e9584f);
  color: #fff;
  box-shadow: 0 6px 13px rgba(207, 73, 59, .32);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
}

.fixed-download a:hover { background: linear-gradient(135deg, #ff8b69, #ea5e54); }

@keyframes download-glow {
  0%, 100% { transform: translateX(-18%) scale(.9); opacity: .55; }
  50% { transform: translateX(112%) scale(1.15); opacity: 1; }
}

@keyframes download-shift {
  0%, 100% { background-position: 0 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes download-sweep {
  0%, 18% { transform: translateX(0) rotate(20deg); opacity: 0; }
  28% { opacity: .9; }
  65%, 100% { transform: translateX(470%) rotate(20deg); opacity: 0; }
}

@keyframes download-panel-shine {
  0%, 100% { background-position: 0 50%; }
  50% { background-position: 100% 50%; }
}

@media (max-width: 760px) {
  .site-header { height: 64px; padding: 0 16px; }
  .site-header .brand { gap: 8px; font-size: 19px; }
  .site-header .brand-mark { width: 29px; height: 29px; }
  .site-header .brand::after { padding: 3px 6px; font-size: 8px; }
  .header-download { padding: 8px 10px; font-size: 11px; }

  .feature-card { min-height: 188px; padding: 18px 20px; }
  .feature-icon { width: 38px; height: 38px; margin: 10px 0; border-radius: 13px; font-size: 20px; }
  .feature-card h3 { margin-bottom: 6px; font-size: 18px; }
  .feature-card p { max-width: 300px; font-size: 12px; line-height: 1.55; }
  .card-tag {
    top: 16px;
    right: 16px;
    bottom: auto;
    padding: 4px 7px;
    border-radius: 99px;
    background: rgba(255, 255, 255, .58);
    font-size: 10px;
    opacity: .78;
    transform: none;
  }
  .steps { padding: 22px 20px; }
  .steps h2 { font-size: 29px; }
  .steps ol { gap: 12px; }
  .steps li { padding: 2px 0 2px 12px; }
  .steps li h3 { margin: 5px 0 3px; }

  .fixed-download {
    right: 12px;
    bottom: max(12px, env(safe-area-inset-bottom));
    left: 12px;
    padding: 9px 10px;
    border-radius: 16px;
  }

  .fixed-download-copy { flex: 1; }
  .fixed-download-copy b { font-size: 12px; }
  .fixed-download a { padding: 11px 14px; border-radius: 11px; }
  footer { padding-bottom: 100px; }
}

@media (prefers-reduced-motion: reduce) {
  .fixed-download::before,
  .fixed-download,
  .download-action::after,
  .header-download.download-action,
  .button-primary.download-action,
  .button-light.download-action { animation: none; }
}