/* Recall motion: quick, quiet, transform/opacity only. Everything sits behind prefers-reduced-motion: no-preference,
   so the reduced-motion rule (and users who ask for less motion) get instant state changes and no layout differences. */
 /* page-to-page (app <-> profile <-> studio): each page eases in on load. (Cross-document view transitions
    were tried; Chrome aborts them noisily between these pages, so a plain entry fade keeps the console clean.) */
:root{--rw-ease:cubic-bezier(.2,.8,.2,1);--rw-spring:cubic-bezier(.3,1.25,.4,1);--rw-t1:150ms;--rw-t2:220ms;--rw-t3:300ms}
@media (prefers-reduced-motion:no-preference){
  ::view-transition-old(root){animation:rw-vt-out var(--rw-t1) var(--rw-ease) both}
  ::view-transition-new(root){animation:rw-vt-in var(--rw-t2) var(--rw-ease) both}
  ::view-transition-group(rw-me){animation-duration:var(--rw-t3);animation-timing-function:var(--rw-ease)}
  ::view-transition-old(rw-page){animation:rw-vt-out var(--rw-t1) var(--rw-ease) both}
  ::view-transition-new(rw-page){animation:rw-vt-in var(--rw-t2) var(--rw-ease) both}
  ::view-transition-group(rw-page),::view-transition-group(rw-main){animation-duration:var(--rw-t2);animation-timing-function:var(--rw-ease)}
  ::view-transition-old(rw-side){animation:rw-side-out var(--rw-t2) var(--rw-ease) both}
  ::view-transition-new(rw-side){animation:rw-side-in var(--rw-t2) var(--rw-ease) both}
  html.rw-vt .anim-in{animation:none!important}
  .content{view-transition-name:rw-page}
  @keyframes rw-vt-out{to{opacity:0;transform:translateY(-4px) scale(.995)}}
  @keyframes rw-vt-in{from{opacity:0;transform:translateY(8px)}}
  @keyframes rw-side-out{to{transform:translateX(-100%);opacity:.4}}
  @keyframes rw-side-in{from{transform:translateX(-100%);opacity:.4}}
  @keyframes rw-fade{from{opacity:0}}
  @keyframes rw-rise{from{opacity:0;transform:translateY(10px)}}
  @keyframes rw-pop{from{opacity:0;transform:translateY(8px) scale(.97)}}
  @keyframes rw-sheet{from{transform:translateY(100%)}}
  @keyframes rw-grow{from{transform:scaleX(0)}}

  /* press feedback: a small, fast squeeze */
  button,.btn,.rws-btn,a.b,.b,.navi,label.rwb-chip,label.rwb-choice,.rw-chip{transition:transform var(--rw-t1) var(--rw-ease),background-color var(--rw-t1) var(--rw-ease),color var(--rw-t1) var(--rw-ease),border-color var(--rw-t1) var(--rw-ease),box-shadow var(--rw-t1) var(--rw-ease),opacity var(--rw-t1) var(--rw-ease)}
  button:active:not(:disabled),.btn:active,.rws-btn:active,a.b:active,.b:active,.navi:active,label.rwb-chip:active,label.rwb-choice:active,.rw-chip:active{transform:scale(.97)}

  /* card flip: a touch quicker, ease-out */
  .fc{transition:transform .36s var(--rw-ease)!important}

  /* sheets and dialogs (share, builder, add material, improve, inbox) */
  .rws-ov{animation:rw-fade var(--rw-t2) var(--rw-ease) both}
  .rws-ov>.rws-panel{animation:rw-pop var(--rw-t3) var(--rw-ease) both}
  .rws-ov.rw-swap,.rws-ov.rw-swap>.rws-panel{animation:none}
  .rws-ghost{animation:rw-fade var(--rw-t1) var(--rw-ease) reverse both;pointer-events:none!important}
  .rws-ghost>.rws-panel{animation:rw-pop var(--rw-t1) var(--rw-ease) reverse both}
  @media (max-width:600px){.rws-ov>.rws-panel{animation:rw-sheet var(--rw-t3) var(--rw-ease) both}.rws-ghost>.rws-panel{animation:rw-sheet var(--rw-t2) var(--rw-ease) reverse both}}
  /* builder steps (form -> building -> review -> saved) slide up gently as each step replaces the last */
  .rw-step-in{animation:rw-rise var(--rw-t2) var(--rw-ease) both}

  /* lists: sections, set cards, review items and inbox rows rise in with a short stagger */
  .content>.sec,.setcard,.rwb-item,.rw-row,.rw-msg,.rw-stagger>*{animation:rw-rise var(--rw-t2) var(--rw-ease) both}
  :is(.content>.sec,.setcard,.rwb-item,.rw-row,.rw-stagger>*):nth-child(2){animation-delay:25ms}
  :is(.content>.sec,.setcard,.rwb-item,.rw-row,.rw-stagger>*):nth-child(3){animation-delay:50ms}
  :is(.content>.sec,.setcard,.rwb-item,.rw-row,.rw-stagger>*):nth-child(4){animation-delay:75ms}
  :is(.content>.sec,.setcard,.rwb-item,.rw-row,.rw-stagger>*):nth-child(5){animation-delay:100ms}
  :is(.content>.sec,.setcard,.rwb-item,.rw-row,.rw-stagger>*):nth-child(n+6){animation-delay:120ms}

  /* progress bars grow from the left when they appear (transform only) */
  .bar>i,.rwb-bar-used,.rw-bar>i{transform-origin:left center;animation:rw-grow .5s var(--rw-ease) both}
  .qcard{animation:rw-rise var(--rw-t2) var(--rw-ease) both}
  .tabs button[aria-selected=true]{transition:border-color var(--rw-t2) var(--rw-ease),color var(--rw-t2) var(--rw-ease)}
  .pane:not([hidden]){animation:rw-rise var(--rw-t2) var(--rw-ease) both}
  #saved.on{transition:opacity var(--rw-t1) var(--rw-ease),transform var(--rw-t1) var(--rw-ease)}
}

@media (prefers-reduced-motion:no-preference){body>#root,body>.rwp-page,body>.studio,body>main{animation:rw-page-in var(--rw-t2) var(--rw-ease) backwards}}
@keyframes rw-page-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
