*{box-sizing:border-box}body{margin:0;color:#1c2530;background:#fff;
font:15px/1.7 "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}
a{color:#0a6b8a}header.top{background:#0d3b53;color:#fff;padding:18px 24px}
header.top .brand{font-size:22px;font-weight:700;letter-spacing:.04em}
header.top .tag{color:#a8cfe0;font-size:13px}
nav{background:#0a2f43;display:flex;flex-wrap:wrap;padding:0 24px}
nav a{color:#dcebf2;padding:12px 16px;text-decoration:none;font-size:14px}
nav a:hover{background:#0d3b53}
.wrap{max-width:880px;margin:0 auto;padding:28px 24px}
.hero{background:#eef4f7;border-radius:10px;padding:28px;margin-bottom:22px}
h1{font-size:24px;margin:.2em 0}h2{font-size:18px;color:#0d3b53;border-bottom:2px solid #cfe0e9;padding-bottom:6px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.box{background:#f7fafc;border:1px solid #e1e9ef;border-radius:8px;padding:16px}
.mono{font-family:ui-monospace,Menlo,monospace}
.note{color:#5a6b78;font-size:13px}footer{background:#0d3b53;color:#a8cfe0;
padding:20px 24px;font-size:13px;margin-top:30px}
table{width:100%;border-collapse:collapse}td,th{padding:7px 9px;border-bottom:1px solid #e1e9ef;text-align:left}