@import url("https://fonts.googleapis.com/css2?family=Besley:ital,wght@0,500;0,600;0,700;0,800;1,500;1,600&family=Fragment+Mono&family=Schibsted+Grotesk:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap");
:root {
  --paper: #FBF8F1;
  --sheet: #FFFEFA;
  --ink: #1A2030;
  --ink-2: #4A5163;
  --ink-3: #737987;
  --rule: #E8E1D2;
  --rule-2: #D2C9B5;
  --red: #E0675D;
  --red-soft: #EDA8A1;
  --pen: #1F4BC7;
  --pen-dark: #15378F;
  --hl: #FFE24A;
  --hl-a: rgba(255, 222, 60, .8);
  --t-agents: #AFC5FF;
  --t-talk: #B2E0AC;
  --t-found: #FFCB98;
  --t-build: #D9C8FF;
  --t-fluency: #FFBDCB;
  --serif: "Besley", Georgia, "Times New Roman", serif;
  --sans: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Fragment Mono", ui-monospace, Menlo, Consolas, monospace;
  --f1: 47px;
  --f2: 37px;
  --f3: 29px;
  --f4: 23px;
  --f5: 18px;
  --f6: 14px;
  --x1: 49px;
  --x2: 30px;
  --x3: 19px;
  --x4: 12px;
  --x5: 7px;
  --x6: 4px;
  --fd: clamp(47px, 3.4dvw + 26px, 78px);
  --wrap: 1240px;
  --gutter: 16px;
  --mcol: 52px;
}

@media (min-width: 720px) {
  :root {
    --gutter: var(--x2);
    --mcol: 88px;
  }
}
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: var(--x2);
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 400 var(--f5)/1.65 var(--sans);
  font-kerning: normal;
  overflow-x: clip;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: var(--pen);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

a:hover {
  color: var(--pen-dark);
  text-decoration-thickness: 2px;
}

:focus-visible {
  outline: 2px solid var(--pen);
  outline-offset: 3px;
}

h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.012em;
  text-wrap: balance;
}

p, ul, ol, figure, blockquote {
  margin: 0;
}

button, input {
  font: inherit;
}

.wrap {
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.skip {
  position: absolute;
  left: -9999px;
}

.skip:focus {
  left: var(--x3);
  top: var(--x3);
  z-index: 20;
  padding: var(--x5) var(--x4);
  background: var(--sheet);
}

.vh {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* highlighter */
.hl, .highlight, .tldr li > strong:first-child {
  padding: 0 0.22em;
  margin: 0 -0.22em;
  border-radius: 0.7em 0.25em 0.8em 0.3em;
  background: linear-gradient(to right, rgba(255, 222, 60, 0.25), var(--hl-a) 6%, rgba(255, 222, 60, 0.62) 94%, rgba(255, 222, 60, 0.2)) no-repeat 0 62%/100% 74%;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.hl.draw {
  animation: hl-draw 1.1s 0.35s cubic-bezier(0.35, 0.75, 0.3, 1) both;
}

@keyframes hl-draw {
  from {
    background-size: 0 74%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hl.draw {
    animation: none;
  }
  * {
    scroll-behavior: auto !important;
  }
}
/* header + footer */
.site-head {
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
}

.site-head .wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--x4) var(--x2);
  padding-block: var(--x3);
}

.brand {
  margin-right: auto;
  color: var(--ink);
  text-decoration: none;
  font: 800 var(--f4)/1 var(--serif);
  letter-spacing: -0.02em;
}

.brand:hover {
  color: var(--ink);
}

.brand small {
  display: block;
  margin-top: var(--x6);
  font: 400 13px/1.3 var(--mono);
  letter-spacing: 0;
  color: var(--ink-3);
}

.nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--x4) var(--x3);
}

.nav a {
  color: var(--ink);
  text-decoration: none;
  font-weight: 500;
  font-size: 16px;
}

.nav a:hover {
  text-decoration: underline;
  text-decoration-color: var(--red);
}

.nav a[aria-current] {
  text-decoration: underline;
  text-decoration-color: var(--red);
  text-decoration-thickness: 2px;
}

.nav .btn {
  font-size: 15px;
}

.nav .live {
  display: inline-flex;
  align-items: center;
  gap: var(--x5);
  font-weight: 700;
  color: var(--ink);
}

.live::before, .on-air a::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 3px rgba(224, 103, 93, 0.2);
}

.site-foot {
  margin-top: var(--x1);
  border-top: 1px solid var(--rule);
  padding-block: var(--x1) var(--x2);
  font-size: var(--f6);
  color: var(--ink-2);
}

.site-foot .wrap {
  display: grid;
  gap: var(--x3);
}

.site-foot .brand {
  font-size: var(--f5);
}

.site-foot ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--x5) var(--x3);
}

.site-foot a {
  color: var(--ink);
}

.on-air {
  margin-top: var(--x5);
  font: 400 14px/1.4 var(--mono);
}

.on-air a {
  display: inline-flex;
  align-items: center;
  gap: var(--x5);
  color: var(--ink-2);
  text-decoration: none;
}

.on-air a::before {
  flex: none;
}

.on-air a:hover {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-color: var(--red);
}

@media (min-width: 900px) {
  .site-foot .wrap {
    grid-template-columns: 1fr auto;
    align-items: end;
  }
}
/* buttons */
.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--x5);
  padding: 11px var(--x3);
  border: 1.5px solid var(--ink);
  border-radius: 3px;
  background: var(--sheet);
  color: var(--ink);
  font: 600 16px/1.2 var(--sans);
  text-decoration: none;
  cursor: pointer;
}

