/* ============================================================================
   r538 · 公告「查看全文」阅读页美化 —— 王炸 2026-10-18
   适用：教程下载 / 重要通知 / 常见问题 点「查看全文」后的全屏阅读页
   风格：靛蓝紫 #6366f1 → #8b5cf6，与 r362 公告栏主题一致
   原则：纯 CSS 覆盖，不动任何逻辑与 DOM；!important 压过组件 scoped 样式
   回滚：删掉 index.html 里对应的 <link> 并删本文件即可
   ========================================================================== */

/* ---------- ① 全屏底色：柔光渐变，替掉整片死白 ---------- */
.wz-reader-popup{ background:#eef1fa !important; }

.wz-reader{
  box-sizing:border-box !important;
  background:
    radial-gradient(120% 36% at 50% 0%, rgba(99,102,241,.20), rgba(99,102,241,0) 72%),
    radial-gradient(90% 32% at 100% 2%, rgba(168,85,247,.16), rgba(168,85,247,0) 72%),
    radial-gradient(80% 30% at 0% 8%, rgba(56,189,248,.10), rgba(56,189,248,0) 70%),
    linear-gradient(180deg,#f8f9fe 0%,#eef1f9 60%,#e9edf7 100%) !important;
}

/* ---------- ② 顶栏：磨砂玻璃 + 靛蓝细线 ---------- */
.wz-reader-bar{
  background:rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter:blur(16px) saturate(150%) !important;
  backdrop-filter:blur(16px) saturate(150%) !important;
  border-bottom:1px solid rgba(99,102,241,.14) !important;
  box-shadow:0 6px 20px rgba(79,70,229,.06) !important;
}
.wz-reader-bar-title{
  color:#1b2130 !important; font-weight:700 !important; letter-spacing:.3px;
}
.wz-reader-back{
  color:#5b5bd6 !important; font-weight:600;
  background:rgba(99,102,241,.10) !important;
  border-radius:16px !important;
  padding:0 12px !important;
  transition:background .15s ease;
}
.wz-reader-back:active{ background:rgba(99,102,241,.20) !important; }

/* ---------- ③ 正文：变成一张有质感的「纸」 ---------- */
.wz-reader-scroll{
  margin:10px 12px 0 !important;
  padding:18px 18px 26px !important;
  border:1px solid rgba(99,102,241,.12) !important;
  border-radius:20px !important;
  background:
    linear-gradient(180deg, rgba(99,102,241,.055), rgba(255,255,255,0) 130px),
    #ffffff !important;
  box-shadow:0 16px 36px rgba(49,55,110,.10), 0 2px 8px rgba(15,23,42,.04) !important;
  scrollbar-width:thin;
}
.wz-reader-scroll::-webkit-scrollbar{ width:6px; }
.wz-reader-scroll::-webkit-scrollbar-thumb{
  background:rgba(99,102,241,.28); border-radius:3px;
}
.wz-reader-scroll::-webkit-scrollbar-track{ background:transparent; }

/* ---------- ④ 标题：左侧渐变小竖条 ---------- */
.wz-reader-title{
  position:relative !important;
  padding-left:12px !important;
  font-size:19.5px !important;
  line-height:1.5 !important;
  font-weight:800 !important;
  color:#171a26 !important;
  letter-spacing:.2px;
}
.wz-reader-title::before{
  content:""; position:absolute; left:0; top:2px; bottom:2px; width:4px;
  border-radius:3px; background:linear-gradient(180deg,#6366f1,#8b5cf6);
}

/* ---------- ⑤ 分类胶囊 / 置顶标 / 元信息 ---------- */
.wz-reader-cat{
  border-radius:999px !important;
  box-shadow:0 3px 10px rgba(15,23,42,.10);
  letter-spacing:.3px;
}
.wz-reader-cat.cat-1{ background:linear-gradient(135deg,#10b981,#059669) !important; }
.wz-reader-cat.cat-3{ background:linear-gradient(135deg,#f59e0b,#f97316) !important; }
.wz-reader-cat.cat-5{ background:linear-gradient(135deg,#8b95a7,#6b7280) !important; }
.wz-reader-top{
  background:linear-gradient(135deg,#fff1f2,#ffe4e6) !important;
  color:#e11d48 !important;
  box-shadow:0 3px 10px rgba(225,29,72,.12);
}
.wz-reader-sub{
  color:#8b95a7 !important;
  border-bottom:1px solid rgba(99,102,241,.12) !important;
}

/* ---------- ⑥ 正文排版 ---------- */
.wz-reader-content{
  font-size:16px !important;
  line-height:1.95 !important;
  color:#333a45 !important;
}
.wz-reader-content p{ margin:0 0 13px !important; }
.wz-reader-content h1,
.wz-reader-content h2,
.wz-reader-content h3,
.wz-reader-content h4{
  color:#171a26 !important; font-weight:700 !important; line-height:1.55 !important;
}
.wz-reader-content h3{
  position:relative !important;
  padding:6px 12px 6px 13px !important;
  margin:18px 0 9px !important;
  font-size:16px !important;
  background:linear-gradient(90deg, rgba(99,102,241,.10), rgba(139,92,246,.03) 78%, rgba(255,255,255,0)) !important;
  border-radius:9px !important;
}
.wz-reader-content h3::before{
  content:""; position:absolute; left:0; top:7px; bottom:7px; width:4px;
  border-radius:3px; background:linear-gradient(180deg,#6366f1,#8b5cf6);
}
.wz-reader-content strong,
.wz-reader-content b{ color:#171a26 !important; }
.wz-reader-content a.notice-link{
  color:#5b5bd6 !important;
  text-decoration-color:rgba(91,91,214,.35);
  text-underline-offset:3px;
}
.wz-reader-content blockquote{
  margin:12px 0 !important;
  padding:11px 13px !important;
  border-left:3px solid #6366f1 !important;
  background:linear-gradient(90deg,#f4f4ff,#fafaff 78%,rgba(255,255,255,0)) !important;
  border-radius:0 10px 10px 0 !important;
  color:#4b5563 !important;
}
.wz-reader-content code{
  background:#f3f4fb !important; color:#5b21b6 !important;
  border:1px solid rgba(99,102,241,.14); border-radius:5px; padding:1px 6px;
}
.wz-reader-content img{
  border-radius:12px !important;
  box-shadow:0 10px 26px rgba(15,23,42,.14) !important;
}
.wz-reader-content table{
  overflow:hidden; border-radius:10px !important;
  box-shadow:0 2px 10px rgba(15,23,42,.05);
}
.wz-reader-content th{
  background:linear-gradient(180deg,#f1f3fe,#eaeefc) !important;
  color:#1b2130 !important;
}
.wz-reader-content td,
.wz-reader-content th{ border-color:rgba(99,102,241,.14) !important; }
.wz-reader-content tbody tr:nth-child(even) td{ background:#fafbff !important; }
.wz-reader-content .notice-copy-btn{
  background:rgba(99,102,241,.10) !important;
  color:#5b5bd6 !important;
  border-radius:12px !important;
}
.wz-reader-content .notice-copy-btn:active{ background:rgba(99,102,241,.20) !important; }

/* ---------- ⑦ 结尾 / 底部按钮 ---------- */
.wz-reader-end{ color:#aab2c2 !important; letter-spacing:.5px; }
.wz-reader-foot{
  background:linear-gradient(180deg, rgba(238,241,249,0), rgba(238,241,249,.94) 40%, #eef1f9 100%) !important;
  border-top:0 !important;
  padding-top:14px !important;
}
.wz-reader-btn{
  height:48px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg,#6366f1,#8b5cf6) !important;
  box-shadow:0 12px 26px rgba(99,102,241,.34) !important;
  letter-spacing:.6px;
  transition:transform .12s ease, opacity .12s ease;
}
.wz-reader-btn:active{ transform:translateY(1px) scale(.994); opacity:.94 !important; }

/* ---------- ⑧ 桌面内联详情（兼容旧路径，不改变布局） ---------- */
.detail-header{
  background:linear-gradient(180deg, rgba(99,102,241,.07), rgba(99,102,241,0)) !important;
  border-bottom:1px solid rgba(99,102,241,.12) !important;
}
.detail-content a.notice-link{ color:#5b5bd6 !important; }
.detail-content .notice-copy-btn{
  background:rgba(99,102,241,.10) !important; color:#5b5bd6 !important;
}

/* ---------- ⑨ 小屏微调：留白更紧凑，卡片仍圆润 ---------- */
@media (max-width:360px){
  .wz-reader-scroll{ margin:8px 9px 0 !important; padding:16px 14px 22px !important; }
  .wz-reader-title{ font-size:18px !important; }
  .wz-reader-content{ font-size:15.5px !important; }
}