/* Home + chapter rotary workspace: the installed app only, never the website. */
/* Exception: native-book-tap is also reused by the named browser OPEN cue. */
/* Shared Norwester font-face is loaded by login-experience.css on index.html. */
@font-face {
  font-family: "El Messiri";
  src: url("/assets/fonts/el-messiri/ElMessiri.ttf") format("truetype");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

html.android-webview {
  --native-canvas: var(--app-palette-background);
  --native-ink: var(--app-palette-text);
  --native-dock: var(--app-palette-secondary);
  --native-blue: var(--app-palette-primary);
  --native-muted: var(--app-palette-muted);
  --native-line: var(--app-palette-border);
  --native-ornament: "El Messiri", Georgia, serif;
  --native-display: "Norwester", "Arial Narrow", sans-serif;
  --native-body: Arial, sans-serif;
  --native-emblem-shape: url("/icons/native-action-scallop.svg");
  --native-dock-reserve: calc(104px + env(safe-area-inset-bottom, 0px));
}

/* These overrides are intentionally more specific than the legacy app shell. */
html.android-webview[data-native-study-screen] body.app-mode {
  padding-top: 0;
  background: var(--native-canvas);
}
html.android-webview[data-native-study-screen] #appHeader,
html.android-webview[data-native-study-screen] #chapterMenu,
html.android-webview[data-native-study-screen] #whatsappBtn {
  display: none;
}
html.android-webview[data-native-study-screen] body.app-mode :is(#home, #chapters) {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: calc(100dvh - var(--native-dock-reserve));
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--native-canvas);
  box-shadow: none;
  overflow: auto;
  overscroll-behavior-y: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--native-line) var(--native-canvas);
  scroll-padding-block: 12px;
}
html.android-webview[data-native-study-screen] body.app-mode #home > :not(.native-home),
html.android-webview[data-native-study-screen] body.app-mode #chapters > :not(.native-chapters) {
  display: none;
}
html.android-webview[data-native-study-screen="home"] body.app-mode {
  background: var(--native-canvas);
}
html.android-webview[data-native-study-screen="home"] body.app-mode #home { background: transparent; }
html.android-webview :is(.native-home, .native-chapters, .native-dock) {
  box-sizing: border-box;
  color: var(--native-ink);
  font-family: var(--native-body);
}
html.android-webview :is(.native-home, .native-chapters, .native-dock) *,
html.android-webview :is(.native-home, .native-chapters, .native-dock) *::before,
html.android-webview :is(.native-home, .native-chapters, .native-dock) *::after {
  box-sizing: border-box;
}
html.android-webview :where(.native-home, .native-chapters, .native-dock) button {
  appearance: none;
  margin: 0;
  font: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  box-shadow: none;
  text-shadow: none;
  letter-spacing: normal;
  transform: none;
  transition: transform 180ms ease, background-color 180ms ease, color 180ms ease;
}
html.android-webview :is(.native-home, .native-chapters, .native-dock) button:focus-visible,
html.android-webview .native-dial:focus-visible,
html.android-webview .native-motion-toggle:focus-visible {
  outline: 3px solid var(--native-blue);
  outline-offset: 5px;
}
html.android-webview :is(.native-home, .native-chapters, .native-dock) button:disabled {
  cursor: default;
  opacity: .45;
}
html.android-webview :is(.native-home, .native-chapters, .native-dock) button:active:not(:disabled) {
  transform: scale(.97);
}
html.android-webview .native-home {
  width: min(100%, 540px);
  min-height: 100%;
  margin: 0 auto;
  padding: clamp(34px, 7dvh, 62px) 24px 28px;
  display: flex;
  align-items: center;
  flex-direction: column;
}
html.android-webview .native-home h1 {
  margin: 0; width: 100%; height: 44px; flex: none; overflow: clip; text-align: center;
  font: 400 clamp(24px, 6.3vw, 32px)/44px var(--native-display);
  text-transform: uppercase;
}
html.android-webview .native-greeting-rail { display: block; animation: native-greeting-rise 9s ease-in-out both; }
html.android-webview .native-home h1 span { font: inherit; letter-spacing: inherit; }
html.android-webview .native-greeting-rail > span { display: block; height: 44px; white-space: nowrap; }
html.android-webview .native-home h1 .native-greeting-rail > [lang="bn"] {
  font: 700 clamp(23px, 6vw, 29px)/44px var(--font-bn-title);
  letter-spacing: 0; text-transform: none;
}
html.android-webview .native-book {
  position: relative;
  display: grid;
  place-items: center;
  width: min(58vw, 250px);
  padding: 0;
  margin-top: clamp(38px, 7dvh, 64px);
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  filter: none;
}
html.android-webview .native-book-art {
  width: 100%;
  height: auto;
  max-height: 46dvh;
  object-fit: contain;
  box-shadow: none;
  filter: none;
  animation: native-book-float 5s ease-in-out infinite;
}
html.android-webview .native-tap-cue {
  position: absolute; bottom: -28px; left: calc(50% - 20px); width: 40px; height: 40px;
  object-fit: contain; pointer-events: none; opacity: 0;
  filter: brightness(0);
  animation: native-book-tap 5s ease-in-out infinite;
}
html.android-webview .native-motion-toggle {
  display: none;
}
html.android-webview[data-native-study-screen] #profilePanel .native-motion-toggle {
  display: block; width: 100%; min-height: 44px; margin: 8px 0 0; padding: 10px;
  background: var(--native-canvas); color: var(--native-ink); border: 1px solid var(--native-line);
  border-radius: 8px; font: 14px/1.3 var(--native-body); box-shadow: none; cursor: pointer;
}
html.android-webview .native-chapters {
  width: min(100%, 540px); height: 100%; min-height: 0; margin: 0 auto;
  display: flex; flex-direction: column;
}
html.android-webview .native-chapter-workspace {
  /* Keep selection and actions together. Auto margins collapse on short screens;
     the existing parent scroller, never the dock, owns any minimum-size overflow. */
  width: 100%; flex: 1 0 420px; min-height: 420px;
  max-height: calc(min(78vw, 421px) + 210px); margin-block: auto;
  display: grid; grid-template-rows: minmax(210px, 1fr) auto;
}
html.android-webview .native-chapters-header {
  display: grid;
  flex: none;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  padding: 2px 16px;
}
html.android-webview .native-chapters-header h1 {
  margin: 0;
  text-align: center;
  font: 400 18px/1.2 var(--native-display);
  text-transform: uppercase;
}
html.android-webview .native-back {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 10px;
  border: 1px solid transparent;
  background: none;
  border-radius: 50%;
}
html.android-webview .native-back img { width: 22px; height: 22px; object-fit: contain; }
html.android-webview .native-orbit-stage {
  position: relative;
  width: 100%;
  height: 100%;
  max-height: min(78vw, 421px);
  align-self: center;
  isolation: isolate;
  overflow: clip; /* Intentional half-circle crop, not a page-overflow workaround. */
}
/* Move card and wheel as one unit, without moving the six controls or dock.
   Compact screens retain their existing header clearance and scroll ownership. */
