/* Reader Challenges. Selectors start with "html body" to win over theme button styles (Astra).
   The copies' version of the plugin's assets/challenge.css (1.3.1): their dark mode (data-theme="dark" on the
   page, site.css) in place of WP Dark Mode's data-wp-dark-mode-active, and site.css's colours (--heading, --accent:
   the same in the light) in place of the theme's, which WP Dark Mode repainted. */
.rc-ui, .rc-pick {
  --rc-bg: #ffffff;
  --rc-fg: #1d2327;
  --rc-muted: #5b6670;
  --rc-border: #d5dbe1;
  --rc-soft: #f4f6f8;
  --rc-accent: #0073aa;
  --rc-accent-hover: #005a87;
  --rc-on-accent: #ffffff;
  --rc-ok: #17723a;
  --rc-warn: #8a5a00;
  --rc-bad: #b42318;
  --rc-tint: rgba(0, 115, 170, 0.07);
  --rc-tint-strong: rgba(0, 115, 170, 0.15);
  --rc-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
}
html[data-theme="dark"] .rc-ui, html[data-theme="dark"] .rc-pick {
  --rc-bg: #1d2127;
  --rc-fg: #e8edf2;
  --rc-muted: #a3adb8;
  --rc-border: #3a424b;
  --rc-soft: #262c33;
  --rc-accent: #5aa9dc;
  --rc-accent-hover: #86c1e8;
  --rc-on-accent: #0b1a26;
  --rc-ok: #5cc98a;
  --rc-warn: #e0b45a;
  --rc-bad: #f08a80;
  --rc-tint: rgba(90, 169, 220, 0.12);
  --rc-tint-strong: rgba(90, 169, 220, 0.24);
  --rc-shadow: 0 24px 64px rgba(0, 0, 0, 0.6);
}

/* The Challenge button, in each section's Simplify/Summarize/FAQ bar and as the Challenge chip of
   the box under the introduction: free of theme button styles here, drawn by the rules below. */
html body button.rc-challenge {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  cursor: pointer;
}
html body button.rc-challenge:not(.rc-ready) { visibility: hidden; }
html body button.rc-challenge[hidden] { display: none; }
html body .interactive-controls > button.rc-challenge { order: 1; }

/* The reading tools: the article's own Simplify / Summarize / FAQ buttons, the Challenge buttons
   and the chips of the box under the introduction share one look, the sites' Home "Reading tools"
   chips (artifacts/homepage/home_layout.js), whose colours WP Dark Mode darkens the same way here.
   Class selectors only: WP Dark Mode leaves rules naming the button element out when it recolours
   the page, and the section bars carry wp-dark-mode-ignore (RC_Frontend::section_bars) to keep its
   own button colours off them. A button showing its view ("Original", "Cancel") is outlined. */
