.kba{
  --k-pl:#c24a26; --k-us:#2b64b8; --k-other:#c9c4b8;
  --k-wash-pl:rgba(194,74,38,.09); --k-wash-us:rgba(43,100,184,.08);
  --k-ink:var(--fg); --k-ink2:var(--muted); --k-muted:#7a756c; --k-bg:var(--bg);
  --k-grid:rgba(26,23,18,.09); --k-axis:#c9c4b8; --k-card:rgba(26,23,18,.028);
  --k-s1:#3d3a33; --k-s1-t:#fffff8; --k-s2:#a39e92; --k-s2-t:#1a1712; --k-s3:#e2ded3; --k-s3-t:#1a1712;
  --k-m1:#d9d3f6; --k-m2:#b8aeee; --k-m3:#9084dd; --k-m4:#6555c8; --k-m5:#463696;
  --k-n1:#cdeee0; --k-n2:#97d9be; --k-n3:#57bb94; --k-n4:#22906b; --k-n5:#0d6b4f;
  --k-nodata:#ebe8df;
}
@media (prefers-color-scheme: dark){
  .kba{
    --k-pl:#e2764e; --k-us:#6a9de6; --k-other:#4a463e;
    --k-wash-pl:rgba(226,118,78,.13); --k-wash-us:rgba(106,157,230,.12);
    --k-muted:#8c8477; --k-grid:rgba(221,214,202,.10); --k-axis:#4a463e; --k-card:rgba(221,214,202,.035);
    --k-s1:#d8d1c4; --k-s1-t:#11110e; --k-s2:#6e685d; --k-s2-t:#fffdf7; --k-s3:#33302a; --k-s3-t:#ddd6ca;
    --k-m1:#3d3580; --k-m2:#5247a3; --k-m3:#6c60c8; --k-m4:#8f84e3; --k-m5:#c2baf5;
    --k-n1:#1e5a46; --k-n2:#237a5d; --k-n3:#2f9a75; --k-n4:#5cbf98; --k-n5:#a7e2c9;
    --k-nodata:#24231f;
  }
}

.kba h3{ margin-top:3.2rem; }
.kba h4.r-ct{ width:var(--measure); font-family:var(--sans); font-weight:600; font-size:1.05rem; line-height:1.35;
  margin:2.4rem 0 .6rem; }
.kba .r-chart{ width:var(--measure); margin:0 0 2rem; font-family:var(--sans); hyphens:none; }
.kba .r-chart p, .kba .r-chart ul, .kba .r-chart ol, .kba .r-chart table{ width:auto; }
.kba .alert ul{ width:auto; }
.kba .plot{ width:100%; min-width:0; position:relative; }
.kba svg{ display:block; width:100%; height:auto; overflow:visible; }
.kba svg text{ font-family:var(--sans); font-variant-numeric:lining-nums tabular-nums; }

.kba .legend{ display:flex; flex-wrap:wrap; gap:.3rem 1.1rem; font-size:.85rem; color:var(--k-ink2); margin:0 0 .7rem; }
.kba .legend span{ display:inline-flex; align-items:center; gap:.4rem; }
.kba .sw{ width:12px; height:12px; border-radius:2px; display:inline-block; flex:none; }
.kba .sw.ring{ background:transparent !important; border:2px solid currentColor; border-radius:50%; width:10px; height:10px; }
.kba .sw.dot{ border-radius:50%; width:10px; height:10px; }

.kba .tabs{ display:flex; flex-wrap:wrap; gap:.4rem; margin:0 0 .7rem; }
.kba .tabs button{ font:500 .85rem/1 var(--sans); color:var(--k-ink2); background:transparent; border:1px solid var(--k-axis);
  border-radius:999px; padding:.45rem .8rem; cursor:pointer; }
.kba .tabs button[aria-selected="true"]{ background:var(--fg); color:var(--bg); border-color:var(--fg); }
.kba .tabs button:hover:not([aria-selected="true"]){ border-color:var(--k-ink2); color:var(--fg); }
.kba .takeaway{ font-family:var(--serif); font-size:1.15rem; line-height:1.45; margin:0 0 .8rem; min-height:2.9em; }

.kba .qcards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:.8rem; }
.kba .qcard{ display:flex; flex-direction:column; gap:.45rem; background:var(--k-card); border:1px solid var(--rule);
  border-top:3px solid var(--k-other); border-radius:4px; padding:.9rem 1rem; color:inherit; background-image:none; }
.kba .qcard.pl{ border-top-color:var(--k-pl); }
.kba .qcard.us{ border-top-color:var(--k-us); }
.kba a.qcard:hover{ border-color:var(--k-ink2); color:inherit; }
.kba .qcard .who{ font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--k-ink2); }
.kba .qcard .num{ font-size:2.2rem; line-height:1; font-weight:600; color:var(--strong); font-variant-numeric:lining-nums; }
.kba .qcard .q{ font-size:.9rem; line-height:1.4; color:var(--fg); flex:1; }
.kba .qcard .meta{ font-size:.78rem; line-height:1.35; color:var(--k-ink2); }

.kba details.r-data{ margin:.6rem 0 0; font-size:.88rem; }
.kba details.r-data summary{ cursor:pointer; color:var(--k-ink2); }
.kba .tblwrap{ overflow-x:auto; margin-top:.4rem; }
.kba table{ width:100%; border-collapse:collapse; font-size:.85rem; font-variant-numeric:lining-nums tabular-nums; margin:.3rem 0; }
.kba th, .kba td{ text-align:left; padding:.3rem .7rem .3rem 0; border-bottom:1px solid var(--rule); vertical-align:top; }
.kba th{ font-weight:600; color:var(--k-ink2); vertical-align:bottom; }
.kba td.n, .kba th.n{ text-align:right; }
.kba tr.grp td{ font-weight:600; padding-top:.8rem; border-bottom:none; }

.kba details.r-sources{ width:var(--measure); margin:3rem 0 1rem; font-family:var(--sans); font-size:.9rem; }
.kba details.r-sources summary{ cursor:pointer; color:var(--k-ink2); }
.kba details.r-sources ol{ width:auto; margin:.6rem 0; padding-left:1.4rem; line-height:1.45; overflow-wrap:anywhere; }

.kba .r-tip{ position:fixed; pointer-events:none; opacity:0; transition:opacity .1s; z-index:20;
  background:var(--fg); color:var(--bg); padding:.4rem .6rem; border-radius:3px; font-family:var(--sans);
  font-size:.85rem; line-height:1.35; max-width:16rem; }
.kba .r-tip.on{ opacity:1; }
.kba .r-tip b{ color:inherit; }
@media (prefers-reduced-motion:reduce){ .kba *{ transition:none !important; } }
.kba h4 .sidenote{ font-family:var(--serif); font-weight:400; }
.kba .r-chart.r-full{ width:auto; max-width:90%; clear:right; margin-bottom:.6rem; }
.kba .r-fullnote{ font-size:1.05rem; line-height:1.45; color:var(--muted); margin:.2rem 0 2.4rem; }
@media (max-width:860px){ .kba .r-chart.r-full{ max-width:100%; } }