/* ============================================================
   如是心 · 专题页统一样式（topic.css）
   ------------------------------------------------------------
   所有专题页共用这一份样式：内容直接写在 HTML 里，
   jQuery（topic.js）只负责交互（相对时间 / 锚点 / 扫码弹窗）。
   新增一个专题：复制任意专题 HTML → 改文字和图片即可。

   结构速查：
   .tp-hero      头图横幅（深色全出血）
   .tp-nav       章节导航条（sticky）
   .tp-sec       正文区块（每个章节一个，带 id 供锚点）
   .tp-sechead   区块头：序号 + 标题 + 副标题
   .tp-cols      图组（3 图）
   .tp-spots     点位标签
   .tp-days      行程清单
   .tp-cards     文章大卡（图 + 标题 + 摘要）
   .tp-hotel     接待酒店卡
   .tp-cta       底部转化卡
   .tp-rail      右侧栏（目录 / 须知 / 相关文章 / 标签 / 订阅）
   ============================================================ */

/* ---------- 头图横幅 ---------- */
.tp-hero { position: relative; overflow: hidden; min-height: 62vh; display: flex; align-items: flex-end; padding: 7rem 0 3.2rem; }
.tp-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.04); animation: tpzoom 20s ease-out forwards; }
@keyframes tpzoom { to { transform: scale(1.14); } }
.tp-hero-mask { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,34,27,.74) 0%, rgba(18,34,27,.52) 42%, rgba(18,34,27,.94) 100%); }
.tp-watermark { position: absolute; right: 2%; bottom: -8%; font-family: 'Noto Serif SC', serif; font-size: 15rem; line-height: .8; letter-spacing: -.05em; color: rgba(247,243,234,.16); pointer-events: none; }
@media (max-width: 1023px) { .tp-hero { min-height: 52vh; padding: 6rem 0 2.4rem; } .tp-watermark { font-size: 9rem; } }

