:root { --navy:#0b1a2e; --navy2:#1f3a5f; --gold:#ffe39c; --cream:#fbf4e4; --muted:#9fb0c4; }
* { box-sizing: border-box; }
body { margin:0; background:linear-gradient(#0b1a2e,#1f3a5f) fixed; color:var(--cream);
  font: 17px/1.6 -apple-system, "Segoe UI", Roboto, sans-serif; }
main { max-width: 760px; margin: 0 auto; padding: 32px 16px 64px; }
h1,h2 { color: var(--gold); line-height:1.2; }
h1 { font-size: 2.4rem; margin: .2em 0; }
a { color: var(--gold); }
.hero { width:100%; border-radius:16px; display:block; }
.shots { display:flex; gap:12px; overflow-x:auto; padding:8px 0; }
.shots img { height:420px; border-radius:14px; flex:none; }
.muted { color: var(--muted); }
footer { margin-top:48px; font-size:.9rem; color:var(--muted); }
nav a { margin-right: 16px; }

.doc { max-width: 880px; }
.doc h2 { margin-top: 2em; border-bottom: 1px solid rgba(255,227,156,.25); padding-bottom: .3em; }
.doc h3 { color: var(--cream); margin-top: 1.5em; }
.table { overflow-x: auto; margin: 1em 0; }
table { border-collapse: collapse; width: 100%; font-size: .92rem; }
th, td { border: 1px solid rgba(159,176,196,.35); padding: 8px 10px; text-align: left; vertical-align: top; }
th { background: rgba(255,227,156,.12); color: var(--gold); }
code { background: rgba(255,255,255,.08); padding: 1px 5px; border-radius: 4px; font-size: .88em; }
hr { border: 0; border-top: 1px solid rgba(159,176,196,.3); margin: 2.5em 0; }