.btn:hover {
  background: var(--hl);
  color: var(--ink);
  text-decoration: none;
}

.btn-ink {
  background: var(--ink);
  color: var(--sheet);
}

.btn-ink:hover {
  background: var(--pen);
  border-color: var(--pen);
  color: #fff;
}

.btn svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--x4);
}

/* shared bits */
.note-label {
  font: italic 500 var(--f5)/1.382 var(--serif);
  color: var(--pen);
}

.date {
  font: 400 13px/1.4 var(--mono);
  color: var(--ink-3);
  letter-spacing: -0.01em;
}

.sec {
  padding-block: var(--x1);
}

.sec-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--x4) var(--x2);
  margin-bottom: var(--x2);
}

.sec-head h2 {
  font-size: var(--f2);
}

.sec-head p {
  color: var(--ink-2);
}

.lede {
  font-size: var(--f4);
  line-height: 1.5;
  color: var(--ink-2);
}

/* theme tabs */
.t-agents {
  --tc: var(--t-agents);
}

.t-talk {
  --tc: var(--t-talk);
}

.t-found {
  --tc: var(--t-found);
}

.t-build {
  --tc: var(--t-build);
}

.t-fluency {
  --tc: var(--t-fluency);
}

.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--x6) var(--x5);
}

.tab {
  display: inline-block;
  padding: 5px 9px 4px;
  border: 1px solid rgba(26, 32, 48, 0.16);
  border-radius: 5px 5px 1px 1px;
  background: var(--tc, var(--rule));
  color: var(--ink);
  font: 400 12px/1.2 var(--mono);
  text-decoration: none;
}

/* thumbnails */
.thumb {
  position: relative;
  display: block;
  aspect-ratio: 16/9;
  overflow: hidden;
  border: 1px solid var(--rule-2);
  background: var(--sheet);
}

.thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.thumb-none {
  display: grid;
  place-items: center;
  background: repeating-linear-gradient(var(--sheet) 0 17px, #DCE6F5 17px 18px);
}

.thumb-none::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 18%;
  border-left: 3px double var(--red-soft);
}

.thumb-none span {
  position: relative;
  font: 700 var(--f3)/1 var(--serif);
  color: var(--ink);
}

/* margin ruled rows: number left of a double red rule */
.ruled {
  display: grid;
  grid-template-columns: var(--mcol) minmax(0, 1fr);
}

.ruled > .no {
  padding: var(--x3) var(--x4) 0 0;
  text-align: right;
  font: 700 var(--f4)/1.1 var(--serif);
  font-variant-numeric: lining-nums;
  color: var(--ink);
}

.ruled > .body {
  border-left: 3px double var(--red-soft);
  padding-left: var(--x3);
}

@media (min-width: 720px) {
  .ruled > .no {
    font-size: var(--f3);
  }
}
/* archive index */
.filter {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--x5) var(--x6);
  border-bottom: 2px solid var(--ink);
}

@media (min-width: 720px) {
  .filter {
    padding-left: var(--mcol);
  }
}
.ftab {
  padding: 9px 12px 8px;
  border: 1.5px solid rgba(26, 32, 48, 0.22);
  border-bottom-color: var(--ink);
  border-radius: 7px 7px 0 0;
  background: var(--tc, #ECE6D8);
  color: var(--ink);
  font: 500 var(--f6)/1.2 var(--sans);
  cursor: pointer;
  transition: padding 0.18s ease, background-color 0.18s ease;
}

.ftab span {
  margin-left: var(--x5);
  font: 400 12px/1 var(--mono);
  color: var(--ink-2);
}

.ftab:hover {
  border-color: rgba(26, 32, 48, 0.45);
  border-bottom-color: var(--ink);
}

.ftab[aria-pressed=true] {
  padding-top: 15px;
  border-color: var(--ink);
  font-weight: 700;
}

.count {
  margin-left: var(--mcol);
  padding: var(--x4) 0 0 var(--x3);
  border-left: 3px double var(--red-soft);
  font: 400 13px/1.4 var(--mono);
  color: var(--ink-3);
}

.month {
  margin: 0;
}

.month[hidden] {
  display: none;
}

.month-h {
  margin-left: var(--mcol);
  padding: var(--x2) 0 var(--x5) var(--x3);
  border-left: 3px double var(--red-soft);
  border-bottom: 1px solid var(--rule-2);
  font: italic 600 var(--f4)/1.2 var(--serif);
  color: var(--ink-2);
}

.index {
  list-style: none;
  margin: 0;
  padding: 0;
}

.index li[hidden] {
  display: none;
}

.entry {
  color: inherit;
  text-decoration: none;
}

.entry:hover {
  color: inherit;
}

.entry > .body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 104px;
  gap: var(--x5) var(--x3);
  padding-block: var(--x3);
  border-bottom: 1px solid var(--rule);
}

.entry .meta {
  grid-column: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--x5) var(--x4);
}

.entry h3 {
  grid-column: 1;
  font-size: var(--f4);
  font-weight: 600;
  line-height: 1.382;
}

.entry h3 span {
  transition: background-size 0.35s ease;
  background: linear-gradient(var(--hl-a), var(--hl-a)) no-repeat 0 72%/0 45%;
}

.entry:hover h3 span, .entry:focus-visible h3 span {
  background-size: 100% 45%;
}

