/* ========================================================================== Mastering Dyslexia — Accessibility Overrides Applied via JavaScript (accessibility.js) by toggling classes on ========================================================================== */ /* -------------------------------------------------------------------------- OpenDyslexic font-face Source: jsDelivr CDN — open-dyslexic npm package -------------------------------------------------------------------------- */ @font-face { font-family: 'OpenDyslexic'; src: url('https://cdn.jsdelivr.net/npm/open-dyslexic@1.0.3/open-dyslexic-regular.otf') format('opentype'); font-weight: 400; font-style: normal; font-display: swap; } /* -------------------------------------------------------------------------- .dyslexia-font — switch all text to OpenDyslexic -------------------------------------------------------------------------- */ body.dyslexia-font, body.dyslexia-font h1, body.dyslexia-font h2, body.dyslexia-font h3, body.dyslexia-font h4, body.dyslexia-font h5, body.dyslexia-font h6, body.dyslexia-font p, body.dyslexia-font li, body.dyslexia-font a, body.dyslexia-font button, body.dyslexia-font input, body.dyslexia-font select, body.dyslexia-font textarea, body.dyslexia-font label, body.dyslexia-font td, body.dyslexia-font th, body.dyslexia-font .btn, body.dyslexia-font .callout__content, body.dyslexia-font .collapsible__trigger, body.dyslexia-font .collapsible__content, body.dyslexia-font .sidebar__activity-link, body.dyslexia-font .breadcrumb, body.dyslexia-font .card__title, body.dyslexia-font .card__body { font-family: 'OpenDyslexic', Arial, sans-serif !important; } /* Monospace elements stay monospace — only override the stack, not the style */ body.dyslexia-font code, body.dyslexia-font kbd, body.dyslexia-font samp, body.dyslexia-font pre { font-family: 'Courier New', monospace !important; } /* -------------------------------------------------------------------------- .high-spacing — extra letter/word/line spacing Applies on top of whatever font is active -------------------------------------------------------------------------- */ body.high-spacing, body.high-spacing p, body.high-spacing li, body.high-spacing h1, body.high-spacing h2, body.high-spacing h3, body.high-spacing h4, body.high-spacing h5, body.high-spacing h6, body.high-spacing td, body.high-spacing th, body.high-spacing label, body.high-spacing .btn, body.high-spacing .callout__content, body.high-spacing .sidebar__activity-link, body.high-spacing .breadcrumb { letter-spacing: 0.1em !important; word-spacing: 0.16em !important; line-height: 2.2 !important; }