:root { --ink:#18343a; --muted:#5b7378; --paper:#f8f6ee; --leaf:#d9e8d2; --sun:#f5ca78; --line:rgba(24,52,58,.16); }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Sans SC",Arial,sans-serif; }
.wrap { width:min(760px, calc(100% - 36px)); margin:auto; padding:28px 0 64px; }
header { display:flex; justify-content:space-between; align-items:center; gap:18px; padding-bottom:34px; }
.brand { color:var(--ink); font:15px "DM Mono",monospace; text-decoration:none; }
.brand span { color:#dc8069; }
.back { color:#4e7172; font-size:14px; text-underline-offset:4px; }
.eyebrow { margin:20px 0 16px; color:#527477; font:12px "DM Mono",monospace; }
h1 { margin:0; max-width:680px; font-size:clamp(34px,6vw,52px); line-height:1.22; font-weight:600; }
.lead { max-width:620px; margin:22px 0 36px; color:var(--muted); font-size:17px; line-height:1.9; }
main { border-top:1px solid var(--line); }
section { padding:28px 0; border-bottom:1px solid var(--line); }
h2 { margin:0 0 12px; font-size:22px; }
p, li { color:#46676d; font-size:16px; line-height:1.85; }
ol { margin:0; padding-left:24px; }
li { margin:10px 0; padding-left:6px; }
.note { padding:18px; background:var(--leaf); border-left:4px solid #7faa86; }
.action { display:inline-block; margin-top:18px; padding:11px 15px; border-radius:4px; background:var(--ink); color:white; font-weight:600; text-decoration:none; }
footer { padding-top:24px; color:var(--muted); font-size:12px; line-height:1.7; }
@media (max-width:560px) { .wrap { width:min(100% - 28px,760px); } h1 { font-size:35px; } }