/**
 * TAG Reader 4.1.9 — responsive interaction layer.
 * Loaded AFTER tag-devotional-reader.css and tag-reader-header-control.css.
 * All selectors are scoped to the enhanced reader; existing article content,
 * WordPress forms, account controls and global navigation are not restyled.
 */

body.tag-reader-single-modal-ready {
  --tag-ui-ink: #302c29;
  --tag-ui-muted: #625e5a;
  --tag-ui-paper: #fffefa;
  --tag-ui-canvas: #faf7f2;
  --tag-ui-edge: #ded7ce;
  --tag-ui-accent: #7a1f1f;
  --tag-ui-accent-hover: #5b1818;
  --tag-ui-ring: #1e6687;
  --tag-ui-shadow: 0 18px 55px rgba(29, 29, 33, .17), 0 2px 6px rgba(29, 29, 33, .08);
}

/* The original toolbar still owns its handlers; the enhanced UI is the
 * single visible reader surface. No empty player layout or duplicate buttons. */
body.tag-reader-single-modal-ready .tag-devotional-reader-shell .tag-reader-main-row,
body.tag-reader-single-modal-ready .tag-devotional-reader-shell .tag-read-aloud-player {
  display: none !important;
}

body.tag-reader-single-modal-ready :where(.tag-header-reader-settings-toggle,
  .tag-single-reader-btn, .tag-reader-mini-btn,
  [data-tag-accessibility-panel] button, [data-tag-bookmark-modal] button) {
  min-height: 44px;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

body.tag-reader-single-modal-ready :where(.tag-header-reader-settings-toggle,
  .tag-single-reader-btn, .tag-reader-mini-btn,
  [data-tag-accessibility-panel] button, [data-tag-accessibility-panel] select,
  [data-tag-bookmark-modal] button):focus-visible {
  outline: 3px solid var(--tag-ui-ring) !important;
  outline-offset: 3px;
}

/* A compact control inside the site header; it is not a duplicate player. */
body.tag-reader-single-modal-ready .tag-header-reader-settings-toggle {
  display: inline-flex;
  position: relative;
  flex: 0 0 auto;
  gap: .5rem;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  min-width: 44px;
  padding: .5rem .9rem;
  border: 1px solid #cddbe3;
  border-radius: 999px;
  background: #fff;
  color: #215775;
  box-shadow: 0 2px 8px rgba(0, 45, 70, .07);
  font: 700 .88rem/1.2 system-ui, -apple-system, sans-serif;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}
body.tag-reader-single-modal-ready .tag-header-reader-settings-toggle svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
body.tag-reader-single-modal-ready .tag-header-reader-settings-toggle:hover,
body.tag-reader-single-modal-ready .tag-header-reader-settings-toggle[aria-expanded="true"] {
  background: #eaf4f8;
  border-color: #7ca8be;
}
body.tag-reader-single-modal-ready .tag-header-reader-settings-toggle.is-playing::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #298866;
  box-shadow: 0 0 0 2px #fff;
}

