.read-aloud{position:fixed;right:20px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:45;max-width:calc(100vw - 32px);border:1px solid #8694a9;border-radius:18px;background:#202d40;color:#f1f4f9;box-shadow:0 8px 28px #0006,0 0 18px #8da4c520;font:13px/1.5 Georgia,serif}.read-bar{display:flex;align-items:center;padding:5px;gap:2px}.read-bar button{height:40px;min-width:40px;padding:6px 10px;border:0;background:transparent;border-radius:12px;color:inherit;display:flex;gap:9px;align-items:center;justify-content:center;font:14px Georgia,serif}.read-bar button:hover,.read-bar button:focus-visible{background:#ffffff18}.read-bar #read-play{background:linear-gradient(120deg,#bac2d0,#f4f5f8,#aeb9ca);color:#141c29;min-width:117px}.read-aloud [hidden]{display:none!important}.read-aloud #read-settings{width:275px;padding:8px 18px 18px;border-top:1px solid #79869b50}.read-aloud h2{font:21px Georgia,serif;margin:12px 0}.read-aloud label{display:block;margin:12px 0 5px}.read-aloud select{width:100%;background:#101928;color:#fff;border:1px solid #697b94;border-radius:8px;padding:8px;font-size:13px}.read-aloud #read-here{margin-top:14px;width:100%;border:1px solid #8da1bd;border-radius:9px;padding:9px;background:#ffffff10;color:#fff;font:13px Georgia,serif}.read-aloud p{font:12px/1.7 Georgia,serif;color:#d1dcec;margin:14px 0 0}.read-active{outline:1px solid var(--learning-accent,#7a9dc8);outline-offset:6px;background:color-mix(in srgb,var(--learning-accent,#7a9dc8) 12%,transparent);border-radius:4px}.article-page.lights-on .read-aloud{background:#e1e7ef;color:#172233}.article-page.lights-on .read-aloud p{color:#33465d}.article-page.lights-on .read-aloud select{background:#fafbfd;color:#172233}.article-page.lights-on .read-aloud #read-here{color:#172233}.article-page main{padding-bottom:100px}.site-footer{padding-bottom:90px}@media(max-width:750px){.read-aloud{right:12px;bottom:calc(12px + env(safe-area-inset-bottom))}.read-bar button{height:38px;padding:6px 8px}.read-bar #read-play{min-width:107px}}

/* Follow spoken words without changing the page's text or links. */
::highlight(read-word){color:#fff;background-color:#ffffff26;text-shadow:0 0 5px #ffffff80}
::highlight(read-passage){background-color:#ffffff12}
body.lights-on ::highlight(read-word){color:#171717;background-color:#c8c8c8;text-shadow:none}
body.lights-on ::highlight(read-passage){background-color:#00000012}
body .read-active{outline:1px solid #a8a8a866;outline-offset:5px;background:transparent!important;border-radius:4px}
.read-aloud .read-follow{display:flex;align-items:center;gap:8px;font:12px Georgia,serif}
.read-aloud .read-follow input{width:16px;height:16px;accent-color:#ccc}
#page-tools #read-settings p{color:#ddd!important}
#page-tools #read-settings select{background:#080808!important;color:#eee!important;border-color:#777!important;font-family:Georgia,serif}

body main .read-active{outline:1px solid #fff!important;outline-offset:5px;box-shadow:0 0 9px #ffffff70,0 0 22px #ffffff25,inset 0 0 8px #ffffff12!important;background:transparent!important;border-radius:5px}