/* v7-interact.css — interaction motion (research-E moves 2, 3, 5, 7). Pairs with v7-interact.js.
   Every effect sits on top of a finished, legible state. Motion is gated by prefers-reduced-motion,
   body.is-motion-paused and body[data-experience=standard]; the gate prefix is written out in full. */

/* =====================================================================
   5. Press feedback on every tap target (phones first)
   Instant press, no layout change: `scale` is its own property, so it stacks on any existing
   transform. The brighten is a state cue, not motion, so it stays when motion is off.
   ===================================================================== */
:is(.button,.lab-stage,.ds__tab,.cks-paths__terminal,.live-faq__item>summary,.toy__btn,.lesson-toy__btn,
  .engine-power,.bench-power,.motion-toggle,.cks-ticker__toggle,.mobile-nav__toggle,.mobile-nav__panel a,.nav-dropdown>summary){
  touch-action:manipulation;-webkit-tap-highlight-color:transparent
}
:is(.button,.lab-stage,.ds__tab,.cks-paths__terminal,.live-faq__item>summary,.toy__btn,.lesson-toy__btn,
  .engine-power,.bench-power,.motion-toggle,.cks-ticker__toggle,.mobile-nav__toggle,.mobile-nav__panel a,.nav-dropdown>summary):active{
  filter:brightness(1.18)
}
@media (prefers-reduced-motion:no-preference){
  body:not(.is-motion-paused):not([data-experience=standard]) :is(.lab-stage,.ds__tab,.cks-paths__terminal,.live-faq__item>summary,.toy__btn,.lesson-toy__btn,
    .engine-power,.bench-power,.motion-toggle,.cks-ticker__toggle,.mobile-nav__toggle,.nav-dropdown>summary):active{scale:.97}
  /* .button already presses to .97 (v5.css); the rocker inside the engine/bench switch throws a little further */
  body:not(.is-motion-paused):not([data-experience=standard]) :is(.engine-power,.bench-power):active .rocker{scale:.94}
}

/* =====================================================================
   3. Hero engine: coast down / spin up
   v7-interact.js ramps playbackRate; while coasting the hero carries .ix-coast, which keeps the
   animations running past the paused state (power off or site-wide pause) until the ramp ends.
   ===================================================================== */
@media (prefers-reduced-motion:no-preference){
  body .kinetic-hero.ix-coast[data-hero] :is(.orbit-rotor,.orbit-gear,.orbit-current,.orbit-light,.orbit-lab-only,.hero-instrument__wave path),
  body .signal-lab.ix-coast[data-story] :is(.bench-trace,.bench-rotor,.scope-wave){animation-play-state:running!important}
  /* the light and the current dim with the motor instead of snapping */
  body:not(.is-motion-paused):not([data-experience=standard]) .kinetic-hero[data-hero] .signal-orbit .orbit-current{transition:opacity .3s ease-out}
  body:not(.is-motion-paused):not([data-experience=standard]) .kinetic-hero[data-hero=""][data-powered=false] .signal-orbit .orbit-current{transition:opacity .8s cubic-bezier(.3,0,.2,1)}
  body:not(.is-motion-paused):not([data-experience=standard]) .kinetic-hero[data-hero] .signal-orbit .orbit-light{transition:fill .3s ease-out}
  body:not(.is-motion-paused):not([data-experience=standard]) .kinetic-hero[data-hero=""][data-powered=false] .signal-orbit .orbit-light{transition:fill .8s cubic-bezier(.3,0,.2,1)}
}

/* =====================================================================
   2. Lesson toys: switch snaps shut -> a current front runs from + to the lamp -> lamp lights.
   Opening is instant (current stops everywhere at once). The fronts are aria-hidden paths that
   v7-interact.js clones from the existing flow paths (pathLength=1). Off by default.
   ===================================================================== */
