:root {
  --bg: #f6f7f9;
  --card: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --border: #e5e7eb;
  --primary: #1a73e8;
  --primary-2: #0b5bd3;
  --danger: #dc2626;
  --radius: 14px;
  --shadow: 0 10px 28px rgba(0, 0, 0, 0.08);
  --max: 1040px;
}

* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto,
    Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color: var(--text);
  background: var(--bg);
}

.theme-android {
  --primary: #0f9d58;
  --primary-2: #0b7a44;
}

.theme-ios {
  --primary: #0a84ff;
  --primary-2: #0066cc;
}

a {
  color: inherit;
}

.page {
  padding: 16px;
}

.container {
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
}

.page-center {
  display: grid;
  place-items: center;
}

.card {
  width: min(560px, 100%);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px 16px;
}

.h1 {
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.2;
}

.h2 {
  margin: 0 0 8px;
  font-size: 18px;
}

.muted {
  color: var(--muted);
  margin: 0 0 14px;
  line-height: 1.5;
  font-size: 14px;
}

.row {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.row-spread {
  justify-content: space-between;
}

.btn {
  appearance: none;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--text);
  padding: 10px 14px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 650;
  font-size: 14px;
  cursor: pointer;
}

.btn:hover {
  border-color: #cbd5e1;
}

.btn:active {
  transform: translateY(1px);
}

