@font-face{font-family:"Newsreader";src:url(fonts/newsreader-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Newsreader";src:url(fonts/newsreader-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
  --paper:#FAFAF7;--ink-900:#1B1E22;--ink-700:#3A3F45;--ink-500:#5E646B;
  --rule:#D9DBD6;--rule-strong:#1B1E22;--accent:#1F4E8C;--accent-wash:#E8EEF6;
  --serif:"Newsreader",Georgia,serif;--sans:"IBM Plex Sans","Helvetica Neue",sans-serif;
  --t14:.875rem;--t16:1rem;--t20:1.25rem;--t25:1.5625rem;--t31:1.953rem;--t39:2.441rem;
  --s4:4px;--s8:8px;--s12:12px;--s16:16px;--s24:24px;--s32:32px;--s48:48px;--s64:64px;--s96:96px;
}
*{box-sizing:border-box}
html{background:var(--paper);color:var(--ink-900)}
body{margin:0;font:400 var(--t16)/1.55 var(--sans);-webkit-font-smoothing:antialiased}
.page{max-width:1200px;margin:0 auto;padding:var(--s64) var(--s32) var(--s96);display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--s32)}
.intro{grid-column:1/5;align-self:start;position:sticky;top:var(--s64)}
.list{grid-column:5/13}
h1{font:600 var(--t39)/1.1 var(--serif);letter-spacing:-.01em;margin:0 0 var(--s16)}
.note{color:var(--ink-700);max-width:34ch;margin:0 0 var(--s16)}
.meta{color:var(--ink-500);font-size:var(--t14);margin:0}
ul{list-style:none;margin:0;padding:0;border-top:2px solid var(--rule-strong)}
li{border-bottom:1px solid var(--rule)}
li a{display:grid;grid-template-columns:1fr auto;column-gap:var(--s24);row-gap:var(--s4);padding:var(--s24) var(--s16);margin:0 calc(-1 * var(--s16));color:inherit;text-decoration:none;transition:background-color 160ms ease-out}
li a:hover{background:var(--accent-wash)}
li a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.name{font:600 var(--t25)/1.2 var(--serif);color:var(--accent)}
li a:hover .name{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.trade{font-size:var(--t14);color:var(--ink-500);align-self:baseline;text-align:right}
.desc{grid-column:1/-1;color:var(--ink-700);max-width:62ch;margin:0}
.foot{grid-column:5/13;margin-top:var(--s32);color:var(--ink-500);font-size:var(--t14)}
@media (max-width:860px){
  .page{display:block;padding:var(--s48) var(--s24) var(--s64)}
  .intro{position:static;margin-bottom:var(--s32)}
  h1{font-size:var(--t31)}
}
@media (max-width:480px){
  .page{padding:var(--s32) var(--s16) var(--s48)}
  li a{grid-template-columns:1fr;padding:var(--s16);margin:0 calc(-1 * var(--s16))}
  .trade{text-align:left}
  .name{font-size:var(--t20)}
}
@media (prefers-reduced-motion:reduce){li a{transition:none}}
