/* 司宏伟 · 算盘：一张铺着绿呢的桌面。算盘是红木框、乌木珠；纸是马尼拉色的穿孔卡，卡上的数字印成橙红；
   桌面上的字是象牙色，卡片里的字是墨色——同一组变量在卡片里重新定义。 */
.c-si-hongwei {
  --felt: #20392f; --felt-2: #182c24; --wood: #4a2016; --wood-2: #6b3324; --amber: #e0a43a; --manila: #f1e8cc; --manila-2: #e4d7b1;
  --bg: var(--felt); --paper: var(--manila);
  --ink: #f1e8cc; --ink-2: rgba(241, 232, 204, .84); --ink-3: rgba(241, 232, 204, .68); --rule: rgba(241, 232, 204, .2);
  --acc: #e0a43a; --acc-ink: #1e1a15; --print: #c4573a;
  --head: "ZCOOL QingKe HuangYou", "Noto Sans SC", sans-serif; --body: "Noto Sans SC", "PingFang SC", sans-serif; --dot: "Doto", ui-monospace, monospace;
  --num: "Noto Sans SC", "PingFang SC", sans-serif;
  --bar-bg: rgba(43, 22, 16, .96); --bar-ink: #f1e8cc; --chip-bg: rgba(255, 255, 255, .5); --chip-ring: #f1e8cc;
  background-color: var(--felt);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 .9  0 0 0 .55 -.18'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.16'/></svg>"),
    radial-gradient(120% 70% at 50% 0%, rgba(255, 255, 255, .07), transparent 60%), radial-gradient(90% 60% at 50% 100%, rgba(0, 0, 0, .22), transparent 70%);
  background-attachment: fixed;
}
/* 卡片与纸面：字变回墨色 */
.sh-card, .sh-idx, .sh-gb, .sh-gantt, .sh-route, .sh-room, .sh-micro {
  --ink: #1e1a15; --ink-2: #4a4234; --ink-3: #6a604b; --rule: rgba(30, 26, 21, .2); --acc: #a63d27; --acc-ink: #fff; color: var(--ink);
}
.c-si-hongwei .dlg { --dlg-bg: #ece2c4; --dlg-paper: #fbf7ea; --dlg-ink: #1e1a15; --dlg-ink-2: #4a4234; --dlg-ink-3: #6a604b; --dlg-me: #20392f; --dlg-me-ink: #f3eedf; --dlg-acc: #a63d27; }
.c-si-hongwei .c3bar { border-bottom: 1px solid #120906; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .25); font-family: var(--body); }
.c-si-hongwei .c3bar__t a { font-family: var(--head); font-weight: 400; font-size: 17px; letter-spacing: .04em; }
.c-si-hongwei .c3bar__prog { background: var(--amber); height: 3px; }
.c-si-hongwei .mk { font-family: var(--body); font-weight: 700; font-size: 12.5px; letter-spacing: .16em; color: var(--acc); }
.c-si-hongwei :focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.sh-card :focus-visible, .sh-idx :focus-visible { outline-color: #a63d27; }

/* ---------- 导航：一根算盘档 ---------- */
.c-si-hongwei .c3toc { right: 18px; }
.sh-nav { position: relative; width: 52px; padding: 0; display: flex; flex-direction: column; align-items: center; }
.sh-nav::before { content: ""; position: absolute; left: 50%; top: 14px; bottom: 14px; width: 3px; margin-left: -1.5px; background: linear-gradient(90deg, #a88a56, #e3cf9c, #a88a56); border-radius: 2px; }
.sh-nb { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 40px; text-decoration: none; color: var(--ink); }
.sh-nb b, .sh-nb span { position: absolute; right: 60px; white-space: nowrap; font-family: var(--body); line-height: 1.2; pointer-events: none; }
.sh-nb b { font-family: var(--num); font-weight: 700; font-size: 13px; letter-spacing: .02em; color: var(--ink-3); transition: color .2s; }
.sh-nb--top b, .sh-nb--h b { font-family: var(--head); font-weight: 400; font-size: 14px; }
.sh-nb span { right: 104px; max-width: 0; overflow: hidden; padding: 4px 0; font-size: 13px; color: #1e1a15; background: var(--manila); border-radius: 2px; box-shadow: 0 6px 14px rgba(0, 0, 0, .3); opacity: 0; transition: opacity .2s, max-width .25s; }
.sh-nb:hover span, .sh-nb:focus-visible span { max-width: 18em; padding: 4px 9px; opacity: 1; }
.sh-nb[aria-current="true"] b { color: var(--amber); }
.c-si-hongwei .c3toc a::after { display: none; }
.sh-nb__b { display: block; width: 40px; height: 18px; transition: transform .22s cubic-bezier(.3, 1.5, .5, 1);
  clip-path: polygon(0 50%, 16% 6%, 34% 0, 66% 0, 84% 6%, 100% 50%, 84% 94%, 66% 100%, 34% 100%, 16% 94%);
  background: radial-gradient(70% 90% at 45% 25%, #8a5640, #3e1d12 55%, #1a0b06); }
.sh-nb.is-on .sh-nb__b { background: radial-gradient(70% 90% at 45% 25%, #ffe2a0, #d98b2b 55%, #7a3f0d); }
.sh-nb__cap { display: block; width: 50px; height: 12px; border-radius: 3px; background: linear-gradient(#6b3324, #3a1810); box-shadow: 0 2px 4px rgba(0, 0, 0, .5); }
.sh-nb--top { height: 40px; }
.sh-nb--top b { font-size: 13px; }
.sh-nav__h { padding: 0 0 14px; }
.sh-nav__beam { position: relative; z-index: 1; display: block; width: 52px; height: 10px; background: linear-gradient(#7a3b28, #4a2016); box-shadow: 0 2px 3px rgba(0, 0, 0, .45); }
.sh-nav__beam::after { content: ""; position: absolute; left: 50%; top: 2.5px; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: #e3cf9c; }
.sh-nav__e { padding: 18px 0 0; }
.sh-nb--h.is-on .sh-nb__b { transform: translateY(14px); }
.sh-nb--e.is-on .sh-nb__b { transform: translateY(-18px); }
.sh-nb__cap--b { margin-top: 2px; }

/* ---------- 首屏 ---------- */
.c-si-hongwei .c3hero { padding-top: calc(var(--bar) + 18px); padding-bottom: 46px; }
.sh-hero { max-width: 1260px; margin: 0 auto; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 22px 26px; align-items: start; }
.sh-card--hero .sh-band { max-width: 600px; }
.sh-card { position: relative; background: var(--manila); clip-path: polygon(0 24px, 24px 0, 100% 0, 100% 100%, 0 100%);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .35), transparent 30%), linear-gradient(90deg, rgba(164, 120, 52, .06), transparent 12%, transparent 88%, rgba(164, 120, 52, .06));
  filter: drop-shadow(0 18px 22px rgba(0, 0, 0, .38)) drop-shadow(0 2px 2px rgba(0, 0, 0, .25)); }
.sh-band { display: block; width: 100%; max-width: 760px; height: auto; padding: 10px 14px 0 26px; }
.sh-band__t { font-family: var(--dot); font-weight: 900; font-size: 11.5px; fill: #3b342a; text-anchor: middle; }
.sh-band__d text, .sh-g__d text { font-family: var(--body); font-size: 7px; fill: var(--print); opacity: .62; text-anchor: middle; }
.sh-band pattern text, .sh-g pattern text { font-family: var(--body); font-size: 7px; fill: #c4573a; fill-opacity: .7; text-anchor: middle; }
.sh-band__h rect { fill: var(--felt); }
.sh-card__b { padding: 6px 30px 28px; }
.sh-card--hero { grid-column: 1 / span 7; grid-row: 1; }
.sh-k { margin: 6px 0 0; font-size: 13px; font-weight: 500; letter-spacing: .16em; color: var(--ink-2); }
.sh-card--hero h1 { margin: 2px 0 0; font-family: var(--head); font-weight: 400; font-size: clamp(64px, 7vw, 102px); line-height: 1; letter-spacing: .04em; color: #1e1a15; }
.sh-en { margin: 6px 0 10px; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; font-family: var(--dot); font-weight: 900; font-size: 22px; letter-spacing: .08em; text-transform: uppercase; color: #3b342a; }
.sh-who { margin: 0; font-size: 19px; font-weight: 700; line-height: 1.5; }
.sh-now { margin: 4px 0 10px; font-size: 14.5px; color: var(--ink-2); line-height: 1.7; }
.sh-rel { margin: 0 0 12px; padding: 10px 14px 10px; border: 1.5px solid var(--print); border-radius: 2px; background: rgba(255, 255, 255, .28); }
.sh-rel p:last-child { margin: 0; font-size: 14.5px; line-height: 1.75; }
.sh-go { margin: 0; }
.c-si-hongwei .c3-btn { border-radius: 2px; min-height: 40px; font-family: var(--body); font-weight: 500; }
.c-si-hongwei .c3-btn--go { background: #20392f; border-color: #20392f; color: var(--manila); }
.c-si-hongwei .c3-btn--deep { background: #a63d27; border-color: #a63d27; color: #fff; }
.c-si-hongwei .c3-btn--wm { background: transparent; color: #1e1a15; border-color: #1e1a15; }

/* 算盘 */
.sh-aba { grid-column: 8 / -1; grid-row: 1; }
.sh-lab { margin: 0 0 10px; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-family: var(--body); font-weight: 700; font-size: 13.5px; letter-spacing: .1em; color: var(--ink); }
.sh-lab b { font-family: var(--head); font-weight: 400; font-size: 14px; letter-spacing: .08em; color: var(--acc); }
.sh-aba > .sh-lab { color: var(--manila); } .sh-aba > .sh-lab b { color: var(--amber); }
.sh-aba__svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 16px 18px rgba(0, 0, 0, .45)); touch-action: manipulation; }
.sh-aba__win { fill: rgba(0, 0, 0, .18); }
.sh-aba__fr { fill: url(#sh-wood); stroke: #1c0904; stroke-width: 1; }
.sh-aba__beam { fill: url(#sh-wood2); stroke: #1c0904; stroke-width: 1; }
.sh-dot { fill: #e3cf9c; }
.sh-aba__nail circle { fill: #c9a86a; stroke: #3a1810; stroke-width: 1; }
.sh-rod__l { stroke: #c8ae78; stroke-width: 3.2; }
.sh-rod__hit { fill: transparent; }
.sh-rod--live .sh-rod__hit { cursor: pointer; }
.sh-rod__f { fill: none; stroke: transparent; stroke-width: 2.5; }
.sh-rod:focus { outline: none; }
.sh-rod:focus-visible .sh-rod__f { stroke: var(--amber); }
.sh-b { transition: transform .2s cubic-bezier(.3, 1.4, .5, 1); }
.sh-bead { fill: url(#sh-bd); stroke: #120502; stroke-width: 1; }
.sh-b.is-on .sh-bead { fill: url(#sh-bd-on); }
.sh-shine { fill: none; stroke: rgba(255, 236, 200, .35); stroke-width: 2; stroke-linecap: round; }
.sh-rod--live .sh-b { cursor: pointer; }
.sh-read { margin-top: 14px; padding: 14px 16px 12px; background: rgba(10, 20, 16, .45); border: 1px solid rgba(241, 232, 204, .12); border-radius: 4px; }
.sh-read__r { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 10px; margin-bottom: 10px; }
.sh-read__k { margin: 0; font-size: 12.5px; letter-spacing: .08em; color: var(--ink-3); }
.sh-wheels { display: flex; gap: 4px; }
.sh-wh { position: relative; width: 30px; height: 36px; overflow: hidden; border-radius: 3px; background: linear-gradient(#0e0907, #2b1d14 30%, #2b1d14 70%, #0e0907); box-shadow: inset 0 0 0 1px rgba(201, 168, 106, .6), inset 0 2px 5px rgba(0, 0, 0, .8); }
.sh-wh i { position: absolute; left: 0; right: 0; top: 0; display: flex; flex-direction: column; font-style: normal; transform: translateY(calc(var(--v, 0) * -36px)); transition: transform .45s cubic-bezier(.4, 1.3, .5, 1); }
.sh-wh b { height: 36px; line-height: 36px; text-align: center; font-family: var(--num); font-weight: 700; font-size: 22px; color: #f6e7bf; }
.sh-lamps { display: flex; flex-wrap: wrap; gap: 5px; }
.sh-lamps i { width: 15px; height: 15px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #5a4a32, #2a2219); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .6); transition: background .2s, box-shadow .2s; }
.sh-lamps i:nth-child(4n) { margin-right: 4px; }
.sh-lamps i.on { background: radial-gradient(circle at 40% 35%, #fff2c4, #f0b13d 45%, #b86d12); box-shadow: 0 0 9px rgba(240, 177, 61, .8), inset 0 0 0 1px rgba(0, 0, 0, .3); }
.sh-year { margin: 4px 0 10px; min-height: 4.6em; font-size: 15px; line-height: 1.7; color: var(--ink); }
.sh-year b { margin-right: 10px; font-family: var(--dot); font-weight: 900; font-size: 28px; color: var(--amber); vertical-align: -3px; letter-spacing: .02em; }
.sh-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: 13px; color: var(--ink-3); }
.sh-chips span { margin-right: 2px; }
.sh-chips button { min-width: 40px; min-height: 40px; padding: 4px 7px; border: 1px solid rgba(241, 232, 204, .4); border-radius: 2px; background: transparent; color: var(--ink); font: 700 14px/1 var(--num); cursor: pointer; }
.sh-chips button:hover { background: rgba(241, 232, 204, .1); border-color: var(--amber); }
.sh-chips button[data-step] { font-family: var(--body); font-weight: 700; }

/* 索引卡 */
.sh-idx { position: relative; padding: 16px 18px 18px; background: var(--manila); border-radius: 2px; box-shadow: 0 12px 20px -10px rgba(0, 0, 0, .5);
  background-image: linear-gradient(transparent 38px, rgba(196, 87, 58, .55) 38px, rgba(196, 87, 58, .55) 39.5px, transparent 39.5px), repeating-linear-gradient(transparent 0 27px, rgba(70, 110, 150, .16) 27px 28px); background-position: 0 0, 0 40px; }
.sh-idx::after { content: ""; position: absolute; left: 50%; bottom: 12px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--felt); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .6); }
.sh-idx .mk { margin-bottom: 14px; }
.sh-idx--toc { grid-column: 1 / span 4; }
.sh-idx--books { grid-column: 5 / span 4; }
.sh-idx--feats { grid-column: 9 / span 4; }
.sh-idx--facts { grid-column: 1 / span 7; }
.sh-idx--links { grid-column: 8 / span 5; }
.sh-idx--facts p:not(.mk) { margin: 0 0 14px; font-size: 14.5px; line-height: 1.9; color: var(--ink-2); }
.sh-qlist { list-style: none; margin: 0 0 16px; padding: 0; }
.sh-qlist a { display: grid; grid-template-columns: 26px 48px minmax(0, 1fr); align-items: baseline; gap: 6px; min-height: 40px; padding: 6px 0; text-decoration: none; border-bottom: 1px dotted var(--rule); }
.sh-qlist i { font-style: normal; font-family: var(--num); font-weight: 900; font-size: 16px; color: var(--acc); }
.sh-qlist b { font-family: var(--num); font-weight: 700; font-size: 15px; color: var(--ink-2); }
.sh-qlist span { font-weight: 500; font-size: 15px; line-height: 1.5; }
.sh-qlist a:hover span { color: var(--acc); }
.c-si-hongwei .c3-books, .c-si-hongwei .c3-links { margin-bottom: 16px; }
.c-si-hongwei .c3-books li { padding: 6px 0; font-size: 14.5px; border-bottom: 1px dotted var(--rule); }
.c-si-hongwei .c3-books li a { font-weight: 700; text-decoration-color: var(--print); text-underline-offset: 3px; }
.c-si-hongwei .c3-books small, .c-si-hongwei .c3-links small, .c-si-hongwei .c3-works small { color: var(--ink-3); }
.c-si-hongwei .c3-feats { margin: 0 0 16px; padding: 0; list-style: none; counter-reset: f; }
.c-si-hongwei .c3-feats li { counter-increment: f; position: relative; padding: 5px 0 5px 28px; font-size: 14.5px; line-height: 1.6; border-bottom: 1px dotted var(--rule); }
.c-si-hongwei .c3-feats li::before { content: counter(f); position: absolute; left: 2px; top: 5px; font-family: var(--num); font-weight: 900; font-size: 15px; color: var(--acc); }
.c-si-hongwei .c3-links li { font-size: 14px; padding: 5px 0; border-bottom: 1px dotted var(--rule); }

/* ---------- 每一问：一张穿孔卡 + 桌上的东西 ---------- */
.c-si-hongwei .c3q { display: block; padding-top: calc(var(--bar) + 30px); }
.sh-q { max-width: 1260px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: clamp(26px, 3.6vw, 56px); align-items: start; }
.sh-q--r { grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); }
.sh-q--r .sh-card--q { order: 2; }
.sh-card--q .sh-card__b { padding: 4px 34px 30px; }
.sh-no { margin: 4px 0 2px; display: flex; justify-content: space-between; gap: 10px; font-size: 13px; letter-spacing: .14em; color: var(--ink-3); }
.sh-no span:last-child { font-family: var(--head); letter-spacing: .1em; color: var(--acc); }
.c-si-hongwei .c3q__when { flex-wrap: wrap; gap: 2px 14px; font-size: 14px; color: var(--ink-2); }
.c-si-hongwei .c3q__when b { font-family: var(--dot); font-weight: 900; font-size: 64px; line-height: 1; color: var(--print); letter-spacing: .02em; }
.c-si-hongwei .c3q__q { margin: 8px 0 16px; font-family: var(--head); font-weight: 400; font-size: clamp(30px, 3.2vw, 44px); line-height: 1.25; letter-spacing: .02em; text-wrap: balance; }
.c-si-hongwei .c3q__lede { font-size: 16.5px; line-height: 1.95; text-align: justify; color: var(--ink); }
.c-si-hongwei .c3-quote { position: relative; margin: 20px 0; padding: 14px 16px 12px 18px; border: 0; background: #fbf6e6; box-shadow: 0 0 0 1px rgba(30, 26, 21, .14), 3px 3px 0 #d8c99f; }
.c-si-hongwei .c3-quote::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: repeating-linear-gradient(#a63d27 0 6px, transparent 6px 10px); }
.c-si-hongwei .c3-quote blockquote p { font-weight: 700; font-size: 17px; line-height: 1.8; }
.c-si-hongwei .c3-orig { font-size: 13.5px; color: var(--ink-2); }
.c-si-hongwei .c3-quote figcaption { color: var(--ink-3); }
.c-si-hongwei .c3-tags li { border-radius: 2px; border-color: rgba(166, 61, 39, .55); color: #8a3220; font-size: 13px; background: rgba(255, 255, 255, .3); }
.c-si-hongwei .c3-works li { font-size: 15px; }
.c-si-hongwei .c3-works a { text-decoration-color: var(--print); text-underline-offset: 3px; }
.c-si-hongwei .talk { border-radius: 3px; border-color: #1e1a15; background: #fbf6e6; }
.c-si-hongwei .c3-deeplink { color: #8a3220; text-underline-offset: 3px; }
.c-si-hongwei .c3-ask { border-color: rgba(30, 26, 21, .35); border-radius: 2px; background: rgba(255, 255, 255, .3); }
.c-si-hongwei .c3-ask small { color: var(--ink-3); }
.sh-art { min-width: 0; }

/* 版画与照片：放在桌上的纸 */
.sh-print { margin: 0; }
.sh-print__p { padding: 10px; background: var(--manila); box-shadow: 0 16px 24px -12px rgba(0, 0, 0, .55), 0 1px 2px rgba(0, 0, 0, .3); transform: rotate(var(--rot, 0deg)); }
.sh-print img { display: block; width: 100%; height: auto; }
.sh-print figcaption { margin-top: 12px; font-size: 13px; line-height: 1.7; color: var(--ink-2); }
.sh-print--photo { --rot: -1.2deg; max-width: 440px; }
.sh-print--photo .sh-print__p { background: #f7f3ea; padding: 12px 12px 30px; }
.sh-print--l { --rot: -1.6deg; } .sh-print--r { --rot: 1.4deg; } .sh-print--m { --rot: -1deg; max-width: 380px; }

/* 第一问：打印纸上的“双向量阵列” */
.sh-gb { position: relative; padding: 18px 40px 18px; background-color: #fbfbf4;
  background-image: repeating-linear-gradient(#fbfbf4 0 28px, #dcebd9 28px 56px);
  box-shadow: 0 18px 26px -14px rgba(0, 0, 0, .6); }
.sh-gb::before, .sh-gb::after { content: ""; position: absolute; top: 0; bottom: 0; width: 26px; background: radial-gradient(circle at 13px 14px, var(--felt) 0 5px, transparent 5.6px) 0 0 / 26px 28px repeat-y; border-right: 1px dashed rgba(30, 26, 21, .25); }
.sh-gb::before { left: 0; } .sh-gb::after { right: 0; border-right: 0; border-left: 1px dashed rgba(30, 26, 21, .25); }
.sh-gb__h { margin: 0 0 8px; display: flex; justify-content: space-between; font-family: var(--dot); font-weight: 900; font-size: 15px; letter-spacing: .06em; color: #24412f; }
.sh-gb__h span:last-child { font-family: var(--body); font-weight: 700; font-size: 13.5px; letter-spacing: .1em; color: var(--ink); }
.sh-vec { display: block; width: 100%; height: auto; }
.sh-vec__fr rect { fill: rgba(255, 255, 255, .7); stroke: #1e1a15; stroke-width: 1.4; }
.sh-vec__fr text { font-family: var(--body); font-size: 13px; font-weight: 700; fill: #1e1a15; text-anchor: middle; }
.sh-vec__l { stroke: rgba(30, 26, 21, .25); stroke-width: 1; stroke-dasharray: 3 4; }
.sh-vec__st { stroke: rgba(30, 26, 21, .3); stroke-width: 1; }
.sh-vec.is-single .sh-vec__a[data-a="1"] { fill: rgba(30, 26, 21, .08); stroke-dasharray: 4 4; }
.sh-vec__el rect { stroke: #1e1a15; stroke-width: 1; }
.sh-vec__el .g0 { fill: #e0a43a; } .sh-vec__el .g1 { fill: #6f9e84; }
.sh-vec__el text { font-family: var(--num); font-weight: 700; font-size: 10.5px; fill: #1e1a15; text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.sh-ctl { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.sh-ctl button { min-height: 40px; padding: 6px 14px; border: 1.5px solid #1e1a15; border-radius: 2px; background: rgba(255, 255, 255, .6); color: #1e1a15; font: 500 14px/1.3 var(--body); cursor: pointer; }
.sh-ctl button[aria-pressed="true"] { background: #1e1a15; color: var(--manila); }
.sh-ctl .sh-run { margin-left: auto; background: #a63d27; border-color: #a63d27; color: #fff; font-weight: 700; }
.sh-out { margin: 10px 0 0; min-height: 3.6em; font-size: 14.5px; line-height: 1.75; color: var(--ink-2); }

/* 第二问：研制六阶段穿孔卡 */
.sh-gantt { margin-top: 26px; padding: 16px 18px 16px; background: var(--manila); clip-path: polygon(0 18px, 18px 0, 100% 0, 100% 100%, 0 100%); filter: drop-shadow(0 14px 16px rgba(0, 0, 0, .4)); }
.sh-g__svg { display: block; width: 100%; height: auto; }
.sh-g__yr { font-family: var(--num); font-weight: 700; font-size: 14px; fill: #1e1a15; }
.sh-g__lab { font-family: var(--body); font-weight: 700; font-size: 12px; fill: #4a4234; }
.sh-g__n { font-family: var(--num); font-weight: 900; fill: #a63d27; }
.sh-g__tk line { stroke: rgba(196, 87, 58, .5); stroke-width: 1; stroke-dasharray: 2 3; }
.sh-g__h rect { fill: var(--felt); }
.js .sh-gantt:not(.is-punched) .sh-g__h rect { opacity: 0; }
.js .sh-gantt.is-punched .sh-g__h rect { transition: opacity .05s linear calc(var(--i) * 22ms); }
.sh-g { outline-offset: 4px; }
.sh-g__row.on rect { fill: #e0a43a; }
.sh-g__b { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.sh-g__b button { width: 100%; min-height: 40px; padding: 5px 8px; display: flex; align-items: center; gap: 8px; text-align: left; border: 1px solid rgba(30, 26, 21, .4); border-radius: 2px; background: rgba(255, 255, 255, .4); color: #1e1a15; font: 500 13.5px/1.3 var(--body); cursor: pointer; }
.sh-g__b button i { font-style: normal; font-family: var(--num); font-weight: 900; font-size: 15px; color: #a63d27; }
.sh-g__b button[aria-pressed="true"] { background: #1e1a15; color: var(--manila); }
.sh-g__b button[aria-pressed="true"] i { color: #e0a43a; }
.sh-src { margin: 6px 0 0; font-size: 12.5px; color: var(--ink-3); }

/* 第三问：两幅版画 + 展线 */
.sh-two { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.sh-route { margin-top: 26px; padding: 16px 18px; background: #f6f0de; border-top: 6px solid #1e1a15; box-shadow: 0 16px 24px -14px rgba(0, 0, 0, .6); }
.sh-route__v { position: relative; }
.sh-route__s { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 6fr 2.2fr 2.2fr; gap: 6px; transition: opacity .6s; }
.sh-route__u { padding: 6px 4px 4px; border-top: 3px solid #a63d27; }
.sh-route__u[data-u="机巧"] { border-color: #b98b2e; } .sh-route__u[data-u="掣电"] { border-color: #24412f; }
.sh-route__u > b { display: block; font-family: var(--head); font-weight: 400; font-size: 18px; color: #1e1a15; }
.sh-route__u ol { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px; }
.sh-route__u li { display: flex; flex-direction: column; align-items: center; gap: 2px; transition: opacity .5s, transform .5s; }
.sh-route__u svg { width: 100%; max-width: 50px; height: auto; fill: none; stroke: #1e1a15; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sh-route__u li span { font-size: 11.5px; line-height: 1.25; text-align: center; color: var(--ink-2); }
.sh-route__u li.cur svg { stroke: #a63d27; }
.sh-route__u li.cur span { color: #a63d27; font-weight: 700; }
.sh-route__end { position: absolute; right: 0; top: 0; bottom: 0; width: 18%; display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0; transition: opacity .6s; pointer-events: none; }
.sh-route__end svg { width: 60px; fill: none; stroke: #1e1a15; stroke-width: 2.2; }
.sh-route__end span { font-family: var(--head); font-size: 16px; color: #a63d27; }
.sh-route.is-end .sh-route__u li { opacity: .1; transform: scale(.92); }
.sh-route.is-end .sh-route__u > b { opacity: .35; }
.sh-route.is-end .sh-route__end { opacity: 1; }
.sh-route__c { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; margin-top: 12px; font-size: 13.5px; font-weight: 500; }
.sh-route__c input { width: 100%; height: 40px; margin: 0; accent-color: #a63d27; cursor: pointer; }

/* 第四问：莫斯利计算机 + 机房 + 微机 */
.sh-coll { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.sh-coll .sh-print--m { grid-row: span 2; }
.sh-room, .sh-micro { padding: 14px 16px; background: var(--manila); box-shadow: 0 14px 20px -12px rgba(0, 0, 0, .55); }
.sh-room { background: #1b1f22; color: #e9e4d6; --ink: #e9e4d6; --ink-2: rgba(233, 228, 214, .82); --ink-3: rgba(233, 228, 214, .65); }
.sh-room .sh-lab { color: #e9e4d6; } .sh-room .sh-lab b { color: #e0a43a; }
.sh-room__s { display: block; width: 100%; height: auto; }
.sh-cab { fill: #2c3237; stroke: #0b0d0f; stroke-width: 1; }
.sh-cab--on { fill: #e0a43a; stroke: #fff2c4; stroke-width: 1.4; animation: sh-pulse 2.2s ease-in-out infinite; }
@keyframes sh-pulse { 50% { fill: #f6cf73; } }
.sh-note { margin: 10px 0 0; font-size: 13px; line-height: 1.7; color: var(--ink-2); }
.sh-micro__g { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.sh-micro__g li { position: relative; display: flex; flex-direction: column; align-items: center; padding: 6px 4px 4px; border: 1.5px solid #1e1a15; border-radius: 2px; background: rgba(255, 255, 255, .45); transition: opacity .4s, border-style .2s; }
.sh-micro__g svg { width: 100%; max-width: 56px; fill: none; stroke: #1e1a15; stroke-width: 2; }
.sh-micro__g b { font-family: var(--num); font-weight: 700; font-size: 14px; }
.sh-micro__g.is-2013 li:nth-child(3), .sh-micro__g.is-2013 li:nth-child(6) { border-style: dashed; opacity: .55; }
.sh-micro__g.is-2013 li:nth-child(3)::after, .sh-micro__g.is-2013 li:nth-child(6)::after { content: "代"; position: absolute; right: 4px; top: 2px; font-size: 12px; color: #a63d27; font-weight: 700; }
.sh-micro__g.is-2020 li { background: #fff6dc; }

/* ---------- 结尾 ---------- */
.c-si-hongwei .c3end { padding-top: calc(var(--bar) + 30px); }
.sh-end { max-width: 1160px; margin: 0 auto; }
.sh-card--end .sh-card__b { padding: 8px 34px 34px; }
.c-si-hongwei .c3end h2 { margin-top: 6px; font-family: var(--head); font-weight: 400; color: #1e1a15; }
.c-si-hongwei .c3end h3 { font-weight: 700; }
.c-si-hongwei .c3-lin li { border-radius: 2px; background: #fbf6e6; border-color: rgba(30, 26, 21, .2); }
.c-si-hongwei .c3-credits, .c-si-hongwei .c3-fine { color: var(--ink-3); }

/* ---------- 宽屏：右边留出算盘档 ---------- */
@media (min-width: 861px) {
  .c-si-hongwei .c3hero, .c-si-hongwei .c3q, .c-si-hongwei .c3end { padding-left: clamp(24px, 5vw, 72px); padding-right: clamp(96px, 8vw, 128px); }
}
@media (max-width: 1300px) {
  .sh-nb b { display: none; }
  .sh-nb span { right: 60px; }
}
@media (max-width: 1180px) {
  .sh-hero { gap: 22px 20px; }
  .sh-card--hero { grid-column: 1 / span 7; }
  .sh-aba { grid-column: 8 / -1; }
  .sh-card--hero h1 { font-size: clamp(60px, 7.4vw, 90px); }
  .sh-card__b { padding: 6px 22px 22px; }
  .sh-read { padding: 10px 12px; }
  .sh-read__r { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .sh-year { font-size: 14px; }
  .sh-idx--toc, .sh-idx--books, .sh-idx--feats { grid-column: span 4; }
  .sh-q, .sh-q--r { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); }
  .sh-q--r { grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); }
  .sh-coll { grid-template-columns: minmax(0, 1fr); }
  .sh-coll .sh-print--m { grid-row: auto; max-width: 300px; }
  .sh-g__b { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sh-card--q .sh-card__b { padding: 4px 24px 26px; }
}
@media (max-width: 960px) {
  .sh-hero { grid-template-columns: minmax(0, 1fr); }
  .sh-card--hero, .sh-aba, .sh-idx { grid-column: 1 !important; grid-row: auto; }
  .sh-card--hero { order: 1; } .sh-idx--toc { order: 2; } .sh-idx--books { order: 3; } .sh-aba { order: 4; } .sh-idx--feats { order: 5; } .sh-idx--facts { order: 6; } .sh-idx--links { order: 7; }
  .sh-aba { max-width: 560px; }
  .sh-read__r { grid-template-columns: 96px minmax(0, 1fr); }
  .sh-q, .sh-q--r { grid-template-columns: minmax(0, 1fr); }
  .sh-q--r .sh-card--q { order: 0; }
  .sh-art { max-width: 640px; }
}
@media (max-width: 560px) {
  .sh-card { clip-path: polygon(0 16px, 16px 0, 100% 0, 100% 100%, 0 100%); }
  .sh-band { padding: 8px 8px 0 16px; }
  .sh-card__b, .sh-card--q .sh-card__b, .sh-card--end .sh-card__b { padding: 4px 16px 20px; }
  .sh-en { font-size: 18px; }
  .c-si-hongwei .c3q__when b { font-size: 46px; }
  .c-si-hongwei .c3q__lede { text-align: left; }
  .sh-read__r { grid-template-columns: minmax(0, 1fr); }
  .sh-two { gap: 12px; }
  .sh-gb { padding: 14px 30px; }
  .sh-gb::before, .sh-gb::after { width: 20px; background-size: 20px 28px; background-image: radial-gradient(circle at 10px 14px, var(--felt) 0 4px, transparent 4.6px); }
  .sh-g__b { grid-template-columns: minmax(0, 1fr); }
  .sh-g { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; margin: 0 -6px; padding: 0 6px 6px; }
  .sh-g__svg { width: 640px; max-width: none; }
  .sh-route__s { grid-template-columns: minmax(0, 1fr); }
  .sh-route__u ol { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sh-route__end { width: 34%; top: auto; height: 120px; bottom: 0; }
  .sh-ctl .sh-run { margin-left: 0; }
  .sh-micro__g { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
}
