:root{--green:#124d38;--deep:#123c2e;--lime:#dded93;--ink:#20372d;--muted:#637169;--line:#dce3dc;--paper:#f7f9f5;--white:#fff;--radius:16px;--fs-xs:12px;--fs-sm:13px;--fs-md:15px;--fs-lg:17px;--fs-xl:22px;--fs-2xl:30px;--stage-1:#14583e;--stage-2:#b1bf79;--stage-3:#c59842;--stage-4:#408a80;--stage-5:#879b92;--surface-tint:#edf2e7;--surface-soft:#f4f7f0;--surface-mist:#f8faf5;--surface-hover:#e8f0df;--surface-leaf:#edf5e7;--border-strong:#cad9ca;--border-mid:#dbe6d9;--border-soft:#dde5d5;--border-dash:#a5b5a7;--border-accent:#7eaa8c;--border-accent-2:#8fb08c;--border-sage:#b8cbb9;--focus:#bd6b18;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,"PingFang SC","Hiragino Sans GB","Noto Sans SC","Source Han Sans SC","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--paper);font-size:16px;line-height:1.7}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button,a,summary{touch-action:manipulation}button{cursor:pointer}a{color:inherit}button:disabled{cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:5px}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.3}h1:focus{outline:none}[hidden]{display:none!important}.skip-link{position:absolute;left:16px;top:-100px;background:var(--green);color:white;padding:12px;z-index:20}.skip-link:focus{top:10px}.site-header{max-width:1120px;margin:auto;padding:25px 0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:20px;font-weight:750;letter-spacing:2px;line-height:1.25}.brand-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--green);color:var(--lime);border-radius:50%;font-size:28px;font-weight:600;letter-spacing:0}.brand small{display:block;margin-top:5px;font-size:var(--fs-xs);letter-spacing:2.5px;font-weight:500}.header-note{font-size:var(--fs-md);color:var(--muted)}main{max-width:1120px;margin:auto;padding:42px 0 56px}.intro{position:relative;padding-bottom:36px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:var(--fs-xs);letter-spacing:2px;font-weight:650;color:var(--green);margin-bottom:15px}.short-line{width:30px;height:2px;background:var(--green)}h1{font-size:clamp(2rem,3.4vw,2.75rem);font-weight:650;letter-spacing:1px;line-height:1.45}h1 span{color:#2e7954}.intro-copy{position:absolute;right:20px;bottom:48px;color:var(--muted);line-height:1.9}.collection-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.collection-heading h2{font-size:18px;font-weight:600}.collection-heading>span{font-size:var(--fs-xs);letter-spacing:1px;color:var(--muted)}.item-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.item-card{position:relative;display:flex;flex-direction:column;align-items:stretch;min-height:215px;min-width:0;padding:23px 25px;background:var(--white);border:1px solid #d4e0d4;border-radius:var(--radius);text-align:left;color:var(--ink)}.card-top{display:flex;justify-content:space-between;align-items:center}.card-number{font:13px/1.5 Consolas,monospace;letter-spacing:1px;color:var(--muted)}.category{font-size:var(--fs-xs);border:1px solid #b9c4b9;border-radius:5px;padding:1px 7px}.card-name{display:block;font-size:23px;font-weight:600;letter-spacing:.5px;margin-top:17px}.card-english{font-size:var(--fs-xs);letter-spacing:1.4px;margin-top:2px;color:var(--muted);overflow-wrap:anywhere}.card-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:23px;font-size:var(--fs-md)}.item-card.active{transition:transform .2s,box-shadow .2s,border-color .2s}.item-card.featured{color:white;background:var(--green);border-color:var(--green)}.featured .category{border-color:#719983;color:#e0efde}.featured .card-number,.featured .card-english{color:#b6cdbd}.card-bottom{color:var(--muted)}.featured .card-bottom{color:#dce9d9}.card-action{color:var(--green);background:var(--lime);border-radius:50px;padding:3px 12px;white-space:nowrap}.item-card.active:hover{transform:translateY(-3px);border-color:var(--border-accent);box-shadow:0 9px 20px #123c2e15}.home-note{display:flex;gap:9px;align-items:baseline;font-size:var(--fs-md);color:var(--muted);margin-top:22px}.site-footer{max-width:1120px;border-top:1px solid var(--line);margin:auto;padding:23px 0 30px;display:flex;align-items:center;gap:22px;color:var(--muted);font-size:var(--fs-xs)}.site-footer>span:first-child{font-size:var(--fs-md);color:var(--green);font-weight:600}.footer-label{margin-left:auto}.text-button{border:0;background:transparent;color:var(--green);padding:4px 0;border-bottom:1px solid #7d9c84;font-size:var(--fs-md);margin-bottom:22px}.noscript{padding:20px;text-align:center}
@media(max-width:1190px){.site-header,main,.site-footer{margin-left:32px;margin-right:32px}.card-bottom{flex-wrap:wrap}}
@media(max-width:720px){.site-header,main,.site-footer{margin-left:20px;margin-right:20px}.site-header{padding:20px 0}.header-note{font-size:var(--fs-xs)}.brand{font-size:18px;gap:8px}.brand-mark{width:36px;height:36px;font-size:24px}.brand small{font-size:var(--fs-xs)}main{padding-top:28px}.intro{padding-bottom:28px}.intro-copy{position:static;margin-top:18px;font-size:var(--fs-md)}.desktop-break{display:none}.eyebrow{font-size:var(--fs-xs)}.collection-heading h2{font-size:16px}.collection-heading>span{display:none}.item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.item-card{min-height:184px;padding:17px 15px}.item-card.featured{grid-column:1/-1;min-height:182px}.card-name{font-size:20px;margin-top:16px}.card-english{font-size:var(--fs-xs);letter-spacing:.6px}.card-bottom{padding-top:19px;font-size:var(--fs-sm)}.featured .card-name{font-size:25px}.home-note{font-size:var(--fs-sm)}.site-footer{align-items:flex-start;flex-wrap:wrap;gap:7px 15px}.site-footer p{flex-basis:100%;order:2}.footer-label{margin-left:auto}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.card-reference{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:18px;line-height:1.3}.card-reference strong{font-size:var(--fs-2xl);font-weight:600;letter-spacing:0}.card-reference>span{font-size:var(--fs-xs);color:#deebd7}.stage-panel{scroll-margin-top:20px}.statistics-section{margin-top:36px}.statistics-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.statistics-heading .eyebrow{margin-bottom:8px}.statistics-heading h2{font-size:25px;font-weight:600}.review-badge{font-size:var(--fs-sm);line-height:1.5;padding:6px 12px;border:1px solid #dec89a;background:#fff5df;color:#785315;border-radius:30px;flex-shrink:0}.statistics-notice{font-size:var(--fs-md);color:var(--muted);max-width:760px;margin-bottom:20px}.charts-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.chart-card{margin:0;min-width:0;padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}.chart-card figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}.chart-card h3{font-size:18px;font-weight:600}.chart-card figcaption>span{font-size:var(--fs-xs);color:var(--muted)}.chart-help{font-size:var(--fs-sm);color:var(--muted);margin-top:10px}.emissions-bars{display:grid;gap:7px;margin-top:17px}.chart-row{display:block;width:100%;padding:10px 12px 12px;border:1px solid transparent;background:transparent;text-align:left;color:var(--ink);border-radius:9px}.chart-row:hover{background:var(--surface-soft)}.chart-row.selected{border-color:#91ad95;background:#f1f5eb}.chart-row-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:var(--fs-md);line-height:1.5;margin-bottom:8px}.chart-row-name,.legend-name{display:flex;align-items:center;gap:9px;min-width:0}.chart-swatch{display:inline-block;flex-shrink:0;width:9px;height:9px;border-radius:2px;background:var(--stage-color)}.chart-row-value{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}.bar-track{display:block;height:11px;border-radius:3px;background:linear-gradient(to right,transparent calc(50% - .5px),#dce3dc calc(50% - .5px),#dce3dc calc(50% + .5px),transparent calc(50% + .5px)),#eef2ed;overflow:hidden}.bar-fill{display:block;height:100%;background:var(--stage-color);border-radius:3px}.chart-axis{display:flex;justify-content:space-between;margin:10px 13px 0;font-size:var(--fs-xs);color:var(--muted);font-variant-numeric:tabular-nums}.share-ring{position:relative;display:grid;place-items:center;width:200px;height:200px;border-radius:50%;margin:24px auto 21px}.share-ring:before{content:"";position:absolute;inset:24%;background:var(--white);border-radius:50%}.ring-center{position:relative;display:flex;flex-direction:column;align-items:center;line-height:1.45}.ring-center>span{font-size:var(--fs-xs);color:var(--muted)}.ring-center strong{font-size:31px;line-height:1.5;font-weight:650;color:var(--green);font-variant-numeric:tabular-nums}.ring-center small{font-size:var(--fs-xs);color:var(--muted)}.share-legend{display:grid;gap:6px;max-width:280px;margin:auto}.legend-row{display:flex;justify-content:space-between;gap:16px;font-size:var(--fs-sm);line-height:1.6}.legend-row strong{font-weight:550;font-variant-numeric:tabular-nums}.chart-insight{margin-top:16px;padding:14px 18px;background:var(--surface-tint);border-left:3px solid #7c9c74;border-radius:0 9px 9px 0;font-size:var(--fs-md);color:var(--deep)}.chart-empty{padding:25px;border:1px dashed var(--border-dash);border-radius:12px;background:white;font-size:var(--fs-md);color:var(--muted)}
@media(max-width:940px){.charts-grid{grid-template-columns:1.2fr 1fr}.chart-card{padding:22px}.share-ring{width:180px;height:180px}.ring-center strong{font-size:28px}}
@media(max-width:720px){.statistics-section{margin-top:28px}.statistics-heading{align-items:flex-start;flex-direction:column;gap:12px}.statistics-heading h2{font-size:23px}.review-badge{font-size:var(--fs-xs)}.statistics-notice{font-size:var(--fs-sm)}.charts-grid{grid-template-columns:1fr;gap:14px}.chart-card{padding:22px 18px}.chart-card h3{font-size:var(--fs-lg)}.chart-row{padding:10px}.chart-row-heading{font-size:var(--fs-sm)}.chart-row-value{font-size:var(--fs-md)}.share-ring{width:204px;height:204px}.ring-center strong{font-size:31px}.chart-insight{font-size:var(--fs-sm);padding:13px 15px}.card-reference strong{font-size:28px}.card-reference>span{font-size:var(--fs-xs)}}
.detail-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;gap:20px}.detail-heading h1{font-size:36px}.detail-heading .eyebrow{margin-bottom:7px}.result-link{font-size:var(--fs-md);color:var(--green);text-underline-offset:6px}.journey-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:18px}.journey-heading h2{font-size:20px}.journey-heading p{font-size:var(--fs-md);color:var(--muted)}.stage-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:18px}.stage-button{display:flex;align-items:center;gap:12px;padding:17px 15px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--muted);text-align:left;font-size:var(--fs-md);font-weight:550}.step-number{font-family:Consolas,monospace;font-size:var(--fs-sm);color:var(--muted)}.stage-button.selected{background:var(--green);border-color:var(--green);color:white}.selected .step-number{color:var(--lime)}.stage-button:hover:not(.selected){border-color:var(--green);color:var(--green)}.stage-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.stage-main{display:grid;grid-template-columns:1.6fr 1fr;gap:52px;padding:36px 36px 32px;min-height:220px}.stage-main .eyebrow{font-size:var(--fs-xs);letter-spacing:1.4px;margin-bottom:11px}.stage-main h3{font-size:27px;margin-bottom:14px}.stage-main>div>p:last-child{color:var(--muted);max-width:630px}.stage-metric{border-left:1px solid var(--line);padding-left:40px;display:flex;flex-direction:column;justify-content:center}.stage-metric>p{font-size:var(--fs-md);color:var(--muted)}.stage-metric strong{font-size:26px;line-height:1.5;margin:9px 0;font-weight:600;overflow-wrap:anywhere}.stage-metric>span{color:var(--muted);font-size:var(--fs-sm)}.source-details{border-top:1px solid var(--line)}.source-details summary{padding:17px 36px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;font-size:var(--fs-md);color:var(--green)}.source-details summary::-webkit-details-marker{display:none}.source-details[open] summary>span{transform:rotate(45deg)}.source-content{padding:5px 36px 26px}.source-record h4{font-size:16px;font-weight:600;margin:8px 0 16px}.source-fields{display:grid;grid-template-columns:110px 1fr;gap:9px 14px;font-size:var(--fs-md);margin:0 0 17px}.source-fields dt{color:var(--muted)}.source-fields dd{margin:0;overflow-wrap:anywhere}.source-link{font-size:var(--fs-md);color:var(--green);text-underline-offset:4px}.result-section{display:grid;grid-template-columns:1fr 1.2fr;margin-top:24px;background:var(--surface-tint);border-radius:var(--radius);border:1px solid var(--border-soft);scroll-margin-top:24px}.result-total{padding:30px 36px}.result-total .eyebrow{font-size:var(--fs-xs)}.result-total h2{font-size:23px;font-weight:600}.metric-label{font-size:var(--fs-md);color:var(--muted);margin:24px 0 7px}.result-total strong{font-size:var(--fs-2xl);font-weight:600;line-height:1.4;color:var(--green)}#total-status{font-size:var(--fs-sm);color:var(--muted);margin-top:9px}.result-context{padding:30px 36px;border-left:1px solid var(--border-soft)}.result-context h3{font-size:18px;font-weight:600}.context-label{font-size:var(--fs-sm);color:var(--muted);margin:18px 0 5px}#functional-unit{font-size:16px}.disclaimer{font-size:var(--fs-md);color:var(--muted);margin-top:17px;line-height:1.8}.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;margin-top:34px}.notes-grid h2{font-size:var(--fs-lg);margin-bottom:12px}.notes-grid p,.notes-grid ul{font-size:var(--fs-md);color:var(--muted);line-height:1.9}.notes-grid ul{padding-left:20px;margin:0}.notes-grid li+li{margin-top:8px}
@media(max-width:940px){.stage-button{flex-direction:column;gap:5px;padding:12px 7px;align-items:flex-start;font-size:var(--fs-md)}.stage-main{gap:25px;padding:28px}.stage-metric{padding-left:25px}.stage-metric strong{font-size:23px}.result-total,.result-context{padding:28px}.notes-grid{gap:30px}}
@media(max-width:720px){.detail-heading{margin-bottom:26px;align-items:flex-start;flex-direction:column;gap:8px}.detail-heading h1{font-size:var(--fs-2xl)}.journey-heading{display:block}.journey-heading h2{font-size:18px}.journey-heading p{margin-top:6px}.stage-nav{display:flex;flex-wrap:wrap;gap:8px}.stage-button{flex:1 1 96px;flex-direction:row;gap:8px;align-items:center;padding:12px 10px}.stage-main{grid-template-columns:1fr;gap:22px;padding:25px 22px}.stage-main h3{font-size:24px}.stage-main .eyebrow{font-size:var(--fs-xs)}.stage-metric{border-left:0;border-top:1px solid var(--line);padding:19px 0 0}.stage-metric strong{font-size:24px;margin:5px 0}.source-details summary{padding:15px 22px}.source-content{padding:0 22px 23px}.source-fields{grid-template-columns:85px 1fr;gap:9px 12px}.result-section{grid-template-columns:1fr}.result-total,.result-context{padding:26px 22px}.result-context{border-left:0;border-top:1px solid var(--border-soft)}.result-total h2{font-size:var(--fs-xl)}.result-total strong{font-size:28px}.notes-grid{grid-template-columns:1fr;gap:25px;margin-top:28px}.metric-label{margin-top:18px}}
.card-state{display:inline-flex;align-items:center;gap:5px;width:fit-content;max-width:100%;margin-top:13px;padding:3px 9px;border:1px solid #d5e3d5;border-radius:30px;background:#f2f7ee;color:#456b4e;font-size:var(--fs-xs);line-height:1.6}.featured .card-state{border-color:#719983;background:#245e46;color:#e2efd7}.card-action{display:inline-flex;align-items:center;justify-content:center;min-height:36px;line-height:1.4}.card-top{gap:8px}.card-name{overflow-wrap:anywhere}.item-card:focus-visible{outline-offset:4px}.detail-heading>div{min-width:0}.detail-notice{max-width:720px;margin-top:9px;font-size:var(--fs-md);color:var(--muted)}.stage-hook{margin:0 0 12px;font-size:16px;font-weight:550;line-height:1.75;color:var(--green)}.stage-hook:empty{display:none}#stage-title:focus-visible{outline:3px solid var(--focus);outline-offset:5px}.text-button,.result-link{min-height:44px;display:inline-flex;align-items:center}.source-link{display:inline-flex;align-items:center;min-height:44px}.result-link{flex-shrink:0}.boundary-section{margin-top:24px;padding:30px 36px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}.boundary-heading .eyebrow{margin-bottom:9px}.boundary-heading h2{font-size:23px;font-weight:600}.boundary-heading>p:last-child{max-width:780px;margin-top:12px;font-size:var(--fs-md);color:var(--muted)}.boundary-presets{display:flex;flex-wrap:wrap;gap:10px;margin-top:21px}.boundary-presets button{min-height:44px;padding:9px 15px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-soft);color:var(--green);font-size:var(--fs-md);line-height:1.5;text-align:center}.boundary-presets button:hover:not(:disabled){border-color:var(--green);background:var(--surface-hover)}.boundary-presets button[aria-pressed="true"],.boundary-presets button.selected{border-color:var(--green);background:var(--green);color:white}.boundary-presets button:disabled{color:var(--muted);background:#f6f7f4;opacity:.7}#boundary-fields{min-width:0;margin:24px 0 0;padding:0;border:0}#boundary-fields legend{margin-bottom:12px;padding:0;font-size:var(--fs-md);font-weight:550}.boundary-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.boundary-options label{display:flex;align-items:center;gap:9px;min-width:0;min-height:48px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-mist);font-size:var(--fs-md);line-height:1.5;cursor:pointer}.boundary-options label:hover{border-color:var(--border-accent)}.boundary-options label:has(input:checked),.boundary-options label.selected{border-color:var(--border-accent);background:var(--surface-leaf);color:var(--green)}.boundary-options input[type="checkbox"]{flex-shrink:0;width:19px;height:19px;margin:0;accent-color:var(--green);cursor:pointer}.boundary-options input[type="checkbox"]:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.boundary-options label:has(input:disabled){color:var(--muted);background:#f6f7f4;cursor:default}.boundary-options input:disabled{cursor:default}.boundary-result{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:7px 20px;margin-top:22px;padding:18px 20px;background:var(--surface-tint);border-radius:10px}.boundary-result>span{font-size:var(--fs-md);color:var(--muted)}.boundary-result strong{justify-self:end;min-width:0;color:var(--green);font-size:26px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}.boundary-result p{grid-column:1/-1;font-size:var(--fs-sm);color:var(--muted)}
@media(max-width:940px){.boundary-section{padding:28px}.boundary-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.card-bottom{gap:10px}.card-action{min-height:36px;padding:7px 12px}.card-state{margin-top:12px;font-size:var(--fs-xs)}.detail-notice{font-size:var(--fs-sm)}.stage-hook{font-size:var(--fs-md)}.boundary-section{padding:25px 22px}.boundary-heading h2{font-size:21px}.boundary-heading>p:last-child{font-size:var(--fs-sm)}.boundary-presets{gap:8px}.boundary-presets button{flex:1 1 110px;min-width:0;padding:10px 11px;font-size:var(--fs-sm)}#boundary-fields{margin-top:20px}.boundary-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.boundary-options label{padding:11px 10px;gap:7px;font-size:var(--fs-sm)}.boundary-result{grid-template-columns:1fr;gap:5px;margin-top:18px;padding:16px}.boundary-result strong{justify-self:start;font-size:25px}.boundary-result p{grid-column:1}.result-link{font-size:var(--fs-sm)}}
/* The timeline keeps scrolling inside its own track. */
.timeline-shell{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px;min-width:0;margin:0 0 18px}
.timeline-arrow{display:grid;place-items:center;min-width:44px;min-height:44px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:var(--white);color:var(--green);font-size:23px;line-height:1}
.timeline-arrow:hover:not(:disabled){background:var(--surface-hover);border-color:var(--green)}
.timeline-arrow:disabled{color:#a2afa3;background:#f1f4ef;cursor:default}
.timeline-shell .stage-nav{display:flex;flex-wrap:nowrap;gap:0;min-width:0;margin:0;padding:10px 4px 12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#99ae9a var(--surface-tint);touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch}
.timeline-shell .stage-button{position:relative;flex:1 0 132px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:17px;min-width:0;min-height:108px;padding:18px 10px 10px;border:0;border-radius:9px;background:transparent;color:var(--muted);text-align:center;scroll-snap-align:center;font-size:var(--fs-md);font-weight:550}
.timeline-shell .stage-button::before{content:"";position:absolute;top:34px;left:0;width:100%;height:2px;background:#d3dfd3}
.timeline-shell .stage-button:first-child::before{left:50%;width:50%}
.timeline-shell .stage-button:last-child::before{width:50%}
.timeline-shell .stage-button .step-number{position:relative;z-index:1;display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border:1px solid #50735a;border-radius:50%;background:var(--paper);color:var(--deep);font-size:var(--fs-xs);opacity:.4;transform:scale(1);transition:transform 300ms ease-out,opacity 300ms ease-out,background-color 300ms ease-out,color 300ms ease-out}
.timeline-shell .stage-button>span:last-child{position:relative;max-width:100%;line-height:1.5;overflow-wrap:anywhere}
.timeline-shell .stage-button.selected{background:transparent;color:var(--green)}
.timeline-shell .stage-button.selected .step-number{border-color:var(--green);background:var(--green);color:var(--lime);opacity:1;transform:scale(1.4)}
.timeline-shell .stage-button:hover:not(.selected){background:var(--surface-tint);color:var(--green)}
.timeline-shell .stage-button:focus-visible{outline-offset:-3px}
.stage-main.stage-enter{animation:stage-enter 300ms ease-out both}
@keyframes stage-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
/* Shared layouts for the study table, sandbox, material comparison and cards. */
.interactive-section{min-width:0;margin-top:32px;padding:30px 36px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);scroll-margin-top:84px}
.section-heading{max-width:850px;margin-bottom:24px}
.section-heading .eyebrow{margin-bottom:9px}
.section-heading h2{font-size:24px;font-weight:600;overflow-wrap:anywhere}
.section-intro{margin-top:12px;color:var(--muted);font-size:var(--fs-md);line-height:1.9;overflow-wrap:anywhere}
.study-comparison{min-width:0}
.comparison-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:var(--fs-sm);line-height:1.7;text-align:left}
.comparison-table caption{text-align:left;color:var(--muted);padding:0 0 14px}
.comparison-table th,.comparison-table td{padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere;word-break:normal}
.comparison-table thead th{background:var(--surface-tint);color:var(--deep);font-weight:600}
.comparison-table tbody th{font-weight:550;color:var(--green)}
.comparison-table tbody tr:last-child th,.comparison-table tbody tr:last-child td{border-bottom:0}
.comparison-table a{color:var(--green);text-underline-offset:4px}
.comparison-table small{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-xs)}
.comparison-explanation{margin-top:20px;font-size:var(--fs-md);color:var(--muted);line-height:1.9;overflow-wrap:anywhere}
.stacked-card{margin-bottom:20px}
.stacked-total{font-size:21px;font-weight:600;color:var(--green);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stacked-bar{display:flex;min-width:0;min-height:56px;margin-top:22px;border-radius:9px;background:#eef2ed;isolation:isolate}
.stack-segment{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:0;min-height:56px;padding:0;border:0;background:var(--stage-color,var(--green));color:white;cursor:pointer;transition:filter 300ms ease-out,opacity 300ms ease-out}
.stack-segment:first-child{border-radius:9px 0 0 9px}
.stack-segment:last-child{border-radius:0 9px 9px 0}
.stack-segment:only-child{border-radius:9px}
.stack-segment+.stack-segment{box-shadow:inset 1px 0 #ffffff75}
.stack-segment:hover{filter:brightness(1.1)}
.stack-segment.selected,.stack-segment[aria-pressed="true"]{z-index:1;box-shadow:inset 0 0 0 3px #ffffffd9}
.stack-segment:focus-visible{z-index:2;outline:3px solid var(--focus);outline-offset:3px}
.stack-segment>span{max-width:100%;overflow:hidden;text-overflow:clip;white-space:nowrap;font-size:var(--fs-xs);line-height:1.3}
.stacked-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 18px;margin-top:20px}
.stacked-legend>*{min-width:0}
.stacked-legend .legend-row{align-items:flex-start;flex-wrap:wrap;gap:4px 9px}
.stacked-legend button{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;min-height:44px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--white);color:var(--ink);font:inherit;font-size:var(--fs-sm);text-align:left}
.stacked-legend button:hover,.stacked-legend button[aria-pressed="true"]{border-color:var(--border-accent);background:var(--surface-leaf)}
.stacked-card .chart-empty{margin-top:16px}
.control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 24px;min-width:0;margin:0}
.control-field{display:flex;flex-direction:column;gap:8px;min-width:0;margin:0;padding:0;border:0}
.control-field>label,.control-field>legend{padding:0;color:var(--ink);font-size:var(--fs-md);font-weight:550}
.control-field label:has(input[type="checkbox"]){display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer}
.control-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),.control-field select{width:100%;max-width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid var(--border-sage);border-radius:8px;background:#fcfdfb;color:var(--ink);font:inherit;font-size:16px;line-height:1.45}
.control-field input[type="range"]{display:block;width:100%;min-width:0;min-height:44px;margin:0;accent-color:var(--green);cursor:pointer}
.control-field input[type="checkbox"],.control-field input[type="radio"]{flex-shrink:0;width:21px;height:21px;margin:0;accent-color:var(--green)}
.control-field input:disabled,.control-field select:disabled{background:#f1f4ef;color:var(--muted);cursor:not-allowed}
.control-field input:focus-visible,.control-field select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.control-value{color:var(--green);font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.control-hint{color:var(--muted);font-size:var(--fs-sm);line-height:1.8;overflow-wrap:anywhere}
.control-wide{grid-column:1/-1}
.control-feedback{min-width:0;margin-top:20px;padding:15px 18px;border:1px solid #e5d5ae;border-radius:10px;background:#fff8e8;color:#6c531f;font-size:var(--fs-md);line-height:1.8;overflow-wrap:anywhere}
.control-feedback:empty{display:none}
.scenario-toolbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-top:24px}
.scenario-presets{display:flex;flex-wrap:wrap;gap:10px;min-width:0}
.secondary-button,.scenario-presets button{min-height:44px;max-width:100%;padding:10px 15px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-soft);color:var(--green);font-size:var(--fs-md);line-height:1.5;overflow-wrap:anywhere}
.secondary-button:hover:not(:disabled),.scenario-presets button:hover:not(:disabled){border-color:var(--green);background:var(--surface-hover)}
.scenario-presets button[aria-pressed="true"],.scenario-presets button.selected{border-color:var(--green);background:var(--green);color:white}
.scenario-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}
.metric-card{min-width:0;padding:20px;border:1px solid #d8e2d3;border-radius:12px;background:#f5f8f0}
.metric-card h3,.metric-card h4{margin:0 0 10px;font-size:var(--fs-md);font-weight:600;color:var(--deep);line-height:1.6}
.metric-card>p:first-child{font-size:var(--fs-sm);color:var(--muted)}
.metric-value{display:block;margin:9px 0;color:var(--green);font-size:26px;font-weight:600;line-height:1.45;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.metric-note{color:var(--muted);font-size:var(--fs-sm);line-height:1.8;overflow-wrap:anywhere}
.method-details{min-width:0;margin-top:24px;border-top:1px solid var(--line)}
.method-details>summary{min-height:48px;padding:15px 0;color:var(--green);font-size:var(--fs-md);line-height:1.7;cursor:pointer}
.method-content{padding:3px 0 8px;color:var(--muted);font-size:var(--fs-md);line-height:1.9;overflow-wrap:anywhere}
.method-content p+p{margin-top:12px}
.method-content ul,.method-content ol{margin:12px 0;padding-left:20px}
.method-content li+li{margin-top:7px}
.method-content .source-link{font-size:var(--fs-sm)}
.pk-chart{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:22px;min-width:0;margin-top:22px}
.pk-column{display:flex;flex-direction:column;align-items:stretch;min-width:0;padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--surface-mist)}
.pk-label{display:block;color:var(--deep);font-size:16px;font-weight:600;line-height:1.6;overflow-wrap:anywhere}
.pk-value{display:block;margin:10px 0;color:var(--green);font-size:25px;font-weight:600;line-height:1.5;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.pk-column>p{font-size:var(--fs-sm);color:var(--muted);line-height:1.8;overflow-wrap:anywhere}
.pk-bar-track{position:relative;display:flex;align-items:flex-end;justify-content:center;min-width:0;height:180px;margin:18px 0 12px;border-bottom:1px solid #b6c8b5;background:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),#e0e8dc calc(25% - 1px),#e0e8dc 25%);overflow:hidden}
.pk-stack{display:flex;flex-direction:column;justify-content:flex-end;width:62%;max-width:120px;height:100%;border-radius:7px 7px 0 0;overflow:hidden;transform-origin:bottom;animation:pk-grow 700ms ease-out both}
.pk-seg{width:100%;height:0;background:var(--stage-color,var(--green));transition:height 300ms ease-out}
.pk-badge{display:inline-block;margin-left:8px;padding:2px 9px;border:1px solid var(--border-sage);border-radius:999px;background:#eef4e9;color:var(--deep);font-size:var(--fs-xs);font-weight:600;line-height:1.6;vertical-align:middle;white-space:nowrap}
.pk-badge[data-trend="higher"]{background:#fdf1e4;border-color:#e2c9a3}
.pk-badge[data-trend="lower"]{background:#eaeeff;border-color:#bcc7e8}
@keyframes pk-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.pk-attribution{margin:18px 0 0;padding:16px 18px;border:1px solid var(--line);border-left:4px solid var(--green);border-radius:0 10px 10px 0;background:var(--surface-mist);color:var(--deep);font-size:var(--fs-md);line-height:1.95;overflow-wrap:anywhere}
.pk-attribution:empty{display:none}
.pk-assumption{margin:16px 0 0;padding:12px 16px;border:1px dashed var(--border-sage);border-radius:10px;background:#f7faf3;color:var(--muted);font-size:var(--fs-sm);line-height:1.85;overflow-wrap:anywhere}
.pk-assumption:empty{display:none}
.fact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;min-width:0}
.fact-card{min-width:0;padding:20px;border:1px solid var(--line);border-radius:12px;background:#f7faf3;perspective:1200px}
.fact-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;margin:0 0 16px;padding:10px 12px;border:1px solid var(--border-sage);border-radius:8px;background:var(--white);color:var(--green);font-size:var(--fs-md);line-height:1.5;text-align:left;overflow-wrap:anywhere}
.fact-toggle:hover{background:var(--surface-leaf);border-color:var(--green)}
.fact-inner{display:grid;min-width:0;transform-style:preserve-3d;transition:transform 600ms ease-out}
.fact-front,.fact-back{grid-area:1/1;min-width:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow-wrap:anywhere}
.fact-front{display:flex;flex-direction:column;justify-content:center;gap:12px;min-height:188px;color:var(--deep);font-size:18px;font-weight:550;line-height:1.85}
.fact-back{transform:rotateY(180deg);color:var(--muted);font-size:var(--fs-md);line-height:1.9}
.fact-card.is-flipped .fact-inner{transform:rotateY(180deg)}
.fact-answer{margin-bottom:12px;color:var(--deep);font-size:var(--fs-md);font-weight:550;line-height:1.9}
.fact-source{display:inline-flex;align-items:center;min-height:44px;max-width:100%;margin-top:10px;color:var(--green);font-size:var(--fs-sm);text-underline-offset:4px;overflow-wrap:anywhere}
.fact-card.is-flipped .fact-toggle{background:var(--green);color:white;border-color:var(--green)}
.source-dialog{width:min(680px,calc(100% - 32px));max-width:calc(100% - 32px);max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);margin:auto;padding:28px 30px;border:1px solid #bfcfbd;border-radius:16px;background:var(--white);color:var(--ink);box-shadow:0 22px 90px #123c2e45;overflow:auto;overscroll-behavior:contain}
.source-dialog::backdrop{background:#142e235e;backdrop-filter:blur(3px)}
.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;min-width:0;margin-bottom:22px}
.dialog-heading h2{min-width:0;padding-top:6px;font-size:23px;font-weight:600;overflow-wrap:anywhere}
.dialog-close{display:flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;min-width:44px;min-height:44px;padding:8px 12px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-soft);color:var(--green);font-size:var(--fs-sm);line-height:1.5}
.dialog-close>span:first-child{font-size:var(--fs-xl);line-height:1}
.dialog-close:hover{border-color:var(--green);background:var(--surface-hover)}
.source-dialog-content{min-width:0;font-size:var(--fs-md);line-height:1.8;overflow-wrap:anywhere}
.source-dialog-content .source-record+.source-record{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.source-dialog-content .source-fields{grid-template-columns:100px minmax(0,1fr)}
.source-dialog-content>p+p{margin-top:12px}
@media(max-width:940px){
.interactive-section{padding:28px}
.section-heading h2{font-size:23px}
.stacked-legend{grid-template-columns:repeat(2,minmax(0,1fr))}
.scenario-results{gap:12px}
.metric-card{padding:18px}
.metric-value{font-size:23px}
.pk-column{padding:20px}
}
@media(max-width:720px){
.timeline-shell{gap:6px;margin-bottom:16px}
.timeline-shell .stage-button{flex:0 0 122px;font-size:var(--fs-sm)}
.interactive-section{margin-top:26px;padding:25px 22px}
.section-heading{margin-bottom:20px}
.section-heading h2{font-size:21px;line-height:1.5}
.section-intro{font-size:var(--fs-sm)}
.comparison-table{font-size:var(--fs-xs);line-height:1.75}
.comparison-table th,.comparison-table td{padding:11px 6px}
.comparison-explanation{font-size:var(--fs-sm)}
.stacked-total{font-size:19px}
.stacked-bar,.stack-segment{min-height:52px}
.stacked-legend{grid-template-columns:1fr;gap:10px;margin-top:17px}
.control-grid{grid-template-columns:1fr;gap:20px}
.control-field input,.control-field select{font-size:16px}
.control-hint,.control-feedback{font-size:var(--fs-sm)}
.control-feedback{padding:13px 14px}
.scenario-toolbar{gap:12px}
.scenario-presets{width:100%;gap:8px}
.scenario-presets button{flex:1 1 94px;padding:10px 11px;font-size:var(--fs-sm)}
.secondary-button{font-size:var(--fs-sm)}
.scenario-results{grid-template-columns:1fr;gap:12px}
.metric-value{font-size:25px}
.method-content{font-size:var(--fs-sm)}
.pk-chart{gap:12px}
.pk-column{padding:16px 12px}
.pk-label{font-size:var(--fs-md)}
.pk-value{font-size:21px}
.pk-badge{font-size:11px;padding:1px 7px}
.pk-column>p{font-size:var(--fs-xs)}
.pk-bar-track{height:150px}
.fact-grid{grid-template-columns:1fr;gap:14px}
.fact-card{padding:18px}
.fact-inner,.fact-card.is-flipped .fact-inner{display:block;transform:none;transition:none}
.fact-front{display:block;min-height:0;font-size:var(--fs-lg)}
.fact-back{display:none;transform:none}
.fact-card.is-flipped .fact-front{display:none}
.fact-card.is-flipped .fact-back{display:block}
.fact-answer{font-size:var(--fs-md)}
.source-dialog{width:calc(100% - 24px);max-width:calc(100% - 24px);padding:20px 18px;border-radius:12px}
.dialog-heading{gap:10px;margin-bottom:18px}
.dialog-heading h2{font-size:20px}
.dialog-close{padding:8px 10px}
.source-dialog-content .source-fields{grid-template-columns:75px minmax(0,1fr);font-size:var(--fs-sm);gap:9px 10px}
}
@media(max-width:390px){
.site-header,main,.site-footer{margin-left:16px;margin-right:16px}
.header-note{max-width:100px;text-align:right;line-height:1.7}
.interactive-section{padding:23px 18px}
.stacked-card{padding:22px 18px}
.timeline-shell .stage-button{flex-basis:116px}
.pk-chart{gap:9px}
.pk-column{padding:15px 10px}
.pk-value{font-size:19px}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
.fact-inner,.fact-card.is-flipped .fact-inner{display:block;transform:none}
.fact-front{display:block;min-height:0}
.fact-back{display:none;transform:none}
.fact-card.is-flipped .fact-front{display:none}
.fact-card.is-flipped .fact-back{display:block}
}
.detail-module-nav{position:sticky;top:12px;z-index:8;min-width:0;max-width:100%;margin:0 0 24px;padding:7px;border:1px solid #d4e0d4;border-radius:12px;background:#f7f9f5ed;box-shadow:0 5px 18px #123c2e09;backdrop-filter:blur(12px)}
.module-links{display:flex;align-items:center;gap:7px;min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#b4c4b0 transparent;-webkit-overflow-scrolling:touch}
.module-links button,.module-links a{display:inline-flex;align-items:center;justify-content:center;flex:1 0 auto;min-height:44px;padding:10px 15px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);font-size:var(--fs-sm);line-height:1.5;text-decoration:none;white-space:nowrap;transition:background-color 180ms ease-out,color 180ms ease-out,border-color 180ms ease-out}
.module-links button:hover,.module-links a:hover{background:#eaf1e3;color:var(--green);border-color:#d5e2cd}
.module-links button[aria-current="true"],.module-links button[aria-current="location"],.module-links a[aria-current="location"],.module-links .selected{background:var(--green);color:white;border-color:var(--green)}
.module-links button:focus-visible,.module-links a:focus-visible{outline-offset:-3px}
.module-links button:disabled{color:#92a091;background:transparent;cursor:default}
.form-note{grid-column:1/-1;min-width:0;padding:13px 15px;border:1px solid #d9e3d4;border-radius:9px;background:#f3f7ed;color:var(--muted);font-size:var(--fs-sm);line-height:1.8;overflow-wrap:anywhere}
.input-error{color:#98432f;font-size:var(--fs-sm);line-height:1.7;overflow-wrap:anywhere}
.control-field input.input-error,.control-field select.input-error,.control-field input[aria-invalid="true"],.control-field select[aria-invalid="true"]{border-color:#b66a51;background:#fff7f2;color:var(--ink);font-size:16px}
.fact-reveal{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;max-width:100%;padding:9px 13px;border:1px solid var(--border-sage);border-radius:8px;background:var(--white);color:var(--green);font-size:var(--fs-sm);line-height:1.6;text-align:left;overflow-wrap:anywhere}
.fact-reveal:hover{border-color:var(--green);background:var(--surface-leaf)}
.timeline-arrow,.secondary-button,.scenario-presets button,.dialog-close,.fact-toggle,.fact-reveal{transition:background-color 180ms ease-out,border-color 180ms ease-out,box-shadow 180ms ease-out,transform 180ms ease-out}
.timeline-arrow:active:not(:disabled),.secondary-button:active:not(:disabled),.scenario-presets button:active:not(:disabled),.dialog-close:active,.fact-toggle:active,.fact-reveal:active{transform:scale(.98)}
.control-field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover:not(:disabled),.control-field select:hover:not(:disabled){border-color:var(--border-accent)}
.fact-source:is(button){padding:6px 0;border:0;background:transparent;font-family:inherit;text-decoration:underline;cursor:pointer}
.fact-source:is(button):hover{color:#2e7954}
#stage-panel,#boundary-section,#study-comparison-section,#statistics,#scenario-section,#pk-section,#facts-section,#games-section,#actions-section,#detective-section{scroll-margin-top:100px}
@media(max-width:720px){.detail-module-nav{top:6px;margin-bottom:20px;padding:5px}.module-links{gap:4px}.module-links button,.module-links a{padding:10px 12px;font-size:var(--fs-xs)}.form-note{padding:12px 13px}}
@media(prefers-reduced-motion:reduce){.module-links button,.module-links a,.timeline-arrow,.secondary-button,.scenario-presets button,.dialog-close,.fact-toggle,.fact-reveal{transition:none}.timeline-arrow:active:not(:disabled),.secondary-button:active:not(:disabled),.scenario-presets button:active:not(:disabled),.dialog-close:active,.fact-toggle:active,.fact-reveal:active{transform:none}}
/* Original field-guide accents; charts retain precise, quiet styling. */
:root{--paper:#faf9f3}
.header-actions{display:flex;align-items:center;gap:20px;min-width:0}
/* ============ 首页主视觉（视觉素材 v01：海龟与洋流）============
插图的纸底已按 --paper(#faf9f3) 重新着色，与页面无缝相接。 */
html,body{overflow-x:hidden}
.cover{--art-navy:#0e3427;--art-blue:#2b6b4f;--art-teal:#124d38;--art-cyan:#a4cb5f;position:relative;max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);overflow:hidden;background:var(--paper);border-bottom:1px solid var(--line)}
.cover-body{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:64px 0 104px}
.cover-body>*{max-width:480px}
.cover-eyebrow{font-size:var(--fs-xs);font-weight:650;letter-spacing:2.4px;color:var(--art-blue)}
.cover-title{margin-top:20px;font-size:clamp(2.1rem,3.9vw,3.35rem);font-weight:700;letter-spacing:2px;line-height:1.36;color:var(--art-navy)}
.cover-underline{display:inline-block;padding-bottom:12px;border-bottom:7px solid var(--art-cyan);font-style:normal}
.cover-sub{margin-top:24px;font-size:16px;line-height:2;color:var(--art-navy)}
.cover-actions{margin-top:30px}
.cover-cta{display:inline-flex;align-items:center;gap:14px;min-height:54px;padding:0 30px;border:0;border-radius:60px;background:var(--art-teal);color:var(--white);font-size:var(--fs-lg);font-weight:600;letter-spacing:2px;transition:background .2s}
.cover-cta:hover{background:#0d3a2a}
.cover-arrow{font-size:19px;line-height:1;letter-spacing:0;transition:transform .2s}
.cover-cta:hover .cover-arrow{transform:translateX(4px)}
.cover-note{margin-top:32px;font-size:var(--fs-sm);line-height:2;color:var(--art-blue)}
.cover-art{position:absolute;top:50%;right:0;z-index:0;display:block;width:min(72vw,1030px);transform:translateY(-50%);pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,#000 84%,transparent 100%);mask-image:linear-gradient(to bottom,#000 84%,transparent 100%)}
.cover-art img{display:block;width:100%;height:auto}
/* rev.24 · 封面插画原为蓝青调，与内页深绿／青柠语言割裂：叠一层站点绿调（multiply），
让第一印象回到站点的颜色系统里，同时不动位图本身。 */
.cover-art::after{content:"";position:absolute;inset:0;background:linear-gradient(118deg,#124d3859,#dded9330 52%,#124d3826);mix-blend-mode:multiply;pointer-events:none}
/* ---- 物品卡片插图（透明底"干净版"，托在浅色圆盘上以适配深绿卡面）---- */
.card-art{display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:#f4f8ef;box-shadow:0 2px 0 #0b3327;pointer-events:none}
.card-art img{display:block;width:78%;height:78%}
/* 有插画的卡片改为两栏栅格：插画占右栏的第 2—3 行（标题 / 英文名），
参考值与底部一行仍占满整宽，避免数值被挤到换行。 */
.item-card:has(.card-art){display:grid;grid-template-columns:minmax(0,1fr) 92px;grid-template-rows:auto auto auto auto 1fr;column-gap:16px}
.item-card:has(.card-art)>*{grid-column:1}
.item-card:has(.card-art)>.card-top,.item-card:has(.card-art)>.card-reference,.item-card:has(.card-art)>.card-state,.item-card:has(.card-art)>.card-bottom{grid-column:1/-1}
.item-card:has(.card-art)>.card-art{grid-column:2;grid-row:2/4;align-self:start;justify-self:end;margin-top:4px}
.item-card:has(.card-art)>.card-bottom{align-self:end}
.item-card:has(.card-art)::after{display:none}
/* ---- 详情页标题旁的物品插画 ---- */
.detail-art{flex:0 0 auto;width:104px;height:104px;object-fit:contain}
@media(min-width:721px){.detail-heading{justify-content:flex-start}.detail-heading>div{flex:1 1 auto}.result-link{margin-left:auto}}
.item-card.active:active{transform:translateY(0) scale(.985)}
.item-card:focus-visible{border-color:#49794f;box-shadow:0 0 0 4px #e3edcc}
.item-card::after{content:"";position:absolute;right:25px;top:75px;width:5px;height:5px;background:#cbdaaa;box-shadow:5px 0 #cbdaaa,0 5px #cbdaaa;opacity:.65}
.item-card.featured::after{background:var(--lime);box-shadow:5px 0 var(--lime),0 5px var(--lime)}
.overview-section{margin:0 0 34px}.overview-section .section-heading h2{font-size:var(--fs-xl)}
.overview-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}
.overview-metrics .metric-card{padding:22px;background:var(--white);border:1px solid var(--line);border-radius:13px;min-width:0}
.overview-metrics .metric-value{font-size:28px;overflow-wrap:anywhere}
.overview-metrics .metric-card:first-child{border-top:3px solid #9ab56a}
.overview-stages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.overview-stage{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--white);font:inherit;font-size:var(--fs-sm);text-align:left;color:var(--ink);line-height:1.6}
.overview-stage:hover,.overview-stage:focus-visible{border-color:#719575;background:#f0f5e7}
.overview-stage strong{font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.overview-stage small{font-size:var(--fs-xs);color:var(--muted)}
.boundary-description{display:block;margin-top:5px;font-size:11px;font-weight:400;color:var(--muted);line-height:1.7}
.boundary-hint{margin-top:12px;font-size:var(--fs-sm);color:var(--muted);line-height:1.85;padding-left:14px;border-left:2px solid var(--line)}
.source-note{margin:10px 0 0;font-size:var(--fs-sm);color:var(--muted);line-height:1.85}
.control-field .range-number{max-width:120px}
.scenario-table{grid-column:1/-1;min-width:0;overflow-x:auto}
@media(max-width:940px){.overview-stages{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.cover-body{padding:52px 0 70px}.cover-art{width:min(66vw,760px)}}
/* rev.28 · 窄屏主视觉改为「铺满首屏」：文字在上、插图自动吃掉剩余高度（object-fit 裁切），
不再在插图下留一条空白。100svh 有小键盘/地址栏时更准，旧浏览器回落到 100vh。 */
@media(max-width:860px){
.cover{display:flex;flex-direction:column;justify-content:space-between;min-height:calc(100vh - 104px);min-height:calc(100svh - 104px)}
.cover-body{max-width:none;padding:40px 0 22px}
.cover-body>*{max-width:none}
/* position:relative 而非 static：static 下 z-index 无效，插画会盖住正文（正文是 z-index:1）。
top/right 要显式复位——基础规则里是给绝对定位写的 top:50%;right:0。 */
.cover-art{position:relative;top:auto;right:auto;transform:none;width:100%;margin-top:12px;flex:1 1 auto;min-height:170px;overflow:hidden}
.cover-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 34%}
}
@media(max-width:720px){.header-actions{gap:0}.header-actions .header-note{display:none}.cover-body{padding-left:20px;padding-right:20px}.cover-cta{min-height:50px;padding:0 24px;font-size:16px}.overview-metrics{grid-template-columns:1fr;gap:10px}.overview-metrics .metric-card{padding:17px 19px}.overview-stages{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-stage{padding:12px}.item-card::after{right:15px;top:65px}.item-card:has(.card-art){grid-template-columns:minmax(0,1fr) 74px;column-gap:12px}.card-art{width:74px;height:74px}.detail-art{width:72px;height:72px}}
@media(prefers-reduced-motion:reduce){.item-card.active:active{transform:none}}
/* One module at a time keeps the field guide readable on a phone. */
.module-pane[hidden],[role="tabpanel"][hidden]{display:none!important}
.module-pane{min-width:0}
h1[tabindex="-1"]:focus,h2[tabindex="-1"]:focus,h3[tabindex="-1"]:focus{outline:none}
.module-pane .interactive-section,.module-pane .statistics-section,.module-pane .boundary-section{margin-top:0}
/* rev.29 · 原来是 12px，与自身的 sticky top:12px 叠加后实测会让导航条顶部被视口裁掉约 8px；
抬到 32px 后落点稳定在视口内，横向按钮条也完整露出。 */
#detail-module-nav{scroll-margin-top:32px}
.overview-section{margin-bottom:20px}
.overview-section .section-heading{display:none}
.overview-metrics{margin:12px 0;gap:10px}
.overview-metrics .metric-card{padding:14px 16px}
.overview-metrics .metric-value{font-size:23px}
.overview-metrics .metric-note{margin-top:3px;font-size:var(--fs-xs)}
.overview-disclosure,.study-disclosure,.case-notes,.result-disclosure{border:1px solid var(--line);border-radius:10px;background:#fffdf7;padding:0 16px;margin:12px 0}
.overview-disclosure summary,.study-disclosure summary,.case-notes summary,.result-disclosure summary{min-height:44px;padding:11px 0;color:var(--green);cursor:pointer;font-size:var(--fs-sm);line-height:1.6}
.overview-stages{padding:0 0 14px}
.study-disclosure .interactive-section{border:0;padding:8px 0 16px}
.result-disclosure .result-section{margin:0 0 16px}
.case-notes{margin-top:22px}
.case-notes .notes-grid{margin:0;padding:6px 0 16px;font-size:var(--fs-sm)}
.chart-view-toggle{display:flex;gap:7px;flex-wrap:wrap;margin:15px 0}
.chart-view-toggle button{min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:9px;background:#fffdf7;color:var(--green);font:inherit;font-size:var(--fs-sm);cursor:pointer}
.chart-view-toggle button[aria-pressed="true"]{background:var(--green);color:white;border-color:var(--green)}
.charts-grid{display:block}
.chart-content-inactive{display:none}
.pie-layout{display:grid;grid-template-columns:minmax(160px,260px) minmax(0,1fr);align-items:center;gap:24px;max-width:660px;margin:12px auto 0}
.share-ring{width:100%;height:auto;aspect-ratio:1;margin:0;background:none!important;border-radius:0}
.share-ring:before{display:none}
.share-ring svg{display:block;width:100%;height:auto;overflow:visible}
.share-ring svg [role="button"]{cursor:pointer;transition:opacity 180ms ease-out;transform-origin:120px 120px}
.share-ring svg [role="button"]:hover{opacity:.78}
.share-ring svg [role="button"]:focus-visible{outline:none;stroke:#102e23;stroke-width:4}
.share-legend{width:100%;max-width:none;margin:0;gap:4px}
.share-legend .legend-row{display:grid;grid-template-columns:1fr auto;gap:0 8px;min-height:48px;padding:8px 6px;border:0;border-bottom:1px solid #e5e9df;border-radius:5px;background:transparent;font:inherit;font-size:var(--fs-sm);color:var(--ink);text-align:left;cursor:pointer}
.share-legend .legend-row small{grid-column:1/-1;padding-left:18px;color:var(--muted);font-size:var(--fs-xs)}
.share-legend .legend-row:hover{background:#f0f5e8}
.pie-summary{display:flex;align-items:baseline;gap:8px;margin-top:12px;color:var(--muted);font-size:var(--fs-sm)}
.pie-summary strong{color:var(--green);font-size:25px;font-variant-numeric:tabular-nums}
.scenario-results{grid-template-columns:repeat(2,minmax(0,1fr))}
.scenario-results .metric-card{padding:15px}
.scenario-results .metric-value{font-size:24px}
.scenario-main-controls{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.scenario-advanced{grid-column:1/-1;margin:0;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:#fafbf5}
.scenario-advanced summary{padding:12px 0;min-height:44px;cursor:pointer;color:var(--green);font-size:var(--fs-sm)}
.scenario-advanced .control-grid{padding:6px 0 16px}
.scenario-table-details{grid-column:1/-1;margin-top:6px;font-size:var(--fs-sm)}
.scenario-table-details summary{padding:10px 0;min-height:44px;color:var(--green);cursor:pointer}
.fact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.fact-card{padding:0;background:transparent;border:0;perspective:1300px}
.fact-inner{display:grid!important;grid-template-columns:minmax(0,1fr);width:100%;max-width:100%;transform-style:preserve-3d;transition:transform 650ms cubic-bezier(.22,.72,.2,1)!important;transform:rotateY(0deg);cursor:pointer;min-height:320px}
.fact-card.is-flipped .fact-inner{transform:rotateY(180deg)}
.fact-front,.fact-back{display:flex!important;grid-area:1/1;flex-direction:column;min-height:320px;min-width:0;margin:0;padding:24px;border:1px solid #b3c3a6;border-radius:16px;box-shadow:0 4px 0 #d6dfcb,0 10px 24px #243b2512;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow-wrap:anywhere;transform:rotateY(0deg);line-height:1.75}
.fact-front{justify-content:space-between;background:radial-gradient(circle at 80% 18%,#c6dc8a44 0 12%,transparent 12.5%),linear-gradient(145deg,#1f5d43,#103d31);color:#f5f4dc;border:4px double #94b77a}
.fact-front h3{color:inherit;font-size:var(--fs-xl);font-weight:550;line-height:1.7}
.fact-seal{align-self:flex-start;padding:5px 9px;border:1px solid #9ab781;border-radius:6px;color:#e1efac;font-size:var(--fs-xs);letter-spacing:.13em}
.fact-front-note{font-size:var(--fs-xs);font-weight:400;color:#d4e2bd}
.fact-back{justify-content:center;transform:rotateY(180deg);background:#fffdf4;color:var(--ink);font-size:var(--fs-md)}
.fact-back h3{margin-bottom:12px;font-size:var(--fs-lg);line-height:1.6;color:var(--green)}
.fact-back .metric-note{margin-top:12px;font-size:var(--fs-xs)}
.fact-toggle{width:100%;margin:12px 0 0;justify-content:center;background:transparent;border:0;color:var(--green);font-size:var(--fs-sm)}
.fact-pager,.fact-swipe-hint{display:none}
@media(max-width:720px){
.detail-heading{margin-bottom:12px}.detail-heading h1{font-size:27px}.detail-notice{margin-top:8px}
.detail-module-nav{margin-bottom:14px}.module-links button{flex:0 0 auto}
.overview-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.overview-metrics .metric-card{padding:11px 9px}.overview-metrics .metric-card>p:first-child{font-size:11px;line-height:1.5}
.overview-metrics .metric-value
.overview-metrics .metric-note{display:none}.overview-stage{font-size:var(--fs-xs)}
.module-pane .boundary-section,.interactive-section{padding:20px 16px}.module-pane .statistics-section{margin-top:0}
.chart-card{padding:18px 14px}.chart-card h3{font-size:var(--fs-lg)}.statistics-heading h2{font-size:var(--fs-xl)}
.pie-layout{grid-template-columns:1fr;gap:10px}.share-ring{width:min(210px,72vw);margin:0 auto}
.share-legend{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}.share-legend .legend-row{font-size:var(--fs-xs);min-height:50px}
.share-legend .legend-row small{font-size:11px}.legend-name{gap:5px}.chart-view-toggle{gap:5px}.chart-view-toggle button{padding:8px 10px;font-size:var(--fs-xs)}
.chart-help,.statistics-notice,.chart-insight{font-size:var(--fs-xs);line-height:1.75}
.scenario-results{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.scenario-results .metric-card{padding:12px}.scenario-results .metric-value{font-size:20px;line-height:1.5}.scenario-results .metric-note{font-size:11px}.scenario-results .metric-card>p:first-child{font-size:var(--fs-xs)}
.control-grid{gap:15px}.control-hint{font-size:var(--fs-xs);line-height:1.7}.control-feedback{font-size:var(--fs-xs)}
#facts-section{padding:20px 10px}.fact-grid{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;padding:4px 4px 20px;scroll-padding-inline:4px}.fact-grid::-webkit-scrollbar{display:none}.fact-card{flex:0 0 100%;min-width:0;scroll-snap-align:center;scroll-snap-stop:always}.fact-inner{height:auto;aspect-ratio:auto}.fact-inner,.fact-front,.fact-back{min-height:330px}.fact-front,.fact-back{padding:20px}.fact-front h3{font-size:var(--fs-xl)}
.fact-pager{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:0;font-size:var(--fs-sm);color:var(--green)}.fact-pager button{min-width:44px}.fact-swipe-hint{display:block;margin:0 0 14px;font-size:var(--fs-xs);color:var(--muted)}
.fact-card.is-flipped .fact-front{display:flex}.fact-card.is-flipped .fact-back{display:flex}
}
@media(prefers-reduced-motion:reduce){
.fact-inner,.fact-card.is-flipped .fact-inner{transform:none!important;transition:none!important;min-height:0}
.fact-front,.fact-back{min-height:260px;transform:none!important}
.fact-card:not(.is-flipped) .fact-back,.fact-card.is-flipped .fact-front{display:none!important}
}
.pk-unit{display:block;margin-top:8px;font-size:var(--fs-sm);color:var(--muted)}
.scenario-unit-banner{padding:13px 15px;border:1px solid #dec89a;border-radius:9px;background:#fff8ea;color:#6d4c12;font-size:var(--fs-sm);line-height:1.8}
.footer-replay{color:var(--green);text-underline-offset:4px;min-height:24px;display:inline-flex;align-items:center}
/* ---------- 模块扩展：侦探社 / 行动清单 ---------- */
.detective-section,.actions-section{margin-top:36px;padding:32px 36px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
.detective-section .section-heading h2,.actions-section .section-heading h2{font-size:25px;font-weight:600}
.detective-notice{margin-bottom:20px}
.detective-board{display:grid;grid-template-columns:1.55fr 1fr;gap:26px;align-items:start;min-width:0}
.detective-report{min-width:0;padding:24px 26px;border:1px solid #e2d7be;border-radius:12px;background:#fffdf7}
.detective-meta{display:flex;flex-direction:column;gap:4px;padding-bottom:14px;margin-bottom:16px;border-bottom:1px dashed #e2d7be}
.detective-meta>span{font-size:16px;font-weight:600;color:var(--deep);overflow-wrap:anywhere}
.detective-meta>small{font-size:var(--fs-xs);color:var(--muted)}
.detective-lines{display:grid;gap:10px;margin:0;padding:0;list-style:none;min-width:0}
.detective-line-item{min-width:0}
.detective-line{display:flex;align-items:flex-start;gap:12px;width:100%;padding:13px 15px;border:1px solid #e4dfd0;border-radius:10px;background:var(--white);color:var(--ink);text-align:left;font-size:var(--fs-md);line-height:1.75;transition:border-color .2s,background-color .2s}
.detective-line:hover:not(:disabled){border-color:#b4924e;background:#fffaee}
.detective-line:disabled{cursor:default;opacity:1}
.detective-line-no{flex-shrink:0;padding-top:3px;font-family:Consolas,monospace;font-size:var(--fs-xs);color:var(--muted)}
.detective-line-text{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.detective-line-mark{flex-shrink:0;padding-top:3px;font-size:var(--fs-xs);color:#9a7b3c;white-space:nowrap}
.detective-line-item.is-found .detective-line{border-color:#8fb98a;background:#eef6e9}
.detective-line-item.is-found .detective-line-mark{color:#2f6b41;font-weight:600}
.detective-line-item.is-wrong .detective-line{border-color:#d9a7a0;background:#fbf0ee}
.detective-line-item.is-wrong .detective-line-mark{color:#9c4638;font-weight:600}
.detective-verdict{margin-top:8px;padding:12px 15px;border-left:3px solid #c2d7bb;border-radius:0 9px 9px 0;background:#f5f9f1;font-size:var(--fs-sm);line-height:1.85;color:var(--muted)}
.detective-line-item.is-wrong .detective-verdict{border-left-color:#e2bdb6;background:#fdf6f4}
.detective-panel{display:grid;gap:14px;min-width:0;padding:24px 26px;border:1px solid var(--line);border-radius:12px;background:#f5f8f0}
.detective-score{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:var(--fs-md);color:var(--muted)}
.detective-score strong{font-size:var(--fs-xl);font-weight:600;color:var(--green);font-variant-numeric:tabular-nums}
.detective-bar{height:8px;border-radius:30px;background:#e2ebdc;overflow:hidden}
.detective-bar>span{display:block;height:100%;width:0;border-radius:30px;background:var(--green);transition:width .3s}
.detective-summary{padding:14px 16px;border:1px solid #c2d7bb;border-radius:10px;background:#edf6e8}
.detective-note{font-size:var(--fs-sm);line-height:1.85;color:var(--deep)}
.detective-panel .secondary-button{width:100%}
.actions-assumption{margin-bottom:14px;font-size:var(--fs-sm);color:var(--muted)}
.actions-notice{margin-bottom:18px}
.actions-list{display:grid;gap:14px;min-width:0}
.action-card{display:grid;grid-template-columns:minmax(0,1fr) 208px;gap:24px;padding:22px 24px;border:1px solid var(--line);border-radius:12px;background:#fafcf7;transition:border-color .2s,background-color .2s}
.action-card.is-picked{border-color:#8fb98a;background:#eef6e9}
.action-main{min-width:0}
.action-name{margin:0 0 9px;font-size:18px;font-weight:600;line-height:1.55;color:var(--deep);overflow-wrap:anywhere}
.action-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px;font-size:var(--fs-xs)}
.action-tag{padding:2px 10px;border:1px solid #c7d5c0;border-radius:30px;background:#f2f7ee;color:#456b4e}
.action-effort{color:var(--muted)}
.action-flag{padding:2px 10px;border:1px solid #dec89a;border-radius:30px;background:#fff5df;color:#785315}
.action-basis{margin-bottom:8px;font-size:var(--fs-xs);line-height:1.8;color:var(--muted);overflow-wrap:anywhere}
.action-note{font-size:var(--fs-sm);line-height:1.85;color:var(--muted)}
.action-side{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:14px;min-width:0;padding-left:22px;border-left:1px solid var(--line)}
.action-saving{font-size:26px;font-weight:600;line-height:1.3;color:var(--green);font-variant-numeric:tabular-nums}
.action-saving-text{font-size:19px;color:var(--muted)}
.action-saving-unit{display:block;margin-top:2px;font-size:var(--fs-xs);color:var(--muted)}
.action-toggle{display:flex;flex-direction:column;gap:8px;width:100%}
.action-toggle button{min-height:40px;padding:9px 12px;border:1px solid var(--border-strong);border-radius:9px;background:var(--white);color:var(--green);font-size:var(--fs-sm);line-height:1.4}
.action-toggle button:hover{border-color:var(--green);background:var(--surface-hover)}
.action-toggle button[aria-pressed="true"]{border-color:var(--green);background:var(--green);color:white}
.action-kind-neutral{background:#f7f8f4}
.action-kind-neutral .action-saving{color:var(--muted)}
.actions-summary{display:grid;grid-template-columns:280px minmax(0,1fr);gap:26px;margin-top:22px;padding:24px 26px;border-radius:12px;background:var(--surface-tint)}
.actions-total-heading{font-size:var(--fs-md);color:var(--muted)}
.actions-total{display:flex;flex-wrap:wrap;align-items:baseline;gap:9px;margin:6px 0 10px}
.actions-total strong{font-size:34px;font-weight:600;line-height:1.3;color:var(--green);font-variant-numeric:tabular-nums}
.actions-total span{font-size:var(--fs-sm);color:var(--muted)}
.actions-count{font-size:var(--fs-sm);color:var(--muted)}
.actions-count strong{color:var(--deep);font-variant-numeric:tabular-nums}
.actions-result-box{min-width:0}
.actions-empty{margin-bottom:8px;font-size:var(--fs-md);color:var(--green)}
.actions-note{font-size:var(--fs-sm);line-height:1.85;color:var(--muted)}
@media(max-width:940px){
.detective-section,.actions-section{padding:28px}
.detective-board{grid-template-columns:1fr}
.action-card{grid-template-columns:1fr;gap:16px}
.action-side{flex-direction:row;align-items:center;justify-content:space-between;gap:18px;padding:16px 0 0;border-left:0;border-top:1px solid var(--line)}
.action-toggle{flex-direction:row;width:auto}
.action-toggle button{min-height:44px}
.actions-summary{grid-template-columns:1fr;gap:16px}
}
@media(max-width:720px){
.detective-section,.actions-section{margin-top:26px;padding:24px 20px}
.detective-section .section-heading h2,.actions-section .section-heading h2{font-size:21px}
.detective-report{padding:18px 16px}
.detective-line{padding:11px 12px;font-size:var(--fs-md);gap:9px}
.detective-panel{padding:18px 16px}
.detective-score strong{font-size:20px}
.action-card{padding:18px 16px}
.action-name{font-size:16px}
.action-saving{font-size:var(--fs-xl)}
.action-side{flex-direction:column;align-items:stretch;gap:12px}
.action-toggle{width:100%}
.actions-summary{padding:20px 18px}
.actions-total strong{font-size:28px}
}
@media(prefers-reduced-motion:reduce){
.detective-bar>span,.action-card{transition:none}
}
/* ===== 动画增强（rev.10）：仅 .motion-on 时启用入场/浮动，尊重 reduced-motion 降级 ===== */
.motion-on .cover-eyebrow{animation:cover-rise .7s .05s both}
.motion-on .cover-title{animation:cover-rise .85s .15s both}
.motion-on .cover-sub{animation:cover-rise .85s .30s both}
.motion-on .cover-actions{animation:cover-rise .85s .45s both}
.motion-on .cover-note{animation:cover-rise .85s .60s both}
@keyframes cover-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.motion-on .cover-art{animation:cover-float 9s ease-in-out infinite}
@keyframes cover-float{0%,100%{transform:translateY(-50%)}50%{transform:translateY(calc(-50% - 16px))}}
/* 首页物品卡错落入场（用 animation，避免覆盖 hover transition） */
.motion-on .item-card{animation:card-pop .55s both;animation-delay:calc(var(--i,0)*85ms)}
/* 滚动揭示：默认可见，仅 motion-on 下先隐藏再由 .in 揭示 */
.reveal{opacity:1}
.motion-on .reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;transition-delay:calc(var(--i,0)*70ms)}
.motion-on .reveal.in{opacity:1;transform:none}
/* 排放条形生长 */
.bar-fill{transition:width .9s cubic-bezier(.22,.72,.2,1)}
/* 扇形构成图淡入 */
.motion-on .share-ring svg{animation:ring-in .7s ease both;transform-origin:center}
@keyframes ring-in{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
/* 冷知识卡错落入场 */
.motion-on .fact-grid .fact-card{animation:card-pop .5s both}
.motion-on .fact-grid .fact-card:nth-child(2){animation-delay:.07s}
.motion-on .fact-grid .fact-card:nth-child(3){animation-delay:.14s}
.motion-on .fact-grid .fact-card:nth-child(4){animation-delay:.21s}
.motion-on .fact-grid .fact-card:nth-child(5){animation-delay:.28s}
@keyframes card-pop{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
/* 数字滚动（count-up 由 JS 控制；tabular-nums 防止抖动） */
.count-num{font-variant-numeric:tabular-nums}
/* 卡片悬停微浮 */
.motion-on .metric-card,.motion-on .chart-card{transition:box-shadow .25s ease,transform .25s ease}
.motion-on .metric-card:hover,.motion-on .chart-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px #1c3a2a14}
.motion-on .overview-stage{transition:transform .2s ease,box-shadow .2s ease}
.motion-on .overview-stage:hover{transform:translateY(-2px);box-shadow:0 8px 18px #1c3a2a12}
/* ==========================================================================
rev.12（2026-10-11）按《碳迹可循_网站改进建议》落地的布局与交互样式
① 顶部阅读进度条 ② 模块导航分组＋已读小点＋模块底部导航＋常驻返回
③ 首页「怎么读」＋分类筛选＋站内搜索＋收藏 ④ 物品擂台 ⑤ 概览精简（一句话结论）
⑥ 图表引导与生长动画 ⑦ 情景沙盘差值气泡＋群体估算 ⑧ 行动清单保存／分享卡
⑨ 侦探社提示与成绩（硬伤/软伤） ⑩ 冷知识卡工具条 ⑪ 来源弹窗引用 ⑫ 手动动效开关
⑬ 双轨宽度／封面断点／窄屏阶段面板／双栏比例
========================================================================== */
/* ---------- ⑫ 动效开关（手动，优先于系统偏好） ---------- */
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{
animation-duration:.001ms!important;animation-iteration-count:1!important;
transition-duration:.001ms!important;scroll-behavior:auto!important}
.motion-toggle{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:5px 12px;border:1px solid var(--border-strong);border-radius:30px;background:var(--white);color:var(--green);font-size:var(--fs-sm);line-height:1.4}
.motion-toggle:hover{border-color:var(--green);background:#eef4e8}
.motion-toggle #motion-state{font-weight:650;letter-spacing:.5px}
.motion-toggle[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:var(--white)}
.motion-toggle[aria-pressed="true"] #motion-state{color:var(--lime)}
/* ---------- ① 顶部阅读进度条 ---------- */
.read-progress{position:fixed;top:0;left:0;right:0;z-index:60;height:3px;background:#124d3820;pointer-events:none}
.read-progress>span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),#6f9b53,var(--lime));transition:width 120ms linear}
html[data-motion="off"] .read-progress>span{transition:none}
/* ---------- 通用小控件 ---------- */
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.chip-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border:1px solid var(--border-strong);border-radius:30px;background:var(--white);color:var(--green);font-size:var(--fs-sm);line-height:1.4;text-decoration:none;white-space:nowrap}
.chip-button:hover{border-color:var(--green);background:#eef4e8}
.chip-button[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:var(--white)}
.chip-button:disabled{color:var(--muted);background:#f6f7f4;border-color:#dbe3d9}
/* ---------- ③ 首页「怎么读」三步引导 ---------- */
.read-guide{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:start;margin-bottom:26px;padding:22px 26px;border:1px solid var(--border-mid);border-radius:var(--radius);background:linear-gradient(180deg,#f2f7ec,#ffffff)}
.read-guide-title{font-size:var(--fs-md);font-weight:650;letter-spacing:3px;color:var(--green);padding-top:4px;white-space:nowrap}
.read-guide-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none}
.read-guide-steps li{display:flex;gap:12px;align-items:flex-start;min-width:0}
.read-guide-num{flex-shrink:0;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--green);color:var(--lime);font:12px/1 Consolas,monospace;letter-spacing:.5px}
.read-guide-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.read-guide-body b{font-size:var(--fs-md);font-weight:650;color:var(--deep)}
.read-guide-body small{font-size:var(--fs-sm);color:var(--muted);line-height:1.7}
/* ---------- ③ 分类筛选 / 搜索 / 收藏 ---------- */
.item-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.category-filter{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.category-filter button{min-height:40px;padding:8px 14px;border:1px solid var(--border-strong);border-radius:30px;background:var(--white);color:var(--green);font-size:var(--fs-sm);line-height:1.4}
.category-filter button:hover{border-color:var(--green);background:#eef4e8}
.category-filter button[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:var(--white)}
.item-tools-side{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.site-search{display:block;min-width:0}
.site-search input{width:min(260px,60vw);min-height:40px;padding:8px 14px;border:1px solid var(--border-strong);border-radius:30px;background:var(--white);color:var(--ink);font:inherit;font-size:var(--fs-sm)}
.site-search input:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.search-results{margin:-6px 0 20px;padding:16px 20px;border:1px solid var(--border-mid);border-radius:12px;background:var(--white)}
.search-results p{margin:0 0 10px;font-size:var(--fs-sm);color:var(--muted)}
.search-results ul{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.search-results button{display:flex;align-items:baseline;gap:10px;width:100%;min-height:44px;padding:9px 12px;border:1px solid transparent;border-radius:9px;background:#f6f9f2;color:var(--ink);text-align:left;font-size:var(--fs-md)}
.search-results button:hover{border-color:var(--border-accent);background:var(--surface-leaf)}
.search-results small{flex-shrink:0;font-size:var(--fs-xs);color:var(--muted);letter-spacing:.5px}
.item-empty{margin:0 0 18px;padding:18px;border:1px dashed var(--border-dash);border-radius:12px;font-size:var(--fs-md);color:var(--muted)}
.item-card{position:relative}
/* 注意：收藏星标是 .item-cell 的兄弟节点（app.js 里 cell.append(card) 之后又 cell.append(book)），
不是 .item-card 的后代——原来写成 .item-card .card-bookmark 全是死规则，
星标会以 static 流式布局掉到卡片外面去。锚点应用 .item-cell；深色卡面用相邻兄弟选择器。 */
.item-cell .card-bookmark{position:absolute;top:12px;right:12px;z-index:2;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:#ffffffd9;color:var(--muted);font-size:var(--fs-md);line-height:1}
.item-cell .card-bookmark:hover{border-color:var(--green);color:var(--green)}
.item-cell .card-bookmark[aria-pressed="true"]{background:var(--lime);border-color:var(--green);color:var(--deep)}
.item-card.featured~.card-bookmark{background:#ffffff26;border-color:#ffffff59;color:#e6f0e0}
.item-card.featured~.card-bookmark[aria-pressed="true"]{background:var(--lime);color:var(--deep)}
.card-top{padding-right:34px}
/* ---------- ④ 物品擂台 ---------- */
.arena-section{margin-top:46px;padding:30px 36px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);scroll-margin-top:84px}
.arena-controls{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.arena-controls label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:var(--fs-sm);color:var(--muted)}
.arena-controls select{min-width:190px;min-height:44px;padding:8px 12px;border:1px solid var(--border-strong);border-radius:10px;background:var(--white);color:var(--ink);font:inherit;font-size:var(--fs-md)}
.arena-vs{display:grid;place-items:center;align-self:center;width:42px;height:42px;border-radius:50%;background:var(--surface-tint);color:var(--green);font:14px/1 Consolas,monospace;letter-spacing:1px}
.arena-board{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.arena-card{min-width:0;padding:22px 24px;border:1px solid var(--line);border-radius:12px;background:var(--surface-mist)}
.arena-card h3{font-size:19px;font-weight:600;margin-bottom:4px;overflow-wrap:anywhere}
.arena-card .arena-en{font-size:var(--fs-xs);letter-spacing:1.2px;color:var(--muted)}
.arena-metrics{display:grid;gap:12px;margin-top:18px}
.arena-metric{display:grid;gap:4px;min-width:0}
.arena-metric>span{font-size:var(--fs-xs);color:var(--muted)}
.arena-metric>strong{font-size:20px;font-weight:600;color:var(--green);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.arena-bar{display:block;height:10px;border-radius:3px;background:#e7ede4;overflow:hidden}
.arena-bar>span{display:block;height:100%;background:var(--green);transition:width 320ms ease-out}
.arena-card.win .arena-bar>span{background:#4b8a54}
.arena-note{grid-column:1/-1;margin-top:4px;font-size:var(--fs-sm);color:var(--muted);line-height:1.9}
.arena-empty{grid-column:1/-1;padding:18px;border:1px dashed var(--border-dash);border-radius:12px;font-size:var(--fs-md);color:var(--muted)}
/* ---------- ② 模块导航分组＋已读小点 ---------- */
.module-group-label{align-self:center;flex:0 0 auto;padding:0 4px 0 14px;font-size:11px;letter-spacing:2px;color:var(--muted);white-space:nowrap;border-left:1px solid var(--line)}
.module-links>.module-group-label:first-child{border-left:0;padding-left:2px}
#detail-module-nav [data-section]{position:relative}
#detail-module-nav [data-section].is-read{padding-right:22px}
#detail-module-nav [data-section].is-read::after{content:"";position:absolute;top:7px;right:8px;width:6px;height:6px;border-radius:50%;background:#7c9c74}
#detail-module-nav [data-section].is-read[aria-selected="true"]::after{background:var(--lime)}
/* ---------- ② 模块底部导航 ---------- */
.module-foot{display:none;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:26px;padding-top:18px;border-top:1px dashed var(--border-mid)}
.module-foot.is-on{display:flex}
.module-foot-note{margin-right:auto;font-size:var(--fs-xs);color:var(--muted)}
.module-foot button{min-height:40px}
/* ---------- ② 常驻返回顶部 / 快速跳转 ---------- */
.page-tools{position:fixed;right:22px;bottom:22px;z-index:55;display:flex;flex-direction:column;gap:9px;align-items:flex-end}
.page-tool{min-height:44px;padding:9px 15px;border:1px solid var(--border-strong);border-radius:30px;background:#fffffff2;backdrop-filter:blur(6px);color:var(--green);font-size:var(--fs-sm);box-shadow:0 6px 18px #123c2e1f}
.page-tool:hover{border-color:var(--green);background:var(--white)}
.page-tool[hidden]{display:none}
/* rev.28 · 补上容器自身的 [hidden]：display:flex 会盖掉 UA 的 [hidden]{display:none}，
导致 updatePageTools() 设的 hidden 不生效——手机上首页就一直压着卡片右下角。 */
.page-tools[hidden]{display:none!important}
/* ---------- ⑤ 概览精简：一句话结论 ---------- */
.overview-headline{display:grid;gap:12px;margin-bottom:20px;padding:22px 26px;border:1px solid var(--border-mid);border-radius:var(--radius);background:#f6f9f2}
.overview-headline .oh-lead{font-size:var(--fs-lg);font-weight:600;color:var(--deep);line-height:1.75;overflow-wrap:anywhere}
.overview-headline .oh-facts{display:flex;flex-wrap:wrap;gap:10px}
.overview-headline .oh-chip{display:inline-flex;align-items:baseline;gap:7px;padding:6px 12px;border-radius:30px;background:var(--white);border:1px solid var(--border-mid);font-size:var(--fs-sm);color:var(--muted)}
.overview-headline .oh-chip strong{font-size:var(--fs-md);color:var(--green);font-variant-numeric:tabular-nums}
/* ---------- ⑥ 图表引导与生长动画 ---------- */
.chart-view-help{margin:12px 0 0;font-size:var(--fs-sm);color:var(--muted);line-height:1.8;overflow-wrap:anywhere}
.chart-view-toggle button{transition:background-color 180ms ease-out,color 180ms ease-out,border-color 180ms ease-out}
.charts-grid.grow-in .bar-fill{animation:bar-grow 420ms cubic-bezier(.2,.7,.3,1) both}
.charts-grid.grow-in .share-ring{animation:chart-grow 420ms cubic-bezier(.2,.7,.3,1) both}
@keyframes chart-grow{from{opacity:.25;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes bar-grow{from{transform:scaleX(.02)}to{transform:scaleX(1)}}
.bar-fill{transform-origin:left center}
.emissions-bars.is-hot .chart-row.is-max{background:#eef5e6;border-radius:9px}
.emissions-bars.is-hot .chart-row.is-max .bar-fill{box-shadow:0 0 0 2px #ffffffcc,0 0 0 4px #123c2e26}
/* ---------- ⑦ 情景沙盘差值气泡＋群体估算 ---------- */
.scenario-compare{display:grid;gap:12px;margin-top:18px}
.diff-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0;padding:13px 16px;border:1px solid var(--border-mid);border-radius:12px;background:var(--surface-mist)}
.diff-row>span{font-size:var(--fs-sm);color:var(--muted)}
.diff-row>strong{font-size:var(--fs-md);font-weight:600;font-variant-numeric:tabular-nums;color:var(--green)}
.diff-bubble{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;border-radius:30px;font-size:var(--fs-sm);font-weight:600;font-variant-numeric:tabular-nums;line-height:1.5}
.diff-bubble.down{background:#e6f2e4;color:#1d6b39}
.diff-bubble.up{background:#fdf0e2;color:#96551a}
.diff-bubble.flat{background:#eef1ec;color:var(--muted)}
.diff-bubble.down::before{content:"\25BC";font-size:10px}
.diff-bubble.up::before{content:"\25B2";font-size:10px}
.diff-bubble.flat::before{content:"\FF1D";font-size:11px}
.group-estimate{display:grid;gap:8px;padding:16px 18px;border:1px dashed #c7b083;border-radius:12px;background:#fffaee}
.group-estimate>span{font-size:var(--fs-xs);letter-spacing:.5px;color:#8a6a22}
.group-estimate .ge-value{font-size:var(--fs-xl);font-weight:650;color:#785315;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.group-estimate p{font-size:var(--fs-sm);color:#8a6a22;line-height:1.8}
.group-estimate[hidden]{display:none}
/* ---------- ⑧ 行动清单工具条与分享卡 ---------- */
.actions-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px}
.actions-tools-note{margin-left:auto;font-size:var(--fs-xs);color:var(--muted)}
.actions-card-wrap{display:grid;gap:12px;justify-items:center;margin-top:20px}
.actions-card{display:block;width:min(360px,90vw);height:auto;border-radius:14px;border:1px solid var(--line);background:var(--white)}
.actions-card-tools{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.actions-saved{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:#1d6b39}
.actions-saved::before{content:"\2713"}
/* ---------- ⑨ 侦探社提示与成绩（硬伤/软伤） ---------- */
.detective-split{display:grid;gap:6px;margin:0;font-size:var(--fs-sm);color:var(--muted);line-height:1.7}
.detective-split b{color:var(--deep);font-variant-numeric:tabular-nums}
.detective-tools{display:flex;gap:8px;flex-wrap:wrap}
.detective-tools .chip-button{flex:1 1 auto}
.detective-hint{display:grid;gap:4px;margin-top:12px;padding:12px 14px;border:1px dashed #c7b083;border-radius:10px;background:#fffaee;font-size:var(--fs-sm);color:#8a6a22;line-height:1.75}
.detective-line .line-tag{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:1px 8px;border-radius:30px;font-size:11px;line-height:1.7;vertical-align:middle}
.detective-line .line-tag.hard{background:#fbe4e4;color:#96322f}
.detective-line .line-tag.soft{background:#e8eef7;color:#325a91}
/* ---------- ⑩ 冷知识卡工具条 ---------- */
.fact-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.fact-daily-note{font-size:var(--fs-xs);color:var(--muted)}
/* ---------- ⑪ 来源弹窗引用 ---------- */
.dialog-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.cite-note{margin-left:auto;font-size:var(--fs-xs);color:var(--muted)}
.cite-note.ok{color:#1d6b39}
/* ---------- ⑬ 双轨宽度：阅读栏收窄 ---------- */
@media(min-width:1100px){
.section-heading{max-width:820px}
.overview-headline{max-width:820px}
}
/* ---------- ⑬ 封面 860px 断点改成连续过渡 ---------- */
@media(max-width:1000px) and (min-width:861px){
.cover-art{width:clamp(58vw,72vw,86vw);right:clamp(-8vw,-3vw,0vw);opacity:.92}
.cover-body{padding-left:clamp(0px,4vw,26px)}
}
/* 仅 861–900 的过渡带（原来写 max-width:900 会把 ≤860 的 width:100% 覆盖掉） */
@media(min-width:861px) and (max-width:900px){
.cover-art{width:min(74vw,860px);opacity:.9}
}
/* ---------- ⑬ 窄屏阶段面板：数值做成标题下的高亮胶囊 ---------- */
@media(max-width:720px){
.stage-metric{display:flex;flex-direction:row;align-items:center;gap:12px;flex-wrap:wrap;order:-1;margin-bottom:4px;padding:14px 0 0;border-top:1px solid var(--line);border-left:0}
.stage-metric>p{font-size:var(--fs-xs)}
.stage-metric strong{font-size:20px;margin:0;padding:6px 14px;border-radius:30px;background:var(--surface-leaf);color:var(--green)}
.stage-metric>span{font-size:var(--fs-xs)}
.page-tools{right:14px;bottom:14px}
.page-tool{padding:8px 12px;font-size:var(--fs-xs)}
}
/* ---------- ⑬ 侦探社 / 行动清单桌面端比例 ---------- */
@media(min-width:941px){
.detective-board{grid-template-columns:1.3fr 1fr}
}
@media(min-width:860px){
.actions-summary{grid-template-columns:1.8fr 1fr}
}
/* ---------- 响应式 ---------- */
@media(max-width:940px){
.read-guide{grid-template-columns:1fr;gap:14px;padding:20px 22px}
.read-guide-steps{grid-template-columns:1fr;gap:12px}
.arena-section{padding:26px}
.arena-board{grid-template-columns:1fr}
}
@media(max-width:720px){
.item-tools{align-items:center;gap:12px}
.item-tools-side{flex:1 1 100%;justify-content:flex-start;gap:8px}
.site-search{flex:1 1 auto;min-width:0}
.site-search input{width:100%}
.arena-section{padding:24px 20px}
.read-guide{padding:18px 16px}
.read-guide-title{letter-spacing:1.6px}
.category-filter button{min-height:38px;padding:7px 12px;font-size:var(--fs-xs)}
.module-group-label{padding:0 2px 0 10px;font-size:10px;letter-spacing:1.4px}
.chip-button{min-height:38px;padding:7px 12px;font-size:var(--fs-xs)}
.page-tools{gap:7px}
}
/* ---------- rev.12 补：物品卡片外层（承载卡片 + 收藏按钮） ---------- */
.item-cell{position:relative;display:block;min-width:0}
.item-cell>.item-card{width:100%;height:100%}
.item-cell[hidden]{display:none!important}
@media(max-width:720px){.item-cell:has(.item-card.featured){grid-column:1/-1}}
#detail-module-nav [data-section].is-current:not([aria-selected="true"]){background:#eaf1e3;color:var(--green);border-color:#d5e2cd}
.module-links .module-group-label.is-current{color:var(--green);font-weight:650;border-left-color:var(--border-accent)}
/* ---------- rev.22 · 方法学说明 / 数字量级换算 / 带走一句话 / 相邻物品导航 ---------- */
/* 首页：方法学与数据等级（details 折叠） */
.method-note{margin-top:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);overflow:hidden}
.method-note>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 22px;cursor:pointer;list-style:none;font-size:var(--fs-md);font-weight:600;color:var(--green)}
.method-note>summary::-webkit-details-marker{display:none}
.method-note>summary::after{content:"＋";flex-shrink:0;font-weight:400;color:var(--green);transition:transform .25s ease}
.method-note[open]>summary::after{transform:rotate(45deg)}
.method-note>summary:focus-visible{outline-offset:-4px}
.method-note-body{max-width:900px;padding:0 22px 22px}
.method-note-body p{font-size:var(--fs-md);color:var(--muted);line-height:1.95}
.method-note-body p+p{margin-top:12px}
.method-note-body b{color:var(--ink);font-weight:600}
.method-note-body ul{margin:14px 0 0;padding-left:20px}
.method-note-body li{font-size:var(--fs-md);color:var(--muted);line-height:1.9}
.method-note-body li+li{margin-top:8px}
/* 结果卡：数字量级换算（沿用站内口径，仅作参照） */
.total-analogy{margin-top:12px;padding:11px 15px;border:1px solid #d7e3d1;border-radius:10px;background:#ffffffab;font-size:var(--fs-sm);line-height:1.8;color:var(--deep)}
/* 带走一句话（深绿收尾卡） */
.takeaway-section{min-width:0;margin-top:32px;scroll-margin-top:84px}
.takeaway-card{position:relative;padding:32px 36px;border-radius:var(--radius);background:linear-gradient(135deg,#124d38,#0f4130);color:#eaf3e4;overflow:hidden}
.takeaway-card::after{content:"";position:absolute;right:-70px;top:-70px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,#dded9347,transparent 70%);pointer-events:none}
.takeaway-card .eyebrow{margin-bottom:10px;color:var(--lime)}
.takeaway-card .short-line{background:var(--lime)}
.takeaway-card h2{position:relative;font-size:var(--fs-xl);font-weight:650;color:var(--white)}
.takeaway-line{position:relative;margin-top:14px;font-size:18px;font-weight:500;line-height:1.85;color:#f2f7ee}
.takeaway-line b{color:var(--lime);font-weight:700}
.takeaway-analogy{position:relative;margin-top:16px;padding:12px 16px;border:1px solid #ffffff2e;border-radius:10px;background:#ffffff14;font-size:var(--fs-md);line-height:1.8;color:#dcebcf}
/* 相邻物品导航（上一件 / 回到首页 / 下一件） */
.next-item-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:12px;margin-top:18px}
.next-item-btn{display:flex;flex-direction:column;gap:4px;min-height:64px;min-width:0;padding:14px 20px;border:1px solid var(--line);border-radius:12px;background:var(--white);color:var(--ink);text-align:left;transition:border-color .2s,background .2s}
.next-item-btn:last-child{align-items:flex-end;text-align:right}
.next-item-btn:hover{border-color:var(--green);background:#f4f8ef}
.next-item-kicker{font-size:var(--fs-xs);letter-spacing:1px;color:var(--muted)}
.next-item-name{max-width:100%;font-size:16px;font-weight:600;color:var(--green);overflow-wrap:anywhere}
.next-item-home{align-self:center;justify-self:center;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:50px;background:var(--surface-tint);color:var(--green);font-size:var(--fs-md);text-decoration:none;white-space:nowrap}
.next-item-home:hover{background:#e2ecd9}
@media(max-width:720px){
.method-note>summary{padding:14px 18px;font-size:var(--fs-md)}
.method-note-body{padding:0 18px 18px}
.takeaway-section{margin-top:26px}
.takeaway-card{padding:24px 22px}
.takeaway-card h2{font-size:20px}
.takeaway-line{font-size:16px}
.takeaway-analogy{font-size:var(--fs-sm);padding:11px 14px}
.next-item-nav{grid-template-columns:1fr 1fr;gap:10px}
.next-item-mid{order:-1;grid-column:1/-1;width:100%}
.next-item-home{width:100%;justify-content:center}
.next-item-btn{min-height:60px;padding:12px 14px}
.next-item-name{font-size:var(--fs-md)}
}
/* ===================== rev.24 =====================
① 详情页模块导航分「核心路径 / 还想深挖」，深挖组默认折叠（类名控制，不动 hidden 属性）
② 物品擂台入口（首页 / 详情页底部 / 页脚共用）
③ 结果区的「坐标」一行（用站内其余物品当参照）
④ 页脚补全：品牌 / 链接 / 溯源声明 / 版权与免责
================================================== */
/* ① 模块导航分组折叠 */
.module-links:not(.deep-open) [data-deep]{display:none}
.module-links .module-more-toggle{flex:0 0 auto;gap:7px;border:1px dashed #b9cdb6;background:#f2f7ec;color:var(--green)}
.module-links .module-more-toggle:hover{background:#e8f1e0;border-color:var(--border-accent-2);color:var(--green)}
.module-links .module-more-toggle.is-open{background:var(--green);border-color:var(--green);border-style:solid;color:white}
.module-links .module-more-toggle .module-more-count{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:50px;background:var(--green);color:var(--lime);font:600 11px/1 Consolas,monospace}
.module-links .module-more-toggle.is-open .module-more-count{background:#ffffff30;color:var(--lime)}
.module-links .module-more-toggle .module-more-caret{font-size:var(--fs-xs);font-weight:400}
.module-links.deep-open [data-deep]{animation:deepIn .22s ease-out both}
@keyframes deepIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
/* ② 擂台入口 */
.arena-entry{margin-top:18px}
.arena-entry-btn{display:inline-flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:14px 22px;border:1px dashed #b9cdb6;border-radius:14px;background:linear-gradient(100deg,#f2f7ec,#eef4e6);color:var(--green);font-size:var(--fs-md);text-align:left;transition:border-color .2s,background .2s,transform .2s}
.arena-entry-btn:hover{border-color:var(--border-accent-2);background:linear-gradient(100deg,#e9f2e1,#e4efdb);transform:translateY(-1px)}
.arena-entry-kicker{flex-shrink:0;padding:3px 10px;border-radius:50px;background:var(--green);color:var(--lime);font-size:var(--fs-xs);letter-spacing:1px}
.arena-entry-arrow{margin-left:auto;font-size:var(--fs-lg)}
.next-item-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.next-item-arena{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border:1px dashed #b9cdb6;border-radius:50px;background:transparent;color:var(--green);font-size:var(--fs-sm);white-space:nowrap;transition:border-color .2s,background .2s}
.next-item-arena:hover{background:#eef4e6;border-color:var(--border-accent-2)}
/* ③ 结果区坐标行 */
.total-rank{margin-top:10px;font-size:var(--fs-sm);line-height:1.8;color:var(--muted)}
.total-rank b{color:var(--green);font-weight:650}
/* ④ 页脚补全 */
.site-footer{display:block;padding:26px 0 34px}
.footer-main{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.footer-brand{font-size:var(--fs-md);font-weight:700;letter-spacing:1.5px;color:var(--green)}
.footer-brand small{margin-left:9px;font-size:11px;letter-spacing:2px;font-weight:500;color:var(--muted)}
.footer-line{font-size:var(--fs-sm);color:var(--muted)}
.footer-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}
.footer-link{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid var(--line);border-radius:50px;background:var(--white);color:var(--green);font-size:var(--fs-sm);text-decoration:none;transition:border-color .2s,background .2s}
.footer-link:hover{border-color:var(--border-accent-2);background:#f2f7ec}
.footer-meta{max-width:780px;margin-top:16px;font-size:var(--fs-sm);line-height:1.85;color:var(--muted)}
.footer-badge{display:inline-block;margin-right:8px;padding:2px 10px;border-radius:50px;background:var(--surface-tint);color:var(--green);font-size:var(--fs-xs);font-weight:600}
.footer-copy{margin-top:12px;font-size:var(--fs-xs);color:var(--muted)}
@media(max-width:860px){
/* 窄屏下模块导航改为换行排布：横滑会把「还想深挖」挤出屏幕，折叠入口就看不见了 */
.module-links{flex-wrap:wrap;overflow-x:visible;row-gap:6px}
.module-links .module-group-label{flex:0 0 auto;padding:0 4px 0 2px;border-left:0}
.module-links .module-more-toggle{margin-left:auto}
}
@media(max-width:720px){
.module-links .module-more-toggle{padding:10px 12px}
.arena-entry-btn{flex-wrap:wrap;gap:8px;padding:13px 16px;font-size:var(--fs-md)}
.arena-entry-arrow{margin-left:0}
.next-item-arena{width:100%;justify-content:center}
.footer-main{flex-direction:column;gap:6px}
.footer-brand small{display:block;margin:4px 0 0 0}
.footer-links{gap:6px}
.footer-link{padding:0 12px;font-size:var(--fs-xs)}
.site-footer{padding-bottom:62px}
}
/* ============ rev.28 · 按测试报告修显示问题 ============ */
/* （1）卡片底部一行：摘要吃掉剩余宽度，「探索旅程」始终贴右——窄屏换行时也不再掉到左边 */
.card-bottom{gap:10px;align-items:center;flex-wrap:nowrap}
.card-summary{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.card-bottom .card-action{margin-left:auto;flex:0 0 auto}
/* （2）收藏入口：图标 + 已收藏计数，收在物品栏右侧 */
.chip-icon{font-size:var(--fs-md);line-height:1}
.chip-count{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:30px;background:#e8f0e0;color:var(--green);font:600 11px/1 Consolas,monospace}
.chip-count[hidden]{display:none}
.chip-button[aria-pressed="true"] .chip-count{background:#ffffff33;color:var(--white)}
/* （3）手机端：底部两个浮动按钮并排（原来竖排两行更挡内容），向下滚动时自动收起 */
.page-tools{transition:opacity .22s ease,transform .22s ease}
@media(max-width:860px){
.page-tools{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));flex-direction:row;align-items:center;gap:8px}
.page-tool{min-height:38px;padding:8px 12px}
.page-tools.is-tucked{opacity:0;transform:translateY(14px);pointer-events:none}
}
@media(prefers-reduced-motion:reduce){.page-tools{transition:none}}
/* 封面浮动动画的关键帧是 translateY(-50%)，只在「绝对定位居中」下成立；≤860 已改为流式排布，
必须把它关掉——注意必须放在原动画声明（文件中部）之后，否则同优先级会被覆盖。 */
@media(max-width:860px){.motion-on .cover-art{animation:none}}
/* 721–860 区间原来沿用 3 列栅格，卡片只剩约 222px，底部「摘要 + 探索旅程」放不下，
摘要被挤到 3 行。与封面同断点改成 2 列，卡片宽约 340–390px，一行放得下。 */
@media(max-width:860px){.item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}
/* ==========================================================================
rev.29 · 交互细节打磨
========================================================================== */
/* 时间线首尾箭头：到边界时除了置灰，再淡一点，明确「已经到头了」。
过渡写在 no-preference 里，避免覆盖文件中部 reduced-motion 的 transition:none。 */
.timeline-arrow:disabled{opacity:.42}
@media(prefers-reduced-motion:no-preference){
.timeline-arrow{transition:background-color 180ms ease-out,border-color 180ms ease-out,box-shadow 180ms ease-out,transform 180ms ease-out,opacity 180ms ease-out}
}
/* 封面滚动提示：轻微的上下浮动，示意封面下面还有内容。
与全站其它入场动画一致，挂在 .motion-on（动效开关 / reduced-motion 统一由它控制）之下。 */
.cover-hint{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:var(--fs-xs);letter-spacing:1.5px;color:var(--art-blue);opacity:.8}
.cover-hint .cover-hint-arrow{display:inline-block;font-size:var(--fs-md);line-height:1}
@keyframes hint-bob{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
.motion-on .cover-hint .cover-hint-arrow{animation:hint-bob 1.9s ease-in-out infinite}
/* 浮动工具：滚到接近顶部时整个淡出（「返回顶部」在那个位置本来也没用），
首页与详情页通用；配合 .is-tucked（向下滚动收起）一起避免挡内容。 */
.page-tools.is-off{opacity:0;transform:translateY(10px);pointer-events:none}
/* 物品擂台：更换对比对象后两张卡重新入场，强化「重新开赛」的观感。 */
@keyframes arena-pop{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:none}}
.motion-on .arena-board.arena-enter .arena-card{animation:arena-pop .38s ease-out both}
/* ==========================================================================
rev.30 · 首页内容增强
① 「先看一个规律」结论条：封面之后第一屏，用三个已核实数字把
「碳的大头往往不在付钱那一刻」讲透，让访客十秒内拿到一个可记住的发现。
② 过渡带压缩：窄屏把「怎么读」三步的描述收起、缩紧擂台入口，
让物品卡片更早出现。
③ 「关于本项目」复用 .method-note 样式，无需新增。
========================================================================== */
.finding{margin:30px 0 6px;padding:26px 30px;border:1px solid #d9e6d6;border-radius:var(--radius);background:linear-gradient(155deg,#eef6e6,#fbfdf8 68%)}
.finding-kicker{font-size:var(--fs-xs);font-weight:650;letter-spacing:3px;color:var(--green)}
.finding-title{margin-top:10px;font-size:clamp(1.3rem,2.3vw,1.75rem);font-weight:700;line-height:1.55;letter-spacing:.5px;color:var(--deep)}
.finding-title em{font-style:normal;color:var(--green);background-image:linear-gradient(transparent 60%,var(--lime) 60%);background-repeat:no-repeat}
.finding-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0 0;padding:0;list-style:none}
.finding-list li{display:flex;flex-direction:column;gap:3px;padding:15px 17px;border:1px solid #dde8da;border-radius:13px;background:var(--white)}
.finding-what{font-size:var(--fs-sm);font-weight:650;color:var(--muted);letter-spacing:.3px}
.finding-list strong{font-size:27px;font-weight:700;line-height:1.15;color:var(--green);font-variant-numeric:tabular-nums}
.finding-list small{font-size:12.5px;line-height:1.6;color:var(--muted)}
.finding-note{margin-top:16px;font-size:13.5px;line-height:1.9;color:var(--muted)}
.finding-src{display:block;margin-top:4px;font-size:var(--fs-xs);opacity:.82}
@media(max-width:720px){
.finding{margin-top:22px;padding:19px 17px}
.finding-title{font-size:1.28rem;line-height:1.6}
.finding-list{grid-template-columns:1fr;gap:8px;margin-top:15px}
.finding-list li{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:8px;padding:11px 13px}
.finding-list strong{font-size:20px}
.finding-list small{flex-basis:100%;font-size:var(--fs-xs);text-align:left}
}
/* 过渡带压缩 */
@media(max-width:720px){
.read-guide{grid-template-columns:1fr;gap:10px;padding:15px 17px;margin-bottom:16px}
.read-guide-title{letter-spacing:2px;padding-top:0}
.read-guide-steps{gap:8px}
.read-guide-steps li{gap:8px}
.read-guide-num{width:24px;height:24px;font-size:11px}
.read-guide-body b{font-size:13.5px}
.read-guide-body small{display:none}
.arena-entry{margin-top:12px}
.arena-entry-btn{min-height:46px;padding:12px 16px;font-size:var(--fs-md);gap:10px}
}
/* rev.30 · 详情页：「最该记住的一条」（前置到生命周期概览）+「相关物品」知识网 */
.overview-takeaway{margin-top:14px;padding:14px 18px;border:1px solid #d9e6d6;border-left:4px solid var(--green);border-radius:10px;background:#f4f9ee;font-size:var(--fs-md);line-height:1.85;color:var(--deep)}
.ot-kicker{display:block;margin-bottom:3px;font-size:11.5px;font-weight:650;letter-spacing:2px;color:var(--green)}
.overview-takeaway b{color:var(--green);font-weight:700}
.related-section{min-width:0;margin-top:32px}
.related-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
.related-card{display:flex;flex-direction:column;gap:5px;align-items:flex-start;padding:18px 20px;border:1px solid #d9e6d6;border-radius:var(--radius);background:linear-gradient(160deg,#f4f9ee,#ffffff);text-align:left;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s}
.related-card:hover{border-color:var(--border-accent-2);transform:translateY(-2px);box-shadow:0 8px 20px #123c2e12}
.related-kicker{font-size:11px;letter-spacing:2px;color:var(--muted)}
.related-name{font-size:19px;font-weight:700;line-height:1.3;color:var(--deep)}
.related-why{font-size:13.5px;line-height:1.75;color:var(--muted)}
.related-foot{margin-top:4px;font-size:var(--fs-sm);font-weight:650;color:var(--green);font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.related-card{transition:none}.related-card:hover{transform:none}}
@media(max-width:720px){.related-list{grid-template-columns:1fr;gap:10px}.related-card{padding:15px 17px}.overview-takeaway{padding:12px 15px;font-size:13.5px}}
/* rev.30 · 24 款游戏改为按需加载后的等待提示（首屏不再预载约 500 KB 脚本与 games.css） */
.gm-loading{margin:0 0 10px;padding:14px 18px;border:1px dashed #c3d2be;border-radius:12px;background:#f6faf2;font-size:13.5px;color:var(--muted);text-align:center}
.gm-loading[hidden]{display:none!important}
/* rev.30 · 3 分钟导览：底部浮层，六站串起这个站的主线 */
.tour-panel{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;width:min(600px,calc(100vw - 32px));padding:16px 18px;border:1px solid #b9cdb6;border-radius:15px;background:var(--white);box-shadow:0 14px 40px rgba(18,60,46,.22)}
.tour-panel[hidden]{display:none!important}
.tour-step{margin:0;font-size:var(--fs-xs);font-weight:650;letter-spacing:2px;color:var(--green)}
.tour-text{margin:7px 0 0;font-size:var(--fs-md);line-height:1.85;color:var(--ink)}
.tour-tools{display:flex;align-items:center;gap:9px;margin-top:13px;flex-wrap:wrap}
.tour-tools button{min-height:40px;padding:0 16px;border:1px solid var(--green);border-radius:999px;background:var(--green);color:var(--white);font-size:13.5px;cursor:pointer}
.tour-tools button.ghost{background:var(--white);color:var(--green)}
.tour-tools button:disabled{opacity:.45;cursor:default}
.tour-pos{margin-left:auto;font-size:var(--fs-xs);color:var(--muted);font-variant-numeric:tabular-nums}
@keyframes tour-in{from{opacity:.4;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%)}}
.motion-on .tour-panel.tour-in{animation:tour-in .34s ease-out both}
@media(max-width:720px){.tour-panel{width:calc(100vw - 24px);padding:14px 15px}.tour-text{font-size:13.5px}.tour-tools button{min-height:38px;padding:0 13px;font-size:var(--fs-sm)}}
/* ★ rev.31 同类对比：预设对比值 */
.pk-seg.pk-solid{background:linear-gradient(180deg,#57a173,#2f6f4a)}
.pk-column>.pk-range{margin:4px 0 0;color:var(--muted);font-size:var(--fs-xs);line-height:1.7}
/* ★ rev.32 · 按《碳迹可循_图标设计清单》接入「按清单顺序完整素材包」（assets/icons、assets/bg） */
/* —— 01 五段生命周期阶段图标（app.js 在 .stage-button 内插 .stage-ico[data-stage]） —— */
.stage-ico{width:22px;height:22px;background:center/contain no-repeat;flex-shrink:0}
.stage-ico[data-stage="raw"]{background-image:url(assets/icons/stage/raw-default.png)}
.stage-ico[data-stage="factory"]{background-image:url(assets/icons/stage/factory-default.png)}
.stage-ico[data-stage="truck"]{background-image:url(assets/icons/stage/truck-default.png)}
.stage-ico[data-stage="use"]{background-image:url(assets/icons/stage/use-default.png)}
.stage-ico[data-stage="recycle"]{background-image:url(assets/icons/stage/recycle-default.png)}
.stage-ico[data-stage="production-combined"]{background-image:url(assets/icons/stage/production-combined-default.png)}
.stage-ico[data-stage="repair"]{background-image:url(assets/icons/stage/repair-default.png)}
.stage-button.selected .stage-ico[data-stage="raw"]{background-image:url(assets/icons/stage/raw-active.png)}
.stage-button.selected .stage-ico[data-stage="factory"]{background-image:url(assets/icons/stage/factory-active.png)}
.stage-button.selected .stage-ico[data-stage="truck"]{background-image:url(assets/icons/stage/truck-active.png)}
.stage-button.selected .stage-ico[data-stage="use"]{background-image:url(assets/icons/stage/use-active.png)}
.stage-button.selected .stage-ico[data-stage="recycle"]{background-image:url(assets/icons/stage/recycle-active.png)}
.stage-button.selected .stage-ico[data-stage="production-combined"]{background-image:url(assets/icons/stage/production-combined-active.png)}
.stage-button.selected .stage-ico[data-stage="repair"]{background-image:url(assets/icons/stage/repair-active.png)}
/* —— 02 模块导航九枚图标（CSS 变量切 default/active） —— */
#detail-module-nav [data-section="stage-panel"]{--mod-ico:url(assets/icons/module/journey-default.png);--mod-ico-on:url(assets/icons/module/journey-active.png)}
#detail-module-nav [data-section="boundary-section"]{--mod-ico:url(assets/icons/module/boundary-default.png);--mod-ico-on:url(assets/icons/module/boundary-active.png)}
#detail-module-nav [data-section="statistics"]{--mod-ico:url(assets/icons/module/pie-default.png);--mod-ico-on:url(assets/icons/module/pie-active.png)}
#detail-module-nav [data-section="scenario-section"]{--mod-ico:url(assets/icons/module/sliders-default.png);--mod-ico-on:url(assets/icons/module/sliders-active.png)}
#detail-module-nav [data-section="pk-section"]{--mod-ico:url(assets/icons/module/compare-default.png);--mod-ico-on:url(assets/icons/module/compare-active.png)}
#detail-module-nav [data-section="games-section"]{--mod-ico:url(assets/icons/module/game-default.png);--mod-ico-on:url(assets/icons/module/game-active.png)}
#detail-module-nav [data-section="facts-section"]{--mod-ico:url(assets/icons/module/cards-default.png);--mod-ico-on:url(assets/icons/module/cards-active.png)}
#detail-module-nav [data-section="detective-section"]{--mod-ico:url(assets/icons/module/detective-default.png);--mod-ico-on:url(assets/icons/module/detective-active.png)}
#detail-module-nav [data-section="actions-section"]{--mod-ico:url(assets/icons/module/checklist-default.png);--mod-ico-on:url(assets/icons/module/checklist-active.png)}
#detail-module-nav [data-section]::before{content:"";width:15px;height:15px;margin-right:6px;background:center/contain no-repeat;background-image:var(--mod-ico);flex-shrink:0}
#detail-module-nav [data-section][aria-selected="true"]::before{background-image:var(--mod-ico-on)}
#detail-module-nav [data-section][aria-selected="true"]:hover::before{background-image:var(--mod-ico-on)}
/* —— 04 阅读引导三步（数字圆改「图标＋编号」） —— */
.read-guide-steps li:nth-child(1) .read-guide-num{background:var(--white) url(assets/icons/guide/journey-default.png) center 6px/16px 16px no-repeat}
.read-guide-steps li:nth-child(2) .read-guide-num{background:var(--white) url(assets/icons/guide/pie-default.png) center 6px/16px 16px no-repeat}
.read-guide-steps li:nth-child(3) .read-guide-num{background:var(--white) url(assets/icons/guide/hand-default.png) center 6px/16px 16px no-repeat}
.read-guide-steps .read-guide-num{width:40px;height:40px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:4px;font-size:10px;letter-spacing:0;color:var(--green)}
/* —— 05 图表与统计切换三枚 —— */
.chart-view-toggle button[data-chart-view="pie"]{--cv:url(assets/icons/chart/pie-default.png);--cv-on:url(assets/icons/chart/pie-active.png)}
.chart-view-toggle button[data-chart-view="bar"]{--cv:url(assets/icons/chart/bar-default.png);--cv-on:url(assets/icons/chart/bar-active.png)}
.chart-view-toggle button[data-chart-view="stacked"]{--cv:url(assets/icons/chart/stacked-default.png);--cv-on:url(assets/icons/chart/stacked-active.png)}
.chart-view-toggle button::before{content:"";width:15px;height:15px;margin-right:5px;background:center/contain no-repeat;background-image:var(--cv);flex-shrink:0}
.chart-view-toggle button[aria-pressed="true"]::before{background-image:var(--cv-on)}
/* —— 06 物品类别筛选七枚 —— */
#category-filter button{--cat:url(assets/icons/cat/all-default.png);--cat-on:url(assets/icons/cat/all-active.png)}
#category-filter button[data-category="衣着"]{--cat:url(assets/icons/cat/shirt-default.png);--cat-on:url(assets/icons/cat/shirt-active.png)}
#category-filter button[data-category="数码"]{--cat:url(assets/icons/cat/phone-default.png);--cat-on:url(assets/icons/cat/phone-active.png)}
#category-filter button[data-category="食物"]{--cat:url(assets/icons/cat/food-default.png);--cat-on:url(assets/icons/cat/food-active.png)}
#category-filter button[data-category="餐食"]{--cat:url(assets/icons/cat/takeaway-default.png);--cat-on:url(assets/icons/cat/takeaway-active.png)}
#category-filter button[data-category="能源"]{--cat:url(assets/icons/cat/bolt-default.png);--cat-on:url(assets/icons/cat/bolt-active.png)}
#category-filter button[data-category="饮品"]{--cat:url(assets/icons/cat/cup-default.png);--cat-on:url(assets/icons/cat/cup-active.png)}
#category-filter button::before{content:"";width:15px;height:15px;margin-right:6px;background:center/contain no-repeat;background-image:var(--cat);flex-shrink:0}
#category-filter button[aria-pressed="true"]::before{background-image:var(--cat-on)}
/* —— 03 收藏书签 / 08 收藏入口 —— */
.item-cell .card-bookmark::before{content:"";width:16px;height:16px;background:url(assets/icons/mark/bookmark-default.png) center/contain no-repeat}
.item-cell .card-bookmark[aria-pressed="true"]::before{background-image:url(assets/icons/mark/bookmark-active.png)}
.chip-icon{width:15px;height:15px;background:url(assets/icons/tool/bookmark-default.png) center/contain no-repeat;font-size:0;overflow:hidden;color:transparent}
#bookmark-toggle[aria-pressed="true"] .chip-icon{background-image:url(assets/icons/tool/bookmark-active.png)}
/* —— 08 搜索放大镜 —— */
.site-search input{padding-left:36px;background:var(--white) url(assets/icons/tool/search-default.png) 13px center/15px 15px no-repeat}
.site-search input:focus-visible{background-image:url(assets/icons/tool/search-active.png)}
/* —— 09 信息提示 / 10 方向操作符号 —— */
.home-note-ico{display:inline-block;width:14px;height:14px;margin-right:2px;background:url(assets/icons/ui/info-default.png) center/contain no-repeat;vertical-align:-2px}
.timeline-arrow{background:var(--white) center/19px 19px no-repeat;font-size:0;color:transparent}
#stage-prev{background-image:url(assets/icons/ui/arrow-left-default.png)}
#stage-next{background-image:url(assets/icons/ui/arrow-right-default.png)}
#stage-prev:hover:not(:disabled){background-color:var(--surface-hover);background-image:url(assets/icons/ui/arrow-left-active.png)}
#stage-next:hover:not(:disabled){background-color:var(--surface-hover);background-image:url(assets/icons/ui/arrow-right-active.png)}
#fact-prev{background-image:url(assets/icons/ui/arrow-left-default.png);background-size:15px 15px;background-repeat:no-repeat;background-position:center;font-size:0;color:transparent;min-width:44px}
#fact-next{background-image:url(assets/icons/ui/arrow-right-default.png);background-size:15px 15px;background-repeat:no-repeat;background-position:center;font-size:0;color:transparent;min-width:44px}
#fact-prev:hover{background-image:url(assets/icons/ui/arrow-left-active.png)}
#fact-next:hover{background-image:url(assets/icons/ui/arrow-right-active.png)}
.cover-arrow{display:inline-block;width:18px;height:18px;background:url(assets/icons/ui/arrow-right-default.png) center/contain no-repeat;font-size:0;color:transparent}
.cover-hint .cover-hint-arrow{display:inline-block;width:15px;height:15px;background:url(assets/icons/ui/arrow-down-default.png) center/contain no-repeat;font-size:0;color:transparent}
.arena-entry-arrow{display:inline-block;width:16px;height:16px;background:url(assets/icons/ui/arrow-right-default.png)center/contain no-repeat;font-size:0;color:transparent}
.dialog-close>span:first-child{width:14px;height:14px;background:url(assets/icons/ui/close-default.png) center/contain no-repeat;font-size:0;overflow:hidden;line-height:1}
.dialog-close:hover>span:first-child{background-image:url(assets/icons/ui/close-active.png)}
/* —— 11 对比涨跌趋势 / 12 已完成标记 —— */
.diff-bubble.down::before{content:"";width:11px;height:11px;background:url(assets/icons/trend/trend-down-default.png) center/contain no-repeat}
.diff-bubble.up::before{content:"";width:11px;height:11px;background:url(assets/icons/trend/trend-up-default.png) center/contain no-repeat}
.diff-bubble.flat::before{content:"";width:11px;height:11px;background:url(assets/icons/trend/equal-default.png) center/contain no-repeat}
#detail-module-nav [data-section].is-read::after{width:11px;height:11px;top:5px;right:5px;border-radius:0;background:url(assets/icons/ui/check-default.png) center/contain no-repeat}
#detail-module-nav [data-section].is-read[aria-selected="true"]::after{background-image:url(assets/icons/ui/check-active.png)}
.actions-saved::before{content:"";width:12px;height:12px;background:url(assets/icons/ui/check-default.png) center/contain no-repeat}
/* —— 07 页脚与操作区 / 18 附加操作 —— */
#to-module-nav::before{content:"";width:14px;height:14px;margin-right:6px;background:url(assets/icons/act/navigation-default.png) center/contain no-repeat;flex-shrink:0}
#to-top::before{content:"";width:14px;height:14px;margin-right:6px;background:url(assets/icons/act/top-default.png) center/contain no-repeat;flex-shrink:0}
.footer-replay::before{content:"";width:14px;height:14px;margin-right:6px;background:url(assets/icons/act/replay-default.png) center/contain no-repeat;flex-shrink:0}
#actions-card-download::before{content:"";width:14px;height:14px;margin-right:6px;background:url(assets/icons/extra/download-default.png) center/contain no-repeat;flex-shrink:0}
#cite-apa::before,#cite-gbt::before{content:"";width:14px;height:14px;margin-right:6px;background:url(assets/icons/extra/copy-default.png) center/contain no-repeat;flex-shrink:0}
.next-item-home::before{content:"";width:14px;height:14px;margin-right:6px;background:url(assets/icons/extra/home-default.png) center/contain no-repeat;flex-shrink:0}
/* —— 17 主题背景：详情页顶部通栏（app.js 按当前物品切 --detail-bg） —— */
#detail-view{position:relative}
.detail-heading{position:relative;overflow:hidden;border-radius:var(--radius)}
.detail-banner{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;opacity:.12;pointer-events:none}
.detail-heading>*:not(.detail-banner){position:relative;z-index:1}
@media(max-width:720px){.detail-banner{opacity:.09}}
/* ★ rev.34 · 《待补清单一图标素材包》06_浮层关闭 → 「数据来源」弹窗右上角的关闭按钮
（原来是一枚文字「×」字形，换成素材包的 close 三态图标；文案「关闭」照旧保留） */
.dialog-close>span:first-child{font-size:0;flex:0 0 auto;width:19px;height:19px;
background:url(assets/games/gm/icons/close-default.png) center/contain no-repeat}
.dialog-close:hover>span:first-child{background-image:url(assets/games/gm/icons/close-active.png)}
/* ★ rev.35 · 《待补清单二》08 引导提示 → 3 分钟导览浮层
徽章落在「第 N 站 · …」这行前面；右边加一排步骤点阵（已走完 / 当前 / 未到），
用素材包的三个 guide-step-* 部件。导览流程与「第 N / 6 站」文字一律保留。 */
.tour-step:before{content:"";display:inline-block;width:18px;height:18px;margin-right:7px;
vertical-align:-4px;background:url(assets/games/gm/badges/guide.png) center/contain no-repeat}
.tour-steps{margin-left:auto;display:inline-flex;align-items:center;gap:5px}
.tour-pos{margin-left:0}
.tour-steps i{width:11px;height:11px;
background:url(assets/games/gm/parts/guide-step-upcoming.png) center/contain no-repeat}
.tour-steps i[data-state="current"]{background-image:url(assets/games/gm/parts/guide-step-current.png)}
.tour-steps i[data-state="complete"]{background-image:url(assets/games/gm/parts/guide-step-complete.png)}
/* ★ rev.36 · 设计令牌化（Design Tokens）
----------------------------------------------------------------------------
这一节只做「改名与收敛」，不改视觉：
· :root 新增三组令牌 —— 字号阶梯 --fs-*（6 级）、五阶段配色 --stage-1..5、
语义色 --surface-* / --border-* / --focus（值与原先的字面量完全一致）。
· 正文那一档从 14px 提到 15px（--fs-md），这是本轮唯一可见的变化 —— 之前正文偏小，
而 12/13px 的角标、编号、轴标、密集表格仍保持原尺寸，避免把微排版撑散。
· 展示级字号（16/18/19/20/21/23–36px）是逐处手调过的，本轮不动。
---------------------------------------------------------------------------- */
/* 收尾：把「阅读型正文」统一钉在 --fs-md（15px）。
站内此前有一批在窄屏把正文压到 13px 的覆盖，手机上中文正文偏小。
这里放在文件末尾、用与原规则同级的选择器声明，所以对桌面与窄屏同时生效；
只列真正的成段文字，角标/编号/轴标/密集表格/卡片小字一律不动。 */
.section-intro,.comparison-explanation,.statistics-notice,.detail-notice,
.boundary-heading>p:last-child,.chart-insight,.chart-help,.chart-empty,
.notes-grid p,.notes-grid ul,.case-notes .notes-grid,.method-content,
.source-fields,.disclaimer,.journey-heading p,.stage-metric>p,
.source-dialog-content,.method-note-body p,.method-note-body li,
.arena-note,.group-estimate p,.takeaway-analogy,.item-empty{font-size:var(--fs-md)}
/* ★ rev.36 · 页脚的数据文件版本戳（由 app.js 从 CARBON_DATA.stamp 渲染） */
.footer-stamp{margin:0;font-size:var(--fs-sm);color:var(--muted);letter-spacing:.2px}
/* ============================================================
★ rev.37 · 内容与交互增强
------------------------------------------------------------
1) 详情页顶部「最反直觉的一条」结论条
2) 「统计范围」模块顶部的边界金句 callout
3) 详情页面包屑
4) 「复制本页链接」与复制反馈
5) 空状态引导按钮（物品筛选 / 收藏 / 擂台）
6) 档案室加载进度条
7) 擂台「按阶段对照」模式
⚠️ 本段一律追加在文件末尾：同优先级靠后生效，覆盖式声明必须排在后面；
内含的 max-width:720px 是本文件最窄的一档，排在最后符合「先宽后窄」。
============================================================ */
/* ---------- 1) 「最反直觉的一条」结论条 ---------- */
.detail-verdict{margin:0 0 22px;padding:20px 24px;border:1px solid var(--border-soft);border-left:3px solid var(--green);border-radius:0 12px 12px 0;background:var(--surface-tint)}
.detail-verdict[hidden]{display:none!important}
.detail-verdict .eyebrow{margin-bottom:9px}
.detail-verdict-text{margin:0;font-size:clamp(17px,2.4vw,22px);font-weight:600;line-height:1.65;color:var(--deep);letter-spacing:.2px}
.detail-verdict-note{margin:10px 0 0;font-size:var(--fs-sm);line-height:1.8;color:var(--muted)}
/* ---------- 2) 边界金句 callout ---------- */
.boundary-callout{margin-top:22px;padding:18px 22px;border:1px solid var(--border-accent);border-radius:12px;background:var(--surface-leaf)}
.boundary-callout[hidden]{display:none!important}
.boundary-callout .eyebrow{margin-bottom:8px}
.boundary-callout-text{margin:0;font-size:var(--fs-lg);font-weight:550;line-height:1.8;color:var(--deep)}
/* ---------- 3) 面包屑 ---------- */
.detail-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:0 0 14px;font-size:var(--fs-sm);color:var(--muted)}
.detail-breadcrumb a{color:var(--green);text-decoration:none;border-bottom:1px solid transparent}
.detail-breadcrumb a:hover{border-bottom-color:var(--border-accent)}
.detail-breadcrumb .crumb-sep{color:var(--border-dash)}
.detail-breadcrumb .crumb-current{color:var(--ink);font-weight:550}
/* ---------- 4) 复制本页链接 ---------- */
.detail-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 0 20px}
.detail-copy{width:auto;min-height:44px;padding:9px 15px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-soft);color:var(--green)}
.detail-copy:hover{border-color:var(--green);background:var(--surface-hover)}
.copy-note{font-size:var(--fs-sm);color:var(--muted)}
.copy-note.ok{color:var(--green)}
/* ---------- 5) 空状态引导按钮 ---------- */
.item-empty-text,.arena-empty-text{margin:0}
.empty-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.empty-actions .secondary-button{width:auto;min-height:44px;padding:9px 15px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-soft);color:var(--green)}
.empty-actions .secondary-button:hover{border-color:var(--green);background:var(--surface-hover)}
/* ---------- 6) 档案室加载进度 ---------- */
.gm-loading{display:grid;gap:11px;justify-items:center}
.gm-loading-text{margin:0}
.gm-loading-track{position:relative;width:min(320px,100%);height:7px;border-radius:4px;background:#e4ece0;overflow:hidden}
.gm-loading-fill{display:block;width:0;height:100%;border-radius:4px;background:var(--green);transition:width 240ms ease-out}
/* ---------- 7) 擂台「按阶段对照」 ---------- */
.arena-modes{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.arena-modes button{min-height:44px;padding:9px 15px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-soft);color:var(--green);font-size:var(--fs-md)}
.arena-modes button:hover{border-color:var(--green);background:var(--surface-hover)}
.arena-modes button[aria-pressed="true"]{border-color:var(--green);background:var(--green);color:#fff}
.arena-stage-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.arena-stage-pick button{min-height:40px;padding:7px 13px;border:1px solid var(--border-sage);border-radius:20px;background:var(--surface-mist);color:var(--green);font-size:var(--fs-sm)}
.arena-stage-pick button:hover{border-color:var(--border-accent)}
.arena-stage-pick button[aria-pressed="true"]{border-color:var(--green);background:var(--surface-leaf);font-weight:600}
.arena-metric.is-dim>strong{color:var(--muted);font-weight:550}
@media(max-width:720px){
.detail-verdict{padding:17px 18px}
.detail-verdict-text{font-size:var(--fs-lg)}
.boundary-callout{padding:16px 18px}
.boundary-callout-text{font-size:var(--fs-md)}
.empty-actions{gap:8px}
.empty-actions .secondary-button{flex:1 1 140px}
}
/* rev.37 · 擂台控制区：两种对照方式与阶段选择器各占一整行，不与两个下拉挤在一排 */
.arena-controls .arena-modes,.arena-controls .arena-stage-pick{flex:1 1 100%}
.arena-controls .arena-modes{margin-top:2px}
.arena-controls .arena-stage-pick{margin-top:0}
/* ★ rev.38（2026-10-15）· 《碳迹可循_待补图标清单》清单三 + 清单四落地（纯 CSS，不动 HTML/JS）
① 清单四·三态补全：凡可悬停 / 可禁用的控件补 :hover → -active、:disabled → -disabled
② 清单三·新交互：ui/plus·ui/minus（折叠标记，原为文字「＋/－」）、
extra/source（「查看来源」等纯文字按钮）、ui/flip（冷知识卡翻面提示）
③ 铁律（rev.34 踩过的坑）：-active 是「浅绿底 ＋ 深绿字形」的整块色块 → 只能上浅底元素；
深绿实心区域（.module-more-toggle.is-open / .fact-card.is-flipped / .fact-front）一律只把字形
翻白（brightness(0) invert(1)），绝不换 active 图，否则浅绿块会把图标压成一片。
④ 有意不接：tool/filter（站点没有高级筛选入口）、ui/arrow-up（回顶部由 act/top 承担，其
「横线＋上箭头」比通用箭头更贴语义）、trend / ui-check / ui-info（纯结果态，没有交互态）、
各族 -disabled（除翻页箭头外站点控件不会进入禁用态，沿用 opacity 压暗）。 */
/* —— ① 折叠标记：文字「＋/－」换成素材 —— */
#source-details summary>span{transform:none;font-size:0;flex:0 0 auto;width:15px;height:15px;
background:url(assets/icons/ui/plus-default.png) center/contain no-repeat}
#source-details[open] summary>span{background-image:url(assets/icons/ui/minus-default.png)}
#source-details summary:hover>span{background-image:url(assets/icons/ui/plus-active.png)}
#source-details[open] summary:hover>span{background-image:url(assets/icons/ui/minus-active.png)}
.module-links .module-more-toggle .module-more-caret{font-size:0;flex:0 0 auto;width:15px;height:15px;
background:url(assets/icons/ui/plus-default.png) center/contain no-repeat}
.module-links .module-more-toggle:hover .module-more-caret{background-image:url(assets/icons/ui/plus-active.png)}
.module-links .module-more-toggle.is-open .module-more-caret{
background-image:url(assets/icons/ui/minus-default.png);filter:brightness(0) invert(1)}
/* —— ② 查看来源：.source-link（速览卡 / 研究表 / 情景与设备来源 / 冷知识 / 弹窗内「阅读原文」） —— */
.source-link::before{content:"";flex:0 0 auto;width:14px;height:14px;margin-right:5px;
background:url(assets/icons/extra/source-default.png) center/contain no-repeat}
.source-link:hover::before,.source-link:focus-visible::before{background-image:url(assets/icons/extra/source-active.png)}
.overview-stages .overview-stage>small::before{content:"";display:inline-block;width:13px;height:13px;margin-right:5px;
vertical-align:-2px;background:url(assets/icons/extra/source-default.png) center/contain no-repeat}
.overview-stages .overview-stage:hover>small::before{background-image:url(assets/icons/extra/source-active.png)}
/* —— ③ 翻面提示：冷知识卡的「翻开卡牌」按钮与卡面提示语 —— */
.fact-toggle::before{content:"";flex:0 0 auto;width:14px;height:14px;
background:url(assets/icons/ui/flip-default.png) center/contain no-repeat}
.fact-card:not(.is-flipped) .fact-toggle:hover::before{background-image:url(assets/icons/ui/flip-active.png)}
.fact-card.is-flipped .fact-toggle::before{filter:brightness(0) invert(1)}
.fact-front-note::before{content:"";display:inline-block;width:13px;height:13px;margin-right:5px;vertical-align:-2px;
background:url(assets/icons/ui/flip-default.png) center/contain no-repeat;filter:brightness(0) invert(1)}
/* —— ④ 清单四·三态补全 —— */
/* 页脚与操作区（act：回到模块导航 / 回顶部 / 重看入场） */
#to-module-nav:hover::before,#to-module-nav:focus-visible::before{background-image:url(assets/icons/act/navigation-active.png)}
#to-top:hover::before,#to-top:focus-visible::before{background-image:url(assets/icons/act/top-active.png)}
.footer-replay:hover::before,.footer-replay:focus-visible::before{background-image:url(assets/icons/act/replay-active.png)}
/* 附加操作（extra：下载行动卡 / 复制引用 / 看下一件物品） */
#actions-card-download:hover::before,#actions-card-download:focus-visible::before{background-image:url(assets/icons/extra/download-active.png)}
#cite-apa:hover::before,#cite-gbt:hover::before{background-image:url(assets/icons/extra/copy-active.png)}
.next-item-home:hover::before{background-image:url(assets/icons/extra/home-active.png)}
/* 阅读引导三步（guide） */
.read-guide-steps li:nth-child(1):hover .read-guide-num{background-image:url(assets/icons/guide/journey-active.png)}
.read-guide-steps li:nth-child(2):hover .read-guide-num{background-image:url(assets/icons/guide/pie-active.png)}
.read-guide-steps li:nth-child(3):hover .read-guide-num{background-image:url(assets/icons/guide/hand-active.png)}
/* 收藏书签与收藏入口（mark / tool-bookmark）——已收藏的保持 active 图，不参与悬停覆盖 */
.item-cell .card-bookmark:hover:not([aria-pressed="true"])::before{background-image:url(assets/icons/mark/bookmark-active.png)}
#bookmark-toggle:hover:not([aria-pressed="true"]) .chip-icon{background-image:url(assets/icons/tool/bookmark-active.png)}
/* 模块导航九枚（module）——选中态已是 active 图，靠 --mod-ico-on 变量一次覆盖 */
#detail-module-nav [data-section]:hover:not([aria-selected="true"])::before{background-image:var(--mod-ico-on)}
/* 五段阶段七枚（stage）——选中态已是 active 图 */
.stage-button:hover:not(.selected) .stage-ico[data-stage="raw"]{background-image:url(assets/icons/stage/raw-active.png)}
.stage-button:hover:not(.selected) .stage-ico[data-stage="factory"]{background-image:url(assets/icons/stage/factory-active.png)}
.stage-button:hover:not(.selected) .stage-ico[data-stage="truck"]{background-image:url(assets/icons/stage/truck-active.png)}
.stage-button:hover:not(.selected) .stage-ico[data-stage="use"]{background-image:url(assets/icons/stage/use-active.png)}
.stage-button:hover:not(.selected) .stage-ico[data-stage="recycle"]{background-image:url(assets/icons/stage/recycle-active.png)}
.stage-button:hover:not(.selected) .stage-ico[data-stage="production-combined"]{background-image:url(assets/icons/stage/production-combined-active.png)}
.stage-button:hover:not(.selected) .stage-ico[data-stage="repair"]{background-image:url(assets/icons/stage/repair-active.png)}
/* 类别筛选七枚（cat）——选中态已是 active 图，靠 --cat-on 变量一次覆盖七枚 */
#category-filter button:hover:not([aria-pressed="true"])::before{background-image:var(--cat-on)}
/* 图表切换三枚（chart）——靠 --cv-on 变量一次覆盖三枚 */
.chart-view-toggle button:hover:not([aria-pressed="true"])::before{background-image:var(--cv-on)}
/* 搜索放大镜（tool/search） */
.site-search input:hover:not(:focus-visible){background-image:url(assets/icons/tool/search-active.png)}
/* 翻页与换卡箭头禁用态（ui/arrow-left·arrow-right）——首/末阶段、首/末张卡会真禁用 */
#stage-prev:disabled,#fact-prev:disabled{background-image:url(assets/icons/ui/arrow-left-disabled.png)}
#stage-next:disabled,#fact-next:disabled{background-image:url(assets/icons/ui/arrow-right-disabled.png)}
/* ★ rev.39 · 碳管家全站向导（台本落地；角色形象后补） ------------------------
组件 = 头像圆牌 .keeper-face（绿色圆 + 浅绿字，与页头 .brand-mark 同款）＋ 对话气泡 .keeper-say。
形象就位后：给 .keeper-face 加 background-image:url(assets/keeper/face.png) 覆盖底色，
并把内层 碳 设 display:none（或把 HTML 里的 换成 ![]()
）。 */
.keeper{display:flex;gap:13px;align-items:flex-start;margin:22px 0}
.keeper[hidden]{display:none!important}
.keeper-face{flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:var(--green);color:var(--lime);
display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center;
box-shadow:0 2px 8px rgba(18,77,56,.2)}
.keeper-face b{color:var(--lime);font-size:20px;font-weight:600;line-height:1}
.keeper-say{position:relative;flex:1 1 auto;min-width:0;margin:0;background:#f1f7ee;
border:1px solid #d9e8dd;border-radius:3px 13px 13px 13px;padding:12px 16px;
font-size:var(--fs-md);line-height:1.85;color:var(--deep)}
.keeper-say::before{content:"";position:absolute;left:-6px;top:15px;width:11px;height:11px;
background:#f1f7ee;border-left:1px solid #d9e8dd;border-bottom:1px solid #d9e8dd;transform:rotate(45deg)}
.keeper-say b{color:var(--green);font-weight:650}
.keeper-name{font-weight:700}
.keeper-name::after{content:"·";margin:0 7px 0 3px;color:#9fbcab;font-weight:400}
.keeper-detail{margin:14px 0 2px}
#arena-section .keeper,#detective-section .keeper{margin:14px 0 2px}
/* 「带走一句话」深绿卡片内：换成浅色气泡 */
.takeaway-card .keeper{margin:16px 0 0}
.takeaway-card .keeper-face{background:#e9f3ec;box-shadow:none}
.takeaway-card .keeper-face b{color:var(--green)}
.takeaway-card .keeper-say{background:rgba(255,255,255,.95);border-color:transparent;color:var(--deep)}
.takeaway-card .keeper-say::before{background:rgba(255,255,255,.95);border-color:transparent}
/* 页脚署名 */
.footer-keeper{margin:3px 0 0;color:var(--green);font-size:var(--fs-xs);font-weight:600;letter-spacing:.02em}
@media (max-width:600px){
.keeper{gap:10px;margin:18px 0}
.keeper-face{width:38px;height:38px}
.keeper-face b{font-size:17px}
.keeper-say{font-size:var(--fs-sm);line-height:1.78;padding:11px 13px}
.keeper-say::before{top:13px}
}
/* ══════ rev.40 · 把未启用的素材接上 ══════════════════════════════════
① 「查看全部物品」＝一键清掉 类别 / 搜索 / 只看收藏 三重筛选，语义上正是素材包
08 组「搜索与筛选」里一直没用上的 tool/filter（该组另两枚搜索、收藏早已接上）。
② 物品插画有两版：卡片继续用纯物件版（92px 圆，物件要填满），
详情页 hero 改用完整版 -deco——见 app.js 的 ITEM_ART_FULL。 */
#empty-show-all{display:inline-flex;align-items:center;gap:7px}
#empty-show-all::before{content:"";flex:0 0 auto;width:15px;height:15px;
background:url(assets/icons/tool/filter-default.png) center/contain no-repeat}
#empty-show-all:hover::before,#empty-show-all:focus-visible::before{
background-image:url(assets/icons/tool/filter-active.png)}