/* 人物志整页：覆盖在长河之上的星夜长卷，左侧目录、右侧正文；右下角「译」开关。 */
.pp { position: fixed; inset: 0; z-index: 15; overflow-y: auto; overflow-x: hidden; background:
  radial-gradient(ellipse at 15% 0%, rgba(255, 160, 200, .12), transparent 50%),
  radial-gradient(ellipse at 90% 30%, rgba(110, 210, 205, .10), transparent 55%),
  radial-gradient(ellipse at 50% 100%, rgba(130, 140, 255, .14), transparent 60%),
  linear-gradient(180deg, #050818, #0a0f2b 40%, #0c0b26); color: var(--ink); scrollbar-color: rgba(243, 211, 138, .35) transparent; }
.pp[hidden] { display: none; }
.pp::before { content: ""; position: fixed; inset: 0; pointer-events: none; opacity: .5; background-image:
  radial-gradient(1px 1px at 30px 40px, #fff, transparent), radial-gradient(1px 1px at 150px 90px, #ffe9b8, transparent),
  radial-gradient(1.4px 1.4px at 260px 180px, #dfe6ff, transparent), radial-gradient(1px 1px at 340px 60px, #fff, transparent);
  background-size: 380px 260px; }
.pp-wrap { position: relative; max-width: 1180px; margin: 0 auto; padding: 22px clamp(16px, 3vw, 40px) 120px; }
.pp-back { font-family: var(--kai); font-size: 16px; color: var(--ink-2); background: rgba(14, 20, 52, .7); border: 1px solid rgba(243, 211, 138, .3); border-radius: 999px; padding: 4px 16px; cursor: pointer; }
.pp-back:hover { color: var(--gold); border-color: var(--gold); }

.pp-hero { display: flex; gap: clamp(18px, 4vw, 48px); align-items: flex-end; flex-wrap: wrap; margin: 26px 0 30px; padding-bottom: 22px; border-bottom: 1px solid rgba(243, 211, 138, .2); }
.pp-portrait { margin: 0; width: clamp(130px, 18vw, 200px); display: grid; gap: 6px; }
.pp-portrait img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; border-radius: 4px; border: 1px solid rgba(243, 211, 138, .3); box-shadow: 0 0 40px rgba(243, 211, 138, .18); }
.pp-portrait figcaption { font-size: 11px; color: var(--ink-3); text-align: center; }
.pp-title h1 { margin: 0; font-family: var(--brush); font-weight: 400; font-size: clamp(64px, 10vw, 128px); line-height: .9; letter-spacing: .04em;
  background: linear-gradient(100deg, #fff6dc, var(--gold) 45%, #ffc6d6); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 24px rgba(243, 211, 138, .4)); padding-right: .1em; }
.pp-al { margin: 10px 0 0; font-family: var(--kai); font-size: 18px; color: var(--ink-2); letter-spacing: .08em; }
.pp-meta { margin: 6px 0 0; font-size: 15px; color: var(--ink); }
.pp-life { margin: 6px 0 0; font-size: 15px; color: var(--gold); font-variant-numeric: tabular-nums; }
.pp-life span { margin-left: 12px; color: var(--ink-3); font-size: 13px; }
.pp-tier { margin: 6px 0 0; font-size: 12px; color: var(--ink-3); }

.pp-body { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 36px; align-items: start; }
.pp-toc { position: sticky; top: 16px; display: grid; gap: 2px; padding-left: 10px; border-left: 1px solid rgba(243, 211, 138, .2); }
.pp-toc a { font-family: var(--kai); font-size: 16px; color: var(--ink-3); text-decoration: none; padding: 5px 8px; border-radius: 4px; letter-spacing: .1em; }
.pp-toc a:hover { color: var(--ink); }
.pp-toc a.on { color: var(--gold); text-shadow: 0 0 10px rgba(243, 211, 138, .6); background: rgba(243, 211, 138, .06); }
.pp-main { min-width: 0; }
.pp-main section { margin: 0 0 46px; scroll-margin-top: 16px; }
.pp-main h2 { margin: 0 0 14px; font-family: var(--kai); font-weight: 400; font-size: 28px; letter-spacing: .14em; color: #f6e7c4; display: flex; align-items: center; gap: 12px; }
.pp-main h2::before { content: ""; width: 8px; height: 8px; transform: rotate(45deg); background: var(--gold); box-shadow: 0 0 10px 2px rgba(243, 211, 138, .7); }
.pp-main h4 { margin: 22px 0 10px; font-family: var(--kai); font-weight: 400; font-size: 19px; color: #f6e7c4; }
.pp-main h4 small { font-family: var(--serif); font-size: 12px; color: var(--ink-3); margin-left: 8px; }
.pp-main p { font-size: 16px; line-height: 2; text-align: justify; margin: 0 0 12px; max-width: 46em; }
.pp-empty { color: var(--ink-3); font-size: 14px !important; }
.pp-sub { margin: 4px 0 8px; border-top: 1px dashed rgba(139, 138, 171, .25); }
.pp-sub summary { cursor: pointer; padding: 10px 0; font-family: var(--kai); font-size: 19px; color: var(--ink-2); list-style: none; }
.pp-sub summary::before { content: "▸ "; color: var(--gold); }
.pp-sub[open] summary::before { content: "▾ "; }

/* 时间轴 */
.tl { width: 100%; height: auto; overflow: visible; margin: 6px 0 12px; }
.tl-axis { stroke: rgba(243, 211, 138, .45); stroke-width: 1.4; }
.tl-ten { fill: rgba(185, 166, 255, .55); }
.tl-tick { stroke: rgba(201, 196, 220, .4); }
.tl-age, .tl-y { font-size: 11px; fill: var(--ink-3); font-family: var(--serif); }
.tl-y { fill: var(--gold); font-size: 12px; }
.tl-end { fill: #fff1c8; filter: drop-shadow(0 0 6px rgba(243, 211, 138, .9)); }
.tl-ev { cursor: pointer; } .tl-ev circle { fill: #e6ecff; filter: drop-shadow(0 0 5px rgba(200, 214, 255, .9)); }
.tl-ev text { font-size: 11px; fill: var(--ink-2); font-family: var(--serif); }
.tl-ev:hover text { fill: var(--gold); }
.pp-chips { display: flex; flex-wrap: wrap; gap: 6px 8px; }
.pp-chips button, .pp-chips span { font: inherit; font-size: 13.5px; color: var(--ink); background: rgba(20, 28, 70, .5); border: 1px solid rgba(243, 211, 138, .2); border-radius: 999px; padding: 4px 12px; cursor: pointer; }
.pp-chips button:hover { border-color: var(--gold); color: var(--gold); }
.pp-chips small { color: var(--ink-3); margin-left: 6px; font-size: 11.5px; }
.pp-mentions { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 14px; max-height: 420px; overflow: auto; padding-right: 6px; }
.pp-mentions button { text-align: left; font: inherit; background: none; border: 0; border-bottom: 1px dashed rgba(139, 138, 171, .3); padding: 6px 2px; cursor: pointer; color: var(--ink-2); display: grid; gap: 2px; }
.pp-mentions button:hover { color: var(--ink); }
.pp-mentions b { font-family: var(--kai); color: var(--gold); font-weight: 400; }
.pp-mentions span { font-size: 13px; line-height: 1.6; }

/* 本传：原文与译文成对 */
.pp-bt { border: 1px solid rgba(243, 211, 138, .16); border-radius: 6px; margin: 10px 0; background: rgba(12, 17, 44, .55); }
.pp-bt summary { cursor: pointer; padding: 12px 16px; font-family: var(--kai); font-size: 20px; color: #f6e7c4; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; list-style: none; }
.pp-bt summary small { font-family: var(--serif); font-size: 12.5px; color: var(--ink-3); }
.pp-ext { margin-left: auto; font-family: var(--serif); font-size: 12.5px; color: var(--ink-2); }
.pp-bt-body { padding: 0 18px 16px; }
.pp-pair { margin: 0 0 16px; padding-left: 12px; border-left: 2px solid transparent; }
.pp-pair.hit { border-left-color: rgba(243, 211, 138, .55); }
.pp-pair .o, .pp-lun .o, .pp-idiom .o { font-size: 17px !important; line-height: 2.05 !important; color: var(--ink); margin: 0 0 4px !important; letter-spacing: .02em; }
.pp-pair .tr, .pp-lun .tr { font-size: 14.5px !important; line-height: 1.9 !important; color: var(--ink-2); margin: 0 !important; padding: 6px 12px; background: rgba(243, 211, 138, .05); border-radius: 4px; }
.pp-pair .tr small { display: block; font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.tr-off .tr { display: none; }
.pp-lun { margin: 0 0 18px; padding: 14px 18px; border-left: 3px solid var(--gold); background: rgba(243, 211, 138, .05); border-radius: 0 6px 6px 0; }
.pp-lun cite, .pp-idiom cite { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); margin-top: 6px; }
.pp-idiom { margin: 0 0 16px; } .pp-idiom b { font-family: var(--kai); font-size: 22px; color: var(--gold); }

/* 足迹地图 */
.pp-map { max-width: 900px; margin: 0 auto 10px; }
.pm { width: 100%; height: auto; max-height: 560px; display: block; background: radial-gradient(ellipse at 50% 50%, rgba(80, 90, 190, .16), transparent 70%); border-radius: 6px; }
.pm-base path { fill: none; stroke: rgba(243, 211, 138, .22); stroke-width: .8; vector-effect: non-scaling-stroke; }
.pm-leg { fill: none; stroke: #ffd98a; stroke-width: 1.6; vector-effect: non-scaling-stroke; stroke-dasharray: 6 5; opacity: .75; animation: pm-flow 2.4s linear infinite; }
@keyframes pm-flow { to { stroke-dashoffset: -22; } }
.pm-halo { fill: rgba(255, 220, 150, .18); } .pm-dot { fill: #fff3d0; } .pm-dot.first { fill: #86e8cf; } .pm-dot.last { fill: #ff9fb8; }
.pm-pt text { font-family: var(--kai); font-size: 11px; fill: #f5ecd6; paint-order: stroke; stroke: rgba(5, 8, 24, .9); stroke-width: 3px; }
.pm-pt { cursor: pointer; } .pm-pt.on .pm-halo { fill: rgba(255, 220, 150, .55); } .pm-pt.on text { fill: var(--gold); }
.pp-places { list-style: none; padding: 0; margin: 10px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 8px 18px; counter-reset: pl; }
.pp-places li { counter-increment: pl; padding: 8px 10px 8px 34px; position: relative; border-radius: 6px; border: 1px solid transparent; }
.pp-places li::before { content: counter(pl); position: absolute; left: 8px; top: 8px; font-family: var(--kai); color: var(--gold); }
.pp-places li.on { border-color: rgba(243, 211, 138, .4); background: rgba(243, 211, 138, .05); }
.pp-places b { font-family: var(--kai); font-size: 17px; font-weight: 400; color: #f6e7c4; }
.pp-places .m { margin-left: 8px; font-size: 12.5px; color: var(--ink-2); } .pp-places .y { margin-left: 8px; font-size: 12px; color: var(--gold); }
.pp-places p { font-size: 13.5px !important; line-height: 1.7 !important; margin: 4px 0 0 !important; }
.pp-places .o { color: var(--ink-3); font-size: 13px !important; }

/* 星盘 */
.pp-relbar { display: flex; gap: 6px; margin: -4px 0 10px; }
.pp-relbar button { font-family: var(--kai); font-size: 15px; color: var(--ink-3); background: none; border: 1px solid rgba(243, 211, 138, .25); border-radius: 999px; padding: 2px 14px; cursor: pointer; }
.pp-relbar button.on { color: var(--gold); border-color: var(--gold); box-shadow: 0 0 10px rgba(243, 211, 138, .3); }
.pp-wheel { position: relative; max-width: 780px; margin: 0 auto; }
.pp-3d .star3d { height: clamp(420px, 62vh, 640px); }
.sw { width: 100%; height: auto; display: block; overflow: visible; }
.sw-ring { fill: none; stroke-width: .8; stroke-opacity: .28; stroke-dasharray: 2 6; }
.sw-ring-l { font-family: var(--kai); font-size: 13px; opacity: .7; letter-spacing: .2em; }
.sw-outer { fill: none; stroke: rgba(243, 211, 138, .18); stroke-width: 1; stroke-dasharray: 1 14; }
.sw-spin { transform-origin: 400px 400px; animation: sw-spin 120s linear infinite; }
@keyframes sw-spin { to { transform: rotate(360deg); } }
.sw-link { fill: none; stroke-width: 1.1; stroke-opacity: .32; transition: stroke-opacity .25s, stroke-width .25s; }
.sw-link.derived { stroke-dasharray: 3 5; stroke-opacity: .2; }
.sw-flow { fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 10 300; stroke-opacity: .75; animation: sw-flow 3s linear infinite; pointer-events: none; filter: url(#sw-blur); }
@keyframes sw-flow { from { stroke-dashoffset: 310; } to { stroke-dashoffset: 0; } }
.sw.focusing .sw-link { stroke-opacity: .08; } .sw.focusing .sw-link.on { stroke-opacity: .95; stroke-width: 2; }
.sw-node { cursor: pointer; outline: none; }
.sw-name { font-family: var(--kai); font-size: 15px; fill: #f5ecd6; paint-order: stroke; stroke: rgba(5, 8, 24, .9); stroke-width: 3px; }
.sw-rel { font-family: var(--serif); font-size: 10.5px; paint-order: stroke; stroke: rgba(5, 8, 24, .9); stroke-width: 3px; }
.sw-node.ext .sw-name { fill: var(--ink-3); font-size: 13px; }
.sw-node:hover .sw-name, .sw-node:focus .sw-name { fill: var(--gold); }
.sw-center { font-family: var(--brush); font-size: 40px; fill: #fff6dc; paint-order: stroke; stroke: rgba(80, 50, 10, .35); stroke-width: 2px; }
.sw-pulse { animation: sw-pulse 3.4s ease-in-out infinite; transform-origin: 400px 400px; }
@keyframes sw-pulse { 50% { transform: scale(1.12); opacity: .8; } }
.sw-tip { position: absolute; transform: translate(-50%, -100%); pointer-events: none; background: rgba(11, 16, 41, .95); border: 1px solid rgba(243, 211, 138, .35); border-radius: 6px; padding: 6px 10px; font-size: 13px; color: var(--ink); white-space: nowrap; }
.sw-tip small { color: var(--ink-3); }
.sw-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; font-size: 12.5px !important; color: var(--ink-3); margin: 4px auto 0 !important; }
.sw-legend i { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 1px dashed; vertical-align: -2px; margin-right: 5px; opacity: .8; }
.sw-legend i.d { width: 18px; height: 0; border-radius: 0; border: 0; border-top: 1px dashed var(--ink-3); vertical-align: 4px; }
.sw-more { text-align: center; font-size: 12.5px !important; color: var(--ink-3); }
.pp-rellist { margin-top: 14px; }

/* 译文开关：右下角不起眼的小圆钮 */
.pp-trbtn { position: fixed; right: 18px; bottom: 18px; z-index: 16; width: 38px; height: 38px; border-radius: 50%; font-family: var(--kai); font-size: 17px; cursor: pointer;
  color: var(--ink-3); background: rgba(14, 20, 52, .75); border: 1px solid rgba(243, 211, 138, .25); opacity: .6; transition: opacity .2s; }
.pp-trbtn:hover { opacity: 1; }
.pp-trbtn[aria-pressed="true"] { color: var(--gold); border-color: rgba(243, 211, 138, .6); }

@media (max-width: 860px) {
  .pp-body { grid-template-columns: minmax(0, 1fr); }
  .pp-toc { position: sticky; top: 0; z-index: 2; display: flex; overflow-x: auto; border-left: 0; padding: 6px 0; background: rgba(5, 8, 24, .92); }
  .pp-toc a { white-space: nowrap; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { .sw-spin, .sw-flow, .sw-pulse { animation: none; } }

/* 人物志打开时，顶栏（标题与检索）浮在页面上方，可直接检索跳转到其他人物 */
body.pp-open header.top { position: fixed; top: 0; left: 0; right: 0; z-index: 17; padding-bottom: 10px; background: linear-gradient(180deg, rgba(5, 8, 24, .96), rgba(5, 8, 24, .82)); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid rgba(243, 211, 138, .12); }
body.pp-open header.top nav.levels { display: none; }
body.pp-open header.top .brand h1 { font-size: 34px; }
body.pp-open .pp-wrap { padding-top: 92px; }
body.pp-open .pp-toc { top: 92px; }
@media (max-width: 860px) { body.pp-open .pp-wrap { padding-top: 130px; } body.pp-open .pp-toc { top: 120px; } }

.pp-bt-all { font-family: var(--kai); font-size: 14px; color: var(--ink-2); background: none; border: 1px dashed rgba(243, 211, 138, .35); border-radius: 999px; padding: 4px 16px; cursor: pointer; margin: 4px 0 12px; }
.pp-bt-all:hover { color: var(--gold); border-color: var(--gold); }
.pp-bt-rest { opacity: .78; border-top: 1px dashed rgba(139, 138, 171, .3); padding-top: 8px; }