:root { color-scheme: light; --ink:#172033; --muted:#5e687c; --brand:#315b9b; --line:#dce3ee; --panel:#f4f7fb; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,Segoe UI,Arial,sans-serif; color:var(--ink); background:#fff; line-height:1.65; }
header { border-bottom:1px solid var(--line); background:var(--panel); }
nav,main,footer { width:min(860px,calc(100% - 36px)); margin:auto; }
nav { padding:18px 0; display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
nav strong { color:var(--brand); margin-right:auto; }
nav a,footer a { color:var(--brand); text-decoration:none; }
main { padding:52px 0 64px; }
h1 { font-size:clamp(2rem,6vw,3rem); line-height:1.15; margin:0 0 12px; }
h2 { margin-top:36px; color:var(--brand); }
.updated,.muted { color:var(--muted); }
.notice { padding:16px 18px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
label { display:block; font-weight:600; margin-top:16px; }
input,textarea { width:100%; padding:11px; border:1px solid #b9c4d6; border-radius:8px; font:inherit; }
button { margin-top:18px; padding:11px 18px; border:0; border-radius:8px; background:var(--brand); color:#fff; font:inherit; font-weight:700; }
footer { border-top:1px solid var(--line); padding:24px 0 40px; color:var(--muted); font-size:.92rem; }
code { overflow-wrap:anywhere; }