.entry .takeaway {
  grid-column: 1/-1;
  color: var(--ink-2);
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.entry .tabs {
  grid-column: 1/-1;
}

.entry .thumb {
  grid-column: 2;
  grid-row: 1/span 2;
  align-self: start;
}

.entry .thumb-none span {
  font-size: var(--f5);
}

@media (max-width: 539px) {
  .entry > .body {
    grid-template-columns: minmax(0, 1fr);
  }
  .entry .thumb {
    display: none;
  }
}
@media (min-width: 720px) {
  .entry > .body {
    grid-template-columns: 116px minmax(0, 1fr) 176px;
    gap: var(--x6) var(--x2);
  }
  .ftab {
    font-size: 15px;
  }
  .entry .meta {
    grid-column: 1;
    grid-row: 1/span 3;
    padding-top: 6px;
  }
  .entry h3, .entry .takeaway, .entry .tabs {
    grid-column: 2;
  }
  .entry .tabs {
    margin-top: var(--x5);
  }
  .entry .takeaway {
    -webkit-line-clamp: 2;
  }
  .entry .thumb {
    grid-column: 3;
    grid-row: 1/span 3;
  }
  .entry .thumb-none span {
    font-size: var(--f3);
  }
}
/* home: hero */
.hero {
  padding-block: var(--x1);
}

.hero-grid {
  display: grid;
  gap: var(--x1);
}

.hero h1 {
  font-size: var(--fd);
  line-height: 1.18;
  letter-spacing: -0.03em;
  font-weight: 800;
}

.hero .lede {
  margin-top: var(--x2);
}

.hero .actions {
  margin-top: var(--x2);
}

.hero-when {
  margin-top: var(--x3);
  font: 400 14px/1.5 var(--mono);
  color: var(--ink-2);
}

.card {
  position: relative;
  border: 1px solid var(--rule-2);
  background: var(--sheet);
  padding: var(--x3);
}

.card .note-label {
  margin-bottom: var(--x4);
}

.card h2 {
  font-size: var(--f3);
  margin-block: var(--x5) var(--x4);
}

.card .thumb {
  margin: calc(var(--x3) * -1) calc(var(--x3) * -1) var(--x3);
  border-width: 0 0 1px;
}

.card .actions {
  margin-top: var(--x3);
}

.card .prev {
  margin-top: var(--x3);
  padding-top: var(--x4);
  border-top: 1px dashed var(--rule-2);
  font-size: 16px;
  color: var(--ink-2);
}

@media (min-width: 960px) {
  .hero-grid {
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
    align-items: start;
  }
  .hero {
    padding-block: calc(var(--x1) * 1.5) var(--x1);
  }
}
/* home: section dividers */
.dividers {
  display: grid;
  gap: var(--x2);
}

.divider {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.divider-tab {
  display: inline-block;
  margin-left: calc(var(--i, 0) * 6%);
  padding: 9px 14px 7px;
  border: 0;
  border-radius: 8px 8px 0 0;
  background: var(--tc);
  color: var(--ink);
  font: 700 var(--f5)/1.2 var(--serif);
  text-decoration: none;
}

.divider-tab:hover {
  color: var(--ink);
  text-decoration: underline;
}

.divider-body {
  align-self: stretch;
  display: grid;
  gap: var(--x3);
  padding: var(--x3);
  border: 1px solid var(--rule-2);
  border-top: 4px solid var(--tc);
  background: var(--sheet);
}

.divider-desc {
  font-size: var(--f5);
  color: var(--ink-2);
}

.divider-desc strong {
  display: block;
  margin-bottom: var(--x5);
  font: 600 var(--f4)/1.382 var(--serif);
  color: var(--ink);
}

.divider-eps {
  list-style: none;
  padding: 0;
  display: grid;
}

.divider-eps li + li {
  border-top: 1px solid var(--rule);
}

.divider-eps a {
  display: grid;
  grid-template-columns: 2.4em 1fr;
  gap: var(--x4);
  padding-block: var(--x5);
  color: var(--ink);
  text-decoration: none;
  line-height: 1.4;
}

.divider-eps a b {
  font: 700 var(--f5)/1.4 var(--serif);
  color: var(--ink-3);
  text-align: right;
}

.divider-eps a:hover span {
  text-decoration: underline;
  text-decoration-color: var(--pen);
}

.divider-more {
  font-size: 16px;
  font-weight: 600;
}

@media (min-width: 900px) {
  .divider-tab {
    margin-left: calc(var(--i, 0) * 19%);
    min-width: 17%;
  }
  .divider-body {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
    column-gap: var(--x1);
    padding: var(--x2);
  }
  .divider-more {
    grid-column: 2;
  }
}
/* home: recent tiles */
.tiles {
  list-style: none;
  padding: 0;
  display: grid;
  gap: var(--x2) var(--x3);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr));
}

.tile {
  display: grid;
  gap: var(--x5);
  color: var(--ink);
  text-decoration: none;
}

.tile:hover {
  color: var(--ink);
}

.tile .row {
  display: flex;
  align-items: baseline;
  gap: var(--x4);
  margin-top: var(--x5);
}

.tile .row b {
  font: 700 var(--f4)/1 var(--serif);
}

.tile h3 {
  font-size: var(--f5);
  font-weight: 600;
  line-height: 1.382;
}

.tile:hover h3 {
  text-decoration: underline;
  text-decoration-color: var(--pen);
  text-underline-offset: 0.18em;
}

/* home: funding ledger */
.funding {
  border-block: 1px solid var(--rule-2);
  background: var(--sheet);
}

.funding-grid {
  display: grid;
  gap: var(--x2);
}

