/* Shared enhancement; no dependency on the application shell or admin theme. */
.back-to-top {
  position: fixed;
  inset-inline-end: max(1rem, env(safe-area-inset-right, 0px));
  inset-block-end: max(var(--back-to-top-bottom, 1.25rem), env(safe-area-inset-bottom, 0px));
  z-index: 95;
  display: grid;
  place-items: center;
  inline-size: 88px;
  block-size: 60px;
  padding: 0;
  border: 0;
  border-radius: .75rem;
  background: transparent;
  color: var(--brand-lime, #C9F064);
  cursor: pointer;
  filter: drop-shadow(0 5px 8px rgb(0 0 0 / .28));
  transition: transform .16s ease;
  -webkit-tap-highlight-color: transparent;
}
.back-to-top[hidden] { display: none; }
.back-to-top svg { display: block; pointer-events: none; }
.back-to-top-weight { fill: currentColor; stroke: #172224; stroke-width: 1.5; }
.back-to-top-arrow { stroke: #172224; }
.back-to-top:focus-visible { outline: 3px solid var(--focus, var(--body-fg, #172224)); outline-offset: 4px; }
html[data-back-to-top-ready] main { padding-block-end: 5rem; }
@media (hover: hover) { .back-to-top:hover { transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .back-to-top { transition: none; } }
@media (forced-colors: active) {
  .back-to-top { color: ButtonFace; filter: none; border: 2px solid ButtonText; }
  .back-to-top-weight { stroke: ButtonText; }
  .back-to-top-arrow { stroke: ButtonText; }
  .back-to-top:focus-visible { outline-color: Highlight; }
}
.back-to-top.back-to-top--arrow {
  inline-size: 48px;
  block-size: 48px;
  border: 1px solid var(--line, #344240);
  border-radius: 50%;
  background: var(--surface, #172224);
  color: var(--accent, #c9f064);
}
.back-to-top--arrow svg { inline-size: 44px; block-size: 44px; }
.back-to-top--arrow .back-to-top-arrow {
  stroke: currentColor;
  transform-origin: 44px 23px;
  transform: translateY(7px) scale(2.5);
}
.back-to-top--arrow:focus-visible { outline-color: var(--accent, #c9f064); }
html[data-motion=static] .back-to-top--arrow { transition: none; transform: none; }
@media (prefers-reduced-motion: reduce) { .back-to-top--arrow:hover { transform: none; } }
@media (forced-colors: active) {
  .back-to-top.back-to-top--arrow { background: ButtonFace; color: ButtonText; border-color: ButtonText; }
  .back-to-top--arrow .back-to-top-arrow { stroke: ButtonText; }
  .back-to-top--arrow:focus-visible { outline-color: Highlight; }
}
/* Narrow screens: the floating dumbbell covered lesson text and quiz answers.
   Desktop stays exactly as before; on mobile the control becomes a compact
   in-flow secondary button at the end of the page with a >=44px target.
   The JS show/hide logic is unchanged: on short pages the control never
   appears, and on long pages it sits after all content, so toggling it
   cannot shift reading layout. */
@media (max-width: 48rem) {
  .back-to-top:not(.back-to-top--arrow) {
    position: static;
    display: flex;
    inline-size: fit-content;
    margin: -4rem auto 1rem;
    min-inline-size: 44px;
    min-block-size: 44px;
    padding: .55rem 1.05rem;
    border: 1.5px solid var(--line);
    border-radius: .65rem;
    background: var(--read);
    color: var(--text);
    filter: none;
    transition: border-color .15s, background-color .15s, color .15s;
  }
  .back-to-top:not(.back-to-top--arrow) svg { display: none; }
  /* Keep the JS visibility contract: hidden means hidden, also in flow. */
  .back-to-top:not(.back-to-top--arrow)[hidden] { display: none; }
  .back-to-top:not(.back-to-top--arrow)::after {
    content: "Наверх";
    font: inherit;
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.35;
  }
  .back-to-top:not(.back-to-top--arrow):hover { border-color: var(--hover-outline); }
}
@media (prefers-reduced-motion: reduce) {
  .back-to-top:not(.back-to-top--arrow),
  .back-to-top:not(.back-to-top--arrow):hover { transition: none; transform: none; }
}
@media print { .back-to-top { display: none !important; } }
