/* 蒋劲松 · 护生木刻：比尤伊克木口木刻的博物书。纸是暖白，墨是木刻的黑，唯一的颜色是护生的绿。
   木版（黑底白字的块）只用在名字、题号、路牌和目录上；木口的年轮藏在黑块里。前缀 jj-。 */
.c-jiang-jinsong {
  --bg: #f3efe6; --paper: #f8f5ee; --ink: #1c1a16; --ink-2: #48433a; --ink-3: #685f52; --rule: rgba(28, 26, 22, .2);
  --acc: #3b6529; --acc-ink: #f8f5ee; --acc-soft: rgba(59, 101, 41, .1); --block: #1c1a16; --leaf: #cfe3b8;
  --head: "Noto Serif SC", "Songti SC", "STSong", serif; --body: "Noto Serif SC", "Songti SC", "STSong", serif;
  --lat: "Libre Baskerville", "Noto Serif SC", Georgia, serif;
  --bar-bg: rgba(243, 239, 230, .94); --chip-bg: rgba(248, 245, 238, .92); --chip-ring: #f8f5ee;
  background-color: var(--bg);
}
.c-jiang-jinsong .dlg { --dlg-bg: #efeadf; --dlg-paper: #fbf9f4; --dlg-ink: #1c1a16; --dlg-ink-2: #48433a; --dlg-ink-3: #685f52;
  --dlg-me: #1c1a16; --dlg-me-ink: #f8f5ee; --dlg-acc: #3b6529; --dlg-rule: rgba(28, 26, 22, .16); }
.c-jiang-jinsong .c3bar { border-bottom: 1px solid var(--ink); box-shadow: 0 3px 0 -2px var(--ink); }
.c-jiang-jinsong .c3bar__prog { background: var(--acc); height: 3px; }
.c-jiang-jinsong ::selection { background: rgba(59, 101, 41, .22); }

/* 目录：页边一列小木块，悬停才露出题目 */
.c-jiang-jinsong .c3toc ol { gap: 5px; }
.c-jiang-jinsong .c3toc a { gap: 0; color: var(--ink); font-size: 13px; }
.c-jiang-jinsong .c3toc a::after { display: none; }
.c-jiang-jinsong .c3toc a b { order: 2; display: inline-grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--ink); background: var(--bg);
  font: 700 12px/1 var(--head); color: var(--ink); transition: background .2s, color .2s; }
.c-jiang-jinsong .c3toc a span { order: 1; padding: 0; background: var(--paper); line-height: 26px; }
.c-jiang-jinsong .c3toc a:hover span, .c-jiang-jinsong .c3toc a:focus-visible span { padding: 0 8px; margin-right: 6px; box-shadow: 0 0 0 1px var(--ink); }
.c-jiang-jinsong .c3toc a[aria-current="true"] b { background: var(--block); color: var(--paper); }
.c-jiang-jinsong .c3toc a:hover b { background: var(--acc); border-color: var(--acc); color: var(--acc-ink); }
@media (max-width: 1300px) { .c-jiang-jinsong .c3toc a b { display: inline-grid; } .c-jiang-jinsong .c3toc a span { display: inline; } }

/* ———— 首屏 ———— */
.c-jiang-jinsong .c3hero { padding-top: calc(var(--bar) + 26px); padding-bottom: 36px; }
.jj-hero { max-width: 1280px; margin: 0 auto; }
.jj-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: clamp(20px, 3.6vw, 52px); align-items: stretch; }
.jj-mast { position: relative; display: flex; flex-direction: column; justify-content: flex-end; padding: 22px 30px 22px; min-height: 260px; overflow: hidden;
  background-color: var(--block); color: var(--paper);
  background-image: repeating-linear-gradient(180deg, rgba(248, 245, 238, .16) 0 1px, transparent 1px 5px),
    repeating-radial-gradient(ellipse at 18% 135%, rgba(248, 245, 238, .055) 0 1.5px, transparent 1.5px 8px);
  background-size: 100% 44%, 100% 100%; background-repeat: no-repeat, no-repeat; }
