body {
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial;
    background:#fff;
    color:#222;
    overflow-x:hidden;
  }
  .phone-island,
  .phone-home-indicator,
  .phone-side-button {
    display:none;
  }
  .phone-screen {
    position:relative;
    min-height:100vh;
    background:#fff;
  }
  .page-scroll {
    min-height:100vh;
  }
  #qa-layer{
    position:fixed;
    inset:0;
    z-index:9999;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(180deg,#ff8ab3 0%,#7d4fd6 55%,#2d1748 100%);
  }
  #qa-layer::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:200%;
    background:url("uploads/bg.webp") center top / cover no-repeat;
    animation:bgMove 20s linear infinite;
    z-index:0;
    pointer-events:none;
  }
  @keyframes bgMove{
    0%{ transform:translateY(0); }
    100%{ transform:translateY(-50%); }
  }
  #qa-mask{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.45);
    z-index:1;
    pointer-events:none;
  }
  #qa-card{
    position:relative;
    background:#fff;
    width:90%;
    max-width:360px;
    border-radius:22px;
    padding:22px 20px;
    box-shadow:0 20px 50px rgba(0,0,0,.35);
    z-index:2;
  }
  .progress-text{font-size:13px;color:#888;margin-bottom:6px}
  .progress-bar{height:6px;background:#eee;border-radius:6px;overflow:hidden}
  .progress-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff6cab,#7366ff);transition:.3s}
  #qa-card h1{font-size:25px;margin:10px 0}
  #qa-card p{font-size:19px;color:#666}
  .options{display:flex;flex-direction:column;gap:12px;margin-top:15px}
  .option{background:#f5f5f5;padding:14px;border-radius:14px;text-align:center;cursor:pointer}
  .option:hover{background:#ff4081;color:#fff}
  .img-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}
  .img-option{border-radius:14px;overflow:hidden;cursor:pointer;border:2px solid transparent}
  .img-option:hover{border-color:#ff4081}
  .img-option{
    height:200px;
  }
  .img-option img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  #popup{
    position:fixed;inset:0;
    background:rgba(0,0,0,.55);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:10000;
  }
  .popup-box{
    background:#fff;width:80%;max-width:280px;
    border-radius:18px;padding:20px;text-align:center;
  }
  .popup-box h2{margin:0;color:#ff3b3b;font-size:18px}
  .popup-box p{margin:10px 0 15px;font-size:14px}
  .popup-box button{
    border:none;background:#ff4081;color:#fff;
    padding:10px 25px;border-radius:20px;font-size:14px;
  }
  .countdown-bar{
    height:8px;
    background:#ffd6d6;
    border-radius:4px;
    overflow:hidden;
    margin-top:14px;
  }
  .countdown-bar span{
    display:block;
    height:100%;
    width:0%;
    background:#ff3b3b;
    transition:width 2s linear;
  }
  .hero {
    position:relative;
    overflow:hidden;
    text-align:center;
    padding:60px 20px 40px;
    background:linear-gradient(135deg,#ff8ab3 0%,#ffc6d9 48%,#ff8ab3 100%);
    color:#fff;
    border-bottom-left-radius:50px;
    border-bottom-right-radius:50px;
    box-shadow:0 4px 12px rgba(0,0,0,0.15);
  }
  .hero::before {
    content:"♥";
    position:absolute;
    left:42px;
    top:34px;
    color:rgba(255,255,255,.32);
    font-size:94px;
    line-height:1;
    text-shadow:
      132px 12px 0 rgba(255,255,255,.2),
      244px 86px 0 rgba(255,255,255,.18),
      28px 210px 0 rgba(255,255,255,.16);
    transform:rotate(-12deg);
    pointer-events:none;
  }
  .hero::after {
    content:"♥  ♥  ♥";
    position:absolute;
    left:20%;
    bottom:18px;
    color:rgba(255,255,255,.5);
    font-size:20px;
    letter-spacing:24px;
    animation:floatHearts 5s ease-in-out infinite;
    pointer-events:none;
  }
  .hero > * {
    position:relative;
    z-index:1;
  }
  .hero img {
    width:100px;
    height:100px;
    border-radius:25px;
    margin-bottom:15px;
    box-shadow:0 4px 10px rgba(0,0,0,0.3);
  }
  .hero h1 { font-size:28px; margin:10px 0 5px; font-weight:700; text-shadow:0 3px 12px rgba(255,90,150,.38); }
  .hero p { font-size:16px; opacity:0.9; margin:0; }
  .download-btn {
    margin-top:25px; display:inline-block; padding:16px 60px;
    background:#fff; color:#ff4081; font-size:18px; font-weight:600;
    border-radius:35px; text-decoration:none;
    box-shadow:0 10px 24px rgba(255,92,150,.32), 0 4px 10px rgba(255,255,255,.45) inset;
    animation:bounce 1.5s infinite, softGlow 2.8s ease-in-out infinite;
  }
  @keyframes floatHearts {
    0%,100% { transform:translateY(0); opacity:.28; }
    50% { transform:translateY(-14px); opacity:.56; }
  }
  @keyframes softGlow {
    0%,100% { box-shadow:0 10px 24px rgba(255,92,150,.28), 0 4px 10px rgba(255,255,255,.45) inset; }
    50% { box-shadow:0 14px 32px rgba(255,92,150,.46), 0 4px 12px rgba(255,255,255,.6) inset; }
  }
  @keyframes bounce {
    0%,100% { transform:translateY(0); }
    50% { transform:translateY(-8px); }
  }
  .section { padding:30px 15px; text-align:center; }
  .section h2 { font-size:20px; font-weight:700; margin-bottom:20px; }
  .features { display:flex; justify-content:space-between; flex-wrap:nowrap; }
  .feature {
    flex:1; margin:0 5px; background:#fff; padding:15px;
    border-radius:15px; box-shadow:0 3px 10px rgba(0,0,0,0.06);
  }
  .feature svg { width:28px; height:28px; margin-bottom:8px; fill:#ff4081; }
  .feature h3 { font-size:15px; margin:8px 0; }
  .feature p { font-size:13px; color:#ff4081; }
  .screenshots {
    display:flex; overflow-x:auto; gap:15px; padding:20px;
    -webkit-overflow-scrolling:touch;
  }
  .screenshots img {
    width:260px; height:480px; border-radius:20px; flex-shrink:0;
    object-fit:cover; box-shadow:0 6px 20px rgba(0,0,0,0.15);
  }
  @media (min-width:768px) {
    body {
      background:
        radial-gradient(circle at 16% 18%, rgba(255, 190, 221, 0.95), transparent 24%),
        radial-gradient(circle at 84% 16%, rgba(191, 214, 255, 0.88), transparent 26%),
        radial-gradient(circle at 52% 84%, rgba(214, 194, 255, 0.72), transparent 28%),
        linear-gradient(145deg, #fffafc 0%, #f7f7ff 42%, #eef4ff 100%);
      overflow:hidden;
    }
    .phone-shell {
      position:fixed;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:20px;
      isolation:isolate;
      overflow:hidden;
    }
    .phone-shell::before,
    .phone-shell::after {
      content:"";
      position:absolute;
      border-radius:50%;
      filter:blur(10px);
      pointer-events:none;
      z-index:-1;
    }
    .phone-shell::before {
      width:320px;
      height:320px;
      top:8%;
      left:12%;
      background:radial-gradient(circle, rgba(255, 163, 204, 0.38) 0%, rgba(255, 163, 204, 0) 68%);
    }
    .phone-shell::after {
      width:380px;
      height:380px;
      right:10%;
      bottom:6%;
      background:radial-gradient(circle, rgba(125, 162, 255, 0.3) 0%, rgba(125, 162, 255, 0) 70%);
    }
    .phone-frame {
      position:relative;
      width:min(462px, calc(100vw - 40px));
      height:min(940px, calc(100vh - 40px));
      padding:14px;
      border-radius:56px;
      background:linear-gradient(155deg, #ffffff 0%, #f4f6f9 22%, #dfe4eb 52%, #ffffff 100%);
      box-shadow:
        0 30px 90px rgba(0, 0, 0, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.88),
        inset 0 0 0 1px rgba(255, 255, 255, 0.9);
      overflow:visible;
    }
    .phone-frame::before {
      content:"";
      position:absolute;
      inset:1px;
      border-radius:inherit;
      background:linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.55) 20%, rgba(199, 207, 218, 0.34) 52%, rgba(255, 255, 255, 0.72) 100%);
      pointer-events:none;
    }
    .phone-frame::after {
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.72),
        inset 0 0 0 4px rgba(214, 220, 229, 0.34);
      pointer-events:none;
    }
    .phone-screen {
      position:absolute;
      inset:14px;
      min-height:auto;
      height:auto;
      border-radius:42px;
      overflow:hidden;
      background:#fff;
      z-index:1;
      box-shadow:0 0 0 1px rgba(10, 12, 16, 0.08);
    }
    .page-scroll {
      height:100%;
      overflow-y:auto;
      overflow-x:hidden;
      -ms-overflow-style:none;
      scrollbar-width:none;
    }
    .page-scroll::-webkit-scrollbar {
      width:0;
      height:0;
    }
    .phone-screen #qa-layer,
    .phone-screen #popup {
      position:absolute;
    }
    .phone-island {
      display:block;
      position:absolute;
      top:24px;
      left:50%;
      width:132px;
      height:36px;
      transform:translateX(-50%);
      border-radius:999px;
      background:linear-gradient(180deg, #0b0b0d 0%, #000 100%);
      box-shadow:
        inset 0 1px 1px rgba(255, 255, 255, 0.08),
        0 6px 16px rgba(0, 0, 0, 0.35);
      z-index:3;
      pointer-events:none;
    }
    .phone-island::before {
      content:"";
      position:absolute;
      top:50%;
      left:24px;
      width:10px;
      height:10px;
      transform:translateY(-50%);
      border-radius:50%;
      background:radial-gradient(circle at 30% 30%, #3c4859, #12151b 58%, #020304 100%);
      opacity:.95;
    }
    .phone-island::after {
      content:"";
      position:absolute;
      top:50%;
      right:24px;
      width:46px;
      height:8px;
      transform:translateY(-50%);
      border-radius:999px;
      background:rgba(255, 255, 255, 0.08);
    }
    .phone-home-indicator {
      display:block;
      position:absolute;
      bottom:18px;
      left:50%;
      width:132px;
      height:5px;
      transform:translateX(-50%);
      border-radius:999px;
      background:rgba(18, 20, 24, 0.58);
      z-index:3;
      pointer-events:none;
    }
    .phone-side-button {
      display:block;
      position:absolute;
      width:4px;
      border-radius:999px;
      background:linear-gradient(180deg, #f9fafb 0%, #cfd5de 28%, #8d95a1 100%);
      box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.18);
      z-index:0;
      pointer-events:none;
    }
    .phone-side-button--mute {
      left:-2px;
      top:136px;
      height:28px;
    }
    .phone-side-button--volume-up {
      left:-2px;
      top:188px;
      height:66px;
    }
    .phone-side-button--volume-down {
      left:-2px;
      top:268px;
      height:66px;
    }
    .phone-side-button--power {
      right:-2px;
      top:208px;
      height:96px;
    }
    .screenshots {
      justify-content:flex-start;
      overflow-x:auto;
      padding:20px;
    }
    .screenshots img {
      width:260px;
      height:480px;
    }
  }
  .reviews { max-width:600px; margin:0 auto; text-align:left; }
  .review-item {
    background:#fff; border-radius:15px; padding:15px; margin-bottom:15px;
    box-shadow:0 4px 12px rgba(0,0,0,0.08);
  }
  .review-item b { display:block; margin-bottom:8px; color:#ff4081; font-size:16px; font-weight:600; }
  .review-item p { margin:0; font-size:14px; color:#444; line-height:1.5; }
  .info-list { list-style:none; padding:0; margin:20px auto; font-size:14px; max-width:500px; }
  .info-list li { display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid #eee; }
  .footer { text-align:center; font-size:12px; color:#888; padding:10px 15px; margin-top:5px; }
  #wechat-mask { display:none; }
  .wechat-mask-bg {
    position:fixed; top:0; left:0; right:0; bottom:0;
    background:rgba(0,0,0,.5); z-index:10001;
  }
  .wechat-mask-pop {
    position:fixed; top:50%; left:50%; width:85%; max-width:320px;
    transform:translate(-50%,-50%); background:#fff; border-radius:20px;
    z-index:10002; overflow:hidden; padding:24px;
  }
  .wechat-mask-header { display:flex; align-items:center; margin-bottom:20px; }
  .wechat-mask-logo { width:50px; height:50px; border-radius:12px; }
  .wechat-mask-info { margin-left:12px; }
  .wechat-mask-title { font-size:16px; font-weight:600; color:#333; }
  .wechat-mask-subtitle { font-size:13px; color:#999; margin-top:4px; }
  .wechat-mask-steps { background:#f7f8fa; border-radius:12px; padding:16px; }
  .wechat-mask-steps p { font-size:14px; color:#333; line-height:2; display:flex; align-items:center; }
  .wechat-mask-steps b { color:#ff4081; }
  .step-num {
    display:inline-flex; align-items:center; justify-content:center;
    width:20px; height:20px; background:#ff4081; color:#fff; border-radius:50%;
    font-size:12px; font-weight:600; margin-right:8px; flex-shrink:0;
  }
  .wechat-mask-divider {
    text-align:center; margin:18px 0; position:relative; font-size:12px; color:#ccc;
  }
  .wechat-mask-divider::before, .wechat-mask-divider::after {
    content:''; position:absolute; top:50%; width:25%; height:1px; background:#e5e5e5;
  }
  .wechat-mask-divider::before { left:0; }
  .wechat-mask-divider::after { right:0; }
  .wechat-mask-copy {
    position:relative; height:40px; background:#f1f6f9; border-radius:20px; overflow:hidden;
  }
  .wechat-mask-copy input {
    width:100%; height:100%; border:none; outline:none; background:transparent;
    padding:0 80px 0 16px; font-size:13px; color:#999;
  }
  .wechat-mask-copy button {
    position:absolute; right:0; top:0; height:100%; padding:0 18px;
    background:linear-gradient(90deg,#ff6cab,#ff4081); color:#fff; border:none;
    border-radius:0 20px 20px 0; font-size:14px; font-weight:500; cursor:pointer;
  }
  @keyframes fadeIn{from{opacity:0}to{opacity:1}}
  @keyframes popIn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
  #net-modal-btn:active{transform:scale(.96)}