:root {
  --paper: #f4f4f5;
  --sheet: #ffffff;
  --sheet-soft: #fafafa;
  --ink: #3f3f46;
  --muted: #71717a;
  --line: #e4e4e7;
  --line-strong: #d4d4d8;
  --accent: #52525b;
  --green: #64748b;
  --code: #f6f8fa;
  --shadow: 0 12px 36px rgba(24,24,27,.06), 0 1px 3px rgba(24,24,27,.04);
}

[x-cloak] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 18% 8%, rgba(255,255,255,.72), transparent 24rem),
    var(--paper);
  color: var(--ink);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
.serif { font-family: "Noto Serif SC", "Songti SC", STSong, serif; }
.font-code, pre, code { font-family: "Fira Code", "JetBrains Mono", Consolas, monospace; }
.hairline { border-color: var(--line); }
.muted { color: var(--muted); }
.accent { color: var(--accent); }

.site-shell { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }
.paper-surface {
  position: relative;
  background: color-mix(in srgb, var(--sheet) 96%, transparent);
  border: 1px solid var(--line);
  border-radius: 5px 7px 6px 4px;
  box-shadow: var(--shadow);
}
.paper-surface::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 4px -2px -3px 2px;
  border-radius: inherit;
  background: rgba(255,255,255,.38);
  transform: rotate(-.12deg);
}
.paper-tape::before {
  content: "";
  position: absolute;
  z-index: 3;
  width: 82px;
  height: 22px;
  top: -12px;
  left: 50%;
  transform: translateX(-50%) rotate(.8deg);
  opacity: .78;
  background: repeating-linear-gradient(45deg,#f4d77f 0 7px,#f9e4a5 7px 12px);
  clip-path: polygon(2% 4%,98% 0,96% 100%,0 94%);
}
.site-header { margin-top: 24px; padding: 0 28px; }
.brand { font-family: "Noto Serif SC", serif; font-weight: 800; letter-spacing: .08em; }
.nav-link { position: relative; color: var(--muted); transition: color .2s; }
.nav-link:hover, .nav-link.is-active { color: var(--ink); }
.nav-link.is-active::after {
  content: ""; position: absolute; left: 8%; right: 8%; bottom: -8px; height: 7px;
  background: repeating-linear-gradient(45deg,#b9dfc2 0 5px,#d5ebd9 5px 9px); z-index: -1;
}
.icon-button {
  width: 42px; height: 42px; display: inline-grid; place-items: center;
  border: 1px dashed #d8c9ae; border-radius: 3px; background: var(--sheet-soft);
  color: var(--ink); transition: transform .18s, background .18s;
}
.icon-button:hover { transform: rotate(-2deg) translateY(-1px); background: #fffaf0; }
.search-popover { position: absolute; right: 0; top: calc(100% + 13px); width: min(360px, 86vw); z-index: 20; padding: 12px; }
.search-input { width: 100%; border: 0; background: transparent; color: var(--ink); outline: 0; padding: 8px 10px; }

.home-grid { display: grid; grid-template-columns: 230px minmax(0,1fr); gap: 28px; align-items: start; }
.sidebar-card { padding: 24px; }
.sidebar-title { font-family: "Noto Serif SC", serif; font-size: 1.08rem; font-weight: 800; margin-bottom: 18px; }
.category-link { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-top: 1px dashed var(--line-strong); color: var(--muted); font-size: .92rem; }
.category-link:first-of-type { border-top: 0; }
.category-dot { width: 9px; height: 9px; background: var(--green); transform: rotate(-8deg); }
.category-link:nth-child(3n) .category-dot { background: #6ba6d6; }
.category-link:nth-child(3n+1) .category-dot { background: #e59c5d; }
.category-link:hover { color: var(--accent); }
.intro-card { padding: 28px 30px; margin-bottom: 22px; overflow: hidden; }
.intro-card::before { left: auto; right: 38px; transform: rotate(3deg); }
.intro-title { font-family: "Noto Serif SC", serif; font-size: clamp(1.8rem,4vw,2.65rem); font-weight: 800; letter-spacing: -.04em; }
.intro-mark { display: inline-block; position: relative; }
.intro-mark::after { content:""; position:absolute; left:-2px; right:-4px; bottom:3px; height:9px; background:#f6dda0; opacity:.7; z-index:-1; transform:rotate(-1deg); }
.section-kicker { display:flex; align-items:center; gap:10px; margin: 28px 4px 14px; font-weight:700; }
.section-kicker::before { content:"↻"; color:var(--green); font-size:1.2rem; }

.post-list { display: grid; gap: 15px; }
.post-card { position: relative; padding: 24px 26px 22px; overflow: hidden; transition: transform .22s, box-shadow .22s; }
.post-card:hover { transform: translateY(-3px) rotate(-.08deg); box-shadow: 0 20px 45px rgba(73,61,43,.11); }
.post-card:nth-child(even) { transform: rotate(.08deg); }
.post-card:nth-child(even):hover { transform: translateY(-3px) rotate(0); }
.post-card-title { font-family:"Noto Serif SC",serif; font-size:1.35rem; line-height:1.5; font-weight:800; transition:color .18s; }
.post-card:hover .post-card-title { color:#b45309; }
.post-summary { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; color:var(--muted); line-height:1.85; margin-top:10px; }
.post-meta { display:flex; flex-wrap:wrap; gap:9px 15px; align-items:center; color:var(--muted); font-size:.76rem; margin-top:17px; }
.pill { display:inline-flex; align-items:center; border:1px solid #c7ddca; background:#edf6ed; color:#4f7f5d; border-radius:999px; padding:3px 10px; font-size:.72rem; }
.tag-strip { display:inline-flex; padding:4px 9px; color:#526f5a; font-size:.72rem; background:repeating-linear-gradient(45deg,#cfe7d3 0 5px,#e5f2e6 5px 9px); border-radius:2px; transform:rotate(-.5deg); }
.tag-strip:nth-child(3n+1) { color:#765c27; background:repeating-linear-gradient(45deg,#f5dda0 0 5px,#faebbd 5px 9px); }
.tag-strip:nth-child(3n+2) { color:#49647a; background:repeating-linear-gradient(45deg,#cbe0f0 0 5px,#e0edf5 5px 9px); }
.arrow-link { position:absolute; right:24px; top:50%; transform:translateY(-50%); color:var(--muted); font-size:1.3rem; }
.empty-paper { padding: 58px 24px; text-align:center; color:var(--muted); }
.pagination { display:flex; justify-content:center; align-items:center; gap:16px; margin-top:26px; }

.detail-layout { display:grid; grid-template-columns:220px minmax(0,1fr); gap:28px; align-items:start; }
.detail-aside { position:sticky; top:24px; padding:24px; }
.reading-number { font-family:"Noto Serif SC",serif; font-size:1.8rem; font-weight:800; }
.article-sheet { padding: clamp(28px,5vw,64px); overflow:hidden; }
.article-header { padding-bottom:28px; margin-bottom:34px; border-bottom:1px dashed var(--line-strong); }
.article-header-top { padding-top: 2px; }
.article-title { font-family:"Noto Serif SC",serif; font-size:clamp(2rem,5vw,3.25rem); line-height:1.32; font-weight:800; letter-spacing:-.045em; }
.article-dek { color:var(--muted); font-size:1.03rem; line-height:1.85; margin-top:16px; }

.prose-paper { font-size:1.03rem; line-height:2; color:#3d3935; }
.prose-paper h1,.prose-paper h2,.prose-paper h3,.prose-paper h4 { font-family:"Noto Serif SC",serif; color:var(--ink); font-weight:800; letter-spacing:-.025em; margin:2.15em 0 .8em; }
.prose-paper h1 { font-size:2rem; }
.prose-paper h2 { font-size:1.55rem; position:relative; padding-bottom:.48rem; }
.prose-paper h2::after { content:""; position:absolute; left:0; bottom:0; width:48px; height:3px; border-radius:9px; background:#79ae86; transform:rotate(-2deg); }
.prose-paper h3 { font-size:1.25rem; }
.prose-paper p { margin:1.15em 0; }
.prose-paper a { color:var(--accent); text-decoration:underline wavy #d7a983; text-underline-offset:4px; }
.prose-paper strong { color:#4d815b; font-weight:700; }
.prose-paper ul,.prose-paper ol { margin:1.1em 0; padding-left:1.6rem; }
.prose-paper ul { list-style:disc; } .prose-paper ol { list-style:decimal; }
.prose-paper li { margin:.45em 0; }
.prose-paper blockquote { border-left:4px solid #c4b5a5; background:#f1ece3; padding:.8rem 1.3rem; margin:1.6rem 0; color:#665e56; font-family:"Noto Serif SC",serif; font-style:italic; }
.prose-paper pre { position:relative; background:var(--code); border:1px solid var(--line-strong); border-radius:9px; padding:3.05rem 1.2rem 1.25rem; overflow-x:auto; font-size:.85rem; line-height:1.75; box-shadow:inset 0 1px rgba(255,255,255,.55); }
.prose-paper pre::after { content:""; position:absolute; top:16px; left:16px; width:9px; height:9px; border-radius:50%; background:#e56b63; box-shadow:15px 0 #e5b75b,30px 0 #67b979; }
.prose-paper pre::before { content:attr(data-lang); position:absolute; top:12px; left:62px; font-size:.66rem; letter-spacing:.13em; color:var(--muted); text-transform:uppercase; }
.prose-paper :not(pre)>code { background:#edf2e8; border:1px solid #d5e1ce; color:#558061; padding:.12em .38em; border-radius:2px; font-size:.88em; }
.prose-paper img { display:block; max-width:100%; margin:2rem auto; border:8px solid #fffdf8; box-shadow:0 10px 28px rgba(60,52,40,.13); transform:rotate(-.2deg); }
.prose-paper table { width:100%; border-collapse:collapse; margin:1.6rem 0; overflow:hidden; }
.prose-paper th,.prose-paper td { border:1px solid var(--line-strong); padding:.68rem; text-align:left; }
.prose-paper th { background:#f0ece3; }

.btn { display:inline-flex; align-items:center; justify-content:center; border-radius:4px; padding:.62rem .95rem; font-size:.875rem; transition:.18s; }
.btn-primary { background:var(--ink); color:#fff; }.btn-primary:hover { background:#4b443e; }
.btn-soft { border:1px solid var(--line); background:var(--sheet-soft); }.btn-soft:hover { background:#fffaf0; }
.field { width:100%; border:1px solid var(--line); background:#fffdf9; border-radius:5px; padding:.72rem .82rem; outline:none; }
.field:focus { border-color:#b99376; box-shadow:0 0 0 3px rgba(185,147,118,.14); }

.dark body { --paper:#18191c; --sheet:#1e2025; --sheet-soft:#26282e; --ink:#d0d5dd; --muted:#858d9d; --line:rgba(255,255,255,.055); --line-strong:rgba(255,255,255,.085); --accent:#98a2b3; --green:#6fae9f; --code:#202227; --shadow:0 18px 48px -24px rgba(0,0,0,.58); background-color:var(--paper); background-image:radial-gradient(circle,rgba(255,255,255,.085) .7px,transparent .8px); background-size:22px 22px; }
.dark .prose-paper { color:#d4ccc0; }.dark .prose-paper blockquote { background:#373129; color:#c8bdb1; }.dark .prose-paper :not(pre)>code { background:#2e392d; border-color:#425142; }.dark .copy-code { background:#302c26; border-color:#51483d; color:#c8bdb1; }

@media (max-width: 820px) {
  .site-header { margin-top:12px; padding:0 18px; }
  .home-grid,.detail-layout { grid-template-columns:1fr; }
  .home-grid > aside { display:none; }
  .detail-aside { position:static; display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .article-sheet { padding:28px 22px; }
}
@media (max-width: 520px) {
  .site-shell { width:min(100% - 20px,1180px); }
  .intro-card { padding:24px 20px; }
  .post-card { padding:21px 20px; }
  .arrow-link { display:none; }
  .post-meta { gap:8px 11px; }
  .detail-aside { grid-template-columns:1fr; }
}

/* Flatpaper article detail v3 */
.flatpaper-detail { grid-template-columns: 280px minmax(0, 1fr); gap: 30px; }
.detail-sidebar { display: grid; gap: 20px; align-self: start; position: sticky; top: 22px; }
.detail-sidebar .sidebar-card { padding: 21px; border-radius: 10px; }
.author-card { text-align: center; overflow: visible; }
.author-card::before { width: 72px; height: 20px; top: -11px; }
.author-avatar { width: 78px; height: 78px; margin: 4px auto 14px; display: grid; place-items: center; border: 6px solid #fffaf0; border-radius: 46% 54% 48% 52%; background: linear-gradient(145deg,#e9c98e,#f5e8ca); box-shadow: 0 7px 18px rgba(80,61,40,.12); transform: rotate(-2deg); }
.author-avatar span { font: 800 1.75rem "Noto Serif SC", serif; color: #815c38; }
.author-name { font: 800 1.16rem "Noto Serif SC", serif; letter-spacing: .03em; }
.author-bio { margin-top: 8px; font-size: .79rem; line-height: 1.8; color: var(--muted); }
.author-stats { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 19px; padding: 15px 0 13px; border-top: 1px dashed var(--line-strong); border-bottom: 1px dashed var(--line-strong); }
.author-stats div + div { border-left: 1px solid var(--line); }
.author-stats strong { display: block; font: 800 1rem "Noto Serif SC", serif; }
.author-stats span { display: block; margin-top: 2px; font-size: .68rem; color: var(--muted); }
.author-categories { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-top: 14px; }
.author-categories a { min-width: 0; padding: 7px 3px; border: 1px solid #e8dccb; border-radius: 7px; background: #fff9ef; color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-align: center; text-decoration: none; transition: transform .18s,color .18s,background .18s,border-color .18s; }
.author-categories a:nth-child(4n+2) { background: #f3f8ef; }
.author-categories a:nth-child(4n+3) { background: #f1f6fb; }
.author-categories a:nth-child(4n) { background: #faf2f2; }
.author-categories a:hover { transform: translateY(-2px); color: var(--accent); border-color: #dfbc92; background: #fff4e5; }

.toc-card { padding: 16px 18px 18px !important; }
.toc-heading { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 3px 1px 11px; border-bottom: 1px dashed var(--line-strong); font: 800 .92rem "Noto Serif SC", serif; cursor: pointer; }
.toc-heading > span:first-child { display: flex; align-items: center; gap: 8px; }
.paper-pin { width: 8px; height: 15px; display: inline-block; border-radius: 4px 4px 2px 2px; background: #e59c5d; transform: rotate(9deg); box-shadow: 0 1px 0 #b87945; }
.toc-chevron { color: var(--muted); font-family: sans-serif; }
.toc-list { padding-top: 11px; max-height: 44vh; overflow: auto; scrollbar-width: thin; }
.toc-list.is-collapsed { display: none; }
.toc-link { position: relative; display: block; margin: 1px 0; padding: 7px 8px 7px 13px; border-radius: 5px; color: var(--muted); font-size: .76rem; line-height: 1.45; text-decoration: none; transition: color .18s,background .18s,transform .18s; }
.toc-link:hover { color: var(--ink); background: #faf4e8; transform: translateX(2px); }
.toc-link.is-active { color: var(--ink); background: #fff7ea; font-weight: 700; }
.toc-link.is-active::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 3px; border-radius: 9px; background: #e49451; box-shadow: 0 0 0 2px rgba(228,148,81,.08); }
.toc-h3 { padding-left: 25px; font-size: .73rem; }
.toc-h4 { padding-left: 37px; font-size: .7rem; }
.toc-empty { padding: 13px 2px 2px; color: var(--muted); font-size: .75rem; }

.latest-title { display: flex; gap: 7px; align-items: center; margin-bottom: 9px; font-size: .96rem; }
.latest-title span { color: #d69052; }
.latest-list { display: grid; }
.latest-item { display: grid; gap: 3px; padding: 10px 0; border-top: 1px dashed var(--line); text-decoration: none; transition: transform .18s,color .18s; }
.latest-item:first-child { border-top: 0; }
.latest-item span { font: 700 .78rem/1.55 "Noto Serif SC", serif; }
.latest-item time { color: var(--muted); font-size: .65rem; letter-spacing: .02em; }
.latest-item:hover { color: var(--accent); transform: translateX(3px); }
.latest-item:hover span { text-decoration: underline; text-decoration-style: wavy; text-decoration-color: #e2b58e; text-underline-offset: 3px; }

.article-sheet { border-radius: 11px; padding: 28px 22px 34px; }
.article-header { padding-bottom: 23px; margin-bottom: 30px; }
.article-taxonomy { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 13px; }
.article-title { font-size: clamp(1.3rem,2.3vw,1.5rem); line-height: 1.5; letter-spacing: -.02em; }
.article-dek { font-size: .9rem; line-height: 1.8; margin-top: 11px; }
.article-meta { margin-top: 13px; font-size: .72rem; gap: 7px 14px; }
.prose-paper { font-size: 1rem; line-height: 1.8; }
.prose-paper h1 { font-size: 1.65rem; }
.prose-paper h2 { font-size: 1.38rem; }
.prose-paper h3 { font-size: 1.16rem; }
.prose-paper h4 { font-size: 1.02rem; }
.prose-paper blockquote { border-left-color: #d7a16c; border-radius: 4px 8px 8px 4px; background: #f6efe4; box-shadow: inset 0 0 0 1px rgba(165,126,83,.06); }

.dark .author-avatar { border-color: #3a342c; background: linear-gradient(145deg,#62513b,#806b49); }
.dark .author-avatar span { color: #f0d8ae; }
.dark .author-categories a:hover,.dark .toc-link:hover,.dark .toc-link.is-active { background: #3b342a; }
.dark .paper-landscape { filter: brightness(.65) saturate(.75); }
.dark .prose-paper blockquote { background: #383128; }

@media (max-width: 980px) {
  .flatpaper-detail { grid-template-columns: 240px minmax(0,1fr); gap: 22px; }
  .detail-sidebar .sidebar-card { padding: 18px; }
}
@media (max-width: 820px) {
  .flatpaper-detail { grid-template-columns: 1fr; }
  .detail-sidebar { position: static; grid-template-columns: 1fr 1fr; }
  .author-card { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; column-gap: 18px; text-align: left; align-items: center; }
  .author-avatar { grid-row: span 2; margin: 0; }
  .author-stats,.author-categories { grid-column: 1 / -1; }
  .toc-list { max-height: 290px; }
}
@media (max-width: 580px) {
  .detail-sidebar { grid-template-columns: 1fr; }
  .author-card { grid-column: auto; }
  .latest-card { display: none; }
  .article-sheet { padding: 20px 14px 26px; }
  .article-title { font-size: 1.28rem; }
  .article-meta { gap: 6px 10px; }
  .prose-paper { font-size: .96rem; }
}

/* Flatpaper callouts + editor insert palette */
.callout-insert-panel { margin: 2px 0 14px; padding: 13px 14px; border: 1px solid #eadfce; border-radius: 10px; background: #fffaf2; box-shadow: 0 4px 14px rgba(82,61,38,.06); }
.callout-insert-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; color:#493e34; font-size:.82rem; font-weight:700; }
.callout-insert-head small { color:#9a8e80; font-size:.68rem; font-weight:400; }
.callout-insert-grid { display:flex; flex-wrap:wrap; gap:8px; }
.callout-insert-item { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:6px 10px; border:1px solid rgba(105,89,72,.13); border-radius:8px; background:#f4f1ed; color:#5f5a54; font-size:.73rem; transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.callout-insert-item:hover { transform:translateY(-2px); box-shadow:0 5px 12px rgba(73,57,42,.08); border-color:rgba(105,89,72,.22); }
.callout-insert-item i { display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:#9e9a8e; color:#fff; font-style:normal; font-size:.68rem; font-weight:800; }
.callout-insert-item.is-primary { background:#f1efff; color:#7569c8; }.callout-insert-item.is-primary i{background:#9486e6}
.callout-insert-item.is-success { background:#edf7f0; color:#5c9871; }.callout-insert-item.is-success i{background:#70ae86}
.callout-insert-item.is-info { background:#edf6fc; color:#5792bd; }.callout-insert-item.is-info i{background:#6ca9d4}
.callout-insert-item.is-warning,.callout-insert-item.is-collapse { background:#fff7e8; color:#bd8a30; }.callout-insert-item.is-warning i,.callout-insert-item.is-collapse i{background:#efb83e}
.callout-insert-item.is-danger { background:#fff0f0; color:#c75e5e; }.callout-insert-item.is-danger i{background:#dc7474}

.prose-paper .paper-callout { --callout-bg:#f4f2ef; --callout-border:#ddd8d0; --callout-accent:#9c988d; position:relative; display:grid; grid-template-columns:34px minmax(0,1fr); gap:14px; align-items:start; margin:2.15rem 0; padding:23px 24px; border:1px solid var(--callout-border); border-radius:2px; background:var(--callout-bg); box-shadow:0 3px 10px rgba(78,61,43,.06); color:#435054; }
.prose-paper .paper-callout .callout-icon { display:grid; place-items:center; width:28px; height:28px; margin-top:1px; border-radius:50%; background:var(--callout-accent); color:#fff; font-size:.78rem; font-weight:800; line-height:1; }
.prose-paper .paper-callout .callout-body { min-width:0; font-size:.96rem; line-height:1.8; }
.prose-paper .paper-callout .callout-body > :first-child { margin-top:0; }.prose-paper .paper-callout .callout-body > :last-child { margin-bottom:0; }
.prose-paper .paper-callout .callout-title { display:block; margin:0 0 5px; color:var(--callout-accent); font-weight:800; }
.prose-paper .callout-default { --callout-bg:#f3f2f1; --callout-border:#dfdcd8; --callout-accent:#99958a; }
.prose-paper .callout-primary { --callout-bg:#f1f0ff; --callout-border:#dfddfb; --callout-accent:#9587e7; }
.prose-paper .callout-success { --callout-bg:#edf6f0; --callout-border:#d6e9dc; --callout-accent:#6bab80; }
.prose-paper .callout-info { --callout-bg:#edf6fc; --callout-border:#d6e7f3; --callout-accent:#69a8d4; }
.prose-paper .callout-warning { --callout-bg:#fff8ea; --callout-border:#f1e4c3; --callout-accent:#efb83f; }
.prose-paper .callout-danger { --callout-bg:#fff0f0; --callout-border:#f0d8d8; --callout-accent:#dc7474; }
.prose-paper details.paper-callout { display:block; padding:0; overflow:visible; }
.prose-paper details.paper-callout > summary { display:grid; grid-template-columns:34px minmax(0,1fr) 24px; gap:12px; align-items:center; padding:20px 23px; list-style:none; cursor:pointer; color:var(--callout-accent); font-weight:800; }
.prose-paper details.paper-callout > summary::-webkit-details-marker { display:none; }
.prose-paper details.paper-callout > summary .callout-icon { margin:0; }
.prose-paper details.paper-callout .callout-chevron { justify-self:end; font-size:1rem; transition:transform .2s ease; }
.prose-paper details.paper-callout[open] .callout-chevron { transform:rotate(180deg); }
.prose-paper details.paper-callout > .callout-body { padding:0 24px 20px 69px; }

/* Hand-drawn underline for H4 */
.prose-paper h4::after { content:""; display:block; width:62px; height:9px; margin-top:8px; background-repeat:no-repeat; background-size:100% 100%; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 9'%3E%3Cpath d='M1 5.3 C12 3.2 20 5.1 31 4.2 S49 5.6 63 3.8' fill='none' stroke='%23e99a62' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); opacity:.92; }

.dark .callout-insert-panel { background:#302b24; border-color:#4b4237; }
.dark .callout-insert-head { color:#e4dbcf; }.dark .callout-insert-head small{color:#9e9182}
.dark .callout-insert-item { border-color:#4f463b; }
.dark .prose-paper .paper-callout { filter:saturate(.78) brightness(.78); color:#f0e8de; }
@media (max-width:640px){.callout-insert-head{align-items:flex-start;flex-direction:column;gap:2px}.prose-paper .paper-callout{padding:20px 16px;grid-template-columns:30px minmax(0,1fr);gap:10px}.prose-paper details.paper-callout>summary{padding:18px 16px;grid-template-columns:30px minmax(0,1fr) 20px}.prose-paper details.paper-callout>.callout-body{padding:0 16px 18px 56px}}


/* Navigation dropdown + homepage pin/tag enhancements */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:inline-flex; align-items:center; gap:5px; }
.nav-dropdown-trigger span { font-size:.72rem; transition:transform .18s ease; }
.nav-dropdown-trigger[aria-expanded="true"] span { transform:rotate(180deg); }
.nav-dropdown-menu { position:absolute; top:calc(100% + 16px); left:50%; z-index:40; width:150px; padding:8px; transform:translateX(-50%); border-radius:8px; box-shadow:0 16px 34px rgba(72,58,40,.13); }
.nav-dropdown-menu::before { content:""; position:absolute; left:0; right:0; top:-18px; height:18px; }
.nav-dropdown-menu a { display:flex; align-items:center; gap:9px; padding:10px 11px; border-radius:6px; color:var(--muted); font-size:.84rem; white-space:nowrap; }
.nav-dropdown-menu a:hover { color:var(--accent); background:#fff7eb; transform:translateX(2px); }
.home-stats > div + div { border-left:1px solid var(--line); }
.sidebar-tags { display:flex; flex-wrap:wrap; gap:8px; }
.sidebar-tag { display:inline-flex; align-items:center; gap:5px; padding:5px 8px; border:1px dashed #d8cdbd; border-radius:5px; background:#fffaf2; color:var(--muted); font-size:.72rem; transition:.18s ease; }
.sidebar-tag small { color:#aaa094; font-size:.62rem; }
.sidebar-tag:hover { color:var(--accent); transform:translateY(-2px) rotate(-1deg); }
.pinned-section { margin-bottom: 26px; }
.pinned-section-title { margin-bottom: 12px; }
.pinned-grid { display: flex; flex-direction: column; gap: 14px; }
.pinned-card { position: relative; min-height: 0; padding: 22px 24px 46px; border-radius: 10px; }
.pinned-card::before { width: 62px; height: 17px; top: -9px; }
.pinned-kicker { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-height: 25px; margin-bottom:10px; }
.pinned-title { font: 800 clamp(1.125rem,1.6vw,1.25rem)/1.55 "Noto Serif SC",serif; color: var(--ink); }
.pinned-title a:hover { color:var(--accent); }
.pinned-summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin-top: 10px; color: var(--muted); font-size: .78rem; line-height: 1.75; }
.pinned-meta { margin-top:13px; gap: 5px 9px; font-size: .66rem; }
.pinned-read { position:absolute; right:18px; bottom:17px; color:var(--accent); font-size:.76rem; font-weight:700; }
.pin-action { color:#9a6f2f; font-size:.875rem; }
.pin-action:hover { color:#c27624; }
.pin-action.is-pinned { color:#4f865e; font-weight:500; }
@media (max-width:1100px){.pinned-card{min-height:0}}
@media (max-width:640px){.pinned-card{padding:22px 18px 46px}.pinned-title{font-size:1.12rem}}


/* =========================================================
   Flatpaper Markdown prose system v5
   Hand-drawn paper typography for rendered article content
   ========================================================= */
.prose-paper {
  --prose-ink: #3f3a34;
  --prose-muted: #8f8579;
  --prose-orange: #e5a869;
  --prose-orange-deep: #b35900;
  --prose-line: #efe6d8;
  --prose-soft: #fffaf2;
  --prose-code: #faf5eb;
  color: var(--prose-ink);
  font-size: 1rem;
  line-height: 1.86;
  overflow-wrap: break-word;
}
.prose-paper > :first-child { margin-top: 0; }
.prose-paper > :last-child { margin-bottom: 0; }

/* Compact headings + a fixed hand-drawn scribble under H2/H3/H4. */
.prose-paper h1,
.prose-paper h2,
.prose-paper h3,
.prose-paper h4 {
  font-family: "Noto Serif SC", "Songti SC", serif;
  color: #302d29;
  font-weight: 800;
  letter-spacing: -.018em;
  line-height: 1.45;
}
.prose-paper h2,
.prose-paper h3,
.prose-paper h4 {
  position: relative;
  padding-bottom: 13px;
}
.prose-paper h2 { margin: 2.25em 0 .88em; font-size: 1.38rem; }
.prose-paper h3 { margin: 2.05em 0 .82em; font-size: 1.18rem; }
.prose-paper h4 { margin: 1.85em 0 .76em; font-size: 1.04rem; }
.prose-paper h2::after,
.prose-paper h3::after,
.prose-paper h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 64px;
  height: 9px;
  margin: 0;
  opacity: .94;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 64px 9px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='9' viewBox='0 0 64 9'%3E%3Cpath d='M1 5.4 C8 3.25 14 5.45 21 4.3 S34 5.6 41 4.15 S54 5.35 63 3.9' fill='none' stroke='%23E5A869' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
.prose-paper h3::after { width: 58px; background-size: 58px 9px; }
.prose-paper h4::after { width: 52px; background-size: 52px 9px; }

/* Inline elements. */
.prose-paper p { margin: 1.08em 0; }
.prose-paper strong,
.prose-paper b { color: var(--prose-orange-deep); font-weight: 750; }
.prose-paper a:not(.btn) {
  color: #b86d2c;
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: var(--prose-orange);
  text-decoration-thickness: 1.2px;
  text-underline-offset: 4px;
  transition: color .16s ease, background-color .16s ease;
}
.prose-paper a:not(.btn):hover { color: #8f4f1d; background: #fff5e7; }
.prose-paper :not(pre) > code {
  padding: .14em .42em;
  border: 1px solid #ebcda9;
  border-radius: 3px;
  background: #fbf3e8;
  color: #b7652e;
  font-family: "Fira Code", Consolas, "SFMono-Regular", monospace;
  font-size: .88em;
  line-height: 1.45;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* Paper-grid table. Wrapper-less radius works via separate borders. */
.prose-paper table {
  width: 100%;
  margin: 1.75rem 0;
  border: 1px solid var(--prose-line);
  border-spacing: 0;
  border-collapse: separate;
  border-radius: 8px;
  overflow: hidden;
  background: #fffdf9;
  font-size: .91rem;
  line-height: 1.65;
  box-shadow: 0 2px 8px rgba(79, 60, 38, .035);
}
.prose-paper thead th {
  background: #f7efe4;
  color: #443d35;
  font-weight: 750;
  text-align: left;
}
.prose-paper th,
.prose-paper td {
  padding: 10px 14px;
  border: 0;
  border-right: 1px solid var(--prose-line);
  border-bottom: 1px solid var(--prose-line);
  vertical-align: top;
}
.prose-paper tr > :last-child { border-right: 0; }
.prose-paper tbody tr:last-child > td { border-bottom: 0; }
.prose-paper tbody tr:nth-child(even) td { background: rgba(250, 245, 235, .42); }

/* Quote card. Callouts keep their own semantic accent colors below. */
.prose-paper blockquote {
  position: relative;
  margin: 1.65rem 0;
  padding: 15px 18px 15px 20px;
  border: 1px solid #eee3d3;
  border-left: 5px solid var(--prose-orange);
  border-radius: 4px 8px 8px 4px;
  background: #fff9ef;
  color: #665d53;
  font-family: inherit;
  font-style: normal;
  box-shadow: 0 3px 10px rgba(77, 59, 38, .035);
}
.prose-paper blockquote > :first-child { margin-top: 0; }
.prose-paper blockquote > :last-child { margin-bottom: 0; }

/* Code paper: fixed header + independently scrolling code body. */
.prose-paper .code-block-wrapper {
  margin: 1.85rem 0;
  overflow: hidden;
  border: 1px solid #2b2d2f;
  border-radius: 7px;
  background: #faf5eb;
  box-shadow: 0 5px 14px rgba(49, 42, 34, .06);
}
.code-header {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 10px 7px 15px;
  border-bottom: 1px solid #2b2d2f;
  background: #f3ebdd;
  box-sizing: border-box;
}
.code-language {
  min-width: 0;
  overflow: hidden;
  color: #655d54;
  font: 700 .68rem/1 "Fira Code", Consolas, monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.prose-paper .code-block-wrapper pre.code-body {
  margin: 0;
  padding: 14px 0 12px;
  overflow-x: auto;
  overflow-y: hidden;
  border: 0;
  border-radius: 0;
  background: #faf5eb;
  color: #4b4640;
  box-shadow: none;
  font: 400 .84rem/1.72 "Fira Code", Consolas, "SFMono-Regular", monospace;
  tab-size: 2;
  scrollbar-width: thin;
  scrollbar-color: #d1c7b7 transparent;
  scroll-behavior: smooth;
}
.prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar { height: 5px; }
.prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar-track { background: #faf5eb; }
.prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #d1c7b7;
}
.prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar-thumb:hover { background: #b9ad9b; }
.prose-paper .code-block-wrapper pre.code-body::before,
.prose-paper .code-block-wrapper pre.code-body::after { display: none; }
.prose-paper .code-block-wrapper pre.code-body > code {
  display: block;
  min-width: max-content;
  padding: 0 16px 0 0;
  background: transparent;
  color: inherit;
  counter-reset: code-line;
}
.prose-paper .code-block-wrapper .code-line {
  display: block;
  min-height: 1.72em;
  padding-right: 16px;
  white-space: pre;
}
.prose-paper .code-block-wrapper .code-line::before {
  counter-increment: code-line;
  content: counter(code-line);
  display: inline-block;
  width: 3.2em;
  margin-right: 14px;
  padding-right: 10px;
  border-right: 1px solid #e0d6c6;
  color: #aaa093;
  text-align: right;
  user-select: none;
}
.code-tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
}
.copy-code,
.collapse-code {
  position: static;
  inset: auto;
  z-index: auto;
  display: inline-grid;
  place-items: center;
  min-width: 31px;
  height: 30px;
  padding: 0 9px;
  border: 1px solid #d4c9b9;
  border-radius: 6px;
  background: #fffaf1;
  color: #756b60;
  font: 600 .65rem/1 "PingFang SC", sans-serif;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease, color .15s ease;
}
.copy-code:hover,
.collapse-code:hover { background: #fff; transform: translateY(-1px); color: #403a34; }
.collapse-code { width: 31px; padding: 0; font-size: .82rem; }
.code-block-wrapper.is-collapsed .code-body { display: none; }

/* Warm pastel token colors: active when a highlighter emits common token classes. */
.prose-paper pre .comment,
.prose-paper pre .token.comment,
.prose-paper pre .hljs-comment { color: #9c9488; font-style: italic; }
.prose-paper pre .keyword,
.prose-paper pre .token.keyword,
.prose-paper pre .hljs-keyword { color: #b25d48; }
.prose-paper pre .string,
.prose-paper pre .token.string,
.prose-paper pre .hljs-string { color: #66815d; }
.prose-paper pre .number,
.prose-paper pre .token.number,
.prose-paper pre .hljs-number { color: #b47b43; }
.prose-paper pre .function,
.prose-paper pre .token.function,
.prose-paper pre .hljs-title.function_ { color: #687aa2; }
.prose-paper pre .class-name,
.prose-paper pre .token.class-name,
.prose-paper pre .hljs-title.class_ { color: #8b6a9c; }
.prose-paper pre .operator,
.prose-paper pre .punctuation,
.prose-paper pre .token.operator,
.prose-paper pre .token.punctuation { color: #71685f; }

/* Existing semantic callouts: paper cards with a stronger left indicator. */
.prose-paper .paper-callout {
  border-left: 5px solid var(--callout-accent);
  border-radius: 4px 8px 8px 4px;
  box-shadow: 0 3px 10px rgba(78, 61, 43, .045);
}

.dark .prose-paper {
  --prose-ink: #d8cfc2;
  --prose-muted: #a99d90;
  --prose-line: #554b3f;
  --prose-soft: #332d26;
  --prose-code: #29251f;
}
.dark .prose-paper h1,
.dark .prose-paper h2,
.dark .prose-paper h3,
.dark .prose-paper h4 { color: #eee5d9; }
.dark .prose-paper :not(pre) > code { background: #342c23; border-color: #5f4936; color: #e5aa78; }
.dark .prose-paper table { background: #302b25; border-color: #554b3f; }
.dark .prose-paper thead th { background: #3b342b; color: #e7ded2; }
.dark .prose-paper th,
.dark .prose-paper td { border-color: #554b3f; }
.dark .prose-paper tbody tr:nth-child(even) td { background: rgba(73, 63, 52, .24); }
.dark .prose-paper blockquote { background: #342d25; border-color: #504538; border-left-color: var(--prose-orange); color: #cfc4b7; }
.dark .prose-paper .code-block-wrapper { background: #29251f; border-color: #aaa092; }
.dark .code-header { background: #332d26; border-color: #aaa092; }
.dark .code-language { color: #b8aa9b; }
.dark .prose-paper .code-block-wrapper pre.code-body { background: #29251f; color: #d9d0c4; scrollbar-color: #665c50 transparent; }
.dark .prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar-track { background: #29251f; }
.dark .prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar-thumb { background: #665c50; }
.dark .prose-paper .code-block-wrapper pre.code-body::-webkit-scrollbar-thumb:hover { background: #817568; }
.dark .prose-paper .code-block-wrapper .code-line::before { color: #7f756b; border-color: #4b4339; }
.dark .copy-code,
.dark .collapse-code { background: #3a332b; border-color: #5b5044; color: #cfc4b6; }

@media (max-width: 640px) {
  .prose-paper { font-size: .96rem; line-height: 1.82; }
  .prose-paper h2 { font-size: 1.28rem; }
  .prose-paper h3 { font-size: 1.13rem; }
  .prose-paper h4 { font-size: 1rem; }
  .prose-paper table { display: block; overflow-x: auto; white-space: nowrap; }
  .prose-paper th,
  .prose-paper td { padding: 9px 11px; }
  .prose-paper .code-block-wrapper pre.code-body { font-size: .78rem; }
  .code-header { padding-left: 12px; }
}

/* =========================================================
   Homepage hierarchy refinement v9
   Compact pin board + merged taxonomy sidebar
   ========================================================= */
.home-grid > aside { gap: 16px; }
.home-grid > aside .sidebar-card { margin-bottom: 0; }

.taxonomy-card { padding-bottom: 20px; }
.taxonomy-block + .taxonomy-block { margin-top: 18px; padding-top: 17px; border-top: 1px dashed var(--line-strong); }
.taxonomy-label { margin-bottom: 7px; color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .14em; }
.taxonomy-categories .category-link { padding: 9px 0; font-size: .86rem; }
.taxonomy-tags-block { scroll-margin-top: 110px; }

.pinned-section { margin-bottom: 22px; }
.pinned-board { position: relative; padding: 23px 25px 10px; overflow: visible; border-radius: 10px; }
.pinned-board::before { width: 72px; height: 18px; top: -10px; left: 52%; transform: translateX(-50%) rotate(1.5deg); }
.pinned-board-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 1px 2px 15px; border-bottom: 1px solid #f0ebe1; }
.pinned-board-eyebrow { margin-bottom: 4px; color: #b88b4d; font-size: .62rem; font-weight: 800; letter-spacing: .2em; }
.pinned-board-title { font-family: "Noto Serif SC", serif; color: var(--ink); font-size: 1.08rem; font-weight: 800; }
.pinned-board-title span { color: var(--muted); font-size: .75rem; font-weight: 600; }
.pinned-board-mark { color: #d8aa69; font-size: 1.05rem; }
.pinned-list { display: block; }
.pinned-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 18px; align-items: center; padding: 17px 2px 16px; border-bottom: 1px dashed #f0ebe1; transition: background .2s ease; }
.pinned-row:last-child { border-bottom: 0; }
.pinned-row:hover { background: rgba(255,249,239,.56); }
.pinned-row-main { min-width: 0; }
.pinned-kicker { min-height: 0; margin-bottom: 7px; }
.pinned-title { margin: 0; font: 800 clamp(1rem,1.35vw,1.125rem)/1.5 "Noto Serif SC",serif; color: var(--ink); }
.pinned-title a { transition: color .18s ease; }
.pinned-title a:hover { color: var(--accent); }
.pinned-meta { margin-top: 7px; gap: 5px 11px; font-size: .66rem; }
.pinned-read { position: static; align-self: end; margin-bottom: 1px; white-space: nowrap; color: var(--accent); font-size: .74rem; font-weight: 700; transition: transform .18s ease, color .18s ease; }
.pinned-row:hover .pinned-read { transform: translateX(2px); color: #b96518; }

.post-card { padding: 16px 20px; transition: all .2s ease; }
.post-card:nth-child(even) { transform: none; }
.post-card:hover,
.post-card:nth-child(even):hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(73,61,43,.12); }
.post-summary { margin-top: 8px; }
.post-meta { margin-top: 12px; }

@media (max-width: 640px) {
  .pinned-board { padding: 21px 17px 8px; }
  .pinned-board::before { left: 50%; }
  .pinned-row { grid-template-columns: 1fr; gap: 9px; padding: 15px 1px 14px; }
  .pinned-read { justify-self: start; }
  .post-card { padding: 16px 17px; }
}

.dark .pinned-board-head,
.dark .pinned-row { border-color: rgba(215,195,165,.16); }
.dark .pinned-row:hover { background: rgba(255,255,255,.025); }

/* =========================================================
   Taxonomy filter page + dark paper polish v11
   ========================================================= */
.filter-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 16px;
  padding: 15px 18px;
  border-radius: 9px;
  box-shadow: 0 8px 24px rgba(73,61,43,.055);
}
.filter-heading { display: flex; align-items: center; gap: 12px; min-width: 0; }
.filter-icon {
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid #ead8c0;
  border-radius: 8px;
  background: #fff7eb;
  color: #c67a3b;
  font-size: .95rem;
  transform: rotate(-1deg);
}
.filter-eyebrow { margin-bottom: 2px; color: var(--accent); font-size: .58rem; font-weight: 800; letter-spacing: .18em; }
.filter-heading h2 { font: 800 1.02rem/1.45 "Noto Serif SC",serif; color: var(--ink); }
.filter-count { flex: 0 0 auto; color: var(--muted); font-size: .72rem; }

.category-link { margin: 2px -7px; padding: 9px 7px !important; border-radius: 7px; border-top-color: transparent; transition: color .18s ease, background .18s ease, transform .18s ease; }
.category-link + .category-link { border-top: 1px dashed var(--line-strong); }
.category-link:hover { background: rgba(250,240,230,.6); transform: translateX(2px); }
.category-link.is-active {
  color: #684c2f;
  background: #faf0e6;
  font-weight: 800;
  border-top-color: transparent;
  box-shadow: inset 0 0 0 1px rgba(225,181,126,.35);
}
.category-link.is-active + .category-link { border-top-color: transparent; }
.category-link.is-active .category-dot { background: #e59c5d; box-shadow: 0 0 0 3px rgba(229,156,93,.12); }
.category-arrow { color: #b7a796; transition: color .18s ease, transform .18s ease; }
.category-link:hover .category-arrow,
.category-link.is-active .category-arrow { color: #bf783e; transform: translateX(1px); }
.sidebar-tag.is-active {
  color: #674d32;
  background: #faf0e6;
  border-color: #dfbd94;
  font-weight: 700;
  transform: none;
}
.tag-strip.is-active { outline: 1px solid rgba(190,122,61,.45); outline-offset: 2px; }

/* Dark mode: remove bright paper flashes from small controls and taxonomy badges. */
.dark .paper-surface::after { background: rgba(255,255,255,.025); }
.dark .icon-button:hover,
.dark .btn-soft:hover,
.dark .nav-dropdown-menu a:hover { background: #3a342c; }
.dark .pill {
  background: #2f3b31;
  border-color: #49604d;
  color: #a8cbae;
}
.dark .tag-strip,
.dark .tag-strip:nth-child(3n+1),
.dark .tag-strip:nth-child(3n+2) {
  background: repeating-linear-gradient(45deg,#39404a 0 5px,#424a55 5px 9px);
  color: #b7c7d9;
}
.dark .tag-strip:nth-child(3n+1) { background: repeating-linear-gradient(45deg,#493f2e 0 5px,#554936 5px 9px); color:#d8c296; }
.dark .tag-strip:nth-child(3n+2) { background: repeating-linear-gradient(45deg,#33434d 0 5px,#3d4f5a 5px 9px); color:#b5d0df; }
.dark .sidebar-tag {
  background: #342f29;
  border-color: #5a5044;
  color: #bdb1a4;
}
.dark .sidebar-tag small { color: #908579; }
.dark .sidebar-tag:hover { background: #3a342c; color: #e0a06f; }
.dark .sidebar-tag.is-active {
  background: #463a2d;
  border-color: #785d42;
  color: #ebc79f;
}
.dark .author-categories a,
.dark .author-categories a:nth-child(4n+2),
.dark .author-categories a:nth-child(4n+3),
.dark .author-categories a:nth-child(4n) {
  background: #342f29;
  border-color: #554b3f;
  color: #bdb1a4;
}
.dark .author-categories a:hover { background: #40372d; border-color: #725a42; color: #e0a06f; }
.dark .category-link:hover { background: #383229; }
.dark .category-link.is-active {
  color: #eed6ba;
  background: #41372c;
  box-shadow: inset 0 0 0 1px rgba(203,151,94,.28);
}
.dark .category-link.is-active .category-dot { box-shadow: 0 0 0 3px rgba(229,156,93,.08); }
.dark .filter-header { box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.dark .filter-icon { background: #3d352b; border-color: #5f4c39; color: #e0a06f; }
.dark .pinned-board-head,
.dark .pinned-row { border-color: rgba(215,195,165,.16); }

@media (max-width: 640px) {
  .filter-header { align-items: flex-start; padding: 14px 15px; }
  .filter-icon { width: 30px; height: 30px; }
  .filter-count { padding-top: 4px; }
}
.dark .prose-paper img { border-color: #39332b; box-shadow: 0 10px 28px rgba(0,0,0,.22); }

/* =========================================================
   Mobile paper drawer navigation v12
   ========================================================= */
.drawer-lock { overflow: hidden; }
.mobile-menu-button {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px dashed #d8c9ae;
  border-radius: 5px;
  background: var(--sheet-soft);
  color: var(--ink);
  box-shadow: 0 3px 10px rgba(73,61,43,.035);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.mobile-menu-button span {
  display: block;
  width: 18px;
  height: 1.5px;
  border-radius: 99px;
  background: currentColor;
  transform-origin: center;
}
.mobile-menu-button:hover { transform: translateY(-1px) rotate(-1deg); background: #fff8ec; border-color: #cdbb9f; }
.mobile-drawer-layer { position: fixed; inset: 0; z-index: 120; }
.mobile-drawer-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(35,31,27,.38);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
.mobile-drawer {
  position: absolute;
  top: 0;
  right: 0;
  width: min(82vw, 320px);
  height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-left: 1px solid #e4dacb;
  background:
    linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(203,184,155,.055) 31px 32px),
    #fbf9f5;
  box-shadow: -18px 0 48px rgba(57,47,35,.16);
}
.drawer-topbar {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 15px 12px 19px;
  border-bottom: 1px dashed #dfd4c4;
  background: rgba(255,253,248,.82);
}
.drawer-topbar > div { display: grid; gap: 1px; }
.drawer-kicker { color: #b77c46; font-size: .56rem; font-weight: 800; letter-spacing: .19em; }
.drawer-topbar strong { font: 800 .98rem "Noto Serif SC", serif; color: #403a34; }
.drawer-close {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px dashed #d7c8b3;
  border-radius: 7px;
  background: #fffaf1;
  color: #6e6256;
  font-size: 1.25rem;
  line-height: 1;
  transition: transform .18s ease, background .18s ease;
}
.drawer-close:hover { transform: rotate(4deg); background: #fff3df; }
.drawer-scroll { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 15px 13px 24px; scrollbar-width: thin; scrollbar-color: #d2c5b3 transparent; }
.drawer-scroll::-webkit-scrollbar { width: 5px; }
.drawer-scroll::-webkit-scrollbar-track { background: transparent; }
.drawer-scroll::-webkit-scrollbar-thumb { background: #d2c5b3; border-radius: 99px; }
.drawer-card {
  position: relative;
  margin-bottom: 12px;
  padding: 15px;
  border: 1px solid #e7ded1;
  border-radius: 9px 11px 8px 10px;
  background: rgba(255,253,248,.94);
  box-shadow: 0 8px 22px rgba(75,62,45,.055);
}
.drawer-author-card { display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 10px 12px; padding-top: 20px; }
.drawer-author-card::before {
  content: "";
  position: absolute;
  top: 7px;
  right: 20px;
  width: 48px;
  height: 11px;
  opacity: .7;
  background: repeating-linear-gradient(45deg,#f0d071 0 5px,#fae6a9 5px 9px);
  clip-path: polygon(2% 6%,99% 0,96% 100%,0 93%);
  transform: rotate(2deg);
}
.drawer-avatar {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 4px solid #fff5e3;
  border-radius: 50%;
  background: linear-gradient(145deg,#e8c887,#f1dfbc);
  box-shadow: 0 6px 14px rgba(89,67,42,.11);
  color: #795837;
  font: 800 1.24rem "Noto Serif SC", serif;
  transform: rotate(-2deg);
}
.drawer-author-copy > span { color: var(--accent); font-size: .55rem; font-weight: 800; letter-spacing: .18em; }
.drawer-author-copy h2 { margin-top: 1px; color: var(--ink); font: 800 1rem/1.4 "Noto Serif SC", serif; }
.drawer-author-copy p { margin-top: 5px; color: var(--muted); font-size: .68rem; line-height: 1.65; }
.drawer-stats { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,1fr); padding: 10px 0 9px; border-top: 1px dashed var(--line-strong); border-bottom: 1px dashed var(--line-strong); text-align: center; }
.drawer-stats div + div { border-left: 1px solid var(--line); }
.drawer-stats strong { display: block; font: 800 .93rem "Noto Serif SC",serif; color: var(--ink); }
.drawer-stats span { display: block; margin-top: 1px; color: var(--muted); font-size: .6rem; }
.drawer-socials { grid-column: 1 / -1; display: flex; justify-content: center; gap: 7px; }
.drawer-socials span {
  min-width: 31px;
  height: 29px;
  padding: 0 5px;
  display: inline-grid;
  place-items: center;
  border: 1px dashed #d8cdbc;
  border-radius: 6px;
  background: #fffaf2;
  color: #978a7b;
  font-size: .58rem;
  font-weight: 800;
}
.drawer-nav-card { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.drawer-nav-card a,
.drawer-nav-card button {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #eee3d4;
  border-radius: 7px;
  background: #fffaf2;
  color: #655c53;
  text-align: left;
  transition: transform .18s ease, color .18s ease, background .18s ease;
}
.drawer-nav-card a:hover,
.drawer-nav-card button:hover { transform: translateY(-1px); background: #fff3e1; color: var(--accent); }
.drawer-nav-card span { width: 18px; text-align: center; color: #be8351; font-size: .8rem; }
.drawer-nav-card b { font-size: .72rem; font-weight: 700; }
.drawer-card-title { margin-bottom: 10px; color: var(--ink); font: 800 .84rem "Noto Serif SC",serif; }
.drawer-category-list { display: grid; }
.drawer-category-list a {
  display: grid;
  grid-template-columns: 9px minmax(0,1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 7px 3px;
  border-top: 1px dashed #eee4d6;
  color: var(--muted);
  font-size: .74rem;
}
.drawer-category-list a:first-child { border-top: 0; }
.drawer-category-list i { width: 8px; height: 8px; background: #e29a5c; transform: rotate(-8deg); }
.drawer-category-list a:nth-child(3n+2) i { background: #78ae88; }
.drawer-category-list a:nth-child(3n) i { background: #72a9d3; }
.drawer-category-list small { min-width: 25px; padding: 2px 6px; border-radius: 99px; background: #f6efe5; color: #a09689; text-align: center; font-size: .58rem; }
.drawer-category-list a:hover { color: var(--accent); }
.drawer-tag-cloud { display: flex; flex-wrap: wrap; gap: 7px; }
.drawer-tag-cloud a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 8px;
  border-radius: 4px;
  color: #6b775f;
  font-size: .67rem;
  background: repeating-linear-gradient(45deg,#d7ead7 0 5px,#edf5e9 5px 9px);
  transform: rotate(-.5deg);
}
.drawer-tag-cloud a:nth-child(3n+1) { color:#785f2f; background:repeating-linear-gradient(45deg,#f4dfa4 0 5px,#faedc4 5px 9px); }
.drawer-tag-cloud a:nth-child(3n+2) { color:#50687c; background:repeating-linear-gradient(45deg,#d0e2ef 0 5px,#e5eff6 5px 9px); }
.drawer-tag-cloud small { opacity: .72; font-size: .55rem; }

.dark .mobile-menu-button { background: #332f29; border-color: #5a5044; color: #ddd3c6; box-shadow: none; }
.dark .mobile-menu-button:hover { background: #3b352d; border-color: #6c5b48; }
.dark .mobile-drawer-backdrop { background: rgba(8,7,6,.58); }
.dark .mobile-drawer {
  border-left-color: #4a4237;
  background:
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(228,204,169,.025) 31px 32px),
    #28241f;
  box-shadow: -18px 0 48px rgba(0,0,0,.35);
}
.dark .drawer-topbar { background: rgba(45,40,34,.94); border-color: #50473c; }
.dark .drawer-topbar strong { color: #eee5da; }
.dark .drawer-close { background: #342f29; border-color: #5a5044; color: #d7ccbf; }
.dark .drawer-close:hover { background: #40382f; }
.dark .drawer-card { background: rgba(49,44,38,.96); border-color: #4e463b; box-shadow: 0 8px 22px rgba(0,0,0,.14); }
.dark .drawer-avatar { border-color: #3b342c; background: linear-gradient(145deg,#66543c,#816b49); color: #f1d9ae; }
.dark .drawer-socials span,
.dark .drawer-nav-card a,
.dark .drawer-nav-card button { background: #35302a; border-color: #554c41; color: #bfb3a5; }
.dark .drawer-nav-card a:hover,
.dark .drawer-nav-card button:hover { background: #40382f; color: #e0a06f; }
.dark .drawer-category-list a { border-color: #4b4339; }
.dark .drawer-category-list small { background: #3c362f; color: #9f9487; }
.dark .drawer-tag-cloud a { color:#afc5ae; background:repeating-linear-gradient(45deg,#334038 0 5px,#3a493f 5px 9px); }
.dark .drawer-tag-cloud a:nth-child(3n+1) { color:#d3bd8e; background:repeating-linear-gradient(45deg,#473e2d 0 5px,#514735 5px 9px); }
.dark .drawer-tag-cloud a:nth-child(3n+2) { color:#b3cad9; background:repeating-linear-gradient(45deg,#34434c 0 5px,#3c4d57 5px 9px); }

@media (max-width: 767px) {
  .site-header { padding-inline: 14px; }
  .site-header > div { height: 68px; }
  .brand { font-size: 1.18rem; }
  .detail-sidebar { display: none !important; }
  .flatpaper-detail { display: block; }
  .article-sheet { width: 100%; padding: 18px 13px 24px; }
  .article-header { margin-bottom: 24px; padding-bottom: 20px; }
  .article-title { font-size: 1.24rem; }
}

@media (max-width: 380px) {
  .mobile-drawer { width: min(88vw, 310px); }
  .drawer-card { padding: 13px; }
  .drawer-nav-card { grid-template-columns: 1fr; }
}

/* =========================================================
   Mobile + dark mode refinement v13
   ========================================================= */

/* Dark callouts: keep semantic accents, remove bright paper fills. */
.dark .prose-paper .paper-callout {
  filter: none;
  color: #e8e2d8;
  background: rgba(255,255,255,.045);
  border-color: rgba(226,214,196,.16);
  border-left-color: var(--callout-accent);
  box-shadow: 0 3px 12px rgba(0,0,0,.14);
}
.dark .prose-paper .paper-callout .callout-body,
.dark .prose-paper .paper-callout .callout-body p,
.dark .prose-paper .paper-callout .callout-body li { color: #e8e2d8; }
.dark .prose-paper .paper-callout .callout-title,
.dark .prose-paper details.paper-callout > summary { color: var(--callout-accent); }
.dark .prose-paper .callout-default { --callout-bg:#2b2925; --callout-border:#4e4941; --callout-accent:#aaa396; background:#2b2925; }
.dark .prose-paper .callout-primary { --callout-bg:#292833; --callout-border:#49465d; --callout-accent:#a79bea; background:#292833; }
.dark .prose-paper .callout-success { --callout-bg:#232b26; --callout-border:#3d5144; --callout-accent:#77b58a; background:#232b26; }
.dark .prose-paper .callout-info { --callout-bg:#232a30; --callout-border:#3c4d59; --callout-accent:#78b4dc; background:#232a30; }
.dark .prose-paper .callout-warning { --callout-bg:#302b22; --callout-border:#594b31; --callout-accent:#e8b64f; background:#302b22; }
.dark .prose-paper .callout-danger { --callout-bg:#302525; --callout-border:#594040; --callout-accent:#df7c7c; background:#302525; }

/* Mobile tables: occupy the available article width and scroll only when needed. */
@media (max-width: 767px) {
  .prose-paper table {
    display: table;
    width: max(100%, max-content);
    min-width: 100%;
    white-space: normal;
    overflow: visible;
    margin: 1.35rem 0;
  }
  .prose-paper { overflow-wrap: anywhere; }
  .prose-paper .table-scroll,
  .prose-paper .table-wrapper {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #d1c7b7 transparent;
  }
  .prose-paper th,
  .prose-paper td { min-width: 7.5rem; }

  /* Compact 48px mobile navbar. */
  .site-header { margin-top: 8px; padding: 0 12px; }
  .site-header > div { min-height: 48px; }
  .brand { font-size: 1.08rem !important; letter-spacing: .08em; }
  .mobile-menu-button { width: 34px; height: 34px; gap: 4px; }
  .mobile-menu-button span { width: 16px; }

  /* Drawer is intentionally dense on phones. */
  .drawer-topbar { min-height: 54px; padding: 9px 12px 9px 15px; }
  .drawer-close { width: 32px; height: 32px; }
  .drawer-scroll { padding: 10px 10px 18px; }
  .drawer-card { margin-bottom: 9px; padding: 12px; }
  .drawer-author-card { padding-top: 17px; }

  /* No tap-highlight block on pinned article titles. */
  .pinned-title a,
  .pinned-row a {
    -webkit-tap-highlight-color: transparent;
    background: transparent !important;
    outline: none;
  }
  .pinned-title a:active,
  .pinned-title a:focus,
  .pinned-title a:focus-visible { background: transparent !important; box-shadow: none; }
}

/* Drawer search replaces the old social-icon row. */
.drawer-search {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 5px 6px 5px 10px;
  border: 1px solid #e7dccd;
  border-radius: 8px;
  background: #fffaf2;
  color: #9a8e80;
}
.drawer-search input {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-size: .7rem;
}
.drawer-search input::placeholder { color: #aaa094; }
.drawer-search button {
  min-height: 28px;
  padding: 0 9px;
  border: 1px dashed #dccbb5;
  border-radius: 6px;
  background: #fff4e3;
  color: #a66735;
  font-size: .66rem;
  font-weight: 700;
}
.dark .drawer-search { background:#35302a; border-color:#554c41; color:#9f9487; }
.dark .drawer-search input { color:#e6ddd2; }
.dark .drawer-search input::placeholder { color:#887e72; }
.dark .drawer-search button { background:#40382f; border-color:#655746; color:#dca16f; }
.prose-paper .table-scroll {
  width: 100%;
  max-width: 100%;
  margin: 1.75rem 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #d1c7b7 transparent;
}
.prose-paper .table-scroll table { margin: 0; }
.prose-paper .table-scroll::-webkit-scrollbar { height: 5px; }
.prose-paper .table-scroll::-webkit-scrollbar-track { background: transparent; }
.prose-paper .table-scroll::-webkit-scrollbar-thumb { background: #d1c7b7; border-radius: 999px; }
.dark .prose-paper .table-scroll { scrollbar-color: #665c50 transparent; }
.dark .prose-paper .table-scroll::-webkit-scrollbar-thumb { background: #665c50; }

/* ===== 2026-08-21 Hero cover carousel ===== */
.hero-section{margin:0 0 26px}
.hero-carousel{position:relative;overflow:hidden;border-radius:16px;min-height:330px;background:linear-gradient(135deg,#fffdf9 0%,#fbf4e8 100%);box-shadow:0 16px 38px rgba(73,61,43,.10)}
.hero-track{position:relative;min-height:330px}
.hero-slide{display:none;grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);min-height:330px;overflow:hidden}
.hero-slide:first-child,.hero-slide.is-active{display:grid}
.hero-carousel.is-ready .hero-slide:not(.is-active){display:none}
.hero-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:34px 34px 32px 38px;z-index:2}
.hero-badge{align-self:flex-start;display:inline-flex;align-items:center;padding:7px 12px;border-radius:999px;background:#e8b76e;color:#61411f;font-size:.72rem;font-weight:800;letter-spacing:.04em;box-shadow:0 5px 14px rgba(172,113,45,.14)}
.hero-title{margin:17px 0 10px;max-width:760px;font:800 clamp(1.28rem,2vw,1.48rem)/1.48 "Noto Serif SC",serif;color:var(--ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.hero-title a{transition:color .2s ease}
.hero-title a:hover{color:var(--accent)}
.hero-summary{margin:0;max-width:720px;color:var(--muted);font-size:.86rem;line-height:1.85;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}
.hero-pill{display:inline-flex;align-items:center;min-height:29px;padding:5px 11px;border:1px solid #eadfce;border-radius:999px;background:rgba(255,253,249,.82);color:#806444;font-size:.7rem;font-weight:700;transition:transform .18s,background .18s}
.hero-pill:hover{transform:translateY(-1px);background:#fff8ed}
.hero-tag{color:#568071}
.hero-footer{display:flex;align-items:center;gap:18px;margin-top:22px;flex-wrap:wrap}
.hero-read{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:999px;background:#d78942;color:#fff;font-size:.77rem;font-weight:800;box-shadow:0 7px 16px rgba(180,101,24,.16);transition:transform .18s,box-shadow .18s}
.hero-read:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(180,101,24,.22)}
.hero-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:.68rem}
.hero-meta>*+*::before{content:"·";margin-right:10px;color:#c8b79e}
.hero-cover{position:relative;display:block;overflow:hidden;min-height:330px;background:#e8efe2}
.hero-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,253,249,.14),transparent 30%);pointer-events:none}
.hero-cover img{width:100%;height:100%;min-height:330px;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.hero-slide:hover .hero-cover img{transform:scale(1.045)}
.hero-cover-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:28px;background:linear-gradient(145deg,#e7efe1 0%,#d9e6d3 54%,#eadcc3 54%,#eadcc3 100%);overflow:hidden}
.hero-cover-placeholder::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(103,139,112,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(103,139,112,.08) 1px,transparent 1px);background-size:24px 24px}
.hero-cover-placeholder b,.hero-cover-placeholder small{position:relative;z-index:3;color:#59715d;letter-spacing:.18em}
.hero-cover-placeholder b{font:800 1.7rem/1 "Noto Serif SC",serif}
.hero-cover-placeholder small{margin-top:8px;font:600 .62rem/1.4 "Fira Code",monospace}
.paper-sheet{position:absolute;display:block;width:112px;height:138px;border-radius:8px;background:#fffaf0;border:1px solid rgba(117,95,61,.18);box-shadow:0 15px 28px rgba(70,70,50,.13)}
.paper-sheet::after{content:"";position:absolute;left:20px;right:16px;top:34px;height:2px;background:#dfb16f;box-shadow:0 16px 0 #d9dfd0,0 32px 0 #d9dfd0,0 48px 0 #d9dfd0}
.paper-sheet.one{right:26px;top:34px;transform:rotate(9deg)}
.paper-sheet.two{right:108px;top:84px;transform:rotate(-8deg);width:92px;height:114px;background:#f7f0df}
.paper-pencil{position:absolute;right:55px;bottom:48px;width:112px;height:14px;border-radius:10px;background:#d68a46;transform:rotate(-18deg);box-shadow:0 4px 10px rgba(80,50,20,.16)}
.hero-arrow{position:absolute;z-index:8;top:50%;width:38px;height:38px;margin-top:-19px;border:1px solid rgba(128,103,69,.2);border-radius:50%;background:rgba(255,253,249,.88);color:#745d45;font-size:1.55rem;line-height:1;box-shadow:0 7px 18px rgba(65,55,43,.11);backdrop-filter:blur(6px);transition:transform .18s,background .18s}
.hero-arrow:hover{transform:scale(1.06);background:#fff}
.hero-prev{left:11px}.hero-next{right:11px}
.hero-dots{position:absolute;z-index:8;left:50%;bottom:13px;display:flex;gap:7px;transform:translateX(-50%)}
.hero-dots button{width:7px;height:7px;padding:0;border:0;border-radius:999px;background:rgba(98,79,58,.25);transition:width .2s,background .2s}
.hero-dots button.is-active{width:24px;background:#d78942}
.hero-carousel[data-count="1"] .hero-arrow,.hero-carousel[data-count="1"] .hero-dots{display:none}

.latest-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:29px 2px 14px;padding:0 2px 10px;border-bottom:1px solid rgba(217,201,178,.46)}
.latest-heading{display:flex;align-items:center;gap:10px}
.latest-heading i{width:5px;height:25px;border-radius:999px;background:#68a77b;box-shadow:0 2px 6px rgba(76,131,91,.18)}
.latest-heading h2{font:800 1.08rem/1.2 "Noto Serif SC",serif;color:var(--ink)}
.latest-actions{display:flex;align-items:center;gap:9px}
.latest-filters,.view-switch{display:flex;align-items:center;padding:3px;border:1px solid #eee2d2;border-radius:10px;background:rgba(255,253,249,.76)}
.latest-filters a,.latest-filters button{padding:6px 10px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:.7rem;font-weight:700}
.latest-filters a.is-active{background:#edf6ec;color:#4f8261}
.latest-filters button:disabled{opacity:.52;cursor:not-allowed}
.view-switch button{width:30px;height:29px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:.95rem}
.view-switch button.is-active{background:#f5eadc;color:#b56d2e}
.post-list.is-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.post-list.is-grid .post-card{height:100%}

.dark .hero-carousel{background:linear-gradient(135deg,#302c25,#28251f);border-color:#544c40;box-shadow:0 18px 42px rgba(0,0,0,.24)}
.dark .hero-badge{background:#76582f;color:#f5dfbb}
.dark .hero-pill{background:rgba(255,255,255,.055);border-color:#5b5143;color:#d8cab5}
.dark .hero-tag{color:#9ec7b0}
.dark .hero-cover::after{background:linear-gradient(90deg,rgba(46,43,36,.08),transparent 35%)}
.dark .hero-cover-placeholder{background:linear-gradient(145deg,#324137 0%,#27362e 54%,#4b3e2e 54%,#4b3e2e 100%)}
.dark .hero-cover-placeholder b,.dark .hero-cover-placeholder small{color:#d9c9ab}
.dark .hero-arrow{background:rgba(45,41,34,.9);border-color:#665b4b;color:#e7dcc9}
.dark .hero-dots button{background:rgba(235,220,193,.25)}
.dark .hero-dots button.is-active{background:#d69a5f}
.dark .latest-toolbar{border-color:rgba(215,195,165,.16)}
.dark .latest-filters,.dark .view-switch{background:#2d2923;border-color:#51483c}
.dark .latest-filters a.is-active{background:#31443a;color:#b7ddc3}
.dark .view-switch button.is-active{background:#4a3828;color:#e0b27f}

@media (max-width:900px){
  .hero-slide{grid-template-columns:1fr;min-height:0}
  .hero-copy{padding:28px 25px 25px}
  .hero-cover{min-height:220px;order:-1}
  .hero-cover img{min-height:220px;max-height:260px}
  .hero-cover-placeholder{min-height:220px}
  .hero-track{min-height:0}
}
@media (max-width:640px){
  .hero-section{margin-bottom:19px}
  .hero-carousel{border-radius:12px;min-height:0}
  .hero-copy{padding:21px 18px 28px}
  .hero-cover{min-height:184px}
  .hero-cover img{min-height:184px;max-height:210px}
  .hero-title{margin-top:13px;font-size:1.18rem;line-height:1.5}
  .hero-summary{-webkit-line-clamp:2;font-size:.78rem;line-height:1.7}
  .hero-tags{margin-top:13px;gap:6px}
  .hero-pill{min-height:26px;padding:4px 9px;font-size:.65rem}
  .hero-footer{margin-top:16px;gap:12px}
  .hero-meta{gap:7px;font-size:.62rem}
  .hero-meta>*+*::before{margin-right:7px}
  .hero-arrow{width:33px;height:33px;margin-top:-16px;font-size:1.35rem}
  .hero-prev{left:7px}.hero-next{right:7px}
  .latest-toolbar{align-items:flex-start;flex-direction:column;margin-top:21px;gap:10px}
  .latest-actions{width:100%;justify-content:space-between}
  .latest-filters a,.latest-filters button{padding:5px 8px;font-size:.66rem}
  .post-list.is-grid{grid-template-columns:1fr}
}

/* =========================================================
   Mobile density refinement v15
   ========================================================= */

/* Slimmer code toolbar: keep actions compact and vertically centered. */
.code-header {
  min-height: 30px;
  padding: 3px 7px 3px 12px;
  gap: 8px;
}
.code-language {
  font-size: .62rem;
  line-height: 1;
}
.code-tools { gap: 4px; }
.copy-code,
.collapse-code {
  min-width: 26px;
  width: 26px;
  height: 24px;
  padding: 0;
  border-radius: 5px;
  font-size: .72rem;
  line-height: 1;
}
.copy-code { font-family: "Fira Code", Consolas, monospace; }

@media (max-width: 767px) {
  /* Truly compact mobile navbar. Earlier height declarations are overridden. */
  .site-header {
    margin-top: 6px;
    padding-inline: 10px;
  }
  .site-header > div {
    height: 44px !important;
    min-height: 44px !important;
  }
  .brand {
    font-size: 1.03rem !important;
    line-height: 1;
    letter-spacing: .075em;
  }
  .mobile-menu-button {
    width: 30px;
    height: 30px;
    padding: 0;
    gap: 3px;
    border-radius: 5px;
  }
  .mobile-menu-button span {
    width: 15px;
    height: 1.5px;
  }

  /* Phone article cards: h4-like titles instead of desktop h2/h3 scale. */
  .post-card-title {
    font-size: 1rem;
    line-height: 1.42;
    font-weight: 700;
    letter-spacing: -.015em;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .post-card { padding: 16px 15px; }
  .post-summary { margin-top: 7px; font-size: .78rem; line-height: 1.65; }
  .post-meta { margin-top: 10px; font-size: .68rem; }

  /* Hero becomes a compact 65/35 horizontal card on phones. */
  .hero-section { margin-bottom: 14px; }
  .hero-carousel,
  .hero-track,
  .hero-slide {
    min-height: 112px;
    max-height: 118px;
  }
  .hero-carousel { border-radius: 10px; }
  .hero-slide,
  .hero-slide:first-child,
  .hero-slide.is-active {
    grid-template-columns: minmax(0, 65%) minmax(0, 35%);
    grid-template-rows: 112px;
  }
  .hero-copy {
    order: 0;
    justify-content: center;
    padding: 10px 9px 10px 13px;
    overflow: hidden;
  }
  .hero-badge {
    padding: 3px 7px;
    font-size: .57rem;
    line-height: 1.25;
    box-shadow: none;
  }
  .hero-title {
    margin: 6px 0 4px;
    font-size: .96rem;
    line-height: 1.35;
    -webkit-line-clamp: 2;
  }
  .hero-summary,
  .hero-tags,
  .hero-read { display: none !important; }
  .hero-footer { margin-top: 0; min-height: 14px; }
  .hero-meta {
    gap: 0;
    font-size: .57rem;
    line-height: 1;
  }
  .hero-meta > span { display: none; }
  .hero-meta > time { display: inline; }
  .hero-meta > * + *::before { display: none; }
  .hero-cover {
    order: 1;
    min-height: 112px;
    height: 112px;
    border-left: 1px solid rgba(180,160,130,.16);
  }
  .hero-cover img {
    min-height: 112px;
    max-height: 112px;
    height: 112px;
    object-fit: cover;
  }
  .hero-cover-placeholder {
    min-height: 112px;
    padding: 9px;
    justify-content: flex-end;
  }
  .hero-cover-placeholder b { font-size: .82rem; }
  .hero-cover-placeholder small,
  .hero-cover-placeholder .paper-sheet,
  .hero-cover-placeholder .paper-pencil { display: none; }
  .hero-arrow {
    width: 25px;
    height: 25px;
    margin-top: -12px;
    font-size: 1rem;
    opacity: .86;
  }
  .hero-prev { left: 4px; }
  .hero-next { right: 4px; }
  .hero-dots {
    bottom: 4px;
    gap: 4px;
  }
  .hero-dots button { width: 5px; height: 5px; }
  .hero-dots button.is-active { width: 14px; }

  /* Keep code actions small on narrow screens as well. */
  .code-header { min-height: 29px; padding: 2px 5px 2px 10px; }
  .copy-code,
  .collapse-code { width: 25px; min-width: 25px; height: 24px; font-size: .68rem; }
}

/* =========================================================
   Detail polish + mobile compactness v16
   ========================================================= */

/* Code toolbar actions: icon-only, no boxed controls. */
.code-tools { gap: 8px; align-items: center; }
.copy-code,
.collapse-code {
  width: 20px;
  min-width: 20px;
  height: 20px;
  padding: 0;
  border: 0 !important;
  border-radius: 4px;
  background: transparent !important;
  box-shadow: none !important;
  color: #756e64;
  display: inline-grid;
  place-items: center;
  transition: color .16s ease, background-color .16s ease;
}
.copy-code:hover,
.collapse-code:hover {
  color: #3f3a33;
  background: rgba(93,82,68,.07) !important;
}
.dark .copy-code,
.dark .collapse-code { color: #aaa092; background: transparent !important; }
.dark .copy-code:hover,
.dark .collapse-code:hover { color: #efe6d8; background: rgba(255,255,255,.055) !important; }

/* Hero navigation is dot/swipe driven only; side arrows are intentionally removed. */
.hero-arrow { display: none !important; }
.hero-carousel[data-count="1"] .hero-dots { display: none; }

@media (max-width: 767px) {
  /* Pull the article closer to the compact navbar. */
  .detail-main {
    padding-top: 10px !important;
    padding-bottom: 24px !important;
  }
  .detail-layout { gap: 0; }
  .article-sheet { padding-top: 14px; }

  /* Taxonomy chips become small stationery labels instead of pills. */
  .article-taxonomy {
    gap: 5px;
    margin-bottom: 10px;
  }
  .article-taxonomy .pill,
  .article-taxonomy .tag-strip {
    min-height: 23px;
    padding: 2px 7px;
    border-radius: 4px !important;
    font-size: .66rem;
    line-height: 1.25;
    transform: none;
  }
  .article-taxonomy .tag-strip { border: 1px solid rgba(102,130,151,.12); }

  /* Keep the useful metadata and drop the redundant aggregate tag count. */
  .article-meta .meta-tag-count { display: none !important; }
  .article-meta { margin-top: 10px; gap: 5px 9px; }

  /* Denser mobile tables; fill available width without oversized columns. */
  .prose-paper .table-scroll,
  .prose-paper .table-wrapper { margin: 1.05rem 0; }
  .prose-paper table {
    width: 100%;
    min-width: 100%;
    table-layout: auto;
    margin: 0;
  }
  .prose-paper th,
  .prose-paper td {
    min-width: 0;
    padding: 7px 8px;
    font-size: .78rem;
    line-height: 1.45;
  }

  /* Drawer navigation is always a true 2 x 2 grid, including very small phones. */
  .drawer-nav-card {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px;
  }
  .drawer-nav-card a,
  .drawer-nav-card button {
    min-height: 42px;
    padding: 8px 9px;
    border-radius: 7px;
    justify-content: flex-start;
  }

  /* Keep the code toolbar very thin after removing button chrome. */
  .code-header { min-height: 28px; padding: 2px 9px 2px 10px; }
  .copy-code,
  .collapse-code { width: 20px; min-width: 20px; height: 20px; font-size: .67rem; }
}

@media (max-width: 380px) {
  .drawer-nav-card { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .drawer-nav-card a,
  .drawer-nav-card button { padding-inline: 7px; }
}

/* =========================================================
   Admin editor: Flatpaper Vditor polish + single-layer code editing v17
   ========================================================= */

/* Keep the admin editor visually aligned with the public paper theme. */
.editor-page {
  background: var(--paper);
  color: var(--ink);
}
.editor-page > header {
  background: rgba(255,253,249,.94) !important;
  border-color: #e9dfd1 !important;
  backdrop-filter: blur(10px);
}
.editor-page .field {
  background: #fffdf9;
  border-color: #e5dac8;
  color: #463f36;
}
.editor-page .field::placeholder { color:#aaa092; }
.editor-page .field:focus {
  border-color: #c59a70;
  box-shadow: 0 0 0 3px rgba(197,154,112,.11);
}
.editor-page aside > div {
  background: #fffdf9 !important;
  border-color: #e5dac8 !important;
}

/* Vditor gets one paper card; source and preview are two explicit panes.
   Using SV mode avoids the IR/WYSIWYG layered code-block editing artifact. */
.flatpaper-editor-shell {
  overflow: hidden;
  border: 1px solid #e5dac8;
  border-radius: 11px;
  background: #fffdf9;
  box-shadow: 0 10px 28px rgba(82,61,38,.055);
}
.flatpaper-editor-shell #vditor,
.flatpaper-editor-shell .vditor {
  border: 0 !important;
  border-radius: 0 !important;
  background: #fffdf9 !important;
  box-shadow: none !important;
}

/* Warm stationery toolbar instead of the stock cool gray/blue chrome. */
.editor-page .vditor-toolbar {
  min-height: 42px;
  padding: 5px 7px !important;
  border: 0 !important;
  border-bottom: 1px solid #eae1d3 !important;
  background: #f5efe6 !important;
}
.editor-page .vditor-toolbar__item { margin: 1px 0; }
.editor-page .vditor-toolbar__item button,
.editor-page .vditor-toolbar__item .vditor-tooltipped {
  color: #5c5549 !important;
  border-radius: 5px !important;
}
.editor-page .vditor-toolbar__item button:hover,
.editor-page .vditor-toolbar__item button:focus,
.editor-page .vditor-toolbar__item button.vditor-menu--current {
  background: #ebe0d1 !important;
  color: #9b6537 !important;
}
.editor-page .vditor-toolbar__item svg { color: currentColor !important; }
.editor-page .vditor-toolbar__divider { border-color: #ded3c4 !important; }

/* Explicit split source / preview layout. No preview layer is allowed to sit on
   top of the editable Markdown source, which fixes code block "ghosting". */
.editor-page .vditor-content {
  background: #fffdf9 !important;
}
.editor-page .vditor-sv,
.editor-page .vditor-preview {
  background: #fffdf9 !important;
  color: #494238 !important;
}
.editor-page .vditor-sv {
  border-right: 1px solid #eae1d3 !important;
  font-family: "Fira Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace !important;
  font-size: 14px !important;
  line-height: 1.72 !important;
  caret-color: #a56736;
}
.editor-page .vditor-sv .vditor-reset,
.editor-page .vditor-sv pre,
.editor-page .vditor-sv code,
.editor-page .vditor-preview pre,
.editor-page .vditor-preview code {
  font-family: "Fira Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace !important;
  line-height: 1.68 !important;
}
.editor-page .vditor-preview .vditor-reset {
  padding: 20px 22px !important;
  color: #494238 !important;
  line-height: 1.8;
}
.editor-page .vditor-preview .vditor-reset pre {
  overflow: auto;
  margin: 1rem 0;
  padding: 14px 16px;
  border: 1px solid #d9cbbb;
  border-radius: 7px;
  background: #faf5eb !important;
  color: #39342e;
  box-shadow: none;
}
.editor-page .vditor-preview .vditor-reset :not(pre) > code {
  padding: 1px 5px;
  border: 1px solid #edd6bc;
  border-radius: 3px;
  background: #fbf3e8;
  color: #a35d2c;
}
.editor-page .vditor-preview .vditor-reset blockquote {
  border-left: 4px solid #e5a869;
  background: #fbf5eb;
  color: #655d52;
}
.editor-page .vditor-preview .vditor-reset table {
  border-color: #e7dccd;
  background: #fffdf9;
}
.editor-page .vditor-preview .vditor-reset th {
  background: #f7efe4;
  color: #4e463c;
}
.editor-page .vditor-preview .vditor-reset th,
.editor-page .vditor-preview .vditor-reset td { border-color:#e7dccd; }

/* Popovers / tooltips follow the same warm paper palette. */
.editor-page .vditor-panel,
.editor-page .vditor-hint,
.editor-page .vditor-toolbar__item .vditor-menu {
  border-color: #e1d5c5 !important;
  background: #fffaf2 !important;
  color: #554d42 !important;
  box-shadow: 0 10px 28px rgba(64,48,33,.12) !important;
}
.editor-page .vditor-hint button:hover,
.editor-page .vditor-panel button:hover { background:#f1e7d9 !important; }
.editor-page .vditor-resize { background:#eee5d9 !important; }

/* Callout insert palette: same stationery background, smaller low-chrome chips. */
.editor-page .callout-insert-panel {
  margin: 2px 0 14px;
  padding: 10px 12px;
  border-color: #e5dac8;
  border-radius: 9px;
  background: #faf6ee;
  box-shadow: none;
}
.editor-page .callout-insert-head { margin-bottom: 8px; color:#51483d; }
.editor-page .callout-insert-grid { gap: 6px; }
.editor-page .callout-insert-item {
  min-height: 30px;
  padding: 4px 8px;
  border-radius: 5px;
  box-shadow: none;
}
.editor-page .callout-insert-item:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(73,57,42,.06);
}
.editor-page .callout-insert-item i { width:17px; height:17px; font-size:.62rem; }

/* Dark admin/editor palette. It follows the same localStorage theme used by the site. */
.dark .editor-page,
.dark .editor-page .vditor-content,
.dark .editor-page .vditor-sv,
.dark .editor-page .vditor-preview,
.dark .flatpaper-editor-shell,
.dark .flatpaper-editor-shell #vditor,
.dark .flatpaper-editor-shell .vditor {
  background: #1f2120 !important;
  color: #e5dfd6 !important;
}
.dark .editor-page > header {
  background: rgba(31,33,32,.95) !important;
  border-color: #403c36 !important;
}
.dark .editor-page .field,
.dark .editor-page aside > div {
  background: #262724 !important;
  border-color: #45413a !important;
  color: #ece5da !important;
}
.dark .editor-page .field::placeholder { color:#817a70; }
.dark .editor-page .vditor-toolbar {
  background: #282825 !important;
  border-bottom-color: #464139 !important;
}
.dark .editor-page .vditor-toolbar__item button,
.dark .editor-page .vditor-toolbar__item .vditor-tooltipped { color:#c9c0b4 !important; }
.dark .editor-page .vditor-toolbar__item button:hover,
.dark .editor-page .vditor-toolbar__item button:focus,
.dark .editor-page .vditor-toolbar__item button.vditor-menu--current {
  background:#37342f !important;
  color:#e0a06f !important;
}
.dark .editor-page .vditor-toolbar__divider,
.dark .editor-page .vditor-sv { border-color:#45413a !important; }
.dark .editor-page .vditor-sv { caret-color:#e0a06f; }
.dark .editor-page .vditor-preview .vditor-reset { color:#e0d9cf !important; }
.dark .editor-page .vditor-preview .vditor-reset pre {
  background:#272823 !important;
  border-color:#4b473f;
  color:#e7dfd3;
}
.dark .editor-page .vditor-preview .vditor-reset :not(pre) > code {
  background:#332b23;
  border-color:#604a38;
  color:#e6aa77;
}
.dark .editor-page .vditor-preview .vditor-reset blockquote {
  background:#292823;
  color:#d4ccc0;
}
.dark .editor-page .vditor-preview .vditor-reset table { background:#242522; border-color:#49453e; }
.dark .editor-page .vditor-preview .vditor-reset th { background:#302e29; color:#e7dfd4; }
.dark .editor-page .vditor-preview .vditor-reset th,
.dark .editor-page .vditor-preview .vditor-reset td { border-color:#49453e; }
.dark .editor-page .callout-insert-panel { background:#282825; border-color:#45413a; }
.dark .editor-page .callout-insert-head { color:#e5ddd1; }
.dark .editor-page .callout-insert-head small { color:#91887c; }
.dark .editor-page .vditor-panel,
.dark .editor-page .vditor-hint,
.dark .editor-page .vditor-toolbar__item .vditor-menu {
  background:#2b2b27 !important;
  border-color:#49453d !important;
  color:#ddd5ca !important;
}
.dark .editor-page .vditor-resize { background:#3c3933 !important; }

@media (max-width: 767px) {
  .editor-page main { padding-top: 20px; }
  .editor-page .vditor-content { min-height: 520px; }
  .editor-page .vditor-sv { border-right: 0 !important; }
  .editor-page .vditor-preview { display:none !important; }
  .editor-page .callout-insert-grid { gap:5px; }
}

/* =========================================================
   Admin editor workspace width + clean preview chrome v18
   ========================================================= */
.editor-page main,
.editor-page #post-form,
.editor-page .editor-workspace,
.editor-page .flatpaper-editor-shell,
.editor-page .flatpaper-editor-shell #vditor,
.editor-page .flatpaper-editor-shell .vditor {
  width: 100%;
  max-width: none;
}

/* Metadata/publish controls stay in the compact top row; the writing workspace
   starts below it and spans the entire form so its right edge aligns with the
   Save button / publish column. */
.editor-page .editor-workspace {
  margin-top: 22px;
}
.editor-page .editor-workspace .callout-insert-panel {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* Vditor SV preview should be content-only. Hide the device/platform action
   strip (Desktop / Tablet / Mobile / WeChat / Zhihu / refresh) even if a CDN
   build injects it despite preview.actions being empty. */
.editor-page .vditor-preview__action,
.editor-page .vditor-preview__actions,
.editor-page .vditor-preview-actions,
.editor-page .vditor-preview > .vditor-toolbar,
.editor-page .vditor-preview > [class*="preview__action"],
.editor-page .vditor-preview > [class*="preview-action"] {
  display: none !important;
}
.editor-page .vditor-preview {
  padding-top: 0 !important;
}
.editor-page .vditor-preview .vditor-reset {
  min-height: 100%;
}

@media (max-width: 1023px) {
  .editor-page .editor-workspace { margin-top: 18px; }
}

/* =========================================================
   Dark bootstrap + compact admin editor shell v20
   ========================================================= */
html {
  background-color: var(--paper, #f4f4f5);
}
html.dark {
  background-color: #09090b !important;
  color-scheme: dark;
}
html.dark body {
  background-color: #09090b;
}

.dark .editor-page .btn-primary,
html.dark .editor-page .btn-primary {
  background: #4e7a66 !important;
  border: 1px solid #678d7c !important;
  color: #f7f3ea !important;
  box-shadow: 0 7px 18px rgba(0,0,0,.16);
}
.dark .editor-page .btn-primary:hover,
html.dark .editor-page .btn-primary:hover {
  background: #5b8873 !important;
  color: #fffaf1 !important;
}
.dark .editor-page .btn-primary:focus-visible,
html.dark .editor-page .btn-primary:focus-visible {
  outline: 2px solid rgba(126,174,151,.5);
  outline-offset: 2px;
}

/* Round 19: 1100px editor shell with a compact 78/22 writing/publish split. */
.editor-page main {
  width: min(1100px, calc(100% - 32px));
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.editor-page #post-form {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
}
.editor-page .editor-meta-grid {
  grid-template-columns: minmax(0, 1fr) 250px !important;
  gap: 24px !important;
  align-items: start;
}
.editor-page .editor-workspace {
  width: 100% !important;
  max-width: none !important;
  margin: 20px 0 0 !important;
}
.editor-page .editor-workspace .callout-insert-panel,
.editor-page .editor-workspace .flatpaper-editor-shell,
.editor-page .editor-workspace .flatpaper-editor-shell #vditor,
.editor-page .editor-workspace .flatpaper-editor-shell .vditor {
  width: 100%;
  max-width: none;
}
.editor-page > header > div {
  width: min(1100px, calc(100% - 32px));
  max-width: 1100px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
@media (max-width: 900px) {
  .editor-page .editor-meta-grid {
    grid-template-columns: 1fr !important;
  }
  .editor-page main,
  .editor-page > header > div {
    width: calc(100% - 24px);
  }
}

/* Round 20: public Flatpaper pages + 1100px full editor workspace. */
.editor-page .editor-workspace {
  width: 1100px !important;
  max-width: 100% !important;
  margin: 22px auto 0 !important;
}
.editor-page .editor-workspace .callout-insert-panel,
.editor-page .editor-workspace .flatpaper-editor-shell,
.editor-page .editor-workspace .flatpaper-editor-shell #vditor,
.editor-page .editor-workspace .flatpaper-editor-shell .vditor {
  width: 100% !important;
  max-width: none !important;
}

.public-page-grid {
  display: grid;
  grid-template-columns: 260px minmax(0,1fr);
  gap: 24px;
  align-items: start;
}
.public-main-card {
  min-height: 560px;
  padding: 30px 32px 38px;
  overflow: hidden;
}
.public-page-head {
  padding-bottom: 20px;
  margin-bottom: 22px;
  border-bottom: 1px dashed var(--line);
}
.public-page-head h1,
.about-paper > h1 {
  margin: 0;
  font: 800 1.65rem/1.3 "Noto Serif SC", serif;
  color: var(--ink);
}
.public-page-head p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: .83rem;
}
.public-kicker {
  margin: 0 0 7px !important;
  color: var(--accent) !important;
  font: 700 .68rem/1 "Fira Code",monospace;
  letter-spacing: .18em;
}
.tag-wall {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 9px;
  align-items: flex-start;
}
.tag-wall-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid rgba(108,95,76,.09);
  border-radius: 5px;
  color: #425044;
  font-size: .82rem;
  font-weight: 700;
  box-shadow: 0 2px 5px rgba(70,58,42,.05);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  background-image: repeating-linear-gradient(45deg,rgba(255,255,255,.25) 0 5px,rgba(255,255,255,.04) 5px 10px);
}
.tag-wall-item small { opacity:.65; font:500 .66rem/1 "Fira Code",monospace; }
.tag-wall-item:hover { transform:translateY(-2px); box-shadow:0 6px 12px rgba(70,58,42,.1); filter:saturate(1.05); }
.tag-color-0{background-color:#dfeeda}.tag-color-1{background-color:#d9e8f5;color:#3d5870}.tag-color-2{background-color:#f7e8b8;color:#6e5a29}.tag-color-3{background-color:#f3d8d3;color:#704b47}.tag-color-4{background-color:#e5daf0;color:#57486c}.tag-color-5{background-color:#e7e7df;color:#57574e}

.archive-list { display:flex; flex-direction:column; }
.archive-row {
  display:grid;
  grid-template-columns: 112px minmax(0,1fr) 20px;
  align-items:center;
  gap: 18px;
  min-height: 58px;
  padding: 9px 7px;
  border-bottom: 1px dashed var(--line);
  border-radius: 5px;
  transition: background .18s ease, transform .18s ease;
}
.archive-row time { color:var(--muted); font:500 .74rem/1.4 "Fira Code",monospace; white-space:nowrap; }
.archive-row strong { color:var(--ink); font:700 .92rem/1.55 "Noto Serif SC",serif; }
.archive-row > span { color:var(--muted); font-size:1.15rem; text-align:right; }
.archive-row:hover { background:rgba(229,168,105,.08); transform:translateX(2px); }
.archive-row:hover strong { color:var(--accent-strong,#a8662c); }

.about-badge {
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 12px;
  margin-bottom:16px;
  border-radius:5px;
  background:#6e9e7c;
  color:#fffdf9;
  font-size:.72rem;
  font-weight:700;
}
.about-paper > h1 { padding-bottom:18px; border-bottom:1px dashed var(--line); }
.about-prose { margin-top:24px; }
.about-prose h2 { margin-top:30px; }
.comment-placeholder {
  margin-top:38px;
  padding:22px 0 4px;
  border-top:1px dashed var(--line);
}
.comment-placeholder h2 { margin:0 0 10px; font:800 1rem/1.4 "Noto Serif SC",serif; color:var(--ink); }

html.dark .tag-wall-item { border-color:rgba(238,225,198,.12); box-shadow:none; }
html.dark .tag-color-0{background-color:#31483a;color:#c9e4cf}html.dark .tag-color-1{background-color:#2d4250;color:#c8deec}html.dark .tag-color-2{background-color:#4b4028;color:#f1d79a}html.dark .tag-color-3{background-color:#4a3330;color:#efc1bb}html.dark .tag-color-4{background-color:#40364b;color:#ddcaed}html.dark .tag-color-5{background-color:#393936;color:#ddd8cd}
html.dark .archive-row:hover { background:rgba(229,168,105,.09); }

@media (max-width: 767px) {
  .public-page-grid { grid-template-columns:1fr; gap:0; }
  .public-sidebar { display:none; }
  .public-main-card { min-height:0; padding:20px 16px 26px; border-radius:10px; }
  .public-page-head { margin-bottom:16px; padding-bottom:15px; }
  .public-page-head h1,.about-paper>h1 { font-size:1.28rem; }
  .tag-wall { gap:8px 7px; }
  .tag-wall-item { min-height:32px; padding:6px 10px; font-size:.78rem; }
  .archive-row { grid-template-columns:84px minmax(0,1fr) 15px; gap:10px; min-height:52px; padding:8px 3px; }
  .archive-row time { font-size:.66rem; }
  .archive-row strong { font-size:.82rem; line-height:1.45; }
  .about-prose { margin-top:18px; }
}


/* Round 21: compact editor callout tools, flat primary nav, category hub, tighter desktop rhythm. */
.primary-nav .nav-link { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.primary-nav .nav-icon { display:inline-flex; width:14px; justify-content:center; color:var(--muted); font-size:.78rem; line-height:1; transition:color .18s ease,transform .18s ease; }
.primary-nav .nav-link:hover .nav-icon,
.primary-nav .nav-link.is-active .nav-icon { color:var(--accent); transform:translateY(-1px); }

.editor-page .editor-summary-tools { margin-top:12px; width:fit-content; max-width:100%; }
.editor-page .editor-summary-tools .callout-insert-panel { width:fit-content !important; max-width:min(720px,100%) !important; margin:0 !important; padding:9px 11px !important; }
.editor-page .editor-summary-tools .callout-insert-head { margin-bottom:6px; display:flex; gap:14px; align-items:center; }
.editor-page .editor-summary-tools .callout-insert-head small { white-space:nowrap; }
.editor-page .editor-summary-tools .callout-insert-grid { display:flex; flex-wrap:wrap; gap:5px; }
.editor-page .editor-summary-tools .callout-insert-item { min-height:28px; padding:4px 8px; }
.editor-page .editor-workspace { margin-top:16px !important; }

.toc-list { overflow-y:auto !important; overflow-x:hidden !important; max-width:100%; }
.toc-link { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.category-wall { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; align-items:stretch; }
.category-wall-item {
  min-width:0; min-height:84px; display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:center; gap:11px; padding:17px 16px;
  border:1px solid rgba(108,95,76,.1); border-radius:10px; background:#fbf4e8; box-shadow:0 2px 7px rgba(70,58,42,.04);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.category-wall-item i { width:9px; height:9px; border-radius:1px; background:#72aa80; transform:rotate(-8deg); }
.category-wall-item strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); font:800 .9rem/1.4 "Noto Serif SC",serif; }
.category-wall-item small { color:var(--muted); white-space:nowrap; font:500 .68rem/1 "Fira Code",monospace; }
.category-wall-item:hover { transform:translateY(-2px); box-shadow:0 7px 16px rgba(70,58,42,.09); background:#fff8ed; }
.category-wall-color-1 i{background:#69a8d5}.category-wall-color-2 i{background:#e89b5a}.category-wall-color-3 i{background:#9278dc}.category-wall-color-4 i{background:#d27988}.category-wall-color-5 i{background:#b7a264}
html.dark .category-wall-item { background:#302c26; border-color:#494238; box-shadow:none; }
html.dark .category-wall-item:hover { background:#383229; }

@media (max-width: 980px) { .category-wall { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 767px) {
  .category-wall { grid-template-columns:1fr 1fr; gap:9px; }
  .category-wall-item { min-height:62px; padding:11px 10px; grid-template-columns:9px minmax(0,1fr); gap:8px; }
  .category-wall-item small { grid-column:2; margin-top:-3px; font-size:.62rem; }
  .editor-page .editor-summary-tools { width:100%; }
  .editor-page .editor-summary-tools .callout-insert-panel { width:100% !important; }
  .editor-page .editor-summary-tools .callout-insert-head small { display:none; }
}


/* Round 22: TOC green active rail, roomier nav, category cards, syntax highlighting. */
.primary-nav {
  gap: 30px !important;
}
.primary-nav .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 9px !important;
  padding: 7px 2px;
  white-space: nowrap;
}
.primary-nav .nav-icon {
  width: 16px !important;
  flex: 0 0 16px;
  justify-content: center;
  margin-right: 1px;
  font-size: .82rem !important;
}

/* TOC: no fill block, only a short green stationery rail for the active heading. */
.toc-list {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
}
.toc-link {
  border-radius: 0 !important;
  background: transparent !important;
  font-size: .79rem;
  line-height: 1.48;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.toc-link:hover {
  background: transparent !important;
  color: #4f785f;
  transform: translateX(2px);
}
.toc-link.is-active {
  background: transparent !important;
  color: #3d7a5a !important;
  font-weight: 800;
}
.toc-link.is-active::before {
  left: 1px;
  top: 6px;
  bottom: 6px;
  width: 3px;
  border-radius: 8px;
  background: #4e8b6e !important;
  box-shadow: none !important;
}
.toc-h2 { padding-left: 14px; }
.toc-h3 { padding-left: 27px; font-size: .75rem; }
.toc-h4 { padding-left: 40px; font-size: .72rem; }
html.dark .toc-link:hover,
html.dark .toc-link.is-active {
  background: transparent !important;
}
html.dark .toc-link.is-active { color: #8fc3a1 !important; }
html.dark .toc-link.is-active::before { background: #78ad8a !important; }

/* Category hub: guaranteed card layout even without utility CSS. */
.category-wall {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.category-wall-item {
  min-height: 86px !important;
  display: grid !important;
  grid-template-columns: 12px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px !important;
  border: 1px solid #efe8dc !important;
  border-radius: 9px !important;
  background: #faf5eb !important;
  box-shadow: 0 2px 7px rgba(71, 58, 42, .035);
}
.category-wall-item i {
  width: 10px !important;
  height: 10px !important;
  border-radius: 1px;
}
.category-wall-item strong {
  font-size: .9rem !important;
  font-weight: 800 !important;
}
.category-wall-item small {
  font-size: .69rem !important;
  color: #9a9185 !important;
}
.category-wall-item:hover {
  transform: translateY(-2px);
  border-color: #decfbb !important;
  background: #fff9ef !important;
  box-shadow: 0 8px 18px rgba(71, 58, 42, .08);
}
.category-wall-color-0 i { background:#68a97d !important; }
.category-wall-color-1 i { background:#67a9d8 !important; }
.category-wall-color-2 i { background:#e69b55 !important; }
.category-wall-color-3 i { background:#947add !important; }
.category-wall-color-4 i { background:#d27b8b !important; }
.category-wall-color-5 i { background:#b6a160 !important; }
html.dark .category-wall-item {
  background: #302c26 !important;
  border-color: #4b4439 !important;
  box-shadow: none;
}
html.dark .category-wall-item:hover {
  background: #393329 !important;
  border-color: #655a4a !important;
}
html.dark .category-wall-item small { color:#aaa196 !important; }

/* highlight.js warm paper palette; line-number wrappers preserve token spans. */
.prose-paper pre code.hljs {
  display: block;
  padding: 0;
  background: transparent !important;
  color: #3d3a34;
}
.prose-paper pre .hljs-comment,
.prose-paper pre .hljs-quote { color:#9a9184; font-style:italic; }
.prose-paper pre .hljs-keyword,
.prose-paper pre .hljs-selector-tag,
.prose-paper pre .hljs-literal,
.prose-paper pre .hljs-doctag { color:#b55f4c; }
.prose-paper pre .hljs-string,
.prose-paper pre .hljs-regexp,
.prose-paper pre .hljs-addition,
.prose-paper pre .hljs-attribute { color:#627f5e; }
.prose-paper pre .hljs-number,
.prose-paper pre .hljs-built_in,
.prose-paper pre .hljs-builtin-name { color:#b47b43; }
.prose-paper pre .hljs-title,
.prose-paper pre .hljs-title.function_,
.prose-paper pre .hljs-function .hljs-title { color:#657aa1; }
.prose-paper pre .hljs-title.class_,
.prose-paper pre .hljs-type,
.prose-paper pre .hljs-class .hljs-title { color:#896a99; }
.prose-paper pre .hljs-variable,
.prose-paper pre .hljs-template-variable,
.prose-paper pre .hljs-params { color:#75634f; }
.prose-paper pre .hljs-selector-class,
.prose-paper pre .hljs-selector-id,
.prose-paper pre .hljs-selector-attr { color:#9b6f45; }
.prose-paper pre .hljs-meta,
.prose-paper pre .hljs-symbol,
.prose-paper pre .hljs-bullet { color:#9b7860; }
.prose-paper pre .hljs-deletion { color:#b75656; }
html.dark .prose-paper pre code.hljs { color:#e0dbcf; }
html.dark .prose-paper pre .hljs-comment,
html.dark .prose-paper pre .hljs-quote { color:#928a7d; }
html.dark .prose-paper pre .hljs-keyword,
html.dark .prose-paper pre .hljs-selector-tag,
html.dark .prose-paper pre .hljs-literal { color:#e08b75; }
html.dark .prose-paper pre .hljs-string,
html.dark .prose-paper pre .hljs-regexp,
html.dark .prose-paper pre .hljs-addition { color:#9cc18f; }
html.dark .prose-paper pre .hljs-number,
html.dark .prose-paper pre .hljs-built_in { color:#d9a367; }
html.dark .prose-paper pre .hljs-title,
html.dark .prose-paper pre .hljs-title.function_ { color:#9fb2db; }
html.dark .prose-paper pre .hljs-title.class_,
html.dark .prose-paper pre .hljs-type { color:#c1a2d0; }

@media (max-width: 980px) {
  .primary-nav { gap: 20px !important; }
  .category-wall { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 767px) {
  .category-wall { gap: 9px !important; }
  .category-wall-item {
    min-height: 66px !important;
    grid-template-columns: 9px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 11px 10px !important;
  }
  .category-wall-item small { grid-column: 2; margin-top: -3px; }
}

/* Round 23: article media components (audio playlist + MP4/HLS video). */
.media-editor-panel{
  margin-top:14px;padding:14px;border:1px solid #e7dccb;border-radius:10px;background:#fffaf2;box-shadow:0 3px 10px rgba(70,58,42,.035)
}
.media-editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.media-editor-head>div{display:flex;align-items:baseline;gap:10px;min-width:0}.media-editor-head strong{font-size:.9rem;color:#423c34}.media-editor-head small{font-size:.68rem;color:#948a7d}
.media-add-btn{border:1px dashed #d9c8af;background:#fff7e9;color:#8c653c;border-radius:6px;padding:6px 10px;font-size:.72rem;font-weight:700;white-space:nowrap;transition:.18s ease}
.media-add-btn:hover{transform:translateY(-1px);background:#f8ead6;border-color:#cdb28e}
.audio-track-editor-list{display:grid;gap:9px}.audio-track-editor-list.is-empty:before{content:'暂未添加歌曲。点击右上角“添加歌曲”创建播放列表。';display:block;padding:10px 12px;border:1px dashed #e5d9c7;border-radius:7px;color:#9b9285;font-size:.72rem}
.audio-track-editor{padding:11px;border:1px solid #eadfce;border-radius:8px;background:#fffdf9}.audio-track-editor-top{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;margin-bottom:9px}.audio-track-editor-top b{font:600 .68rem/1 'Fira Code',monospace;color:#a17a50}.audio-track-editor-top strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem}.audio-remove-btn{border:0;background:transparent;color:#b96e63;font-size:.68rem;padding:3px 5px}
.audio-track-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.audio-track-field{display:grid;gap:4px}.audio-track-field span{font-size:.65rem;color:#928779}.audio-track-field input{min-width:0;width:100%;height:34px;padding:0 9px;border:1px solid #e6dac8;border-radius:5px;background:#fffaf3;color:#4b453d;font-size:.72rem;outline:none}.audio-track-field input:focus{border-color:#d7ad76;box-shadow:0 0 0 2px rgba(215,173,118,.12)}
.audio-track-more{margin-top:8px}.audio-track-more summary{cursor:pointer;color:#917a60;font-size:.68rem;user-select:none}.audio-track-advanced{margin-top:8px}.audio-track-advanced .audio-track-field:last-child{grid-column:1/-1}
.media-video-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;padding-top:12px;border-top:1px dashed #e5d9c7}.media-editor-hint{margin-top:8px;font-size:.66rem;color:#9b9285}
html.dark .media-editor-panel{background:#292620;border-color:#4b4439;box-shadow:none}html.dark .media-editor-head strong{color:#e6dfd3}html.dark .media-editor-head small,html.dark .media-editor-hint,html.dark .audio-track-field span{color:#a99f92}html.dark .media-add-btn{background:#302b24;border-color:#5b4d3b;color:#d8b47d}html.dark .audio-track-editor{background:#26231e;border-color:#484138}html.dark .audio-track-editor-list.is-empty:before{border-color:#4d463c;color:#a99f92}html.dark .audio-track-field input{background:#211f1b;border-color:#494238;color:#e4ded3}
.media-upload-toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 8px}.media-upload-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;border:1px solid #d8d0c2;border-radius:9px;background:#fff;color:#554b3e;font-size:13px;font-weight:600;cursor:pointer;transition:.18s}.media-upload-btn:hover{border-color:#a98a61;color:#795b35}.media-upload-btn.is-folder{background:#f6efe3}.media-upload-queue{display:grid;gap:9px;margin:13px 0 18px}.media-upload-row{padding:11px 12px;border:1px solid #ddd5c8;border-radius:9px;background:#fff}.media-upload-row-head{display:flex;justify-content:space-between;gap:12px;font-size:13px}.media-upload-row-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-upload-row-head span{flex:none;color:#8a765e}.media-upload-progress{height:5px;margin:8px 0;background:#eee8df;border-radius:99px;overflow:hidden}.media-upload-progress i{display:block;width:0;height:100%;background:#96734c;transition:width .15s}.media-upload-row small{display:block;color:#958979;overflow-wrap:anywhere}.media-upload-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}.media-upload-actions:empty{display:none}.media-upload-actions button{padding:5px 9px;border:1px solid #d9d0c3;border-radius:7px;background:#faf8f3;color:#68543d;font-size:12px}.media-upload-row.is-done .media-upload-row-head span{color:#4d805b}.media-upload-row.is-done .media-upload-progress i{background:#64a273}.media-upload-row.is-error{border-color:#dba9a3}.media-upload-row.is-error .media-upload-row-head span,.media-upload-row.is-error small{color:#ad463b}html.dark .media-upload-btn,html.dark .media-upload-row{background:#24211d;border-color:#50483d;color:#ddd4c7}html.dark .media-upload-btn.is-folder{background:#302a22}html.dark .media-upload-progress{background:#3d3730}html.dark .media-upload-actions button{background:#302b24;border-color:#554b3f;color:#d8c5a9}

.paper-audio-player{margin:2px 0 26px;border:1px solid #ded4c6;border-radius:10px;background:#fffdfa;box-shadow:0 5px 18px rgba(67,55,39,.055);overflow:hidden}
.paper-audio-main{display:grid;grid-template-columns:118px minmax(0,1fr);gap:16px;padding:14px}.paper-audio-cover{position:relative;width:118px;height:118px;border:0;padding:0;border-radius:7px;overflow:hidden;background:linear-gradient(135deg,#efe2c9,#d9bf8c);box-shadow:0 3px 10px rgba(47,39,29,.13);cursor:pointer}.paper-audio-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.paper-audio-cover-fallback{position:absolute;inset:0;display:grid;place-items:center;font:700 2rem/1 Georgia,serif;color:#8d7147}.paper-audio-cover i{position:absolute;left:50%;top:50%;width:40px;height:40px;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:999px;background:rgba(32,29,24,.58);border:1px solid rgba(255,255,255,.72);color:#fff;font-style:normal;font-size:.92rem;backdrop-filter:blur(5px)}.paper-audio-player.is-playing .paper-audio-cover i{background:rgba(66,95,75,.72)}
.paper-audio-control{min-width:0;display:flex;flex-direction:column;justify-content:center}.paper-audio-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px}.paper-audio-heading>div:first-child{min-width:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.paper-audio-heading strong{font:800 1.12rem/1.4 'Noto Serif SC',serif;color:#332f29}.paper-audio-heading span{font-size:.75rem;color:#847b6f}.paper-audio-credits{font-size:.69rem;color:#7996a8;text-align:right;line-height:1.65}
.paper-audio-progress-row{display:grid;grid-template-columns:minmax(100px,1fr) auto 28px 28px 28px;align-items:center;gap:8px}.paper-audio-progress{appearance:none;width:100%;height:3px;background:#ddd7cf;border-radius:9px;outline:none}.paper-audio-progress::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#d59555;border:2px solid #fff;box-shadow:0 0 0 1px #c8b8a2}.paper-audio-progress::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#d59555;border:2px solid #fff}.paper-audio-progress-row>span{font:500 .67rem/1 'Fira Code',monospace;color:#9a9185;white-space:nowrap}.paper-audio-icon{width:28px;height:28px;border:0;background:transparent;color:#81796f;border-radius:5px;font-size:.83rem}.paper-audio-icon:hover{background:#f5eee4;color:#4f785f}.paper-audio-lyric{margin-top:8px;min-height:18px;color:#8b745d;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.paper-audio-playlist{border-top:1px solid #eee6dc;max-height:340px;overflow-y:auto;transition:max-height .22s ease}.paper-audio-playlist.is-collapsed{max-height:0;border-top-color:transparent}.paper-audio-track{position:relative;width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) minmax(80px,180px);gap:10px;align-items:center;border:0;border-bottom:1px solid #eee8df;background:transparent;padding:10px 15px;text-align:left;color:#70685f;transition:.16s ease}.paper-audio-track:last-child{border-bottom:0}.paper-audio-track:hover{background:#faf6ef}.paper-audio-track.is-active{background:#f2f4ef;color:#3d7658}.paper-audio-track.is-active:before{content:'';position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:4px;background:#5da376}.paper-audio-index{text-align:center;font:500 .72rem/1 'Fira Code',monospace;color:#9d9489}.paper-audio-track-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem}.paper-audio-track-artist{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;font-size:.75rem;color:#8b8378}
html.dark .paper-audio-player{background:#29261f;border-color:#4d463b;box-shadow:none}html.dark .paper-audio-heading strong{color:#eee7dc}html.dark .paper-audio-heading span,html.dark .paper-audio-progress-row>span,html.dark .paper-audio-index,html.dark .paper-audio-track-artist{color:#aaa195}html.dark .paper-audio-progress{background:#4c463d}html.dark .paper-audio-icon{color:#b7afa4}html.dark .paper-audio-icon:hover{background:#373129;color:#91c3a1}html.dark .paper-audio-playlist{border-top-color:#443e35}html.dark .paper-audio-track{border-bottom-color:#403a32;color:#d2cbc0}html.dark .paper-audio-track:hover{background:#312d27}html.dark .paper-audio-track.is-active{background:#29332c;color:#95c8a5}

.paper-video-shell{margin:4px 0 28px;padding:5px;border:1px solid #e1d7c9;border-radius:12px;background:#fffaf3;box-shadow:0 5px 18px rgba(67,55,39,.055)}.paper-video-player{width:100%;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#171717}.paper-video-player .art-video-player{border-radius:8px}.paper-video-player .art-progress-played{background:#d9944b!important}.paper-video-player .art-control-progress-inner{height:3px!important}
html.dark .paper-video-shell{background:#28251f;border-color:#4c453a;box-shadow:none}

@media(max-width:767px){.media-editor-head{align-items:flex-start}.media-editor-head>div{display:grid;gap:2px}.audio-track-editor-grid,.media-video-fields{grid-template-columns:1fr}.paper-audio-main{grid-template-columns:76px minmax(0,1fr);gap:11px;padding:11px}.paper-audio-cover{width:76px;height:76px}.paper-audio-cover i{width:32px;height:32px}.paper-audio-heading{margin-bottom:10px;gap:6px;display:block}.paper-audio-heading strong{font-size:.92rem}.paper-audio-credits{display:none}.paper-audio-progress-row{grid-template-columns:minmax(70px,1fr) auto 26px 26px 26px;gap:4px}.paper-audio-track{grid-template-columns:30px minmax(0,1fr) minmax(54px,90px);padding:9px 10px}.paper-audio-track-name{font-size:.76rem}.paper-audio-track-artist{font-size:.69rem}.paper-video-shell{padding:3px;margin-bottom:20px;border-radius:9px}.paper-video-player{border-radius:6px}}

/* 2026-08 compact media editor + cassette audio player */
.editor-publish-aside{align-self:start;position:sticky;top:24px}
.media-editor-panel{margin:0;border:1px solid #e3d8c7;border-radius:10px;background:#fffaf2;box-shadow:0 4px 14px rgba(67,55,39,.035);overflow:hidden}
.media-editor-summary{list-style:none;min-height:50px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:0 14px;cursor:pointer;user-select:none;color:#554b3f}
.media-editor-summary::-webkit-details-marker{display:none}.media-editor-summary span{font-size:.84rem;font-weight:700}.media-editor-summary small{font-size:.67rem;color:#9b9082}.media-editor-summary i{font-style:normal;color:#967754;transition:transform .18s ease}.media-editor-panel[open] .media-editor-summary i{transform:rotate(180deg)}
.media-editor-body{padding:0 14px 14px;border-top:1px dashed #e8dccb}.media-upload-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:11px 0 8px}.media-upload-btn{padding:6px 10px;border-radius:7px;font-size:.72rem}.media-upload-note{margin-left:auto;font-size:.64rem;color:#9b9285}.media-upload-queue{margin:8px 0 10px}.media-upload-row{padding:8px 10px}.media-upload-row-head{font-size:.72rem}.media-upload-progress{margin:6px 0}.media-upload-actions{margin-top:6px}
.media-tabs{display:flex;align-items:center;gap:5px;margin-top:10px;padding-bottom:8px;border-bottom:1px solid #eadfce}.media-tab{border:1px solid transparent;border-radius:7px;padding:6px 10px;background:transparent;color:#8a7f71;font-size:.72rem;font-weight:650}.media-tab:hover{background:#f7efe4;color:#664f34}.media-tab.is-active{border-color:#d9cab6;background:#fffdf9;color:#5e7d66;box-shadow:0 1px 3px rgba(68,54,36,.05)}.media-tab b{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:3px;padding:0 5px;border-radius:99px;background:#efe8dc;color:#88765e;font:600 .62rem/1 'Fira Code',monospace}
.media-tab-pane{padding-top:10px}.media-tab-pane[hidden]{display:none!important}.media-pane-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.media-pane-head>div{display:grid;gap:1px}.media-pane-head strong{font-size:.76rem;color:#665c50}.media-pane-head small{font-size:.63rem;color:#a0978b}.media-add-btn{padding:6px 9px;font-size:.68rem;border-radius:7px}.audio-track-editor-list{gap:7px}.audio-track-editor-list.is-empty:before{padding:9px 10px}.audio-track-editor{padding:9px}.audio-track-editor-top{margin-bottom:7px}.audio-track-editor-grid{gap:6px}.audio-track-field input{height:32px}.media-video-fields{margin-top:0;padding-top:0;border-top:0}.media-editor-hint{margin:7px 0 0}
html.dark .media-editor-summary{color:#e3dbcf}html.dark .media-editor-summary small,html.dark .media-upload-note,html.dark .media-pane-head small{color:#a89e91}html.dark .media-editor-body{border-top-color:#4c453b}html.dark .media-tabs{border-bottom-color:#484138}html.dark .media-tab{color:#aaa095}html.dark .media-tab:hover{background:#302b24;color:#ddd2c2}html.dark .media-tab.is-active{background:#302d27;border-color:#574d41;color:#93c3a2}html.dark .media-tab b{background:#3a342c;color:#b9aa97}html.dark .media-pane-head strong{color:#ddd5c9}

.paper-audio-player{margin:2px 0 22px;border-radius:11px;background:#fffdf8;box-shadow:0 5px 16px rgba(67,55,39,.05)}
.paper-audio-main{grid-template-columns:70px minmax(0,1fr);gap:13px;padding:12px 13px;min-height:94px}.paper-audio-cover{width:70px;height:70px;border-radius:9px;box-shadow:0 4px 12px rgba(47,39,29,.14)}.paper-audio-cover-fallback{font-size:1.45rem}.paper-audio-cover i{width:32px;height:32px;font-size:.78rem;background:rgba(37,33,28,.55)}
.paper-audio-control{justify-content:center;gap:8px}.paper-audio-info-row{min-width:0;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.paper-audio-copy{min-width:0}.paper-audio-title-line{min-width:0;display:flex;align-items:baseline;gap:8px}.paper-audio-title-line strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 15px/1.35 'Noto Serif SC',serif;color:#332f29}.paper-audio-title-line span{flex:none;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#958c81}.paper-audio-credits{margin-top:2px;min-height:13px;text-align:left;font-size:.62rem;line-height:1.3;color:#8aa095;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.paper-audio-time{flex:none;padding-top:2px;font:500 11px/1.2 'Fira Code','JetBrains Mono',monospace;color:#958d82;white-space:nowrap}
.paper-audio-control-row{display:grid;grid-template-columns:minmax(90px,1fr) auto;align-items:center;gap:9px}.paper-audio-actions{display:flex;align-items:center;gap:1px}.paper-audio-progress{height:3px;background:#ddd7cf}.paper-audio-progress::-webkit-slider-thumb{width:11px;height:11px;background:#4e8b6e;border:2px solid #fff;box-shadow:0 0 0 1px #b9aa92}.paper-audio-progress::-moz-range-thumb{width:9px;height:9px;background:#4e8b6e;border:2px solid #fff}.paper-audio-icon{width:25px;height:25px;border-radius:6px;font-size:.77rem}.paper-audio-icon:hover{background:#f2ecdf;color:#4e8b6e}.paper-audio-lyric{margin-top:-3px;min-height:0;font-size:.65rem;line-height:1.25;color:#8b745d}
.paper-audio-playlist{max-height:300px}.paper-audio-track{grid-template-columns:30px minmax(0,1fr) minmax(70px,150px);gap:8px;padding:8px 12px}.paper-audio-track.is-active{background:#f5f1e8;color:#3f7659}.paper-audio-track.is-active:before{top:5px;bottom:5px;width:3px;background:#4e8b6e}.paper-audio-index{font-size:.65rem;color:#aaa197}.paper-audio-track-name{font-size:.78rem}.paper-audio-track-artist{font-size:.7rem;color:#91897e}
html.dark .paper-audio-title-line strong{color:#eee7dc}html.dark .paper-audio-title-line span,html.dark .paper-audio-time{color:#aaa195}html.dark .paper-audio-track.is-active{background:#2c332d;color:#9ac8a8}

@media(max-width:1023px){.editor-publish-aside{position:static}}
@media(max-width:767px){.media-editor-summary{grid-template-columns:1fr auto}.media-editor-summary small{display:none}.media-upload-note{width:100%;margin-left:0}.media-pane-head small{display:none}.paper-audio-main{grid-template-columns:64px minmax(0,1fr);gap:10px;padding:10px;min-height:84px}.paper-audio-cover{width:64px;height:64px}.paper-audio-info-row{gap:8px}.paper-audio-title-line{display:grid;gap:1px}.paper-audio-title-line strong{font-size:13px}.paper-audio-title-line span{max-width:100%;font-size:11px}.paper-audio-credits{display:none}.paper-audio-time{font-size:9px}.paper-audio-control{gap:6px}.paper-audio-control-row{gap:5px}.paper-audio-icon{width:23px;height:23px}.paper-audio-track{grid-template-columns:25px minmax(0,1fr) minmax(52px,88px);padding:7px 9px}}

/* =========================================================
   Content management + list/grid view extension v2026.08.22
   ========================================================= */
.post-grid-cover{display:none}
.grid-author,.grid-category,.grid-views{display:none}
.post-pin-pill{background:#fff2d9;color:#9a5b22;border-color:#ead1a8}

.post-list.is-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.post-list.is-grid .post-card{display:flex;flex-direction:column;height:100%;padding:0;overflow:hidden;border-radius:15px;transform:none!important}
.post-list.is-grid .post-card:hover{transform:translateY(-3px)!important}
.post-list.is-grid .post-grid-cover{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:#eee8dc;border-bottom:1px solid var(--line)}
.post-list.is-grid .post-grid-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .42s ease}
.post-list.is-grid .post-card:hover .post-grid-cover img{transform:scale(1.05)}
.post-cover-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;overflow:hidden;background:linear-gradient(145deg,#e8efe5 0%,#dce9dc 55%,#eee1cc 55%,#eee1cc 100%);color:#74644e;font-family:"Noto Serif SC",serif}
.post-cover-placeholder::before,.post-cover-placeholder::after{content:"";position:absolute;width:92px;height:118px;border:1px solid rgba(121,103,76,.18);background:rgba(255,253,247,.76);box-shadow:0 8px 22px rgba(91,74,51,.08)}
.post-cover-placeholder::before{right:17%;top:16%;transform:rotate(8deg)}
.post-cover-placeholder::after{left:19%;bottom:10%;transform:rotate(-7deg)}
.post-cover-placeholder i{position:absolute;width:105px;height:12px;border-radius:999px;background:#cf8a4c;transform:rotate(-17deg);right:14%;bottom:22%;box-shadow:0 4px 10px rgba(80,50,20,.12)}
.post-cover-placeholder b,.post-cover-placeholder small{position:relative;z-index:2;letter-spacing:.15em}
.post-cover-placeholder b{font-size:.78rem}.post-cover-placeholder small{font-size:.58rem;opacity:.72}
.post-list.is-grid .post-card-body{display:flex;flex:1;flex-direction:column;padding:17px 18px 15px}
.post-list.is-grid .post-taxonomy{margin-bottom:8px!important}
.post-list.is-grid .post-card-title{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding-right:0!important;font-size:1.12rem;line-height:1.55}
.post-list.is-grid .post-summary{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:3.35em;margin:8px 0 13px;font-size:.74rem;line-height:1.68;color:var(--muted)}
.post-list.is-grid .post-summary-empty{opacity:.7}
.post-list.is-grid .post-meta{margin-top:auto;display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:.63rem;line-height:1.45;color:var(--muted)}
.post-list.is-grid .post-meta>*{white-space:nowrap}
.post-list.is-grid .grid-author,.post-list.is-grid .grid-category,.post-list.is-grid .grid-views{display:inline}
.post-list.is-grid .list-word-count,.post-list.is-grid .list-reading-time{display:none}
.post-list.is-grid .arrow-link{display:none}

.admin-check-col{width:48px;text-align:center}
.admin-checkbox{width:16px;height:16px;accent-color:#5e986e;cursor:pointer;vertical-align:middle}
.admin-batch-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px;padding:12px 14px;border:1px solid #d8e6d8;border-radius:12px;background:#f1f8ef;box-shadow:0 8px 22px rgba(77,112,79,.07)}
.admin-batch-bar[hidden]{display:none}
.admin-batch-bar>div{display:flex;align-items:baseline;gap:10px;min-width:0}
.admin-batch-bar strong{font-size:.82rem;color:#3f704d}.admin-batch-bar span{font-size:.7rem;color:var(--muted)}
.admin-danger-btn{border:1px solid #dfb2ac;border-radius:9px;background:#fff5f3;color:#b54135;padding:8px 12px;font-size:.75rem;font-weight:800;transition:.18s}
.admin-danger-btn:hover{background:#b94a3f;border-color:#b94a3f;color:#fff;transform:translateY(-1px)}
.admin-danger-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.admin-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}
.admin-modal[hidden]{display:none}
.admin-modal-backdrop{position:absolute;inset:0;background:rgba(39,33,27,.48);backdrop-filter:blur(3px)}
.admin-modal-card{position:relative;width:min(420px,100%);padding:25px;border:1px solid #e5d7c6;border-radius:16px;background:#fffdf8;box-shadow:0 24px 70px rgba(45,37,29,.24);text-align:center}
.admin-modal-icon{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 12px;border-radius:50%;background:#fff0ed;color:#b44135;font:800 1.2rem/1 sans-serif}
.admin-modal-card h2{font:800 1.2rem/1.4 "Noto Serif SC",serif}.admin-modal-card p{margin:9px 0 20px;color:var(--muted);font-size:.8rem;line-height:1.7}
.admin-modal-actions{display:flex;justify-content:center;gap:10px}

.dark .post-pin-pill{background:#4b3b26;color:#ebc58d;border-color:#665033}
.dark .post-list.is-grid .post-grid-cover{background:#332f29;border-color:#514a40}
.dark .post-cover-placeholder{background:linear-gradient(145deg,#334038 0%,#29362f 55%,#4b3d2e 55%,#4b3d2e 100%);color:#dbcbae}
.dark .post-cover-placeholder::before,.dark .post-cover-placeholder::after{background:rgba(50,46,39,.72);border-color:rgba(225,209,184,.15)}
.dark .admin-batch-bar{background:#2d382f;border-color:#425748;box-shadow:none}.dark .admin-batch-bar strong{color:#b6d8be}
.dark .admin-danger-btn{background:#422d29;border-color:#704840;color:#f0b2a8}.dark .admin-danger-btn:hover{background:#9b463d;color:#fff}
.dark .admin-modal-card{background:#2d2923;border-color:#554b3f}.dark .admin-modal-backdrop{background:rgba(10,9,8,.64)}.dark .admin-modal-icon{background:#4a302c;color:#efb0a5}

@media(max-width:640px){
  .post-list.is-grid{grid-template-columns:1fr;gap:16px}
  .post-list.is-grid .post-card-body{padding:15px 15px 14px}
  .admin-batch-bar{align-items:flex-start;flex-direction:column}.admin-batch-bar>div{display:block}.admin-batch-bar span{display:block;margin-top:3px}.admin-danger-btn{width:100%}
}


/* =========================================================
   Homepage annotation refinements v25
   ========================================================= */
/* Keep the left home rail visible while the article column scrolls,
   matching the detail-page sticky sidebar behavior. */
.home-grid > aside {
  position: sticky;
  top: 22px;
  align-self: start;
}

/* Theme changes should feel like a paper/light fade rather than an instant flash.
   The class only exists for ~420ms after an explicit theme-button click, so first
   paint stays immediate and does not animate from the wrong theme. */
html.theme-switching,
html.theme-switching body,
html.theme-switching body *,
html.theme-switching body *::before,
html.theme-switching body *::after {
  transition-property: background-color, color, border-color, box-shadow, opacity, fill, stroke !important;
  transition-duration: 320ms !important;
  transition-timing-function: cubic-bezier(.22,.61,.36,1) !important;
}
html.theme-switching .icon-button {
  transition-property: background-color, color, border-color, box-shadow, transform !important;
}

@media (prefers-reduced-motion: reduce) {
  html.theme-switching,
  html.theme-switching body,
  html.theme-switching body *,
  html.theme-switching body *::before,
  html.theme-switching body *::after {
    transition-duration: 0ms !important;
  }
}

@media (max-width: 900px) {
  .home-grid > aside { position: static; top: auto; }
}

/* =========================================================
   2026-08-22: compact flowing admin editor
   ========================================================= */
.editor-flow-page{--ef-bg:#f7f5ef;--ef-card:#fffefb;--ef-input:#fbfaf6;--ef-border:#dedfdc;--ef-border-soft:#ebe9e1;--ef-text:#262b2b;--ef-muted:#788084;--ef-green:#2fa66f;--ef-green-soft:#edf8f1;--ef-shadow:0 12px 35px rgba(58,52,43,.055);background:var(--ef-bg);color:var(--ef-text);min-height:100vh}
.editor-flow-header{position:sticky;top:0;z-index:40;height:58px;border-bottom:1px solid rgba(214,211,203,.72);background:rgba(247,245,239,.9);backdrop-filter:blur(14px)}
.editor-flow-header-inner{width:min(1180px,calc(100% - 36px));height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between}.editor-back{font-size:.78rem;color:var(--ef-muted);text-decoration:none}.editor-back:hover{color:var(--ef-text)}.editor-header-status{display:flex;align-items:center;gap:7px;font-size:.72rem;color:var(--ef-muted)}.editor-live-dot{width:7px;height:7px;border-radius:50%;background:var(--ef-green);box-shadow:0 0 0 4px rgba(47,166,111,.1)}
.editor-flow-main{width:min(1180px,calc(100% - 36px));max-width:none!important;margin:0 auto;padding:30px 0 24px!important}.editor-flow-main #post-form{max-width:none!important}
.editor-meta-flow{display:grid;gap:16px;margin-bottom:18px}.editor-meta-row{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:16px}.editor-meta-row>span{font-size:.88rem;font-weight:800;color:#293031}.editor-flow-field{width:100%;height:54px;padding:0 17px;border:1px solid var(--ef-border);border-radius:11px;outline:0;background:var(--ef-input);color:var(--ef-text);font:inherit;transition:border-color .18s,box-shadow .18s,background .18s}.editor-flow-field::placeholder{color:#90999f}.editor-flow-field:focus{border-color:#94cbb0;box-shadow:0 0 0 3px rgba(47,166,111,.085);background:var(--ef-card)}.editor-title-field{height:62px;font-size:1.08rem;font-weight:650}.editor-meta-grid2{display:grid;grid-template-columns:1fr 1fr;gap:26px}.editor-meta-grid2 .editor-meta-row{grid-template-columns:112px minmax(0,1fr)}
.editor-compose-shell{margin-top:22px;border:1px solid var(--ef-border);border-radius:15px;background:var(--ef-card);box-shadow:var(--ef-shadow);overflow:hidden}.editor-capsule-bar{display:flex;flex-wrap:wrap;align-items:center;gap:11px;padding:14px 22px;border-bottom:1px solid var(--ef-border-soft);background:linear-gradient(90deg,rgba(241,249,244,.84),rgba(255,254,251,.96))}.editor-capsule{min-height:38px;padding:0 15px;border:1px solid #cfe7d8;border-radius:12px;background:#fbfffc;color:#353b3b;font-size:.78rem;font-weight:750;display:inline-flex;align-items:center;gap:8px;cursor:pointer;transition:.18s}.editor-capsule:hover{transform:translateY(-1px);border-color:#9dd0b2;background:#f3fbf6;box-shadow:0 5px 14px rgba(47,166,111,.08)}.editor-capsule b{font-size:.9rem;color:#586467}.editor-capsule em{display:grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:20px;background:#dff3e7;color:#238455;font-style:normal;font-size:.62rem}.editor-permission-capsule{background:#f0faf4;border-color:#bfe0cb}.editor-permission-capsule small{padding-left:4px;color:#2a9a64;font-size:.66rem}.editor-vditor-wrap{min-height:550px}.editor-flow-page .editor-vditor-wrap .vditor{min-height:620px;border:0!important;border-radius:0!important}.editor-flow-page .vditor-toolbar{padding:8px 16px!important;background:#fff!important;border:0!important;border-bottom:1px solid var(--ef-border-soft)!important}.editor-flow-page .vditor-content{min-height:550px!important;background:var(--ef-card)!important}.editor-flow-page .vditor-sv,.editor-flow-page .vditor-preview{min-height:550px!important;background:var(--ef-card)!important}.editor-flow-page .vditor-sv{font-size:14px!important;line-height:1.8!important}.editor-counter{height:44px;padding:0 18px;display:flex;justify-content:flex-end;align-items:center;gap:10px;border-top:1px solid var(--ef-border-soft);font:500 .7rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#9a9e9b;background:#fff}.editor-counter i{width:1px;height:11px;background:#d9d9d4}
.editor-bottom-spacer{height:18px}.editor-bottom-bar{position:sticky;bottom:14px;z-index:35;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;padding:14px 16px;border:1px solid rgba(218,220,216,.9);border-radius:13px;background:rgba(255,255,253,.94);box-shadow:0 14px 38px rgba(50,47,42,.1);backdrop-filter:blur(16px)}.editor-bottom-note{min-width:0;padding:9px 13px;border-radius:9px;background:#f2f4f3;color:#7a8181;display:flex;gap:8px;align-items:center;font-size:.72rem}.editor-bottom-note strong{white-space:nowrap;color:#687271}.editor-bottom-actions{display:flex;gap:12px}.editor-action-secondary,.editor-action-primary{height:46px;padding:0 25px;border-radius:9px;font:750 .85rem/1 inherit;cursor:pointer;transition:.18s}.editor-action-secondary{border:1px solid #d9dddb;background:#fff;color:#394140}.editor-action-secondary:hover{background:#f7f8f7}.editor-action-primary{border:1px solid var(--ef-green);background:var(--ef-green);color:#fff;box-shadow:0 7px 18px rgba(47,166,111,.16)}.editor-action-primary:hover{transform:translateY(-1px);filter:brightness(.97)}.editor-error{grid-column:1/-1;margin:0;padding:0 4px;color:#b94b4b;font-size:.72rem}.editor-error:empty{display:none}
.editor-modal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:24px;background:rgba(26,28,27,.28);backdrop-filter:blur(5px)}.editor-modal.is-open{display:grid}.editor-modal-open{overflow:hidden}.editor-modal-card{position:relative;width:min(540px,100%);max-height:min(760px,calc(100vh - 48px));overflow:auto;padding:25px;border:1px solid #e2dfd7;border-radius:16px;background:#fffefb;box-shadow:0 25px 80px rgba(33,31,27,.2)}.editor-modal-card-wide{width:min(760px,100%)}.editor-modal-close{position:absolute;top:13px;right:14px;width:32px;height:32px;border:0;border-radius:8px;background:#f5f4ef;color:#737878;font-size:1.3rem;cursor:pointer}.editor-modal-heading{padding-right:35px;margin-bottom:20px}.editor-modal-heading small{color:#55a778;font-size:.58rem;font-weight:900;letter-spacing:.18em}.editor-modal-heading h2{margin:4px 0 4px;font-size:1.1rem}.editor-modal-heading p{margin:0;color:#8a9190;font-size:.72rem}.editor-modal-fields{display:grid;gap:13px}.editor-modal-fields label{display:grid;gap:6px;color:#5c6564;font-size:.7rem;font-weight:700}.editor-modal-textarea{height:120px;padding:13px 15px;resize:vertical}.editor-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.editor-modal-actions .editor-action-secondary,.editor-modal-actions .editor-action-primary{height:40px;padding:0 18px;font-size:.74rem}.editor-callout-types{display:flex;flex-wrap:wrap;gap:7px;margin:-5px 0 15px}.editor-callout-types button{height:31px;padding:0 10px;border:1px solid #e2dfd7;border-radius:8px;background:#faf9f5;color:#737979;font-size:.66rem;cursor:pointer}.editor-callout-types button.is-active{border-color:#a8d5b9;background:#eef8f2;color:#28895b;font-weight:800}.editor-audio-list{display:grid;gap:7px;margin-bottom:16px}.editor-audio-empty{padding:18px;border:1px dashed #dddcd6;border-radius:10px;text-align:center;color:#9a9e9b;font-size:.7rem}.editor-audio-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border:1px solid #e6e4dd;border-radius:10px;background:#fbfaf7}.editor-audio-row>span{font:700 .68rem ui-monospace,SFMono-Regular,monospace;color:#9ba09d}.editor-audio-row div{min-width:0;display:grid;gap:2px}.editor-audio-row strong{font-size:.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-audio-row small{font-size:.62rem;color:#939a97;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-audio-row button{border:0;background:transparent;color:#b06f6f;font-size:.64rem;cursor:pointer}.editor-audio-add-grid{grid-template-columns:1fr 1fr}.editor-permission-option{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:14px;border:1px solid #e4e3dd;border-radius:11px;margin-top:9px}.editor-permission-option.is-selected{border-color:#b8ddc6;background:#f1faf4}.editor-permission-option.is-disabled{opacity:.48}.editor-permission-radio{color:#2fa66f}.editor-permission-option div{display:grid;gap:2px}.editor-permission-option strong{font-size:.78rem}.editor-permission-option small{font-size:.64rem;color:#858d8a}.editor-permission-option>b{font-size:.62rem;color:#4ca474}
html.dark .editor-flow-page{--ef-bg:#24231f;--ef-card:#2a2925;--ef-input:#2d2c28;--ef-border:#45433c;--ef-border-soft:#3d3b35;--ef-text:#ebe8df;--ef-muted:#9c9b94;--ef-shadow:none;background:var(--ef-bg)}html.dark .editor-flow-header{background:rgba(36,35,31,.91);border-color:#3e3c36}.dark .editor-meta-row>span{color:#e5e1d8}.dark .editor-capsule-bar{background:linear-gradient(90deg,#292f2b,#2a2925)}.dark .editor-capsule{border-color:#3e5a49;background:#2b322d;color:#e0e6e1}.dark .editor-permission-capsule{background:#29372f}.dark .editor-flow-page .vditor-toolbar{background:#2d2c28!important}.dark .editor-flow-page .vditor-content,.dark .editor-flow-page .vditor-sv,.dark .editor-flow-page .vditor-preview{background:#2a2925!important;color:#e6e2d9!important}.dark .editor-counter{background:#2a2925;border-color:#3d3b35}.dark .editor-bottom-bar{background:rgba(43,42,37,.95);border-color:#46443d;box-shadow:0 16px 40px rgba(0,0,0,.2)}.dark .editor-bottom-note{background:#32332f;color:#a8aba5}.dark .editor-bottom-note strong{color:#d4d5cf}.dark .editor-action-secondary{background:#2e2d29;border-color:#4a4841;color:#e7e3da}.dark .editor-modal-card{background:#2b2a26;border-color:#494740;color:#e8e4dc}.dark .editor-modal-close{background:#36342f;color:#bbb7ae}.dark .editor-modal-heading p,.dark .editor-modal-fields label{color:#aaa9a1}.dark .editor-callout-types button,.dark .editor-audio-row{background:#302f2a;border-color:#47453f;color:#d7d4cc}.dark .editor-callout-types button.is-active{background:#29372f;border-color:#486a57;color:#78c397}.dark .editor-audio-empty{border-color:#4a4842}.dark .editor-permission-option{border-color:#484640}.dark .editor-permission-option.is-selected{background:#29372f;border-color:#476753}
@media(max-width:760px){.editor-flow-main,.editor-flow-header-inner{width:min(100% - 24px,1180px)}.editor-flow-main{padding-top:18px!important}.editor-meta-row,.editor-meta-grid2 .editor-meta-row{grid-template-columns:1fr;gap:7px}.editor-meta-grid2{grid-template-columns:1fr;gap:14px}.editor-meta-flow{gap:14px}.editor-flow-field{height:50px}.editor-title-field{height:56px}.editor-capsule-bar{padding:11px;gap:7px}.editor-capsule{padding:0 10px;min-height:34px;font-size:.7rem}.editor-permission-capsule small{display:none}.editor-flow-page .vditor-toolbar{padding:6px!important}.editor-flow-page .vditor-preview{display:none!important}.editor-bottom-bar{position:static;grid-template-columns:1fr;gap:10px}.editor-bottom-note{align-items:flex-start;flex-direction:column;gap:3px}.editor-bottom-actions{display:grid;grid-template-columns:1fr 1.35fr}.editor-action-secondary,.editor-action-primary{padding:0 14px}.editor-audio-add-grid{grid-template-columns:1fr}.editor-modal{padding:12px}.editor-modal-card{padding:21px 16px}}

/* 2026-08-22 editor grid alignment + integrated multimedia workspace */
.editor-flow-main{width:min(1100px,calc(100% - 36px))!important}
.editor-flow-header-inner{width:min(1100px,calc(100% - 36px))!important}
.editor-meta-compact{display:grid;gap:14px;margin:0 0 16px}
.editor-meta-grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:end}
.editor-meta-span-8{grid-column:span 8}.editor-meta-span-4{grid-column:span 4}.editor-meta-span-6{grid-column:span 6}
.editor-meta-field{display:grid;gap:7px;min-width:0}.editor-meta-field>span{font-size:.76rem;font-weight:800;color:#343a3b;line-height:1.2;margin:0;padding:0}
.editor-meta-compact .editor-flow-field{height:48px;border-radius:10px;padding:0 14px}.editor-meta-compact .editor-title-field{height:48px;font-size:.98rem;font-weight:650}
.editor-meta-grid-secondary{margin-top:0}
.editor-compose-shell{margin-top:0!important}
.media-workspace{border-bottom:1px solid var(--ef-border-soft);background:#fffaf2}
.media-workspace-summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:48px;padding:0 18px;cursor:pointer;color:#4d463d;user-select:none}
.media-workspace-summary::-webkit-details-marker{display:none}.media-workspace-title{display:flex;align-items:center;gap:7px;font-size:.77rem}.media-workspace-title strong{font-size:.79rem}.media-workspace-title small{font-size:.66rem;font-weight:500;color:#9b9082}.media-workspace-chevron{font-size:1rem;color:#a38c6d;transition:transform .18s ease}.media-workspace[open] .media-workspace-chevron{transform:rotate(180deg)}
.media-workspace-body{padding:0 18px 16px;border-top:1px dashed #eadfce}
.media-upload-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin:13px 0 8px}.media-upload-btn{min-height:34px;padding:0 12px;border-radius:8px;font-size:.72rem}.media-upload-note{margin:0 0 0 auto;font-size:.64rem;color:#a19484}
.media-upload-queue{display:grid;gap:7px;margin:10px 0 12px;max-height:260px;overflow:auto}.media-upload-row{padding:8px 10px;border-radius:8px}.media-upload-row-head{font-size:.7rem}.media-upload-progress{height:4px;margin:6px 0}.media-upload-row small{font-size:.61rem}.media-upload-actions button{font-size:.65rem;padding:4px 8px}
.media-workspace-tabs{display:flex;align-items:center;gap:6px;margin-top:10px;padding-bottom:9px;border-bottom:1px solid #eadfce}.media-workspace-tab{min-height:34px;padding:0 11px;border:1px solid transparent;border-radius:8px;background:transparent;color:#837769;font-size:.72rem;font-weight:750;cursor:pointer}.media-workspace-tab:hover{background:#f7efe4}.media-workspace-tab.is-active{background:#fffdf9;border-color:#d9cab6;color:#50735b;box-shadow:0 1px 4px rgba(60,47,31,.05)}.media-workspace-tab b{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:4px;padding:0 5px;border-radius:99px;background:#eee7dc;color:#85745e;font-size:.61rem}
.media-workspace-pane{padding-top:10px}.media-pane-head{margin-bottom:8px}.workspace-audio-list{display:grid;gap:8px}.workspace-audio-empty{padding:13px 14px;border:1px dashed #e0d4c3;border-radius:8px;color:#9a8e7e;font-size:.7rem;background:#fffdf9}.workspace-audio-card{padding:10px;border:1px solid #e5dac9;border-radius:9px;background:#fffdf9}.workspace-audio-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.workspace-audio-card-head strong{font-size:.7rem;color:#675b4c}.workspace-audio-card-head button{border:0;background:transparent;color:#b06155;font-size:.65rem;cursor:pointer}.workspace-audio-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.workspace-audio-grid label{display:grid;gap:4px;color:#978a79;font-size:.61rem}.workspace-audio-grid label.wide{grid-column:span 2}.workspace-audio-grid input{width:100%;height:33px;padding:0 9px;border:1px solid #e0d7c9;border-radius:7px;background:#fff;color:#4b443b;font-size:.69rem;outline:0}.workspace-audio-grid input:focus{border-color:#9cc9ae;box-shadow:0 0 0 2px rgba(47,166,111,.07)}
.media-video-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;border:0}.media-video-fields .editor-flow-field{height:40px}.media-video-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}.media-video-actions .editor-action-secondary,.media-video-actions .editor-action-primary{height:36px;padding:0 13px;font-size:.7rem}
html.dark .editor-meta-field>span{color:#e3dfd6}html.dark .media-workspace{background:#292620;border-color:#3d3b35}html.dark .media-workspace-summary{color:#ded7cc}html.dark .media-workspace-title small,html.dark .media-upload-note{color:#a99f92}html.dark .media-workspace-body{border-color:#484138}html.dark .media-workspace-tabs{border-color:#484138}html.dark .media-workspace-tab{color:#aaa095}html.dark .media-workspace-tab:hover{background:#302b24}html.dark .media-workspace-tab.is-active{background:#302d27;border-color:#574d41;color:#93c3a2}html.dark .workspace-audio-empty,html.dark .workspace-audio-card{background:#26231e;border-color:#484138;color:#a99f92}html.dark .workspace-audio-card-head strong{color:#ddd5c9}html.dark .workspace-audio-grid label{color:#a99f92}html.dark .workspace-audio-grid input{background:#211f1b;border-color:#494238;color:#e4ded3}
@media(max-width:760px){.editor-flow-main,.editor-flow-header-inner{width:min(100% - 24px,1100px)!important}.editor-meta-grid12{grid-template-columns:1fr;gap:11px}.editor-meta-span-8,.editor-meta-span-4,.editor-meta-span-6{grid-column:span 1}.media-workspace-summary{padding:0 12px}.media-workspace-title small{display:none}.media-workspace-body{padding:0 12px 12px}.media-upload-note{width:100%;margin-left:0}.workspace-audio-grid,.media-video-fields{grid-template-columns:1fr}.workspace-audio-grid label.wide{grid-column:span 1}}

/* Media editor alignment hardening: keep the 8/4 top grid from overflowing or
   visually colliding even when older global input rules are present. */
.editor-meta-grid-primary{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:16px;row-gap:12px}
.editor-meta-grid-primary>.editor-meta-field{min-width:0;width:100%}
.editor-meta-grid-primary .editor-flow-field{box-sizing:border-box;min-width:0;max-width:100%;margin-left:0;margin-right:0}

/* ===== 2026-08-23 UI layout refinement ===== */
/* Compact pinned Hero: notebook-strip proportions, less first-screen occupation. */
.hero-section{margin-bottom:18px}
.hero-carousel,.hero-track{min-height:176px}
.hero-slide{grid-template-columns:minmax(0,1.55fr) minmax(220px,.65fr);min-height:176px}
.hero-copy{justify-content:center;padding:16px 22px 15px 24px}
.hero-badge{padding:4px 9px;font-size:.64rem;box-shadow:0 3px 9px rgba(172,113,45,.12)}
.hero-title{margin:8px 0 5px;font-size:clamp(1.08rem,1.6vw,1.24rem);line-height:1.38;-webkit-line-clamp:2}
.hero-tags{gap:6px;margin-top:5px}
.hero-pill{min-height:24px;padding:3px 8px;font-size:.63rem}
.hero-footer{gap:12px;margin-top:9px}
.hero-read{padding:6px 11px;font-size:.68rem;box-shadow:0 4px 10px rgba(180,101,24,.13)}
.hero-meta{gap:7px;font-size:.61rem}
.hero-meta>*+*::before{margin-right:7px}
.hero-cover{min-height:176px}
.hero-cover img{min-height:176px}
.hero-cover-placeholder{padding:17px}
.hero-cover-placeholder b{font-size:1.22rem}.hero-cover-placeholder small{margin-top:5px;font-size:.55rem}
.paper-sheet{transform-origin:center;scale:.72}.paper-sheet.one{right:2px;top:8px}.paper-sheet.two{right:62px;top:34px}.paper-pencil{right:22px;bottom:27px;width:83px;height:10px}
.hero-dots{bottom:7px}.hero-dots button{width:6px;height:6px}.hero-dots button.is-active{width:18px}
.latest-toolbar{margin-top:18px}

/* Admin list slimming after removing the slug subline. */
#post-table-body td{padding-top:13px;padding-bottom:13px;vertical-align:middle}
#post-table-body .admin-check-col{vertical-align:middle}

/* Editor meta layout: one bounded 1100px axis, strict 12-column rows. */
.editor-flow-main,.editor-flow-header-inner{width:calc(100% - 36px)!important;max-width:1100px!important;margin-left:auto!important;margin-right:auto!important}
#post-form,.editor-meta-flow,.editor-meta-grid12,.editor-compose-shell{box-sizing:border-box;min-width:0;max-width:100%}
.editor-meta-grid12{width:100%;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:16px;row-gap:12px}
.editor-meta-grid12>.editor-meta-field{width:100%;min-width:0;max-width:100%}
.editor-meta-grid12 .editor-flow-field,.editor-meta-grid12 select{display:block;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;margin:0!important}
.editor-meta-grid-primary .editor-meta-span-8{grid-column:span 8}.editor-meta-grid-primary .editor-meta-span-4{grid-column:span 4}
.editor-meta-grid-secondary .editor-meta-span-6{grid-column:span 6}

/* Audio item: exact 2 x 2 grid, no spanning / ghost column. */
.workspace-audio-card{overflow:hidden}
.workspace-audio-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px 12px;width:100%;min-width:0}
.workspace-audio-grid label,.workspace-audio-grid label.wide{grid-column:auto!important;display:grid;grid-template-columns:minmax(0,1fr);gap:4px;min-width:0;width:100%;margin:0}
.workspace-audio-grid input{display:block;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;margin:0!important}

@media(max-width:900px){
  .hero-carousel,.hero-track,.hero-slide{min-height:164px}
  .hero-slide{grid-template-columns:minmax(0,1.45fr) minmax(185px,.55fr)}
  .hero-copy{padding:14px 18px}
  .hero-cover,.hero-cover img{min-height:164px}
  .hero-meta{display:none}
}
@media(max-width:760px){
  .editor-flow-main,.editor-flow-header-inner{width:calc(100% - 24px)!important;max-width:1100px!important}
  .editor-meta-grid12{grid-template-columns:1fr;gap:11px}
  .editor-meta-grid-primary .editor-meta-span-8,.editor-meta-grid-primary .editor-meta-span-4,.editor-meta-grid-secondary .editor-meta-span-6{grid-column:1/-1}
  .workspace-audio-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .hero-section{margin-bottom:14px}
  .hero-carousel,.hero-track,.hero-slide{min-height:150px}
  .hero-slide{grid-template-columns:minmax(0,1.5fr) minmax(120px,.5fr)}
  .hero-copy{padding:12px 13px}
  .hero-badge{padding:3px 7px;font-size:.57rem}
  .hero-title{margin:6px 0 3px;font-size:.98rem;line-height:1.3}
  .hero-tags{margin-top:3px;gap:4px}.hero-pill{min-height:21px;padding:2px 6px;font-size:.56rem}
  .hero-footer{margin-top:6px}.hero-read{padding:5px 9px;font-size:.61rem}
  .hero-cover,.hero-cover img{min-height:150px}
  .hero-cover-placeholder{padding:10px}.hero-cover-placeholder small{display:none}
}

/* ===== 2026-08-23 alignment pass 2 ===== */
/* Title / cover now mirror category / tags: equal halves on one shared axis. */
.editor-meta-grid-primary .editor-meta-span-6{grid-column:span 6}
.editor-meta-grid-primary .editor-meta-span-8,
.editor-meta-grid-primary .editor-meta-span-4{grid-column:span 6}

/* Video URL / poster: exact 50/50 columns with overflow hardening. */
.media-video-fields{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  column-gap:16px!important;
  row-gap:10px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.media-video-fields>.editor-meta-field{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
}
.media-video-fields .editor-flow-field{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
}

/* Admin category becomes a real navigation target without changing row density. */
.admin-category-link{color:inherit;text-decoration:none;border-bottom:1px dashed rgba(153,118,77,.42);transition:color .15s,border-color .15s}
.admin-category-link:hover{color:#9a5b22;border-bottom-color:currentColor}
.dark .admin-category-link:hover{color:#d7a66d}

@media(max-width:760px){
  .editor-meta-grid-primary .editor-meta-span-6,
  .editor-meta-grid-primary .editor-meta-span-8,
  .editor-meta-grid-primary .editor-meta-span-4{grid-column:1/-1}
  .media-video-fields{grid-template-columns:1fr!important;column-gap:0!important}
}


/* ===== 2026-08-23 compact pinned hero pass 3 ===== */
/* Remove the featured badge in markup and halve the refined hero height again. */
.hero-carousel,.hero-track,.hero-slide{min-height:88px!important;max-height:88px!important}
.hero-slide{grid-template-columns:minmax(0,1.62fr) minmax(180px,.58fr)!important;grid-template-rows:88px!important}
.hero-copy{padding:8px 18px 8px 20px!important;justify-content:center!important;overflow:hidden}
.hero-title{margin:0 0 4px!important;font-size:1rem!important;line-height:1.28!important;-webkit-line-clamp:1!important}
.hero-tags{margin-top:0!important;gap:5px!important;max-height:22px;overflow:hidden}
.hero-pill{min-height:20px!important;padding:2px 7px!important;font-size:.58rem!important}
.hero-footer{display:none!important}
.hero-cover,.hero-cover img,.hero-cover-placeholder{min-height:88px!important;height:88px!important;max-height:88px!important}
.hero-cover-placeholder{padding:8px 10px!important}
.hero-cover-placeholder b{font-size:.82rem!important}
.hero-cover-placeholder small,.hero-cover-placeholder .paper-sheet,.hero-cover-placeholder .paper-pencil{display:none!important}
.hero-dots{bottom:4px!important}.hero-dots button{height:4px!important;width:4px!important}.hero-dots button.is-active{width:14px!important}

@media(max-width:900px){
  .hero-carousel,.hero-track,.hero-slide{min-height:82px!important;max-height:82px!important}
  .hero-slide{grid-template-columns:minmax(0,1.58fr) minmax(150px,.52fr)!important;grid-template-rows:82px!important}
  .hero-copy{padding:7px 14px!important}
  .hero-cover,.hero-cover img,.hero-cover-placeholder{min-height:82px!important;height:82px!important;max-height:82px!important}
}
@media(max-width:640px){
  .hero-carousel,.hero-track,.hero-slide{min-height:75px!important;max-height:75px!important}
  .hero-slide,.hero-slide:first-child,.hero-slide.is-active{grid-template-columns:minmax(0,68%) minmax(0,32%)!important;grid-template-rows:75px!important}
  .hero-copy{padding:6px 8px 6px 11px!important}
  .hero-title{font-size:.88rem!important;line-height:1.25!important;margin:0!important;-webkit-line-clamp:2!important}
  .hero-tags{display:none!important}
  .hero-cover,.hero-cover img,.hero-cover-placeholder{min-height:75px!important;height:75px!important;max-height:75px!important}
}
\n\n/* ===== 2026-08-23 macOS borderless video player UI ===== */
/* UI-only pass: do not alter HLS.js, signed URL refresh, Range or recovery logic. */
.paper-video-shell{
  margin:6px 0 30px!important;
  padding:0!important;
  border:0!important;
  border-radius:16px!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.paper-video-player{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  border:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:#000!important;
  box-shadow:0 10px 28px rgba(28,25,21,.10),0 1px 3px rgba(28,25,21,.10);
}
.paper-video-player .art-video-player{
  border:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:#000!important;
}
.paper-video-player video{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#000!important;
}
/* Soft QuickTime-style bottom fade instead of a boxed toolbar. */
.paper-video-player .art-bottom{
  padding:0 10px 9px!important;
  background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.36) 56%,rgba(0,0,0,0) 100%)!important;
}
.paper-video-player .art-controls{
  min-height:42px!important;
  gap:2px!important;
}
.paper-video-player .art-control{
  min-width:34px!important;
  height:34px!important;
  padding:0 7px!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:.92;
  transition:opacity .16s ease,background-color .16s ease,transform .16s ease!important;
}
.paper-video-player .art-control:hover{
  opacity:1;
  background:rgba(255,255,255,.10)!important;
}
.paper-video-player .art-control:active{transform:scale(.96)}
.paper-video-player .art-control-progress{
  padding:8px 0 5px!important;
  min-height:20px!important;
}
.paper-video-player .art-control-progress-inner{
  height:3px!important;
  border-radius:999px!important;
}
.paper-video-player .art-control-progress:hover .art-control-progress-inner{height:5px!important}
.paper-video-player .art-progress-played{background:#d9944b!important}
.paper-video-player .art-progress-indicator{
  width:11px!important;
  height:11px!important;
  margin-left:-5px!important;
  margin-top:-4px!important;
  border:0!important;
  box-shadow:0 1px 4px rgba(0,0,0,.35)!important;
}
.paper-video-player .art-control-time{
  padding-left:5px!important;
  padding-right:8px!important;
  font-size:12px!important;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  opacity:.9;
}
html.dark .paper-video-shell{background:transparent!important;border:0!important;box-shadow:none!important}
html.dark .paper-video-player{box-shadow:0 10px 30px rgba(0,0,0,.22)}

@media(max-width:767px){
  .paper-video-shell{
    margin:6px 0 24px!important;
    padding:0!important;
    border-radius:15px!important;
  }
  .paper-video-player{
    aspect-ratio:auto!important;
    height:clamp(255px,68vw,295px)!important;
    min-height:255px!important;
    border-radius:15px!important;
  }
  .paper-video-player .art-video-player{border-radius:15px!important}
  .paper-video-player .art-bottom{padding:0 8px 7px!important}
  .paper-video-player .art-controls{min-height:40px!important}
  .paper-video-player .art-control{min-width:32px!important;height:32px!important;padding:0 6px!important}
  /* Phone volume is controlled by the OS; hiding it frees space for seek/time/fullscreen. */
  .paper-video-player .art-control-volume{display:none!important}
  .paper-video-player .art-control-time{font-size:11px!important;padding-left:3px!important;padding-right:4px!important}
  /* Keep a generous touch target while the progress line remains visually thin. */
  .paper-video-player .art-control-progress{padding-top:10px!important;padding-bottom:7px!important}
}


/* 2026-08-23: compact stationery labels + balanced footer */
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%}
.pill{border-radius:4px!important;padding:2px 8px!important;min-height:22px!important;line-height:1.2!important}
.hero-pill{border-radius:4px!important;min-height:20px!important;padding:2px 7px!important;line-height:1.15!important}
.sidebar-tag{border-radius:3px!important;padding:3px 7px!important;min-height:22px;line-height:1.15}
.drawer-tag-cloud a{border-radius:3px!important;padding:3px 7px!important;min-height:22px!important;line-height:1.15!important}
.author-categories a{border-radius:4px!important;padding:5px 3px!important;min-height:25px;line-height:1.15}
@media (max-width:640px){.site-footer{padding-top:24px!important;padding-bottom:24px!important}.pill{min-height:20px!important;padding:2px 7px!important}.hero-pill{min-height:19px!important;padding:1px 6px!important}}
/* Compact formerly-capsule editor shortcuts: squared stationery-button shape. */
.editor-capsule{min-height:32px!important;padding:0 11px!important;border-radius:5px!important;gap:6px!important;font-size:.74rem!important}
.editor-capsule em{border-radius:4px!important;height:16px!important;min-width:16px!important}
@media(max-width:760px){.editor-capsule{min-height:30px!important;padding:0 9px!important;border-radius:4px!important;font-size:.68rem!important}}

/* =========================================================
   2026-08-23 v10 — footer alignment, hover hero arrows,
   split taxonomy sidebar cards
   ========================================================= */
/* Keep footer content on exactly the same horizontal guide as the site shell above. */
.site-footer{
  width:min(1180px,calc(100% - 32px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}

/* Hero arrows stay visually absent until the pointer enters the carousel. */
.hero-arrow{
  display:grid!important;
  place-items:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(2px) scale(.96);
  transition:opacity .18s ease,visibility .18s ease,transform .18s ease,background .18s ease!important;
}
.hero-carousel:hover .hero-arrow,
.hero-carousel:focus-within .hero-arrow{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.hero-carousel:hover .hero-arrow:hover{transform:scale(1.06)}
.hero-carousel[data-count="1"] .hero-arrow{display:none!important}
@media (hover:none),(pointer:coarse){.hero-arrow{display:none!important}}

/* Match the cleaner reference: categories and popular tags are independent cards. */
.taxonomy-card{padding:22px 24px!important}
.taxonomy-category-card .sidebar-title{margin-bottom:13px}
.taxonomy-hot-tags-card .sidebar-title{margin-bottom:0}
.taxonomy-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}
.taxonomy-more{flex:0 0 auto;color:#8a6d53;font-size:.68rem;transition:color .18s ease,transform .18s ease}
.taxonomy-more:hover{color:var(--accent);transform:translateX(2px)}
.taxonomy-categories .category-link{
  margin:0!important;
  padding:9px 7px!important;
  border-radius:0!important;
  border-top:0!important;
  border-bottom:1px dashed var(--line-strong);
  font-size:.86rem;
}
.taxonomy-categories .category-link:last-child{border-bottom:0}
.taxonomy-categories .category-link:hover{transform:none;background:rgba(250,240,230,.42)}
.category-count{margin-left:auto;min-width:18px;text-align:right;color:#9b8067;font-size:.7rem}
.taxonomy-hot-tags-card .sidebar-tags{gap:7px 6px}
.taxonomy-hot-tags-card .sidebar-tag{padding:4px 8px!important;min-height:24px;border-radius:4px!important;background:#fffaf2}
.taxonomy-hot-tags-card .sidebar-tag:hover{transform:translateY(-1px)}
.dark .taxonomy-more{color:#bba58d}
.dark .taxonomy-categories .category-link:hover{background:#383229}

@media (max-width:640px){
  .site-footer{width:min(100% - 20px,1180px)!important}
}

/* =========================================================
   2026-08-23 v11 — flat callouts, quote card, clean links,
   transparent pinned-navigation arrows
   ========================================================= */

/* Reference-style semantic notes: flat tinted strip, strong left accent,
   no decorative icon bubble. Keep the content itself unchanged. */
.prose-paper .paper-callout{
  display:block;
  margin:1.35rem 0;
  padding:17px 20px 17px 22px;
  border:0;
  border-left:6px solid var(--callout-accent);
  border-radius:2px;
  background:var(--callout-bg);
  box-shadow:none;
  color:#354b60;
}
.prose-paper .paper-callout .callout-icon{display:none!important}
.prose-paper .paper-callout .callout-body{
  min-width:0;
  font-size:.96rem;
  line-height:1.72;
}
.prose-paper .paper-callout .callout-title{
  margin:0 0 3px;
  color:#354b60;
  font-weight:760;
}
.prose-paper .callout-default{--callout-bg:#f3f4f6;--callout-accent:#b9c1cc;--callout-border:transparent}
.prose-paper .callout-primary{--callout-bg:#f7f2ff;--callout-accent:#b27be4;--callout-border:transparent}
.prose-paper .callout-info{--callout-bg:#eef2ff;--callout-accent:#3760c7;--callout-border:transparent}
.prose-paper .callout-success{--callout-bg:#eafafa;--callout-accent:#10bfb9;--callout-border:transparent}
.prose-paper .callout-warning{--callout-bg:#fff6ed;--callout-accent:#ee8b2d;--callout-border:transparent}
.prose-paper .callout-danger{--callout-bg:#fff0f1;--callout-accent:#e83b3f;--callout-border:transparent}

/* Collapsible note uses the same visual language. */
.prose-paper details.paper-callout{padding:0;overflow:hidden}
.prose-paper details.paper-callout>summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 22px;
  gap:10px;
  align-items:center;
  padding:17px 20px 17px 22px;
  color:#354b60;
  font-weight:760;
}
.prose-paper details.paper-callout>summary .callout-icon{display:none!important}
.prose-paper details.paper-callout>.callout-body{padding:0 20px 17px 22px}
.prose-paper details.paper-callout .callout-chevron{justify-self:end;color:var(--callout-accent)}

/* Quote reference: soft blue field with one clean blue accent bar. */
.prose-paper blockquote{
  margin:1.55rem 0;
  padding:15px 20px;
  border:0;
  border-left:5px solid #43aef3;
  border-radius:12px;
  background:#eaf6ff;
  box-shadow:none;
  color:#354b60;
  font-family:inherit;
  font-style:normal;
}

/* Long URL lists look cleaner without a permanent hand-drawn wave.
   Keep the warm link color; reveal a precise dashed underline on interaction. */
.prose-paper a:not(.btn){
  color:#b86d2c;
  text-decoration:none;
  background:transparent;
  transition:color .16s ease,background-color .16s ease,text-decoration-color .16s ease;
}
.prose-paper a:not(.btn):hover,
.prose-paper a:not(.btn):focus-visible{
  color:#8f4f1d;
  background:transparent;
  text-decoration-line:underline;
  text-decoration-style:dashed;
  text-decoration-thickness:1px;
  text-decoration-color:#d99a62;
  text-underline-offset:5px;
}

/* Pinned carousel: arrow glyph only. No disc, border or backdrop to cover content. */
.hero-arrow,
.dark .hero-arrow{
  width:34px!important;
  height:46px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  color:#765f49!important;
  text-shadow:0 1px 2px rgba(255,255,255,.65);
}
.dark .hero-arrow{color:#e6d7c5!important;text-shadow:0 1px 2px rgba(0,0,0,.42)}
.hero-carousel:hover .hero-arrow:hover{transform:translateY(0) scale(1.13)!important;color:#b56a2d!important}

.dark .prose-paper .paper-callout{filter:none;color:#e8e2d8}
.dark .prose-paper .paper-callout .callout-title,
.dark .prose-paper details.paper-callout>summary{color:#e8e2d8}
.dark .prose-paper .callout-default{--callout-bg:#2c2d2f;--callout-accent:#949ca7;background:#2c2d2f}
.dark .prose-paper .callout-primary{--callout-bg:#302b38;--callout-accent:#b58ae0;background:#302b38}
.dark .prose-paper .callout-info{--callout-bg:#272d3c;--callout-accent:#6684dc;background:#272d3c}
.dark .prose-paper .callout-success{--callout-bg:#213433;--callout-accent:#43c5be;background:#213433}
.dark .prose-paper .callout-warning{--callout-bg:#382f25;--callout-accent:#e99a4d;background:#382f25}
.dark .prose-paper .callout-danger{--callout-bg:#3a2829;--callout-accent:#e96b6d;background:#3a2829}
.dark .prose-paper blockquote{background:#233440;border:0;border-left:5px solid #58b8f4;color:#dceaf3}
.dark .prose-paper a:not(.btn){color:#df9a62}
.dark .prose-paper a:not(.btn):hover,.dark .prose-paper a:not(.btn):focus-visible{color:#f0b27e;text-decoration-color:#b87947}

@media(max-width:640px){
  .prose-paper .paper-callout{padding:14px 15px 14px 17px;border-left-width:5px}
  .prose-paper details.paper-callout>summary{padding:14px 15px 14px 17px}
  .prose-paper details.paper-callout>.callout-body{padding:0 15px 14px 17px}
  .prose-paper blockquote{padding:13px 15px;border-radius:10px}
}

/* =========================================================
   2026-08-23 Typography refresh: modern system sans stack
   Keeps the paper theme while removing the heavy Song/Times feel.
   ========================================================= */
:root {
  --font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Fira Code", "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

html, body, button, input, select, textarea,
.font-sans, .serif {
  font-family: var(--font-ui) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Titles: one visual center of gravity for Chinese, Latin and mixed text. */
.brand,
.sidebar-title,
.intro-title,
.post-card-title,
.reading-number,
.article-title,
.prose-paper h1,
.prose-paper h2,
.prose-paper h3,
.prose-paper h4,
.author-avatar span,
.author-name,
.author-stats strong,
.toc-heading,
.latest-item span,
.pinned-board-title,
.pinned-title,
.filter-heading h2,
.drawer-topbar strong,
.drawer-author-copy h2,
.drawer-stats strong,
.drawer-card-title,
.hero-title,
.hero-cover-placeholder b,
.latest-heading h2,
.archive-row strong,
.comment-placeholder h2,
.category-wall-item strong,
.paper-audio-heading strong {
  font-family: var(--font-ui) !important;
}

/* Main/card titles: slightly tighter and calmer than the old serif treatment. */
.post-card-title,
.pinned-title,
.hero-title {
  font-weight: 650 !important;
  letter-spacing: -0.012em !important;
  line-height: 1.45 !important;
}

.article-title {
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.prose-paper h1,
.prose-paper h2,
.prose-paper h3,
.prose-paper h4 {
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
}

/* Quotes stay typographically neutral; style comes from the paper treatment. */
.prose-paper blockquote {
  font-family: var(--font-ui) !important;
  font-style: normal;
}

/* Metadata and counters: tabular figures align dates/counts and feel more precise. */
.post-meta,
.article-meta,
.pinned-meta,
.hero-meta,
.home-stats,
.author-stats,
.drawer-stats,
.archive-date,
.archive-count,
.category-link small,
.sidebar-tag small,
.drawer-category-list small,
.drawer-tag-cloud small,
time {
  font-family: var(--font-ui) !important;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "kern" 1;
}

.post-meta,
.article-meta,
.pinned-meta,
.hero-meta {
  color: #8c8273;
  letter-spacing: .005em;
}

.dark .post-meta,
.dark .article-meta,
.dark .pinned-meta,
.dark .hero-meta {
  color: #a79c8e;
}

/* Code keeps a dedicated mono stack and tabular numerals. */
code, pre, .font-code, .font-mono,
.prose-paper pre code,
.copy-code {
  font-family: var(--font-mono) !important;
  font-variant-numeric: tabular-nums;
}

/* The audio artwork fallback should follow the same modern visual language. */
.paper-audio-cover-fallback {
  font-family: var(--font-ui) !important;
  font-weight: 700 !important;
}

/* Remaining decorative/title surfaces follow the same refreshed stack. */
.public-page-head h1,
.about-paper > h1,
.post-cover-placeholder,
.admin-modal-card h2,
.paper-audio-title-line strong {
  font-family: var(--font-ui) !important;
}

/* =========================================================
   Studio brand + extended music playlist v14
   ========================================================= */
.paper-audio-playlist {
  max-height: 620px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(140,130,115,.25) transparent;
  overscroll-behavior: contain;
}
.paper-audio-playlist::-webkit-scrollbar { width: 5px; }
.paper-audio-playlist::-webkit-scrollbar-track { background: transparent; }
.paper-audio-playlist::-webkit-scrollbar-thumb {
  background-color: rgba(140,130,115,.25);
  border-radius: 9999px;
}
.paper-audio-playlist::-webkit-scrollbar-thumb:hover { background-color: rgba(140,130,115,.45); }
.paper-audio-track { padding: 10px 12px; }
html.dark .paper-audio-playlist { scrollbar-color: rgba(210,199,183,.28) transparent; }
html.dark .paper-audio-playlist::-webkit-scrollbar-thumb { background-color: rgba(210,199,183,.28); }
html.dark .paper-audio-playlist::-webkit-scrollbar-thumb:hover { background-color: rgba(210,199,183,.46); }

/* A one-line legal footer remains aligned to the shared site shell. */
.site-footer { justify-content: flex-start; }


/* V15: compact one-line Studio brand mark in the public top navigation. */
.studio-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  max-height: 32px;
  color: var(--ink);
  text-decoration: none;
  line-height: 1;
  transition: transform .18s ease, opacity .18s ease;
}
.studio-brand:hover { transform: translateY(-1px); }
.studio-brand:focus-visible { outline: 2px dashed rgba(78,139,110,.48); outline-offset: 4px; border-radius: 6px; }
.studio-brand-mark {
  position: relative;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 1px solid #e5dac8;
  border-radius: 6px;
  background: #fffdf9;
  box-shadow: 0 1px 2px rgba(72,61,45,.08);
}
.studio-brand-mark b {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  color: #2b2825;
}
.studio-brand-mark i {
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #4e8b6e;
  box-shadow: 0 0 0 1px rgba(255,253,249,.78);
}
.studio-brand-name {
  display: block;
  white-space: nowrap;
  font-family: var(--font-ui);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.dark .studio-brand-mark {
  background: #2a2926;
  border-color: #403c36;
  box-shadow: 0 1px 2px rgba(0,0,0,.18);
}
.dark .studio-brand-mark b { color: #e8e2d8; }
.dark .studio-brand-mark i { box-shadow: 0 0 0 1px rgba(42,41,38,.85); }

@media (max-width: 767px) {
  .studio-brand { gap: 8px; max-height: 30px; }
  .studio-brand-mark { width: 26px; height: 26px; flex-basis: 26px; border-radius: 6px; }
  .studio-brand-mark b { font-size: 11px; }
  .studio-brand-mark i { width: 5px; height: 5px; right: 4px; bottom: 4px; }
  .studio-brand-name { font-size: 15.5px; letter-spacing: -.018em; }
}

/* =========================================================
   2026-08-23 v16 — custom stationery avatar + balanced footer
   ========================================================= */
.avatar-frame {
  position: relative;
  overflow: visible;
  isolation: isolate;
}
.avatar-frame .avatar-image,
.avatar-frame .avatar-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.avatar-frame .avatar-image {
  z-index: 2;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}
.avatar-frame .avatar-fallback {
  z-index: 1;
  display: grid;
  place-items: center;
  border-radius: inherit;
  background: linear-gradient(145deg,#d9c6a5,#b9c7b7);
  color: #5f5142;
  font: 800 1.45rem/1 var(--font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  letter-spacing: -.03em;
}
.avatar-frame.is-fallback .avatar-image { display: none; }

.author-avatar.avatar-frame {
  width: 68px;
  height: 68px;
  margin: 4px auto 14px;
  border: 2px solid #faf4eb;
  border-radius: 16px;
  background: #f2e9da;
  box-shadow: 0 4px 12px rgba(73,61,45,.10), 0 0 0 1px #e8dcb8;
  transform: none;
}
.author-avatar.avatar-frame .avatar-image,
.author-avatar.avatar-frame .avatar-fallback { border-radius: 14px; }
.author-avatar.avatar-frame .avatar-fallback { font-size: 1.65rem; }
.author-avatar.avatar-frame .avatar-tape {
  position: absolute;
  z-index: 4;
  top: -8px;
  left: 50%;
  width: 31px;
  height: 10px;
  transform: translateX(-50%) rotate(-4deg);
  background: rgba(222,171,96,.72);
  clip-path: polygon(3% 10%,98% 0,94% 96%,0 88%);
  box-shadow: 0 1px 2px rgba(77,58,35,.07);
  pointer-events: none;
}
.public-author-card .author-avatar { margin-bottom: 16px; }

.drawer-avatar.avatar-frame {
  width: 52px;
  height: 52px;
  border: 2px solid #fff4e6;
  border-radius: 13px;
  background: #efe5d4;
  box-shadow: 0 4px 11px rgba(79,63,43,.10), 0 0 0 1px #e4d6b9;
  transform: none;
}
.drawer-avatar.avatar-frame .avatar-image,
.drawer-avatar.avatar-frame .avatar-fallback { border-radius: 11px; }
.drawer-avatar.avatar-frame .avatar-fallback { font-size: 1.18rem; }

html.dark .author-avatar.avatar-frame,
html.dark .drawer-avatar.avatar-frame {
  border-color: #3a342c;
  background: #373129;
  box-shadow: 0 4px 14px rgba(0,0,0,.18), 0 0 0 1px #564b3d;
}
html.dark .avatar-frame .avatar-fallback {
  background: linear-gradient(145deg,#62584b,#58695d);
  color: #f0e5d5;
}
html.dark .author-avatar.avatar-frame .avatar-tape { background: rgba(166,126,71,.72); }

/* Footer: legal copy on the left, smooth-return action on the right. */
.site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between !important;
  gap: 20px;
  width: min(1180px,calc(100% - 32px)) !important;
  margin: 48px auto 0 !important;
  padding: 24px 0 !important;
  border-top-style: solid !important;
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.5;
}
.site-footer-copy { min-width: 0; }
.site-footer-top {
  flex: 0 0 auto;
  color: var(--muted);
  text-decoration: none;
  cursor: pointer;
  transition: color .18s ease, transform .18s ease;
}
.site-footer-top:hover,
.site-footer-top:focus-visible {
  color: var(--ink);
  transform: translateY(-1px);
}
.site-footer-top:focus-visible {
  outline: 1px dashed var(--accent);
  outline-offset: 4px;
}
@media (max-width: 640px) {
  .site-footer {
    width: min(100% - 20px,1180px) !important;
    margin-top: 34px !important;
    padding: 20px 0 !important;
    gap: 12px;
    font-size: .7rem;
  }
  .site-footer-copy { max-width: 72%; }
  .author-avatar.avatar-frame { width: 64px; height: 64px; border-radius: 15px; }
  .author-avatar.avatar-frame .avatar-image,
  .author-avatar.avatar-frame .avatar-fallback { border-radius: 13px; }
}

/* ================================================================
   2026-08-23 v18 — gallery / download / hide compact refinements
   ================================================================ */
.paper-gallery{column-count:1;column-gap:16px;margin:22px auto;max-width:1100px}
@media (min-width:640px){.paper-gallery{column-count:2}}
@media (min-width:1024px){.paper-gallery{column-count:3}}
.paper-photo-card{position:relative;break-inside:avoid;margin:0 0 16px;padding:8px;background:#fffdf9;border:1px solid #eae2d5;border-radius:12px;box-shadow:0 2px 8px rgba(84,69,49,.05);transition:transform .22s ease,box-shadow .22s ease}
.paper-photo-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(84,69,49,.10)}
.paper-photo-link{display:block;color:inherit!important;text-decoration:none!important}
.paper-photo-image{display:block;width:100%;height:auto;border-radius:8px;object-fit:cover;background:transparent;transition:filter .22s ease}
.paper-photo-card:hover .paper-photo-image{filter:saturate(1.02)}
.paper-photo-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding:0 4px 1px;color:#8c8170;font-size:11px;line-height:1.35}
.paper-photo-meta strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#3a352f;font-size:12px;font-weight:650}
.paper-photo-meta>span{flex:0 0 auto;font-family:"Fira Code",Menlo,Monaco,Consolas,monospace;font-size:11px;font-variant-numeric:tabular-nums}
html.dark .paper-photo-card{background:#252422;border-color:#3d3933;box-shadow:none}html.dark .paper-photo-card:hover{box-shadow:0 8px 22px rgba(0,0,0,.18)}html.dark .paper-photo-meta{color:#a19788}html.dark .paper-photo-meta strong{color:#e2dcce}

.paper-download-card{position:relative;display:flex;flex-direction:column;gap:14px;margin:24px 0;padding:16px;background:#fffdf9;border:1px solid #e4d8c6;border-radius:14px;box-shadow:0 3px 12px rgba(82,66,46,.05)}
.download-left{min-width:0;flex:1}.download-head{display:flex;align-items:center;gap:12px}.download-filetype{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border:1px solid #dfd3c1;border-radius:10px;background:#f8f2e9;color:#766b5e;font-size:10px;font-weight:800;letter-spacing:.06em}.download-head>div{min-width:0}.download-head strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#332f2a;font-size:14px}.download-head small{display:block;margin-top:3px;color:#928777;font-size:11px}.download-codes{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.download-code{display:inline-flex;align-items:center;gap:6px;margin:0;padding:5px 8px;border:1px solid #e5dacb;border-radius:999px;background:#faf6ef;color:#776d60;font-size:11px;line-height:1;cursor:pointer;transition:.15s ease}.download-code b{font-family:"Fira Code",Menlo,monospace;color:#4b443b}.download-code em{font-style:normal;color:#4e8b6e}.download-code:hover{border-color:#cabda8;background:#f5eee4}.download-action{flex:0 0 auto}.download-main{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:142px;min-height:40px;padding:0 24px;border-radius:11px;background:#4e8b6e!important;color:#fff!important;font-size:12px;font-weight:700;text-decoration:none!important;white-space:nowrap;transition:background .15s ease,transform .15s ease}.download-main:hover{background:#3d7058!important;transform:translateY(-1px)}.download-main.is-disabled{background:#aaa297!important;cursor:not-allowed}
@media (min-width:640px){.paper-download-card{flex-direction:row;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px}.download-action{align-self:center}}
html.dark .paper-download-card{background:#25231f;border-color:#494238;box-shadow:none}html.dark .download-filetype{background:#302d27;border-color:#50493e;color:#c8beae}html.dark .download-head strong{color:#e9e2d7}html.dark .download-head small{color:#a69b8c}html.dark .download-code{background:#2d2a25;border-color:#4d463b;color:#bcb2a4}html.dark .download-code b{color:#eee6da}

.paper-hide-lock{position:relative;max-width:448px;margin:24px auto;padding:20px;text-align:center;border:2px dashed #d5c7b2;border-radius:16px;background:#f8f3ea;color:#6f6457;transition:opacity .18s ease,transform .18s ease}.hide-lock-badge{display:grid;place-items:center;width:34px;height:34px;margin:0 auto 8px;border:1px solid #dfd2bd;border-radius:50%;background:#fffaf2;font-size:15px}.paper-hide-lock>strong{display:block;color:#403931;font-size:13px}.paper-hide-lock>p{margin:4px 0 12px!important;color:#918474;font-size:11.5px}.hide-lock-form{display:flex;max-width:360px;height:36px;margin:0 auto}.hide-lock-form input{min-width:0;flex:1;height:36px;padding:0 11px;border:1px solid #d9ccba;border-right:0;border-radius:999px 0 0 999px;background:#fffdf9;color:#3f3932;font-size:12px;outline:none}.hide-lock-form input:focus{position:relative;z-index:1;border-color:#8baa91;box-shadow:0 0 0 3px rgba(78,139,110,.10)}.hide-lock-form button{flex:0 0 auto;height:36px;padding:0 14px;border:1px solid #4e8b6e;border-radius:0 999px 999px 0;background:#4e8b6e;color:#fff;font-size:12px;font-weight:650;cursor:pointer}.hide-lock-form button:hover{background:#3d7058;border-color:#3d7058}.hide-lock-form button:disabled{opacity:.6;cursor:wait}.hide-lock-status{display:block;min-height:15px;margin-top:7px;color:#b56555;font-size:11px}.paper-hide-lock.is-unlocking{opacity:0;transform:translateY(-4px)}.paper-hide-lock.is-shake{animation:paperHideShake .3s ease}.paper-hide-revealed{animation:paperHideReveal .28s ease}
@keyframes paperHideShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}@keyframes paperHideReveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
html.dark .paper-hide-lock{background:#201e1c;border-color:#564d42;color:#aaa093}html.dark .hide-lock-badge{background:#2b2823;border-color:#4e463c}html.dark .paper-hide-lock>strong{color:#e8e0d4}html.dark .hide-lock-form input{background:#292621;border-color:#4e463c;color:#eee7dc}

.paper-toast{position:fixed;z-index:9999;left:50%;bottom:28px;transform:translate(-50%,10px);padding:8px 13px;border:1px solid rgba(226,218,205,.9);border-radius:8px;background:rgba(50,46,40,.88);color:#fff;font-size:12px;opacity:0;pointer-events:none;transition:.18s ease;backdrop-filter:blur(8px)}.paper-toast.is-visible{opacity:1;transform:translate(-50%,0)}

.editor-download-grid,.editor-hide-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.editor-field-wide{grid-column:1/-1}.editor-field-wide textarea{min-height:150px}.media-upload-btn[data-pick="gallery"]{border-color:#d6c7b1;background:#fbf7ef}
@media (max-width:640px){.editor-download-grid,.editor-hide-fields{grid-template-columns:1fr}.editor-field-wide{grid-column:auto}.paper-download-card{padding:16px 14px}.download-main{width:100%}.paper-gallery{column-gap:12px}.paper-photo-card{margin-bottom:12px}.paper-hide-lock{padding:18px 14px}.hide-lock-form{max-width:100%}}

/* ================================================================
   2026-08-23 v19 — flat gallery / download / hide simplification
   ================================================================ */
/* Gallery: image-only masonry. No card frame, paper backing, title or date. */
.paper-gallery{column-gap:14px;margin:18px auto;max-width:1100px}
.paper-photo-card{break-inside:avoid;margin:0 0 14px;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible;transition:transform .18s ease}
.paper-photo-card:hover{transform:translateY(-2px);box-shadow:none!important}
.paper-photo-link{display:block;border:0!important;background:transparent!important;text-decoration:none!important;outline:none}
.paper-photo-image{display:block;width:100%;height:auto;border:0;border-radius:8px;object-fit:cover;background:transparent;box-shadow:none;transition:opacity .18s ease,transform .18s ease}
.paper-photo-card:hover .paper-photo-image{filter:none;opacity:.965}
.paper-photo-meta{display:none!important}
html.dark .paper-photo-card,html.dark .paper-photo-card:hover{background:transparent!important;border:0!important;box-shadow:none!important}

/* Download: one flat horizontal row; codes live in the middle, no tape/shadow. */
.paper-download-card{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:18px;margin:22px 0;padding:14px 16px;background:rgba(255,253,249,.55);border:1px solid #e9e0d3;border-radius:12px;box-shadow:none}
.download-left{min-width:0}.download-head{gap:10px}.download-filetype{width:42px;height:42px;flex-basis:42px;border-radius:9px;background:#f7f2ea}.download-head strong{font-size:13.5px}.download-head small{margin-top:2px;font-size:10.5px}
.download-codes{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:0}
.download-code{padding:6px 9px;border:1px solid #e2d8c9;border-radius:8px;background:transparent;font-size:10.5px;box-shadow:none}.download-code span{color:#817668}.download-code em{display:none}.download-code:hover{background:#f7f2ea;border-color:#cfc2af}
.download-action{justify-self:end}.download-main{min-width:132px;min-height:38px;padding:0 20px;border-radius:9px;box-shadow:none;transform:none!important}
html.dark .paper-download-card{background:rgba(37,35,31,.45);border-color:#413c35;box-shadow:none}html.dark .download-code{background:transparent;border-color:#4a433a}

/* Hide: only the joined password control remains. No outer card, tape, title or hint line. */
.paper-hide-lock{max-width:430px;margin:20px auto;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#6f6457;text-align:left}
.hide-lock-form{display:flex;align-items:center;width:100%;max-width:430px;height:38px;margin:0;border:1px solid #d9ccba;border-radius:10px;background:#fffdf9;overflow:hidden;box-shadow:none}
.hide-lock-badge{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;margin:0;border:0;border-right:1px solid #e2d7c6;border-radius:0;background:transparent;font-size:14px}
.hide-lock-form input{min-width:0;flex:1;height:38px;padding:0 11px;border:0!important;border-radius:0!important;background:transparent!important;color:#3f3932;font-size:12px;outline:none;box-shadow:none!important}
.hide-lock-form input:focus{box-shadow:none!important}.hide-lock-form:focus-within{border-color:#9fb6a5;box-shadow:0 0 0 3px rgba(78,139,110,.08)}
.hide-lock-form button{height:38px;padding:0 14px;border:0;border-left:1px solid #4e8b6e;border-radius:0;background:#4e8b6e;color:#fff;font-size:11.5px;font-weight:650}
.hide-lock-form button:hover{background:#3d7058}.hide-lock-status{display:block;min-height:14px;margin:5px 0 0;text-align:center;font-size:10.5px}
html.dark .paper-hide-lock{background:transparent!important;border:0!important}html.dark .hide-lock-form{background:#292621;border-color:#4e463c}html.dark .hide-lock-badge{background:transparent;border-right-color:#4e463c}html.dark .hide-lock-form input{background:transparent!important;color:#eee7dc}

@media (max-width:760px){.paper-download-card{grid-template-columns:1fr;gap:12px;padding:14px}.download-codes{justify-content:flex-start}.download-action{justify-self:stretch}.download-main{width:100%}.paper-gallery{column-gap:10px}.paper-photo-card{margin-bottom:10px}.paper-hide-lock{max-width:100%}.hide-lock-form{max-width:100%}}

/* ================================================================
   2026-08-23 v20 — mobile download card compact layout
   ================================================================ */
@media (max-width:760px){
  .paper-download-card{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "info action"
      "codes codes";
    align-items:center;
    gap:9px 10px;
    margin:18px 0;
    padding:11px 12px;
    border-radius:11px;
  }
  .download-left{grid-area:info;min-width:0}
  .download-head{gap:9px}
  .download-filetype{
    width:38px;
    height:38px;
    flex-basis:38px;
    border-radius:8px;
    font-size:9px;
  }
  .download-head strong{font-size:13px;line-height:1.25}
  .download-head small{margin-top:1px;font-size:10px;line-height:1.2}
  .download-action{grid-area:action;justify-self:end}
  .download-main{
    width:auto;
    min-width:0;
    min-height:34px;
    padding:0 11px;
    border-radius:8px;
    font-size:11px;
    gap:5px;
  }
  .download-codes{
    grid-area:codes;
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:6px;
    min-width:0;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .download-codes::-webkit-scrollbar{display:none}
  .download-code{
    flex:0 0 auto;
    padding:4px 7px;
    border-radius:7px;
    font-size:10px;
    line-height:1.1;
  }
}

/* 2026-08-25 modern CMS admin/editor layer -------------------------------- */
.cms-editor-btn{display:inline-flex;min-width:2rem;height:2rem;align-items:center;justify-content:center;border:0;border-radius:.45rem;background:transparent;padding:0 .55rem;color:#64748b;font-size:.75rem;font-weight:600;transition:.15s ease;cursor:pointer}.cms-editor-btn:hover,.cms-editor-btn.is-active{background:#f1f5f9;color:#0f172a}.cms-editor-btn.is-active{box-shadow:inset 0 0 0 1px #e2e8f0}.dark .cms-editor-btn{color:#94a3b8}.dark .cms-editor-btn:hover,.dark .cms-editor-btn.is-active{background:#1e293b;color:#f8fafc}.dark .cms-editor-btn.is-active{box-shadow:inset 0 0 0 1px #334155}
.cms-tiptap-shell{min-height:640px;background:#fff}.dark .cms-tiptap-shell{background:#0f172a}.cms-tiptap{min-height:640px;padding:2rem 3rem 6rem;outline:none;color:#334155;font-size:16px;line-height:1.82}.dark .cms-tiptap{color:#cbd5e1}@media(max-width:640px){.cms-tiptap{padding:1.5rem 1.25rem 4rem;min-height:520px}.cms-tiptap-shell{min-height:520px}}
.cms-tiptap p{margin:0 0 1.05em}.cms-tiptap h2{margin:1.7em 0 .65em;color:#0f172a;font-size:1.55rem;line-height:1.35;font-weight:700;letter-spacing:-.02em}.cms-tiptap h3{margin:1.5em 0 .55em;color:#0f172a;font-size:1.2rem;line-height:1.4;font-weight:700}.dark .cms-tiptap h2,.dark .cms-tiptap h3{color:#f8fafc}.cms-tiptap ul{margin:1em 0;padding-left:1.4rem;list-style:disc}.cms-tiptap ol{margin:1em 0;padding-left:1.4rem;list-style:decimal}.cms-tiptap blockquote{margin:1.4rem 0;border-left:3px solid #cbd5e1;padding:.15rem 0 .15rem 1rem;color:#64748b}.dark .cms-tiptap blockquote{border-color:#475569;color:#94a3b8}.cms-tiptap a{color:#4f46e5;text-decoration:underline;text-underline-offset:3px}.cms-tiptap img{max-width:100%;border-radius:.75rem}.cms-tiptap pre{overflow:auto;margin:1.4rem 0;border-radius:.75rem;background:#0f172a;padding:1rem 1.1rem;color:#e2e8f0;font:500 .86rem/1.7 ui-monospace,SFMono-Regular,Menlo,monospace}.cms-tiptap code:not(pre code){border-radius:.35rem;background:#f1f5f9;padding:.12rem .3rem;color:#334155;font-size:.9em}.dark .cms-tiptap code:not(pre code){background:#1e293b;color:#cbd5e1}.cms-tiptap p.is-editor-empty:first-child::before{content:attr(data-placeholder);float:left;height:0;pointer-events:none;color:#cbd5e1}.dark .cms-tiptap p.is-editor-empty:first-child::before{color:#475569}
.cms-shortcode-node{margin:1rem 0;border:1px solid #c7d2fe;border-radius:.65rem;background:#eef2ff;padding:.7rem .85rem;color:#4338ca;font-size:.8rem;font-weight:650;cursor:default;user-select:none}.dark .cms-shortcode-node{border-color:#3730a3;background:#1e1b4b;color:#c7d2fe}
.cms-insert-chip{display:inline-flex;height:2rem;align-items:center;border:1px solid #e2e8f0;border-radius:.5rem;background:#fff;padding:0 .65rem;color:#64748b;font-size:.72rem;font-weight:600;transition:.15s;cursor:pointer}.cms-insert-chip:hover{border-color:#cbd5e1;background:#f8fafc;color:#0f172a}.dark .cms-insert-chip{border-color:#334155;background:#0f172a;color:#94a3b8}.dark .cms-insert-chip:hover{background:#1e293b;color:#f8fafc}
.cms-inspector-card{border:1px solid rgba(226,232,240,.9);border-radius:.75rem;background:#fff;padding:1rem;box-shadow:0 1px 2px rgba(15,23,42,.03)}.dark .cms-inspector-card{border-color:#1e293b;background:#0f172a}.cms-inspector-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.cms-inspector-heading h2{color:#0f172a;font-size:.875rem;font-weight:650}.cms-inspector-heading p{margin-top:.125rem;color:#94a3b8;font-size:.72rem}.dark .cms-inspector-heading h2{color:#f8fafc}.cms-field-label{display:block;margin-bottom:.38rem;color:#64748b;font-size:.71rem;font-weight:600}.dark .cms-field-label{color:#94a3b8}.cms-field-control{display:block;width:100%;height:2.45rem;border:1px solid #e2e8f0;border-radius:.5rem;background:#fff;padding:0 .7rem;color:#334155;font-size:.8rem;outline:0;transition:.15s;box-shadow:none}.cms-field-control:focus{border-color:#818cf8;box-shadow:0 0 0 3px rgba(99,102,241,.09)}.dark .cms-field-control{border-color:#334155;background:#020617;color:#e2e8f0}.cms-media-action{display:inline-flex;min-height:2.35rem;align-items:center;justify-content:center;border:1px solid #e2e8f0;border-radius:.5rem;background:#fff;padding:.35rem .6rem;color:#64748b;font-size:.72rem;font-weight:600;transition:.15s}.cms-media-action:hover{border-color:#cbd5e1;background:#f8fafc;color:#0f172a}.dark .cms-media-action{border-color:#334155;background:#020617;color:#94a3b8}.dark .cms-media-action:hover{background:#1e293b;color:#fff}
/* Normalize the legacy media workspace controls inside the new inspector. */
.cms-inspector-card .media-workspace-tabs{display:flex;gap:.35rem;margin-top:.5rem;padding-bottom:.55rem;border-bottom:1px solid #e2e8f0}.cms-inspector-card .media-workspace-tab{min-height:2rem;padding:0 .55rem;border:1px solid transparent;border-radius:.45rem;background:transparent;color:#64748b;font-size:.7rem;font-weight:650}.cms-inspector-card .media-workspace-tab:hover{background:#f8fafc}.cms-inspector-card .media-workspace-tab.is-active{border-color:#e2e8f0;background:#f8fafc;color:#0f172a;box-shadow:none}.cms-inspector-card .media-workspace-tab b{display:inline-flex;min-width:1rem;height:1rem;align-items:center;justify-content:center;margin-left:.2rem;border-radius:99px;background:#e2e8f0;color:#64748b;font-size:.58rem}.cms-inspector-card .media-workspace-pane{padding-top:.7rem}.cms-inspector-card .media-pane-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.55rem}.cms-inspector-card .media-pane-head strong{display:block;color:#334155;font-size:.75rem}.cms-inspector-card .media-pane-head small{display:block;margin-top:.1rem;color:#94a3b8;font-size:.62rem}.cms-inspector-card .media-add-btn{border:0;border-radius:.45rem;background:#eef2ff;padding:.42rem .55rem;color:#4f46e5;font-size:.65rem;font-weight:650}.cms-inspector-card .workspace-audio-empty{padding:.7rem;border:1px dashed #cbd5e1;border-radius:.5rem;background:#f8fafc;color:#94a3b8;font-size:.67rem}.cms-inspector-card .workspace-audio-card{padding:.65rem;border:1px solid #e2e8f0;border-radius:.55rem;background:#f8fafc}.cms-inspector-card .workspace-audio-grid{grid-template-columns:1fr}.cms-inspector-card .workspace-audio-grid label.wide{grid-column:auto}.cms-inspector-card .workspace-audio-grid input{height:2.1rem;border-color:#e2e8f0;border-radius:.45rem;background:#fff;color:#334155}.dark .cms-inspector-card .media-workspace-tabs{border-color:#334155}.dark .cms-inspector-card .media-workspace-tab{color:#94a3b8}.dark .cms-inspector-card .media-workspace-tab:hover,.dark .cms-inspector-card .media-workspace-tab.is-active{border-color:#334155;background:#1e293b;color:#fff}.dark .cms-inspector-card .media-pane-head strong{color:#e2e8f0}.dark .cms-inspector-card .workspace-audio-empty,.dark .cms-inspector-card .workspace-audio-card{border-color:#334155;background:#020617}.dark .cms-inspector-card .workspace-audio-grid input{border-color:#334155;background:#0f172a;color:#e2e8f0}
/* Modernize existing dialogs without changing their business logic. */
.editor-modal{background:rgba(15,23,42,.35);backdrop-filter:blur(3px)}.editor-modal-card{border:1px solid #e2e8f0!important;border-radius:14px!important;background:#fff!important;box-shadow:0 24px 70px rgba(15,23,42,.18)!important}.editor-modal-heading small{color:#6366f1!important}.editor-modal-heading h2{color:#0f172a!important;letter-spacing:-.02em}.editor-modal-heading p,.editor-modal-fields label{color:#64748b!important}.editor-modal-close{background:#f1f5f9!important;color:#64748b!important}.editor-callout-types button,.editor-audio-row,.editor-permission-option{border-color:#e2e8f0!important;background:#f8fafc!important;color:#475569!important}.editor-callout-types button.is-active,.editor-permission-option.is-selected{border-color:#c7d2fe!important;background:#eef2ff!important;color:#4338ca!important}.editor-action-primary{background:#4f46e5!important;border-color:#4f46e5!important;color:#fff!important}.editor-action-secondary{border-color:#e2e8f0!important;background:#fff!important;color:#475569!important}.dark .editor-modal-card{border-color:#334155!important;background:#0f172a!important}.dark .editor-modal-heading h2{color:#f8fafc!important}.dark .editor-modal-heading p,.dark .editor-modal-fields label{color:#94a3b8!important}.dark .editor-modal-close{background:#1e293b!important;color:#94a3b8!important}.dark .editor-callout-types button,.dark .editor-audio-row,.dark .editor-permission-option{border-color:#334155!important;background:#020617!important;color:#cbd5e1!important}.dark .editor-action-secondary{border-color:#334155!important;background:#0f172a!important;color:#cbd5e1!important}

/* 2026-08-25: pure source Vditor editor ---------------------------------- */
.cms-vditor-source .vditor {
  border: 0;
  border-radius: 0;
  background: transparent;
}
.cms-vditor-source .vditor-toolbar {
  position: sticky;
  top: 104px;
  z-index: 20;
  min-height: 44px;
  padding: 6px 14px;
  border: 0;
  border-bottom: 1px solid #f1f5f9;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(12px);
}
.cms-vditor-source .vditor-toolbar__item {
  margin: 0 1px;
}
.cms-vditor-source .vditor-toolbar__item button {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  color: #64748b;
}
.cms-vditor-source .vditor-toolbar__item button:hover,
.cms-vditor-source .vditor-toolbar__item button:focus {
  background: #f1f5f9;
  color: #0f172a;
}
.cms-vditor-source .vditor-toolbar__divider {
  height: 18px;
  margin: 6px 5px;
  border-left-color: #e2e8f0;
}
.cms-vditor-source .vditor-content {
  min-height: 620px;
  background: transparent;
}
/* sv is retained only for its raw Markdown editing engine. Preview is
   forcibly removed, including if an upstream default changes. */
.cms-vditor-source .vditor-sv__preview,
.cms-vditor-source .vditor-preview,
.cms-vditor-source .vditor-ir,
.cms-vditor-source .vditor-wysiwyg {
  display: none !important;
}
.cms-vditor-source .vditor-sv {
  display: block !important;
  width: 100% !important;
  min-height: 620px;
  background: transparent;
}
.cms-vditor-source .vditor-sv__editor {
  width: 100% !important;
  min-height: 620px;
  padding: 26px 32px 72px !important;
  border: 0 !important;
  background: transparent !important;
  color: #1e293b;
  font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size: 14px;
  line-height: 1.8;
  caret-color: #4f46e5;
}
.cms-vditor-source .vditor-sv__editor:focus {
  outline: none;
}
.cms-vditor-source .vditor-counter {
  display: none !important;
}
.dark .cms-vditor-source .vditor,
.dark .cms-vditor-source .vditor-content,
.dark .cms-vditor-source .vditor-sv {
  background: transparent !important;
}
.dark .cms-vditor-source .vditor-toolbar {
  border-bottom-color: #1e293b;
  background: rgba(15,23,42,.96);
}
.dark .cms-vditor-source .vditor-toolbar__item button {
  color: #94a3b8;
}
.dark .cms-vditor-source .vditor-toolbar__item button:hover,
.dark .cms-vditor-source .vditor-toolbar__item button:focus {
  background: #1e293b;
  color: #f8fafc;
}
.dark .cms-vditor-source .vditor-toolbar__divider {
  border-left-color: #334155;
}
.dark .cms-vditor-source .vditor-sv__editor {
  color: #e2e8f0;
  caret-color: #818cf8;
}
@media (max-width: 767px) {
  .cms-vditor-source .vditor-toolbar {
    top: 104px;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .cms-vditor-source .vditor-sv__editor {
    padding: 22px 20px 56px !important;
  }
}
/* Vditor 3.x uses .vditor-sv itself as the source editing surface. */
.cms-vditor-source .vditor-sv {
  box-sizing: border-box;
  padding: 26px 32px 72px !important;
  overflow: auto;
  color: #1e293b;
  font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size: 14px;
  line-height: 1.8;
  caret-color: #4f46e5;
}
.cms-vditor-source .vditor-sv pre,
.cms-vditor-source .vditor-sv code {
  font: inherit;
}
.dark .cms-vditor-source .vditor-sv {
  color: #e2e8f0;
  caret-color: #818cf8;
}
@media (max-width: 767px) {
  .cms-vditor-source .vditor-sv { padding: 22px 20px 56px !important; }
}

/* 2026-08-25 editor media/modal balance refactor */
[x-cloak]{display:none!important}
.cms-extension-item{display:grid;width:100%;grid-template-columns:1.5rem minmax(0,1fr);align-items:center;gap:.55rem;border:0;border-radius:.55rem;background:transparent;padding:.55rem .6rem;text-align:left;color:#475569;transition:.14s;cursor:pointer}.cms-extension-item:hover{background:#f8fafc;color:#0f172a}.cms-extension-item>span:first-child{display:grid;height:1.5rem;width:1.5rem;place-items:center;border-radius:.4rem;background:#f1f5f9;color:#64748b;font-size:.72rem}.cms-extension-item>span:last-child{min-width:0;display:grid;gap:.05rem}.cms-extension-item b{font-size:.72rem;font-weight:650}.cms-extension-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#94a3b8;font-size:.61rem;font-weight:500}.dark .cms-extension-item{color:#cbd5e1}.dark .cms-extension-item:hover{background:#1e293b;color:#fff}.dark .cms-extension-item>span:first-child{background:#0f172a;color:#94a3b8}
#media-workspace .media-workspace-tabs{display:flex;gap:.35rem;margin-top:0;padding-bottom:.7rem;border-bottom:1px solid #e2e8f0}#media-workspace .media-workspace-tab{min-height:2.15rem;padding:0 .7rem;border:1px solid transparent;border-radius:.5rem;background:transparent;color:#64748b;font-size:.72rem;font-weight:650;cursor:pointer}#media-workspace .media-workspace-tab:hover{background:#f8fafc}#media-workspace .media-workspace-tab.is-active{border-color:#e2e8f0;background:#f8fafc;color:#0f172a}#media-workspace .media-workspace-tab b{display:inline-flex;min-width:1rem;height:1rem;align-items:center;justify-content:center;margin-left:.2rem;border-radius:99px;background:#e2e8f0;color:#64748b;font-size:.58rem}#media-workspace .media-workspace-pane{padding-top:1rem}#media-workspace .media-pane-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}#media-workspace .media-pane-head strong{display:block;color:#334155;font-size:.8rem}#media-workspace .media-pane-head small{display:block;margin-top:.1rem;color:#94a3b8;font-size:.63rem}#media-workspace .media-add-btn{border:0;border-radius:.5rem;background:#eef2ff;padding:.5rem .65rem;color:#4f46e5;font-size:.68rem;font-weight:650;cursor:pointer}#media-workspace .workspace-audio-empty{padding:1.2rem;border:1px dashed #cbd5e1;border-radius:.65rem;background:#f8fafc;color:#94a3b8;font-size:.7rem;text-align:center}#media-workspace .workspace-audio-list{display:grid;gap:.65rem}#media-workspace .workspace-audio-card{padding:.8rem;border:1px solid #e2e8f0;border-radius:.7rem;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.03);transition:.15s}#media-workspace .workspace-audio-card.is-dragging{opacity:.5;transform:scale(.99)}#media-workspace .workspace-audio-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}#media-workspace .workspace-audio-drag{display:flex;align-items:center;gap:.45rem;color:#94a3b8;font-size:.75rem;cursor:grab;user-select:none}#media-workspace .workspace-audio-drag strong{color:#475569;font-size:.72rem}#media-workspace .workspace-audio-card-head>button{border:0;background:transparent;color:#e11d48;font-size:.65rem;cursor:pointer}#media-workspace .workspace-audio-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}#media-workspace .workspace-audio-grid label{display:grid;gap:.28rem;color:#64748b;font-size:.62rem}#media-workspace .workspace-audio-grid input{width:100%;height:2.2rem;padding:0 .65rem;border:1px solid #e2e8f0;border-radius:.5rem;background:#fff;color:#334155;font-size:.7rem;outline:0}#media-workspace .workspace-audio-grid input:focus{border-color:#818cf8;box-shadow:0 0 0 2px rgba(99,102,241,.1)}.dark #media-workspace .media-workspace-tabs{border-color:#334155}.dark #media-workspace .media-workspace-tab{color:#94a3b8}.dark #media-workspace .media-workspace-tab:hover,.dark #media-workspace .media-workspace-tab.is-active{border-color:#334155;background:#1e293b;color:#fff}.dark #media-workspace .workspace-audio-empty,.dark #media-workspace .workspace-audio-card{border-color:#334155;background:#020617}.dark #media-workspace .workspace-audio-drag strong{color:#e2e8f0}.dark #media-workspace .workspace-audio-grid label{color:#94a3b8}.dark #media-workspace .workspace-audio-grid input{border-color:#334155;background:#0f172a;color:#e2e8f0}@media(max-width:700px){#media-workspace .workspace-audio-grid{grid-template-columns:1fr}}


/* =========================================================
   2026-08-25 Admin article-list typography normalization
   Balanced CJK/Latin metrics, predictable row weight, truncation.
   ========================================================= */
.admin-ui {
  font-family: var(--font-ui) !important;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern" 1, "liga" 1;
}
.admin-ui #post-table-body tr {
  font-weight: 400;
}
.admin-ui #post-table-body td {
  line-height: 1.45;
}
.admin-ui #post-table-body td:nth-child(2) a {
  font-family: var(--font-ui) !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em;
  text-decoration: none;
  font-synthesis-weight: none;
}
.admin-ui #post-table-body td:nth-child(2) a:visited {
  color: inherit;
}
.admin-ui #post-table-body td:nth-child(4) {
  font-weight: 400;
}
.admin-ui #post-table-body td:nth-child(5) {
  font-family: var(--font-mono) !important;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "zero" 1;
}
.admin-ui .pin-action,
.admin-ui #post-table-body td:last-child a,
.admin-ui #post-table-body td:last-child button {
  font-weight: 500;
}
.admin-ui .pin-action.is-pinned {
  font-weight: 500 !important;
}