.btn-primary {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.btn-primary:hover {
  background: var(--primary-2);
  border-color: var(--primary-2);
}

.btn-lg {
  padding: 12px 16px;
  font-size: 15px;
}

.btn-danger {
  background: var(--danger);
  border-color: var(--danger);
  color: #fff;
}

.link {
  font-size: 14px;
  color: var(--primary);
  text-decoration: none;
}

.link:hover {
  text-decoration: underline;
}

.store-shell {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.store-header {
  padding: 16px;
  border-bottom: 1px solid var(--border);
}

.theme-android .store-header {
  background: radial-gradient(900px 260px at 18% 10%, rgba(134, 239, 172, 0.55) 0%, rgba(134, 239, 172, 0) 58%),
    radial-gradient(800px 260px at 92% 40%, rgba(16, 185, 129, 0.22) 0%, rgba(16, 185, 129, 0) 58%),
    #ffffff;
}

.theme-ios .store-header {
  background: radial-gradient(900px 260px at 18% 10%, rgba(147, 197, 253, 0.55) 0%, rgba(147, 197, 253, 0) 60%),
    radial-gradient(800px 260px at 92% 40%, rgba(99, 102, 241, 0.18) 0%, rgba(99, 102, 241, 0) 58%),
    #ffffff;
}

.theme-ios .store-shell {
  border-radius: 22px;
}

.theme-ios .store-header {
  background: #ffffff;
}

.theme-ios .brand {
  min-width: 0;
  flex: 1 1 auto;
}

.theme-ios .logo {
  width: 96px;
  height: 96px;
  border-radius: 22px;
  background: #f2f2f7;
  border-color: rgba(209, 213, 219, 0.8);
}

.theme-ios .title {
  gap: 6px;
  min-width: 0;
  width: 100%;
}

.theme-ios .title .dev {
  color: var(--primary);
  font-weight: 650;
}

.theme-ios .title .name {
  font-size: 22px;
  font-weight: 850;
  letter-spacing: -0.2px;
}

.ios-get {
  appearance: none;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  height: 36px;
  padding: 0 18px;
  border-radius: 999px;
  background: #38bdf8;
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.ios-get:hover {
  background: #0ea5e9;
}

.ios-get:active {
  transform: translateY(1px);
}

.ios-get.is-disabled {
  background: #d1d1d6;
  color: #ffffff;
  cursor: not-allowed;
  pointer-events: none;
}

.ios-get-mini {
  height: 26px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 850;
}

.ios-toolbar {
  align-items: center;
  margin-right: 26px;
}

.theme-ios .store-header-top {
  flex-wrap: nowrap;
}

@media (max-width: 420px) {
  .theme-ios .store-header-top {
    flex-wrap: wrap;
  }
}

.theme-ios .badge {
  border: 0;
  padding: 0;
  gap: 8px;
  color: rgba(17, 24, 39, 0.74);
}

.theme-ios .stars {
  letter-spacing: 0.6px;
}

.ios-stats {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid rgba(229, 231, 235, 0.9);
  padding-top: 14px;
}

.theme-ios .stat {
  border: 0;
  padding: 6px 6px;
  min-width: 0;
  text-align: center;
  position: relative;
  border-radius: 0;
}

.theme-ios .stat::after {
  content: "";
  position: absolute;
  top: 8px;
  right: 0;
  bottom: 8px;
  width: 1px;
  background: rgba(229, 231, 235, 0.9);
}

.theme-ios .stat:last-child::after {
  display: none;
}

.theme-ios .stat .k {
  font-size: 11px;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: rgba(107, 114, 128, 0.9);
}

.theme-ios .stat .v {
  font-size: 16px;
  font-weight: 850;
}

.theme-ios .notice {
  background: #f2f2f7;
  border: 0;
  color: rgba(17, 24, 39, 0.74);
  border-radius: 14px;
}

.theme-ios .section {
  border-top-color: rgba(229, 231, 235, 0.85);
}

.theme-ios .review {
  border-radius: 16px;
  background: #f2f2f7;
  border: 0;
}

.theme-ios .review .meta {
  color: rgba(107, 114, 128, 0.9);
}

.theme-ios .store-body {
  background: #ffffff;
}

.theme-ios #iosNotice,
.theme-ios .desc,
.theme-ios .reviews {
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

.ios-preview {
  position: relative;
  overflow: hidden;
  padding: 4px 0 10px;
  user-select: none;
}

.ios-preview.is-dragging,
.ios-preview.is-dragging * {
  cursor: grabbing;
}

.ios-preview-track {
  display: flex;
  gap: 12px;
  padding: 0 2px;
  will-change: transform;
  transform: translate3d(0, 0, 0);
}

.ios-preview-track.is-animating {
  transition: transform 280ms ease;
}

.ios-preview-item {
  flex: 0 0 auto;
  width: min(68vw, 260px);
  aspect-ratio: 9 / 16;
  border-radius: 18px;
  overflow: hidden;
  background: #f2f2f7;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
}

.ios-preview-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
  -webkit-user-drag: none;
}

.ios-preview-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 10px;
}

.ios-preview-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(107, 114, 128, 0.34);
}

.ios-preview-dot.is-active {
  width: 16px;
  background: rgba(10, 132, 255, 0.95);
}

.store-header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.brand {
  display: flex;
  gap: 12px;
  align-items: center;
  min-width: 260px;
}

.logo {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  background: #f3f4f6;
  border: 1px solid var(--border);
  overflow: hidden;
  flex: 0 0 auto;
}

.logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.shots-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.shot {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  overflow: hidden;
  background: #f3f4f6;
  border: 1px solid var(--border);
  position: relative;
  flex: 0 0 auto;
}

.shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.shot-del {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 0;
  background: rgba(17, 24, 39, 0.72);
  color: #ffffff;
  font-weight: 900;
  cursor: pointer;
  display: grid;
  place-items: center;
  line-height: 1;
}

.shot-del:active {
  transform: translateY(1px);
}

.title {
  display: grid;
  gap: 3px;
}

.title .name {
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
}

.title .dev {
  font-size: 13px;
  color: var(--muted);
}

.stats {
  display: flex;
  gap: 10px;
  align-items: stretch;
  flex-wrap: wrap;
}

.stat {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  min-width: 120px;
}

.stat .k {
  font-size: 12px;
  color: var(--muted);
}

.stat .v {
  font-size: 15px;
  font-weight: 780;
  margin-top: 2px;
}

.store-body {
  padding: 16px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr);
}

.section {
  border-top: 1px solid var(--border);
  padding-top: 14px;
}

.section:first-child {
  border-top: none;
  padding-top: 0;
}

.desc {
  color: #1f2937;
  line-height: 1.7;
  font-size: 14px;
  white-space: pre-wrap;
}

