/* ─────────────────────────────────────────────────────────────────────
   影视圈业务关系档案 · 样式表

   外链而非内联。内联时这份 CSS 在 5655 个页面里各存一份 ——
   49.3 MB，占全站 74.6 MB 的 66%。那不只是浪费带宽，它还反过来
   锁死了设计：每加 1KB 就乘 5655，于是只能一直写没有余地的样式。

   设计读法：一个带薄门面的公开参考档案。两类读者 ——
   判断「值不值得谈」的平台方，和查人查戏的行业内人。
   语言取自它自己的世界：片尾字幕、刊物版记、发行许可证上的印章。

   三条锁：
   · 形状 —— 全直角。印刷目录没有圆角。
   · 色彩 —— 一个 accent（印章朱红），一个语义色（琥珀＝缺）。
   · 来源三档 —— **不用三个色相**。序数数据要映射到序数视觉变量
     （实心 → 描边 → 扁平）；三个色相读不出先后，只会读成三个类别。
   ───────────────────────────────────────────────────────────────────── */

:root{
  /* 冷中性纸。刻意避开 #F2F1ED 那一族暖奶油 —— 那是 AI 默认色，不是品牌资产。 */
  --bg:#F6F7F6; --surface:#FFFFFF; --surface-2:#EBEEEC;
  --ink:#14191A; --ink-2:#414B4C; --ink-3:#5D6768; --muted:#616A6A;
  --rule:#DBE0DE; --rule-hard:#B5BDBA;

  /* 唯一 accent：印章朱红。中国影视官方文件里唯一不装饰的颜色。 */
  --accent:#A8321F; --accent-ink:#FFFFFF;
  /* 唯一语义色：缺 / 待补。 */
  --missing:#8A5A16;
  /* 图上区分节点类别 —— 类别是名义数据，用色相是对的。 */
  --pine:#2C6B4C;

  --shadow:rgba(20,25,26,.07);
  --serif:"Songti SC","Source Han Serif SC","Noto Serif CJK SC","STSong",Georgia,serif;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --data:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0E1212; --surface:#161B1B; --surface-2:#1F2625;
    --ink:#E6EBE8; --ink-2:#B2BCBA; --ink-3:#8E9998; --muted:#939E9C;
    --rule:#28302F; --rule-hard:#3F4846;
    --accent:#E4715A; --accent-ink:#14191A;
    --missing:#C9974E; --pine:#6DB491;
    --shadow:rgba(0,0,0,.34);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0E1212; --surface:#161B1B; --surface-2:#1F2625;
  --ink:#E6EBE8; --ink-2:#B2BCBA; --ink-3:#8E9998; --muted:#939E9C;
  --rule:#28302F; --rule-hard:#3F4846;
  --accent:#E4715A; --accent-ink:#14191A;
  --missing:#C9974E; --pine:#6DB491;
  --shadow:rgba(0,0,0,.34);
  color-scheme:dark;
}

/* ── 基础 ─────────────────────────────────────────────────────────── */

*{box-sizing:border-box}
html{overflow-x:hidden;-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.72;
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;
}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
img,svg{max-width:100%}
p{margin:0 0 1.05em;max-width:68ch}

/* 显示层用宋体。这个站的核心是一本 1977 年创刊的杂志 ——
   宋体是中文报刊的本体，不是「衬线显得高级」。而且零下载。 */
h1,h2,h3{font-family:var(--serif);text-wrap:balance;letter-spacing:-.005em;font-weight:700}
h1{font-size:clamp(2.1rem,5.4vw,4.4rem);line-height:1.1;margin:.12em 0 .3em}
h2{font-size:clamp(1.38rem,3vw,2.05rem);line-height:1.3;margin:0 0 .5em}
h3{font-size:1.05rem;margin:0 0 .35em;font-family:var(--sans);font-weight:650}

/* 数据、标签、年份一律等宽，让数字能对齐成列 */
.eyebrow,.kicker,.source,.badge,.stat-label,.stat-sub,.meta,.tag,.index-no,
.mono,.breadcrumbs,.cnt,.num,.chips button,.chips a{font-family:var(--data)}

.wrap{width:min(1120px,calc(100% - 44px));margin-inline:auto}

