:root{
  --bg:#f7f4ee;
  --paper:#fffdf8;
  --ink:#1e1c18;
  --muted:#6f6a61;
  --line:#d7cfc1;
  --accent:#31403a;
  --accent2:#8a6b44;
  --max:980px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;
  line-height:1.95;
  letter-spacing:.01em;
}
a{color:inherit;text-decoration-thickness:.07em;text-underline-offset:.2em}
.site-header{
  position:sticky;top:0;z-index:10;
  background:rgba(247,244,238,.94);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(10px);
}
.header-inner{max-width:var(--max);margin:0 auto;padding:16px 22px;display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.brand{text-decoration:none;line-height:1.15}
.brand .mark{display:block;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:13px;letter-spacing:.16em;color:var(--muted);margin-bottom:4px}
.brand .name{font-size:21px;font-weight:700;letter-spacing:.02em}
.brand .name .emoji{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:.92em;vertical-align:-.04em}
.brand .name .title-text{padding:0 .05em}
.nav{display:flex;gap:22px;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:13px;color:var(--muted)}
.nav a{text-decoration:none}
.nav a:hover{color:var(--ink)}
main{max-width:var(--max);margin:0 auto;padding:0 22px}
.section{padding:64px 0;border-top:1px solid var(--line)}
.section:first-child{border-top:none}
.intro{padding:84px 0 54px}
.eyebrow{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;color:var(--accent2);font-size:12px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:18px}
.hero-title{font-size:clamp(40px,6vw,72px);line-height:1.2;letter-spacing:-.03em;margin:0 0 22px;font-weight:500}
.hero-text{max-width:760px;font-size:19px;color:#33302a}
.essay-block{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:44px;align-items:start}
.card{background:rgba(255,253,248,.68);border:1px solid var(--line);padding:26px}
.card .label{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:12px;letter-spacing:.14em;color:var(--muted);margin-bottom:14px}
.card .meta{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:14px;color:var(--muted);line-height:1.9}
.essay-title{font-size:clamp(32px,4.7vw,56px);line-height:1.28;letter-spacing:-.03em;margin:0 0 16px}
.author{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:14px;color:var(--muted);margin:0 0 22px}
.subtitle{font-size:23px;line-height:1.6;color:var(--accent);margin:0 0 26px}
.abstract{font-size:18px;max-width:780px}
.toc{margin:28px 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.toc li{border-bottom:1px solid var(--line)}
.toc a{display:flex;gap:18px;padding:14px 0;text-decoration:none}
.toc .no{width:4em;color:var(--accent2);font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:13px;flex:none}
.list-links{display:grid;gap:12px;margin-top:24px}
.list-links a{display:block;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
.button{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border:1px solid var(--line);text-decoration:none;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:14px;background:rgba(255,253,248,.4)}
.button.primary{background:var(--accent);color:var(--paper);border-color:var(--accent)}
.site-footer{max-width:var(--max);margin:0 auto;padding:40px 22px 64px;border-top:1px solid var(--line);font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:13px;color:var(--muted)}
.article-wrap{max-width:820px;margin:0 auto;padding:68px 22px 90px}
.article-header{padding-bottom:30px;border-bottom:1px solid var(--line)}
.article-header h1{font-size:clamp(34px,5vw,58px);line-height:1.25;letter-spacing:-.03em;margin:0 0 16px}
.article-header .subtitle{font-size:22px;margin-bottom:16px}
.article-body h2{font-size:30px;line-height:1.35;margin:54px 0 18px}
.article-body p{font-size:18px;margin:0 0 1.1em}
.article-body blockquote{margin:30px 0;padding:22px 24px;border-left:3px solid var(--accent);background:rgba(255,253,248,.65);font-size:20px;line-height:1.8}
.article-nav{display:flex;justify-content:space-between;gap:16px;margin-top:48px;padding-top:24px;border-top:1px solid var(--line);font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:14px}
.small-note{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;font-size:13px;color:var(--muted)}
@media(max-width:860px){
  .nav{display:none}
  .essay-block{grid-template-columns:1fr}
  .subtitle{font-size:20px}
}

.article-body ul, .article-body ol { padding-left: 1.45em; }
.article-body li { margin: .45em 0; font-size: 18px; }
.article-body hr { border: 0; border-top: 1px solid var(--line); margin: 44px 0; }
.article-body .bibliography-entry { margin-bottom: 1.35em; }
.article-body .bibliography-entry p { margin-bottom: .25em; }

.date-meta{
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;
  font-size:13px;
  color:var(--muted);
  line-height:1.8;
  margin:0 0 24px;
}
.date-meta span{display:inline-block;margin-right:1.2em}


/* v3: left side table of contents for 論考① */
.article-wrap.with-side-toc{
  max-width:1180px;
  display:grid;
  grid-template-columns:220px minmax(0, 1fr);
  column-gap:28px;
  row-gap:0;
  align-items:start;
}

.article-wrap.with-side-toc > .side-toc{
  grid-column:1;
  grid-row:1;
  position:sticky;
  top:92px;
  align-self:start;
  max-height:none;
  overflow:visible;
padding:4px 0 24px;
}

.article-wrap.with-side-toc > .mobile-toc{
  display:none;
}

.article-wrap.with-side-toc > .article-content{
  grid-column:2;
  grid-row:1;
  min-width:0;
}

.side-toc-inner{
  border:1px solid var(--line);
  background:rgba(255,253,248,.62);
  border-radius:18px;
  padding:14px 12px;
}

.side-toc-label{
  margin:0 0 10px;
  color:var(--muted);
  font-size:.82rem;
  letter-spacing:.08em;
}

.side-toc-nav{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.side-toc-link{
  display:grid;
  grid-template-columns:2.8em minmax(0, 1fr);
  gap:6px;
  align-items:baseline;
  padding:.32em .48em;
  border-radius:10px;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.36;
  text-decoration:none;
}

.side-toc-link:hover{
  background:rgba(138,107,68,.12);
  text-decoration:none;
  color:var(--ink);
}

.side-toc-link.current{
  background:var(--accent2);
  color:#fff;
}

.side-toc-num{
  font-size:.78rem;
  opacity:.82;
  letter-spacing:.04em;
}

@media(max-width:980px){
  .article-wrap.with-side-toc{
    display:block;
    max-width:var(--max);
  }
  .article-wrap.with-side-toc > .side-toc{
    display:none;
  }
  .article-wrap.with-side-toc > .mobile-toc{
    display:block;
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:16px;
    padding:12px 16px;
    margin:0 0 18px;
  }
  .article-wrap.with-side-toc > .mobile-toc summary{
    cursor:pointer;
    color:var(--muted);
  }
  .article-wrap.with-side-toc > .mobile-toc nav{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin-top:10px;
  }
  .article-wrap.with-side-toc > .article-content{
    display:block;
  }
}


/* v3.1: remove internal scrollbar from article 1 side toc */
.article-wrap.with-side-toc > .side-toc{
  max-height:none !important;
  overflow:visible !important;
}
.article-wrap.with-side-toc .side-toc-link{
  padding:.32em .48em;
  line-height:1.36;
  font-size:.82rem;
}


/* v4: narrower reader width for 論考① */
:root{--reader-width:760px;}
.article-wrap.with-side-toc{
  max-width:1040px;
  grid-template-columns:220px minmax(0,var(--reader-width));
  justify-content:center;
}
.article-wrap.with-side-toc > .article-content{
  max-width:var(--reader-width);
  width:100%;
}
.article-body p{font-size:17px;line-height:1.92;}
.article-body li{font-size:17px;line-height:1.82;}
@media(max-width:980px){
  .article-wrap.with-side-toc{max-width:var(--max);display:block;}
  .article-wrap.with-side-toc > .article-content{max-width:none;}
}

/* v5: article1 pages are organized under /article/state-change/ */

/* v5.5: article1 header already uses production structure */


/* v5.6: hard header fix and cache-bust */
body > .site-header{
  position:sticky !important;
  top:0 !important;
  z-index:100 !important;
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:rgba(247,244,238,.94) !important;
  border-bottom:1px solid var(--line, #d7cfc1) !important;
  backdrop-filter:blur(10px);
}
body > .site-header > .header-inner{
  max-width:980px !important;
  margin:0 auto !important;
  padding:16px 22px !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-end !important;
  gap:20px !important;
  box-sizing:border-box !important;
}
body > .site-header .brand{
  display:block !important;
  text-decoration:none !important;
  color:inherit !important;
  line-height:1.15 !important;
}
body > .site-header .brand .mark{
  display:block !important;
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif !important;
  font-size:13px !important;
  letter-spacing:.16em !important;
  color:var(--muted, #6f6a61) !important;
  margin:0 0 2px 0 !important;
}
body > .site-header .brand .name{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  font-size:20px !important;
  letter-spacing:.04em !important;
  color:inherit !important;
}
body > .site-header .brand .emoji{
  font-size:.9em !important;
  line-height:1 !important;
}
body > .site-header .nav{
  display:flex !important;
  gap:18px !important;
  font-size:.92rem !important;
  color:var(--muted, #6f6a61) !important;
  align-items:center !important;
  margin:0 !important;
}
body > .site-header .nav a{
  color:inherit !important;
  text-decoration:none !important;
}
body > .site-header .nav a:hover{
  text-decoration:underline !important;
}
@media(max-width:720px){
  body > .site-header > .header-inner{
    display:block !important;
    padding:14px 18px !important;
  }
  body > .site-header .nav{
    margin-top:10px !important;
  }
}


/* v5.7: inline header fallback */
body > .site-header,
body > .site-header *{
  box-sizing:border-box;
}
body > .site-header .nav a:hover{
  text-decoration:underline !important;
}