/* ============================================================
   平台入口列表 css
   ============================================================ */



* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter','Segoe UI',system-ui,-apple-system,'Microsoft YaHei',sans-serif;
  background:#f5f5f5; color:#666; line-height:1.6; -webkit-font-smoothing:antialiased; padding:0 20px; }
.container { max-width:1400px; margin:0 auto; padding:20px 0 60px; }

.site-header { position:relative; padding:24px 40px; margin-bottom:30px; background:#0F3057;
  border-radius:12px; box-shadow:0 4px 24px rgba(0,0,0,.3); display:flex; flex-wrap:wrap;
  justify-content:space-between; align-items:center; gap:18px; }
.brand .logo { font-size:1.8rem; font-weight:700; letter-spacing:1px; color:#fff; text-decoration:none; }
.brand .tagline { font-size:.8rem; color:#8a8a9e; margin-left:12px; letter-spacing:2px; font-weight:300;
  border-left:1px solid rgba(255,255,255,.08); padding-left:14px; }
.main-nav { display:flex; gap:24px; font-size:.95rem; font-weight:500; flex-wrap:wrap; }
.main-nav a { color:#b0c4db; text-decoration:none; padding:4px 0; border-bottom:2px solid transparent; transition:all .3s; }
.main-nav a:hover,.main-nav a.active { color:#fff; border-bottom-color:#dc0000; }

.breadcrumb { font-size:.85rem; color:#999; margin-bottom:14px; }
.breadcrumb a { color:#888; text-decoration:none; }
.breadcrumb a:hover { color:#0F3057; }
.breadcrumb span { margin:0 6px; color:#ccc; }

.page-header { padding:6px 0 22px; }
.page-header h1 { font-size:2.6rem; font-weight:700; letter-spacing:2px; color:#1f1f1f; }
.page-header .subtitle { font-size:1.02rem; color:#999; margin-top:4px; font-weight:300; letter-spacing:1px;
  border-left:3px solid #dc0000; padding-left:18px; }

.overview { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px;
  background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:22px 26px;
  margin-bottom:34px; box-shadow:0 2px 8px rgba(0,0,0,.03); }
.ov-item { text-align:center; border-right:1px solid #f0f0f0; }
.ov-item:last-child { border-right:none; }
.ov-item .num { font-size:1.9rem; font-weight:700; color:#0F3057; line-height:1.2; }
.ov-item .lab { font-size:.82rem; color:#999; letter-spacing:1px; }

.plat-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:20px; margin-bottom:44px; }
.plat-card { background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:28px 16px 20px;
  text-align:center; text-decoration:none; color:#555; position:relative; overflow:hidden;
  box-shadow:0 2px 8px rgba(0,0,0,.03); transition:all .3s; display:flex; flex-direction:column;
  align-items:center; gap:10px; }
.plat-card::after { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:#0F3057; opacity:0; transition:opacity .3s; }
.plat-card:hover { transform:translateY(-6px); border-color:#0F3057; box-shadow:0 14px 38px rgba(15,48,87,.12); color:#1f1f1f; }
.plat-card:hover::after { opacity:1; }
.plat-card .ico { width:68px; height:68px; border-radius:50%; background:#f2f5f9; color:#0F3057;
  display:flex; align-items:center; justify-content:center; font-size:2rem; transition:all .3s; }
.plat-card:hover .ico { transform:scale(1.07); }
.plat-card .pname { font-size:1.05rem; font-weight:600; color:#1f1f1f; }
.plat-card .pcount { font-size:.8rem; color:#888; }
.plat-card .pcount b { color:#0F3057; font-size:1rem; }
.plat-card .pgo { font-size:.78rem; color:#bbb; margin-top:2px; }
.plat-card:hover .pgo { color:#dc0000; }
.plat-card[data-p="抖音"] .ico { color:#000; background:#eaf9fd; }
.plat-card[data-p="今日头条"] .ico { color:#f8593c; background:#fdeeeb; }
.plat-card[data-p="百家号"] .ico { color:#2932e1; background:#ececfd; }
.plat-card[data-p="视频号"] .ico { color:#09b83e; background:#e9f9ee; }
.plat-card[data-p="微信公众号"] .ico { color:#07c160; background:#e8f8ef; }
.plat-card[data-p="微博"] .ico { color:#ff8200; background:#fff3e6; }
.plat-card[data-p="知乎"] .ico { color:#0084ff; background:#e8f2ff; }
.plat-card[data-p="B站"] .ico { color:#fb7299; background:#fdeaf0; }
.plat-card[data-p="搜狐号"] .ico { color:#ee6a3d; background:#fdefe8; }
.plat-card[data-p="网易号"] .ico { color:#e73c3c; background:#fdecec; }
.plat-empty { grid-column:1/-1; background:#fff; border:1px dashed #dfe5ec; border-radius:12px;
  padding:46px 20px; text-align:center; color:#aaa; }

.table-sec { background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:28px 30px;
  margin-bottom:40px; box-shadow:0 2px 8px rgba(0,0,0,.03); }
.table-sec h2 { font-size:1.3rem; color:#1f1f1f; font-weight:600; margin-bottom:18px; }
.table-sec h2 i { color:#0F3057; margin-right:10px; }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
thead th { background:#f7f9fc; text-align:left; padding:12px 14px; font-weight:600; color:#2c3e50; border-bottom:2px solid #e8edf4; }
tbody td { padding:12px 14px; border-bottom:1px solid #eef2f7; color:#666; }
tbody tr:hover { background:#fafcfe; }
tbody td a { color:#0F3057; text-decoration:none; word-break:break-all; }
tbody td a:hover { color:#dc0000; }
.badge { display:inline-block; background:#eef2f7; color:#0F3057; padding:2px 12px; border-radius:20px; font-size:.78rem; }
.badge.hot { background:#fdecec; color:#c9302c; }
.badge.off { background:#f2f4f6; color:#aaa; }
.bar-wrap { background:#f0f3f7; border-radius:20px; height:8px; width:120px; overflow:hidden;
  display:inline-block; vertical-align:middle; margin-right:8px; }
.bar { height:100%; background:linear-gradient(90deg,#0F3057,#2b6cb0); border-radius:20px; }

.note-sec { background:#fff; border:1px solid #e8e8e8; border-left:4px solid #0F3057; border-radius:8px;
  padding:20px 24px; margin-bottom:40px; font-size:.92rem; color:#777; }
.note-sec h3 { font-size:1rem; color:#1f1f1f; margin-bottom:8px; }
.note-sec ol { margin:8px 0 0 18px; }
.note-sec li { margin-bottom:4px; }
.note-sec a { color:#0F3057; }

.site-footer { margin-top:30px; border-top:1px solid #e8e8e8; padding:32px 0 20px; text-align:center; font-size:.85rem; color:#999; }
.site-footer .footer-links { margin-top:10px; }
.site-footer a { color:#999; text-decoration:none; margin:0 10px; transition:color .3s; }
.site-footer a:hover { color:#0F3057; }

@media (max-width:1199px){ .plat-grid { grid-template-columns:repeat(4,1fr); } }
@media (max-width:992px){
  .site-header { padding:20px 24px; flex-direction:column; align-items:stretch; gap:14px; }
  .brand .tagline { display:block; margin-left:0; padding-left:0; border-left:none; margin-top:2px; }
  .page-header h1 { font-size:2.1rem; }
  .plat-grid { grid-template-columns:repeat(3,1fr); }
  .table-sec { padding:22px 18px; overflow-x:auto; }
}
@media (max-width:768px){
  body { padding:0 12px; }
  .page-header h1 { font-size:1.75rem; }
  .plat-grid { grid-template-columns:repeat(2,1fr); gap:14px; }
  .plat-card .ico { width:56px; height:56px; font-size:1.6rem; }
  .ov-item { border-right:none; border-bottom:1px solid #f0f0f0; padding-bottom:10px; }
  table { min-width:620px; }
}
@media (max-width:480px){ .page-header h1 { font-size:1.45rem; } .plat-card { padding:20px 10px 16px; } }

/* ===== 返回顶部按钮 ===== */
.gotop {
  position: fixed; right: 28px; bottom: 34px;
  width: 50px; height: 50px; padding: 0; border: none; border-radius: 50%;
  background: #fff; box-shadow: 0 4px 18px rgba(15,48,87,.18);
  cursor: pointer; z-index: 9999;
  opacity: 0; visibility: hidden; transform: translateY(14px) scale(.9);
  transition: opacity .3s, transform .3s, visibility .3s;
}
.gotop.show { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.gotop-ring { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.gotop-bg { fill: none; stroke: #eceff4; stroke-width: 3; }
.gotop-bar { fill: none; stroke: #0F3057; stroke-width: 3; stroke-linecap: round;
  stroke-dasharray: 119.38; stroke-dashoffset: 119.38; }
.gotop-arrow { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center; }
.gotop-arrow svg { width: 18px; height: 18px; fill: none;
  stroke: #0F3057; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.gotop:hover { box-shadow: 0 6px 22px rgba(15,48,87,.28); }
.gotop:hover .gotop-arrow svg { stroke: #dc0000; }
.gotop:hover .gotop-bar { stroke: #dc0000; }
@media (max-width:768px){
  .gotop { right: 14px; bottom: 18px; width: 42px; height: 42px; }
  .gotop-arrow svg { width: 15px; height: 15px; }
}

/* ===== 移动端响应式补丁 · 平台入口列表页	 ===== */
.nav-toggle{display:none;position:absolute;top:20px;right:20px;z-index:60;width:44px;height:44px;padding:0;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:10px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.nav-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:all .3s}
.nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:768px){
  .site-header{position:relative}
  .brand{padding-right:60px}
  .nav-toggle{display:flex}
  .main-nav{display:none!important;width:100%;flex-direction:column;gap:0;padding-top:12px;border-top:1px solid rgba(255,255,255,.12)}
  .main-nav.open{display:flex!important}
  .main-nav a{padding:13px 0;font-size:1rem;border-bottom:1px solid rgba(255,255,255,.08)}
  .page-header h1{font-size:1.6rem}
  .page-header .subtitle{font-size:.9rem;padding-left:12px}
  .overview{grid-template-columns:repeat(2,1fr);gap:10px;padding:16px 14px}
  .ov-item{border-right:none}
  .ov-item:nth-child(-n+2){border-bottom:1px solid #f0f0f0;padding-bottom:10px}
  .ov-item .num{font-size:1.5rem}
  .ov-item .lab{font-size:.74rem}
  .plat-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .plat-card{padding:18px 10px 14px}
  .plat-card .ico{width:50px;height:50px;font-size:1.5rem}
  .plat-card .pname{font-size:.95rem}
  .plat-card .pcount{font-size:.75rem}
  .table-sec{padding:18px 14px}
  .table-sec h2{font-size:1.1rem}
  table{min-width:560px;font-size:.85rem}
  thead th,tbody td{padding:10px}
  .note-sec{padding:16px;font-size:.88rem}
}


/* ============================================================
   国内平台品牌图标（FA 无收录，内联 SVG 精准还原）
   覆盖：百家号 / 今日头条 / 视频号 / 微信公众号 / 搜狐号 / 网易号
   同时适配 平台入口页(.plat-card) 与 封面页(.plat-item)
   ============================================================ */

/* ① 隐藏原来凑数的 FA 图标 */
.plat-card[data-p="百家号"] .ico i,    .plat-item[data-p="百家号"] .ico i,
.plat-card[data-p="今日头条"] .ico i,  .plat-item[data-p="今日头条"] .ico i,
.plat-card[data-p="视频号"] .ico i,    .plat-item[data-p="视频号"] .ico i,
.plat-card[data-p="微信公众号"] .ico i,.plat-item[data-p="微信公众号"] .ico i,
.plat-card[data-p="搜狐号"] .ico i,    .plat-item[data-p="搜狐号"] .ico i,
.plat-card[data-p="网易号"] .ico i,    .plat-item[data-p="网易号"] .ico i {
  display: none !important;
}

/* ② 伪元素统一基础 */
.plat-card[data-p="百家号"] .ico::after,    .plat-item[data-p="百家号"] .ico::after,
.plat-card[data-p="今日头条"] .ico::after,  .plat-item[data-p="今日头条"] .ico::after,
.plat-card[data-p="视频号"] .ico::after,    .plat-item[data-p="视频号"] .ico::after,
.plat-card[data-p="微信公众号"] .ico::after,.plat-item[data-p="微信公众号"] .ico::after,
.plat-card[data-p="搜狐号"] .ico::after,    .plat-item[data-p="搜狐号"] .ico::after,
.plat-card[data-p="网易号"] .ico::after,    .plat-item[data-p="网易号"] .ico::after {
  content: ''; display: block; width: 62%; height: 62%;
  min-width: 28px; min-height: 28px;
  background-repeat: no-repeat; background-position: center; background-size: contain;
}

/* ③ 百家号：蓝紫渐变 C 形 + 双星闪 */
.plat-card[data-p="百家号"] .ico::after, .plat-item[data-p="百家号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%232b6cf0'/%3E%3Cstop offset='1' stop-color='%238b5cf6'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='7' y='8' width='20' height='6' rx='3' fill='%233b82f6'/%3E%3Cpath d='M31 16a12 12 0 1 0 0 16' fill='none' stroke='url(%23g)' stroke-width='7' stroke-linecap='round'/%3E%3Cpath d='M35 9 L36.5 13.5 L41 15 L36.5 16.5 L35 21 L33.5 16.5 L29 15 L33.5 13.5 Z' fill='%23c084fc'/%3E%3Cpath d='M39.5 22 L40.25 23.75 L42 24.5 L40.25 25.25 L39.5 27 L38.75 25.25 L37 24.5 L38.75 23.75 Z' fill='%23a855f7'/%3E%3C/svg%3E");
}

/* ④ 今日头条：红色圆角块 + 白色新闻行 */
.plat-card[data-p="今日头条"] .ico::after, .plat-item[data-p="今日头条"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='5' y='5' width='38' height='38' rx='9' fill='%23F8593C'/%3E%3Crect x='13' y='14' width='22' height='4' rx='2' fill='white'/%3E%3Crect x='13' y='22' width='22' height='4' rx='2' fill='white'/%3E%3Crect x='13' y='30' width='13' height='4' rx='2' fill='white'/%3E%3C/svg%3E");
}

/* ⑤ 视频号：绿色圆 + 白色播放键（与公众号明确区分） */
.plat-card[data-p="视频号"] .ico::after, .plat-item[data-p="视频号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%2309B83E'/%3E%3Cpath d='M19 15 L34 24 L19 33 Z' fill='white'/%3E%3C/svg%3E");
}

/* ⑥ 微信公众号：微信绿圆 + 白色双气泡 */
.plat-card[data-p="微信公众号"] .ico::after, .plat-item[data-p="微信公众号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%2307C160'/%3E%3Cellipse cx='19' cy='21' rx='10' ry='8' fill='white'/%3E%3Cpath d='M12 27 L10.5 32 L15.5 29 Z' fill='white'/%3E%3Cellipse cx='31' cy='29' rx='8' ry='6.5' fill='white' opacity='0.85'/%3E%3Cpath d='M36 33 L37.5 37 L33 35 Z' fill='white' opacity='0.85'/%3E%3C/svg%3E");
}

/* ⑦ 搜狐号：橙色圆 + 白色狐狸头 */
.plat-card[data-p="搜狐号"] .ico::after, .plat-item[data-p="搜狐号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%23EE6A3D'/%3E%3Cpath d='M24 13 L29 20 C32.5 21 34.5 24 33 27.5 C31.5 31 27.5 33 24 33 C20.5 33 16.5 31 15 27.5 C13.5 24 15.5 21 19 20 Z' fill='white'/%3E%3Cpath d='M13 14 L16.5 23 L21 18 Z' fill='white'/%3E%3Cpath d='M35 14 L31.5 23 L27 18 Z' fill='white'/%3E%3C/svg%3E");
}

/* ⑧ 网易号：红色圆 + 白色信封（网易邮箱基因） */
.plat-card[data-p="网易号"] .ico::after, .plat-item[data-p="网易号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%23E73C3C'/%3E%3Crect x='13' y='16' width='22' height='16' rx='2' fill='white'/%3E%3Cpath d='M13 18.5 L24 26 L35 18.5' fill='none' stroke='%23E73C3C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}


/* ============================================================
   平台更新明细表 · 移动端排版修复
   ============================================================ */

/* ---------- ≤992px：横滑基础 + 解除内联宽度锁定 ---------- */
@media (max-width: 992px) {
  .table-sec { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  /* 覆盖 <th style="width:60px/200px/100px"> 的内联锁定 */
  .table-sec thead th:nth-child(1),
  .table-sec thead th:nth-child(4),
  .table-sec thead th:nth-child(5) { width: auto !important; }
  /* 横滑时冻结「平台名称」列 */
  .table-sec thead th:nth-child(2),
  .table-sec tbody td:nth-child(2) { position: sticky; left: 0; z-index: 2; }
  .table-sec thead th:nth-child(2) { background: #f7f9fc; z-index: 3; }
  .table-sec tbody td:nth-child(2) { background: #fff; box-shadow: 1px 0 0 #eef2f7; }
  .table-sec tbody tr:hover td:nth-child(2) { background: #fafcfe; }
}

/* ---------- ≤768px：行高统一，杜绝纵向错位 ---------- */
@media (max-width: 768px) {
  .table-sec { padding: 16px 12px !important; }
  .table-sec h2 { font-size: 1.05rem !important; margin-bottom: 14px; }
  .table-sec h2::after {
    content: "（左右滑动查看）";
    font-size: .74rem; color: #bbb; font-weight: 400; margin-left: 8px;
  }
  .table-sec table { min-width: 520px !important; font-size: .82rem; }
  .table-sec thead th,
  .table-sec tbody td { padding: 10px !important; }
  /* ★ 所有单元格强制单行，行高统一 */
  .table-sec tbody td { white-space: nowrap; vertical-align: middle; }
  .table-sec td .badge { white-space: nowrap; }
  /* 长链接单行省略号，点击仍跳完整地址 */
  .table-sec tbody td:nth-child(3) a {
    display: block; max-width: 190px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  /* ★ 进度条缩小，与数字稳定同行 */
  .table-sec .bar-wrap { width: 64px !important; margin-right: 6px; }
  .table-sec tbody td:nth-child(4) { white-space: nowrap; }
}

/* ---------- ≤480px：隐藏「排序」列 ---------- */
@media (max-width: 480px) {
  .table-sec { padding: 14px 10px !important; }
  .table-sec table { min-width: 460px !important; font-size: .78rem; }
  .table-sec thead th,
  .table-sec tbody td { padding: 9px 8px !important; }
  .table-sec thead th:nth-child(1),
  .table-sec tbody td:nth-child(1) { display: none; }
  .table-sec tbody td:nth-child(3) a { max-width: 150px; }
  .table-sec .bar-wrap { width: 52px !important; }
  .table-sec .badge { padding: 2px 9px; font-size: .74rem; }
  .table-sec h2::after { content: "（左右滑动）"; }
}

/* ---------- ≤360px ---------- */
@media (max-width: 360px) {
  .table-sec { padding: 12px 8px !important; }
  .table-sec table { min-width: 420px !important; font-size: .76rem; }
  .table-sec tbody td:nth-child(3) a { max-width: 130px; }
  .table-sec .bar-wrap { width: 46px !important; }
  .table-sec thead th,
  .table-sec tbody td { padding: 8px 6px !important; }
}