:root { --navy:#0f1b3d; --gold:#f2b01e; --bg:#eef1f6; --ink:#141a2b; --muted:#5d667c; --card:#fff; --line:#d5dbe7; }
@media (prefers-color-scheme: dark) { :root { --bg:#0b1020; --ink:#eef1f8; --muted:#9aa5bf; --card:#141b31; --line:#273050; } }
* { box-sizing:border-box; margin:0; }
body { background:var(--bg); color:var(--ink); font:16px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif; }
header { background:var(--navy); color:#fff; padding:32px 16px 28px; border-bottom:5px solid var(--gold); }
header > * , main, footer { max-width:1000px; margin-inline:auto; }
.eyebrow { color:var(--gold); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600; }
h1 { font-size:clamp(1.6rem,4.5vw,2.4rem); line-height:1.15; margin:.25em auto .3em; text-wrap:balance; }
.sub { color:#c9d3ee; }
main { padding:24px 16px 8px; }
figure { background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; margin-bottom:22px; scroll-margin-top:12px; }
figcaption { display:flex; align-items:center; gap:14px; padding:10px 14px; }
.num { flex:none; min-width:2.6em; height:2.6em; padding:0 .4em; border-radius:999px; background:var(--navy); color:#fff; font-weight:700; font-size:1.05rem; display:grid; place-items:center; text-decoration:none; font-variant-numeric:tabular-nums; border:2px solid var(--gold); }
.cap { display:flex; flex-direction:column; min-width:0; }
.kind { font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:600; }
.ttl { font-weight:600; overflow-wrap:anywhere; }
img { display:block; width:100%; height:auto; aspect-ratio:16/9; background:#0f1b3d; }
footer { padding:8px 16px 40px; color:var(--muted); font-size:.9rem; }