:root { color-scheme: light; font-family: system-ui, "Noto Sans JP", sans-serif; color: #233247; background: #f6f8fb; line-height: 1.85; }
* { box-sizing: border-box; }
body { margin: 0; overflow-wrap: anywhere; }
a { color: #15558c; text-underline-offset: .2em; }
a:hover { color: #9a352b; }
:focus-visible { outline: 3px solid #b74031; outline-offset: 4px; }
header { background: #fff; border-top: 7px solid #b74031; border-bottom: 1px solid #dde3eb; padding: 2rem max(1.25rem, calc((100vw - 960px) / 2)); }
.brand { font-size: clamp(1.7rem, 5vw, 2.5rem); font-weight: 800; letter-spacing: -.03em; text-decoration: none; color: #233247; }
.brand span { color: #b74031; margin-left: .5em; font-size: .75em; }
header p { margin: .1rem 0 1.2rem; color: #536174; }
nav { display: flex; flex-wrap: wrap; gap: .7rem 1.4rem; }
nav a { padding: .25rem 0; }
main { max-width: 960px; margin: 2rem auto; padding: 2rem; background: #fff; border: 1px solid #e1e6ed; border-radius: 6px; }
h1 { font-size: clamp(1.5rem, 4vw, 2.2rem); line-height: 1.5; }
h2, h3 { line-height: 1.6; margin-top: 2em; }
.notice, #route-notice { padding: .85rem 1rem; border-left: 4px solid #b74031; background: #fff5ee; font-size: .9rem; }
.date, .source { color: #536174; font-size: .9rem; }
.source { margin-top: 3rem; border-top: 1px solid #ddd; padding-top: 1rem; }
.entries { list-style: none; padding: 0; }
.entries li { display: grid; grid-template-columns: 7rem 1fr; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid #e1e6ed; }
.entries time { color: #536174; font-size: .85rem; }
.entries a { font-weight: 650; }
img { max-width: 100%; height: auto; }
img[src*="/assets/illustrations/"] { display: block; width: min(100%, 360px); margin: 1.5rem auto; padding: 1rem; background: #fff8df; border-radius: 16px; }
figure { margin: 1.5rem 0; }
table { display: block; overflow-x: auto; border-collapse: collapse; }
td, th { border: 1px solid #c4cdd8; padding: .5rem; }
pre { overflow: auto; padding: 1rem; background: #f0f3f7; }
blockquote { margin-left: 0; padding-left: 1rem; border-left: 3px solid #c4cdd8; }
.search { display: flex; gap: .5rem; margin: .5rem 0; }
input { min-width: 0; flex: 1; }
input, button { font: inherit; border: 1px solid #738092; border-radius: 4px; padding: .4rem .7rem; }
button { background: #233247; color: white; cursor: pointer; }
footer { text-align: center; padding: 1rem 1rem 3rem; color: #536174; font-size: .85rem; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 1rem; top: 1rem; padding: .5rem; background: white; }
@media (max-width: 640px) { main { margin: 1rem .6rem; padding: 1.2rem; } .entries li { grid-template-columns: 1fr; gap: .1rem; } }
