/* 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; }
}
/* Tactile depth: only interactive surfaces respond, without moving surrounding text. */
.button { box-shadow: 0 3px 0 #4c326718, 0 6px 16px #73549b12; }
.button:active { transform: translateY(1px) scale(.98); box-shadow: inset 0 2px 4px #342d4224; transition-duration: 75ms; }
.home-editorial > a, .journal-card, .journal-resources a, .about-links a,
.nav-group > summary, .nav-panel a, .journal-filters button, .choice {
  transition: background 160ms, color 160ms, border-color 160ms, box-shadow 220ms, transform 160ms var(--motion-ease);
}
.home-editorial > a:active, .journal-card:active, .related-pages a:active,
.document-card:active, .choice:active { transform: scale(.992); box-shadow: inset 0 2px 6px #42305212; transition-duration: 75ms; }
.nav-group > summary:active, .nav-panel a:active, .journal-filters button:active {
  transform: scale(.97); background: var(--lavender-strong); transition-duration: 75ms;
}
.about-links a:active, .text-link:active { color: var(--primary-hover); opacity: .75; }
.duration-picker input:checked + span { box-shadow: inset 0 0 0 1px #73549b25, 0 2px 7px #73549b0c; }
.nav-indicator-vertical { transform-box: fill-box; transform-origin: center; transition: transform 180ms var(--motion-ease), opacity 140ms; }
.nav-group[open] .nav-indicator-vertical { display: initial; transform: scaleY(0); opacity: 0; }
@media (hover:hover) and (pointer:fine) {
  .home-editorial > a:hover, .journal-card:hover { box-shadow: 0 8px 24px #42305213; }
  .about-links a:hover svg { color: var(--primary-hover); stroke: currentColor; }
}
@keyframes menu-settle { from { opacity: 0; transform: translateY(-4px) scale(.985); } to { opacity: 1; transform: none; } }
.nav-group[open] > .nav-panel { animation: menu-settle 180ms var(--motion-ease); transform-origin: top center; }
@media (max-width:1100px) {
  .navigation.open { animation: menu-settle 180ms var(--motion-ease); }
  .nav-group[open] > .nav-panel { animation: surface-enter 160ms ease-out; }
}

/* Native cross-document fades preserve normal links, history and browser loading.
   No click interception, timers, layout morphing or horizontal movement. */
@view-transition { navigation: auto; }
:root { view-transition-name: none; }
#main { view-transition-name: page-content; }
::view-transition { pointer-events: none; }
::view-transition-group(page-content) { animation: none; }
::view-transition-old(page-content) { animation: page-out 140ms ease-out both; mix-blend-mode: normal; }
::view-transition-new(page-content) { animation: page-in 200ms ease-out both; mix-blend-mode: normal; }
@keyframes page-out { to { opacity: 0; } }
@keyframes page-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation: none; }
  html { scroll-behavior: auto; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
  *, *::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; }
  .home-editorial > a, .journal-card, .choice, .nav-group > summary, .nav-panel a, .journal-filters button { transform: none !important; }
}
@media print {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