html body .rc-tools,
html body .interactive-controls,
html body .rc-bar {
  --rt-accent: #0170b9;
  --rt-accent-hover: #015a94;
  --rt-on-accent: #ffffff;
  --rt-tint: rgba(1, 112, 185, 0.08);
  --rt-text: #3a3a3a;
  --rt-muted: #5f6b7a;
  --rt-badge: #c2410c;
  --rt-card: #ffffff;
  --rt-border: #e1e6eb;
}
html[data-theme="dark"] body .rc-tools,
html[data-theme="dark"] body .interactive-controls,
html[data-theme="dark"] body .rc-bar {
  --rt-accent: #5aa9dc;
  --rt-accent-hover: #86c1e8;
  --rt-on-accent: #0b1a26;
  --rt-tint: rgba(90, 169, 220, 0.14);
  --rt-text: #b5c4d1;
  --rt-muted: #9cb2c6;
  --rt-badge: #f0844a;
  --rt-card: #232531;
  --rt-border: #3a3f4f;
}
html body .rc-tools .rc-chip,
html body .interactive-controls .interactive-button,
html body .interactive-controls .rc-challenge,
html body .rc-bar .rc-challenge {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 5px 12px;
  border: 1px solid var(--rt-accent);
  border-radius: 6px;
  background: var(--rt-accent);
  color: var(--rt-on-accent);
  font: 500 15px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  text-decoration: none;
  white-space: nowrap;
}
/* Section buttons stay at least 32 px tall, as the articles' accessibility block makes them. */
html body .interactive-controls .interactive-button,
html body .interactive-controls .rc-challenge,
html body .rc-bar .rc-challenge { min-height: 32px; padding: 6px 12px; }
html body .interactive-controls .interactive-button,
html body .interactive-controls .rc-challenge,
html body .rc-bar .rc-challenge,
html body .rc-tools .rc-chip.rc-challenge {
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
/* The box's Challenge chip shows before the script is ready too: it is part of the list. */
html body .rc-tools .rc-chip.rc-challenge { visibility: visible; }
html body .interactive-controls .interactive-button:hover,
html body .interactive-controls .rc-challenge:hover,
html body .rc-bar .rc-challenge:hover,
html body .rc-tools .rc-chip.rc-challenge:hover { border-color: var(--rt-accent-hover); background: var(--rt-accent-hover); color: var(--rt-on-accent); }
html body .interactive-controls .interactive-button:focus-visible,
html body .interactive-controls .rc-challenge:focus-visible,
html body .rc-bar .rc-challenge:focus-visible,
html body .rc-tools .rc-chip.rc-challenge:focus-visible { outline: 2px solid var(--rt-accent); outline-offset: 2px; }
html body .interactive-controls .interactive-button.active,
html body .interactive-controls .interactive-button.faq-toggle.active,
html body .interactive-controls .rc-challenge.rc-active,
html body .rc-bar .rc-challenge.rc-active,
html body .rc-tools .rc-chip.rc-challenge.rc-active { border-color: var(--rt-accent); background: transparent; color: var(--rt-accent); }
html body .interactive-controls .interactive-button.active:hover,
html body .interactive-controls .interactive-button.faq-toggle.active:hover,
html body .interactive-controls .rc-challenge.rc-active:hover,
html body .rc-bar .rc-challenge.rc-active:hover,
html body .rc-tools .rc-chip.rc-challenge.rc-active:hover { border-color: var(--rt-accent); background: var(--rt-tint); color: var(--rt-accent); }
html body .interactive-controls { gap: 8px; }
html body .rc-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0.5em 0 1em; }
@media (max-width: 544px) {
  html body .interactive-controls .interactive-button,
  html body .interactive-controls .rc-challenge,
  html body .rc-bar .rc-challenge { padding: 6px 10px; font-size: 14px; }
}
/* On the page's own background: the theme's text colour, whichever dark mode the site uses. */
html body p.rc-prompt {
  flex: 0 0 100%;
  order: 2;
  margin: 6px 0 0;
  padding: 0;
  color: inherit;
  font: 600 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* The box under the introduction: the reading tools, the AI disclosure, and the introduction's
   Challenge button as the Challenge chip. Same look as the sites' Home section "Reading tools in
   every article": its chips (above), heading and colours, on the page's own background. */
html body .rc-tools {
  container-type: inline-size;
  margin: 0 0 1.5em;
  padding: 20px 12px 16px;
  border: 1px solid var(--rt-border);
  border-radius: 10px;
  background: transparent;
  text-align: center;
}
/* Like the Home section titles: the theme's heading, 30 px, with a short blue bar under it. */
html body .rc-tools p.rc-tools-title {
  margin: 0 0 18px;
  padding: 0;
  color: var(--heading, #3a3a3a);
  font-family: inherit;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -1px;
}
html body .rc-tools p.rc-tools-title::after {
  content: "";
  display: block;
  width: 8%;
  min-width: 40px;
  margin: 10px auto 0;
  border-top: 3px solid var(--accent, #0170b9);
}
html body .rc-tools ul.rc-tools-list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 16px 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
html body .rc-tools ul.rc-tools-list > li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
}
html body .rc-tools .rc-tool-name { display: flex; align-items: center; justify-content: center; gap: 5px; }
html body .rc-tools .rc-badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--rt-badge);
  color: #ffffff;
  font: 700 11px/1.3 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
html body .rc-tools details.rc-info { position: relative; margin: 0; padding: 0; border: 0; }
html body .rc-tools details.rc-info > summary {
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 1.5px solid var(--rt-muted);
  border-radius: 50%;
  color: var(--rt-muted);
  font: italic 700 13px/1 Georgia, "Times New Roman", serif;
  list-style: none;
  cursor: pointer;
  user-select: none;
}
html body .rc-tools details.rc-info > summary::-webkit-details-marker { display: none; }
html body .rc-tools details.rc-info > summary:hover,
html body .rc-tools details.rc-info[open] > summary { border-color: var(--rt-accent); color: var(--rt-accent); }
html body .rc-tools details.rc-info > summary:focus-visible { outline: 2px solid var(--rt-accent); outline-offset: 2px; }
html body .rc-tools .rc-info-pop {
  position: absolute;
  right: -8px;
  bottom: calc(100% + 8px);
  z-index: 20;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 14px;
  border: 1px solid var(--rt-border);
  border-radius: 8px;
  background: var(--rt-card);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
  font-size: 14px;
  line-height: 1.4;
  text-align: left;
  white-space: nowrap;
}
html body .rc-tools .rc-info-pop a { color: var(--rt-accent); font-weight: 600; text-decoration: none; }
html body .rc-tools .rc-info-pop a:hover,
html body .rc-tools .rc-info-pop a:focus-visible { text-decoration: underline; }
html body .rc-tools .rc-tool-text { color: var(--rt-text); font-size: 15px; line-height: 1.45; text-wrap: balance; }
html body .rc-tools p.rc-tools-note { margin: 16px 0 0; padding: 0; color: var(--rt-muted); font-size: 14px; line-height: 1.5; }
html body .rc-tools p.rc-tools-note a { color: var(--rt-accent); }
html body .rc-tools p.rc-prompt { margin: 12px 0 0; text-align: center; }
/* Two tools per row where four do not fit (the Challenge row needs about 170 px, wider fonts a
   few more), smaller chips on phones (about 145 px), one per row on the narrowest. */
@container (max-width: 727px) {
  html body .rc-tools ul.rc-tools-list { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body .rc-tools ul.rc-tools-list > li:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@container (max-width: 400px) {
  html body .rc-tools .rc-tool-name { gap: 4px; }
  html body .rc-tools .rc-chip { padding: 4px 8px; font-size: 14px; }
  html body .rc-tools .rc-badge { padding: 2px 5px; font-size: 10px; letter-spacing: 0.04em; }
  html body .rc-tools details.rc-info > summary { width: 20px; height: 20px; }
}
@container (max-width: 299px) {
  html body .rc-tools ul.rc-tools-list { grid-template-columns: minmax(0, 1fr); }
}
/* A box with one tool only (a comparison page: just Challenge): the chip itself at the centre, above the centred
   line under it. Its "New" badge (a fixed width here) and "i" stay on its right, balanced by an empty space of the
   same width on its left: 72 = 45 + 5 + 22 (the gaps are 5 px), 64 = 40 + 4 + 20 on the narrowest. */
html body .rc-tools ul.rc-tools-list > li:only-child .rc-tool-name::before { content: ""; flex: none; width: 72px; }
html body .rc-tools ul.rc-tools-list > li:only-child .rc-badge { box-sizing: border-box; width: 45px; padding-left: 0; padding-right: 0; text-align: center; }
@container (max-width: 400px) {
  html body .rc-tools ul.rc-tools-list > li:only-child .rc-tool-name::before { width: 64px; }
  html body .rc-tools ul.rc-tools-list > li:only-child .rc-badge { width: 40px; }
}
@media (max-width: 1024px) { html body .rc-tools p.rc-tools-title { font-size: 28px; } }
@media (max-width: 767px) { html body .rc-tools p.rc-tools-title { font-size: 26px; } }
@media (max-width: 544px) {
  html body .rc-tools { padding: 18px 6px 14px; }
  html body .rc-tools .rc-tool-text { font-size: 14px; }
}

/* Picking: the passages a pressed Challenge button covers. Outlines do not move the text. */
html body .rc-pick {
  outline: 2px dashed var(--rc-accent);
  outline-offset: 3px;
  border-radius: 4px;
  background-color: var(--rc-tint);
  box-shadow: 0 0 0 3px var(--rc-tint);
  cursor: pointer;
  transition: background-color 0.15s ease, box-shadow 0.15s ease;
}
html body li.rc-pick { outline-offset: 2px; box-shadow: 0 0 0 2px var(--rc-tint); }
html body .rc-pick:hover,
html body .rc-pick:focus-visible { outline-style: solid; background-color: var(--rc-tint-strong); box-shadow: 0 0 0 3px var(--rc-tint-strong); }
html body li.rc-pick:hover,
html body li.rc-pick:focus-visible { box-shadow: 0 0 0 2px var(--rc-tint-strong); }
html body .rc-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
html body .rc-flash { animation: rc-flash 3.5s ease-out; border-radius: 4px; }
@keyframes rc-flash { 0%, 30% { background-color: rgba(255, 214, 10, 0.45); } 100% { background-color: transparent; } }

/* Dialog */
html.rc-dialog-open { overflow: hidden; }
html body dialog.rc-dialog {
  box-sizing: border-box;
  width: min(560px, calc(100vw - 24px));
  max-width: none;
  max-height: min(92vh, 780px);
  margin: auto;
  padding: 0;
  border: 1px solid var(--rc-border);
  border-radius: 14px;
  background: var(--rc-bg);
  color: var(--rc-fg);
  box-shadow: var(--rc-shadow);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  overflow: auto;
}
html body dialog.rc-dialog::backdrop { background: rgba(15, 23, 42, 0.5); }
html body dialog.rc-dialog.rc-fallback { position: fixed; inset: 0; z-index: 100000; }
html body .rc-dialog * { box-sizing: border-box; }
html body .rc-dialog .rc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px 6px;
}
html body .rc-dialog h2#rc-title { margin: 0; padding: 0; font-size: 20px; line-height: 1.3; font-weight: 650; color: var(--rc-fg); }
html body .rc-dialog .rc-form,
html body .rc-dialog .rc-progress,
html body .rc-dialog .rc-result { padding: 6px 20px 20px; }
html body .rc-dialog [hidden] { display: none !important; }
html body .rc-dialog .rc-quote {
  margin: 8px 0 12px;
  padding: 10px 14px;
  border: 0;
  border-left: 3px solid var(--rc-accent);
  border-radius: 0 8px 8px 0;
  background: var(--rc-soft);
  color: var(--rc-fg);
  font-size: 14px;
  font-style: normal;
  line-height: 1.5;
  max-height: 9.5em;
  overflow: auto;
}
html body .rc-dialog .rc-quote::before, html body .rc-dialog .rc-quote::after { content: none; }
html body .rc-dialog .rc-quote.rc-new { border-left-color: var(--rc-ok); max-height: none; }
html body .rc-dialog p { margin: 0 0 12px; color: var(--rc-fg); font-size: 15px; }
html body .rc-dialog .rc-mode-note { padding: 8px 12px; border-radius: 8px; background: rgba(0, 115, 170, 0.08); font-size: 14px; }
html body .rc-dialog .rc-label { display: block; margin: 10px 0 6px; font-weight: 600; font-size: 15px; color: var(--rc-fg); }
html body .rc-dialog .rc-optional { font-weight: 400; color: var(--rc-muted); }
html body .rc-dialog textarea,
html body .rc-dialog input[type="text"] {
  display: block;
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--rc-border);
  border-radius: 8px;
  background: var(--rc-bg);
  color: var(--rc-fg);
  font: inherit;
  font-size: 15px;
  box-shadow: none;
}
html body .rc-dialog textarea { min-height: 120px; resize: vertical; }
html body .rc-dialog textarea:focus,
html body .rc-dialog input[type="text"]:focus { outline: 2px solid var(--rc-accent); outline-offset: 1px; border-color: var(--rc-accent); }
html body .rc-dialog .rc-count { margin: 4px 0 0; text-align: right; font-size: 12px; color: var(--rc-muted); }
html body .rc-dialog .rc-help, html body .rc-dialog .rc-note { font-size: 13px; color: var(--rc-muted); }
html body .rc-dialog .rc-help { margin: 6px 0 12px; }
html body .rc-dialog .rc-note a { color: var(--rc-accent); }
html body .rc-dialog .rc-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
html body .rc-dialog .rc-turnstile { margin: 8px 0; }
html body .rc-dialog .rc-turnstile:empty { margin: 0; }
html body .rc-dialog .rc-error { padding: 8px 12px; border-radius: 8px; background: rgba(180, 35, 24, 0.1); color: var(--rc-bad); font-size: 14px; }
html body .rc-dialog .rc-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
}
html body .rc-dialog .rc-buttons { display: flex; gap: 8px; margin-left: auto; }
html body .rc-dialog button.rc-cancel,
html body .rc-dialog button.rc-submit,
html body .rc-dialog button.rc-hide,
html body .rc-dialog button.rc-reload,
html body .rc-dialog button.rc-done-close,
html body .rc-dialog button.rc-close {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid var(--rc-border);
  border-radius: 8px;
  background: var(--rc-bg);
  color: var(--rc-fg);
  font: 600 14px/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  cursor: pointer;
}
html body .rc-dialog button.rc-submit,
html body .rc-dialog button.rc-reload { border-color: var(--rc-accent); background: var(--rc-accent); color: var(--rc-on-accent); }
html body .rc-dialog button.rc-submit:hover,
html body .rc-dialog button.rc-reload:hover { background: var(--rc-accent-hover); border-color: var(--rc-accent-hover); }
html body .rc-dialog button.rc-cancel:hover,
html body .rc-dialog button.rc-hide:hover,
html body .rc-dialog button.rc-done-close:hover,
html body .rc-dialog button.rc-close:hover { background: var(--rc-soft); }
html body .rc-dialog button:focus-visible { outline: 2px solid var(--rc-accent); outline-offset: 2px; }
html body .rc-dialog button.rc-submit[disabled],
html body .rc-dialog button.rc-reload[disabled] { opacity: 0.6; cursor: progress; }
html body .rc-dialog button.rc-close { min-height: 36px; width: 36px; padding: 0; border: 0; font-size: 26px; font-weight: 400; color: var(--rc-muted); }