@media (min-height: 621px) {
  html.android-webview .native-orbit-stage { transform: translateY(-14px); }
}
html.android-webview :is(.native-dial, .native-dial-interior) {
  position: absolute;
  height: 100%;
  width: auto;
  aspect-ratio: 1;
  top: 50%;
  border-radius: 50%;
}
html.android-webview .native-chapter-detail {
  position: absolute; left: 6%; right: 54%; top: 50%; transform: translateY(-50%);
  height: min(84%, 240px); display: grid; grid-template-rows: minmax(0, 1fr);
}
html.android-webview .native-chapter-preview { position: relative; min-height: 0; }
html.android-webview #nativeChapterTitle {
  position: absolute; inset: 0; display: grid; align-content: center;
  grid-template-columns: minmax(0, 1fr);
  margin: 0; padding: 2px; font: 500 var(--native-title-size, 28px)/1.18 var(--native-ornament);
  /* Whole words must overflow during measurement so the local fitter can shrink
     the type. Breaking anywhere concealed overflow and stranded final letters. */
  text-align: left; text-wrap: balance; overflow-wrap: normal; word-break: normal; hyphens: none; overflow: auto;
  color: var(--native-ink); opacity: 1; transform: translateY(0);
  transition: opacity 260ms ease, transform 300ms ease;
}
html.android-webview .native-chapter-art {
  position: absolute; inset: 0; display: grid; place-items: center;
  width: 100%; height: 100%; min-width: 0; padding: 0;
  border: 0; border-radius: 0; background: transparent; box-shadow: none;
  touch-action: manipulation; -webkit-tap-highlight-color: transparent;
  grid-template: minmax(0, 1fr) / minmax(0, 1fr);
  opacity: 0; transform: translateY(6px);
  transition: opacity 300ms ease, transform 340ms cubic-bezier(.2,.8,.2,1);
}
html.android-webview .native-chapters .native-chapter-art:disabled { opacity: 0; pointer-events: none; }
html.android-webview .native-chapters .native-chapter-art:active:not(:disabled) { transform: scale(.985); }
html.android-webview .native-chapter-art img {
  /* Full source card: no zoom/crop, including the original artwork footer. */
  display: block; width: auto; height: auto; max-width: 100%; max-height: 100%;
  object-fit: contain; border-radius: 0; pointer-events: none; user-select: none; -webkit-user-drag: none;
}
html.android-webview .native-chapter-preview[data-phase="image"] #nativeChapterTitle { opacity: 0; transform: translateY(-5px); }
html.android-webview .native-chapter-preview[data-phase="image"] .native-chapter-art { opacity: 1; transform: translateY(0); }
html.android-webview .native-dial { right: 0; transform: translate(50%, -50%); background: transparent; touch-action: none; cursor: grab; user-select: none; }
html.android-webview .native-dial-interior { right: 0; transform: translate(50%, -50%); pointer-events: none; }
html.android-webview .native-dial.is-dragging { cursor: grabbing; }
html.android-webview .native-dial:focus-visible { outline-offset: -5px; }
html.android-webview .native-dial-face { display: block; width: 100%; height: 100%; overflow: visible; }
html.android-webview .native-dial-orbit { fill: none; stroke: var(--app-palette-divider); stroke-width: 1; vector-effect: non-scaling-stroke; pointer-events: none; }
html.android-webview #nativeDialMarker { fill: var(--native-blue); pointer-events: none; }
html.android-webview .native-dial-face text { fill: var(--native-muted); font: 400 22px var(--native-display); text-anchor: middle; dominant-baseline: central; transition: fill 180ms ease; }
html.android-webview .native-dial-face text.is-selected { fill: var(--native-blue); }
html.android-webview #nativeOpenChapter {
  position: absolute; left: 33.333333%; top: 50%; transform: translate(-50%, -50%);
  isolation: isolate; display: grid; place-items: center;
  width: clamp(56px, 22%, 72px); height: auto; aspect-ratio: 1; padding: 0;
  border: 0; border-radius: 0; pointer-events: auto;
  background: transparent; color: var(--app-palette-on-primary);
  font: 400 18px/1 var(--native-display); text-transform: uppercase;
  transition: filter 160ms ease, scale 160ms ease;
}
/* Share the icon silhouette, not its glass layers. Keep the actual button and
   focus outline unmasked; a matching label core stays readable if SVG fails. */
