/* Context redesign · 工作类视图（Mac 为主，iOS 共用 Markdown、技能、导入、存储、复制给 AI 的卡片）
   沿用收敛后的规则：细线不投影，单一中性色，颜色只给状态。 */

/* ---------- 页头、检查器标签、代码块、状态点 ---------- */
.pg-hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-top: 8px; }
.pg-l { min-width: 0; }
.pg-sub { max-width: 560px; margin: 10px 0 0; font-size: 14px; line-height: 1.65; color: var(--mute); }
.pg-r { flex: none; }
.i-top { position: sticky; top: 0; z-index: 3; padding-bottom: 10px; background: rgba(249, 249, 247, 0.9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.i-top .i-hd { position: static; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.i-tabs { margin: 0 16px; }
.i-tabs button { height: 28px; font-size: 12.5px; }
.i-hd .logo { width: 26px; height: 26px; border-radius: 8px; font-size: 13px; }
.i-x { margin-left: 4px; width: 26px; height: 26px; border-radius: 13px; display: grid; place-items: center; color: var(--mute); }
.i-x:hover { background: rgba(19, 19, 19, 0.06); }
.i-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.st-dot { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--mute); white-space: nowrap; }
.st-dot i { width: 6px; height: 6px; border-radius: 3px; background: var(--mute-2); }
.st-dot.on i { background: var(--green); }
.logo.src-i { color: var(--ink-2); font-size: 16px; }
.lnk { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--ink-2); }
.lnk:hover { color: var(--ink); text-decoration: underline; }
.code { border-radius: 14px; border: 0.5px solid var(--line-2); background: #fbfbfa; overflow: hidden; }
.code-hd { display: flex; align-items: center; gap: 8px; height: 36px; white-space: nowrap; padding: 0 6px 0 12px; border-bottom: 0.5px solid var(--line); background: #fff; font-size: 11.5px; color: var(--ink-2); }
.code-hd > .mono:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.code-lang { flex: none; font-size: 10.5px; color: var(--mute); }
.share.compact .code-lang { display: none; }
.code-cp { flex: none; margin-left: auto; display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border-radius: 13px; font-size: 12px; font-weight: 600; border: 0.5px solid var(--line-2); background: #fff; }
.code-cp:hover { background: var(--surface-2); }
.code-cp.done { color: #1f7a3c; border-color: rgba(48, 184, 91, 0.35); }
.code pre { margin: 0; padding: 12px 14px; font-size: 12px; line-height: 1.65; color: var(--ink-2); white-space: pre-wrap; word-break: break-word; max-height: 320px; overflow: auto; }
.back-l { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 13px; color: var(--mute); }
.back-l:hover { color: var(--ink); }

/* ---------- Markdown 阅读器 ---------- */
.v-reader .m-in { max-width: 820px; }
.reader { max-width: 700px; margin: 0 auto; padding-top: 4px; }
.rd-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.crumbs { display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 11.5px; color: var(--mute); white-space: nowrap; overflow: hidden; }
.crumbs .cur { color: var(--ink); }
.crumbs .cr { font-size: 9px; opacity: 0.6; }
.rd-modes { flex: none; width: 190px; }
.rd-modes button { height: 26px; font-size: 12px; }
.rd-title { margin: 22px 0 0; font: 700 34px/1.18 var(--display); letter-spacing: -0.02em; }
.rd-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 10px; font-size: 11px; color: var(--mute); }
.rd-body { margin-top: 20px; }
.callout { display: flex; gap: 10px; margin: 14px 0; padding: 11px 14px; border-radius: 12px; background: var(--surface-2); border: 0.5px solid var(--line); font-size: 14px; line-height: 1.6; color: var(--ink-2); }
.callout > .ph { flex: none; margin-top: 3px; font-size: 16px; color: var(--mute); }
.callout p { margin: 0 !important; font-size: 14px !important; }
.callout.c-warning { background: #faf5ea; border-color: rgba(207, 154, 69, 0.3); }
.callout.c-warning > .ph { color: #a97a2c; }
.callout.c-repo { margin-top: 18px; }

/* 属性（frontmatter），像 Obsidian 的 Properties */
.props { display: grid; gap: 1px; margin-bottom: 22px; padding: 6px 0; border-top: 0.5px solid var(--line); border-bottom: 0.5px solid var(--line); }
.prop { display: grid; grid-template-columns: 150px minmax(0, 1fr); align-items: center; min-height: 30px; font-size: 13px; }
.prop-k { display: flex; align-items: center; gap: 7px; color: var(--mute); }
.prop-k .ph { font-size: 14px; }
.prop-k .mono { font-size: 12px; }
.prop-v { display: flex; flex-wrap: wrap; gap: 6px; color: var(--ink-2); }
.tg { display: inline-flex; height: 20px; padding: 0 7px; border-radius: 6px; background: rgba(19, 19, 19, 0.05); font-size: 12px; line-height: 20px; color: var(--ink-2); }

/* 正文 */
.mdv { font-size: 16px; line-height: 1.8; color: var(--ink-2); }
.mdv .mh { margin: 30px 0 8px; color: var(--ink); letter-spacing: -0.01em; }
.mdv .mh:first-child { margin-top: 0; }
.mdv h2.mh1 { font: 700 26px/1.25 var(--display); }
.mdv h3.mh2 { font: 650 19px/1.35 var(--display); }
.mdv h4.mh3 { margin-top: 22px; font: 600 16px/1.4 var(--display); }
.mdv p { margin: 8px 0; }
.mdv ul, .mdv ol { margin: 6px 0; padding-left: 22px; }
.mdv ul { list-style: none; padding-left: 0; }
.mdv ul > li { position: relative; padding: 3px 0 3px 20px; }
.mdv ul > li::before { content: ""; position: absolute; left: 6px; top: 0.88em; width: 5px; height: 5px; border-radius: 3px; background: var(--mute-2); }
.mdv ol > li { padding: 3px 0 3px 2px; }
.mdv ol > li::marker { font: 500 13px var(--mono); color: var(--mute); }
.mdv li.task { padding-left: 28px; }
.mdv li.task::before { display: none; }
.cb { position: absolute; left: 2px; top: 0.42em; width: 16px; height: 16px; border-radius: 5px; border: 1.5px solid var(--mute-2); display: grid; place-items: center; font-size: 11px; color: #fff; }
.mdv li.done .cb { background: var(--ink-2); border-color: var(--ink-2); }
.mdv li.done .li-t { color: var(--mute); text-decoration: line-through; text-decoration-color: var(--mute-2); }
.mdv li.is-new { margin: 2px -10px; padding-right: 10px; padding-left: 30px; border-radius: 10px; background: #eef7f0; }
.mdv li.is-new::before { left: 16px; background: var(--green); }
.mdv li.is-prop { margin: 4px -10px; padding: 8px 10px 8px 30px; border-radius: 12px; border: 1px dashed var(--line-2); background: #fff; color: var(--mute); }
.mdv li.is-prop::before { left: 16px; top: 1.3em; background: none; border: 1.5px solid var(--mute-2); width: 4px; height: 4px; }
.prop-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; font-size: 12px; color: var(--mute); }
.prop-bar > span:first-child { display: inline-flex; align-items: center; gap: 4px; }
.prop-act { display: flex; gap: 6px; }
.pill.xs { height: 28px; padding: 0 11px; font-size: 12.5px; border-radius: 14px; }
.pill.xs .ph { font-size: 13px; }
.pvs { display: inline-flex; gap: 6px; margin-left: 10px; vertical-align: 1px; }
.pv { display: inline-flex; align-items: center; gap: 3px; height: 19px; padding: 0 7px; border-radius: 10px; font: 500 10.5px/19px var(--font); color: var(--mute); background: rgba(19, 19, 19, 0.04); }
.mdv li:not(:hover) .pv:not(.pv-new) { opacity: 0; }
.pv-new { color: #1f7a3c; background: #fff; }
.mdv blockquote { margin: 10px 0; padding: 2px 0 2px 14px; border-left: 2px solid var(--line-2); color: var(--ink-2); font-style: normal; }
.mdv code { padding: 1px 5px; border-radius: 5px; background: rgba(19, 19, 19, 0.05); font: 0.86em var(--mono); color: var(--ink); }
.mdv a.wl { color: var(--ink); text-decoration: underline; text-decoration-color: var(--mute-2); text-underline-offset: 3px; cursor: pointer; }
.mdv a.wl:hover { text-decoration-color: var(--ink); }
.mdv a.xl { color: var(--cobalt); }
.tbl { margin: 12px 0; border-radius: 12px; border: 0.5px solid var(--line-2); overflow: hidden; }
.tbl table { width: 100%; border-collapse: collapse; font-size: 13.5px; line-height: 1.5; }
.tbl th { padding: 8px 12px; text-align: left; font-weight: 600; font-size: 12px; color: var(--mute); background: var(--surface-2); border-bottom: 0.5px solid var(--line-2); }
.tbl td { padding: 9px 12px; border-top: 0.5px solid var(--line); color: var(--ink-2); vertical-align: top; }
.tbl tr:first-child td { border-top: 0; }
.codeblk { margin: 12px 0; padding: 12px 14px; border-radius: 12px; background: #fbfbfa; border: 0.5px solid var(--line-2); font: 12.5px/1.65 var(--mono); }

/* 源码视图 */
.md-src { padding: 8px 0; border-radius: 14px; background: #fff; border: 0.5px solid var(--line-2); font-size: 12.5px; line-height: 1.75; }
.md-src .sl { display: grid; grid-template-columns: 40px 16px minmax(0, 1fr); padding-right: 14px; }
.md-src .sl i { font-style: normal; text-align: right; padding-right: 8px; color: var(--mute-2); user-select: none; }
.md-src .sl .sg { color: var(--mute-2); text-align: center; }
.md-src .sl code { white-space: pre-wrap; word-break: break-word; color: var(--ink-2); }
.md-src .sl.new { background: #eef7f0; }
.md-src .sl.new .sg { color: var(--green); }
.md-src .sl.prop { background: #faf7f0; }
.sx-d { color: var(--mute-2); } .sx-k { color: var(--ink); font-weight: 600; } .sx-h { color: var(--ink); font-weight: 700; }
.sx-m { color: var(--mute); } .sx-l { color: var(--cobalt); } .sx-c { color: #8a5a2a; } .sx-b { font-weight: 700; color: var(--ink); }

/* 版本历史 */
.hist { display: grid; gap: 0; }
.hv { position: relative; padding: 10px 0 10px 18px; border-left: 1px solid var(--line-2); margin-left: 4px; }
.hv::before { content: ""; position: absolute; left: -4.5px; top: 16px; width: 8px; height: 8px; border-radius: 4px; background: var(--canvas); border: 1.5px solid var(--mute-2); }
.hv.cur::before { background: var(--ink); border-color: var(--ink); }
.hv-hd { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--ink-2); }
.hv-hd b { font-size: 12px; color: var(--ink); }
.hv-hd time { margin-left: auto; font-size: 11px; color: var(--mute); }
.hv-n em { font-style: normal; font-size: 11px; margin-left: 4px; }
.hv-n .a { color: #1f7a3c; } .hv-n .d { color: #b23b30; }
.hist.big .hv { padding-bottom: 16px; }
.hist .diff { margin-top: 8px; }
.df-l.del { background: #fbeeec; color: #9b3328; }
.df-l.del i, .df-l.add i { font-style: normal; display: inline-block; width: 18px; }
.hist-note { margin: 12px 0 0 22px; font-size: 12.5px; color: var(--mute); }

/* 检查器：大纲、链接、局部图 */
.outline { display: grid; gap: 1px; }
.outline button { text-align: left; padding: 6px 10px; border-radius: 8px; font-size: 13px; color: var(--ink-2); }
.outline button:hover { background: rgba(19, 19, 19, 0.05); color: var(--ink); }
.outline .ol-3 { padding-left: 24px; font-size: 12.5px; color: var(--mute); }
.outline .ol-1 { font-weight: 600; }
.lk-r { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; text-align: left; font-size: 13.5px; }
.lk-r > .ph, .lk-r > svg { flex: none; font-size: 15px; color: var(--mute); }
.lk-r span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lk-r small { flex: none; max-width: 46%; font-size: 10.5px; color: var(--mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lk-r:hover { background: var(--surface-2); }
.i-local { overflow: hidden; }
.i-local .kg-local { display: block; height: 190px; }
.il-ft { display: flex; align-items: center; gap: 6px; padding: 9px 12px; border-top: 0.5px solid var(--line); font-size: 12px; color: var(--mute); }
.il-ft button { margin-left: auto; font-size: 12px; font-weight: 600; color: var(--ink); }
.ses-mini .sm-r { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; text-align: left; }
.sm-r .logo { width: 28px; height: 28px; border-radius: 8px; font-size: 14px; }
.sm-r span { flex: 1; min-width: 0; }
.sm-r b { display: block; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sm-r small { display: block; font-size: 11.5px; color: var(--mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sm-r time { font-size: 10.5px; color: var(--mute); }
.tok .tk { display: flex; justify-content: space-between; gap: 10px; padding: 9px 14px; font-size: 11.5px; color: var(--ink-2); }
.tok .tk b { color: var(--mute); font-weight: 500; }

/* ---------- 项目 ---------- */
.pj-st { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.pj-st .st-dot { font-size: 12.5px; color: var(--ink-2); }
.pj-st small { font-size: 12px; color: var(--mute); }
.pj-facts { display: grid; grid-template-columns: 0.8fr 1.5fr 1fr 1.5fr 0.6fr; margin-top: 22px; border-top: 0.5px solid var(--line-2); border-bottom: 0.5px solid var(--line-2); }
.pj-facts > div { padding: 12px 14px 12px 0; min-width: 0; }
.pj-facts > div + div { padding-left: 14px; border-left: 0.5px solid var(--line); }
.pj-facts span { display: block; font-size: 11.5px; color: var(--mute); }
.pj-facts b { display: flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pj-facts b.mono { font-size: 12.5px; }
.pj-ppl { gap: 0 !important; }
.pj-ppl .pa { width: 24px; height: 24px; font-size: 11px; font-style: normal; box-shadow: 0 0 0 2px var(--canvas); }
.pj-ppl .pa + .pa { margin-left: -5px; }
.v-projects .callout { margin-top: 18px; }
.layers { padding: 4px 16px 0; }
.ly { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 13px 0; }
.ly + .ly { border-top: 0.5px solid var(--line); }
.ly-n { width: 22px; height: 22px; border-radius: 11px; display: grid; place-items: center; font-size: 11px; color: var(--ink-2); background: var(--surface-2); border: 0.5px solid var(--line-2); }
.ly-b b { display: flex; align-items: baseline; gap: 8px; font-size: 14.5px; font-weight: 600; }
.ly-b b .mono { font-size: 11.5px; font-weight: 400; color: var(--mute); }
.ly-b small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--mute); }
.ly-items { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ly-items span { height: 22px; padding: 0 8px; border-radius: 6px; font-size: 11px; line-height: 22px; color: var(--ink-2); background: var(--surface-2); border: 0.5px solid var(--line); }
.ly-t { font-size: 13px; color: var(--ink); text-align: right; }
.ly-t small { display: block; font-size: 10px; color: var(--mute); }
.ly-sum { margin: 0 -16px; padding: 12px 16px; border-top: 0.5px solid var(--line); background: var(--surface-2); border-radius: 0 0 var(--r-l) var(--r-l); }
.ly-bar { display: flex; gap: 2px; height: 6px; border-radius: 3px; overflow: hidden; }
.ly-bar i { background: var(--ink); } .ly-bar .lb-1 { opacity: 0.55; } .ly-bar .lb-2 { opacity: 0.25; }
.ly-ft { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: 12.5px; color: var(--ink-2); }
.pj-now { padding: 4px 18px 10px; }
.pj-now.mdv { font-size: 14.5px; line-height: 1.7; }
.pj-now .mh { margin-top: 16px; }
.pj-cols { grid-template-columns: minmax(0, 1fr) 280px; }
.decs .dec { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 10px; padding: 13px 14px; }
.dec-d { padding-top: 2px; font-size: 11px; color: var(--mute); }
.dec-b b { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.4; }
.dec-b small { display: block; margin-top: 3px; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
.dec-by { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 11.5px; color: var(--mute); }
.dec-by .logo { width: 18px; height: 18px; border-radius: 5px; font-size: 10px; }
.dec-act { display: flex; gap: 6px; margin-top: 10px; }
.dec.pending { background: #fcfbf8; }
.dec.pending .dec-d { color: var(--ink); font-weight: 600; }
.ms { padding: 6px 14px; }
.ms > .m { position: relative; display: grid; grid-template-columns: 14px 46px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 9px 0; font-size: 13px; }
.ms > .m:not(:last-child)::after { content: ""; position: absolute; left: 6px; top: 26px; bottom: -8px; width: 1px; background: var(--line-2); }
.m-dot { width: 9px; height: 9px; border-radius: 5px; border: 1.5px solid var(--mute-2); background: #fff; margin-left: 2px; }
.m.done .m-dot { background: var(--ink); border-color: var(--ink); }
.m.doing .m-dot { border-color: var(--ink); }
.m-d { font-size: 11px; color: var(--mute); }
.ms > .m b { font-weight: 500; color: var(--ink-2); }
.m.done b { color: var(--mute); }
.m-p { font-size: 11px; color: var(--ink); }
.m-ok { color: var(--mute-2); font-size: 13px; }
.srcs-g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sg-c { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; min-width: 0; text-align: left; }
.sg-h { display: flex; align-items: center; gap: 8px; }
.sg-i { width: 28px; height: 28px; flex: none; border-radius: 8px; display: grid; place-items: center; font-size: 15px; background: var(--surface-2); border: 0.5px solid var(--line); color: var(--ink-2); }
.sg-h b { flex: 1; font-size: 13.5px; font-weight: 600; }
.sg-h time { font-size: 10.5px; color: var(--mute); }
.sg-t { margin-top: 4px; font-size: 13px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sg-c small { font-size: 12px; line-height: 1.5; color: var(--mute); }
.sg-add { align-items: flex-start; justify-content: center; border-style: dashed; background: transparent; color: var(--ink-2); }
.sg-add > .ph { font-size: 18px; color: var(--mute); }
.sg-add span { font-size: 13.5px; font-weight: 600; }
.bound { display: grid; grid-template-columns: 1fr 1fr; }
.bound > div { padding: 14px 16px; }
.bound > div + div { border-left: 0.5px solid var(--line); }
.bound h4 { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; font-size: 13px; font-weight: 600; }
.bound > div:first-child h4 .ph { color: var(--green); } .bound > div + div h4 .ph { color: var(--mute); }
.bound ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 5px; font-size: 12px; color: var(--ink-2); }
.bound > div + div li { color: var(--mute); text-decoration: line-through; text-decoration-color: var(--mute-2); }
.arch { display: grid; gap: 10px; margin-top: 22px; }
.ar { display: flex; align-items: center; gap: 12px; padding: 14px 16px; }
.ar > .ph { font-size: 20px; color: var(--mute); }
.ar div { flex: 1; }
.ar b { display: block; font-size: 15px; font-weight: 600; }
.ar small { font-size: 11.5px; color: var(--mute); }
.ar-n { font-size: 12px; color: var(--mute); }
.sk-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }

/* ---------- 图谱 ---------- */
.kg-q { display: flex; align-items: center; gap: 8px; width: 250px; height: 36px; padding: 0 12px; border-radius: 18px; background: #fff; border: 0.5px solid var(--line-2); color: var(--mute); }
.kg-q input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: 13px var(--font); color: var(--ink); }
.kg-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; }
.kg-f { display: flex; flex-wrap: wrap; gap: 4px; }
.kg-f button { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 9px 0 6px; border-radius: 14px; font-size: 12px; color: var(--ink-2); border: 0.5px solid var(--line-2); background: #fff; }
.kg-f button .mono { font-size: 10.5px; color: var(--mute); }
.kg-f button.off { background: transparent; color: var(--mute-2); border-style: dashed; }
.kg-f button.off svg { opacity: 0.35; }
.kg-depth { flex: none; width: 170px; }
.kg-depth button { height: 26px; font-size: 12px; }
.kg-depth button:disabled { opacity: 0.4; }
.kg-wrap { position: relative; height: 560px; margin-top: 12px; border-radius: var(--r-l); background: #fbfbfa; border: 0.5px solid var(--line-2); overflow: hidden;
  background-image: radial-gradient(rgba(19, 19, 19, 0.07) 1px, transparent 1px); background-size: 20px 20px; }
.kg-wrap > svg { width: 100%; height: 100%; display: block; cursor: grab; touch-action: none; }
.kg-wrap > svg.panning { cursor: grabbing; }
.kg-ctl { position: absolute; right: 12px; top: 12px; display: flex; flex-direction: column; border-radius: 12px; background: #fff; border: 0.5px solid var(--line-2); overflow: hidden; }
.kg-ctl button { width: 32px; height: 30px; display: grid; place-items: center; font-size: 14px; color: var(--ink-2); }
.kg-ctl button + button { border-top: 0.5px solid var(--line); }
.kg-ctl button:hover { background: var(--surface-2); }
.kg-tip { position: absolute; left: 14px; bottom: 12px; font-size: 11.5px; color: var(--mute); pointer-events: none; }
/* 图谱节点：形状区分类型，只用中性色；选中后邻居清晰、其他变淡 */
.kg .ge line { stroke: #d6d6d2; stroke-width: 1; }
.kg .ge-t { font: 500 9px var(--font); fill: var(--mute); text-anchor: middle; opacity: 0; transition: opacity 0.15s; pointer-events: none; }
.kg .gn { cursor: pointer; transition: opacity 0.15s; }
.kg .gn:focus { outline: none; }
.kg .gn:focus-visible > :first-child { stroke: var(--ink); stroke-width: 2; }
.kg .gn-t { font: 500 11px var(--font); fill: var(--ink-2); text-anchor: middle; pointer-events: none; paint-order: stroke; stroke: #fbfbfa; stroke-width: 3px; stroke-linejoin: round; }
.kg .gn-t.major { font-weight: 600; font-size: 12px; fill: var(--ink); }
.kg .gn-t.minor { opacity: 0; transition: opacity 0.15s; }
.kg.zoomed .gn-t.minor, .kg .gn.hov .gn-t, .kg .gn.hov-n .gn-t, .kg .gn.sel .gn-t, .kg .gn.sel-n .gn-t, .kg .gn.q .gn-t { opacity: 1; }
.kg-local .gn-t.minor { opacity: 1; font-size: 10px; }
.kg .nd-in { font: 600 10px var(--font); fill: var(--ink); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.kg .nd-in.me { font-size: 13px; fill: #fff; } .kg .nd-in.light { fill: #fff; }
.nd-me { fill: var(--ink); }
.nd-person { fill: #fff; stroke: var(--ink-2); stroke-width: 1.3; }
.nd-project { fill: var(--ink-2); }
.nd-topic { fill: #fff; stroke: var(--ink-2); stroke-width: 1.3; stroke-dasharray: 2.5 2; }
.nd-goal { fill: #fff; stroke: var(--ink-2); stroke-width: 1.3; } .nd-goal-in { fill: var(--ink-2); }
.nd-pref { fill: #a9a9ae; } .nd-pref.pending { fill: #fff; stroke: #a9a9ae; stroke-dasharray: 2 1.5; }
.nd-event { fill: #fff; stroke: var(--ink-2); stroke-width: 1.2; }
.nd-decision { fill: var(--ink-2); }
.nd-source { fill: #c9c9cc; }
.nd-place { fill: #e4e4e0; stroke: #a9a9ae; }
.nd-value { fill: #fff; stroke: var(--ink); stroke-width: 2; }
.kg.has-sel .gn, .kg.has-hover .gn { opacity: 0.22; }
.kg.has-sel .ge, .kg.has-hover .ge { opacity: 0.25; }
.kg.has-sel .gn.sel, .kg.has-sel .gn.sel-n, .kg.has-hover .gn.hov, .kg.has-hover .gn.hov-n { opacity: 1; }
.kg.has-sel .ge.sel, .kg.has-hover .ge.hov { opacity: 1; }
.kg .ge.sel line, .kg .ge.hov line { stroke: var(--ink-2); stroke-width: 1.3; }
.kg .ge.sel .ge-t, .kg .ge.hov .ge-t { opacity: 1; }
.kg .gn.sel > :first-child { stroke: var(--ink); stroke-width: 2.5; }
.kg.has-q .gn:not(.q) { opacity: 0.18; }
.kg .gn.q > :first-child { stroke: var(--ink); stroke-width: 2.5; }
.kg-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 10px; padding: 10px 12px; }
.kg-legend > div { display: flex; align-items: center; gap: 8px; height: 26px; font-size: 12.5px; color: var(--ink-2); }
.kg-legend b { margin-left: auto; font-size: 11px; font-weight: 400; color: var(--mute); }
.kg-recent .kr-r { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 11px 14px; text-align: left; }
.kr-p { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; }
.kr-p .ph { color: var(--mute); font-size: 13px; }
.kr-r small { font-size: 12px; color: var(--mute); }
.kn { padding: 14px; }
.kn-hd { display: flex; align-items: center; gap: 12px; }
.kn-hd > svg, .kn-hd > .logo { flex: none; width: 30px; height: 30px; }
.kn-hd b { display: block; font: 650 16px/1.3 var(--display); }
.kn-hd small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--mute); }
.kn-m { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 10px; font-size: 11px; color: var(--mute); }
.kn-a { margin-top: 12px; }
.kn-rel .kr-g { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 8px; padding: 9px 12px; }
.kr-rel { padding-top: 4px; font-size: 11.5px; color: var(--mute); }
.kr-ns { display: flex; flex-wrap: wrap; gap: 4px; }
.kr-ns button { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 8px 0 4px; border-radius: 8px; font-size: 12.5px; background: var(--surface-2); border: 0.5px solid var(--line); }
.kr-ns button:hover { border-color: var(--line-2); background: #fff; }
.i-who { display: flex; align-items: center; gap: 10px; padding: 12px 14px; font-size: 13px; color: var(--ink-2); }
.kg-prev { position: relative; display: block; overflow: hidden; cursor: pointer; }
.kg-prev > svg { display: block; width: 100%; height: 280px; background: #fbfbfa; background-image: radial-gradient(rgba(19, 19, 19, 0.06) 1px, transparent 1px); background-size: 18px 18px; }
.kg-prev-ft { display: flex; align-items: center; gap: 16px; padding: 12px 16px; border-top: 0.5px solid var(--line); font-size: 12.5px; color: var(--ink-2); }
.kp-dims { display: flex; gap: 10px; flex: 1; min-width: 0; overflow: hidden; color: var(--mute); }
.kp-dims i { margin-left: 3px; font-style: normal; font-size: 11px; }
.kp-go { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: var(--ink); white-space: nowrap; }

/* ---------- 技能 ---------- */
.accum { padding: 6px 18px 0; }
.ac-r { display: grid; grid-template-columns: minmax(0, 1fr) 220px 110px; gap: 16px; align-items: center; padding: 12px 0; }
.ac-k { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: baseline; }
.ac-k b { font: 650 26px/1 var(--display); letter-spacing: -0.02em; color: var(--ink); }
.ac-k span { font-size: 14px; font-weight: 600; }
.ac-k small { grid-column: 1 / -1; margin-top: 4px; font-size: 12px; color: var(--mute); }
.ac-r svg { width: 220px; }
.ac-u { font-size: 12px; color: var(--mute); text-align: right; }
.ac-arrow { display: flex; align-items: center; gap: 8px; padding: 2px 0 2px 2px; font-size: 12px; color: var(--mute); }
.ac-arrow .ph { font-size: 13px; }
.ac-ft { margin: 6px -18px 0; padding: 11px 18px; border-top: 0.5px solid var(--line); background: var(--surface-2); border-radius: 0 0 var(--r-l) var(--r-l); font-size: 11px; color: var(--mute); }
.dc-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
.dc { padding: 14px 16px; }
.dcd-top { display: flex; gap: 6px; }
.dc-k, .dc-a, .skc-a { height: 22px; padding: 0 8px; border-radius: 6px; font-size: 11.5px; font-weight: 600; line-height: 22px; color: var(--ink-2); background: var(--surface-2); border: 0.5px solid var(--line); }
.dc-k { color: var(--ink); background: #fff; border-color: var(--line-2); }
.dc-t { display: block; margin-top: 10px; font: 650 17px/1.4 var(--display); }
.dc-why { margin: 4px 0 0; font-size: 13px; line-height: 1.55; color: var(--mute); }
.dc-draft { margin: 10px 0 0; padding: 10px 12px 10px 30px; border-radius: 12px; background: var(--surface-2); border: 0.5px dashed var(--line-2); font-size: 13.5px; line-height: 1.7; color: var(--ink-2); }
.dc-from { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 10px; font-size: 12px; color: var(--mute); }
.dc-from span { display: inline-flex; align-items: center; gap: 4px; }
.dc-from b { font-size: 11px; font-weight: 500; color: var(--ink-2); }
.dc .rc-act { margin-top: 12px; }
.dc.done { display: flex; align-items: center; gap: 12px; }
.dc.done > .ph { font-size: 22px; color: var(--green); }
.dc.done b { display: block; font-size: 14px; font-weight: 600; }
.dc.done small { font-size: 12px; color: var(--mute); }
.sk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.skc { display: flex; flex-direction: column; padding: 14px 16px; text-align: left; min-width: 0; }
.skc:hover, .skc.on { border-color: rgba(19, 19, 19, 0.24); }
.skc-top { display: flex; align-items: center; justify-content: space-between; font-size: 11px; color: var(--mute); }
.skc > b { margin-top: 10px; font: 650 16px/1.4 var(--display); }
.skc ol { margin: 8px 0 0; padding-left: 18px; font-size: 13px; line-height: 1.65; color: var(--ink-2); }
.skc-ft { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 12px; font-size: 11.5px; color: var(--mute); }
.skc-ft > span:nth-child(2) { flex: 1; }
.au-logos .logo { width: 22px; height: 22px; border-radius: 6px; font-size: 11px; box-shadow: 0 0 0 1.5px #fff; }
.au-logos .logo + .logo { margin-left: -5px; }
.pj-facts.sk-facts { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.sk-steps { margin: 0; padding: 6px 0; list-style: none; }
.sk-steps li { display: flex; gap: 14px; padding: 12px 18px; font-size: 15px; line-height: 1.55; }
.sk-steps li + li { border-top: 0.5px solid var(--line); }
.sk-steps li span { flex: none; width: 22px; height: 22px; border-radius: 11px; display: grid; place-items: center; font-size: 11px; color: #fff; background: var(--ink); margin-top: 1px; }
.sk-bar { display: flex; gap: 10px; padding: 14px 16px; font-size: 14.5px; line-height: 1.55; }
.sk-bar .ph { flex: none; margin-top: 3px; color: var(--green); }
.sk-bar code { padding: 1px 5px; border-radius: 5px; background: rgba(19, 19, 19, 0.05); font: 0.88em var(--mono); }
.sk-anti > div { display: flex; gap: 10px; padding: 12px 14px; font-size: 14px; color: var(--ink-2); }
.sk-anti .ph { margin-top: 3px; color: var(--mute); }
.sk-from { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.sk-from .card { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; }
.sk-from b { margin-top: 6px; font-size: 13.5px; font-weight: 600; }
.sk-from small { font-size: 11px; color: var(--mute); }
.sk-evo { padding: 4px 16px; }
.ev-r { display: grid; grid-template-columns: 34px 70px minmax(0, 1fr); gap: 10px; padding: 11px 0; font-size: 13.5px; color: var(--ink-2); }
.ev-r + .ev-r { border-top: 0.5px solid var(--line); }
.ev-r .mono { font-size: 11.5px; color: var(--mute); }
.ev-r.cur span:last-child { color: var(--ink); font-weight: 600; }
.how-l { margin: 0; padding: 4px 0; list-style: none; }
.how-l li { display: flex; gap: 12px; padding: 11px 14px; }
.how-l li + li { border-top: 0.5px solid var(--line); }
.how-l li > span { flex: none; width: 20px; height: 20px; border-radius: 10px; display: grid; place-items: center; font-size: 10.5px; background: var(--surface-2); border: 0.5px solid var(--line-2); }
.how-l b { display: block; font-size: 13.5px; font-weight: 600; }
.how-l small { display: block; margin-top: 2px; font-size: 12px; line-height: 1.5; color: var(--mute); }
.sk-use { padding: 12px 14px 10px; }
.sk-use svg { width: 100%; }

/* ---------- 导入 ---------- */
.imp-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 22px; border-top: 0.5px solid var(--line-2); border-bottom: 0.5px solid var(--line-2); }
.imp-flow > div { display: grid; grid-template-columns: 22px 1fr; column-gap: 10px; padding: 14px 16px 14px 0; }
.imp-flow > div + div { padding-left: 16px; border-left: 0.5px solid var(--line); }
.imp-flow .mono { grid-row: 1 / 3; width: 20px; height: 20px; border-radius: 10px; display: grid; place-items: center; font-size: 10.5px; color: #fff; background: var(--ink); }
.imp-flow b { font-size: 14px; font-weight: 600; }
.imp-flow small { font-size: 12px; line-height: 1.5; color: var(--mute); }
.imc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.imc { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; text-align: left; min-width: 0; }
.imc:hover, .imc.on { border-color: rgba(19, 19, 19, 0.24); }
.imc-hd { display: flex; align-items: center; gap: 10px; }
.imc-hd .logo { flex: none; width: 30px; height: 30px; border-radius: 9px; font-size: 15px; }
.imc-hd > span:nth-child(2) { flex: 1; min-width: 0; }
.imc-hd b { display: block; font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.imc-hd small { display: block; font-size: 11px; color: var(--mute); }
.imc-w { font-size: 12px; line-height: 1.5; color: var(--ink-2); }
.imc.off { background: transparent; border-style: dashed; }
.imc.off .logo { opacity: 0.6; }
.imc-add { font-size: 12px; font-weight: 600; color: var(--ink); }
.imp-cols { align-items: start; }
.clip { position: relative; padding: 14px; height: 268px; overflow: hidden; background: var(--surface-2); }
.clip-pg { position: absolute; left: 14px; top: 14px; width: 62%; bottom: -10px; border-radius: 10px; background: #fff; border: 0.5px solid var(--line-2); overflow: hidden; }
.clip-url { display: flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border-bottom: 0.5px solid var(--line); font-size: 9.5px; color: var(--mute); }
.clip-doc { display: grid; gap: 7px; padding: 14px 14px; font-size: 10.5px; line-height: 1.5; }
.clip-doc i { display: block; height: 5px; border-radius: 3px; background: #ececea; }
.clip-doc i.s { width: 60%; }
.clip-doc mark { padding: 2px 3px; border-radius: 3px; background: #fbe9b4; color: var(--ink); }
.clip-pop { position: absolute; right: 14px; top: 34px; width: 220px; padding: 12px; border-radius: 14px; background: #fff; border: 0.5px solid var(--line-2); box-shadow: 0 12px 30px -16px rgba(0, 0, 0, 0.3); }
.cp-hd { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--mute); }
.cp-hd b { font-weight: 600; color: var(--ink); }
.cp-t { display: block; margin-top: 10px; font-size: 13.5px; font-weight: 600; }
.clip-pop small { font-size: 10.5px; color: var(--mute); }
.cp-why { margin-top: 8px; padding: 7px 9px; border-radius: 9px; background: var(--surface-2); font-size: 12px; line-height: 1.5; color: var(--ink-2); }
.cp-why span { display: block; font-size: 10px; color: var(--mute); }
.cp-ft { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 10px; }
.imp-log .il { display: flex; align-items: center; gap: 10px; padding: 10px 14px; }
.il .logo { flex: none; width: 26px; height: 26px; border-radius: 8px; font-size: 13px; }
.il > span:not(.logo) { flex: 1; min-width: 0; }
.il b { display: block; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.il small { display: block; font-size: 11.5px; color: var(--mute); }
.il time { font-size: 10.5px; color: var(--mute); }
.imp-map .im { display: grid; grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr) 34px; gap: 6px; align-items: center; padding: 9px 12px; font-size: 11.5px; color: var(--ink-2); }
.im .ph { font-size: 11px; color: var(--mute-2); }
.im .mute { color: var(--mute-2); }
.im small { text-align: right; font-size: 10.5px; color: var(--mute); }
.im .mono { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- 存储 ---------- */
.stg-now { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding: 16px 18px; }
.stg-i { width: 44px; height: 44px; flex: none; border-radius: 13px; display: grid; place-items: center; font-size: 22px; background: var(--surface-2); border: 0.5px solid var(--line-2); }
.stg-now > div { flex: 1; min-width: 0; }
.stg-now .k { display: block; font-size: 11.5px; color: var(--mute); }
.stg-now b { display: block; margin-top: 2px; font: 650 18px var(--display); }
.stg-now small { font-size: 11.5px; color: var(--mute); }
.stg-pr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.stg-pr .card { display: flex; flex-direction: column; gap: 4px; padding: 14px; }
.stg-pr .card > span { font-size: 18px; color: var(--ink-2); }
.stg-pr b { margin-top: 6px; font-size: 13.5px; font-weight: 600; line-height: 1.4; }
.stg-pr small { font-size: 12px; line-height: 1.5; color: var(--mute); }
.stg-opts .so { display: grid; grid-template-columns: 18px 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; padding: 12px 16px; text-align: left; }
.so-r { width: 16px; height: 16px; border-radius: 8px; border: 1.5px solid var(--mute-2); }
.so.on .so-r { border: 5px solid var(--ink); }
.so-i { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; font-size: 16px; background: var(--surface-2); border: 0.5px solid var(--line); }
.so-b b { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; }
.so-b em { font-style: normal; height: 18px; padding: 0 6px; border-radius: 5px; font-size: 10.5px; font-weight: 500; line-height: 18px; color: var(--ink-2); background: var(--surface-2); border: 0.5px solid var(--line-2); }
.so-b small { display: block; margin-top: 2px; font-size: 12px; color: var(--mute); }
.so-p { font-size: 11px; color: var(--mute); }
.so:hover { background: var(--surface-2); }
.stg-use { padding: 16px; }
.su-bar { display: flex; gap: 2px; height: 10px; border-radius: 5px; overflow: hidden; }
.su-bar i { min-width: 4px; }
.su-0 { background: var(--ink); } .su-1 { background: #6e6e73; } .su-2 { background: #a9a9ae; } .su-3 { background: #dcdcd8; }
.su-l { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.su-l > div { display: grid; grid-template-columns: 10px 1fr; column-gap: 6px; align-items: center; }
.su-l i { width: 8px; height: 8px; border-radius: 2px; }
.su-l b { font-size: 13px; font-weight: 600; }
.su-l span { grid-column: 2; font-size: 12px; color: var(--ink); }
.su-l small { grid-column: 2; font-size: 11px; line-height: 1.45; color: var(--mute); }
.stg-dirs > div { display: grid; grid-template-columns: 16px 90px 1fr auto; gap: 8px; align-items: center; padding: 9px 14px; font-size: 12px; }
.stg-dirs .ph { color: var(--mute); }
.stg-dirs small { color: var(--mute); }
.stg-dirs b { font-size: 11px; font-weight: 500; color: var(--ink-2); }

/* ---------- 给 AI 用：复制粘贴 ---------- */
.share { padding: 16px 18px 18px; }
.sh-step { display: flex; align-items: center; gap: 8px; margin: 18px 0 10px; font-size: 14px; }
.sh-step:first-child { margin-top: 0; }
.sh-step .mono { width: 20px; height: 20px; border-radius: 10px; display: grid; place-items: center; font-size: 10.5px; color: #fff; background: var(--ink); }
.sh-step b { font-weight: 600; }
.sh-scopes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.sh-scopes button { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 14px; text-align: left; border: 0.5px solid var(--line-2); background: #fff; min-width: 0; }
.sh-scopes button.on { border: 1.5px solid var(--ink); padding: 9px 11px; }
.sh-scopes b { font-size: 13.5px; font-weight: 600; }
.sh-scopes small { font-size: 11.5px; color: var(--mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-scopes .mono { margin-top: 4px; font-size: 10.5px; color: var(--mute); }
.sh-fmt button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 30px; font-size: 13px; }
.sh-how { margin: 8px 2px 12px; font-size: 12.5px; line-height: 1.55; color: var(--mute); }
.sh-tip { display: flex; gap: 6px; margin: 10px 2px 0; font-size: 12px; line-height: 1.5; color: var(--mute); }
.sh-tip .ph { flex: none; margin-top: 2px; }
.sh-acts { display: flex; gap: 8px; margin-top: 10px; }
.zip-tree { padding: 10px 12px 4px; border-bottom: 0.5px solid var(--line); background: #fff; font-size: 11.5px; color: var(--ink-2); }
.zip-tree > div { display: flex; align-items: center; gap: 6px; height: 22px; padding-left: calc(var(--d) * 16px); }
.zip-tree .ph { font-size: 13px; color: var(--mute); }
.share.compact { padding: 12px; }
.share.compact .sh-fmt button { height: 28px; font-size: 12px; }
.share.compact .code pre { max-height: 200px; font-size: 11px; }
.share.compact .sh-acts .pill { width: 100%; }
.who-g { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 6px; }
.wh { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 12px; text-align: left; }
.wh:hover { background: var(--surface-2); }
.wh .logo { width: 28px; height: 28px; border-radius: 8px; font-size: 14px; }
.wh b { flex: 1; font-size: 13px; font-weight: 600; }
.wh-f { height: 20px; padding: 0 7px; border-radius: 6px; font-size: 11px; line-height: 20px; color: var(--mute); background: var(--surface-2); }
.wh-f.on { color: #fff; background: var(--ink); }
.fm-cmp > div { display: grid; grid-template-columns: 64px 1fr; gap: 2px 10px; padding: 10px 14px; }
.fm-cmp b { grid-row: 1 / 3; font-size: 13px; font-weight: 600; }
.fm-cmp small { font-size: 12px; color: var(--ink-2); }
.fm-cmp .mono { font-size: 10.5px; color: var(--mute); }
.ses-list { display: grid; gap: 12px; }
.ses { padding: 14px 16px; cursor: pointer; }
.ses:hover, .ses.sel { border-color: rgba(19, 19, 19, 0.24); }
.ses-hd { display: flex; align-items: center; gap: 12px; }
.ses-hd .logo { width: 32px; height: 32px; border-radius: 9px; font-size: 16px; }
.ses-hd > div { flex: 1; min-width: 0; }
.ses-hd b { display: block; font-size: 14.5px; font-weight: 600; }
.ses-hd small { display: block; margin-top: 2px; font-size: 12px; color: var(--mute); }
.ses-t { font-size: 14px; color: var(--ink); text-align: right; }
.ses-t small { display: block; font-size: 10px; color: var(--mute); }
.ses-rd { display: grid; gap: 6px; margin-top: 12px; padding-top: 12px; border-top: 0.5px solid var(--line); }
.ses-rd > div { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr) 40px; gap: 10px; align-items: center; font-size: 11.5px; color: var(--ink-2); }
.ses-rd > div > .mono:first-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ses-rd i { display: block; height: 5px; border-radius: 3px; background: #c9c9cc; }
.ses-rd b { font-size: 10.5px; font-weight: 500; color: var(--mute); text-align: right; }
.ses-rd .blk { grid-template-columns: 16px minmax(0, 260px) 1fr; color: var(--mute); }
.blk .mono { text-decoration: line-through; }
.blk small { font-size: 11px; }
.ses-pr { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 9px 12px; border-radius: 12px; background: var(--surface-2); font-size: 13px; color: var(--ink-2); }
.ses-pr > span:nth-child(2) { flex: 1; }
.ses-pr .dec-act { margin: 0; }
.ses-pr.done .ph { color: var(--green); }
.blk-c { display: flex; gap: 10px; padding: 12px 14px; }
.blk-c > .ph { font-size: 18px; color: var(--mute); }
.blk-c b { display: block; font-size: 13px; font-weight: 600; }
.blk-c small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--mute); }
.wk-st { padding: 0 !important; }

/* ---------- 侧栏补充 ---------- */
.s-gh { margin-top: 14px; }
.gw { width: 100%; text-align: left; }
.gw-i { width: 28px; height: 28px; flex: none; border-radius: 8px; display: grid; place-items: center; font-size: 15px; background: #fff; border: 0.5px solid var(--line); color: var(--ink-2); }
.gw:hover { background: #fff; }
.sync { width: 100%; text-align: left; }
.sync .live { width: 6px; height: 6px; box-shadow: none; margin-right: 2px; }
.sync:hover { color: var(--ink); }

/* ---------- 窄窗口 ---------- */
@media (max-width: 1440px) {
  .sh-scopes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stg-pr { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .imc-grid, .srcs-g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .who-g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sk-from { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac-r { grid-template-columns: minmax(0, 1fr) 180px; }
  .ac-r svg { width: 180px; }
  .ac-u { display: none; }
  .pj-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pj-facts > div:nth-child(4) { padding-left: 0; border-left: 0; }
  .pj-facts > div:nth-child(n+4) { border-top: 0.5px solid var(--line); }
}
@media (max-width: 1340px) {
  .pj-cols, .imp-cols { grid-template-columns: minmax(0, 1fr) !important; }
  .dc-row, .sk-grid, .sk-row { grid-template-columns: minmax(0, 1fr); }
  .kg-q { width: 200px; }
  .kg-wrap { height: 480px; }
}

/* ---------- iOS：复用上面的视图，改成单列、带左右留白 ---------- */
.mw .pg-hd { display: block; padding: 6px var(--gx) 0; }
.mw .pg-hd .d-h1 { margin: 6px 0 0; font: 700 34px/1.12 var(--display); letter-spacing: -0.02em; }
.mw .pg-sub { font-size: 15px; }
.mw .pg-r { margin-top: 14px; }
.mw .back-l { margin: 0 var(--gx) 8px; }
.mw .imp-flow { grid-template-columns: 1fr; margin: 18px var(--gx) 0; }
.mw .imp-flow > div + div { padding-left: 0; border-left: 0; border-top: 0.5px solid var(--line); }
.mw .imc-grid, .mw .sk-grid, .mw .dc-row, .mw .sk-row { grid-template-columns: 1fr; padding: 0 var(--gx); }
.mw .stg-pr, .mw .sk-from { grid-template-columns: 1fr 1fr; padding: 0 var(--gx); }
.mw .imc-grid > .card, .mw .sk-grid > .card, .mw .dc-row > .card, .mw .stg-pr > .card, .mw .sk-from > .card { margin: 0; }
.mw .stg-now { margin-top: 18px; }
.mw .pj-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 18px var(--gx) 0; }
.mw .pj-facts > div:nth-child(4) { padding-left: 0; border-left: 0; }
.mw .pj-facts > div:nth-child(n+4) { border-top: 0.5px solid var(--line); }
.mw .ac-r { grid-template-columns: minmax(0, 1fr) 118px; gap: 10px; }
.mw .ac-r svg { width: 118px; }
.mw .ac-u { display: none; }
.mw .ac-k b { font-size: 22px; }
.mw .stg-opts .so { grid-template-columns: 18px 30px minmax(0, 1fr); }
.mw .so-p { display: none; }
.mw .su-l { grid-template-columns: 1fr 1fr; }
.mw .clip-pg { width: 58%; }
.mw .clip-pop { width: 190px; }
.mw .sk-steps li { padding: 12px 14px; font-size: 14.5px; }
.m-rd { padding: 0 var(--gx); }
.m-rd .rd-meta { margin-top: 2px; }
.m-rd .props { margin-top: 16px; }
.m-rd .prop { grid-template-columns: 110px minmax(0, 1fr); }
.m-rd .mdv { font-size: 15.5px; line-height: 1.75; }
.m-rd .callout { margin-left: 0; margin-right: 0; }
.m-rd .pv:not(.pv-new) { display: none; }
.m-skills { padding-bottom: 6px; }
.m-skills .skc { width: 270px; margin: 0; }
.phone .sh-scopes { grid-template-columns: 1fr 1fr; }
.phone .share { padding: 14px; }
.phone .share .code pre { max-height: 220px; }
.phone .src-tile .st-ico .logo { width: 30px; height: 30px; border-radius: 9px; }
.imp-kv .set { height: auto; min-height: 46px; padding: 10px 14px; align-items: flex-start; }
.imp-kv .set span { flex: none !important; width: 48px; color: var(--mute); font-size: 13.5px; }
.imp-kv .set small { flex: 1; color: var(--ink-2); font-size: 13.5px; line-height: 1.5; }
.sheet .imp-map { margin: 0 14px; }
.share .seg { margin: 0 !important; }