.tp-kicker { font-size: .74rem; letter-spacing: .3em; color: #E4C98A; text-transform: uppercase; }
.tp-title { font-family: 'Noto Serif SC', serif; font-weight: 900; font-size: 2.1rem; line-height: 1.25; color: #F7F3EA; margin: .7rem 0 .9rem; }
@media (min-width: 768px) { .tp-title { font-size: 3rem; } }
.tp-lead { max-width: 46rem; font-size: .92rem; line-height: 2; color: rgba(247,243,234,.78); }
.tp-stats { display: flex; flex-wrap: wrap; gap: 2.2rem; margin: 2rem 0 2.2rem; }
.tp-stat b { display: block; font-family: 'Noto Serif SC', serif; font-size: 1.7rem; font-weight: 700; color: #E4C98A; line-height: 1.2; }
.tp-stat span { font-size: .72rem; letter-spacing: .12em; color: rgba(247,243,234,.5); }

.tp-btn { display: inline-flex; align-items: center; gap: .45rem; padding: .72rem 1.6rem; border-radius: 99px; font-size: .86rem; letter-spacing: .05em; cursor: pointer; border: 1px solid #C9A45C; background: #C9A45C; color: #1E3A2E; font-weight: 500; transition: background .3s, color .3s, transform .3s; }
.tp-btn:hover { background: #E4C98A; transform: translateY(-2px); }
.tp-btn.ghost { background: rgba(247,243,234,.06); color: #F7F3EA; border-color: rgba(247,243,234,.35); }
.tp-btn.ghost:hover { background: rgba(247,243,234,.16); }
.tp-btn.solid-ink { background: #1E3A2E; border-color: #1E3A2E; color: #E4C98A; }
.tp-btn.solid-ink:hover { background: #2F4A3C; }

/* ---------- 章节导航条 ---------- */
.tp-nav { position: sticky; top: 80px; z-index: 30; background: rgba(247,243,234,.92); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(30,58,46,.12); }
.tp-nav-inner { display: flex; gap: .3rem; overflow-x: auto; padding: .45rem 0; }
.tp-nav a { flex: 1 1 0; text-align: center; padding: .45rem .5rem; border-radius: .7rem; font-size: .82rem; color: rgba(30,58,46,.62); text-decoration: none; white-space: nowrap; transition: background .3s, color .3s; }
.tp-nav a i { display: block; font-style: normal; font-family: 'Noto Serif SC', serif; font-size: .68rem; opacity: .55; }
.tp-nav a:hover { color: #A63D2F; background: rgba(255,255,255,.75); }
.tp-nav a.on { color: #A63D2F; background: #fff; font-weight: 700; box-shadow: inset 0 -2px 0 #C9A45C; }

/* ---------- 正文区块 ---------- */
.tp-sec { scroll-margin-top: 152px; padding: 2.6rem 0; border-bottom: 1px solid rgba(30,58,46,.08); }
.tp-sec:last-of-type { border-bottom: 0; }
.tp-sechead { display: flex; align-items: flex-start; gap: .9rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(30,58,46,.12); }
.tp-no { flex: 0 0 2.7rem; width: 2.7rem; height: 2.7rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; font-family: 'Noto Serif SC', serif; font-size: 1.15rem; font-weight: 700; background: #1E3A2E; color: #E4C98A; }
.tp-h2 { font-family: 'Noto Serif SC', serif; font-weight: 700; font-size: 1.32rem; color: #1E3A2E; line-height: 1.4; }
.tp-sub { font-size: .8rem; color: rgba(30,58,46,.55); margin-top: .25rem; }
.tp-place { font-size: .7rem; letter-spacing: .18em; color: #A63D2F; }
.tp-intro { font-size: .92rem; line-height: 2; color: rgba(30,58,46,.8); margin-top: 1.1rem; }

.tp-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; margin-top: 1.2rem; }
@media (max-width: 767px) { .tp-cols { grid-template-columns: repeat(2, 1fr); } }
.tp-img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: .7rem; background: #E4E0D2; }

.tp-spots { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; }
.tp-spot { font-size: .72rem; padding: .24rem .65rem; border-radius: .4rem; background: rgba(92,122,102,.13); color: #3A5A48; }

.tp-days { margin-top: 1.3rem; }
.tp-day { display: flex; gap: .8rem; padding: .5rem 0; border-bottom: 1px dashed rgba(30,58,46,.14); }
.tp-day:last-child { border-bottom: 0; }
.tp-dayno { flex: 0 0 3.4rem; font-family: 'Noto Serif SC', serif; font-size: .74rem; font-weight: 700; color: #A63D2F; padding-top: .12rem; }
.tp-daytext { font-size: .85rem; line-height: 1.8; color: rgba(30,58,46,.75); }

/* ---------- 文章卡（正文大卡） ---------- */
.tp-cards { display: grid; gap: .8rem; margin-top: 1.3rem; }
.tp-card { display: flex; gap: 1rem; align-items: flex-start; padding: .85rem .9rem; border-radius: .9rem; background: rgba(255,255,255,.62); border: 1px solid rgba(30,58,46,.07); text-decoration: none; transition: transform .3s, box-shadow .3s, border-color .3s; }
.tp-card:hover { transform: translateY(-3px); box-shadow: 0 16px 32px -22px rgba(30,58,46,.55); border-color: rgba(201,164,92,.5); }
.tp-card:hover .tp-cardtitle { color: #A63D2F; }
.tp-card img { flex: 0 0 128px; width: 128px; height: 88px; object-fit: cover; border-radius: .6rem; background: #E4E0D2; }
@media (max-width: 767px) { .tp-card img { flex: 0 0 92px; width: 92px; height: 68px; } }
.tp-cardtitle { display: block; font-family: 'Noto Serif SC', serif; font-size: .98rem; font-weight: 600; line-height: 1.5; color: #1E3A2E; transition: color .3s; }
.tp-carddesc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .78rem; line-height: 1.75; color: rgba(30,58,46,.58); margin-top: .3rem; }

/* ---------- meta 行：标签 / 时间 / 热度 ---------- */
.tp-meta { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; font-size: .68rem; color: rgba(30,58,46,.42); margin-top: .4rem; }
.tp-meta .dot { width: 3px; height: 3px; border-radius: 99px; background: rgba(30,58,46,.25); }
.tp-tag { padding: .1rem .45rem; border-radius: .35rem; background: rgba(30,58,46,.07); color: rgba(30,58,46,.55); }
.tp-pill { padding: .12rem .5rem; border-radius: .35rem; font-size: .66rem; }

/* ---------- 接待酒店卡 ---------- */
.tp-hotel { display: flex; gap: .9rem; align-items: center; margin-top: 1.2rem; padding: .8rem .9rem; border-radius: .9rem; background: linear-gradient(100deg, rgba(228,201,138,.3), rgba(247,243,234,.55)); border: 1px solid rgba(201,164,92,.42); }
.tp-hotel img { flex: 0 0 92px; width: 92px; height: 68px; object-fit: cover; border-radius: .5rem; background: #E4E0D2; }
.tp-hotel .badge { font-size: .66rem; padding: .12rem .5rem; border-radius: .35rem; margin-left: .4rem; }

/* ---------- 底部转化卡 ---------- */
.tp-cta { margin-top: 2.4rem; border-radius: 1.2rem; padding: 2.2rem 2rem; background: #1E3A2E; color: #F7F3EA; text-align: center; }
.tp-cta h3 { font-family: 'Noto Serif SC', serif; font-weight: 700; font-size: 1.4rem; color: #E4C98A; line-height: 1.6; margin: .6rem 0 .8rem; }
.tp-cta p { max-width: 40rem; margin: 0 auto; font-size: .86rem; line-height: 2; color: rgba(247,243,234,.72); }
.tp-cta .btns { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; margin-top: 1.5rem; }

/* ---------- 右侧栏 ---------- */
.tp-rail { display: grid; gap: 1.1rem; align-content: start; }
.tp-box { border-radius: 1rem; padding: 1.1rem 1.15rem; background: rgba(255,255,255,.6); border: 1px solid rgba(30,58,46,.07); }
.tp-box h4 { font-family: 'Noto Serif SC', serif; font-size: .95rem; font-weight: 700; color: #1E3A2E; padding-bottom: .6rem; margin-bottom: .7rem; border-bottom: 1px solid rgba(30,58,46,.12); }
.tp-toc a { display: flex; align-items: center; gap: .6rem; padding: .45rem .5rem; border-radius: .65rem; text-decoration: none; font-size: .84rem; color: rgba(30,58,46,.7); transition: background .3s, color .3s; }
.tp-toc a:hover, .tp-toc a.on { background: rgba(255,255,255,.85); color: #A63D2F; }
.tp-toc .n { flex: 0 0 1.6rem; height: 1.6rem; border-radius: .45rem; display: flex; align-items: center; justify-content: center; font-family: 'Noto Serif SC', serif; font-size: .78rem; font-weight: 700; background: rgba(30,58,46,.08); color: rgba(30,58,46,.6); }
.tp-toc a:hover .n, .tp-toc a.on .n { background: #C9A45C; color: #F7F3EA; }

.tp-notes { list-style: none; padding: 0; margin: 0; }
.tp-notes li { position: relative; padding: .34rem 0 .34rem 1.1rem; font-size: .8rem; line-height: 1.8; color: rgba(30,58,46,.72); }
.tp-notes li::before { content: ''; position: absolute; left: 0; top: .85rem; width: 5px; height: 5px; border-radius: 99px; background: #C9A45C; }

.tp-row { display: flex; gap: .7rem; align-items: center; padding: .5rem .45rem; border-radius: .7rem; text-decoration: none; transition: background .3s, transform .3s; }
.tp-row:hover { background: rgba(255,255,255,.8); transform: translateX(3px); }
.tp-row img { flex: 0 0 62px; width: 62px; height: 46px; object-fit: cover; border-radius: .4rem; background: #E4E0D2; }
.tp-rowtitle { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .8rem; line-height: 1.5; color: rgba(30,58,46,.82); }
.tp-row:hover .tp-rowtitle { color: #A63D2F; }

.tp-tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.tp-tags a { font-size: .72rem; padding: .25rem .6rem; border-radius: .35rem; background: rgba(30,58,46,.06); color: rgba(30,58,46,.62); text-decoration: none; transition: background .3s, color .3s; }
.tp-tags a:hover { background: #1E3A2E; color: #E4C98A; }

.tp-promo { border-radius: 1rem; padding: 1.2rem 1.15rem; background: linear-gradient(150deg, #2F4A3C, #1E3A2E); color: #F7F3EA; }
.tp-promo h4 { font-family: 'Noto Serif SC', serif; font-size: 1rem; font-weight: 700; color: #E4C98A; margin: .4rem 0 .45rem; }
.tp-promo p { font-size: .78rem; line-height: 1.8; color: rgba(247,243,234,.7); }

/* ---------- 专题聚合页（topics.html） ---------- */
.tp-feat { border-radius: 1.5rem; background: rgba(239,232,216,.6); border: 1px solid rgba(30,58,46,.1); padding: 1.1rem 1.25rem 1.4rem; box-shadow: 0 18px 40px -28px rgba(30,58,46,.6); }
.tp-coverbox { overflow: hidden; border-radius: 1rem; background: #1E3A2E; }
.tp-coverbox img { width: 100%; object-fit: cover; transition: transform 1.1s ease; }
.tp-coverbox:hover img { transform: scale(1.06); }
.tp-feat-title { font-family: 'Noto Serif SC', serif; font-weight: 900; font-size: 1.75rem; line-height: 1.3; color: #1E3A2E; }
@media (min-width: 768px) { .tp-feat-title { font-size: 2rem; } }
.tp-feat-lead { font-size: .82rem; line-height: 1.9; color: rgba(30,58,46,.58); margin-top: .7rem; }

.tp-tcard { border-radius: 1.25rem; border: 1px solid rgba(30,58,46,.1); background: rgba(255,255,255,.55); overflow: hidden; transition: transform .4s, box-shadow .4s, border-color .4s; }
.tp-tcard:hover { transform: translateY(-6px); box-shadow: 0 22px 42px -26px rgba(30,58,46,.5); border-color: rgba(201,164,92,.5); }
.tp-tcard .cover { width: 100%; aspect-ratio: 16/9; object-fit: cover; background: #E4E0D2; }
.tp-tcard .body { padding: 1rem 1.15rem 1.2rem; }
.tp-tcard h3 { font-family: 'Noto Serif SC', serif; font-weight: 700; font-size: 1.02rem; color: #1E3A2E; }
.tp-tcard:hover h3 { color: #A63D2F; }
.tp-tcard .lead { font-size: .76rem; line-height: 1.8; color: rgba(30,58,46,.55); margin-top: .4rem; }
.tp-tcard .arts { margin-top: .8rem; padding-top: .7rem; border-top: 1px dashed rgba(30,58,46,.14); }
.tp-tcard .arts li { position: relative; padding-left: .8rem; font-size: .76rem; line-height: 1.9; color: rgba(30,58,46,.65); list-style: none; }
.tp-tcard .arts li::before { content: ''; position: absolute; left: 0; top: .72rem; width: 4px; height: 4px; border-radius: 99px; background: #C9A45C; }

/* ---------- 聚合页页头 ---------- */
.tp-kpill { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .8rem; border-radius: 99px; background: rgba(30,58,46,.07); border: 1px solid rgba(30,58,46,.1); font-size: .72rem; color: rgba(30,58,46,.62); letter-spacing: .1em; }
.tp-statcards { display: flex; gap: .7rem; }
.tp-statcard { min-width: 92px; padding: .8rem 1.2rem; border-radius: 1rem; background: rgba(255,255,255,.72); border: 1px solid rgba(30,58,46,.08); text-align: center; }
.tp-statcard b { display: block; font-family: 'Noto Serif SC', serif; font-size: 1.55rem; font-weight: 700; color: #1E3A2E; line-height: 1.25; }
.tp-statcard b i { font-style: normal; font-size: 1.05rem; margin-right: .15rem; vertical-align: 2px; }
.tp-statcard span { font-size: .7rem; color: rgba(30,58,46,.45); }
@media (max-width: 1023px) { .tp-statcards { margin-top: 1rem; } }

/* ---------- 主推卡统计胶囊 ---------- */
.tp-mini { display: inline-flex; align-items: baseline; gap: .3rem; padding: .3rem .7rem; border-radius: .5rem; background: rgba(30,58,46,.06); font-size: .72rem; color: rgba(30,58,46,.5); }
.tp-mini b { font-family: 'Noto Serif SC', serif; font-size: .85rem; color: #1E3A2E; }

/* ---------- 专题索引（侧栏） ---------- */
.tp-index a { display: flex; align-items: center; gap: .7rem; padding: .6rem .7rem; border-radius: .85rem; text-decoration: none; transition: background .3s; }
.tp-index a:hover, .tp-index a.on { background: rgba(255,255,255,.9); }
.tp-index .ic { flex: 0 0 1.9rem; width: 1.9rem; height: 1.9rem; border-radius: .55rem; display: flex; align-items: center; justify-content: center; font-size: .95rem; background: rgba(30,58,46,.07); }
.tp-index a.on .ic { background: #1E3A2E; }
.tp-index .nm { display: block; font-size: .85rem; font-weight: 600; color: rgba(30,58,46,.85); }
.tp-index a.on .nm { color: #A63D2F; }
.tp-index .sb { display: block; font-size: .68rem; color: rgba(30,58,46,.42); margin-top: .12rem; }
.tp-index .arrow { margin-left: auto; color: rgba(30,58,46,.28); font-family: serif; }
.tp-index a:hover .arrow, .tp-index a.on .arrow { color: #A63D2F; }

/* ---------- 篇章目录项（主推卡内） ---------- */
.tp-chap { display: flex; align-items: flex-start; gap: .7rem; padding: .7rem .8rem; border-radius: .9rem; border: 1px solid transparent; text-decoration: none; transition: background .3s, border-color .3s; }
.tp-chap:hover { background: rgba(255,255,255,.75); border-color: rgba(201,164,92,.4); }
.tp-chap:hover .tp-chap-title { color: #A63D2F; }
.tp-chap .n { flex: 0 0 1.75rem; height: 1.75rem; border-radius: .5rem; display: flex; align-items: center; justify-content: center; font-family: 'Noto Serif SC', serif; font-size: .85rem; font-weight: 700; background: rgba(30,58,46,.08); color: rgba(30,58,46,.65); }
.tp-chap:hover .n { background: #C9A45C; color: #F7F3EA; }
.tp-chap-title { display: block; font-size: .86rem; font-weight: 600; color: rgba(30,58,46,.85); transition: color .3s; }
.tp-chap-desc { display: block; font-size: .7rem; color: rgba(30,58,46,.45); margin-top: .15rem; line-height: 1.6; }

/* ---------- 聚合页篇章卡 ---------- */
.tp-chapterbox { border-radius: 1.5rem; background: rgba(255,255,255,.5); border: 1px solid rgba(30,58,46,.08); padding: 1.15rem 1.25rem 1.3rem; margin-top: 1.5rem; scroll-margin-top: 140px; }

/* ---------- 专题库列表页（topic-list.html） ----------
   结构：.tp-toolbar(筛选 + 排序) → .tp-grouphead(分组标题) → .tp-grid > .tp-lcard
   .tp-lcard 上带 data-cat / data-upd / data-hot / data-n，供页面内联 JS 排序筛选
------------------------------------------------------ */
.tp-toolbar { display: flex; align-items: center; gap: .6rem; padding: .8rem 1rem; border-radius: 1rem; background: rgba(255,255,255,.6); border: 1px solid rgba(30,58,46,.08); }
.tp-toolbar-scroll { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; flex: 1; min-width: 0; }
.tp-arr { display: none; }
.tp-filter { display: flex; flex-wrap: wrap; gap: .45rem; }
.tp-fbtn { padding: .4rem .95rem; border-radius: 99px; font-size: .8rem; border: 1px solid rgba(30,58,46,.14); background: rgba(255,255,255,.75); color: rgba(30,58,46,.65); cursor: pointer; transition: background .3s, color .3s, border-color .3s; }
.tp-fbtn:hover { border-color: rgba(201,164,92,.65); color: #A63D2F; }
.tp-fbtn.on { background: #1E3A2E; border-color: #1E3A2E; color: #E4C98A; font-weight: 600; }
.tp-sortwrap { display: flex; align-items: center; gap: .45rem; margin-left: auto; }
.tp-sortwrap .lb { font-size: .72rem; color: rgba(30,58,46,.4); }
@media (max-width: 767px) {
  .tp-toolbar { flex-wrap: nowrap; padding: .55rem .65rem; gap: .25rem; }
  .tp-toolbar-scroll { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; touch-action: pan-x; }
  .tp-toolbar-scroll::-webkit-scrollbar { display: none; }
  .tp-arr { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; flex: 0 0 26px; border-radius: 50%; border: 1px solid rgba(30,58,46,.14); background: rgba(255,255,255,.8); color: rgba(30,58,46,.6); font-size: 15px; cursor: pointer; }
  .tp-filter, .tp-sortwrap { flex-shrink: 0; }
  .tp-sortwrap { margin-left: .5rem; }
  .tp-fbtn { white-space: nowrap; }
}

.tp-grouphead { display: flex; align-items: center; gap: .7rem; margin: 1.9rem 0 1rem; }
.tp-grouphead .bar { width: 3px; height: 1.1rem; border-radius: 2px; background: #A63D2F; }
.tp-grouphead h2 { font-family: 'Noto Serif SC', serif; font-size: 1.16rem; font-weight: 700; color: #1E3A2E; }
.tp-grouphead .cnt { font-size: .72rem; color: rgba(30,58,46,.42); }

.tp-grid { display: grid; gap: 1.05rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1023px) { .tp-grid { grid-template-columns: 1fr; } }

.tp-lcard { display: flex; flex-direction: column; border-radius: 1.25rem; overflow: hidden; background: rgba(255,255,255,.55); border: 1px solid rgba(30,58,46,.09); text-decoration: none; transition: transform .4s, box-shadow .4s, border-color .4s; }
.tp-lcard:hover { transform: translateY(-6px); box-shadow: 0 22px 42px -26px rgba(30,58,46,.5); border-color: rgba(201,164,92,.5); }
.tp-coverwrap { position: relative; }
.tp-lcard .cover { width: 100%; aspect-ratio: 16/9; object-fit: cover; background: #E4E0D2; display: block; }
.tp-lbub { position: absolute; top: .7rem; left: .7rem; display: inline-flex; align-items: center; gap: .3rem; padding: .24rem .6rem; border-radius: .4rem; background: rgba(30,58,46,.72); color: #E4C98A; font-size: .68rem; letter-spacing: .04em; }
.tp-lstate { position: absolute; top: .7rem; right: .7rem; padding: .22rem .55rem; border-radius: .4rem; font-size: .66rem; background: rgba(247,243,234,.9); color: #A63D2F; }
.tp-lcard .body { padding: 1rem 1.15rem 1.15rem; display: flex; flex-direction: column; flex: 1; }
.tp-lcard h3 { font-family: 'Noto Serif SC', serif; font-weight: 700; font-size: 1.02rem; color: #1E3A2E; }
.tp-lcard:hover h3 { color: #A63D2F; }
.tp-lcard .lead { font-size: .76rem; line-height: 1.8; color: rgba(30,58,46,.55); margin-top: .4rem; }
.tp-lcard .arts { margin-top: .8rem; padding-top: .7rem; border-top: 1px dashed rgba(30,58,46,.14); }
.tp-lcard .arts li { position: relative; padding-left: .8rem; font-size: .74rem; line-height: 1.9; color: rgba(30,58,46,.62); list-style: none; }
.tp-lcard .arts li::before { content: ''; position: absolute; left: 0; top: .74rem; width: 4px; height: 4px; border-radius: 99px; background: #C9A45C; }
.tp-lcard .foot { margin-top: auto; padding-top: .85rem; display: flex; align-items: center; justify-content: space-between; font-size: .72rem; color: rgba(30,58,46,.42); }
.tp-lcard .foot .go { color: #5C7A66; }
.tp-lcard:hover .foot .go { color: #A63D2F; }

/* 专题库侧栏索引：分组 */
.tp-idxgroup + .tp-idxgroup { margin-top: .9rem; padding-top: .8rem; border-top: 1px dashed rgba(30,58,46,.14); }
.tp-idxgroup .gt { font-size: .68rem; letter-spacing: .16em; color: rgba(30,58,46,.4); padding: 0 .7rem .35rem; }

/* ---------- 专题库：列表形态（topic-list.html） ----------
   .tl-wrap 一个分组一张表；.tl-head 表头；.tl-row 一行一个专题
   行上带 data-group / data-upd / data-hot / data-n 供筛选排序
   列：序号 | 缩略图 | 专题名+说明 | 分类 | 规模 | 热度 | 更新 | 箭头
------------------------------------------------------ */
.tl-wrap { border-radius: 1.25rem; background: rgba(255,255,255,.55); border: 1px solid rgba(30,58,46,.09); overflow: hidden; }
.tl-head, .tl-row { display: grid; grid-template-columns: 2.4rem 76px minmax(0,1fr) 80px 76px 96px 96px; align-items: center; gap: .85rem; padding: .6rem 1rem; }
.tl-head { font-size: .68rem; letter-spacing: .14em; color: rgba(30,58,46,.42); background: rgba(239,232,216,.55); border-bottom: 1px solid rgba(30,58,46,.1); }
.tl-row { text-decoration: none; border-bottom: 1px dashed rgba(30,58,46,.1); transition: background .3s, transform .3s; }
.tl-row:last-child { border-bottom: 0; }
.tl-row:hover { background: rgba(255,255,255,.92); transform: translateX(3px); }
.tl-no { font-family: 'Noto Serif SC', serif; font-size: .8rem; font-weight: 700; color: rgba(30,58,46,.32); }
.tl-thumb { width: 76px; height: 52px; object-fit: cover; border-radius: .45rem; background: #E4E0D2; }
.tl-name { display: block; font-family: 'Noto Serif SC', serif; font-size: .94rem; font-weight: 600; color: #1E3A2E; }
.tl-row:hover .tl-name { color: #A63D2F; }
.tl-desc { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; font-size: .72rem; line-height: 1.6; color: rgba(30,58,46,.48); margin-top: .18rem; }
.tl-pill { font-size: .68rem; padding: .18rem .5rem; border-radius: .35rem; background: rgba(30,58,46,.07); color: rgba(30,58,46,.55); white-space: nowrap; }
.tl-pill.hl { background: #1E3A2E; color: #E4C98A; }
.tl-head span:nth-child(n+4) { text-align: center; }
.tl-cat, .tl-n, .tl-hot, .tl-upd { justify-self: center; }
.tl-n, .tl-upd { display: inline-flex; align-items: center; gap: .22rem; font-size: .74rem; color: rgba(30,58,46,.5); white-space: nowrap; }
.tl-n i, .tl-upd i { font-style: normal; font-size: .88rem; }
.tl-hot { display: inline-flex; align-items: center; gap: .2rem; font-family: 'Noto Serif SC', serif; font-size: .74rem; font-weight: 600; color: rgba(166,61,47,.9); white-space: nowrap; }
.tl-hot i { font-style: normal; }
.hotup { display: inline-block; animation: hotup 1.8s ease-in-out infinite; }
@keyframes hotup { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
@media (prefers-reduced-motion: reduce) { .hotup { animation: none; } }
.tl-total { font-size: .74rem; color: rgba(30,58,46,.42); }

@media (max-width: 1023px) {
  .tl-head { display: none; }
  .tl-row { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; padding: .7rem .85rem; }
  .tl-no { display: none; }
  .tl-thumb { flex: 0 0 64px; width: 64px; height: 48px; }
  .tl-main { flex: 1 1 calc(100% - 76px); min-width: 0; }
  .tl-cat, .tl-n, .tl-hot, .tl-upd { font-size: .68rem; margin-top: .35rem; }
  .tl-cat { margin-left: 76px; }
  .tl-hot { margin-left: auto; }
  .tl-upd { margin-left: .15rem; }
}
@media (max-width: 639px) {
  .tl-desc { display: none; }
  .tl-main { flex: 1 1 calc(100% - 76px); }
  .tp-toolbar { padding: .55rem .65rem; gap: .4rem; }
  .tp-fbtn { padding: .3rem .68rem; font-size: .72rem; }
}