@font-face{font-family:Manrope; font-style:normal; font-weight:400 800; font-display:swap; src:url(fonts/manrope-latin.woff2) format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Manrope; font-style:normal; font-weight:400 800; font-display:swap; src:url(fonts/manrope-latin-ext.woff2) format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--g900:#0E3A1D; --g700:#18652F; --g600:#1E7A3C; --g50:#F5FBF7; --ink:#0C1F16; --muted:#5B6F64; --line:#E6EEE9}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:84px}
body{margin:0; font-family:Manrope, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color:var(--ink); background:#fff; line-height:1.65; -webkit-font-smoothing:antialiased}
a{color:var(--g700)}
.wrap{max-width:760px; margin:0 auto; padding-inline:20px}
.top{position:sticky; top:0; z-index:10; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); padding-top:env(safe-area-inset-top,0px)}
.top-in{height:64px; display:flex; align-items:center; justify-content:space-between; gap:16px}
.top img{display:block; height:36px; width:auto}
.back{font-weight:700; font-size:14px; text-decoration:none}
main{padding:48px 0 72px}
.kicker{font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--g700); margin:0 0 10px}
h1{font-size:clamp(32px,6vw,44px); line-height:1.08; letter-spacing:-.04em; margin:0 0 10px}
.updated{color:var(--muted); font-size:14px; margin:0 0 36px}
.toc{background:var(--g50); border:1px solid var(--line); border-radius:16px; padding:18px 22px; margin-bottom:40px}
.toc ol{margin:0; padding-left:20px; columns:2; column-gap:28px; font-size:14.5px; font-weight:600}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}
h2{font-size:21px; letter-spacing:-.02em; margin:44px 0 10px; padding-top:20px; border-top:1px solid var(--line)}
h3{font-size:16.5px; margin:24px 0 6px}
p, li{font-size:15.5px; color:#2C3D34}
ul{padding-left:20px}
li{margin-bottom:4px}
dl{display:grid; grid-template-columns:200px 1fr; gap:8px 20px; margin:12px 0; font-size:15.5px}
dt{color:var(--muted); font-weight:600}
dd{margin:0; font-weight:600}
.note{background:var(--g50); border-left:3px solid var(--g600); border-radius:0 12px 12px 0; padding:14px 18px; margin:16px 0}
.note p{margin:0}
.todo{background:#FFF1B8; color:#5C4200; border-radius:5px; padding:1px 6px; font-weight:700; font-size:.92em}
.form{border:1px dashed #A9B8B0; border-radius:14px; padding:18px 22px; margin:16px 0}
footer{border-top:1px solid var(--line); padding:24px 0 36px; font-size:13.5px; color:var(--muted)}
footer .wrap{display:flex; gap:18px; flex-wrap:wrap}
footer a{color:var(--muted); font-weight:600; text-decoration:none}
footer a:hover{color:var(--ink)}
@media (max-width:640px){
  main{padding:32px 0 56px}
  .toc ol{columns:1}
  dl{grid-template-columns:1fr; gap:2px}
  dd{margin-bottom:10px}
  .top img{height:32px}
}
