@neurodyn/ar 0.0.12 → 0.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ar.chunk.10ee7b81.min.js +61 -0
- package/dist/ar.chunk.1be77774.min.js +1 -0
- package/dist/ar.chunk.43d0d5ab.min.js +983 -0
- package/dist/ar.chunk.697aa011.min.js +77 -0
- package/dist/ar.chunk.7990a705.min.js +5335 -0
- package/dist/ar.chunk.a7579ac4.min.js +12 -0
- package/dist/ar.chunk.c84d3d5a.min.js +1 -0
- package/dist/ar.chunk.f08f090e.min.js +6 -0
- package/dist/ar.embed.min.js +1 -1
- package/dist/ar.global.min.js +1 -1
- package/dist/ar.js +150 -20
- package/dist/static/svg/camera-intro.59d57f3d.svg +139 -0
- package/dist/static/svg/gesture-rotate.03dbf61b.svg +100 -0
- package/dist/static/svg/scan-floor.5dee2ec3.svg +66 -0
- package/dist/static/svg/scan-wall.23490063.svg +58 -0
- package/package.json +6 -3
- package/dist/ar.chunk.0152d4cd.min.js +0 -1
- package/dist/ar.chunk.0d9da022.min.js +0 -12
- package/dist/ar.chunk.2c1a21fc.min.js +0 -6
- package/dist/ar.chunk.513ce606.min.js +0 -60
- package/dist/ar.chunk.849c4685.min.js +0 -983
- package/dist/ar.chunk.96249cf8.min.js +0 -1
- package/dist/ar.chunk.c6ed8faf.min.js +0 -13
- package/dist/ar.chunk.c7d1dc6c.min.js +0 -5573
- /package/dist/{ar.chunk.849c4685.min.js.LICENSE.txt → ar.chunk.43d0d5ab.min.js.LICENSE.txt} +0 -0
- /package/dist/{ar.chunk.c6ed8faf.min.js.LICENSE.txt → ar.chunk.697aa011.min.js.LICENSE.txt} +0 -0
- /package/dist/{ar.chunk.2c1a21fc.min.js.LICENSE.txt → ar.chunk.f08f090e.min.js.LICENSE.txt} +0 -0
package/dist/ar.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Suspense, createElement, lazy } from "react";
|
|
2
2
|
import { createRoot } from "react-dom/client";
|
|
3
|
-
import { detectArPlatform, emitArAnalyticsEvent, openAppClip, performArAppClipHandoff, prewarmArSession, resolveArPlatformRoute, supportsArAppClip } from "@neurodyn/react-ar";
|
|
3
|
+
import { detectArPlatform, emitArAnalyticsEvent, openAppClip, performArAppClipHandoff, prewarmArSession, readArDebugOverride, resolveArPlatformRoute, supportsArAppClip } from "@neurodyn/react-ar";
|
|
4
4
|
const DIALOG_ROOT_ID_PREFIX = 'neurodyn-ar-dialog-root';
|
|
5
5
|
const ArDialog = lazy(async ()=>({
|
|
6
6
|
default: (await import("@neurodyn/react-ar")).ArDialog
|
|
@@ -65,7 +65,8 @@ function withTriggerAnalytics(trigger, props) {
|
|
|
65
65
|
}
|
|
66
66
|
function openArTrigger(props, dependencies) {
|
|
67
67
|
const platform = (dependencies.detectPlatform ?? detectArPlatform)();
|
|
68
|
-
const
|
|
68
|
+
const debugOverride = (dependencies.readDebugOverride ?? readArDebugOverride)();
|
|
69
|
+
const route = debugOverride.forcesInPageSession ? 'ar' : resolveArPlatformRoute(platform, props.tinuuid, (dependencies.supportsAppClip ?? supportsArAppClip)());
|
|
69
70
|
const tinuuid = props.tinuuid?.trim();
|
|
70
71
|
if ('app-clip' === route && tinuuid) return void performArAppClipHandoff({
|
|
71
72
|
hid: props.hid,
|
|
@@ -91,7 +92,9 @@ function openArTrigger(props, dependencies) {
|
|
|
91
92
|
return;
|
|
92
93
|
}
|
|
93
94
|
const prewarm = dependencies.prewarmSession ?? prewarmArSession;
|
|
94
|
-
prewarm(
|
|
95
|
+
prewarm({
|
|
96
|
+
backend: debugOverride.backend
|
|
97
|
+
});
|
|
95
98
|
dependencies.openArDialog(props);
|
|
96
99
|
}
|
|
97
100
|
function getTriggerObjectInfo(props, tinuuid) {
|
|
@@ -107,29 +110,156 @@ function emitOpenTriggerAnalytics(props, name, tinuuid) {
|
|
|
107
110
|
object: getTriggerObjectInfo(props, tinuuid)
|
|
108
111
|
});
|
|
109
112
|
}
|
|
110
|
-
function
|
|
113
|
+
function contract_attribute(name, parser, details) {
|
|
111
114
|
return {
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
language: void 0 !== props.language ? props.language : readLanguageAttribute(trigger, 'data-neurodyn-ar-language'),
|
|
118
|
-
scaleEnabled: void 0 !== props.scaleEnabled ? props.scaleEnabled : readBooleanAttribute(trigger, 'scale-enabled'),
|
|
119
|
-
tinuuid: void 0 !== props.tinuuid ? props.tinuuid : readAttribute(trigger, 'tinuuid')
|
|
115
|
+
kind: 'attribute',
|
|
116
|
+
name,
|
|
117
|
+
parse: parser.parse,
|
|
118
|
+
values: parser.values,
|
|
119
|
+
...details
|
|
120
120
|
};
|
|
121
121
|
}
|
|
122
|
-
function
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
122
|
+
function optionOnly(reason) {
|
|
123
|
+
return {
|
|
124
|
+
kind: 'option',
|
|
125
|
+
reason
|
|
126
|
+
};
|
|
126
127
|
}
|
|
127
|
-
function
|
|
128
|
-
return
|
|
128
|
+
function defineTriggerContract() {
|
|
129
|
+
return (contract)=>contract;
|
|
129
130
|
}
|
|
130
|
-
function
|
|
131
|
+
function contract_attributeEntries(contract) {
|
|
132
|
+
return Object.entries(contract.fields).filter((entry)=>'attribute' === entry[1].kind);
|
|
133
|
+
}
|
|
134
|
+
function readRawAttribute(trigger, name, legacyNames = []) {
|
|
131
135
|
const value = trigger.getAttribute(name);
|
|
132
|
-
|
|
136
|
+
if (0 === legacyNames.length || value?.trim()) return value;
|
|
137
|
+
for (const legacyName of legacyNames){
|
|
138
|
+
const legacyValue = trigger.getAttribute(legacyName);
|
|
139
|
+
if (legacyValue?.trim()) return legacyValue;
|
|
140
|
+
}
|
|
141
|
+
return value;
|
|
142
|
+
}
|
|
143
|
+
function readTriggerAttributes(trigger, contract, options = {}) {
|
|
144
|
+
const values = {};
|
|
145
|
+
for (const [key, field] of contract_attributeEntries(contract)){
|
|
146
|
+
const name = `${contract.prefix}${field.name}`;
|
|
147
|
+
const option = options[key];
|
|
148
|
+
if (void 0 !== option) {
|
|
149
|
+
values[key] = field.normalizesOptions ? field.parse(option, {
|
|
150
|
+
attribute: name
|
|
151
|
+
}) : option;
|
|
152
|
+
continue;
|
|
153
|
+
}
|
|
154
|
+
values[key] = field.parse(readRawAttribute(trigger, name, field.legacyNames), {
|
|
155
|
+
attribute: name
|
|
156
|
+
});
|
|
157
|
+
}
|
|
158
|
+
return values;
|
|
159
|
+
}
|
|
160
|
+
function parsers_text() {
|
|
161
|
+
return {
|
|
162
|
+
parse: (raw)=>raw ?? void 0
|
|
163
|
+
};
|
|
164
|
+
}
|
|
165
|
+
function trimmedText() {
|
|
166
|
+
return {
|
|
167
|
+
parse: (raw)=>raw?.trim() || void 0
|
|
168
|
+
};
|
|
169
|
+
}
|
|
170
|
+
function booleanish() {
|
|
171
|
+
return {
|
|
172
|
+
parse: (raw)=>{
|
|
173
|
+
const value = raw?.trim().toLowerCase();
|
|
174
|
+
if ('true' === value || '1' === value) return true;
|
|
175
|
+
if ('false' === value || '0' === value) return false;
|
|
176
|
+
},
|
|
177
|
+
values: [
|
|
178
|
+
'true',
|
|
179
|
+
'false'
|
|
180
|
+
]
|
|
181
|
+
};
|
|
182
|
+
}
|
|
183
|
+
function oneOf(values) {
|
|
184
|
+
return {
|
|
185
|
+
parse: (raw)=>values.includes(raw ?? '') ? raw : void 0,
|
|
186
|
+
values
|
|
187
|
+
};
|
|
188
|
+
}
|
|
189
|
+
function listOf() {
|
|
190
|
+
return (values)=>values;
|
|
191
|
+
}
|
|
192
|
+
const AR_TRIGGER_ATTRIBUTE = 'data-neurodyn-ar';
|
|
193
|
+
const AR_LANGUAGES = listOf()([
|
|
194
|
+
'en',
|
|
195
|
+
'ru'
|
|
196
|
+
]);
|
|
197
|
+
const arContract = defineTriggerContract()({
|
|
198
|
+
prefix: 'data-neurodyn-ar-',
|
|
199
|
+
markers: [
|
|
200
|
+
{
|
|
201
|
+
name: AR_TRIGGER_ATTRIBUTE,
|
|
202
|
+
description: 'Marks a trigger for the embed build.'
|
|
203
|
+
}
|
|
204
|
+
],
|
|
205
|
+
fields: {
|
|
206
|
+
tinuuid: contract_attribute('tinuuid', trimmedText(), {
|
|
207
|
+
required: true,
|
|
208
|
+
legacyNames: [
|
|
209
|
+
'data-tinuuid'
|
|
210
|
+
],
|
|
211
|
+
description: 'The unique identifier of the object.'
|
|
212
|
+
}),
|
|
213
|
+
apiKey: contract_attribute('api-key', trimmedText(), {
|
|
214
|
+
required: true,
|
|
215
|
+
legacyNames: [
|
|
216
|
+
'data-api-key'
|
|
217
|
+
],
|
|
218
|
+
description: 'Public API key used to load AR data.'
|
|
219
|
+
}),
|
|
220
|
+
hid: contract_attribute('hid', trimmedText(), {
|
|
221
|
+
required: false,
|
|
222
|
+
legacyNames: [
|
|
223
|
+
'data-hid'
|
|
224
|
+
],
|
|
225
|
+
defaultValue: 'First material',
|
|
226
|
+
description: 'The identifier of a material variant.'
|
|
227
|
+
}),
|
|
228
|
+
name: contract_attribute('name', parsers_text(), {
|
|
229
|
+
required: false,
|
|
230
|
+
description: 'Accessible name of the AR experience.'
|
|
231
|
+
}),
|
|
232
|
+
language: contract_attribute('language', oneOf(AR_LANGUAGES), {
|
|
233
|
+
required: false,
|
|
234
|
+
defaultValue: 'Browser language',
|
|
235
|
+
description: 'UI language override.'
|
|
236
|
+
}),
|
|
237
|
+
scaleEnabled: contract_attribute('scale-enabled', booleanish(), {
|
|
238
|
+
required: false,
|
|
239
|
+
legacyNames: [
|
|
240
|
+
'data-scale-enabled'
|
|
241
|
+
],
|
|
242
|
+
defaultValue: '`false`',
|
|
243
|
+
description: 'Allows two-finger scaling; real scale is kept otherwise.'
|
|
244
|
+
}),
|
|
245
|
+
initialWidgetSessionToken: contract_attribute('widget-session-token', trimmedText(), {
|
|
246
|
+
required: false,
|
|
247
|
+
legacyNames: [
|
|
248
|
+
'data-widget-session-token'
|
|
249
|
+
],
|
|
250
|
+
description: 'Existing Widget Session token that keeps analytics attribution across handoffs.'
|
|
251
|
+
}),
|
|
252
|
+
onAnalyticsEvent: optionOnly('A callback.'),
|
|
253
|
+
open: optionOnly('The embed build owns the open state.'),
|
|
254
|
+
defaultOpen: optionOnly('The embed build owns the open state.'),
|
|
255
|
+
onOpenChange: optionOnly('The embed build owns the open state.')
|
|
256
|
+
}
|
|
257
|
+
});
|
|
258
|
+
function readTriggerProps(trigger, props = {}) {
|
|
259
|
+
return {
|
|
260
|
+
...props,
|
|
261
|
+
...readTriggerAttributes(trigger, arContract, props)
|
|
262
|
+
};
|
|
133
263
|
}
|
|
134
264
|
const ReactModelViewerDialog = lazy(async ()=>({
|
|
135
265
|
default: (await import("@neurodyn/react-model-viewer")).ModelViewerDialog
|
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
<svg width="1000" height="1000" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264 264" aria-hidden="true" xmlns:c2pa="http://c2pa.org/manifest">
|
|
2
|
+
<style>
|
|
3
|
+
.camera-intro__k,.camera-intro__move,.camera-intro__drop,.camera-intro__finger{transform-box:view-box;transform-origin:0 0;animation-duration:10.6s;animation-iteration-count:infinite;animation-timing-function:linear;animation-fill-mode:both}
|
|
4
|
+
.camera-intro__move{transform-origin:132px 196px;animation-name:camera-intro-move}
|
|
5
|
+
.camera-intro__drop{transform-origin:132px 196px;animation-name:camera-intro-drop}
|
|
6
|
+
.camera-intro__stand{transform-box:fill-box;transform-origin:center}
|
|
7
|
+
.camera-intro__finger{animation-name:camera-intro-finger}
|
|
8
|
+
.camera-intro__ring{transform-box:fill-box;transform-origin:center;animation:camera-intro-ring 10.6s infinite both}
|
|
9
|
+
@keyframes camera-intro-drop{0%,28.30%{opacity:0;transform:translateY(-14px) scale(.92);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}33.02%,100%{opacity:1;transform:none}}
|
|
10
|
+
.camera-intro__top{animation-name:camera-intro-top}@keyframes camera-intro-top{0%,39.15%{transform:translate(113.63px,177.63px) rotate(8.79deg) skewX(-16.1deg) scale(29.32,-17.72)}39.82%{transform:translate(113.61px,177.61px) rotate(8.86deg) skewX(-16.21deg) scale(29.31,-17.73)}40.50%{transform:translate(113.54px,177.54px) rotate(9.1deg) skewX(-16.56deg) scale(29.28,-17.75)}41.17%{transform:translate(113.4px,177.39px) rotate(9.57deg) skewX(-17.26deg) scale(29.2,-17.79)}41.85%{transform:translate(113.17px,177.14px) rotate(10.38deg) skewX(-18.42deg) scale(29.07,-17.87)}42.52%{transform:translate(112.8px,176.71px) rotate(11.77deg) skewX(-20.24deg) scale(28.82,-18.03)}43.19%{transform:translate(112.24px,175.96px) rotate(14.22deg) skewX(-23.02deg) scale(28.34,-18.34)}43.87%{transform:translate(111.51px,174.67px) rotate(18.43deg) skewX(-26.57deg) scale(27.39,-18.97)}44.54%{transform:translate(111.03px,173.36px) rotate(22.99deg) skewX(-28.85deg) scale(26.26,-19.79)}45.22%{transform:translate(110.86px,172.54px) rotate(25.97deg) skewX(-29.64deg) scale(25.51,-20.37)}45.89%{transform:translate(110.81px,172.06px) rotate(27.79deg) skewX(-29.9deg) scale(25.05,-20.75)}46.56%{transform:translate(110.79px,171.78px) rotate(28.91deg) skewX(-29.98deg) scale(24.77,-20.98)}47.24%{transform:translate(110.79px,171.61px) rotate(29.57deg) skewX(-30deg) scale(24.6,-21.12)}47.91%{transform:translate(110.79px,171.53px) rotate(29.9deg) skewX(-30deg) scale(24.52,-21.19)}48.58%,100%{transform:translate(110.79px,171.51px) rotate(30deg) skewX(-30deg) scale(24.49,-21.21)}}
|
|
11
|
+
.camera-intro__front{animation-name:camera-intro-front}@keyframes camera-intro-front{0%,39.15%{transform:translate(113.63px,202.12px) rotate(8.79deg) skewX(8.79deg) scale(29.32,-24.21)}39.82%{transform:translate(113.61px,202.1px) rotate(8.86deg) skewX(8.86deg) scale(29.31,-24.2)}40.50%{transform:translate(113.54px,202.03px) rotate(9.1deg) skewX(9.1deg) scale(29.28,-24.19)}41.17%{transform:translate(113.4px,201.89px) rotate(9.57deg) skewX(9.57deg) scale(29.2,-24.15)}41.85%{transform:translate(113.17px,201.63px) rotate(10.38deg) skewX(10.38deg) scale(29.07,-24.09)}42.52%{transform:translate(112.8px,201.21px) rotate(11.77deg) skewX(11.77deg) scale(28.82,-23.98)}43.19%{transform:translate(112.24px,200.45px) rotate(14.22deg) skewX(14.22deg) scale(28.34,-23.74)}43.87%{transform:translate(111.51px,199.17px) rotate(18.43deg) skewX(18.43deg) scale(27.39,-23.24)}44.54%{transform:translate(111.03px,197.85px) rotate(22.99deg) skewX(22.99deg) scale(26.26,-22.55)}45.22%{transform:translate(110.86px,197.03px) rotate(25.97deg) skewX(25.97deg) scale(25.51,-22.02)}45.89%{transform:translate(110.81px,196.56px) rotate(27.79deg) skewX(27.79deg) scale(25.05,-21.67)}46.56%{transform:translate(110.79px,196.27px) rotate(28.91deg) skewX(28.91deg) scale(24.77,-21.44)}47.24%{transform:translate(110.79px,196.11px) rotate(29.57deg) skewX(29.57deg) scale(24.6,-21.31)}47.91%{transform:translate(110.79px,196.02px) rotate(29.9deg) skewX(29.9deg) scale(24.52,-21.23)}48.58%,100%{transform:translate(110.79px,196px) rotate(30deg) skewX(30deg) scale(24.49,-21.21)}}
|
|
12
|
+
.camera-intro__right{animation-name:camera-intro-right}@keyframes camera-intro-right{0%,39.15%{transform:translate(142.61px,206.61px) rotate(-65.1deg) skewX(-65.1deg) scale(18.44,-10.31)}39.82%{transform:translate(142.57px,206.62px) rotate(-64.93deg) skewX(-64.93deg) scale(18.46,-10.38)}40.50%{transform:translate(142.44px,206.66px) rotate(-64.34deg) skewX(-64.34deg) scale(18.52,-10.61)}41.17%{transform:translate(142.2px,206.74px) rotate(-63.17deg) skewX(-63.17deg) scale(18.63,-11.05)}41.85%{transform:translate(141.76px,206.87px) rotate(-61.2deg) skewX(-61.2deg) scale(18.84,-11.8)}42.52%{transform:translate(141.02px,207.09px) rotate(-57.99deg) skewX(-57.99deg) scale(19.21,-12.99)}43.19%{transform:translate(139.71px,207.41px) rotate(-52.76deg) skewX(-52.76deg) scale(19.92,-14.82)}43.87%{transform:translate(137.49px,207.83px) rotate(-45deg) skewX(-45deg) scale(21.21,-17.32)}44.54%{transform:translate(135.21px,208.11px) rotate(-38.16deg) skewX(-38.16deg) scale(22.59,-19.26)}45.22%{transform:translate(133.79px,208.2px) rotate(-34.39deg) skewX(-34.39deg) scale(23.44,-20.21)}45.89%{transform:translate(132.97px,208.23px) rotate(-32.31deg) skewX(-32.31deg) scale(23.93,-20.7)}46.56%{transform:translate(132.47px,208.24px) rotate(-31.12deg) skewX(-31.12deg) scale(24.22,-20.97)}47.24%{transform:translate(132.19px,208.25px) rotate(-30.44deg) skewX(-30.44deg) scale(24.39,-21.12)}47.91%{transform:translate(132.04px,208.25px) rotate(-30.1deg) skewX(-30.1deg) scale(24.47,-21.19)}48.58%,100%{transform:translate(132px,208.25px) rotate(-30deg) skewX(-30deg) scale(24.49,-21.21)}}
|
|
13
|
+
.camera-intro__e0{animation-name:camera-intro-e0}@keyframes camera-intro-e0{0%,39.15%{transform:translate(121.39px,160.9px) rotate(8.79deg) scaleX(29.32)}39.82%{transform:translate(121.43px,160.89px) rotate(8.86deg) scaleX(29.31)}40.50%{transform:translate(121.56px,160.85px) rotate(9.1deg) scaleX(29.28)}41.17%{transform:translate(121.8px,160.76px) rotate(9.57deg) scaleX(29.2)}41.85%{transform:translate(122.24px,160.63px) rotate(10.38deg) scaleX(29.07)}42.52%{transform:translate(122.98px,160.42px) rotate(11.77deg) scaleX(28.82)}43.19%{transform:translate(124.29px,160.09px) rotate(14.22deg) scaleX(28.34)}43.87%{transform:translate(126.51px,159.67px) rotate(18.43deg) scaleX(27.39)}44.54%{transform:translate(128.79px,159.4px) rotate(22.99deg) scaleX(26.26)}45.22%{transform:translate(130.21px,159.3px) rotate(25.97deg) scaleX(25.51)}45.89%{transform:translate(131.03px,159.27px) rotate(27.79deg) scaleX(25.05)}46.56%{transform:translate(131.53px,159.26px) rotate(28.91deg) scaleX(24.77)}47.24%{transform:translate(131.81px,159.26px) rotate(29.57deg) scaleX(24.6)}47.91%{transform:translate(131.96px,159.26px) rotate(29.9deg) scaleX(24.52)}48.58%,100%{transform:translate(132px,159.26px) rotate(30deg) scaleX(24.49)}}
|
|
14
|
+
.camera-intro__e1{animation-name:camera-intro-e1}@keyframes camera-intro-e1{0%,39.15%{transform:translate(150.37px,165.38px) rotate(114.9deg) scaleX(18.44)}39.82%{transform:translate(150.39px,165.4px) rotate(115.07deg) scaleX(18.46)}40.50%{transform:translate(150.46px,165.47px) rotate(115.66deg) scaleX(18.52)}41.17%{transform:translate(150.6px,165.62px) rotate(116.83deg) scaleX(18.63)}41.85%{transform:translate(150.83px,165.87px) rotate(118.8deg) scaleX(18.84)}42.52%{transform:translate(151.2px,166.3px) rotate(122.01deg) scaleX(19.21)}43.19%{transform:translate(151.76px,167.06px) rotate(127.24deg) scaleX(19.92)}43.87%{transform:translate(152.49px,168.34px) rotate(135deg) scaleX(21.21)}44.54%{transform:translate(152.97px,169.65px) rotate(141.84deg) scaleX(22.59)}45.22%{transform:translate(153.14px,170.47px) rotate(145.61deg) scaleX(23.44)}45.89%{transform:translate(153.19px,170.95px) rotate(147.69deg) scaleX(23.93)}46.56%{transform:translate(153.21px,171.23px) rotate(148.88deg) scaleX(24.22)}47.24%{transform:translate(153.21px,171.4px) rotate(149.56deg) scaleX(24.39)}47.91%{transform:translate(153.21px,171.48px) rotate(149.9deg) scaleX(24.47)}48.58%,100%{transform:translate(153.21px,171.51px) rotate(150deg) scaleX(24.49)}}
|
|
15
|
+
.camera-intro__e2{animation-name:camera-intro-e2}@keyframes camera-intro-e2{0%,39.15%{transform:translate(142.61px,182.11px) rotate(-171.21deg) scaleX(29.32)}39.82%{transform:translate(142.57px,182.12px) rotate(-171.14deg) scaleX(29.31)}40.50%{transform:translate(142.44px,182.17px) rotate(-170.9deg) scaleX(29.28)}41.17%{transform:translate(142.2px,182.25px) rotate(-170.43deg) scaleX(29.2)}41.85%{transform:translate(141.76px,182.38px) rotate(-169.62deg) scaleX(29.07)}42.52%{transform:translate(141.02px,182.59px) rotate(-168.23deg) scaleX(28.82)}43.19%{transform:translate(139.71px,182.92px) rotate(-165.78deg) scaleX(28.34)}43.87%{transform:translate(137.49px,183.34px) rotate(-161.57deg) scaleX(27.39)}44.54%{transform:translate(135.21px,183.61px) rotate(-157.01deg) scaleX(26.26)}45.22%{transform:translate(133.79px,183.71px) rotate(-154.03deg) scaleX(25.51)}45.89%{transform:translate(132.97px,183.74px) rotate(-152.21deg) scaleX(25.05)}46.56%{transform:translate(132.47px,183.75px) rotate(-151.09deg) scaleX(24.77)}47.24%{transform:translate(132.19px,183.75px) rotate(-150.43deg) scaleX(24.6)}47.91%{transform:translate(132.04px,183.75px) rotate(-150.1deg) scaleX(24.52)}48.58%,100%{transform:translate(132px,183.75px) rotate(-150deg) scaleX(24.49)}}
|
|
16
|
+
.camera-intro__e3{animation-name:camera-intro-e3}@keyframes camera-intro-e3{0%,39.15%{transform:translate(113.63px,177.63px) rotate(-65.1deg) scaleX(18.44)}39.82%{transform:translate(113.61px,177.61px) rotate(-64.93deg) scaleX(18.46)}40.50%{transform:translate(113.54px,177.54px) rotate(-64.34deg) scaleX(18.52)}41.17%{transform:translate(113.4px,177.39px) rotate(-63.17deg) scaleX(18.63)}41.85%{transform:translate(113.17px,177.14px) rotate(-61.2deg) scaleX(18.84)}42.52%{transform:translate(112.8px,176.71px) rotate(-57.99deg) scaleX(19.21)}43.19%{transform:translate(112.24px,175.96px) rotate(-52.76deg) scaleX(19.92)}43.87%{transform:translate(111.51px,174.67px) rotate(-45deg) scaleX(21.21)}44.54%{transform:translate(111.03px,173.36px) rotate(-38.16deg) scaleX(22.59)}45.22%{transform:translate(110.86px,172.54px) rotate(-34.39deg) scaleX(23.44)}45.89%{transform:translate(110.81px,172.06px) rotate(-32.31deg) scaleX(23.93)}46.56%{transform:translate(110.79px,171.78px) rotate(-31.12deg) scaleX(24.22)}47.24%{transform:translate(110.79px,171.61px) rotate(-30.44deg) scaleX(24.39)}47.91%{transform:translate(110.79px,171.53px) rotate(-30.1deg) scaleX(24.47)}48.58%,100%{transform:translate(110.79px,171.51px) rotate(-30deg) scaleX(24.49)}}
|
|
17
|
+
.camera-intro__e4{animation-name:camera-intro-e4}@keyframes camera-intro-e4{0%,39.15%{transform:translate(113.63px,177.63px) rotate(90deg) scaleX(24.49)}39.82%{transform:translate(113.61px,177.61px) rotate(90deg) scaleX(24.49)}40.50%{transform:translate(113.54px,177.54px) rotate(90deg) scaleX(24.49)}41.17%{transform:translate(113.4px,177.39px) rotate(90deg) scaleX(24.49)}41.85%{transform:translate(113.17px,177.14px) rotate(90deg) scaleX(24.49)}42.52%{transform:translate(112.8px,176.71px) rotate(90deg) scaleX(24.49)}43.19%{transform:translate(112.24px,175.96px) rotate(90deg) scaleX(24.49)}43.87%{transform:translate(111.51px,174.67px) rotate(90deg) scaleX(24.49)}44.54%{transform:translate(111.03px,173.36px) rotate(90deg) scaleX(24.49)}45.22%{transform:translate(110.86px,172.54px) rotate(90deg) scaleX(24.49)}45.89%{transform:translate(110.81px,172.06px) rotate(90deg) scaleX(24.49)}46.56%{transform:translate(110.79px,171.78px) rotate(90deg) scaleX(24.49)}47.24%{transform:translate(110.79px,171.61px) rotate(90deg) scaleX(24.49)}47.91%{transform:translate(110.79px,171.53px) rotate(90deg) scaleX(24.49)}48.58%,100%{transform:translate(110.79px,171.51px) rotate(90deg) scaleX(24.49)}}
|
|
18
|
+
.camera-intro__e5{animation-name:camera-intro-e5}@keyframes camera-intro-e5{0%,39.15%{transform:translate(142.61px,182.11px) rotate(90deg) scaleX(24.49)}39.82%{transform:translate(142.57px,182.12px) rotate(90deg) scaleX(24.49)}40.50%{transform:translate(142.44px,182.17px) rotate(90deg) scaleX(24.49)}41.17%{transform:translate(142.2px,182.25px) rotate(90deg) scaleX(24.49)}41.85%{transform:translate(141.76px,182.38px) rotate(90deg) scaleX(24.49)}42.52%{transform:translate(141.02px,182.59px) rotate(90deg) scaleX(24.49)}43.19%{transform:translate(139.71px,182.92px) rotate(90deg) scaleX(24.49)}43.87%{transform:translate(137.49px,183.34px) rotate(90deg) scaleX(24.49)}44.54%{transform:translate(135.21px,183.61px) rotate(90deg) scaleX(24.49)}45.22%{transform:translate(133.79px,183.71px) rotate(90deg) scaleX(24.49)}45.89%{transform:translate(132.97px,183.74px) rotate(90deg) scaleX(24.49)}46.56%{transform:translate(132.47px,183.75px) rotate(90deg) scaleX(24.49)}47.24%{transform:translate(132.19px,183.75px) rotate(90deg) scaleX(24.49)}47.91%{transform:translate(132.04px,183.75px) rotate(90deg) scaleX(24.49)}48.58%,100%{transform:translate(132px,183.75px) rotate(90deg) scaleX(24.49)}}
|
|
19
|
+
.camera-intro__e6{animation-name:camera-intro-e6}@keyframes camera-intro-e6{0%,39.15%{transform:translate(150.37px,165.38px) rotate(90deg) scaleX(24.49)}39.82%{transform:translate(150.39px,165.4px) rotate(90deg) scaleX(24.49)}40.50%{transform:translate(150.46px,165.47px) rotate(90deg) scaleX(24.49)}41.17%{transform:translate(150.6px,165.62px) rotate(90deg) scaleX(24.49)}41.85%{transform:translate(150.83px,165.87px) rotate(90deg) scaleX(24.49)}42.52%{transform:translate(151.2px,166.3px) rotate(90deg) scaleX(24.49)}43.19%{transform:translate(151.76px,167.06px) rotate(90deg) scaleX(24.49)}43.87%{transform:translate(152.49px,168.34px) rotate(90deg) scaleX(24.49)}44.54%{transform:translate(152.97px,169.65px) rotate(90deg) scaleX(24.49)}45.22%{transform:translate(153.14px,170.47px) rotate(90deg) scaleX(24.49)}45.89%{transform:translate(153.19px,170.95px) rotate(90deg) scaleX(24.49)}46.56%{transform:translate(153.21px,171.23px) rotate(90deg) scaleX(24.49)}47.24%{transform:translate(153.21px,171.4px) rotate(90deg) scaleX(24.49)}47.91%{transform:translate(153.21px,171.48px) rotate(90deg) scaleX(24.49)}48.58%,100%{transform:translate(153.21px,171.51px) rotate(90deg) scaleX(24.49)}}
|
|
20
|
+
.camera-intro__e7{animation-name:camera-intro-e7}@keyframes camera-intro-e7{0%,39.15%{transform:translate(113.63px,202.12px) rotate(8.79deg) scaleX(29.32)}39.82%{transform:translate(113.61px,202.1px) rotate(8.86deg) scaleX(29.31)}40.50%{transform:translate(113.54px,202.03px) rotate(9.1deg) scaleX(29.28)}41.17%{transform:translate(113.4px,201.89px) rotate(9.57deg) scaleX(29.2)}41.85%{transform:translate(113.17px,201.63px) rotate(10.38deg) scaleX(29.07)}42.52%{transform:translate(112.8px,201.21px) rotate(11.77deg) scaleX(28.82)}43.19%{transform:translate(112.24px,200.45px) rotate(14.22deg) scaleX(28.34)}43.87%{transform:translate(111.51px,199.17px) rotate(18.43deg) scaleX(27.39)}44.54%{transform:translate(111.03px,197.85px) rotate(22.99deg) scaleX(26.26)}45.22%{transform:translate(110.86px,197.03px) rotate(25.97deg) scaleX(25.51)}45.89%{transform:translate(110.81px,196.56px) rotate(27.79deg) scaleX(25.05)}46.56%{transform:translate(110.79px,196.27px) rotate(28.91deg) scaleX(24.77)}47.24%{transform:translate(110.79px,196.11px) rotate(29.57deg) scaleX(24.6)}47.91%{transform:translate(110.79px,196.02px) rotate(29.9deg) scaleX(24.52)}48.58%,100%{transform:translate(110.79px,196px) rotate(30deg) scaleX(24.49)}}
|
|
21
|
+
.camera-intro__e8{animation-name:camera-intro-e8}@keyframes camera-intro-e8{0%,39.15%{transform:translate(142.61px,206.61px) rotate(-65.1deg) scaleX(18.44)}39.82%{transform:translate(142.57px,206.62px) rotate(-64.93deg) scaleX(18.46)}40.50%{transform:translate(142.44px,206.66px) rotate(-64.34deg) scaleX(18.52)}41.17%{transform:translate(142.2px,206.74px) rotate(-63.17deg) scaleX(18.63)}41.85%{transform:translate(141.76px,206.87px) rotate(-61.2deg) scaleX(18.84)}42.52%{transform:translate(141.02px,207.09px) rotate(-57.99deg) scaleX(19.21)}43.19%{transform:translate(139.71px,207.41px) rotate(-52.76deg) scaleX(19.92)}43.87%{transform:translate(137.49px,207.83px) rotate(-45deg) scaleX(21.21)}44.54%{transform:translate(135.21px,208.11px) rotate(-38.16deg) scaleX(22.59)}45.22%{transform:translate(133.79px,208.2px) rotate(-34.39deg) scaleX(23.44)}45.89%{transform:translate(132.97px,208.23px) rotate(-32.31deg) scaleX(23.93)}46.56%{transform:translate(132.47px,208.24px) rotate(-31.12deg) scaleX(24.22)}47.24%{transform:translate(132.19px,208.25px) rotate(-30.44deg) scaleX(24.39)}47.91%{transform:translate(132.04px,208.25px) rotate(-30.1deg) scaleX(24.47)}48.58%,100%{transform:translate(132px,208.25px) rotate(-30deg) scaleX(24.49)}}
|
|
22
|
+
.camera-intro__vTbl{animation-name:camera-intro-vTbl}@keyframes camera-intro-vTbl{0%,39.15%{transform:translate(121.39px,160.9px)}39.82%{transform:translate(121.43px,160.89px)}40.50%{transform:translate(121.56px,160.85px)}41.17%{transform:translate(121.8px,160.76px)}41.85%{transform:translate(122.24px,160.63px)}42.52%{transform:translate(122.98px,160.42px)}43.19%{transform:translate(124.29px,160.09px)}43.87%{transform:translate(126.51px,159.67px)}44.54%{transform:translate(128.79px,159.4px)}45.22%{transform:translate(130.21px,159.3px)}45.89%{transform:translate(131.03px,159.27px)}46.56%{transform:translate(131.53px,159.26px)}47.24%{transform:translate(131.81px,159.26px)}47.91%{transform:translate(131.96px,159.26px)}48.58%,100%{transform:translate(132px,159.26px)}}
|
|
23
|
+
.camera-intro__vTbr{animation-name:camera-intro-vTbr}@keyframes camera-intro-vTbr{0%,39.15%{transform:translate(150.37px,165.38px)}39.82%{transform:translate(150.39px,165.4px)}40.50%{transform:translate(150.46px,165.47px)}41.17%{transform:translate(150.6px,165.62px)}41.85%{transform:translate(150.83px,165.87px)}42.52%{transform:translate(151.2px,166.3px)}43.19%{transform:translate(151.76px,167.06px)}43.87%{transform:translate(152.49px,168.34px)}44.54%{transform:translate(152.97px,169.65px)}45.22%{transform:translate(153.14px,170.47px)}45.89%{transform:translate(153.19px,170.95px)}46.56%{transform:translate(153.21px,171.23px)}47.24%{transform:translate(153.21px,171.4px)}47.91%{transform:translate(153.21px,171.48px)}48.58%,100%{transform:translate(153.21px,171.51px)}}
|
|
24
|
+
.camera-intro__vTfl{animation-name:camera-intro-vTfl}@keyframes camera-intro-vTfl{0%,39.15%{transform:translate(113.63px,177.63px)}39.82%{transform:translate(113.61px,177.61px)}40.50%{transform:translate(113.54px,177.54px)}41.17%{transform:translate(113.4px,177.39px)}41.85%{transform:translate(113.17px,177.14px)}42.52%{transform:translate(112.8px,176.71px)}43.19%{transform:translate(112.24px,175.96px)}43.87%{transform:translate(111.51px,174.67px)}44.54%{transform:translate(111.03px,173.36px)}45.22%{transform:translate(110.86px,172.54px)}45.89%{transform:translate(110.81px,172.06px)}46.56%{transform:translate(110.79px,171.78px)}47.24%{transform:translate(110.79px,171.61px)}47.91%{transform:translate(110.79px,171.53px)}48.58%,100%{transform:translate(110.79px,171.51px)}}
|
|
25
|
+
.camera-intro__vTfr{animation-name:camera-intro-vTfr}@keyframes camera-intro-vTfr{0%,39.15%{transform:translate(142.61px,182.11px)}39.82%{transform:translate(142.57px,182.12px)}40.50%{transform:translate(142.44px,182.17px)}41.17%{transform:translate(142.2px,182.25px)}41.85%{transform:translate(141.76px,182.38px)}42.52%{transform:translate(141.02px,182.59px)}43.19%{transform:translate(139.71px,182.92px)}43.87%{transform:translate(137.49px,183.34px)}44.54%{transform:translate(135.21px,183.61px)}45.22%{transform:translate(133.79px,183.71px)}45.89%{transform:translate(132.97px,183.74px)}46.56%{transform:translate(132.47px,183.75px)}47.24%{transform:translate(132.19px,183.75px)}47.91%{transform:translate(132.04px,183.75px)}48.58%,100%{transform:translate(132px,183.75px)}}
|
|
26
|
+
.camera-intro__vBfl{animation-name:camera-intro-vBfl}@keyframes camera-intro-vBfl{0%,39.15%{transform:translate(113.63px,202.12px)}39.82%{transform:translate(113.61px,202.1px)}40.50%{transform:translate(113.54px,202.03px)}41.17%{transform:translate(113.4px,201.89px)}41.85%{transform:translate(113.17px,201.63px)}42.52%{transform:translate(112.8px,201.21px)}43.19%{transform:translate(112.24px,200.45px)}43.87%{transform:translate(111.51px,199.17px)}44.54%{transform:translate(111.03px,197.85px)}45.22%{transform:translate(110.86px,197.03px)}45.89%{transform:translate(110.81px,196.56px)}46.56%{transform:translate(110.79px,196.27px)}47.24%{transform:translate(110.79px,196.11px)}47.91%{transform:translate(110.79px,196.02px)}48.58%,100%{transform:translate(110.79px,196px)}}
|
|
27
|
+
.camera-intro__vBfr{animation-name:camera-intro-vBfr}@keyframes camera-intro-vBfr{0%,39.15%{transform:translate(142.61px,206.61px)}39.82%{transform:translate(142.57px,206.62px)}40.50%{transform:translate(142.44px,206.66px)}41.17%{transform:translate(142.2px,206.74px)}41.85%{transform:translate(141.76px,206.87px)}42.52%{transform:translate(141.02px,207.09px)}43.19%{transform:translate(139.71px,207.41px)}43.87%{transform:translate(137.49px,207.83px)}44.54%{transform:translate(135.21px,208.11px)}45.22%{transform:translate(133.79px,208.2px)}45.89%{transform:translate(132.97px,208.23px)}46.56%{transform:translate(132.47px,208.24px)}47.24%{transform:translate(132.19px,208.25px)}47.91%{transform:translate(132.04px,208.25px)}48.58%,100%{transform:translate(132px,208.25px)}}
|
|
28
|
+
.camera-intro__vBbr{animation-name:camera-intro-vBbr}@keyframes camera-intro-vBbr{0%,39.15%{transform:translate(150.37px,189.88px)}39.82%{transform:translate(150.39px,189.9px)}40.50%{transform:translate(150.46px,189.97px)}41.17%{transform:translate(150.6px,190.11px)}41.85%{transform:translate(150.83px,190.37px)}42.52%{transform:translate(151.2px,190.79px)}43.19%{transform:translate(151.76px,191.55px)}43.87%{transform:translate(152.49px,192.83px)}44.54%{transform:translate(152.97px,194.15px)}45.22%{transform:translate(153.14px,194.97px)}45.89%{transform:translate(153.19px,195.44px)}46.56%{transform:translate(153.21px,195.73px)}47.24%{transform:translate(153.21px,195.89px)}47.91%{transform:translate(153.21px,195.98px)}48.58%,100%{transform:translate(153.21px,196px)}}
|
|
29
|
+
@keyframes camera-intro-move{0%,55.66%{transform:none;animation-timing-function:cubic-bezier(.7,0,.3,1)}65.09%,100%{transform:translate(0px,-53.59px) scale(0.85)}}
|
|
30
|
+
@keyframes camera-intro-finger{0%,36.79%{opacity:0;transform:translate(150px,230px);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}39.15%{opacity:1;transform:translate(150px,224px);animation-timing-function:cubic-bezier(.7,0,.3,1)}48.58%{opacity:1;transform:translate(114px,224px);animation-timing-function:cubic-bezier(.5,0,.75,0)}51.42%{opacity:0;transform:translate(114px,230px)}53.30%{opacity:0;transform:translate(132px,189.75px);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}55.66%{opacity:1;transform:translate(132px,183.75px);animation-timing-function:cubic-bezier(.7,0,.3,1)}65.09%{opacity:1;transform:translate(132px,132px);animation-timing-function:cubic-bezier(.5,0,.75,0)}67.92%,100%{opacity:0;transform:translate(132px,138px)}}
|
|
31
|
+
@keyframes camera-intro-ring{0%,36.79%{transform:scale(.4);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}39.15%,48.58%{transform:scale(1);animation-timing-function:ease-out}51.42%{transform:scale(1.6)}53.30%{transform:scale(.4);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}55.66%,65.09%{transform:scale(1);animation-timing-function:ease-out}67.92%,100%{transform:scale(1.6)}}
|
|
32
|
+
.camera-intro__pan{transform-box:view-box;animation:camera-intro-pan 10.6s infinite both}
|
|
33
|
+
@keyframes camera-intro-pan{0%,7.55%{transform:translate(0,0);animation-timing-function:cubic-bezier(.45,0,.55,1)}12.26%{transform:translate(0,-16px);animation-timing-function:cubic-bezier(.45,0,.55,1)}17.45%{transform:translate(-10px,-16px);animation-timing-function:cubic-bezier(.45,0,.55,1)}23.11%{transform:translate(10px,-16px);animation-timing-function:cubic-bezier(.45,0,.55,1)}27.36%,100%{transform:translate(0,0)}}
|
|
34
|
+
.camera-intro__d104{animation:camera-intro-d104 10.6s infinite both}@keyframes camera-intro-d104{0%,20.75%{opacity:0}22.17%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
35
|
+
.camera-intro__d112{animation:camera-intro-d112 10.6s infinite both}@keyframes camera-intro-d112{0%,19.81%{opacity:0}21.23%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
36
|
+
.camera-intro__d120{animation:camera-intro-d120 10.6s infinite both}@keyframes camera-intro-d120{0%,18.87%{opacity:0}20.28%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
37
|
+
.camera-intro__d128{animation:camera-intro-d128 10.6s infinite both}@keyframes camera-intro-d128{0%,17.92%{opacity:0}19.34%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
38
|
+
.camera-intro__d136{animation:camera-intro-d136 10.6s infinite both}@keyframes camera-intro-d136{0%,12.74%{opacity:0}14.15%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
39
|
+
.camera-intro__d144{animation:camera-intro-d144 10.6s infinite both}@keyframes camera-intro-d144{0%,13.68%{opacity:0}15.09%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
40
|
+
.camera-intro__d152{animation:camera-intro-d152 10.6s infinite both}@keyframes camera-intro-d152{0%,14.62%{opacity:0}16.04%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
41
|
+
.camera-intro__d160{animation:camera-intro-d160 10.6s infinite both}@keyframes camera-intro-d160{0%,15.57%{opacity:0}16.98%,32.08%{opacity:1}36.79%,100%{opacity:0}}
|
|
42
|
+
|
|
43
|
+
.camera-intro__bg{animation:camera-intro-bg 10.6s infinite both}
|
|
44
|
+
@keyframes camera-intro-bg{0%,59.43%{opacity:1}66.04%,100%{opacity:0}}
|
|
45
|
+
.camera-intro__stand{animation:camera-intro-standfade 10.6s infinite both}
|
|
46
|
+
@keyframes camera-intro-standfade{0%,30.19%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}33.96%,60.38%{opacity:1;transform:none}65.09%,100%{opacity:0;transform:none}}
|
|
47
|
+
.camera-intro__faces{animation:camera-intro-faces 10.6s infinite both}
|
|
48
|
+
@keyframes camera-intro-faces{0%,69.81%{opacity:1}73.11%,100%{opacity:0}}
|
|
49
|
+
.camera-intro__wire{animation:camera-intro-wire 10.6s infinite both}
|
|
50
|
+
@keyframes camera-intro-wire{0%,69.81%{opacity:1}69.91%,100%{opacity:0}}
|
|
51
|
+
.camera-intro__logo{animation:camera-intro-logo 10.6s infinite both}
|
|
52
|
+
@keyframes camera-intro-logo{0%,69.81%{opacity:0}69.91%,100%{opacity:1}}
|
|
53
|
+
.camera-intro__lw{animation:camera-intro-lw 10.6s infinite both}
|
|
54
|
+
@keyframes camera-intro-lw{0%,78.30%{stroke-width:1.7px;animation-timing-function:cubic-bezier(.34,1.56,.64,1)}81.60%,100%{stroke-width:4.37px}}
|
|
55
|
+
.camera-intro__spin{transform-box:view-box;transform-origin:132px 132px;animation:camera-intro-spin 10.6s infinite both}
|
|
56
|
+
@keyframes camera-intro-spin{0%,71.70%{transform:rotate(0deg);animation-timing-function:cubic-bezier(.5,0,.9,.6)}74.06%{transform:rotate(30deg) scale(.86);animation-timing-function:cubic-bezier(.2,.5,.4,1.25)}76.60%,100%{transform:rotate(60deg) scale(1)}}
|
|
57
|
+
.camera-intro__orbit{stroke-dasharray:1;transform-box:view-box;transform-origin:132px 132px;transform:rotate(-90deg);animation:camera-intro-orbit 10.6s infinite both}
|
|
58
|
+
@keyframes camera-intro-orbit{0%,72.55%{stroke-dashoffset:1;opacity:0}72.64%{stroke-dashoffset:1;opacity:1;animation-timing-function:cubic-bezier(.45,0,.3,1)}77.36%,78.77%{stroke-dashoffset:0;opacity:1}80.66%,100%{stroke-dashoffset:0;opacity:0}}
|
|
59
|
+
.camera-intro__disc{transform-box:view-box;transform-origin:132px 132px;animation:camera-intro-disc 10.6s infinite both}
|
|
60
|
+
@keyframes camera-intro-disc{0%,76.89%{transform:scale(0);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}80.66%,100%{transform:none}}
|
|
61
|
+
.camera-intro__hub{transform-box:view-box;transform-origin:132px 132px;animation:camera-intro-hub 10.6s infinite both}
|
|
62
|
+
@keyframes camera-intro-hub{0%,79.72%{transform:scale(0);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}83.02%,100%{transform:none}}
|
|
63
|
+
.camera-intro__all{animation:camera-intro-all 10.6s infinite both}
|
|
64
|
+
@keyframes camera-intro-all{0%,2.83%{opacity:0}7.55%,92.45%{opacity:1}97.17%,100%{opacity:0}}
|
|
65
|
+
|
|
66
|
+
@media (prefers-reduced-motion:reduce){
|
|
67
|
+
.camera-intro__k,.camera-intro__move,.camera-intro__drop,.camera-intro__finger,.camera-intro__stand,.camera-intro__ring,.camera-intro__bg,.camera-intro__all,.camera-intro__pan,.camera-intro__dot,.camera-intro__faces,.camera-intro__wire,.camera-intro__logo,.camera-intro__lw,.camera-intro__spin,.camera-intro__orbit,.camera-intro__disc,.camera-intro__hub{animation:none}
|
|
68
|
+
.camera-intro__bg,.camera-intro__all,.camera-intro__drop,.camera-intro__stand,.camera-intro__faces,.camera-intro__wire{opacity:1;transform:none}
|
|
69
|
+
.camera-intro__move,.camera-intro__pan{transform:none}
|
|
70
|
+
.camera-intro__finger,.camera-intro__dot,.camera-intro__logo,.camera-intro__disc,.camera-intro__orbit{opacity:0}
|
|
71
|
+
.camera-intro__top{transform:translate(110.79px,171.51px) rotate(30deg) skewX(-30deg) scale(24.49,-21.21)}
|
|
72
|
+
.camera-intro__front{transform:translate(110.79px,196px) rotate(30deg) skewX(30deg) scale(24.49,-21.21)}
|
|
73
|
+
.camera-intro__right{transform:translate(132px,208.25px) rotate(-30deg) skewX(-30deg) scale(24.49,-21.21)}
|
|
74
|
+
.camera-intro__e0{transform:translate(132px,159.26px) rotate(30deg) scaleX(24.49)}
|
|
75
|
+
.camera-intro__e1{transform:translate(153.21px,171.51px) rotate(150deg) scaleX(24.49)}
|
|
76
|
+
.camera-intro__e2{transform:translate(132px,183.75px) rotate(-150deg) scaleX(24.49)}
|
|
77
|
+
.camera-intro__e3{transform:translate(110.79px,171.51px) rotate(-30deg) scaleX(24.49)}
|
|
78
|
+
.camera-intro__e4{transform:translate(110.79px,171.51px) rotate(90deg) scaleX(24.49)}
|
|
79
|
+
.camera-intro__e5{transform:translate(132px,183.75px) rotate(90deg) scaleX(24.49)}
|
|
80
|
+
.camera-intro__e6{transform:translate(153.21px,171.51px) rotate(90deg) scaleX(24.49)}
|
|
81
|
+
.camera-intro__e7{transform:translate(110.79px,196px) rotate(30deg) scaleX(24.49)}
|
|
82
|
+
.camera-intro__e8{transform:translate(132px,208.25px) rotate(-30deg) scaleX(24.49)}
|
|
83
|
+
.camera-intro__vTbl{transform:translate(132px,159.26px)}
|
|
84
|
+
.camera-intro__vTbr{transform:translate(153.21px,171.51px)}
|
|
85
|
+
.camera-intro__vTfl{transform:translate(110.79px,171.51px)}
|
|
86
|
+
.camera-intro__vTfr{transform:translate(132px,183.75px)}
|
|
87
|
+
.camera-intro__vBfl{transform:translate(110.79px,196px)}
|
|
88
|
+
.camera-intro__vBfr{transform:translate(132px,208.25px)}
|
|
89
|
+
.camera-intro__vBbr{transform:translate(153.21px,196px)}
|
|
90
|
+
}
|
|
91
|
+
</style>
|
|
92
|
+
<defs>
|
|
93
|
+
<clipPath id="camera-intro-scr"><rect x="87" y="31" width="90" height="202" rx="13"/></clipPath>
|
|
94
|
+
<linearGradient id="camera-intro-gw" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#4B4D58"/><stop offset="1" stop-color="#3B3C45"/></linearGradient>
|
|
95
|
+
<linearGradient id="camera-intro-gfl" x1="0" y1="150" x2="0" y2="233" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#34353D"/><stop offset="1" stop-color="#1F2025"/></linearGradient>
|
|
96
|
+
<linearGradient id="camera-intro-gc" x1="0" y1="31" x2="0" y2="92" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#202127"/><stop offset="1" stop-color="#33343C"/></linearGradient>
|
|
97
|
+
<linearGradient id="camera-intro-gl" x1="87" y1="0" x2="177" y2="0" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#26272D"/><stop offset=".2" stop-color="#35363E" stop-opacity="0"/><stop offset=".8" stop-color="#35363E" stop-opacity="0"/><stop offset="1" stop-color="#26272D"/></linearGradient>
|
|
98
|
+
<linearGradient id="camera-intro-gwin" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#8A8EA0"/><stop offset="1" stop-color="#666979"/></linearGradient>
|
|
99
|
+
<linearGradient id="camera-intro-glt" x1="0" y1="150" x2="0" y2="200" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fff" stop-opacity=".1"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient>
|
|
100
|
+
<linearGradient id="camera-intro-gt" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#7A7B86"/><stop offset="1" stop-color="#666772"/></linearGradient>
|
|
101
|
+
<linearGradient id="camera-intro-gf" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#55565F"/><stop offset="1" stop-color="#43444C"/></linearGradient>
|
|
102
|
+
<linearGradient id="camera-intro-gr" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#3D3E46"/><stop offset="1" stop-color="#2E2F35"/></linearGradient>
|
|
103
|
+
<radialGradient id="camera-intro-sh"><stop offset="0" stop-color="#000" stop-opacity=".5"/><stop offset="1" stop-color="#000" stop-opacity="0"/></radialGradient>
|
|
104
|
+
<linearGradient id="camera-intro-o" x1="107.37" y1="156.63" x2="156.63" y2="107.37" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#E2335C"/><stop offset=".5" stop-color="#F0622E"/><stop offset="1" stop-color="#F8A43C"/></linearGradient>
|
|
105
|
+
</defs>
|
|
106
|
+
<rect x="83" y="27" width="98" height="210" rx="17" fill="#121317" stroke="#E9EAEE" stroke-width="2.5"/>
|
|
107
|
+
<path d="M81.5 70V84M81.5 92V106M182.5 80V102" stroke="#E9EAEE" stroke-width="2" stroke-linecap="round"/>
|
|
108
|
+
<rect x="87" y="31" width="90" height="202" rx="13" fill="#1B1C21"/>
|
|
109
|
+
<g clip-path="url(#camera-intro-scr)"><g class="camera-intro__all">
|
|
110
|
+
<g class="camera-intro__bg">
|
|
111
|
+
<g class="camera-intro__pan">
|
|
112
|
+
<path d="M100 92L-45.66 -40H309.66L164 92Z" fill="url(#camera-intro-gc)"/><path d="M100 92L-45.66 -40V300L100 150ZM164 92L309.66 -40V300L164 150Z" fill="#2C2D34"/><path d="M100 150L-65.52 300H329.52L164 150Z" fill="url(#camera-intro-gfl)"/>
|
|
113
|
+
<path d="M100 92H164V150H100Z" fill="url(#camera-intro-gw)"/>
|
|
114
|
+
<rect x="116" y="102" width="32" height="30" rx="2" fill="url(#camera-intro-gwin)"/>
|
|
115
|
+
<path d="M116 150H148L175.59 200H88.41Z" fill="url(#camera-intro-glt)"/>
|
|
116
|
+
<g fill="#5B6BFF"><g class="camera-intro__dot camera-intro__d104"><circle cx="92.41" cy="162" r="0.96"/><circle cx="78.9" cy="176" r="1.27"/><circle cx="61.52" cy="194" r="1.67"/><circle cx="40.28" cy="216" r="2.15"/><circle cx="15.17" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d112"><circle cx="103.72" cy="162" r="0.96"/><circle cx="94.07" cy="176" r="1.27"/><circle cx="81.66" cy="194" r="1.67"/><circle cx="66.48" cy="216" r="2.15"/><circle cx="48.55" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d120"><circle cx="115.03" cy="162" r="0.96"/><circle cx="109.24" cy="176" r="1.27"/><circle cx="101.79" cy="194" r="1.67"/><circle cx="92.69" cy="216" r="2.15"/><circle cx="81.93" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d128"><circle cx="126.34" cy="162" r="0.96"/><circle cx="124.41" cy="176" r="1.27"/><circle cx="121.93" cy="194" r="1.67"/><circle cx="118.9" cy="216" r="2.15"/><circle cx="115.31" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d136"><circle cx="137.66" cy="162" r="0.96"/><circle cx="139.59" cy="176" r="1.27"/><circle cx="142.07" cy="194" r="1.67"/><circle cx="145.1" cy="216" r="2.15"/><circle cx="148.69" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d144"><circle cx="148.97" cy="162" r="0.96"/><circle cx="154.76" cy="176" r="1.27"/><circle cx="162.21" cy="194" r="1.67"/><circle cx="171.31" cy="216" r="2.15"/><circle cx="182.07" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d152"><circle cx="160.28" cy="162" r="0.96"/><circle cx="169.93" cy="176" r="1.27"/><circle cx="182.34" cy="194" r="1.67"/><circle cx="197.52" cy="216" r="2.15"/><circle cx="215.45" cy="242" r="2.72"/></g><g class="camera-intro__dot camera-intro__d160"><circle cx="171.59" cy="162" r="0.96"/><circle cx="185.1" cy="176" r="1.27"/><circle cx="202.48" cy="194" r="1.67"/><circle cx="223.72" cy="216" r="2.15"/><circle cx="248.83" cy="242" r="2.72"/></g></g>
|
|
117
|
+
</g>
|
|
118
|
+
<rect x="87" y="31" width="90" height="202" fill="url(#camera-intro-gl)"/>
|
|
119
|
+
</g>
|
|
120
|
+
<circle class="camera-intro__disc" cx="132" cy="132" r="35.19" fill="url(#camera-intro-o)"/>
|
|
121
|
+
<circle class="camera-intro__orbit" pathLength="1" cx="132" cy="132" r="35.19" fill="none" stroke="#fff" stroke-opacity=".6" stroke-width="1.5" stroke-linecap="round"/>
|
|
122
|
+
<g class="camera-intro__drop"><g class="camera-intro__move">
|
|
123
|
+
<g class="camera-intro__stand"><ellipse cx="132" cy="199" rx="29.93" ry="18.85" fill="url(#camera-intro-sh)"/>
|
|
124
|
+
<ellipse cx="132" cy="196" rx="27.21" ry="15.71" fill="none" stroke="#fff" stroke-opacity=".5" stroke-width="1.5"/></g>
|
|
125
|
+
<g class="camera-intro__faces"><path class="camera-intro__k camera-intro__top" d="M0 0H1V1H0Z" fill="url(#camera-intro-gt)"/><path class="camera-intro__k camera-intro__front" d="M0 0H1V1H0Z" fill="url(#camera-intro-gf)"/><path class="camera-intro__k camera-intro__right" d="M0 0H1V1H0Z" fill="url(#camera-intro-gr)"/></g>
|
|
126
|
+
<g class="camera-intro__wire"><g stroke="#F4F5F8" stroke-width="2" fill="none"><path class="camera-intro__k camera-intro__e0" d="M0 0H1"/><path class="camera-intro__k camera-intro__e1" d="M0 0H1"/><path class="camera-intro__k camera-intro__e2" d="M0 0H1"/><path class="camera-intro__k camera-intro__e3" d="M0 0H1"/><path class="camera-intro__k camera-intro__e4" d="M0 0H1"/><path class="camera-intro__k camera-intro__e5" d="M0 0H1"/><path class="camera-intro__k camera-intro__e6" d="M0 0H1"/><path class="camera-intro__k camera-intro__e7" d="M0 0H1"/><path class="camera-intro__k camera-intro__e8" d="M0 0H1"/></g><g fill="#F4F5F8"><circle class="camera-intro__k camera-intro__vTbl" r="1"/><circle class="camera-intro__k camera-intro__vTbr" r="1"/><circle class="camera-intro__k camera-intro__vTfl" r="1"/><circle class="camera-intro__k camera-intro__vTfr" r="1"/><circle class="camera-intro__k camera-intro__vBfl" r="1"/><circle class="camera-intro__k camera-intro__vBfr" r="1"/><circle class="camera-intro__k camera-intro__vBbr" r="1"/></g></g>
|
|
127
|
+
</g></g>
|
|
128
|
+
<g class="camera-intro__logo" fill="none" stroke="#F4F5F8" stroke-linejoin="round" stroke-linecap="round">
|
|
129
|
+
<path class="camera-intro__lw" d="M132 152.82L113.97 142.41L113.97 121.59L132 111.18L150.03 121.59L150.03 142.41Z"/>
|
|
130
|
+
<g class="camera-intro__spin"><path class="camera-intro__lw" d="M132 132L113.97 121.59M132 132L150.03 121.59M132 132L132 152.82"/></g>
|
|
131
|
+
<circle class="camera-intro__hub" cx="132" cy="132" r="6.04" fill="url(#camera-intro-o)" stroke-width="4.37"/>
|
|
132
|
+
</g>
|
|
133
|
+
<g class="camera-intro__finger">
|
|
134
|
+
<circle class="camera-intro__ring" r="8" fill="#fff" stroke="#5B6BFF" stroke-opacity=".7" stroke-width="1.75"/>
|
|
135
|
+
<circle r="5" fill="#5B6BFF"/>
|
|
136
|
+
</g>
|
|
137
|
+
</g></g>
|
|
138
|
+
<rect x="119" y="36" width="26" height="8" rx="4" fill="#000"/>
|
|
139
|
+
</svg>
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
<svg width="1000" height="858" xmlns="http://www.w3.org/2000/svg" viewBox="5.5 -16.4 105.7 90.7" aria-hidden="true" xmlns:c2pa="http://c2pa.org/manifest">
|
|
2
|
+
<style>
|
|
3
|
+
.gesture-rotate__m,.gesture-rotate__finger{transform-box:view-box;transform-origin:0 0;animation-duration:2.4s;animation-iteration-count:infinite;animation-direction:alternate;animation-fill-mode:both;animation-timing-function:linear}
|
|
4
|
+
.gesture-rotate__finger{animation-name:gesture-rotate-finger}
|
|
5
|
+
.gesture-rotate__vBbr{animation-name:gesture-rotate-vBbr}
|
|
6
|
+
.gesture-rotate__vBfr{animation-name:gesture-rotate-vBfr}
|
|
7
|
+
.gesture-rotate__vBfl{animation-name:gesture-rotate-vBfl}
|
|
8
|
+
.gesture-rotate__vTfr{animation-name:gesture-rotate-vTfr}
|
|
9
|
+
.gesture-rotate__vTfl{animation-name:gesture-rotate-vTfl}
|
|
10
|
+
.gesture-rotate__vTbr{animation-name:gesture-rotate-vTbr}
|
|
11
|
+
.gesture-rotate__vTbl{animation-name:gesture-rotate-vTbl}
|
|
12
|
+
.gesture-rotate__e8{animation-name:gesture-rotate-e8}
|
|
13
|
+
.gesture-rotate__e7{animation-name:gesture-rotate-e7}
|
|
14
|
+
.gesture-rotate__e6{animation-name:gesture-rotate-e6}
|
|
15
|
+
.gesture-rotate__e5{animation-name:gesture-rotate-e5}
|
|
16
|
+
.gesture-rotate__e4{animation-name:gesture-rotate-e4}
|
|
17
|
+
.gesture-rotate__e3{animation-name:gesture-rotate-e3}
|
|
18
|
+
.gesture-rotate__e2{animation-name:gesture-rotate-e2}
|
|
19
|
+
.gesture-rotate__e1{animation-name:gesture-rotate-e1}
|
|
20
|
+
.gesture-rotate__e0{animation-name:gesture-rotate-e0}
|
|
21
|
+
.gesture-rotate__right{animation-name:gesture-rotate-right}
|
|
22
|
+
.gesture-rotate__front{animation-name:gesture-rotate-front}
|
|
23
|
+
.gesture-rotate__top{animation-name:gesture-rotate-top}
|
|
24
|
+
@keyframes gesture-rotate-top{0%,22.9%{transform:translate(39.18px,34.27px) rotate(6.46deg) skewX(-25.91deg) scale(33.05,-14.78)}26.3%{transform:translate(39.15px,34.24px) rotate(6.52deg) skewX(-26.11deg) scale(33.03,-14.79)}29.7%{transform:translate(39.05px,34.17px) rotate(6.74deg) skewX(-26.76deg) scale(32.97,-14.82)}33.1%{transform:translate(38.86px,34.03px) rotate(7.16deg) skewX(-27.96deg) scale(32.85,-14.87)}36.4%{transform:translate(38.56px,33.78px) rotate(7.86deg) skewX(-29.85deg) scale(32.63,-14.97)}39.8%{transform:translate(38.12px,33.39px) rotate(8.99deg) skewX(-32.55deg) scale(32.24,-15.15)}43.2%{transform:translate(37.5px,32.77px) rotate(10.83deg) skewX(-36.14deg) scale(31.53,-15.49)}46.6%{transform:translate(36.72px,31.72px) rotate(14.02deg) skewX(-40.4deg) scale(30.17,-16.19)}50.0%{transform:translate(36.05px,30.07px) rotate(19.53deg) skewX(-43.74deg) scale(27.63,-17.68)}53.4%{transform:translate(36.03px,28.4px) rotate(26.27deg) skewX(-43.84deg) scale(24.66,-19.81)}56.8%{transform:translate(36.37px,27.31px) rotate(31.72deg) skewX(-42.16deg) scale(22.56,-21.65)}60.2%{transform:translate(36.72px,26.65px) rotate(35.63deg) skewX(-40.38deg) scale(21.25,-22.99)}63.5%{transform:translate(37px,26.23px) rotate(38.37deg) skewX(-38.92deg) scale(20.42,-23.92)}66.9%{transform:translate(37.19px,25.97px) rotate(40.22deg) skewX(-37.85deg) scale(19.91,-24.54)}70.3%{transform:translate(37.32px,25.82px) rotate(41.38deg) skewX(-37.16deg) scale(19.6,-24.93)}73.7%{transform:translate(37.39px,25.73px) rotate(42deg) skewX(-36.78deg) scale(19.44,-25.13)}77.1%,100%{transform:translate(37.41px,25.71px) rotate(42.19deg) skewX(-36.67deg) scale(19.39,-25.19)}}
|
|
25
|
+
@keyframes gesture-rotate-front{0%,22.9%{transform:translate(39.18px,65.08px) rotate(6.46deg) skewX(6.46deg) scale(33.05,-30.62)}26.3%{transform:translate(39.15px,65.06px) rotate(6.52deg) skewX(6.52deg) scale(33.03,-30.61)}29.7%{transform:translate(39.05px,64.98px) rotate(6.74deg) skewX(6.74deg) scale(32.97,-30.6)}33.1%{transform:translate(38.86px,64.84px) rotate(7.16deg) skewX(7.16deg) scale(32.85,-30.57)}36.4%{transform:translate(38.56px,64.6px) rotate(7.86deg) skewX(7.86deg) scale(32.63,-30.52)}39.8%{transform:translate(38.12px,64.21px) rotate(8.99deg) skewX(8.99deg) scale(32.24,-30.44)}43.2%{transform:translate(37.5px,63.58px) rotate(10.83deg) skewX(10.83deg) scale(31.53,-30.27)}46.6%{transform:translate(36.72px,62.53px) rotate(14.02deg) skewX(14.02deg) scale(30.17,-29.9)}50.0%{transform:translate(36.05px,60.89px) rotate(19.53deg) skewX(19.53deg) scale(27.63,-29.04)}53.4%{transform:translate(36.03px,59.22px) rotate(26.27deg) skewX(26.27deg) scale(24.66,-27.63)}56.8%{transform:translate(36.37px,58.12px) rotate(31.72deg) skewX(31.72deg) scale(22.56,-26.21)}60.2%{transform:translate(36.72px,57.46px) rotate(35.63deg) skewX(35.63deg) scale(21.25,-25.05)}63.5%{transform:translate(37px,57.05px) rotate(38.37deg) skewX(38.37deg) scale(20.42,-24.16)}66.9%{transform:translate(37.19px,56.79px) rotate(40.22deg) skewX(40.22deg) scale(19.91,-23.53)}70.3%{transform:translate(37.32px,56.63px) rotate(41.38deg) skewX(41.38deg) scale(19.6,-23.12)}73.7%{transform:translate(37.39px,56.55px) rotate(42deg) skewX(42deg) scale(19.44,-22.9)}77.1%,100%{transform:translate(37.41px,56.52px) rotate(42.19deg) skewX(42.19deg) scale(19.39,-22.83)}}
|
|
26
|
+
@keyframes gesture-rotate-right{0%,22.9%{transform:translate(72.02px,68.8px) rotate(-57.62deg) skewX(-57.62deg) scale(16.43,-16.5)}26.3%{transform:translate(71.97px,68.81px) rotate(-57.37deg) skewX(-57.37deg) scale(16.47,-16.62)}29.7%{transform:translate(71.79px,68.85px) rotate(-56.5deg) skewX(-56.5deg) scale(16.59,-17.01)}33.1%{transform:translate(71.45px,68.93px) rotate(-54.88deg) skewX(-54.88deg) scale(16.84,-17.73)}36.4%{transform:translate(70.88px,69.06px) rotate(-52.29deg) skewX(-52.29deg) scale(17.26,-18.85)}39.8%{transform:translate(69.96px,69.25px) rotate(-48.46deg) skewX(-48.46deg) scale(17.98,-20.43)}43.2%{transform:translate(68.47px,69.51px) rotate(-43.02deg) skewX(-43.02deg) scale(19.19,-22.53)}46.6%{transform:translate(65.99px,69.84px) rotate(-35.58deg) skewX(-35.58deg) scale(21.26,-25.06)}50.0%{transform:translate(62.1px,70.12px) rotate(-26.73deg) skewX(-26.73deg) scale(24.47,-27.52)}53.4%{transform:translate(58.14px,70.13px) rotate(-19.89deg) skewX(-19.89deg) scale(27.46,-28.98)}56.8%{transform:translate(55.56px,69.99px) rotate(-16.12deg) skewX(-16.12deg) scale(29.21,-29.6)}60.2%{transform:translate(53.99px,69.84px) rotate(-13.99deg) skewX(-13.99deg) scale(30.18,-29.9)}63.5%{transform:translate(53.01px,69.72px) rotate(-12.71deg) skewX(-12.71deg) scale(30.75,-30.06)}66.9%{transform:translate(52.39px,69.64px) rotate(-11.93deg) skewX(-11.93deg) scale(31.08,-30.15)}70.3%{transform:translate(52.02px,69.59px) rotate(-11.46deg) skewX(-11.46deg) scale(31.28,-30.2)}73.7%{transform:translate(51.83px,69.56px) rotate(-11.22deg) skewX(-11.22deg) scale(31.38,-30.23)}77.1%,100%{transform:translate(51.78px,69.55px) rotate(-11.15deg) skewX(-11.15deg) scale(31.41,-30.23)}}
|
|
27
|
+
@keyframes gesture-rotate-e0{0%,22.9%{transform:translate(47.98px,20.39px) rotate(6.46deg) scaleX(33.05)}26.3%{transform:translate(48.03px,20.37px) rotate(6.52deg) scaleX(33.03)}29.7%{transform:translate(48.21px,20.33px) rotate(6.74deg) scaleX(32.97)}33.1%{transform:translate(48.55px,20.25px) rotate(7.16deg) scaleX(32.85)}36.4%{transform:translate(49.12px,20.13px) rotate(7.86deg) scaleX(32.63)}39.8%{transform:translate(50.04px,19.94px) rotate(8.99deg) scaleX(32.24)}43.2%{transform:translate(51.53px,19.68px) rotate(10.83deg) scaleX(31.53)}46.6%{transform:translate(54.01px,19.35px) rotate(14.02deg) scaleX(30.17)}50.0%{transform:translate(57.9px,19.06px) rotate(19.53deg) scaleX(27.63)}53.4%{transform:translate(61.86px,19.06px) rotate(26.27deg) scaleX(24.66)}56.8%{transform:translate(64.44px,19.2px) rotate(31.72deg) scaleX(22.56)}60.2%{transform:translate(66.01px,19.35px) rotate(35.63deg) scaleX(21.25)}63.5%{transform:translate(66.99px,19.46px) rotate(38.37deg) scaleX(20.42)}66.9%{transform:translate(67.61px,19.55px) rotate(40.22deg) scaleX(19.91)}70.3%{transform:translate(67.98px,19.6px) rotate(41.38deg) scaleX(19.6)}73.7%{transform:translate(68.17px,19.63px) rotate(42deg) scaleX(19.44)}77.1%,100%{transform:translate(68.22px,19.64px) rotate(42.19deg) scaleX(19.39)}}
|
|
28
|
+
@keyframes gesture-rotate-e1{0%,22.9%{transform:translate(80.82px,24.11px) rotate(122.38deg) scaleX(16.43)}26.3%{transform:translate(80.85px,24.13px) rotate(122.63deg) scaleX(16.47)}29.7%{transform:translate(80.95px,24.2px) rotate(123.5deg) scaleX(16.59)}33.1%{transform:translate(81.14px,24.35px) rotate(125.12deg) scaleX(16.84)}36.4%{transform:translate(81.44px,24.59px) rotate(127.71deg) scaleX(17.26)}39.8%{transform:translate(81.88px,24.98px) rotate(131.54deg) scaleX(17.98)}43.2%{transform:translate(82.5px,25.6px) rotate(136.98deg) scaleX(19.19)}46.6%{transform:translate(83.28px,26.65px) rotate(144.42deg) scaleX(21.26)}50.0%{transform:translate(83.95px,28.3px) rotate(153.27deg) scaleX(24.47)}53.4%{transform:translate(83.97px,29.97px) rotate(160.11deg) scaleX(27.46)}56.8%{transform:translate(83.63px,31.06px) rotate(163.88deg) scaleX(29.21)}60.2%{transform:translate(83.28px,31.73px) rotate(166.01deg) scaleX(30.18)}63.5%{transform:translate(83px,32.14px) rotate(167.29deg) scaleX(30.75)}66.9%{transform:translate(82.81px,32.4px) rotate(168.07deg) scaleX(31.08)}70.3%{transform:translate(82.68px,32.56px) rotate(168.54deg) scaleX(31.28)}73.7%{transform:translate(82.61px,32.64px) rotate(168.78deg) scaleX(31.38)}77.1%,100%{transform:translate(82.59px,32.66px) rotate(168.85deg) scaleX(31.41)}}
|
|
29
|
+
@keyframes gesture-rotate-e2{0%,22.9%{transform:translate(72.02px,37.98px) rotate(-173.54deg) scaleX(33.05)}26.3%{transform:translate(71.97px,38px) rotate(-173.48deg) scaleX(33.03)}29.7%{transform:translate(71.79px,38.04px) rotate(-173.26deg) scaleX(32.97)}33.1%{transform:translate(71.45px,38.12px) rotate(-172.84deg) scaleX(32.85)}36.4%{transform:translate(70.88px,38.25px) rotate(-172.14deg) scaleX(32.63)}39.8%{transform:translate(69.96px,38.43px) rotate(-171.01deg) scaleX(32.24)}43.2%{transform:translate(68.47px,38.69px) rotate(-169.17deg) scaleX(31.53)}46.6%{transform:translate(65.99px,39.03px) rotate(-165.98deg) scaleX(30.17)}50.0%{transform:translate(62.1px,39.31px) rotate(-160.47deg) scaleX(27.63)}53.4%{transform:translate(58.14px,39.32px) rotate(-153.73deg) scaleX(24.66)}56.8%{transform:translate(55.56px,39.17px) rotate(-148.28deg) scaleX(22.56)}60.2%{transform:translate(53.99px,39.02px) rotate(-144.37deg) scaleX(21.25)}63.5%{transform:translate(53.01px,38.91px) rotate(-141.63deg) scaleX(20.42)}66.9%{transform:translate(52.39px,38.82px) rotate(-139.78deg) scaleX(19.91)}70.3%{transform:translate(52.02px,38.77px) rotate(-138.62deg) scaleX(19.6)}73.7%{transform:translate(51.83px,38.74px) rotate(-138deg) scaleX(19.44)}77.1%,100%{transform:translate(51.78px,38.73px) rotate(-137.81deg) scaleX(19.39)}}
|
|
30
|
+
@keyframes gesture-rotate-e3{0%,22.9%{transform:translate(39.18px,34.27px) rotate(-57.62deg) scaleX(16.43)}26.3%{transform:translate(39.15px,34.24px) rotate(-57.37deg) scaleX(16.47)}29.7%{transform:translate(39.05px,34.17px) rotate(-56.5deg) scaleX(16.59)}33.1%{transform:translate(38.86px,34.03px) rotate(-54.88deg) scaleX(16.84)}36.4%{transform:translate(38.56px,33.78px) rotate(-52.29deg) scaleX(17.26)}39.8%{transform:translate(38.12px,33.39px) rotate(-48.46deg) scaleX(17.98)}43.2%{transform:translate(37.5px,32.77px) rotate(-43.02deg) scaleX(19.19)}46.6%{transform:translate(36.72px,31.72px) rotate(-35.58deg) scaleX(21.26)}50.0%{transform:translate(36.05px,30.07px) rotate(-26.73deg) scaleX(24.47)}53.4%{transform:translate(36.03px,28.4px) rotate(-19.89deg) scaleX(27.46)}56.8%{transform:translate(36.37px,27.31px) rotate(-16.12deg) scaleX(29.21)}60.2%{transform:translate(36.72px,26.65px) rotate(-13.99deg) scaleX(30.18)}63.5%{transform:translate(37px,26.23px) rotate(-12.71deg) scaleX(30.75)}66.9%{transform:translate(37.19px,25.97px) rotate(-11.93deg) scaleX(31.08)}70.3%{transform:translate(37.32px,25.82px) rotate(-11.46deg) scaleX(31.28)}73.7%{transform:translate(37.39px,25.73px) rotate(-11.22deg) scaleX(31.38)}77.1%,100%{transform:translate(37.41px,25.71px) rotate(-11.15deg) scaleX(31.41)}}
|
|
31
|
+
@keyframes gesture-rotate-e4{0%,22.9%{transform:translate(39.18px,34.27px) rotate(90deg) scaleX(30.81)}26.3%{transform:translate(39.15px,34.24px) rotate(90deg) scaleX(30.81)}29.7%{transform:translate(39.05px,34.17px) rotate(90deg) scaleX(30.81)}33.1%{transform:translate(38.86px,34.03px) rotate(90deg) scaleX(30.81)}36.4%{transform:translate(38.56px,33.78px) rotate(90deg) scaleX(30.81)}39.8%{transform:translate(38.12px,33.39px) rotate(90deg) scaleX(30.81)}43.2%{transform:translate(37.5px,32.77px) rotate(90deg) scaleX(30.81)}46.6%{transform:translate(36.72px,31.72px) rotate(90deg) scaleX(30.81)}50.0%{transform:translate(36.05px,30.07px) rotate(90deg) scaleX(30.81)}53.4%{transform:translate(36.03px,28.4px) rotate(90deg) scaleX(30.81)}56.8%{transform:translate(36.37px,27.31px) rotate(90deg) scaleX(30.81)}60.2%{transform:translate(36.72px,26.65px) rotate(90deg) scaleX(30.81)}63.5%{transform:translate(37px,26.23px) rotate(90deg) scaleX(30.81)}66.9%{transform:translate(37.19px,25.97px) rotate(90deg) scaleX(30.81)}70.3%{transform:translate(37.32px,25.82px) rotate(90deg) scaleX(30.81)}73.7%{transform:translate(37.39px,25.73px) rotate(90deg) scaleX(30.81)}77.1%,100%{transform:translate(37.41px,25.71px) rotate(90deg) scaleX(30.81)}}
|
|
32
|
+
@keyframes gesture-rotate-e5{0%,22.9%{transform:translate(72.02px,37.98px) rotate(90deg) scaleX(30.81)}26.3%{transform:translate(71.97px,38px) rotate(90deg) scaleX(30.81)}29.7%{transform:translate(71.79px,38.04px) rotate(90deg) scaleX(30.81)}33.1%{transform:translate(71.45px,38.12px) rotate(90deg) scaleX(30.81)}36.4%{transform:translate(70.88px,38.25px) rotate(90deg) scaleX(30.81)}39.8%{transform:translate(69.96px,38.43px) rotate(90deg) scaleX(30.81)}43.2%{transform:translate(68.47px,38.69px) rotate(90deg) scaleX(30.81)}46.6%{transform:translate(65.99px,39.03px) rotate(90deg) scaleX(30.81)}50.0%{transform:translate(62.1px,39.31px) rotate(90deg) scaleX(30.81)}53.4%{transform:translate(58.14px,39.32px) rotate(90deg) scaleX(30.81)}56.8%{transform:translate(55.56px,39.17px) rotate(90deg) scaleX(30.81)}60.2%{transform:translate(53.99px,39.02px) rotate(90deg) scaleX(30.81)}63.5%{transform:translate(53.01px,38.91px) rotate(90deg) scaleX(30.81)}66.9%{transform:translate(52.39px,38.82px) rotate(90deg) scaleX(30.81)}70.3%{transform:translate(52.02px,38.77px) rotate(90deg) scaleX(30.81)}73.7%{transform:translate(51.83px,38.74px) rotate(90deg) scaleX(30.81)}77.1%,100%{transform:translate(51.78px,38.73px) rotate(90deg) scaleX(30.81)}}
|
|
33
|
+
@keyframes gesture-rotate-e6{0%,22.9%{transform:translate(80.82px,24.11px) rotate(90deg) scaleX(30.81)}26.3%{transform:translate(80.85px,24.13px) rotate(90deg) scaleX(30.81)}29.7%{transform:translate(80.95px,24.2px) rotate(90deg) scaleX(30.81)}33.1%{transform:translate(81.14px,24.35px) rotate(90deg) scaleX(30.81)}36.4%{transform:translate(81.44px,24.59px) rotate(90deg) scaleX(30.81)}39.8%{transform:translate(81.88px,24.98px) rotate(90deg) scaleX(30.81)}43.2%{transform:translate(82.5px,25.6px) rotate(90deg) scaleX(30.81)}46.6%{transform:translate(83.28px,26.65px) rotate(90deg) scaleX(30.81)}50.0%{transform:translate(83.95px,28.3px) rotate(90deg) scaleX(30.81)}53.4%{transform:translate(83.97px,29.97px) rotate(90deg) scaleX(30.81)}56.8%{transform:translate(83.63px,31.06px) rotate(90deg) scaleX(30.81)}60.2%{transform:translate(83.28px,31.73px) rotate(90deg) scaleX(30.81)}63.5%{transform:translate(83px,32.14px) rotate(90deg) scaleX(30.81)}66.9%{transform:translate(82.81px,32.4px) rotate(90deg) scaleX(30.81)}70.3%{transform:translate(82.68px,32.56px) rotate(90deg) scaleX(30.81)}73.7%{transform:translate(82.61px,32.64px) rotate(90deg) scaleX(30.81)}77.1%,100%{transform:translate(82.59px,32.66px) rotate(90deg) scaleX(30.81)}}
|
|
34
|
+
@keyframes gesture-rotate-e7{0%,22.9%{transform:translate(39.18px,65.08px) rotate(6.46deg) scaleX(33.05)}26.3%{transform:translate(39.15px,65.06px) rotate(6.52deg) scaleX(33.03)}29.7%{transform:translate(39.05px,64.98px) rotate(6.74deg) scaleX(32.97)}33.1%{transform:translate(38.86px,64.84px) rotate(7.16deg) scaleX(32.85)}36.4%{transform:translate(38.56px,64.6px) rotate(7.86deg) scaleX(32.63)}39.8%{transform:translate(38.12px,64.21px) rotate(8.99deg) scaleX(32.24)}43.2%{transform:translate(37.5px,63.58px) rotate(10.83deg) scaleX(31.53)}46.6%{transform:translate(36.72px,62.53px) rotate(14.02deg) scaleX(30.17)}50.0%{transform:translate(36.05px,60.89px) rotate(19.53deg) scaleX(27.63)}53.4%{transform:translate(36.03px,59.22px) rotate(26.27deg) scaleX(24.66)}56.8%{transform:translate(36.37px,58.12px) rotate(31.72deg) scaleX(22.56)}60.2%{transform:translate(36.72px,57.46px) rotate(35.63deg) scaleX(21.25)}63.5%{transform:translate(37px,57.05px) rotate(38.37deg) scaleX(20.42)}66.9%{transform:translate(37.19px,56.79px) rotate(40.22deg) scaleX(19.91)}70.3%{transform:translate(37.32px,56.63px) rotate(41.38deg) scaleX(19.6)}73.7%{transform:translate(37.39px,56.55px) rotate(42deg) scaleX(19.44)}77.1%,100%{transform:translate(37.41px,56.52px) rotate(42.19deg) scaleX(19.39)}}
|
|
35
|
+
@keyframes gesture-rotate-e8{0%,22.9%{transform:translate(72.02px,68.8px) rotate(-57.62deg) scaleX(16.43)}26.3%{transform:translate(71.97px,68.81px) rotate(-57.37deg) scaleX(16.47)}29.7%{transform:translate(71.79px,68.85px) rotate(-56.5deg) scaleX(16.59)}33.1%{transform:translate(71.45px,68.93px) rotate(-54.88deg) scaleX(16.84)}36.4%{transform:translate(70.88px,69.06px) rotate(-52.29deg) scaleX(17.26)}39.8%{transform:translate(69.96px,69.25px) rotate(-48.46deg) scaleX(17.98)}43.2%{transform:translate(68.47px,69.51px) rotate(-43.02deg) scaleX(19.19)}46.6%{transform:translate(65.99px,69.84px) rotate(-35.58deg) scaleX(21.26)}50.0%{transform:translate(62.1px,70.12px) rotate(-26.73deg) scaleX(24.47)}53.4%{transform:translate(58.14px,70.13px) rotate(-19.89deg) scaleX(27.46)}56.8%{transform:translate(55.56px,69.99px) rotate(-16.12deg) scaleX(29.21)}60.2%{transform:translate(53.99px,69.84px) rotate(-13.99deg) scaleX(30.18)}63.5%{transform:translate(53.01px,69.72px) rotate(-12.71deg) scaleX(30.75)}66.9%{transform:translate(52.39px,69.64px) rotate(-11.93deg) scaleX(31.08)}70.3%{transform:translate(52.02px,69.59px) rotate(-11.46deg) scaleX(31.28)}73.7%{transform:translate(51.83px,69.56px) rotate(-11.22deg) scaleX(31.38)}77.1%,100%{transform:translate(51.78px,69.55px) rotate(-11.15deg) scaleX(31.41)}}
|
|
36
|
+
@keyframes gesture-rotate-vTbl{0%,22.9%{transform:translate(47.98px,20.39px)}26.3%{transform:translate(48.03px,20.37px)}29.7%{transform:translate(48.21px,20.33px)}33.1%{transform:translate(48.55px,20.25px)}36.4%{transform:translate(49.12px,20.13px)}39.8%{transform:translate(50.04px,19.94px)}43.2%{transform:translate(51.53px,19.68px)}46.6%{transform:translate(54.01px,19.35px)}50.0%{transform:translate(57.9px,19.06px)}53.4%{transform:translate(61.86px,19.06px)}56.8%{transform:translate(64.44px,19.2px)}60.2%{transform:translate(66.01px,19.35px)}63.5%{transform:translate(66.99px,19.46px)}66.9%{transform:translate(67.61px,19.55px)}70.3%{transform:translate(67.98px,19.6px)}73.7%{transform:translate(68.17px,19.63px)}77.1%,100%{transform:translate(68.22px,19.64px)}}
|
|
37
|
+
@keyframes gesture-rotate-vTbr{0%,22.9%{transform:translate(80.82px,24.11px)}26.3%{transform:translate(80.85px,24.13px)}29.7%{transform:translate(80.95px,24.2px)}33.1%{transform:translate(81.14px,24.35px)}36.4%{transform:translate(81.44px,24.59px)}39.8%{transform:translate(81.88px,24.98px)}43.2%{transform:translate(82.5px,25.6px)}46.6%{transform:translate(83.28px,26.65px)}50.0%{transform:translate(83.95px,28.3px)}53.4%{transform:translate(83.97px,29.97px)}56.8%{transform:translate(83.63px,31.06px)}60.2%{transform:translate(83.28px,31.73px)}63.5%{transform:translate(83px,32.14px)}66.9%{transform:translate(82.81px,32.4px)}70.3%{transform:translate(82.68px,32.56px)}73.7%{transform:translate(82.61px,32.64px)}77.1%,100%{transform:translate(82.59px,32.66px)}}
|
|
38
|
+
@keyframes gesture-rotate-vTfl{0%,22.9%{transform:translate(39.18px,34.27px)}26.3%{transform:translate(39.15px,34.24px)}29.7%{transform:translate(39.05px,34.17px)}33.1%{transform:translate(38.86px,34.03px)}36.4%{transform:translate(38.56px,33.78px)}39.8%{transform:translate(38.12px,33.39px)}43.2%{transform:translate(37.5px,32.77px)}46.6%{transform:translate(36.72px,31.72px)}50.0%{transform:translate(36.05px,30.07px)}53.4%{transform:translate(36.03px,28.4px)}56.8%{transform:translate(36.37px,27.31px)}60.2%{transform:translate(36.72px,26.65px)}63.5%{transform:translate(37px,26.23px)}66.9%{transform:translate(37.19px,25.97px)}70.3%{transform:translate(37.32px,25.82px)}73.7%{transform:translate(37.39px,25.73px)}77.1%,100%{transform:translate(37.41px,25.71px)}}
|
|
39
|
+
@keyframes gesture-rotate-vTfr{0%,22.9%{transform:translate(72.02px,37.98px)}26.3%{transform:translate(71.97px,38px)}29.7%{transform:translate(71.79px,38.04px)}33.1%{transform:translate(71.45px,38.12px)}36.4%{transform:translate(70.88px,38.25px)}39.8%{transform:translate(69.96px,38.43px)}43.2%{transform:translate(68.47px,38.69px)}46.6%{transform:translate(65.99px,39.03px)}50.0%{transform:translate(62.1px,39.31px)}53.4%{transform:translate(58.14px,39.32px)}56.8%{transform:translate(55.56px,39.17px)}60.2%{transform:translate(53.99px,39.02px)}63.5%{transform:translate(53.01px,38.91px)}66.9%{transform:translate(52.39px,38.82px)}70.3%{transform:translate(52.02px,38.77px)}73.7%{transform:translate(51.83px,38.74px)}77.1%,100%{transform:translate(51.78px,38.73px)}}
|
|
40
|
+
@keyframes gesture-rotate-vBfl{0%,22.9%{transform:translate(39.18px,65.08px)}26.3%{transform:translate(39.15px,65.06px)}29.7%{transform:translate(39.05px,64.98px)}33.1%{transform:translate(38.86px,64.84px)}36.4%{transform:translate(38.56px,64.6px)}39.8%{transform:translate(38.12px,64.21px)}43.2%{transform:translate(37.5px,63.58px)}46.6%{transform:translate(36.72px,62.53px)}50.0%{transform:translate(36.05px,60.89px)}53.4%{transform:translate(36.03px,59.22px)}56.8%{transform:translate(36.37px,58.12px)}60.2%{transform:translate(36.72px,57.46px)}63.5%{transform:translate(37px,57.05px)}66.9%{transform:translate(37.19px,56.79px)}70.3%{transform:translate(37.32px,56.63px)}73.7%{transform:translate(37.39px,56.55px)}77.1%,100%{transform:translate(37.41px,56.52px)}}
|
|
41
|
+
@keyframes gesture-rotate-vBfr{0%,22.9%{transform:translate(72.02px,68.8px)}26.3%{transform:translate(71.97px,68.81px)}29.7%{transform:translate(71.79px,68.85px)}33.1%{transform:translate(71.45px,68.93px)}36.4%{transform:translate(70.88px,69.06px)}39.8%{transform:translate(69.96px,69.25px)}43.2%{transform:translate(68.47px,69.51px)}46.6%{transform:translate(65.99px,69.84px)}50.0%{transform:translate(62.1px,70.12px)}53.4%{transform:translate(58.14px,70.13px)}56.8%{transform:translate(55.56px,69.99px)}60.2%{transform:translate(53.99px,69.84px)}63.5%{transform:translate(53.01px,69.72px)}66.9%{transform:translate(52.39px,69.64px)}70.3%{transform:translate(52.02px,69.59px)}73.7%{transform:translate(51.83px,69.56px)}77.1%,100%{transform:translate(51.78px,69.55px)}}
|
|
42
|
+
@keyframes gesture-rotate-vBbr{0%,22.9%{transform:translate(80.82px,54.92px)}26.3%{transform:translate(80.85px,54.94px)}29.7%{transform:translate(80.95px,55.02px)}33.1%{transform:translate(81.14px,55.16px)}36.4%{transform:translate(81.44px,55.4px)}39.8%{transform:translate(81.88px,55.79px)}43.2%{transform:translate(82.5px,56.42px)}46.6%{transform:translate(83.28px,57.47px)}50.0%{transform:translate(83.95px,59.11px)}53.4%{transform:translate(83.97px,60.78px)}56.8%{transform:translate(83.63px,61.88px)}60.2%{transform:translate(83.28px,62.54px)}63.5%{transform:translate(83px,62.95px)}66.9%{transform:translate(82.81px,63.21px)}70.3%{transform:translate(82.68px,63.37px)}73.7%{transform:translate(82.61px,63.45px)}77.1%,100%{transform:translate(82.59px,63.48px)}}
|
|
43
|
+
@keyframes gesture-rotate-finger{0%,10.4%{opacity:0;transform:translate(18px,6px);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}22.9%{opacity:1;transform:translate(18px,0)}26.3%{opacity:1;transform:translate(17.9px,0)}29.7%{opacity:1;transform:translate(17.55px,0)}33.1%{opacity:1;transform:translate(16.88px,0)}36.4%{opacity:1;transform:translate(15.77px,0)}39.8%{opacity:1;transform:translate(14.02px,0)}43.2%{opacity:1;transform:translate(11.26px,0)}46.6%{opacity:1;transform:translate(6.79px,0)}50.0%{opacity:1;transform:translate(0px,0)}53.4%{opacity:1;transform:translate(-6.79px,0)}56.8%{opacity:1;transform:translate(-11.26px,0)}60.2%{opacity:1;transform:translate(-14.02px,0)}63.5%{opacity:1;transform:translate(-15.77px,0)}66.9%{opacity:1;transform:translate(-16.88px,0)}70.3%{opacity:1;transform:translate(-17.55px,0)}73.7%{opacity:1;transform:translate(-17.9px,0)}77.1%{opacity:1;transform:translate(-18px,0);animation-timing-function:cubic-bezier(.5,0,.75,0)}89.6%,100%{opacity:0;transform:translate(-18px,6px)}}
|
|
44
|
+
.gesture-rotate__ring{transform-box:fill-box;transform-origin:center;animation:gesture-rotate-ring 2.4s infinite alternate both}
|
|
45
|
+
@keyframes gesture-rotate-ring{0%,10.4%{transform:scale(.4);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}22.9%,77.1%{transform:scale(1);animation-timing-function:ease-out}89.6%,100%{transform:scale(1.6)}}
|
|
46
|
+
@media (prefers-reduced-motion:reduce){
|
|
47
|
+
.gesture-rotate__m,.gesture-rotate__finger{animation:none}
|
|
48
|
+
.gesture-rotate__finger{opacity:1;transform:none}
|
|
49
|
+
.gesture-rotate__ring{animation:none;transform:none}
|
|
50
|
+
.gesture-rotate__top{transform:translate(36.05px,30.07px) rotate(19.53deg) skewX(-43.74deg) scale(27.63,-17.68)}
|
|
51
|
+
.gesture-rotate__front{transform:translate(36.05px,60.89px) rotate(19.53deg) skewX(19.53deg) scale(27.63,-29.04)}
|
|
52
|
+
.gesture-rotate__right{transform:translate(62.1px,70.12px) rotate(-26.73deg) skewX(-26.73deg) scale(24.47,-27.52)}
|
|
53
|
+
.gesture-rotate__e0{transform:translate(57.9px,19.06px) rotate(19.53deg) scaleX(27.63)}
|
|
54
|
+
.gesture-rotate__e1{transform:translate(83.95px,28.3px) rotate(153.27deg) scaleX(24.47)}
|
|
55
|
+
.gesture-rotate__e2{transform:translate(62.1px,39.31px) rotate(-160.47deg) scaleX(27.63)}
|
|
56
|
+
.gesture-rotate__e3{transform:translate(36.05px,30.07px) rotate(-26.73deg) scaleX(24.47)}
|
|
57
|
+
.gesture-rotate__e4{transform:translate(36.05px,30.07px) rotate(90deg) scaleX(30.81)}
|
|
58
|
+
.gesture-rotate__e5{transform:translate(62.1px,39.31px) rotate(90deg) scaleX(30.81)}
|
|
59
|
+
.gesture-rotate__e6{transform:translate(83.95px,28.3px) rotate(90deg) scaleX(30.81)}
|
|
60
|
+
.gesture-rotate__e7{transform:translate(36.05px,60.89px) rotate(19.53deg) scaleX(27.63)}
|
|
61
|
+
.gesture-rotate__e8{transform:translate(62.1px,70.12px) rotate(-26.73deg) scaleX(24.47)}
|
|
62
|
+
.gesture-rotate__vTbl{transform:translate(57.9px,19.06px)}
|
|
63
|
+
.gesture-rotate__vTbr{transform:translate(83.95px,28.3px)}
|
|
64
|
+
.gesture-rotate__vTfl{transform:translate(36.05px,30.07px)}
|
|
65
|
+
.gesture-rotate__vTfr{transform:translate(62.1px,39.31px)}
|
|
66
|
+
.gesture-rotate__vBfl{transform:translate(36.05px,60.89px)}
|
|
67
|
+
.gesture-rotate__vBfr{transform:translate(62.1px,70.12px)}
|
|
68
|
+
.gesture-rotate__vBbr{transform:translate(83.95px,59.11px)}
|
|
69
|
+
}
|
|
70
|
+
</style>
|
|
71
|
+
|
|
72
|
+
<ellipse cx="60" cy="60" rx="29.04" ry="12.27" fill="none" stroke="#fff" stroke-opacity=".4" stroke-width="1.5"/>
|
|
73
|
+
<path class="gesture-rotate__m gesture-rotate__top" d="M0 0H1V1H0Z" fill="#5E5F68"/>
|
|
74
|
+
<path class="gesture-rotate__m gesture-rotate__front" d="M0 0H1V1H0Z" fill="#45464E"/>
|
|
75
|
+
<path class="gesture-rotate__m gesture-rotate__right" d="M0 0H1V1H0Z" fill="#33343B"/>
|
|
76
|
+
<g stroke="#F4F5F8" stroke-width="2.75" fill="none">
|
|
77
|
+
<path class="gesture-rotate__m gesture-rotate__e0" d="M0 0H1"/>
|
|
78
|
+
<path class="gesture-rotate__m gesture-rotate__e1" d="M0 0H1"/>
|
|
79
|
+
<path class="gesture-rotate__m gesture-rotate__e2" d="M0 0H1"/>
|
|
80
|
+
<path class="gesture-rotate__m gesture-rotate__e3" d="M0 0H1"/>
|
|
81
|
+
<path class="gesture-rotate__m gesture-rotate__e4" d="M0 0H1"/>
|
|
82
|
+
<path class="gesture-rotate__m gesture-rotate__e5" d="M0 0H1"/>
|
|
83
|
+
<path class="gesture-rotate__m gesture-rotate__e6" d="M0 0H1"/>
|
|
84
|
+
<path class="gesture-rotate__m gesture-rotate__e7" d="M0 0H1"/>
|
|
85
|
+
<path class="gesture-rotate__m gesture-rotate__e8" d="M0 0H1"/>
|
|
86
|
+
</g>
|
|
87
|
+
<g fill="#F4F5F8">
|
|
88
|
+
<circle class="gesture-rotate__m gesture-rotate__vTbl" r="1.375"/>
|
|
89
|
+
<circle class="gesture-rotate__m gesture-rotate__vTbr" r="1.375"/>
|
|
90
|
+
<circle class="gesture-rotate__m gesture-rotate__vTfl" r="1.375"/>
|
|
91
|
+
<circle class="gesture-rotate__m gesture-rotate__vTfr" r="1.375"/>
|
|
92
|
+
<circle class="gesture-rotate__m gesture-rotate__vBfl" r="1.375"/>
|
|
93
|
+
<circle class="gesture-rotate__m gesture-rotate__vBfr" r="1.375"/>
|
|
94
|
+
<circle class="gesture-rotate__m gesture-rotate__vBbr" r="1.375"/>
|
|
95
|
+
</g>
|
|
96
|
+
<g class="gesture-rotate__finger">
|
|
97
|
+
<circle class="gesture-rotate__ring" cx="60" cy="-2" r="9" fill="#fff" stroke="#5B6BFF" stroke-opacity=".6" stroke-width="2"/>
|
|
98
|
+
<circle cx="60" cy="-2" r="5.5" fill="#5B6BFF"/>
|
|
99
|
+
</g>
|
|
100
|
+
</svg>
|