Use device native fonts by default in O’Reilly reader interface

oreilly.css

/* Variables so we can try alternates. You can use serif fonts,
   for example, by transposing some lines. */
body {
	--font-variable-width: -apple-system-ui-serif, ui-serif, Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times, Source Serif Pro, serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
	--font-variable-width: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	--font-monospace: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;
}

/* General text */
body,
*,
body #book-content #sbo-rt-content p,
body #book-content #sbo-rt-content .note p,
body #book-content #sbo-rt-content blockquote,
body #book-content #sbo-rt-content blockquote p,
body #book-content #sbo-rt-content .blockquote p {
	font-family: var(--font-variable-width) !important;
}

/* Code */
body #book-content #sbo-rt-content code,
body #book-content #sbo-rt-content code code,
body #book-content #sbo-rt-content .codeLabel {
	font-family: var(--font-monospace) !important;
	font-size: 90%;
}

/* Chapter titles */
body #book-content #sbo-rt-content h1,
body #book-content #sbo-rt-content h2,
body #book-content #sbo-rt-content h3,
body #book-content #sbo-rt-content h4,
body #book-content #sbo-rt-content h5,
body #book-content #sbo-rt-content h6,
body #book-content #sbo-rt-content .heading-1,
body #book-content #sbo-rt-content .paragraph-head,
body #book-content #sbo-rt-content .cn-chapter-number,
body #book-content #sbo-rt-content .heading-3,
body #book-content #sbo-rt-content .title_document,
body #book-content #sbo-rt-content .fm_title_document,
body #book-content #sbo-rt-content .box_title,
body #book-content #sbo-rt-content .chaptertitle,
body #book-content #sbo-rt-content .chapterTitle,
body #book-content #sbo-rt-content .chapterNumber {
	font-family: var(--font-variable-width) !important;
	font-weight: 800 !important;
}

/* Code labels? */
body #book-content #sbo-rt-content code,
body #book-content #sbo-rt-content code code,
body #book-content #sbo-rt-content .codeLabel {
	font-family: var(--font-monospace) !important;
}

/* "Program listing" */
body #book-content #sbo-rt-content pre,
body #book-content #sbo-rt-content .pre,
body #book-content #sbo-rt-content p.pre,
body #book-content #sbo-rt-content .pre1,
body #book-content #sbo-rt-content .pre-ex,
body #book-content #sbo-rt-content .pre-ex1,
body #book-content #sbo-rt-content .pre_w {
	font-family: var(--font-monospace) !important;
}

