/* Short feedback for real controls. Content never waits for an animation. */
:root { --motion-fast: 160ms; --motion-normal: 220ms; --motion-ease: cubic-bezier(.2,.7,.2,1); }
.button, .card-bottom .text-link, .menu-toggle, .dialog-close, .document-control {
  transition: background var(--motion-fast), border-color var(--motion-fast), box-shadow var(--motion-normal), transform var(--motion-fast) var(--motion-ease);
}
.choice {
  transition: background var(--motion-fast), border-color var(--motion-fast), box-shadow var(--motion-normal);
}
.choice-icon, .duration-picker span, summary, details {
  transition: color var(--motion-fast), background var(--motion-fast), border-color var(--motion-fast), transform var(--motion-fast) var(--motion-ease);
}
.related-pages a, .document-card {
  transition: background var(--motion-fast), border-color var(--motion-fast), box-shadow var(--motion-normal), transform var(--motion-normal) var(--motion-ease);
}
.button:active, .card-bottom .text-link:active, .menu-toggle:active, .dialog-close:active, .document-control:active {
  transform: scale(.98); box-shadow: none;
}
.choice:active { background: #eee5f6; border-color: #b79aca; }
.choice-inperson:active { background: #f8e7da; border-color: #d9b69c; }
.choice:active .choice-icon { transform: scale(.94); }
.duration-picker label:active span { transform: scale(.97); }

@media (hover:hover) and (pointer:fine) {
  .choice:hover, .choice:focus-visible { box-shadow: 0 5px 18px #73549b10; }
  .choice:hover .choice-icon { background: #e3d7ef; }
  .choice-inperson:hover .choice-icon { background: #f1d9c7; }
  .related-pages a:hover, .document-card:hover { transform: translateY(-2px); box-shadow: 0 10px 26px #4230520d; }
  .menu-toggle:hover, .dialog-close:hover, .document-control:hover { background: var(--lavender-strong); }
  summary:hover { color: var(--primary); }
}
/* Touch feedback belongs to the press, never a sticky hover transform. */
@media (hover:none) {
  .button:hover { transform: none; box-shadow: none; }
  .button:active { transform: scale(.98); }
}

@keyframes content-enter { from { opacity: .25; } to { opacity: 1; } }
@keyframes surface-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes backdrop-enter { from { opacity: 0; } to { opacity: 1; } }

/* New quiz children restart the entrance without moving the focused heading. */
.chooser.is-changing > :not(#chooser-title) { animation: content-enter var(--motion-normal) var(--motion-ease); }
dialog[open] { animation: surface-enter var(--motion-normal) var(--motion-ease); }
dialog[open]::backdrop { animation: backdrop-enter var(--motion-fast) ease-out; }
details[open] > :not(summary) { animation: content-enter var(--motion-normal) var(--motion-ease); }
@media (max-width:1100px) {
  .navigation.open { animation: surface-enter var(--motion-normal) var(--motion-ease); transform-origin: top right; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .button, .card-bottom .text-link, .menu-toggle, .dialog-close, .document-control,
  .choice-icon, .duration-picker span, .related-pages a, .document-card { transform: none !important; }
}
@media print {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