.jj-mast::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 44%; pointer-events: none; background: linear-gradient(180deg, rgba(28, 26, 22, 0) 30%, var(--block)); }
.jj-k { position: relative; z-index: 1; margin: 0 0 6px; font-size: 13px; letter-spacing: .24em; color: rgba(248, 245, 238, .8); }
.jj-name { position: relative; z-index: 1; margin: 0; font-family: var(--head); font-weight: 900; font-size: clamp(60px, 8.4vw, 124px); line-height: 1.04; letter-spacing: .1em; color: var(--paper); }
.jj-en { position: relative; z-index: 1; margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; font-family: var(--lat); font-style: italic; font-size: 20px; }
.jj-yr { font-style: normal; font-size: 14px; letter-spacing: .1em; color: rgba(248, 245, 238, .82); }
.jj-id { display: flex; flex-direction: column; justify-content: flex-end; }
.jj-who { margin: 0 0 4px; font-size: 20px; font-weight: 700; line-height: 1.5; }
.jj-now { margin: 0 0 14px; font-size: 14.5px; color: var(--ink-2); }
.jj-rel { margin: 0 0 12px; padding: 10px 14px 11px; border-left: 4px solid var(--acc); background: var(--acc-soft); }
.jj-rel .mk { margin: 0 0 2px; color: var(--acc); font-weight: 700; letter-spacing: .14em; }
.jj-rel p { margin: 0; font-size: 14.5px; line-height: 1.75; }
.jj-go { margin: 0; }
.c-jiang-jinsong .c3-btn { border-radius: 0; border-color: var(--ink); font-family: var(--body); min-height: 40px; }
.c-jiang-jinsong .c3-btn--go { background: var(--acc); border-color: var(--acc); color: var(--acc-ink); }
.c-jiang-jinsong .c3-btn--deep { background: var(--block); border-color: var(--block); color: var(--paper); }
.c-jiang-jinsong .c3-btn--wm { background: transparent; color: var(--ink); }

