:root {
    color-scheme: dark;
    font: 16px/1.6 system-ui, sans-serif;
    color: #e8edf5;
    background: #101620;
}
* { box-sizing: border-box; }
body { margin: 0; }
.shell { width: min(100% - 2rem, 66rem); margin-inline: auto; }
header { padding: 1.3rem 0 .9rem; background: #0b1119; }
.brand { display: inline-block; }
.brand img { display: block; width: min(30rem, 100%); height: auto; }
nav { border-block: 1px solid #354459; background: #192331; }
nav .shell { display: flex; flex-wrap: wrap; gap: .15rem .45rem; padding-block: .45rem; }
a { color: #a6d8ff; }
nav a { padding: .55rem .72rem; color: #e8edf5; text-decoration: none; border-radius: .35rem; }
nav a:hover, nav a[aria-current] { background: #304861; color: #fff; }
a:focus-visible { outline: 2px solid #81c9ff; outline-offset: 3px; }
main { padding-block: clamp(1rem, 4vw, 3rem); }
.paper { border: 1px solid #354459; background: #19222e; border-radius: .65rem; padding: clamp(1rem, 5vw, 3rem); }
.notice { margin: 0; color: #a6d8ff; font-size: .9rem; }
h1 { margin: .35rem 0 1.4rem; font-size: clamp(1.75rem, 5vw, 2.8rem); line-height: 1.12; }
article { overflow-wrap: anywhere; }
article img { max-width: 100%; height: auto; }
article table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
td, th { border: 1px solid #45576c; padding: .45rem; }
footer { padding-block: 0 1.5rem; color: #b8c4d4; }