:root{
  --paper:#EBEEE9; --raised:#F6F8F4; --ink:#141A15; --ink-soft:#4E574E;
  --ink-faint:#7B857A; --rule:#D2D9CE; --pine:#245943; --mint:#8FC3A8; --flag:#E7E29B;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#0F130F; --raised:#171D17; --ink:#E5EAE2; --ink-soft:#9CA79A;
    --ink-faint:#727D71; --rule:#283028; --pine:#87C4A4; --mint:#3C7159; --flag:#4A4620;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Newsreader",Georgia,"Times New Roman",serif;
  font-size:18px;line-height:1.62;font-weight:300;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:1040px;margin:0 auto;padding:0 28px}
a{color:inherit}
::selection{background:var(--mint);color:var(--paper)}
.ui{font-family:"Archivo",system-ui,sans-serif}
.mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace}
.eyebrow{
  font-family:"Archivo",system-ui,sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);
}

header{
  border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:20;
  background:color-mix(in srgb, var(--paper) 88%, transparent);backdrop-filter:blur(8px);
}
.bar{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:18px 0}
.mark{font-family:"Archivo",sans-serif;font-weight:600;font-size:15px;letter-spacing:.02em;text-decoration:none}
nav{display:flex;gap:22px}
nav a{
  font-family:"Archivo",sans-serif;font-size:12.5px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-soft);text-decoration:none;
  padding:4px 0;border-bottom:1px solid transparent;
}
nav a:hover{color:var(--ink);border-bottom-color:var(--pine)}
@media (max-width:620px){nav{gap:14px}nav a{font-size:11px}}

h1{
  font-family:"Newsreader",serif;font-weight:400;font-size:clamp(2.5rem,6.2vw,4.15rem);
  line-height:1.04;letter-spacing:-.022em;margin:20px 0 0;max-width:16ch;
}
h2{
  font-family:"Newsreader",serif;font-weight:400;font-size:clamp(1.7rem,3.4vw,2.3rem);
  letter-spacing:-.018em;line-height:1.15;margin:0;
}
h3{
  font-family:"Archivo",sans-serif;font-size:12px;font-weight:600;letter-spacing:.15em;
  text-transform:uppercase;color:var(--pine);margin:56px 0 16px;
}
p{margin:0 0 18px}
.deck{max-width:56ch;margin:28px 0 0;color:var(--ink-soft);font-size:1.16rem;line-height:1.66}
.deck em{font-style:italic;color:var(--ink)}
.lede{font-size:1.14rem;line-height:1.68;max-width:60ch}
.body{max-width:62ch;color:var(--ink-soft)}
.body strong{color:var(--ink);font-weight:500}
.body em{color:var(--ink)}

section{padding:76px 0;border-top:1px solid var(--rule)}
.sec-head{display:flex;gap:28px;align-items:baseline;margin-bottom:36px;flex-wrap:wrap}

.swap{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--rule);background:var(--raised)}
.swap>div{padding:30px 30px 34px}
.swap .before{border-right:1px solid var(--rule)}
@media (max-width:760px){
  .swap{grid-template-columns:1fr}
  .swap .before{border-right:none;border-bottom:1px solid var(--rule)}
}
.tag{
  font-family:"Archivo",sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.15em;
  text-transform:uppercase;display:block;margin-bottom:18px;
}
.tag.b{color:var(--ink-faint)}
.tag.a{color:var(--pine)}
.spec-before{font-family:"IBM Plex Mono",monospace;font-size:.92rem;line-height:1.58;color:var(--ink-soft);font-weight:400}
.spec-before .h{display:block;font-size:1rem;font-weight:500;margin-bottom:12px}
.spec-after{font-family:"Newsreader",serif;font-weight:300;font-size:1.06rem;line-height:1.6}
.spec-after .h{display:block;font-size:1.62rem;line-height:1.15;font-weight:400;letter-spacing:-.015em;margin-bottom:14px}
.caption{font-family:"Archivo",sans-serif;font-size:12px;color:var(--ink-faint);margin:10px 0 0;line-height:1.6}

.flagline{
  font-family:"IBM Plex Mono",monospace;font-size:.86rem;line-height:1.7;color:var(--ink-soft);
  background:var(--paper);border:1px solid var(--rule);padding:16px 18px;margin:22px 0 0;
}
.flagline mark{background:var(--flag);color:var(--ink);padding:1px 3px}

table{border-collapse:collapse;width:100%;margin-top:8px}
th{
  font-family:"Archivo",sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.15em;
  text-transform:uppercase;text-align:left;padding:0 0 12px;border-bottom:1px solid var(--rule);
}
th.b{color:var(--ink-faint)} th.a{color:var(--pine)}
td{padding:15px 0;border-bottom:1px solid var(--rule);vertical-align:top;width:50%}
td:first-child{font-family:"IBM Plex Mono",monospace;font-size:.86rem;color:var(--ink-soft);padding-right:24px}
td:last-child{font-family:"Newsreader",serif;font-size:1.06rem;padding-left:24px}

.figures{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:8px}
.fig{background:var(--raised);padding:26px 22px}
.fig .n{font-family:"Newsreader",serif;font-size:2.4rem;font-weight:400;letter-spacing:-.03em;line-height:1;display:block}
.fig .l{font-family:"Archivo",sans-serif;font-size:11px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);margin-top:12px;display:block;line-height:1.5}
@media (max-width:680px){.figures{grid-template-columns:1fr}}

.results{list-style:none;padding:0;margin:8px 0 0}
.results li{padding:16px 0;border-bottom:1px solid var(--rule);display:flex;gap:20px;align-items:baseline;flex-wrap:wrap}
.results .k{font-family:"IBM Plex Mono",monospace;font-size:.9rem;font-weight:500;color:var(--pine);min-width:170px}
.results .v{color:var(--ink-soft);flex:1;min-width:240px}

.rise{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1)}
.rise.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rise{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}
a:focus-visible,nav a:focus-visible{outline:2px solid var(--pine);outline-offset:3px;border-radius:2px}

footer{
  border-top:1px solid var(--rule);padding:22px 0 44px;
  font-family:"IBM Plex Mono",monospace;font-size:.76rem;color:var(--ink-faint);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
}