:root { --bg:#F2F5F3; --surface:#FFFFFF; --ink:#1D2A2E; --muted:#56676B; --line:#D5DEDA; --accent:#2B6B87; --sun:#D99A2B; --sun-soft:#FAEFD8; --display:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif; --body:"Zen Kaku Gothic New","Hiragino Sans","Noto Sans JP","Yu Gothic","Meiryo",sans-serif; }
@media (prefers-color-scheme: dark) { :root { --bg:#101719; --surface:#172125; --ink:#E3EBE9; --muted:#9AAEB1; --line:#2A383C; --accent:#7CB8D2; --sun:#E5B65A; --sun-soft:#3A2F1C; color-scheme: dark; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--body); font-size:16px; line-height:1.75; -webkit-font-smoothing:antialiased; }
.wrap { max-width:660px; margin:0 auto; padding:28px max(16px, env(safe-area-inset-right)) 48px max(16px, env(safe-area-inset-left)); display:grid; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; font-size:13px; letter-spacing:.06em; }
.brand a { color:var(--muted); text-decoration:none; }
.brand-mark { width:22px; height:22px; border-radius:50%; background:var(--sun-soft); border:2px solid var(--sun); flex:none; }
h1,h2 { font-family:var(--display); line-height:1.4; margin:0; text-wrap:balance; }
h1 { font-size:clamp(26px,6vw,34px); }
h2 { font-size:19px; }
p { margin:0; }
a { color:var(--accent); }
.eyebrow { font-size:13px; letter-spacing:.08em; color:var(--accent); font-weight:700; }
.muted { color:var(--muted); font-size:14px; }
.panel { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:22px; display:grid; gap:12px; }
.card { text-decoration:none; color:inherit; }
.card:hover { border-color:var(--accent); }
.list { margin:0; padding-left:1.3em; display:grid; gap:6px; }
.kv { display:grid; grid-template-columns:auto 1fr; gap:6px 14px; margin:0; }
.kv dt { color:var(--muted); }
.kv dd { margin:0; }
footer { font-size:12.5px; border-top:1px solid var(--line); padding-top:16px; }
.foot-links { display:flex; flex-wrap:wrap; gap:6px 18px; }
@media (max-width:480px) { .kv { grid-template-columns:1fr; } .panel { padding:18px 16px; } }