:root{
  --bg:#EAE4D4; --card:#FFFEFA; --ink:#1B1B1B; --dim:#6B6456; --line:#CBC2AC; --radius:16px;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#1B1B1B; --card:#262521; --ink:#EAE4D4; --dim:#A39C8C; --line:#3D3A33; }
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Hiragino Maru Gothic ProN","Hiragino Sans","Noto Sans JP",-apple-system,sans-serif;
  line-height:1.85; -webkit-text-size-adjust:100%;
}
.wrap{max-width:720px; margin:0 auto; padding:40px 20px 72px}
header{text-align:center; padding:16px 0 8px}
header img{width:96px; height:96px; border-radius:22px; border:2px solid var(--ink)}
h1{font-size:1.7rem; margin:12px 0 4px}
.tag{color:var(--dim); margin:0 0 28px; font-size:.95rem}
h2{font-size:1.12rem; margin:38px 0 12px; padding-bottom:8px; border-bottom:2px solid var(--line)}
ol,ul{padding-left:1.3em}
li{margin:6px 0}
.card{background:var(--card); border:2px solid var(--ink); border-radius:var(--radius); padding:18px 20px; margin:18px 0}
a{color:var(--ink); text-underline-offset:3px}
.back{display:inline-block; margin-bottom:8px; font-size:.95rem}
dt{font-weight:bold; margin-top:16px}
dd{margin:4px 0 0}
footer{margin-top:56px; padding-top:20px; border-top:1px solid var(--line); color:var(--dim); font-size:.9rem; text-align:center}
