/* 共通の見た目 */
:root {
    --ink:#2b2824;
    --muted:#6b645b;
    --line:#ddd5c8;
    --accent:#b4532f;
    --paper:#f8f4ed;
    --card:#fffdf9;
}
* {box-sizing:border-box}
body {
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:Arial,"Helvetica Neue","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
    line-height:1.95;
    -webkit-font-smoothing:antialiased;
}
a {color:inherit}
img,svg {max-width:100%;display:block}
.mono {font-family:"Courier New",monospace;font-size:13px;letter-spacing:.08em;color:var(--muted);margin:0}

/* ヘッダー。上に固定して出す */
.site-header {position:sticky;top:0;z-index:10;background:rgba(248,244,237,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.site-header-inner {max-width:960px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.header-name {display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;letter-spacing:.01em;text-decoration:none;white-space:nowrap}
.header-mark {width:26px;height:23px;flex:none}
.header-mark path {fill:none;stroke-width:55;stroke-linejoin:round;stroke-linecap:round}
.header-mark .ink {stroke:var(--ink)}
.header-mark .accent {stroke:var(--accent)}
.header-mark .butt {stroke-linecap:butt}
.header-nav {display:flex;gap:18px;font-size:13px}
.header-nav a {text-decoration:none;color:var(--muted);padding:6px 0;border-bottom:1px solid transparent}
.header-nav a:hover,.header-nav a[aria-current="true"] {color:var(--ink);border-bottom-color:var(--accent)}
/* 狭い画面では名前の文字を隠して「d」の印だけにする */
@media (max-width:420px) {
    .header-name-text {position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
    .header-nav {gap:14px}
}

.wrap {max-width:680px;margin:0 auto;padding:0 16px}

.footer {display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;max-width:760px;margin:0 auto;padding:24px 16px 40px;font-size:13px;color:var(--muted);border-top:1px solid var(--line)}