.funding h2 {
  font-size: var(--f2);
}

.funding p {
  margin-top: var(--x4);
  color: var(--ink-2);
}

.funding .actions {
  margin-top: var(--x3);
}

.ledger {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
}

.ledger caption {
  text-align: left;
  padding-bottom: var(--x4);
  font: italic 600 var(--f5)/1.4 var(--serif);
}

.ledger th, .ledger td {
  padding: var(--x5) var(--x4) var(--x5) 0;
  border-bottom: 1px solid var(--rule);
  text-align: left;
  vertical-align: baseline;
}

.ledger thead th {
  font: 400 12px/1.3 var(--mono);
  color: var(--ink-3);
  border-bottom-color: var(--ink);
}

.ledger td:last-child, .ledger th:last-child {
  text-align: right;
  padding-right: 0;
  font-family: var(--mono);
  font-size: 15px;
  white-space: nowrap;
}

.ledger tbody th {
  font-weight: 600;
}

.ledger td small {
  display: block;
  color: var(--ink-3);
  font-size: var(--f6);
  line-height: 1.4;
}

.ledger tfoot td {
  border-bottom: 0;
  padding-top: var(--x4);
  font-weight: 600;
}

.ledger tfoot td:last-child {
  font-weight: 400;
}

.ledger tfoot td:last-child span {
  background: var(--hl-a);
  padding: 0 0.25em;
}

@media (min-width: 960px) {
  .funding-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
    column-gap: var(--x1);
  }
}
/* home: hosts */
.hosts {
  display: grid;
  gap: var(--x2);
}

.host h3 {
  font-size: var(--f3);
}

.host p {
  margin-top: var(--x4);
  color: var(--ink-2);
}

.host blockquote {
  margin-top: var(--x3);
  padding-left: var(--x3);
  border-left: 3px double var(--red-soft);
  font: italic 500 var(--f5)/1.5 var(--serif);
  color: var(--pen);
}

@media (min-width: 800px) {
  .hosts {
    grid-template-columns: 1fr 1fr;
    column-gap: var(--x1);
  }
}
/* signup */
.signup {
  display: grid;
  gap: var(--x2);
  padding: var(--x2) var(--gutter);
  border: 1.5px solid var(--ink);
  background: var(--sheet);
}

.signup h2 {
  font-size: var(--f2);
}

.signup p {
  margin-top: var(--x4);
  color: var(--ink-2);
}

.form label {
  display: block;
  margin-bottom: var(--x5);
  font-weight: 600;
  font-size: 16px;
}

.form .field {
  display: flex;
  flex-wrap: wrap;
  gap: var(--x4);
}

.form input[type=email] {
  flex: 1 1 220px;
  min-width: 0;
  padding: 11px var(--x4);
  border: 1.5px solid var(--ink);
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
  font-size: var(--f5);
}

.form input[type=email]::placeholder {
  color: var(--ink-3);
}

.form input[type=email]:focus {
  outline: 3px solid var(--hl);
  outline-offset: 0;
}

.form .fine {
  margin-top: var(--x4);
  font-size: var(--f6);
  color: var(--ink-3);
}

@media (min-width: 900px) {
  .signup {
    grid-template-columns: 1fr 1fr;
    column-gap: var(--x1);
    align-items: center;
    padding: var(--x1);
  }
}
/* breadcrumbs */
.crumbs {
  padding-top: var(--x2);
}

.crumbs ol {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--x5);
  font: 400 13px/1.4 var(--mono);
  color: var(--ink-3);
}

.crumbs li + li::before {
  content: "/";
  margin-right: var(--x5);
  color: var(--rule-2);
}

.crumbs a {
  color: var(--ink-2);
}

