/* 经济学知识图谱 · 沿用 apps.lijinpu.com 的配色与字体 */
:root{
  --bg:#F2F4F6; --surface:#FFFFFF; --surface-2:#F7F9FA; --ink:#15202B; --muted:#5A6676; --faint:#8893A0; --line:#DCE1E7;
  --accent:#0E6B63; --accent-soft:#DFF0ED; --warn:#8A5A00; --warn-soft:#F6ECD6; --bad:#A3323F; --bad-soft:#F7E3E6;
  --c-device:#B2691A; --c-technique:#2E7D5B; --c-dataform:#6A4FA3; --c-design:#1F6FA8; --c-robust:#B0445E; --c-taste:#6B7785; --c-paper:#15202B;
  --font:"Schibsted Grotesk",system-ui,-apple-system,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#11161C; --surface:#182029; --surface-2:#1C2530; --ink:#E6EBF0; --muted:#A1ACB9; --faint:#76818E; --line:#2B3541;
    --accent:#5FC2B5; --accent-soft:#17312E; --warn:#E3B868; --warn-soft:#30281A; --bad:#EE8F9B; --bad-soft:#33202A;
    --c-device:#E0A35A; --c-technique:#6CC59A; --c-dataform:#B39BE6; --c-design:#72B2E8; --c-robust:#EC8FA5; --c-taste:#A6B1BE; --c-paper:#E6EBF0;
    color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg); color:var(--ink); font:400 15px/1.6 var(--font)}
a{color:var(--accent)}
button{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.mono{font-family:var(--mono); font-size:12.5px}
.muted{color:var(--muted)}
[hidden]{display:none!important}

/* ---------- 顶栏 ---------- */
.top{position:sticky; top:0; z-index:20; background:var(--bg); border-bottom:1px solid var(--line);
  padding:calc(env(safe-area-inset-top,0px) + 12px) max(20px,env(safe-area-inset-right,0px)) 0 max(20px,env(safe-area-inset-left,0px))}
.top-in{max-width:1320px; margin:0 auto}
.brand{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap}
.brand a.home{font-size:13px; color:var(--muted); text-decoration:none}
.brand h1{font-size:21px; font-weight:650; letter-spacing:-.01em; margin:0}
.brand .sum{font-size:13px; color:var(--muted); font-variant-numeric:tabular-nums}
nav.tabs{display:flex; gap:2px; margin-top:8px; overflow-x:auto; scrollbar-width:none}
nav.tabs a{padding:8px 12px 10px; text-decoration:none; color:var(--muted); font-weight:500; white-space:nowrap; border-bottom:2px solid transparent}
nav.tabs a[aria-current="page"]{color:var(--ink); border-bottom-color:var(--accent)}
nav.tabs a:hover{color:var(--ink)}

main{max-width:1320px; margin:0 auto; padding:18px max(20px,env(safe-area-inset-right,0px)) 56px max(20px,env(safe-area-inset-left,0px))}
.view{min-height:60vh}

/* ---------- 通用 ---------- */
.panel{background:var(--surface); border:1px solid var(--line); border-radius:10px}
.chips{display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.chip{display:inline-flex; align-items:center; gap:6px; font-size:13px; padding:4px 11px; border-radius:999px; border:1px solid var(--line);
  background:var(--surface); cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink); color:var(--bg); border-color:var(--ink)}
.chip .n{font-variant-numeric:tabular-nums; opacity:.7; font-size:12px}
.dot{width:9px; height:9px; border-radius:50%; flex:none; display:inline-block}
.badge{display:inline-block; font-size:11.5px; padding:1px 8px; border-radius:999px; background:var(--surface-2); border:1px solid var(--line); color:var(--muted); margin:0 4px 4px 0; white-space:nowrap}
.badge.ok{background:var(--accent-soft); border-color:transparent; color:var(--accent)}
.badge.warn{background:var(--warn-soft); border-color:transparent; color:var(--warn)}
.badge.bad{background:var(--bad-soft); border-color:transparent; color:var(--bad)}
.lbl{font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:600}
.btn{border:1px solid var(--line); background:var(--surface); border-radius:8px; padding:7px 14px; cursor:pointer; font-weight:500}
.btn.primary{background:var(--accent); border-color:var(--accent); color:#fff}
@media (prefers-color-scheme: dark){ .btn.primary{color:#0B1F1C} }
.btn:hover{border-color:var(--accent)}
.link{background:none; border:0; padding:0; color:var(--accent); cursor:pointer; text-align:left; text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:color-mix(in srgb,var(--accent) 35%,transparent)}
select,input[type="text"],input[type="password"],input[type="search"]{font:inherit; color:inherit; background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:6px 10px}
.empty{padding:40px 20px; text-align:center; color:var(--muted)}
.note{font-size:13px; color:var(--muted)}
.loc{font-family:var(--mono); font-size:11.5px; color:var(--accent)}
.loc.inf::after{content:" · 推断"; color:var(--warn)}
.loc.nf::after{content:" · 原文未找到"; color:var(--bad)}

/* ---------- 图谱 ---------- */
.desk{display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,420px); gap:16px; align-items:start}
.graph-box{min-width:0}
.toolbar{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; padding:10px 12px; border-bottom:1px solid var(--line)}
.toolbar .grp{display:flex; gap:6px; align-items:center; flex-wrap:wrap}
.seg{display:inline-flex; border:1px solid var(--line); border-radius:8px; overflow:hidden}
.seg button{border:0; background:var(--surface); padding:5px 11px; cursor:pointer; font-size:13px}
.seg button[aria-pressed="true"]{background:var(--ink); color:var(--bg)}
#cy{height:min(70vh,700px); min-height:420px}
.hint{font-size:12.5px; color:var(--faint); padding:8px 12px; border-top:1px solid var(--line)}
aside.side{position:sticky; top:118px; max-height:calc(100vh - 134px); overflow:auto; padding:18px; min-width:0}
.side h2{font-size:19px; font-weight:650; margin:4px 0 6px; line-height:1.3; text-wrap:balance}
.side h3{margin:18px 0 6px}
.kv{display:grid; gap:10px}
.item{border-top:1px solid var(--line); padding-top:10px}
.item:first-child{border-top:0; padding-top:0}
.item p{margin:2px 0}
.item .name{font-weight:600}
.spark{display:block; margin:6px 0 2px}

/* ---------- 卡片 ---------- */
.cards-tools{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:14px}
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr)); gap:16px}
article.card{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:18px 20px; display:flex; flex-direction:column; gap:10px; min-width:0}
.card .head{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:baseline}
.card h2{font-size:18px; font-weight:650; line-height:1.35; margin:0; text-wrap:balance}
.card p{margin:0}
.card dl{display:grid; grid-template-columns:6.5em minmax(0,1fr); gap:6px 12px; margin:0; font-size:14px}
.card dt{color:var(--muted)}
.card dd{margin:0}
.lineage{display:flex; flex-wrap:wrap; gap:4px 6px; align-items:center; font-size:13px}
.lineage .arr{color:var(--faint)}
details{border-top:1px solid var(--line); padding-top:8px; font-size:13.5px}
summary{cursor:pointer; color:var(--muted)}
details ul{margin:8px 0 0; padding-left:18px; display:grid; gap:6px}
.outside{font-size:13px; color:var(--muted); background:var(--surface-2); border-radius:8px; padding:8px 10px}

