@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans+Condensed:wght@400;500;600&family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600&display=swap');

:root {
  --paper: #FDF3E7;
  --surface: #FFFDF8;
  --surface-strong: #FEFEFE;
  --brick: #8C1C13;
  --cream: #F2E8CF;
  --navy: #13284C;
  --ink: #17232C;
  --muted: #68777C;
  --rule: #9AA9AD;
  --bg: var(--paper);
  --a: var(--brick);
  --b: var(--cream);
  --font-display: 'Newsreader', Georgia, serif;
  --font-body: 'IBM Plex Sans Condensed', 'Arial Narrow', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --motion-fast: 180ms;
  --motion-ui: 320ms;
  --motion-story: 760ms;
  --motion-ease: cubic-bezier(.22, .75, .18, 1);
}

html { font-size: .0520833333vw; background: var(--paper); }
body { min-width: 0; overflow-x: hidden; background: var(--paper); color: var(--ink); font-size: clamp(12px, 16rem, 21.333px); }
button, input, select, textarea { font: inherit; }

.site-header { height: 72rem; border-bottom: 1px solid var(--rule); background: var(--paper); color: var(--navy); }
.nav-desktop { height: 72rem; display: flex; align-items: center; padding: 0 76rem; gap: 25rem; white-space: nowrap; }
.nav-desktop a { color: #173052; text-decoration: none; font-size: clamp(12px, 15rem, 20px); line-height: 72rem; }
.nav-desktop a.is-active { color: var(--brick); font-weight: 600; box-shadow: inset 0 -3px var(--brick); }
.ratelock-lockup { display: inline-flex; align-items: center; gap: 7rem; text-decoration: none; }
.ratelock-lockup img { width: 52rem; height: 27rem; object-fit: contain; flex: none; }
.ratelock-lockup > span { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.ratelock-lockup b { color: var(--brick); font: 600 21rem/.88 var(--font-body); letter-spacing: .07em; }
.ratelock-lockup small { color: var(--navy); font: 600 max(12px, 12rem)/1 var(--font-body); letter-spacing: .015em; }
.nav-desktop .brand { width: 212rem; height: 42rem; margin-right: 8rem; flex: 0 0 auto; line-height: 1; }
.spacer { flex: 1; }
.nav-desktop .sep { height: 30rem; border-left: 1px solid #738490; }
.nav-mobile { display: none; }

.page-frame { width: 100%; padding-inline: 80rem 85rem; background: var(--paper); }
.route-root { width: 100%; }

.site-footer { height: 112rem; border-top: 1px solid var(--rule); padding: 12rem 76rem 9rem; background: var(--paper); color: #173052; font-family: var(--font-body); }
.site-footer .row { display: flex; align-items: center; gap: 22rem; white-space: nowrap; }
.site-footer .brand { width: 190rem; height: 38rem; margin-right: 4rem; flex: 0 0 auto; }
.site-footer .ratelock-lockup img { width: 47rem; height: 25rem; }
.site-footer .ratelock-lockup b { font-size: 19rem; }
.site-footer .ratelock-lockup small { font-size: max(12px, 11rem); }
.site-footer a { color: inherit; text-decoration: none; }
.site-footer a:hover { color: var(--brick); }
.site-footer .route, .site-footer .meta, .site-footer .ca { font-size: clamp(12px, 13rem, 18px); }
.site-footer .sep { height: 22rem; border-left: 1px solid #8f9ca4; }
.site-footer .sub { display: flex; justify-content: space-between; border-top: 1px solid #b5bfc0; margin-top: 10rem; padding-top: 8rem; font-size: clamp(12px, 12rem, 16px); }
.site-footer .source { font-weight: 500; }

main.is-leaving { opacity: .54; transform: scaleX(.996); transition: opacity var(--motion-fast) linear, transform var(--motion-fast) var(--motion-ease); }
main.is-route-ready { animation: sheet-focus var(--motion-ui) var(--motion-ease) both; }
@keyframes sheet-focus { from { opacity: .66; transform: scaleX(.996); } to { opacity: 1; transform: scaleX(1); } }

[data-rate-trace] { stroke-dasharray: var(--trace-length, 1); stroke-dashoffset: var(--trace-length, 1); }
[data-rate-trace].is-drawn { animation: trace-draw var(--motion-story) var(--motion-ease) forwards; }
[data-rate-clamp], [data-rate-gap] { transform: scaleX(0); transform-origin: left center; }
[data-rate-clamp].is-clamped { animation: clamp-line 620ms var(--motion-ease) 160ms forwards; }
[data-rate-gap].is-clamped { animation: clamp-line 700ms var(--motion-ease) 260ms forwards; }
[data-margin-note] { opacity: 0; transform: translateX(-10rem); }
[data-margin-note].is-noted { animation: margin-note 420ms var(--motion-ease) forwards; }
[data-rate-count] { display: inline-block; font-variant-numeric: tabular-nums; transform-origin: center bottom; }
[data-rate-count].is-ticking { animation: ledger-tick var(--motion-fast) var(--motion-ease); }
[data-ledger-row] { opacity: 0; transform: scaleX(.985); transform-origin: left center; }
[data-ledger-row].is-entered { animation: ledger-enter 280ms var(--motion-ease) forwards; animation-delay: calc(var(--row-index, 0) * 28ms); }
.rate-action { transition: transform var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) linear; }
.rate-action:hover { transform: scaleX(1.012); }
.rate-action:active { transform: scaleX(.992); }
@keyframes trace-draw { to { stroke-dashoffset: 0; } }
@keyframes clamp-line { to { transform: scaleX(1); } }
@keyframes margin-note { to { opacity: 1; transform: translateX(0); } }
@keyframes ledger-tick { 45% { opacity: .35; transform: translateY(-.18em); } 46% { transform: translateY(.18em); } to { opacity: 1; transform: translateY(0); } }
@keyframes ledger-enter { to { opacity: 1; transform: scaleX(1); } }

@media (max-width: 1023px) {
  html { font-size: 1px; }
  .site-header { height: 64px; position: relative; z-index: 20; }
  .nav-desktop { display: none; }
  .nav-mobile { height: 63px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; overflow: visible; }
  .mobile-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--brick); text-decoration: none; font: 600 16px/1 var(--font-body); letter-spacing: .08em; }
  .mobile-brand img { width: 52px; height: 27px; object-fit: contain; }
  .menu-toggle { border: 1px solid var(--navy); border-radius: 0; background: transparent; color: var(--navy); padding: 8px 14px; font: 600 14px/1 var(--font-body); }
  .mobile-drawer { position: absolute; inset: 64px 0 auto 0; background: var(--paper); border-bottom: 1px solid var(--rule); padding: 18px; }
  .mobile-drawer nav { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--rule); }
  .mobile-drawer nav a { min-height: 42px; display: flex; align-items: center; border-bottom: 1px solid var(--rule); color: var(--navy); text-decoration: none; font: 500 15px/1.15 var(--font-body); }
  .mobile-drawer nav a:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--rule); }
  .mobile-drawer a.is-active { color: var(--brick); font-weight: 600; }
  .mobile-actions { display: flex; align-items: center; gap: 18px; margin-top: 16px; }
  .mobile-actions a { color: var(--navy); font: 500 14px/1 var(--font-body); text-decoration: none; }
  .page-frame { padding-inline: 20px; }
  .site-footer { height: auto; min-height: 188px; padding: 18px 20px; }
  .site-footer .row { flex-wrap: wrap; gap: 12px 16px; white-space: normal; }
  .site-footer .brand { width: 180px; height: 36px; margin-right: auto; gap: 7px; }
  .site-footer .ratelock-lockup img { width: 47px; height: 25px; }
  .site-footer .ratelock-lockup b { font-size: 18px; }
  .site-footer .ratelock-lockup small { font-size: 12px; }
  .site-footer .route, .site-footer .row > .sep { display: none; }
  .site-footer .meta { font-size: 12px; }
  .site-footer .ca { font-size: 12px; }
  .site-footer .sub { display: grid; gap: 9px; margin-top: 14px; padding-top: 12px; font-size: 12px; line-height: 1.35; }
}

@media (max-width: 430px) {
  .page-frame { padding-inline: 16px; }
  .mobile-drawer { padding-inline: 16px; }
  .mobile-actions { gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; transition: none !important; }
  main.is-leaving, [data-margin-note], [data-ledger-row] { opacity: 1; transform: none; }
  [data-rate-trace] { stroke-dashoffset: 0; }
  [data-rate-clamp], [data-rate-gap] { transform: scaleX(1); }
}