:root{
  --ink:#12181f; --ink-2:#41505f; --muted:#6b7c8d; --line:#e2e8ee;
  --brand:#0f4c5c; --brand-2:#12657a; --accent:#c9861a;
}
*{box-sizing:border-box}
body{
  margin:0; color:var(--ink); background:#fff;
  font:400 17px/1.68 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:760px; margin-inline:auto; padding:0 22px}
header{border-bottom:1px solid var(--line); background:#fff}
.nav{display:flex; align-items:center; height:66px}
.logo{font-weight:750; letter-spacing:-.02em; font-size:1.06rem; text-decoration:none; color:var(--ink); display:flex; align-items:center; gap:9px}
.logo span{color:var(--brand)}
.logo-mark{width:26px;height:26px;border-radius:7px;background:linear-gradient(140deg,var(--brand-2),var(--brand));flex:none}
main{padding:56px 0 80px}
h1{font-size:clamp(1.9rem,4vw,2.6rem); line-height:1.15; letter-spacing:-.022em; margin:0 0 10px}
h2{font-size:1.24rem; margin:38px 0 12px; letter-spacing:-.015em}
p,li{color:var(--ink-2)}
p{margin:0 0 14px}
ul{padding-left:22px; margin:0 0 14px}
li{margin-bottom:8px}
a{color:var(--brand-2)}
.updated{color:var(--muted); font-size:.92rem; margin-bottom:34px}
.note{
  background:#fdf6e9; border:1px solid #f0dcb4; border-radius:11px;
  padding:16px 18px; font-size:.93rem; color:#6b4c11; margin-bottom:34px;
}
.back{display:inline-block; margin-top:40px; font-size:.95rem; text-decoration:none; color:var(--brand-2)}
footer{border-top:1px solid var(--line); padding:26px 0; font-size:.87rem; color:var(--muted)}