/* generic page + prose */
.wrap-read {
  max-width: calc(780px + var(--mcol) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.page-head > .body {
  padding-block: var(--x1) var(--x2);
}

.page-head h1 {
  font-size: var(--fd);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.382;
}

.page-head .lede {
  margin-top: var(--x3);
}

.page-body > .body {
  padding-bottom: var(--x1);
}

.prose > * + * {
  margin-top: var(--x3);
}

.prose > h2 {
  margin-top: var(--x1);
  font-size: var(--f2);
}

.prose > h3 {
  margin-top: var(--x2);
  font-size: var(--f3);
}

.prose > h4 {
  margin-top: var(--x2);
  font-size: var(--f4);
}

.prose ul, .prose ol {
  padding-left: 1.3em;
}

.prose li + li {
  margin-top: var(--x5);
}

.prose li::marker {
  color: var(--ink-3);
}

.prose blockquote {
  padding-left: var(--x3);
  border-left: 3px double var(--red-soft);
}

.prose blockquote p {
  font: italic 500 var(--f4)/1.45 var(--serif);
  color: var(--pen);
}

.prose blockquote cite {
  display: block;
  margin-top: var(--x5);
  font: normal 400 13px/1.45 var(--mono);
  color: var(--ink-3);
}

.prose figure img {
  border: 1px solid var(--rule-2);
}

.prose figcaption {
  margin-top: var(--x5);
  font-size: var(--f6);
  color: var(--ink-3);
}

.prose table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
}

.prose th, .prose td {
  padding: var(--x5) var(--x4) var(--x5) 0;
  border-bottom: 1px solid var(--rule);
  text-align: left;
  vertical-align: baseline;
}

.prose thead th {
  font: 400 12px/1.3 var(--mono);
  color: var(--ink-3);
  border-bottom-color: var(--ink);
}

.prose hr {
  border: 0;
  border-top: 1px solid var(--rule-2);
  margin-block: var(--x1);
}

.prose code {
  padding: 0 0.25em;
  border: 1px solid var(--rule);
  border-radius: 2px;
  background: var(--sheet);
  font: 400 0.88em var(--mono);
}

.prose .aside {
  padding: var(--x3);
  border: 1px dashed var(--rule-2);
}

.prose .takeaway-line {
  padding-block: var(--x3);
  border-block: 1.5px solid var(--ink);
  font-size: var(--f4);
  line-height: 1.5;
}

/* prev / next */
.pager {
  display: grid;
  gap: var(--x3);
}

.pager a {
  display: grid;
  gap: var(--x5);
  padding: var(--x3);
  border: 1px solid var(--rule-2);
  background: var(--sheet);
  color: var(--ink);
  text-decoration: none;
}

.pager a:hover {
  border-color: var(--ink);
  color: var(--ink);
}

.pager .pg {
  font: 600 var(--f4)/1.382 var(--serif);
}

.pager .pg b {
  margin-right: var(--x4);
  color: var(--ink-3);
}

@media (min-width: 720px) {
  .pager {
    grid-template-columns: 1fr 1fr;
  }
  .pager a[rel=next] {
    grid-column: 2;
    text-align: right;
  }
}
.wrap-wide {
  max-width: 1340px;
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.ep-head {
  padding-block: var(--x3) var(--x1);
}

.ep-grid {
  display: grid;
  gap: var(--x3);
  margin-top: var(--x2);
}

.ep-no {
  font: 800 var(--f1)/0.9 var(--serif);
  letter-spacing: -0.03em;
  font-variant-numeric: lining-nums;
}

.ep-no .lbl {
  display: block;
  margin-bottom: var(--x5);
  font: italic 500 var(--f5)/1.382 var(--serif);
  letter-spacing: 0;
  color: var(--pen);
}

.ep-title h1 {
  font-size: clamp(37px, 2.2dvw + 24px, 64px);
  font-weight: 800;
  line-height: 1.382;
  letter-spacing: -0.025em;
}

.ep-title .lede {
  margin-top: var(--x3);
}

.video {
  position: relative;
  aspect-ratio: 16/9;
  background: var(--ink);
  border: 1px solid var(--ink);
}

.video iframe, .video-facade {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.video-facade img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.play {
  position: absolute;
  left: var(--x3);
  bottom: var(--x3);
  display: inline-flex;
  align-items: center;
  gap: var(--x5);
  padding: 11px var(--x3);
  border: 1.5px solid var(--ink);
  border-radius: 3px;
  background: var(--hl);
  color: var(--ink);
  font: 600 16px/1.2 var(--sans);
}

.play svg {
  width: 16px;
  height: 16px;
}

.video-facade:hover .play {
  background: var(--sheet);
}

.ep-facts dl {
  display: grid;
  gap: var(--x4);
  margin: 0;
  font-size: 16px;
}

.ep-facts dl > div {
  display: grid;
  grid-template-columns: 6.5em minmax(0, 1fr);
  gap: var(--x4);
  padding-bottom: var(--x4);
  border-bottom: 1px solid var(--rule);
}

.ep-facts dt {
  font: 400 13px/1.8 var(--mono);
  color: var(--ink-3);
}

.ep-facts dd {
  margin: 0;
}

.ep-facts .actions {
  margin-top: var(--x3);
}

.ep-resources h2 {
  font: italic 600 var(--f5)/1.382 var(--serif);
  color: var(--pen);
}

.ep-resources ul {
  list-style: none;
  margin-top: var(--x4);
  padding: 0;
  display: grid;
  gap: var(--x4);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.ep-resources a {
  display: grid;
  align-content: start;
  gap: var(--x6);
  height: 100%;
  padding: var(--x4) var(--x3) var(--x3);
  border: 1px solid var(--rule-2);
  border-top: 3px double var(--red-soft);
  background: var(--sheet);
  color: var(--ink);
  text-decoration: none;
}

.ep-resources a:hover {
  border-color: var(--ink);
  border-top-color: var(--red);
  color: var(--ink);
}

.ep-resources .kind {
  font: 400 12px/1.4 var(--mono);
  color: var(--ink-3);
}

.ep-resources b {
  font: 600 var(--f5)/1.382 var(--serif);
}

.ep-resources a:hover b {
  text-decoration: underline;
  text-decoration-color: var(--pen);
  text-underline-offset: 0.18em;
}

.ep-resources .desc {
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink-2);
}

.transcript {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding-bottom: var(--x1);
}

.transcript > * {
  min-width: 0;
}

.transcript [id] {
  scroll-margin-top: var(--x2);
}

.transcript > p {
  margin-top: var(--x3);
}

.transcript > h2 {
  margin-top: var(--x1);
  font-size: var(--f2);
}

.transcript > h3:not(.chapter) {
  margin-top: var(--x1);
  font-size: var(--f4);
}

.transcript > ul {
  margin-top: var(--x3);
  padding: 0;
  list-style: none;
}

.transcript > ul > li {
  position: relative;
  padding-left: 1.6em;
}

.transcript > ul > li + li {
  margin-top: var(--x4);
}

.transcript > ul > li::before {
  content: "";
  position: absolute;
  left: 0.15em;
  top: 0.82em;
  width: 0.75em;
  border-top: 2px solid var(--pen);
}

.transcript > h3:not(.chapter) + ul > li::before {
  left: 0.4em;
  top: 0.32em;
  width: 0.4em;
  height: 0.75em;
  border: solid var(--pen);
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(40deg);
}

.transcript > p:has(.highlight) {
  margin-top: var(--x2);
  padding-block: var(--x3);
  border-block: 1.5px solid var(--ink);
  font-size: var(--f4);
  line-height: 1.5;
}

.tldr {
  padding: var(--x2) var(--x3);
  border: 1.5px solid var(--ink);
  background: var(--sheet);
}

.tldr h3 {
  font-size: var(--f3);
}

.tldr ul {
  margin-top: var(--x3);
  padding: 0;
  list-style: none;
  counter-reset: note;
}

.tldr li {
  position: relative;
  padding-left: 2em;
  counter-increment: note;
}

.tldr li + li {
  margin-top: var(--x3);
  padding-top: var(--x3);
  border-top: 1px solid var(--rule);
}

.tldr li::before {
  content: counter(note);
  position: absolute;
  left: 0;
  font: italic 600 var(--f4)/1.15 var(--serif);
  color: var(--pen);
}

.callout.note {
  margin-top: var(--x2);
  padding: var(--x3);
  border: 1px dashed var(--rule-2);
}

.callout.note h3, .toc h3, .about-show h3 {
  font: italic 600 var(--f5)/1.382 var(--serif);
  color: var(--pen);
}

.callout.note ul {
  margin-top: var(--x4);
  padding-left: 1.1em;
}

.callout.note li + li {
  margin-top: var(--x5);
}

.callout.note li::marker {
  color: var(--ink-3);
}

.toc {
  margin-top: var(--x2);
}

.toc ul {
  margin-top: var(--x4);
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--rule-2);
}

.toc li {
  break-inside: avoid;
  border-bottom: 1px solid var(--rule);
}

.toc a {
  display: block;
  padding: var(--x5) 8px;
  margin-inline: -8px;
  border-radius: 2px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.4;
  text-decoration: none;
}

.toc a:hover {
  text-decoration: underline;
  text-decoration-color: var(--pen);
}

.toc a.is-current {
  background: var(--hl-a);
}

.toc-ts {
  display: block;
  font: 400 12px/1.5 var(--mono);
  color: var(--pen);
}

@media (min-width: 600px) and (max-width: 959px) {
  .toc ul {
    columns: 2;
    column-gap: var(--x2);
  }
}
.about-show {
  margin-top: var(--x2);
  padding: var(--x3);
  background: #F3EEE1;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.6;
}

.about-show h3 {
  margin-bottom: var(--x5);
  color: var(--ink);
}

.faq-section {
  margin-top: var(--x1);
}

.faq-section h3 {
  font-size: var(--f3);
}

.faq-item {
  position: relative;
  margin-top: var(--x3);
  padding: var(--x3) 0 0 2.2em;
  border-top: 1px solid var(--rule);
}

.faq-item .question {
  font: 600 var(--f5)/1.45 var(--serif);
}

.faq-item .answer {
  margin-top: var(--x5);
  color: var(--ink-2);
}

.faq-item .question::before, .faq-item .answer::before {
  position: absolute;
  left: 0;
  font: italic 600 var(--f4)/1.1 var(--serif);
}

.faq-item .question::before {
  content: "Q";
  color: var(--pen);
}

.faq-item .answer::before {
  content: "A";
  color: var(--red);
}

.marginalia {
  margin-top: var(--x1);
}

.marginalia h2 {
  font-size: var(--f2);
}

.marginalia #quotes {
  margin-top: var(--x1);
}

.definition-box {
  margin-top: var(--x3);
  padding: var(--x3);
  border: 1px solid var(--rule-2);
  background: var(--sheet);
}

.definition-box .term {
  display: block;
  font: 600 var(--f4)/1.382 var(--serif);
}

.definition-box p {
  margin-top: var(--x5);
  color: var(--ink-2);
}

.marginalia blockquote {
  margin-top: var(--x3);
  padding-left: var(--x3);
  border-left: 3px double var(--red-soft);
}

.marginalia blockquote p {
  font: italic 500 var(--f4)/1.45 var(--serif);
  color: var(--pen);
}

.marginalia cite {
  display: block;
  margin-top: var(--x5);
  font: normal 400 13px/1.45 var(--mono);
  color: var(--ink-3);
}

.transcript > h3.chapter {
  margin-top: var(--x1);
  padding-top: var(--x3);
  border-top: 1px solid var(--rule-2);
  font-size: var(--f3);
  line-height: 1.2;
}

.chapter .ts {
  display: block;
  margin-bottom: var(--x4);
  font: 400 14px/1 var(--mono);
}

.chapter .ts a {
  display: inline-flex;
  align-items: center;
  gap: var(--x5);
  padding: 6px 10px;
  border: 1px solid rgba(31, 75, 199, 0.4);
  border-radius: 3px;
  background: var(--sheet);
  text-decoration: none;
}

.chapter .ts a::before {
  content: "";
  border-left: 8px solid currentColor;
  border-block: 5px solid transparent;
}

.chapter .ts a:hover {
  border-color: var(--ink);
  background: var(--hl);
  color: var(--ink);
}

@media (min-width: 960px) {
  .ep-head {
    padding-bottom: 0;
  }
  .ep-grid, .transcript {
    grid-template-columns: 220px minmax(0, 1fr);
    column-gap: var(--x1);
  }
  .ep-grid {
    position: relative;
    row-gap: var(--x2);
    padding-bottom: var(--x1);
  }
  .ep-grid::before, .transcript::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(220px + var(--x1) / 2 - 2px);
    border-left: 3px double var(--red-soft);
  }
  .ep-no {
    grid-column: 1;
    grid-row: 1;
    text-align: right;
    font-size: clamp(72px, 3dvw + 44px, 112px);
  }
  .ep-title, .video, .ep-facts, .ep-resources {
    grid-column: 2;
  }
  .transcript > * {
    grid-column: 2;
  }
  .transcript > .toc {
    grid-column: 1;
    grid-row: 1/span 160;
    align-self: start;
    position: sticky;
    top: 0;
    max-height: 100dvh;
    margin-top: 0;
    padding: var(--x3) var(--x4) var(--x3) 0;
    overflow-y: auto;
    scrollbar-width: thin;
  }
  .toc a {
    font-size: var(--f6);
    padding-block: 6px;
  }
}
@media (min-width: 1240px) {
  .ep-grid, .transcript {
    grid-template-columns: 220px minmax(0, 1fr) 272px;
  }
  .ep-title {
    grid-column: 2/span 2;
  }
  .video {
    grid-column: 2;
    grid-row: 2;
  }
  .ep-facts {
    grid-column: 3;
    grid-row: 2;
    align-self: start;
  }
  .ep-resources {
    grid-column: 2/span 2;
  }
  .transcript > .marginalia {
    grid-column: 3;
    grid-row: span 40;
    align-self: start;
    margin-top: var(--x1);
  }
  .marginalia h2 {
    padding-bottom: var(--x5);
    border-bottom: 1px solid var(--rule-2);
    font: italic 600 var(--f5)/1.382 var(--serif);
    color: var(--pen);
  }
  .marginalia .definition-box {
    margin: 0;
    padding: var(--x4) 0;
    border: 0;
    border-bottom: 1px solid var(--rule);
    background: none;
  }
  .marginalia .term {
    font-size: var(--f5);
  }
  .marginalia .definition-box p {
    font-size: 16px;
    line-height: 1.55;
  }
  .marginalia blockquote {
    padding-left: 0;
    border-left: 0;
  }
  .marginalia blockquote p {
    font-size: var(--f5);
    line-height: 1.5;
  }
}
.transcript > h4 {
  margin-top: var(--x2);
  font-size: var(--f5);
}

