.landing-page .ep-legend,
.landing-page .hero-meta,
.landing-page .airing-info {
  flex-wrap: wrap;
}

.landing-page .rel-map-container {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.landing-page .rel-map-container .rel-lines {
  width: 960px;
  min-width: 960px;
}

.landing-page .back-to-top {
  right: 16px;
  bottom: max(20px, env(safe-area-inset-bottom));
}

.landing-page .btn-compact {
  min-height: 44px;
  padding: 12px 20px;
}

.landing-page .progress-fill--45 {
  width: 45%;
}

.landing-page .landing-meta-note {
  font-size: 14px;
  opacity: 0.5;
}

.landing-page .landing-subtitle-spaced {
  margin-bottom: 32px;
}

.landing-page .landing-subtitle-tight {
  margin-bottom: 24px;
}

.landing-page .landing-subtitle-soft {
  color: #a09b96;
}

.landing-page .landing-cta-wrap {
  margin-top: 32px;
  text-align: center;
}

.landing-page .landing-note {
  font-size: 14px;
  line-height: 1.7;
  color: var(--warm-gray);
}

.landing-page .landing-note-center {
  text-align: center;
}

.landing-page .landing-note-soft {
  color: #a09b96;
}

.landing-page .landing-note-title {
  margin-bottom: 8px;
  line-height: 1.4;
}

.landing-page .landing-copy {
  font-size: 15px;
  line-height: 1.7;
  color: var(--ink-light);
}

.landing-page .landing-copy-muted {
  font-size: 15px;
  line-height: 1.7;
  color: var(--warm-gray);
}

.landing-page .landing-copy-sm {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-light);
}

.landing-page .landing-subheading {
  margin-bottom: 16px;
  font-size: 18px;
}

.landing-page .landing-card-heading {
  margin-bottom: 8px;
  font-size: 18px;
}

.landing-page .landing-card-heading-md {
  margin-bottom: 12px;
  font-size: 18px;
}

.landing-page .landing-card-heading-lg {
  margin-bottom: 16px;
  font-size: 20px;
}

.landing-page .landing-card-meta {
  font-size: 14px;
  line-height: 1.6;
  color: var(--warm-gray);
}

.landing-page .landing-card-meta-small {
  font-size: 13px;
  line-height: 1.6;
  color: var(--warm-gray);
}

.landing-page .landing-card-meta-spaced {
  margin-bottom: 16px;
}

.landing-page .landing-stat-label {
  margin: 4px 0;
  font-weight: 600;
}

.landing-page .landing-stat-label-light {
  margin-top: 4px;
  font-size: 14px;
  font-weight: 500;
}

.landing-page .landing-review-card {
  margin-top: 24px;
  padding: 28px;
}

.landing-page .landing-info-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-light);
}

.landing-page .landing-info-list-dense {
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-light);
}

.landing-page .landing-faq-wrap,
.landing-page .landing-news-wrap {
  max-width: 800px;
  margin-top: 24px;
}

.landing-page .landing-timeline-wrap,
.landing-page .landing-glossary-wrap {
  max-width: 700px;
  margin-top: 24px;
}

.landing-page .landing-icon-lg {
  margin-bottom: 12px;
  font-size: 36px;
}

.landing-page .landing-btn-sm {
  font-size: 13px;
}

.landing-page .landing-text-coral {
  color: #e57373;
}

.landing-page .landing-center-copy {
  max-width: 720px;
  margin: 0 auto 28px;
}

.landing-page .landing-dark-label {
  color: rgba(255, 255, 255, 0.7);
}

.landing-page .landing-card-kicker {
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}

.landing-page .landing-dark-card {
  height: 100%;
  text-decoration: none;
  color: white;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  text-align: left;
}

.landing-page .landing-dark-card:hover {
  color: white;
  border-color: rgba(255, 255, 255, 0.2);
}