html.android-webview #nativeOpenChapter::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--native-blue);
  -webkit-mask: var(--native-emblem-shape) center / contain no-repeat;
  mask: var(--native-emblem-shape) center / contain no-repeat;
}
html.android-webview .native-open-label {
  display: block; padding: 3px 5px; background: var(--native-blue);
  font: inherit; letter-spacing: inherit;
  color: var(--app-palette-on-primary); white-space: nowrap; pointer-events: none;
}
html.android-webview .native-chapters #nativeOpenChapter:active:not(:disabled) { transform: translate(-50%, -50%); scale: var(--native-open-press-scale, .97); }
html.android-webview .native-rotate-guide {
  position: absolute; inset: -20px; border-radius: 50%; pointer-events: none; opacity: 0;
  transform: rotate(32deg); transition: filter 160ms ease;
  animation: native-rotate-up 3.8s ease-in-out infinite;
}
html.android-webview .native-rotate-guide.is-down { transform: rotate(-32deg); animation-name: native-rotate-down; animation-delay: .45s; }
html.android-webview .native-rotate-cue {
  position: absolute; left: 0; top: 50%; width: 22px; height: 26px;
  object-fit: contain; pointer-events: none; transform: translate(-50%, -50%) rotate(-32deg);
}
html.android-webview .native-rotate-guide.is-down .native-rotate-cue { transform: translate(-50%, -50%) rotate(32deg); }
html.android-webview .native-dial.is-dragging .native-rotate-guide,
html.android-webview .native-chapters[data-rotary-used] .native-rotate-guide { filter: opacity(0); animation-play-state: paused; }
html.android-webview .native-actions {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 12px;
  width: min(92%, 392px); margin: 12px auto 8px;
}
html.android-webview .native-actions > button {
  position: relative; isolation: isolate;
  display: grid; grid-template-columns: 30px minmax(0, max-content); justify-content: center; align-items: center; column-gap: 8px;
  min-height: 48px; min-width: 0; padding: 0 8px; border: 1px solid transparent; border-radius: 13px;
  background-color: var(--native-ink); color: var(--app-palette-paper);
  background-image: none; box-shadow: none;
  font: 400 clamp(14px, 3.8vw, 18px)/1.1 var(--native-display); text-transform: uppercase;
  transition: filter 160ms ease;
  -webkit-tap-highlight-color: transparent;
}
html.android-webview .native-actions > button.is-blue { background-color: var(--native-blue); }
/* One solid scalloped backing, no glass front, reflections or outer frame.
   Icon and both language widths keep a centered, stable group in each button. */