.transcript > ol {
  margin-top: var(--x3);
  padding-left: 1.4em;
}

.transcript > ol > li + li {
  margin-top: var(--x4);
}

.transcript > blockquote {
  margin-top: var(--x3);
  padding-left: var(--x3);
  border-left: 3px double var(--red-soft);
}

.transcript > blockquote p {
  font: italic 500 var(--f4)/1.45 var(--serif);
  color: var(--pen);
}

.transcript > blockquote cite {
  display: block;
  margin-top: var(--x5);
  font: normal 400 13px/1.45 var(--mono);
  color: var(--ink-3);
}

.tldr > p {
  margin-top: var(--x3);
}

.stat-callout, .transcript > .callout:not(.note) {
  margin-top: var(--x3);
  padding: var(--x3);
  border: 1px solid var(--rule-2);
  background: var(--sheet);
}

.stat-callout {
  border-left: 3px double var(--red-soft);
}

.transcript > .callout.alert {
  border-color: var(--red-soft);
}

.stat-label {
  display: block;
  font: 400 12px/1.4 var(--mono);
  color: var(--ink-3);
}

.stat-callout p, .transcript > .callout p + p {
  margin-top: var(--x5);
}

.transcript > p.impact {
  margin-top: var(--x2);
  font: italic 600 var(--f4)/1.4 var(--serif);
  color: var(--pen);
}

