.footnote-ref { font-weight: bold; &:before { content: " ["; } &:after { content: "] "; } } .footnote-backref { } .footnotes { hr { display: flex; align-items: center; border: 0; &:before { content: "Footnotes"; color: var(--ui-text); text-transform: uppercase; font-weight: 900; font-size: 0.8em; } &:after { content: ''; inline-size: 100%; margin-inline-start: 1rem; border-block-end: 1px solid var(--ui-overlay); } } } #footnotes h2 { font-size: 1rem; font-weight: 900; text-transform: uppercase; position: relative; &:after { content: ''; position: absolute; inset-inline-end: 0; inset-block-start: calc(50% - 1px); background: var(--ui-overlay); block-size: 1px; inline-size: calc(100% - 12ch); } } sup[id^="fnref:"] { display: contents; a { margin-inline-end: 0.125em; margin-inline-start: 0.375em; } }