/* Blog — main.css の変数・字体・余白に合わせる。ブログのページとトップ（最新の記事）だけが読み込む */

/* ---- 一覧 ---- */
.blog-lead{margin:-12px 0 28px;color:var(--muted);font-size:.84rem;letter-spacing:.04em;}
.blog-search-link{margin-left:18px;}
.post-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.post-item{padding:26px 0;border-bottom:1px solid var(--line);}
.post-date{display:block;font-size:.76rem;letter-spacing:.08em;color:var(--muted);font-variant-numeric:tabular-nums;}
.post-item-title{margin:6px 0 8px;font-size:1.1rem;font-weight:700;line-height:1.55;letter-spacing:.01em;word-break:auto-phrase;}
.post-item-title a{color:var(--ink);}
.post-item-title a:hover{color:var(--accent-ink);text-decoration:none;}
.post-item-desc{margin:0 0 10px;font-size:.9rem;line-height:1.8;color:var(--body);}

.tag-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.tag-list a{display:inline-block;padding:1px 10px;border:1px solid var(--line-2);border-radius:999px;font-size:.72rem;letter-spacing:.04em;color:var(--muted);}
.tag-list a:hover{color:var(--accent-ink);border-color:var(--accent);text-decoration:none;}
.tag-cloud{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px;}
.tag-cloud a{display:inline-flex;align-items:baseline;gap:8px;padding:6px 14px;border:1px solid var(--line-2);border-radius:999px;color:var(--ink);font-size:.86rem;}
.tag-cloud a:hover{border-color:var(--accent);text-decoration:none;}
.tag-count{font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums;}

.pagination{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin-top:40px;font-size:.84rem;}
.page-next{justify-self:end;}
.page-numbers{list-style:none;margin:0;padding:0;display:flex;gap:4px;}
.page-numbers a,.page-numbers span{display:inline-block;min-width:32px;padding:2px 6px;text-align:center;border-radius:var(--radius);font-variant-numeric:tabular-nums;}
.page-numbers [aria-current]{background:var(--accent-soft);color:var(--ink);font-weight:600;}
.page-gap{padding:2px 4px;color:var(--muted);}
@media(max-width:560px){
  .pagination{grid-template-columns:1fr 1fr;}
  .page-numbers{grid-column:1 / -1;grid-row:1;justify-content:center;flex-wrap:wrap;}
}