.notice {
  background: #f0f7ff;
  border: 1px solid #dbeafe;
  color: #0f3d76;
  padding: 12px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.6;
}

.reviews {
  display: grid;
  gap: 10px;
}

.review {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
}

.review .top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.review .user {
  font-weight: 750;
}

.review .meta {
  color: var(--muted);
  font-size: 12px;
}

.review .content {
  margin-top: 8px;
  line-height: 1.7;
  font-size: 14px;
  white-space: pre-wrap;
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 13px;
}

.stars {
  letter-spacing: 1px;
}

.grid2 {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
}

.form {
  display: grid;
  gap: 10px;
}

.field {
  display: grid;
  gap: 6px;
}

.field label {
  font-size: 12px;
  color: var(--muted);
}

.input,
.textarea,
.select {
  width: 100%;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 12px;
  padding: 10px 12px;
  font-size: 14px;
  outline: none;
}

.textarea {
  min-height: 120px;
  resize: vertical;
  line-height: 1.6;
}

.input:focus,
.textarea:focus,
.select:focus {
  border-color: #93c5fd;
  box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15);
}

.toolbar {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.hr {
  height: 1px;
  background: var(--border);
  border: 0;
  margin: 10px 0;
}

.china-home {
  --primary: #16a34a;
  --primary-2: #15803d;
  --bg: #07130c;
  color: #e8fff1;
  background: radial-gradient(1200px 700px at 16% 8%, rgba(34, 197, 94, 0.35) 0%, rgba(34, 197, 94, 0) 56%),
    radial-gradient(1200px 700px at 92% 28%, rgba(16, 185, 129, 0.18) 0%, rgba(16, 185, 129, 0) 55%),
    linear-gradient(180deg, #07130c 0%, #07130c 22%, #071a10 100%);
  min-height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.china-home .muted {
  color: rgba(232, 255, 241, 0.76);
}

.china-bg {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 1px 1px, rgba(232, 255, 241, 0.07) 1px, transparent 0);
  background-size: 24px 24px;
  opacity: 0.7;
  mask-image: radial-gradient(closest-side, rgba(0, 0, 0, 0.92), transparent 72%);
}

.china-wrap {
  min-height: calc(100vh - 32px);
  display: grid;
  align-items: center;
  position: relative;
}

.china-hero {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 22px;
  border-radius: 24px;
  border: 1px solid rgba(232, 255, 241, 0.14);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.03) 100%);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.38);
  overflow: hidden;
}

.china-hero-content {
  padding: 26px 22px 22px;
}

.china-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.china-logo {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(232, 255, 241, 0.18);
  background: radial-gradient(18px 18px at 30% 30%, rgba(232, 255, 241, 0.32) 0%, rgba(232, 255, 241, 0) 70%),
    linear-gradient(135deg, rgba(34, 197, 94, 0.28) 0%, rgba(16, 185, 129, 0.12) 70%);
  overflow: hidden;
  display: grid;
  place-items: center;
}