/* Note / tip */
#book-content #sbo-rt-content div.tip h1,
#book-content #sbo-rt-content div.tip h2,
#book-content #sbo-rt-content div.tip h3,
#book-content #sbo-rt-content div.tip h4,
#book-content #sbo-rt-content div.tip h5,
#book-content #sbo-rt-content div.tip h6,
#book-content #sbo-rt-content div.tip .title,
#book-content #sbo-rt-content .tip h1,
#book-content #sbo-rt-content .tip h2,
#book-content #sbo-rt-content .tip h3,
#book-content #sbo-rt-content .tip h4,
#book-content #sbo-rt-content .tip h5,
#book-content #sbo-rt-content .tip h6,
#book-content #sbo-rt-content .tip .title,
#book-content #sbo-rt-content div[data-type="tip"] h1,
#book-content #sbo-rt-content div[data-type="tip"] h2,
#book-content #sbo-rt-content div[data-type="tip"] h3,
#book-content #sbo-rt-content div[data-type="tip"] h4,
#book-content #sbo-rt-content div[data-type="tip"] h5,
#book-content #sbo-rt-content div[data-type="tip"] h6,
#book-content #sbo-rt-content div[data-type="tip"] .title,
#book-content #sbo-rt-content .note h3,
#book-content #sbo-rt-content .note h6,
#book-content #sbo-rt-content .note .title,
#book-content #sbo-rt-content div.note h1,
#book-content #sbo-rt-content div.note h2,
#book-content #sbo-rt-content div.note h3,
#book-content #sbo-rt-content div.note h4,
#book-content #sbo-rt-content div.note h5,
#book-content #sbo-rt-content div.note h6,
#book-content #sbo-rt-content div.note .title,
#book-content #sbo-rt-content div[data-type="note"] h1,
#book-content #sbo-rt-content div[data-type="note"] h2,
#book-content #sbo-rt-content div[data-type="note"] h3,
#book-content #sbo-rt-content div[data-type="note"] h4,
#book-content #sbo-rt-content div[data-type="note"] h5,
#book-content #sbo-rt-content div[data-type="note"] h6,
#book-content #sbo-rt-content div[data-type="note"] .title,
#book-content #sbo-rt-content .warning h1,
#book-content #sbo-rt-content .warning h2,
#book-content #sbo-rt-content .warning h3,
#book-content #sbo-rt-content .warning h4,
#book-content #sbo-rt-content .warning h5,
#book-content #sbo-rt-content .warning h6,
#book-content #sbo-rt-content .warning .title,
#book-content #sbo-rt-content div[data-type="warning"] h1,
#book-content #sbo-rt-content div[data-type="warning"] h2,
#book-content #sbo-rt-content div[data-type="warning"] h3,
#book-content #sbo-rt-content div[data-type="warning"] h4,
#book-content #sbo-rt-content div[data-type="warning"] h5,
#book-content #sbo-rt-content div[data-type="warning"] h6,
#book-content #sbo-rt-content div[data-type="warning"] .title,
#book-content #sbo-rt-content div[data-type="caution"] h1,
#book-content #sbo-rt-content div[data-type="caution"] h2,
#book-content #sbo-rt-content div[data-type="caution"] h3,
#book-content #sbo-rt-content div[data-type="caution"] h4,
#book-content #sbo-rt-content div[data-type="caution"] h5,
#book-content #sbo-rt-content div[data-type="caution"] h6,
#book-content #sbo-rt-content .note1 h3,
#book-content #sbo-rt-content .note1 h6,
#book-content #sbo-rt-content .note1 .title,
#book-content #sbo-rt-content .sidebar1 h3,
#book-content #sbo-rt-content .sidebar1 h6,
#book-content #sbo-rt-content .sidebar1 .title,
#book-content #sbo-rt-content .boxg h3,
#book-content #sbo-rt-content .boxg h6,
#book-content #sbo-rt-content .boxg .title,
#book-content #sbo-rt-content div.sidebar h1,
#book-content #sbo-rt-content div.sidebar h2,
#book-content #sbo-rt-content div.sidebar h3,
#book-content #sbo-rt-content div.sidebar h4,
#book-content #sbo-rt-content div.sidebar h5,
#book-content #sbo-rt-content div.sidebar h6,
#book-content #sbo-rt-content div.sidebar .title,
#book-content #sbo-rt-content div[data-type="sidebar"] h1,
#book-content #sbo-rt-content div[data-type="sidebar"] h2,
#book-content #sbo-rt-content div[data-type="sidebar"] h3,
#book-content #sbo-rt-content div[data-type="sidebar"] h4,
#book-content #sbo-rt-content div[data-type="sidebar"] h5,
#book-content #sbo-rt-content div[data-type="sidebar"] h6,
#book-content #sbo-rt-content div[data-type="sidebar"] .title,
#book-content #sbo-rt-content .footnotes h1,
#book-content #sbo-rt-content .footnotes h2,
#book-content #sbo-rt-content .footnotes h3,
#book-content #sbo-rt-content .footnotes h4,
#book-content #sbo-rt-content .footnotes h5,
#book-content #sbo-rt-content .footnotes h6,
#book-content #sbo-rt-content div[data-type="footnotes"] h1,
#book-content #sbo-rt-content div[data-type="footnotes"] h2,
#book-content #sbo-rt-content div[data-type="footnotes"] h3,
#book-content #sbo-rt-content div[data-type="footnotes"] h4,
#book-content #sbo-rt-content div[data-type="footnotes"] h5,
#book-content #sbo-rt-content div[data-type="footnotes"] h6,
#book-content #sbo-rt-content .footnote h1,
#book-content #sbo-rt-content .footnote h2,
#book-content #sbo-rt-content .footnote h3,
#book-content #sbo-rt-content .footnote h4,
#book-content #sbo-rt-content .footnote h5,
#book-content #sbo-rt-content .footnote h6,
#book-content #sbo-rt-content aside h1,
#book-content #sbo-rt-content aside h2,
#book-content #sbo-rt-content aside h3,
#book-content #sbo-rt-content aside h4,
#book-content #sbo-rt-content aside h5,
#book-content #sbo-rt-content aside h6 {
	font-family: var(--font-variable-width) !important;
}

/* Figures (around tables) */
#book-content #sbo-rt-content .figure_legend h1,
#book-content #sbo-rt-content .figure_legend h2,
#book-content #sbo-rt-content .figure_legend h3,
#book-content #sbo-rt-content .figure_legend h4,
#book-content #sbo-rt-content .figure_legend h5,
#book-content #sbo-rt-content .figure_legend h6,
#book-content #sbo-rt-content .figure_legend p,
#book-content #sbo-rt-content .figure h1,
#book-content #sbo-rt-content .figure h2,
#book-content #sbo-rt-content .figure h3,
#book-content #sbo-rt-content .figure h4,
#book-content #sbo-rt-content .figure h5,
#book-content #sbo-rt-content .figure h6,
#book-content #sbo-rt-content .figure p,
#book-content #sbo-rt-content figcaption p,
#book-content #sbo-rt-content table caption {
	font-family: var(--font-variable-width) !important;
}

/* Tables */
#book-content #sbo-rt-content thead,
#book-content #sbo-rt-content thead th,
#book-content #sbo-rt-content thead td {
	font-family: var(--font-variable-width) !important;
}

/* Lists */
#book-content #sbo-rt-content ul li,
#book-content #sbo-rt-content ol li,
#book-content #sbo-rt-content ul li p,
#book-content #sbo-rt-content ol li p {
	font-family: var(--font-variable-width) !important;
}

/* Links */
#book-content #sbo-rt-content a,
#book-content #sbo-rt-content a:link,
#book-content #sbo-rt-content a:visited {
	font-family: var(--font-variable-width) !important;
}

/* Annotation? */
body #sbo-rt-content span.lineannotation {
	font-family: inherit;
}

Apply to learning.oreilly.com. If you use the app Cascadea on Mac you can set this up in Safari. Plenty of equivalents for other browsers, even on iOS.