.landing-page .landing-dark-card-title {
  margin-bottom: 10px;
  color: white;
}

.landing-page .landing-dark-card-copy {
  margin: 0;
  color: #d0cbc6;
  line-height: 1.7;
}

.landing-page .landing-quiet-note {
  margin-top: 20px;
  font-size: 13px;
  color: #8f8a86;
}

.landing-page .landing-quiz-intro {
  max-width: 500px;
  margin: 0 auto 32px;
  opacity: 0.8;
}

.landing-page .landing-quiz-shell {
  max-width: 500px;
  margin: 0 auto;
}

.landing-page .landing-quiz-question {
  margin-bottom: 16px;
  font-weight: 600;
}

.landing-page .landing-quiz-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.landing-page .landing-quiz-option {
  color: white;
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}

.landing-page .landing-quiz-note {
  margin-top: 20px;
  font-size: 14px;
  opacity: 0.7;
}

.landing-page .landing-quiz-link {
  color: var(--gold);
}

.landing-page .landing-wallpaper-card {
  padding: 40px 20px;
  text-align: center;
  color: white;
  border: none;
}

.landing-page .landing-wallpaper-card:hover {
  color: white;
}

.landing-page .landing-wallpaper-icon {
  margin-bottom: 8px;
  font-size: 32px;
}

.landing-page .landing-wallpaper-title {
  font-size: 14px;
  font-weight: 600;
}

.landing-page .landing-wallpaper-meta {
  margin-top: 4px;
  font-size: 12px;
  opacity: 0.6;
}

