
:root { --ink:#1d2126; --muted:#5d6671; --line:#d6dbe0; --panel:#f1f3f5; --link:#1f5fae; }
* { box-sizing: border-box; }
body { margin:0; color:var(--ink); background:#fff; font:16px/1.6 "Hiragino Sans","Noto Sans JP",system-ui,sans-serif; }
a { color:var(--link); }
a:focus-visible, button:focus-visible, input:focus-visible { outline:2px solid var(--link); outline-offset:2px; }
header.site, footer.site, main { max-width:720px; margin:0 auto; padding:16px 20px; }
header.site { display:flex; flex-wrap:wrap; gap:12px 24px; align-items:baseline; border-bottom:1px solid var(--line); }
header.site .logo { font-weight:700; color:var(--ink); text-decoration:none; }
header.site nav { display:flex; gap:16px; font-size:14px; }
footer.site { color:var(--muted); font-size:13px; border-top:1px solid var(--line); }
h1 { font-size:28px; line-height:1.3; margin:16px 0 12px; }
h2 { font-size:18px; margin:28px 0 8px; }
img { display:block; max-width:100%; height:auto; margin:12px 0; }
.routes { width:100%; border-collapse:collapse; font-size:15px; }
.routes th, .routes td { text-align:left; padding:8px; border-bottom:1px solid var(--line); }
form { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:16px 0; }
input[type=number] { width:4em; padding:6px; font:inherit; }
button { font:inherit; padding:8px 18px; border:0; border-radius:4px; background:var(--ink); color:#fff; cursor:pointer; }
.log { background:var(--panel); padding:12px; overflow-x:auto; font-size:13px; white-space:pre-wrap; word-break:break-all; }
.note { color:var(--muted); font-size:14px; }
.panel { margin-top:32px; background:var(--panel); padding:12px 16px; font-size:13px; }
.panel summary { cursor:pointer; font-weight:600; }
.panel dl { display:grid; grid-template-columns:max-content 1fr; gap:4px 16px; margin:12px 0 0; }
.panel dt { color:var(--muted); }
.panel dd { margin:0; word-break:break-all; }
