@font-face {
  font-family: Plex;
  src: url('/assets/fonts/ibm-plex-sans.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: Source;
  src: url('/assets/fonts/source-serif-4.woff2') format('woff2');
  font-weight: 200 900;
  font-display: swap;
}
:root {
  color-scheme: light;
  --paper: #e9e1cc;
  --ink: #292d2d;
  --muted: #555b55;
  --line: #929487;
  --amber: #ffb347;
  --focus: #7b3312;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 18px/1.6 Plex, sans-serif; }
h1, h2, h3, p, figure { margin: 0; }
p + p { margin-top: 15px; }
a { color: inherit; text-underline-offset: 5px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid var(--focus); outline-offset: 5px; }
.skip-link { position: absolute; left: 20px; top: -100px; padding: 12px 18px; background: var(--ink); color: var(--paper); z-index: 1; }
.skip-link:focus { top: 14px; }
.small { font-size: 13px; line-height: 1.55; }
.label { font: 500 12px/1.6 Plex, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.muted { color: var(--muted); }
.tell { display: inline-block; width: 37px; height: 6px; background: var(--amber); margin-right: 12px; vertical-align: middle; }
.charter { max-width: 1288px; margin: auto; padding: 54px 48px 32px; }
.charter-top, .charter-intro, .rule { display: grid; grid-template-columns: 210px minmax(0,1fr) 220px; gap: 32px; }
.charter-top { border-bottom: 2px solid var(--ink); padding-bottom: 34px; }
.plate-id { display: flex; flex-direction: column; justify-content: space-between; border-left: 5px solid var(--ink); padding-left: 18px; }
.charter h1 { font: 400 106px/1 Source, serif; letter-spacing: -.06em; }
.trademark { font-size: .25em; vertical-align: top; position: relative; top: .45em; }
.mast-line { margin-top: 19px; }
.issued { padding-top: 12px; }
.charter-intro { margin: 38px 0 43px; }
.charter-intro h2 { font: 400 37px/1.16 Source, serif; max-width: 650px; }
.intro-copy { font-size: 17px; margin-top: 22px; max-width: 600px; }
.rule { border-top: 1px solid var(--line); padding: 24px 0 28px; }
.rule-id { font-size: 13px; letter-spacing: .08em; }
.rule h2 { font: 400 33px/1.15 Source, serif; margin-bottom: 11px; }
.rule p { font-size: 16px; }
.rule .translation { font-size: 14px; color: var(--muted); border-left: 1px solid var(--line); padding-left: 18px; }
.world-plate { margin: 20px 0 41px; }
.world-plate picture { display: block; width: 100%; aspect-ratio: 16 / 9; line-height: 0; overflow: hidden; }
.world-plate img { display: block; width: 100%; height: 100%; object-fit: cover; }
.world-plate figcaption { display: flex; justify-content: space-between; gap: 24px; margin-top: 13px; font-size: 13px; color: var(--muted); }
.world-plate figcaption > span:last-child { text-align: right; }
.charter-note, .record { display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 32px; border-top: 1px solid var(--line); padding: 28px 0 36px; }
.charter-note p, .record p { max-width: 760px; font-size: 16px; }
.record { border-top: 2px solid var(--ink); }
.record h3 { font: 400 30px/1.25 Source, serif; margin-bottom: 16px; }
.signoff { display: flex; justify-content: space-between; align-items: start; gap: 26px; border-top: 1px solid var(--line); padding-top: 25px; font-size: 14px; }
.signoff nav { display: flex; flex-wrap: wrap; gap: 18px; }
.signoff a, .legal-footer a { display: inline-block; min-height: 26px; }
.signoff p { margin-top: 8px; }
.contact { overflow-wrap: anywhere; }
.legal-page { max-width: 850px; margin: auto; padding: 45px 28px 55px; }
.wordmark { font: 400 35px Source, serif; }
.legal-page header { border-bottom: 2px solid var(--ink); padding-bottom: 25px; margin: 42px 0 27px; }
.legal-page h1 { font: 400 58px/1.1 Source, serif; margin: 13px 0 18px; }
.legal-page h2 { font: 400 28px/1.2 Source, serif; margin: 32px 0 12px; }
.legal-page p { font-size: 17px; }
.legal-placeholder { border-left: 3px solid var(--ink); padding: 8px 0 8px 18px; font-size: 15px!important; }
.legal-footer { border-top: 1px solid var(--line); padding-top: 25px; margin-top: 40px; }
.legal-footer a { margin-right: 22px; }
.legal-footer p { color: var(--muted); font-size: 13px; margin-top: 15px; }
.error-page { padding-top: 15vh; }
.error-page > a { display: inline-block; margin-top: 25px; }
@media (prefers-color-scheme: dark) {
  :root { color-scheme: dark; --paper:#292d2d; --ink:#eee6d3; --muted:#c0c2b6; --line:#73796f; --focus:#ffb347; }
}
@media (max-width: 1050px) and (min-width: 701px) {
  .charter-top, .charter-intro, .rule { grid-template-columns: 135px minmax(0,1fr) 175px; gap: 24px; }
  .charter h1 { font-size: 78px; }
  .charter-intro h2 { font-size: 31px; }
  .charter-note, .record { grid-template-columns: 135px minmax(0,1fr); gap: 24px; }
  .signoff { flex-wrap: wrap; }
}
@media (max-width: 700px) {
  .charter { padding: 30px 22px 26px; }
  .charter-top { grid-template-columns: 1fr; gap: 22px; padding-bottom: 25px; }
  .plate-id { flex-direction: row; align-items: start; gap: 20px; }
  .plate-id .label, .plate-id .small { font-size: 11px; }
  .plate-id p + p { margin: 0; }
  .charter h1 { font-size: clamp(60px,18vw,78px); }
  .mast-line { font-size: 11px; margin-top: 17px; }
  .issued { display: flex; justify-content: space-between; gap: 20px; padding-top: 0; }
  .issued p + p { margin-top: 0; }
  .charter-intro { grid-template-columns: 1fr; gap: 17px; margin: 27px 0; }
  .charter-intro h2 { font-size: 34px; }
  .intro-copy { font-size: 16px; margin-top: 18px; }
  .rule { grid-template-columns: 36px minmax(0,1fr); gap: 15px; padding: 23px 0; }
  .rule h2 { font-size: 30px; }
  .rule p { font-size: 15px; }
  .rule .translation { grid-column: 2; border: 0; padding: 0; font-size: 14px; }
  .world-plate { margin: 10px 0 28px; }
  .world-plate figcaption { display: block; font-size: 12px; }
  .world-plate figcaption > span { display: block; }
  .world-plate figcaption > span:last-child { text-align: left; margin-top: 8px; }
  .charter-note, .record { grid-template-columns: 1fr; gap: 17px; padding: 26px 0; }
  .record h3 { font-size: 28px; }
  .signoff { flex-direction: column; gap: 23px; }
  .signoff a, .legal-footer a { padding: 7px 0; min-height: 38px; }
  .legal-page { padding: 30px 22px; }
  .legal-page h1 { font-size: 44px; }
  .legal-page header { margin-top: 30px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto; } }