/* The *existing* settings layer is the one and only dialog. */
body.tag-reader-single-modal-ready [data-tag-accessibility-layer][hidden],
body.tag-reader-single-modal-ready [data-tag-bookmark-layer][hidden],
body.tag-reader-single-modal-ready #tag-reader-mini-player[hidden],
body.tag-reader-single-modal-ready .tag-single-reader-audio[hidden] {
  display: none !important;
}
body.tag-reader-single-modal-ready [data-tag-accessibility-layer]:not([hidden]),
body.tag-reader-single-modal-ready [data-tag-bookmark-layer]:not([hidden]) {
  position: fixed !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center;
  overflow: auto;
  padding: clamp(.65rem, 3vw, 1.5rem) !important;
  z-index: 1000000 !important;
  box-sizing: border-box;
}
body.tag-reader-single-modal-ready [data-tag-accessibility-layer] .tag-reader-modal-backdrop,
body.tag-reader-single-modal-ready [data-tag-bookmark-layer] .tag-reader-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(21, 27, 34, .64);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
body.tag-reader-single-modal-ready [data-tag-accessibility-panel],
body.tag-reader-single-modal-ready [data-tag-bookmark-modal] {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  z-index: 1;
  display: flex !important;
  flex-direction: column;
  margin: auto !important;
  width: min(880px, 100%) !important;
  max-width: 100% !important;
  max-height: min(90dvh, 900px) !important;
  border: 1px solid var(--tag-ui-edge);
  border-radius: 20px;
  background: var(--tag-ui-paper);
  color: var(--tag-ui-ink);
  box-shadow: var(--tag-ui-shadow);
  overflow: hidden;
  box-sizing: border-box;
}
body.tag-reader-single-modal-ready [data-tag-bookmark-modal] { width: min(570px, 100%) !important; }
body.tag-reader-single-modal-ready .tag-accessibility-panel__header {
  display: flex;
  align-items: center;
  gap: .9rem;
  justify-content: space-between;
  padding: 1.15rem clamp(1rem, 3vw, 1.6rem);
  background: var(--tag-ui-paper);
  border-bottom: 1px solid var(--tag-ui-edge);
}
body.tag-reader-single-modal-ready .tag-accessibility-panel__header .tag-reader-modal-heading {
  min-width: 0;
}
body.tag-reader-single-modal-ready .tag-accessibility-panel__header .tag-panel-close {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 12px;
}
body.tag-reader-single-modal-ready [data-tag-accessibility-panel] .tag-accessibility-panel__body,
body.tag-reader-single-modal-ready [data-tag-bookmark-modal] .tag-reader-bookmark-modal__body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: clamp(.9rem, 3vw, 1.55rem);
  background: var(--tag-ui-canvas);
}
body.tag-reader-single-modal-ready [data-tag-accessibility-panel] .tag-reader-panel-footer,
body.tag-reader-single-modal-ready [data-tag-bookmark-modal] .tag-reader-bookmark-modal__footer {
  border-top: 1px solid var(--tag-ui-edge);
  padding: .8rem clamp(1rem, 3vw, 1.6rem);
  background: var(--tag-ui-paper);
}
body.tag-reader-single-modal-ready .tag-accessibility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}
body.tag-reader-single-modal-ready .tag-accessibility-section {
  min-width: 0;
  margin: 0;
  border: 1px solid var(--tag-ui-edge);
  border-radius: 14px;
  background: var(--tag-ui-paper);
  padding: 1rem;
}
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-segmented,
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-theme-grid,
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-reader-toggles {
  max-width: 100%;
  min-width: 0;
}
body.tag-reader-single-modal-ready .tag-accessibility-section button,
body.tag-reader-single-modal-ready .tag-accessibility-section select {
  font-size: .93rem;
}
body.tag-reader-single-modal-ready .tag-accessibility-section select,
body.tag-reader-single-modal-ready .tag-single-reader-speed select {
  max-width: 100%;
  min-height: 44px;
  border: 1px solid #bcb5ad;
  border-radius: 9px;
  background: #fff;
  color: #2d2825;
}

