/* Prototype-only: smooth page transitions and the screen menu. Not part of the design. */
@view-transition { navigation: auto; }
html { scroll-behavior: smooth; }
::view-transition-old(root) { animation: 170ms cubic-bezier(.4, 0, 1, 1) both proto-out; }
::view-transition-new(root) { animation: 320ms cubic-bezier(0, 0, .2, 1) both proto-in; }
.sh { view-transition-name: site-header; }
.side { view-transition-name: app-side; }
::view-transition-group(site-header), ::view-transition-group(app-side),
::view-transition-old(site-header), ::view-transition-new(site-header),
::view-transition-old(app-side), ::view-transition-new(app-side) { animation: none; }
@keyframes proto-out { to { opacity: 0; transform: translateY(-6px); } }
@keyframes proto-in { from { opacity: 0; transform: translateY(12px); } }
html.no-vt body { animation: proto-in 320ms cubic-bezier(0, 0, .2, 1) backwards; }
html.no-vt.leaving body { opacity: 0; transform: translateY(-6px); transition: opacity 160ms ease, transform 160ms ease; }
.proto-menu { position: fixed; right: 16px; bottom: 16px; z-index: 50; display: flex; gap: 8px; font: 700 13px/1 Figtree, system-ui, sans-serif; }
.proto-menu a { background: #000000; color: #FFFFFF; padding: 12px 14px; border-radius: 999px; text-decoration: none; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); display: inline-flex; align-items: center; gap: 8px; }
.proto-menu a:hover { background: #3D1746; }
.proto-menu a.back { background: #FFFFFF; color: #3D1746; border: 1px solid #E8E0EB; }
@media (max-width: 900px) { body:has(.mnav) .proto-menu { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); } .proto-menu a { padding: 10px 12px; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
  html.no-vt body { animation: none; }
  html { scroll-behavior: auto; }
}