.china-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.china-brand-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.china-brand-sub {
  font-size: 13px;
  color: rgba(232, 255, 241, 0.72);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.china-brand-app {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.china-title {
  margin: 16px 0 8px;
  font-size: 42px;
  line-height: 1.08;
  letter-spacing: 0.4px;
}

.china-lead {
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: rgba(232, 255, 241, 0.88);
}

.china-desc {
  margin: 12px 0 0;
}

.china-actions {
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.china-btn {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 14px;
  border: 1px solid rgba(232, 255, 241, 0.18);
}

.china-btn-ghost {
  background: rgba(255, 255, 255, 0.06);
  color: #e8fff1;
  border-color: rgba(232, 255, 241, 0.18);
}

.china-btn-ghost:hover {
  border-color: rgba(232, 255, 241, 0.28);
  background: rgba(255, 255, 255, 0.08);
}

.china-note {
  margin: 16px 0 0;
  padding-top: 14px;
  border-top: 1px solid rgba(232, 255, 241, 0.12);
}

.china-hero-media {
  padding: 18px;
  display: grid;
  gap: 12px;
  align-content: center;
  background: radial-gradient(800px 360px at 70% 30%, rgba(34, 197, 94, 0.20) 0%, rgba(34, 197, 94, 0) 62%),
    radial-gradient(700px 320px at 30% 70%, rgba(16, 185, 129, 0.18) 0%, rgba(16, 185, 129, 0) 62%);
}

.china-hero-art {
  aspect-ratio: 4 / 3;
  border-radius: 20px;
  border: 1px solid rgba(232, 255, 241, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='900' viewBox='0 0 1200 900'%3E%3Cdefs%3E%3ClinearGradient id='sky' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%230b2a17'/%3E%3Cstop offset='0.65' stop-color='%23072412'/%3E%3Cstop offset='1' stop-color='%2306150d'/%3E%3C/linearGradient%3E%3ClinearGradient id='mist' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.26'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='river' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%2322c55e' stop-opacity='0.35'/%3E%3Cstop offset='1' stop-color='%2310b981' stop-opacity='0.12'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1200' height='900' fill='url(%23sky)'/%3E%3Ccircle cx='920' cy='210' r='90' fill='%23b7ffd8' fill-opacity='0.20'/%3E%3Ccircle cx='920' cy='210' r='54' fill='%23b7ffd8' fill-opacity='0.14'/%3E%3Cpath d='M0 560 C220 470 340 520 520 440 C700 360 870 420 1020 360 C1110 324 1160 330 1200 340 L1200 900 L0 900 Z' fill='%2310b981' fill-opacity='0.22'/%3E%3Cpath d='M0 610 C190 520 360 590 540 510 C720 430 900 520 1080 450 C1145 425 1185 420 1200 420 L1200 900 L0 900 Z' fill='%2322c55e' fill-opacity='0.18'/%3E%3Cpath d='M140 900 C220 780 260 690 360 620 C470 546 560 560 650 540 C760 514 840 455 1000 470 C1090 480 1150 510 1200 540 L1200 900 Z' fill='url(%23river)'/%3E%3Cpath d='M0 520 H1200' stroke='url(%23mist)' stroke-width='32' stroke-linecap='round'/%3E%3Cpath d='M0 610 H1200' stroke='url(%23mist)' stroke-width='26' stroke-linecap='round' opacity='0.7'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
}

.china-hero-photo {
  aspect-ratio: 16 / 9;
  border-radius: 20px;
  border: 1px solid rgba(232, 255, 241, 0.14);
  background: radial-gradient(600px 260px at 25% 35%, rgba(34, 197, 94, 0.40) 0%, rgba(34, 197, 94, 0) 60%),
    radial-gradient(700px 280px at 80% 55%, rgba(16, 185, 129, 0.24) 0%, rgba(16, 185, 129, 0) 62%),
    linear-gradient(135deg, rgba(232, 255, 241, 0.10) 0%, rgba(232, 255, 241, 0.04) 100%);
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.24);
}

.china-home-v2 .container {
  max-width: 1120px;
}

.china-layout {
  min-height: calc(100vh - 32px);
  display: grid;
  align-content: start;
  gap: 16px;
  position: relative;
}

.china-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 6px 6px;
}

.china-topbar-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.china-topbar-brand {
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0.5px;
  color: rgba(232, 255, 241, 0.88);
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(232, 255, 241, 0.14);
  background: rgba(255, 255, 255, 0.05);
}

.china-topbar-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.china-topbar-sub {
  font-size: 13px;
  color: rgba(232, 255, 241, 0.76);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.china-topbar-app {
  font-size: 15px;
  font-weight: 850;
  letter-spacing: 0.2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.china-topbar-right {
  font-size: 13px;
  color: rgba(232, 255, 241, 0.62);
  white-space: nowrap;
}

.china-hero2 {
  position: relative;
  border-radius: 26px;
  border: 1px solid rgba(232, 255, 241, 0.14);
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.03) 100%);
  box-shadow: 0 34px 110px rgba(0, 0, 0, 0.45);
}

.china-hero2-bg {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='900' viewBox='0 0 1400 900'%3E%3Cdefs%3E%3ClinearGradient id='g0' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%230b2414'/%3E%3Cstop offset='0.55' stop-color='%2307120c'/%3E%3Cstop offset='1' stop-color='%23060f0b'/%3E%3C/linearGradient%3E%3CradialGradient id='sun' cx='78%25' cy='24%25' r='60%25'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.22'/%3E%3Cstop offset='0.55' stop-color='%23b7ffd8' stop-opacity='0.04'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='h1' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0' stop-color='%2322c55e' stop-opacity='0.22'/%3E%3Cstop offset='1' stop-color='%2310b981' stop-opacity='0.10'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1400' height='900' fill='url(%23g0)'/%3E%3Crect width='1400' height='900' fill='url(%23sun)'/%3E%3Cpath d='M0 560 C210 470 350 520 540 440 C730 360 910 420 1090 350 C1220 300 1320 310 1400 330 L1400 900 L0 900 Z' fill='%2310b981' fill-opacity='0.22'/%3E%3Cpath d='M0 630 C200 540 380 610 570 530 C760 450 950 560 1140 480 C1240 438 1320 430 1400 450 L1400 900 L0 900 Z' fill='%2322c55e' fill-opacity='0.18'/%3E%3Cpath d='M90 900 C190 770 260 700 360 640 C470 574 560 590 650 568 C760 540 860 470 1010 490 C1140 508 1260 570 1400 650 L1400 900 Z' fill='url(%23h1)'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  filter: saturate(1.08) contrast(1.02);
  opacity: 0.95;
}

.china-hero2-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(1000px 520px at 18% 22%, rgba(34, 197, 94, 0.22) 0%, rgba(34, 197, 94, 0) 62%),
    radial-gradient(900px 520px at 78% 35%, rgba(16, 185, 129, 0.18) 0%, rgba(16, 185, 129, 0) 62%),
    linear-gradient(90deg, rgba(6, 15, 11, 0.88) 0%, rgba(6, 15, 11, 0.44) 52%, rgba(6, 15, 11, 0.78) 100%);
}

.china-hero2-content {
  position: relative;
  padding: 34px 30px 28px;
  max-width: 720px;
}

.china-hero2-title {
  margin: 6px 0 10px;
  font-size: 48px;
  line-height: 1.05;
  letter-spacing: 0.6px;
}

.china-hero2-lead {
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: rgba(232, 255, 241, 0.92);
}

.china-hero2-desc {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.7;
  color: rgba(232, 255, 241, 0.78);
}

.china-hero2-actions {
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  max-width: 520px;
}

.china-hero2-btn {
  border-radius: 14px;
  border-color: rgba(232, 255, 241, 0.18);
  width: 100%;
  justify-content: center;
  display: inline-flex;
}

.china-hero2-btn-ghost {
  background: rgba(255, 255, 255, 0.06);
  color: #e8fff1;
  border-color: rgba(232, 255, 241, 0.18);
}

.china-hero2-btn-ghost:hover {
  border-color: rgba(232, 255, 241, 0.28);
  background: rgba(255, 255, 255, 0.08);
}

.china-hero2-note {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(232, 255, 241, 0.14);
  font-size: 14px;
  line-height: 1.75;
  color: rgba(232, 255, 241, 0.74);
}

.china-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}

