:root { color-scheme: light; }

.reading { overflow-wrap: anywhere; }
.prose { white-space: pre-wrap; }
.article-images { margin-top: 1.5rem; }
.article-images figure { margin: 1rem 0; }
.article-images a { display: block; }
.article-images img { display: block; max-width: 100%; height: auto; }
.article-tags { display: flex; flex-wrap: wrap; gap: 0 1rem; margin-top: 1.25rem; font-size: .85rem; }
.article-tags a { display: inline-block; max-width: 100%; min-height: 44px; padding: 10px 0; line-height: 1.8; overflow-wrap: anywhere; }
.tag-heading { margin-bottom: 1.25rem; }
.tag-heading h1 { margin: 0; overflow-wrap: anywhere; }
.tag-heading p { display: flex; flex-wrap: wrap; align-items: center; column-gap: 1rem; font-size: .85rem; color: var(--muted); }
.tag-heading a { display: inline-block; min-height: 44px; padding: 10px 0; line-height: 1.8; }
.reader-footer { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; column-gap: 1.25rem; }
.reader-footer .copyright { flex: 1 1 10rem; min-width: 0; overflow-wrap: anywhere; }
.reader-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0 .65rem; max-width: 100%; }
.reader-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 0; font: inherit; white-space: nowrap; }
.about-copy { font-size: 1rem; line-height: 1.95; margin: 1em 0; white-space: pre-wrap; }

/* Plain follows the original document-style prototype. */
[data-theme="plain"] {
  --ink: #222;
  --muted: #666;
  --link: #205d91;
}
[data-theme="plain"] * { box-sizing: border-box; }
[data-theme="plain"] body {
  margin: 0;
  background: #fff;
  color: var(--ink);
  font: 16px/1.75 "Noto Sans CJK SC", "PingFang SC", "Microsoft YaHei", sans-serif;
}
[data-theme="plain"] .reading { max-width: 42rem; margin: 2.5rem auto; padding: 0 1rem; }
[data-theme="plain"] a { color: var(--link); text-decoration: underline; text-underline-offset: 2px; }
[data-theme="plain"] a:hover { color: #102f49; }
[data-theme="plain"] a:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
[data-theme="plain"] h1 { font-size: 1.5rem; line-height: 1.4; margin: 1.2rem 0 .7rem; }
[data-theme="plain"] p { margin: .7rem 0; }
[data-theme="plain"] .site-header { margin-bottom: 1.5rem; }
[data-theme="plain"] .home-header { margin-bottom: 1rem; }
[data-theme="plain"] nav { line-height: 1.9; }
[data-theme="plain"] time { color: var(--muted); font-variant-numeric: tabular-nums; }
[data-theme="plain"] .plain-post-list { list-style: none; padding: 0; margin: 1rem 0; }
[data-theme="plain"] .plain-post-list li { margin: .55rem 0; line-height: 1.7; }
[data-theme="plain"] .plain-post-list time { font-size: .85rem; margin-right: .75em; white-space: nowrap; }
[data-theme="plain"] .article-date { color: var(--muted); font-size: .85rem; }
[data-theme="plain"] article > h1 { font-size: 1.6rem; line-height: 1.5; }
[data-theme="plain"] .prose { line-height: 1.95; white-space: normal; }
[data-theme="plain"] .prose p { white-space: pre-wrap; margin: 1em 0; }
[data-theme="plain"] .back { margin-top: 1.5rem; font-size: .9rem; }
[data-theme="plain"] .empty { color: var(--muted); margin: 1.5rem 0; }
[data-theme="plain"] .reader-footer { border-top: 1px solid #ddd; margin-top: 2rem; padding-top: .7rem; color: var(--muted); font-size: .75rem; line-height: 1.8; }
[data-theme="plain"] .reader-footer p { margin: .3rem 0; }

@media (max-width: 600px) {
  [data-theme="plain"] .reading { margin: 1rem auto 2rem; }
  [data-theme="plain"] .site-header { margin-bottom: 1.2rem; }
  [data-theme="plain"] .home-header { margin-bottom: 1rem; }
  [data-theme="plain"] h1 { font-size: 1.4rem; }
  [data-theme="plain"] article > h1 { font-size: 1.5rem; }
  [data-theme="plain"] .plain-post-list time { display: block; font-size: .8rem; }
  [data-theme="plain"] .plain-post-list li { margin: .8rem 0; }
}

[data-theme="warm"] {
  --paper: #f8f7f3;
  --ink: #383d35;
  --muted: #8b8c80;
  --rule: #e2e2d8;
  --link: #5d7051;
}
[data-theme="warm"] * { box-sizing: border-box; }
[data-theme="warm"] body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Georgia, "Noto Serif CJK SC", "Songti SC", serif;
  -webkit-font-smoothing: antialiased;
}
[data-theme="warm"] .reading {
  max-width: 680px;
  margin: 0 auto;
  padding: 58px 24px 32px;
}
[data-theme="warm"] a { color: var(--link); text-underline-offset: 4px; }
[data-theme="warm"] .site-header {
  border-bottom: 1px solid var(--rule);
  padding-bottom: 26px;
  margin-bottom: 36px;
}
[data-theme="warm"] .site-name { margin: 0; font: inherit; }
[data-theme="warm"] .site-title {
  font-size: 27px;
  letter-spacing: .08em;
  text-decoration: none;
  font-weight: 700;
}
[data-theme="warm"] .site-header > p:not(.site-name) {
  font-size: 14px;
  line-height: 1.7;
  color: var(--muted);
  margin: 12px 0 0;
}
[data-theme="warm"] article > h1 {
  font-size: 27px;
  font-weight: 500;
  line-height: 1.55;
  margin: 0 0 12px;
}
[data-theme="warm"] time { font: 12px/1.5 ui-monospace, monospace; color: var(--muted); }
[data-theme="warm"] .prose { font-size: 17px; line-height: 1.95; margin-top: 28px; }
[data-theme="warm"] .post-item {
  padding: 4px 0 30px;
  margin: 0 0 25px;
  border-bottom: 1px solid var(--rule);
}
[data-theme="warm"] .post-item h2 { font-size: 18px; line-height: 1.6; margin: 6px 0 8px; }
[data-theme="warm"] .post-item h2 a { text-decoration: none; }
[data-theme="warm"] .post-item h2 a:hover { text-decoration: underline; }
[data-theme="warm"] .post-item p { font-size: 14px; line-height: 1.8; color: #696965; margin: 0; }
[data-theme="warm"] .tag-heading h1 { font-size: 27px; font-weight: 500; line-height: 1.55; }
[data-theme="warm"] .tag-heading p { margin: 8px 0 0; }
[data-theme="warm"] .empty { color: var(--muted); font-size: 15px; line-height: 1.8; padding: 24px 0 65px; }
[data-theme="warm"] .back { margin-top: 44px; font-size: 14px; }
[data-theme="warm"] .back p { margin: 0; }
[data-theme="warm"] .reader-footer { margin-top: 56px; font-size: 12px; color: var(--muted); }
[data-theme="warm"] .reader-footer p { margin: 0; }
[data-theme="warm"] .reader-footer a { text-decoration: none; }
[data-theme="warm"] .reader-footer a:hover { text-decoration: underline; }
[data-theme="warm"] a:focus-visible { outline: 2px solid var(--link); outline-offset: 5px; }

@media (max-width: 480px) {
  [data-theme="warm"] .reading { padding: 36px 22px 30px; }
  [data-theme="warm"] .site-header { margin-bottom: 28px; }
  [data-theme="warm"] article > h1 { font-size: 24px; }
}