html.android-webview .native-action-emblem {
  --native-emblem-base: var(--native-blue);
  --native-emblem-scale: 1;
  position: relative; isolation: isolate;
  display: grid; place-items: center; width: 30px; height: 30px;
  border: 0; border-radius: 0; background: transparent;
  pointer-events: none;
  transform: scale(var(--native-emblem-scale)); transition: transform 160ms ease;
}
html.android-webview .native-actions > button.is-blue .native-action-emblem { --native-emblem-base: var(--native-ink); }
html.android-webview .native-action-emblem::before {
  content: ""; position: absolute; inset: 1px; border: 0; border-radius: 0;
  -webkit-mask: var(--native-emblem-shape) center / contain no-repeat;
  mask: var(--native-emblem-shape) center / contain no-repeat;
  pointer-events: none;
  z-index: 0; background: var(--native-emblem-base);
}
html.android-webview .native-chapters .native-actions > button:is(:active, [data-native-pressed]):not(:disabled) {
  transform: none; filter: brightness(.88);
}
html.android-webview .native-chapters .native-actions > button:is(:active, [data-native-pressed]):not(:disabled) .native-action-emblem {
  --native-emblem-scale: .94;
}
html.android-webview .native-action-icon {
  position: relative; z-index: 2;
  display: block; justify-self: center; width: 22px; height: 22px; object-fit: contain;
  pointer-events: none; user-select: none;
}
/* Recolor only the monochrome SVGs; preserve the supplied PNG artwork. */
html.android-webview .native-action-icon.is-symbol { width: 20px; height: 20px; filter: brightness(0) invert(1); }
html.android-webview .native-label-window { display: block; min-width: 0; width: 100%; height: 40px; overflow: clip; pointer-events: none; font: inherit; }
html.android-webview .native-label-rail { display: block; font: inherit; }
html.android-webview .native-label-rail > span { display: grid; align-items: center; justify-items: center; height: 40px; white-space: nowrap; font: inherit; text-align: center; }
html.android-webview .native-label-rail > [lang="bn"] { font: 400 clamp(14px, 4.1vw, 18px)/1.4 var(--font-bn-support); letter-spacing: 0; text-transform: none; }
html.android-webview[data-native-study-screen="chapters"] .native-label-rail { animation: native-label-go-up 9.2s cubic-bezier(.22,.7,.25,1) infinite; }
html.android-webview[data-native-study-screen="chapters"] .native-roundabout { animation: native-roundabout-turn 40s cubic-bezier(.4,0,.25,1) infinite; }
html.android-webview .native-road-divider { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 22px 1fr; gap: 16px; align-items: center; }
html.android-webview .native-road-divider img { display: block; width: 100%; height: auto; }
html.android-webview .native-road-divider img:not(.native-roundabout) { opacity: .45; }
html.android-webview .native-road-divider .native-roundabout { width: 22px; height: 22px; }