/* ---------- 论文 ---------- */
.ptools{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:12px}
.ptools input[type="search"]{flex:1 1 260px; min-width:0}
.plist{overflow:hidden}
.prow{display:grid; grid-template-columns:3.4em minmax(0,14em) minmax(0,1fr) auto; gap:12px; padding:10px 14px; border:0; border-top:1px solid var(--line);
  width:100%; text-align:left; background:none; cursor:pointer; align-items:baseline}
.prow:first-child{border-top:0}
.prow:hover,.prow[aria-current="true"]{background:var(--accent-soft)}
.prow .yr{font-family:var(--mono); font-size:13px; color:var(--muted)}
.prow .who{font-weight:600}
.prow .who small{font-weight:400; color:var(--muted)}
.prow .q{color:var(--muted); font-size:14px}
.ptype{font-size:11.5px; padding:1px 8px; border-radius:999px; white-space:nowrap; background:var(--surface-2); color:var(--muted)}
.ptype.t{background:color-mix(in srgb,var(--c-dataform) 15%,transparent); color:var(--c-dataform)}
.ptype.e{background:color-mix(in srgb,var(--c-design) 15%,transparent); color:var(--c-design)}
.ptype.m{background:color-mix(in srgb,var(--c-technique) 15%,transparent); color:var(--c-technique)}

/* ---------- 演化 ---------- */
.trend-tools{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:12px}
.trend-wrap{padding:16px; overflow-x:auto}
.trend-svg text{fill:var(--muted); font:12px var(--font)}
.trend-table{width:100%; border-collapse:collapse; font-size:13.5px; margin-top:14px}
.trend-table th,.trend-table td{padding:6px 8px; border-top:1px solid var(--line); text-align:right; font-variant-numeric:tabular-nums}
.trend-table th:first-child,.trend-table td:first-child{text-align:left}
.trend-table th{color:var(--muted); font-weight:500}

/* ---------- 文本页 ---------- */
.prose{max-width:72ch}
.prose h2{font-size:20px; font-weight:650; margin:28px 0 8px}
.prose h2:first-child{margin-top:0}
.prose table{border-collapse:collapse; font-size:13.5px; margin:8px 0; display:block; overflow-x:auto}
.prose th,.prose td{border-top:1px solid var(--line); padding:6px 10px; text-align:left; font-variant-numeric:tabular-nums}
.prose th{color:var(--muted); font-weight:500}
.form{display:grid; gap:12px; max-width:560px}
.form label{display:grid; gap:4px; font-size:14px}
.form .row{display:flex; gap:8px; flex-wrap:wrap}
.status{font-size:14px; padding:8px 12px; border-radius:8px; background:var(--surface-2)}
.status.ok{background:var(--accent-soft); color:var(--accent)}
.status.bad{background:var(--bad-soft); color:var(--bad)}

/* ---------- 抽屉（卡片、演化页里点论文） ---------- */
.drawer{position:fixed; top:0; right:0; bottom:0; width:min(480px,100vw); z-index:40; background:var(--surface); border-left:1px solid var(--line);
  overflow:auto; padding:calc(env(safe-area-inset-top,0px) + 16px) max(18px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 24px) 18px;
  box-shadow:-8px 0 24px rgba(0,0,0,.08)}
.drawer .close{position:sticky; top:0; float:right; border:1px solid var(--line); background:var(--surface); border-radius:8px; padding:4px 10px; cursor:pointer}

@media (max-width:900px){
  .desk{grid-template-columns:minmax(0,1fr)}
  aside.side{position:static; max-height:none}
  #cy{height:60vh; min-height:360px}
  .prow{grid-template-columns:3em minmax(0,1fr) auto}
  .prow .q{grid-column:2 / -1}
  .card dl{grid-template-columns:minmax(0,1fr); gap:2px}
  .card dd{margin-bottom:6px}
}
@media (prefers-reduced-motion: reduce){ *{transition:none!important; animation:none!important} }