/* ---- 記事 ---- */
.post-header{margin-bottom:clamp(30px,4vw,44px);}
.post-title{margin-bottom:14px;}
.post-meta{display:flex;flex-wrap:wrap;gap:18px;margin:0 0 14px;font-size:.8rem;letter-spacing:.06em;color:var(--muted);}
.post-origin{margin:16px 0 0;padding:10px 14px;border-left:2px solid var(--line-2);background:#fafbfc;font-size:.82rem;color:var(--muted);}
.post-body{max-width:none;}
.post-body img{height:auto;margin:1.6em auto;}
.post-body figure{margin:1.6em 0;}
.post-body figure img{margin:0 auto;}
.post-body figcaption{margin-top:.6em;font-size:.82rem;color:var(--muted);text-align:center;}
.post-body figcaption p{margin:0;}
.post-body blockquote{margin:1.6em 0;padding:.2em 0 .2em 1.2em;border-left:2px solid var(--line-2);color:var(--muted);}
.post-body blockquote p:last-child{margin-bottom:0;}
.post-body hr{margin:2.6em auto;width:60px;border:0;border-top:1px solid var(--line-2);}
.post-body table{display:block;overflow-x:auto;margin:1.6em 0;border-collapse:collapse;font-size:.9rem;line-height:1.7;}
.post-body th,.post-body td{padding:8px 12px;border:1px solid var(--line-2);vertical-align:top;}
.post-body th{background:#f6f8fa;color:var(--ink);font-weight:600;}
.post-body td p,.post-body td ul{margin:0;}
.post-body code{padding:.1em .35em;background:#f3f5f7;border-radius:3px;font-size:.88em;}
.post-body pre{overflow-x:auto;padding:14px 16px;background:#f6f8fa;border-radius:var(--radius);font-size:.86rem;line-height:1.6;}
.post-body pre code{padding:0;background:none;}
.post-body h2 a,.post-body h3 a{color:inherit;}
.post-body sup a{text-decoration:none;}

/* 脚注（GFM） */
.post-body .footnotes{margin-top:3em;padding-top:1.2em;border-top:1px solid var(--line);font-size:.86rem;}
.post-body .footnotes h2{margin:0 0 .8em;padding:0;border:0;font-size:.9rem;}
.post-body .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* 埋め込み（G）: iframe は幅に合わせて縮め、下に元の URL を出す */
.post-body .embed{margin:1.8em 0;}
.post-body .embed iframe{display:block;width:100%;height:auto;aspect-ratio:16 / 9;border:0;background:#f6f8fa;}
.post-body .embed[data-embed="slideshare"] iframe{aspect-ratio:4 / 3;}
.post-body .embed-link,.post-body .embed-caption{margin:.5em 0 0;font-size:.8rem;color:var(--muted);word-break:break-all;}

/* ブログカード（F） */
.post-body .blog-card{display:flex;gap:16px;align-items:stretch;margin:1.4em 0;padding:14px 16px;border:1px solid var(--line-2);border-radius:var(--radius);color:var(--ink);text-decoration:none;}
.post-body .blog-card:hover{border-color:var(--accent);}
.blog-card-text{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1;}
.blog-card-title{font-weight:600;line-height:1.5;}
.blog-card-desc{font-size:.8rem;line-height:1.6;color:var(--body);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.blog-card-site{margin-top:auto;font-size:.72rem;letter-spacing:.06em;color:var(--muted);}
.post-body .blog-card-thumb{flex:none;width:132px;height:auto;max-height:74px;margin:0;object-fit:cover;border-radius:2px;}
@media(max-width:560px){.post-body .blog-card-thumb{width:96px;}}
.post-body .amazon-card{font-weight:600;}

/* 数式（H） */
.post-body .math-display{overflow-x:auto;margin:1.4em 0;}

/* 著者欄・前後の記事 */
.author-box{display:flex;align-items:center;gap:16px;margin-top:56px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.author-avatar{width:56px;height:56px;border-radius:50%;object-fit:cover;border:1px solid var(--line-2);}
.author-name{margin:0;font-weight:600;letter-spacing:.02em;}
.author-name a{color:var(--ink);}
.author-role{margin:0;font-size:.8rem;color:var(--muted);}
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px;}
.post-nav a{display:flex;flex-direction:column;gap:4px;color:var(--ink);}
.post-nav a:hover{text-decoration:none;}
.post-nav a:hover .post-nav-title{color:var(--accent-ink);}
.post-nav-older{text-align:right;}
.post-nav-label{font-size:.74rem;letter-spacing:.08em;color:var(--muted);}
.post-nav-title{font-size:.9rem;line-height:1.6;word-break:auto-phrase;}
@media(max-width:560px){.post-nav{grid-template-columns:1fr;}.post-nav-older{text-align:left;}}

/* ---- トップの最新の記事 ---- */
.latest-posts li{display:flex;gap:18px;align-items:baseline;}
.latest-posts time{flex:none;font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.latest-more{margin:-.4em 0 2em;font-size:.86rem;}
@media(max-width:560px){.latest-posts li{flex-direction:column;gap:0;}}

/* ---- 検索（Pagefind の UI を、サイトの色に合わせる） ---- */
.blog-search{--pagefind-ui-primary:var(--accent-ink);--pagefind-ui-text:var(--body);--pagefind-ui-border:var(--line-2);--pagefind-ui-border-radius:var(--radius);--pagefind-ui-font:var(--sans);}
.blog-search mark{background:var(--accent-soft);color:inherit;}

/* ---- 多言語版（機械翻訳）---- */
/* 翻訳: English · Español · …（日付の行 .post-meta の中に、タグより控えめに並べる）。ひと続きの文字として流し、
   スマホでは日付の下の行に回って、長ければ折り返す。区切りの「·」は各リンクの後ろに付ける（行頭に残らないように） */
.post-translations{min-width:0;}
.post-translations-label{margin-right:.4em;}
.post-translations-list a{color:var(--muted);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;text-decoration-thickness:1px;}
.post-translations-list a:hover{color:var(--accent-ink);text-decoration-style:solid;}
.post-translations-list a:not(:last-child)::after{content:"·";display:inline-block;margin:0 .5em;color:#b3bec6;}
/* 翻訳のトップ（/es/ など）の先頭の注記。記事の注記（.post-origin.post-machine）と同じ形で、ヘッダーの下に置く */
.home-notice{padding-top:22px;}
.home-notice .post-origin{margin:0;}
/* 機械翻訳の注記。初出の注記（.post-origin）と同じ形で、左の線だけ色を付けて目に入りやすくする */
.post-machine{border-left-color:var(--accent);}
/* 簡体字中国語のページは、日本語の字形のフォントを先頭にしない（同じ漢字でも字形が違う）。SimSun の英数字は等幅で崩れるので、英数字は Times New Roman を先にする */
:root:lang(zh-Hans){--sans:system-ui,-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC",sans-serif;--serif:"Times New Roman","Songti SC","Noto Serif CJK SC","Noto Serif SC",SimSun,serif;}