.marginalia > p {
  margin-top: var(--x3);
  color: var(--ink-2);
}

.marginalia dl {
  margin: var(--x3) 0 0;
}

.marginalia dt {
  margin-top: var(--x4);
  font: 600 var(--f5)/1.382 var(--serif);
}

.marginalia dd {
  margin: var(--x5) 0 0;
  color: var(--ink-2);
}

.page-head > .no {
  padding-top: calc(var(--x1) + 4px);
  font: 800 var(--f2)/0.9 var(--serif);
  letter-spacing: -0.03em;
  font-variant-numeric: lining-nums;
}

.page-head .date {
  display: block;
  margin-top: var(--x4);
  font-size: 14px;
}

.page-head .from {
  margin-top: var(--x4);
  font-size: 16px;
}

@media (min-width: 720px) {
  .page-head > .no {
    font-size: var(--f1);
  }
}
.figures {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  margin: 0;
  border-block: 1.5px solid var(--ink);
}

.figures > div {
  padding: var(--x3) var(--x4) var(--x3) 0;
  border-bottom: 1px solid var(--rule);
}

.figures dt {
  font: 400 12px/1.4 var(--mono);
  color: var(--ink-3);
}

.figures dd {
  margin: var(--x5) 0 0;
  font: 800 var(--f3)/1 var(--serif);
  letter-spacing: -0.02em;
  font-variant-numeric: lining-nums;
}

.figures dd span {
  padding: 0 0.12em;
  background: var(--hl-a);
}

.figures small {
  display: block;
  margin-top: var(--x5);
  font: 400 13px/1.4 var(--sans);
  color: var(--ink-2);
}

.sourcing {
  padding: var(--x3);
  border: 1px dashed var(--rule-2);
  background: var(--sheet);
}

.sourcing h2 {
  margin: 0;
  font: italic 600 var(--f5)/1.382 var(--serif);
  color: var(--pen);
}

