/* ---- prose.css ---- */
/* 正文语义版式：convert.py 输出的行内格式（m）、段落样式（cls）、列表（li）与附录截图（img）。
   只用 site.css 的颜色变量，深色模式、护眼绿/羊皮背景自动适配。中文排版优先，克制。 */
:root {
  --f-fs: "FangSong", "STFangsong", "Fangsong SC", "FangSong_GB2312", var(--f-kai);
  --f-mono: ui-monospace, "SF Mono", Menlo, Consolas, "PingFang SC", "Microsoft YaHei", monospace;
  --letter: #2A4170; /* 墨蓝 */
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --letter: #A9BEEB; } }
:root[data-theme="dark"] { --letter: #A9BEEB; }

/* ---------- 行内格式 ---------- */
/* 中文斜体在宋体下是机械倾斜，改用楷体表示强调；阅读字体本身是楷体时退回宋体 */
/* 不少系统没有楷体（macOS 需另行下载、iOS/Android 没有），再加一点墨蓝色调保证可辨认 */
.prose em { font-style: normal; font-family: var(--f-kai); color: color-mix(in srgb, var(--ink) 72%, var(--blue)); }
:root[data-font="kai"] .prose em { font-family: var(--f-read); }
.prose u {
  text-decoration: underline; text-decoration-color: var(--pink); text-decoration-thickness: 1px;
  text-underline-offset: .3em; text-decoration-skip-ink: none;
}
/* MR.MAN 的神经链路传音：楷体 + 下划线，再用墨蓝区分于叙述 */
.prose em u, .prose u em { color: var(--letter); }
.prose code.ic {
  font-family: inherit; font-size: .94em; padding: 0 .28em; margin: 0 .08em;
  background: var(--paper-2); border: 1px solid var(--line); border-radius: 3px;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* ---------- 段落样式容器（连续同 cls 的块为一组） ---------- */
.prose .blk { margin: 1.1em 0 1.3em; }
.prose .blk > p, .prose .blk li { text-indent: 0; }
.prose .blk .bh { font-size: 1em; font-weight: 700; margin: .9em 0 .25em; line-height: 1.6; font-family: inherit; text-align: left; }
.prose .blk .bh:first-child { margin-top: 0; }
.prose .blk .cc { margin-bottom: .4em; }

/* 公文 / 文件 / 病例：仿宋，左侧细墨线，缩进，紧排 */
.prose .blk-doc {
  font-family: var(--f-fs); line-height: 1.75;
  margin-left: .5em; padding: .15em 0 .15em 1.1em; border-left: 2px solid var(--line-2);
}
.prose .blk-doc > p { margin: 0 0 .2em; }

/* 书信：楷体，略缩进，墨蓝 */
.prose .blk-letter { font-family: var(--f-kai); color: var(--letter); padding: 0 1em 0 1.5em; }
.prose .blk-letter > p { text-indent: 2em; margin: 0 0 .3em; }
.prose .blk-letter > p:first-child { text-indent: 0; }

/* 异体字体段：楷体，保持正文版式 */
.prose .blk-alt { font-family: var(--f-kai); }
.prose .blk-alt > p { text-indent: 2em; margin: 0 0 calc(var(--read-lh) * .28em); }
:root[data-font="kai"] .prose .blk-alt { font-family: var(--f-read); }

/* 题记：小一号，muted，靠右 */
.prose .blk-epi {
  font-size: .9em; line-height: 1.85; color: var(--muted);
  max-width: 26em; margin: .5em 0 2.4em auto; text-align: left;
}
.prose .blk-epi > p { margin: 0 0 .2em; }

/* 系统提示 / 屏幕文字：界面字体，浅灰底，细边框，紧排 */
.prose .blk-sys {
  font-family: var(--f-ui); font-size: .86em; line-height: 1.6; text-align: left;
  background: var(--paper-2); border: 1px solid var(--line); border-radius: 4px;
  padding: .55em .95em; margin: .9em 0 1.1em;
}
.prose .blk-sys > p { margin: .15em 0; }

/* 引文 / 聊天消息：左竖线，muted */
.prose .blk-q { border-left: 3px solid var(--line-2); padding: .1em 0 .1em 1em; color: var(--muted); }
.prose .blk-q > p { margin: 0 0 .3em; }
.prose .blk-q > p:last-child { margin-bottom: 0; }

/* 等宽日志：逐行，保留空白 */
.prose .blk-code {
  font-family: var(--f-mono); font-size: .8em; line-height: 1.6; text-align: left;
  background: var(--paper-2); border-radius: 3px; padding: .6em .9em;
}
.prose .blk-code > p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }

/* 区块（文件、报告框）：细墨线边框，仿宋 */
.prose .blk-box {
  font-family: var(--f-fs); font-size: .95em; line-height: 1.75; text-align: left;
  border: 1px solid var(--line-2); padding: 1em 1.2em; margin: 1.4em 0 1.6em;
}
.prose .blk-box > p { margin: 0 0 .25em; }
/* 报告框里用全角空格并排的「字段：值」（如《转人工》的「对象：……　　岗位：……」）：按词断行，
   只在空格与标点处换行，窄屏不会折成「岗 / 位」；一个词长过整行时仍可在任意处断开，不会撑出横向滚动 */
.prose .blk-box > p, .prose .blk-box li { word-break: keep-all; overflow-wrap: anywhere; }
.prose .blk-box .tbl { font-family: var(--f-ui); }

/* 右对齐（落款、日期） */
.prose .blk-right { text-align: right; }
.prose .blk-right > p { margin: 0; }

/* ---------- 列表 ---------- */
.prose .lst { margin: .3em 0 .8em; padding-left: 2em; }
.prose .lst li { margin: .12em 0; text-indent: 0; }
.prose ul.lst-0 { list-style: disc; }
.prose ul.lst-1 { list-style: circle; padding-left: 1.4em; margin: .1em 0 .2em; }
.prose ol.lst { list-style: decimal; }
.prose .li-sub { list-style: none; }
.prose .lst li::marker { color: var(--muted); }
.prose .blk-box .lst, .prose .blk-q .lst { margin: .1em 0 .3em; }

/* ---------- 附录截图 ---------- */
.prose .fig { margin: 1.2em 0 1.4em; text-align: center; text-indent: 0; }
.prose .fig img { display: inline-block; max-width: 100%; height: auto; border: 1px solid var(--line); background: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .prose .fig img { filter: brightness(.88); } }
:root[data-theme="dark"] .prose .fig img { filter: brightness(.88); }

/* ---------- 列表项也可划线：沿用段落的热门线与定位高亮 ---------- */
#text li[data-hot] { position: relative; }
#text li[data-hot]::before {
  content: ""; position: absolute; left: -2.6em; top: .45em; bottom: .45em; width: 2px;
  background: var(--pink); opacity: .45; pointer-events: none;
}
#text li[data-hot="2"]::before { opacity: .7; }
#text li[data-hot="3"]::before { width: 3px; opacity: .9; }
#text li.rx-flash { animation: rx-flash 2.4s ease-out 1; }
@media (prefers-reduced-motion: reduce) { #text li.rx-flash { animation: none; background-color: var(--flash); } }

/* ---------- 手机宽度 ---------- */
@media (max-width: 719px) {
  .prose .blk-doc { margin-left: 0; padding-left: .8em; }
  .prose .blk-letter { padding: 0 0 0 .8em; }
  .prose .blk-epi { max-width: none; margin-left: 1.5em; }
  .prose .blk-box { padding: .8em .85em; }
  .prose .blk-code { font-size: .76em; padding: .5em .7em; }
  .prose .lst { padding-left: 1.6em; }
}

/* 表格单元格的 .nw（不换行）与 reader.css「我的笔记」页的 .nw 同名，这里还原 */
.prose .tbl td.nw { border-top: 0; padding-top: .55em; margin-top: 0; }

/* ---- reader.css ---- */
/* 海豹杯 2026 — 阅读增强：划线、笔记、热门划线（片段级虚线）、段落高亮，以及「我的笔记」页。
   颜色沿用套印：黄 = 马克笔，粉 / 蓝 / 墨 = 下划线。 */

:root {
  --hl-y: rgba(255, 232, 0, .78);
  --flash: rgba(255, 72, 176, .24);
  --hl-del: #FF7CC6;   /* 工具条底色为墨色：用浅粉 */
  --hot-line: rgba(30, 33, 64, .62);      /* 热门划线虚线：墨色半透明，纸色 / 护眼绿 / 羊皮背景上都清楚 */
  --hot-bg: rgba(0, 120, 191, .13);       /* 气泡打开时片段的底色（套印蓝） */
  --hot-shadow: var(--blue);
}
:root[data-bg="green"], :root[data-bg="sepia"] { --hot-line: rgba(30, 33, 64, .7); --hot-bg: rgba(0, 120, 191, .15); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --hl-y: rgba(255, 232, 0, .30); --flash: rgba(255, 72, 176, .30); --hl-del: #B8006B;
    --hot-line: rgba(230, 231, 238, .62); --hot-bg: rgba(80, 170, 240, .22);
  }
}
:root[data-theme="dark"] {
  --hl-y: rgba(255, 232, 0, .30); --flash: rgba(255, 72, 176, .30); --hl-del: #B8006B;
  --hot-line: rgba(230, 231, 238, .62); --hot-bg: rgba(80, 170, 240, .22);
}

#text { position: relative; }

/* ---------- 划线 ---------- */
mark.hl {
  color: inherit; background: none; padding: 0; border-radius: 0; cursor: pointer;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  text-decoration-skip-ink: none;
}
mark.hl-yellow { background-image: linear-gradient(transparent 28%, var(--hl-y) 28%, var(--hl-y) 92%, transparent 92%); }
mark.hl-pink, mark.hl-blue, mark.hl-ink { text-decoration-line: underline; text-underline-offset: .32em; text-decoration-thickness: 2.5px; }
mark.hl-pink { text-decoration-color: var(--pink); }
mark.hl-blue { text-decoration-color: var(--blue); }
mark.hl-ink { text-decoration-color: var(--ink); text-decoration-thickness: 1.5px; }
mark.hl.is-active { outline: 1.5px dashed var(--line-2); outline-offset: 2px; }
mark.hl:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }

