/* spike 19 · 文章页（字的部分）：从 spike 17 article.css 方案 1「纸面」留下来的规则；配图规则、方案 2 / 3 全部删掉 —— 图都在顶部图集（gallery.css）。 */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--sf-wall); color: var(--ink); font: var(--w-text) var(--t-r) / var(--lh-r) var(--font-text); -webkit-font-smoothing: antialiased; --bleed: 80px; }
h1, h2, p, figure, ul { margin: 0; } ul { padding: 0; list-style: none; } a { color: inherit; } img { display: block; max-width: 100%; height: auto; }
.layer { position: fixed; inset: 0; pointer-events: none; }
[data-copy-lang] { display: none; } html[data-lang="zh"] [data-copy-lang="zh"], html[data-lang="en"] [data-copy-lang="en"] { display: revert; }
html[data-lang="en"] body { --measure: var(--measure-en); } html[data-lang="zh"] body, body { --measure: var(--measure-zh); }

/* ---------- 顶栏：一行，56 高 ---------- */
.top { position: sticky; top: 0; z-index: 20; height: var(--bar-h); display: flex; align-items: center; gap: 16px; padding: 0 var(--page-x);
  background: color-mix(in srgb, var(--sf-wall) 88%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.top .home { display: inline-flex; align-items: center; text-decoration: none; color: var(--ink); min-height: 44px; }   /* 里面是小字标 .plik-mini（css/ui.css · v3 · R33） */
.top .sp { flex: 1; }
.top .lang { display: inline-flex; align-items: center; gap: 6px; font: var(--w-text) var(--t-s) / 1 var(--font-text); letter-spacing: .04em; }
.top .lang a { text-decoration: none; color: var(--ink-3); padding: 12px 4px; } .top .lang a[aria-current] { color: var(--ink); }
.top .lang i { font-style: normal; color: rgb(var(--ink-rgb) / .4); }
.top #sun-slider { margin-right: -12px; }
@media (max-width: 699.98px) { .top { gap: 10px; } }

/* ---------- 文章容器 ---------- */
.art { max-width: calc(var(--measure) + 2 * var(--bleed)); margin: 0 auto; padding: 40px var(--page-x) 0; }
.col { max-width: var(--measure); margin: 0 auto; }
@media (max-width: 899.98px) { body { --bleed: 0px; } .art { padding-top: 24px; } }

/* 文章头 */
.head { margin-bottom: 36px; }
.head .label { display: block; margin-bottom: 14px; }
.head h1 { font: var(--w-text) var(--t-xl) / var(--lh-xl) var(--font-text); letter-spacing: var(--ls-title); text-wrap: balance; }
.head h1 strong { font-weight: inherit; }
.head .lede { margin-top: 16px; font: var(--w-text) var(--t-l) / var(--lh-l) var(--font-text); letter-spacing: var(--ls-title); color: var(--ink-2); text-wrap: pretty; }
.head .meta { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 6px 14px; font: var(--w-text) var(--t-s) / var(--lh-s) var(--font-text); color: var(--ink-3); }
.head .meta i { font-style: normal; color: rgb(var(--ink-rgb) / .4); }

/* 正文 */
.body p { color: var(--ink-2); margin: 0 0 1em; text-wrap: pretty; }
.body .story-sub, .body h2 { font: var(--w-text) var(--t-l) / var(--lh-l) var(--font-text); letter-spacing: var(--ls-title); color: var(--ink); margin: var(--sp-9) 0 14px; text-wrap: balance; }
.body blockquote { margin: 0 0 1em; padding: 2px 0 2px 18px; border-left: 1.5px solid var(--hair-2); } .body blockquote p { color: var(--ink); }
.body a { text-decoration-color: var(--rule); text-underline-offset: .28em; } .body a:hover { text-decoration-color: currentColor; }
.body .figure-todo { display: none; }   /* 正文不放图 */

/* 结尾 */
.end { margin-top: var(--sp-10); padding-top: var(--sp-6); border-top: .5px solid var(--hair-2); }
.end .label { display: block; margin-bottom: 14px; }
.next { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 24px; align-items: center; text-decoration: none; padding: var(--pad-card-y) var(--pad-card-x); border-radius: var(--r-paper);
  background-color: var(--sf-paper); --ink-rgb: var(--sf-paper-ink); color: var(--ink);
  background-image: linear-gradient(160deg, rgb(255 255 255 / .34) 0%, rgb(255 255 255 / 0) 45%, rgb(60 48 30 / 0) 72%, rgb(60 48 30 / .025) 100%), var(--paper-tex); background-size: 100% 100%, 384px 384px;
  box-shadow: 0 0 0 .5px rgb(var(--sf-wall-ink) / .08), 0 1px 1.5px rgb(var(--sh-rgb, 44 56 80) / .10), 0 6px 18px -10px rgb(var(--sh-rgb, 44 56 80) / .18); transition: translate var(--dur-hover) var(--ease-obj), box-shadow var(--dur-hover); }
.next:hover { translate: 0 -2px; box-shadow: 0 0 0 .5px rgb(var(--sf-wall-ink) / .08), 0 2px 2px rgb(var(--sh-rgb, 44 56 80) / .1), 0 12px 22px -10px rgb(var(--sh-rgb, 44 56 80) / .26); }
:root[data-theme="night"] .next { background-image: linear-gradient(160deg, rgb(255 226 190 / .07) 0%, rgb(255 226 190 / 0) 45%, rgb(0 0 0 / 0) 70%, rgb(0 0 0 / .10) 100%), var(--paper-tex); background-blend-mode: normal, multiply; box-shadow: 0 0 0 .5px rgb(var(--sf-wall-ink) / .10), 0 1px 1.5px rgb(0 0 0 / .4), 0 8px 22px -10px rgb(0 0 0 / .5); }
.next .label { margin-bottom: var(--gap-label); }
.next .t { font: var(--w-text) var(--t-l) / var(--lh-l) var(--font-text); letter-spacing: var(--ls-title); text-wrap: balance; }
.next .go { font: var(--w-text) var(--t-s) / var(--lh-s) var(--font-text); color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--rule); text-underline-offset: .28em; white-space: nowrap; }
.next:hover .go { color: var(--ink); text-decoration-color: currentColor; }
.next img { width: 96px; height: auto; grid-row: 1 / span 2; grid-column: 2; border-radius: var(--r-paper); box-shadow: 0 0 0 .5px rgb(30 36 48 / .10); }   /* 下一篇的一张实物照片 */
@media (max-width: 599.98px) { .next { gap: 12px 16px; } .next img { width: 72px; } }
.ways { margin-top: var(--sp-6); display: flex; flex-wrap: wrap; gap: 10px 26px; font: var(--w-text) var(--t-s) / var(--lh-s) var(--font-text); }
.ways a { color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--rule); text-underline-offset: .28em; padding: 8px 0; }
.ways a:hover { color: var(--ink); text-decoration-color: currentColor; }

/* 页尾 */
.site-foot { max-width: calc(var(--measure) + 2 * var(--bleed)); margin: var(--sp-9) auto 0; padding: var(--sp-6) var(--page-x) var(--sp-9); border-top: .5px solid var(--hair-2); display: flex; flex-wrap: wrap; gap: 6px 22px; font: var(--w-text) var(--t-s) / var(--lh-s) var(--font-text); color: var(--ink-3); }
.site-foot a { color: var(--ink-3); text-decoration-color: var(--rule); text-underline-offset: .28em; } .site-foot a:hover { color: var(--ink); text-decoration-color: currentColor; }

@media (prefers-reduced-motion: reduce) { .next, .ways a { transition: none; } }