export declare const ENABLE_EXTRA_COLUMN_SHIFT_METHOD = false;
export declare enum WebViewSlotEnum {
    center = "center",
    left = "left",
    right = "right"
}
export declare const EXTRA_COLUMN_PAD_ID = "r2-extra-column-pad";
export declare const CLASS_VWM = "r2-class-VWM";
export declare const CLASS_PAGINATED = "r2-css-paginated";
export declare const HIDE_CURSOR_CLASS = "r2-hideCursor";
export declare const ZERO_TRANSFORM_CLASS = "r2-zeroTransform";
export declare const ENABLE_SKIP_LINK = false;
export declare const SKIP_LINK_ID = "r2-skip-link";
export declare const LINK_TARGET_CLASS = "r2-link-target";
export declare const LINK_TARGET_ALT_CLASS = "r2-link-target-alt";
export declare const DISABLE_TEMPORARY_NAV_TARGET_OUTLINE_CLASS = "r2-no-link-target-temp-highlight";
export declare const ROOT_CLASS_REDUCE_MOTION = "r2-reduce-motion";
export declare const ROOT_CLASS_MATHJAX = "r2-mathjax";
export declare const ROOT_CLASS_FIXED_LAYOUT = "r2-fixed-layout";
export declare const ROOT_CLASS_NO_FOOTNOTES = "r2-no-popup-foonotes";
export declare const ROOT_CLASS_NO_RUBY = "r2-no-ruby";
export declare const FOOTNOTES_CONTAINER_CLASS = "r2-footnote-container";
export declare const FOOTNOTES_CLOSE_BUTTON_CLASS = "r2-footnote-close";
export declare const FOOTNOTE_FORCE_SHOW = "r2-footnote-force-show";
export declare const POPOUTIMAGE_CONTAINER_ID = "r2-popoutimage-container-id";
export declare const POPOUTIMAGE_CLOSE_ID = "r2-popoutimage-close-id";
export declare const POPOUTIMAGE_CONTROLS_ID = "r2-popoutimage-controls-id";
export declare const POPOUTIMAGE_MINUS_ID = "r2-popoutimage-minus-id";
export declare const POPOUTIMAGE_PLUS_ID = "r2-popoutimage-plus-id";
export declare const POPOUTIMAGE_RESET_ID = "r2-popoutimage-reset-id";
export declare const POPUP_DIALOG_CLASS = "r2-popup-dialog";
export declare const POPUP_DIALOG_CLASS_COLLAPSE = "r2-popup-dialog-collapse";
export declare const ROOT_CLASS_KEYBOARD_INTERACT = "r2-keyboard-interact";
export declare const CSS_CLASS_NO_FOCUS_OUTLINE = "r2-no-focus-outline";
export declare const footnotesCssStyles = "\n@namespace epub \"http://www.idpf.org/2007/ops\";\n\n/* TODO: allowlist for DIV etc. ... or blocklist for SPAN etc. ?*/\ndiv[epub|type~=\"pagebreak\"]:empty {\n    line-height: 0 !important;\n}\ndiv[role~=\"doc-pagebreak\"]:empty {\n    line-height: 0 !important;\n}\n*[epub|type~=\"pagebreak\"]:empty::before {\n    display: contents;\n    /*display: inline-block;*/\n    content: \"\\feff\" /* zero width nbsp, instead of     */\n}\n*[role~=\"doc-pagebreak\"]:empty::before {\n    display: contents;\n    /*display: inline-block;*/\n    content: \"\\feff\" /* zero width nbsp, instead of     */\n}\n\n:root:not(.r2-no-popup-foonotes) aside[epub|type~=\"footnote\"]:not(.r2-footnote-force-show),\n:root:not(.r2-no-popup-foonotes) aside[epub|type~=\"note\"]:not(.r2-footnote-force-show),\n:root:not(.r2-no-popup-foonotes) aside[epub|type~=\"endnote\"]:not(.r2-footnote-force-show),\n:root:not(.r2-no-popup-foonotes) aside[epub|type~=\"rearnote\"]:not(.r2-footnote-force-show) {\n    display: none;\n}\n\n/*\n:root.r2-popup-dialog {\n    overflow: hidden !important;\n}\n*/\n\n:root[style] dialog#r2-popup-dialog:not(.r2-popup-dialog-collapse)::backdrop,\n:root dialog#r2-popup-dialog:not(.r2-popup-dialog-collapse)::backdrop {\n    background: rgba(0, 0, 0, 0.3) !important;\n}\n:root[style*=\"readium-night-on\"] dialog#r2-popup-dialog:not(.r2-popup-dialog-collapse)::backdrop {\n    background: rgba(0, 0, 0, 0.65) !important;\n}\n:root[style] dialog#r2-popup-dialog.r2-popup-dialog-collapse::backdrop,\n:root dialog#r2-popup-dialog.r2-popup-dialog-collapse::backdrop {\n    background: transparent !important;\n}\n\n:root[style] dialog#r2-popup-dialog,\n:root dialog#r2-popup-dialog {\n    -webkit-writing-mode: horizontal-tb;\n\n    z-index: 3;\n\n    position: fixed;\n\n    width: 90%;\n    max-width: 40em;\n\n    top: auto;\n    bottom: 1em;\n    height: 7em;\n\n    margin: 0 auto;\n    padding: 0;\n\n    border-radius: 0.3em;\n    border-width: 1px;\n\n    background: white !important;\n    border-color: black !important;\n\n    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);\n\n    display: grid;\n    grid-column-gap: 0px;\n    grid-row-gap: 0px;\n\n    grid-template-columns: 1.5em auto 1.5em;\n    grid-template-rows: auto 1.5em;\n}\n:root[style*=\"readium-night-on\"] dialog#r2-popup-dialog {\n    background: #333333 !important;\n    border-color: white !important;\n}\n:root[style*=\"readium-sepia-on\"] dialog#r2-popup-dialog {\n    background: var(--RS__backgroundColor) !important;\n}\n:root[style*=\"--USER__backgroundColor\"] dialog#r2-popup-dialog {\n    background: var(--USER__backgroundColor) !important;\n}\n\n:root[style] dialog#r2-popup-dialog.r2-popup-dialog-collapse,\n:root dialog#r2-popup-dialog.r2-popup-dialog-collapse {\n    top: auto;\n    height: 1px;\n}\n\n:root[style] div#r2-popoutimage-container-id,\n:root div#r2-popoutimage-container-id,\n:root[style].r2-keyboard-interact div#r2-popoutimage-container-id,\n:root.r2-keyboard-interact div#r2-popoutimage-container-id {\n    grid-column-start: 1;\n    grid-column-end: 4;\n    grid-row-start: 1;\n    grid-row-end: 3;\n\n    /*\n    outline-color: magenta !important;\n    outline-style: dotted !important;\n    outline-width: 4px !important;\n    outline-offset: -4px !important;\n    */\n\n    padding: 0;\n    margin: 0;\n\n    box-sizing: border-box;\n\n    cursor: pointer;\n\n    /* position: relative; */\n\n    display: flex;\n    /* no need for vertical / horizontal control, as we use margin:auto\n    justify-content: center;\n    align-items: center;\n    */\n\n    /* FXL, just in case the top-level transform scale isn't applied */\n    overflow-y: auto;\n    overflow-x: auto;\n}\n\n@keyframes readium2ElectronAnimation_IMG_OUTLINE {\n    0% {\n        outline-offset: -0.4em;\n    }\n    25% {\n        outline-offset: 0em;\n    }\n    50% {\n        outline-offset: 0.8em;\n    }\n    75% {\n        outline-offset: 0em;\n    }\n    100% {\n        outline-offset: -0.4em;\n    }\n}\n\n/*\n:root[style].r2-keyboard-interact img[data-r2-popoutimage-container-id],\n:root.r2-keyboard-interact img[data-r2-popoutimage-container-id],\n:root[style].r2-keyboard-interact image[data-r2-popoutimage-container-id],\n:root.r2-keyboard-interact image[data-r2-popoutimage-container-id],\n:root[style].r2-keyboard-interact svg[data-r2-popoutimage-container-id],\n:root.r2-keyboard-interact svg[data-r2-popoutimage-container-id]\n*/\n\n:root[style] img[data-r2-popoutimage-container-id],\n:root img[data-r2-popoutimage-container-id],\n:root[style] image[data-r2-popoutimage-container-id],\n:root image[data-r2-popoutimage-container-id],\n:root[style] svg[data-r2-popoutimage-container-id],\n:root svg[data-r2-popoutimage-container-id]\n{\n    outline-color: magenta !important;\n    outline-style: solid !important;\n    outline-width: 0.2em !important;\n    /* outline-offset: 2px !important; */\n\n    cursor: pointer !important;\n\n    animation-name: readium2ElectronAnimation_IMG_OUTLINE;\n    animation-iteration-count: infinite;\n    animation-duration: 1s;\n    animation-delay: 0s;\n    animation-fill-mode: forwards;\n    animation-timing-function: linear;\n}\n\n/*\n:root[style*=\"readium-night-on\"]\n*/\n:root[style] div#r2-popoutimage-container-id #r2-popoutimage-controls-id,\n:root div#r2-popoutimage-container-id #r2-popoutimage-controls-id {\n    border: 1px solid var(--RS__backgroundColor) !important;\n    background: transparent !important;\n    color: var(--RS__textColor) !important;\n    padding: 4px;\n    margin: 0;\n    border-radius: 16px;\n    position: absolute;\n    top: 8px;\n    left: 8px;\n    width: auto;\n    height: auto;\n}\n:root[style]:not([style*=\"--USER__\"]) div#r2-popoutimage-container-id #r2-popoutimage-controls-id,\n:root:not([style]) div#r2-popoutimage-container-id #r2-popoutimage-controls-id {\n    border: 1px solid black !important;\n    background: white !important;\n    color: black !important;\n}\n\n:root[style] div#r2-popoutimage-container-id #r2-popoutimage-close-id,\n:root div#r2-popoutimage-container-id #r2-popoutimage-close-id {\n    position: absolute;\n    top: 8px;\n    right: 8px;\n}\n:root[style] div#r2-popoutimage-container-id button,\n:root div#r2-popoutimage-container-id button {\n    border: 2px solid var(--RS__textColor) !important;\n    background: var(--RS__backgroundColor) !important;\n    color: var(--RS__textColor) !important;\n    font-family: Arial !important;\n    font-size: 20px !important;\n    font-weight: bold;\n    user-select: none;\n    padding: 8px;\n    margin: 0;\n    border-radius: 16px;\n    width: 36px;\n    display: inline-block;\n    cursor: pointer !important;\n}\n:root[style]:not([style*=\"--USER__\"]) div#r2-popoutimage-container-id button,\n:root:not([style]) div#r2-popoutimage-container-id button {\n    border: 2px solid black !important;\n    background: white !important;\n    color: black !important;\n}\n\n:root[style] div#r2-popoutimage-container-id > img,\n:root div#r2-popoutimage-container-id > img {\n\n    /*\n    outline-color: red !important;\n    outline-style: dashed !important;\n    outline-width: 2px !important;\n    outline-offset: -2px !important;\n    */\n\n    transform-origin: 0px 0px;\n\n    box-sizing: border-box;\n    /* border: 2px solid #333333; */\n\n    cursor: move !important;\n\n    margin: 0 !important;\n    object-fit: contain !important;\n    position: relative !important;\n    max-height: 100% !important;\n    max-width: 100% !important;\n    width: 100% !important;\n    height: 100% !important;\n\n    /*\n    margin: auto !important;\n    object-fit: cover !important;\n    position: relative !important;\n    max-height: 100% !important;\n    max-width: 100% !important;\n    width: auto !important;\n    height: auto !important;\n    */\n\n    /* vertical centering breaks image height\n    margin: auto !important;\n    position: absolute !important;\n    max-height: none !important;\n    max-width: 100% !important;\n    width: 100% !important;\n    height: auto !important;\n\n    top: 0 !important;\n    bottom: 0 !important;\n    */\n\n    /* this works with position:relative in the parent (no need for flex)\n    max-height: 100% !important;\n    max-width: 100% !important;\n    width: auto !important;\n    height: auto !important;\n\n    position: absolute !important;\n    top: 0 !important;\n    bottom: 0 !important;\n    left: 0 !important;\n    right: 0 !important;\n    margin: auto !important;\n    */\n}\n\n:root[style] .r2-footnote-container,\n:root .r2-footnote-container {\n    overflow: auto;\n\n    grid-column-start: 1;\n    grid-column-end: 4;\n    grid-row-start: 1;\n    grid-row-end: 3;\n\n    padding: 0.3em;\n    margin: 0.2em;\n}\n\n:root[style] .r2-footnote-container > *,\n:root .r2-footnote-container > * {\n    margin: 0 !important;\n    padding: 0 !important;\n    width: 100%;\n}\n\n/*\nhttps://github.com/edrlab/thorium-reader/issues/2478#issuecomment-2304782942\n:root[style] .r2-footnote-container a[epub|type~=\"backlink\"],\n:root .r2-footnote-container a[epub|type~=\"backlink\"],\n:root[style] .r2-footnote-container a[role~=\"doc-backlink\"],\n:root .r2-footnote-container a[role~=\"doc-backlink\"] {\n    display: none !important;\n}\n*/\n\n/*\n:root[style] .r2-footnote-close,\n:root .r2-footnote-close {\n    border: 1px solid black;\n    background: white !important;\n    color: black !important;\n\n    border-radius: 0.8em;\n    position: absolute;\n    top: -0.9em;\n    left: -0.9em;\n    width: 1.8em;\n    height: 1.8em;\n    font-size: 1em !important;\n    font-family: Arial !important;\n    cursor: pointer;\n}\n:root[style*=\"readium-night-on\"] .r2-footnote-close {\n    border: 1px solid white !important;\n    background: black !important;\n    color: white !important;\n}\n*/\n";
export declare const R2_MO_CLASS_ACTIVE = "r2-mo-active";
export declare const R2_MO_CLASS_ACTIVE_PLAYBACK = "r2-mo-active-playback";
export declare const R2_MO_CLASS_PLAYING = "r2-mo-playing";
export declare const R2_MO_CLASS_PAUSED = "r2-mo-paused";
export declare const R2_MO_CLASS_STOPPED = "r2-mo-stopped";
export declare const mediaOverlaysCssStyles = "\n:root[style] .r2-mo-active,\n:root .r2-mo-active {\n    background-color: yellow !important;\n    color: black !important;\n}\n:root[style*=\"readium-night-on\"] .r2-mo-active {\n    background-color: #333333 !important;\n    color: white !important;\n}\n:root[style*=\"readium-sepia-on\"] .r2-mo-active {\n    background-color: silver !important;\n    color: black !important;\n}\n";
export declare const TTS_CLASS_THEME1 = "r2-tts-theme1";
export declare const TTS_CLASS_IS_ACTIVE = "r2-tts-isPlaying";
export declare const TTS_CLASS_PAUSED = "r2-tts-paused";
export declare const TTS_CLASS_PLAYING = "r2-tts-playing";
export declare const TTS_CLASS_STOPPED = "r2-tts-stopped";
export declare const TTS_ID_PREVIOUS = "r2-tts-previous";
export declare const TTS_ID_NEXT = "r2-tts-next";
export declare const TTS_ID_SLIDER = "r2-tts-slider";
export declare const TTS_ID_ACTIVE_WORD = "r2-tts-active-word";
export declare const TTS_ID_ACTIVE_UTTERANCE = "r2-tts-active-utterance";
export declare const TTS_CLASS_UTTERANCE = "r2-tts-utterance";
export declare const TTS_CLASS_UTTERANCE_HEADING1 = "r2-tts-utterance-h1";
export declare const TTS_CLASS_UTTERANCE_HEADING2 = "r2-tts-utterance-h2";
export declare const TTS_CLASS_UTTERANCE_HEADING3 = "r2-tts-utterance-h3";
export declare const TTS_CLASS_UTTERANCE_HEADING4 = "r2-tts-utterance-h4";
export declare const TTS_CLASS_UTTERANCE_HEADING5 = "r2-tts-utterance-h5";
export declare const TTS_ID_CONTAINER = "r2-tts-txt";
export declare const TTS_NAV_BUTTON_CLASS = "r2-tts-button";
export declare const TTS_ID_SPEAKING_DOC_ELEMENT = "r2-tts-speaking-el";
export declare const TTS_POPUP_DIALOG_CLASS = "r2-tts-popup-dialog";
export declare const ttsCssStyles = "\n\n:root[style] dialog#r2-popup-dialog.r2-tts-popup-dialog,\n:root dialog#r2-popup-dialog.r2-tts-popup-dialog {\n    width: auto;\n    max-width: 100%;\n\n    height: auto;\n    max-height: 100%;\n\n    top: 0px;\n    bottom: 0px;\n    left: 0px;\n    right: 0px;\n\n    margin: 0;\n    padding: 0;\n\n    box-shadow: none;\n\n    border-radius: 0;\n    border-style: solid;\n    border-width: 1px;\n    border-color: #777777 !important;\n    border-left: 0;\n    border-right: 0;\n    border-top: 0;\n    border-bottom: 0;\n}\n\n:root[style] div#r2-tts-txt,\n:root div#r2-tts-txt {\n    overflow: auto;\n    overflow-x: hidden;\n\n    grid-column-start: 1;\n    grid-column-end: 4;\n    grid-row-start: 1;\n    grid-row-end: 2;\n\n    padding: 0;\n    margin: 0;\n\n    max-width: 800px;\n    margin-right: auto;\n    margin-left: auto;\n\n    hyphens: none !important;\n    word-break: keep-all !important;\n    word-wrap: break-word !important;\n\n    line-height: initial !important;\n\n    color: #444444 !important;\n\n    border-radius: 0;\n    border-style: solid;\n    border-width: 1px;\n    border-color: #777777 !important;\n    border-left: 0;\n    border-right: 0;\n    border-top: 0;\n}\n\n:root[style] div#r2-tts-txt > div,\n:root div#r2-tts-txt > div {\n    font-size: 1.2rem !important;\n}\n:root[style] div#r2-tts-txt > img,\n:root div#r2-tts-txt > img,\n:root[style] div#r2-tts-txt > svg,\n:root div#r2-tts-txt > svg {\n    display: block;\n    border: 3px solid transparent;\n    max-width: 50%;\n    margin-left: auto;\n    margin-right: auto;\n}\n:root[style] div#r2-tts-txt > img + div,\n:root div#r2-tts-txt > img + div,\n:root[style] div#r2-tts-txt > svg + div,\n:root div#r2-tts-txt > svg + div {\n    text-align: center;\n    text-decoration: underline;\n}\n\n:root[style*=\"--USER__lineHeight\"] div#r2-tts-txt {\n    line-height: calc(var(--USER__lineHeight) * 1) !important;\n}\n:root[style*=\"readium-night-on\"] div#r2-tts-txt {\n    color: #bbbbbb !important;\n}\n:root[style*=\"readium-sepia-on\"] div#r2-tts-txt {\n    background: var(--RS__backgroundColor) !important;\n    color: var(--RS__textColor) !important;\n}\n:root[style*=\"--USER__backgroundColor\"] div#r2-tts-txt {\n    background: var(--USER__backgroundColor) !important;\n}\n:root[style*=\"--USER__textColor\"] div#r2-tts-txt {\n    color: var(--USER__textColor) !important;\n}\n\n:root[style] #r2-tts-slider,\n:root #r2-tts-slider {\n    padding: 0;\n    margin: 0;\n    margin-left: 6px;\n    margin-right: 6px;\n    margin-top: 6px;\n    margin-bottom: 6px;\n\n    grid-column-start: 2;\n    grid-column-end: 3;\n    grid-row-start: 2;\n    grid-row-end: 3;\n\n    cursor: pointer;\n    -webkit-appearance: none;\n\n    background: transparent !important;\n}\n:root #r2-tts-slider::-webkit-slider-runnable-track {\n    cursor: pointer;\n\n    width: 100%;\n    height: 0.5em;\n\n    background: #999999;\n\n    padding: 0;\n    margin: 0;\n}\n:root[style*=\"readium-night-on\"] #r2-tts-slider::-webkit-slider-runnable-track {\n    background: #545454;\n}\n:root #r2-tts-slider::-webkit-slider-thumb {\n    -webkit-appearance: none;\n\n    cursor: pointer;\n\n    width: 0.8em;\n    height: 1.5em;\n\n    padding: 0;\n    margin: 0;\n    margin-top: -0.5em;\n\n    border: none;\n    border-radius: 0.2em;\n\n    background: #333333;\n}\n:root[style*=\"readium-night-on\"] #r2-tts-slider::-webkit-slider-thumb {\n    background: white;\n}\n:root[style] button.r2-tts-button > span,\n:root button.r2-tts-button > span {\n    vertical-align: baseline;\n}\n:root[style] button.r2-tts-button,\n:root button.r2-tts-button {\n    border: none;\n\n    font-size: 100% !important;\n    font-family: Arial !important;\n    cursor: pointer;\n\n    padding: 0;\n    margin-top: 0.2em;\n    margin-bottom: 0.2em;\n\n    background: transparent !important;\n    color: black !important;\n}\n:root[style*=\"readium-night-on\"] button.r2-tts-button {\n    color: white !important;\n}\n/*\n:root[style*=\"readium-sepia-on\"] button.r2-tts-button {\n    background: var(--RS__backgroundColor) !important;\n}\n:root[style*=\"--USER__backgroundColor\"] button.r2-tts-button {\n    background: var(--USER__backgroundColor) !important;\n}\n*/\n:root[style] #r2-tts-previous,\n:root #r2-tts-previous {\n    margin-left: 0.2em;\n\n    grid-column-start: 1;\n    grid-column-end: 2;\n    grid-row-start: 2;\n    grid-row-end: 3;\n}\n:root[style] #r2-tts-next,\n:root #r2-tts-next {\n    margin-right: 0.2em;\n\n    grid-column-start: 3;\n    grid-column-end: 4;\n    grid-row-start: 2;\n    grid-row-end: 3;\n}\n\n:root[style] .r2-tts-speaking-el,\n:root .r2-tts-speaking-el {\n    outline-color: magenta;\n    outline-style: solid;\n    outline-width: 2px;\n    outline-offset: 1px;\n}\n\n:root[style] .r2-tts-utterance,\n:root .r2-tts-utterance {\n    margin-bottom: 0.1em;\n    padding-top: 0.3em;\n    padding-bottom: 0.3em;\n    padding-left: 1em;\n    padding-right: 1em;\n    display: block;\n\n    box-sizing: border-box;\n    border: 1px solid transparent !important;\n\n    line-height: 1.5 !important;\n}\n\n:root[style] div#r2-tts-txt .r2-tts-utterance-h1,\n:root div#r2-tts-txt .r2-tts-utterance-h1 {\n    font-weight: bolder !important;\n    font-size: 1.5rem !important;\n}\n:root[style] div#r2-tts-txt .r2-tts-utterance-h2,\n:root div#r2-tts-txt .r2-tts-utterance-h2 {\n    font-weight: bolder !important;\n    font-size: 1.4rem !important;\n}\n:root[style] div#r2-tts-txt .r2-tts-utterance-h3,\n:root div#r2-tts-txt .r2-tts-utterance-h3 {\n    font-weight: bold !important;\n    font-size: 1.3rem !important;\n}\n:root[style] div#r2-tts-txt .r2-tts-utterance-h4,\n:root div#r2-tts-txt .r2-tts-utterance-h4 {\n    font-weight: bold !important;\n    font-size: 1.2rem !important;\n}\n:root[style] div#r2-tts-txt .r2-tts-utterance-h5,\n:root div#r2-tts-txt .r2-tts-utterance-h5 {\n    font-weight: bold !important;\n    font-size: 1.1rem !important;\n}\n\n:root[style] div#r2-tts-active-utterance,\n:root div#r2-tts-active-utterance {\n    /* background-color: yellow !important; */\n\n    border: 1px solid #777777 !important;\n    border-radius: 0.4em !important;\n\n    color: black !important;\n}\n:root[style*=\"readium-night-on\"] div#r2-tts-active-utterance {\n    color: white !important;\n}\n:root[style*=\"readium-sepia-on\"] div#r2-tts-active-utterance {\n    color: black !important;\n}\n:root[style*=\"--USER__textColor\"] div#r2-tts-active-utterance {\n    color: var(--USER__textColor) !important;\n}\n\n:root[style] span#r2-tts-active-word,\n:root span#r2-tts-active-word {\n    color: black !important;\n\n    text-decoration: underline;\n    text-decoration-color: #777777 !important;\n    text-underline-position: under;\n    /*\n    outline-color: #777777;\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 1px;\n    */\n\n    padding: 0;\n    margin: 0;\n}\n:root[style*=\"readium-night-on\"] span#r2-tts-active-word {\n    color: white !important;\n    outline-color: white;\n}\n:root[style*=\"readium-sepia-on\"] span#r2-tts-active-word {\n    color: black !important;\n    outline-color: black;\n}\n:root[style*=\"--USER__textColor\"] span#r2-tts-active-word {\n    color: var(--USER__textColor) !important;\n    outline-color: var(--USER__textColor);\n}\n\n:root div#r2-tts-txt.r2-tts-theme1,\n:root[style] div#r2-tts-txt.r2-tts-theme1 {\n\n    background-color: #f7f9f9 !important;\n    color: #333333 !important;\n}\n:root[style*=\"readium-night-on\"] div#r2-tts-txt.r2-tts-theme1 {\n    background: #111111 !important;\n    color: #888888 !important;\n}\n:root[style*=\"readium-sepia-on\"] div#r2-tts-txt.r2-tts-theme1 {\n    background: #fdf2e9 !important;\n    color: #333333 !important;\n}\n\n:root[style] div#r2-tts-txt.r2-tts-theme1 .r2-tts-utterance,\n:root div#r2-tts-txt.r2-tts-theme1 .r2-tts-utterance {\n    background-color: transparent !important;\n}\n\n:root[style] div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance,\n:root div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance {\n\n    border: 0 !important;\n    border-radius: 0px !important;\n\n    background-color: #ecf0f1 !important;\n    color: black !important;\n\n    /* box-shadow: 0px 0px 10px 0px #f2f3f4; */\n}\n:root[style*=\"readium-night-on\"] div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance {\n    background-color: #222222 !important;\n    color: white !important;\n    /* box-shadow: 0px 0px 10px 0px #111100; */\n}\n:root[style*=\"readium-sepia-on\"] div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance {\n    background-color: #fef9e7 !important;\n    color: black !important;\n    /* box-shadow: 0px 0px 10px 0px #fdebd0; */\n}\n\n:root[style] div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance span#r2-tts-active-word,\n:root div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance span#r2-tts-active-word {\n    background-color: #f7dc6f !important;\n    color: black !important;\n\n    outline-color: #f7dc6f;\n    outline-style: solid;\n    outline-offset: unset;\n    outline-width: 4px;\n\n    text-decoration: none;\n}\n:root[style*=\"readium-night-on\"] div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance span#r2-tts-active-word {\n    background-color: #d4ac0d !important;\n    color: black !important;\n\n    outline-color: #d4ac0d;\n}\n:root[style*=\"readium-sepia-on\"] div#r2-tts-txt.r2-tts-theme1 div#r2-tts-active-utterance span#r2-tts-active-word {\n    background-color: #f9e79f !important;\n    color: black !important;\n\n    outline-color: #f9e79f;\n}\n";
export declare const ID_HIGHLIGHTS_CONTAINER = "R2_ID_HIGHLIGHTS_CONTAINER";
export declare const ID_HIGHLIGHTS_FLOATING = "R2_ID_HIGHLIGHTS_FLOATING";
export declare const CLASS_HIGHLIGHT_COMMON = "R2_CLASS_HIGHLIGHT_COMMON";
export declare const CLASS_HIGHLIGHT_COMMON_SVG = "R2_CLASS_HIGHLIGHT_COMMON_SVG";
export declare const CLASS_HIGHLIGHT_SVG = "R2_CLASS_HIGHLIGHT_SVG";
export declare const CLASS_HIGHLIGHT_CONTOUR = "R2_CLASS_HIGHLIGHT_CONTOUR";
export declare const CLASS_HIGHLIGHT_CONTOUR_MARGIN = "R2_CLASS_HIGHLIGHT_CONTOUR_MARGIN";
export declare const CLASS_HIGHLIGHT_CONTAINER = "R2_CLASS_HIGHLIGHT_CONTAINER";
export declare const CLASS_HIGHLIGHT_MARGIN = "R2_CLASS_HIGHLIGHT_MARGIN";
export declare const CLASS_HIGHLIGHT_BEHIND = "R2_CLASS_HIGHLIGHT_BEHIND";
export declare const CLASS_HIGHLIGHT_MASK = "R2_CLASS_HIGHLIGHT_MASK";
export declare const CLASS_HIGHLIGHT_HOVER = "R2_CLASS_HIGHLIGHT_HOVER";
export declare const CLASS_HIGHLIGHT_CURSOR2 = "R2_CLASS_HIGHLIGHT_CURSOR2";
export declare const ENABLE_VISIBILITY_MASK = false;
export declare const ROOT_CLASS_INVISIBLE_MASK = "r2-visibility-mask-class";
export declare const ROOT_CLASS_INVISIBLE_MASK_REMOVED = "r2-visibility-mask-removed-class";
export declare const visibilityMaskCssStyles: string;
export declare const focusCssStyles = "\n\n#r2-skip-link {\n    display: flex !important;\n    overflow: hidden !important;\n    visibility: visible !important;\n    opacity: 1 !important;\n    position: absolute !important;\n    left: 0px !important;\n    top: 0px !important;\n    width: 1px !important;\n    height: 1px !important;\n    background-color: transparent !important;\n    color: transparent !important;\n    padding: 0 !important;\n    margin: 0 !important;\n    border: 0 !important;\n    outline: 0 !important;\n}\n/*\n#r2-skip-link:focus {\n    width: auto;\n    height: auto;\n}\n*/\n:root[style] *:focus,\n:root *:focus {\n    outline: none;\n}\n:root[style].r2-keyboard-interact *.r2-no-focus-outline:focus:not(:target):not(.r2-link-target):not([data-r2-popoutimage-container-id]),\n:root.r2-keyboard-interact *.r2-no-focus-outline:focus:not(:target):not(.r2-link-target):not([data-r2-popoutimage-container-id]) {\n    outline: none !important;\n}\n:root[style].r2-keyboard-interact *:focus:not(:target):not(.r2-link-target),\n:root.r2-keyboard-interact *:focus:not(:target):not(.r2-link-target) {\n    outline-color: blue !important;\n    outline-style: solid !important;\n    outline-width: 2px !important;\n    outline-offset: 2px !important;\n}\n/*\n@keyframes readium2ElectronAnimation_FOCUS {\n    0% {\n    }\n    100% {\n        outline: inherit !important;\n    }\n}\n:root[style]:not(.r2-keyboard-interact) *:focus,\n:root:not(.r2-keyboard-interact) *:focus {\n    animation-name: readium2ElectronAnimation_FOCUS;\n    animation-duration: 3s;\n    animation-delay: 1s;\n    animation-fill-mode: forwards;\n    animation-timing-function: linear;\n}\n*/\n";
export declare const targetCssStyles = "\n/*\n@keyframes readium2ElectronAnimation_TARGET {\n    0% {\n    }\n    100% {\n        outline: inherit !important;\n    }\n}\n:root[style] *:target,\n:root *:target,\n*/\n:root[style] *.r2-link-target:not(.r2-link-target-alt),\n:root *.r2-link-target:not(.r2-link-target-alt)\n{\n    outline-color: gray !important;\n    outline-style: solid !important;\n    outline-width: 1px !important;\n    outline-offset: 2px !important;\n\n    /*\n    animation-name: readium2ElectronAnimation_TARGET;\n    animation-duration: 3s;\n    animation-delay: 1s;\n    animation-fill-mode: forwards;\n    animation-timing-function: linear;\n    */\n}\n:root[style] *.r2-link-target.r2-link-target-alt,\n:root *.r2-link-target.r2-link-target-alt\n{\n    outline-color: gray !important;\n    outline-style: dotted !important;\n    outline-width: 1px !important;\n    outline-offset: 2px !important;\n\n    /*\n    animation-name: readium2ElectronAnimation_TARGET;\n    animation-duration: 3s;\n    animation-delay: 1s;\n    animation-fill-mode: forwards;\n    animation-timing-function: linear;\n    */\n}\n/*\n:root[style] *.r2-no-target-outline:target,\n:root *.r2-no-target-outline:target,\n*/\n:root[style] *.r2-no-target-outline.r2-link-target,\n:root *.r2-no-target-outline.r2-link-target {\n    outline: inherit !important;\n}\n";
export declare const selectionCssStyles = "\n\n:root[style].r2-hideCursor,\n:root.r2-hideCursor,\n:root[style].r2-hideCursor *,\n:root.r2-hideCursor * {\n    cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=), none !important;\n}\n\n.r2-zeroTransform {\n    will-change: scroll-position;\n    transform: translateX(0px);\n}\n/*\n:root[style] ::selection,\n:root ::selection {\nbackground: rgb(155, 179, 240) !important;\ncolor: black !important;\n}\n\n:root[style*=\"readium-night-on\"] ::selection {\nbackground: rgb(100, 122, 177) !important;\ncolor: white !important;\n}\n*/\n";
export declare const scrollBarCssStyles = "\n::-webkit-scrollbar-button {\nheight: 0px !important;\nwidth: 0px !important;\n}\n\n::-webkit-scrollbar-corner {\nbackground: transparent !important;\n}\n\n/*::-webkit-scrollbar-track-piece {\nbackground: red;\n} */\n\n::-webkit-scrollbar {\nwidth:  14px;\nheight: 14px;\n}\n\nhtml.r2-popup-dialog.r2-tts-isPlaying ::-webkit-scrollbar {\n    display: none;\n    /* visibility: hidden; */\n}\n\n::-webkit-scrollbar-thumb {\nbackground: #727272;\nbackground-clip: padding-box !important;\nborder: 3px solid transparent !important;\nborder-radius: 30px;\n}\n\n::-webkit-scrollbar-thumb:hover {\nbackground: #4d4d4d;\n}\n\n::-webkit-scrollbar-track {\nbox-shadow: inset 0 0 3px rgba(40, 40, 40, 0.2);\nbackground: #dddddd;\nbox-sizing: content-box;\n}\n\n::-webkit-scrollbar-track:horizontal {\nborder-top: 1px solid silver;\n}\n::-webkit-scrollbar-track:vertical {\nborder-left: 1px solid silver;\n}\n\n:root[style*=\"readium-night-on\"] ::-webkit-scrollbar-thumb {\nbackground: #a4a4a4;\nborder: 3px solid #545454;\n}\n\n:root[style*=\"readium-night-on\"] ::-webkit-scrollbar-thumb:hover {\nbackground: #dedede;\n}\n\n:root[style*=\"readium-night-on\"] ::-webkit-scrollbar-track {\nbackground: #545454;\n}\n\n:root[style*=\"readium-night-on\"] ::-webkit-scrollbar-track:horizontal {\nborder-top: 1px solid black;\n}\n:root[style*=\"readium-night-on\"] ::-webkit-scrollbar-track:vertical {\nborder-left: 1px solid black;\n}";
export declare const readPosCssStylesAttr1 = "data-readium2-read-pos1";
export declare const readPosCssStylesAttr2 = "data-readium2-read-pos2";
export declare const readPosCssStylesAttr3 = "data-readium2-read-pos3";
export declare const readPosCssStylesAttr4 = "data-readium2-read-pos4";
export declare const readPosCssStyles = "\n:root[style*=\"readium-sepia-on\"] *[data-readium2-read-pos1],\n:root[style*=\"readium-night-on\"] *[data-readium2-read-pos1],\n:root[style] *[data-readium2-read-pos1],\n:root *[data-readium2-read-pos1] {\n    color: black !important;\n    background: magenta !important;\n\n    outline-color: magenta !important;\n    outline-style: solid !important;\n    outline-width: 6px !important;\n    outline-offset: 0px !important;\n}\n:root[style*=\"readium-sepia-on\"] *[data-readium2-read-pos2],\n:root[style*=\"readium-night-on\"] *[data-readium2-read-pos2],\n:root[style] *[data-readium2-read-pos2],\n:root *[data-readium2-read-pos2] {\n    color: black !important;\n    background: yellow !important;\n\n    outline-color: yellow !important;\n    outline-style: solid !important;\n    outline-width: 4px !important;\n    outline-offset: 0px !important;\n}\n:root[style*=\"readium-sepia-on\"] *[data-readium2-read-pos3],\n:root[style*=\"readium-night-on\"] *[data-readium2-read-pos3],\n:root[style] *[data-readium2-read-pos3],\n:root *[data-readium2-read-pos3] {\n    color: black !important;\n    background: green !important;\n\n    outline-color: green !important;\n    outline-style: solid !important;\n    outline-width: 2px !important;\n    outline-offset: 0px !important;\n}\n:root[style*=\"readium-sepia-on\"] *[data-readium2-read-pos4],\n:root[style*=\"readium-night-on\"] *[data-readium2-read-pos4],\n:root[style] *[data-readium2-read-pos4],\n:root *[data-readium2-read-pos4] {\n    color: black !important;\n    background: silver !important;\n\n    outline-color: silver !important;\n    outline-style: solid !important;\n    outline-width: 1px !important;\n    outline-offset: 0px !important;\n}";
export declare const AUDIO_BUFFER_CANVAS_ID = "r2-audio-buffer-canvas";
export declare const AUDIO_PROGRESS_CLASS = "r2-audio-progress";
export declare const AUDIO_ID = "r2-audio";
export declare const AUDIO_BODY_ID = "r2-audio-body";
export declare const AUDIO_SECTION_ID = "r2-audio-section";
export declare const AUDIO_CONTROLS_ID = "r2-audio-controls";
export declare const AUDIO_COVER_ID = "r2-audio-cover";
export declare const AUDIO_TITLE_ID = "r2-audio-title";
export declare const AUDIO_SLIDER_ID = "r2-audio-slider";
export declare const AUDIO_TIME_ID = "r2-audio-time";
export declare const AUDIO_PERCENT_ID = "r2-audio-percent";
export declare const AUDIO_RATE_ID = "r2-audio-rate";
export declare const AUDIO_PLAYPAUSE_ID = "r2-audio-playPause";
export declare const AUDIO_PREVIOUS_ID = "r2-audio-previous";
export declare const AUDIO_NEXT_ID = "r2-audio-next";
export declare const AUDIO_REWIND_ID = "r2-audio-rewind";
export declare const AUDIO_FORWARD_ID = "r2-audio-forward";
export declare const audioCssStyles = "\n\n#r2-audio-controls select#r2-audio-rate option {\n    color: var(--RS__textColor) !important;\n    background: var(--RS__backgroundColor) !important;\n}\n\n#r2-audio-body {\n    padding: 0 !important;\n    margin-top: 0 !important;\n    margin-bottom: 0 !important;\n    height: 100vh !important;\n    display: flex !important;\n    align-items: center;\n    justify-content: center;\n    user-select: none;\n}\n\n#r2-audio-section {\n    margin: 0;\n    padding: 0;\n    min-width: 500px;\n}\n\n#r2-audio-title {\n    margin-top: 1em;\n    margin-bottom: 0;\n    display: block;\n    margin-left: auto;\n    margin-right: auto;\n    max-width: 800px;\n    width: 80%;\n    text-align: center;\n}\n\n#r2-audio-cover {\n    display: block;\n    margin-left: auto;\n    margin-right: auto;\n    max-width: 500px !important;\n    max-height: 250px !important;\n    margin-top: 0.4em;\n    margin-bottom: 0.6em;\n    cursor: pointer;\n}\n\n:root.r2-audio-progress #r2-audio-cover {\n    cursor: wait;\n}\n\n#r2-audio-buffer-canvas {\n    width: 500px;\n    height: 20px;\n\n    margin-left: auto;\n    margin-right: auto;\n\n    margin-bottom: 1em;\n\n    display: block;\n}\n\n#r2-audio {\n    display: block;\n    margin-left: auto;\n    margin-right: auto;\n    max-width: 800px;\n    height: 2.5em;\n    width: 80%;\n}\n\n#r2-audio-controls {\n    display: block;\n    padding: 0;\n    margin: 0;\n    margin-left: auto;\n    margin-right: auto;\n\n    max-width: 500px;\n    min-width: 500px;\n    width: 500px;\n    height: auto;\n\n    display: grid;\n    grid-column-gap: 0px;\n    grid-row-gap: 0px;\n\n    grid-template-columns: auto 3em 7em 3em auto;\n    grid-template-rows: auto 1.5em auto;\n}\n\n#r2-audio-controls button {\n    border: 0 !important;\n    background-color: transparent !important;\n    background: transparent !important;\n    text-align: center;\n    padding: 0;\n    margin: 0;\n    display: block;\n    cursor: pointer;\n    position: relative;\n}\n\n#r2-audio-controls #r2-audio-playPause {\n    grid-column-start: 3;\n    grid-column-end: 4;\n    grid-row-start: 1;\n    grid-row-end: 2;\n\n    box-sizing: border-box;\n\n    justify-self: center;\n\n    width: 60px;\n    height: 60px;\n}\n\n:root #r2-audio-controls svg,\n:root[style] #r2-audio-controls svg {\n    fill: #202020;\n}\n:root[style*=\"readium-night-on\"] #r2-audio-controls svg {\n    fill: #999999;\n}\n\n:root:not(.r2-audio-progress) #r2-audio-controls #r2-audio-playPause #r2-audio-playPause_0,\n:root[style]:not(.r2-audio-progress) #r2-audio-controls #r2-audio-playPause #r2-audio-playPause_0 {\n\n    display: none;\n}\n\n:root:not(.r2-audio-progress) #r2-audio-controls #r2-audio-playPause.pause #r2-audio-playPause_1 {\n    display: none;\n}\n\n:root:not(.r2-audio-progress) #r2-audio-controls #r2-audio-playPause.pause #r2-audio-playPause_0 {\n    display: block;\n}\n\n:root.r2-audio-progress #r2-audio-controls #r2-audio-playPause svg {\n    display: none;\n}\n:root.r2-audio-progress #r2-audio-controls #r2-audio-playPause {\n    cursor: wait;\n}\n:root[style].r2-audio-progress #r2-audio-controls #r2-audio-playPause:after {\n    content: \"\";\n    border-radius: 50%;\n\n    position: absolute;\n    width: 60px;\n    height: 60px;\n    left: 0px;\n    top: 0px;\n\n    transform: translateZ(0);\n    animation: readium2ElectronAnimation_audioLoad-spin 1.1s infinite linear;\n\n    border-top: 3px solid #999999;\n    border-right: 3px solid #999999;\n    border-bottom: 3px solid #999999;\n    border-left: 3px solid #333333;\n}\n:root[style*=\"readium-night-on\"].r2-audio-progress #r2-audio-controls #r2-audio-playPause:after {\n\n    border-top: 3px solid #202020;\n    border-right: 3px solid #202020;\n    border-bottom: 3px solid #202020;\n    border-left: 3px solid white;\n}\n@keyframes readium2ElectronAnimation_audioLoad-spin {\n    0% {\n        transform: rotate(0deg);\n    }\n    100% {\n        transform: rotate(360deg);\n    }\n}\n\n#r2-audio-controls #r2-audio-next,\n#r2-audio-controls #r2-audio-previous,\n#r2-audio-controls #r2-audio-rewind,\n#r2-audio-controls #r2-audio-forward {\n    width: 48px;\n    height: 48px;\n    position: relative;\n    align-self: center;\n}\n\n#r2-audio-controls #r2-audio-previous {\n    grid-column-start: 1;\n    grid-column-end: 2;\n    grid-row-start: 1;\n    grid-row-end: 2;\n\n    justify-self: left;\n}\n\n#r2-audio-controls #r2-audio-next {\n    grid-column-start: 5;\n    grid-column-end: 6;\n    grid-row-start: 1;\n    grid-row-end: 2;\n\n    justify-self: right;\n}\n#r2-audio-controls #r2-audio-rewind {\n    grid-column-start: 2;\n    grid-column-end: 3;\n    grid-row-start: 1;\n    grid-row-end: 2;\n\n    justify-self: right;\n}\n#r2-audio-controls #r2-audio-forward {\n    grid-column-start: 4;\n    grid-column-end: 5;\n    grid-row-start: 1;\n    grid-row-end: 2;\n\n    justify-self: left;\n}\n:root.r2-audio-progress #r2-audio-forward,\n:root.r2-audio-progress #r2-audio-rewind {\n    display: none;\n}\n\n#r2-audio-percent, #r2-audio-time, #r2-audio-rate {\n    font-size: 0.9em !important;\n    font-family: sans-serif !important;\n}\n#r2-audio-percent, #r2-audio-time {\n    margin-top: -0.5em;\n}\n#r2-audio-rate {\n    grid-column-start: 3;\n    grid-column-end: 4;\n    grid-row-start: 3;\n    grid-row-end: 4;\n\n    font-size: 0.8em !important;\n    width: 4em;\n\n    justify-self: center;\n\n    text-align: center !important;\n\n    margin-top: -0.2em;\n\n    -webkit-appearance: none;\n    border: 1px solid #aaa;\n    border-radius: .4em;\n    box-sizing: border-box;\n    padding: .15em .15em .15em .3em;\n    background-color: transparent;\n\n    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23aaa%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');\n    background-repeat: no-repeat, repeat;\n    background-position: right .3em top 50%, 0 0;\n    background-size: .7em auto, 100%;\n}\n#r2-audio-time {\n    grid-column-start: 1;\n    grid-column-end: 2;\n    grid-row-start: 3;\n    grid-row-end: 4;\n\n    text-align: left !important;\n}\n#r2-audio-percent {\n    grid-column-start: 5;\n    grid-column-end: 6;\n    grid-row-start: 3;\n    grid-row-end: 4;\n\n    text-align: right !important;\n}\n\n:root.r2-audio-progress #r2-audio-rate,\n:root.r2-audio-progress #r2-audio-percent,\n:root.r2-audio-progress #r2-audio-time {\n    visibility: hidden;\n}\n\n:root[style] #r2-audio-slider,\n:root #r2-audio-slider {\npadding: 0;\nmargin: 0;\n\ndisplay: block;\n\ngrid-column-start: 1;\ngrid-column-end: 6;\ngrid-row-start: 2;\ngrid-row-end: 3;\n\ncursor: pointer;\n\nbackground: transparent !important;\n\nbackground-clip: padding-box;\nborder-radius: 2px;\noverflow: hidden;\n\nposition: relative;\n\n-webkit-appearance: none;\n\n--audiopercent: 50%;\n--range-color-left: #545454;\n--range-color-right: #999999;\n--track-background: linear-gradient(to right, var(--range-color-left) var(--audiopercent), var(--range-color-right) 0) no-repeat 0 100% / 100% 100%;\n}\n:root[style*=\"readium-night-on\"] #r2-audio-slider {\n    --range-color-right: #545454;\n    --range-color-left: #999999;\n}\n\n:root[style].r2-audio-progress #r2-audio-slider,\n:root.r2-audio-progress #r2-audio-slider {\n\ncursor: wait;\n}\n\n:root[style].r2-audio-progress #r2-audio-slider:before,\n:root.r2-audio-progress #r2-audio-slider:before {\n    content: '';\n    position: absolute;\n    background-color: #999999;\n    left: 0;\n    top: 1em;\n    height: 0.4em;\n    transform: translateZ(0);\n    will-change: left, right;\n    animation: readium2ElectronAnimation_audioLoad 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n}\n\n:root[style].r2-audio-progress #r2-audio-slider:after,\n:root.r2-audio-progress #r2-audio-slider:after {\n    content: '';\n    position: absolute;\n    background-color: #999999;\n    left: 0;\n    top: 1em;\n    height: 0.4em;\n    transform: translateZ(0);\n    will-change: left, right;\n    animation: readium2ElectronAnimation_audioLoad-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n    animation-delay: 1.15s;\n}\n\n:root[style*=\"readium-night-on\"].r2-audio-progress #r2-audio-slider:after {\n    background: #545454;\n}\n\n@keyframes readium2ElectronAnimation_audioLoad {\n0% {\nleft: -35%;\nright: 100%; }\n60% {\nleft: 100%;\nright: -90%; }\n100% {\nleft: 100%;\nright: -90%; } }\n\n@keyframes readium2ElectronAnimation_audioLoad-short {\n0% {\nleft: -200%;\nright: 100%; }\n60% {\nleft: 107%;\nright: -8%; }\n100% {\nleft: 107%;\nright: -8%; } }\n\n:root #r2-audio-slider::-webkit-slider-runnable-track,\n:root[style] #r2-audio-slider::-webkit-slider-runnable-track {\n    cursor: pointer;\n\n    width: 100%;\n    height: 0.5em;\n\n    background: #999999;\n    background: var(--track-background);\n\n    padding: 0;\n    margin: 0;\n\n    border: none;\n    border-radius: 0.2em;\n}\n:root[style*=\"readium-night-on\"] #r2-audio-slider::-webkit-slider-runnable-track {\n\n    background: #545454;\n    background: var(--track-background);\n}\n\n:root.r2-audio-progress #r2-audio-slider::-webkit-slider-runnable-track,\n:root[style].r2-audio-progress #r2-audio-slider::-webkit-slider-runnable-track {\n    background: transparent !important;\n    cursor: wait;\n}\n:root[style*=\"readium-night-on\"].r2-audio-progress #r2-audio-slider::-webkit-slider-runnable-track {\n    background: transparent !important;\n}\n\n:root #r2-audio-slider::-webkit-slider-thumb,\n:root[style] #r2-audio-slider::-webkit-slider-thumb {\n    -webkit-appearance: none;\n\n    cursor: pointer;\n\n    width: 0.5em;\n    height: 0.7em;\n\n    padding: 0;\n    margin: 0;\n    margin-top: -0.1em;\n\n    border: none;\n    border-radius: 0.2em;\n\n    background: #333333;\n}\n:root[style*=\"readium-night-on\"] #r2-audio-slider::-webkit-slider-thumb {\n    background: white;\n}\n\n:root.r2-audio-progress #r2-audio-slider::-webkit-slider-thumb,\n:root[style].r2-audio-progress #r2-audio-slider::-webkit-slider-thumb {\n    background: transparent !important;\n    cursor: wait;\n}\n:root[style*=\"readium-night-on\"].r2-audio-progress #r2-audio-slider::-webkit-slider-thumb {\n    background: transparent !important;\n}\n";