:root{--g900:#071F17;--g800:#0A3D2E;--g700:#0F5A43;--bg:#F2F8F5;--card:#FFFFFF;--ink:#0A1F16;--muted:#5F7F72;--line:#D8EBE2;--warn:#F59E0B;--warn-soft:#FEF3C7}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}
header{background:var(--g800);color:white;padding:36px 20px 28px}.wrap{max-width:840px;margin:0 auto}
.brand{font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#BFF4DF}
h1{font-size:34px;line-height:1.1;margin:8px 0 6px;letter-spacing:-.02em}.date{color:#D8EBE2;font-size:14px}
main{padding:24px 20px 48px}.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px;box-shadow:0 8px 30px rgba(10,61,46,.08)}
h2{font-size:18px;margin:26px 0 8px;color:var(--g800)}h2:first-child{margin-top:0}
h3{font-size:15px;margin:14px 0 6px;color:var(--g700)}
p,li{font-size:15px}.muted{color:var(--muted)}a{color:var(--g700);font-weight:700}ul{padding-left:22px}
.key-callout{background:var(--warn-soft);border-left:4px solid var(--warn);border-radius:8px;padding:14px 16px;margin:18px 0;font-size:14px;line-height:1.55}
.key-callout strong{color:var(--g800);display:block;margin-bottom:4px;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
footer{border-top:1px solid var(--line);margin-top:28px;padding-top:16px;font-size:13px;color:var(--muted)}
.toc{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin-bottom:20px}
.toc-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:8px}
.toc ol{margin:0;padding-left:22px;font-size:13px;color:var(--g700)}
.toc a{color:var(--g700);font-weight:600;text-decoration:none}
.toc a:hover{text-decoration:underline}

@media (max-width: 720px) {
  footer > div > div:first-child { grid-template-columns: 1fr !important; gap: 18px !important; }
  footer > div > div:last-child { flex-direction: column !important; align-items: flex-start !important; text-align: left !important; }
}