/* 六只动物排成一条 */
.jj-frieze { margin: 24px 0 0; padding: 0 0 8px; border-bottom: 1px solid var(--ink); }
.jj-frieze ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: flex-end; gap: clamp(4px, 1vw, 14px); }
.jj-frieze li { position: relative; flex: 1 1 0; min-width: 0; text-align: center; }
.jj-frieze li:nth-child(1) { flex-grow: 1.83; } .jj-frieze li:nth-child(2) { flex-grow: 1.49; } .jj-frieze li:nth-child(3) { flex-grow: 1.44; }
.jj-frieze li:nth-child(4) { flex-grow: 1.86; } .jj-frieze li:nth-child(5) { flex-grow: 2.03; } .jj-frieze li:nth-child(6) { flex-grow: 1.36; }
.jj-frieze img { display: block; width: 100%; height: auto; }
.jj-frieze span { display: flex; flex-direction: column; align-items: center; margin-top: 4px; line-height: 1.25; }
.jj-frieze b { font-size: 15px; }
.jj-frieze i { max-width: 100%; font-family: var(--lat); font-size: 10.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.js .jj-frieze li { opacity: 0; transform: translateX(26px); transition: opacity .9s ease calc(var(--i) * .12s + .1s), transform 1.1s cubic-bezier(.2, .7, .2, 1) calc(var(--i) * .12s + .1s); }
.js .jj-frieze.is-on li { opacity: 1; transform: none; }
.jj-frieze figcaption { margin-top: 6px; font-size: 12.5px; color: var(--ink-3); text-align: right; }

.jj-band { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 44px); margin-top: 22px; }
.jj-band .mk { margin-bottom: 8px; padding-bottom: 4px; border-bottom: 1px solid var(--ink); font-weight: 700; letter-spacing: .16em; color: var(--ink); }
.jj-mk2 { margin-top: 18px !important; }
.c-jiang-jinsong .c3-qlist { counter-reset: q; }
.c-jiang-jinsong .c3-qlist li { counter-increment: q; }
.c-jiang-jinsong .c3-qlist li a { display: grid; grid-template-columns: 30px 3.6em minmax(0, 1fr); align-items: baseline; gap: 6px; padding: 6px 0; min-height: 40px; text-decoration: none; border-bottom: 1px dotted var(--rule); }
.c-jiang-jinsong .c3-qlist li a::before { content: counter(q, cjk-decimal); display: inline-grid; place-items: center; width: 24px; height: 24px; background: var(--block); color: var(--paper); font: 700 12.5px/1 var(--head); align-self: center; }
.c-jiang-jinsong .c3-qlist li a b { font-family: var(--lat); font-style: italic; font-weight: 400; color: var(--acc); }
.c-jiang-jinsong .c3-qlist li a span { font-size: 15.5px; font-weight: 600; }
.c-jiang-jinsong .c3-qlist li a:hover span { text-decoration: underline; text-decoration-color: var(--acc); text-underline-offset: 4px; }
.c-jiang-jinsong .c3-books li, .c-jiang-jinsong .c3-links li { border-bottom: 1px dotted var(--rule); font-size: 14.5px; }
.c-jiang-jinsong .c3-books a, .c-jiang-jinsong .c3-links a { text-decoration-color: rgba(28, 26, 22, .35); text-underline-offset: 3px; }
.c-jiang-jinsong .c3-feats { margin: 0; padding: 0; list-style: none; }
.c-jiang-jinsong .c3-feats li { position: relative; padding: 4px 0 4px 18px; font-size: 14px; line-height: 1.6; border-bottom: 1px dotted var(--rule); }
.c-jiang-jinsong .c3-feats li::before { content: ""; position: absolute; left: 2px; top: .85em; width: 7px; height: 7px; background: var(--acc); transform: rotate(45deg); }
.jj-facts { margin: 20px 0 0; padding-top: 12px; border-top: 1px solid var(--rule); font-size: 13.5px; line-height: 1.85; color: var(--ink-2); columns: 2 26em; column-gap: 44px; }

/* ———— 每一问 ———— */
.c-jiang-jinsong .c3q { display: block; padding: calc(var(--bar) + 40px) clamp(16px, 5vw, 72px) 64px; border-top: 1px solid var(--rule); }
.jj-q { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); grid-template-areas: "art qh" "art qb";
  grid-template-rows: auto 1fr; column-gap: clamp(28px, 4.6vw, 76px); align-items: start; }
.c-jiang-jinsong .c3q:nth-of-type(odd) .jj-q { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); grid-template-areas: "qh art" "qb art"; }
.jj-qh { grid-area: qh; } .jj-art { grid-area: art; } .jj-qb { grid-area: qb; }
.jj-no { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 12px; }
.jj-no b { display: inline-grid; place-items: center; width: 48px; height: 48px; font: 900 25px/1 var(--head); background-color: var(--block); color: var(--paper);
  background-image: repeating-radial-gradient(circle at 30% 120%, rgba(248, 245, 238, .08) 0 1px, transparent 1px 5px); }
