@font-face {  font-family: GaoyaSerif;  src: url('gaoya-serif.ttf') format('truetype');  font-weight: 400;  font-display: swap;}:root {  color-scheme: light;  --bg: #FAF8F5;  --card-bg: rgba(255, 255, 255, 0.88);  --ink: #2C261F;  --muted: #6B6254;  --gold: #C5A059;  --gold-dark: #785A2A;  --gold-light: #F7EAD0;  --line: #E8E2D8;  --serif: GaoyaSerif, 'Songti SC', STSong, 'Noto Serif SC', serif;  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Helvetica Neue", sans-serif;  color: var(--ink);  background: var(--bg);  scroll-behavior: smooth;}* {  box-sizing: border-box;  -webkit-tap-highlight-color: transparent;}body {  margin: 0;  min-width: 320px;  background-color: var(--bg);  color: var(--ink);  -webkit-font-smoothing: antialiased;  text-rendering: optimizeLegibility;  padding-bottom: env(safe-area-inset-bottom, 24px);  overflow-x: hidden;}a { color: inherit; text-decoration: none; }button { font: inherit; cursor: pointer; }svg { flex-shrink: 0; }[hidden] { display: none !important; }a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }.skip-link {  position: fixed;  top: 0;  left: 0;  z-index: 9999;  background: #fff;  padding: 10px 16px;  transform: translateY(-120%);  border-radius: 0 0 8px 0;  box-shadow: 0 4px 12px rgba(0,0,0,0.1);}.skip-link:focus { transform: none; }/* =========================================================   苹果级晨曦流光背景氛围   ========================================================= */.ambient {  position: fixed;  inset: 0;  pointer-events: none !important;  z-index: -1;  background: #FAF8F5;  overflow: hidden;}.light-field {  position: absolute;  top: -10%;  left: 50%;  width: 900px;  height: 700px;  transform: translateX(-50%);  background: radial-gradient(ellipse at center, rgba(247, 234, 208, 0.65) 0%, rgba(250, 248, 245, 0.1) 60%, transparent 75%);  filter: blur(50px);  animation: dawn-pulse 10s ease-in-out infinite alternate;}.light-floor {  position: absolute;  inset: 40% 0 0;  background: linear-gradient(0deg, rgba(247, 234, 208, 0.25) 0%, transparent 70%);}@keyframes dawn-pulse {  0% { transform: translateX(-50%) scale(0.95); opacity: 0.8; }  100% { transform: translateX(-50%) scale(1.05); opacity: 1; }}.page-shell {  max-width: 1200px;  margin: 0 auto;  padding: 0 24px;}/* =========================================================   顶部导航栏   ========================================================= */.site-header {  height: 84px;  display: flex;  justify-content: space-between;  align-items: center;  border-bottom: 1px solid rgba(232, 226, 216, 0.7);  position: relative;  z-index: 20;}.brand {  display: flex;  align-items: center;  gap: 14px;}.brand-icon {  width: 48px;  height: 48px;  border-radius: 12px;  background: linear-gradient(135deg, #FFFDF8, #F7EAD0);  border: 1px solid #EADBBE;  box-shadow: 0 4px 14px rgba(120, 90, 42, 0.08), inset 0 1px 1px #fff;  display: grid;  place-items: center;  font-family: var(--serif);  font-size: 24px;  font-weight: 600;  color: var(--gold-dark);}.brand-icon img {  width: 100%;  height: 100%;  object-fit: contain;  border-radius: 12px;}.brand-wordmark {  display: flex;  flex-direction: column;  gap: 3px;}.brand-wordmark > span {  font-family: var(--serif);  font-size: 22px;  letter-spacing: 0.1em;  font-weight: 500;  color: #383025;}.brand-wordmark small {  color: #8C734B;  letter-spacing: 0.35em;  font-size: 9px;  font-weight: 600;}.site-header nav {  display: flex;  align-items: center;  gap: 16px;}.help-link {  font-size: 13px;  color: var(--muted);  font-weight: 500;  transition: color 0.2s;}.help-link:hover { color: var(--gold-dark); }.header-badge {  font-size: 11px;  padding: 4px 10px;  background: rgba(197, 160, 89, 0.14);  color: var(--gold-dark);  border: 1px solid rgba(197, 160, 89, 0.35);  border-radius: 20px;  font-weight: 600;}/* =========================================================   Hero 核心区域（垂直优雅流布局）   ========================================================= */.hero-container {  display: flex;  flex-direction: column;  align-items: center;  text-align: center;  padding: 44px 0 20px;  position: relative;  z-index: 10;}.hero-heading {  max-width: 680px;  margin: 0 auto;}.edition-label {  font-size: 11px;  letter-spacing: 0.38em;  color: var(--gold-dark);  font-weight: 600;  margin: 0 0 14px;}.brand-title {  font-family: var(--serif);  font-size: clamp(44px, 7vw, 76px);  line-height: 1.15;  font-weight: 400;  letter-spacing: 0.08em;  margin: 0;  color: #2F281E;}.title-letter {  display: inline-block;  animation: title-in 1s cubic-bezier(0.16, 1, 0.3, 1) both;}@keyframes title-in {  from { opacity: 0; transform: translateY(16px); filter: blur(4px); }  to { opacity: 1; transform: translateY(0); filter: blur(0); }}.brand-statement {  font-family: var(--serif);  font-size: clamp(22px, 3.8vw, 32px);  letter-spacing: 0.12em;  margin: 16px 0 8px;  color: #785A2A;}.hero-description {  font-size: 14px;  color: var(--muted);  line-height: 1.6;  margin: 0 0 24px;}/* =========================================================   核心 3D 液态玻璃卡片主体（纯 CSS 3D 渲染，永不丢图）   ========================================================= */.hero-visual {  width: 100%;  max-width: 580px;  height: 300px;  perspective: 1200px;  position: relative;  margin: 10px 0 26px;  pointer-events: none !important;  display: flex;  align-items: center;  justify-content: center;}.scene {  width: 100%;  height: 100%;  position: relative;  transform-style: preserve-3d;  display: flex;  align-items: center;  justify-content: center;  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);  pointer-events: none !important;}.scene-halo {  position: absolute;  width: 380px;  height: 380px;  background: radial-gradient(circle, rgba(234, 219, 190, 0.55) 0%, transparent 68%);  filter: blur(35px);  pointer-events: none !important;}.floor-shadow {  position: absolute;  width: 320px;  height: 40px;  bottom: 12px;  background: radial-gradient(ellipse, rgba(120, 90, 42, 0.16) 0%, transparent 70%);  filter: blur(10px);  transform: rotateX(60deg);  animation: shadow-breath 8s ease-in-out infinite;  pointer-events: none !important;}@keyframes shadow-breath {  0%, 100% { transform: scale(1) rotateX(60deg); opacity: 0.7; }  50% { transform: scale(1.15) rotateX(60deg); opacity: 0.4; }}.orbit {  position: absolute;  width: 440px;  height: 440px;  border: 1px solid rgba(197, 160, 89, 0.22);  border-radius: 50%;  transform: rotateX(66deg) rotateY(-20deg) translateZ(-40px);  pointer-events: none !important;}.orbit-two {  width: 380px;  height: 380px;  border-color: rgba(216, 196, 161, 0.4);  transform: rotateX(35deg) rotateY(60deg) translateZ(-50px);}.sculpture-orb {  position: absolute;  width: 240px;  height: 240px;  border-radius: 50%;  background: radial-gradient(circle at 35% 30%, #FFFFFF 0%, #FAF6EE 35%, #EADBBE 70%, #C5A059 95%);  box-shadow: inset -10px -10px 30px rgba(120, 90, 42, 0.25), inset 8px 10px 20px #FFFFFF, 0 16px 40px rgba(120, 90, 42, 0.12);  transform: translateZ(-80px) translateY(-10px);  opacity: 0.4;  pointer-events: none !important;}/* 3D 液态玻璃实体卡片 */.glass-card-3d {  width: 340px;  height: 215px;  position: relative;  transform-style: preserve-3d;  animation: card-float 8s ease-in-out infinite;  pointer-events: none !important;}@keyframes card-float {  0%, 100% { transform: rotateX(12deg) rotateY(-18deg) rotateZ(-3deg) translateY(0) translateZ(60px); }  50% { transform: rotateX(8deg) rotateY(-10deg) rotateZ(1deg) translateY(-14px) translateZ(60px); }}.card-inner {  position: absolute;  inset: 0;  border-radius: 24px;  background: linear-gradient(135deg, rgba(255, 255, 255, 0.88) 0%, rgba(247, 234, 208, 0.48) 50%, rgba(255, 255, 255, 0.85) 100%);  border: 1px solid rgba(255, 255, 255, 0.95);  box-shadow:     0 24px 60px -10px rgba(120, 90, 42, 0.18),    0 2px 10px rgba(120, 90, 42, 0.05),    inset 1px 1px 1px #FFFFFF,    inset -1px -1px 1px rgba(197, 160, 89, 0.4);  backdrop-filter: blur(28px) saturate(160%);  -webkit-backdrop-filter: blur(28px) saturate(160%);  padding: 22px 24px;  display: flex;  flex-direction: column;  justify-content: space-between;  overflow: hidden;}.card-shine {  position: absolute;  top: -40%;  bottom: -40%;  left: -80%;  width: 60%;  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.65), transparent);  transform: rotate(25deg);  animation: glass-shine 9s ease-in-out infinite;  pointer-events: none;}@keyframes glass-shine {  0%, 60% { left: -80%; }  85%, 100% { left: 160%; }}.card-head {  display: flex;  justify-content: space-between;  align-items: center;}.card-pill {  font-size: 9px;  font-weight: 700;  letter-spacing: 0.15em;  padding: 3px 8px;  background: rgba(120, 90, 42, 0.1);  color: var(--gold-dark);  border-radius: 6px;  border: 1px solid rgba(197, 160, 89, 0.3);}.card-serial {  font-family: Georgia, serif;  font-size: 10px;  color: #8C734B;  letter-spacing: 0.12em;}.card-brand-emblem {  display: flex;  align-items: center;  gap: 16px;  margin: auto 0;}.emblem-circle {  width: 58px;  height: 58px;  border-radius: 16px;  background: linear-gradient(135deg, #FFFFFF, #F5E8D0);  border: 1px solid #DFC89D;  box-shadow: 0 6px 16px rgba(120, 90, 42, 0.14), inset 0 1px 1px #fff;  display: grid;  place-items: center;  position: relative;}.emblem-ring {  position: absolute;  inset: 3px;  border: 1px dashed rgba(197, 160, 89, 0.4);  border-radius: 13px;}.emblem-char {  font-family: var(--serif);  font-size: 30px;  color: var(--gold-dark);  font-weight: 600;}.emblem-text {  text-align: left;  display: flex;  flex-direction: column;  gap: 4px;}.emblem-title {  font-family: var(--serif);  font-size: 24px;  letter-spacing: 0.08em;  color: #382D20;  font-weight: 500;}.emblem-sub {  font-size: 9px;  letter-spacing: 0.22em;  color: #8C734B;  font-weight: 600;}.card-foot {  display: flex;  justify-content: space-between;  align-items: center;  border-top: 1px solid rgba(220, 205, 180, 0.45);  padding-top: 12px;}.card-chip {  width: 28px;  height: 18px;  border-radius: 4px;  background: linear-gradient(135deg, #DFC89D, #BCA06B);  box-shadow: inset 0 1px 1px #fff;}.card-tech-label {  font-size: 8px;  font-weight: 700;  letter-spacing: 0.2em;  color: #9E855D;}/* =========================================================   核心下载按钮区（尊享质感，最高触控响应优先级）   ========================================================= */.hero-download {  width: 100%;  max-width: 520px;  margin: 0 auto;  position: relative;  z-index: 50;}.download-actions {  display: flex;  justify-content: center;  gap: 16px;  width: 100%;  touch-action: manipulation;}.download-option {  flex: 1;  min-width: 0;  max-width: 240px;}.download-button {  min-height: 68px;  padding: 14px 18px;  display: flex;  align-items: center;  gap: 14px;  border-radius: 16px;  color: #42382C;  background: rgba(255, 255, 255, 0.95);  border: 1px solid #D8CBB6;  box-shadow: 0 8px 24px rgba(120, 90, 42, 0.08), inset 0 1px #FFFFFF;  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);  cursor: pointer;  user-select: none;  -webkit-user-select: none;  touch-action: manipulation;  position: relative;  z-index: 60;  pointer-events: auto !important;}.download-button.is-primary {  background: linear-gradient(135deg, #8B6D3C 0%, #70532C 100%);  border-color: #8B6D3C;  color: #FFFFFF;  box-shadow: 0 12px 30px rgba(112, 83, 44, 0.32), inset 0 1px rgba(255, 255, 255, 0.35);}.download-button:hover {  transform: translateY(-2px);  box-shadow: 0 16px 36px rgba(112, 83, 44, 0.22);}.download-button:active {  transform: scale(0.97) translateY(1px);}.platform-icon {  width: 24px;  height: 24px;  flex-shrink: 0;}.download-label {  display: flex;  flex-direction: column;  gap: 4px;  flex: 1;  min-width: 0;  text-align: left;}.download-label strong {  font-size: 15px;  font-weight: 600;  white-space: nowrap;  display: flex;  align-items: center;  gap: 6px;}.download-label small {  font-size: 11px;  opacity: 0.82;  white-space: nowrap;}.recommendation {  font-size: 10px;  line-height: 1;  font-style: normal;  border-radius: 4px;  padding: 3px 6px;  background: rgba(255, 255, 255, 0.25);  border: 1px solid rgba(255, 255, 255, 0.6);}.arrow-icon {  width: 16px;  height: 16px;  margin-left: auto;  opacity: 0.75;  transition: transform 0.2s;}.download-button:hover .arrow-icon {  transform: translateX(3px);  opacity: 1;}.download-caption {  display: inline-flex;  align-items: center;  gap: 8px;  font-size: 12px;  color: var(--muted);  margin-top: 16px;}.caption-dot {  width: 6px;  height: 6px;  border-radius: 50%;  background: #10B981;  box-shadow: 0 0 8px #10B981;}/* =========================================================   下载须知 FAQ 手风琴（彻底修复双重叠图标）   ========================================================= */.download-help {  margin-top: 50px;  padding-top: 36px;  border-top: 1px solid rgba(232, 226, 216, 0.8);  display: grid;  grid-template-columns: 1fr 2fr;  gap: 40px;  align-items: start;}.help-heading {  text-align: left;}.section-tag {  font-size: 10px;  font-weight: 700;  letter-spacing: 0.2em;  color: var(--gold-dark);}.help-heading h2 {  font-family: var(--serif);  font-size: 26px;  font-weight: 500;  color: #383025;  margin: 8px 0 10px;}.help-sub {  font-size: 13px;  color: var(--muted);  line-height: 1.6;  margin: 0;}.faq-list {  display: flex;  flex-direction: column;  gap: 14px;}.faq-card {  background: rgba(255, 255, 255, 0.9);  border: 1px solid rgba(232, 226, 216, 0.85);  border-radius: 16px;  box-shadow: 0 2px 12px rgba(120, 90, 42, 0.04);  overflow: hidden;  transition: all 0.25s ease;}.faq-card:hover {  background: #FFFFFF;  border-color: #DBCFBD;  box-shadow: 0 6px 20px rgba(120, 90, 42, 0.07);}.faq-card summary {  padding: 18px 20px;  min-height: 62px;  display: flex;  align-items: center;  gap: 14px;  cursor: pointer;  user-select: none;  -webkit-user-select: none;  list-style: none;}.faq-card summary::-webkit-details-marker { display: none; }.faq-icon-wrap {  width: 32px;  height: 32px;  border-radius: 10px;  background: var(--gold-light);  display: grid;  place-items: center;  color: var(--gold-dark);  flex-shrink: 0;}.faq-icon {  width: 17px;  height: 17px;}.faq-title {  font-size: 14px;  font-weight: 600;  color: #3E3529;  flex: 1;  text-align: left;}.faq-chevron {  width: 16px;  height: 16px;  color: #A39684;  margin-left: auto;  transition: transform 0.3s ease;}.faq-card[open] .faq-chevron {  transform: rotate(180deg);  color: var(--gold-dark);}.faq-content {  padding: 0 20px 18px 66px;  text-align: left;}.faq-content p {  margin: 0;  font-size: 13px;  color: var(--muted);  line-height: 1.8;}/* =========================================================   页脚 Footer   ========================================================= */.site-footer {  margin-top: 60px;  padding: 30px 0 10px;  border-top: 1px solid rgba(232, 226, 216, 0.8);  display: flex;  justify-content: space-between;  align-items: center;  font-size: 12px;  color: var(--muted);}.footer-left {  display: flex;  align-items: center;  gap: 16px;}.footer-auth {  display: inline-flex;  align-items: center;  gap: 6px;  padding: 2px 8px;  background: rgba(16, 185, 129, 0.08);  color: #065F46;  border: 1px solid rgba(16, 185, 129, 0.2);  border-radius: 4px;  font-size: 11px;  font-weight: 500;}.footer-links {  display: flex;  gap: 20px;  align-items: center;}.footer-brand {  font-family: Georgia, serif;  letter-spacing: 0.3em;  font-weight: 600;  color: var(--gold-dark);}/* Toast */.toast {  position: fixed;  left: 50%;  bottom: 36px;  transform: translate(-50%, 20px);  opacity: 0;  pointer-events: none;  background: rgba(44, 38, 31, 0.94);  color: #FFFFFF;  padding: 14px 24px;  border-radius: 14px;  max-width: 90vw;  font-size: 13px;  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);  backdrop-filter: blur(16px);  -webkit-backdrop-filter: blur(16px);  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);  z-index: 999999;}.toast.visible {  opacity: 1;  transform: translate(-50%, 0);}.noscript-notice {  padding: 16px;  text-align: center;  background: #FFFBEB;  color: #92400E;  font-size: 13px;}/* =========================================================   📱 移动端与全机型响应式断点（核心自适应）   ========================================================= */@media (max-width: 900px) {  .download-help {    grid-template-columns: 1fr;    gap: 24px;  }}@media (max-width: 767px) {  .page-shell {    padding: 0 18px;  }  .site-header {    height: 72px;  }  .brand-icon {    width: 42px;    height: 42px;    font-size: 20px;  }  .brand-wordmark > span {    font-size: 19px;  }  .help-link {    display: none;  }  .hero-container {    padding: 26px 0 14px;  }  .brand-title {    font-size: clamp(38px, 10vw, 54px);  }  .brand-statement {    font-size: 21px;    margin: 12px 0 6px;  }  .hero-description {    font-size: 13px;    margin-bottom: 18px;  }  /* 3D 卡片在移动端黄金比例缩放 */  .hero-visual {    height: 250px;    margin: 0 0 20px;  }  .glass-card-3d {    width: 290px;    height: 185px;  }  .card-inner {    padding: 18px 20px;  }  .emblem-circle {    width: 48px;    height: 48px;  }  .emblem-char {    font-size: 24px;  }  .emblem-title {    font-size: 20px;  }  .emblem-sub {    font-size: 8px;  }  .download-actions {    gap: 12px;  }  .download-button {    min-height: 62px;    padding: 12px 14px;    gap: 10px;  }  .download-label strong {    font-size: 13px;  }  .download-label small {    font-size: 10px;  }  .faq-card summary {    padding: 16px;  }  .faq-content {    padding: 0 16px 16px 62px;  }  .site-footer {    flex-direction: column;    gap: 16px;    text-align: center;    padding: 24px 0;  }  .footer-left {    flex-direction: column;    gap: 8px;  }}/* 📱 极窄屏手机适配（<= 360px，如 iPhone SE 1代、折叠屏窄外屏） */@media (max-width: 360px) {  .page-shell {    padding: 0 12px;  }  .brand-title {    font-size: 34px;  }  .brand-statement {    font-size: 18px;  }  .hero-visual {    height: 210px;  }  .glass-card-3d {    width: 260px;    height: 165px;  }  .download-actions {    flex-direction: column;    align-items: stretch;    gap: 10px;  }  .download-option {    max-width: 100%;  }  .download-button {    min-height: 54px;  }  .faq-content {    padding-left: 16px;  }}
