/* Studio Quest V4.5 · Motion & Flow
   Restrained interaction layer on top of the approved V4.4.1 palette.
   No forced scroll snapping; no network, fonts, or third-party dependencies. */
html{scroll-behavior:smooth;scroll-padding-top:clamp(70px,8vh,94px)}
html:focus-within{scroll-behavior:smooth}
#experience,#inside,#about,#feedback,#field-notes,#between-lessons,
#weekly-mission,#about-creator,#teacher-questions,#mission-builder{
  scroll-margin-top:clamp(76px,9vh,100px)
}
.sq-motion-progress{
  position:fixed;z-index:160;inset:0 0 auto;height:3px;
  pointer-events:none;background:transparent;overflow:hidden
}
.sq-motion-progress-fill{
  display:block;width:100%;height:100%;transform:scaleX(0);
  transform-origin:left center;will-change:transform;
  background:linear-gradient(90deg,#709984 0%,#a7b695 47%,#b35b42 100%);
  border-radius:0 3px 3px 0
}
.sq-motion-cta{
  position:fixed;right:16px;top:54%;z-index:105;display:flex;
  max-width:175px;align-items:center;gap:9px;justify-content:center;
  box-sizing:border-box;padding:12px 13px 12px 16px;border:1px solid #5d7a69;
  border-radius:8px;background:linear-gradient(135deg,#2b4b40,#233b36);
  color:#fffaf2;box-shadow:0 7px 22px #1a322922;
  font-size:12px;font-weight:760;line-height:1.3;text-decoration:none;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateX(calc(100% + 20px));
  transition:transform 340ms cubic-bezier(.22,.9,.24,1),
    opacity 240ms ease,visibility 340ms;
}
.sq-motion-cta svg{flex:none;transition:transform 200ms ease}
.sq-motion-cta:hover{color:#fffaf2;background:#335848}
.sq-motion-cta:hover svg{transform:translateX(3px)}
.sq-motion-cta-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0)}
.sq-motion-cta:focus-visible{outline:3px solid #d6af78;outline-offset:3px}
@media(prefers-reduced-motion:no-preference){
  html.sq-motion-ready .sq-reveal:not(.sq-reveal-visible){
    opacity:0;transform:translate3d(0,14px,0)
  }
  html.sq-motion-ready .sq-reveal{
    transition:opacity 460ms ease,transform 520ms cubic-bezier(.19,.77,.26,1);
    transition-delay:var(--sq-reveal-delay,0ms)
  }
  html.sq-motion-ready .sq-reveal.sq-reveal-visible{
    opacity:1;transform:translate3d(0,0,0)
  }
}
@media(max-width:850px){
  .sq-motion-cta{
    top:auto;bottom:max(17px,env(safe-area-inset-bottom) + 13px);
    right:15px;max-width:min(48vw,180px);padding:12px 12px 12px 14px;
    font-size:11px;box-shadow:0 5px 18px #172f2830
  }
  .sq-motion-cta-label{overflow-wrap:normal}
}
@media(max-width:400px){
  .sq-motion-cta{max-width:155px;bottom:max(13px,env(safe-area-inset-bottom) + 10px)}
}
@media(prefers-reduced-motion:reduce){
  html,html:focus-within{scroll-behavior:auto!important}
  .sq-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .sq-motion-cta,.sq-motion-cta svg{transition:none!important;transform:none!important}
  .sq-motion-cta:not(.sq-motion-cta-visible){display:none}
  .sq-motion-progress-fill{will-change:auto}
}