.landing-page .landing-wallpaper--snowstorm {
  background: linear-gradient(135deg, #1a2f3a, #1e3d35);
}

.landing-page .landing-wallpaper--lantern {
  background: linear-gradient(135deg, #4a1942, #1a1a2e);
}

.landing-page .landing-wallpaper--battlefield {
  background: linear-gradient(135deg, #2d4a3e, #1a3a2e);
}

.landing-page .landing-wallpaper--calligraphy {
  background: linear-gradient(135deg, #3a2a1a, #5a3a2a);
}

.landing-page .landing-guide-card {
  display: block;
  height: 100%;
}

.landing-page .landing-guide-card:hover {
  color: inherit;
  border-color: var(--jade);
}

.landing-page .landing-guide-copy {
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--warm-gray);
}

.landing-page .landing-table-note {
  font-size: 13px;
  text-align: center;
  color: var(--warm-gray);
}

.landing-page .tag-sm {
  font-size: 11px;
}

.landing-page .char-img--changyu {
  background: linear-gradient(135deg, #fce4ec, var(--gold-light));
}

.landing-page .char-img--qianqian {
  background: linear-gradient(135deg, #e3f2fd, #e8eaf6);
}

.landing-page .char-img--qimin {
  background: linear-gradient(135deg, #fff3e0, #fce4ec);
}

.landing-page .char-img--gongsun {
  background: linear-gradient(135deg, #e8f5e9, #e0f2f1);
}

.landing-page .char-img--lihuaian {
  background: linear-gradient(135deg, #ede7f6, #e8eaf6);
}

.landing-page .rel-node--changyu {
  left: 230px;
  top: 160px;
}

.landing-page .rel-node--xiezheng {
  left: 550px;
  top: 160px;
}

.landing-page .rel-node--gongsun {
  left: 850px;
  top: 80px;
}

.landing-page .rel-node--weiyan {
  left: 850px;
  top: 260px;
}

.landing-page .rel-node--qianqian {
  left: 230px;
  top: 340px;
}

.landing-page .rel-node--lihuaian {
  left: 430px;
  top: 340px;
}

.landing-page .rel-avatar--changyu {
  background: var(--jade-light);
  border-color: var(--jade);
  font-size: 24px;
}

.landing-page .rel-avatar--xiezheng {
  background: #e8eaf6;
  border-color: var(--ink);
  font-size: 24px;
}

.landing-page .rel-avatar--gongsun {
  background: #e8f5e9;
  border-color: #4caf50;
  font-size: 24px;
}

.landing-page .rel-avatar--weiyan {
  background: #ffebee;
  border-color: #e57373;
  font-size: 24px;
}

.landing-page .rel-avatar--qianqian {
  background: #fce4ec;
  border-color: #f06292;
  font-size: 24px;
}

.landing-page .rel-avatar--lihuaian {
  background: #ede7f6;
  border-color: #7e57c2;
  font-size: 24px;
}

@media (max-width: 900px) {
  .landing-page .hero > .container {
    display: block !important;
    min-height: auto !important;
    padding-top: 88px;
    padding-bottom: 48px;
  }

  .landing-page .countdown-wrap,
  .landing-page .countdown-digits {
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
  }

  .landing-page .map-svg {
    width: 960px;
    min-width: 960px;
  }
}

@media (max-width: 768px) {
  .landing-page .section {
    padding: 48px 0;
  }

  .landing-page .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .landing-page .hero-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .landing-page .airing-progress {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .landing-page .compare-row {
    grid-template-columns: 1fr;
  }

  .landing-page .compare-col:first-child {
    border-radius: 12px 12px 0 0;
    border-right: 1px solid var(--border);
    border-bottom: none;
  }

  .landing-page .compare-vs {
    padding: 12px;
  }

  .landing-page .compare-col:last-child {
    border-radius: 0 0 12px 12px;
    border-left: 1px solid var(--border);
  }

  .landing-page .glossary-term {
    flex-direction: column;
    gap: 8px;
  }

  .landing-page .glossary-cn {
    min-width: 0;
  }

  .landing-page .timeline-item {
    gap: 16px;
    padding-left: 22px;
  }

  .landing-page .timeline-item::before {
    top: 24px;
  }

  .landing-page .pron-top {
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-start;
  }

  .landing-page .pron-chinese {
    min-width: 0;
    font-size: 32px;
  }

  .landing-page .pron-breakdown {
    gap: 12px;
  }

  .landing-page .pron-char-item {
    min-width: 0;
  }

  .landing-page .tone-row {
    grid-template-columns: 48px 1fr;
    gap: 10px;
  }

  .landing-page .tone-desc {
    grid-column: 1 / -1;
    padding-left: 58px;
  }

  .landing-page .detail-panel {
    top: 0;
    width: min(100vw, 100%);
    height: 100dvh;
    padding: 72px 20px max(24px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 600px) {
  .landing-page .section,
  .landing-page .countdown-section {
    padding: 40px 0;
  }

  .landing-page .container {
    padding-left: 16px;
    padding-right: 16px;
  }

  .landing-page .hero-meta {
    gap: 10px;
  }

  .landing-page .hero-stats,
  .landing-page .hero-stats-row {
    width: 100%;
  }

  .landing-page .hero-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .landing-page .hero-stat,
  .landing-page .hero-stat-pill {
    min-width: 0;
    padding: 16px;
  }

  .landing-page .hero-stat-pill {
    flex: 1 1 calc(50% - 8px);
  }

  .landing-page .countdown-digits {
    gap: 8px;
  }

  .landing-page .cd-num {
    min-width: 64px;
    padding: 10px 14px;
    font-size: 32px;
  }

  .landing-page .quote-card,
  .landing-page .synopsis-box,
  .landing-page .tone-guide,
  .landing-page .pron-card {
    padding: 20px;
  }

  .landing-page .quote-cn {
    font-size: 17px;
  }

  .landing-page .rel-map-container {
    height: auto !important;
    min-height: 520px;
    padding: 24px;
  }

  .landing-page .rel-map-container .rel-lines,
  .landing-page .map-svg {
    width: 900px;
    min-width: 900px;
  }

  .landing-page .landing-wallpaper-card {
    padding: 28px 18px;
  }
}