/* Match the main Royal masthead and keep the archive typography intentional. */
.topbar{width:min(calc(100% - 32px),1248px);min-height:80px;margin:8px auto 12px;border:0;border-radius:12px;background:rgba(251,248,240,.96);box-shadow:0 4px 16px rgba(0,8,48,.04);color:#000830}
.topbar-inner{min-height:80px;padding:8px 24px}
.topbar .brand{gap:14px;letter-spacing:0}
.topbar .brand-logo{display:grid;place-items:center;width:58px;height:58px;padding:5px;border:0;border-radius:50%;background:#fff}
.topbar .brand img{width:100%;height:100%;padding:0;object-fit:contain;border-radius:50%}
.topbar .brand strong{font:700 14px/20px Manrope,sans-serif;letter-spacing:.11em;text-transform:uppercase}
.topbar .brand small{margin-top:2px;font:400 12px/16px Manrope,sans-serif;letter-spacing:.04em;text-transform:uppercase}
.topbar-inner>nav a,.topbar .back,.history-menu nav a{font:600 14px/20px Manrope,sans-serif}
main :is(h1,h2,h3,.archive-heading,.timeline-title){font-family:Prata,Georgia,serif!important;font-style:normal!important;font-weight:400!important;letter-spacing:-.025em!important;text-wrap:balance}
main :is(p,figcaption,time,.eyebrow,.hero-links a){font-family:Manrope,sans-serif!important;font-style:normal;text-wrap:pretty}
@media(max-width:800px){.topbar{width:calc(100% - 16px);min-height:68px;margin:8px auto 8px}.topbar-inner{min-height:68px;padding:0 12px}.topbar .brand-logo{width:48px;height:48px}.history-menu summary{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){.topbar *{transition:none!important}}