/* Giants in Ink: warm paper, black ink, cobalt, one red-orange accent (the channel's paper-collage look). */
:root { --paper: #F2EFE8; --ink: #1D1D1F; --cobalt: #23388F; --red: #E2512D; --muted: #5E5D63; --line: #D9D4C8; }
@media (prefers-color-scheme: dark) { :root { --paper: #15161C; --ink: #EDEAE2; --cobalt: #8EA4F5; --red: #F06A47; --muted: #A3A1A8; --line: #2C2E38; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.6 "Libre Franklin", system-ui, -apple-system, "Segoe UI", sans-serif; }
main { max-width: 720px; margin: 0 auto; padding: 56px 20px 72px; }
.mark { font: 400 clamp(40px, 9vw, 72px)/1 "Archivo Black", "Arial Black", sans-serif; letter-spacing: -0.02em; margin: 0; }
.mark span { background: var(--cobalt); color: #fff; padding: 0 .15em; }
.stamp { display: inline-block; margin: 18px 0 8px; background: var(--red); color: #fff; font: 700 13px/1 ui-monospace, Menlo, monospace; letter-spacing: .12em; text-transform: uppercase; padding: 8px 12px; transform: rotate(-2deg); }
h1 { font: 400 32px/1.15 "Archivo Black", "Arial Black", sans-serif; margin: 0 0 6px; }
h2 { font-size: 19px; margin: 32px 0 6px; }
p, li { max-width: 65ch; }
a { color: var(--cobalt); text-underline-offset: 3px; }
.muted { color: var(--muted); }
footer { border-top: 2px solid var(--ink); margin-top: 48px; padding-top: 14px; font-size: 15px; display: flex; gap: 18px; flex-wrap: wrap; }