/* A deliberately prominent listen surface, not a second settings modal. */
body.tag-reader-single-modal-ready .tag-single-reader-audio {
  display: grid;
  gap: .75rem;
  padding: clamp(1rem, 3vw, 1.3rem);
  margin-bottom: 1rem;
  background: #fff;
  border: 1px solid #d7e2e8;
  border-left: 5px solid #1e6687;
  border-radius: 16px;
  color: var(--tag-ui-ink);
  box-shadow: 0 3px 16px rgba(11, 33, 46, .045);
}
body.tag-reader-single-modal-ready .tag-single-reader-audio-title {
  margin: 0;
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  line-height: 1.3;
  color: #2b3640;
}
body.tag-reader-single-modal-ready .tag-single-reader-audio-copy {
  margin: 0;
  color: var(--tag-ui-muted);
  line-height: 1.55;
  font-size: .91rem;
}
body.tag-reader-single-modal-ready .tag-single-reader-audio-status {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem 1rem;
  flex-wrap: wrap;
  font-size: .88rem;
  color: #4d5961;
}
body.tag-reader-single-modal-ready .tag-single-reader-audio-status strong { color: #23546e; }
body.tag-reader-single-modal-ready .tag-single-reader-audio[data-has-error] .tag-single-reader-audio-status strong { color: #a02225; }
body.tag-reader-single-modal-ready .tag-reader-ui-progress {
  width: 100%;
  height: 5px;
  background: #e4eaf0;
  border-radius: 99px;
  overflow: hidden;
}
body.tag-reader-single-modal-ready .tag-reader-ui-progress__fill {
  display: block;
  height: 100%;
  width: 0;
  background: #267a9d;
  border-radius: inherit;
  transition: width .15s linear;
}
body.tag-reader-single-modal-ready .tag-single-reader-audio-actions,
body.tag-reader-single-modal-ready .tag-single-reader-audio-extras {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
}
body.tag-reader-single-modal-ready .tag-single-reader-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-width: 44px;
  padding: .65rem .95rem;
  border-radius: 10px;
  border: 1px solid #d2d9dd;
  background: #f8fafb;
  color: #244d63;
  font: 700 .91rem/1.3 system-ui, -apple-system, sans-serif;
  cursor: pointer;
  box-shadow: none;
  transition: background-color .16s ease, border-color .16s ease;
}
body.tag-reader-single-modal-ready .tag-single-reader-btn svg { width: 20px; height: 20px; flex: 0 0 auto; }
body.tag-reader-single-modal-ready .tag-single-reader-btn:hover:not(:disabled) {
  background: #eaf2f6;
  border-color: #89b3c7;
}
body.tag-reader-single-modal-ready .tag-single-reader-btn--primary {
  min-width: 136px;
  background: #1e6687;
  border-color: #1e6687;
  color: white;
}
body.tag-reader-single-modal-ready .tag-single-reader-btn--primary:hover:not(:disabled) {
  background: #154f6c;
  color: #fff;
}
body.tag-reader-single-modal-ready .tag-single-reader-btn:disabled,
body.tag-reader-single-modal-ready .tag-reader-mini-btn:disabled { opacity: .5; cursor: not-allowed; }
body.tag-reader-single-modal-ready .tag-single-reader-audio-extras {
  padding-top: .55rem;
  border-top: 1px solid #e9e9e8;
}
body.tag-reader-single-modal-ready .tag-single-reader-speed {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-left: auto;
  color: #485963;
  font-weight: 600;
  font-size: .85rem;
}
body.tag-reader-single-modal-ready .tag-single-reader-speed select {
  width: auto;
  padding: .45rem 1.7rem .45rem .6rem;
}

/* Fixed mini-player. The only always-on playback toolbar. */
body.tag-reader-single-modal-ready #tag-reader-mini-player:not([hidden]) {
  position: fixed;
  inset: auto auto max(12px, env(safe-area-inset-bottom, 0px)) 50%;
  transform: translateX(-50%);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: clamp(.8rem, 2vw, 1.6rem);
  width: min(730px, calc(100vw - 28px));
  min-height: 76px;
  padding: .85rem 1rem;
  border: 1px solid #cadbe2;
  border-radius: 18px;
  background: #fffefa;
  color: var(--tag-ui-ink);
  box-shadow: var(--tag-ui-shadow);
  z-index: 99990;
}
body.tag-reader-single-modal-ready .tag-reader-mini-copy {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  gap: .18rem;
  min-width: 0;
}
body.tag-reader-single-modal-ready .tag-reader-mini-eyebrow {
  font: 800 .67rem/1.15 system-ui, -apple-system, sans-serif;
  letter-spacing: .1em;
  color: #667881;
}
body.tag-reader-single-modal-ready .tag-reader-mini-state {
  font: 750 .95rem/1.25 system-ui, -apple-system, sans-serif;
  color: #264453;
}
body.tag-reader-single-modal-ready .tag-reader-mini-progress {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .78rem;
  color: #62727b;
}
body.tag-reader-single-modal-ready .tag-reader-mini-copy .tag-reader-ui-progress { margin-top: .2rem; }
body.tag-reader-single-modal-ready .tag-reader-mini-actions {
  display: flex;
  flex: 0 0 auto;
  gap: .45rem;
  align-items: center;
}
body.tag-reader-single-modal-ready .tag-reader-mini-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid #d4dbe0;
  border-radius: 12px;
  background: #eef4f7;
  color: #225572;
  cursor: pointer;
  box-shadow: none;
}
body.tag-reader-single-modal-ready .tag-reader-mini-btn svg { width: 20px; height: 20px; }
body.tag-reader-single-modal-ready .tag-reader-mini-btn--primary {
  background: #1e6687;
  color: white;
  border-color: #1e6687;
}
body.tag-reader-single-modal-ready .tag-reader-mini-btn:hover:not(:disabled) { filter: brightness(.95); }
body.tag-reader-single-modal-ready .tag-reader-mini-aa {
  font: 750 1rem/1 system-ui, -apple-system, sans-serif;
}
body.tag-reader-single-modal-ready .tag-reader-mini-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
/* When modal/installation UI is up, do not layer the dock over the dialog. */
body.tag-reader-single-modal-ready.tag-reader-native-modal-open #tag-reader-mini-player,
body.tag-reader-single-modal-ready.tag-reader-external-popup-open #tag-reader-mini-player { visibility: hidden; pointer-events: none; }

