/* 天道星图 · 关系图 */
.tdn-wrap {
  position: relative; margin: 1.2rem 0 2rem; padding: 10px;
  border-radius: 18px; overflow: hidden;
  background: radial-gradient(circle at 50% 45%, #16224a 0%, #080d1c 60%, #04060f 100%);
  box-shadow: 0 0 0 1px rgba(120,160,255,.18), 0 18px 60px -18px rgba(30,60,160,.75),
              inset 0 0 90px rgba(60,110,255,.08);
}
.tdn-svg { display: block; width: 100%; height: auto; }
.tdn-node { transition: opacity .25s; }

.tdn-chips { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center;
  padding: 8px 8px 4px; position: relative; z-index: 2; }
.tdn-toggles { padding: 6px 8px 12px; }
.tdn-chip {
  font: 500 12.5px/1.45 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #b9c9e8; background: rgba(120,160,255,.09);
  border: 1px solid rgba(120,160,255,.26); border-radius: 999px;
  padding: 4px 11px; cursor: pointer; letter-spacing: .04em;
  transition: all .2s;
}
.tdn-chip:hover { color: #eaf1ff; border-color: rgba(150,190,255,.6);
  background: rgba(120,160,255,.2); transform: translateY(-1px); }
.tdn-chip.on { color: #06122b; font-weight: 700;
  background: linear-gradient(135deg, #9ec5ff, #d9b8ff);
  border-color: transparent; box-shadow: 0 0 16px rgba(150,190,255,.55); }

.tdn-note { font-size: .84em; color: #7f8fb0; text-align: center; margin: -.4rem 0 1.4rem; }
@media (max-width: 640px) {
  .tdn-chip { font-size: 12px; padding: 4px 10px; }
  .tdn-wrap { border-radius: 12px; }
}

/* 部图例 */
.tdn-legend { display: flex; flex-wrap: wrap; gap: 10px 22px; justify-content: center;
  margin: 0 0 10px; font-size: 13.5px; letter-spacing: .04em; }
.tdn-legend span { color: var(--c); display: inline-flex; align-items: center; gap: 7px; }
.tdn-legend span::before { content: ''; width: 10px; height: 10px; border-radius: 50%;
  background: var(--c); box-shadow: 0 0 10px var(--c); }

/* 信息栏 */
.tdn-readout { position: relative; z-index: 2; margin: 2px 12px 6px; padding: 9px 14px;
  min-height: 2.6em; border-radius: 10px; text-align: center; line-height: 1.7;
  font-size: 13.5px; color: #93a6c8;
  background: rgba(120,160,255,.06); border: 1px solid rgba(120,160,255,.14); }
.tdn-readout b { color: #dbe7ff; }
.tdn-tag { display: inline-block; margin: 2px 5px 0 0; padding: 1px 9px;
  border: 1px solid; border-radius: 999px; font-size: 12.5px; }

/* 天道星图页：内容栏加宽（其他页不受影响） */
.content.tdn-wide .markdown-section {
  --content-max-width: 86rem;
  max-width: calc(100% - 2rem);
}
@media (max-width: 900px) {
  .content.tdn-wide .markdown-section { --content-max-width: 100%; }
}

/* ===== 点节点 → 右侧抽屉 ===== */
.tdn-drawer { position: absolute; inset: 0; z-index: 20; pointer-events: none; }
.tdn-drawer.open { pointer-events: auto; }
.tdn-mask { position: absolute; inset: 0; background: rgba(3,6,15,.62);
  opacity: 0; transition: opacity .28s; backdrop-filter: blur(2px); }
.tdn-drawer.open .tdn-mask { opacity: 1; }
.tdn-panel { position: absolute; top: 0; right: 0; height: 100%; width: min(520px, 88%);
  display: flex; flex-direction: column; overflow-y: auto;
  background: linear-gradient(180deg, #0d1631 0%, #080d1c 100%);
  border-left: 1px solid rgba(120,160,255,.22);
  box-shadow: -24px 0 60px -20px rgba(0,0,0,.9);
  transform: translateX(102%); transition: transform .3s cubic-bezier(.22,.61,.36,1); }
.tdn-drawer.open .tdn-panel { transform: none; }

.tdn-x { position: absolute; top: 12px; right: 14px; width: 32px; height: 32px;
  font-size: 20px; line-height: 1; color: #9fb3d6; cursor: pointer;
  background: rgba(120,160,255,.1); border: 1px solid rgba(120,160,255,.25);
  border-radius: 50%; transition: .2s; }
.tdn-x:hover { color: #fff; background: rgba(120,160,255,.28); }

.tdn-panel-head { padding: 20px 22px 14px; border-bottom: 1px solid rgba(120,160,255,.14); }
.tdn-panel-head h3 { margin: 8px 0 6px; font-size: 19px; color: #eaf1ff; line-height: 1.45; }
.tdn-badge { display: inline-block; padding: 2px 11px; border-radius: 999px; font-size: 12.5px;
  color: var(--c); border: 1px solid var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); }
.tdn-meta { margin: 0; font-size: 12.5px; color: #8195b8; line-height: 1.9; }
.tdn-panel-body { padding: 16px 22px 28px; font-size: 14px; }
.tdn-panel-body h4 { margin: 18px 0 10px; font-size: 13px; letter-spacing: .12em;
  color: #7f93b8; font-weight: 600; }
.tdn-panel-body h4:first-child { margin-top: 0; }

.tdn-verses { margin: 0; padding: 0; list-style: none; counter-reset: v; }
.tdn-verses li { counter-increment: v; position: relative; padding: 7px 0 7px 30px;
  border-bottom: 1px dashed rgba(120,160,255,.1); line-height: 1.85; color: #cfdcf5; }
.tdn-verses li::before { content: counter(v); position: absolute; left: 0; top: 8px;
  width: 19px; height: 19px; border-radius: 50%; font-size: 11px; text-align: center;
  line-height: 19px; color: #7f93b8; background: rgba(120,160,255,.12); }
.tdn-ch { color: #8fb4ff; text-decoration: none; font-size: .88em; padding: 0 1px;
  border-bottom: 1px dotted rgba(143,180,255,.5); }
.tdn-ch:hover { color: #cfe0ff; border-bottom-style: solid; }

.tdn-rel-row { margin-bottom: 9px; }
.tdn-rel-k { display: inline-block; min-width: 84px; font-size: 12.5px; color: #7f93b8; vertical-align: middle; }
.tdn-jump { font: inherit; font-size: 12.5px; color: var(--c); cursor: pointer;
  background: color-mix(in srgb, var(--c) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--c) 45%, transparent);
  border-radius: 999px; padding: 3px 11px; margin: 2px 5px 2px 0; transition: .18s; }
.tdn-jump:hover { background: color-mix(in srgb, var(--c) 24%, transparent); transform: translateY(-1px); }
.tdn-jump i { font-style: normal; opacity: .7; font-size: .9em; }
.tdn-none { color: #4d5c78; }
.tdn-loading { color: #7f93b8; }
.tdn-goto { display: inline-block; margin-top: 22px; padding: 9px 18px; border-radius: 999px;
  font-size: 13px; color: #06122b; text-decoration: none; font-weight: 700;
  background: linear-gradient(135deg, #9ec5ff, #d9b8ff); }
.tdn-node { transition: opacity .25s; }
@media (max-width: 700px) {
  .tdn-panel { width: 100%; }
  .tdn-rel-k { min-width: auto; display: block; margin-bottom: 3px; }
}

.tdn-sub { margin: 16px 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .04em;
  color: #a9c2ee; padding-left: 10px; border-left: 3px solid rgba(143,180,255,.55); }
.tdn-sep { color: #3f4d68; margin: 0 3px; }

/* ===== 评说 ===== */
.tdn-ps { margin: 0; padding: 2px 0 2px 14px; border-left: 3px solid rgba(143,180,255,.5);
  color: #bdcbe6; line-height: 1.95; }
.tdn-ps p { margin: 0 0 11px; }
.tdn-ps p:last-child { margin-bottom: 0; }

/* ===== 独立全屏页 ===== */
html.tdn-html { height: 100%; }   /* 不用 :has()，兼容老版微信 WebView */
body.tdn-standalone { margin: 0; height: 100vh; overflow: hidden; background: #04060f; }
body.tdn-standalone .tdn-wrap {
  position: fixed; inset: 0; margin: 0; padding: 0; border-radius: 0;
  display: flex; flex-direction: column;
}
body.tdn-standalone .tdn-stage {
  flex: 1 1 auto; min-height: 0; display: block; position: relative;
}
body.tdn-standalone .tdn-stage .tdn-svg {
  display: block; width: 100%; height: 100%;
}
body.tdn-standalone .tdn-chips { padding: 10px 12px 3px; }
body.tdn-standalone .tdn-legend { padding: 0 12px 5px; }
body.tdn-standalone .tdn-readout {
  position: absolute; left: 50%; bottom: 58px; transform: translateX(-50%);
  width: min(1080px, calc(100% - 320px)); margin: 0; z-index: 12;
  backdrop-filter: blur(8px); background: rgba(9,14,32,.82);
}
body.tdn-standalone .tdn-toggles { padding: 4px 12px 10px; }
@media (max-height: 700px) {
  body.tdn-standalone .tdn-chips { padding-top: 6px; }
  body.tdn-standalone .tdn-readout { display: none; }
}

/* 紧凑模式：手机横屏（矮视口）或竖屏旋转后启用。
   由 JS 统一加 body.tdn-compact —— 因为媒体查询看视口，
   而竖屏旋转后的框是「竖屏视口」尺寸，媒体查询判断不到。 */
body.tdn-compact .tdn-chips {
  flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start;
  padding: 5px 10px 2px; gap: 4px; scrollbar-width: none;
}
body.tdn-compact .tdn-chips::-webkit-scrollbar { display: none; }
body.tdn-compact .tdn-chip { font-size: 11px; padding: 3px 9px; white-space: nowrap; }
body.tdn-compact .tdn-legend {
  flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start;
  gap: 2px 10px; font-size: 11px; padding: 1px 10px 3px; scrollbar-width: none;
}
body.tdn-compact .tdn-legend::-webkit-scrollbar { display: none; }
body.tdn-compact .tdn-legend .tdn-title { font-size: 12px; padding-right: 10px; }
body.tdn-compact .tdn-leg b { font-size: 12px; }
body.tdn-compact .tdn-toggles { padding: 3px 10px 6px; }
body.tdn-compact .tdn-readout { display: none; }

.tdn-back { position: fixed; left: 18px; bottom: 16px; z-index: 30;
  font: 500 13px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #8fa3c6; text-decoration: none; padding: 8px 14px; border-radius: 999px;
  background: rgba(120,160,255,.08); border: 1px solid rgba(120,160,255,.2); transition: .2s; }
.tdn-back:hover { color: #dbe7ff; background: rgba(120,160,255,.2); }
/* 题名（并入图例行，左端） */
.tdn-legend .tdn-title {
  font: 700 15px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .16em; color: #dce8ff; padding-right: 20px; margin-right: 4px;
  border-right: 1px solid rgba(120,160,255,.24); }
/* 可点的图例项 */
.tdn-leg {
  font: 500 12.5px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  display: inline-flex; align-items: baseline; gap: 5px; cursor: pointer;
  color: var(--c); background: transparent; padding: 4px 9px; border-radius: 999px;
  border: 1px solid transparent; transition: .18s; }
.tdn-leg b { font-size: 15px; }
.tdn-leg i { font-style: normal; opacity: .42; font-size: 11px; }
.tdn-leg:hover { background: color-mix(in srgb, var(--c) 14%, transparent);
  border-color: color-mix(in srgb, var(--c) 40%, transparent); }
.tdn-leg.on { color: #06122b; background: var(--c); border-color: transparent;
  box-shadow: 0 0 16px color-mix(in srgb, var(--c) 70%, transparent); }
.tdn-leg.on i { opacity: .6; }
@media (max-width: 1180px) { .tdn-legend .tdn-title { display: none; } }

/* 部图例（全屏页横排） */
.tdn-legend { display: flex; flex-wrap: wrap; gap: 3px 6px; justify-content: center;
  align-items: center; font-size: 12.5px; letter-spacing: .04em; padding: 2px 12px 6px; }
.tdn-leg::before { content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--c); box-shadow: 0 0 8px var(--c); align-self: center; }

/* 复位键：与普通核心词区分 */
.tdn-chip.tdn-all { color: #a9c2ee; border-style: dashed;
  border-color: rgba(150,190,255,.42); background: rgba(120,160,255,.05); }
.tdn-chip.tdn-all:hover { border-style: solid; color: #eaf1ff; }
.tdn-chip.tdn-all.on { color: #06122b; border-style: solid;
  background: linear-gradient(135deg, #9ec5ff, #d9b8ff); }

/* ===== 竖屏手机：一键横屏（CSS 旋转，兼容 iOS／微信） =====
   按钮样式对齐主流手机站：右下角、毛玻璃胶囊、图标＋短标签、
   含 iPhone 安全区内边距；只在竖屏出现。
   按钮在 .tdn-wrap 之外，故旋转时它自身不转，始终停在屏幕右下。 */
.tdn-rot { display: none; }
@media (orientation: portrait) {
  .tdn-rot {
    display: inline-flex; align-items: center; justify-content: center;
    position: fixed; z-index: 60;
    right: 16px;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    width: 44px; height: 44px;            /* 主流触控尺寸 */
    padding: 0; border: 0; border-radius: 50%; cursor: pointer;
    color: #eaf1ff;
    background: rgba(38,52,86,.90);       /* 页面底色近黑，按钮须明显更亮 */
    box-shadow: 0 8px 24px -6px rgba(0,0,0,.7),
                0 0 20px -8px rgba(96,148,255,.95),
                inset 0 0 0 1px rgba(150,190,255,.30);
    -webkit-backdrop-filter: blur(14px) saturate(1.4);
    backdrop-filter: blur(14px) saturate(1.4);
    transition: transform .16s ease, background .16s ease;
    -webkit-tap-highlight-color: transparent;
  }
  .tdn-rot:active { transform: scale(.92); background: rgba(58,78,124,.95); }
  .tdn-rot svg { width: 21px; height: 21px; display: block; }
  .tdn-rot .i-port { display: none; }                       /* 未旋转 → 显示横屏图标 */
  body.tdn-rot-on .tdn-rot .i-land { display: none; }       /* 已旋转 → 显示竖屏图标 */
  body.tdn-rot-on .tdn-rot .i-port { display: block; }
}

/* 旋转本体：仅在竖屏启用。
   手机若未锁方向，用户转过去后浏览器报横屏，此规则自动失效，不会双重旋转。 */
@media (orientation: portrait) {
  body.tdn-rot-on .tdn-wrap {
    inset: auto;                 /* 清掉基类的 inset: 0 */
    position: fixed;
    top: 50%; left: 50%;
    width: 100vh; height: 100vw;
    transform: translate(-50%, -50%) rotate(90deg);
    transform-origin: center center;
  }
}
body.tdn-rot-on { overflow: hidden; }

/* ===== 窄屏（手机竖屏、未旋转）底部整理 =====
   竖屏底部同时有：返回链接（左下）、开关组（居中）、横屏按钮（右下），
   390px 宽会互相压。给开关组留出下方空间，并把评说框撑满。 */
@media (max-width: 780px) {
  body.tdn-standalone:not(.tdn-compact) .tdn-toggles { padding-bottom: 56px; }
  body.tdn-standalone .tdn-readout {
    width: calc(100% - 28px);
    bottom: 104px;
    font-size: 12.5px; line-height: 1.75;
  }
  .tdn-back { font-size: 12px; padding: 6px 12px; }
}

/* 抽屉打开时收起横屏按钮。
   窄屏下 .tdn-panel 满宽、关闭键 .tdn-x 在面板右上角；
   旋转后它与固定定位的横屏按钮落在同一角，会互相掩盖。
   抽屉是阅读态，此时本就不需要横竖屏切换。 */
body.tdn-drawer-open .tdn-rot { opacity: 0; pointer-events: none; transform: scale(.88); }

/* ===== 星图动画 =====
   只在少数整层元素上做动画（不是逐个星点），避免移动端掉帧。 */
@keyframes tdn-twinkle { 0%, 100% { opacity: .62 } 50% { opacity: 1 } }
@keyframes tdn-spin { from { transform: rotate(0deg) } to { transform: rotate(360deg) } }
@keyframes tdn-breathe {
  0%, 100% { opacity: .88; }
  50%      { opacity: 1; }
}
.tdn-tw-1 { animation: tdn-twinkle 7.5s ease-in-out infinite; }
.tdn-tw-2 { animation: tdn-twinkle 5.2s ease-in-out infinite .9s; }
.tdn-tw-3 { animation: tdn-twinkle 3.6s ease-in-out infinite .4s; }
.tdn-tw-4 { animation: tdn-twinkle 4.8s ease-in-out infinite 1.3s; }
/* 中央光芒：以 viewBox 中心为轴缓慢自转 */
.tdn-rays {
  transform-box: view-box; transform-origin: 50% 50%;
  animation: tdn-spin 200s linear infinite;
}
.tdn-core { animation: tdn-breathe 9s ease-in-out infinite; }
.tdn-neb  { animation: tdn-breathe 26s ease-in-out infinite; }
/* 尊重系统的「减弱动态效果」 */
@media (prefers-reduced-motion: reduce) {
  .tdn-stars, .tdn-rays, .tdn-core, .tdn-neb, .tdn-node { animation: none !important; }
}

/* ===== 星等：平时收敛，交互时点亮 =====
   --star 由 JS 按「连接度」写入（0.42 最暗 ~ 1.0 最亮）。
   星芒与白热核心也一起随星等收放，整颗星明暗一致。
   半径编码句数、亮度编码连接度，两个通道信息不重复。 */
.tdn-node .tdn-corona { opacity: calc(var(--star, 1) * .48); transition: opacity .22s ease; }
.tdn-node .tdn-spike  { opacity: calc(var(--star, 1) * .30); transition: opacity .22s ease; }
.tdn-node .tdn-hot    { opacity: calc(.5 + var(--star, 1) * .5); transition: opacity .22s ease; }
.tdn-node:hover .tdn-corona,
.tdn-node.tdn-on .tdn-corona { opacity: var(--star, 1); }
.tdn-node:hover .tdn-spike,
.tdn-node.tdn-on .tdn-spike  { opacity: calc(var(--star, 1) * .78); }
.tdn-node:hover .tdn-hot,
.tdn-node.tdn-on .tdn-hot    { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .tdn-node .tdn-corona, .tdn-node .tdn-spike, .tdn-node .tdn-hot { transition: none; }
}

/* ===== 涟漪：悬停中央「道」，四环由内向外亮起，再返回 =====
   道生一，一生二，二生三，三生万物 —— 向外
   大曰逝，逝曰远，远曰反       —— 折返
   周行而不殆                   —— 悬停期间循环不息
   装饰元素一律不接收指针事件，只有 .tdn-core-hit 可命中，
   否则中央的大光晕会盖住最内环的 A1 节点。 */
.tdn-core > * { pointer-events: none; }
.tdn-core .tdn-core-hit { pointer-events: all; cursor: pointer; }

@keyframes tdn-ripple {
  0%   { stroke-opacity: .26; stroke-width: 1.4; }
  5%   { stroke-opacity: 1;   stroke-width: 3.4; }
  21%  { stroke-opacity: .26; stroke-width: 1.4; }
  100% { stroke-opacity: .26; stroke-width: 1.4; }
}
.tdn-svg.tdn-rippling .tdn-ring {
  animation: tdn-ripple 3.6s ease-in-out infinite, tdn-ripple 3.6s ease-in-out infinite;
}
.tdn-svg.tdn-rippling .tdn-ring-0 { animation-delay: 0s,    2.40s; }
.tdn-svg.tdn-rippling .tdn-ring-1 { animation-delay: .28s,  2.12s; }
.tdn-svg.tdn-rippling .tdn-ring-2 { animation-delay: .56s,  1.84s; }
.tdn-svg.tdn-rippling .tdn-ring-3 { animation-delay: .84s,  1.56s; }
/* 涟漪期间中央的细环略亮，作为反馈 */
.tdn-svg.tdn-rippling .tdn-core circle:nth-child(5) { stroke-opacity: .62; }
@media (prefers-reduced-motion: reduce) {
  .tdn-svg.tdn-rippling .tdn-ring { animation: none; }
}

/* ===== 原文浮文：悬停中央「道」，在其正下方淡入 =====
   刻意不用浏览器原生 title（系统方框，与星空/大道不搭）。
   无边框、无底色、衬线体、字距拉开；靠文字阴影在星野上保持可读。 */
.tdn-verse {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, var(--tip-y, 64px));
  width: max-content; max-width: 84%;
  text-align: center; pointer-events: none;
  font-family: "Songti SC", "STSong", "Source Han Serif SC", "Noto Serif SC", Georgia, serif;
  font-size: 15px; line-height: 2.25; letter-spacing: .26em; text-indent: .26em;
  color: #dbe7ff;
  text-shadow: 0 0 6px rgba(3,6,15,.98), 0 0 18px rgba(3,6,15,.96), 0 0 44px rgba(3,6,15,.92);
}
/* 自「道」垂下的一根细线，把浮文与中心连起来 */
.tdn-verse .rule {
  display: block; width: 1px; height: 18px; margin: 0 auto 12px;
  background: linear-gradient(180deg, rgba(207,224,255,0), rgba(207,224,255,.5));
  opacity: 0; transition: opacity .7s ease;
}
.tdn-verse span {
  display: block; white-space: nowrap;
  opacity: 0; transform: translateY(7px);
  transition: opacity .8s ease, transform .8s ease;
}
.tdn-verse.on .rule { opacity: 1; }
.tdn-verse.on span { opacity: 1; transform: none; }
.tdn-verse.on span:nth-of-type(1) { transition-delay: .10s; }
.tdn-verse.on span:nth-of-type(2) { transition-delay: .28s; }
.tdn-verse.on span:nth-of-type(3) { transition-delay: .46s; }
@media (max-width: 780px) {
  .tdn-verse { font-size: 13px; letter-spacing: .18em; text-indent: .18em; line-height: 2.05; }
}
@media (prefers-reduced-motion: reduce) {
  .tdn-verse, .tdn-verse span, .tdn-verse .rule { transition: none; }
}

/* ===== 悬停中央「道」：让图安静下来 =====
   浮文落在「道」正下方，那个位置正好压着 B 环节点的标签。
   与其把浮文做成一个框，不如让万物退隐——这也正是「玄之又玄」的意思。 */
.tdn-node text { transition: opacity .55s ease; }
.tdn-svg.tdn-focus .tdn-node text { opacity: .16; }
.tdn-svg.tdn-focus [data-rad],
.tdn-svg.tdn-focus [data-rad-glow] { stroke-opacity: .05; }
.tdn-svg.tdn-focus .tdn-neb { opacity: .5; }
.tdn-svg.tdn-focus .tdn-stars { opacity: .62; }
/* 浮文本身再收一点，落进「渊」的边缘之内 */
.tdn-svg.tdn-focus ~ .tdn-verse,
.tdn-verse.on { letter-spacing: .24em; }

/* 悬停「道」时，节点星也一并收紧（标签已淡，光晕若全亮仍会从字后透出） */
.tdn-svg.tdn-focus .tdn-corona { opacity: calc(var(--star, 1) * .16); }
.tdn-svg.tdn-focus .tdn-spike  { opacity: calc(var(--star, 1) * .10); }
.tdn-svg.tdn-focus .tdn-hot    { opacity: .30; }

/* 选中 A1「道生万物」（点中央，或选中含 A1 的一组）时，中央亮一档 */
.tdn-svg.tdn-core-on .tdn-core text { fill-opacity: 1; }
.tdn-svg.tdn-core-on .tdn-core circle { stroke-opacity: .72; }
.tdn-svg.tdn-core-on .tdn-core { filter: brightness(1.45); }

/* ===== 顶部分组选择：原贴住页面上端、字太小 ===== */
body.tdn-standalone:not(.tdn-compact) .tdn-legend {
  padding: 20px 18px 8px; gap: 12px 26px;
}
body.tdn-standalone:not(.tdn-compact) .tdn-legend .tdn-title { font-size: 17px; }
body.tdn-standalone:not(.tdn-compact) .tdn-leg { font-size: 14px; padding: 8px 16px; }
body.tdn-standalone:not(.tdn-compact) .tdn-leg i { font-size: 12px; opacity: .5; }
/* 窄屏（含横屏紧凑模式）略收，但不再贴顶 */
body.tdn-compact .tdn-legend { padding: 10px 12px 5px !important; }