/* ── 页眉 / 页脚 ──────────────────────────────────────────────────── */

.site-head{background:var(--ink);color:var(--bg);border-bottom:3px solid var(--accent)}
.site-head .wrap{display:flex;align-items:center;gap:20px;justify-content:space-between;
  padding:15px 0;flex-wrap:wrap}
.brand{font-family:var(--serif);font-weight:700;font-size:1.02rem;
  text-decoration:none;letter-spacing:.02em;white-space:nowrap}
.nav{display:flex;flex-wrap:wrap;gap:6px 16px}
.nav a{font-family:var(--data);font-size:.78rem;text-decoration:none;opacity:.82;
  transition:opacity .15s}
.nav a:hover{opacity:1;color:inherit;text-decoration:underline}
.site-foot{border-top:1px solid var(--rule);margin-top:56px;padding:26px 0 60px;
  color:var(--muted);font-size:.84rem}
.site-foot .wrap{display:flex;gap:12px 28px;justify-content:space-between;flex-wrap:wrap}

.breadcrumbs{font-size:11.5px;color:var(--muted);margin:20px 0 0;letter-spacing:.02em}
.breadcrumbs a{color:var(--ink-3)}

/* ── 首屏 ─────────────────────────────────────────────────────────── */

main{padding-bottom:40px}
.hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(230px,.5fr);
  gap:34px;padding:52px 0 40px;border-bottom:1px solid var(--rule);align-items:end}
.eyebrow{color:var(--accent);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  margin:0 0 .1em}
.lede{font-size:clamp(1.03rem,1.7vw,1.24rem);color:var(--ink-2);max-width:60ch;margin:0}
.hero-aside{align-self:end;padding:18px 20px;background:var(--surface);
  border:1px solid var(--rule);border-top:3px solid var(--ink)}
.hero-aside strong{display:block;font-family:var(--data);font-size:1.3rem;line-height:1.2}
.hero-aside p{margin:.4em 0 0;font-size:.86rem;color:var(--ink-2)}

section{margin-top:44px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;
  border-bottom:2px solid var(--ink);padding-bottom:9px;margin-bottom:18px;flex-wrap:wrap}
.section-head p{margin:0;color:var(--muted);font-size:.86rem}
.index-no{display:block;color:var(--accent);font-size:.72rem;margin-bottom:14px;
  letter-spacing:.1em}

/* ── 卡片与网格 ───────────────────────────────────────────────────── */

.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:var(--surface);border:1px solid var(--rule);padding:20px;min-width:0}
.card a.title{font-family:var(--serif);font-size:1.1rem;font-weight:700;
  text-decoration:none;display:inline-block;margin-bottom:.25em}
.card a.title:hover{color:var(--accent)}
.card p{color:var(--ink-2);margin:.35em 0 0;font-size:.92rem}
.card small{color:var(--muted);font-size:.82rem;line-height:1.6;display:block}
.card.big{grid-column:span 2;border-left:3px solid var(--accent)}

.relation{margin:22px 0;padding:13px 16px;background:var(--surface-2);
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:.9rem}
.relation a{font-weight:650}
.arrow{color:var(--accent)}
.tag{font-size:.72rem;color:var(--muted);letter-spacing:.06em}

/* ── 事实条目：档案的主体形态 ──────────────────────────────────────
   一条事实 = 陈述 + 出处。用左侧细线成组，而不是给每一行都加下划线 ——
   每行都画线是最偷懒的表格排版，读起来像栅栏。 */

.facts,.plain-list{list-style:none;padding:0;margin:0}
.fact{padding:11px 0 11px 15px;border-left:1px solid var(--rule);
  margin-bottom:2px;font-size:.95rem}
.fact:hover{border-left-color:var(--rule-hard)}
.fact.conflict{border-left:3px solid var(--missing);padding-left:14px}
.source{font-size:.75rem;color:var(--muted);text-decoration:none;white-space:nowrap}
.source:hover{color:var(--accent);text-decoration:underline}
.warn{display:block;color:var(--missing);margin-top:5px;line-height:1.55;font-size:.82rem}