/* Theme preferences follow the reader setting even though WordPress portals
 * its single dialog to the document body. */
body.tag-reader-single-modal-ready[data-tag-reader-theme="dark"] {
  --tag-ui-ink: #eef3f6;
  --tag-ui-muted: #b6c6cf;
  --tag-ui-paper: #192834;
  --tag-ui-canvas: #14222d;
  --tag-ui-edge: #466071;
  --tag-ui-shadow: 0 18px 55px rgba(0,0,0,.46);
}
body.tag-reader-single-modal-ready[data-tag-reader-theme="dark"] :where(.tag-single-reader-audio, #tag-reader-mini-player) {
  background: #203643;
  color: #eef3f6;
  border-color: #466071;
}
body.tag-reader-single-modal-ready[data-tag-reader-theme="dark"] :where(.tag-single-reader-audio-title,.tag-reader-mini-state,.tag-reader-mini-progress,.tag-single-reader-audio-copy,.tag-single-reader-audio-status strong) { color: #eef3f6; }
body.tag-reader-single-modal-ready[data-tag-reader-theme="dark"] .tag-accessibility-section { background: #203643; }
body.tag-reader-single-modal-ready[data-tag-reader-theme="contrast"] { --tag-ui-ring: #000; }

@media (max-width: 900px) {
  body.tag-reader-single-modal-ready .tag-accessibility-grid { grid-template-columns: 1fr 1fr; }
  body.tag-reader-single-modal-ready .tag-accessibility-section { padding: .85rem; }
}
@media (max-width: 700px) {
  body.tag-reader-single-modal-ready .tag-header-reader-settings-toggle {
    width: 44px;
    height: 44px;
    min-width: 44px;
    padding: 0;
  }
  body.tag-reader-single-modal-ready .tag-header-settings-toggle-label { display: none; }
  body.tag-reader-single-modal-ready [data-tag-accessibility-layer]:not([hidden]),
  body.tag-reader-single-modal-ready [data-tag-bookmark-layer]:not([hidden]) { padding: .6rem !important; }
  body.tag-reader-single-modal-ready [data-tag-accessibility-panel],
  body.tag-reader-single-modal-ready [data-tag-bookmark-modal] {
    width: 100% !important;
    max-height: calc(100dvh - 1.2rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 16px;
  }
  body.tag-reader-single-modal-ready .tag-accessibility-grid { grid-template-columns: minmax(0, 1fr); }
  body.tag-reader-single-modal-ready .tag-single-reader-btn { flex: 1 1 auto; }
  body.tag-reader-single-modal-ready .tag-single-reader-speed { width: 100%; justify-content: space-between; margin-left: 0; }
}
@media (max-width: 440px) {
  body.tag-reader-single-modal-ready #tag-reader-mini-player:not([hidden]) {
    width: calc(100vw - 20px);
    padding: .65rem .7rem;
    gap: .45rem;
    border-radius: 14px;
  }
  body.tag-reader-single-modal-ready .tag-reader-mini-btn {
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }
  body.tag-reader-single-modal-ready .tag-reader-mini-actions { gap: .3rem; }
  body.tag-reader-single-modal-ready .tag-reader-mini-eyebrow { font-size: .61rem; }
  body.tag-reader-single-modal-ready .tag-reader-mini-state { font-size: .84rem; }
  body.tag-reader-single-modal-ready .tag-reader-mini-progress { font-size: .7rem; }
  body.tag-reader-single-modal-ready .tag-single-reader-audio-actions > .tag-single-reader-btn { flex: 1 1 calc(50% - .55rem); }
  body.tag-reader-single-modal-ready .tag-single-reader-audio-extras > .tag-single-reader-btn { flex: 1 1 calc(50% - .55rem); }
}
@media (max-height: 540px) and (orientation: landscape) {
  body.tag-reader-single-modal-ready [data-tag-accessibility-panel],
  body.tag-reader-single-modal-ready [data-tag-bookmark-modal] { max-height: calc(100dvh - 16px) !important; }
  body.tag-reader-single-modal-ready .tag-accessibility-panel__header { padding-block: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
  body.tag-reader-single-modal-ready :where(.tag-reader-ui-progress__fill,.tag-header-reader-settings-toggle,.tag-single-reader-btn) { transition: none !important; }
}

/* The Formidable comment form is injected inside the reader's content area.
 * Prevent wide plugin fieldsets and fixed-width fields from introducing an
 * article-level horizontal scrollbar on narrow screens. */
body.tag-reader-single-modal-ready .tag-devotional-reader-content :where(.frm_forms, .frm_forms form, .frm_forms fieldset,
  .frm_fields_container, .frm_form_field, .frm_description) {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
body.tag-reader-single-modal-ready .tag-devotional-reader-content .frm_forms fieldset {
  width: 100%;
  padding-inline: min(3vw, 16px);
}
body.tag-reader-single-modal-ready .tag-devotional-reader-content .frm_forms :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
  box-sizing: border-box;
  max-width: 100% !important;
}
@media (max-width: 440px) {
  body.tag-reader-single-modal-ready .tag-site-header #site-navigation { min-width: 0; }
  body.tag-reader-single-modal-ready .tag-site-header #tag-site-search {
    flex-shrink: 1;
    min-width: 0;
    max-width: min(35vw, 150px);
  }
}

/* Consistent native preference controls without replacing the PHP templates. */
body.tag-reader-single-modal-ready .tag-reader-modal-heading {
  display: flex;
  align-items: center;
  gap: .85rem;
}
body.tag-reader-single-modal-ready .tag-reader-modal-heading .tag-reader-modal-icon {
  display: flex;
  flex: 0 0 44px;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #e7f2f8;
  color: #1e6687;
  font-weight: 800;
  font-size: 1rem;
}
body.tag-reader-single-modal-ready .tag-reader-modal-heading strong {
  display: block;
  color: var(--tag-ui-ink);
  font: 750 clamp(1.08rem, 2.1vw, 1.3rem)/1.2 system-ui, -apple-system, sans-serif;
}
body.tag-reader-single-modal-ready .tag-reader-modal-heading p {
  margin: .2rem 0 0;
  color: var(--tag-ui-muted);
  font-size: .88rem;
  line-height: 1.45;
}
body.tag-reader-single-modal-ready .tag-accessibility-panel__header .tag-panel-close {
  border: 1px solid var(--tag-ui-edge);
  background: var(--tag-ui-canvas);
  color: var(--tag-ui-ink);
  font: 600 1.5rem/1 system-ui, -apple-system, sans-serif;
  cursor: pointer;
}
body.tag-reader-single-modal-ready .tag-accessibility-group__label {
  display: block;
  margin-bottom: .7rem;
  color: var(--tag-ui-ink);
  font: 750 .9rem/1.3 system-ui, -apple-system, sans-serif;
}
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-segmented,
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-theme-grid {
  display: grid;
  gap: .4rem;
}
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-segmented:not(.tag-segmented--four) { grid-template-columns: repeat(3,minmax(0,1fr)); }
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-segmented--four,
body.tag-reader-single-modal-ready .tag-accessibility-section .tag-theme-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
body.tag-reader-single-modal-ready .tag-accessibility-section :where(.tag-segmented,.tag-theme-grid) button {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: .3rem;
  min-width: 0;
  padding: .52rem .3rem;
  border: 1px solid #d5dce0;
  border-radius: 9px;
  background: var(--tag-ui-paper);
  color: var(--tag-ui-ink);
  text-align: center;
  cursor: pointer;
  overflow-wrap: anywhere;
}
body.tag-reader-single-modal-ready .tag-accessibility-section :where(.tag-segmented,.tag-theme-grid) button small {
  font-size: .69rem;
  line-height: 1.3;
}
body.tag-reader-single-modal-ready .tag-accessibility-section :where(.tag-segmented,.tag-theme-grid) button[aria-pressed="true"] {
  background: #e2f1f8;
  color: #154e69;
  border-color: #227da6;
  box-shadow: inset 0 0 0 1px #227da6;
}
body.tag-reader-single-modal-ready .tag-reader-toggles {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: .45rem;
}
body.tag-reader-single-modal-ready .tag-reader-toggles button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  min-width: 0;
  padding: .55rem .6rem;
  border: 1px solid var(--tag-ui-edge);
  border-radius: 9px;
  background: var(--tag-ui-paper);
  color: var(--tag-ui-ink);
  text-align: left;
  font-size: .81rem;
  line-height: 1.25;
  cursor: pointer;
}
body.tag-reader-single-modal-ready .tag-reader-toggles button[aria-pressed="true"] {
  background: #e2f1f8;
  border-color: #227da6;
  color: #154e69;
}
body.tag-reader-single-modal-ready .tag-reader-toggles .tag-toggle-indicator {
  position: relative;
  display: inline-block;
  flex: 0 0 28px;
  width: 28px;
  height: 17px;
  border-radius: 99px;
  background: #b6bec5;
  transition: background-color .15s ease;
}
body.tag-reader-single-modal-ready .tag-reader-toggles .tag-toggle-indicator::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: white;
  transition: transform .15s ease;
}
body.tag-reader-single-modal-ready .tag-reader-toggles button[aria-pressed="true"] .tag-toggle-indicator { background: #1e6687; }
body.tag-reader-single-modal-ready .tag-reader-toggles button[aria-pressed="true"] .tag-toggle-indicator::after { transform: translateX(11px); }
body.tag-reader-single-modal-ready .tag-reader-panel-footer,
body.tag-reader-single-modal-ready .tag-reader-bookmark-modal__footer {
  display: flex;
  justify-content: space-between;
  gap: .65rem;
  flex-wrap: wrap;
  align-items: center;
}
body.tag-reader-single-modal-ready .tag-reader-panel-footer__primary { display: flex; flex-wrap: wrap; gap: .55rem; }
body.tag-reader-single-modal-ready :where(.tag-reader-offline-btn,.tag-reader-focus-panel-btn,.tag-reader-reset,
  .tag-reader-modal-primary,.tag-reader-modal-secondary,.tag-reader-modal-danger) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .6rem .95rem;
  border-radius: 10px;
  border: 1px solid var(--tag-ui-edge);
  background: var(--tag-ui-canvas);
  color: var(--tag-ui-ink);
  font: 650 .86rem/1.2 system-ui, -apple-system, sans-serif;
  cursor: pointer;
}
body.tag-reader-single-modal-ready .tag-reader-focus-panel-btn,
body.tag-reader-single-modal-ready .tag-reader-modal-primary { background: #1e6687; color: white; border-color: #1e6687; }
body.tag-reader-single-modal-ready .tag-reader-modal-danger { color: #a12b31; border-color: #d8a5a9; }
body.tag-reader-single-modal-ready .tag-reader-reset { margin-left: auto; }
body.tag-reader-single-modal-ready [data-tag-accessibility-panel] .tag-reader-help {
  color: var(--tag-ui-muted);
  margin: .45rem 0 0;
  font-size: .79rem;
  line-height: 1.45;
}
@media (max-width: 440px) {
  body.tag-reader-single-modal-ready .tag-reader-modal-heading { gap: .55rem; }
  body.tag-reader-single-modal-ready .tag-reader-modal-heading .tag-reader-modal-icon { flex-basis: 36px; width: 36px; height: 36px; }
  body.tag-reader-single-modal-ready .tag-reader-toggles { grid-template-columns: minmax(0,1fr); }
  body.tag-reader-single-modal-ready .tag-reader-panel-footer__primary { width: 100%; }
  body.tag-reader-single-modal-ready .tag-reader-panel-footer__primary > button { flex: 1 1 0; }
  body.tag-reader-single-modal-ready .tag-reader-panel-footer .tag-reader-reset { padding: .35rem .55rem; min-height: 34px; font-size: .76rem; }
}
