/* Visitor reading preferences apply only on screen; printable articles keep their layout. */
@media screen {
    :root[data-reading-size="115"] { font-size: 115%; }
    :root[data-reading-size="130"] { font-size: 130%; }

    :root[data-reading-font="serif"] main :is(p, li, blockquote, h1, h2, h3, h4, figcaption) {
        font-family: Georgia, "Times New Roman", serif;
    }
    :root[data-reading-font="sans"] main :is(p, li, blockquote, h1, h2, h3, h4, figcaption) {
        font-family: Arial, Helvetica, sans-serif;
    }
    :root[data-reading-spacing="wide"] main :is(p, li, blockquote) { line-height: 2.15; }

    .reading-menu { position: relative; }
    .reading-menu-toggle { border: 0; background: transparent; white-space: nowrap; }
    .reading-menu-toggle:focus-visible { outline: 3px solid var(--gge-terracotta); outline-offset: 2px; }
    .reading-menu-panel { min-width: 18rem; max-width: calc(100vw - 2rem); color: #17243b; background: #fff; border: 1px solid #d8d2c7; border-radius: .8rem; box-shadow: 0 .8rem 2rem rgba(0, 0, 0, .16); }
    .reading-menu-heading { color: #17243b; font-weight: 700; font-size: 1rem; }
    .reading-setting > span { display: block; color: #364052; font-size: .86rem; font-weight: 600; }
    .reading-setting .btn { flex: 1; color: #17243b; background: #fff; border-color: #9ba3ae; font-size: .85rem; }
    .reading-setting .btn[aria-pressed="true"] { color: #fff; background: #17243b; border-color: #17243b; }
    .reading-setting .btn:focus-visible, .reading-menu-panel [data-reading-reset]:focus-visible { outline: 3px solid #a84f3a; outline-offset: 2px; }
    .reading-menu-panel [data-reading-reset] { color: #873b2b; text-decoration: underline; }
    @media (max-width: 991.98px) {
        .reading-menu-panel { position: static !important; width: min(100%, 22rem); margin-top: .35rem; }
    }
}
