/* Generated from cinemaPose by work/build-mobile-cinema.cjs. Animate transforms and opacity directly, never inherited custom properties. */
@media(max-width:600px){
.native-cinema{view-timeline-name:--book-scroll;view-timeline-axis:block;view-timeline-inset:0}
.hero.native-cinema .book-model{animation:mobile-book 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:transform}
@keyframes mobile-book{
0%{transform:translateX(0%) rotateX(-7deg) rotateY(-22deg) rotateZ(-5deg)}
4%{transform:translateX(0%) rotateX(-7deg) rotateY(-22deg) rotateZ(-5deg)}
5%{transform:translateX(0%) rotateX(-6.8641deg) rotateY(-22.9159deg) rotateZ(-5deg)}
6%{transform:translateX(0%) rotateX(-6.4674deg) rotateY(-25.5905deg) rotateZ(-5deg)}
7%{transform:translateX(0%) rotateX(-5.8269deg) rotateY(-29.9137deg) rotateZ(-5deg)}
8%{transform:translateX(0%) rotateX(-4.9613deg) rotateY(-35.7757deg) rotateZ(-5deg)}
9%{transform:translateX(0%) rotateX(-3.8923deg) rotateY(-43.0666deg) rotateZ(-4.9673deg)}
10%{transform:translateX(0%) rotateX(-2.6465deg) rotateY(-51.6764deg) rotateZ(-4.8728deg)}
11%{transform:translateX(0%) rotateX(-1.2561deg) rotateY(-61.4952deg) rotateZ(-4.7218deg)}
12%{transform:translateX(0%) rotateX(0.24deg) rotateY(-72.4132deg) rotateZ(-4.5197deg)}
13%{transform:translateX(0%) rotateX(1.7964deg) rotateY(-84.3204deg) rotateZ(-4.272deg)}
14%{transform:translateX(0%) rotateX(3.3615deg) rotateY(-97.1069deg) rotateZ(-3.9839deg)}
15%{transform:translateX(0%) rotateX(4.8797deg) rotateY(-110.6627deg) rotateZ(-3.6609deg)}
16%{transform:translateX(0%) rotateX(6.2931deg) rotateY(-124.8781deg) rotateZ(-3.3084deg)}
17%{transform:translateX(0%) rotateX(7.5445deg) rotateY(-139.643deg) rotateZ(-2.9316deg)}
18%{transform:translateX(0%) rotateX(8.581deg) rotateY(-154.8475deg) rotateZ(-2.536deg)}
19%{transform:translateX(0%) rotateX(9.357deg) rotateY(-170.3818deg) rotateZ(-2.127deg)}
20%{transform:translateX(0%) rotateX(9.8374deg) rotateY(-186.136deg) rotateZ(-1.7099deg)}
21%{transform:translateX(0%) rotateX(10deg) rotateY(-202deg) rotateZ(-1.2901deg)}
22%{transform:translateX(0%) rotateX(9.8374deg) rotateY(-217.864deg) rotateZ(-0.873deg)}
23%{transform:translateX(0%) rotateX(9.357deg) rotateY(-233.6182deg) rotateZ(-0.464deg)}
24%{transform:translateX(0%) rotateX(8.581deg) rotateY(-249.1525deg) rotateZ(-0.0684deg)}
25%{transform:translateX(0%) rotateX(7.5445deg) rotateY(-264.357deg) rotateZ(0.3084deg)}
26%{transform:translateX(0%) rotateX(6.2931deg) rotateY(-279.1219deg) rotateZ(0.6609deg)}
27%{transform:translateX(0%) rotateX(4.8797deg) rotateY(-293.3373deg) rotateZ(0.9839deg)}
28%{transform:translateX(0%) rotateX(3.3615deg) rotateY(-306.8931deg) rotateZ(1.272deg)}
29%{transform:translateX(0%) rotateX(1.7964deg) rotateY(-319.6796deg) rotateZ(1.5197deg)}
30%{transform:translateX(0%) rotateX(0.24deg) rotateY(-331.5868deg) rotateZ(1.7218deg)}
31%{transform:translateX(0%) rotateX(-1.2561deg) rotateY(-342.5048deg) rotateZ(1.8728deg)}
32%{transform:translateX(0%) rotateX(-2.6465deg) rotateY(-352.3236deg) rotateZ(1.9673deg)}
33%{transform:translateX(0%) rotateX(-3.8923deg) rotateY(-360.9334deg) rotateZ(2deg)}
34%{transform:translateX(0%) rotateX(-4.9613deg) rotateY(-368.2243deg) rotateZ(2deg)}
35%{transform:translateX(0%) rotateX(-5.8269deg) rotateY(-374.0863deg) rotateZ(2deg)}
36%{transform:translateX(0%) rotateX(-6.4674deg) rotateY(-378.4095deg) rotateZ(2deg)}
37%{transform:translateX(0%) rotateX(-6.8641deg) rotateY(-381.0841deg) rotateZ(2deg)}
38%{transform:translateX(0%) rotateX(-7deg) rotateY(-382deg) rotateZ(2deg)}
41%{transform:translateX(0%) rotateX(-7deg) rotateY(-382deg) rotateZ(2deg)}
42%{transform:translateX(0.637%) rotateX(-6.7707deg) rotateY(-381.7197deg) rotateZ(1.9745deg)}
43%{transform:translateX(2.4296%) rotateX(-6.1253deg) rotateY(-380.931deg) rotateZ(1.9028deg)}
44%{transform:translateX(5.2%) rotateX(-5.128deg) rotateY(-379.712deg) rotateZ(1.792deg)}
45%{transform:translateX(8.7704%) rotateX(-3.8427deg) rotateY(-378.141deg) rotateZ(1.6492deg)}
46%{transform:translateX(12.963%) rotateX(-2.3333deg) rotateY(-376.2963deg) rotateZ(1.4815deg)}
47%{transform:translateX(17.6%) rotateX(-0.664deg) rotateY(-374.256deg) rotateZ(1.296deg)}
48%{transform:translateX(22.5037%) rotateX(1.1013deg) rotateY(-372.0984deg) rotateZ(1.0999deg)}
49%{transform:translateX(27.4963%) rotateX(2.8987deg) rotateY(-369.9016deg) rotateZ(0.9001deg)}
50%{transform:translateX(32.4%) rotateX(4.664deg) rotateY(-367.744deg) rotateZ(0.704deg)}
51%{transform:translateX(37.037%) rotateX(6.3333deg) rotateY(-365.7037deg) rotateZ(0.5185deg)}
52%{transform:translateX(41.2296%) rotateX(7.8427deg) rotateY(-363.859deg) rotateZ(0.3508deg)}
53%{transform:translateX(44.8%) rotateX(9.128deg) rotateY(-362.288deg) rotateZ(0.208deg)}
54%{transform:translateX(47.5704%) rotateX(10.1253deg) rotateY(-361.069deg) rotateZ(0.0972deg)}
55%{transform:translateX(49.363%) rotateX(10.7707deg) rotateY(-360.2803deg) rotateZ(0.0255deg)}
56%{transform:translateX(50%) rotateX(11deg) rotateY(-360deg) rotateZ(0deg)}
100%{transform:translateX(50%) rotateX(11deg) rotateY(-360deg) rotateZ(0deg)}
}
.hero.native-cinema .hero-object{animation:mobile-object 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:transform}
@keyframes mobile-object{
0%{transform:translate3d(0,0px,0) scale(1)}
8%{transform:translate3d(0,0px,0) scale(1)}
9%{transform:translate3d(0,-0.1028px,0) scale(1)}
10%{transform:translate3d(0,-0.3999px,0) scale(1)}
11%{transform:translate3d(0,-0.8744px,0) scale(1)}
12%{transform:translate3d(0,-1.5094px,0) scale(1)}
13%{transform:translate3d(0,-2.288px,0) scale(1)}
14%{transform:translate3d(0,-3.1933px,0) scale(1)}
15%{transform:translate3d(0,-4.2085px,0) scale(1)}
16%{transform:translate3d(0,-5.3166px,0) scale(1)}
17%{transform:translate3d(0,-6.5007px,0) scale(1)}
18%{transform:translate3d(0,-7.744px,0) scale(1)}
19%{transform:translate3d(0,-9.0295px,0) scale(1)}
20%{transform:translate3d(0,-10.3404px,0) scale(1)}
21%{transform:translate3d(0,-11.6596px,0) scale(1)}
22%{transform:translate3d(0,-12.9705px,0) scale(1)}
23%{transform:translate3d(0,-14.256px,0) scale(1)}
24%{transform:translate3d(0,-15.4993px,0) scale(1)}
25%{transform:translate3d(0,-16.6834px,0) scale(1)}
26%{transform:translate3d(0,-17.7915px,0) scale(1)}
27%{transform:translate3d(0,-18.8067px,0) scale(1)}
28%{transform:translate3d(0,-19.712px,0) scale(1)}
29%{transform:translate3d(0,-20.4906px,0) scale(1)}
30%{transform:translate3d(0,-21.1256px,0) scale(1)}
31%{transform:translate3d(0,-21.6001px,0) scale(1)}
32%{transform:translate3d(0,-21.8972px,0) scale(1)}
33%{transform:translate3d(0,-22px,0) scale(1)}
41%{transform:translate3d(0,-22px,0) scale(1)}
42%{transform:translate3d(0,-22px,0) scale(0.9978)}
43%{transform:translate3d(0,-22px,0) scale(0.9917)}
44%{transform:translate3d(0,-22px,0) scale(0.9823)}
45%{transform:translate3d(0,-22px,0) scale(0.9702)}
46%{transform:translate3d(0,-22px,0) scale(0.9559)}
47%{transform:translate3d(0,-22px,0) scale(0.9402)}
48%{transform:translate3d(0,-22px,0) scale(0.9235)}
49%{transform:translate3d(0,-22px,0) scale(0.9065)}
50%{transform:translate3d(0,-22px,0) scale(0.8898)}
51%{transform:translate3d(0,-22px,0) scale(0.8741)}
52%{transform:translate3d(0,-22px,0) scale(0.8598)}
53%{transform:translate3d(0,-22px,0) scale(0.8477)}
54%{transform:translate3d(0,-22px,0) scale(0.8383)}
55%{transform:translate3d(0,-22px,0) scale(0.8322)}
56%{transform:translate3d(0,-22px,0) scale(0.83)}
100%{transform:translate3d(0,-22px,0) scale(0.83)}
}
.hero.native-cinema .cover-hinge{animation:mobile-cover 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:transform}
@keyframes mobile-cover{
0%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(0deg)}
41%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(0deg)}
42%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-2.2933deg)}
43%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-8.7467deg)}
44%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-18.72deg)}
45%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-31.5733deg)}
46%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-46.6667deg)}
47%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-63.36deg)}
48%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-81.0133deg)}
49%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-98.9867deg)}
50%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-116.64deg)}
51%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-133.3333deg)}
52%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-148.4267deg)}
53%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-161.28deg)}
54%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-171.2533deg)}
55%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-177.7067deg)}
56%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-180deg)}
100%{transform:translateZ(calc(var(--depth)/2 + 3px)) rotateY(-180deg)}
}
.hero.native-cinema .leaf-one{animation:mobile-one 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:transform}
@keyframes mobile-one{
0%{transform:translateZ(calc(var(--depth)/2 + 1px)) rotateY(0deg)}
61%{transform:translateZ(calc(var(--depth)/2 + 1px)) rotateY(0deg)}
62%{transform:translateZ(calc(var(--depth)/2 + 1.0842px)) rotateY(-3.0146deg)}
63%{transform:translateZ(calc(var(--depth)/2 + 1.3186px)) rotateY(-11.4065deg)}
64%{transform:translateZ(calc(var(--depth)/2 + 1.6759px)) rotateY(-24.198deg)}
65%{transform:translateZ(calc(var(--depth)/2 + 2.1288px)) rotateY(-40.4115deg)}
66%{transform:translateZ(calc(var(--depth)/2 + 2.65px)) rotateY(-59.0692deg)}
67%{transform:translateZ(calc(var(--depth)/2 + 3.2121px)) rotateY(-79.1934deg)}
68%{transform:translateZ(calc(var(--depth)/2 + 3.7879px)) rotateY(-99.8066deg)}
69%{transform:translateZ(calc(var(--depth)/2 + 4.35px)) rotateY(-119.9308deg)}
70%{transform:translateZ(calc(var(--depth)/2 + 4.8712px)) rotateY(-138.5885deg)}
71%{transform:translateZ(calc(var(--depth)/2 + 5.3241px)) rotateY(-154.802deg)}
72%{transform:translateZ(calc(var(--depth)/2 + 5.6814px)) rotateY(-167.5935deg)}
73%{transform:translateZ(calc(var(--depth)/2 + 5.9158px)) rotateY(-175.9854deg)}
74%{transform:translateZ(calc(var(--depth)/2 + 6px)) rotateY(-179deg)}
100%{transform:translateZ(calc(var(--depth)/2 + 6px)) rotateY(-179deg)}
}
.hero.native-cinema .leaf-two{animation:mobile-two 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:transform}
@keyframes mobile-two{
0%{transform:translateZ(calc(var(--depth)/2 + 0px)) rotateY(0deg)}
79%{transform:translateZ(calc(var(--depth)/2 + 0px)) rotateY(0deg)}
80%{transform:translateZ(calc(var(--depth)/2 + 0.1347px)) rotateY(-2.9809deg)}
81%{transform:translateZ(calc(var(--depth)/2 + 0.5098px)) rotateY(-11.279deg)}
82%{transform:translateZ(calc(var(--depth)/2 + 1.0815px)) rotateY(-23.9276deg)}
83%{transform:translateZ(calc(var(--depth)/2 + 1.8061px)) rotateY(-39.9599deg)}
84%{transform:translateZ(calc(var(--depth)/2 + 2.64px)) rotateY(-58.4092deg)}
85%{transform:translateZ(calc(var(--depth)/2 + 3.5394px)) rotateY(-78.3086deg)}
86%{transform:translateZ(calc(var(--depth)/2 + 4.4606px)) rotateY(-98.6914deg)}
87%{transform:translateZ(calc(var(--depth)/2 + 5.36px)) rotateY(-118.5908deg)}
88%{transform:translateZ(calc(var(--depth)/2 + 6.1939px)) rotateY(-137.0401deg)}
89%{transform:translateZ(calc(var(--depth)/2 + 6.9185px)) rotateY(-153.0724deg)}
90%{transform:translateZ(calc(var(--depth)/2 + 7.4902px)) rotateY(-165.721deg)}
91%{transform:translateZ(calc(var(--depth)/2 + 7.8653px)) rotateY(-174.0191deg)}
92%{transform:translateZ(calc(var(--depth)/2 + 8px)) rotateY(-177deg)}
100%{transform:translateZ(calc(var(--depth)/2 + 8px)) rotateY(-177deg)}
}
.hero.native-cinema .hero-copy{animation:mobile-copy 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:opacity,transform}
@keyframes mobile-copy{
0%{opacity:1;transform:translateY(0px)}
1%{opacity:1;transform:translateY(-0.3989px)}
2%{opacity:1;transform:translateY(-1.5306px)}
3%{opacity:1;transform:translateY(-3.2974px)}
4%{opacity:0.9767;transform:translateY(-5.6015px)}
5%{opacity:0.9128;transform:translateY(-8.3452px)}
6%{opacity:0.8174;transform:translateY(-11.4309px)}
7%{opacity:0.6995;transform:translateY(-14.7608px)}
8%{opacity:0.568;transform:translateY(-18.2373px)}
9%{opacity:0.432;transform:translateY(-21.7627px)}
10%{opacity:0.3005;transform:translateY(-25.2392px)}
11%{opacity:0.1826;transform:translateY(-28.5691px)}
12%{opacity:0.0872;transform:translateY(-31.6548px)}
13%{opacity:0.0233;transform:translateY(-34.3985px)}
14%{opacity:0;transform:translateY(-36.7026px)}
15%{opacity:0;transform:translateY(-38.4694px)}
16%{opacity:0;transform:translateY(-39.6011px)}
17%{opacity:0;transform:translateY(-40px)}
100%{opacity:0;transform:translateY(-40px)}
}
.hero.native-cinema .cinema-caption{animation:mobile-caption 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:opacity,transform}
@keyframes mobile-caption{
0%{opacity:0;transform:translateY(12px)}
12%{opacity:0;transform:translateY(12px)}
13%{opacity:0.0741;transform:translateY(11.1111px)}
14%{opacity:0.2593;transform:translateY(8.8889px)}
15%{opacity:0.5;transform:translateY(6px)}
16%{opacity:0.7407;transform:translateY(3.1111px)}
17%{opacity:0.9259;transform:translateY(0.8889px)}
18%{opacity:1;transform:translateY(0px)}
100%{opacity:1;transform:translateY(0px)}
}
.hero.native-cinema :is(.cinema-track,.cinema-skip){animation:mobile-fade 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:opacity}
@keyframes mobile-fade{
0%{opacity:0}
12%{opacity:0}
13%{opacity:0.0741}
14%{opacity:0.2593}
15%{opacity:0.5}
16%{opacity:0.7407}
17%{opacity:0.9259}
18%{opacity:1}
100%{opacity:1}
}
.hero.native-cinema .cinema-track i{animation:mobile-progress 1s linear both;animation-timeline:--book-scroll;animation-range:contain 0% contain 100%;will-change:transform}
@keyframes mobile-progress{
0%{transform:scaleX(0)}
1%{transform:scaleX(0.01)}
2%{transform:scaleX(0.02)}
3%{transform:scaleX(0.03)}
4%{transform:scaleX(0.04)}
5%{transform:scaleX(0.05)}
6%{transform:scaleX(0.06)}
7%{transform:scaleX(0.07)}
8%{transform:scaleX(0.08)}
9%{transform:scaleX(0.09)}
10%{transform:scaleX(0.1)}
11%{transform:scaleX(0.11)}
12%{transform:scaleX(0.12)}
13%{transform:scaleX(0.13)}
14%{transform:scaleX(0.14)}
15%{transform:scaleX(0.15)}
16%{transform:scaleX(0.16)}
17%{transform:scaleX(0.17)}
18%{transform:scaleX(0.18)}
19%{transform:scaleX(0.19)}
20%{transform:scaleX(0.2)}
21%{transform:scaleX(0.21)}
22%{transform:scaleX(0.22)}
23%{transform:scaleX(0.23)}
24%{transform:scaleX(0.24)}
25%{transform:scaleX(0.25)}
26%{transform:scaleX(0.26)}
27%{transform:scaleX(0.27)}
28%{transform:scaleX(0.28)}
29%{transform:scaleX(0.29)}
30%{transform:scaleX(0.3)}
31%{transform:scaleX(0.31)}
32%{transform:scaleX(0.32)}
33%{transform:scaleX(0.33)}
34%{transform:scaleX(0.34)}
35%{transform:scaleX(0.35)}
36%{transform:scaleX(0.36)}
37%{transform:scaleX(0.37)}
38%{transform:scaleX(0.38)}
39%{transform:scaleX(0.39)}
40%{transform:scaleX(0.4)}
41%{transform:scaleX(0.41)}
42%{transform:scaleX(0.42)}
43%{transform:scaleX(0.43)}
44%{transform:scaleX(0.44)}
45%{transform:scaleX(0.45)}
46%{transform:scaleX(0.46)}
47%{transform:scaleX(0.47)}
48%{transform:scaleX(0.48)}
49%{transform:scaleX(0.49)}
50%{transform:scaleX(0.5)}
51%{transform:scaleX(0.51)}
52%{transform:scaleX(0.52)}
53%{transform:scaleX(0.53)}
54%{transform:scaleX(0.54)}
55%{transform:scaleX(0.55)}
56%{transform:scaleX(0.56)}
57%{transform:scaleX(0.57)}
58%{transform:scaleX(0.58)}
59%{transform:scaleX(0.59)}
60%{transform:scaleX(0.6)}
61%{transform:scaleX(0.61)}
62%{transform:scaleX(0.62)}
63%{transform:scaleX(0.63)}
64%{transform:scaleX(0.64)}
65%{transform:scaleX(0.65)}
66%{transform:scaleX(0.66)}
67%{transform:scaleX(0.67)}
68%{transform:scaleX(0.68)}
69%{transform:scaleX(0.69)}
70%{transform:scaleX(0.7)}
71%{transform:scaleX(0.71)}
72%{transform:scaleX(0.72)}
73%{transform:scaleX(0.73)}
74%{transform:scaleX(0.74)}
75%{transform:scaleX(0.75)}
76%{transform:scaleX(0.76)}
77%{transform:scaleX(0.77)}
78%{transform:scaleX(0.78)}
79%{transform:scaleX(0.79)}
80%{transform:scaleX(0.8)}
81%{transform:scaleX(0.81)}
82%{transform:scaleX(0.82)}
83%{transform:scaleX(0.83)}
84%{transform:scaleX(0.84)}
85%{transform:scaleX(0.85)}
86%{transform:scaleX(0.86)}
87%{transform:scaleX(0.87)}
88%{transform:scaleX(0.88)}
89%{transform:scaleX(0.89)}
90%{transform:scaleX(0.9)}
91%{transform:scaleX(0.91)}
92%{transform:scaleX(0.92)}
93%{transform:scaleX(0.93)}
94%{transform:scaleX(0.94)}
95%{transform:scaleX(0.95)}
96%{transform:scaleX(0.96)}
97%{transform:scaleX(0.97)}
98%{transform:scaleX(0.98)}
99%{transform:scaleX(0.99)}
100%{transform:scaleX(1)}
}
}