/* Page navigation stays native: history, anchors and modified clicks keep working. */
html { background-color:var(--rw-page-bg); }
/* The four legacy covers are 4:3; reserve their space before image decoding. */
.project-cover { aspect-ratio:auto 4 / 3; }

/* One short transition. Never fade the old page away before its replacement is visible. */
@keyframes rw-fade-in { from { opacity:0; } to { opacity:1; } }
@keyframes rw-content-arrive { from { opacity:.96;transform:translateY(4px); } to { opacity:1;transform:none; } }
@keyframes rw-list-enter { from { opacity:0;transform:translateX(-4px); } to { opacity:1;transform:none; } }
@keyframes rw-list-leave { to { opacity:0;transform:translateX(-4px); } }

@media(prefers-reduced-motion:no-preference) {
  @view-transition { navigation:auto; }
  ::view-transition-group(*) { animation-duration:180ms;animation-timing-function:ease-out; }
  ::view-transition-image-pair(root) { isolation:isolate; }
  ::view-transition-old(root) { animation:none;opacity:1;mix-blend-mode:normal; }
  ::view-transition-new(root) { animation:rw-fade-in 180ms ease-out both;mix-blend-mode:normal; }
  .navigation-main { view-transition-name:main-navigation; }
  .rw-theme-toggle { view-transition-name:theme-control; }
  ::view-transition-old(main-navigation),::view-transition-old(theme-control) { display:none; }
  ::view-transition-new(main-navigation),::view-transition-new(theme-control) { animation:none; }
  /* CSS starts on the first frame, with content already readable. No delayed JS reveals. */
  [data-page-motion="entry"] :is(.shell15_content,.section_shell12-layout) { animation:rw-content-arrive 180ms ease-out backwards; }
}
@media(min-width:992px) and (prefers-reduced-motion:no-preference) {
  .project-navigation { view-transition-name:work-navigation; }
  ::view-transition-new(work-navigation):only-child { animation:rw-list-enter 180ms ease-out both; }
  ::view-transition-old(work-navigation):only-child { animation:rw-list-leave 180ms ease-out both; }
}

@media(max-width:991px) {
  /* Keep the panel mounted so closing can animate and quick reversals stay smooth. */
  .case-study .review-work-navigation {
    display:block;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);
    transition:opacity var(--rw-theme-duration) ease-out,transform var(--rw-theme-duration) ease-out,visibility 0s linear var(--rw-theme-duration);
  }
  .case-study .review-work-navigation[data-open] {
    opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s;
  }
  .work-toolbar .review-work-toggle { min-width:100px; }
}
@media(prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  .case-study .review-work-navigation { transition:none;transform:none; }
  .project-navigation.w-nav .sidebar4_menu { transition:none!important;transform:none!important; }
}