/* Progress and result */
html body .rc-dialog .rc-steps { list-style: none; margin: 8px 0 14px; padding: 0; }
html body .rc-dialog .rc-steps li {
  position: relative;
  margin: 0;
  padding: 6px 0 6px 30px;
  color: var(--rc-muted);
  font-size: 15px;
}
html body .rc-dialog .rc-steps li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border: 2px solid var(--rc-border);
  border-radius: 50%;
}
html body .rc-dialog .rc-steps li.rc-done { color: var(--rc-fg); }
html body .rc-dialog .rc-steps li.rc-done::before { border-color: var(--rc-ok); background: var(--rc-ok); }
html body .rc-dialog .rc-steps li.rc-current { color: var(--rc-fg); font-weight: 600; }
html body .rc-dialog .rc-steps li.rc-current::before { border-color: var(--rc-accent); border-top-color: transparent; animation: rc-spin 0.9s linear infinite; }
html body .rc-dialog .rc-wait { font-variant-numeric: tabular-nums; color: var(--rc-muted); }
html body .rc-dialog h3.rc-verdict { margin: 4px 0 10px; padding: 0; font-size: 18px; line-height: 1.3; }
html body .rc-dialog h3.rc-accepted { color: var(--rc-ok); }
html body .rc-dialog h3.rc-slow { color: var(--rc-warn); }
html body .rc-dialog h3.rc-rejected, html body .rc-dialog h3.rc-closed { color: var(--rc-fg); }
html body .rc-dialog h3.rc-failed { color: var(--rc-bad); }
@keyframes rc-spin { to { transform: rotate(360deg); } }

