.pagination { display:flex; justify-content:center; align-items:center; gap:24px; margin:32px 0; }
.pagination a { padding:12px 20px; background:#075844; color:#fff; border-radius:6px; }
.pagination [aria-disabled] { color:#727b77; }
.archive-empty { padding:24px 0; }
.mdx-article { background:#fff; padding:clamp(20px,4vw,48px); max-width:860px; margin:auto; }
.mdx-article h1 { font-size:clamp(24px,4vw,36px); line-height:1.6; }
.mdx-article h2 { margin:40px 0 18px; font-size:24px; }
.mdx-article h3 { margin:28px 0 14px; font-size:20px; }
.mdx-article p { margin:20px 0; line-height:1.9; }
.mdx-article img { max-width:100%; height:auto; }
.mdx-article .cline-article-toc { padding:20px; margin:32px 0; background:#f5f7fa; border:1px solid #d8dee8; border-radius:8px; font-size:16px; line-height:1.8; overflow-wrap:anywhere; }
.mdx-article .cline-article-toc > b { display:block; margin:0 0 16px; color:var(--green, #075844); font-size:18px; font-weight:700; }
.mdx-article .cline-article-toc ol { padding-left:24px; margin:10px 0 0; list-style:decimal; }
.mdx-article .cline-article-toc li { padding-left:4px; margin:8px 0; }
.mdx-article .cline-article-toc li::marker { color:var(--green, #075844); font-weight:700; }
.mdx-article .cline-article-toc a { color:#0000ee; text-decoration:none; }
.mdx-article .cline-article-toc a:hover { text-decoration:underline; text-underline-offset:3px; }
.mdx-article .cline-article-toc a:focus-visible { outline:2px solid var(--green, #075844); outline-offset:3px; }
.mdx-alert { border-left:4px solid #075844; padding:16px; background:#f0f7f3; }
.mdx-native-article > header h1 { font-size:clamp(20px,4vw,28px); font-weight:800; line-height:1.6; }
.mdx-article-header { padding-bottom:24px; margin-bottom:28px; border-bottom:2px solid var(--green, #075844); }
.mdx-article-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; margin-top:20px; color:#666; font-size:13px; line-height:1.8; }
.mdx-article-date { display:inline-flex; flex-wrap:wrap; column-gap:4px; }
.mdx-article-meta .mdx-article-category, .mdx-article-tags a { display:inline-block; padding:4px 14px; border:1px solid #d5e1d1; border-radius:8px; background:#f1f6ef; color:var(--green, #075844); font-size:13px; font-weight:700; line-height:1.8; text-decoration:none; overflow-wrap:anywhere; }
.mdx-article-author a { color:var(--green, #075844); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.mdx-article-tags { display:flex; flex-wrap:wrap; gap:10px; margin:32px 0; padding-top:24px; border-top:1px solid #d5e1d1; }
.mdx-article-meta .mdx-article-category:hover, .mdx-article-tags a:hover { background:#e3eddf; text-decoration:underline; text-underline-offset:3px; }
.mdx-article-meta a:focus-visible, .mdx-article-tags a:focus-visible { outline:2px solid var(--green, #075844); outline-offset:3px; }
.mdx-native-article .article-native { font-size:19px; line-height:2; overflow-wrap:anywhere; }
.article-native > p { margin:0 0 2.2em; font-size:inherit; line-height:inherit; }
.article-native > h2, .article-native > h3 { border-left:4px solid #075844; padding:.75em 1em; background:#eff7f2; font-size:20px; font-weight:900; line-height:1.7; margin:48px 0 2em; border-radius:0 8px 8px 0; scroll-margin-top:28px; }
.article-native > h3 { font-size:18px; margin-top:36px; background:#fff; border-bottom:1px solid #cedbd3; border-radius:0; }
.article-native strong, .article-native b { font-weight:700; }
.article-native > small { display:block; font-size:14px; line-height:1.6; margin:0 0 2.2em; }
.article-native > img { display:block; margin:24px auto 8px; }
.article-native .cline-caption { margin:8px 0 28px; color:#596860; font-size:14px; line-height:1.6; text-align:center; }
.article-native .article-table-scroll { overflow-x:auto; margin:24px 0; }
.article-native table { width:100%; border-collapse:collapse; font-size:17px; line-height:1.8; }
.article-native th, .article-native td { border:1px solid #cedbd3; padding:12px; text-align:left; vertical-align:top; }
.article-native th { background:#eff7f2; }
.article-native > ul, .article-native > ol { padding-left:24px; margin:0 0 2.2em; line-height:2; list-style:disc; }
.article-native > ol { list-style:decimal; }
/* Shared article headings: imported and native articles use the same H3 hierarchy. */
.mdx-article .article-body h3, .cline-review h3 {
  position:relative; border:0; border-bottom:1px solid #cedbd3; border-radius:0;
  padding:12px 0 12px 1.15em; background:transparent; color:#333;
  font-size:18px; font-weight:900; line-height:1.7; margin:36px 0 2em;
}
/* Imported articles may carry the former heading style inline. */
.mdx-article .article-body .wordpress-import h3[style] {
  border-left:0 !important; padding:12px 0 12px 1.15em !important;
  color:#333 !important; font-weight:900 !important; margin:36px 0 2em !important;
}
.mdx-article .article-body h3::before, .cline-review h3::before {
  content:""; position:absolute; left:.25em; top:calc(12px + .7em);
  width:.3em; height:.3em; border-radius:50%; background:var(--green, #075844);
}
/* Restore visible list markers inside AlertBox after the global list reset. */
.mdx-alert > ul { list-style:disc; padding-left:1.25em; margin:12px 0 0; }
.mdx-alert > ul > li { display:list-item; margin:8px 0; padding-left:.2em; line-height:1.8; }
.mdx-alert > ul > li::marker { color:var(--green, #075844); }
.mdx-alert > ul > li > p { margin:0; font-size:inherit; line-height:inherit; }
/* Keep quoted words visually separate from the author's text. */
.mdx-article .article-body blockquote {
  margin:24px 0 2.2em; padding:20px 22px; background:#f5f7f8;
  border:0; border-left:4px solid #94a3b8; border-radius:0 8px 8px 0;
  color:inherit; font-style:normal; overflow-wrap:anywhere;
}
.mdx-article .article-body blockquote p { margin:0 0 12px; font-size:inherit; line-height:inherit; }
.mdx-article .article-body blockquote cite { display:block; font-size:14px; line-height:1.7; color:#596860; font-style:normal; }
.mdx-article .article-body blockquote > :last-child { margin-bottom:0; }
.article-native mark { background:linear-gradient(transparent 55%, #ffe95b 55%); color:inherit; padding:0; }
@media(max-width:600px) { .pagination {gap:10px; font-size:13px;} .pagination a {padding:10px;} }

.archive-item-with-image { display:grid; grid-template-columns:minmax(180px, 280px) minmax(0, 1fr); gap:28px; align-items:start; }
.archive-item[hidden] { display:none; }
.archive-thumbnail { display:block; aspect-ratio:16 / 9; overflow:hidden; border:1px solid #d7dfd5; background:#eff4f0; }
.archive-thumbnail img { display:block; width:100%; height:100%; object-fit:contain; }
.archive-thumbnail-placeholder { display:flex; width:100%; height:100%; align-items:center; justify-content:center; color:#075844; font-size:30px; font-weight:700; }
.archive-copy { min-width:0; }
.archive-thumbnail:focus-visible { outline:3px solid #075844; outline-offset:4px; }
@media(max-width:600px) { .archive-item-with-image { grid-template-columns:1fr; gap:18px; } .archive-meta { flex-wrap:wrap; gap:8px 16px; } }