/* Compact portrait/landscape retains 44px targets; only the content area scrolls
   when zoom or an unusually short window exceeds this minimum footprint. */
@media (max-height: 620px) {
  html.android-webview .native-chapters-header { padding-block: 3px; }
  html.android-webview .native-chapter-workspace { flex-basis: 398px; min-height: 398px; max-height: calc(min(78vw, 421px) + 188px); }
  html.android-webview .native-actions { margin-block: 8px; gap: 6px 12px; }
  html.android-webview .native-actions > button { min-height: 44px; padding-block: 0; }
}

html.android-webview .native-dock {
  position: fixed; z-index: 1250; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  width: min(calc(100% - 28px), 500px); min-height: 64px; padding: 10px 12px;
  border: 1px solid var(--native-dock); border-radius: 999px; background: var(--native-dock);
  display: flex; align-items: center; gap: 16px;
}
html.android-webview .native-dock[hidden] { display: none; }
html.android-webview[data-native-study-screen] body.qms-open .native-dock,
html.android-webview[data-native-study-screen] body.magic-word-gate-open .native-dock { visibility: hidden; }
html.android-webview .native-progress-link { flex: 1; min-width: 0; padding: 6px 0; border: 0; background: none; min-height: 44px; }
html.android-webview .native-liquid-track { --native-liquid-body: #9CC6FF; --native-liquid-wave: #E2EEFF; display: grid; align-items: center; position: relative; width: 100%; height: 26px; border-radius: 999px; background: var(--native-canvas); overflow: clip; }
html.android-webview .native-progress-label { position: relative; z-index: 1; text-align: center; color: var(--native-ink); font: 400 12px/1 var(--native-display); letter-spacing: .025em; }
html.android-webview .native-liquid-fill { position: absolute; inset: auto 0 0; height: var(--native-progress, 0%); background: var(--native-liquid-body); overflow: clip; }
html.android-webview .native-liquid-fill > span { display: none; }
html.android-webview .native-liquid-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
html.android-webview .native-liquid-track[data-liquid-ready] .native-liquid-fill { visibility: hidden; }
html.android-webview .native-dock-utilities { display: flex; align-items: center; gap: 10px; }
html.android-webview[data-native-study-screen] .native-dock :is(#profileBtn, #adminEntryBtn) {
  position: static; flex: none; width: 44px; height: 44px; min-width: 44px;
  margin: 0; padding: 8px; border: 1px solid var(--native-canvas); border-radius: 50%;
  background: var(--native-canvas); box-shadow: none; transform: none;
}
html.android-webview[data-native-study-screen] .native-dock #adminEntryBtn { padding: 3px; }
html.android-webview[data-native-study-screen] .native-dock #profileBtn img { width: 100%; height: 100%; object-fit: contain; }
html.android-webview[data-native-study-screen] #profilePanel {
  top: auto; bottom: var(--native-dock-reserve); right: max(14px, calc((100vw - 500px) / 2));
  width: min(300px, calc(100vw - 28px)); max-height: calc(100dvh - 120px); overflow: auto;
  background: var(--native-canvas); color: var(--native-ink); border: 1px solid var(--native-line);
}
html.android-webview .native-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
html.android-webview[data-app-transition] :is(.native-home, .native-chapters, .native-dock) { cursor: progress; }
html.android-webview[data-app-transition] :is(.native-home, .native-chapters, .native-dock) button { pointer-events: none; }
@media (hover: hover) {
  html.android-webview .native-chapters .native-chapter-art:hover:not(:disabled) { opacity: .93; }
  html.android-webview .native-actions > button:hover:not(:disabled) {
    filter: brightness(.95);
  }
  html.android-webview .native-back:hover:not(:disabled) { background: #EDEEF0; }
  html.android-webview #nativeOpenChapter:hover:not(:disabled) { filter: brightness(.92); }
  html.android-webview .native-actions > button:hover .native-label-rail { animation-play-state: paused; }
  html.android-webview .native-book:hover .native-book-art { opacity: .88; }
}
@keyframes native-book-float { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-9px) rotate(1deg); } }
@keyframes native-liquid-wave { from { transform: translate(-7%, 0) rotate(-5deg); } to { transform: translate(9%, 5%) rotate(5deg); } }
@keyframes native-greeting-rise { 0%, 27% { transform: translateY(0); } 31%, 63% { transform: translateY(-44px); } 67%, 100% { transform: translateY(-88px); } }
@keyframes native-book-tap {
  0%, 12%, 56%, 100% { opacity: 0; transform: translateY(var(--tap-cue-rest-y, 22px)) scale(1); filter: brightness(0); }
  20% { opacity: .8; transform: translateY(var(--tap-cue-approach-y, 4px)) scale(1); filter: brightness(0); }
  32% { opacity: .9; transform: translateY(var(--tap-cue-contact-y, -48px)) scale(1); filter: brightness(0) invert(1); }
  39% { opacity: .9; transform: translateY(var(--tap-cue-contact-y, -48px)) scale(.86); filter: brightness(0) invert(1); }
  50% { opacity: 0; transform: translateY(var(--tap-cue-contact-y, -48px)) scale(.92); filter: brightness(0) invert(1); }
}
@keyframes native-rotate-up { 0%, 8% { opacity: 0; transform: rotate(24deg); } 20% { opacity: .55; } 48%, 100% { opacity: 0; transform: rotate(40deg); } }
@keyframes native-rotate-down { 0%, 8% { opacity: 0; transform: rotate(-24deg); } 20% { opacity: .55; } 48%, 100% { opacity: 0; transform: rotate(-40deg); } }
@keyframes native-label-go-up { 0%, 30% { transform: translateY(0); } 36%, 72% { transform: translateY(-40px); } 78%, 100% { transform: translateY(-80px); } }
@keyframes native-roundabout-turn { 0%, 12% { transform: rotate(0); } 17%, 35% { transform: rotate(360deg); } 40%, 55% { transform: rotate(0); } 65%, 83% { transform: rotate(-720deg); } 88%, 100% { transform: rotate(-360deg); } }
html.android-webview[data-native-background] :is(.native-label-rail, .native-roundabout),
html.android-webview[data-app-transition] :is(.native-label-rail, .native-roundabout),
html.android-webview .native-actions > button:focus-visible .native-label-rail { animation-play-state: paused; }
/* Explicit pause is a static bilingual layout in the same 40px label viewport. */
html.android-webview[data-native-motion-paused] :is(.native-label-rail, .native-roundabout) { animation: none; }
html.android-webview[data-native-motion-paused] .native-label-rail > span { height: 20px; font-size: 13px; }
html.android-webview[data-native-motion-paused] .native-label-rail > span:last-child { display: none; }
html.android-webview[data-native-motion-paused] :is(.native-book-art, .native-liquid-fill > span, .native-greeting-rail, .native-tap-cue, .native-rotate-guide),
html.android-webview[data-native-background] :is(.native-book-art, .native-liquid-fill > span, .native-greeting-rail, .native-tap-cue, .native-rotate-guide) { animation-play-state: paused; }
html.android-webview[data-native-motion-paused] .native-greeting-rail { animation: none; transform: translateY(-44px); }
html.android-webview[data-native-motion-paused] .native-tap-cue { animation: none; opacity: .4; transform: none; }
html.android-webview[data-native-motion-paused] .native-rotate-guide { animation: none; opacity: .4; }
html.android-webview[data-native-motion-paused] :is(#nativeChapterTitle, .native-chapter-art, .native-dial-face text) { transition: none; transform: none; }
html.android-webview[data-native-motion-paused] .native-actions > button { transition: none; }
html.android-webview[data-native-motion-paused] .native-chapters .native-actions > button:is(:active, [data-native-pressed]):not(:disabled) { transform: none; }
html.android-webview[data-native-motion-paused] .native-chapters .native-chapter-art:active:not(:disabled) { transform: none; }
html.android-webview[data-native-motion-paused] .native-chapters #nativeOpenChapter { --native-open-press-scale: 1; transition: none; }
html.android-webview[data-native-motion-paused] .native-chapters .native-actions > button .native-action-emblem,
html.android-webview[data-native-motion-paused] .native-chapters .native-actions > button:is(:hover, :active, [data-native-pressed]):not(:disabled) .native-action-emblem {
  --native-emblem-scale: 1; transition: none;
}
@media (prefers-reduced-motion: reduce) {
  html.android-webview .native-chapters #nativeOpenChapter { --native-open-press-scale: 1; transition: none; }
  html.android-webview .native-chapters .native-actions > button .native-action-emblem,
  html.android-webview .native-chapters .native-actions > button:is(:hover, :active, [data-native-pressed]):not(:disabled) .native-action-emblem {
    --native-emblem-scale: 1; transition: none;
  }
  html.android-webview .native-chapters .native-chapter-art:active:not(:disabled) { transform: none; }
  html.android-webview .native-actions > button { transition: none; }
  html.android-webview .native-chapters .native-actions > button:is(:active, [data-native-pressed]):not(:disabled) { transform: none; }
  html.android-webview[data-native-study-screen="chapters"] :is(.native-label-rail, .native-roundabout) { animation: none; }
  html.android-webview[data-native-study-screen="chapters"] .native-label-rail > span { height: 20px; font-size: 13px; }
  html.android-webview .native-label-rail > span:last-child { display: none; }
  html.android-webview :is(#nativeChapterTitle, .native-chapter-art, .native-dial-face text) { transition-duration: 0ms; transform: none; }
  html.android-webview .native-book-art,
  html.android-webview .native-liquid-fill > span { animation: none; }
  html.android-webview .native-greeting-rail { animation: none; transform: translateY(-44px); }
  html.android-webview :is(.native-tap-cue, .native-rotate-guide) { animation: none; opacity: .4; }
  html.android-webview .native-liquid-fill { transition: none; }
  html.android-webview .native-motion-toggle { visibility: hidden; }
}
@media (forced-colors: active) {
  html.android-webview #nativeOpenChapter::before,
  html.android-webview .native-open-label { background: Highlight; color: HighlightText; forced-color-adjust: none; }
  html.android-webview .native-dial { background: transparent; }
  html.android-webview .native-dial-face text { fill: CanvasText; }
  html.android-webview .native-dial-face text.is-selected { fill: Highlight; }
  html.android-webview #nativeDialMarker { fill: Highlight; }
  html.android-webview .native-dial-orbit { stroke: CanvasText; }
  html.android-webview .native-dock { border-color: CanvasText; }
  html.android-webview .native-liquid-track { border: 1px solid CanvasText; }
  html.android-webview .native-liquid-fill { background: Highlight; }
  html.android-webview .native-liquid-canvas { display: none; }
  html.android-webview .native-liquid-track[data-liquid-ready] .native-liquid-fill { visibility: visible; }
  html.android-webview .native-liquid-fill > span { display: none; }
  html.android-webview .native-progress-label { background: Canvas; color: CanvasText; margin-inline: auto; padding: 2px; }
  html.android-webview .native-actions > button { border-color: ButtonText; }
  html.android-webview .native-action-emblem::before {
    background: var(--native-ink); forced-color-adjust: none;
    box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none;
  }
  html.android-webview .native-actions > button:is(:active, [data-native-pressed]):not(:disabled) { border-color: Highlight; }
}
