/* Quran Vocabulary v0.8.3 — subtle mobile motion polish */
:root {
  --qv-motion-fast: 140ms;
  --qv-motion-normal: 220ms;
  --qv-motion-ease: cubic-bezier(.2,.7,.2,1);
}

/* Gentle screen arrival. No exit delay, so navigation stays responsive. */
html.qv-motion body {
  animation: qv-page-in var(--qv-motion-normal) var(--qv-motion-ease) both;
}

@keyframes qv-page-in {
  from { opacity: .72; transform: translateY(7px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Tactile feedback for common controls. */
html.qv-motion button,
html.qv-motion [role="button"],
html.qv-motion input[type="submit"],
html.qv-motion input[type="button"],
html.qv-motion .btn {
  transition: transform var(--qv-motion-fast) var(--qv-motion-ease),
              filter var(--qv-motion-fast) var(--qv-motion-ease),
              box-shadow var(--qv-motion-fast) var(--qv-motion-ease);
  will-change: transform;
}

html.qv-motion button:active,
html.qv-motion [role="button"]:active,
html.qv-motion input[type="submit"]:active,
html.qv-motion input[type="button"]:active,
html.qv-motion .btn:active {
  transform: scale(.975);
}

/* Animate native disclosure/feedback areas if existing pages use these classes. */
html.qv-motion .alert,
html.qv-motion .message,
html.qv-motion .feedback,
html.qv-motion .hint,
html.qv-motion [data-qv-reveal] {
  animation: qv-reveal var(--qv-motion-normal) var(--qv-motion-ease) both;
}

@keyframes qv-reveal {
  from { opacity: 0; transform: translateY(5px) scale(.99); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Modern Chrome/TWA page transitions where supported. */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation-duration: 120ms; }
::view-transition-new(root) { animation-duration: 180ms; }

/* Accessibility: honour the user's reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
  html.qv-motion body,
  html.qv-motion .alert,
  html.qv-motion .message,
  html.qv-motion .feedback,
  html.qv-motion .hint,
  html.qv-motion [data-qv-reveal] {
    animation: none !important;
  }
  html.qv-motion button,
  html.qv-motion [role="button"],
  html.qv-motion input[type="submit"],
  html.qv-motion input[type="button"],
  html.qv-motion .btn {
    transition: none !important;
  }
  @view-transition { navigation: none; }
}


/* qv-mobile-safe-area-v0.8.5
   Keep Privacy Policy / Delete Account clear of the fixed student bottom nav.
   The extra space is mobile-only and includes Android safe-area inset. */
@media (max-width: 900px) {
  .qv-legal-footer {
    box-sizing: border-box;
    padding-top: 14px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
    min-height: calc(138px + env(safe-area-inset-bottom, 0px));
  }

  .qv-legal-footer a {
    display: inline-block;
    padding: 8px 5px;
    line-height: 1.25;
  }
}


/* qv-bottom-nav-tap-fix-v0.8.5a */
@media (max-width: 900px) {
  .qv-legal-footer {
    pointer-events: none;
  }

  .qv-legal-footer a {
    pointer-events: auto;
  }
}\n\n
/* qv-verb-details-readable-v0.8.7 */
.verb-card .verb-grid {
  gap: 12px;
}
.verb-card .verb-grid > div {
  padding: 12px 10px;
}
.verb-card .verb-grid span {
  display: block;
  margin-bottom: 4px;
  font-size: 0.88rem;
  line-height: 1.25;
}
.verb-card .verb-grid b {
  display: block;
  font-size: clamp(1.75rem, 6.5vw, 2.2rem);
  line-height: 1.45;
  font-weight: 700;
  overflow-wrap: anywhere;
}
@media (min-width: 700px) {
  .verb-card .verb-grid b {
    font-size: 2rem;
  }
}
\n