{"id":2923,"date":"2026-09-17T18:07:01","date_gmt":"2026-09-17T10:07:01","guid":{"rendered":"https:\/\/ytubage.com\/?page_id=2923"},"modified":"2026-09-23T16:32:13","modified_gmt":"2026-09-23T08:32:13","slug":"xlkjsj","status":"publish","type":"page","link":"https:\/\/ytubage.com\/index.php\/fb\/xlkjsj\/","title":{"rendered":"\u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>\u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c<\/title>\n<link rel=\"icon\" href=\"data:image\/svg+xml,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 100 100'><path d='M50 88 C20 65 10 45 10 30 C10 15 22 8 35 8 C42 8 47 12 50 18 C53 12 58 8 65 8 C78 8 90 15 90 30 C90 45 80 65 50 88Z' fill='%23e8a87c'\/><\/svg>&#8220;>\n<link rel=\"stylesheet\" href=\"https:\/\/miaoda.feishu.cn\/fonts\/css2?family=Noto+Serif+SC:wght@400;600;700;900&#038;family=Noto+Sans+SC:wght@300;400;500;700&#038;display=swap\">\n<style>\n\/* ===== \u5168\u5c40\u91cd\u7f6e\u4e0e\u53d8\u91cf ===== *\/\n:root {\n  --bg-deep: #1a1410;\n  --bg-warm: #2a1f17;\n  --bg-card: #33261c;\n  --gold: #e8a87c;\n  --gold-light: #f5c6a0;\n  --gold-dim: #b8845c;\n  --cream: #f5ebe0;\n  --cream-dim: #c9b8a8;\n  --heart: #d4726a;\n  --heart-glow: rgba(212, 114, 106, 0.4);\n  --serif: 'Noto Serif SC', 'Songti SC', 'SimSun', serif;\n  --sans: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;\n}\n\n* { margin: 0; padding: 0; box-sizing: border-box; }\n\nhtml { scroll-behavior: smooth; }\n\nbody {\n  font-family: var(--sans);\n  background: var(--bg-deep);\n  color: var(--cream);\n  line-height: 1.8;\n  overflow-x: hidden;\n}\n\n\/* ===== \u5bfc\u822a\u680f ===== *\/\n.nav {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  z-index: 100;\n  padding: 16px 40px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: rgba(26, 20, 16, 0.85);\n  backdrop-filter: blur(12px);\n  border-bottom: 1px solid rgba(232, 168, 124, 0.15);\n}\n\n.nav-logo {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-family: var(--serif);\n  font-size: 20px;\n  font-weight: 700;\n  color: var(--gold-light);\n  cursor: pointer;\n}\n\n.nav-logo svg { width: 28px; height: 28px; }\n\n.nav-links {\n  display: flex;\n  gap: 32px;\n  list-style: none;\n}\n\n.nav-links a {\n  color: var(--cream-dim);\n  text-decoration: none;\n  font-size: 14px;\n  font-weight: 400;\n  transition: color 0.3s;\n  cursor: pointer;\n}\n\n.nav-links a:hover, .nav-links a.active {\n  color: var(--gold-light);\n}\n\n.nav-menu-btn {\n  display: none;\n  background: none;\n  border: none;\n  color: var(--cream);\n  font-size: 24px;\n  cursor: pointer;\n  font-family: var(--sans);\n  min-width: 44px;\n  min-height: 44px;\n}\n\n\/* ===== \u89c6\u56fe\u5bb9\u5668 ===== *\/\n.view { display: none; min-height: 100vh; padding-top: 72px; }\n.view.active { display: block; animation: fadeIn 0.5s ease; }\n\n@keyframes fadeIn {\n  from { opacity: 0; transform: translateY(10px); }\n  to { opacity: 1; transform: translateY(0); }\n}\n\n\/* ===== \u9996\u9875 Hero ===== *\/\n.hero {\n  position: relative;\n  min-height: 90vh;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  padding: 60px 20px;\n  overflow: hidden;\n}\n\n.hero-bg {\n  position: absolute;\n  inset: 0;\n  background:\n    radial-gradient(ellipse at 30% 20%, rgba(232, 168, 124, 0.15) 0%, transparent 50%),\n    radial-gradient(ellipse at 70% 80%, rgba(212, 114, 106, 0.1) 0%, transparent 50%),\n    linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-warm) 100%);\n}\n\n.hero-chain {\n  position: absolute;\n  inset: 0;\n  opacity: 0.3;\n}\n\n.hero-content {\n  position: relative;\n  z-index: 2;\n  max-width: 800px;\n}\n\n.hero-subtitle {\n  font-size: 16px;\n  color: var(--gold);\n  letter-spacing: 8px;\n  margin-bottom: 24px;\n  font-weight: 300;\n}\n\n.hero-title {\n  font-family: var(--serif);\n  font-size: clamp(36px, 6vw, 64px);\n  font-weight: 900;\n  line-height: 1.3;\n  margin-bottom: 28px;\n  background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 50%, var(--heart) 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-clip: text;\n}\n\n.hero-desc {\n  font-size: 17px;\n  color: var(--cream-dim);\n  line-height: 2;\n  margin-bottom: 40px;\n  font-weight: 300;\n}\n\n.hero-cta {\n  display: inline-flex;\n  align-items: center;\n  gap: 10px;\n  padding: 14px 36px;\n  background: linear-gradient(135deg, var(--gold) 0%, var(--heart) 100%);\n  color: var(--bg-deep);\n  border: none;\n  border-radius: 50px;\n  font-size: 16px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: transform 0.3s, box-shadow 0.3s;\n  text-decoration: none;\n}\n\n.hero-cta:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 8px 30px var(--heart-glow);\n}\n\n\/* ===== \u5fc3\u94fe\u8fdb\u5ea6\u6761 ===== *\/\n.progress-section {\n  padding: 60px 40px;\n  background: var(--bg-warm);\n}\n\n.progress-container {\n  max-width: 900px;\n  margin: 0 auto;\n  text-align: center;\n}\n\n.progress-label {\n  font-family: var(--serif);\n  font-size: 24px;\n  color: var(--gold-light);\n  margin-bottom: 8px;\n}\n\n.progress-count {\n  font-size: 48px;\n  font-weight: 700;\n  color: var(--gold);\n  font-family: var(--serif);\n}\n\n.progress-count span {\n  font-size: 20px;\n  color: var(--cream-dim);\n  font-weight: 300;\n}\n\n.progress-bar-wrap {\n  margin: 32px 0;\n  height: 8px;\n  background: var(--bg-card);\n  border-radius: 4px;\n  overflow: hidden;\n  position: relative;\n}\n\n.progress-bar {\n  height: 100%;\n  width: 15%;\n  background: linear-gradient(90deg, var(--gold-dim) 0%, var(--gold) 50%, var(--heart) 100%);\n  border-radius: 4px;\n  position: relative;\n  animation: progressGlow 2s ease-in-out infinite alternate;\n}\n\n@keyframes progressGlow {\n  from { box-shadow: 0 0 10px var(--gold-dim); }\n  to { box-shadow: 0 0 20px var(--heart); }\n}\n\n.progress-hearts {\n  display: flex;\n  justify-content: center;\n  gap: 6px;\n  margin-top: 20px;\n  flex-wrap: wrap;\n}\n\n.progress-heart {\n  width: 16px;\n  height: 16px;\n  opacity: 0.2;\n  transition: opacity 0.3s;\n}\n\n.progress-heart.lit {\n  opacity: 1;\n  animation: heartPulse 2s ease-in-out infinite;\n}\n\n@keyframes heartPulse {\n  0%, 100% { transform: scale(1); }\n  50% { transform: scale(1.15); }\n}\n\n\/* ===== \u901a\u7528\u533a\u5757\u6807\u9898 ===== *\/\n.section {\n  padding: 80px 40px;\n}\n\n.section-header {\n  text-align: center;\n  margin-bottom: 56px;\n}\n\n.section-tag {\n  font-size: 13px;\n  color: var(--gold);\n  letter-spacing: 4px;\n  margin-bottom: 12px;\n  font-weight: 300;\n}\n\n.section-title {\n  font-family: var(--serif);\n  font-size: clamp(28px, 4vw, 40px);\n  font-weight: 700;\n  color: var(--cream);\n  margin-bottom: 16px;\n}\n\n.section-desc {\n  font-size: 15px;\n  color: var(--cream-dim);\n  max-width: 600px;\n  margin: 0 auto;\n  font-weight: 300;\n}\n\n\/* ===== \u4eca\u65e5\u63a8\u8350\u5361\u7247 ===== *\/\n.today-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n  gap: 28px;\n  max-width: 1100px;\n  margin: 0 auto;\n}\n\n.today-card {\n  background: var(--bg-card);\n  border-radius: 16px;\n  overflow: hidden;\n  cursor: pointer;\n  transition: transform 0.3s, box-shadow 0.3s;\n  border: 1px solid rgba(232, 168, 124, 0.1);\n}\n\n.today-card:hover {\n  transform: translateY(-4px);\n  box-shadow: 0 12px 40px rgba(0,0,0,0.4);\n}\n\n.today-card-img {\n  height: 180px;\n  position: relative;\n  overflow: hidden;\n}\n\n.today-card-img .img-placeholder {\n  position: absolute;\n  right: 12px;\n  bottom: 14px;\n  font-size: 60px;\n  font-family: var(--serif);\n  font-weight: 900;\n  color: rgba(255,255,255,0.12);\n  line-height: 1;\n  pointer-events: none;\n}\n\n.today-card-tag {\n  position: absolute;\n  top: 12px;\n  left: 12px;\n  padding: 4px 12px;\n  background: rgba(26, 20, 16, 0.8);\n  border-radius: 20px;\n  font-size: 12px;\n  color: var(--gold-light);\n}\n\n.today-card-body {\n  padding: 20px;\n}\n\n.today-card-country {\n  font-size: 12px;\n  color: var(--gold);\n  margin-bottom: 6px;\n  letter-spacing: 1px;\n}\n\n.today-card-title {\n  font-family: var(--serif);\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--cream);\n  margin-bottom: 8px;\n  line-height: 1.5;\n}\n\n.today-card-text {\n  font-size: 13px;\n  color: var(--cream-dim);\n  line-height: 1.7;\n  font-weight: 300;\n}\n\n\/* ===== \u6700\u65b0\u5fc3\u58f0 ===== *\/\n.voices-section {\n  background: var(--bg-warm);\n}\n\n.voices-wall {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n  gap: 20px;\n  max-width: 1100px;\n  margin: 0 auto;\n}\n\n.voice-card {\n  background: var(--bg-card);\n  border-radius: 12px;\n  padding: 24px;\n  border-left: 3px solid var(--gold);\n  transition: transform 0.3s;\n}\n\n.voice-card:hover {\n  transform: translateX(4px);\n}\n\n.voice-text {\n  font-size: 14px;\n  color: var(--cream);\n  line-height: 1.8;\n  margin-bottom: 16px;\n  font-weight: 300;\n  font-style: italic;\n}\n\n.voice-meta {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-size: 12px;\n  color: var(--cream-dim);\n}\n\n.voice-country {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n\/* ===== \u5fc3\u94fe\u5730\u56fe\u9875 ===== *\/\n.map-hero {\n  padding: 60px 40px 40px;\n  text-align: center;\n}\n\n.map-container {\n  max-width: 1000px;\n  margin: 0 auto;\n  padding: 0 40px 60px;\n}\n\n.world-map {\n  width: 100%;\n  height: auto;\n}\n\n.map-node {\n  cursor: pointer;\n  transition: all 0.3s;\n}\n\n.map-node circle {\n  transition: all 0.3s;\n}\n\n.map-node:hover circle {\n  r: 12;\n  filter: drop-shadow(0 0 8px var(--gold));\n}\n\n.map-node text {\n  font-family: var(--sans);\n  font-size: 10px;\n  fill: var(--cream-dim);\n  text-anchor: middle;\n  pointer-events: none;\n}\n\n.map-legend {\n  display: flex;\n  justify-content: center;\n  gap: 32px;\n  margin-top: 32px;\n  flex-wrap: wrap;\n}\n\n.legend-item {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: var(--cream-dim);\n}\n\n.legend-dot {\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n}\n\n.legend-dot.lit { background: var(--gold); box-shadow: 0 0 8px var(--gold); }\n.legend-dot.dim { background: var(--bg-card); border: 1px solid var(--cream-dim); }\n\n\/* \u56fd\u5bb6\u8be6\u60c5\u5f39\u7a97 *\/\n.country-modal {\n  display: none;\n  position: fixed;\n  inset: 0;\n  z-index: 200;\n  background: rgba(26, 20, 16, 0.9);\n  backdrop-filter: blur(8px);\n  justify-content: center;\n  align-items: center;\n  padding: 20px;\n}\n\n.country-modal.show {\n  display: flex;\n  animation: fadeIn 0.3s ease;\n}\n\n.modal-content {\n  background: var(--bg-warm);\n  border-radius: 20px;\n  max-width: 560px;\n  width: 100%;\n  max-height: 80vh;\n  overflow-y: auto;\n  border: 1px solid rgba(232, 168, 124, 0.2);\n  animation: modalIn 0.3s ease;\n}\n\n@keyframes modalIn {\n  from { opacity: 0; transform: scale(0.95) translateY(10px); }\n  to { opacity: 1; transform: scale(1) translateY(0); }\n}\n\n.modal-header {\n  padding: 32px 32px 20px;\n  border-bottom: 1px solid rgba(232, 168, 124, 0.1);\n  position: relative;\n}\n\n.modal-close {\n  position: absolute;\n  top: 20px;\n  right: 20px;\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  background: var(--bg-card);\n  border: none;\n  color: var(--cream-dim);\n  font-size: 18px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.3s;\n}\n\n.modal-close:hover {\n  background: var(--heart);\n  color: var(--cream);\n}\n\n.modal-country-name {\n  font-family: var(--serif);\n  font-size: 28px;\n  font-weight: 700;\n  color: var(--gold-light);\n  margin-bottom: 4px;\n}\n\n.modal-country-en {\n  font-size: 14px;\n  color: var(--cream-dim);\n  font-weight: 300;\n}\n\n.modal-body {\n  padding: 24px 32px 32px;\n}\n\n.modal-info-grid {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 16px;\n  margin-bottom: 24px;\n}\n\n.modal-info-item {\n  background: var(--bg-card);\n  padding: 14px;\n  border-radius: 10px;\n}\n\n.modal-info-label {\n  font-size: 11px;\n  color: var(--gold);\n  margin-bottom: 4px;\n  letter-spacing: 1px;\n}\n\n.modal-info-value {\n  font-size: 14px;\n  color: var(--cream);\n  font-weight: 500;\n}\n\n.modal-section-title {\n  font-family: var(--serif);\n  font-size: 16px;\n  color: var(--gold-light);\n  margin: 20px 0 12px;\n  padding-left: 12px;\n  border-left: 3px solid var(--gold);\n}\n\n.modal-story {\n  font-size: 14px;\n  color: var(--cream-dim);\n  line-height: 1.9;\n  font-weight: 300;\n  margin-bottom: 12px;\n}\n\n.modal-film {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px;\n  background: var(--bg-card);\n  border-radius: 10px;\n  margin-bottom: 8px;\n  cursor: pointer;\n  transition: background 0.3s;\n}\n\n.modal-film:hover {\n  background: rgba(232, 168, 124, 0.1);\n}\n\n.modal-film-icon {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  background: linear-gradient(135deg, var(--gold), var(--heart));\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.modal-film-info {\n  flex: 1;\n}\n\n.modal-film-title {\n  font-size: 14px;\n  color: var(--cream);\n  font-weight: 500;\n}\n\n.modal-film-desc {\n  font-size: 12px;\n  color: var(--cream-dim);\n  font-weight: 300;\n}\n\n\/* ===== \u5149\u5f71\u56de\u54cd\u9875 ===== *\/\n.film-filters {\n  display: flex;\n  justify-content: center;\n  gap: 12px;\n  margin-bottom: 40px;\n  flex-wrap: wrap;\n}\n\n.filter-btn {\n  padding: 8px 20px;\n  background: var(--bg-card);\n  border: 1px solid rgba(232, 168, 124, 0.15);\n  border-radius: 20px;\n  color: var(--cream-dim);\n  font-size: 13px;\n  cursor: pointer;\n  transition: all 0.3s;\n}\n\n.filter-btn:hover, .filter-btn.active {\n  background: var(--gold);\n  color: var(--bg-deep);\n  border-color: var(--gold);\n}\n\n.film-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 28px;\n  max-width: 1100px;\n  margin: 0 auto;\n}\n\n.film-card {\n  background: var(--bg-card);\n  border-radius: 16px;\n  overflow: hidden;\n  cursor: pointer;\n  transition: transform 0.3s, box-shadow 0.3s;\n  border: 1px solid rgba(232, 168, 124, 0.1);\n}\n\n.film-card:hover {\n  transform: translateY(-4px);\n  box-shadow: 0 12px 40px rgba(0,0,0,0.4);\n}\n\n.film-card-cover {\n  height: 200px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.film-play-btn {\n  width: 56px;\n  height: 56px;\n  border-radius: 50%;\n  background: rgba(26, 20, 16, 0.7);\n  border: 2px solid var(--gold);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.3s;\n}\n\n.film-card:hover .film-play-btn {\n  background: var(--gold);\n  transform: scale(1.1);\n}\n\n.film-duration {\n  position: absolute;\n  bottom: 12px;\n  right: 12px;\n  padding: 2px 8px;\n  background: rgba(26, 20, 16, 0.8);\n  border-radius: 4px;\n  font-size: 11px;\n  color: var(--cream);\n}\n\n.film-card-body {\n  padding: 20px;\n}\n\n.film-card-meta {\n  display: flex;\n  gap: 8px;\n  margin-bottom: 8px;\n  flex-wrap: wrap;\n}\n\n.film-card-tag {\n  padding: 2px 10px;\n  background: rgba(232, 168, 124, 0.15);\n  border-radius: 10px;\n  font-size: 11px;\n  color: var(--gold);\n}\n\n.film-card-title {\n  font-family: var(--serif);\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--cream);\n  margin-bottom: 8px;\n}\n\n.film-card-desc {\n  font-size: 13px;\n  color: var(--cream-dim);\n  line-height: 1.7;\n  font-weight: 300;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n\/* ===== \u5168\u7403\u5fc3\u58f0\u9875 ===== *\/\n.voices-input-section {\n  max-width: 700px;\n  margin: 0 auto 48px;\n  text-align: center;\n}\n\n.voices-input-box {\n  background: var(--bg-card);\n  border-radius: 16px;\n  padding: 24px;\n  border: 1px solid rgba(232, 168, 124, 0.15);\n}\n\n.voices-input-box textarea {\n  width: 100%;\n  min-height: 100px;\n  background: var(--bg-deep);\n  border: 1px solid rgba(232, 168, 124, 0.1);\n  border-radius: 10px;\n  padding: 14px;\n  color: var(--cream);\n  font-family: var(--sans);\n  font-size: 14px;\n  resize: vertical;\n  outline: none;\n  transition: border-color 0.3s;\n}\n\n.voices-input-box textarea:focus {\n  border-color: var(--gold);\n}\n\n.voices-input-row {\n  display: flex;\n  gap: 12px;\n  margin-top: 12px;\n  flex-wrap: wrap;\n}\n\n.voices-input-row input {\n  flex: 1;\n  min-width: 120px;\n  background: var(--bg-deep);\n  border: 1px solid rgba(232, 168, 124, 0.1);\n  border-radius: 10px;\n  padding: 10px 14px;\n  color: var(--cream);\n  font-family: var(--sans);\n  font-size: 13px;\n  outline: none;\n}\n\n.voices-input-row input:focus {\n  border-color: var(--gold);\n}\n\n.submit-voice-btn {\n  padding: 10px 24px;\n  background: linear-gradient(135deg, var(--gold), var(--heart));\n  border: none;\n  border-radius: 10px;\n  color: var(--bg-deep);\n  font-size: 14px;\n  font-weight: 600;\n  cursor: pointer;\n  transition: transform 0.3s;\n  white-space: nowrap;\n}\n\n.submit-voice-btn:hover {\n  transform: translateY(-1px);\n}\n\n.voices-full-wall {\n  columns: 3;\n  column-gap: 20px;\n  max-width: 1100px;\n  margin: 0 auto;\n}\n\n.voice-note {\n  break-inside: avoid;\n  background: var(--bg-card);\n  border-radius: 12px;\n  padding: 20px;\n  margin-bottom: 20px;\n  border: 1px solid rgba(232, 168, 124, 0.08);\n  transition: transform 0.3s;\n}\n\n.voice-note:hover {\n  transform: translateY(-2px);\n}\n\n.voice-note-text {\n  font-size: 14px;\n  color: var(--cream);\n  line-height: 1.8;\n  margin-bottom: 14px;\n  font-weight: 300;\n}\n\n.voice-note-footer {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-size: 12px;\n  color: var(--cream-dim);\n  padding-top: 12px;\n  border-top: 1px solid rgba(232, 168, 124, 0.08);\n}\n\n.voice-note-likes {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  cursor: pointer;\n  transition: color 0.3s;\n}\n\n.voice-note-likes:hover {\n  color: var(--heart);\n}\n\n\/* ===== \u96c5\u829d\u5bc4\u8bed\u9875 ===== *\/\n.ambassador-hero {\n  padding: 80px 40px 60px;\n  text-align: center;\n  background: linear-gradient(180deg, var(--bg-warm) 0%, var(--bg-deep) 100%);\n}\n\n.ambassador-avatar {\n  width: 140px;\n  height: 140px;\n  border-radius: 50%;\n  background: linear-gradient(135deg, var(--gold), var(--heart));\n  margin: 0 auto 24px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-family: var(--serif);\n  font-size: 48px;\n  color: var(--bg-deep);\n  font-weight: 700;\n  box-shadow: 0 8px 40px var(--heart-glow);\n}\n\n.ambassador-name {\n  font-family: var(--serif);\n  font-size: 32px;\n  font-weight: 700;\n  color: var(--gold-light);\n  margin-bottom: 4px;\n}\n\n.ambassador-title {\n  font-size: 14px;\n  color: var(--cream-dim);\n  letter-spacing: 2px;\n  margin-bottom: 32px;\n}\n\n.ambassador-quote {\n  max-width: 700px;\n  margin: 0 auto;\n  font-family: var(--serif);\n  font-size: 20px;\n  line-height: 2;\n  color: var(--cream);\n  font-style: italic;\n  position: relative;\n  padding: 0 40px;\n}\n\n.ambassador-quote::before,\n.ambassador-quote::after {\n  content: '\"';\n  font-size: 60px;\n  color: var(--gold);\n  opacity: 0.3;\n  position: absolute;\n  font-family: var(--serif);\n}\n\n.ambassador-quote::before {\n  top: -20px;\n  left: 0;\n}\n\n.ambassador-quote::after {\n  bottom: -40px;\n  right: 0;\n}\n\n.ambassador-sections {\n  max-width: 900px;\n  margin: 0 auto;\n  padding: 0 40px 80px;\n}\n\n.ambassador-card {\n  background: var(--bg-card);\n  border-radius: 16px;\n  padding: 32px;\n  margin-bottom: 24px;\n  border: 1px solid rgba(232, 168, 124, 0.1);\n}\n\n.ambassador-card-title {\n  font-family: var(--serif);\n  font-size: 20px;\n  color: var(--gold-light);\n  margin-bottom: 16px;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.ambassador-card-text {\n  font-size: 15px;\n  color: var(--cream-dim);\n  line-height: 2;\n  font-weight: 300;\n}\n\n.ambassador-causes {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n  gap: 16px;\n  margin-top: 16px;\n}\n\n.cause-item {\n  background: var(--bg-deep);\n  padding: 16px;\n  border-radius: 10px;\n  text-align: center;\n  cursor: pointer;\n  transition: all 0.3s;\n}\n\n.cause-item:hover {\n  background: rgba(232, 168, 124, 0.1);\n  transform: translateY(-2px);\n}\n\n.cause-icon {\n  width: 40px;\n  height: 40px;\n  margin: 0 auto 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.cause-name {\n  font-size: 14px;\n  color: var(--cream);\n  font-weight: 500;\n}\n\n\/* ===== \u5173\u4e8e\u6211\u4eec\u9875 ===== *\/\n.about-content {\n  max-width: 800px;\n  margin: 0 auto;\n  padding: 0 40px 80px;\n}\n\n.about-block {\n  margin-bottom: 48px;\n}\n\n.about-block h3 {\n  font-family: var(--serif);\n  font-size: 22px;\n  color: var(--gold-light);\n  margin-bottom: 16px;\n  padding-left: 16px;\n  border-left: 4px solid var(--gold);\n}\n\n.about-block p {\n  font-size: 15px;\n  color: var(--cream-dim);\n  line-height: 2;\n  font-weight: 300;\n  margin-bottom: 12px;\n}\n\n.about-timeline {\n  position: relative;\n  padding-left: 32px;\n}\n\n.about-timeline::before {\n  content: '';\n  position: absolute;\n  left: 8px;\n  top: 8px;\n  bottom: 8px;\n  width: 2px;\n  background: linear-gradient(180deg, var(--gold), var(--heart));\n}\n\n.timeline-item {\n  position: relative;\n  margin-bottom: 28px;\n}\n\n.timeline-item::before {\n  content: '';\n  position: absolute;\n  left: -30px;\n  top: 6px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: var(--gold);\n  box-shadow: 0 0 12px var(--gold);\n}\n\n.timeline-phase {\n  font-size: 13px;\n  color: var(--gold);\n  margin-bottom: 4px;\n  font-weight: 500;\n}\n\n.timeline-title {\n  font-size: 16px;\n  color: var(--cream);\n  margin-bottom: 6px;\n  font-weight: 500;\n}\n\n.timeline-desc {\n  font-size: 13px;\n  color: var(--cream-dim);\n  line-height: 1.8;\n  font-weight: 300;\n}\n\n.about-notice {\n  background: rgba(212, 114, 106, 0.1);\n  border: 1px solid rgba(212, 114, 106, 0.3);\n  border-radius: 12px;\n  padding: 20px 24px;\n  margin-top: 32px;\n}\n\n.about-notice-title {\n  font-size: 14px;\n  color: var(--heart);\n  font-weight: 600;\n  margin-bottom: 8px;\n}\n\n.about-notice-text {\n  font-size: 13px;\n  color: var(--cream-dim);\n  line-height: 1.8;\n  font-weight: 300;\n}\n\n\/* ===== \u9875\u811a ===== *\/\n.footer {\n  background: var(--bg-deep);\n  border-top: 1px solid rgba(232, 168, 124, 0.1);\n  padding: 48px 40px 32px;\n  text-align: center;\n}\n\n.footer-logo {\n  font-family: var(--serif);\n  font-size: 20px;\n  color: var(--gold-light);\n  margin-bottom: 12px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n}\n\n.footer-desc {\n  font-size: 13px;\n  color: var(--cream-dim);\n  max-width: 600px;\n  margin: 0 auto 24px;\n  line-height: 1.8;\n  font-weight: 300;\n}\n\n.footer-links {\n  display: flex;\n  justify-content: center;\n  gap: 24px;\n  margin-bottom: 24px;\n  flex-wrap: wrap;\n}\n\n.footer-links a {\n  color: var(--cream-dim);\n  text-decoration: none;\n  font-size: 13px;\n  cursor: pointer;\n  transition: color 0.3s;\n}\n\n.footer-links a:hover {\n  color: var(--gold-light);\n}\n\n.footer-copyright {\n  font-size: 12px;\n  color: rgba(201, 184, 168, 0.5);\n  padding-top: 20px;\n  border-top: 1px solid rgba(232, 168, 124, 0.08);\n}\n\n\/* ===== Toast \u63d0\u793a ===== *\/\n.toast {\n  position: fixed;\n  bottom: 40px;\n  left: 50%;\n  transform: translateX(-50%) translateY(100px);\n  background: var(--bg-card);\n  color: var(--cream);\n  padding: 12px 28px;\n  border-radius: 50px;\n  font-size: 14px;\n  z-index: 300;\n  border: 1px solid rgba(232, 168, 124, 0.2);\n  transition: transform 0.3s ease;\n  box-shadow: 0 8px 30px rgba(0,0,0,0.4);\n}\n\n.toast.show {\n  transform: translateX(-50%) translateY(0);\n}\n\n\/* ===== \u54cd\u5e94\u5f0f ===== *\/\n@media (max-width: 768px) {\n  body { font-size: 16px; }\n  .nav { padding: 12px 20px; }\n  .nav-links { display: none; }\n  .nav-links.open {\n    display: flex;\n    flex-direction: column;\n    position: absolute;\n    top: 100%;\n    left: 0;\n    right: 0;\n    background: var(--bg-warm);\n    padding: 20px;\n    gap: 16px;\n    border-bottom: 1px solid rgba(232, 168, 124, 0.15);\n  }\n  .nav-links a {\n    font-size: 16px;\n    padding: 8px 0;\n    min-height: 44px;\n    display: flex;\n    align-items: center;\n  }\n  .nav-menu-btn { display: block; }\n\n  .section { padding: 48px 20px; }\n  .progress-section { padding: 40px 20px; }\n  .hero { padding: 40px 20px; min-height: 70vh; }\n  .hero-subtitle { font-size: 13px; letter-spacing: 4px; }\n  .hero-desc { font-size: 15px; }\n\n  .today-card-country { font-size: 13px; }\n  .today-card-text { font-size: 14px; }\n  .film-card-desc { font-size: 14px; }\n  .voice-text { font-size: 15px; }\n  .voice-note-text { font-size: 15px; }\n  .modal-story { font-size: 15px; }\n  .ambassador-card-text { font-size: 15px; }\n  .about-block p { font-size: 15px; }\n\n  .voices-input-box textarea { font-size: 16px; }\n  .voices-input-row input { font-size: 16px; }\n\n  .footer-links a {\n    font-size: 14px;\n    min-height: 44px;\n    display: inline-flex;\n    align-items: center;\n  }\n\n  .voices-full-wall { columns: 1; }\n  .modal-info-grid { grid-template-columns: 1fr; }\n  .ambassador-quote { padding: 0 20px; font-size: 17px; }\n  .ambassador-sections { padding: 0 20px 60px; }\n  .about-content { padding: 0 20px 60px; }\n  .map-container { padding: 0 20px 40px; }\n  .footer { padding: 32px 20px 24px; }\n}\n\n@media (max-width: 480px) {\n  .progress-count { font-size: 36px; }\n  .today-grid { grid-template-columns: 1fr; }\n  .film-grid { grid-template-columns: 1fr; }\n}\n<\/style>\n<\/head>\n<body>\n\n<!-- ===== \u5bfc\u822a\u680f ===== -->\n<nav class=\"nav\">\n  <div class=\"nav-logo\" onclick=\"navigate('home')\">\n    <svg viewBox=\"0 0 100 100\"><path d=\"M50 88 C20 65 10 45 10 30 C10 15 22 8 35 8 C42 8 47 12 50 18 C53 12 58 8 65 8 C78 8 90 15 90 30 C90 45 80 65 50 88Z\" fill=\"#e8a87c\"\/><\/svg>\n    \u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c\n  <\/div>\n  <ul class=\"nav-links\" id=\"navLinks\">\n    <li><a onclick=\"navigate('home')\" class=\"active\" data-view=\"home\">\u9996\u9875<\/a><\/li>\n    <li><a onclick=\"navigate('map')\" data-view=\"map\">\u5fc3\u94fe<\/a><\/li>\n    <li><a onclick=\"navigate('films')\" data-view=\"films\">\u5149\u5f71<\/a><\/li>\n    <li><a onclick=\"navigate('voices')\" data-view=\"voices\">\u5168\u7403<\/a><\/li>\n    <li><a onclick=\"navigate('ambassador')\" data-view=\"ambassador\">\u5bc4\u8bed<\/a><\/li>\n    <li><a onclick=\"navigate('about')\" data-view=\"about\">\u5173\u4e8e<\/a><\/li>\n  <\/ul>\n  <button class=\"nav-menu-btn\" onclick=\"toggleMenu()\">\u2630<\/button>\n<\/nav>\n\n<!-- ===== \u9996\u9875 ===== -->\n<div class=\"view active\" id=\"view-home\">\n  <!-- Hero -->\n  <section class=\"hero\">\n    <div class=\"hero-bg\"><\/div>\n    <svg class=\"hero-chain\" viewBox=\"0 0 1200 600\" preserveAspectRatio=\"xMidYMid slice\">\n      <defs>\n        <linearGradient id=\"chainGrad\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\n          <stop offset=\"0%\" style=\"stop-color:#e8a87c;stop-opacity:0.6\"\/>\n          <stop offset=\"50%\" style=\"stop-color:#d4726a;stop-opacity:0.4\"\/>\n          <stop offset=\"100%\" style=\"stop-color:#e8a87c;stop-opacity:0.6\"\/>\n        <\/linearGradient>\n      <\/defs>\n      <path d=\"M100 300 Q300 150 500 280 T900 250 T1150 320\" stroke=\"url(#chainGrad)\" stroke-width=\"2\" fill=\"none\"\/>\n      <path d=\"M100 350 Q350 480 600 380 T1000 400 T1150 350\" stroke=\"url(#chainGrad)\" stroke-width=\"1.5\" fill=\"none\" opacity=\"0.6\"\/>\n      <circle cx=\"200\" cy=\"260\" r=\"4\" fill=\"#e8a87c\" opacity=\"0.8\"\/>\n      <circle cx=\"400\" cy=\"220\" r=\"4\" fill=\"#e8a87c\" opacity=\"0.8\"\/>\n      <circle cx=\"600\" cy=\"270\" r=\"4\" fill=\"#d4726a\" opacity=\"0.8\"\/>\n      <circle cx=\"800\" cy=\"250\" r=\"4\" fill=\"#e8a87c\" opacity=\"0.8\"\/>\n      <circle cx=\"1000\" cy=\"280\" r=\"4\" fill=\"#e8a87c\" opacity=\"0.8\"\/>\n      <circle cx=\"300\" cy=\"420\" r=\"3\" fill=\"#b8845c\" opacity=\"0.6\"\/>\n      <circle cx=\"550\" cy=\"400\" r=\"3\" fill=\"#b8845c\" opacity=\"0.6\"\/>\n      <circle cx=\"800\" cy=\"390\" r=\"3\" fill=\"#b8845c\" opacity=\"0.6\"\/>\n    <\/svg>\n    <div class=\"hero-content\">\n      <div class=\"hero-subtitle\">HEART CHAIN \u00b7 SEE THE WORLD<\/div>\n      <h1 class=\"hero-title\">193\u4e2a\u56fd\u5ea6<br>\u4e00\u6761\u5fc3\u94fe<\/h1>\n      <p class=\"hero-desc\">\n        \u5730\u7403\u4e4b\u4e0a\uff0c\u5c71\u6d77\u76f8\u9694\uff0c\u8bed\u8a00\u5404\u5f02\uff0c\u4f46\u4eba\u5fc3\u76f8\u901a\u3002<br>\n        \u6211\u4eec\u7f16\u7ec7\u4e00\u6761\u8de8\u8d8a\u56fd\u754c\u7684\u5fc3\u94fe\uff0c\u501f\u5149\u5f71\u4e0e\u6545\u4e8b\uff0c<br>\n        \u8ba9\u4e0d\u540c\u571f\u5730\u4e0a\u7684\u4eba\u4eec\uff0c\u770b\u89c1\u8fdc\u65b9\uff0c\u770b\u89c1\u5f7c\u6b64\u3002\n      <\/p>\n      <button class=\"hero-cta\" onclick=\"navigate('map')\">\n        \u5f00\u542f\u5fc3\u94fe\u4e4b\u65c5\n        <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\n      <\/button>\n    <\/div>\n  <\/section>\n\n  <!-- \u5fc3\u94fe\u8fdb\u5ea6 -->\n  <section class=\"progress-section\">\n    <div class=\"progress-container\">\n      <div class=\"progress-label\">\u5fc3\u94fe\u70b9\u4eae\u8fdb\u5ea6<\/div>\n      <div class=\"progress-count\">29 <span>\/ 193 \u4e2a\u56fd\u5bb6<\/span><\/div>\n      <div class=\"progress-bar-wrap\">\n        <div class=\"progress-bar\"><\/div>\n      <\/div>\n      <div class=\"progress-hearts\" id=\"progressHearts\"><\/div>\n      <p style=\"font-size:13px;color:var(--cream-dim);margin-top:16px;font-weight:300;\">\n        \u6bcf\u4e00\u4e2a\u88ab\u70b9\u4eae\u7684\u8282\u70b9\uff0c\u90fd\u4ee3\u8868\u4e00\u4e2a\u88ab\u66f4\u591a\u4eba\u770b\u89c1\u7684\u56fd\u5ea6\n      <\/p>\n    <\/div>\n  <\/section>\n\n  <!-- \u4eca\u65e5\u63a8\u8350 -->\n  <section class=\"section\">\n    <div class=\"section-header\">\n      <div class=\"section-tag\">TODAY&#8217;S PICK<\/div>\n      <h2 class=\"section-title\">\u4eca\u65e5\u63a8\u8350<\/h2>\n      <p class=\"section-desc\">\u6bcf\u5929\uff0c\u4e3a\u4f60\u6253\u5f00\u4e00\u6247\u901a\u5f80\u4e16\u754c\u7684\u7a97<\/p>\n    <\/div>\n    <div class=\"today-grid\" id=\"todayGrid\"><\/div>\n  <\/section>\n\n  <!-- \u6700\u65b0\u5fc3\u58f0 -->\n  <section class=\"section voices-section\">\n    <div class=\"section-header\">\n      <div class=\"section-tag\">LATEST VOICES<\/div>\n      <h2 class=\"section-title\">\u6700\u65b0\u5fc3\u58f0<\/h2>\n      <p class=\"section-desc\">\u6765\u81ea\u4e16\u754c\u5404\u5730\u7684\u6e29\u6696\u8bdd\u8bed\uff0c\u6b63\u5728\u5fc3\u94fe\u4e0a\u56de\u54cd<\/p>\n    <\/div>\n    <div class=\"voices-wall\" id=\"latestVoices\"><\/div>\n    <div style=\"text-align:center;margin-top:36px;\">\n      <button class=\"hero-cta\" onclick=\"navigate('voices')\" style=\"padding:12px 28px;font-size:14px;\">\n        \u67e5\u770b\u66f4\u591a\u5fc3\u58f0\n      <\/button>\n    <\/div>\n  <\/section>\n<\/div>\n\n<!-- ===== \u5fc3\u94fe\u5730\u56fe\u9875 ===== -->\n<div class=\"view\" id=\"view-map\">\n  <section class=\"map-hero\">\n    <div class=\"section-tag\">HEART CHAIN MAP<\/div>\n    <h2 class=\"section-title\">\u5fc3\u94fe\u5730\u56fe<\/h2>\n    <p class=\"section-desc\">\u70b9\u51fb\u53d1\u5149\u7684\u8282\u70b9\uff0c\u8d70\u8fdb\u90a3\u4e2a\u56fd\u5bb6\u7684\u6545\u4e8b<\/p>\n  <\/section>\n  <div class=\"map-container\">\n    <svg class=\"world-map\" viewBox=\"0 0 1000 500\" id=\"worldMap\">\n      <defs>\n        <radialGradient id=\"nodeGlow\" cx=\"50%\" cy=\"50%\" r=\"50%\">\n          <stop offset=\"0%\" style=\"stop-color:#e8a87c;stop-opacity:0.8\"\/>\n          <stop offset=\"100%\" style=\"stop-color:#e8a87c;stop-opacity:0\"\/>\n        <\/radialGradient>\n      <\/defs>\n      <!-- \u7b80\u5316\u5927\u9646\u8f6e\u5ed3 -->\n      <g fill=\"#33261c\" stroke=\"#4a3828\" stroke-width=\"0.5\">\n        <!-- \u5317\u7f8e -->\n        <path d=\"M120 80 L200 70 L240 90 L260 130 L250 170 L220 200 L180 210 L150 190 L130 160 L110 120 Z\"\/>\n        <!-- \u5357\u7f8e -->\n        <path d=\"M240 230 L280 220 L300 260 L290 320 L270 370 L250 390 L235 360 L230 300 L235 260 Z\"\/>\n        <!-- \u6b27\u6d32 -->\n        <path d=\"M460 90 L520 80 L550 100 L540 130 L510 145 L480 140 L460 120 Z\"\/>\n        <!-- \u975e\u6d32 -->\n        <path d=\"M470 170 L540 160 L570 200 L560 270 L530 330 L500 350 L480 320 L465 260 L460 210 Z\"\/>\n        <!-- \u4e9a\u6d32 -->\n        <path d=\"M560 70 L700 60 L780 80 L820 120 L810 170 L770 200 L720 210 L660 200 L610 180 L570 150 L555 110 Z\"\/>\n        <!-- \u4e1c\u5357\u4e9a\/\u5927\u6d0b\u6d32 -->\n        <path d=\"M780 230 L830 220 L860 250 L850 280 L820 290 L790 275 Z\"\/>\n        <path d=\"M820 340 L880 330 L910 360 L890 390 L850 395 L825 375 Z\"\/>\n      <\/g>\n      <!-- \u5fc3\u94fe\u8fde\u7ebf -->\n      <g stroke=\"#e8a87c\" stroke-width=\"1\" fill=\"none\" opacity=\"0.3\">\n        <path d=\"M180 140 Q300 100 480 115\"\/>\n        <path d=\"M480 115 Q520 150 510 220\"\/>\n        <path d=\"M510 220 Q580 180 650 140\"\/>\n        <path d=\"M650 140 Q720 160 760 200\"\/>\n        <path d=\"M760 200 Q800 250 840 260\"\/>\n        <path d=\"M260 300 Q350 250 480 220\"\/>\n      <\/g>\n      <!-- \u56fd\u5bb6\u8282\u70b9\u5c06\u7531JS\u52a8\u6001\u751f\u6210 -->\n    <\/svg>\n    <div class=\"map-legend\">\n      <div class=\"legend-item\">\n        <div class=\"legend-dot lit\"><\/div>\n        <span>\u70b9\u4eae\u56fd\u5bb6\u5efa\u8bbe\u4e2d&#8230;..<\/span>\n      <\/div>\n      <div class=\"legend-item\">\n        <div class=\"legend-dot dim\"><\/div>\n        <span>\u5f85\u70b9\u4eae\u56fd\u5bb6<\/span>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<!-- \u56fd\u5bb6\u8be6\u60c5\u5f39\u7a97 -->\n<div class=\"country-modal\" id=\"countryModal\">\n  <div class=\"modal-content\">\n    <div class=\"modal-header\">\n<a href=\"https:\/\/hkzyz.ytubage.com\/2026\/dsp\/03-fb\/03\/1.mp4\">\n      <button class=\"modal-close\" onclick=\"closeModal()\">\u00d7<\/button>\n<\/a>\n      <div class=\"modal-country-name\" id=\"modalCountryName\">\u4e2d\u56fd<\/div>\n      <div class=\"modal-country-en\" id=\"modalCountryEn\">China<\/div>\n    <\/div>\n    <div class=\"modal-body\">\n      <div class=\"modal-info-grid\">\n        <div class=\"modal-info-item\">\n          <div class=\"modal-info-label\">\u9996\u90fd<\/div>\n          <div class=\"modal-info-value\" id=\"modalCapital\">\u5317\u4eac<\/div>\n        <\/div>\n        <div class=\"modal-info-item\">\n          <div class=\"modal-info-label\">\u8bed\u8a00<\/div>\n          <div class=\"modal-info-value\" id=\"modalLanguage\">\u6c49\u8bed<\/div>\n        <\/div>\n        <div class=\"modal-info-item\">\n          <div class=\"modal-info-label\">\u4eba\u53e3<\/div>\n          <div class=\"modal-info-value\" id=\"modalPopulation\">14\u4ebf<\/div>\n        <\/div>\n        <div class=\"modal-info-item\">\n          <div class=\"modal-info-label\">\u5730\u533a<\/div>\n          <div class=\"modal-info-value\" id=\"modalRegion\">\u4e1c\u4e9a<\/div>\n        <\/div>\n      <\/div>\n      <div class=\"modal-section-title\">\u4eba\u6587\u6545\u4e8b<\/div>\n      <div class=\"modal-story\" id=\"modalStory\"><\/div>\n      <div class=\"modal-section-title\">\u63a8\u8350\u5149\u5f71<\/div>\n      <div id=\"modalFilms\"><\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<!-- ===== \u5149\u5f71\u56de\u54cd\u9875 ===== -->\n<div class=\"view\" id=\"view-films\">\n  <section class=\"section\">\n    <div class=\"section-header\">\n      <div class=\"section-tag\">FILMS &#038; STORIES<\/div>\n      <h2 class=\"section-title\">\u5149\u5f71\u56de\u54cd<\/h2>\n      <p class=\"section-desc\">\u7535\u5f71\u662f\u65e0\u56fd\u754c\u7684\u8bed\u8a00\uff0c\u8ba9\u6211\u4eec\u900f\u8fc7\u955c\u5934\u770b\u89c1\u5f7c\u6b64<\/p>\n    <\/div>\n    <div class=\"film-filters\" id=\"filmFilters\">\n      <button class=\"filter-btn active\" onclick=\"filterFilms('all')\">\u5168\u90e8<\/button>\n      <button class=\"filter-btn\" onclick=\"filterFilms('doc')\">\u4eba\u6587\u7eaa\u5b9e<\/button>\n      <button class=\"filter-btn\" onclick=\"filterFilms('short')\">\u516c\u76ca\u77ed\u7247<\/button>\n      <button class=\"filter-btn\" onclick=\"filterFilms('scenery')\">\u4e16\u754c\u98ce\u666f<\/button>\n      <button class=\"filter-btn\" onclick=\"filterFilms('people')\">\u4eba\u7269\u6545\u4e8b<\/button>\n      <button class=\"filter-btn\" onclick=\"filterFilms('movie')\">\u7535\u5f71\u63a8\u8350<\/button>\n    <\/div>\n    <div class=\"film-grid\" id=\"filmGrid\"><\/div>\n  <\/section>\n<\/div>\n\n<!-- ===== \u5168\u7403\u5fc3\u58f0\u9875 ===== -->\n<div class=\"view\" id=\"view-voices\">\n  <section class=\"section\">\n    <div class=\"section-header\">\n      <div class=\"section-tag\">GLOBAL VOICES<\/div>\n      <h2 class=\"section-title\">\u5168\u7403\u5fc3\u58f0<\/h2>\n      <p class=\"section-desc\">\u5199\u4e0b\u4f60\u7684\u5fc3\u58f0\uff0c\u6210\u4e3a\u5fc3\u94fe\u4e0a\u95ea\u95ea\u53d1\u5149\u7684\u4e00\u73af<\/p>\n    <\/div>\n    <div class=\"voices-input-section\">\n      <div class=\"voices-input-box\">\n        <textarea id=\"voiceText\" placeholder=\"\u5199\u4e0b\u4f60\u60f3\u5bf9\u4e16\u754c\u8bf4\u7684\u8bdd\u2026\u2026\"><\/textarea>\n        <div class=\"voices-input-row\">\n          <input type=\"text\" id=\"voiceName\" placeholder=\"\u4f60\u7684\u540d\u5b57\uff08\u53ef\u9009\uff09\">\n          <input type=\"text\" id=\"voiceCountry\" placeholder=\"\u4f60\u6765\u81ea\u54ea\u91cc\uff08\u53ef\u9009\uff09\">\n          <button class=\"submit-voice-btn\" onclick=\"submitVoice()\">\u53d1\u5e03\u5fc3\u58f0<\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n    <div class=\"voices-full-wall\" id=\"voicesWall\"><\/div>\n  <\/section>\n<\/div>\n\n<!-- ===== \u829d\u829d\u5bc4\u8bed\u9875 ===== -->\n<div class=\"view\" id=\"view-ambassador\">\n  <section class=\"ambassador-hero\">\n    <div class=\"ambassador-avatar\">\u96c5<\/div>\n    <div class=\"ambassador-name\">\u96c5\u96c5\u9e2d\u5440<\/div>\n    <div class=\"ambassador-title\">\u516c\u76ca\u5927\u4f7f \u00b7 ANGIE CHIU<\/div>\n    <div class=\"ambassador-quote\">\n      \u4e16\u754c\u5f88\u5927\uff0c\u6709\u65e0\u6570\u4e0d\u4e00\u6837\u7684\u98ce\u666f\u4e0e\u4eba\u751f\u3002<br>\n      \u613f\u6211\u4eec\u4fdd\u6301\u4e00\u9897\u67d4\u8f6f\u7684\u5fc3\uff0c\u53bb\u770b\u89c1\u3001\u53bb\u503e\u542c\u3001\u53bb\u5171\u60c5\u3002<br>\n      \u613f\u5149\u5f71\u53ef\u4ee5\u6210\u4e3a\u7ebd\u5e26\uff0c\u628a\u5584\u610f\u4f20\u9012\u5230\u5730\u7403\u7684\u6bcf\u4e00\u4e2a\u89d2\u843d\u3002<br>\n      \u613f\u4e16\u95f4\u6240\u6709\u7684\u7f8e\u597d\uff0c\u90fd\u80fd\u88ab\u66f4\u591a\u4eba\u770b\u89c1\u3002\n    <\/div>\n  <\/section>\n  <div class=\"ambassador-sections\">\n    <div class=\"ambassador-card\">\n      <div class=\"ambassador-card-title\">\n        <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"2\"><path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"\/><\/svg>\n        \u516c\u76ca\u7406\u5ff5\n      <\/div>\n      <div class=\"ambassador-card-text\">\n       &#8220;\u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c&#8221;\uff0c\u5e0c\u671b\u501f\u7531\u5149\u5f71\u7684\u529b\u91cf\uff0c\u8ba9\u66f4\u591a\u4eba\u770b\u89c1\u4e0d\u540c\u56fd\u5ea6\u7684\u751f\u6d3b\u4e0e\u6545\u4e8b\uff0c\u5728\u7406\u89e3\u4e2d\u751f\u51fa\u5584\u610f\uff0c\u5728\u5584\u610f\u4e2d\u642d\u5efa\u8fde\u63a5\u3002\n      <\/div>\n    <\/div>\n    <div class=\"ambassador-card\">\n      <div class=\"ambassador-card-title\">\n        <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"M12 6v6l4 2\"\/><\/svg>\n        \u5173\u6ce8\u9886\u57df\n      <\/div>\n      <div class=\"ambassador-causes\">\n        <div class=\"cause-item\" onclick=\"showToast('\u6b63\u5728\u524d\u5f80\u300c\u513f\u7ae5\u6559\u80b2\u300d\u4e13\u9898\u9875\u2026')\">\n          <div class=\"cause-icon\">\n            <svg width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"1.5\"><path d=\"M4 19.5A2.5 2.5 0 0 1 6.5 17H20\"\/><path d=\"M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z\"\/><\/svg>\n          <\/div>\n          <div class=\"cause-name\">\u513f\u7ae5\u6559\u80b2<\/div>\n        <\/div>\n        <div class=\"cause-item\" onclick=\"showToast('\u6b63\u5728\u524d\u5f80\u300c\u5973\u6027\u6210\u957f\u300d\u4e13\u9898\u9875\u2026')\">\n          <div class=\"cause-icon\">\n            <svg width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"1.5\"><path d=\"M12 22c4.97 0 9-4.03 9-9s-4.03-9-9-9-9 4.03-9 9 4.03 9 9 9z\"\/><path d=\"M12 8v8M8 12h8\"\/><\/svg>\n          <\/div>\n          <div class=\"cause-name\">\u5973\u6027\u6210\u957f<\/div>\n        <\/div>\n        <div class=\"cause-item\" onclick=\"showToast('\u6b63\u5728\u524d\u5f80\u300c\u533b\u7597\u6551\u52a9\u300d\u4e13\u9898\u9875\u2026')\">\n          <div class=\"cause-icon\">\n            <svg width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"1.5\"><path d=\"M22 12h-4l-3 9L9 3l-3 9H2\"\/><\/svg>\n          <\/div>\n          <div class=\"cause-name\">\u533b\u7597\u6551\u52a9<\/div>\n        <\/div>\n        <div class=\"cause-item\" onclick=\"showToast('\u6b63\u5728\u524d\u5f80\u300c\u6587\u5316\u4f20\u627f\u300d\u4e13\u9898\u9875\u2026')\">\n          <div class=\"cause-icon\">\n            <svg width=\"32\" height=\"32\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"1.5\"><path d=\"M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z\"\/><polyline points=\"14 2 14 8 20 8\"\/><path d=\"M8 13h8M8 17h5\"\/><\/svg>\n          <\/div>\n          <div class=\"cause-name\">\u6587\u5316\u4f20\u627f<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n    <div class=\"ambassador-card\">\n      <div class=\"ambassador-card-title\">\n        <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"2\"><path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"\/><\/svg>\n        \u8054\u5408\u5021\u8bae\n      <\/div>\n      <div class=\"ambassador-card-text\">\n        &#8220;\u6211\u9080\u8bf7\u4f60\uff0c\u548c\u6211\u4e00\u8d77\u52a0\u5165\u5fc3\u94fe\u3002\u4e0d\u7528\u505a\u591a\u4e48\u4f1f\u5927\u7684\u4e8b\uff0c\u53ea\u9700\u8981\u7741\u5f00\u773c\u775b\uff0c\u53bb\u770b\u89c1\u8fdc\u65b9\u7684\u4eba\u4eec\uff1b\u53ea\u9700\u8981\u655e\u5f00\u5fc3\u6249\uff0c\u53bb\u503e\u542c\u4e0d\u540c\u7684\u58f0\u97f3\u3002\u5f53193\u4e2a\u56fd\u5bb6\u7684\u5fc3\u58f0\u8fde\u5728\u4e00\u8d77\uff0c\u6211\u4eec\u5c31\u80fd\u62e5\u6709\u4e00\u4e2a\u66f4\u6e29\u67d4\u3001\u66f4\u5305\u5bb9\u7684\u4e16\u754c\u3002&#8221;\n        <br><br>\n        \u2014\u2014 \u96c5\u96c5\u9e2d\u5440\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<!-- ===== \u5173\u4e8e\u6211\u4eec\u9875 ===== -->\n<div class=\"view\" id=\"view-about\">\n  <section class=\"section\">\n    <div class=\"section-header\">\n      <div class=\"section-tag\">ABOUT US<\/div>\n      <h2 class=\"section-title\">\u5173\u4e8e\u6211\u4eec<\/h2>\n      <p class=\"section-desc\">\u4e00\u4e2a\u5173\u4e8e\u5584\u610f\u3001\u5149\u5f71\u4e0e\u8fde\u63a5\u7684\u6545\u4e8b<\/p>\n    <\/div>\n    <div class=\"about-content\">\n      <div class=\"about-block\">\n        <h3>\u6211\u4eec\u7684\u4f7f\u547d<\/h3>\n        <p>\u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c\u662f\u4e00\u4e2a\u975e\u8425\u5229\u516c\u76ca\u5e73\u53f0\uff0c\u81f4\u529b\u4e8e\u7528\u5149\u5f71\u4e0e\u6545\u4e8b\u8fde\u63a5\u5730\u7403\u4e0a\u7684\u6bcf\u4e00\u4e2a\u89d2\u843d\u3002\u6211\u4eec\u76f8\u4fe1\uff0c\u7406\u89e3\u662f\u5584\u610f\u7684\u8d77\u70b9\uff0c\u800c\u770b\u89c1\u662f\u7406\u89e3\u7684\u7b2c\u4e00\u6b65\u3002<\/p>\n        <p>\u6211\u4eec\u5e0c\u671b\u901a\u8fc7\u4eba\u6587\u7eaa\u5b9e\u3001\u516c\u76ca\u77ed\u7247\u3001\u4e16\u754c\u6545\u4e8b\u7b49\u5185\u5bb9\uff0c\u8ba9\u4e0d\u540c\u56fd\u5bb6\u3001\u4e0d\u540c\u6587\u5316\u80cc\u666f\u7684\u4eba\u4eec\u80fd\u591f\u770b\u89c1\u5f7c\u6b64\u7684\u751f\u6d3b\uff0c\u5728\u5dee\u5f02\u4e2d\u5bfb\u627e\u5171\u901a\uff0c\u5728\u964c\u751f\u4e2d\u751f\u51fa\u6e29\u60c5\u3002<\/p>\n      <\/div>\n      <div class=\"about-block\">\n        <h3>\u5fc3\u94fe\u7684\u542b\u4e49<\/h3>\n        <p>\u4e16\u754c\u5171\u6709193\u4e2a\u56fd\u5bb6\u3002\u6bcf\u4e00\u4e2a\u56fd\u5bb6\uff0c\u90fd\u662f\u5fc3\u94fe\u4e0a\u7684\u4e00\u73af\uff1b\u6bcf\u4e00\u4e2a\u4eba\uff0c\u90fd\u662f\u8fd9\u73af\u4e0a\u95ea\u95ea\u53d1\u5149\u7684\u70b9\u3002\u5f53193\u9897\u5fc3\u8fde\u5728\u4e00\u8d77\uff0c\u5c31\u5f62\u6210\u4e86\u4e00\u6761\u8de8\u8d8a\u5c71\u6d77\u3001\u65e0\u754c\u65e0\u7586\u7684\u5fc3\u94fe\u3002<\/p>\n        <p>\u8fd9\u6761\u94fe\u4e0d\u8ffd\u6c42\u901f\u5ea6\u4e0e\u6548\u7387\uff0c\u53ea\u5728\u4e4e\u771f\u8bda\u4e0e\u6e29\u5ea6\u3002\u5b83\u4e0d\u8d29\u5356\u5546\u54c1\u4e0e\u670d\u52a1\uff0c\u53ea\u4f20\u9012\u6545\u4e8b\u4e0e\u5584\u610f\u3002<\/p>\n      <\/div>\n      <div class=\"about-block\">\n        <h3>\u53d1\u5c55\u8def\u7ebf<\/h3>\n        <div class=\"about-timeline\">\n          <div class=\"timeline-item\">\n            <div class=\"timeline-phase\">\u7b2c\u4e00\u671f \u00b7 MVP<\/div>\n            <div class=\"timeline-title\">\u70b9\u4eae\u9996\u6279\u56fd\u5bb6<\/div>\n            <div class=\"timeline-desc\">\u5b8c\u6210\u7f51\u7ad9\u57fa\u7840\u6846\u67b6\uff0c\u4e0a\u7ebf\u5fc3\u94fe\u5730\u56fe\u3001\u5149\u5f71\u56de\u54cd\u3001\u5168\u7403\u5fc3\u58f0\u4e09\u5927\u6838\u5fc3\u6a21\u5757\uff0c\u9996\u6279\u70b9\u4eae20-30\u4e2a\u56fd\u5bb6\u7684\u4eba\u6587\u5185\u5bb9\u3002<\/div>\n          <\/div>\n          <div class=\"timeline-item\">\n            <div class=\"timeline-phase\">\u7b2c\u4e8c\u671f \u00b7 \u6210\u957f<\/div>\n            <div class=\"timeline-title\">\u6269\u5c55\u5185\u5bb9\u4e0e\u793e\u533a<\/div>\n            <div class=\"timeline-desc\">\u4e0a\u7ebf\u516c\u76ca\u5fae\u5149\u3001\u96c5\u829d\u5bc4\u8bed\u4e13\u533a\uff0c\u652f\u6301\u591a\u8bed\u8a00\u5207\u6362\uff0c\u5f00\u653e\u7528\u6237\u6295\u7a3f\u7cfb\u7edf\uff0c\u5fc3\u94fe\u8986\u76d6\u6269\u5c55\u81f380\u4e2a\u56fd\u5bb6\u3002<\/div>\n          <\/div>\n          <div class=\"timeline-item\">\n            <div class=\"timeline-phase\">\u7b2c\u4e09\u671f \u00b7 \u7efd\u653e<\/div>\n            <div class=\"timeline-title\">\u8fde\u63a5193\u4e2a\u56fd\u5ea6<\/div>\n            <div class=\"timeline-desc\">\u5b8c\u6210\u5168\u90e8193\u4e2a\u56fd\u5bb6\u7684\u5185\u5bb9\u8986\u76d6\uff0c\u5bf9\u63a5\u5168\u7403\u516c\u76ca\u7ec4\u7ec7\uff0c\u53d1\u8d77\u8de8\u56fd\u516c\u76ca\u8054\u5408\u884c\u52a8\uff0c\u8ba9\u5fc3\u94fe\u771f\u6b63\u8fde\u63a5\u6574\u4e2a\u5730\u7403\u3002<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      <div class=\"about-block\">\n        <h3>\u5185\u5bb9\u58f0\u660e<\/h3>\n        <p>\u672c\u7f51\u7ad9\u4e3a\u975e\u8425\u5229\u516c\u76ca\u5e73\u53f0\uff0c\u6240\u6709\u5185\u5bb9\u5747\u7528\u4e8e\u516c\u76ca\u4f20\u64ad\u4e0e\u6587\u5316\u4ea4\u6d41\u3002<\/p>\n      <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n<\/div>\n\n<!-- ===== \u9875\u811a ===== -->\n<footer class=\"footer\">\n  <div class=\"footer-logo\">\n    <svg width=\"24\" height=\"24\" viewBox=\"0 0 100 100\"><path d=\"M50 88 C20 65 10 45 10 30 C10 15 22 8 35 8 C42 8 47 12 50 18 C53 12 58 8 65 8 C78 8 90 15 90 30 C90 45 80 65 50 88Z\" fill=\"#e8a87c\"\/><\/svg>\n    \u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c\n  <\/div>\n  <p class=\"footer-desc\">\n    193\u4e2a\u56fd\u5ea6\uff0c\u4e00\u6761\u5fc3\u94fe\u3002\u4ee5\u5149\u5f71\u4e3a\u6865\uff0c\u4ee5\u5584\u610f\u76f8\u8fde\u3002<br>\n    \u613f\u5730\u7403\u4e0a\u6bcf\u4e00\u4e2a\u89d2\u843d\u7684\u4eba\uff0c\u90fd\u80fd\u770b\u89c1\u8fdc\u65b9\uff0c\u770b\u89c1\u5f7c\u6b64\u3002\n  <\/p>\n  <div class=\"footer-links\">\n    <a onclick=\"navigate('home')\">\u9996\u9875<\/a>\n    <a onclick=\"navigate('map')\">\u5fc3\u94fe\u5730\u56fe<\/a>\n    <a onclick=\"navigate('films')\">\u5149\u5f71\u56de\u54cd<\/a>\n    <a onclick=\"navigate('voices')\">\u5168\u7403\u5fc3\u58f0<\/a>\n    <a onclick=\"navigate('about')\">\u5173\u4e8e\u6211\u4eec<\/a>\n  <\/div>\n  <div class=\"footer-copyright\">\n    \u00a9 2026 \u5fc3\u94fe\u00b7\n  <\/div>\n<\/footer>\n\n<!-- Toast -->\n<div class=\"toast\" id=\"toast\"><\/div>\n\n<script>\n\/\/ ===== \u6570\u636e =====\nconst countries = [\n  { id: 'cn', name: '\u4e2d\u56fd', en: 'China', x: 740, y: 140, lit: true, capital: '\u5317\u4eac', language: '\u6c49\u8bed', population: '14\u4ebf', region: '\u4e1c\u4e9a', story: '\u4e2d\u56fd\u62e5\u6709\u4e94\u5343\u5e74\u60a0\u4e45\u6587\u660e\uff0c\u4ece\u957f\u57ce\u5230\u6545\u5bab\uff0c\u4ece\u6c5f\u5357\u6c34\u4e61\u5230\u897f\u5317\u5927\u6f20\uff0c\u6bcf\u4e00\u5bf8\u571f\u5730\u90fd\u627f\u8f7d\u7740\u6df1\u539a\u7684\u5386\u53f2\u4e0e\u6587\u5316\u3002\u5982\u4eca\u7684\u4e2d\u56fd\uff0c\u65e2\u4fdd\u7559\u7740\u4f20\u7edf\u7684\u97f5\u5473\uff0c\u4e5f\u7115\u53d1\u7740\u73b0\u4ee3\u7684\u6d3b\u529b\u3002', films: [{title: '\u300a\u6211\u4eec\u8bde\u751f\u5728\u4e2d\u56fd\u300b', desc: '\u8fea\u58eb\u5c3c\u81ea\u7136\u7eaa\u5f55\u7247\uff0c\u5c55\u73b0\u4e2d\u56fd\u73cd\u7a00\u52a8\u7269\u7684\u751f\u547d\u6545\u4e8b'}, {title: '\u300a\u820c\u5c16\u4e0a\u7684\u4e2d\u56fd\u300b', desc: '\u7528\u7f8e\u98df\u8bb2\u8ff0\u4e2d\u56fd\u5927\u5730\u7684\u4eba\u6587\u6545\u4e8b'}] },\n  { id: 'jp', name: '\u65e5\u672c', en: 'Japan', x: 810, y: 130, lit: true, capital: '\u4e1c\u4eac', language: '\u65e5\u8bed', population: '1.26\u4ebf', region: '\u4e1c\u4e9a', story: '\u65e5\u672c\u662f\u4e00\u4e2a\u5c06\u4f20\u7edf\u4e0e\u73b0\u4ee3\u5b8c\u7f8e\u878d\u5408\u7684\u56fd\u5ea6\u3002\u4eac\u90fd\u7684\u53e4\u5bfa\u4e0e\u6a31\u82b1\u3001\u4e1c\u4eac\u7684\u9713\u8679\u4e0e\u7e41\u534e\u3001\u5317\u6d77\u9053\u7684\u96ea\u4e0e\u6e29\u6cc9\uff0c\u6784\u6210\u4e86\u8fd9\u4e2a\u5c9b\u56fd\u72ec\u7279\u7684\u9b45\u529b\u3002', films: [{title: '\u300a\u5c0f\u68ee\u6797\u300b', desc: '\u7528\u56db\u5b63\u7f8e\u98df\u8bb2\u8ff0\u4e61\u6751\u751f\u6d3b\u7684\u5b81\u9759\u4e0e\u7f8e\u597d'}, {title: '\u300a\u6d77\u8857\u65e5\u8bb0\u300b', desc: '\u56db\u59d0\u59b9\u7684\u6e29\u60c5\u6545\u4e8b\uff0c\u5c55\u73b0\u65e5\u672c\u9570\u4ed3\u7684\u56db\u5b63\u4e4b\u7f8e'}] },\n  { id: 'in', name: '\u5370\u5ea6', en: 'India', x: 680, y: 180, lit: true, capital: '\u65b0\u5fb7\u91cc', language: '\u5370\u5730\u8bed\/\u82f1\u8bed', population: '14\u4ebf', region: '\u5357\u4e9a', story: '\u5370\u5ea6\u662f\u4e00\u4e2a\u8272\u5f69\u6591\u6593\u7684\u56fd\u5ea6\uff0c\u4ece\u6cf0\u59ec\u9675\u7684\u7eaf\u767d\u5230\u658b\u6d66\u5c14\u7684\u7c89\u7ea2\uff0c\u4ece\u6052\u6cb3\u7554\u7684\u6668\u7977\u5230\u5b9d\u83b1\u575e\u7684\u6b4c\u821e\uff0c\u6bcf\u4e00\u4e2a\u89d2\u843d\u90fd\u5145\u6ee1\u4e86\u751f\u547d\u529b\u4e0e\u6545\u4e8b\u611f\u3002', films: [{title: '\u300a\u6454\u8de4\u5427\uff01\u7238\u7238\u300b', desc: '\u4e00\u4e2a\u7236\u4eb2\u57f9\u517b\u5973\u513f\u6210\u4e3a\u6454\u8de4\u51a0\u519b\u7684\u52b1\u5fd7\u6545\u4e8b'}, {title: '\u300a\u8d2b\u6c11\u7a9f\u7684\u767e\u4e07\u5bcc\u7fc1\u300b', desc: '\u5b5f\u4e70\u5c11\u5e74\u7684\u4f20\u5947\u4eba\u751f\uff0c\u5c55\u73b0\u5370\u5ea6\u793e\u4f1a\u7684\u591a\u5143\u9762\u8c8c'}] },\n  { id: 'us', name: '\u7f8e\u56fd', en: 'United States', x: 200, y: 130, lit: true, capital: '\u534e\u76db\u987f', language: '\u82f1\u8bed', population: '3.3\u4ebf', region: '\u5317\u7f8e\u6d32', story: '\u7f8e\u56fd\u662f\u4e00\u4e2a\u79fb\u6c11\u56fd\u5bb6\uff0c\u591a\u5143\u6587\u5316\u5728\u8fd9\u91cc\u4ea4\u878d\u78b0\u649e\u3002\u4ece\u7ebd\u7ea6\u7684\u6469\u5929\u5927\u697c\u5230\u4e9a\u5229\u6851\u90a3\u7684\u5927\u5ce1\u8c37\uff0c\u4ece\u65b0\u5965\u5c14\u826f\u7684\u7235\u58eb\u4e50\u5230\u52a0\u5dde\u7684\u9633\u5149\u6d77\u6ee9\uff0c\u8fd9\u7247\u571f\u5730\u5145\u6ee1\u4e86\u53ef\u80fd\u6027\u3002', films: [{title: '\u300a\u963f\u7518\u6b63\u4f20\u300b', desc: '\u4e00\u4e2a\u666e\u901a\u4eba\u7a7f\u8d8a\u7f8e\u56fd\u51e0\u5341\u5e74\u5386\u53f2\u7684\u6e29\u6696\u6545\u4e8b'}, {title: '\u300a\u7f8e\u56fd\u4e3d\u4eba\u300b', desc: '\u63a2\u8ba8\u7f8e\u56fd\u5bb6\u5ead\u4e0e\u4eba\u751f\u610f\u4e49\u7684\u7ecf\u5178\u5f71\u7247'}] },\n  { id: 'fr', name: '\u6cd5\u56fd', en: 'France', x: 470, y: 105, lit: true, capital: '\u5df4\u9ece', language: '\u6cd5\u8bed', population: '6700\u4e07', region: '\u897f\u6b27', story: '\u6cd5\u56fd\u662f\u6d6a\u6f2b\u4e0e\u827a\u672f\u7684\u4ee3\u540d\u8bcd\u3002\u5df4\u9ece\u7684\u57c3\u83f2\u5c14\u94c1\u5854\u4e0e\u5362\u6d6e\u5bab\u3001\u666e\u7f57\u65fa\u65af\u7684\u85b0\u8863\u8349\u7530\u3001\u6ce2\u5c14\u591a\u7684\u8461\u8404\u56ed\u3001\u8bfa\u66fc\u5e95\u7684\u6d77\u5cb8\uff0c\u6bcf\u4e00\u5904\u90fd\u6563\u53d1\u7740\u72ec\u7279\u7684\u4f18\u96c5\u4e0e\u8bd7\u610f\u3002', films: [{title: '\u300a\u5929\u4f7f\u7231\u7f8e\u4e3d\u300b', desc: '\u5df4\u9ece\u5973\u5b69\u7684\u5947\u601d\u5999\u60f3\u4e0e\u6e29\u6696\u5584\u610f'}, {title: '\u300a\u89e6\u4e0d\u53ef\u53ca\u300b', desc: '\u4e24\u4e2a\u4e0d\u540c\u4e16\u754c\u7684\u4eba\u4e4b\u95f4\u7684\u771f\u631a\u53cb\u8c0a'}] },\n  { id: 'uk', name: '\u82f1\u56fd', en: 'United Kingdom', x: 455, y: 95, lit: true, capital: '\u4f26\u6566', language: '\u82f1\u8bed', population: '6700\u4e07', region: '\u897f\u6b27', story: '\u82f1\u56fd\u6709\u7740\u6df1\u539a\u7684\u5386\u53f2\u5e95\u8574\u4e0e\u72ec\u7279\u7684\u7ec5\u58eb\u6587\u5316\u3002\u4f26\u6566\u7684\u5927\u672c\u949f\u4e0e\u7ea2\u8272\u53cc\u5c42\u5df4\u58eb\u3001\u725b\u6d25\u5251\u6865\u7684\u5b66\u9662\u6c1b\u56f4\u3001\u82cf\u683c\u5170\u7684\u9ad8\u5730\u4e0e\u98ce\u7b1b\u3001\u6e56\u533a\u7684\u8bd7\u610f\u98ce\u5149\uff0c\u6784\u6210\u4e86\u8fd9\u4e2a\u5c9b\u56fd\u7684\u591a\u5143\u9b45\u529b\u3002', films: [{title: '\u300a\u771f\u7231\u81f3\u4e0a\u300b', desc: '\u4f26\u6566\u5723\u8bde\u524d\u5915\u7684\u5341\u4e2a\u7231\u60c5\u6545\u4e8b'}, {title: '\u300a\u56fd\u738b\u7684\u6f14\u8bb2\u300b', desc: '\u82f1\u56fd\u56fd\u738b\u4e54\u6cbb\u516d\u4e16\u514b\u670d\u53e3\u5403\u7684\u52b1\u5fd7\u6545\u4e8b'}] },\n  { id: 'br', name: '\u5df4\u897f', en: 'Brazil', x: 280, y: 290, lit: true, capital: '\u5df4\u897f\u5229\u4e9a', language: '\u8461\u8404\u7259\u8bed', population: '2.1\u4ebf', region: '\u5357\u7f8e\u6d32', story: '\u5df4\u897f\u662f\u4e00\u4e2a\u5145\u6ee1\u70ed\u60c5\u4e0e\u6d3b\u529b\u7684\u56fd\u5ea6\u3002\u91cc\u7ea6\u70ed\u5185\u5362\u7684\u57fa\u7763\u50cf\u4e0e\u79d1\u5e15\u5361\u5df4\u7eb3\u6d77\u6ee9\u3001\u4e9a\u9a6c\u900a\u96e8\u6797\u7684\u795e\u79d8\u4e0e\u58ee\u9614\u3001\u8428\u5c14\u74e6\u591a\u7684\u975e\u6d32\u6587\u5316\u9057\u4ea7\u3001\u72c2\u6b22\u8282\u7684\u6851\u5df4\u4e0e\u8272\u5f69\uff0c\u6bcf\u4e00\u5904\u90fd\u5728\u71c3\u70e7\u7740\u751f\u547d\u7684\u6fc0\u60c5\u3002', films: [{title: '\u300a\u4e0a\u5e1d\u4e4b\u57ce\u300b', desc: '\u91cc\u7ea6\u70ed\u5185\u5362\u8d2b\u6c11\u7a9f\u7684\u6210\u957f\u6545\u4e8b'}, {title: '\u300a\u4e2d\u592e\u8f66\u7ad9\u300b', desc: '\u4e00\u6bb5\u7a7f\u8d8a\u5df4\u897f\u7684\u5bfb\u627e\u4e0e\u6551\u8d4e\u4e4b\u65c5'}] },\n  { id: 'au', name: '\u6fb3\u5927\u5229\u4e9a', en: 'Australia', x: 860, y: 360, lit: true, capital: '\u582a\u57f9\u62c9', language: '\u82f1\u8bed', population: '2600\u4e07', region: '\u5927\u6d0b\u6d32', story: '\u6fb3\u5927\u5229\u4e9a\u662f\u4e00\u7247\u53e4\u8001\u800c\u8fbd\u9614\u7684\u5927\u9646\u3002\u6089\u5c3c\u6b4c\u5267\u9662\u7684\u767d\u5e06\u3001\u5927\u5821\u7901\u7684\u5947\u5e7b\u6d77\u5e95\u3001\u4e4c\u9c81\u9c81\u7684\u7ea2\u8272\u5de8\u77f3\u3001\u888b\u9f20\u4e0e\u8003\u62c9\u7684\u53ef\u7231\u8eab\u5f71\uff0c\u4ee5\u53ca\u539f\u4f4f\u6c11\u7684\u68a6\u5e7b\u65f6\u5149\u6587\u5316\uff0c\u6784\u6210\u4e86\u8fd9\u4e2a\u5357\u534a\u7403\u56fd\u5ea6\u7684\u72ec\u7279\u98ce\u8c8c\u3002', films: [{title: '\u300a\u6fb3\u5927\u5229\u4e9a\u300b', desc: '\u4e8c\u6218\u65f6\u671f\u6fb3\u5927\u5229\u4e9a\u5185\u9646\u7684\u53f2\u8bd7\u7231\u60c5\u6545\u4e8b'}, {title: '\u300a\u75af\u72c2\u7684\u9ea6\u514b\u65af\uff1a\u72c2\u66b4\u4e4b\u8def\u300b', desc: '\u6fb3\u5927\u5229\u4e9a\u8352\u6f20\u4e2d\u7684\u672b\u4e16\u5947\u5e7b\u5192\u9669'}] },\n  { id: 'eg', name: '\u57c3\u53ca', en: 'Egypt', x: 540, y: 200, lit: true, capital: '\u5f00\u7f57', language: '\u963f\u62c9\u4f2f\u8bed', population: '1\u4ebf', region: '\u5317\u975e', story: '\u57c3\u53ca\u662f\u4eba\u7c7b\u6587\u660e\u7684\u6447\u7bee\u4e4b\u4e00\u3002\u5409\u8428\u91d1\u5b57\u5854\u7684\u5343\u5e74\u795e\u79d8\u3001\u5362\u514b\u7d22\u795e\u5e99\u7684\u5b8f\u4f1f\u67f1\u5eca\u3001\u5c3c\u7f57\u6cb3\u7684\u843d\u65e5\u4e0e\u5e06\u8239\u3001\u7ea2\u6d77\u7684\u78a7\u84dd\u73ca\u745a\uff0c\u4ee5\u53ca\u5f00\u7f57\u8001\u57ce\u7684\u55a7\u56a3\u4e0e\u70df\u706b\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u7a7f\u8d8a\u65f6\u7a7a\u7684\u9b45\u529b\u3002', films: [{title: '\u300a\u57c3\u53ca\u738b\u5b50\u300b', desc: '\u52a8\u753b\u53f2\u8bd7\uff0c\u8bb2\u8ff0\u6469\u897f\u4e0e\u51fa\u57c3\u53ca\u8bb0\u7684\u6545\u4e8b'}, {title: '\u300a\u5f00\u7f57\u65f6\u95f4\u300b', desc: '\u5728\u5f00\u7f57\u53d1\u751f\u7684\u4e00\u6bb5\u542b\u84c4\u800c\u7f8e\u4e3d\u7684\u7231\u60c5'}] },\n  { id: 'ke', name: '\u80af\u5c3c\u4e9a', en: 'Kenya', x: 555, y: 260, lit: true, capital: '\u5185\u7f57\u6bd5', language: '\u65af\u74e6\u5e0c\u91cc\u8bed\/\u82f1\u8bed', population: '5400\u4e07', region: '\u4e1c\u975e', story: '\u80af\u5c3c\u4e9a\u662f\u975e\u6d32\u5927\u8349\u539f\u7684\u5fc3\u810f\u3002\u9a6c\u8d5b\u9a6c\u62c9\u7684\u52a8\u7269\u5927\u8fc1\u5f99\u3001\u4e5e\u529b\u9a6c\u624e\u7f57\u5c71\u7684\u96ea\u9876\u3001\u8499\u5df4\u8428\u7684\u5370\u5ea6\u6d0b\u6d77\u6ee9\u3001\u9a6c\u8d5b\u4eba\u7684\u7ea2\u8272\u62ab\u98ce\u4e0e\u8df3\u8dc3\u821e\u8e48\uff0c\u8fd9\u7247\u571f\u5730\u4e0a\u5145\u6ee1\u4e86\u539f\u59cb\u7684\u751f\u547d\u529b\u4e0e\u81ea\u7136\u7684\u58ee\u7f8e\u3002', films: [{title: '\u300a\u8d70\u51fa\u975e\u6d32\u300b', desc: '\u4e39\u9ea6\u5973\u4f5c\u5bb6\u5728\u80af\u5c3c\u4e9a\u7684\u7231\u60c5\u4e0e\u4eba\u751f\u6545\u4e8b'}, {title: '\u300a\u72ee\u5b50\u738b\u300b', desc: '\u975e\u6d32\u5927\u8349\u539f\u4e0a\u7684\u751f\u547d\u4e0e\u6210\u957f\u53f2\u8bd7'}] },\n  { id: 'no', name: '\u632a\u5a01', en: 'Norway', x: 475, y: 75, lit: true, capital: '\u5965\u65af\u9646', language: '\u632a\u5a01\u8bed', population: '540\u4e07', region: '\u5317\u6b27', story: '\u632a\u5a01\u662f\u5ce1\u6e7e\u4e0e\u6781\u5149\u7684\u56fd\u5ea6\u3002\u76d6\u6717\u5384\u5c14\u5ce1\u6e7e\u7684\u5ced\u58c1\u4e0e\u7011\u5e03\u3001\u7f57\u5f17\u6566\u7fa4\u5c9b\u7684\u6e14\u6751\u4e0e\u6781\u5149\u3001\u7279\u7f57\u59c6\u745f\u7684\u5317\u6781\u5149\u4e4b\u591c\u3001\u5965\u65af\u9646\u7684\u8bbe\u8ba1\u4e0e\u6587\u5316\uff0c\u8fd9\u4e2a\u5317\u6b27\u56fd\u5bb6\u5c06\u81ea\u7136\u7684\u58ee\u7f8e\u4e0e\u751f\u6d3b\u7684\u7cbe\u81f4\u5b8c\u7f8e\u878d\u5408\u3002', films: [{title: '\u300a\u7d22\u5c14\u4e4b\u5b50\u300b\u5bfc\u6f14\u4f5c\u54c1', desc: '\u632a\u5a01\u7535\u5f71\u4ee5\u51b7\u5cfb\u7684\u5317\u6b27\u98ce\u683c\u8457\u79f0'}, {title: '\u300a\u632a\u5a01\u7684\u68ee\u6797\u300b', desc: '\u6539\u7f16\u81ea\u6751\u4e0a\u6625\u6811\u5c0f\u8bf4\uff0c\u867d\u975e\u632a\u5a01\u6545\u4e8b\u5374\u610f\u5883\u76f8\u901a'}] },\n  { id: 'mx', name: '\u58a8\u897f\u54e5', en: 'Mexico', x: 170, y: 190, lit: true, capital: '\u58a8\u897f\u54e5\u57ce', language: '\u897f\u73ed\u7259\u8bed', population: '1.3\u4ebf', region: '\u5317\u7f8e\u6d32', story: '\u58a8\u897f\u54e5\u662f\u4e00\u4e2a\u8272\u5f69\u6d53\u70c8\u3001\u6587\u5316\u6df1\u539a\u7684\u56fd\u5ea6\u3002\u5947\u7434\u4f0a\u5bdf\u7684\u739b\u96c5\u91d1\u5b57\u5854\u3001\u74dc\u7eb3\u534e\u6258\u7684\u5f69\u8272\u5c71\u57ce\u3001\u4ea1\u7075\u8282\u7684\u4e07\u5bff\u83ca\u4e0e\u9ab7\u9ac5\u827a\u672f\u3001\u5854\u53ef\u4e0e\u9f99\u820c\u5170\u7684\u7f8e\u98df\u6587\u5316\uff0c\u4ee5\u53ca\u5f17\u91cc\u8fbe\u00b7\u5361\u7f57\u7684\u827a\u672f\u4f20\u5947\uff0c\u6bcf\u4e00\u5904\u90fd\u5728\u8bc9\u8bf4\u7740\u8fd9\u4e2a\u6c11\u65cf\u7684\u70ed\u60c5\u4e0e\u575a\u97e7\u3002', films: [{title: '\u300a\u5bfb\u68a6\u73af\u6e38\u8bb0\u300b', desc: '\u4ee5\u58a8\u897f\u54e5\u4ea1\u7075\u8282\u4e3a\u80cc\u666f\u7684\u6e29\u60c5\u52a8\u753b'}, {title: '\u300a\u7f57\u9a6c\u300b', desc: '\u58a8\u897f\u54e5\u57ce\u7f57\u9a6c\u533a\u7684\u5bb6\u5ead\u8bb0\u5fc6\u4e0e\u65f6\u4ee3\u53d8\u8fc1'}] },\n  { id: 'ru', name: '\u4fc4\u7f57\u65af', en: 'Russia', x: 600, y: 80, lit: true, capital: '\u83ab\u65af\u79d1', language: '\u4fc4\u8bed', population: '1.4\u4ebf', region: '\u4e1c\u6b27\/\u5317\u4e9a', story: '\u4fc4\u7f57\u65af\u662f\u4e16\u754c\u4e0a\u9762\u79ef\u6700\u5927\u7684\u56fd\u5bb6\uff0c\u6a2a\u8de8\u6b27\u4e9a\u5927\u9646\u3002\u83ab\u65af\u79d1\u7ea2\u573a\u7684\u5723\u74e6\u897f\u91cc\u5927\u6559\u5802\u3001\u5723\u5f7c\u5f97\u5821\u7684\u51ac\u5bab\u4e0e\u767d\u591c\u3001\u8d1d\u52a0\u5c14\u6e56\u7684\u6df1\u84dd\u51b0\u9762\u3001\u897f\u4f2f\u5229\u4e9a\u7684\u5e7f\u88a4\u68ee\u6797\uff0c\u4ee5\u53ca\u6258\u5c14\u65af\u6cf0\u3001\u67f4\u53ef\u592b\u65af\u57fa\u7b49\u5927\u5e08\u7684\u7cbe\u795e\u9057\u4ea7\uff0c\u6784\u6210\u4e86\u8fd9\u4e2a\u56fd\u5ea6\u7684\u96c4\u6d51\u4e0e\u6df1\u6c89\u3002', films: [{title: '\u300a\u6218\u4e89\u4e0e\u548c\u5e73\u300b', desc: '\u6258\u5c14\u65af\u6cf0\u53f2\u8bd7\u7684\u7535\u5f71\u6539\u7f16\uff0c\u5c55\u73b0\u4fc4\u7f57\u65af\u6c11\u65cf\u7cbe\u795e'}, {title: '\u300a\u83ab\u65af\u79d1\u4e0d\u76f8\u4fe1\u773c\u6cea\u300b', desc: '\u82cf\u8054\u65f6\u4ee3\u7684\u5973\u6027\u6210\u957f\u4e0e\u7231\u60c5\u7ecf\u5178'}] },\n  { id: 'za', name: '\u5357\u975e', en: 'South Africa', x: 525, y: 340, lit: true, capital: '\u6bd4\u52d2\u9640\u5229\u4e9a', language: '11\u79cd\u5b98\u65b9\u8bed\u8a00', population: '6000\u4e07', region: '\u5357\u975e', story: '\u5357\u975e\u88ab\u79f0\u4e3a\"\u5f69\u8679\u4e4b\u56fd\"\uff0c\u662f\u4e16\u754c\u4e0a\u6587\u5316\u6700\u591a\u5143\u7684\u56fd\u5bb6\u4e4b\u4e00\u3002\u5f00\u666e\u6566\u7684\u684c\u5c71\u4e0e\u597d\u671b\u89d2\u3001\u514b\u9c81\u683c\u56fd\u5bb6\u516c\u56ed\u7684\u91ce\u751f\u52a8\u7269\u3001\u7ea6\u7ff0\u5185\u65af\u5821\u7684\u57ce\u5e02\u6d3b\u529b\u3001\u7f57\u672c\u5c9b\u7684\u5386\u53f2\u8bb0\u5fc6\uff0c\u4ee5\u53ca\u66fc\u5fb7\u62c9\u7684\u7cbe\u795e\u9057\u4ea7\uff0c\u6784\u6210\u4e86\u8fd9\u4e2a\u56fd\u5ea6\u7684\u591a\u5143\u4e0e\u5305\u5bb9\u3002', films: [{title: '\u300a\u6210\u4e8b\u5728\u4eba\u300b', desc: '\u66fc\u5fb7\u62c9\u901a\u8fc7\u6a44\u6984\u7403\u56e2\u7ed3\u5357\u975e\u7684\u771f\u5b9e\u6545\u4e8b'}, {title: '\u300a\u5362\u65fa\u8fbe\u996d\u5e97\u300b', desc: '\u867d\u4ee5\u5362\u65fa\u8fbe\u4e3a\u80cc\u666f\uff0c\u5374\u5c55\u73b0\u4e86\u975e\u6d32\u5927\u9646\u7684\u82e6\u96be\u4e0e\u5e0c\u671b'}] },\n  { id: 'it', name: '\u610f\u5927\u5229', en: 'Italy', x: 490, y: 115, lit: true, capital: '\u7f57\u9a6c', language: '\u610f\u5927\u5229\u8bed', population: '6000\u4e07', region: '\u5357\u6b27', story: '\u610f\u5927\u5229\u662f\u6587\u827a\u590d\u5174\u7684\u53d1\u6e90\u5730\uff0c\u4e5f\u662f\u7f8e\u98df\u4e0e\u65f6\u5c1a\u7684\u56fd\u5ea6\u3002\u7f57\u9a6c\u7684\u6597\u517d\u573a\u4e0e\u4e07\u795e\u6bbf\u3001\u4f5b\u7f57\u4f26\u8428\u7684\u4e4c\u83f2\u5179\u7f8e\u672f\u9986\u4e0e\u5927\u536b\u50cf\u3001\u5a01\u5c3c\u65af\u7684\u8fd0\u6cb3\u4e0e\u8d21\u591a\u62c9\u3001\u6258\u65af\u5361\u7eb3\u7684\u8461\u8404\u56ed\u4e0e\u6a44\u6984\u6811\u3001\u90a3\u4e0d\u52d2\u65af\u7684\u62ab\u8428\u4e0e\u9633\u5149\uff0c\u6bcf\u4e00\u5904\u90fd\u662f\u4e00\u573a\u89c6\u89c9\u4e0e\u5473\u89c9\u7684\u76db\u5bb4\u3002', films: [{title: '\u300a\u7f8e\u4e3d\u4eba\u751f\u300b', desc: '\u4e8c\u6218\u65f6\u671f\u4e00\u4f4d\u7236\u4eb2\u7528\u8c0e\u8a00\u5b88\u62a4\u513f\u5b50\u7684\u7f8e\u4e3d\u5fc3\u7075'}, {title: '\u300a\u897f\u897f\u91cc\u7684\u7f8e\u4e3d\u4f20\u8bf4\u300b', desc: '\u897f\u897f\u91cc\u5c9b\u4e0a\u7684\u9752\u6625\u8bb0\u5fc6\u4e0e\u4eba\u6027\u89c2\u5bdf'}] },\n  { id: 'es', name: '\u897f\u73ed\u7259', en: 'Spain', x: 465, y: 125, lit: true, capital: '\u9a6c\u5fb7\u91cc', language: '\u897f\u73ed\u7259\u8bed', population: '4700\u4e07', region: '\u5357\u6b27', story: '\u897f\u73ed\u7259\u662f\u4e00\u4e2a\u5145\u6ee1\u6fc0\u60c5\u4e0e\u827a\u672f\u7684\u56fd\u5ea6\u3002\u5df4\u585e\u7f57\u90a3\u7684\u9ad8\u8fea\u5efa\u7b51\u4e0e\u5170\u5e03\u62c9\u5927\u9053\u3001\u9a6c\u5fb7\u91cc\u7684\u666e\u62c9\u591a\u535a\u7269\u9986\u4e0e\u7687\u9a6c\u3001\u585e\u7ef4\u5229\u4e9a\u7684\u5f17\u62c9\u95e8\u6208\u4e0e\u6597\u725b\u3001\u683c\u62c9\u7eb3\u8fbe\u7684\u963f\u5c14\u7f55\u5e03\u62c9\u5bab\u3001\u4f0a\u6bd4\u8428\u7684\u7535\u97f3\u4e0e\u6d77\u6ee9\uff0c\u4ee5\u53ca\u5854\u5e15\u65af\u4e0e\u6d77\u9c9c\u996d\u7684\u7f8e\u98df\u6587\u5316\uff0c\u8ba9\u8fd9\u4e2a\u5357\u6b27\u56fd\u5bb6\u6c38\u8fdc\u5145\u6ee1\u6d3b\u529b\u3002', films: [{title: '\u300a\u6f58\u795e\u7684\u8ff7\u5bab\u300b', desc: '\u897f\u73ed\u7259\u5185\u6218\u80cc\u666f\u4e0b\u7684\u6697\u9ed1\u7ae5\u8bdd\u4e0e\u5947\u5e7b\u60f3\u8c61'}, {title: '\u300a\u5bf9\u5979\u8bf4\u300b', desc: '\u963f\u83ab\u591a\u74e6\u5bfc\u6f14\u7684\u5173\u4e8e\u7231\u4e0e\u6c89\u9ed8\u7684\u6df1\u60c5\u6545\u4e8b'}] },\n  { id: 'th', name: '\u6cf0\u56fd', en: 'Thailand', x: 740, y: 210, lit: true, capital: '\u66fc\u8c37', language: '\u6cf0\u8bed', population: '7000\u4e07', region: '\u4e1c\u5357\u4e9a', story: '\u6cf0\u56fd\u88ab\u79f0\u4e3a\"\u5fae\u7b11\u4e4b\u56fd\"\uff0c\u662f\u4e1c\u5357\u4e9a\u6700\u53d7\u6b22\u8fce\u7684\u65c5\u6e38\u76ee\u7684\u5730\u4e4b\u4e00\u3002\u66fc\u8c37\u7684\u5927\u7687\u5bab\u4e0e\u6c34\u4e0a\u5e02\u573a\u3001\u6e05\u8fc8\u7684\u53e4\u57ce\u4e0e\u5bfa\u5e99\u3001\u666e\u5409\u5c9b\u7684\u78a7\u6d77\u4e0e\u767d\u6c99\u6ee9\u3001\u7d20\u53ef\u6cf0\u7684\u5386\u53f2\u9057\u8ff9\uff0c\u4ee5\u53ca\u51ac\u9634\u529f\u4e0e\u8292\u679c\u7cef\u7c73\u996d\u7684\u7f8e\u98df\uff0c\u8fd8\u6709\u6cf0\u5f0f\u6309\u6469\u7684\u653e\u677e\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u6e29\u6696\u4e0e\u60ec\u610f\u3002', films: [{title: '\u300a\u521d\u604b\u8fd9\u4ef6\u5c0f\u4e8b\u300b', desc: '\u6cf0\u56fd\u9752\u6625\u7231\u60c5\u7247\u7684\u7ecf\u5178\uff0c\u7eaf\u771f\u800c\u7f8e\u597d'}, {title: '\u300a\u5929\u624d\u67aa\u624b\u300b', desc: '\u4ee5\u8003\u8bd5\u4f5c\u5f0a\u4e3a\u9898\u6750\u7684\u7d27\u5f20\u523a\u6fc0\u6cf0\u56fd\u7535\u5f71'}] },\n  { id: 'gr', name: '\u5e0c\u814a', en: 'Greece', x: 510, y: 130, lit: true, capital: '\u96c5\u5178', language: '\u5e0c\u814a\u8bed', population: '1040\u4e07', region: '\u5357\u6b27', story: '\u5e0c\u814a\u662f\u897f\u65b9\u6587\u660e\u7684\u53d1\u6e90\u5730\uff0c\u4e5f\u662f\u7231\u7434\u6d77\u7684\u660e\u73e0\u3002\u96c5\u5178\u536b\u57ce\u7684\u5e15\u7279\u519c\u795e\u5e99\u3001\u5723\u6258\u91cc\u5c3c\u7684\u84dd\u767d\u5efa\u7b51\u4e0e\u65e5\u843d\u3001\u7c73\u79d1\u8bfa\u65af\u7684\u98ce\u8f66\u4e0e\u6d3e\u5bf9\u3001\u514b\u91cc\u7279\u5c9b\u7684\u7c73\u8bfa\u65af\u6587\u660e\u9057\u8ff9\u3001\u5965\u6797\u5339\u4e9a\u7684\u53e4\u8fd0\u52a8\u573a\uff0c\u4ee5\u53ca\u6a44\u6984\u6cb9\u4e0e\u7f8a\u5976\u916a\u7684\u5730\u4e2d\u6d77\u7f8e\u98df\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u795e\u8bdd\u4e0e\u6d6a\u6f2b\u7684\u6c14\u606f\u3002', films: [{title: '\u300a\u5988\u5988\u54aa\u5440\u300b', desc: '\u5728\u5e0c\u814a\u5c0f\u5c9b\u4e0a\u53d1\u751f\u7684\u6b22\u4e50\u97f3\u4e50\u7231\u60c5\u6545\u4e8b'}, {title: '\u300a\u5927\u9003\u4ea1\u300b', desc: '\u4e8c\u6218\u80cc\u666f\u4e0b\u7684\u7ecf\u5178\u9003\u4ea1\u7535\u5f71\uff0c\u90e8\u5206\u573a\u666f\u5728\u5e0c\u814a'}] },\n  { id: 'pe', name: '\u79d8\u9c81', en: 'Peru', x: 250, y: 280, lit: true, capital: '\u5229\u9a6c', language: '\u897f\u73ed\u7259\u8bed', population: '3300\u4e07', region: '\u5357\u7f8e\u6d32', story: '\u79d8\u9c81\u662f\u5370\u52a0\u6587\u660e\u7684\u6545\u4e61\uff0c\u4e5f\u662f\u5357\u7f8e\u6d32\u6700\u5177\u795e\u79d8\u611f\u7684\u56fd\u5ea6\u4e4b\u4e00\u3002\u9a6c\u4e18\u6bd4\u4e18\u7684\u4e91\u7aef\u53e4\u57ce\u3001\u5e93\u65af\u79d1\u7684\u5370\u52a0\u5e1d\u56fd\u9996\u90fd\u3001\u7684\u7684\u5580\u5580\u6e56\u7684\u6f02\u6d6e\u5c9b\u3001\u7eb3\u65af\u5361\u7ebf\u6761\u7684\u5343\u5e74\u8c1c\u56e2\u3001\u5229\u9a6c\u7684\u7f8e\u98df\u4e0e\u6b96\u6c11\u5efa\u7b51\uff0c\u4ee5\u53ca\u5b89\u7b2c\u65af\u5c71\u8109\u7684\u58ee\u4e3d\u98ce\u5149\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u5386\u53f2\u7684\u539a\u91cd\u4e0e\u81ea\u7136\u7684\u795e\u5947\u3002', films: [{title: '\u300a\u6469\u6258\u65e5\u8bb0\u300b', desc: '\u5207\u00b7\u683c\u74e6\u62c9\u5e74\u8f7b\u65f6\u7a7f\u8d8a\u5357\u7f8e\u7684\u65c5\u884c\u65e5\u8bb0\uff0c\u9014\u7ecf\u79d8\u9c81'}, {title: '\u300a\u9a6c\u4e18\u6bd4\u4e18\u300b\u7eaa\u5f55\u7247', desc: '\u63a2\u7d22\u5370\u52a0\u5e1d\u56fd\u5931\u843d\u4e4b\u57ce\u7684\u7eaa\u5f55\u7247'}] },\n  { id: 'nz', name: '\u65b0\u897f\u5170', en: 'New Zealand', x: 910, y: 380, lit: true, capital: '\u60e0\u7075\u987f', language: '\u82f1\u8bed\/\u6bdb\u5229\u8bed', population: '510\u4e07', region: '\u5927\u6d0b\u6d32', story: '\u65b0\u897f\u5170\u88ab\u79f0\u4e3a\"\u4e2d\u571f\u4e16\u754c\"\uff0c\u662f\u5730\u7403\u4e0a\u6700\u7eaf\u51c0\u7684\u56fd\u5ea6\u4e4b\u4e00\u3002\u7c73\u5c14\u798f\u5fb7\u5ce1\u6e7e\u7684\u5ced\u58c1\u4e0e\u7011\u5e03\u3001\u6c64\u52a0\u91cc\u7f57\u56fd\u5bb6\u516c\u56ed\u7684\u706b\u5c71\u4e0e\u7fe1\u7fe0\u6e56\u3001\u7687\u540e\u9547\u7684\u5192\u9669\u4e0e\u96ea\u5c71\u3001\u970d\u6bd4\u5c6f\u7684\u590f\u5c14\u90e1\u3001\u7f57\u6258\u9c81\u74e6\u7684\u5730\u70ed\u4e0e\u6bdb\u5229\u6587\u5316\uff0c\u4ee5\u53ca\u661f\u7a7a\u5c0f\u9547\u7279\u5361\u6ce2\u7684\u94f6\u6cb3\uff0c\u8ba9\u8fd9\u4e2a\u5357\u592a\u5e73\u6d0b\u5c9b\u56fd\u6210\u4e3a\u4e86\u73b0\u5b9e\u4e2d\u7684\u5947\u5e7b\u4e16\u754c\u3002', films: [{title: '\u300a\u6307\u73af\u738b\u300b\u4e09\u90e8\u66f2', desc: '\u5728\u65b0\u897f\u5170\u5168\u5883\u62cd\u6444\u7684\u53f2\u8bd7\u5947\u5e7b\u5de8\u4f5c'}, {title: '\u300a\u9cb8\u9a91\u58eb\u300b', desc: '\u65b0\u897f\u5170\u6bdb\u5229\u65cf\u5973\u5b69\u7684\u6210\u957f\u4e0e\u4f20\u7edf\u6545\u4e8b'}] },\n  { id: 'ma', name: '\u6469\u6d1b\u54e5', en: 'Morocco', x: 445, y: 180, lit: true, capital: '\u62c9\u5df4\u7279', language: '\u963f\u62c9\u4f2f\u8bed', population: '3700\u4e07', region: '\u5317\u975e', story: '\u6469\u6d1b\u54e5\u662f\u5317\u975e\u7684\u5b9d\u77f3\uff0c\u88ab\u79f0\u4e3a\"\u5317\u975e\u82b1\u56ed\"\u3002\u9a6c\u62c9\u5580\u4ec0\u7684\u7ea2\u8272\u8001\u57ce\u4e0e\u6770\u9a6c\u592b\u7eb3\u5e7f\u573a\u3001\u83f2\u65af\u7684\u84dd\u8272\u57ce\u95e8\u4e0e\u5343\u5e74\u53e4\u57ce\u3001\u820d\u592b\u6c99\u4e07\u7684\u84dd\u8272\u5c71\u57ce\u3001\u6492\u54c8\u62c9\u6c99\u6f20\u7684\u91d1\u8272\u6c99\u4e18\u4e0e\u661f\u7a7a\u3001\u5361\u8428\u5e03\u5170\u5361\u7684\u767d\u8272\u5efa\u7b51\u4e0e\u5927\u897f\u6d0b\u6d77\u5cb8\uff0c\u4ee5\u53ca\u8584\u8377\u8336\u4e0e\u5854\u5409\u9505\u7684\u7f8e\u98df\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u963f\u62c9\u4f2f\u4e0e\u67cf\u67cf\u5c14\u7684\u5f02\u57df\u98ce\u60c5\u3002', films: [{title: '\u300a\u5361\u8428\u5e03\u5170\u5361\u300b', desc: '\u4e8c\u6218\u7ecf\u5178\u7231\u60c5\u7535\u5f71\uff0c\u4ee5\u6469\u6d1b\u54e5\u5361\u8428\u5e03\u5170\u5361\u4e3a\u80cc\u666f'}, {title: '\u300a\u6c99\u6f20\u4e4b\u82b1\u300b', desc: '\u7d22\u9a6c\u91cc\u6a21\u7279\u534e\u8389\u4e1d\u00b7\u8fea\u91cc\u7684\u771f\u5b9e\u4eba\u751f\u6545\u4e8b'}] },\n  { id: 'is', name: '\u51b0\u5c9b', en: 'Iceland', x: 440, y: 65, lit: true, capital: '\u96f7\u514b\u96c5\u672a\u514b', language: '\u51b0\u5c9b\u8bed', population: '37\u4e07', region: '\u5317\u6b27', story: '\u51b0\u5c9b\u662f\u5730\u7403\u4e0a\u6700\u50cf\u5916\u661f\u7684\u56fd\u5ea6\uff0c\u88ab\u79f0\u4e3a\"\u51b0\u4e0e\u706b\u4e4b\u56fd\"\u3002\u96f7\u514b\u96c5\u672a\u514b\u7684\u5f69\u8272\u5c4b\u9876\u4e0e\u6781\u5149\u3001\u9ec4\u91d1\u5708\u7684\u95f4\u6b47\u6cc9\u4e0e\u8bae\u4f1a\u65e7\u5740\u3001\u84dd\u6e56\u7684\u5730\u70ed\u6e29\u6cc9\u3001\u74e6\u7279\u7eb3\u51b0\u5ddd\u7684\u51b0\u6d1e\u3001\u65af\u79d1\u52a0\u7011\u5e03\u4e0e\u585e\u91cc\u96c5\u5170\u7011\u5e03\u3001\u9ed1\u6c99\u6ee9\u7684\u7384\u6b66\u5ca9\u67f1\uff0c\u4ee5\u53ca\u5348\u591c\u9633\u5149\u4e0e\u5317\u6781\u5149\u7684\u4ea4\u66ff\uff0c\u8ba9\u8fd9\u4e2a\u5317\u5927\u897f\u6d0b\u5c9b\u56fd\u5145\u6ee1\u4e86\u8d85\u73b0\u5b9e\u7684\u7f8e\u3002', films: [{title: '\u300a\u767d\u65e5\u68a6\u60f3\u5bb6\u300b', desc: '\u4e3b\u89d2\u5728\u51b0\u5c9b\u5bfb\u627e\u5e95\u7247\uff0c\u5c55\u73b0\u4e86\u51b0\u5c9b\u7684\u58ee\u7f8e\u98ce\u5149'}, {title: '\u300a\u5fc3\u4e4b\u77f3\u300b', desc: '\u51b0\u5c9b\u9752\u6625\u6210\u957f\u7535\u5f71\uff0c\u5c55\u73b0\u51b0\u5c9b\u6e14\u6751\u7684\u751f\u6d3b'}] },\n  { id: 'pt', name: '\u8461\u8404\u7259', en: 'Portugal', x: 455, y: 130, lit: true, capital: '\u91cc\u65af\u672c', language: '\u8461\u8404\u7259\u8bed', population: '1030\u4e07', region: '\u5357\u6b27', story: '\u8461\u8404\u7259\u662f\u5927\u822a\u6d77\u65f6\u4ee3\u7684\u8d77\u70b9\uff0c\u4e5f\u662f\u6b27\u6d32\u6700\u897f\u7aef\u7684\u56fd\u5ea6\u3002\u91cc\u65af\u672c\u7684\u9ec4\u8272\u7535\u8f66\u4e0e\u963f\u5c14\u6cd5\u739b\u8001\u57ce\u3001\u6ce2\u5c14\u56fe\u7684\u675c\u7f57\u6cb3\u4e0e\u6ce2\u7279\u9152\u3001\u8f9b\u7279\u62c9\u7684\u4f69\u7eb3\u5bab\u4e0e\u6469\u5c14\u57ce\u5821\u3001\u7f57\u5361\u89d2\u7684\"\u9646\u6b62\u4e8e\u6b64\uff0c\u6d77\u59cb\u4e8e\u65af\"\u3001\u963f\u5c14\u52a0\u7ef4\u7684\u91d1\u8272\u60ac\u5d16\u4e0e\u6d77\u6ee9\uff0c\u4ee5\u53ca\u86cb\u631e\u4e0e\u6cd5\u6735\u97f3\u4e50\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u822a\u6d77\u7684\u6d6a\u6f2b\u4e0e\u5c81\u6708\u7684\u6e29\u67d4\u3002', films: [{title: '\u300a\u91cc\u65af\u672c\u4e38\u6c89\u6ca1\u300b\u7eaa\u5f55\u7247', desc: '\u4e8c\u6218\u65f6\u671f\u91cc\u65af\u672c\u4e38\u53f7\u7684\u771f\u5b9e\u5386\u53f2'}, {title: '\u300a\u53bb\u91cc\u65af\u672c\u7684\u591c\u8f66\u300b', desc: '\u5728\u8461\u8404\u7259\u91cc\u65af\u672c\u5c55\u5f00\u7684\u4e00\u6bb5\u5bfb\u627e\u4e0e\u601d\u8003\u4e4b\u65c5'}] },\n  { id: 'vn', name: '\u8d8a\u5357', en: 'Vietnam', x: 750, y: 200, lit: true, capital: '\u6cb3\u5185', language: '\u8d8a\u5357\u8bed', population: '9800\u4e07', region: '\u4e1c\u5357\u4e9a', story: '\u8d8a\u5357\u662f\u4e00\u4e2a\u5145\u6ee1\u6cd5\u5f0f\u6d6a\u6f2b\u4e0e\u4e1c\u65b9\u97f5\u5473\u7684\u56fd\u5ea6\u3002\u6cb3\u5185\u7684\u8fd8\u5251\u6e56\u4e0e\u8001\u57ce\u533a\u3001\u4e0b\u9f99\u6e7e\u7684\u5580\u65af\u7279\u5cf0\u6797\u4e0e\u6e38\u8239\u3001\u4f1a\u5b89\u7684\u706f\u7b3c\u53e4\u57ce\u4e0e\u79cb\u76c6\u6cb3\u3001\u5c98\u6e2f\u7684\u7f8e\u6eaa\u6c99\u6ee9\u4e0e\u5df4\u62ff\u5c71\u3001\u80e1\u5fd7\u660e\u5e02\u7684\u6cd5\u5f0f\u5efa\u7b51\u4e0e\u6469\u6258\u8f66\u6d41\uff0c\u4ee5\u53ca\u6cb3\u7c89\u4e0e\u6ef4\u6f0f\u5496\u5561\u7684\u7f8e\u98df\uff0c\u8ba9\u8fd9\u4e2a\u4e1c\u5357\u4e9a\u56fd\u5bb6\u5145\u6ee1\u4e86\u6cd5\u5f0f\u98ce\u60c5\u4e0e\u751f\u6d3b\u6c14\u606f\u3002', films: [{title: '\u300a\u9752\u6728\u74dc\u4e4b\u5473\u300b', desc: '\u8d8a\u5357\u5bfc\u6f14\u9648\u82f1\u96c4\u7684\u7ecf\u5178\uff0c\u5c55\u73b0\u897f\u8d21\u7684\u65e5\u5e38\u751f\u6d3b\u4e0e\u8bd7\u610f'}, {title: '\u300a\u4e09\u8f6e\u8f66\u592b\u300b', desc: '\u8d8a\u5357\u5e95\u5c42\u793e\u4f1a\u7684\u73b0\u5b9e\u4e3b\u4e49\u529b\u4f5c'}] },\n  { id: 'ar', name: '\u963f\u6839\u5ef7', en: 'Argentina', x: 270, y: 360, lit: true, capital: '\u5e03\u5b9c\u8bfa\u65af\u827e\u5229\u65af', language: '\u897f\u73ed\u7259\u8bed', population: '4600\u4e07', region: '\u5357\u7f8e\u6d32', story: '\u963f\u6839\u5ef7\u662f\u63a2\u6208\u4e0e\u8db3\u7403\u7684\u56fd\u5ea6\uff0c\u4e5f\u662f\u5357\u7f8e\u6d32\u6700\u5177\u6b27\u6d32\u98ce\u60c5\u7684\u56fd\u5bb6\u3002\u5e03\u5b9c\u8bfa\u65af\u827e\u5229\u65af\u7684\u535a\u5361\u533a\u5f69\u8272\u623f\u5b50\u4e0e\u63a2\u6208\u3001\u4f0a\u74dc\u82cf\u7011\u5e03\u7684\u4e16\u754c\u6700\u5bbd\u7011\u5e03\u7fa4\u3001\u5df4\u5854\u54e5\u5c3c\u4e9a\u7684\u4f69\u91cc\u6258\u83ab\u96f7\u8bfa\u51b0\u5ddd\u3001\u4e4c\u65af\u6000\u4e9a\u7684\u4e16\u754c\u5c3d\u5934\u706f\u5854\u3001\u95e8\u591a\u8428\u7684\u9a6c\u5c14\u8d1d\u514b\u8461\u8404\u9152\uff0c\u4ee5\u53ca\u70e4\u8089\u4e0e\u9a6c\u9edb\u8336\u7684\u996e\u98df\u6587\u5316\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u6fc0\u60c5\u4e0e\u8fbd\u9614\u3002', films: [{title: '\u300a\u6469\u6258\u65e5\u8bb0\u300b', desc: '\u5207\u00b7\u683c\u74e6\u62c9\u7a7f\u8d8a\u5357\u7f8e\u7684\u65c5\u884c\uff0c\u7ec8\u70b9\u5728\u963f\u6839\u5ef7'}, {title: '\u300a\u8c1c\u4e00\u6837\u7684\u53cc\u773c\u300b', desc: '\u963f\u6839\u5ef7\u5965\u65af\u5361\u6700\u4f73\u5916\u8bed\u7247\uff0c\u60ac\u7591\u4e0e\u60c5\u611f\u4ea4\u7ec7'}] },\n  { id: 'nl', name: '\u8377\u5170', en: 'Netherlands', x: 465, y: 100, lit: true, capital: '\u963f\u59c6\u65af\u7279\u4e39', language: '\u8377\u5170\u8bed', population: '1750\u4e07', region: '\u897f\u6b27', story: '\u8377\u5170\u662f\u98ce\u8f66\u4e0e\u90c1\u91d1\u9999\u7684\u56fd\u5ea6\uff0c\u4e5f\u662f\u4e16\u754c\u4e0a\u6700\u5f00\u653e\u5305\u5bb9\u7684\u56fd\u5bb6\u4e4b\u4e00\u3002\u963f\u59c6\u65af\u7279\u4e39\u7684\u8fd0\u6cb3\u4e0e\u68b5\u9ad8\u535a\u7269\u9986\u3001\u5e93\u80af\u970d\u592b\u516c\u56ed\u7684\u90c1\u91d1\u9999\u82b1\u6d77\u3001\u5c0f\u5b69\u5824\u9632\u98ce\u8f66\u6751\u3001\u4ee3\u5c14\u592b\u7279\u7684\u84dd\u9676\u4e0e\u8fd0\u6cb3\u3001\u6d77\u7259\u7684\u56fd\u9645\u6cd5\u5ead\u4e0e\u6d77\u6ee9\uff0c\u4ee5\u53ca\u5976\u916a\u4e0e\u534e\u592b\u997c\u7684\u7f8e\u98df\uff0c\u8fd8\u6709\u81ea\u884c\u8f66\u6587\u5316\u4e0e\u6a59\u8272\u70ed\u60c5\uff0c\u8ba9\u8fd9\u4e2a\u4f4e\u5730\u56fd\u5bb6\u5145\u6ee1\u4e86\u81ea\u7531\u4e0e\u7f8e\u597d\u3002', films: [{title: '\u300a\u96cf\u83ca\u300b', desc: '\u5728\u8377\u5170\u963f\u59c6\u65af\u7279\u4e39\u62cd\u6444\u7684\u97e9\u56fd\u7231\u60c5\u7535\u5f71'}, {title: '\u300a\u6d77\u519b\u4e0a\u5c06\u300b', desc: '\u8377\u5170\u9ec4\u91d1\u65f6\u4ee3\u6d77\u519b\u4e0a\u5c06\u5fb7\u00b7\u9c81\u4f0a\u7279\u7684\u4f20\u8bb0\u7535\u5f71'}] },\n  { id: 'ch', name: '\u745e\u58eb', en: 'Switzerland', x: 485, y: 110, lit: true, capital: '\u4f2f\u5c14\u5c3c', language: '\u5fb7\/\u6cd5\/\u610f\u8bed', population: '870\u4e07', region: '\u4e2d\u6b27', story: '\u745e\u58eb\u662f\u963f\u5c14\u5351\u65af\u5c71\u7684\u5fc3\u810f\uff0c\u4e5f\u662f\u4e16\u754c\u4e0a\u6700\u5bcc\u88d5\u7f8e\u4e3d\u7684\u56fd\u5bb6\u4e4b\u4e00\u3002\u5c11\u5973\u5cf0\u7684\u96ea\u5c71\u4e0e\u51b0\u5ddd\u3001\u9a6c\u7279\u6d2a\u5cf0\u7684\u91d1\u5b57\u5854\u5f62\u5c71\u5cf0\u3001\u56e0\u7279\u62c9\u80af\u7684\u6e56\u6cca\u4e0e\u5192\u9669\u3001\u5362\u585e\u6069\u7684\u5361\u4f69\u5c14\u6865\u4e0e\u72ee\u5b50\u7eaa\u5ff5\u7891\u3001\u82cf\u9ece\u4e16\u7684\u73ed\u970d\u592b\u5927\u8857\u4e0e\u6e56\u5149\u3001\u65e5\u5185\u74e6\u7684\u5927\u55b7\u6cc9\u4e0e\u56fd\u9645\u7ec4\u7ec7\uff0c\u4ee5\u53ca\u5de7\u514b\u529b\u4e0e\u5976\u916a\u706b\u9505\u7684\u7f8e\u98df\uff0c\u8ba9\u8fd9\u4e2a\u4e2d\u6b27\u5185\u9646\u56fd\u6210\u4e3a\u4e86\u4eba\u95f4\u5929\u5802\u3002', films: [{title: '\u300a\u6d77\u8482\u548c\u7237\u7237\u300b', desc: '\u745e\u58eb\u963f\u5c14\u5351\u65af\u5c71\u533a\u7684\u7ecf\u5178\u6e29\u60c5\u6545\u4e8b'}, {title: '\u300a\u97f3\u4e50\u4e4b\u58f0\u300b', desc: '\u867d\u4ee5\u5965\u5730\u5229\u4e3a\u80cc\u666f\uff0c\u5374\u5c55\u73b0\u4e86\u963f\u5c14\u5351\u65af\u5c71\u533a\u7684\u7f8e\u597d'}] },\n  { id: 'at', name: '\u5965\u5730\u5229', en: 'Austria', x: 495, y: 105, lit: true, capital: '\u7ef4\u4e5f\u7eb3', language: '\u5fb7\u8bed', population: '900\u4e07', region: '\u4e2d\u6b27', story: '\u5965\u5730\u5229\u662f\u97f3\u4e50\u4e4b\u90fd\uff0c\u4e5f\u662f\u963f\u5c14\u5351\u65af\u5c71\u7684\u660e\u73e0\u3002\u7ef4\u4e5f\u7eb3\u7684\u91d1\u8272\u5927\u5385\u4e0e\u7f8e\u6cc9\u5bab\u3001\u8428\u5c14\u8328\u5821\u7684\u83ab\u624e\u7279\u6545\u5c45\u4e0e\u97f3\u4e50\u8282\u3001\u54c8\u5c14\u65bd\u5854\u7279\u7684\u6e56\u7554\u5c0f\u9547\u4e0e\u76d0\u77ff\u3001\u56e0\u65af\u5e03\u9c81\u514b\u7684\u96ea\u5c71\u4e0e\u9ec4\u91d1\u5c4b\u9876\u3001\u683c\u62c9\u8328\u7684\u8001\u57ce\u4e0e\u73b0\u4ee3\u827a\u672f\uff0c\u4ee5\u53ca\u8428\u8d6b\u86cb\u7cd5\u4e0e\u82f9\u679c\u5377\u7684\u7f8e\u98df\uff0c\u8fd8\u6709\u65bd\u7279\u52b3\u65af\u4e0e\u83ab\u624e\u7279\u7684\u97f3\u4e50\u9057\u4ea7\uff0c\u8ba9\u8fd9\u4e2a\u56fd\u5ea6\u5145\u6ee1\u4e86\u827a\u672f\u4e0e\u4f18\u96c5\u3002', films: [{title: '\u300a\u97f3\u4e50\u4e4b\u58f0\u300b', desc: '\u5965\u5730\u5229\u8428\u5c14\u8328\u5821\u7684\u7ecf\u5178\u97f3\u4e50\u7535\u5f71\uff0c\u5168\u7403\u5bb6\u55bb\u6237\u6653'}, {title: '\u300a\u7231\u5728\u9ece\u660e\u7834\u6653\u524d\u300b', desc: '\u5728\u7ef4\u4e5f\u7eb3\u53d1\u751f\u7684\u4e00\u6bb5\u6d6a\u6f2b\u9082\u9005'}] },\n];\n\nconst films = [\n  { title: '\u6211\u4eec\u8bde\u751f\u5728\u4e2d\u56fd', category: 'doc', country: '\u4e2d\u56fd', duration: '76\u5206\u949f', desc: '\u8fea\u58eb\u5c3c\u81ea\u7136\u51fa\u54c1\uff0c\u4ee5\u96ea\u8c79\u3001\u91d1\u4e1d\u7334\u3001\u718a\u732b\u4e09\u79cd\u4e2d\u56fd\u73cd\u7a00\u52a8\u7269\u4e3a\u4e3b\u89d2\uff0c\u5c55\u73b0\u5b83\u4eec\u5728\u5e7f\u88a4\u4e2d\u56fd\u5927\u5730\u4e0a\u7684\u751f\u547d\u6545\u4e8b\u4e0e\u5bb6\u5ead\u6e29\u60c5\u3002', color: 'linear-gradient(135deg, #c0392b, #e74c3c)' },\n  { title: '\u5c0f\u68ee\u6797 \u590f\u79cb\u7bc7', category: 'movie', country: '\u65e5\u672c', duration: '111\u5206\u949f', desc: '\u5973\u5b69\u5e02\u5b50\u56de\u5230\u65e5\u672c\u4e1c\u5317\u7684\u5c0f\u68ee\u6751\uff0c\u7528\u56db\u5b63\u7684\u98df\u6750\u5236\u4f5c\u7b80\u5355\u800c\u6e29\u6696\u7684\u7f8e\u98df\uff0c\u5728\u52b3\u4f5c\u4e0e\u70f9\u996a\u4e2d\u5bfb\u627e\u751f\u6d3b\u7684\u610f\u4e49\u4e0e\u5185\u5fc3\u7684\u5e73\u9759\u3002', color: 'linear-gradient(135deg, #27ae60, #2ecc71)' },\n  { title: '\u5929\u4f7f\u7231\u7f8e\u4e3d', category: 'movie', country: '\u6cd5\u56fd', duration: '122\u5206\u949f', desc: '\u5df4\u9ece\u5973\u5b69\u7231\u7f8e\u4e3d\u7528\u81ea\u5df1\u7684\u5947\u601d\u5999\u60f3\u9ed8\u9ed8\u5e2e\u52a9\u8eab\u8fb9\u7684\u4eba\uff0c\u5728\u8fd9\u4e2a\u8fc7\u7a0b\u4e2d\u4e5f\u627e\u5230\u4e86\u5c5e\u4e8e\u81ea\u5df1\u7684\u7231\u60c5\u3002\u4e00\u90e8\u5145\u6ee1\u6cd5\u5f0f\u6d6a\u6f2b\u4e0e\u5947\u8da3\u7684\u7535\u5f71\u3002', color: 'linear-gradient(135deg, #8e44ad, #9b59b6)' },\n  { title: '\u5bfb\u68a6\u73af\u6e38\u8bb0', category: 'movie', country: '\u58a8\u897f\u54e5', duration: '105\u5206\u949f', desc: '\u4ee5\u58a8\u897f\u54e5\u4ea1\u7075\u8282\u4e3a\u80cc\u666f\uff0c\u8bb2\u8ff0\u7537\u5b69\u7c73\u683c\u5728\u4ea1\u7075\u4e16\u754c\u5bfb\u627e\u66fe\u66fe\u7956\u7236\u7684\u6545\u4e8b\uff0c\u63a2\u8ba8\u4e86\u5bb6\u5ead\u3001\u8bb0\u5fc6\u4e0e\u6b7b\u4ea1\u7684\u610f\u4e49\uff0c\u6e29\u6696\u800c\u52a8\u4eba\u3002', color: 'linear-gradient(135deg, #d35400, #e67e22)' },\n  { title: '\u7f8e\u4e3d\u4eba\u751f', category: 'movie', country: '\u610f\u5927\u5229', duration: '116\u5206\u949f', desc: '\u4e8c\u6218\u65f6\u671f\uff0c\u72b9\u592a\u7236\u4eb2\u572d\u591a\u5728\u7eb3\u7cb9\u96c6\u4e2d\u8425\u4e2d\u7528\u7f8e\u4e3d\u7684\u8c0e\u8a00\u4fdd\u62a4\u513f\u5b50\u7684\u7ae5\u5fc3\uff0c\u5c55\u73b0\u4e86\u7236\u7231\u5728\u6700\u9ed1\u6697\u65f6\u523b\u7684\u4f1f\u5927\u4e0e\u5149\u8f89\u3002', color: 'linear-gradient(135deg, #16a085, #1abc9c)' },\n  { title: '\u8d70\u51fa\u975e\u6d32', category: 'doc', country: '\u80af\u5c3c\u4e9a', duration: '161\u5206\u949f', desc: '\u4e39\u9ea6\u5973\u4f5c\u5bb6\u51ef\u4f26\u5728\u80af\u5c3c\u4e9a\u7ecf\u8425\u5496\u5561\u56ed\u7684\u771f\u5b9e\u6545\u4e8b\uff0c\u5c55\u73b0\u4e86\u975e\u6d32\u5927\u8349\u539f\u7684\u58ee\u7f8e\u98ce\u5149\u3001\u6b96\u6c11\u65f6\u4ee3\u7684\u793e\u4f1a\u53d8\u8fc1\uff0c\u4ee5\u53ca\u4e00\u6bb5\u523b\u9aa8\u94ed\u5fc3\u7684\u7231\u60c5\u3002', color: 'linear-gradient(135deg, #f39c12, #f1c40f)' },\n  { title: '\u767d\u65e5\u68a6\u60f3\u5bb6', category: 'movie', country: '\u51b0\u5c9b', duration: '114\u5206\u949f', desc: '\u6742\u5fd7\u5e95\u7247\u7ba1\u7406\u5458\u6c83\u5c14\u7279\u4e3a\u5bfb\u627e\u5931\u8e2a\u7684\u5e95\u7247\uff0c\u8e0f\u4e0a\u4e86\u4ece\u683c\u9675\u5170\u5230\u51b0\u5c9b\u518d\u5230\u559c\u9a6c\u62c9\u96c5\u7684\u5192\u9669\u4e4b\u65c5\uff0c\u5728\u65c5\u9014\u4e2d\u627e\u5230\u4e86\u771f\u6b63\u7684\u81ea\u6211\u3002', color: 'linear-gradient(135deg, #2980b9, #3498db)' },\n  { title: '\u521d\u604b\u8fd9\u4ef6\u5c0f\u4e8b', category: 'movie', country: '\u6cf0\u56fd', duration: '118\u5206\u949f', desc: '\u6cf0\u56fd\u9752\u6625\u7231\u60c5\u7ecf\u5178\uff0c\u5e73\u51e1\u5973\u5b69\u5c0f\u6c34\u4e3a\u4e86\u559c\u6b22\u7684\u5b66\u957f\u963f\u4eae\u4e0d\u65ad\u52aa\u529b\u53d8\u597d\uff0c\u7528\u4e5d\u5e74\u7684\u6697\u604b\u65f6\u5149\uff0c\u4e66\u5199\u4e86\u4e00\u6bb5\u7eaf\u771f\u800c\u7f8e\u597d\u7684\u9752\u6625\u6545\u4e8b\u3002', color: 'linear-gradient(135deg, #e91e63, #f06292)' },\n  { title: '\u6307\u73af\u738b\uff1a\u62a4\u6212\u4f7f\u8005', category: 'movie', country: '\u65b0\u897f\u5170', duration: '178\u5206\u949f', desc: '\u5728\u65b0\u897f\u5170\u5168\u5883\u62cd\u6444\u7684\u53f2\u8bd7\u5947\u5e7b\u5de8\u4f5c\uff0c\u970d\u6bd4\u7279\u4eba\u4f5b\u7f57\u591a\u8e0f\u4e0a\u9500\u6bc1\u9b54\u6212\u7684\u65c5\u7a0b\uff0c\u5c55\u73b0\u4e86\u4e2d\u571f\u4e16\u754c\u7684\u58ee\u4e3d\u98ce\u5149\u4e0e\u53cb\u8c0a\u7684\u529b\u91cf\u3002', color: 'linear-gradient(135deg, #2c3e50, #34495e)' },\n  { title: '\u5361\u8428\u5e03\u5170\u5361', category: 'movie', country: '\u6469\u6d1b\u54e5', duration: '102\u5206\u949f', desc: '\u4e8c\u6218\u7ecf\u5178\u7231\u60c5\u7535\u5f71\uff0c\u5728\u6469\u6d1b\u54e5\u5361\u8428\u5e03\u5170\u5361\uff0c\u7f8e\u56fd\u4eba\u91cc\u514b\u4e0e\u6614\u65e5\u604b\u4eba\u4f0a\u5c14\u838e\u91cd\u9022\uff0c\u5728\u7231\u60c5\u4e0e\u9053\u4e49\u4e4b\u95f4\u505a\u51fa\u4e86\u8270\u96be\u7684\u9009\u62e9\u3002', color: 'linear-gradient(135deg, #6d4c41, #8d6e63)' },\n  { title: '\u6d77\u8482\u548c\u7237\u7237', category: 'movie', country: '\u745e\u58eb', duration: '111\u5206\u949f', desc: '\u5b64\u513f\u6d77\u8482\u88ab\u9001\u5230\u963f\u5c14\u5351\u65af\u5c71\u4e0e\u7237\u7237\u540c\u4f4f\uff0c\u7528\u7eaf\u771f\u4e0e\u5584\u826f\u878d\u5316\u4e86\u7237\u7237\u51b0\u51b7\u7684\u5fc3\uff0c\u4e5f\u5e26\u7ed9\u4e86\u762b\u75ea\u5973\u5b69\u514b\u62c9\u62c9\u5e0c\u671b\u4e0e\u5feb\u4e50\u3002', color: 'linear-gradient(135deg, #00695c, #00897b)' },\n  { title: '\u97f3\u4e50\u4e4b\u58f0', category: 'movie', country: '\u5965\u5730\u5229', duration: '174\u5206\u949f', desc: '\u5965\u5730\u5229\u8428\u5c14\u8328\u5821\uff0c\u4fee\u5973\u739b\u4e3d\u4e9a\u6765\u5230\u51af\u00b7\u7279\u62c9\u666e\u4e0a\u6821\u5bb6\u505a\u5bb6\u5ead\u6559\u5e08\uff0c\u7528\u97f3\u4e50\u4e0e\u7231\u6e29\u6696\u4e86\u4e03\u4e2a\u5b69\u5b50\uff0c\u4e5f\u6536\u83b7\u4e86\u4e0e\u4e0a\u6821\u7684\u7231\u60c5\u3002', color: 'linear-gradient(135deg, #1565c0, #1e88e5)' },\n  { title: '\u5730\u7403\u8109\u52a8 \u7b2c\u4e8c\u5b63', category: 'doc', country: '\u5168\u7403', duration: '6\u96c6', desc: 'BBC\u7ecf\u5178\u81ea\u7136\u7eaa\u5f55\u7247\uff0c\u7528\u6781\u81f4\u7684\u955c\u5934\u8bed\u8a00\u5c55\u73b0\u5730\u7403\u4e0a\u4ece\u5c9b\u5c7f\u5230\u5c71\u8109\u3001\u4ece\u4e1b\u6797\u5230\u6c99\u6f20\u3001\u4ece\u8349\u539f\u5230\u57ce\u5e02\u7684\u751f\u547d\u5947\u8ff9\u4e0e\u81ea\u7136\u4e4b\u7f8e\u3002', color: 'linear-gradient(135deg, #33691e, #558b2f)' },\n  { title: '\u4eba\u95f4\u4e16', category: 'doc', country: '\u4e2d\u56fd', duration: '10\u96c6', desc: '\u4e2d\u56fd\u533b\u7597\u7eaa\u5b9e\u7eaa\u5f55\u7247\uff0c\u6df1\u5165\u533b\u9662\u62cd\u6444\uff0c\u8bb0\u5f55\u4e86\u533b\u60a3\u4e4b\u95f4\u7684\u771f\u5b9e\u6545\u4e8b\uff0c\u5c55\u73b0\u4e86\u751f\u547d\u7684\u8106\u5f31\u4e0e\u575a\u5f3a\uff0c\u4ee5\u53ca\u4eba\u6027\u4e2d\u7684\u6e29\u6696\u4e0e\u5149\u8f89\u3002', color: 'linear-gradient(135deg, #b71c1c, #e53935)' },\n  { title: '\u4eba\u751f\u4e03\u5e74', category: 'doc', country: '\u82f1\u56fd', duration: '\u7cfb\u5217', desc: 'BBC\u5212\u65f6\u4ee3\u7684\u7eaa\u5f55\u7247\uff0c\u4ece1964\u5e74\u5f00\u59cb\uff0c\u6bcf\u9694\u4e03\u5e74\u8ffd\u8e2a14\u4e2a\u6765\u81ea\u4e0d\u540c\u9636\u5c42\u7684\u82f1\u56fd\u5b69\u5b50\uff0c\u8bb0\u5f55\u4ed6\u4eec\u4ece7\u5c81\u523063\u5c81\u7684\u4eba\u751f\u8f68\u8ff9\uff0c\u63a2\u8ba8\u4e86\u9636\u7ea7\u3001\u6559\u80b2\u4e0e\u547d\u8fd0\u7684\u5173\u7cfb\u3002', color: 'linear-gradient(135deg, #4a148c, #7b1fa2)' },\n  { title: '\u5f92\u624b\u6500\u5ca9', category: 'short', country: '\u7f8e\u56fd', duration: '100\u5206\u949f', desc: '\u8bb0\u5f55\u6500\u5ca9\u5bb6\u4e9a\u5386\u514b\u65af\u00b7\u970d\u8bfa\u5c14\u5fb7\u65e0\u4fdd\u62a4\u5f92\u624b\u6500\u767b\u4f18\u80dc\u7f8e\u5730\u914b\u957f\u5ca9\u7684\u5168\u8fc7\u7a0b\uff0c\u5c55\u73b0\u4e86\u4eba\u7c7b\u6311\u6218\u6781\u9650\u7684\u52c7\u6c14\u4e0e\u4e13\u6ce8\uff0c\u4ee4\u4eba\u5c4f\u606f\u3002', color: 'linear-gradient(135deg, #e65100, #ff6d00)' },\n  { title: '\u4e8c\u5341\u4e8c', category: 'doc', country: '\u4e2d\u56fd', duration: '99\u5206\u949f', desc: '\u8bb0\u5f55\u4e86\u4e2d\u56fd\u5185\u5730\u4ec5\u5b58\u768422\u4f4d\"\u6170\u5b89\u5987\"\u5236\u5ea6\u53d7\u5bb3\u8005\u8001\u4eba\u7684\u65e5\u5e38\u751f\u6d3b\uff0c\u7528\u5e73\u9759\u7684\u955c\u5934\u5c55\u73b0\u4e86\u5979\u4eec\u5728\u82e6\u96be\u4e4b\u540e\u7684\u575a\u97e7\u4e0e\u5bbd\u5bb9\u3002', color: 'linear-gradient(135deg, #37474f, #546e7a)' },\n  { title: '\u6d77\u8c5a\u6e7e', category: 'doc', country: '\u65e5\u672c', duration: '92\u5206\u949f', desc: '\u63ed\u9732\u65e5\u672c\u592a\u5730\u753a\u6bcf\u5e74\u5927\u89c4\u6a21\u6355\u6740\u6d77\u8c5a\u7684\u771f\u76f8\uff0c\u62cd\u6444\u56e2\u961f\u5192\u7740\u751f\u547d\u5371\u9669\u6f5c\u5165\u7981\u533a\uff0c\u7528\u955c\u5934\u8bb0\u5f55\u4e86\u4ee4\u4eba\u9707\u60ca\u7684\u753b\u9762\uff0c\u63a8\u52a8\u4e86\u5168\u7403\u52a8\u7269\u4fdd\u62a4\u610f\u8bc6\u7684\u89c9\u9192\u3002', color: 'linear-gradient(135deg, #006064, #00838f)' },\n];\n\nlet voices = [\n{text:'\u6211\u4eec\u90fd\u662f\u65f6\u95f4\u957f\u6cb3\u4e2d\u7684\u65c5\u4eba\uff0c\u6211\u4eec\u53ea\u662f\u8def\u8fc7\uff0c\u6211\u4eec\u6765\u8fd9\u91cc\u7684\u76ee\u7684\u53ea\u662f\u89c2\u5bdf\u3001\u5b66\u4e60\u3001\u6210\u957f\u3001\u7231\uff0c\u7136\u540e\u6211\u4eec\u56de\u5bb6\u3002',name: '\u5c0f\u96c5', country: '\u4e2d\u56fd', likes: 1115, time: '1\u5c0f\u65f6\u524d'},\n  { text: '\u613f\u4e16\u754c\u548c\u5e73\uff0c\u6bcf\u4e00\u4e2a\u5b69\u5b50\u90fd\u80fd\u5728\u9633\u5149\u4e0b\u5fae\u7b11\u3002', name: '\u5c0f\u660e', country: '\u4e2d\u56fd', likes: 128, time: '2\u5c0f\u65f6\u524d' },\n  { text: '\u4ece\u4e1c\u4eac\u5230\u5f00\u7f57\uff0c\u4ece\u91cc\u7ea6\u5230\u5965\u65af\u9646\uff0c\u6211\u4eec\u5171\u4eab\u540c\u4e00\u4e2a\u6708\u4eae\u3002', name: 'Yuki', country: '\u65e5\u672c', likes: 96, time: '5\u5c0f\u65f6\u524d' },\n  { text: '\u7535\u5f71\u8ba9\u6211\u770b\u89c1\u4e86\u4ece\u672a\u53bb\u8fc7\u7684\u8fdc\u65b9\uff0c\u4e5f\u8ba9\u6211\u7406\u89e3\u4e86\u4ece\u672a\u7ecf\u5386\u7684\u4eba\u751f\u3002', name: 'Marie', country: '\u6cd5\u56fd', likes: 215, time: '8\u5c0f\u65f6\u524d' },\n  { text: '\u6211\u5728\u80af\u5c3c\u4e9a\u7684\u8349\u539f\u4e0a\u770b\u8fc7\u65e5\u843d\uff0c\u90a3\u4e00\u523b\u89c9\u5f97\u4eba\u7c7b\u7684\u7eb7\u4e89\u90fd\u592a\u6e3a\u5c0f\u4e86\u3002', name: 'David', country: '\u7f8e\u56fd', likes: 173, time: '12\u5c0f\u65f6\u524d' },\n  { text: '\u5584\u610f\u4e0d\u9700\u8981\u7ffb\u8bd1\uff0c\u4e00\u4e2a\u5fae\u7b11\u5c31\u80fd\u8de8\u8d8a\u6240\u6709\u8bed\u8a00\u7684\u969c\u788d\u3002', name: 'Amina', country: '\u57c3\u53ca', likes: 89, time: '1\u5929\u524d' },\n  { text: '\u5e0c\u671b\u66f4\u591a\u4eba\u80fd\u770b\u89c1\u5317\u6781\u5149\uff0c\u90a3\u662f\u5927\u81ea\u7136\u5199\u7ed9\u4eba\u7c7b\u7684\u60c5\u4e66\u3002', name: 'Erik', country: '\u632a\u5a01', likes: 142, time: '1\u5929\u524d' },\n  { text: '\u91cc\u7ea6\u7684\u72c2\u6b22\u8282\u5f88\u70ed\u95f9\uff0c\u4f46\u6211\u66f4\u60f3\u5ff5\u5976\u5976\u505a\u7684\u9ed1\u8c46\u996d\u3002\u5bb6\u6c38\u8fdc\u662f\u5fc3\u7684\u65b9\u5411\u3002', name: 'Lucas', country: '\u5df4\u897f', likes: 201, time: '2\u5929\u524d' },\n  { text: '\u5728\u6089\u5c3c\u6b4c\u5267\u9662\u542c\u4e00\u573a\u97f3\u4e50\u4f1a\uff0c\u662f\u6211\u4eca\u5e74\u505a\u8fc7\u6700\u6d6a\u6f2b\u7684\u4e8b\u3002', name: 'Sophie', country: '\u6fb3\u5927\u5229\u4e9a', likes: 117, time: '2\u5929\u524d' },\n  { text: '\u8c22\u8c22\u8fd9\u4e2a\u7f51\u7ad9\uff0c\u8ba9\u6211\u5728\u4e0a\u6d77\u7684\u51fa\u79df\u5c4b\u91cc\uff0c\u770b\u89c1\u4e86\u6574\u4e2a\u4e16\u754c\u3002', name: '\u963f\u7433', country: '\u4e2d\u56fd', likes: 356, time: '3\u5929\u524d' },\n  { text: '\u4e0d\u540c\u7684\u80a4\u8272\uff0c\u4e0d\u540c\u7684\u4fe1\u4ef0\uff0c\u4f46\u6211\u4eec\u5bf9\u7231\u7684\u6e34\u671b\u662f\u4e00\u6837\u7684\u3002', name: 'Carlos', country: '\u58a8\u897f\u54e5', likes: 188, time: '3\u5929\u524d' },\n  { text: '\u51b0\u5c9b\u7684\u51ac\u5929\u5f88\u6f2b\u957f\uff0c\u4f46\u53ea\u8981\u5fc3\u91cc\u6709\u5149\uff0c\u5c31\u4e0d\u4f1a\u89c9\u5f97\u51b7\u3002', name: 'Astrid', country: '\u51b0\u5c9b', likes: 134, time: '4\u5929\u524d' },\n  { text: '\u6211\u60f3\u628a\u5370\u5ea6\u7684\u9999\u6599\u3001\u6cf0\u56fd\u7684\u5fae\u7b11\u3001\u610f\u5927\u5229\u7684\u9633\u5149\uff0c\u90fd\u88c5\u8fdb\u5fc3\u91cc\u5e26\u56de\u5bb6\u3002', name: 'Raj', country: '\u5370\u5ea6', likes: 162, time: '4\u5929\u524d' },\n];\n\n\/\/ ===== \u521d\u59cb\u5316 =====\ndocument.addEventListener('DOMContentLoaded', function() {\n  renderProgressHearts();\n  renderTodayCards();\n  renderLatestVoices();\n  renderWorldMap();\n  renderFilms('all');\n  renderVoicesWall();\n});\n\n\/\/ ===== \u5bfc\u822a =====\nfunction navigate(view) {\n  document.querySelectorAll('.view').forEach(v => v.classList.remove('active'));\n  document.getElementById('view-' + view).classList.add('active');\n  document.querySelectorAll('.nav-links a').forEach(a => a.classList.remove('active'));\n  document.querySelector('.nav-links a[data-view=\"' + view + '\"]').classList.add('active');\n  document.getElementById('navLinks').classList.remove('open');\n  window.scrollTo({ top: 0, behavior: 'smooth' });\n}\n\nfunction toggleMenu() {\n  document.getElementById('navLinks').classList.toggle('open');\n}\n\n\/\/ ===== \u5fc3\u94fe\u8fdb\u5ea6\u5fc3\u5f62 =====\nfunction renderProgressHearts() {\n  const container = document.getElementById('progressHearts');\n  const litCount = 29;\n  let html = '';\n  for (let i = 0; i < 193; i++) {\n    const lit = i < litCount ? 'lit' : '';\n    html += `<svg class=\"progress-heart ${lit}\" viewBox=\"0 0 100 100\"><path d=\"M50 88 C20 65 10 45 10 30 C10 15 22 8 35 8 C42 8 47 12 50 18 C53 12 58 8 65 8 C78 8 90 15 90 30 C90 45 80 65 50 88Z\" fill=\"${i < litCount ? '#e8a87c' : '#4a3828'}\"\/><\/svg>`;\n  }\n  container.innerHTML = html;\n}\n\n\/\/ ===== \u4eca\u65e5\u63a8\u8350\u5361\u7247 =====\nfunction renderTodayCards() {\n  const picks = countries.slice(0, 4);\n  const colors = [\n    'linear-gradient(135deg, #c0392b, #e74c3c)',\n    'linear-gradient(135deg, #27ae60, #2ecc71)',\n    'linear-gradient(135deg, #8e44ad, #9b59b6)',\n    'linear-gradient(135deg, #2980b9, #3498db)',\n  ];\n  const grid = document.getElementById('todayGrid');\n  grid.innerHTML = picks.map((c, i) => `\n    <div class=\"today-card\" onclick=\"openCountry('${c.id}')\">\n      <div class=\"today-card-img\" style=\"background:${colors[i]}\">\n        <div class=\"img-placeholder\" style=\"color:rgba(255,255,255,0.3);font-family:var(--serif);font-size:64px;font-weight:700;\">${c.name.charAt(0)}<\/div>\n        <div class=\"today-card-tag\">\u4eca\u65e5\u63a8\u8350<\/div>\n      <\/div>\n      <div class=\"today-card-body\">\n        <div class=\"today-card-country\">${c.en} \u00b7 ${c.region}<\/div>\n        <div class=\"today-card-title\">${c.name}<\/div>\n        <div class=\"today-card-text\">${c.story.substring(0, 50)}\u2026\u2026<\/div>\n      <\/div>\n    <\/div>\n  `).join('');\n}\n\n\/\/ ===== \u6700\u65b0\u5fc3\u58f0 =====\nfunction renderLatestVoices() {\n  const latest = voices.slice(0, 4);\n  const wall = document.getElementById('latestVoices');\n  wall.innerHTML = latest.map(v => `\n    <div class=\"voice-card\">\n      <div class=\"voice-text\">\"${v.text}\"<\/div>\n      <div class=\"voice-meta\">\n        <div class=\"voice-country\">\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#e8a87c\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"\/><\/svg>\n          ${v.country}\n        <\/div>\n        <span>${v.name} \u00b7 ${v.time}<\/span>\n      <\/div>\n    <\/div>\n  `).join('');\n}\n\n\/\/ ===== \u4e16\u754c\u5730\u56fe\u8282\u70b9 =====\nfunction renderWorldMap() {\n  const svg = document.getElementById('worldMap');\n  const nodesHtml = countries.map(c => `\n    <g class=\"map-node\" onclick=\"openCountry('${c.id}')\" transform=\"translate(${c.x}, ${c.y})\">\n      ${c.lit ? `<circle r=\"16\" fill=\"url(#nodeGlow)\" opacity=\"0.5\"\/>` : ''}\n      <circle r=\"${c.lit ? 7 : 5}\" fill=\"${c.lit ? '#e8a87c' : '#4a3828'}\" stroke=\"${c.lit ? '#f5c6a0' : '#6b5a48'}\" stroke-width=\"1.5\"\/>\n      ${c.lit ? `<text y=\"20\">${c.name}<\/text>` : ''}\n    <\/g>\n  `).join('');\n  svg.insertAdjacentHTML('beforeend', nodesHtml);\n}\n\n\/\/ ===== \u56fd\u5bb6\u8be6\u60c5\u5f39\u7a97 =====\nfunction openCountry(id) {\n  const c = countries.find(x => x.id === id);\n  if (!c) return;\n  document.getElementById('modalCountryName').textContent = c.name;\n  document.getElementById('modalCountryEn').textContent = c.en;\n  document.getElementById('modalCapital').textContent = c.capital;\n  document.getElementById('modalLanguage').textContent = c.language;\n  document.getElementById('modalPopulation').textContent = c.population;\n  document.getElementById('modalRegion').textContent = c.region;\n  document.getElementById('modalStory').textContent = c.story;\n  document.getElementById('modalFilms').innerHTML = c.films.map(f => `\n    <div class=\"modal-film\" onclick=\"showToast('\u6b63\u5728\u524d\u5f80\u300c${f.title}\u300d\u6b63\u7248\u89c2\u770b\u6e20\u9053\u2026')\">\n      <div class=\"modal-film-icon\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"#1a1410\"><polygon points=\"5 3 19 12 5 21 5 3\"\/><\/svg>\n      <\/div>\n      <div class=\"modal-film-info\">\n        <div class=\"modal-film-title\">${f.title}<\/div>\n        <div class=\"modal-film-desc\">${f.desc}<\/div>\n      <\/div>\n    <\/div>\n  `).join('');\n  document.getElementById('countryModal').classList.add('show');\n}\n\nfunction closeModal() {\n  document.getElementById('countryModal').classList.remove('show');\n}\n\ndocument.getElementById('countryModal').addEventListener('click', function(e) {\n  if (e.target === this) closeModal();\n});\n\n\/\/ ===== \u5149\u5f71\u56de\u54cd =====\nfunction filterFilms(category) {\n  document.querySelectorAll('.filter-btn').forEach(b => b.classList.remove('active'));\n  event.target.classList.add('active');\n  renderFilms(category);\n}\n\nfunction renderFilms(category) {\n  const filtered = category === 'all' ? films : films.filter(f => f.category === category);\n  const grid = document.getElementById('filmGrid');\n  const categoryNames = { doc: '\u4eba\u6587\u7eaa\u5b9e', short: '\u516c\u76ca\u77ed\u7247', scenery: '\u4e16\u754c\u98ce\u666f', people: '\u4eba\u7269\u6545\u4e8b', movie: '\u7535\u5f71\u63a8\u8350' };\n  grid.innerHTML = filtered.map(f => `\n    <div class=\"film-card\" onclick=\"showToast('\u6b63\u5728\u524d\u5f80\u300c${f.title}\u300d\u6b63\u7248\u89c2\u770b\u6e20\u9053\u2026')\">\n      <div class=\"film-card-cover\" style=\"background:${f.color}\">\n        <div class=\"film-play-btn\">\n          <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#e8a87c\"><polygon points=\"5 3 19 12 5 21 5 3\"\/><\/svg>\n        <\/div>\n        <div class=\"film-duration\">${f.duration}<\/div>\n      <\/div>\n      <div class=\"film-card-body\">\n        <div class=\"film-card-meta\">\n          <span class=\"film-card-tag\">${categoryNames[f.category]}<\/span>\n          <span class=\"film-card-tag\">${f.country}<\/span>\n        <\/div>\n        <div class=\"film-card-title\">${f.title}<\/div>\n        <div class=\"film-card-desc\">${f.desc}<\/div>\n      <\/div>\n    <\/div>\n  `).join('');\n}\n\n\/\/ ===== \u5168\u7403\u5fc3\u58f0\u5899 =====\nfunction renderVoicesWall() {\n  const wall = document.getElementById('voicesWall');\n  wall.innerHTML = voices.map((v, i) => `\n    <div class=\"voice-note\">\n      <div class=\"voice-note-text\">\"${v.text}\"<\/div>\n      <div class=\"voice-note-footer\">\n        <span>${v.name || '\u533f\u540d'} \u00b7 ${v.country || '\u5730\u7403'}<\/span>\n        <span class=\"voice-note-likes\" onclick=\"likeVoice(${i})\">\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z\"\/><\/svg>\n          ${v.likes}\n        <\/span>\n      <\/div>\n    <\/div>\n  `).join('');\n}\n\nfunction submitVoice() {\n  const text = document.getElementById('voiceText').value.trim();\n  const name = document.getElementById('voiceName').value.trim();\n  const country = document.getElementById('voiceCountry').value.trim();\n  if (!text) {\n    showToast('\u8bf7\u5148\u5199\u4e0b\u4f60\u60f3\u5bf9\u4e16\u754c\u8bf4\u7684\u8bdd');\n    return;\n  }\n  voices.unshift({\n    text: text,\n    name: name || '\u533f\u540d',\n    country: country || '\u5730\u7403',\n    likes: 0,\n    time: '\u521a\u521a'\n  });\n  renderVoicesWall();\n  document.getElementById('voiceText').value = '';\n  document.getElementById('voiceName').value = '';\n  document.getElementById('voiceCountry').value = '';\n  showToast('\u4f60\u7684\u5fc3\u58f0\u5df2\u53d1\u5e03\uff0c\u611f\u8c22\u6210\u4e3a\u5fc3\u94fe\u7684\u4e00\u73af');\n}\n\nfunction likeVoice(index) {\n  voices[index].likes++;\n  renderVoicesWall();\n}\n\n\/\/ ===== Toast =====\nlet toastTimer;\nfunction showToast(msg) {\n  const toast = document.getElementById('toast');\n  toast.textContent = msg;\n  toast.classList.add('show');\n  clearTimeout(toastTimer);\n  toastTimer = setTimeout(() => toast.classList.remove('show'), 2500);\n}\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u5fc3\u94fe\u00b7\u770b\u89c1\u4e16\u754c<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1122,"menu_order":2,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2923","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/pages\/2923","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/comments?post=2923"}],"version-history":[{"count":6,"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/pages\/2923\/revisions"}],"predecessor-version":[{"id":2944,"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/pages\/2923\/revisions\/2944"}],"up":[{"embeddable":true,"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/pages\/1122"}],"wp:attachment":[{"href":"https:\/\/ytubage.com\/index.php\/wp-json\/wp\/v2\/media?parent=2923"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}