/* Fee donuts (fee-donuts.js): shared by the Protocol page and the whitepaper. */
.fee-donuts{container-type:inline-size;--fd-track:#e6e4dc;--fd-ink:#14120f;--fd-muted:#55524c;--fd-line:#d6d3ca;--fd-card:#fbfaf5}
.fd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fd-card{display:flex;flex-direction:column;padding:22px 22px 20px;background:var(--fd-card);box-shadow:inset 0 0 0 1.5px var(--fd-ink);color:var(--fd-ink)}
.fd-card .fd-head h3{margin:0;font:900 26px/1.05 var(--display,'Barlow Condensed',sans-serif);text-transform:uppercase}
.fd-card .fd-head p{margin:6px 0 0;font-size:13px;color:var(--fd-muted)}
.fd-body{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;align-items:center;margin-top:18px}
.fee-donuts svg.fd-ring{display:block;width:150px!important;height:150px!important;max-width:none!important;overflow:visible;fill:initial;stroke:initial}
.fd-ring .fd-seg{transition:opacity .15s}
/* The numbers in a clear, open face with even digits: the condensed display face at 900 ran together at this size. */
.fee-donuts .fd-ring .fd-big{font-family:'DM Sans',sans-serif;font-weight:700;font-size:34px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;fill:var(--fd-ink)}
.fee-donuts .fd-ring .fd-pct{font-size:20px;font-weight:600}
.fd-ring .fd-small{font:500 11px/1 var(--mono,'IBM Plex Mono',monospace);letter-spacing:.08em;text-transform:uppercase;fill:var(--fd-muted)}
.fd-legend{margin:0;padding:0;list-style:none}
.fd-legend li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--fd-line);transition:opacity .15s}
.fd-legend li:last-child{border-bottom:0}
.fd-legend i{width:12px;height:12px;border-radius:50%;transform:translateY(1px)}
.fd-legend b{display:block;font-size:15px;font-weight:700}
.fd-legend small{display:block;margin-top:4px;font:500 12px/1.5 var(--mono,'IBM Plex Mono',monospace);color:var(--fd-muted)}
.fd-legend em{font:700 18px/1 'DM Sans',sans-serif;font-style:normal;font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap}
.fd-legend em .fd-pct{margin-left:2px;font-size:13px;font-weight:600;color:var(--fd-muted)}
.fee-donuts .is-dim{opacity:.25}
.fd-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:12px;font-size:13px}
.fd-switch{display:inline-flex;border:1.5px solid var(--fd-ink)}
.fd-switch button{min-height:34px;padding:0 12px;border:0;background:transparent;color:var(--fd-ink);font:600 13px/1 inherit;cursor:pointer}
.fd-switch button[aria-pressed="true"]{background:var(--fd-ink);color:#d8fa22}
.fd-controls label{display:inline-flex;align-items:center;gap:8px;color:var(--fd-muted)}
.fd-controls select{min-height:34px;padding:0 8px;border:1.5px solid var(--fd-ink);border-radius:0;background:var(--fd-card);color:var(--fd-ink);font:600 13px/1 inherit}
.fd-tile{display:flex;align-items:baseline;gap:14px;margin-top:16px;padding:16px 20px;background:var(--fd-ink);color:#f6f5ef}
.fd-tile b{white-space:nowrap;font:900 40px/1 var(--display,'Barlow Condensed',sans-serif);color:#e34948}
.fd-tile span{font-size:14px}
/* By the room the charts get, not the screen: the whitepaper column is narrower than the site. */
@container (max-width:860px){.fd-grid{grid-template-columns:1fr}}
@container (max-width:440px){.fd-body{grid-template-columns:1fr;justify-items:center}.fd-legend{width:100%}}
@container (max-width:300px){.fd-legend em{font-size:16px}.fd-legend li{gap:10px}}
@media(prefers-reduced-motion:reduce){.fd-ring .fd-seg,.fd-legend li{transition:none}}