.china-gallery-card {
  min-height: 150px;
  border-radius: 20px;
  border: 1px solid rgba(232, 255, 241, 0.14);
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28);
  overflow: hidden;
  position: relative;
  padding: 16px;
  display: grid;
  align-content: end;
  gap: 4px;
}

.china-gallery-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 15, 11, 0.05) 0%, rgba(6, 15, 11, 0.70) 100%);
}

.china-gallery-title,
.china-gallery-sub {
  position: relative;
  z-index: 1;
}

.china-gallery-title {
  font-weight: 900;
  letter-spacing: 0.2px;
}

.china-gallery-sub {
  font-size: 13px;
  color: rgba(232, 255, 241, 0.78);
}

.china-photo-1 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='900' viewBox='0 0 1400 900'%3E%3Cdefs%3E%3ClinearGradient id='sky' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23091f12'/%3E%3Cstop offset='0.62' stop-color='%2307130c'/%3E%3Cstop offset='1' stop-color='%23060f0b'/%3E%3C/linearGradient%3E%3CradialGradient id='sun' cx='72%25' cy='22%25' r='60%25'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.28'/%3E%3Cstop offset='0.55' stop-color='%23b7ffd8' stop-opacity='0.06'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='mist' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.22'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1400' height='900' fill='url(%23sky)'/%3E%3Crect width='1400' height='900' fill='url(%23sun)'/%3E%3Cpath d='M0 620 C220 500 360 560 520 460 C700 340 860 430 1020 360 C1200 280 1300 300 1400 330 L1400 900 L0 900 Z' fill='%2310b981' fill-opacity='0.26'/%3E%3Cpath d='M0 700 C220 560 380 660 560 560 C740 460 960 600 1140 500 C1240 445 1320 430 1400 460 L1400 900 L0 900 Z' fill='%2322c55e' fill-opacity='0.20'/%3E%3Cpath d='M120 900 C220 780 260 700 370 630 C490 552 600 590 690 560 C810 520 880 430 1030 460 C1180 500 1290 590 1400 660 L1400 900 Z' fill='%2322c55e' fill-opacity='0.14'/%3E%3Cpath d='M0 560 H1400' stroke='url(%23mist)' stroke-width='34' stroke-linecap='round'/%3E%3Cpath d='M0 640 H1400' stroke='url(%23mist)' stroke-width='26' stroke-linecap='round' opacity='0.75'/%3E%3C/svg%3E"),
    radial-gradient(700px 260px at 30% 20%, rgba(34, 197, 94, 0.20) 0%, rgba(34, 197, 94, 0) 60%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%);
  background-size: cover;
  background-position: center;
}

