:root { --bg:#0b1426; --panel:#162440; --text:#f0f4fa; --muted:#8c9cb8; --amber:#ffb000; --cyan:#22d3ee; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:18px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
header, main, footer { max-width: 44rem; margin: 0 auto; padding: 1rem 1.25rem; }
header { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; align-items:baseline; justify-content:space-between; padding-top:1.5rem; }
.brand { font-weight:700; color:var(--amber); text-decoration:none; font-size:1.1rem; }
nav a { margin-right:1rem; }
a { color:var(--cyan); }
h1 { font-size:2rem; line-height:1.2; margin:1.5rem 0 .5rem; }
h2 { font-size:1.3rem; margin:2rem 0 .25rem; color:var(--amber); }
p, li { max-width: 40rem; }
.note { background:var(--panel); border-left:4px solid var(--amber); padding:.75rem 1rem; border-radius:4px; }
table { border-collapse:collapse; width:100%; background:var(--panel); border-radius:4px; }
th, td { text-align:left; padding:.5rem .75rem; border-bottom:1px solid var(--bg); vertical-align:top; }
footer { color:var(--muted); font-size:.9rem; border-top:1px solid var(--panel); margin-top:2rem; }
@media (max-width: 30rem) { body { font-size:17px; } h1 { font-size:1.6rem; } }