.jj-no__y { font: italic 400 32px/1 var(--lat); color: var(--acc); }
.jj-no__w { font-size: 14px; color: var(--ink-3); }
.c-jiang-jinsong .c3q__q { margin: 0 0 16px; font-size: clamp(30px, 3.5vw, 46px); line-height: 1.22; letter-spacing: .02em; text-wrap: balance; font-feature-settings: "halt"; }
.c-jiang-jinsong .c3q__lede { font-size: 16.5px; line-height: 1.95; text-align: justify; }
.c-jiang-jinsong .c3-quote { position: relative; margin: 20px 0; padding: 14px 4px 12px 46px; border: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.c-jiang-jinsong .c3-quote::before { content: "“"; position: absolute; left: 4px; top: 4px; font: 400 54px/1 var(--lat); color: var(--acc); }
.c-jiang-jinsong .c3-quote blockquote p { font-size: 18px; line-height: 1.75; }
.c-jiang-jinsong .c3-quote blockquote p::before, .c-jiang-jinsong .c3-quote blockquote p::after { content: none; }
.c-jiang-jinsong .c3-quote figcaption { font-size: 12.5px; }
.c-jiang-jinsong .c3-tags li { border-radius: 0; border-color: var(--ink); background: var(--paper); font-size: 13px; color: var(--ink); }
.c-jiang-jinsong .c3-tags li::before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0 6px 2px 0; background: var(--acc); transform: rotate(45deg); }
.c-jiang-jinsong .c3-works .mk, .c-jiang-jinsong .c3-talk .mk { font-weight: 700; color: var(--ink-2); }
.c-jiang-jinsong .c3-works li { font-size: 14.5px; }
.c-jiang-jinsong .talk { border-radius: 0; border-color: var(--ink); background: var(--paper); box-shadow: 3px 3px 0 var(--ink); }
.c-jiang-jinsong .talk:hover { box-shadow: 5px 5px 0 var(--acc); }
.c-jiang-jinsong .c3-ask { border-radius: 0; border: 1px solid var(--ink); background: var(--paper); }
.c-jiang-jinsong .c3-deeplink { color: var(--acc); text-underline-offset: 4px; }

/* 配图：木刻直接印在纸上 */
.jj-fig { margin: 0; }
.jj-fig img { display: block; width: 100%; height: auto; mix-blend-mode: multiply; }
.jj-fig figcaption { margin-top: 8px; font-size: 13px; line-height: 1.6; color: var(--ink-3); }
.jj-fig--color img { mix-blend-mode: normal; box-shadow: 0 0 0 1px var(--rule), 0 14px 30px -18px rgba(28, 26, 22, .5); }
.jj-plate { margin-top: 22px; }
.jj-plate img { max-height: 46vh; width: auto; max-width: 100%; }

/* 共用的小机关部件 */
.jj-art .jj-k { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .18em; color: var(--acc); }
.jj-ctl { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; }
.no-js .jj-ctl, .no-js .jj-arms, .no-js .jj-lab, .no-js .jj-pot, .no-js .jj-sieve, .no-js .jj-art .jj-out { display: none; }
.jj-btn { min-height: 40px; padding: 7px 14px; border: 1px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); font: 600 14.5px/1.3 var(--body); cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
.jj-btn:hover { box-shadow: 3px 3px 0 var(--ink); }
.jj-btn[aria-pressed="true"] { background: var(--block); color: var(--paper); }
.jj-btn--go { background: var(--acc); border-color: var(--acc); color: var(--acc-ink); }
.jj-btn:disabled { opacity: .55; cursor: default; box-shadow: none; }
.jj-btn:focus-visible { outline: 3px solid var(--acc); outline-offset: 2px; }
.jj-out { margin: 10px 0 0; min-height: 3.4em; font-size: 14.5px; line-height: 1.75; color: var(--ink-2); }

/* 第一问：镜子与网 */
.jj-mir__st { position: relative; }
.jj-mir__st img { transition: opacity .8s ease; }
.jj-mir__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.jj-mir__crack path { fill: none; stroke: #f8f5ee; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.jj-mir__crack path.d { stroke: var(--ink); stroke-width: 5; }
.jj-mir.is-web .jj-mir__crack { opacity: .35; transition: opacity .8s; }
.jj-mir__web line { stroke: var(--acc); stroke-width: 2; }
.jj-mir__nodes { position: absolute; inset: 0; }
.jj-node { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); min-width: 44px; min-height: 40px; padding: 4px 12px; border: 1.5px solid var(--ink); border-radius: 999px;
  background: var(--paper); color: var(--ink); font: 700 14px/1.2 var(--body); white-space: nowrap; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none;
  box-shadow: 2px 2px 0 var(--ink); opacity: 0; transition: opacity .5s ease, background .15s; }
