/* Product walkthrough: real DOM animation with explicit demonstration labels. */
.process-film{max-width:1120px;margin:55px auto 0;padding:32px;background:var(--surface,#fff);color:var(--text,#171c38);border-radius:24px;box-shadow:0 22px 80px #473fa51c}.film-heading{display:flex;justify-content:space-between;align-items:start;gap:20px}.film-heading h3{font-size:25px;letter-spacing:-.6px}.film-demo-label{font-size:10px;color:var(--muted);padding:7px 12px;border:1px solid var(--line);border-radius:20px;white-space:nowrap}.film-screen{min-height:300px;margin:25px 0 18px;position:relative;background:radial-gradient(ellipse at 90% 10%,#8960ff20,transparent 65%),var(--bg);border-radius:18px;overflow:hidden}.film-scene{padding:30px 40px;position:relative;min-height:300px;animation:film-enter .45s ease both}.film-scene[hidden]{display:none}.film-step-number{position:absolute;right:28px;top:12px;color:var(--primary);opacity:.12;font-size:82px;font-weight:800}.film-scene h4{font-size:21px;position:relative;margin-bottom:25px}.film-client{display:flex;align-items:center;gap:15px;background:var(--surface);padding:18px;border-radius:12px;max-width:540px;animation:film-enter .55s .1s both}.film-client small{display:block;margin-top:5px;color:var(--muted);font-size:11px}.film-client>b{color:var(--primary);margin-left:auto}.film-typing{margin-top:20px;overflow:hidden;white-space:nowrap;width:25ch;max-width:100%;animation:film-type 1.6s steps(25) both;color:var(--muted);font-size:13px}.film-line,.film-total{display:flex;justify-content:space-between;gap:18px;max-width:600px;padding:14px 0;font-size:14px;animation:film-enter .5s both}.film-line:nth-of-type(2){animation-delay:.2s}.film-total{font-size:22px;color:var(--primary);animation-delay:.45s}.film-cursor{position:absolute;right:20%;bottom:45px;font-size:38px;color:var(--primary);animation:film-cursor 1.8s ease both}.film-document{background:var(--surface);width:120px;padding:14px;border-radius:9px;box-shadow:0 12px 40px #5741bd25;animation:film-paper 1s ease both}.film-document i{display:block;height:4px;background:#9379ff55;margin:9px 0;transform-origin:left;animation:film-type 1s ease both}.film-document b{font-size:14px}.film-scene>p{font-size:12px;color:var(--muted);margin-top:14px}.film-finished{display:flex;align-items:center;gap:20px;padding:22px;background:var(--surface);border-radius:15px;max-width:450px;animation:film-paper .6s ease both}.film-finished>span{border-radius:50%;background:#9273ff25;color:var(--primary);padding:14px;font-size:24px}.film-finished>b{margin-left:auto;color:var(--primary)}.film-navigation{display:flex;gap:7px;flex-wrap:wrap}.film-navigation button{border:0;background:var(--bg);color:var(--muted);padding:10px 14px;border-radius:9px;font-size:12px;flex:1;min-width:90px}.film-navigation button[aria-pressed=true]{background:var(--primary);color:#fff}.film-controls{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:20px}.film-controls>span{font-size:10px;color:var(--muted);margin-left:auto}.film-paused .film-scene,.film-paused .film-scene *{animation:none}.page-motion{width:70px;height:38px;display:block;margin:0 0 8px;color:var(--primary)}.auth-story .page-motion{color:#bba6ff;width:100px;height:55px;margin-bottom:20px}.error-page .page-motion{margin:0 auto 18px}.page-motion path{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;animation:motion-draw 2.4s ease both}.page-motion path:nth-child(2){animation-delay:.12s}.page-motion path:nth-child(3){animation-delay:.24s}.page-motion path:nth-child(4){animation-delay:.36s}@keyframes motion-draw{from{stroke-dashoffset:1;opacity:.2}to{stroke-dashoffset:0;opacity:1}}@keyframes film-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes film-type{from{width:0}to{width:25ch}}@keyframes film-cursor{from{transform:translate(70px,40px)}60%{transform:translate(0,0) scale(.8)}to{transform:translate(0,0)}}@keyframes film-paper{from{opacity:0;transform:translateY(25px) rotate(-7deg) scale(.9)}to{opacity:1;transform:none}}@media(max-width:900px){.process-film{padding:24px}.film-scene{padding:24px}.film-heading h3{font-size:21px}}@media(max-width:650px){.film-heading{flex-direction:column;gap:10px}.film-controls>span{margin-left:0}.film-client{font-size:12px}.film-finished{gap:10px}.film-screen,.film-scene{min-height:310px}}@media(prefers-reduced-motion:reduce){.page-motion path,.film-scene,.film-scene *{animation:none!important;transition:none!important}}

/* Pending requests retain their accessible button labels. */
button.is-loading::after{content:"";display:inline-block;width:1em;height:1em;margin-inline-start:.6em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:middle;animation:request-spin .8s linear infinite}
@keyframes request-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){button.is-loading::after{animation:none}}