/* .caveat 是关于**档案自身**的声明（哪里薄、哪里不收），
   不是关于世界的事实，所以不带出处、也不该套 .fact 的样式。
   守卫 ① 因此不会把它算作「无出处的事实」—— 这个区分是它逼出来的。 */
.caveats{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);
  margin:0}
.caveat{background:var(--surface);padding:14px 16px;font-size:.92rem;color:var(--ink-2)}
.caveat strong{color:var(--ink)}

/* ── 来源分档：明度阶梯，不是三个色相 ─────────────────────────────
   实心 = 第三方报道（最硬）→ 描边 = 自述 → 扁平灰 = 用户可编辑百科。
   读者不必记住色号，深浅本身就是强弱。 */

.badge{display:inline-block;font-size:.66rem;letter-spacing:.05em;padding:2px 7px;
  white-space:nowrap;vertical-align:.08em;margin-right:.35em;line-height:1.5}
.badge.third{background:var(--ink);color:var(--bg);border:1px solid var(--ink)}
.badge.self{background:transparent;color:var(--ink-2);border:1px solid var(--rule-hard)}
.badge.user-wiki{background:transparent;color:var(--muted);border:1px solid transparent;
  padding-left:0;padding-right:4px}
/* 「缺」不是来源档位，是另一个维度，所以用唯一的语义色。 */
.badge.pending{background:var(--missing);color:var(--surface);border:1px solid var(--missing)}
.badge.active{background:var(--pine);color:var(--surface);border:1px solid var(--pine)}

.active-bar,.missing-bar{padding:13px 16px;margin:18px 0;font-size:.92rem;
  border-left:3px solid}
.active-bar{background:var(--surface-2);border-left-color:var(--pine)}
.missing-bar{background:var(--surface-2);border-left-color:var(--missing);color:var(--ink-2)}

/* ── 名录与表格 ───────────────────────────────────────────────────── */

.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule)}
.person-row{background:var(--surface);padding:9px 12px;min-width:0}
.person-row a{font-weight:600;text-decoration:none;display:block;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.person-row a:hover{text-decoration:underline}
.person-row small{display:block;color:var(--muted);font-size:.72rem;
  font-family:var(--data);margin-top:1px}

.table-wrap,.code-wrap,.wide{overflow-x:auto;max-width:100%;
  border:1px solid var(--rule);background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:.9rem;min-width:520px}
th,td{text-align:left;padding:10px 13px;border-bottom:1px solid var(--rule);
  vertical-align:top}
th{background:var(--surface-2);font-weight:650;font-size:.78rem;white-space:nowrap;
  font-family:var(--data);letter-spacing:.04em;border-bottom:2px solid var(--rule-hard)}
tr:last-child td{border-bottom:none}
td.mono,td.num,.num{font-family:var(--data);white-space:nowrap}
td.num,.num{text-align:right}
.mono{font-size:.84rem;color:var(--ink-3)}
.year-block{margin:30px 0}

/* 剧组职员表：工种在左（等宽窄列），人名在右自由换行。
   这是路径 D「从导演摸到整个剧组」落地的地方，103 人也要读得清。 */
table.crew th{width:1%;white-space:nowrap;vertical-align:top;background:var(--surface);
  border-bottom:1px solid var(--rule);border-right:1px solid var(--rule);
  color:var(--ink-3);font-size:.76rem}
table.crew td{line-height:1.9}
.crew-names a,.crew-names span{margin-right:.7em;display:inline-block}
.crew-names a{text-decoration:none;border-bottom:1px solid var(--rule)}
.crew-names a:hover{border-bottom-color:var(--accent)}

/* 沿革时间线：年份成列，事件靠右。不给每行画线。 */
ol.timeline{list-style:none;padding:0;margin:0}
ol.timeline li{display:grid;grid-template-columns:minmax(84px,auto) 1fr;gap:0 18px;
  padding:11px 0;border-bottom:1px solid var(--rule)}
ol.timeline li:last-child{border-bottom:none}
ol.timeline time{font-family:var(--data);font-size:.8rem;color:var(--accent);
  padding-top:.18em;white-space:nowrap}
@media (max-width:560px){
  ol.timeline li{grid-template-columns:1fr;gap:3px}
}

/* ── 统计条 ───────────────────────────────────────────────────────── */

.stats,.empty-brief{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);margin:24px 0}
.stat{background:var(--surface);padding:15px 17px}
.stat b,.stat .num{display:block;font-family:var(--data);font-size:1.5rem;
  font-weight:600;line-height:1.15;text-align:left}
