/* Shared shell; page-specific diagrams keep their own layout and typography. */
:root { --page-max:1080px; --page-pad:40px; }
.page { max-width:var(--page-max); margin:0 auto; padding:0 var(--page-pad); }
.site-header { display:flex; align-items:center; gap:24px; min-height:76px; padding:0; border-bottom:1px solid var(--line); }
.site-header .brand { display:inline-flex; align-items:center; gap:10px; white-space:nowrap; text-decoration:none; color:var(--ink); font-size:21px; font-weight:600; }
.site-header .brand img { display:block; }
.site-header .brand-english { margin-left:5px; color:var(--muted); font-size:16px; font-weight:500; }
.site-header nav { display:flex; align-items:center; gap:20px; margin:0 0 0 auto; }
.site-header nav a { padding:10px 0; font-size:14px; line-height:1.7; color:var(--ink); text-decoration:none; white-space:nowrap; }
.site-header nav a[aria-current="page"] { color:var(--accent-hover); text-decoration:underline; text-underline-offset:6px; }
.site-header .language-switcher { margin:0; }
.site-footer { display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; margin:0; padding:26px 0 34px; border-top:1px solid var(--line); font-size:14px; line-height:1.7; color:var(--ink); }
.site-footer > span { margin-right:auto; font-size:14px; }
.site-footer a { color:var(--accent-hover); text-decoration:underline; text-underline-offset:4px; }
.site-footer .footer-engine { color:var(--muted); }
html[data-page="roadmap"] body > .page > main { width:auto; max-width:none; margin:0; }
.site-header a:focus-visible,.site-header summary:focus-visible,.site-footer a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
@media(max-width:960px) {
 .site-header { flex-wrap:wrap; padding:14px 0; gap:10px 20px; }
 .site-header .language-switcher { margin-left:auto; }
 .site-header nav { order:3; width:100%; min-width:0; margin:0; flex-wrap:nowrap; overflow-x:auto; }
}
@media(max-width:640px) {
 :root { --page-pad:22px; }
 .site-header nav { gap:18px; }
 .site-footer > span { width:100%; }
}
.site-header { font-size:16px; line-height:1.7; }
@media(max-width:360px) { .site-header .brand-english { display:none; } }