.mascot.alive{cursor:pointer;-webkit-tap-highlight-color:transparent}.pk-mascot .zuri-rive-canvas{position:absolute;left:calc(50% - var(--zh) * .46);bottom:6px;width:calc(var(--zh) * .92);height:var(--zh);cursor:pointer;display:block;opacity:0}#lesson-root .mini-mascot{position:relative;aspect-ratio:6/7}#lesson-root .mini-mascot .zuri-rive-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;cursor:pointer}.pk-mascot.zuri-rive-ready .zuri-rive-canvas,#lesson-root .mini-mascot.zuri-rive-ready .zuri-rive-canvas{opacity:1}.pk-mascot.zuri-rive-ready>svg.mascot,#lesson-root .mini-mascot.zuri-rive-ready>svg.mascot{visibility:hidden}.mascot.alive .lid,.mascot.alive .pupil,.mascot.alive .brow,.mascot.alive .glint{animation:none}.mascot.alive .head{animation:none;rotate:var(--hr,0deg);transition:transform .45s var(--ease),rotate .4s var(--ease)}.mascot.alive .pupil{translate:var(--px,0) var(--py,0);transition:transform .3s var(--ease),translate .22s var(--ease)}.mascot.alive .foot{transform-box:view-box;transform-origin:64.6px 123.4px}.mascot .leg,.mascot .knee,.mascot .ankle,.mascot .larm,.mascot .lfore{transform-box:view-box}.mascot .legL{transform-origin:55px 99px}.mascot .legR{transform-origin:65px 99px}.mascot .legL .knee{transform-origin:55px 109px}.mascot .legR .knee{transform-origin:65px 109px}.mascot .legL .ankle{transform-origin:55px 120px}.mascot .legR .ankle{transform-origin:65px 120px}.mascot .larm{transform-origin:45px 56px}.mascot .lfore{transform-origin:44px 70px}.mascot.alive .torso{rotate:var(--lean,0deg);transition:rotate .45s ease}.mascot.alive .legL{animation:zShiftL 5.4s ease-in-out infinite}.mascot.alive .legR{animation:zShiftR 5.4s ease-in-out infinite}.mascot.alive .legL .knee{animation:zKneeL 5.4s ease-in-out infinite}.mascot.alive .legR .knee{animation:zKneeR 5.4s ease-in-out infinite}.mascot.alive .larm{animation:zBookArm 4.8s ease-in-out infinite}.mascot.alive .lfore{animation:zBookElbow 4.8s ease-in-out infinite}@keyframes zShiftL{0%,to{transform:rotate(0)}35%{transform:rotate(-2.4deg)}75%{transform:rotate(1deg)}}@keyframes zShiftR{0%,to{transform:rotate(0)}35%{transform:rotate(1.5deg)}75%{transform:rotate(-2.2deg)}}@keyframes zKneeL{0%,to{transform:rotate(0)}35%{transform:rotate(2.8deg)}75%{transform:rotate(-1.4deg)}}@keyframes zKneeR{0%,to{transform:rotate(0)}35%{transform:rotate(-1.2deg)}75%{transform:rotate(2.7deg)}}@keyframes zBookArm{0%,to{transform:rotate(0)}45%{transform:rotate(-4deg)}}@keyframes zBookElbow{0%,to{transform:rotate(0)}45%{transform:rotate(5deg)}}.mascot.alive[data-act] .pupil{translate:none}.mascot.alive[data-act] .head{rotate:none}.mascot.alive.blink .lid{animation:aBlink .17s ease-in-out}.mascot.alive.blink2 .lid{animation:aBlink2 .46s ease-in-out}@keyframes aBlink{0%,to{transform:scaleY(0)}50%{transform:scaleY(1)}}@keyframes aBlink2{0%,to,48%{transform:scaleY(0)}18%,66%{transform:scaleY(1)}}[data-act=look] .head{animation:aLookH 3.4s ease-in-out}[data-act=look] .pupil{animation:aLookP 3.4s ease-in-out}@keyframes aLookH{0%,to{transform:rotate(0)}18%,42%{transform:rotate(-5deg)}58%,82%{transform:rotate(4deg) translateY(-.4px)}}@keyframes aLookP{0%,to{transform:none}18%,42%{transform:translate(-1.1px,.1px)}58%,82%{transform:translate(1.1px,-.2px)}}[data-act=read] .head{animation:aReadH 3s ease-in-out}[data-act=read] .pupil{animation:aReadP 3s ease-in-out}[data-act=read] .brow{animation:aReadB 3s ease-in-out}[data-act=read] .larm{animation:zReadShoulder 3s ease-in-out!important}[data-act=read] .lfore{animation:zReadElbow 3s ease-in-out!important}@keyframes zReadShoulder{0%,to{transform:rotate(0)}22%,78%{transform:rotate(-17deg)}}@keyframes zReadElbow{0%,to{transform:rotate(0)}22%,78%{transform:rotate(13deg)}}@keyframes aReadH{0%,to{transform:none}22%,78%{transform:rotate(-6deg) translateY(1.4px)}}@keyframes aReadP{0%,to{transform:none}22%,78%{transform:translate(-.9px,1.3px)}}@keyframes aReadB{0%,to{transform:none}22%,78%{transform:translateY(.8px)}}[data-act=sigh] .torso{animation:aSighT 2.8s ease-in-out}[data-act=sigh] .head{animation:aSighH 2.8s ease-in-out}[data-act=sigh] .lid{animation:aSighL 2.8s ease-in-out}[data-act=sigh] .brow{animation:aSighB 2.8s ease-in-out}[data-act=sigh] .legL .knee,[data-act=sigh] .legR .knee{animation:zSighKnee 2.8s ease-in-out!important}@keyframes zSighKnee{0%,to{transform:rotate(0)}35%{transform:rotate(8deg)}70%{transform:rotate(4deg)}}@keyframes aSighT{0%,to{transform:scaleY(1)}35%{transform:scaleY(1.05)}}@keyframes aSighH{0%,to{transform:none}35%{transform:translateY(-1.4px) rotate(1.5deg)}70%{transform:translateY(1.7px) rotate(-3deg)}}@keyframes aSighL{0%,52%,88%,to{transform:scaleY(0)}62%,78%{transform:scaleY(.65)}}@keyframes aSighB{0%,to{transform:none}35%{transform:translateY(-1px)}70%{transform:translateY(.6px)}}[data-act=hum] .head{animation:aHumH 3.2s ease-in-out}[data-act=hum] .body{animation:aHumB 3.2s ease-in-out}[data-act=hum] .legL{animation:zHumLegL 3.2s ease-in-out!important}[data-act=hum] .legR{animation:zHumLegR 3.2s ease-in-out!important}@keyframes zHumLegL{0%,to{transform:rotate(0)}25%{transform:rotate(-7deg)}65%{transform:rotate(4deg)}}@keyframes zHumLegR{0%,to{transform:rotate(0)}25%{transform:rotate(5deg)}65%{transform:rotate(-7deg)}}@keyframes aHumH{0%,to{transform:rotate(0)}20%{transform:rotate(3.5deg)}45%{transform:rotate(-3.5deg)}70%{transform:rotate(3deg)}}@keyframes aHumB{0%,to{transform:rotate(0)}20%{transform:rotate(1.6deg)}45%{transform:rotate(-1.6deg)}70%{transform:rotate(1.4deg)}}[data-act=peek] .head{animation:aPeekH 2.2s ease-in-out}[data-act=peek] .pupil{animation:none;transform:none}[data-act=peek] .brow{animation:aPeekB 2.2s ease-in-out}@keyframes aPeekH{0%,to{transform:none}25%,75%{transform:translateY(1.2px) rotate(2.5deg)}}@keyframes aPeekB{0%,to{transform:none}25%,75%{transform:translateY(-1.5px)}}[data-act=watch] .uarm,[data-act=tap] .uarm{animation:aWatchU var(--dur) ease-in-out}[data-act=watch] .farm{animation:aWatchF var(--dur) ease-in-out}[data-act=watch] .head{animation:aWatchH var(--dur) ease-in-out}[data-act=watch] .pupil{animation:aWatchP var(--dur) ease-in-out}[data-act=watch] .brow{animation:aWatchB var(--dur) ease-in-out}@keyframes aWatchU{0%,to{transform:rotate(0)}16%,80%{transform:rotate(var(--wu,35deg))}}@keyframes aWatchF{0%,to{transform:rotate(0)}16%,80%{transform:rotate(var(--wf,115deg))}}@keyframes aWatchH{0%,to{transform:none}14%,52%{transform:rotate(-3deg) translateY(1.1px)}66%,82%{transform:rotate(2deg)}}@keyframes aWatchP{0%,to{transform:none}14%,52%{transform:translate(.7px,1.3px)}64%,84%{transform:translateY(-.1px)}}@keyframes aWatchB{0%,to{transform:none}64%,84%{transform:translateY(-1.5px)}}[data-act=tap] .farm{animation:aTapF var(--dur) ease-in-out}[data-act=tap] .foot{animation:aTapFoot var(--dur) ease-in-out}[data-act=tap] .head{animation:aTapH var(--dur) ease-in-out}[data-act=tap] .pupil{animation:aTapP var(--dur) ease-in-out}[data-act=tap] .brow{animation:aTapB var(--dur) ease-in-out}[data-act=tap] .body{animation:aTapBody var(--dur) ease-in-out}@keyframes aTapF{0%,to{transform:rotate(0)}12%,24%,40%,56%,72%{transform:rotate(var(--wf,115deg))}18%,32%,48%,64%{transform:rotate(calc(var(--wf,115deg) - 12deg))}84%{transform:rotate(var(--wf,115deg))}}@keyframes aTapFoot{0%,16%,to{transform:rotate(0)}22%,38%,54%,70%{transform:rotate(-15deg)}30%,46%,62%,78%{transform:rotate(0)}}@keyframes aTapH{0%,to{transform:none}10%,36%{transform:rotate(-3deg) translateY(1px)}46%,86%{transform:rotate(3deg)}}@keyframes aTapP{0%,to{transform:none}10%,36%{transform:translate(.7px,1.3px)}46%,86%{transform:translate(0)}}@keyframes aTapB{0%,to{transform:none}46%,86%{transform:translateY(-1.7px)}}@keyframes aTapBody{0%,to{transform:rotate(0)}30%,60%{transform:rotate(-.9deg)}}[data-act=hop] .smile,[data-act=giggle] .smile,[data-act=hello] .smile{display:none}[data-act=hop] .grin,[data-act=giggle] .grin,[data-act=hello] .grin{display:inline}[data-act=hop] .body{animation:aHop .95s var(--spring)}[data-act=hop] .legL,[data-act=hop] .legR{animation:zHopHip .95s ease-in-out!important}[data-act=hop] .knee{animation:zHopKnee .95s ease-in-out!important}[data-act=hop] .ankle{animation:zHopAnkle .95s ease-in-out!important}[data-act=hop] .larm{animation:zHopArm .95s ease-in-out!important}[data-act=hop] .uarm{animation:zHopRight .95s ease-in-out!important}@keyframes zHopHip{0%,to{transform:rotate(0)}16%{transform:rotate(9deg)}38%{transform:rotate(-8deg)}66%{transform:rotate(3deg)}}@keyframes zHopKnee{0%,to{transform:rotate(0)}16%{transform:rotate(16deg)}38%{transform:rotate(-7deg)}67%{transform:rotate(10deg)}}@keyframes zHopAnkle{0%,to{transform:rotate(0)}16%{transform:rotate(-9deg)}38%{transform:rotate(7deg)}67%{transform:rotate(-6deg)}}@keyframes zHopArm{0%,to{transform:rotate(0)}30%,58%{transform:rotate(-18deg)}}@keyframes zHopRight{0%,to{transform:rotate(0)}30%,58%{transform:rotate(-105deg)}}[data-act=hop] .bun{animation:zBun .24s ease-in-out 3 alternate}@keyframes aHop{0%,to{transform:translateY(0)}30%{transform:translateY(-8px)}55%{transform:translateY(0)}72%{transform:translateY(-3px)}}[data-act=giggle] .head{animation:aGiggleH 1.2s ease-in-out}[data-act=giggle] .body{animation:aGiggleB 1.2s ease-in-out}@keyframes aGiggleH{0%,to{transform:rotate(0)}12%{transform:rotate(-6deg)}28%{transform:rotate(6deg)}44%{transform:rotate(-5deg)}60%{transform:rotate(5deg)}78%{transform:rotate(-2deg)}}@keyframes aGiggleB{0%,to{transform:translateY(0)}12%,44%{transform:translateY(-1.6px)}28%,60%{transform:translateY(0)}}[data-act=hello] .uarm{animation:aHelloU 2s ease-in-out}[data-act=hello] .farm{animation:aHelloF 2s ease-in-out}[data-act=hello] .head{animation:aHelloH 2s ease-in-out}@keyframes aHelloU{0%,to{transform:rotate(0)}14%,86%{transform:rotate(-105deg)}}@keyframes aHelloF{0%,to,14%{transform:rotate(0)}26%,54%,78%{transform:rotate(-70deg)}40%,66%,86%{transform:rotate(-98deg)}}@keyframes aHelloH{0%,to{transform:none}20%,80%{transform:rotate(-4deg)}}[data-act=startle] .body{animation:aStartleB 1.1s ease-out}[data-act=startle] .head{animation:aStartleH 1.1s ease-out}[data-act=startle] .brow{animation:aStartleBr 1.1s ease-out}@keyframes aStartleB{0%,to{transform:translateY(0)}14%{transform:translateY(-5px)}40%{transform:translateY(0)}}@keyframes aStartleH{0%,to{transform:none}14%,60%{transform:rotate(3deg) translateY(-1.2px)}}@keyframes aStartleBr{0%,to{transform:none}10%,62%{transform:translateY(-2.4px)}}@media (prefers-reduced-motion:reduce){.mascot.alive{cursor:default}[data-act] *{animation:none!important}}@property --tx{syntax:"<number>";inherits:true;initial-value:0}.mascot .ft{translate:calc(var(--tx) * var(--k,1) * 1px) 0}.mascot .ft-nose{--k:1.5}.mascot .ft-eyes,.mascot .ft-glasses{--k:1.05}.mascot .ft-brows{--k:1}.mascot .ft-mouth{--k:.9}.mascot .ft-skin{--k:.95}.mascot .ft-fringe{--k:.5}.mascot.alive{transition:scale .16s var(--ease),--tx .32s var(--ease)}.mascot.turning{scale:.2 1}[data-act=look]{animation:aLookTx 3.4s ease-in-out}[data-act=read]{animation:aReadTx 3s ease-in-out}@keyframes aLookTx{0%,to{--tx:0}20%,44%{--tx:-3.6}60%,84%{--tx:3.6}}@keyframes aReadTx{0%,to{--tx:0}22%,78%{--tx:-3}}.mascot .vside{display:none}.mascot.profile .vside{display:inline}.mascot.profile .vfront{display:none}.mascot.faceleft .vside{transform:translate(120px) scaleX(-1)}.mascot .vside g{transform-box:view-box}.mascot .s-hip{transform-origin:60px 99px}.mascot .s-knee{transform-origin:60px 111px}.mascot .s-ank{transform-origin:60px 122px}.mascot .s-sh{transform-origin:60px 56px}.mascot .s-el{transform-origin:60px 69px}.mascot .s-bob,.mascot .s-torsog{transform-origin:60px 100px}.mascot .s-head{transform-origin:60px 50px}.mascot .s-torsog{transform:rotate(1.4deg)}.mascot .slid{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0)}.mascot.alive.blink .slid{animation:aBlink .17s ease-in-out}.mascot.alive.blink2 .slid{animation:aBlink2 .46s ease-in-out}.mascot.walking .s-hip,.mascot.walking .s-knee,.mascot.walking .s-ank{animation-duration:var(--s,.95s);animation-iteration-count:infinite;animation-timing-function:linear}.mascot.walking .s-hip{animation-name:sHip}.mascot.walking .s-knee{animation-name:sKnee}.mascot.walking .s-ank{animation-name:sAnk}.mascot.walking .s-hip-b,.mascot.walking .s-knee-b,.mascot.walking .s-ank-b{animation-delay:calc(var(--s,.95s) / -2)}.mascot.walking .s-bob{animation:sBob calc(var(--s,.95s) / 2) ease-in-out infinite}.mascot.walking .s-torsog{animation:sLean var(--s,.95s) ease-in-out infinite}.mascot.walking .s-sh{animation:sShoulder var(--s,.95s) ease-in-out infinite}.mascot.walking .s-el{animation:sElbow var(--s,.95s) ease-in-out infinite}.mascot.walking .s-head{animation:sHead calc(var(--s,.95s) / 2) ease-in-out infinite}@keyframes sHip{0%{transform:rotate(-23deg)}50%{transform:rotate(21deg)}75%{transform:rotate(-4deg)}to{transform:rotate(-23deg)}}@keyframes sKnee{0%{transform:rotate(3deg)}10%{transform:rotate(14deg)}40%{transform:rotate(8deg)}55%{transform:rotate(38deg)}75%{transform:rotate(68deg)}88%{transform:rotate(28deg)}to{transform:rotate(3deg)}}@keyframes sAnk{0%{transform:rotate(-14deg)}12%{transform:rotate(0)}40%{transform:rotate(4deg)}52%{transform:rotate(30deg)}62%{transform:rotate(34deg)}78%{transform:rotate(10deg)}92%{transform:rotate(-10deg)}to{transform:rotate(-14deg)}}@keyframes sBob{0%,to{transform:translateY(.5px)}50%{transform:translateY(-1.7px)}}@keyframes sLean{0%,to{transform:rotate(2deg)}50%{transform:rotate(.8deg)}}@keyframes sShoulder{0%,to{transform:rotate(22deg)}50%{transform:rotate(-24deg)}}@keyframes sElbow{0%,to{transform:rotate(-6deg)}50%{transform:rotate(-42deg)}}@keyframes sHead{0%,to{transform:rotate(.7deg) translateY(.3px)}50%{transform:rotate(-.4deg) translateY(-.2px)}}