.china-photo-2 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='900' viewBox='0 0 1400 900'%3E%3Cdefs%3E%3ClinearGradient id='sky' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%230a2414'/%3E%3Cstop offset='0.6' stop-color='%2307130c'/%3E%3Cstop offset='1' stop-color='%23060f0b'/%3E%3C/linearGradient%3E%3CradialGradient id='glow' cx='28%25' cy='20%25' r='55%25'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.22'/%3E%3Cstop offset='0.65' stop-color='%23b7ffd8' stop-opacity='0.04'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='fog' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.18'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1400' height='900' fill='url(%23sky)'/%3E%3Crect width='1400' height='900' fill='url(%23glow)'/%3E%3Cpath d='M0 760 C130 720 210 760 330 730 C450 700 520 640 620 660 C720 680 820 760 920 740 C1040 720 1100 650 1220 660 C1320 668 1360 690 1400 700 L1400 900 L0 900 Z' fill='%23081a10' fill-opacity='0.65'/%3E%3Cpath d='M0 820 C160 770 260 820 400 800 C540 780 640 720 780 740 C920 760 1020 830 1160 810 C1280 792 1340 770 1400 780 L1400 900 L0 900 Z' fill='%2306150d' fill-opacity='0.78'/%3E%3Cg fill='%2322c55e' fill-opacity='0.26'%3E%3Cpath d='M160 780 l40-120 40 120z'/%3E%3Cpath d='M250 790 l46-140 46 140z'/%3E%3Cpath d='M350 778 l40-126 40 126z'/%3E%3Cpath d='M460 800 l52-160 52 160z'/%3E%3Cpath d='M580 792 l46-142 46 142z'/%3E%3Cpath d='M710 806 l58-178 58 178z'/%3E%3Cpath d='M860 792 l50-154 50 154z'/%3E%3Cpath d='M1010 800 l44-136 44 136z'/%3E%3Cpath d='M1120 790 l52-160 52 160z'/%3E%3Cpath d='M1240 802 l46-142 46 142z'/%3E%3C/g%3E%3Cpath d='M0 700 H1400' stroke='url(%23fog)' stroke-width='28' stroke-linecap='round' opacity='0.9'/%3E%3C/svg%3E"),
    radial-gradient(700px 260px at 70% 20%, rgba(16, 185, 129, 0.20) 0%, rgba(16, 185, 129, 0) 60%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%);
  background-size: cover;
  background-position: center;
}

