/* ===================== 资讯前台（时间线信息流，参考 timus.cn/news） ===================== */
:root{
  --nw-bg:#fafafb;
  --nw-ink:#0a0a0f;
  --nw-ink-2:#3a3a45;
  --nw-ink-3:#6b6b78;
  --nw-line:#ececf0;
  --nw-purple:#7c3aed;
  --nw-purple-deep:#6d28d9;
}
.nw-wrap{ max-width:820px; margin:0 auto; padding:0 20px 70px; }

/* 管理员预览横幅 */
.nw-preview-bar{ font-size:13px; font-weight:600; text-align:center; padding:10px 16px; border-radius:10px; margin:14px auto 0; max-width:820px; }
.nw-preview-bar.ok{ background:#eef6ff; color:#1d4ed8; border:1px solid #cfe0ff; }
.nw-preview-bar.draft{ background:#fff7e6; color:#b45309; border:1px solid #ffe2ad; }

/* Hero */
.nw-hero{ text-align:center; padding:60px 16px 26px; position:relative; }
.nw-hero-badge{ display:inline-block; font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--nw-purple-deep); background:#f3eeff; border:1px solid #e6dcff; padding:5px 14px; border-radius:999px; margin-bottom:18px; }
.nw-hero h1{ font-size:42px; line-height:1.15; letter-spacing:-.02em; font-weight:800; margin:0 0 14px; color:var(--nw-ink); }
.nw-hero p{ font-size:15px; color:var(--nw-ink-3); line-height:1.85; max-width:620px; margin:0 auto; }

/* 分类筛选胶囊 */
.nw-cats{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin:6px 0 34px; }
.nw-cats a{ font-size:13px; font-weight:600; color:var(--nw-ink-2); text-decoration:none; border:1px solid var(--nw-line); background:#fff; border-radius:999px; padding:8px 18px; transition:all .15s; }
.nw-cats a:hover{ border-color:var(--nw-ink-3); }
.nw-cats a.on{ background:var(--nw-purple); border-color:var(--nw-purple); color:#fff; }
.nw-cats a:not(.on)[style*="--c"]:hover{ color:var(--c); border-color:var(--c); }

/* 时间线信息流 */
.nw-timeline{ position:relative; padding-left:30px; margin-top:10px; }
.nw-timeline::before{ content:''; position:absolute; left:5px; top:8px; bottom:8px; width:1px; background:#e8e8ee; }
.nw-item{ position:relative; padding:0 0 34px; }
.nw-item::before{ content:''; position:absolute; left:-30px; top:5px; width:11px; height:11px; border-radius:50%; background:#fff; border:2.5px solid var(--nw-purple); }
.nw-item.c-purple::before{ border-color:#7c3aed; }
.nw-item.c-green::before{ border-color:#10b981; }
.nw-item.c-warn::before{ border-color:#f59e0b; }
.nw-item.c-blue::before{ border-color:#3b82f6; }
.nw-item.c-pink::before{ border-color:#ec4899; }

.nw-meta{ display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.nw-meta time{ font-size:12px; color:#9a9aa6; font-variant-numeric:tabular-nums; font-weight:600; }
.nw-cat{ font-size:10.5px; font-weight:800; padding:2.5px 10px; border-radius:999px; background:#f4f2fb; color:var(--nw-purple-deep); }
.nw-item.c-green .nw-cat{ background:#e8f8f1; color:#0b7a54; }
.nw-item.c-warn  .nw-cat{ background:#fdf3e3; color:#9a6b1f; }
.nw-item.c-blue  .nw-cat{ background:#e8f0ff; color:#1d4ed8; }
.nw-item.c-pink  .nw-cat{ background:#fdeaf3; color:#be185d; }
.nw-top{ font-size:10.5px; font-weight:800; padding:2.5px 9px; border-radius:999px; background:var(--nw-purple); color:#fff; }

.nw-item h3{ font-size:16.5px; font-weight:700; color:var(--nw-ink); line-height:1.6; margin:0 0 7px; }
.nw-item h3 a{ color:inherit; text-decoration:none; transition:color .15s; }
.nw-item h3 a:hover{ color:var(--nw-purple); }
.nw-item p{ font-size:13px; color:var(--nw-ink-3); line-height:1.9; max-width:760px; margin:0; }

.nw-foot{ display:flex; align-items:center; gap:14px; margin-top:10px; font-size:12px; color:#9aa0ad; flex-wrap:wrap; }
.nw-foot .nw-views{ }
.nw-foot .nw-src{ color:var(--nw-ink-3); }

.nw-empty{ text-align:center; color:var(--nw-ink-3); padding:60px 0; font-size:14px; }

/* 响应式 */
@media (max-width:600px){
  .nw-hero{ padding:40px 8px 18px; }
  .nw-hero h1{ font-size:30px; }
  .nw-wrap{ padding:0 14px 50px; }
  .nw-timeline{ padding-left:24px; }
  .nw-item::before{ left:-24px; }
  .nw-timeline::before{ left:4px; }
}

/* ===================== 文章详情 ===================== */
.nw-article{ max-width:760px; margin:0 auto; padding-top:14px; }
.nw-back{ display:inline-block; font-size:13px; color:var(--nw-ink-3); text-decoration:none; margin-bottom:6px; }
.nw-back:hover{ color:var(--nw-purple); }
.nw-article-title{ font-size:30px; line-height:1.35; font-weight:800; color:var(--nw-ink); margin:6px 0 12px; letter-spacing:-.01em; }
.nw-article-byline{ display:flex; align-items:center; gap:16px; font-size:12.5px; color:#9aa0ad; flex-wrap:wrap; padding-bottom:18px; border-bottom:1px solid var(--nw-line); }
.nw-cover{ margin:22px 0; border-radius:14px; overflow:hidden; border:1px solid var(--nw-line); }
.nw-cover img{ width:100%; display:block; }
.nw-lead{ font-size:15px; line-height:1.8; color:var(--nw-ink-2); background:#f8f7fc; border-left:3px solid var(--nw-purple); padding:14px 18px; border-radius:0 10px 10px 0; margin:20px 0; }
.nw-content{ font-size:15px; line-height:1.95; color:#22242b; }
.nw-content h2{ font-size:20px; font-weight:700; margin:28px 0 12px; color:var(--nw-ink); }
.nw-content h3{ font-size:17px; font-weight:700; margin:22px 0 10px; color:var(--nw-ink); }
.nw-content p{ margin:0 0 16px; }
.nw-content ul,.nw-content ol{ margin:0 0 16px; padding-left:22px; }
.nw-content li{ margin:6px 0; }
.nw-content blockquote{ margin:16px 0; padding:12px 18px; background:#f8f7fc; border-left:3px solid var(--nw-purple); color:var(--nw-ink-2); border-radius:0 10px 10px 0; }
.nw-content a{ color:var(--nw-purple); }
.nw-source{ margin:24px 0 8px; font-size:13px; color:var(--nw-ink-3); word-break:break-all; }
.nw-source a{ color:var(--nw-purple); }
.nw-tags{ display:flex; gap:8px; flex-wrap:wrap; margin:18px 0 8px; }
.nw-tag{ font-size:12px; color:var(--nw-purple-deep); background:#f3eeff; border:1px solid #e6dcff; padding:4px 12px; border-radius:999px; }

.nw-related{ max-width:760px; margin:40px auto 0; padding-top:22px; border-top:1px solid var(--nw-line); }
.nw-related h2{ font-size:18px; font-weight:800; color:var(--nw-ink); margin:0 0 16px; }
.nw-rel-list{ display:flex; flex-direction:column; gap:10px; }
.nw-rel{ display:flex; align-items:center; gap:12px; text-decoration:none; padding:12px 14px; border:1px solid var(--nw-line); border-radius:10px; background:#fff; transition:.15s; }
.nw-rel:hover{ border-color:var(--nw-purple); box-shadow:0 6px 18px rgba(124,58,237,.08); }
.nw-rel-cat{ font-size:11px; font-weight:700; color:var(--nw-purple-deep); background:#f3eeff; padding:3px 10px; border-radius:999px; flex:0 0 auto; }
.nw-rel-title{ flex:1; font-size:14px; color:var(--nw-ink); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nw-rel-date{ font-size:12px; color:#9aa0ad; flex:0 0 auto; }

@media (max-width:600px){
  .nw-article-title{ font-size:24px; }
  .nw-content{ font-size:14.5px; }
}