.sourcing ul {
  margin-top: var(--x4);
  font-size: 16px;
  line-height: 1.55;
  color: var(--ink-2);
}

.sourcing b {
  color: var(--ink);
}

.prose > .regions {
  list-style: none;
  padding: 0;
}

.regions li {
  padding-block: var(--x4);
  border-bottom: 1px solid var(--rule);
}

.prose > .regions li + li {
  margin-top: 0;
}

.region-h {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--x6) var(--x4);
}

:root {
  --r-us: #F97316;
  --r-cn: #38BDF8;
  --r-eu: #A3E635;
  --r-ap: #C084FC;
  --r-me: #2DD4BF;
  --r-la: #F472B6;
  --r-rw: #94A3B8;
}

.r-us {
  --rc: var(--r-us);
}

.r-cn {
  --rc: var(--r-cn);
}

.r-eu {
  --rc: var(--r-eu);
}

.r-ap {
  --rc: var(--r-ap);
}

.r-me {
  --rc: var(--r-me);
}

.r-la {
  --rc: var(--r-la);
}

.r-rw {
  --rc: var(--r-rw);
}

.region-h b {
  font: 600 var(--f5)/1.382 var(--serif);
  margin-right: auto;
}

.region-h b::before, .weeks th.rg::before, .chart-key li::before {
  content: "";
  display: inline-block;
  width: 0.72em;
  height: 0.72em;
  margin-right: 0.45em;
  border: 1px solid rgba(26, 32, 48, 0.3);
  border-radius: 2px;
  background: var(--rc, var(--ink));
  vertical-align: -0.02em;
}

.region-h .amt {
  font: 400 15px/1.3 var(--mono);
}

.region-h .share {
  flex-basis: 100%;
  font: 400 13px/1.3 var(--mono);
  color: var(--ink-3);
}

.bar {
  display: block;
  height: 8px;
  margin-block: var(--x5);
  background: linear-gradient(var(--rc, var(--ink)), var(--rc, var(--ink))) no-repeat 0 0/calc(var(--share, 0) * 1%) 100%, var(--rule);
  box-shadow: inset 0 0 0 1px rgba(26, 32, 48, 0.08);
}

.regions p:last-child {
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.55;
}

.prose > .rounds {
  list-style: none;
  padding: 0;
  counter-reset: rank;
}

.rounds > li {
  position: relative;
  padding-block: var(--x3);
  border-top: 1px solid var(--rule-2);
  counter-increment: rank;
}

.prose > .rounds > li + li {
  margin-top: 0;
}

.rounds > li::before {
  content: counter(rank);
  position: absolute;
  top: var(--x3);
  right: calc(100% + var(--x3) + var(--x4));
  font: 800 var(--f2)/1 var(--serif);
  color: var(--ink-3);
}

.rounds h3 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--x5) var(--x4);
  font-size: var(--f3);
}

.rounds h3 .amt {
  padding: 0 0.15em;
  background: var(--hl-a);
  font-size: var(--f4);
}

.round-meta {
  margin-top: var(--x5);
  font: 400 13px/1.5 var(--mono);
  color: var(--ink-3);
}

.rounds p + p {
  margin-top: var(--x4);
}

.round-note {
  padding-left: var(--x3);
  border-left: 3px double var(--red-soft);
  font: italic 500 16px/1.5 var(--serif);
  color: var(--pen);
}

.chart {
  margin: 0;
  padding: var(--x3);
  border: 1px solid var(--rule-2);
  background: var(--sheet);
}

.chart figcaption {
  margin: 0;
  font: 600 var(--f4)/1.382 var(--serif);
  color: var(--ink);
}

.chart-key {
  list-style: none;
  margin: var(--x4) 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--x5) var(--x3);
  font: 400 13px/1.4 var(--mono);
  color: var(--ink-2);
}

.prose .chart-key li + li {
  margin-top: 0;
}

.chart-plot {
  margin-top: var(--x3);
  background: repeating-linear-gradient(90deg, transparent 0 23px, rgba(31, 75, 199, 0.07) 23px 24px), repeating-linear-gradient(transparent 0 23px, rgba(31, 75, 199, 0.07) 23px 24px);
}

.chart-plot svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  font-family: var(--mono);
}

.chart-note {
  margin-top: var(--x4);
  font-size: 16px;
  line-height: 1.55;
  color: var(--ink-2);
}

.charts {
  display: grid;
  gap: var(--x2);
}

@media (min-width: 1100px) {
  .charts {
    grid-template-columns: 1fr 1fr;
  }
  .charts .chart:nth-child(-n+2) {
    grid-column: 1/-1;
  }
}
.table-scroll {
  overflow-x: auto;
  border-top: 2px solid var(--ink);
}

.weeks {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  font-size: 15px;
}

.weeks th, .weeks td {
  padding: var(--x5) var(--x4) var(--x5) 0;
  border-bottom: 1px solid var(--rule);
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.weeks th:first-child, .weeks td:first-child {
  text-align: left;
}

.weeks thead th {
  font: 400 12px/1.3 var(--mono);
  color: var(--ink-3);
  vertical-align: bottom;
  white-space: normal;
}

.weeks tbody th {
  font: 700 var(--f5)/1.3 var(--serif);
  text-align: left;
}

.weeks td {
  font-family: var(--mono);
}

.weeks td.report {
  font-family: var(--sans);
}

.weeks tr.is-majority td:nth-child(4) {
  background: var(--hl-a);
}

.weeks tbody tr:first-child {
  background: var(--sheet);
}
/*pm-css m:0*/