/* smooth.css — route crossfades, press feedback, smooth in-container scrolling. */
/* Route changes: old view fades out fast, new view fades in and rises. Fixed chrome is excluded so it doesn't flicker. */
::view-transition-old(root){ animation:vt-out .18s cubic-bezier(.4,0,1,1) both }
::view-transition-new(root){ animation:vt-in .42s cubic-bezier(.2,.8,.2,1) both }
@keyframes vt-out{ to{ opacity:0; transform:translateY(-6px) } }
@keyframes vt-in{ from{ opacity:0; transform:translateY(14px) } }
.nav, .bar, header.top{ view-transition-name:chrome }
#vswitch{ view-transition-name:vswitch }
::view-transition-group(chrome), ::view-transition-group(vswitch){ animation:none }
::view-transition-old(chrome), ::view-transition-old(vswitch){ display:none }
::view-transition-new(chrome), ::view-transition-new(vswitch){ animation:none }   /* live: the chip pill can still slide */

/* Press feedback: everything clickable gives a little under the finger/cursor. */
a, button{ -webkit-tap-highlight-color:transparent }
.gbtn, .kb, .btn, .cta, .pill-bar a, .chips a, .subs a, .more button, .tree a{ transition-property:transform, background, color, border-color, box-shadow, opacity; transition-duration:.22s; transition-timing-function:cubic-bezier(.2,.8,.2,1) }
.gbtn:active, .kb:active, .btn:active, .cta:active, .more button:active, .pill-bar a:active, .chips a:active, .subs a:active{ transform:scale(.965); transition-duration:.08s }
.tree a:active{ transform:translateX(2px) }

/* Scroll containers glide when scrolled programmatically (V2 list and tree). */
.list, aside.tree, .preview{ scroll-behavior:smooth }

@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root), ::view-transition-new(root){ animation:none }
  .list, aside.tree, .preview{ scroll-behavior:auto }
}