.lesson-toy .ix-front,.toy .ix-front{fill:none;stroke:#FFB46B;filter:drop-shadow(0 0 5px #FF7A00);stroke-linecap:round;stroke-linejoin:round;opacity:0;pointer-events:none}
.lesson-toy .ix-front{stroke-width:5;stroke-dasharray:.1 3;stroke-dashoffset:.1}
.toy .ix-front{stroke:#FF7A00;stroke-width:10;stroke-dasharray:.07 3;stroke-dashoffset:.07}

@media (prefers-reduced-motion:no-preference){
  /* lever snaps shut in ~110ms with a small overshoot; opening keeps the existing ease */
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy :is([data-s1=closed] .lt-switch,[data-a=closed] .st-sw-a,[data-b=closed] .st-sw-b) .lt-lever{
    transition:transform .11s cubic-bezier(.3,1.5,.55,1)
  }
  /* the front: series / loop run the whole supply leg; parallel chains in -> branch -> out */
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-lamp=on] :is(.ix-front--series,.ix-front--loop){animation:ix-front .15s cubic-bezier(.45,0,.6,1) .1s backwards}
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-lamp=on] .ix-front--in{animation:ix-front .05s linear .1s backwards}
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-wiring=parallel][data-a=closed] .ix-front--a,
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-wiring=parallel][data-b=closed] .ix-front--b{animation:ix-front .06s linear .15s backwards}
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-lamp=on] .ix-front--out{animation:ix-front .05s cubic-bezier(.2,0,.4,1) .21s backwards}
  /* only then does the lamp light and the steady current fade in (~250ms after the press) */
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-lamp=on] :is(.lt-glow,.lt-bulb,.lt-x,.lesson-toy__ind),
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-lamp=on] :is(.lt-flow--series,.lt-flow--in,.lt-flow--out,.lt-flow--out-ret),
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-lesson-toy=loop][data-lamp=on] .lt-flow,
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-wiring=parallel][data-a=closed] .lt-flow--a,
  body:not(.is-motion-paused):not([data-experience=standard]) .lesson-toy [data-wiring=parallel][data-b=closed] .lt-flow--b{transition-delay:.25s}

  /* home paper-circuit toy (v4-toy): the paper tab flips shut faster, a front runs the copper loop, then the LED lights */
  body:not(.is-motion-paused):not([data-experience=standard]) .toy :is([data-s1=closed] .toy-switch--1,[data-s2=closed] .toy-switch--2) .toy-tab{transition-duration:.14s}
  body:not(.is-motion-paused):not([data-experience=standard]) .toy :is([data-s1=closed] .toy-switch--1,[data-s2=closed] .toy-switch--2) :is(.toy-tab-under,.toy-tab-face){transition-delay:.07s}
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=parallel][data-s1=closed] .ix-front--a,
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=parallel][data-s2=closed] .ix-front--b,
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=series][data-cells="2"][data-s1=closed][data-s2=closed] .ix-front--s{
    animation:ix-front .26s cubic-bezier(.45,0,.6,1) .08s backwards
  }
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=parallel][data-s1=closed] :is(.toy-led--1 :is(.toy-glow,.toy-dome--on,.toy-halo,.toy-flange,.toy-spec),.toy-pulse--a,.toy__ind--1),
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=parallel][data-s1=closed] .toy__ind--1::before,
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=parallel][data-s2=closed] :is(.toy-led--2 :is(.toy-glow,.toy-dome--on,.toy-halo,.toy-flange,.toy-spec),.toy-pulse--b,.toy__ind--2),
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=parallel][data-s2=closed] .toy__ind--2::before,
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=series][data-cells="2"][data-s1=closed][data-s2=closed] :is(.toy-led :is(.toy-glow,.toy-dome--on,.toy-halo,.toy-flange,.toy-spec),.toy-pulse--s,.toy__ind),
  body:not(.is-motion-paused):not([data-experience=standard]) .toy [data-mode=series][data-cells="2"][data-s1=closed][data-s2=closed] .toy__ind::before{
    transition-delay:.3s
  }
  /* the readout pills had no transition; give them one so the delay above has something to hold */
  body:not(.is-motion-paused):not([data-experience=standard]) .toy .toy__ind{transition:color .15s,border-color .15s}
  body:not(.is-motion-paused):not([data-experience=standard]) .toy .toy__ind::before{transition:background-color .15s,box-shadow .15s}
}
@keyframes ix-front{from{opacity:1}to{opacity:1;stroke-dashoffset:-1.02}}

/* =====================================================================
   7. Contact form: the submit button shows the request state
   pending: LED blinks ~2Hz and the outline wire loops · sent: LED solid, outline closed
   error: two fault blinks and a short shake. The text in .ix-form-live is the real message.
   ===================================================================== */
form[data-static-form] [type=submit]{position:relative}
form[data-static-form] .ix-led{position:absolute;left:9px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:currentColor;opacity:0;pointer-events:none}
form[data-ix-state] .ix-led{opacity:.35}
form[data-ix-state=sent] .ix-led{opacity:1;background:#fff3e2;box-shadow:0 0 0 1px #0b0d11b3,0 0 7px 2px #fff1dc}
form[data-ix-state=error] .ix-led{opacity:1;background:#ff6b5e;box-shadow:0 0 0 1px #0b0d11b3}
form[data-ix-state=pending] [type=submit]{cursor:progress}
form[data-ix-state=sent] [type=submit] .m7-wire rect{stroke-dashoffset:0;opacity:1}
.ix-form-live{margin:14px 0 0;max-width:52ch;font-size:.92rem;line-height:1.5;color:var(--ink-2,#c9d1dc);text-wrap:pretty}
.ix-form-live:empty{display:none}
form[data-ix-state=sent] .ix-form-live{color:var(--ink,#fff)}
form[data-ix-state=error] .ix-form-live{color:#ff8a7f}
.form-status.ix-sent{position:relative}

@media (prefers-reduced-motion:no-preference){
  body:not(.is-motion-paused):not([data-experience=standard]) form[data-ix-state=pending] .ix-led{animation:ix-blink .5s steps(1,end) infinite}
  body:not(.is-motion-paused):not([data-experience=standard]) form[data-ix-state=pending] [type=submit] .m7-wire rect{
    opacity:1;stroke-dasharray:.22 .78;animation:ix-loop 1.1s linear infinite
  }
  body:not(.is-motion-paused):not([data-experience=standard]) form[data-ix-state=sent] [type=submit] .m7-wire rect{transition:stroke-dashoffset .4s var(--m7-quint,ease-out),opacity .1s linear}
  body:not(.is-motion-paused):not([data-experience=standard]) form[data-ix-state=error] .ix-led{animation:ix-fault .36s steps(1,end) 1}
  body:not(.is-motion-paused):not([data-experience=standard]) form[data-static-form] [type=submit].ix-shake{animation:ix-shake .27s cubic-bezier(.36,.07,.19,.97) 1}
  body:not(.is-motion-paused):not([data-experience=standard]) .form-status.ix-sent{animation:ix-sent .32s var(--m7-expo,ease-out) backwards}
}
@keyframes ix-blink{50%{opacity:1;background:var(--orange,#ff7a00)}}
@keyframes ix-loop{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ix-fault{0%,50%{opacity:.2}25%,75%{opacity:1}}
@keyframes ix-shake{0%,100%{translate:0}16%,50%,83%{translate:-2px 0}33%,66%{translate:2px 0}}
@keyframes ix-sent{from{opacity:0;translate:0 4px}}