.jj-node.is-on { opacity: 1; }
.jj-node.is-drag { cursor: grabbing; background: var(--acc); border-color: var(--acc); color: var(--acc-ink); }
.jj-node:focus-visible { outline: 3px solid var(--acc); outline-offset: 2px; }
.jj-mir.is-web .jj-mir__st img { opacity: .26; }

/* 第二问：星空与佛性 */
.jj-sky { position: relative; margin: 0 0 18px; padding: 22px 22px 18px; color: var(--paper); overflow: hidden; background-color: #15130f;
  background-image: repeating-linear-gradient(180deg, rgba(248, 245, 238, .06) 0 1px, transparent 1px 6px); }
.jj-sky__n { position: absolute; inset: 0; pointer-events: none; }
.jj-sky__n i { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: #fbf6e8; opacity: .7; animation: jj-tw 3.6s ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes jj-tw { 0%, 100% { opacity: .2; } 50% { opacity: .95; } }
.jj-sky__l { position: relative; margin: 6px 0 4px; font: 900 clamp(24px, 2.9vw, 38px)/1.35 var(--head); letter-spacing: .06em; }
.jj-sky__x, .jj-sky__y { display: inline-block; vertical-align: bottom; white-space: nowrap; overflow: hidden; transition: opacity .6s ease, transform .6s ease, max-width .8s ease; }
.jj-sky__x { max-width: 9em; }
.jj-sky__y { max-width: 0; opacity: 0; transform: translateY(.4em); color: var(--leaf); }
.jj-sky.is-flip .jj-sky__x { max-width: 0; opacity: 0; transform: translateY(-.4em); }
.jj-sky.is-flip .jj-sky__y { max-width: 9em; opacity: 1; transform: none; }
.jj-sky__who { position: relative; margin: 0 0 6px; font-size: 13.5px; color: rgba(248, 245, 238, .8); }
.jj-sky__who span::before { content: "—— "; }
.jj-sky__who [data-jiang] { display: none; }
.jj-sky.is-flip .jj-sky__who [data-kant] { display: none; }
.jj-sky.is-flip .jj-sky__who [data-jiang] { display: inline; }
.jj-sky .jj-btn--go { background: var(--leaf); border-color: var(--leaf); color: #15130f; }
.jj-sky .jj-btn--go:hover { box-shadow: 3px 3px 0 #f8f5ee; }
.jj-sky .jj-out { position: relative; color: rgba(248, 245, 238, .88); }

/* 第三问：指路牌（黑木板，白字） */
.jj-post { display: grid; grid-template-columns: minmax(0, 1fr) 220px; grid-template-areas: "img arms" "out out" "cap cap"; column-gap: 18px; align-items: center; }
.jj-post > img { grid-area: img; }
.jj-post .jj-out { grid-area: out; }
.jj-post figcaption { grid-area: cap; }
.jj-arms { grid-area: arms; position: relative; display: flex; flex-direction: column; gap: 14px; padding: 6px 0 46px; }
.jj-arms::before { content: ""; position: absolute; left: 50%; top: -18px; bottom: 0; width: 14px; margin-left: -7px; background: var(--block);
  background-image: repeating-linear-gradient(90deg, rgba(248, 245, 238, .16) 0 1px, transparent 1px 4px); }
.jj-arms::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 70px; height: 8px; margin-left: -35px; background: var(--block); }
.jj-arms button { position: relative; z-index: 1; display: flex; align-items: center; min-height: 48px; padding: 0 34px 0 18px; border: 0; background-color: var(--block); color: var(--paper);
  font: 700 16px/1 var(--body); letter-spacing: .08em; cursor: pointer; clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
  background-image: repeating-linear-gradient(0deg, rgba(248, 245, 238, .1) 0 1px, transparent 1px 5px); transition: transform .35s cubic-bezier(.3, 1.6, .5, 1), background-color .2s, color .2s; }
.jj-arms button:nth-child(1) { transform: rotate(4deg); margin-right: 16px; }
.jj-arms button:nth-child(2) { align-self: flex-end; padding: 0 18px 0 34px; clip-path: polygon(22px 0, 100% 0, 100% 100%, 22px 100%, 0 50%); transform: rotate(-3deg); }
.jj-arms button:nth-child(3) { transform: rotate(-1.5deg); margin-left: 8px; }
.jj-arms button:hover { background-color: #34302a; }
.jj-arms button[aria-pressed="true"] { background-color: var(--acc); color: var(--acc-ink); }
.jj-arms button:nth-child(1)[aria-pressed="true"] { transform: rotate(0); }
.jj-arms button:nth-child(2)[aria-pressed="true"] { transform: rotate(0); }
.jj-arms button:focus-visible { outline: 3px solid var(--acc); outline-offset: 3px; }

/* 第四问：落体机关 */
.jj-lab { padding: 14px 16px 14px; border: 1px solid var(--ink); background: var(--paper); box-shadow: 6px 6px 0 rgba(28, 26, 22, .12); }
.jj-lab__svg { display: block; width: 100%; height: auto; font-family: var(--body); overflow: hidden; }
.jj-lab .jj-btn--go { margin-left: auto; }
.jj-lab__svg text { font-size: 14px; fill: var(--ink-2); }
.jj-lab__svg .jj-lb-lab { font-size: 18px; fill: var(--ink-2); }
.jj-leg { display: inline-flex; align-items: center; gap: 4px; margin-left: 14px; font-weight: 400; letter-spacing: .02em; color: var(--ink-2); }
.jj-leg i { display: inline-block; width: 12px; height: 12px; margin-left: 6px; }
.jj-leg__f { border: 1.5px solid var(--ink); border-radius: 50% 50% 50% 50% / 80% 80% 20% 20%; transform: rotate(30deg) scaleX(.55); }
.jj-leg__c { border: 2px solid var(--ink); border-radius: 50%; background: repeating-linear-gradient(0deg, var(--ink) 0 1px, transparent 1px 3px); }
.jj-lb-tube, .jj-lb-field, .jj-lb-wind, .jj-lb-grid, .jj-lb-birds { transition: opacity .6s ease; }
.jj-lb-grid line { stroke: var(--acc); stroke-width: 1; }
.jj-lb-grid { opacity: 0; }
.jj-lb-jar { transform: translateY(-400px); transition: transform 1.3s cubic-bezier(.6, 0, .3, 1); }
.jj-st { transform: translate(var(--x0), 334px) scale(1, var(--s0)); transition: transform 1.2s cubic-bezier(.6, 0, .3, 1) .4s; }
.jj-lb-birds { transition: transform 1s ease-in, opacity .8s ease .3s; }
.jj-sp__b { animation: jj-peck 2.8s ease-in-out infinite; transform-box: fill-box; transform-origin: 70% 90%; }
@keyframes jj-peck { 0%, 62%, 100% { transform: none; } 70% { transform: rotate(24deg); } 78% { transform: none; } 84% { transform: rotate(18deg); } }
.jj-lab[data-st="tube"] .jj-lb-field, .jj-lab[data-st="tube"] .jj-lb-birds, .jj-lab[data-st="tube"] .jj-lb-wind { opacity: 0; }
.jj-lab[data-st="field"] .jj-lb-tube, .jj-lab[data-st="jar"] .jj-lb-tube { opacity: 0; }
.jj-lab[data-st="jar"] .jj-lb-wind { opacity: 0; }
.jj-lab[data-st="jar"] .jj-lb-jar { transform: none; }
.jj-lab[data-st="jar"] .jj-lb-grid { opacity: .55; transition-delay: .9s; }
.jj-lab[data-st="jar"] .jj-st { transform: translate(var(--x1), 334px) scale(1, .82); }
.jj-lab[data-st="jar"] .jj-lb-birds { transform: translate(260px, -300px); opacity: 0; }
.jj-lab[data-st="tube"] .jj-lb-air circle { animation: jj-pump 1.8s ease .3s forwards; }
@keyframes jj-pump { from { opacity: .9; } to { opacity: 0; } }
.jj-lb-handle { transform-box: view-box; }
.jj-lab[data-st="tube"] .jj-lb-handle { animation: jj-stroke .45s ease-in-out .3s 4 alternate; }
@keyframes jj-stroke { from { transform: none; } to { transform: translateY(34px); } }

/* 第五问：筛子：上面一层是留下的，网下面一层是漏下去的 */
.jj-sieve { padding: 14px 16px 16px; border: 1px solid var(--ink); background: var(--paper); }
.jj-sieve__g, .jj-sieve__d { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; }
.jj-sieve__g { margin-top: 16px; min-height: 120px; align-content: end; }
.jj-sieve__mesh { height: 16px; margin: 10px -16px 10px; border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); opacity: .6;
  background-image: repeating-linear-gradient(45deg, var(--ink) 0 1px, transparent 1px 7px), repeating-linear-gradient(-45deg, var(--ink) 0 1px, transparent 1px 7px); }
.jj-sieve__d { min-height: 64px; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 6px; }
.jj-sieve__g li, .jj-sieve__d li { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; padding: 4px 2px;
  transition: transform .7s cubic-bezier(.45, 0, .3, 1.25), opacity .5s ease, filter .5s ease; }
.jj-sieve__g li img { width: 100%; height: 76px; object-fit: contain; }
.jj-sieve__g li b, .jj-sieve__d li b { font-size: 14px; }
.jj-sv__h { display: grid; place-items: center; width: 64px; height: 76px; font: 900 38px/1 var(--head); background-color: var(--block); color: var(--paper);
  background-image: repeating-radial-gradient(circle at 30% 120%, rgba(248, 245, 238, .08) 0 1px, transparent 1px 5px); }
.jj-sieve__d li { opacity: .5; filter: grayscale(1); }
.jj-sieve__d li img { width: 100%; height: 40px; object-fit: contain; }
.jj-sieve__d .jj-sv__h { width: 34px; height: 40px; font-size: 20px; }
.jj-sieve__d li b { font-size: 12.5px; font-weight: 600; }
.jj-sieve__g li.is-pass::after { content: ""; position: absolute; left: 50%; bottom: -3px; width: 28px; height: 3px; margin-left: -14px; background: var(--acc); }

/* 第六问：三种安放 */
.jj-pot { padding: 14px 16px 14px; border: 1px solid var(--ink); background: var(--paper); }
.jj-pot__svg { display: block; width: 100%; height: auto; font-family: var(--body); overflow: hidden; }
.jj-pf { opacity: 0; transition: opacity .6s ease; }
.jj-pot[data-m="wall"] .jj-pf--wall, .jj-pot[data-m="pot"] .jj-pf--pot, .jj-pot[data-m="door"] .jj-pf--door { opacity: 1; }
.jj-pf__t { font-size: 24px; font-weight: 900; fill: var(--ink); }
.jj-pf__s { font-size: 19px; font-weight: 700; fill: var(--ink); }
.jj-pf__k { font-size: 18px; font-weight: 700; fill: var(--acc); }
.jj-pf__q { font-size: 34px; font-weight: 900; fill: var(--acc); }
.jj-pf__d { font-size: 17px; font-weight: 700; fill: #f8f5ee; }
.jj-tk { transition: transform .9s cubic-bezier(.5, 0, .3, 1.2); }
.jj-tk text { font-size: 20px; font-weight: 900; fill: var(--ink); }
.jj-pot[data-m="pot"] .jj-tk rect, .jj-pot[data-m="pot"] .jj-tk text { animation: jj-bob 2.4s ease-in-out infinite; }
.jj-pot[data-m="pot"] .jj-tk + .jj-tk rect, .jj-pot[data-m="pot"] .jj-tk + .jj-tk text { animation-delay: -1.2s; }
@keyframes jj-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.jj-steam path { animation: jj-steam 3s ease-in-out infinite; }
@keyframes jj-steam { 0% { opacity: 0; transform: translateY(10px); } 40% { opacity: .55; } 100% { opacity: 0; transform: translateY(-16px); } }

/* ———— 结尾 ———— */
.c-jiang-jinsong .c3end { border-top: 6px solid var(--block); }
.jj-end { max-width: 1080px; margin: 0 auto; }
.jj-end__v { max-width: 520px; margin: 0 auto 28px; }
.jj-end__v figcaption { text-align: center; }
.c-jiang-jinsong .c3end h2 { font-weight: 900; }
.c-jiang-jinsong .c3-lin li { border-radius: 0; border-color: var(--ink); background: var(--paper); }
.c-jiang-jinsong .c3-lin .rel { border-radius: 0; }

/* ———— 窄屏 ———— */
@media (max-width: 1100px) {
  .jj-band { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .jj-band__q { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .jj-top { grid-template-columns: minmax(0, 1fr); }
  .jj-mast { min-height: 0; }
  .jj-q, .c-jiang-jinsong .c3q:nth-of-type(odd) .jj-q { grid-template-columns: minmax(0, 1fr); grid-template-areas: "qh" "art" "qb"; }
  .jj-art { margin-bottom: 18px; }
  .jj-post { grid-template-columns: minmax(0, 1fr); grid-template-areas: "img" "arms" "out" "cap"; }
  .jj-arms { flex-direction: row; flex-wrap: wrap; gap: 10px; padding: 12px 0 0; }
  .jj-arms::before, .jj-arms::after { display: none; }
  .jj-arms button, .jj-arms button:nth-child(n) { transform: none; margin: 0; align-self: auto; }
}
@media (max-width: 640px) {
  .jj-hero { display: flex; flex-direction: column; }
  .jj-top { display: contents; }
  .jj-mast { order: 1; } .jj-frieze { order: 2; margin-top: 14px; } .jj-id { order: 3; margin-top: 18px; } .jj-band { order: 4; } .jj-facts { order: 5; }
  .jj-band { grid-template-columns: minmax(0, 1fr); }
  .jj-frieze ul { gap: 3px; }
  .jj-frieze b { font-size: 12.5px; }
  .jj-frieze i, .jj-frieze figcaption { display: none; }
  .jj-facts { columns: 1; }
  .c-jiang-jinsong .c3q { padding-top: calc(var(--bar) + 28px); }
  .jj-no b { width: 40px; height: 40px; font-size: 21px; }
  .jj-no__y { font-size: 26px; }
  .jj-sieve { padding: 12px 10px 14px; }
  .jj-sieve__g { gap: 6px; }
  .jj-sieve__mesh { margin: 8px -10px; }
  .jj-sieve__g li img { height: 50px; }
  .jj-sv__h { width: 44px; height: 50px; font-size: 26px; }
  .jj-sieve__d { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .jj-node { min-height: 40px; padding: 3px 9px; font-size: 12.5px; }
  .jj-lab, .jj-pot { padding: 12px 10px; }
  .jj-lab .jj-btn--go { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .jj-sp__b, .jj-steam path, .jj-pot[data-m="pot"] .jj-tk rect, .jj-pot[data-m="pot"] .jj-tk text { animation: none !important; }
}