.china-photo-3 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='900' viewBox='0 0 1400 900'%3E%3Cdefs%3E%3ClinearGradient id='sky' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23092013'/%3E%3Cstop offset='0.62' stop-color='%2307130c'/%3E%3Cstop offset='1' stop-color='%23060f0b'/%3E%3C/linearGradient%3E%3CradialGradient id='light' cx='70%25' cy='18%25' r='55%25'%3E%3Cstop offset='0' stop-color='%23b7ffd8' stop-opacity='0.18'/%3E%3Cstop offset='0.65' stop-color='%23b7ffd8' stop-opacity='0.04'/%3E%3Cstop offset='1' stop-color='%23b7ffd8' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='water' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%2322c55e' stop-opacity='0.26'/%3E%3Cstop offset='0.55' stop-color='%2310b981' stop-opacity='0.18'/%3E%3Cstop offset='1' stop-color='%233b82f6' stop-opacity='0.14'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='1400' height='900' fill='url(%23sky)'/%3E%3Crect width='1400' height='900' fill='url(%23light)'/%3E%3Cpath d='M0 520 C220 450 360 520 520 470 C700 420 820 470 980 430 C1140 390 1260 400 1400 420 L1400 900 L0 900 Z' fill='%2310b981' fill-opacity='0.18'/%3E%3Cpath d='M0 600 C220 520 380 620 560 560 C740 500 960 650 1140 560 C1240 510 1320 500 1400 530 L1400 900 L0 900 Z' fill='url(%23water)'/%3E%3Cg stroke='%23b7ffd8' stroke-opacity='0.22' stroke-width='6' fill='none'%3E%3Cpath d='M120 660 C200 630 260 640 340 620 C420 600 500 610 580 590'/%3E%3Cpath d='M240 720 C330 690 410 700 500 680 C590 660 670 670 760 650'/%3E%3Cpath d='M420 770 C520 740 610 750 710 730 C810 710 900 720 1000 700'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(700px 260px at 40% 20%, rgba(34, 197, 94, 0.16) 0%, rgba(34, 197, 94, 0) 60%),
    radial-gradient(700px 260px at 80% 60%, rgba(59, 130, 246, 0.12) 0%, rgba(59, 130, 246, 0) 62%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%);
  background-size: cover;
  background-position: center;
}