/* 段尾笔记图标（不含文字节点，不影响偏移计算与复制） */
.rx-note {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 1.25em; height: 1.25em; margin: 0 0 0 .2em; padding: 0; vertical-align: -.12em;
  border: 0; background: transparent; color: var(--ink); text-indent: 0; cursor: pointer;
  -webkit-user-select: none; user-select: none;
}
.rx-note::after { content: ""; position: absolute; inset: -8px; }
.rx-note svg { width: .9em; height: .9em; fill: var(--c, var(--yellow)); stroke: var(--ink); stroke-width: 1.3; stroke-linejoin: round; }
.rx-note-yellow { --c: var(--yellow); }
.rx-note-pink { --c: var(--pink); }
.rx-note-blue { --c: var(--blue); }
.rx-note-ink { --c: var(--ink); }

/* ---------- 热门划线（多人划过的片段）：细虚线下划线，紧贴文字；本人划线的实线下划线更低更粗，两者可叠加 ----------
   优先用 CSS Custom Highlight API（::highlight，不改 DOM）；不支持时 reader.js 退回 <mark class="hot"> 包裹。 */
::highlight(hb-hot) {
  text-decoration-line: underline; text-decoration-style: dashed; text-decoration-color: var(--hot-line);
  text-decoration-thickness: 1.5px; text-underline-offset: .14em;
}
::highlight(hb-hot-on) { background-color: var(--hot-bg); }
mark.hot {
  color: inherit; background: none; padding: 0; border-radius: 0;
  text-decoration: underline dashed var(--hot-line); text-decoration-thickness: 1.5px; text-underline-offset: .14em;
  text-decoration-skip-ink: none; -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
mark.hot.is-on { background-color: var(--hot-bg); }
#text.hot-hover, #text mark.hot { cursor: pointer; }
/* 键盘入口：片段开头不含文字的锚点，只在键盘聚焦时可见 */
.rx-hk { display: inline-block; width: 0; height: 1.1em; vertical-align: -.18em; outline: none; }
.rx-hk:focus-visible { outline: 2px solid var(--blue); outline-offset: 1px; }

.hot-pop {
  position: absolute; z-index: 56; display: flex; align-items: center; gap: 12px; padding: 6px 6px 6px 12px;
  background: var(--paper); color: var(--ink); border: 1.5px solid var(--ink); border-radius: 2px;
  box-shadow: 3px 3px 0 var(--hot-shadow);
  font: 14px/1.4 var(--f-ui); text-indent: 0; text-align: left; white-space: nowrap;
  -webkit-user-select: none; user-select: none;
}
.hot-pop p { margin: 0; text-indent: 0; }
.hot-pop .hot-n b { font-family: var(--f-display); font-weight: 700; font-size: 17px; margin-right: 1px; font-variant-numeric: tabular-nums; }
.hot-pop .hot-n:focus { outline: none; }
.hot-pop .hot-me { color: var(--muted); font-size: 13px; padding-right: 6px; }
.hot-pop .hot-join { min-height: 36px; padding: 2px 12px; font-size: 14px; }
@media (pointer: coarse) { .hot-pop .hot-join { min-height: 40px; } }
.hl-bar .hl-hotn { padding: 0 6px 0 8px; font-size: 13px; opacity: .85; font-variant-numeric: tabular-nums; }

/* ---------- 段落定位高亮（#p-N）：套印粉底淡出 ---------- */
@keyframes rx-flash { from { background-color: var(--flash); } to { background-color: transparent; } }
#text p.rx-flash { animation: rx-flash 2.4s ease-out 1; box-shadow: -8px 0 0 transparent; }

/* ---------- 选区工具条 ---------- */
.hl-bar {
  position: absolute; z-index: 55; display: flex; align-items: center; gap: 1px; padding: 3px;
  background: var(--ink); color: var(--paper); border-radius: 2px; box-shadow: 3px 3px 0 var(--pink);
  font: 14px/1.2 var(--f-ui); text-indent: 0; text-align: left; white-space: nowrap;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.hl-bar button {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; min-width: 40px; padding: 0 9px;
  border: 0; border-radius: 2px; background: transparent; color: inherit; font-size: 14px;
}
.hl-bar button:hover { background: rgba(127, 128, 140, .28); }
.hl-bar button:focus-visible { outline: 2px solid var(--yellow); outline-offset: -2px; }
.hl-bar .hl-sep { align-self: stretch; width: 1px; margin: 7px 3px; background: currentColor; opacity: .3; }
.hl-bar i { display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px currentColor; flex: none; }
.hl-bar .hl-sw { min-width: 30px; padding: 0 7px; }
.hl-bar .hl-sw[aria-pressed="true"] i { box-shadow: 0 0 0 2px var(--ink), 0 0 0 4px currentColor; }
.hl-sw-yellow, .hl-main-yellow { --c: var(--yellow); }
.hl-sw-pink, .hl-main-pink { --c: var(--pink); }
.hl-sw-blue, .hl-main-blue { --c: var(--blue); }
.hl-sw-ink, .hl-main-ink { --c: var(--ink); }
.hl-bar .hl-main { font-weight: 600; }
.hl-bar .hl-del { color: var(--hl-del); }
@media (max-width: 380px) { .hl-bar button { padding: 0 7px; } .hl-bar .hl-sw { min-width: 28px; padding: 0 6px; } }

/* ---------- 笔记编辑 / 查看气泡 ---------- */
.hl-pop {
  position: absolute; z-index: 56; width: min(420px, calc(100vw - 32px));
  padding: 12px 14px 14px; background: var(--paper); color: var(--ink);
  border: 2px solid var(--ink); border-radius: 2px; box-shadow: 4px 4px 0 var(--c, var(--yellow));
  font: 15px/1.6 var(--f-ui); text-indent: 0; text-align: left;
}
.hl-pop-yellow { --c: var(--yellow); }
.hl-pop-pink { --c: var(--pink); }
.hl-pop-blue { --c: var(--blue); }
.hl-pop-ink { --c: var(--line-2); }
.hl-pop-h { margin: 0 0 6px; font-family: var(--f-display); font-weight: 700; font-size: 17px; }
.hl-pop blockquote {
  margin: 0 0 10px; padding-left: 10px; border-left: 3px solid var(--c, var(--yellow));
  color: var(--muted); font-size: 14px; line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.hl-pop textarea {
  display: block; width: 100%; min-height: 6.5em; padding: 8px 10px; resize: vertical;
  border: 1.5px solid var(--line-2); border-radius: 2px; background: var(--paper); color: var(--ink);
  font-size: 16px; line-height: 1.6;
}
.hl-pop textarea:focus { border-color: var(--ink); }
.hl-pop .note-text { margin: 0; text-indent: 0; white-space: pre-wrap; font-size: 16px; line-height: 1.75; max-height: 50vh; overflow: auto; }
.hl-pop .acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.hl-pop .acts .btn { min-height: 40px; padding: 4px 14px; font-size: 15px; }
.hl-pop .cnt { margin-right: auto; font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }

/* ---------- 我的笔记 ---------- */
.notes-bar { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 8px; }
.nw { border-top: 2px solid var(--ink); padding-top: 14px; margin-top: 28px; }
.nw h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; margin: 0 0 4px; font-family: var(--f-display); font-weight: 700; font-size: 24px; line-height: 1.3; }
.nw h2 a { text-decoration: none; }
.nw h2 a:hover { text-decoration: underline; text-decoration-color: var(--pink); }
.nw-a, .nw-c { font-family: var(--f-ui); font-weight: 400; font-size: 14px; color: var(--muted); }
.nl { list-style: none; margin: 0; padding: 0; }
.ni { padding: 14px 0; border-bottom: 1px solid var(--line); }
.ni:last-child { border-bottom: 0; }
.ni-q {
  display: block; padding-left: 12px; border-left: 4px solid var(--c);
  font-family: var(--f-read); font-size: 17px; line-height: 1.85; text-decoration: none; white-space: pre-line;
}
.ni-q:hover { text-decoration: underline; text-decoration-color: var(--c); text-decoration-thickness: 2px; }
.ni-yellow { --c: var(--yellow); }
.ni-pink { --c: var(--pink); }
.ni-blue { --c: var(--blue); }
.ni-ink { --c: var(--ink); }
.ni-note { margin: 8px 0 0 16px; white-space: pre-wrap; font-size: 15px; line-height: 1.7; }
.ni-note b { margin-right: .6em; font-size: 13px; color: var(--muted); font-weight: 600; }
.ni-meta { margin: 6px 0 0 16px; font-size: 13px; color: var(--muted); }
.notes-empty p { margin: 0 0 10px; }
.notes-empty ol { margin: 0 0 12px; padding-left: 1.4em; max-width: 36em; }
.notes-empty li { margin: 4px 0; }
.notes-empty .muted { color: var(--muted); font-size: 15px; max-width: 36em; }

@media (prefers-reduced-motion: reduce) {
  #text p.rx-flash { animation: none; background-color: var(--flash); }
}

/* ---- share.css ---- */
/* 海豹杯 2026 — 分享面板（share.js）。沿用 site.css 的颜色变量：粗墨线、套印错位阴影。
   手机为底部弹出面板，桌面为居中对话框。 */

/* html.sh-open（锁滚动）与微信引导遮罩 .sh-wx 在 site.css：首页的打包下载也要用 */

.sh { --sh-c: var(--pink); position: fixed; inset: 0; z-index: 80; display: flex; align-items: flex-end; justify-content: center; }
.sh-j-ai { --sh-c: var(--blue); }
.sh-j-rod { --sh-c: var(--yellow); }
.sh-scrim { position: absolute; inset: 0; background: rgba(30, 33, 64, .48); }

.sh-box {
  position: relative; width: 100%; max-height: min(92vh, 92dvh); overflow: auto; overscroll-behavior: contain;
  background: var(--paper); color: var(--ink);
  border-top: 2px solid var(--ink);
  box-shadow: 0 -6px 0 var(--sh-c);
  padding: 4px var(--gutter, 16px) calc(20px + env(safe-area-inset-bottom, 0px));
  animation: sh-up .18s cubic-bezier(.2, .7, .1, 1);
}
.sh-box:focus { outline: none; }
@keyframes sh-up { from { transform: translateY(24px); } to { transform: none; } }

@media (min-width: 720px) {
  .sh { align-items: center; padding: 24px; }
  .sh-box {
    width: min(480px, 100%); max-height: min(86vh, 760px);
    border: 2px solid var(--ink); border-radius: 2px;
    box-shadow: 6px 6px 0 var(--sh-c);
    padding: 4px 24px 24px;
    animation: none;
  }
}
@media (prefers-reduced-motion: reduce) { .sh-box { animation: none; } }

/* 标题行 */
.sh-head { position: sticky; top: -4px; z-index: 1; display: flex; align-items: center; gap: 4px; margin: 0 -4px; padding: 8px 0 6px; background: var(--paper); }
.sh-h { flex: 1 1 auto; min-width: 0; margin: 0 0 0 4px; font-family: var(--f-display); font-weight: 700; font-synthesis: none; font-size: 21px; line-height: 1.3; }
.sh-back + .sh-h { margin-left: 0; }
.sh-ib { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--ink); border-radius: 2px; }
.sh-ib svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sh-ib:hover { background: var(--paper-2); }

/* 引文预览 */
.sh-quote { margin: 4px 0 14px; padding: 2px 0 2px 14px; border-left: 4px solid var(--sh-c); }
.sh-qt {
  margin: 0; font-family: var(--f-read); font-size: 16px; line-height: 1.8; white-space: pre-line;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;
}
.sh-qc { margin-top: 6px; font-size: 13px; color: var(--muted); }

/* 链接 */
.sh-link { padding: 12px 0 14px; border-top: 1px solid var(--line-2); }
.sh-ttl { margin: 0 0 8px; font-family: var(--f-display); font-weight: 700; font-synthesis: none; font-size: 17px; line-height: 1.4; }
.sh-url {
  display: block; width: 100%; min-height: 44px; padding: 8px 12px;
  border: 1.5px solid var(--line-2); border-radius: 2px; background: var(--paper-2); color: var(--ink);
  font-size: 15px; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; text-overflow: ellipsis;
}
.sh-url:focus { border-color: var(--ink); }

/* 渠道 */
.sh-ch { list-style: none; margin: 0; padding: 14px 0 2px; border-top: 1px solid var(--line-2); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 8px; }
.sh-ch li { min-width: 0; }
.sh-c {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  width: 100%; min-height: 76px; padding: 10px 2px 8px;
  border: 1.5px solid var(--ink); border-radius: 2px; background: transparent; color: var(--ink);
  font-size: 14px; line-height: 1.2; text-decoration: none; text-align: center;
  transition: box-shadow .12s, transform .12s;
}
.sh-c svg { width: 26px; height: 26px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sh-c:hover { box-shadow: 3px 3px 0 var(--sh-c); text-decoration: none; }
.sh-c:active { transform: translate(1px, 1px); box-shadow: none; }
.sh-cl { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-c[data-ch="wx"] { background: var(--ink); color: var(--paper); }
.sh-c[data-ch="wx"]:hover { box-shadow: 3px 3px 0 var(--sh-c); }
@media (prefers-reduced-motion: reduce) { .sh-c { transition: none; } }

/* 二级视图 */
.sh-sub { padding-top: 4px; }
.sh-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.sh-btn { flex: 1 1 auto; }
.sh-note { margin: 12px 0 0; font-size: 14px; color: var(--muted); text-align: center; }

/* 二维码：深色模式下也保持浅底深码，便于扫码 */
.sh-qr { text-align: center; padding: 8px 0 0; }
.sh-qr-img { display: inline-block; width: min(232px, 64vw); padding: 0; border: 2px solid var(--ink); background: #EEEFEA; box-shadow: 5px 5px 0 var(--sh-c); }
.sh-qr-img svg { display: block; width: 100%; height: auto; }
.sh-qr-img .sh-note { padding: 24px 12px; color: #1E2140; }
.sh-qr-t { margin: 20px auto 0; max-width: 22em; font-size: 16px; line-height: 1.6; text-wrap: balance; }

/* 分享图 */
.sh-seg { display: flex; width: max-content; max-width: 100%; margin: 0 auto 14px; border: 1.5px solid var(--ink); border-radius: 2px; }
.sh-seg button { min-height: 44px; min-width: 88px; padding: 6px 16px; border: 0; background: transparent; color: var(--ink); font-size: 15px; }
.sh-seg button + button { border-left: 1px solid var(--line-2); }
.sh-seg button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.sh-stage { position: relative; display: flex; align-items: center; justify-content: center; width: min(100%, 360px); margin: 0 auto; aspect-ratio: 3 / 4; background: var(--paper-2); outline: 1px solid var(--line); }
.sh-status { margin: 0; padding: 0 20px; text-align: center; color: var(--muted); font-size: 15px; }
.sh-img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; box-shadow: 5px 5px 0 var(--sh-c); -webkit-touch-callout: default; user-select: auto; }
@media (max-height: 700px) and (max-width: 719px) { .sh-stage { width: min(100%, 300px); } }