/* Floating status while the reader keeps reading */
html body button.rc-pill {
  all: unset;
  box-sizing: border-box;
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 99990;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: calc(100vw - 32px);
  padding: 10px 16px;
  border: 1px solid var(--rc-border);
  border-radius: 999px;
  background: var(--rc-bg);
  color: var(--rc-fg);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.2);
  font: 600 14px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
html body button.rc-pill:focus-visible { outline: 2px solid var(--rc-accent); outline-offset: 2px; }
html body button.rc-pill.rc-pill-done.rc-accepted { border-color: var(--rc-ok); color: var(--rc-ok); }
html body button.rc-pill .rc-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid var(--rc-border);
  border-top-color: var(--rc-accent);
  border-radius: 50%;
  animation: rc-spin 0.9s linear infinite;
}

/* End-of-article hint and changelog */
html body p.rc-hint { margin: 2em 0 0; color: inherit; opacity: 0.75; font-size: 0.88em; }
html body details.rc-changelog {
  margin: 2em 0 1em;
  padding: 0.8em 1em;
  border: 1px solid var(--rc-border);
  border-radius: 8px;
  background: var(--rc-soft);
  color: var(--rc-fg);
  font-size: 0.92em;
}
html body details.rc-changelog summary { cursor: pointer; font-weight: 600; }
html body details.rc-changelog .rc-changelog-intro { margin: 0.6em 0; color: var(--rc-muted); }
html body .rc-changelog-list { margin: 0.4em 0 0 1.2em; padding: 0; }
html body .rc-changelog-list li { margin: 0.35em 0; }
html body .rc-changelog-list time { color: var(--rc-muted); margin-right: 0.3em; }
html body .rc-changelog-list time::after { content: " \2014"; }

@media (max-width: 480px) {
  html body dialog.rc-dialog { width: calc(100vw - 16px); max-height: calc(100vh - 16px); border-radius: 12px; }
  html body .rc-dialog .rc-head { padding: 14px 14px 4px; }
  html body .rc-dialog .rc-form, html body .rc-dialog .rc-progress, html body .rc-dialog .rc-result { padding: 4px 14px 14px; }
  html body .rc-dialog .rc-buttons { width: 100%; }
  html body .rc-dialog .rc-buttons button { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  html body .rc-flash, html body .rc-dialog .rc-steps li.rc-current::before, html body button.rc-pill .rc-spinner { animation: none; }
  html body .interactive-controls .interactive-button, html body .interactive-controls .rc-challenge, html body .rc-bar .rc-challenge,
  html body .rc-tools .rc-chip.rc-challenge, html body .rc-pick { transition: none; }
}