.stat-label{display:block;font-size:.74rem;color:var(--muted);margin-top:4px;
  letter-spacing:.04em}
.stat-sub{display:block;color:var(--muted);font-size:.7rem;margin-top:2px}

/* ── 关系图 ───────────────────────────────────────────────────────
   .nl/.bl/.cl 是节点标签，此前**完全没有样式** ——
   这就是「手机上标签约 3px 不可读」的原因：从来没人定过字号。
   SVG 里的 font-size 不随视口缩放，所以给最小可读值并让图横向滚动，
   而不是把整张图压进 375px。 */

.net{margin:0 0 30px;padding:0;overflow-x:auto;max-width:100%;
  border:1px solid var(--rule);background:var(--surface)}
.net svg{display:block;width:100%;height:auto;min-width:1000px}
.net figcaption{color:var(--muted);font-size:.82rem;padding:12px 16px;max-width:68ch;
  border-top:1px solid var(--rule)}
.nl,.bl,.cl{font-family:var(--sans);paint-order:stroke;
  stroke:var(--surface);stroke-width:3px;stroke-linejoin:round}
.nl{font-size:12px;fill:var(--ink-3)}
.bl{font-size:13.5px;fill:var(--ink);font-weight:600}
.cl{font-size:17px;fill:var(--accent);font-weight:700;font-family:var(--serif)}

/* ── 搜索 ─────────────────────────────────────────────────────────── */

.searchbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:6px 0 12px}
.searchbar input{flex:1 1 260px;min-width:0;padding:12px 14px;font-size:1rem;
  font-family:inherit;color:var(--ink);background:var(--surface);
  border:1px solid var(--rule-hard);border-radius:0}
.searchbar input::placeholder{color:var(--muted)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button,.chips a{font-size:.74rem;padding:6px 11px;background:var(--surface);
  color:var(--ink-2);border:1px solid var(--rule-hard);cursor:pointer;
  border-radius:0;transition:background .15s,color .15s}
.chips button:hover{border-color:var(--ink-3)}
.chips button[aria-pressed="true"]{background:var(--ink);color:var(--bg);
  border-color:var(--ink)}
.cnt{font-size:.78rem;color:var(--muted);margin:2px 0 14px}
.results{list-style:none;padding:0;margin:0;display:grid;gap:1px;
  background:var(--rule);border:1px solid var(--rule)}
.results li{background:var(--surface);padding:12px 15px}
.results li a{font-weight:650;text-decoration:none}
.results li a:hover{text-decoration:underline}
.results li small{display:block;color:var(--muted);font-size:.78rem;margin-top:3px}

/* ── 响应式：高 variance 的版式在窄屏一律塌成单列 ─────────────────── */

@media (max-width:860px){
  .grid{grid-template-columns:1fr}
  .grid.two{grid-template-columns:1fr}
  .card.big{grid-column:auto}
  .hero{grid-template-columns:1fr;gap:24px;padding:36px 0 30px}
  .hero-aside{align-self:start}
}
@media (max-width:560px){
  body{font-size:15.5px}
  /* SVG 里的字号活在 viewBox 坐标系里，会随图整体缩放：
     13.5px 的标签在 375px 屏上只剩 3.8px。图已改成横向滚动而不是压缩，
     这里再把坐标系内的字号提上去，让实际渲染回到 12px 上下。 */
  .bl{font-size:17px} .nl{font-size:15px} .cl{font-size:21px}
  .wrap{width:calc(100% - 32px)}
  .people-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .site-head .wrap{padding:12px 0;gap:10px}
  .nav{gap:5px 12px}
  .nav a{font-size:.74rem}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

@media print{
  .site-head,.nav,.searchbar,.chips{display:none}
  /* 打印用纯黑纯白是对的：这里是墨和纸，不是屏幕，
     屏幕上禁用纯值的理由（丢失层次）在纸上不成立。 */
  body{background:#fff;color:#000;font-size:11pt}
  .net svg{min-width:0}
}