:root{
  --bg:#0e1116; --panel:#161b22; --line:#232a34;
  --ink:#e7edf3; --muted:#9aa7b5; --faint:#6b7684;
  --accent:#5db0ff; --accent-soft:#1f6feb22; --pos:#5ad1a0; --neg:#ff7a90;
  --mono:"SFMono-Regular",ui-monospace,Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  line-height:1.85;font-size:16px;letter-spacing:.01em;
  background-image:radial-gradient(1200px 600px at 70% -10%,#17324d33,transparent 60%);}
.wrap{max-width:760px;margin:0 auto;padding:0 22px}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}

/* nav */
.nav{position:sticky;top:0;z-index:10;background:#0e1116e6;backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:18px;height:54px}
.nav .brand{font-weight:800;letter-spacing:-.01em;color:var(--ink);margin-right:auto;font-size:15px}
.nav .brand .dot{color:var(--accent)}
.nav a.link{font-size:13.5px;color:var(--muted);font-family:var(--mono)}
.nav a.link:hover,.nav a.link[aria-current="page"]{color:var(--ink);text-decoration:none}
.nav a.link[aria-current="page"]{color:var(--accent)}

/* hero */
header.hero{padding:80px 0 50px;border-bottom:1px solid var(--line)}
.kicker{font-family:var(--mono);font-size:12.5px;letter-spacing:.18em;color:var(--accent);text-transform:uppercase;margin:0 0 18px}
h1{font-size:clamp(30px,6.4vw,50px);line-height:1.18;margin:0 0 20px;letter-spacing:-.01em;font-weight:800}
h1 .em{color:var(--accent)}
.lede{font-size:clamp(17px,2.6vw,20px);color:var(--muted);margin:0 0 30px;max-width:38em}
.meta{display:flex;flex-wrap:wrap;gap:10px 18px;font-family:var(--mono);font-size:12.5px;color:var(--faint)}
.meta b{color:var(--ink);font-weight:600}

/* page head (sub pages) */
.pagehead{padding:56px 0 32px;border-bottom:1px solid var(--line)}
.pagehead h1{font-size:clamp(26px,5vw,40px);margin-bottom:12px}
.pagehead p{color:var(--muted);margin:0;max-width:40em}

/* sections */
section{padding:52px 0;border-bottom:1px solid var(--line)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;color:var(--faint);text-transform:uppercase;margin:0 0 14px}
h2{font-size:clamp(22px,4vw,30px);margin:0 0 18px;line-height:1.3;font-weight:750}
p.body{color:var(--ink);margin:0 0 16px}
p.body.muted{color:var(--muted)}

/* thesis callout */
.thesis{background:linear-gradient(180deg,#12233522,transparent);border:1px solid var(--line);
  border-left:3px solid var(--accent);border-radius:12px;padding:26px 26px;margin:8px 0 0}
.thesis .q{font-size:clamp(19px,3.2vw,24px);font-weight:700;line-height:1.5;margin:0}

/* chapters (index) */
.chapters{display:grid;gap:14px;margin-top:8px}
.ch{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px 22px;transition:border-color .2s ease}
.ch:hover{border-color:#2f60a0}
.ch-head{display:flex;align-items:baseline;gap:14px;margin-bottom:12px}
.ch-no{font-family:var(--mono);font-size:26px;font-weight:700;color:var(--accent);line-height:1;min-width:2.4ch}
.ch-title{font-size:18px;font-weight:700;margin:0}
.ch-sum{color:var(--muted);font-size:14.5px;margin:0 0 14px}
ul.posts{list-style:none;margin:0;padding:0;display:grid;gap:10px}
ul.posts li{position:relative;padding-left:20px;color:var(--ink);font-size:15px;line-height:1.7}
ul.posts li::before{content:"";position:absolute;left:2px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--accent);opacity:.6}

/* number highlight */
.figblock{display:flex;flex-wrap:wrap;gap:14px;margin:20px 0 4px}
.fig{flex:1 1 150px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.fig .big{font-family:var(--mono);font-size:23px;font-weight:700}
.fig .big.a{color:var(--neg)} .fig .big.b{color:var(--pos)}
.fig .cap{color:var(--faint);font-size:12.5px;margin-top:4px}
.arrow{align-self:center;color:var(--faint);font-family:var(--mono);font-size:20px}

/* long-form / article posts (sub pages) */
.series{margin:44px 0 4px;padding-top:8px}
.series .stag{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--accent);text-transform:uppercase}
.series h2{margin:6px 0 0}
.post{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:14px 0;transition:border-color .2s ease}
.post:hover{border-color:#2f60a0}
.post .no{font-family:var(--mono);font-size:13px;color:var(--faint)}
.post h3{margin:2px 0 10px;font-size:18px;font-weight:700;line-height:1.4}
.post p{margin:0 0 10px;color:var(--ink)}
.post p:last-child{margin-bottom:0}
.post .claim{color:var(--muted);font-size:14.5px;border-top:1px dashed var(--line);padding-top:10px;margin-top:12px}
.post .claim b{color:var(--accent);font-weight:600}
.post .plan{color:var(--muted);font-size:14.5px}

/* footer */
footer{padding:40px 0 72px}
.note{background:#12161c;border:1px solid var(--line);border-radius:12px;padding:18px 20px;color:var(--muted);font-size:13.5px}
.note b{color:var(--ink)}
.fine{color:var(--faint);font-size:12.5px;margin-top:20px;font-family:var(--mono)}