:root{
  --paper:#E8EAE3; --card:#FDFDFB; --ink:#171A15; --ink2:#5C6157; --rule:#CBCFC3;
  --safe:#1F5D3F; --safe-soft:#DCE9E0;
  --shadow:0 1px 0 rgba(23,26,21,.06), 0 6px 18px -12px rgba(23,26,21,.35);
  --mono:"Roboto Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-weight:500;line-height:1.9;font-feature-settings:"palt" 1}
.wrap{max-width:720px;margin:0 auto;padding:0 16px}

.sitenav{display:inline-block;margin:18px 0 0;font-size:12px;color:var(--ink2);
  text-decoration:none;font-weight:700}
.sitenav:hover{color:var(--safe)}

.masthead{padding:22px 0 6px;border-bottom:1px solid var(--rule);margin-bottom:26px}
h1{font-size:clamp(22px,5vw,30px);font-weight:900;line-height:1.4;letter-spacing:-.02em;margin:0 0 8px}
.masthead p{margin:0 0 18px;color:var(--ink2);font-size:13.5px}

h2{font-size:16px;font-weight:700;line-height:1.5;margin:34px 0 10px;
  padding-left:11px;border-left:3px solid var(--safe)}
h3{font-size:14px;font-weight:700;margin:22px 0 6px}
p{margin:0 0 14px;font-size:14px}
ul,ol{margin:0 0 14px;padding-left:1.4em;font-size:14px}
li{margin-bottom:5px}
a{color:var(--safe)}
strong{font-weight:700}
dl{margin:0 0 14px;font-size:14px}
dt{font-weight:700;margin-top:12px}
dd{margin:2px 0 0 1em;color:var(--ink2)}

.box{background:var(--card);border:1px solid var(--rule);border-radius:12px;
  padding:15px 17px;box-shadow:var(--shadow);margin:0 0 16px}
.box p:last-child,.box ul:last-child{margin-bottom:0}
.note{font-size:12.5px;color:var(--ink2);line-height:1.85}

.foot{border-top:1px solid var(--rule);margin-top:44px;padding:18px 0 48px;
  font-size:11.5px;line-height:2;color:var(--ink2)}
.foot a{color:var(--ink);font-weight:700;text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot .links{margin-bottom:6px}
.foot .links a{margin-right:14px;display:inline-block}
