:root {
  --primary:#1a6b3c;
  --primary-dark:#0f4a28;
  --primary-light:#2d9e5a;
  --accent:#f0a500;
  --accent-dark:#c88200;
  --bg-dark:#0d1117;
  --bg-card:#161b22;
  --bg-section:#0f1923;
  --text-primary:#e8eaf0;
  --text-secondary:#9ba3af;
  --text-muted:#6b7280;
  --border:#2d3748;
  --red:#e53e3e;
  --gradient-main:linear-gradient(135deg,#1a6b3c 0%,#0f4a28 50%,#0d1117 100%);
  --gradient-card:linear-gradient(180deg,#161b22 0%,#0d1117 100%);
  --shadow:0 4px 20px rgba(0,0,0,0.4);
  --shadow-hover:0 8px 30px rgba(26,107,60,0.3);
  --radius:12px;
  --radius-sm:8px;
  --transition:all 0.3s ease;
}
* {
  margin:0;
  padding:0;
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  font-size:16px;
}
body {
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background:var(--bg-dark);
  color:var(--text-primary);
  line-height:1.7;
  overflow-x:hidden;
}
a {
  color:var(--primary-light);
  text-decoration:none;
  transition:var(--transition);
}
a:hover {
  color:var(--accent);
}
img {
  max-width:100%;
  height:auto;
  display:block;
}
::-webkit-scrollbar {
  width:6px;
}
::-webkit-scrollbar-track {
  background:var(--bg-dark);
}
::-webkit-scrollbar-thumb {
  background:var(--primary);
  border-radius:3px;
}
.top-bar {
  background:var(--primary-dark);
  padding:6px 0;
  font-size:13px;
  color:#a8d5b5;
  border-bottom:1px solid rgba(26,107,60,0.3);
}
.top-bar .container {
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.top-bar-links a {
  color:#a8d5b5;
  margin-left:16px;
  font-size:12px;
}
.top-bar-links a:hover {
  color:var(--accent);
}
header {
  background:rgba(13,17,23,0.97);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  position:sticky;
  top:0;
  z-index:1000;
  box-shadow:0 2px 20px rgba(0,0,0,0.5);
}
.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 0;
}
.logo {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:22px;
  font-weight:800;
  color:var(--text-primary);
  letter-spacing:-0.5px;
}
.logo-icon {
  width:42px;
  height:42px;
  background:var(--gradient-main);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  font-weight:900;
  color:#fff;
  border:2px solid var(--primary-light);
  box-shadow:0 0 15px rgba(26,107,60,0.4);
  flex-shrink:0;
}
.logo-text {
  display:flex;
  flex-direction:column;
}
.logo-text span:first-child {
  color:var(--text-primary);
  font-size:20px;
}
.logo-text span:last-child {
  font-size:11px;
  color:var(--primary-light);
  font-weight:400;
  letter-spacing:1px;
}
nav {
  display:flex;
  align-items:center;
  gap:4px;
}
nav a {
  color:var(--text-secondary);
  font-size:14px;
  padding:8px 14px;
  border-radius:var(--radius-sm);
  transition:var(--transition);
  font-weight:500;
  white-space:nowrap;
}
nav a:hover,nav a.active {
  color:var(--text-primary);
  background:rgba(26,107,60,0.2);
}
.header-actions {
  display:flex;
  align-items:center;
  gap:10px;
}
.btn-login {
  background:transparent;
  border:1px solid var(--primary);
  color:var(--primary-light);
  padding:7px 16px;
  border-radius:20px;
  font-size:13px;
  cursor:pointer;
  transition:var(--transition);
}
.btn-login:hover {
  background:var(--primary);
  color:#fff;
}
.btn-join {
  background:var(--primary);
  border:none;
  color:#fff;
  padding:7px 16px;
  border-radius:20px;
  font-size:13px;
  cursor:pointer;
  transition:var(--transition);
  font-weight:600;
}
.btn-join:hover {
  background:var(--primary-light);
  box-shadow:var(--shadow-hover);
}
.search-bar {
  background:var(--bg-section);
  border-bottom:1px solid var(--border);
  padding:10px 0;
}
.search-inner {
  display:flex;
  align-items:center;
  max-width:600px;
  margin:0 auto;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:24px;
  overflow:hidden;
  transition:var(--transition);
}
.search-inner:focus-within {
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(26,107,60,0.15);
}
.search-inner input {
  flex:1;
  background:transparent;
  border:none;
  outline:none;
  padding:10px 18px;
  color:var(--text-primary);
  font-size:14px;
}
.search-inner input::placeholder {
  color:var(--text-muted);
}
.search-inner button {
  background:var(--primary);
  border:none;
  color:#fff;
  padding:10px 20px;
  cursor:pointer;
  font-size:14px;
  transition:var(--transition);
}
.search-inner button:hover {
  background:var(--primary-light);
}
.container {
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}
.container-wide {
  max-width:1400px;
  margin:0 auto;
  padding:0 20px;
}
.breadcrumb {
  padding:12px 0;
  font-size:13px;
  color:var(--text-muted);
  border-bottom:1px solid var(--border);
  background:var(--bg-section);
}
.breadcrumb a {
  color:var(--text-muted);
}
.breadcrumb a:hover {
  color:var(--primary-light);
}
.breadcrumb span {
  margin:0 6px;
}
.hero {
  position:relative;
  min-height:560px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:var(--bg-dark);
}
.hero-bg {
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  filter:brightness(0.35);
  z-index:0;
}
.hero-overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(13,17,23,0.9) 0%,rgba(13,17,23,0.4) 60%,transparent 100%);
  z-index:1;
}
.hero-content {
  position:relative;
  z-index:2;
  max-width:600px;
}
.hero-badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(26,107,60,0.3);
  border:1px solid var(--primary);
  color:var(--primary-light);
  padding:5px 14px;
  border-radius:20px;
  font-size:12px;
  font-weight:600;
  letter-spacing:1px;
  margin-bottom:16px;
}
.hero h1 {
  font-size:clamp(28px,4vw,52px);
  font-weight:900;
  line-height:1.2;
  margin-bottom:16px;
  color:#fff;
}
.hero h1 em {
  color:var(--accent);
  font-style:normal;
}
.hero p {
  font-size:16px;
  color:#ccc;
  margin-bottom:28px;
  line-height:1.8;
}
.hero-btns {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.btn-primary {
  background:var(--primary);
  color:#fff;
  padding:12px 28px;
  border-radius:24px;
  font-size:15px;
  font-weight:600;
  border:none;
  cursor:pointer;
  transition:var(--transition);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.btn-primary:hover {
  background:var(--primary-light);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:var(--shadow-hover);
}
.btn-secondary {
  background:transparent;
  color:var(--text-primary);
  padding:12px 28px;
  border-radius:24px;
  font-size:15px;
  font-weight:600;
  border:1px solid rgba(255,255,255,0.3);
  cursor:pointer;
  transition:var(--transition);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.btn-secondary:hover {
  border-color:var(--primary-light);
  color:var(--primary-light);
}
.hero-stats {
  display:flex;
  gap:32px;
  margin-top:32px;
}
.hero-stat {
  text-align:left;
}
.hero-stat .num {
  font-size:28px;
  font-weight:800;
  color:var(--accent);
}
.hero-stat .label {
  font-size:12px;
  color:var(--text-muted);
  margin-top:2px;
}
.section {
  padding:60px 0;
}
.section-alt {
  background:var(--bg-section);
}
.section-title {
  text-align:center;
  margin-bottom:40px;
}
.section-title h2 {
  font-size:clamp(22px,3vw,32px);
  font-weight:800;
  color:var(--text-primary);
  margin-bottom:10px;
}
.section-title h2 span {
  color:var(--primary-light);
}
.section-title p {
  color:var(--text-secondary);
  font-size:15px;
  max-width:500px;
  margin:0 auto;
}
.section-title-line {
  width:50px;
  height:3px;
  background:var(--primary);
  margin:12px auto 0;
  border-radius:2px;
}
.video-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:20px;
}
.video-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  transition:var(--transition);
  cursor:pointer;
}
.video-card:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-hover);
  border-color:var(--primary);
}
.video-thumb {
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#111;
}
.video-thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 0.4s ease;
}
.video-card:hover .video-thumb img {
  transform:scale(1.05);
}
.video-play-btn {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,0.3);
  opacity:0;
  transition:var(--transition);
}
.video-card:hover .video-play-btn {
  opacity:1;
}
.play-icon {
  width:54px;
  height:54px;
  background:rgba(26,107,60,0.9);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  border:3px solid rgba(255,255,255,0.8);
  transform:scale(0.8);
  transition:transform 0.3s ease;
}
.video-card:hover .play-icon {
  transform:scale(1);
}
.play-icon svg {
  width:22px;
  height:22px;
  fill:#fff;
  margin-left:3px;
}
.video-duration {
  position:absolute;
  bottom:8px;
  right:8px;
  background:rgba(0,0,0,0.8);
  color:#fff;
  font-size:12px;
  padding:2px 7px;
  border-radius:4px;
}
.video-tag {
  position:absolute;
  top:8px;
  left:8px;
  background:var(--primary);
  color:#fff;
  font-size:11px;
  padding:2px 8px;
  border-radius:4px;
  font-weight:600;
}
.video-info {
  padding:14px;
}
.video-info h3 {
  font-size:14px;
  font-weight:600;
  color:var(--text-primary);
  margin-bottom:8px;
  line-height:1.5;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.video-meta {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  color:var(--text-muted);
}
.video-meta .views {
  display:flex;
  align-items:center;
  gap:4px;
}
.video-meta .likes {
  display:flex;
  align-items:center;
  gap:4px;
  color:var(--accent);
}
.news-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:24px;
}
.news-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  transition:var(--transition);
  display:flex;
  flex-direction:column;
}
.news-card:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-hover);
  border-color:var(--primary);
}
.news-img {
  aspect-ratio:16/9;
  overflow:hidden;
}
.news-img img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 0.4s;
}
.news-card:hover .news-img img {
  transform:scale(1.05);
}
.news-body {
  padding:18px;
  flex:1;
  display:flex;
  flex-direction:column;
}
.news-cat {
  display:inline-block;
  background:rgba(26,107,60,0.2);
  color:var(--primary-light);
  font-size:11px;
  padding:3px 10px;
  border-radius:12px;
  margin-bottom:10px;
  border:1px solid rgba(26,107,60,0.3);
}
.news-body h3 {
  font-size:16px;
  font-weight:700;
  margin-bottom:10px;
  line-height:1.5;
  color:var(--text-primary);
}
.news-body p {
  font-size:13px;
  color:var(--text-secondary);
  line-height:1.7;
  flex:1;
}
.news-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--border);
  font-size:12px;
  color:var(--text-muted);
}
.news-footer a {
  color:var(--primary-light);
  font-size:13px;
  font-weight:600;
}
.news-footer a:hover {
  color:var(--accent);
}
.expert-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:24px;
}
.expert-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:24px;
  border:1px solid var(--border);
  text-align:center;
  transition:var(--transition);
}
.expert-card:hover {
  border-color:var(--primary);
  box-shadow:var(--shadow-hover);
}
.expert-avatar {
  width:90px;
  height:90px;
  border-radius:50%;
  margin:0 auto 14px;
  overflow:hidden;
  border:3px solid var(--primary);
  box-shadow:0 0 20px rgba(26,107,60,0.3);
}
.expert-avatar img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.expert-card h3 {
  font-size:17px;
  font-weight:700;
  margin-bottom:4px;
}
.expert-card .role {
  font-size:13px;
  color:var(--primary-light);
  margin-bottom:10px;
}
.expert-card p {
  font-size:13px;
  color:var(--text-secondary);
  line-height:1.6;
  margin-bottom:14px;
}
.expert-tags {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:center;
  margin-bottom:14px;
}
.expert-tag {
  background:rgba(26,107,60,0.15);
  color:var(--primary-light);
  font-size:11px;
  padding:3px 10px;
  border-radius:12px;
  border:1px solid rgba(26,107,60,0.2);
}
.expert-btns {
  display:flex;
  gap:8px;
  justify-content:center;
}
.btn-sm {
  padding:6px 14px;
  border-radius:16px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:var(--transition);
  border:none;
}
.btn-sm-primary {
  background:var(--primary);
  color:#fff;
}
.btn-sm-primary:hover {
  background:var(--primary-light);
}
.btn-sm-outline {
  background:transparent;
  border:1px solid var(--border);
  color:var(--text-secondary);
}
.btn-sm-outline:hover {
  border-color:var(--primary);
  color:var(--primary-light);
}
.features-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:20px;
}
.feature-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:24px 20px;
  border:1px solid var(--border);
  text-align:center;
  transition:var(--transition);
}
.feature-card:hover {
  border-color:var(--primary);
  transform:translateY(-3px);
  box-shadow:var(--shadow-hover);
}
.feature-icon {
  width:56px;
  height:56px;
  background:rgba(26,107,60,0.15);
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 14px;
  font-size:26px;
  border:1px solid rgba(26,107,60,0.2);
}
.feature-card h3 {
  font-size:15px;
  font-weight:700;
  margin-bottom:8px;
}
.feature-card p {
  font-size:13px;
  color:var(--text-secondary);
  line-height:1.6;
}
.reviews-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:20px;
}
.review-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:20px;
  border:1px solid var(--border);
  transition:var(--transition);
}
.review-card:hover {
  border-color:var(--primary);
}
.review-stars {
  color:var(--accent);
  font-size:16px;
  margin-bottom:10px;
}
.review-text {
  font-size:14px;
  color:var(--text-secondary);
  line-height:1.7;
  margin-bottom:14px;
}
.review-user {
  display:flex;
  align-items:center;
  gap:10px;
}
.review-avatar {
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:700;
  color:#fff;
  flex-shrink:0;
}
.review-user-info .name {
  font-size:14px;
  font-weight:600;
}
.review-user-info .date {
  font-size:12px;
  color:var(--text-muted);
}
.faq-list {
  max-width:800px;
  margin:0 auto;
}
.faq-item {
  background:var(--bg-card);
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  margin-bottom:12px;
  overflow:hidden;
}
.faq-q {
  padding:16px 20px;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  transition:var(--transition);
  color:var(--text-primary);
}
.faq-q:hover {
  background:rgba(26,107,60,0.1);
  color:var(--primary-light);
}
.faq-q.open {
  color:var(--primary-light);
  background:rgba(26,107,60,0.1);
}
.faq-q span {
  font-size:18px;
  transition:transform 0.3s;
}
.faq-q.open span {
  transform:rotate(45deg);
}
.faq-a {
  display:none;
  padding:0 20px 16px;
  font-size:14px;
  color:var(--text-secondary);
  line-height:1.8;
  border-top:1px solid var(--border);
}
.faq-a.open {
  display:block;
}
.partners-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:16px;
}
.partner-item {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:600;
  color:var(--text-muted);
  transition:var(--transition);
  min-height:64px;
}
.partner-item:hover {
  border-color:var(--primary);
  color:var(--primary-light);
  background:rgba(26,107,60,0.05);
}
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:start;
}
.contact-info h3 {
  font-size:20px;
  font-weight:700;
  margin-bottom:20px;
}
.contact-item {
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:20px;
}
.contact-icon {
  width:44px;
  height:44px;
  background:rgba(26,107,60,0.15);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  flex-shrink:0;
  border:1px solid rgba(26,107,60,0.2);
}
.contact-item .label {
  font-size:12px;
  color:var(--text-muted);
  margin-bottom:3px;
}
.contact-item .value {
  font-size:15px;
  font-weight:600;
  color:var(--text-primary);
}
.qr-codes {
  display:flex;
  gap:20px;
  margin-top:24px;
}
.qr-item {
  text-align:center;
}
.qr-box {
  width:100px;
  height:100px;
  background:var(--bg-card);
  border:2px solid var(--border);
  border-radius:var(--radius-sm);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:8px;
  font-size:11px;
  color:var(--text-muted);
  overflow:hidden;
}
.qr-box svg {
  width:80px;
  height:80px;
}
.qr-item p {
  font-size:12px;
  color:var(--text-muted);
}
.share-bar {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:16px 0;
}
.share-label {
  font-size:14px;
  color:var(--text-muted);
}
.share-btn {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 14px;
  border-radius:20px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  border:none;
  transition:var(--transition);
}
.share-wechat {
  background:#07c160;
  color:#fff;
}
.share-weibo {
  background:#e6162d;
  color:#fff;
}
.share-douyin {
  background:#000;
  color:#fff;
  border:1px solid #333;
}
.share-bilibili {
  background:#00a1d6;
  color:#fff;
}
.share-btn:hover {
  opacity:0.85;
  transform:translateY(-1px);
}
footer {
  background:#080d12;
  border-top:1px solid var(--border);
  padding:50px 0 20px;
}
.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:40px;
  margin-bottom:40px;
}
.footer-brand p {
  font-size:13px;
  color:var(--text-muted);
  line-height:1.8;
  margin-top:14px;
}
.footer-col h4 {
  font-size:14px;
  font-weight:700;
  color:var(--text-primary);
  margin-bottom:16px;
}
.footer-col ul {
  list-style:none;
}
.footer-col ul li {
  margin-bottom:10px;
}
.footer-col ul li a {
  font-size:13px;
  color:var(--text-muted);
}
.footer-col ul li a:hover {
  color:var(--primary-light);
}
.footer-bottom {
  border-top:1px solid var(--border);
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  font-size:12px;
  color:var(--text-muted);
}
.footer-bottom a {
  color:var(--text-muted);
}
.footer-bottom a:hover {
  color:var(--primary-light);
}
.tag {
  display:inline-block;
  background:rgba(26,107,60,0.15);
  color:var(--primary-light);
  font-size:12px;
  padding:3px 10px;
  border-radius:12px;
  border:1px solid rgba(26,107,60,0.2);
  margin:3px;
}
.page-hero {
  background:var(--bg-section);
  padding:40px 0;
  border-bottom:1px solid var(--border);
  position:relative;
  overflow:hidden;
}
.page-hero::before {
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 30% 50%,rgba(26,107,60,0.12) 0%,transparent 70%);
}
.page-hero .container {
  position:relative;
  z-index:1;
}
.page-hero h1 {
  font-size:clamp(24px,3vw,36px);
  font-weight:800;
  margin-bottom:10px;
}
.page-hero p {
  font-size:15px;
  color:var(--text-secondary);
  max-width:600px;
}
.content-sidebar {
  display:grid;
  grid-template-columns:1fr 300px;
  gap:30px;
  align-items:start;
}
.sidebar-widget {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:20px;
  border:1px solid var(--border);
  margin-bottom:20px;
}
.sidebar-widget h4 {
  font-size:15px;
  font-weight:700;
  margin-bottom:14px;
  padding-bottom:10px;
  border-bottom:1px solid var(--border);
  color:var(--text-primary);
}
.sidebar-list {
  list-style:none;
}
.sidebar-list li {
  padding:8px 0;
  border-bottom:1px solid var(--border);
  font-size:13px;
}
.sidebar-list li:last-child {
  border-bottom:none;
}
.sidebar-list li a {
  color:var(--text-secondary);
  display:flex;
  justify-content:space-between;
}
.sidebar-list li a:hover {
  color:var(--primary-light);
}
.sidebar-list li span {
  color:var(--text-muted);
  font-size:12px;
}
.article-content {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:30px;
  border:1px solid var(--border);
}
.article-content h1 {
  font-size:24px;
  font-weight:800;
  margin-bottom:16px;
  line-height:1.4;
}
.article-meta {
  display:flex;
  gap:16px;
  font-size:13px;
  color:var(--text-muted);
  margin-bottom:20px;
  padding-bottom:16px;
  border-bottom:1px solid var(--border);
  flex-wrap:wrap;
}
.article-body {
  font-size:15px;
  line-height:1.9;
  color:var(--text-secondary);
}
.article-body h2 {
  font-size:20px;
  color:var(--text-primary);
  margin:24px 0 12px;
}
.article-body h3 {
  font-size:17px;
  color:var(--text-primary);
  margin:20px 0 10px;
}
.article-body p {
  margin-bottom:16px;
}
.article-body img {
  border-radius:var(--radius-sm);
  margin:20px 0;
  width:100%;
}
.comments-section {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:24px;
  border:1px solid var(--border);
  margin-top:20px;
}
.comments-section h3 {
  font-size:18px;
  font-weight:700;
  margin-bottom:20px;
}
.comment-item {
  display:flex;
  gap:14px;
  padding:16px 0;
  border-bottom:1px solid var(--border);
}
.comment-item:last-child {
  border-bottom:none;
}
.comment-avatar {
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:700;
  color:#fff;
  flex-shrink:0;
}
.comment-body .user {
  font-size:14px;
  font-weight:600;
  margin-bottom:4px;
}
.comment-body .text {
  font-size:14px;
  color:var(--text-secondary);
  line-height:1.7;
}
.comment-body .date {
  font-size:12px;
  color:var(--text-muted);
  margin-top:6px;
}
.comment-likes {
  font-size:12px;
  color:var(--text-muted);
  margin-top:6px;
}
.live-badge {
  display:inline-flex;
  align-items:center;
  gap:5px;
  background:var(--red);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:2px 8px;
  border-radius:4px;
  letter-spacing:1px;
}
.live-dot {
  width:6px;
  height:6px;
  background:#fff;
  border-radius:50%;
  animation:blink 1s infinite;
}
@keyframes blink {
  0%,100% {
    opacity:1;
  }
  50% {
    opacity:0;
  }
}
.stats-row {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.stat-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:24px;
  text-align:center;
  border:1px solid var(--border);
  transition:var(--transition);
}
.stat-card:hover {
  border-color:var(--primary);
}
.stat-card .num {
  font-size:32px;
  font-weight:900;
  color:var(--accent);
}
.stat-card .unit {
  font-size:14px;
  color:var(--accent);
}
.stat-card .label {
  font-size:13px;
  color:var(--text-muted);
  margin-top:6px;
}
.pagination {
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:40px;
  flex-wrap:wrap;
}
.page-btn {
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--radius-sm);
  font-size:14px;
  background:var(--bg-card);
  border:1px solid var(--border);
  color:var(--text-secondary);
  cursor:pointer;
  transition:var(--transition);
}
.page-btn:hover,.page-btn.active {
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
.hamburger {
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  padding:4px;
}
.hamburger span {
  display:block;
  width:24px;
  height:2px;
  background:var(--text-primary);
  border-radius:2px;
  transition:var(--transition);
}
@media (max-width:1024px) {
  .footer-grid {
    grid-template-columns:1fr 1fr;
  }
  .contact-grid {
    grid-template-columns:1fr;
  }
  .content-sidebar {
    grid-template-columns:1fr;
  }
  .stats-row {
    grid-template-columns:repeat(2,1fr);
  }
}
@media (max-width:768px) {
  nav {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--bg-dark);
    border-top:1px solid var(--border);
    flex-direction:column;
    padding:16px;
    gap:4px;
    z-index:999;
  }
  nav.open {
    display:flex;
  }
  nav a {
    padding:10px 16px;
    border-radius:var(--radius-sm);
  }
  .hamburger {
    display:flex;
  }
  .header-inner {
    position:relative;
  }
  .hero {
    min-height:400px;
  }
  .hero h1 {
    font-size:26px;
  }
  .hero-stats {
    gap:20px;
  }
  .footer-grid {
    grid-template-columns:1fr;
    gap:24px;
  }
  .video-grid {
    grid-template-columns:repeat(2,1fr);
  }
  .news-grid {
    grid-template-columns:1fr;
  }
  .expert-grid {
    grid-template-columns:repeat(2,1fr);
  }
  .features-grid {
    grid-template-columns:repeat(2,1fr);
  }
  .reviews-grid {
    grid-template-columns:1fr;
  }
  .stats-row {
    grid-template-columns:repeat(2,1fr);
  }
  .section {
    padding:40px 0;
  }
  .header-actions .btn-login {
    display:none;
  }
}
@media (max-width:480px) {
  .video-grid {
    grid-template-columns:1fr;
  }
  .expert-grid {
    grid-template-columns:1fr;
  }
  .features-grid {
    grid-template-columns:1fr;
  }
  .hero-btns {
    flex-direction:column;
  }
  .stats-row {
    grid-template-columns:repeat(2,1fr);
  }
  .hero-stats {
    flex-wrap:wrap;
  }
}
img[data-src] {
  opacity:0;
  transition:opacity 0.4s;
}
img.loaded {
  opacity:1;
}
@keyframes fadeInUp {
  from {
    opacity:0;
    transform:translateY(20px);
  }
  to {
    opacity:1;
    transform:translateY(0);
  }
}
.fade-in {
  animation:fadeInUp 0.6s ease forwards;
}
.highlight {
  color:var(--primary-light);
  font-weight:700;
}
.accent {
  color:var(--accent);
}
.divider {
  height:1px;
  background:var(--border);
  margin:30px 0;
}
.badge {
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px 10px;
  border-radius:12px;
  font-size:11px;
  font-weight:700;
}
.badge-green {
  background:rgba(26,107,60,0.2);
  color:var(--primary-light);
  border:1px solid rgba(26,107,60,0.3);
}
.badge-gold {
  background:rgba(240,165,0,0.15);
  color:var(--accent);
  border:1px solid rgba(240,165,0,0.2);
}
.badge-red {
  background:rgba(229,62,62,0.15);
  color:#fc8181;
  border:1px solid rgba(229,62,62,0.2);
}
.video-player-wrap {
  background:#000;
  border-radius:var(--radius);
  overflow:hidden;
  aspect-ratio:16/9;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  cursor:pointer;
}
.video-player-wrap img {
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0.7;
}
.video-player-overlay {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:12px;
}
.big-play-btn {
  width:80px;
  height:80px;
  background:rgba(26,107,60,0.9);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  border:4px solid rgba(255,255,255,0.8);
  transition:transform 0.3s;
}
.big-play-btn:hover {
  transform:scale(1.1);
}
.big-play-btn svg {
  width:36px;
  height:36px;
  fill:#fff;
  margin-left:5px;
}
.tools-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:20px;
}
.tool-card {
  background:var(--bg-card);
  border-radius:var(--radius);
  padding:24px;
  border:1px solid var(--border);
  text-align:center;
  transition:var(--transition);
  cursor:pointer;
}
.tool-card:hover {
  border-color:var(--primary);
  transform:translateY(-3px);
  box-shadow:var(--shadow-hover);
}
.tool-icon {
  font-size:40px;
  margin-bottom:12px;
}
.tool-card h3 {
  font-size:16px;
  font-weight:700;
  margin-bottom:8px;
}
.tool-card p {
  font-size:13px;
  color:var(--text-secondary);
}
.tool-card .tool-badge {
  margin-top:12px;
}
.data-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.data-table th {
  background:rgba(26,107,60,0.15);
  color:var(--primary-light);
  padding:12px 16px;
  text-align:left;
  font-weight:600;
  border-bottom:1px solid var(--border);
}
.data-table td {
  padding:12px 16px;
  border-bottom:1px solid var(--border);
  color:var(--text-secondary);
}
.data-table tr:hover td {
  background:rgba(26,107,60,0.05);
}
.progress-bar {
  background:var(--border);
  border-radius:4px;
  height:6px;
  overflow:hidden;
  margin:6px 0;
}
.progress-fill {
  height:100%;
  background:var(--primary);
  border-radius:4px;
  transition:width 1s ease;
}
:root {
  --primary:#F56A34;
  --primary-dark:#C94F22;
  --primary-light:#16877C;
  --accent:#F56A34;
  --accent-dark:#BD4A20;
  --bg-dark:#FFF9F3;
  --bg-card:#FFFFFF;
  --bg-section:#F1FAF7;
  --text-primary:#3D2921;
  --text-secondary:#6D5549;
  --text-muted:#8E776C;
  --border:#EBD9CB;
  --green:#16877C;
  --sky:#D8ECF4;
  --cream:#FFF9F3;
  --orange-pale:#FFF0E7;
  --green-pale:#E6F5F0;
  --shadow:0 10px 30px rgba(94,53,33,.08);
  --shadow-hover:0 16px 34px rgba(194,82,37,.16);
  --gradient-main:linear-gradient(135deg,#F56A34 0%,#F98C47 100%);
  --gradient-card:linear-gradient(180deg,#FFFFFF 0%,#FFF9F3 100%);
  --transition:160ms ease;
}
* {
  box-sizing:border-box;
}
html {
  background:var(--bg-dark);
  scroll-behavior:smooth;
}
body {
  background:var(--bg-dark);
  color:var(--text-primary);
  font-family:"PingFang SC","Microsoft YaHei",sans-serif;
}
a {
  color:var(--primary-light);
}
a:hover {
  color:var(--primary-dark);
}
::selection {
  background:#F9C6AD;
  color:#3D2921;
}
::-webkit-scrollbar-track {
  background:#FFF4EC;
}
::-webkit-scrollbar-thumb {
  background:#ECA078;
  border-radius:8px;
}
[hidden] {
  display:none !important;
}
.skip-link {
  background:#FFFFFF;
  color:var(--text-primary);
  border:1px solid var(--border);
  border-radius:8px;
}
.top-bar {
  background:#D8ECF4;
  color:#315C5C;
  border-color:#B8DDE2;
}
.top-bar .container {
  display:flex;
  justify-content:space-between;
  gap:18px;
}
.top-bar a,.top-bar-links a {
  color:#315C5C;
}
.top-bar a:hover,.top-bar-links a:hover {
  color:var(--primary-dark);
}
.site-header,header {
  background:rgba(255,249,243,.96);
  border-bottom:1px solid rgba(235,217,203,.9);
  box-shadow:0 5px 20px rgba(99,56,35,.05);
}
.logo-icon {
  background:transparent;
  border:0;
  box-shadow:none;
}
.logo-icon img {
  width:42px;
  height:42px;
  border-radius:12px;
}
.logo-text span:first-child {
  color:var(--text-primary);
}
.logo-text span:last-child {
  color:var(--primary-light);
  letter-spacing:.2px;
}
nav#mainNav {
  gap:2px;
}
nav#mainNav a {
  color:var(--text-secondary);
  border-radius:999px;
}
nav#mainNav a:hover,nav#mainNav a.active {
  color:var(--primary-dark);
  background:#FFF0E7;
}
.header-actions .btn-join,.btn-join {
  color:#FFFFFF;
  background:var(--primary);
  border-color:var(--primary);
  box-shadow:none;
}
.header-actions .btn-join:hover,.btn-join:hover {
  color:#FFFFFF;
  background:var(--primary-dark);
}
.hamburger {
  background:transparent;
}
.hamburger span {
  background:var(--text-primary);
}
.search-bar {
  background:#FFF4EC;
  border-bottom:1px solid var(--border);
}
.search-inner {
  background:#FFFFFF;
  border-color:#E6D0C1;
  box-shadow:0 3px 12px rgba(111,64,39,.04);
}
.search-inner:focus-within {
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(245,106,52,.13);
}
.search-inner input {
  color:var(--text-primary);
}
.search-inner input::placeholder {
  color:#AA9083;
}
.search-inner button {
  background:var(--primary);
  color:#FFFFFF;
}
.search-inner button:hover {
  background:var(--primary-dark);
}
nav.breadcrumb {
  display:block;
  position:static;
  inset:auto;
  width:100%;
  padding:12px 0;
  background:#F1FAF7;
  border-top:0;
  border-bottom:1px solid #CBE7DF;
  z-index:auto;
}
nav.breadcrumb ol {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0;
  margin:0;
  padding:0;
  list-style:none;
}
nav.breadcrumb li {
  display:flex;
  align-items:center;
  min-width:0;
  max-width:100%;
  font-size:13px;
  line-height:1.75;
  color:var(--text-secondary);
}
nav.breadcrumb li + li::before {
  content:"›";
  padding:0 9px;
  color:#6DA99F;
}
nav.breadcrumb a {
  display:inline;
  width:auto;
  padding:0;
  text-align:left;
  white-space:normal;
  color:var(--text-muted);
  background:transparent;
  font-size:13px;
  font-weight:500;
}
nav.breadcrumb a:hover {
  color:var(--primary-dark);
  background:transparent;
}
nav.breadcrumb span {
  margin:0;
  overflow-wrap:anywhere;
}
nav.breadcrumb li[aria-current="page"] {
  color:var(--primary-dark);
}
nav.detail-links {
  display:flex;
  position:static;
  inset:auto;
  width:auto;
  padding:22px 0 0;
  background:transparent;
  border-top:1px solid var(--border);
  flex-direction:row;
  gap:18px;
  z-index:auto;
}
nav.detail-links > a {
  min-width:0;
  padding:0;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.75;
  text-align:left;
  color:var(--primary-light);
}
nav.detail-links > a:hover {
  color:var(--primary-dark);
  background:transparent;
}
.hero {
  min-height:580px;
  background:#F5E7D9;
  overflow:hidden;
}
.hero > .container {
  width:100%;
}
.hero-bg {
  background-image:url('/images/hero.webp');
  background-size:cover;
  background-position:center;
  filter:saturate(.92) contrast(.98);
}
.hero-overlay {
  background:linear-gradient(90deg,rgba(255,249,243,.98) 0%,rgba(255,249,243,.94) 34%,rgba(255,249,243,.54) 59%,rgba(255,249,243,.06) 84%);
}
.hero-content {
  max-width:650px;
  padding-top:72px;
  padding-bottom:58px;
}
.hero-badge {
  background:rgba(255,255,255,.86);
  border-color:#F1C5AD;
  color:var(--primary-dark);
  letter-spacing:.4px;
}
.hero h1 {
  color:#3D2921;
  font-size:clamp(46px,6.4vw,74px);
  letter-spacing:-.055em;
  text-shadow:none;
}
.hero .hero-subtitle {
  max-width:620px;
  margin:0 0 18px;
  color:#4B2E25;
  font-size:clamp(25px,3.4vw,43px);
  font-weight:800;
  line-height:1.28;
}
.hero p {
  max-width:590px;
  color:#65493C;
  line-height:1.9;
}
.hero .btn-primary,.btn-primary {
  background:var(--primary);
  border-color:var(--primary);
  color:#FFFFFF;
  box-shadow:0 8px 18px rgba(211,81,36,.18);
}
.hero .btn-primary:hover,.btn-primary:hover {
  color:#FFFFFF;
  background:var(--primary-dark);
  border-color:var(--primary-dark);
  box-shadow:0 10px 22px rgba(174,63,25,.2);
  transform:translateY(-2px);
}
.hero .btn-secondary,.btn-secondary {
  background:rgba(255,255,255,.9);
  color:var(--primary-dark);
  border-color:#E9B99E;
}
.hero .btn-secondary:hover,.btn-secondary:hover {
  background:#FFFFFF;
  border-color:var(--primary);
  color:var(--primary-dark);
}
.hero-stats {
  gap:29px;
  padding-top:27px;
}
.hero-stat .num {
  color:var(--primary);
  font-size:25px;
}
.hero-stat .label {
  color:#745C50;
}
.section {
  background:var(--bg-dark);
}
.section-alt {
  background:#F1FAF7;
}
.section-title h2 {
  color:var(--text-primary);
}
.section-title h2 span {
  color:var(--primary);
}
.section-title p {
  color:var(--text-secondary);
}
.section-title-line {
  background:var(--primary);
}
.eyebrow {
  color:var(--primary-light);
  letter-spacing:1.1px;
}
.section-action {
  margin-top:26px;
  text-align:center;
}
.live-topic-strip {
  display:grid;
  grid-template-columns:minmax(210px,.85fr) 2fr auto;
  align-items:center;
  gap:22px;
  padding:24px 28px;
  color:#FFFFFF;
  background:linear-gradient(108deg,#16877C 0%,#16877C 58%,#126F68 100%);
  border-radius:20px 8px 20px 8px;
  box-shadow:0 15px 28px rgba(22,135,124,.16);
}
.live-topic-intro .eyebrow {
  margin:0 0 5px;
  color:#C9F0E8;
}
.live-topic-intro strong {
  font-size:20px;
}
.live-topic-list {
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
.live-topic-list a {
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(255,255,255,.1);
  color:#FFFFFF;
  font-size:13px;
}
.live-topic-list a:hover {
  background:#FFFFFF;
  color:#126F68;
}
.strip-link {
  color:#FFFFFF;
  font-weight:700;
  white-space:nowrap;
}
.strip-link:hover {
  color:#FFF2C5;
}
.features-grid {
  gap:18px;
}
.feature-card,.card-pad,.guide-step,.job-card,.article-sidebar,.sidebar-widget,.qa-card,.stat-card,.tool-card {
  background:#FFFFFF;
  border-color:var(--border);
  box-shadow:0 4px 13px rgba(100,56,34,.04);
}
.feature-card:hover,.tool-card:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.feature-icon {
  background:#FFF0E7;
  border-color:#F5C7B0;
  color:var(--primary-dark);
  font-weight:800;
}
.feature-card:nth-child(3n + 2) .feature-icon {
  background:#E6F5F0;
  border-color:#BFE1D9;
  color:#126F68;
}
.feature-card:nth-child(3n) .feature-icon {
  background:#EAF5FA;
  border-color:#CBE3ED;
  color:#39778D;
}
.feature-card h3,.card-pad strong {
  color:var(--text-primary);
}
.feature-card p,.guide-step p,.job-card p {
  color:var(--text-secondary);
}
.btn-sm-primary {
  background:var(--primary);
  color:#FFFFFF;
}
.btn-sm-primary:hover {
  background:var(--primary-dark);
  color:#FFFFFF;
}
.btn-sm-outline {
  background:#FFFFFF;
  border-color:#DDBEAC;
  color:var(--text-secondary);
}
.btn-sm-outline:hover {
  background:#FFF0E7;
  border-color:var(--primary);
  color:var(--primary-dark);
}
.video-grid {
  gap:18px;
}
.video-card {
  background:#FFFFFF;
  border-color:#EBD9CB;
  box-shadow:0 5px 16px rgba(100,56,34,.05);
}
.video-card:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.video-thumb {
  background:#D8ECF4;
}
.video-thumb::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 42%,rgba(50,33,24,.22) 100%);
  pointer-events:none;
}
.video-play-btn {
  background:rgba(61,41,33,.27);
  border:1px solid rgba(255,255,255,.45);
}
.play-icon,.big-play-btn {
  background:rgba(245,106,52,.95);
}
.video-duration {
  background:rgba(61,41,33,.8);
  color:#FFFFFF;
}
.video-tag {
  background:#16877C;
  color:#FFFFFF;
}
.video-info h3 {
  color:var(--text-primary);
}
.video-meta {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  color:var(--text-muted);
}
.video-card .card-caption {
  color:var(--text-muted);
}
.video-card:focus-visible {
  outline:3px solid #84C7BC;
  outline-offset:3px;
}
.video-card:focus-visible .video-play-btn {
  opacity:1;
}
.split-layout {
  gap:clamp(28px,4vw,58px);
}
.media-story {
  align-items:stretch;
}
.media-visual .video-card {
  height:100%;
}
.media-copy {
  padding:10px 0;
}
.media-copy h3,.app-copy h3 {
  color:var(--text-primary);
  font-size:clamp(25px,2.5vw,34px);
  line-height:1.35;
}
.media-copy p,.app-copy p {
  color:var(--text-secondary);
  line-height:1.95;
}
.card-pad {
  border-radius:14px;
}
.card-pad-green {
  background:#EAF7F2;
  border-color:#C9E8DE;
}
.entertainment-row {
  display:grid;
  grid-template-columns:1.08fr .92fr .92fr 1.08fr;
  gap:18px;
  align-items:start;
}
.interest-card {
  overflow:hidden;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:18px 18px 7px 18px;
  box-shadow:0 4px 14px rgba(100,56,34,.05);
}
.interest-card:nth-child(even) {
  transform:translateY(25px);
}
.interest-card:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.interest-image {
  display:block;
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
}
.interest-body {
  padding:18px;
}
.interest-body h3 {
  margin:10px 0 8px;
  color:var(--text-primary);
  font-size:17px;
}
.interest-body p {
  min-height:72px;
  color:var(--text-secondary);
  font-size:13px;
  line-height:1.75;
}
.interest-body a {
  color:var(--primary-dark);
  font-size:13px;
  font-weight:700;
}
.interest-body a:hover {
  color:var(--primary-light);
}
.tag,.news-cat,.expert-tag {
  background:#E6F5F0;
  border-color:#C3E3D9;
  color:#126F68;
}
.ai-grid .feature-card:first-child {
  background:#FFF0E7;
}
.ai-grid .feature-card:nth-child(4n) {
  background:#EAF5FA;
}
.expert-grid {
  gap:18px;
}
.expert-card {
  background:#FFFFFF;
  border-color:var(--border);
  box-shadow:0 4px 15px rgba(100,56,34,.04);
}
.expert-card:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.expert-avatar {
  box-shadow:none;
  background:#D8ECF4;
}
.expert-card h3 {
  color:var(--text-primary);
}
.expert-card p {
  color:var(--text-secondary);
}
.expert-card .expert-tag {
  display:inline-flex;
  margin:14px 0 8px;
  padding:4px 9px;
  border:1px solid #C3E3D9;
  border-radius:999px;
  font-size:11px;
}
.direction-wall {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
  padding:8px 0;
}
.direction-chip,.partner-item {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:50px;
  padding:10px 15px;
  color:#4E625D;
  background:#FFFFFF;
  border:1px solid #CFE7E2;
  border-radius:13px 13px 5px 13px;
  box-shadow:0 4px 11px rgba(21,111,101,.05);
}
.direction-chip:nth-child(3n + 2) {
  background:#FFF5EE;
  border-color:#F0CEBD;
}
.direction-chip:nth-child(3n) {
  background:#EAF5FA;
  border-color:#C6E3EC;
}
.direction-chip:hover,.partner-item:hover {
  color:var(--primary-dark);
  border-color:#E89A72;
  background:#FFFFFF;
}
.direction-chip img,.partner-logo {
  width:26px !important;
  height:26px !important;
  margin:0 !important;
  border-radius:7px;
}
.direction-note {
  margin:18px auto 0;
  max-width:660px;
  color:var(--text-muted);
  text-align:center;
  font-size:12px;
}
.community-list {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.community-item {
  display:grid;
  grid-template-columns:38px 1fr;
  gap:14px;
  padding:21px 18px;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:15px 15px 15px 5px;
}
.community-item:nth-child(2n) {
  background:#FFF8F2;
}
.community-item:nth-child(3n) {
  background:#EAF7F2;
  border-color:#CBE5DD;
}
.community-index {
  color:var(--primary);
  font-size:13px;
  font-weight:800;
}
.community-item h3 {
  margin:0 0 7px;
  color:var(--text-primary);
  font-size:17px;
}
.community-item p {
  margin:0;
  color:var(--text-secondary);
  font-size:13px;
  line-height:1.75;
}
.guide-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
.guide-step {
  position:relative;
  overflow:hidden;
  padding:0 0 23px;
  border-radius:19px 19px 8px 19px;
}
.guide-step .step {
  position:absolute;
  top:13px;
  left:14px;
  z-index:1;
  padding:6px 9px;
  background:#F56A34;
  color:#FFFFFF;
  border-radius:8px;
  font-size:16px;
  font-weight:800;
}
.guide-step .brand-cover {
  display:block;
  width:100%;
  margin:0 0 20px;
  border-radius:0;
  aspect-ratio:16 / 8.5;
  object-fit:cover;
}
.guide-step h3,.guide-step p,.guide-step > a {
  margin-left:22px;
  margin-right:22px;
}
.guide-step h3 {
  color:var(--text-primary);
}
.guide-step p {
  min-height:67px;
}
.app-layout {
  align-items:center;
}
.app-visual-wrap {
  display:grid;
  place-items:center;
  min-height:390px;
  border-radius:28px 8px 28px 8px;
  background:#D8ECF4;
  overflow:hidden;
}
.app-visual {
  display:block;
  width:min(100%,420px);
  max-width:420px;
  margin:0 auto;
  border-radius:22px;
  box-shadow:0 18px 32px rgba(56,101,117,.15);
}
.app-points {
  margin:20px 0;
  padding:0;
  list-style:none;
}
.app-points li {
  padding:12px 0;
  border-bottom:1px dashed #D7C2B5;
  color:var(--text-secondary);
}
.app-points strong {
  color:var(--primary-dark);
}
.notice-small {
  color:var(--text-muted);
}
.reviews-grid {
  gap:18px;
}
.review-card {
  background:#FFFFFF;
  border-color:var(--border);
  box-shadow:0 3px 12px rgba(100,56,34,.04);
}
.review-card:hover {
  border-color:#E89A72;
}
.review-stars {
  color:var(--primary);
}
.review-text {
  color:var(--text-secondary);
}
.review-avatar,.comment-avatar {
  background:#16877C;
  color:#FFFFFF;
}
.review-user-info .name,.comment-body .user {
  color:var(--text-primary);
}
.review-user-info .date,.comment-body .date,.comment-likes {
  color:var(--text-muted);
}
.faq-list {
  border-color:var(--border);
}
.faq-item {
  background:#FFFFFF;
  border-color:var(--border);
}
.faq-q {
  color:var(--text-primary);
}
.faq-q:hover,.faq-q.open,.faq-item[open] .faq-q {
  background:#FFF0E7;
  color:var(--primary-dark);
}
.faq-q::after {
  color:var(--primary);
}
.faq-a {
  color:var(--text-secondary);
}
.contact-grid {
  gap:34px;
}
.contact-info,.contact-visual {
  min-width:0;
}
.contact-info h3,.contact-visual h3 {
  color:var(--text-primary);
}
.contact-brand {
  margin:0 0 8px;
  color:var(--primary-dark);
  font-size:18px;
  font-weight:800;
}
.contact-info > p,.contact-visual > p {
  color:var(--text-secondary);
  line-height:1.85;
}
.contact-item {
  border-color:#EAD8CA;
}
.contact-icon {
  background:#FFF0E7;
  color:var(--primary-dark);
}
.contact-item:nth-of-type(odd) .contact-icon {
  background:#E6F5F0;
  color:#126F68;
}
.contact-item .label {
  color:var(--text-muted);
}
.contact-item .value {
  color:var(--text-primary);
}
.contact-value {
  overflow-wrap:anywhere;
}
.qr-box {
  background:#FFFFFF;
  border-color:#E5D2C5;
}
.qr-box img {
  width:96px;
  height:96px;
}
.qr-item p,.card-caption {
  color:var(--text-muted);
}
.pill-row {
  gap:9px;
}
.share-label {
  color:var(--text-muted);
}
.share-btn {
  border:0;
  box-shadow:none;
}
.share-wechat {
  background:#16877C;
}
.share-weibo {
  background:#E66A48;
}
.share-douyin {
  background:#3D2921;
}
.share-bilibili {
  background:#39778D;
}
.news-grid {
  gap:20px;
}
.news-card {
  background:#FFFFFF;
  border-color:var(--border);
  box-shadow:0 4px 14px rgba(100,56,34,.05);
}
.news-card:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.news-img {
  background:#D8ECF4;
}
.news-img img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.news-body h3,.news-body h3 a {
  color:var(--text-primary);
}
.news-body h3 a:hover {
  color:var(--primary-dark);
}
.news-body p {
  color:var(--text-secondary);
}
.news-footer {
  color:var(--text-muted);
  border-color:#F0E0D6;
}
.news-footer a {
  color:var(--primary-dark);
}
.news-footer a:hover {
  color:var(--primary-light);
}
.page-hero {
  background:linear-gradient(118deg,#FFF0E7 0%,#FFF9F3 55%,#D8ECF4 100%);
}
.page-hero::before {
  background:radial-gradient(ellipse at 24% 45%,rgba(245,106,52,.12) 0%,transparent 67%);
}
.page-hero h1,.page-hero .page-intro {
  color:var(--text-primary);
}
.page-hero p {
  color:var(--text-secondary);
}
.content-sidebar {
  grid-template-columns:minmax(0,1fr) 300px;
}
.content-sidebar > * {
  min-width:0;
}
.article-content,.comments-section {
  overflow-wrap:anywhere;
}
.article-content {
  background:#FFFFFF;
  border-color:var(--border);
}
.article-body {
  color:var(--text-secondary);
}
.article-body h1,.article-body h2,.article-body h3,.qa-answer h1 {
  color:var(--text-primary);
}
.article-cover {
  border-radius:14px;
}
.article-meta {
  color:var(--text-muted);
}
.sidebar-list li a {
  color:var(--text-secondary);
}
.sidebar-list li a:hover {
  color:var(--primary-dark);
}
.sidebar-list li span {
  color:var(--text-muted);
}
.qa-answer .article-content {
  border-top-color:#16877C;
}
.qa-answer .intro-box {
  color:#2D665D;
  background:#EAF7F2;
  border-color:#C9E7DD;
}
.reading-row {
  background:#FFFFFF;
  border-color:var(--border);
}
.reading-row h2 {
  color:var(--text-primary);
}
.reading-row p,.qa-card p {
  color:var(--text-secondary);
}
.qa-card {
  background:#FFFFFF;
}
.qa-card h2 {
  color:var(--text-primary);
}
.data-table th {
  background:#E6F5F0;
  color:#126F68;
}
.data-table td {
  color:var(--text-secondary);
  border-color:var(--border);
}
.data-table tr:hover td {
  background:#FFF7F1;
}
.progress-bar {
  background:#F0DED2;
}
.progress-fill {
  background:var(--primary);
}
.page-btn:hover,.page-btn.active {
  background:var(--primary);
  border-color:var(--primary);
  color:#FFFFFF;
}
.rank-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:28px;
  align-items:start;
}
.rank-list {
  display:flex;
  flex-direction:column;
  gap:14px;
}
.rank-item {
  display:grid;
  grid-template-columns:58px minmax(120px,220px) minmax(0,1fr) auto;
  align-items:center;
  gap:17px;
  padding:14px;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:16px 16px 6px 16px;
  box-shadow:0 4px 14px rgba(100,56,34,.04);
}
.rank-item:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.rank-number {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:13px;
  background:#FFF0E7;
  color:var(--primary-dark);
  font-size:18px;
  font-weight:800;
}
.rank-item:nth-child(2) .rank-number {
  background:#E6F5F0;
  color:#126F68;
}
.rank-item:nth-child(3) .rank-number {
  background:#EAF5FA;
  color:#39778D;
}
.rank-item img {
  width:100%;
  aspect-ratio:16 / 9;
  object-fit:cover;
  border-radius:10px;
}
.rank-item h2,.rank-item h3 {
  margin:0 0 7px;
  color:var(--text-primary);
  font-size:17px;
}
.rank-item p {
  margin:0;
  color:var(--text-secondary);
  font-size:13px;
  line-height:1.7;
}
.rank-item .rank-meta {
  color:var(--text-muted);
  font-size:12px;
  white-space:nowrap;
}
.host-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
.host-card {
  overflow:hidden;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:19px 19px 7px 19px;
  box-shadow:0 4px 14px rgba(100,56,34,.05);
}
.host-card:hover {
  border-color:#E89A72;
  box-shadow:var(--shadow-hover);
}
.host-card > img,.host-card .host-cover {
  display:block;
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
}
.host-card .host-body {
  padding:18px;
}
.host-card h2,.host-card h3 {
  color:var(--text-primary);
  font-size:18px;
}
.host-card p {
  color:var(--text-secondary);
  font-size:13px;
  line-height:1.75;
}
.host-card .host-tag {
  display:inline-block;
  padding:4px 9px;
  background:#E6F5F0;
  color:#126F68;
  border-radius:999px;
  font-size:11px;
}
footer,.site-footer {
  background:#3D2921;
  color:#FBEDE2;
}
.footer-brand p,.footer-col ul li a,.footer-bottom,.footer-bottom a {
  color:#E5CDC0;
}
.footer-col ul li a:hover,.footer-bottom a:hover {
  color:#FFFFFF;
}
.footer-col .footer-heading,.footer-brand .footer-heading,.footer-heading {
  color:#FFFFFF;
  font-size:15px;
  font-weight:700;
  margin-bottom:16px;
}
.footer-brand .logo-text span:first-child {
  color:#FFFFFF;
}
.footer-brand .logo-text span:last-child {
  color:#A8D8CF;
}
.footer-grid {
  border-color:rgba(255,255,255,.14);
}
.footer-bottom {
  border-color:rgba(255,255,255,.14);
}
.mcp-card {
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.16);
}
.mcp-card .footer-heading {
  color:#FFFFFF;
}
.mcp-card p {
  color:#E5CDC0;
}
.mcp-card .btn-sm-outline {
  color:#FFFFFF;
  background:transparent;
  border-color:rgba(255,255,255,.35);
}
.mcp-card .btn-sm-outline:hover {
  background:#F56A34;
  border-color:#F56A34;
}
.qr-codes-footer img {
  background:#FFFFFF;
}
.qr-codes-footer p {
  color:#E5CDC0;
}
.concept-disclosure {
  margin-top:25px;
  padding:18px 0;
  border-top:1px solid rgba(255,255,255,.16);
  border-bottom:1px solid rgba(255,255,255,.12);
  color:#DCC4B7;
  font-size:12px;
  line-height:1.9;
}
.concept-disclosure p {
  margin:0;
}
.modal-open {
  overflow:hidden;
}
dialog {
  width:min(780px,94vw);
  max-height:92vh;
  overflow:auto;
  padding:24px;
  background:#FFF9F3;
  border:1px solid #E2C6B6;
  border-radius:20px;
  color:var(--text-primary);
  box-shadow:0 24px 80px rgba(61,41,33,.24);
}
dialog::backdrop {
  background:rgba(61,41,33,.65);
  backdrop-filter:blur(5px);
}
dialog video {
  display:block;
  width:100%;
  margin:18px 0;
  aspect-ratio:16 / 9;
  background:#D8ECF4;
  border-radius:12px;
}
dialog h2 {
  color:var(--text-primary);
}
dialog p {
  color:var(--text-secondary);
  line-height:1.85;
}
.dialog-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.modal-close {
  flex-shrink:0;
  padding:7px 14px;
  background:#FFF0E7;
  border:1px solid #E9BDA6;
  border-radius:999px;
  color:var(--primary-dark);
  cursor:pointer;
}
.modal-close:hover {
  background:var(--primary);
  border-color:var(--primary);
  color:#FFFFFF;
}
#shareFallback textarea {
  width:100%;
  padding:10px;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:8px;
  color:var(--text-primary);
}
#toast {
  background:#3D2921;
  color:#FFFFFF;
  border-radius:12px;
  box-shadow:0 10px 25px rgba(61,41,33,.22);
}
.demo-note,.demo-chip {
  background:#FFF0E7;
  border-color:#F0C9B4;
  color:#8B472C;
}
@media (max-width:1150px) {
  nav#mainNav a {
    padding:8px 7px;
    font-size:11px;
  }
  .host-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .entertainment-row {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .interest-card:nth-child(even) {
    transform:none;
  }
}
@media (max-width:900px) {
  nav#mainNav {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    padding:14px;
    background:#FFF9F3;
    border-top:1px solid var(--border);
    box-shadow:0 12px 22px rgba(92,53,33,.08);
    flex-direction:column;
    z-index:999;
  }
  nav#mainNav.open {
    display:flex;
  }
  nav#mainNav a {
    width:100%;
    padding:10px;
    text-align:center;
    font-size:14px;
  }
  .header-inner {
    position:relative;
  }
  .live-topic-strip {
    grid-template-columns:1fr;
    gap:14px;
  }
  .split-layout {
    grid-template-columns:1fr;
  }
  .media-visual {
    order:2;
  }
  .community-list {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .rank-layout {
    grid-template-columns:1fr;
  }
  .content-sidebar {
    grid-template-columns:minmax(0,1fr);
  }
  .rank-item {
    grid-template-columns:48px minmax(120px,190px) minmax(0,1fr);
  }
  .rank-item .rank-meta {
    grid-column:2 / -1;
  }
  .hero-overlay {
    background:linear-gradient(90deg,rgba(255,249,243,.98),rgba(255,249,243,.84) 58%,rgba(255,249,243,.30));
  }
}
@media (max-width:600px) {
  .container {
    padding-left:18px;
    padding-right:18px;
  }
  .top-bar .container {
    justify-content:center;
  }
  .top-bar .container span + span {
    display:none;
  }
  .hero {
    min-height:520px;
  }
  .hero-bg {
    background-position:66% center;
  }
  .hero-overlay {
    background:linear-gradient(90deg,rgba(255,249,243,.98),rgba(255,249,243,.89) 65%,rgba(255,249,243,.44));
  }
  .hero-content {
    padding-top:54px;
    padding-bottom:42px;
  }
  .hero h1 {
    font-size:47px;
  }
  .hero .hero-subtitle {
    font-size:28px;
  }
  .hero p {
    font-size:14px;
  }
  .hero-btns {
    flex-direction:row;
  }
  .hero-btns a {
    padding:10px 15px;
    font-size:13px;
  }
  .hero-stats {
    gap:16px;
    flex-wrap:wrap;
  }
  .hero-stat {
    min-width:62px;
  }
  .hero-stat .num {
    font-size:21px;
  }
  .section {
    padding:42px 0;
  }
  .live-topic-strip {
    padding:20px;
    border-radius:16px 6px 16px 6px;
  }
  .live-topic-intro strong {
    font-size:18px;
  }
  .strip-link {
    font-size:13px;
  }
  .features-grid,.three-grid,.two-grid,.guide-grid,.community-list,.host-grid {
    grid-template-columns:1fr;
  }
  .video-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .video-info {
    padding:12px;
  }
  .video-info h3 {
    font-size:13px;
  }
  .video-tag,.video-duration {
    font-size:10px;
  }
  .entertainment-row {
    grid-template-columns:1fr;
  }
  .interest-card,.interest-card:nth-child(even) {
    transform:none;
  }
  .interest-body p {
    min-height:0;
  }
  .expert-grid {
    grid-template-columns:1fr;
  }
  .direction-wall {
    justify-content:flex-start;
  }
  .direction-chip {
    min-height:44px;
    padding:8px 11px;
    font-size:13px;
  }
  .guide-step p {
    min-height:0;
  }
  .app-visual-wrap {
    min-height:310px;
  }
  .app-visual {
    max-width:300px;
  }
  nav.breadcrumb {
    padding:10px 0;
  }
  nav.breadcrumb li,nav.breadcrumb a {
    font-size:12px;
  }
  nav.breadcrumb li + li::before {
    padding:0 6px;
  }
  nav.detail-links {
    flex-direction:column;
    gap:10px;
  }
  .rank-item {
    grid-template-columns:42px 1fr;
    gap:12px;
  }
  .rank-item > img,.rank-item .rank-cover {
    grid-column:2;
  }
  .rank-item > div:not(.rank-number),.rank-item .rank-meta {
    grid-column:2;
  }
  .rank-item .rank-number {
    grid-row:1;
  }
  .footer-bottom {
    font-size:11px;
  }
  .dialog-bar {
    align-items:flex-start;
  }
  .contact-value {
    font-size:13px !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto !important;
    animation:none !important;
    transition:none !important;
  }
}
.skip-link {
  position:fixed;
  top:-100px;
  left:12px;
  z-index:9999;
  padding:10px;
  background:white
}
.skip-link:focus {
  top:12px
}
.layout-d7e21992 {
  background-image:url('/images/hero.webp')
}