@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@600;800;900&family=Barlow:wght@400;500;600&display=swap');
:root{
  --arena:#172844;   /* NFR navy, sampled from their artwork */
  --night:#0b1428;   /* deeper navy for edges and panels */
  --rail:#f2eee6;    /* off-white: type, photo borders, back numbers */
  --saddle:#c8955a;  /* leather tan accent, replaces their red */
  --chrome:#b9c2d0;  /* silver from the NFR badge, secondary text */
  --display:'Big Shoulders Display','Arial Narrow',Impact,sans-serif;
  --body:'Barlow','Helvetica Neue',Arial,sans-serif;
}
/* Back number: the paper competitor number pinned on a rider's back */
.backno{background:var(--rail);color:var(--night);font-family:var(--display);
  padding:.35em .7em .45em;line-height:.9;text-align:center;position:relative;
  box-shadow:0 6px 18px rgba(0,0,0,.35)}
.backno::before,.backno::after{content:'';position:absolute;top:.35em;width:.32em;height:.32em;
  border-radius:50%;background:#8b96a8;box-shadow:inset 0 1px 1px rgba(0,0,0,.4)}
.backno::before{left:.35em}.backno::after{right:.35em}
.backno .num{font-weight:900;display:block;letter-spacing:.01em}
.backno .name{font-family:var(--body);font-weight:600;display:block;margin-top:.2em;
  font-size:.3em;letter-spacing:.04em}
