
/* Jev reading notes · self-contained, responsive, no remote resources. */
:root {
  color-scheme: light;
  --bg: #f6f5ef;
  --paper: #fcfcf8;
  --text: #242d28;
  --muted: #717970;
  --green: #3f6557;
  --green-deep: #234638;
  --green-soft: #eaf0e7;
  --line: #dce2d8;
  --orange: #b86641;
  --orange-soft: #f6e9de;
  --code-bg: #182c25;
  --body-size: 18px;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --serif: "Noto Serif CJK SC", "Source Han Serif SC", "Songti SC", "STSong", serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #151f19;
  --paper: #1c2921;
  --text: #e5e9df;
  --muted: #a1afa1;
  --green: #aac8af;
  --green-deep: #d0e1ce;
  --green-soft: #26392c;
  --line: #344538;
  --orange: #e3a37b;
  --orange-soft: #3a3024;
  --code-bg: #0e1a13;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 0; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button { color: inherit; cursor: pointer; }
button, a { -webkit-tap-highlight-color: transparent; }
button { border: 0; background: none; }
a { color: inherit; text-decoration: none; }
button:disabled { cursor: default; opacity: .3; }
img { max-width: 100%; }
p, h1, h2, h3, figure, blockquote { margin: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 5px; border-radius: 3px; }
::selection { background: #dbe8ce; color: #172f21; }
.icon { flex: 0 0 auto; vertical-align: middle; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -80px; left: 16px; background: var(--text); color: var(--bg); padding: 12px 20px; z-index: 400; }
.skip-link:focus { top: 12px; }
.reading-progress { height: 3px; position: fixed; top: 0; inset-inline: 0; z-index: 160; }
.reading-progress > div { height: 100%; width: 0; background: var(--orange); transition: width .12s linear; }
.topbar { position: sticky; top: 0; z-index: 100; background: color-mix(in srgb, var(--bg) 93%, transparent); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.topbar-inner { max-width: 1320px; margin: 0 auto; height: 78px; padding: 0 34px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; }
.brand-symbol { width: 36px; height: 36px; display: inline-flex; justify-content: center; align-items: center; background: var(--green); color: var(--bg); border-radius: 9px; font: italic 700 29px/1 Georgia, serif; padding-bottom: 5px; padding-right: 3px; }
.brand-name { font-size: 18px; font-weight: 730; letter-spacing: -.3px; }
.brand-divider { color: #aab4a6; font-weight: 400; margin: 0 12px; }
.brand-sub { font-size: 12px; font-weight: 500; letter-spacing: .6px; }
.view-tabs { display: flex; gap: 3px; background: var(--green-soft); border-radius: 9px; padding: 4px; }
.view-tabs button { padding: 8px 19px; border-radius: 6px; font-size: 12px; color: var(--muted); white-space: nowrap; font-weight: 600; }
.view-tabs button[aria-selected="true"] { background: var(--paper); color: var(--text); box-shadow: 0 1px 4px #17281b0b; }
.view-tabs button span { display: inline-flex; align-items: center; margin-left: 5px; font: 10px var(--mono); opacity: .65; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-width: 36px; height: 36px; padding: 7px; border-radius: 7px; }
.icon-button:hover { background: var(--green-soft); }
kbd { font: 10px var(--mono); color: var(--muted); border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 4px; padding: 3px 5px; white-space: nowrap; }
.sun-icon { display: none; }
html[data-theme="dark"] .moon-icon { display: none; }
html[data-theme="dark"] .sun-icon { display: block; }
.mobile-contents { display: none; }
.hero { max-width: 1200px; padding: 47px 34px 24px; margin: 0 auto; }
.hero-topline { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.eyebrow { color: var(--green); font-size: 10px; font-weight: 700; line-height: 1.6; letter-spacing: 1.3px; }
.status-dot { display: inline-block; width: 6px; height: 6px; background: var(--green); border-radius: 50%; margin-right: 8px; vertical-align: 1px; }
.edition { font-size: 10px; letter-spacing: 1px; color: var(--muted); }
.hero-main { display: grid; grid-template-columns: minmax(0,1fr) 249px; gap: 40px; padding-top: 37px; align-items: stretch; }
h1 { font-size: clamp(37px,4.1vw,53px); line-height: 1.55; font-weight: 760; letter-spacing: -1.8px; }
.hero h1 em { font-style: normal; color: var(--green-deep); background-image: linear-gradient(transparent 86%, var(--green-soft) 86%); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.hero-deck { font-size: 16px; color: var(--muted); line-height: 1.95; margin-top: 22px; }
.hero-links { display: flex; align-items: center; gap: 24px; margin-top: 30px; }
.primary-link { display: inline-flex; justify-content: space-between; align-items: center; gap: 34px; padding: 13px 19px; border-radius: 5px; background: var(--green); color: var(--bg); font-size: 12px; font-weight: 600; }
.primary-link:hover { filter: brightness(1.12); }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--green); padding: 7px 0; }
.text-link:hover { color: var(--orange); }
.hero-side { position: relative; border-radius: 11px; padding: 25px 27px 22px; background: #294b3f; color: #e8eee0; overflow: hidden; }
.hero-side::after { content: ''; position: absolute; width: 180px; height: 180px; border: 1px solid #d5dfc619; border-radius: 50%; right: -90px; top: 35px; pointer-events: none; }
.small-label { font: 9px var(--mono); letter-spacing: 1.3px; opacity: .65; }
.hero-wordmark { display: flex; align-items: baseline; justify-content: space-between; font: italic 84px/1.3 Georgia, serif; letter-spacing: -7px; padding: 6px 0 9px; }
.hero-wordmark span { font: 24px var(--sans); letter-spacing: 0; color: #cea581; }
.hero-side-line { height: 1px; background: #e3edda33; }
.hero-side p { font-size: 13px; line-height: 1.9; padding: 17px 0; font-weight: 400; }
.hero-side-meta { display: flex; justify-content: space-between; gap: 10px; color: #ced9c7; font-size: 9px; }
.hero-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 42px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 25px 0; }
.hero-metrics > div { padding: 0 26px; border-left: 1px solid var(--line); }
.hero-metrics > div:first-child { padding-left: 0; border: none; }
.metric-kicker { display: block; color: var(--muted); font-size: 9px; font-weight: 550; letter-spacing: 1px; }
.hero-metrics strong { display: block; font-size: 32px; font-weight: 600; font-feature-settings: "tnum"; line-height: 1.6; margin: 3px 0 0; letter-spacing: -.6px; }
.hero-metrics small { font-size: 12px; color: var(--muted); font-weight: 400; letter-spacing: 0; }
.metric-label { display: block; font-size: 11px; color: var(--muted); line-height: 1.7; }
.editor-note { margin: 20px 0 0; border-radius: 5px; font-size: 11px; color: var(--muted); }
.editor-note summary { display: flex; align-items: center; gap: 9px; list-style: none; cursor: pointer; line-height: 1.8; }
.editor-note summary::-webkit-details-marker { display: none; }
.note-dot { border: 1px solid #a4b3a0; font: 10px Georgia,serif; border-radius: 50%; width: 14px; height: 14px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; }
.details-plus { margin-left: auto; font-size: 19px; }
.editor-note[open] .details-plus { transform: rotate(45deg); }
.editor-note > div { background: var(--green-soft); margin-top: 12px; padding: 16px 20px; border-radius: 7px; line-height: 1.9; }
.editor-note p + p { margin-top: 8px; }
.article-layout { max-width: 1200px; display: grid; grid-template-columns: 212px minmax(0,1fr); gap: 68px; padding: 34px 34px 0; margin: 0 auto; }
.sidebar { position: relative; min-width: 0; }
.sidebar-inner { position: sticky; top: 113px; max-height: calc(100vh - 140px); overflow-y: auto; scrollbar-width: thin; }
.sidebar-label { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 10px; letter-spacing: 1.2px; padding: 0 12px 15px; }
#progressText { font: 10px var(--mono); color: var(--orange); }
.contents-nav { display: flex; flex-direction: column; gap: 3px; }
.contents-nav a { display: flex; gap: 13px; align-items: baseline; padding: 12px 12px; border-radius: 5px; font-size: 12px; color: var(--muted); line-height: 1.55; transition: color .15s, background .15s; }
.contents-nav a:hover { color: var(--green); background: var(--green-soft); }
.contents-nav a.active { color: var(--green-deep); background: var(--green-soft); font-weight: 650; }
.nav-number { font: 10px var(--mono); padding-top: 1px; color: var(--muted); font-weight: 400; }
.contents-nav a.active .nav-number { color: var(--orange); }
.sidebar-tools { display: flex; align-items: center; justify-content: space-between; padding: 20px 12px 13px; border-top: 1px solid var(--line); margin-top: 22px; font-size: 11px; color: var(--muted); }
.sidebar-tools > div { display: flex; gap: 6px; }
.sidebar-tools button { border: 1px solid var(--line); border-radius: 5px; padding: 6px 7px; font-size: 11px; }
.sidebar-tools button:hover { background: var(--green-soft); }
.print-button { display: flex; align-items: center; gap: 9px; padding: 10px 12px; font-size: 11px; color: var(--muted); }
.print-button .icon { width: 15px; height: 15px; }
.sidebar-foot { padding: 21px 12px 0; font-size: 9px; letter-spacing: .5px; color: var(--muted); }
.sidebar-foot .status-dot { width: 4px; height: 4px; }
.article { min-width: 0; font-size: var(--body-size); line-height: 1.95; overflow-wrap: break-word; }
.article > .article-lead { padding: 0 0 0 21px; border-left: 3px solid #a7baa0; font-family: var(--serif); font-size: calc(var(--body-size) + 1px); line-height: 2.1; color: var(--green); margin-bottom: 45px; }
.article p { margin-bottom: 22px; }
.article strong { font-weight: 700; }
.article code { font: .84em/1.8 var(--mono); padding: 2px 5px; background: var(--green-soft); border-radius: 4px; color: var(--green-deep); overflow-wrap: anywhere; }
.introduction { scroll-margin-top: 106px; }
.section-minihead { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 19px; }
.section-minihead .eyebrow { font-size: 9px; letter-spacing: 1px; }
.intro-title { font-size: 27px; line-height: 1.6; letter-spacing: -.6px; margin-bottom: 20px; }
.source-ref { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 400; color: var(--muted); line-height: 1.6; padding: 3px 0 3px 6px; white-space: nowrap; }
.source-ref:hover { color: var(--orange); }
.source-ref span { color: var(--green); font-size: 12px; }
.chapter { margin-top: 64px; scroll-margin-top: 105px; }
.chapter-header { padding-top: 31px; border-top: 1px solid var(--line); margin-bottom: 27px; }
.chapter-kicker { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 9px; font-weight: 600; letter-spacing: 1.1px; margin-bottom: 17px; }
.chapter-number { font: 12px var(--mono); color: var(--orange); background: var(--orange-soft); border-radius: 5px; width: 30px; height: 28px; display: inline-flex; justify-content: center; align-items: center; letter-spacing: 0; }
.chapter-kicker .source-ref { margin-left: auto; letter-spacing: 0; }
.chapter h2 { font-size: 31px; line-height: 1.55; font-weight: 730; letter-spacing: -.8px; }
.chapter h3 { font-size: calc(var(--body-size) + 2px); line-height: 1.7; margin: 28px 0 13px; font-weight: 650; }
.pullquote { margin: 28px 0; padding: 22px 26px; border-left: 3px solid #adc3a7; border-radius: 0 9px 9px 0; background: var(--green-soft); color: var(--green-deep); }
.pullquote p:last-child { margin: 0; }
.english-quote { font-family: Georgia, var(--serif); font-size: calc(var(--body-size) + 2px); font-style: italic; line-height: 1.8; }
.table-shell { overflow-x: auto; margin: 28px 0; border: 1px solid var(--line); border-radius: 9px; scrollbar-width: thin; background: var(--paper); }
table { width: 100%; border-collapse: collapse; font-size: .79em; line-height: 1.85; min-width: 600px; }
thead { background: var(--green-soft); }
th,td { padding: 15px 17px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
thead th { font-size: .95em; font-weight: 650; color: var(--green-deep); white-space: nowrap; }
tbody th { font-weight: 550; min-width: 126px; }
tr:last-child > * { border-bottom: 0; }
td + td, th + td, thead th + th { border-left: 1px solid var(--line); }
tbody tr:nth-child(even) { background: color-mix(in srgb, var(--green-soft) 27%, var(--paper)); }
.article-figure { margin: 33px 0 28px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--paper); }
.figure-zoom { display: block; width: 100%; padding: 8px; position: relative; cursor: zoom-in; background: #fff; }
.figure-zoom img { display: block; width: 100%; height: auto; }
.zoom-label { position: absolute; right: 17px; bottom: 17px; background: #244336ed; color: #f5f6ed; border: 1px solid #ffffff38; border-radius: 6px; padding: 6px 9px; display: inline-flex; align-items: center; gap: 6px; font-size: 10px; opacity: 0; transform: translateY(3px); transition: .18s; }
.zoom-label .icon { width: 14px; height: 14px; }
.figure-zoom:hover .zoom-label, .figure-zoom:focus-visible .zoom-label { opacity: 1; transform: translateY(0); }
figcaption { padding: 16px 20px 18px; font-size: .72em; line-height: 1.9; color: var(--muted); }
.figure-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 7px; color: var(--green); font-size: 1em; font-weight: 600; }
figcaption p:last-child { margin: 0; }
figcaption strong { color: var(--text); }
.numbered-notes { margin: 24px 0; }
.numbered-notes > div { display: flex; gap: 17px; border-top: 1px solid var(--line); padding: 20px 0; }
.numbered-notes > div:last-child { border-bottom: 1px solid var(--line); }
.numbered-notes > div > span { flex: 0 0 29px; font: 12px/2.6 var(--mono); color: var(--orange); }
.numbered-notes p { margin: 0; }
.compact > div { padding: 15px 0; }
.primitive-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 29px 0 24px; }
.primitive-card { display: flex; flex-direction: column; padding: 21px 18px 17px; background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--green); border-radius: 7px; }
.primitive-card:first-child { border-top-color: var(--orange); }
.primitive-index { font: 8px/1.6 var(--mono); letter-spacing: .5px; color: var(--muted); }
.primitive-card h3 { font: 600 25px/1.5 var(--sans); margin: 12px 0 1px; letter-spacing: -.5px; }
.primitive-card p { font-size: .7em; line-height: 1.85; margin-bottom: 13px; color: var(--muted); }
.primitive-card p.primitive-sub { color: var(--text); font-size: .75em; font-weight: 600; }
.primitive-tag { font-size: 10px; color: var(--green); padding-top: 13px; border-top: 1px solid var(--line); margin-top: auto; }
.question-list { margin: 22px 0; padding: 3px 20px; background: var(--green-soft); border-radius: 8px; }
.question-list > div { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 0; font-size: .87em; }
.question-list > div + div { border-top: 1px solid color-mix(in srgb, var(--green) 13%, transparent); }
.question-list code { color: var(--green); background: var(--paper); padding: 2px 10px; font-size: 11px; }
.code-panel { background: var(--code-bg); color: #e3ecdf; border-radius: 9px; overflow: hidden; margin: 27px 0 13px; border: 1px solid #294736; }
.code-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 10px; border-bottom: 1px solid #aac4ab24; padding: 12px 19px; font-size: 10px; color: #bdcdb8; }
.code-toolbar > span { display: flex; align-items: center; gap: 8px; }
.code-toolbar i { width: 6px; height: 6px; background: #c39169; border-radius: 50%; display: inline-block; }
.copy-button { display: flex; gap: 6px; align-items: center; font-size: 10px; padding: 3px 5px; }
.copy-button .icon { width: 13px; height: 13px; }
.code-panel pre { margin: 0; padding: 24px; white-space: pre-wrap; overflow-wrap: anywhere; tab-size: 4; font: 12px/2 var(--mono); }
.article .code-panel code { font: inherit; background: transparent; color: inherit; padding: 0; }
.tok-string { color: #c8d798; }
.tok-keyword { color: #dda3c3; }
.tok-call { color: #91c5ba; }
.tok-number { color: #efb289; }
.article .editing-note { font-size: 11px; color: var(--muted); line-height: 1.85; padding-left: 12px; border-left: 2px solid var(--line); }
.threshold-list { margin: 26px 0; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); overflow: hidden; }
.threshold-list > div { display: grid; grid-template-columns: 136px minmax(0,1fr); align-items: center; gap: 23px; padding: 19px 25px; border-bottom: 1px solid var(--line); }
.threshold-list > div:last-child { border: none; background: var(--orange-soft); }
.threshold-list > div:first-child { background: var(--green-soft); }
.threshold-value { font: 600 19px var(--mono); color: var(--green); letter-spacing: -.8px; }
.threshold-list > div:last-child .threshold-value { color: var(--orange); }
.threshold-list strong { font-size: .82em; }
.threshold-list p { font-size: .7em; margin: 3px 0 0; color: var(--muted); line-height: 1.7; }
.flow-panel { padding: 22px 25px; border: 1px solid var(--line); border-radius: 8px; margin: 26px 0; background: var(--paper); }
.flow-panel .eyebrow { font-size: 9px; }
.flow-panel pre { font: 13px/2.1 var(--mono),var(--sans); color: var(--green-deep); white-space: pre-wrap; overflow-wrap: anywhere; margin: 17px 0 0; }
.workflow-steps { margin: 26px 0; }
.workflow-steps > div { display: flex; gap: 22px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.workflow-steps > div > span { flex: 0 0 auto; font: 11px var(--mono); color: var(--orange); padding-top: 9px; }
.workflow-steps h3 { margin: 0 0 4px; font: 600 18px/1.7 var(--sans); }
.workflow-steps h3 code { font-size: 10px; font-weight: 400; margin-left: 9px; vertical-align: 2px; }
.workflow-steps p { font-size: .84em; margin: 0; }
.article-ending { border-top: 1px solid var(--line); padding-top: 34px; margin: 53px 0 25px; }
.article-ending > p { font-family: var(--serif); font-size: 31px; color: var(--green-deep); line-height: 1.9; margin: 18px 0 23px; letter-spacing: -.5px; }
.article-ending > div { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 10px; color: var(--muted); }
.sources-view { max-width: 1200px; padding: 60px 34px 20px; margin: 0 auto; }
.sources-heading { margin-bottom: 35px; }
.sources-heading h1 { font-size: 39px; margin: 16px 0 15px; }
.sources-heading p { font-size: 14px; line-height: 1.9; max-width: 670px; color: var(--muted); margin-bottom: 13px; }
.source-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 26px 18px; }
.source-card { padding: 0; text-align: left; transition: transform .2s; }
.source-card:hover { transform: translateY(-4px); }
.source-thumb { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; aspect-ratio: 240 / 401; }
.source-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.source-thumb > span { position: absolute; bottom: 10px; right: 10px; border-radius: 5px; background: #284b3cde; color: #f4f5ed; padding: 6px; opacity: 0; transition: .18s; }
.source-card:hover .source-thumb > span, .source-card:focus-visible .source-thumb > span { opacity: 1; }
.source-card-caption { display: flex; gap: 10px; align-items: baseline; padding: 13px 2px 0; }
.source-card-caption > span { font: 10px var(--mono); color: var(--orange); }
.source-card-caption strong { font-size: 10px; line-height: 1.7; font-weight: 550; }
.site-footer { max-width: 1132px; margin: 65px auto 0; border-top: 1px solid var(--line); padding: 28px 0 36px; display: flex; justify-content: space-between; align-items: flex-start; gap: 25px; }
.footer-brand { font-size: 12px; font-weight: 600; color: var(--green); }
.site-footer p { margin-top: 8px; font-size: 10px; line-height: 1.8; color: var(--muted); }
.footer-note { font-size: 10px; line-height: 1.9; color: var(--muted); text-align: right; }
.back-to-top { position: fixed; bottom: 24px; right: 25px; background: var(--paper); border: 1px solid var(--line); z-index: 90; width: 41px; height: 41px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: .2s; box-shadow: 0 4px 13px #15251908; }
.back-to-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.toast { position: fixed; bottom: 35px; left: 50%; transform: translate(-50%,12px); z-index: 400; background: var(--green-deep); color: var(--bg); border-radius: 7px; padding: 10px 20px; font-size: 12px; opacity: 0; pointer-events: none; transition: .2s; }
.toast.visible { opacity: 1; transform: translate(-50%,0); }
body.modal-open { overflow: hidden; }
dialog { border: 1px solid var(--line); color: var(--text); background: var(--paper); padding: 0; border-radius: 13px; box-shadow: 0 24px 100px #091b2266; }
dialog::backdrop { background: #0d211bcc; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.image-dialog { width: min(1320px,96vw); height: 94vh; max-height: 94vh; max-width: 96vw; background: #14231c; color: #eaf0e4; border-color: #466050; overflow: hidden; }
.image-dialog[open] { display: flex; flex-direction: column; }
.lightbox-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 20px; border-bottom: 1px solid #a5c8ad26; }
.lightbox-title { display: flex; gap: 16px; align-items: center; min-width: 0; }
#imageCounter { color: #b8caae; font: 10px var(--mono); white-space: nowrap; }
#imageTitle { font-size: 12px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lightbox-tools { display: flex; align-items: center; flex: 0 0 auto; gap: 4px; }
.lightbox-text-button { font-size: 10px; padding: 8px 10px; color: #cbd9c3; }
.lightbox-tools .icon-button:hover { background: #ffffff15; }
.image-stage { flex: 1 1 auto; min-height: 0; padding: 20px; overflow: auto; text-align: center; }
.lightbox-image { vertical-align: top; width: auto; height: auto; max-width: 100%; max-height: calc(94vh - 131px); cursor: zoom-in; background: #fff; }
.image-stage.zoomed .lightbox-image { max-width: none; max-height: none; display: block; margin: 0 auto; cursor: zoom-out; }
.lightbox-hint { flex: 0 0 auto; text-align: center; font-size: 9px; padding: 8px; color: #acbda4; }
.search-dialog { width: min(640px, calc(100vw - 32px)); max-height: 80vh; margin-top: 10vh; }
.search-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 22px 12px; }
.search-top h2 { font-size: 16px; font-weight: 650; }
.search-input-wrap { display: flex; align-items: center; gap: 12px; padding: 0 18px; margin: 0 22px; border: 1px solid var(--line); background: var(--bg); border-radius: 7px; color: var(--muted); }
.search-input-wrap input { min-width: 0; width: 100%; height: 49px; color: var(--text); border: none; background: transparent; outline: none; font-size: 14px; }
.search-input-wrap:focus-within { border-color: var(--green); }
.search-status { margin: 13px 23px; font-size: 11px; color: var(--muted); line-height: 1.7; }
.search-results { max-height: 53vh; overflow: auto; padding: 0 14px 14px; }
.search-result { display: block; width: 100%; text-align: left; padding: 14px 13px; border-top: 1px solid var(--line); border-radius: 4px; }
.search-result:hover { background: var(--green-soft); }
.search-result-label { display: block; font-size: 10px; color: var(--green); margin-bottom: 5px; }
.search-result p { font-size: 13px; line-height: 1.8; }
mark { background: var(--orange-soft); color: var(--orange); font-weight: 650; border-radius: 2px; padding: 1px 2px; }
.search-hit { outline: 2px solid var(--orange); outline-offset: 7px; border-radius: 3px; }
.contents-dialog { width: min(430px,calc(100vw - 32px)); max-height: 85vh; }
.mobile-nav { padding: 2px 17px 24px; }
.mobile-nav a { font-size: 14px; padding: 13px 12px; }
.showing-sources .reading-progress, .showing-sources .mobile-contents { visibility: hidden; }
@media (min-width: 1440px) { h1 { font-size: 54px; } }
@media (max-width: 1120px) {
  .hero-main { grid-template-columns: minmax(0,1fr) 223px; gap: 32px; }
  h1 { font-size: 44px; }
  .article-layout { gap: 40px; grid-template-columns: 190px minmax(0,1fr); }
  .hero-side { padding: 22px; }
  .site-footer { margin-left: 34px; margin-right: 34px; }
}
@media (max-width: 980px) {
  .sidebar { display: none; }
  .article-layout { display: block; max-width: 865px; padding: 28px 34px 0; }
  .mobile-contents { display: inline-flex; }
  .topbar-inner { gap: 16px; }
  .topbar-actions { gap: 5px; }
  .brand-sub, .brand-divider { display: none; }
  .source-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  h1 { font-size: 39px; }
  .hero-main { gap: 25px; }
}
@media (max-width: 760px) {
  .topbar-inner { height: 68px; padding: 0 22px; }
  .hero { padding-top: 30px; }
  .hero-main { display: block; padding-top: 24px; }
  .hero-side { display: none; }
  h1 { font-size: 42px; line-height: 1.55; }
  .hero-deck { font-size: 15px; }
  .hero-metrics { margin-top: 32px; }
  .hero-metrics strong { font-size: 27px; }
  .hero-metrics > div { padding: 0 17px; }
  .metric-kicker { font-size: 8px; letter-spacing: .5px; }
  .source-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .primitive-card { padding: 17px 13px; }
  .lightbox-bar { padding: 9px 12px; gap: 8px; }
  .lightbox-title { flex-direction: column; align-items: flex-start; gap: 3px; }
  #imageTitle { font-size: 10px; max-width: 230px; }
  .lightbox-text-button { padding: 7px 4px; }
}
@media (max-width: 560px) {
  html { scroll-padding-top: 0; }
  .topbar-inner { padding: 0 16px; gap: 10px; }
  .brand { gap: 0; }
  .brand-symbol { width: 31px; height: 31px; font-size: 25px; border-radius: 7px; }
  .brand-name { display: none; }
  .topbar-actions { gap: 1px; }
  .topbar-actions .icon-button { width: 31px; min-width: 31px; height: 32px; padding: 6px; }
  .search-trigger kbd { display: none; }
  .view-tabs { padding: 3px; }
  .view-tabs button { padding: 8px 10px; font-size: 11px; }
  .view-tabs button span { margin-left: 3px; font-size: 8px; }
  .hero { padding: 25px 22px 10px; }
  .hero-topline { gap: 10px; }
  .hero-topline .eyebrow { font-size: 9px; letter-spacing: .9px; }
  .edition { font-size: 8px; letter-spacing: .1px; }
  .hero-main { padding-top: 24px; }
  h1 { font-size: clamp(27px,8.5vw,40px); letter-spacing: -1.1px; line-height: 1.62; }
  .hero-deck { margin-top: 17px; font-size: 13px; line-height: 1.9; }
  .hero-links { gap: 21px; margin-top: 25px; }
  .primary-link { padding: 12px 14px; gap: 22px; font-size: 11px; }
  .hero-links .text-link { font-size: 10px; }
  .hero-links .text-link .icon { width: 16px; }
  .hero-metrics { margin-top: 30px; padding: 20px 0; }
  .hero-metrics > div { padding: 0 11px; }
  .metric-kicker { font-size: 7px; line-height: 1.7; letter-spacing: .2px; min-height: 24px; }
  .hero-metrics strong { font-size: 24px; letter-spacing: -.9px; line-height: 1.5; margin-top: 5px; }
  .hero-metrics small { display: block; font-size: 9px; line-height: 1.5; padding: 0; }
  .metric-label { font-size: 8px; margin-top: 7px; }
  .editor-note { margin-top: 16px; font-size: 9px; }
  .editor-note summary { gap: 7px; align-items: flex-start; }
  .note-dot { margin-top: 2px; width: 12px; height: 12px; font-size: 9px; }
  .details-plus { line-height: 1; }
  .editor-note > div { font-size: 11px; padding: 13px 15px; }
  .article-layout { padding: 30px 22px 0; }
  .article { font-size: calc(var(--body-size) - 1px); line-height: 1.95; }
  .article > .article-lead { font-size: var(--body-size); line-height: 1.95; padding-left: 17px; margin-bottom: 38px; }
  .article p { margin-bottom: 20px; }
  .section-minihead { gap: 6px; margin-bottom: 15px; }
  .section-minihead .eyebrow { font-size: 8px; letter-spacing: .1px; }
  .source-ref { font-size: 9px; gap: 5px; }
  .intro-title { font-size: 24px; line-height: 1.6; }
  .chapter { margin-top: 50px; scroll-margin-top: 93px; }
  .chapter-header { padding-top: 25px; margin-bottom: 23px; }
  .chapter-kicker { gap: 9px; font-size: 8px; letter-spacing: .6px; margin-bottom: 16px; }
  .chapter-kicker .source-ref { font-size: 8px; }
  .chapter-number { font-size: 11px; width: 27px; height: 26px; }
  .chapter h2 { font-size: 25px; line-height: 1.6; letter-spacing: -.5px; }
  .chapter h3 { font-size: calc(var(--body-size) + 1px); margin: 23px 0 12px; }
  .pullquote { padding: 18px 18px; margin: 23px 0; }
  .english-quote { font-size: var(--body-size); line-height: 1.9; }
  .pullquote p:last-child, .numbered-notes p, figcaption p:last-child, .workflow-steps p { margin: 0; }
  .table-shell { margin: 25px -1px; border-radius: 7px; }
  table { min-width: 590px; font-size: 13px; }
  th,td { padding: 12px 13px; }
  .article-figure { margin: 26px 0; border-radius: 7px; }
  .figure-zoom { padding: 4px; }
  .zoom-label { opacity: .9; right: 9px; bottom: 9px; padding: 4px 6px; font-size: 8px; transform: none; }
  .zoom-label .icon { width: 11px; height: 11px; }
  figcaption { padding: 13px 14px 15px; font-size: 11px; }
  .figure-heading { align-items: flex-start; gap: 8px; }
  .figure-heading > span { max-width: 78%; }
  .numbered-notes > div { padding: 17px 0; gap: 11px; }
  .numbered-notes > div > span { flex-basis: 22px; font-size: 11px; }
  .primitive-grid { grid-template-columns: 1fr; gap: 12px; margin: 24px 0; }
  .primitive-card { padding: 20px; }
  .primitive-card h3 { font-size: 26px; margin: 8px 0 3px; }
  .primitive-card p { font-size: 13px; line-height: 1.85; margin-bottom: 14px; }
  .primitive-card p.primitive-sub { font-size: 13px; }
  .primitive-tag { padding-top: 11px; }
  .question-list { padding: 2px 16px; }
  .question-list > div { font-size: 13px; gap: 8px; }
  .question-list code { font-size: 10px; }
  .code-toolbar { padding: 10px 13px; font-size: 9px; }
  .code-panel pre { padding: 18px 15px; font-size: 11px; line-height: 1.95; }
  .article .editing-note { font-size: 10px; padding-left: 10px; }
  .threshold-list > div { grid-template-columns: 105px minmax(0,1fr); gap: 13px; padding: 17px 15px; }
  .threshold-value { font-size: 16px; }
  .threshold-list p { font-size: 11px; margin: 3px 0 0; }
  .flow-panel { padding: 18px; }
  .flow-panel pre { font-size: 11px; }
  .workflow-steps > div { gap: 14px; }
  .workflow-steps h3 { font-size: 16px; margin: 0 0 5px; }
  .workflow-steps h3 code { font-size: 9px; margin-left: 5px; }
  .workflow-steps p { font-size: 13px; }
  .article-ending { padding-top: 28px; margin-top: 43px; }
  .article-ending > p { font-size: 23px; line-height: 1.9; }
  .article-ending > div { gap: 10px; font-size: 9px; }
  .article-ending .text-link { font-size: 10px; }
  .sources-view { padding: 34px 22px 15px; }
  .sources-heading h1 { font-size: 29px; line-height: 1.6; margin: 14px 0; }
  .sources-heading p { font-size: 12px; }
  .source-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 23px 13px; }
  .source-card-caption { gap: 7px; padding-top: 10px; }
  .source-card-caption strong { font-size: 10px; }
  .source-thumb > span { opacity: .9; padding: 4px; bottom: 7px; right: 7px; }
  .source-thumb > span .icon { width: 14px; height: 14px; }
  .site-footer { margin: 40px 22px 0; padding: 22px 0 26px; gap: 20px; }
  .footer-brand { font-size: 11px; }
  .site-footer p, .footer-note { font-size: 9px; }
  .footer-note { max-width: 110px; }
  .back-to-top { bottom: 17px; right: 15px; width: 36px; height: 36px; }
  .image-dialog { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; border: 0; }
  .lightbox-bar { padding: 9px 10px; }
  .lightbox-tools { gap: 0; }
  .lightbox-tools .icon-button { width: 29px; min-width: 29px; height: 33px; padding: 5px; }
  .lightbox-text-button { font-size: 9px; padding: 5px; }
  #imageTitle { max-width: 140px; font-size: 9px; }
  #imageCounter { font-size: 9px; }
  .image-stage { padding: 10px; }
  .lightbox-image { max-height: calc(100dvh - 105px); }
  .lightbox-hint { font-size: 8px; padding-bottom: max(8px,env(safe-area-inset-bottom)); }
  .search-dialog { margin-top: 5vh; max-height: 86vh; }
  .search-top { padding: 13px 17px 11px; }
  .search-input-wrap { margin: 0 16px; padding: 0 12px; gap: 8px; }
  .search-input-wrap input { font-size: 13px; }
  .search-input-wrap kbd { display: none; }
  .search-status { margin: 11px 17px; font-size: 10px; }
  .search-results { max-height: 59vh; padding: 0 8px 12px; }
  .search-result p { font-size: 12px; }
  .contents-dialog .search-top { padding-bottom: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
@media print {
  @page { margin: 16mm 15mm; }
  html, html[data-theme="dark"] { color-scheme: light; --bg: #fff; --paper: #fcfcf8; --text: #202721; --muted: #717970; --green: #3f6557; --green-deep: #234638; --green-soft: #eaf0e7; --line: #dce2d8; --orange: #b86641; --orange-soft: #f6e9de; --code-bg: #f5f5ef; }
  body { background: #fff; color: #202721; }
  .topbar, .reading-progress, .sidebar, .hero-links, .editor-note, .hero-side, .source-ref, .zoom-label, .copy-button, .back-to-top, .toast, dialog, .skip-link, #sourcesView { display: none !important; }
  #readingView { display: block !important; }
  .hero { padding: 0 0 20px; }
  .hero-main { display: block; padding-top: 19px; }
  h1 { font-size: 31px; }
  .hero-deck { font-size: 12px; margin-top: 12px; }
  .hero-metrics { margin-top: 19px; padding: 12px 0; }
  .hero-metrics strong { font-size: 24px; }
  .hero-metrics small { font-size: 10px; }
  .article-layout { display: block; padding: 0; }
  .article { font-size: 11px; line-height: 1.9; }
  .article > .article-lead { font-size: 12px; margin-bottom: 24px; }
  .intro-title { font-size: 20px; }
  .chapter { margin-top: 30px; }
  .chapter-header { padding-top: 20px; margin-bottom: 17px; break-after: avoid; }
  .chapter h2 { font-size: 22px; }
  .chapter h3 { font-size: 14px; break-after: avoid; }
  .chapter-kicker { margin-bottom: 11px; }
  .article p { margin-bottom: 13px; orphans: 3; widows: 3; }
  .pullquote { padding: 13px 17px; font-size: 12px; margin: 17px 0; }
  .article-figure { break-inside: avoid; margin: 20px 0; }
  .figure-zoom { padding: 3px; }
  .figure-zoom img { max-height: 150mm; object-fit: contain; }
  figcaption { font-size: 9px; padding: 10px 12px; }
  .table-shell { overflow: visible; margin: 19px 0; }
  table { min-width: 0; font-size: 9px; }
  th, td { padding: 9px 10px; }
  tr { break-inside: avoid; }
  .primitive-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
  .primitive-card { padding: 13px; break-inside: avoid; }
  .primitive-card h3 { font-size: 21px; }
  .primitive-card p { font-size: 9px; }
  .code-panel, .flow-panel, .threshold-list, .pullquote { break-inside: avoid; }
  .code-panel { background: #f5f5ef; color: #222; border-color: #ccc; }
  .code-toolbar { color: #333; border-color: #ccc; }
  .code-panel pre { font-size: 9px; padding: 16px; }
  .tok-string, .tok-keyword, .tok-call, .tok-number { color: #222; }
  .article .editing-note { font-size: 8px; }
  .flow-panel pre { font-size: 10px; }
  .workflow-steps h3 { font-size: 13px; }
  .article-ending > p { font-size: 23px; }
  .article-ending .text-link { display: none; }
  .site-footer { margin: 28px 0 0; padding-top: 15px; }
}


/* Revision 002 — new title, reading paths, conceptual comparisons, references. */
.title-line { display:block; }
.hero h1 .title-if { display:block; width:fit-content; font-family:var(--mono); font-size:1.32em; line-height:1.3; letter-spacing:-3px; margin-top:3px; }
.reading-map { border:1px solid var(--line); border-radius:10px; background:var(--paper); padding:23px; margin:0 0 44px; }
.reading-map-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:17px; }
.reading-map-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.reading-map-grid > a { position:relative; display:block; padding:17px 16px; border:1px solid var(--line); border-radius:7px; background:var(--bg); transition:background .15s, border-color .15s; }
.reading-map-grid > a:hover { background:var(--green-soft); border-color:var(--green); }
.map-number { display:block; font:11px var(--mono); color:var(--orange); margin-bottom:11px; }
.reading-map-grid strong { display:block; font-size:14px; line-height:1.8; padding-right:10px; }
.reading-map-grid small { display:block; font-size:10px; line-height:1.9; color:var(--muted); margin-top:9px; }
.map-arrow { position:absolute; right:13px; top:13px; color:var(--green); font-size:16px; }
.article .map-foot { font-size:11px; margin:17px 0 0; color:var(--muted); }
.map-foot a { color:var(--green); border-bottom:1px solid var(--line); }
.addition-badge { display:inline-flex; align-items:center; flex:0 0 auto; padding:3px 8px; font:600 9px/1.6 var(--sans); letter-spacing:.3px; color:var(--orange); border:1px solid color-mix(in srgb,var(--orange) 25%,transparent); background:var(--orange-soft); border-radius:4px; }
.supplement { margin:37px 0 25px; padding:25px 0 0; border-top:1px dashed color-mix(in srgb,var(--green) 32%,var(--line)); scroll-margin-top:108px; }
.supplement-label { display:flex; align-items:center; gap:11px; color:var(--muted); font-size:10px; line-height:1.7; letter-spacing:.3px; }
.chapter .supplement > h3 { margin:16px 0 20px; font-size:24px; line-height:1.65; letter-spacing:-.5px; color:var(--green-deep); }
.chapter h4 { font-size:calc(var(--body-size) + 0px); line-height:1.8; margin:25px 0 12px; font-weight:650; }
.two-system-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; margin:24px 0; }
.two-system-grid > div { padding:22px; background:var(--paper); border:1px solid var(--line); border-top:3px solid var(--green); border-radius:8px; }
.two-system-grid > div:last-child { border-top-color:var(--orange); }
.concept-kicker { font-size:9px; letter-spacing:.7px; color:var(--green); }
.chapter .two-system-grid h4 { margin:12px 0 11px; font-size:20px; }
.article .two-system-grid p { font-size:14px; line-height:1.95; margin:0; color:var(--muted); }
.boundary-note { padding:19px 22px; border-left:3px solid var(--orange); background:var(--orange-soft); border-radius:0 8px 8px 0; margin:25px 0; }
.boundary-note > strong { font-size:15px; color:var(--orange); }
.article .boundary-note > p { margin:8px 0 0; font-size:14px; line-height:1.95; }
.technical-roadmap { padding:23px; border:1px solid var(--line); border-radius:9px; background:var(--paper); margin:25px 0 34px; scroll-margin-top:110px; }
.route-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 24px; margin-top:22px; }
.route-grid > div > span { display:block; font:10px var(--mono); color:var(--orange); margin-bottom:8px; }
.route-grid strong { display:block; font-size:15px; line-height:1.8; }
.article .route-grid p { margin:7px 0 0; font-size:12px; line-height:1.9; color:var(--muted); }
.equation { padding:21px 24px; margin:24px 0; background:var(--green-soft); border:1px solid var(--line); border-radius:8px; font:15px/2 var(--mono),var(--sans); color:var(--green-deep); overflow-x:auto; overflow-wrap:anywhere; }
.equation-stack { text-align:center; display:flex; flex-direction:column; font-size:14px; }
.equation-stack b { color:var(--orange); font-size:18px; line-height:1.8; }
.article .reference-line { color:var(--muted); font-size:11px; line-height:1.9; margin:14px 0 22px; }
.inline-refs { white-space:normal; margin-left:4px; font:10px/1.4 var(--mono); vertical-align:super; }
.inline-refs a { display:inline; color:var(--green); padding:0 2px; text-decoration:none; border-bottom:1px solid var(--line); }
.inline-refs a:hover { color:var(--orange); border-color:var(--orange); }
.origin-label { display:flex; align-items:center; gap:12px; margin-bottom:20px; font-size:11px; color:var(--muted); }
.related-jump { font-size:13px; color:var(--muted); }
.related-jump a { color:var(--green); border-bottom:1px solid var(--line); }
.new-topic-links { margin:20px 12px 0; border-top:1px solid var(--line); padding-top:17px; }
.new-topic-links > span { display:block; color:var(--orange); font-size:9px; letter-spacing:.6px; padding-bottom:5px; }
.contents-nav .new-topic-links a { padding:8px 0; font-size:11px; }
.new-chapter .chapter-kicker .addition-badge { margin-left:auto; }
.references-list { border-top:1px solid var(--line); margin-top:25px; }
.reference-item { display:flex; gap:15px; padding:18px 0; border-bottom:1px solid var(--line); scroll-margin-top:115px; }
.reference-number { font:10px/2.2 var(--mono); color:var(--orange); flex:0 0 25px; }
.reference-item > div { min-width:0; }
.reference-item a { font-size:13px; line-height:1.85; color:var(--green-deep); overflow-wrap:anywhere; }
.reference-item a:hover { color:var(--orange); text-decoration:underline; text-underline-offset:4px; }
.article .reference-item p { margin:7px 0 0; font-size:11px; line-height:1.85; color:var(--muted); }
@media(max-width:760px) { .hero h1 .title-if { font-size:1.35em; } .reading-map-grid { grid-template-columns:1fr; } .reading-map-grid > a { padding:15px 18px 15px 53px; } .map-number { position:absolute; top:20px; left:17px; margin:0; } .reading-map-grid small { margin-top:3px; padding-right:18px; } .map-arrow { top:20px; right:17px; } }
@media(max-width:560px) { .hero h1 { font-size:clamp(28px,8.7vw,40px); } .hero h1 .title-if { letter-spacing:-1.8px; margin-top:4px; } .reading-map { padding:17px; margin-bottom:34px; } .reading-map-grid { gap:9px; } .reading-map-heading { margin-bottom:14px; } .reading-map-grid strong { font-size:14px; } .article .map-foot { font-size:10px; } .supplement { scroll-margin-top:94px; padding-top:21px; } .chapter .supplement > h3 { font-size:21px; margin-top:13px; } .supplement-label { gap:9px; font-size:9px; } .two-system-grid { grid-template-columns:1fr; gap:13px; } .two-system-grid > div { padding:19px; } .article .two-system-grid p { font-size:13px; } .chapter .two-system-grid h4 { font-size:19px; } .boundary-note { padding:16px 18px; } .boundary-note > strong { font-size:14px; } .article .boundary-note > p { font-size:13px; } .technical-roadmap { padding:18px; } .route-grid { gap:20px 15px; } .route-grid strong { font-size:13px; } .article .route-grid p { font-size:11px; } .equation { padding:17px 16px; font-size:12px; } .equation-stack { font-size:12px; } .article .reference-line { font-size:10px; } .inline-refs { font-size:9px; } .origin-label { font-size:10px; gap:8px; } .reference-item { gap:10px; padding:16px 0; } .reference-item a { font-size:12px; } .article .reference-item p { font-size:10px; } .reference-number { flex-basis:22px; } }
@media print { .hero h1 .title-if { display:inline; font-size:1em; margin-left:.2em; } .title-line { display:inline; } .reading-map { padding:15px; break-inside:avoid; } .reading-map-grid { display:grid; grid-template-columns:repeat(3,1fr); } .reading-map-grid > a { padding:12px; } .map-number { position:static; } .map-arrow { display:none; } .reading-map-grid strong { font-size:11px; } .reading-map-grid small { font-size:8px; } .supplement { margin-top:25px; padding-top:18px; } .chapter .supplement > h3 { font-size:16px; } .chapter h4 { font-size:12px; } .boundary-note > strong { font-size:11px; } .article .boundary-note > p { font-size:10px; } .two-system-grid { display:grid; grid-template-columns:repeat(2,1fr); } .article .two-system-grid p { font-size:10px; } .chapter .two-system-grid h4 { font-size:13px; } .equation { font-size:11px; } .reference-item a { font-size:10px; } .article .reference-item p { font-size:9px; } .reference-item { break-inside:avoid; } .addition-badge { font-size:8px; } }

/* 10·08 supplement: green marks this round, orange stays for the 9·21 round */
.addition-badge.fresh { color:var(--green); background:var(--green-soft); border-color:color-mix(in srgb,var(--green) 30%,transparent); }
.supplement.fresh { border-top:1px solid color-mix(in srgb,var(--green) 45%,var(--line)); }
.boundary-note.fresh-note { border-left-color:var(--green); background:var(--green-soft); }
.boundary-note.fresh-note > strong { color:var(--green-deep); }
.new-topic-links.fresh-links > span { color:var(--green); }
.tok-comment { color:#8fa596; }
.update-digest { border:1px solid color-mix(in srgb,var(--green) 35%,var(--line)); border-left:4px solid var(--green); border-radius:10px; background:var(--paper); padding:23px; margin:-20px 0 44px; scroll-margin-top:108px; }
.article .digest-lead { font-size:14px; line-height:1.95; margin:0 0 16px; }
.digest-list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; counter-reset:digest; }
.digest-list li { counter-increment:digest; margin:0; }
.digest-list a { display:block; height:100%; padding:13px 14px 13px 46px; position:relative; border:1px solid var(--line); border-radius:7px; background:var(--bg); color:inherit; text-decoration:none; transition:background .15s, border-color .15s; }
.digest-list a::before { content:counter(digest, decimal-leading-zero); position:absolute; left:15px; top:14px; font:11px/1.6 var(--mono); color:var(--green); }
.digest-list a:hover { background:var(--green-soft); border-color:var(--green); }
.digest-list strong { display:block; font-size:14px; line-height:1.6; color:var(--green-deep); }
.digest-list span { display:block; font-size:12px; line-height:1.75; color:var(--muted); margin-top:3px; }
.timeline { list-style:none; margin:26px 0; padding:0; border-left:2px solid var(--line); }
.timeline li { display:flex; gap:16px; padding:0 0 22px 20px; position:relative; margin:0; }
.timeline li:last-child { padding-bottom:4px; }
.timeline li::before { content:""; position:absolute; left:-7px; top:8px; width:12px; height:12px; border-radius:50%; background:var(--paper); border:2px solid var(--green); box-sizing:border-box; }
.timeline time { flex:0 0 66px; font:12px/2 var(--mono); color:var(--green); }
.timeline strong { font-size:15px; line-height:1.8; color:var(--green-deep); }
.article .timeline p { margin:4px 0 0; font-size:14px; line-height:1.9; }
@media(max-width:560px) { .update-digest { padding:17px; margin-top:-10px; } .digest-list { grid-template-columns:1fr; } .digest-list a { padding:12px 12px 12px 42px; } .digest-list a::before { left:13px; top:13px; } .timeline li { gap:10px; padding-left:15px; } .timeline time { flex-basis:54px; font-size:11px; } .article .timeline p { font-size:13px; } }
@media print { .update-digest, .timeline li, .digest-list a { break-inside:avoid; } .digest-list { grid-template-columns:repeat(2,1fr); } }
