:root { /* layout */ --content-width: 46rem; --side-pad: 1rem; /* typography */ --lh: 1.6; } /* Base */ html { box-sizing: border-box; } *, *::before, *::after { box-sizing: inherit; } body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; line-height: var(--lh); color: #111; background: #fff; -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; } /* Header masthead */ #masthead { text-align: center; font-size: 2em; max-width: var(--content-width); padding: 1rem var(--side-pad) 0; font-weight: 700; } #masthead a { color: inherit; text-decoration: none; text-align: center; } /* Main content wrapper */ main { max-width: var(--content-width); margin: 0 auto; padding: 1rem var(--side-pad) 3rem; } .blogparent { font-size: 1em; } /* Typography */ h1, h2 { line-height: 1.25; margin: 1.25em 0 0.5em; } h1 { font-size: clamp(1.75rem, 2.2vw + 1.2rem, 2.5rem); } h2 { font-size: clamp(1.25rem, 1.2vw + 1rem, 1.6rem); } h1, h2 { text-transform: uppercase; } date { margin-bottom: 30rem; } p { margin: 0 0 1rem; } small { display: block; color: #555; margin: 0.25rem 0 1rem; } ul, ol { padding-left: 1.25rem; margin: 0 0 1rem; } li { margin: 0.25rem 0; } /* Links */ a { color: inherit; text-decoration: underline; text-underline-offset: .15em; } a:hover { text-decoration-thickness: 2px; } /* Media */ figure { margin: 0 0 1rem; } figure img, img { display: block; max-width: 100%; height: auto; } /* Book and About specific bodies */ /* Matches and from provided HTML */ #book header figure { display: grid; place-items: center; } #book small strong { font-weight: 700; } /* Readability tweaks for densely
-separated notes */ #book #booknotes { hyphens: auto; } /* Horizontal rules (if any) */ hr { border: 0; border-top: 1px solid #ddd; margin: 2rem 0; } /* Responsive spacing */ @media (min-width: 880px) { :root { --side-pad: 2rem; } } /* Print: keep it clean */ @media print { a { text-decoration: none; } main { padding-bottom: 0; } }