/* Original vanilla implementations inspired by React Bits' Glare Hover,
   Fade Content, tuned for the paper illustration palette. */
.continue-card,.save-card,.task-card,.welcome-cta{position:relative}
@media(prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine){
 .continue-card:before,.save-card:before,.task-card:before,.welcome-cta:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(251,247,238,.04) 43%,rgba(223,236,243,.24) 49%,rgba(251,247,238,.04) 55%,transparent 63%);background-size:250% 100%;background-position:160% 0;opacity:0;transition:background-position .85s cubic-bezier(.2,.65,.3,1),opacity .2s ease}
 .continue-card:hover:before,.save-card:hover:before,.task-card:hover:before,.welcome-cta:hover:before{background-position:-60% 0;opacity:1}
 .save-card:before,.task-card:before{background-image:linear-gradient(115deg,transparent 35%,rgba(169,189,205,.06) 43%,rgba(169,189,205,.2) 49%,rgba(169,189,205,.06) 55%,transparent 63%)}
 .primary:not(:disabled):active,.secondary:not(:disabled):active{transform:translateY(1px) scale(.985)}
}