/* History articles use the existing site's typography and gold palette. */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: #0f1117; color: #f0e6c8; font-family: 'Inter', 'Segoe UI', system-ui, sans-serif; line-height: 1.75; }
a { color: #d8b63e; text-decoration: none; overflow-wrap: anywhere; }
a:hover { text-decoration: underline; }
a:focus-visible { outline: 2px solid #f0d060; outline-offset: 4px; }
.site-header { border-bottom: 1px solid #2a2d3a; background: linear-gradient(135deg, #1a1200, #0f1117 60%); padding: 1.4rem 2rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.logo-name { color: #c9a227; font-size: 1.5rem; font-weight: 900; }
nav { display: flex; flex-wrap: wrap; gap: 1.5rem; }
nav a { font-size: .85rem; font-weight: 700; }
.nav-cta { background: linear-gradient(135deg, #c9a227, #f0d060); color: #0f1117; padding: .35rem 1rem; border-radius: 8px; }
main { max-width: 860px; margin: 2.5rem auto; padding: 0 2rem; }
.breadcrumb, .byline { font-size: .9rem; color: #a2a6bd; }
.eyebrow { color: #c9a227; font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; margin-top: 2rem; }
h1 { font-size: 2.3rem; line-height: 1.2; letter-spacing: -.03em; }
h2 { font-size: 1.4rem; line-height: 1.35; margin-top: 2.5rem; }
p, li { color: #a2a6bd; }
.lead { font-size: 1.1rem; }
.note, .references, .related { background: #1a1d27; border: 1px solid #2a2d3a; border-left: 4px solid #c9a227; border-radius: 0 12px 12px 0; padding: 1rem 1.5rem; margin: 2rem 0; }
.note h2, .references h2, .related h2 { margin-top: .5rem; }
li { margin-bottom: .6rem; }
footer { border-top: 1px solid #2a2d3a; padding: 2rem; text-align: center; }
footer nav { justify-content: center; }
footer p { font-size: .85rem; }
@media (max-width: 640px) { main { padding: 0 1.2rem; } .site-header { padding: 1rem 1.2rem; } nav { gap: 1rem; } h1 { font-size: 1.9rem; } .note, .references, .related { padding: 1rem; } }