:root {
  --bg: #F3F3F2; --surface: #FFFFFF; --ink: #161616; --muted: #5E5E5E; --line: #DADAD8;
  --hero-bg: #161616; --hero-ink: #F4F4F3; --hero-muted: #A3A3A1; --accent: #E5203F; --brand-text: #D61F3B;
  --f-display: "Archivo", "Arial Narrow", system-ui, sans-serif;
  --f-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #0F0F0F; --surface: #191919; --ink: #EDEDEC; --muted: #9E9E9C; --line: #2D2D2C; --hero-bg: #141414; --brand-text: #FF5C72; color-scheme: dark; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--f-body); font-size: 1rem; line-height: 1.65; }
a { color: var(--brand-text); }
.top { background: var(--hero-bg); color: var(--hero-ink); border-bottom: 6px solid var(--accent); }
.top .wrap { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-block: 1rem; flex-wrap: wrap; }
.top a { color: var(--hero-ink); text-decoration: none; }
.brand img { height: 56px; width: auto; display: block; }
.wrap { max-width: 760px; margin-inline: auto; padding-inline: 16px; }
main { padding-block: 3rem 4rem; }
h1 { font-family: var(--f-display); font-stretch: 108%; font-size: clamp(1.7rem, 4vw, 2.3rem); line-height: 1.15; margin: 0 0 0.5rem; }
h2 { font-family: var(--f-display); font-stretch: 105%; font-size: 1.2rem; margin: 2.2rem 0 0.6rem; }
p, li { max-width: 68ch; }
.updated { color: var(--muted); font-size: 0.9rem; margin-bottom: 2rem; }
.data { background: var(--surface); border: 1px solid var(--line); border-radius: 4px; padding: 1rem 1.25rem; margin: 0; display: grid; gap: 0.3rem; }
.data div { display: grid; grid-template-columns: 9rem 1fr; gap: 1rem; }
.data dt { color: var(--muted); }
.data dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 520px) { .data div { grid-template-columns: 1fr; gap: 0; } }
footer { background: var(--hero-bg); color: var(--hero-muted); font-size: 0.88rem; }
footer .wrap { padding-block: 1.5rem; display: flex; gap: 1rem; flex-wrap: wrap; justify-content: space-between; }
footer a { color: var(--hero-ink); }
