/*
Theme Name: Numaken Log
Description: numaken.net のプロフィールページ（index.html）と同じデザイントークンで記事を表示するテーマ。
             配色・書体・角丸はプロフィール側の :root 変数をそのまま移植している。
             プロフィールを更新して配色を変えたときは、このファイルの :root も合わせること。
Author: Panolabo
Version: 1.0.0
*/

:root{
  --parchment:#f5f4ed; --ivory:#faf9f5; --dark:#141413; --dark-surface:#30302e;
  --terracotta:#c96442; --terracotta-hover:#b85a3a;
  --olive:#5e5d59; --stone:#87867f; --silver:#b0aea5;
  --border:#f0eee6; --border-warm:#e8e6dc; --sand:#e8e6dc;
  --serif:'Noto Serif JP',Georgia,'Times New Roman',serif;
  --sans:'Noto Sans JP',system-ui,-apple-system,sans-serif;
  --r:8px; --r-lg:12px; --r-xl:16px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; font-family:var(--sans); font-size:16px; line-height:1.70;
  color:var(--dark); background:var(--parchment);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
a{color:var(--terracotta);text-underline-offset:3px}
a:hover{color:var(--terracotta-hover)}

/* ── ヘッダー ── */
.site-header{
  background:var(--ivory); border-bottom:1px solid var(--border-warm);
  position:sticky; top:0; z-index:50;
}
.site-header .inner{
  max-width:760px; margin:0 auto; padding:16px 24px;
  display:flex; align-items:baseline; gap:16px; flex-wrap:wrap;
}
.site-title{font-family:var(--serif);font-weight:700;font-size:17px;margin:0}
.site-title a{color:var(--dark);text-decoration:none}
.site-nav{margin-left:auto;font-size:14px}
.site-nav a{margin-left:18px;text-decoration:none;color:var(--olive)}
.site-nav a:hover{color:var(--terracotta)}

/* ── 本体 ── */
.wrap{max-width:760px;margin:0 auto;padding:56px 24px 96px}

.entry-title{
  font-family:var(--serif); font-weight:700; line-height:1.45;
  font-size:clamp(24px,4.2vw,34px); margin:0 0 14px; color:var(--dark);
  text-wrap:balance; letter-spacing:.01em;
}
.entry-meta{font-size:13px;color:var(--stone);margin:0 0 40px}

.entry-content{font-size:16.5px;line-height:1.95}
.entry-content > * + *{margin-top:1.5em}
.entry-content h2{
  font-family:var(--serif); font-weight:700; font-size:21px; line-height:1.5;
  margin:2.6em 0 .9em; padding-bottom:.5em;
  border-bottom:2px solid var(--sand); color:var(--dark);
}
.entry-content h3{
  font-weight:700; font-size:17px; margin:2.2em 0 .7em; color:var(--dark);
}
.entry-content p{margin:0 0 1.5em}
.entry-content strong{font-weight:700;color:var(--dark)}
.entry-content ul,.entry-content ol{margin:0 0 1.5em;padding-left:1.4em}
.entry-content li{margin-bottom:.5em}
.entry-content li::marker{color:var(--silver)}

.entry-content hr{
  border:0;border-top:1px solid var(--border-warm);margin:3em 0;
}

/* コード：記事の核なので読みやすさを優先する */
.entry-content pre{
  background:var(--dark-surface); color:#e8e6dc;
  padding:18px 20px; border-radius:var(--r-lg); overflow-x:auto;
  font-size:13.5px; line-height:1.75; margin:0 0 1.6em;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.entry-content pre code{background:none;color:inherit;padding:0;font-size:inherit}
.entry-content code{
  background:var(--sand); color:var(--dark);
  padding:.15em .45em; border-radius:4px; font-size:.9em;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

.entry-content table{
  width:100%; border-collapse:collapse; margin:0 0 1.6em; font-size:15px;
  background:var(--ivory); border-radius:var(--r); overflow:hidden;
}
.entry-content th,.entry-content td{
  padding:10px 14px; border-bottom:1px solid var(--border-warm); text-align:left;
}
.entry-content th{background:var(--sand);font-weight:700}
.entry-content tr:last-child td{border-bottom:0}

.entry-content blockquote{
  margin:0 0 1.6em; padding:2px 0 2px 20px;
  border-left:3px solid var(--terracotta); color:var(--olive);
}

/* ── 記事一覧 ── */
.post-list{list-style:none;margin:0;padding:0}
.post-list li{
  background:var(--ivory); border:1px solid var(--border-warm);
  border-radius:var(--r-lg); padding:22px 24px; margin-bottom:14px;
  transition:border-color .15s;
}
.post-list li:hover{border-color:var(--silver)}
.post-list a{
  font-family:var(--serif); font-weight:700; font-size:18px;
  color:var(--dark); text-decoration:none; line-height:1.5;
}
.post-list a:hover{color:var(--terracotta)}
.post-list .date{display:block;font-size:12.5px;color:var(--stone);margin-top:8px}

/* ── フッター ── */
.site-footer{
  border-top:1px solid var(--border-warm); background:var(--ivory);
  padding:40px 24px; text-align:center; font-size:13.5px; color:var(--stone);
}
.site-footer a{color:var(--olive);text-decoration:none;margin:0 10px}
.site-footer a:hover{color:var(--terracotta)}

@media (max-width:600px){
  .wrap{padding:36px 18px 72px}
  .entry-content{font-size:16px}
  .entry-content pre{padding:14px 15px;font-size:12.5px}
}