@media (max-width: 860px) {
  .china-hero {
    grid-template-columns: 1fr;
  }
  .china-hero-content {
    padding: 22px 16px 16px;
  }
  .china-hero-media {
    padding: 0 16px 16px;
  }
  .china-title {
    font-size: 36px;
  }

  .china-topbar-right {
    display: none;
  }

  .china-hero2-content {
    padding: 26px 18px 18px;
    max-width: 100%;
  }

  .china-hero2-title {
    font-size: 40px;
  }

  .china-gallery {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .china-wrap {
    min-height: 100vh;
    align-items: start;
    padding-top: calc(env(safe-area-inset-top) + 10px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 14px);
  }
  .china-hero {
    border-radius: 20px;
  }
  .china-title {
    font-size: 32px;
  }
  .china-actions {
    grid-template-columns: 1fr;
  }

  .china-layout {
    min-height: 100vh;
    padding-top: calc(env(safe-area-inset-top) + 10px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 14px);
  }

  .china-hero2 {
    border-radius: 22px;
  }

  .china-hero2-title {
    font-size: 34px;
  }

  .china-hero2-actions {
    grid-template-columns: 1fr;
    max-width: 100%;
  }
}

.landing {
  min-height: 100%;
  position: relative;
  overflow: hidden;
  background: radial-gradient(1200px 600px at 20% 10%, #dbeafe 0%, rgba(219, 234, 254, 0) 55%),
    radial-gradient(900px 520px at 90% 30%, #fce7f3 0%, rgba(252, 231, 243, 0) 55%),
    linear-gradient(180deg, #ffffff 0%, #f6f7f9 55%, #f6f7f9 100%);
}

.landing-bg {
  position: absolute;
  inset: -120px;
  background-image: radial-gradient(circle at 1px 1px, rgba(17, 24, 39, 0.06) 1px, transparent 0);
  background-size: 22px 22px;
  opacity: 0.6;
  pointer-events: none;
  mask-image: radial-gradient(closest-side, rgba(0, 0, 0, 0.92), transparent 72%);
}

.landing-wrap {
  min-height: calc(100vh - 32px);
  display: grid;
  place-items: center;
  position: relative;
}

.landing-card {
  width: min(760px, 100%);
  border-radius: 20px;
  border: 1px solid rgba(229, 231, 235, 0.8);
  background: rgba(255, 255, 255, 0.76);
  backdrop-filter: blur(14px);
  box-shadow: 0 18px 60px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.landing-top {
  padding: 18px 18px 0;
}

.landing-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.landing-body {
  padding: 16px 18px 18px;
  display: grid;
  gap: 14px;
}

.landing-lead {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
}

.landing-desc {
  margin: 10px 0 0;
  max-width: 66ch;
}

.landing-actions {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr;
}

.landing-platforms {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
}

.platform-card {
  text-decoration: none;
  border-radius: 18px;
  border: 1px solid rgba(229, 231, 235, 0.9);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
  padding: 14px;
  display: grid;
  gap: 12px;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.platform-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 44px rgba(15, 23, 42, 0.14);
  border-color: rgba(203, 213, 225, 0.95);
}

.platform-top {
  display: flex;
  gap: 12px;
  align-items: center;
}

.platform-icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 18px;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.5);
}

.platform-meta {
  display: grid;
  gap: 2px;
}

.platform-title {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.2px;
}

.platform-sub {
  font-size: 13px;
  color: rgba(17, 24, 39, 0.65);
}

.platform-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 14px;
  border: 1px solid rgba(229, 231, 235, 0.9);
  background: rgba(255, 255, 255, 0.68);
}

.platform-android {
  background: radial-gradient(900px 260px at 20% 10%, rgba(134, 239, 172, 0.6) 0%, rgba(134, 239, 172, 0) 55%),
    radial-gradient(760px 260px at 95% 40%, rgba(16, 185, 129, 0.28) 0%, rgba(16, 185, 129, 0) 55%),
    rgba(255, 255, 255, 0.72);
}

.platform-ios {
  background: radial-gradient(900px 260px at 20% 10%, rgba(147, 197, 253, 0.55) 0%, rgba(147, 197, 253, 0) 60%),
    radial-gradient(760px 260px at 95% 40%, rgba(99, 102, 241, 0.22) 0%, rgba(99, 102, 241, 0) 55%),
    rgba(255, 255, 255, 0.72);
}

.landing-foot {
  display: flex;
  justify-content: flex-start;
}

@media (max-width: 520px) {
  .landing-wrap {
    min-height: 100vh;
    place-items: start center;
    padding-top: calc(env(safe-area-inset-top) + 10px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 14px);
  }

  .landing-bg {
    inset: -70px;
    opacity: 0.42;
    background-size: 20px 20px;
  }

  .landing-card {
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(10px);
    box-shadow: 0 14px 44px rgba(15, 23, 42, 0.12);
  }

  .landing-top {
    padding: 16px 14px 0;
  }

  .landing-body {
    padding: 14px 14px 16px;
    gap: 12px;
  }

  .landing .brand {
    min-width: 0;
  }

  .landing .logo {
    width: 56px;
    height: 56px;
    border-radius: 16px;
  }

  .landing-desc {
    margin-top: 8px;
  }

  .platform-card {
    padding: 12px;
    border-radius: 16px;
  }

  .platform-cta {
    height: 40px;
  }
}

@media (min-width: 860px) {
  .store-header {
    padding: 20px;
  }
  .store-body {
    padding: 20px;
  }
  .grid2 {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }

  .landing-top {
    padding: 24px 24px 0;
  }
  .landing-body {
    padding: 18px 24px 24px;
  }
  .landing-actions {
    grid-template-columns: 1fr 1fr;
  }

  .landing-platforms {
    grid-template-columns: 1fr 1fr;
  }
}
