small feat: svg animation for servers, codebuild, codePipleline etc...

docker/Dockerfile

@@ -7,6 +7,7 @@ COPY packages/api/package.json packages/api/package.json
 COPY packages/frontend/package.json packages/frontend/package.json
 RUN pnpm install --frozen-lockfile --filter @floci/frontend
 COPY packages/frontend/ packages/frontend/
+COPY svgAsset/ svgAsset/
 COPY aws-icons-svg/ aws-icons-svg/
 COPY TheCloud.png TheCloud.png
 COPY OS_img/ OS_img/

packages/api/src/adapter-aws/AwsComputeAdapter.test.ts

@@ -127,6 +127,7 @@ describe('AwsComputeAdapter', () => {
             securityGroupIds: 'sg-111, sg-222',
             rootVolumeSize: '30',
             rootVolumeType: 'gp3',
+            userData: '#!/bin/bash\necho ready',
         }})
         expect(launched).toHaveLength(1)
         expect(launched[0].name).toBe('test-box')
@@ -135,6 +136,7 @@ describe('AwsComputeAdapter', () => {
         expect(launched[0].securityGroupIds).toEqual(['sg-111', 'sg-222'])
         expect(launched[0].rootVolumeSize).toBe(30)
         expect(launched[0].rootVolumeType).toBe('gp3')
+        expect(launched[0].userData).toBe('#!/bin/bash\necho ready')
         expect(result.type).toBe('instance')
         expect(result.cloud).toBe('aws')
     })

packages/api/src/adapter-aws/AwsComputeAdapter.ts

@@ -56,6 +56,7 @@ export class AwsComputeAdapter implements CloudServiceAdapter {
             securityGroupIds,
             rootVolumeSize,
             rootVolumeType: v.rootVolumeType ? String(v.rootVolumeType) : undefined,
+            userData: typeof v.userData === 'string' && v.userData.trim() ? v.userData : undefined,
         }
         const instance = await this.service_.runInstance(runInput)
         return instanceToResource(instance)

packages/frontend/src/components/CodeBuildPanel.test.tsx

@@ -1,19 +1,21 @@
 import {QueryClient, QueryClientProvider} from '@tanstack/react-query'
 import {render, screen} from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import {expect, test, vi} from 'vitest'
+import {beforeEach, expect, test, vi} from 'vitest'
 import {parse} from 'yaml'
 import {CodeBuildPanel, DEFAULT_BUILDSPEC} from './CodeBuildPanel'
 import type {CloudResource} from '@/types/resource'
 
-vi.mock('@/api/cloudProxyClient', () => ({
+const api = vi.hoisted(() => ({getCodeBuild: vi.fn(), listCodeBuilds: vi.fn(), startCodeBuild: vi.fn()}))
-    getCodeBuild: vi.fn(),
+vi.mock('@/api/cloudProxyClient', () => api)
-    listCodeBuilds: vi.fn().mockResolvedValue([]),
-    startCodeBuild: vi.fn(),
-}))
 
 const project: CloudResource = {id: 'orders', name: 'orders', cloud: 'aws', service: 'codebuild', type: 'codebuild-project', region: 'us-east-1', createdAt: null, metadata: {sourceType: 'NO_SOURCE', ecrRepository: 'orders'}}
 
+beforeEach(() => {
+    vi.clearAllMocks()
+    api.listCodeBuilds.mockResolvedValue([])
+})
+
 test('shows the corrected CodeDeployToECS artifact guidance and default buildspec', async () => {
     const client = new QueryClient({defaultOptions: {queries: {retry: false}}})
     const user = userEvent.setup()
@@ -26,3 +28,17 @@ test('shows the corrected CodeDeployToECS artifact guidance and default buildspe
     expect(screen.getByRole('textbox', {name: 'Buildspec override'})).toHaveValue(DEFAULT_BUILDSPEC)
     expect(parse(DEFAULT_BUILDSPEC).artifacts.files).toEqual(['imageDetail.json', 'taskdef.json', 'appspec.yaml'])
 })
+
+test('shows the configuration animation while a started build is in progress', async () => {
+    const client = new QueryClient({defaultOptions: {queries: {retry: false}}})
+    const user = userEvent.setup()
+    api.startCodeBuild.mockResolvedValue({id: 'build-1', buildNumber: 1, buildStatus: 'IN_PROGRESS', currentPhase: 'BUILD', phases: []})
+    api.getCodeBuild.mockResolvedValue({id: 'build-1', buildNumber: 1, buildStatus: 'IN_PROGRESS', currentPhase: 'BUILD', phases: []})
+    render(<QueryClientProvider client={client}><CodeBuildPanel resource={project} runtimeReachable/></QueryClientProvider>)
+
+    await user.click(screen.getByRole('button', {name: 'Start build'}))
+    await user.click(screen.getAllByRole('button', {name: 'Start build'})[1])
+
+    expect(await screen.findByRole('status')).toHaveTextContent('Build in progress')
+    expect(screen.getByRole('img', {name: 'Animated binary configuration icon'})).toBeInTheDocument()
+})

packages/frontend/src/components/CodeBuildPanel.tsx

@@ -1,6 +1,7 @@
 import {useEffect, useState} from 'react'
 import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query'
 import {ExternalLink, Play, Plus, RefreshCw, X} from 'lucide-react'
+import codeBuildAnimation from '../../../../svgAsset/CodeBuild.svg'
 import {getCodeBuild, listCodeBuilds, startCodeBuild, type CodeBuildBuild, type CodeBuildEnvironmentVariableOverride} from '@/api/cloudProxyClient'
 import {formatDateTime} from '@/lib/format'
 import type {CloudResource} from '@/types/resource'
@@ -14,12 +15,16 @@ export function CodeBuildPanel({resource, runtimeReachable}: CodeBuildPanelProps
     const [overrides, setOverrides] = useState<CodeBuildEnvironmentVariableOverride[]>([])
     const [buildspecOverride, setBuildspecOverride] = useState(() => defaultBuildspec(projectSourceType))
     const [selectedId, setSelectedId] = useState<string>()
+    const [progressBuildId, setProgressBuildId] = useState<string>()
     const enabled = Boolean(resource && runtimeReachable)
     const buildsKey = ['codebuild-builds', resource?.id]
     const builds = useQuery({queryKey: buildsKey, queryFn: ({signal}) => listCodeBuilds(resource!.id, signal), enabled, refetchInterval: (query) => query.state.data?.some((build) => active(build.buildStatus)) ? 2_000 : false})
     const detail = useQuery({queryKey: ['codebuild-build', resource?.id, selectedId], queryFn: ({signal}) => getCodeBuild(resource!.id, selectedId!, signal), enabled: enabled && Boolean(selectedId), refetchInterval: (query) => active(query.state.data?.buildStatus) ? 2_000 : false})
-    const start = useMutation({mutationFn: () => startCodeBuild(resource!.id, {environmentVariablesOverride: overrides.length ? overrides : undefined, buildspecOverride: buildspecOverride.trim() || undefined}), onSuccess: (build) => { setSelectedId(build.id); setStartOpen(false); setOverrides([]); setBuildspecOverride(defaultBuildspec(projectSourceType)); void client.invalidateQueries({queryKey: buildsKey}) }})
+    const start = useMutation({mutationFn: () => startCodeBuild(resource!.id, {environmentVariablesOverride: overrides.length ? overrides : undefined, buildspecOverride: buildspecOverride.trim() || undefined}), onSuccess: (build) => { setSelectedId(build.id); setProgressBuildId(build.id); setStartOpen(false); setOverrides([]); setBuildspecOverride(defaultBuildspec(projectSourceType)); void client.invalidateQueries({queryKey: buildsKey}) }})
-    useEffect(() => { setSelectedId(undefined); setStartOpen(false); setOverrides([]); setBuildspecOverride(defaultBuildspec(projectSourceType)) }, [resource?.id, projectSourceType])
+    useEffect(() => { setSelectedId(undefined); setProgressBuildId(undefined); setStartOpen(false); setOverrides([]); setBuildspecOverride(defaultBuildspec(projectSourceType)) }, [resource?.id, projectSourceType])
+    const progressBuild = detail.data?.id === progressBuildId ? detail.data : builds.data?.find((build) => build.id === progressBuildId)
+    const buildInProgress = Boolean(progressBuildId && (!progressBuild || active(progressBuild.buildStatus)))
+    useEffect(() => { if (progressBuildId && progressBuild && !active(progressBuild.buildStatus)) setProgressBuildId(undefined) }, [progressBuild, progressBuildId])
     if (!resource) return null
     const ecrRepository = typeof resource.metadata.ecrRepository === 'string' ? resource.metadata.ecrRepository : undefined
     const selected = detail.data ?? builds.data?.find((build) => build.id === selectedId)
@@ -28,6 +33,7 @@ export function CodeBuildPanel({resource, runtimeReachable}: CodeBuildPanelProps
         {startOpen && (
             <StartBuildDialog overrides={overrides} buildspecOverride={buildspecOverride} requiresBuildspec={projectSourceType === 'NO_SOURCE'} pending={start.isPending} error={start.error} onChange={setOverrides} onBuildspecChange={setBuildspecOverride} onCancel={() => setStartOpen(false)} onStart={() => start.mutate()}/>
         )}
+        {buildInProgress && <CodeBuildProgress build={progressBuild}/>}
         {ecrRepository && <p className="muted compact-text">Docker builds push to local ECR repository <a href={`/cloud-explorer/aws/ecr?resource=${encodeURIComponent(ecrRepository)}`}>{ecrRepository}</a>. For CodeDeployToECS, BuildOutput must include <code>imageDetail.json</code> as <code>{'{"ImageURI":"..."}'}</code>, plus <code>taskdef.json</code> and <code>appspec.yaml</code>.</p>}
         {builds.isError && <p className="error-text compact-text">{message(builds.error, 'Unable to load builds.')}</p>}
         <div className="workflow-execution-list"><div className="workflow-execution-list-heading"><h4>Build history</h4><span>{builds.data?.length ?? 0}</span></div><div className="workflow-execution-list-table"><table className="table"><thead><tr><th>Build</th><th>Status</th><th>Phase</th><th>Started</th></tr></thead><tbody>{(builds.data ?? []).map((build) => <tr key={build.id} onClick={() => setSelectedId(build.id)} style={{cursor: 'pointer'}}><td><code>#{build.buildNumber ?? build.id}</code></td><td>{build.buildStatus ?? '-'}</td><td>{build.currentPhase ?? '-'}</td><td>{formatDateTime(build.startTime) ?? '-'}</td></tr>)}</tbody></table></div>{!builds.isLoading && builds.data?.length === 0 && <p className="muted compact-text">No builds yet.</p>}</div>
@@ -35,6 +41,17 @@ export function CodeBuildPanel({resource, runtimeReachable}: CodeBuildPanelProps
     </section>
 }
 
+function CodeBuildProgress({build}: {build?: CodeBuildBuild}) {
+    return <div className="codebuild-progress" role="status" aria-live="polite">
+        <BuildConfigurationAnimation/>
+        <div><p className="eyebrow">Build in progress</p><h3>{build?.currentPhase ?? 'Preparing build environment'}</h3><p className="muted compact-text">CodeBuild is running #{build?.buildNumber ?? build?.id ?? 'new build'}. This view updates until the build succeeds or fails.</p></div>
+    </div>
+}
+
+function BuildConfigurationAnimation() {
+    return <img className="codebuild-progress-art" src={codeBuildAnimation} alt="Animated binary configuration icon"/>
+}
+
 function StartBuildDialog({overrides, buildspecOverride, requiresBuildspec, pending, error, onChange, onBuildspecChange, onCancel, onStart}: {overrides: CodeBuildEnvironmentVariableOverride[]; buildspecOverride: string; requiresBuildspec: boolean; pending: boolean; error: unknown; onChange: (values: CodeBuildEnvironmentVariableOverride[]) => void; onBuildspecChange: (value: string) => void; onCancel: () => void; onStart: () => void}) {
     return <div className="workflow-confirmation" role="dialog" aria-labelledby="start-build-title"><div className="dynamic-stage-header"><div><strong id="start-build-title">Start build</strong><p className="muted compact-text">{requiresBuildspec ? 'A buildspec override lets this no-source project run a real build.' : 'Leave the buildspec override blank to use the S3 source buildspec.'}</p></div><button className="icon-btn" type="button" aria-label="Close" disabled={pending} onClick={onCancel}><X size={14}/></button></div><label className="dynamic-field"><span>Buildspec override</span><textarea className="textarea code-textarea small" value={buildspecOverride} onChange={(event) => onBuildspecChange(event.target.value)} rows={8} spellCheck={false}/></label>{overrides.map((override, index) => <div className="input-row" key={index}><input className="input" aria-label={`Variable name ${index + 1}`} placeholder="Name" value={override.name} onChange={(event) => onChange(replace(overrides, index, {...override, name: event.target.value}))}/><input className="input" aria-label={`Variable value ${index + 1}`} placeholder="Value" value={override.value} onChange={(event) => onChange(replace(overrides, index, {...override, value: event.target.value}))}/><button className="button compact" type="button" disabled={pending} onClick={() => onChange(overrides.filter((_, item) => item !== index))}>Remove</button></div>)}<button className="button compact" type="button" disabled={pending} onClick={() => onChange([...overrides, {name: '', value: '', type: 'PLAINTEXT'}])}><Plus size={13}/>Add override</button>{Boolean(error) && <p className="error-text compact-text">{message(error, 'Unable to start build.')}</p>}<div><button className="button primary compact" type="button" disabled={pending || (requiresBuildspec && !buildspecOverride.trim()) || overrides.some((item) => !item.name.trim())} onClick={onStart}>{pending ? 'Starting' : 'Start build'}</button><button className="button compact" type="button" disabled={pending} onClick={onCancel}>Cancel</button></div></div>
 }

packages/frontend/src/components/CodeDeployPanel.tsx

@@ -1,5 +1,5 @@
 import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query'
-import {Ban, Play, RefreshCw, RotateCcw} from 'lucide-react'
+import {Ban, Box, GitBranch, Play, RefreshCw, RotateCcw, ShieldCheck, SlidersHorizontal} from 'lucide-react'
 import {useState} from 'react'
 import {getCodeDeployDependencies, listCodeDeployDeployments, startCodeDeployDeployment, stopCodeDeployDeployment, type CodeDeployDependencies} from '@/api/cloudProxyClient'
 import {formatDateTime} from '@/lib/format'
@@ -20,23 +20,43 @@ export function CodeDeployCreatePanel({isSubmitting, submitError, onCancel, onSu
     const [deploymentConfig, setDeploymentConfig] = useState('AllAtOnce')
     const [rollbackOnFailure, setRollbackOnFailure] = useState(true)
     const ecs = computePlatform === 'ECS'
-    return <form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); onSubmit({applicationName, deploymentGroupName, computePlatform, serviceRoleArn, ...(ecs ? {clusterName, serviceName, blueTargetGroupName, greenTargetGroupName, productionListenerArn} : {}), deploymentConfig, rollbackOnFailure}) }}>
+    return <form className="codedeploy-create-form" onSubmit={(event) => { event.preventDefault(); onSubmit({applicationName, deploymentGroupName, computePlatform, serviceRoleArn, ...(ecs ? {clusterName, serviceName, blueTargetGroupName, greenTargetGroupName, productionListenerArn} : {}), deploymentConfig, rollbackOnFailure}) }}>
-        <div className="dynamic-stage-header"><div><p className="eyebrow">{computePlatform} deployment</p><h3>Create application and deployment group</h3><p className="muted compact-text">The group controls the traffic-shift policy and rollback on deployment failure.</p></div></div>
+        <header className="codedeploy-form-header"><div><p className="eyebrow">{computePlatform} deployment</p><h3>Create application and deployment group</h3><p className="muted compact-text">Connect a workload, define its traffic path, and choose its rollback behavior.</p></div><span>{ecs ? 'Blue/green' : 'Lambda alias'}</span></header>
-        <label>Compute platform<select className="input" value={computePlatform} onChange={(event) => { setComputePlatform(event.target.value as 'Lambda' | 'ECS'); setDeploymentConfig('AllAtOnce') }}><option value="Lambda">Lambda</option><option value="ECS">ECS blue/green</option></select></label>
+        <section className="codedeploy-form-section">
-        <label>Application name<input className="input" required value={applicationName} onChange={(event) => setApplicationName(event.target.value)}/></label>
+            <div className="codedeploy-section-title"><SlidersHorizontal size={17}/><div><h4>Deployment identity</h4><p>Name the application and choose its execution role.</p></div></div>
-        <label>Deployment group name<input className="input" required value={deploymentGroupName} onChange={(event) => setDeploymentGroupName(event.target.value)}/></label>
+            <div className="codedeploy-form-grid">
-        <label>CodeDeploy service role ARN<input className="input" required value={serviceRoleArn} onChange={(event) => setServiceRoleArn(event.target.value)} placeholder="arn:aws:iam::000000000000:role/CodeDeployRole"/></label>
+                <label className="dynamic-field"><span>Compute platform</span><select className="input" value={computePlatform} onChange={(event) => { setComputePlatform(event.target.value as 'Lambda' | 'ECS'); setDeploymentConfig('AllAtOnce') }}><option value="Lambda">Lambda</option><option value="ECS">ECS blue/green</option></select></label>
+                <label className="dynamic-field"><span>Application name <em className="field-required">*</em></span><input className="input" required value={applicationName} onChange={(event) => setApplicationName(event.target.value)} placeholder="blue-app"/></label>
+                <label className="dynamic-field"><span>Deployment group name <em className="field-required">*</em></span><input className="input" required value={deploymentGroupName} onChange={(event) => setDeploymentGroupName(event.target.value)} placeholder="blue-app-production"/></label>
+                <label className="dynamic-field"><span>Service role ARN <em className="field-required">*</em></span><input className="input" required value={serviceRoleArn} onChange={(event) => setServiceRoleArn(event.target.value)} placeholder="arn:aws:iam::000000000000:role/codedeploy-role"/></label>
+            </div>
+        </section>
         {ecs && <>
-            <label>ECS cluster name<input className="input" required value={clusterName} onChange={(event) => setClusterName(event.target.value)}/></label>
+            <section className="codedeploy-form-section">
-            <label>ECS service name<input className="input" required value={serviceName} onChange={(event) => setServiceName(event.target.value)}/></label>
+                <div className="codedeploy-section-title"><Box size={17}/><div><h4>ECS workload</h4><p>Identify the service CodeDeploy will replace.</p></div></div>
-            <label>Blue target group name<input className="input" required value={blueTargetGroupName} onChange={(event) => setBlueTargetGroupName(event.target.value)}/></label>
+                <div className="codedeploy-form-grid">
-            <label>Green target group name<input className="input" required value={greenTargetGroupName} onChange={(event) => setGreenTargetGroupName(event.target.value)}/></label>
+                    <label className="dynamic-field"><span>Cluster name <em className="field-required">*</em></span><input className="input" required value={clusterName} onChange={(event) => setClusterName(event.target.value)} placeholder="blue-cluster"/><small>The ECS cluster containing the service.</small></label>
-            <label>Production listener ARN<input className="input" required value={productionListenerArn} onChange={(event) => setProductionListenerArn(event.target.value)} placeholder="arn:aws:elasticloadbalancing:us-east-1:000000000000:listener/app/..."/></label>
+                    <label className="dynamic-field"><span>Service name <em className="field-required">*</em></span><input className="input" required value={serviceName} onChange={(event) => setServiceName(event.target.value)} placeholder="blue-app-service"/><small>The ECS service inside that cluster.</small></label>
+                </div>
+            </section>
+            <section className="codedeploy-form-section">
+                <div className="codedeploy-section-title"><GitBranch size={17}/><div><h4>Blue/green traffic</h4><p>Connect the production listener to the current and replacement task sets.</p></div></div>
+                <div className="codedeploy-form-grid">
+                    <label className="dynamic-field codedeploy-listener-field"><span>Production listener ARN <em className="field-required">*</em></span><input className="input" required value={productionListenerArn} onChange={(event) => setProductionListenerArn(event.target.value)} placeholder="arn:aws:elasticloadbalancing:us-east-1:000000000000:listener/app/..."/><small>The listener currently receiving live application traffic.</small></label>
+                    <label className="dynamic-field codedeploy-target-card blue"><b>Blue</b><span>Current production target group <em className="field-required">*</em></span><input className="input" required value={blueTargetGroupName} onChange={(event) => setBlueTargetGroupName(event.target.value)} placeholder="blue-app-blue-tg"/><small>Receives traffic before the deployment begins.</small></label>
+                    <label className="dynamic-field codedeploy-target-card green"><b>Green</b><span>Replacement target group <em className="field-required">*</em></span><input className="input" required value={greenTargetGroupName} onChange={(event) => setGreenTargetGroupName(event.target.value)} placeholder="blue-app-green-tg"/><small>Receives the new task set during deployment.</small></label>
+                </div>
+            </section>
         </>}
-        <label>Traffic configuration<select className="input" value={deploymentConfig} onChange={(event) => setDeploymentConfig(event.target.value)}><option value="AllAtOnce">All at once</option>{ecs ? <><option value="Canary10Percent5Minutes">Canary 10% then 5 minutes</option><option value="Canary10Percent15Minutes">Canary 10% then 15 minutes</option><option value="Linear10PercentEvery1Minutes">Linear 10% every minute</option><option value="Linear10PercentEvery3Minutes">Linear 10% every 3 minutes</option></> : <><option value="Canary10Percent5Minutes">Canary 10% then 5 minutes</option><option value="Canary10Percent30Minutes">Canary 10% then 30 minutes</option><option value="Linear10PercentEvery1Minute">Linear 10% every minute</option><option value="Linear10PercentEvery10Minutes">Linear 10% every 10 minutes</option></>}</select></label>
+        <section className="codedeploy-form-section">
-        <label className="checkbox-row"><input type="checkbox" checked={rollbackOnFailure} onChange={(event) => setRollbackOnFailure(event.target.checked)}/> Roll back automatically on deployment failure</label>
+            <div className="codedeploy-section-title"><ShieldCheck size={17}/><div><h4>Deployment behavior</h4><p>Control traffic shifting and failure recovery.</p></div></div>
+            <div className="codedeploy-form-grid">
+                <label className="dynamic-field"><span>Traffic configuration</span><select className="input" value={deploymentConfig} onChange={(event) => setDeploymentConfig(event.target.value)}><option value="AllAtOnce">All at once</option>{ecs ? <><option value="Canary10Percent5Minutes">Canary 10% then 5 minutes</option><option value="Canary10Percent15Minutes">Canary 10% then 15 minutes</option><option value="Linear10PercentEvery1Minutes">Linear 10% every minute</option><option value="Linear10PercentEvery3Minutes">Linear 10% every 3 minutes</option></> : <><option value="Canary10Percent5Minutes">Canary 10% then 5 minutes</option><option value="Canary10Percent30Minutes">Canary 10% then 30 minutes</option><option value="Linear10PercentEvery1Minute">Linear 10% every minute</option><option value="Linear10PercentEvery10Minutes">Linear 10% every 10 minutes</option></>}</select></label>
+                <label className="codedeploy-rollback"><input type="checkbox" checked={rollbackOnFailure} onChange={(event) => setRollbackOnFailure(event.target.checked)}/><span><strong>Automatic rollback</strong><small>Restore the previous task set if deployment fails.</small></span></label>
+            </div>
+        </section>
         {submitError && <p className="error-text compact-text">{submitError}</p>}
-        <div className="form-actions"><button className="button" type="button" disabled={isSubmitting} onClick={onCancel}>Cancel</button><button className="button primary" type="submit" disabled={isSubmitting}>{isSubmitting ? 'Creating' : 'Create deployment group'}</button></div>
+        <footer className="codedeploy-form-actions"><button className="button" type="button" disabled={isSubmitting} onClick={onCancel}>Cancel</button><button className="button primary" type="submit" disabled={isSubmitting}>{isSubmitting ? 'Creating' : 'Create deployment group'}</button></footer>
     </form>
 }
 

packages/frontend/src/components/CodePipelinePanel.tsx

@@ -1,5 +1,7 @@
+import {useEffect, useState} from 'react'
 import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query'
 import {ExternalLink, Play, RefreshCw} from 'lucide-react'
+import pipelineReleaseAnimation from '../../../../svgAsset/Pipleline.svg'
 import {getCodePipelineState, listCodePipelineExecutions, startCodePipeline, type PipelineState} from '@/api/cloudProxyClient'
 import {formatDateTime} from '@/lib/format'
 import type {CloudResource} from '@/types/resource'
@@ -8,14 +10,20 @@ interface CodePipelinePanelProps { resource?: CloudResource; runtimeReachable: b
 
 export function CodePipelinePanel({resource, runtimeReachable}: CodePipelinePanelProps) {
     const client = useQueryClient()
+    const [releaseExecutionId, setReleaseExecutionId] = useState<string>()
     const enabled = Boolean(resource && runtimeReachable)
     const executionsKey = ['codepipeline-executions', resource?.id]
-    const executions = useQuery({queryKey: executionsKey, queryFn: ({signal}) => listCodePipelineExecutions(resource!.id, signal), enabled, refetchInterval: (query) => query.state.data?.some((execution) => active(execution.status)) ? 2_000 : false})
+    const executions = useQuery({queryKey: executionsKey, queryFn: ({signal}) => listCodePipelineExecutions(resource!.id, signal), enabled, refetchInterval: (query) => Boolean(releaseExecutionId) || query.state.data?.some((execution) => active(execution.status)) ? 2_000 : false})
-    const state = useQuery({queryKey: ['codepipeline-state', resource?.id], queryFn: ({signal}) => getCodePipelineState(resource!.id, signal), enabled, refetchInterval: (query) => query.state.data && activeState(query.state.data) ? 2_000 : false})
+    const state = useQuery({queryKey: ['codepipeline-state', resource?.id], queryFn: ({signal}) => getCodePipelineState(resource!.id, signal), enabled, refetchInterval: (query) => Boolean(releaseExecutionId) || query.state.data && activeState(query.state.data) ? 2_000 : false})
-    const start = useMutation({mutationFn: () => startCodePipeline(resource!.id), onSuccess: () => { void client.invalidateQueries({queryKey: executionsKey}); void client.invalidateQueries({queryKey: ['codepipeline-state', resource?.id]}) }})
+    const start = useMutation({mutationFn: () => startCodePipeline(resource!.id), onSuccess: ({id}) => { setReleaseExecutionId(id); void client.invalidateQueries({queryKey: executionsKey}); void client.invalidateQueries({queryKey: ['codepipeline-state', resource?.id]}) }})
+    useEffect(() => { setReleaseExecutionId(undefined) }, [resource?.id])
+    const releaseExecution = executions.data?.find((execution) => execution.id === releaseExecutionId)
+    const releaseInProgress = Boolean(releaseExecutionId && (!releaseExecution || active(releaseExecution.status)))
+    useEffect(() => { if (releaseExecutionId && releaseExecution && !active(releaseExecution.status)) setReleaseExecutionId(undefined) }, [releaseExecution, releaseExecutionId])
     if (!resource) return null
     return <section className="table-panel">
         <div className="dynamic-stage-header"><div><p className="eyebrow">Pipeline execution</p><h3>Run and inspect stages</h3><p className="muted compact-text">Local actions: S3 source, CodeBuild, and CodeDeployToECS for ECS EC2 and Fargate services.</p></div><div className="header-actions"><button className="button" type="button" disabled={!enabled || executions.isFetching || state.isFetching} onClick={() => { void executions.refetch(); void state.refetch() }}><RefreshCw size={13}/>Refresh</button><button className="button primary" type="button" disabled={!enabled || start.isPending} onClick={() => start.mutate()}><Play size={13}/>{start.isPending ? 'Starting' : 'Release change'}</button></div></div>
+        {releaseInProgress && <PipelineReleaseProgress executionId={releaseExecutionId} execution={releaseExecution}/>}
         {start.isError && <p className="error-text compact-text">{message(start.error, 'Unable to start pipeline execution.')}</p>}
         {(executions.isError || state.isError) && <p className="error-text compact-text">{message(executions.error ?? state.error, 'Unable to load pipeline execution state.')}</p>}
         <div className="workflow-execution-list"><div className="workflow-execution-list-heading"><h4>Execution history</h4><span>{executions.data?.length ?? 0}</span></div><div className="workflow-execution-list-table"><table className="table"><thead><tr><th>Execution</th><th>Status</th><th>Started</th><th>Updated</th></tr></thead><tbody>{(executions.data ?? []).map((execution) => <tr key={execution.id}><td><code>{execution.id}</code>{execution.statusSummary && <p className="muted compact-text">{execution.statusSummary}</p>}</td><td>{execution.status ?? '-'}</td><td>{formatDateTime(execution.startTime) ?? '-'}</td><td>{formatDateTime(execution.lastUpdateTime) ?? '-'}</td></tr>)}</tbody></table></div>{!executions.isLoading && executions.data?.length === 0 && <p className="muted compact-text">No executions yet.</p>}</div>
@@ -23,6 +31,17 @@ export function CodePipelinePanel({resource, runtimeReachable}: CodePipelinePane
     </section>
 }
 
+function PipelineReleaseProgress({executionId, execution}: {executionId?: string; execution?: {status?: string; statusSummary?: string}}) {
+    return <div className="pipeline-release-progress" role="status" aria-live="polite">
+        <PipelineReleaseAnimation/>
+        <div><p className="eyebrow">Release in progress</p><h3>{execution?.statusSummary || execution?.status || 'Starting pipeline execution'}</h3><p className="muted compact-text">Pipeline execution <code>{executionId}</code> is moving through source, build, and deployment stages.</p></div>
+    </div>
+}
+
+function PipelineReleaseAnimation() {
+    return <img className="pipeline-release-art" src={pipelineReleaseAnimation} alt="Animated pipeline release icon"/>
+}
+
 function PipelineTimeline({state, loading}: {state?: PipelineState; loading: boolean}) {
     if (loading) return <p className="muted compact-text">Loading stage state...</p>
     if (!state) return null

packages/frontend/src/components/ComputePanel.tsx

@@ -1,11 +1,14 @@
 import { useEffect, useState } from 'react'
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import ec2CpuAnimation from '../../../../svgAsset/animated-cpu.svg'
 import { CopyValueButton } from './CopyValueButton'
 import { ServerLaunchProgress } from './ServerLaunchProgress'
 import {
     AlertTriangle,
+    Cpu,
     HardDrive,
     Loader2,
+    Network,
     Play,
     Plus,
     Power,
@@ -13,6 +16,7 @@ import {
     RotateCcw,
     Save,
     Search,
+    Server,
     Terminal,
     Trash2,
     X,
@@ -395,7 +399,11 @@ function InstancePanel({ instanceId }: { instanceId: string }) {
         queryFn: ({ signal }) => describeEc2Instance(instanceId, signal),
         refetchInterval: (query) => {
             const state = query.state.data?.state
-            return state === 'pending' || state === 'stopping' || state === 'shutting-down' ? 1_500 : false
+            if (state === 'pending' || state === 'stopping' || state === 'shutting-down') {
+                return 1_500
+            }
+            const connection = query.state.data?.connection
+            return connection?.launchStatus === 'in-progress' || connection?.sshStatus === 'initializing' ? 5_000 : false
         },
     })
 
@@ -675,6 +683,9 @@ function InstancePanel({ instanceId }: { instanceId: string }) {
                         const failure = typeof connection.failure === 'string'
                             ? connection.failure
                             : connection.failure?.message
+                        const launchPending = connection.launchStatus === 'in-progress'
+                        const sshPending = connection.sshStatus === 'initializing'
+                        const keyInjected = connection.keyInjectionStatus === 'succeeded' || connection.keyInjectionStatus === 'ok'
                         return <div className="ec2-connect-panel">
                             {!canCheckSsh && <div className="ec2-connection-notice">
                                 {state === 'terminated'
@@ -685,17 +696,17 @@ function InstancePanel({ instanceId }: { instanceId: string }) {
                             </div>}
                             <div className="ec2-readiness-grid">
                                 <div className="ec2-readiness-card">
-                                    <span>Launch</span>
+                                    <div className="ec2-readiness-heading"><span>Launch</span><LaunchGear active={launchPending}/></div>
                                     <strong className={connection.launchStatus === 'failed' ? 'error' : ''}>{connection.launchStatus ?? 'unknown'}</strong>
                                     <small>{connection.selectedImageReference ?? 'No selected image recorded'}</small>
                                 </div>
                                 <div className="ec2-readiness-card">
-                                    <span>SSH readiness</span>
+                                    <div className="ec2-readiness-heading"><span>SSH readiness</span><SshHeartbeat active={sshPending}/></div>
                                     <strong className={connection.sshStatus === 'impaired' ? 'error' : ''}>{connection.sshStatus ?? 'unknown'}</strong>
                                     <small>{connection.sshStatusMessage ?? 'No readiness result recorded'}</small>
                                 </div>
                                 <div className="ec2-readiness-card">
-                                    <span>Key injection</span>
+                                    <div className="ec2-readiness-heading"><span>Key injection</span>{keyInjected && <KeyInjectionReady/>}</div>
                                     <strong>{connection.keyInjectionStatus ?? (inst.keyName ? 'unknown' : 'not requested')}</strong>
                                     <small>{inst.keyName ?? 'No key pair selected'}</small>
                                 </div>
@@ -771,6 +782,29 @@ function InstancePanel({ instanceId }: { instanceId: string }) {
     )
 }
 
+function LaunchGear({active}: {active: boolean}) {
+    return <img className={`ec2-launch-cpu${active ? ' active' : ''}`} src={ec2CpuAnimation} alt="Animated instance CPU"/>
+}
+
+function SshHeartbeat({active}: {active: boolean}) {
+    return <svg className={`ec2-ssh-heartbeat${active ? ' active' : ''}`} viewBox="0 0 100 32" aria-hidden="true">
+        <path d="M2 17h16l6-11 9 22 10-17 6 6h49"/>
+    </svg>
+}
+
+function KeyInjectionReady() {
+    return <svg className="ec2-key-ready" viewBox="0 0 150 150" aria-label="Key injected">
+        <rect x="12" y="13" width="126" height="125" rx="9" fill="#f4f1f7" stroke="#19152d" strokeWidth="3"/>
+        <path d="M12 33V22a9 9 0 0 1 9-9h108a9 9 0 0 1 9 9v11Z" fill="#393044"/>
+        <circle cx="24" cy="23" r="3" fill="#ff5a36"/><circle cx="35" cy="23" r="3" fill="#ffc33a"/><circle cx="46" cy="23" r="3" fill="#62c9aa"/>
+        <path d="M63 62v-6c0-7 5-11 12-11s12 4 12 11v6" fill="none" stroke="#19152d" strokeWidth="2.6"/>
+        <path d="M57 62h36v17c0 6-5 10-10 10H67c-5 0-10-4-10-10Z" fill="#ffc33a" stroke="#19152d" strokeWidth="2.6"/>
+        <path d="M75 71v7" stroke="#19152d" strokeWidth="2.6" strokeLinecap="round"/>
+        <rect x="34" y="100" width="79" height="24" rx="12" fill="#45b5fa" stroke="#19152d" strokeWidth="2.6"/>
+        <circle cx="51" cy="112" r="1.8" fill="#19152d"/><circle cx="66" cy="112" r="1.8" fill="#19152d"/><circle cx="81" cy="112" r="1.8" fill="#19152d"/><circle cx="96" cy="112" r="1.8" fill="#19152d"/>
+    </svg>
+}
+
 // ─── AMI panel ────────────────────────────────────────────────────────────────
 
 function AmiPanel({ imageId }: { imageId: string }) {
@@ -929,6 +963,7 @@ export function LaunchInstanceForm({
     const [createdKeyMaterial, setCreatedKeyMaterial] = useState<{ name: string; material: string }>()
     const [rootVolumeSize, setRootVolumeSize] = useState('20')
     const [rootVolumeType, setRootVolumeType] = useState('gp3')
+    const [userData, setUserData] = useState('')
     const [subnetId, setSubnetId] = useState('')
     const [selectedSgs, setSelectedSgs] = useState<string[]>([])
     const [showCreateSg, setShowCreateSg] = useState(false)
@@ -1049,6 +1084,7 @@ export function LaunchInstanceForm({
             securityGroupIds: selectedSgs.length ? selectedSgs.join(',') : undefined,
             rootVolumeSize,
             rootVolumeType,
+            userData: userData || undefined,
         })
     }
 
@@ -1120,17 +1156,22 @@ export function LaunchInstanceForm({
     ]
 
     return (
-        <form className="launch-form" aria-label="Launch instance wizard" onSubmit={(event) => { event.preventDefault(); if (step === 4) launch() }}>
+        <form className="launch-form ec2-launch-form" aria-label="Launch instance wizard" onSubmit={(event) => { event.preventDefault(); if (step === 4) launch() }}>
-            <div className="sns-tabs" aria-label="Launch steps" style={{ gridColumn: '1 / -1', overflowX: 'auto' }}>
+            <header className="launch-form-header">
+                <div><p className="eyebrow">EC2 compute</p><h3>Launch an instance</h3><p className="muted compact-text">Choose an image, configure access and networking, then review the instance before launch.</p></div>
+                <span>4-step setup</span>
+            </header>
+            <nav className="launch-stepper" aria-label="Launch steps">
                 {steps.map((item) => (
-                    <button key={item.number} type="button" className={`sns-tab${step === item.number ? ' active' : ''}`} onClick={() => item.number < step && setStep(item.number)} disabled={item.number > step}>
+                    <button key={item.number} type="button" className={step === item.number ? 'active' : ''} onClick={() => item.number < step && setStep(item.number)} disabled={item.number > step}>
-                        {item.number}. {item.label}
+                        <b>{item.number}</b><span>{item.label}</span>
                     </button>
                 ))}
-            </div>
+            </nav>
 
-            {step === 1 && <>
+            {step === 1 && <section className="launch-form-section">
-                <div className="launch-form-group">Name and AMI</div>
+                <div className="launch-section-title"><Server size={17}/><div><h4>Instance identity</h4><p>Name the instance and select its operating system image.</p></div></div>
+                <div className="launch-form-grid">
                 <label className="launch-field launch-field--span">
                     <span>Instance name <em className="field-required">*</em></span>
                     <input className="input" value={name} onChange={(e) => setName(e.target.value)} placeholder="e.g. my-web-server" />
@@ -1188,10 +1229,12 @@ export function LaunchInstanceForm({
                         </>}
                     </div>
                 </div>
-            </>}
+                </div>
+            </section>}
 
-            {step === 2 && <>
+            {step === 2 && <section className="launch-form-section">
-                <div className="launch-form-group">Instance type and key pair</div>
+                <div className="launch-section-title"><Cpu size={17}/><div><h4>Compute and access</h4><p>Choose the instance capacity and SSH credentials.</p></div></div>
+                <div className="launch-form-grid">
                 <label className="launch-field">
                     <span>Instance type <em className="field-required">*</em></span>
                     <select className="input" value={instanceType} onChange={(e) => setInstanceType(e.target.value)}>
@@ -1201,16 +1244,16 @@ export function LaunchInstanceForm({
                 </label>
                 <div className="launch-field launch-field--span">
                     <span>Key pair</span>
-                    <div className="field-row" style={{ marginTop: 6 }}>
+                    <div className="launch-choice-row">
                         <label><input type="radio" checked={keyPairMode === 'existing'} onChange={() => setKeyPairMode('existing')} /> Choose existing</label>
                         <label><input type="radio" checked={keyPairMode === 'new'} onChange={() => { setKeyPairMode('new'); setKeyName('') }} /> Create new</label>
                     </div>
                     {keyPairMode === 'existing' ? (
-                        <select className="input" style={{ marginTop: 8 }} value={keyName} onChange={(e) => setKeyName(e.target.value)}>
+                        <select className="input" value={keyName} onChange={(e) => setKeyName(e.target.value)}>
                             <option value="">No key pair</option>
                             {(keysQ.data ?? []).map((keyPair: Ec2KeyPair) => <option key={keyPair.keyPairId} value={keyPair.keyName}>{keyPair.keyName}</option>)}
                         </select>
-                    ) : <div style={{ display: 'flex', flexWrap: 'wrap', gap: 8, marginTop: 8 }}>
+                    ) : <div className="launch-key-create">
                         <input className="input" value={newKeyName} onChange={(e) => { setNewKeyName(e.target.value); setKeyName('') }} placeholder="Key pair name" />
                         <select className="input" value={newKeyType} onChange={(e) => setNewKeyType(e.target.value as 'rsa' | 'ed25519')}><option value="rsa">RSA</option><option value="ed25519">ED25519</option></select>
                         <button type="button" className="button" disabled={!newKeyName.trim() || createKeyMut.isPending} onClick={() => createKeyMut.mutate()}>{createKeyMut.isPending ? 'Creating…' : 'Create key pair'}</button>
@@ -1219,10 +1262,12 @@ export function LaunchInstanceForm({
                     {createKeyMut.error instanceof Error && <p className="form-error" style={{ marginTop: 8 }}>{createKeyMut.error.message}</p>}
                     {createdKeyMaterial && <p className="muted" style={{ margin: '8px 0 0' }}>The private key is available only from this creation response. Download it before leaving this wizard.</p>}
                 </div>
-            </>}
+                </div>
+            </section>}
 
-            {step === 3 && <>
+            {step === 3 && <section className="launch-form-section">
-                <div className="launch-form-group">Network and security</div>
+                <div className="launch-section-title"><Network size={17}/><div><h4>Network and security</h4><p>Place the instance in a subnet and control inbound access.</p></div></div>
+                <div className="launch-form-grid">
                 <label className="launch-field launch-field--span">
                     <span>Subnet</span>
                     <select className="input" value={subnetId} onChange={(e) => setSubnetId(e.target.value)}>
@@ -1360,10 +1405,12 @@ export function LaunchInstanceForm({
                     </div>
                 )}
                 </div>
-            </>}
+                </div>
+            </section>}
 
-            {step === 4 && <>
+            {step === 4 && <section className="launch-form-section">
-                <div className="launch-form-group">Storage and review</div>
+                <div className="launch-section-title"><HardDrive size={17}/><div><h4>Storage and review</h4><p>Configure the root disk, bootstrap script, and verify the launch request.</p></div></div>
+                <div className="launch-form-grid">
                 <label className="launch-field">
                     <span>Root volume size (GiB)</span>
                     <input className="input" type="number" min="1" value={rootVolumeSize} onChange={(event) => setRootVolumeSize(event.target.value)} />
@@ -1379,9 +1426,9 @@ export function LaunchInstanceForm({
                         <option value="sc1">Cold HDD (sc1)</option>
                     </select>
                 </label>
-                <div className="launch-field launch-field--span">
+                <div className="launch-field launch-field--span launch-review">
                     <span>Review: fields sent to RunInstances</span>
-                    <div className="meta-grid" style={{ marginTop: 8 }}>
+                    <div className="meta-grid">
                         <div className="meta-row"><span className="meta-label">Name</span><span className="meta-value">{name}</span></div>
                         <div className="meta-row"><span className="meta-label">AMI</span><span className="meta-value">{selectedAmi?.name || imageId} ({imageId})</span></div>
                         <div className="meta-row"><span className="meta-label">Instance type</span><span className="meta-value">{instanceType}</span></div>
@@ -1389,14 +1436,22 @@ export function LaunchInstanceForm({
                         <div className="meta-row"><span className="meta-label">Subnet</span><span className="meta-value">{selectedSubnet ? `${selectedSubnet.availabilityZone} (${subnetId})` : 'Not sent'}</span></div>
                         <div className="meta-row"><span className="meta-label">Security groups</span><span className="meta-value">{selectedGroups.length ? selectedGroups.map((group) => group.groupName || group.groupId).join(', ') : 'Not sent'}</span></div>
                         <div className="meta-row"><span className="meta-label">Root volume</span><span className="meta-value">{rootVolumeSize} GiB {rootVolumeType}, delete on termination</span></div>
+                        <div className="meta-row"><span className="meta-label">User data</span><span className="meta-value">{userData ? 'Shell script or cloud-init supplied' : 'Not sent'}</span></div>
                     </div>
                 </div>
-            </>}
+                <label className="launch-field launch-field--span">
+                    <span>User data</span>
+                    <textarea className="textarea code-textarea small" value={userData} onChange={(event) => setUserData(event.target.value)} placeholder={'#!/bin/bash\napt-get update\napt-get upgrade -y\napt-get install -y curl git'} rows={7}/>
+                    <small>Runs once after the instance starts. Use a shell script or cloud-init document, matching the AWS RunInstances UserData field.</small>
+                    <input type="file" accept=".sh,.txt,.yaml,.yml,.cfg,text/plain,text/x-shellscript" onChange={async (event) => { const file = event.currentTarget.files?.[0]; if (file) setUserData(await file.text()); event.currentTarget.value = '' }}/>
+                </label>
+                </div>
+            </section>}
 
             {stepError && <div className="form-error launch-field--span">{stepError}</div>}
             {createMut.error instanceof Error && <div className="form-error launch-field--span">{createMut.error.message}</div>}
             {createMut.isPending && <div className="launch-field--span"><ServerLaunchProgress name={name} description="Creating the instance and preparing its local runtime."/></div>}
-            <div className="launch-form-actions" style={{ gridColumn: '1 / -1' }}>
+            <div className="launch-form-actions">
                 <button type="button" className="button" onClick={step === 1 ? onCancel : () => { setStep((current) => (current - 1) as LaunchStep); setStepError('') }}>{step === 1 ? 'Cancel' : 'Back'}</button>
                 {step < 4 ? <button type="button" className="button primary" onClick={nextStep}>Next</button> : <button type="button" className="button primary" disabled={createMut.isPending} onClick={launch}><Plus size={14}/>{createMut.isPending ? 'Launching…' : 'Launch instance'}</button>}
             </div>

packages/frontend/src/components/DatabaseLaunchProgress.tsx

@@ -5,12 +5,8 @@ interface DatabaseLaunchProgressProps {
 
 export function DatabaseLaunchProgress({ name, description }: DatabaseLaunchProgressProps) {
   return <div className="database-launch-progress" role="status" aria-live="polite">
-    <svg viewBox="0 0 48 48" aria-hidden="true">
+    <img className="database-launch-progress-art" src={databaseCreationAnimation} alt="Animated database creation icon"/>
-      <path d="M7 11C7 15 14.6 17 24 17S41 15 41 11v26c0 4-7.6 6-17 6S7 41 7 37Z" fill="#0D3D8C" />
-      <path d="M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z" fill="#1769C2"><animate attributeName="d" dur="1.3s" repeatCount="indefinite" values="M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z;M7 9C7 13 14.6 15 24 15S41 13 41 9v14c0 4-7.6 6-17 6S7 27 7 23Z;M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z" /></path>
-      <g><path d="M7 11C7 7 14.6 5 24 5S41 7 41 11v7c0 4-7.6 6-17 6S7 22 7 18Z" fill="#1976D2" /><ellipse cx="24" cy="11" rx="17" ry="5.5" fill="#2B91E3" /><ellipse cx="24" cy="9.7" rx="14.5" ry="3.5" fill="#39A0EA" opacity=".35" /><animateTransform attributeName="transform" type="translate" values="0 0;0 -3;0 0" dur="1.3s" repeatCount="indefinite" /></g>
-      <g fill="#35d0b5"><circle className="database-led database-led-a" cx="16" cy="35.5" r="1.6" /><circle className="database-led database-led-b" cx="21.3" cy="36.2" r="1.6" /><circle className="database-led database-led-c" cx="26.7" cy="36.2" r="1.6" /><circle className="database-led database-led-d" cx="32" cy="35.5" r="1.6" /></g>
-    </svg>
     <div><strong>Creating {name || "database"}</strong><small>{description}</small></div>
   </div>;
 }
+import databaseCreationAnimation from '../../../../svgAsset/db-creation.svg';

packages/frontend/src/components/LightsailInstancePanel.test.tsx

@@ -45,6 +45,7 @@ test('shows Lightsail instance state and invokes lifecycle actions from Actions'
     await user.click(screen.getByRole('button', {name: 'Stop'}))
 
     await waitFor(() => expect(apiMocks.stopCloudResource).toHaveBeenCalledWith('aws', 'lightsail', 'web'))
+    expect(screen.getByText('Actions').closest('details')).not.toHaveAttribute('open')
 })
 
 test('manages firewall rules through generic resource updates and shows browser mappings', async () => {

packages/frontend/src/components/LightsailInstancePanel.tsx

@@ -19,6 +19,7 @@ export function LightsailInstancePanel({resource, runtimeReachable, onDeleted}:
     const [startCommand, setStartCommand] = useState('')
     const [confirmDelete, setConfirmDelete] = useState(false)
     const fileInput = useRef<HTMLInputElement>(null)
+    const actionsMenu = useRef<HTMLDetailsElement>(null)
     const ports = publicPorts(resource?.metadata.networking)
     const hostMappings = hostPortMappings(resource?.metadata.hostPortMappings)
     const disks = instanceDisks(resource?.metadata.hardware)
@@ -100,11 +101,12 @@ export function LightsailInstancePanel({resource, runtimeReachable, onDeleted}:
     const wordpress = stringMetadata(resource.metadata.blueprintId) === 'wordpress'
     const wordpressPort = hostMappings.find((mapping) => mapping.instancePort === 80)
     const stateLabel = resource.status ?? 'Unknown'
+    const closeActionsMenu = () => actionsMenu.current?.removeAttribute('open')
 
     return <section className="table-panel lightsail-instance-panel" style={{marginTop: 16}}>
         <header className="lightsail-instance-header">
             <div><p className="eyebrow">Amazon Lightsail instance</p><h2>{resource.name}</h2><p className="muted"><code>{resource.id}</code>{resource.region && <> · {resource.region}</>}</p></div>
-            <div className="lightsail-instance-controls"><span className={`runtime-state ${status === 'running' ? 'ready' : 'pending'}`}>{stateLabel}</span><details className="dynamodb-actions"><summary>Actions <ChevronDown size={14}/></summary><div className="dynamodb-actions-menu lightsail-actions-menu"><button type="button" onClick={() => setTab('overview')}><Settings size={14}/>Manage</button><button type="button" disabled={!runtimeReachable || busy || status !== 'stopped'} onClick={() => lifecycle.mutate('start')}><Play size={14}/>Start</button><button type="button" disabled={!runtimeReachable || busy || status !== 'running'} onClick={() => lifecycle.mutate('stop')}><Square size={14}/>Stop</button><button type="button" disabled={!runtimeReachable || busy || status !== 'running'} onClick={() => lifecycle.mutate('reboot')}><RotateCw size={14}/>Reboot</button><button className="dynamodb-action-delete" type="button" disabled={!runtimeReachable || busy} onClick={() => setConfirmDelete(true)}><Trash2 size={14}/>Delete</button></div></details></div>
+            <div className="lightsail-instance-controls"><span className={`runtime-state ${status === 'running' ? 'ready' : 'pending'}`}>{stateLabel}</span><details className="dynamodb-actions" ref={actionsMenu}><summary>Actions <ChevronDown size={14}/></summary><div className="dynamodb-actions-menu lightsail-actions-menu"><button type="button" onClick={() => { closeActionsMenu(); setTab('overview') }}><Settings size={14}/>Manage</button><button type="button" disabled={!runtimeReachable || busy || status !== 'stopped'} onClick={() => { closeActionsMenu(); lifecycle.mutate('start') }}><Play size={14}/>Start</button><button type="button" disabled={!runtimeReachable || busy || status !== 'running'} onClick={() => { closeActionsMenu(); lifecycle.mutate('stop') }}><Square size={14}/>Stop</button><button type="button" disabled={!runtimeReachable || busy || status !== 'running'} onClick={() => { closeActionsMenu(); lifecycle.mutate('reboot') }}><RotateCw size={14}/>Reboot</button><button className="dynamodb-action-delete" type="button" disabled={!runtimeReachable || busy} onClick={() => { closeActionsMenu(); setConfirmDelete(true) }}><Trash2 size={14}/>Delete</button></div></details></div>
         </header>
         <div className="drawer-tabs lightsail-instance-tabs" role="tablist" aria-label="Instance details">
             <button className={`drawer-tab ${tab === 'overview' ? 'active' : ''}`} type="button" role="tab" aria-selected={tab === 'overview'} onClick={() => setTab('overview')}>Overview</button>

packages/frontend/src/components/LoadBalancingProgress.tsx

@@ -10,10 +10,21 @@ export function LoadBalancingProgress({kind, description}: LoadBalancingProgress
     </div>
 }
 
+export function TargetHealthIcon({state}: {state: string}) {
+    if (state.toLowerCase() === 'healthy') {
+        return <svg className="target-state-icon target-state-icon--healthy" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-label="Healthy target"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 9.897c0 -1.714 1.46 -3.104 3.26 -3.104c.275 -1.22 1.255 -2.215 2.572 -2.611c1.317 -.397 2.77 -.134 3.811 .69c1.042 .822 1.514 2.08 1.239 3.3h.693a2.42 2.42 0 0 1 2.425 2.414a2.42 2.42 0 0 1 -2.425 2.414h-8.315c-1.8 0 -3.26 -1.39 -3.26 -3.103"/><path d="M12 13v3"/><path d="M10 18a2 2 0 1 0 4 0a2 2 0 1 0 -4 0"/><path d="M14 18h7"/><path d="M3 18h7"/></svg>
+    }
+    if (state.toLowerCase() === 'unhealthy') {
+        return <svg className="target-state-icon target-state-icon--unhealthy" viewBox="0 0 21 21" aria-label="Unhealthy target"><path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" d="M8.739 5.819a5 5 0 0 1 6.563 6.08a2 2 0 1 1 2.234 3.312m-2.104.289H5.5a3 3 0 1 1 .1-5.998a5 5 0 0 1 1.286-2.457M4 4l13 13.071"/></svg>
+    }
+    return <span className="target-state-icon target-state-icon--checking"><TargetIcon/></span>
+}
+
 function ListenerIcon() {
-    return <svg viewBox="0 0 140 140" aria-hidden="true"><rect className="lb-device" x="20" y="28" width="96" height="29" rx="4"/><circle className="lb-yellow lb-blink-1" cx="35" cy="42.5" r="5.3"/><g className="lb-yellow"><circle className="lb-blink-1" cx="72" cy="37" r="2"/><circle className="lb-blink-2" cx="81" cy="37" r="2"/><circle className="lb-blink-3" cx="97" cy="37" r="2"/><circle className="lb-blink-2" cx="106" cy="37" r="2"/><circle className="lb-blink-3" cx="64" cy="47" r="2"/><circle className="lb-blink-1" cx="75" cy="47" r="2"/><circle className="lb-blink-2" cx="85" cy="47" r="2"/><circle className="lb-blink-3" cx="97" cy="47" r="2"/><circle className="lb-blink-1" cx="106" cy="47" r="2"/></g><path className="lb-wire" d="M58 64 L49 83 L42 97M79 64 L88 83 L94 97"/><circle className="lb-yellow" r="3.2"><animateMotion dur="1.55s" repeatCount="indefinite" path="M58 64 L49 83 L42 97"/></circle><circle className="lb-yellow" r="3.2"><animateMotion begin=".72s" dur="1.55s" repeatCount="indefinite" path="M79 64 L88 83 L94 97"/></circle><rect className="lb-device" x="24" y="88" width="36" height="19" rx="5"/><rect className="lb-device" x="77" y="88" width="36" height="19" rx="5"/></svg>
+    return <img className="load-balancing-progress-art" src={loadBalancerAnimation} alt="Animated load balancer"/>
 }
 
 function TargetIcon() {
     return <svg viewBox="0 0 362 356" aria-hidden="true"><rect className="lb-panel" x="49" y="68" width="270" height="68" rx="15"/><rect className="lb-panel" x="49" y="135" width="270" height="68" rx="15"/><g className="lb-ports"><rect className="lb-port" x="81" y="92" width="47" height="25" rx="13"/><rect className="lb-port" x="81" y="158" width="47" height="25" rx="13"/></g><g className="lb-green">{[178, 197, 216, 236, 256, 276, 295].map((cx, index) => <circle key={`top-${cx}`} className={`lb-blink-${index % 3 + 1}`} cx={cx} cy="95" r="6.5"/>)}{[178, 197, 216, 236, 256, 276].map((cx, index) => <circle key={`bottom-${cx}`} className={`lb-blink-${(index + 1) % 3 + 1}`} cx={cx} cy="162" r="6.5"/>)}</g><path className="lb-wire" d="M184 202v51M55 267H307"/><circle className="lb-green" r="7"><animateMotion dur="3.8s" repeatCount="indefinite" path="M66 267 H184 V181"/></circle><circle className="lb-green" r="7"><animateMotion begin="1.25s" dur="3.8s" repeatCount="indefinite" path="M302 267 H184 V162"/></circle><circle className="lb-green lb-hub" cx="184" cy="267" r="8"/></svg>
 }
+import loadBalancerAnimation from '../../../../svgAsset/Load-Balancer.svg'

packages/frontend/src/components/MskPanel.tsx

@@ -1,5 +1,5 @@
 import {useEffect, useState} from "react";
-import {Loader2, Plus, RefreshCw, Send, Trash2} from "lucide-react";
+import {Activity, Loader2, MessageSquare, Network, Plus, RefreshCw, Send, Server, Trash2} from "lucide-react";
 import {useMutation, useQuery, useQueryClient} from "@tanstack/react-query";
 import {createMskCluster, createMskTopic, deleteMskCluster, deleteMskTopic, getMskConsumerGroupLag, listMskClusters, listMskTopics, peekMskMessages, produceMskMessage} from "@/api/mskClient";
 import {listEc2Subnets} from "@/api/aws/ec2.api";
@@ -38,25 +38,51 @@ export function MskPanel({runtimeReachable}: {runtimeReachable: boolean}) {
   const error = createCluster.error ?? deleteCluster.error ?? createTopic.error ?? deleteTopic.error ?? produce.error ?? peek.error ?? loadLag.error;
 
   return <div className="sns-topic-workspace msk-workspace">
-    <section className="table-panel">
+    <section className="table-panel msk-service-section">
-      <div className="dynamic-stage-header"><div><p className="eyebrow">Amazon MSK</p><h3>Kafka clusters</h3><p className="muted compact-text">Broker access is open: no IAM, SASL, or TLS authentication is configured.</p></div><button className="button" type="button" disabled={!runtimeReachable || clustersQuery.isFetching} onClick={() => clustersQuery.refetch()}><RefreshCw size={13}/>{clustersQuery.isFetching ? "Loading" : "Refresh"}</button></div>
+      <header className="msk-section-header">
-      <form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); if (clusterName.trim() && Number(brokers) > 0 && version.trim() && subnets.length > 0) createCluster.mutate(); }}>
+        <div className="msk-section-heading"><span><Server size={17}/></span><div><p className="eyebrow">Amazon MSK</p><h3>Kafka clusters</h3><p className="muted compact-text">Provision broker nodes in existing EC2 subnets for local Kafka workloads.</p></div></div>
-        <label className="dynamic-field"><span>Cluster name</span><input className="input" value={clusterName} onChange={(event) => setClusterName(event.target.value)} required /></label><label className="dynamic-field"><span>Broker nodes</span><input className="input" type="number" min="1" value={brokers} onChange={(event) => setBrokers(event.target.value)} required /></label><label className="dynamic-field"><span>Kafka version</span><input className="input" value={version} onChange={(event) => setVersion(event.target.value)} required /></label><label className="dynamic-field"><span>Client subnets</span><select className="input subnet-multiselect" multiple size={3} value={subnets} onChange={(event) => setSubnets(Array.from(event.currentTarget.selectedOptions, (option) => option.value))} required>{subnetsQuery.data?.map((subnet) => <option key={subnet.subnetId} value={subnet.subnetId}>{subnet.subnetId} ({subnet.availabilityZone})</option>)}</select><small>Select one or more existing EC2 subnets.</small></label><button className="button primary" type="submit" disabled={!runtimeReachable || subnets.length === 0 || createCluster.isPending}>{createCluster.isPending ? <Loader2 size={13} className="spin"/> : <Plus size={13}/>}{createCluster.isPending ? "Creating" : "Create cluster"}</button>
+        <button className="button" type="button" disabled={!runtimeReachable || clustersQuery.isFetching} onClick={() => clustersQuery.refetch()}><RefreshCw size={13}/>{clustersQuery.isFetching ? "Loading" : "Refresh"}</button>
+      </header>
+      <form className="msk-form" onSubmit={(event) => { event.preventDefault(); if (clusterName.trim() && Number(brokers) > 0 && version.trim() && subnets.length > 0) createCluster.mutate(); }}>
+        <label className="dynamic-field"><span>Cluster name <em className="field-required">*</em></span><input className="input" value={clusterName} onChange={(event) => setClusterName(event.target.value)} placeholder="events-cluster" required /></label>
+        <label className="dynamic-field"><span>Broker nodes <em className="field-required">*</em></span><input className="input" type="number" min="1" value={brokers} onChange={(event) => setBrokers(event.target.value)} required /></label>
+        <label className="dynamic-field"><span>Kafka version <em className="field-required">*</em></span><input className="input" value={version} onChange={(event) => setVersion(event.target.value)} required /></label>
+        <label className="dynamic-field"><span>Client subnets <em className="field-required">*</em></span><select className="input subnet-multiselect" multiple size={3} value={subnets} onChange={(event) => setSubnets(Array.from(event.currentTarget.selectedOptions, (option) => option.value))} required>{subnetsQuery.data?.map((subnet) => <option key={subnet.subnetId} value={subnet.subnetId}>{subnet.subnetId} ({subnet.availabilityZone})</option>)}</select><small>Select one or more existing EC2 subnets.</small></label>
+        <div className="msk-form-actions"><span>Broker access is open: no IAM, SASL, or TLS authentication is configured.</span><button className="button primary" type="submit" disabled={!runtimeReachable || subnets.length === 0 || createCluster.isPending}>{createCluster.isPending ? <Loader2 size={13} className="spin"/> : <Plus size={13}/>}{createCluster.isPending ? "Creating" : "Create cluster"}</button></div>
       </form>
-      <div className="apigateway-route-explorer"><label className="dynamic-field"><span>Active cluster</span><select className="input" value={clusterArn} onChange={(event) => { setClusterArn(event.target.value); setDeleteClusterConfirmation(false); }} disabled={!runtimeReachable}><option value="">Select a cluster</option>{clustersQuery.data?.map((cluster) => <option key={cluster.ClusterArn} value={cluster.ClusterArn}>{cluster.ClusterName ?? cluster.ClusterArn} {cluster.State ? `(${cluster.State})` : ""}</option>)}</select></label>{clusterArn && (deleteClusterConfirmation ? <div className="apigateway-route-confirm"><span>Delete this cluster and all topics?</span><button className="button danger compact" type="button" disabled={deleteCluster.isPending} onClick={() => deleteCluster.mutate()}>{deleteCluster.isPending ? "Deleting" : "Delete cluster"}</button><button className="button compact" type="button" disabled={deleteCluster.isPending} onClick={() => setDeleteClusterConfirmation(false)}>Cancel</button></div> : <button className="button danger compact" type="button" disabled={!runtimeReachable || deleteCluster.isPending} onClick={() => setDeleteClusterConfirmation(true)}><Trash2 size={13}/>Delete cluster</button>)}</div>
+      <div className="msk-active-resource">
+        <label className="dynamic-field"><span>Active cluster</span><select className="input" value={clusterArn} onChange={(event) => { setClusterArn(event.target.value); setDeleteClusterConfirmation(false); }} disabled={!runtimeReachable}><option value="">Select a cluster</option>{clustersQuery.data?.map((cluster) => <option key={cluster.ClusterArn} value={cluster.ClusterArn}>{cluster.ClusterName ?? cluster.ClusterArn} {cluster.State ? `(${cluster.State})` : ""}</option>)}</select></label>
+        {clusterArn && (deleteClusterConfirmation ? <div className="apigateway-route-confirm"><span>Delete this cluster and all topics?</span><button className="button danger compact" type="button" disabled={deleteCluster.isPending} onClick={() => deleteCluster.mutate()}>{deleteCluster.isPending ? "Deleting" : "Delete cluster"}</button><button className="button compact" type="button" disabled={deleteCluster.isPending} onClick={() => setDeleteClusterConfirmation(false)}>Cancel</button></div> : <button className="button danger compact" type="button" disabled={!runtimeReachable || deleteCluster.isPending} onClick={() => setDeleteClusterConfirmation(true)}><Trash2 size={13}/>Delete cluster</button>)}
+      </div>
     </section>
-    <section className="table-panel">
+
-      <div className="dynamic-stage-header"><div><p className="eyebrow">Topics</p><h3>Kafka Admin API</h3><p className="muted compact-text">Topic management uses the cluster's Kafka Admin API. Retention configuration is accepted, but enforcement is unverified.</p></div></div>
+    <section className="table-panel msk-service-section">
-      <form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); if (clusterArn && topic.trim() && Number(partitions) > 0) createTopic.mutate(); }}><label className="dynamic-field"><span>Topic</span><input className="input" value={topic} onChange={(event) => setTopic(event.target.value)} required /></label><label className="dynamic-field"><span>Partitions</span><input className="input" type="number" min="1" value={partitions} onChange={(event) => setPartitions(event.target.value)} required /></label><label className="dynamic-field"><span>Retention (ms, optional)</span><input className="input" type="number" min="0" value={retentionMs} onChange={(event) => setRetentionMs(event.target.value)} /><small>Configured but enforcement unverified.</small></label><button className="button primary" type="submit" disabled={!runtimeReachable || !clusterArn || createTopic.isPending}>{createTopic.isPending ? "Creating" : "Create topic"}</button></form>
+      <header className="msk-section-header"><div className="msk-section-heading"><span><Network size={17}/></span><div><p className="eyebrow">Topics</p><h3>Kafka Admin API</h3><p className="muted compact-text">Define partitions and optional retention for the active cluster.</p></div></div></header>
-      {topicsQuery.isLoading && <p className="muted compact-text">Loading topics...</p>}{topicsQuery.data?.length === 0 && <p className="muted compact-text">No topics found for this cluster.</p>}{topicsQuery.data?.map((item) => <div className="apigateway-route-item" key={item.name}><div className="apigateway-route-select"><code>{item.name}</code><small>{item.partitionCount} partition{item.partitionCount === 1 ? "" : "s"}</small></div><button className="icon-btn danger" type="button" aria-label={`Delete topic ${item.name}`} disabled={deleteTopic.isPending} onClick={() => deleteTopic.mutate(item.name)}><Trash2 size={14}/></button></div>)}
+      <form className="msk-form" onSubmit={(event) => { event.preventDefault(); if (clusterArn && topic.trim() && Number(partitions) > 0) createTopic.mutate(); }}>
+        <label className="dynamic-field"><span>Topic name <em className="field-required">*</em></span><input className="input" aria-label="Topic" value={topic} onChange={(event) => setTopic(event.target.value)} placeholder="orders.created" required /></label>
+        <label className="dynamic-field"><span>Partitions <em className="field-required">*</em></span><input className="input" type="number" min="1" value={partitions} onChange={(event) => setPartitions(event.target.value)} required /></label>
+        <label className="dynamic-field"><span>Retention in milliseconds</span><input className="input" type="number" min="0" value={retentionMs} onChange={(event) => setRetentionMs(event.target.value)} placeholder="Optional"/><small>Configuration is accepted, but enforcement unverified.</small></label>
+        <div className="msk-form-actions"><button className="button primary" type="submit" disabled={!runtimeReachable || !clusterArn || createTopic.isPending}><Plus size={13}/>{createTopic.isPending ? "Creating" : "Create topic"}</button></div>
+      </form>
+      <div className="msk-resource-list">{topicsQuery.isLoading && <p className="muted compact-text">Loading topics...</p>}{topicsQuery.data?.length === 0 && <p className="muted compact-text">No topics found for this cluster.</p>}{topicsQuery.data?.map((item) => <div className="apigateway-route-item" key={item.name}><div className="apigateway-route-select"><code>{item.name}</code><small>{item.partitionCount} partition{item.partitionCount === 1 ? "" : "s"}</small></div><button className="icon-btn danger" type="button" aria-label={`Delete topic ${item.name}`} disabled={deleteTopic.isPending} onClick={() => deleteTopic.mutate(item.name)}><Trash2 size={14}/></button></div>)}</div>
     </section>
-    <section className="table-panel">
+
-      <div className="dynamic-stage-header"><div><p className="eyebrow">Messages</p><h3>Produce and peek</h3><p className="muted compact-text">Peek uses a non-committing consumer and reads from the beginning.</p></div></div>
+    <section className="table-panel msk-service-section">
-      <form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); if (clusterArn && messageTopic && messageValue) produce.mutate(); }}><label className="dynamic-field"><span>Topic</span><select className="input" value={messageTopic} onChange={(event) => setMessageTopic(event.target.value)} required><option value="">Select a topic</option>{topicsQuery.data?.map((item) => <option key={item.name} value={item.name}>{item.name}</option>)}</select></label><label className="dynamic-field"><span>Key (optional)</span><input className="input" value={messageKey} onChange={(event) => setMessageKey(event.target.value)} /></label><label className="dynamic-field dynamic-field--span"><span>Value</span><textarea className="textarea code-textarea small" value={messageValue} onChange={(event) => setMessageValue(event.target.value)} required /></label><button className="button primary" type="submit" disabled={!runtimeReachable || !clusterArn || !messageTopic || !messageValue || produce.isPending}>{produce.isPending ? <Loader2 size={13} className="spin"/> : <Send size={13}/>}{produce.isPending ? "Producing" : "Produce message"}</button><button className="button" type="button" disabled={!runtimeReachable || !clusterArn || !messageTopic || peek.isPending} onClick={() => peek.mutate()}>{peek.isPending ? "Peeking" : "Peek messages"}</button></form>
+      <header className="msk-section-header"><div className="msk-section-heading"><span><MessageSquare size={17}/></span><div><p className="eyebrow">Messages</p><h3>Produce and inspect</h3><p className="muted compact-text">Publish records or peek from the beginning with a non-committing consumer.</p></div></div></header>
-      {messages.map((message) => <article className="apigateway-route-item" key={`${message.partition}:${message.offset}`}><div className="apigateway-route-select"><pre>{message.value ?? ""}</pre><small>Partition {message.partition} · Offset {message.offset} · Timestamp {formatTimestamp(message.timestamp)}</small>{message.key && <small>Key: <code>{message.key}</code></small>}</div></article>)}{messages.length === 0 && <p className="muted compact-text">Select a topic and peek to inspect up to 50 messages.</p>}
+      <form className="msk-form" onSubmit={(event) => { event.preventDefault(); if (clusterArn && messageTopic && messageValue) produce.mutate(); }}>
+        <label className="dynamic-field"><span>Topic <em className="field-required">*</em></span><select className="input" aria-label="Topic" value={messageTopic} onChange={(event) => setMessageTopic(event.target.value)} required><option value="">Select a topic</option>{topicsQuery.data?.map((item) => <option key={item.name} value={item.name}>{item.name}</option>)}</select></label>
+        <label className="dynamic-field"><span>Message key</span><input className="input" value={messageKey} onChange={(event) => setMessageKey(event.target.value)} placeholder="Optional partition key"/></label>
+        <label className="dynamic-field dynamic-field--span"><span>Message value <em className="field-required">*</em></span><textarea className="textarea code-textarea small" aria-label="Value" value={messageValue} onChange={(event) => setMessageValue(event.target.value)} placeholder="Enter the record payload" required /></label>
+        <div className="msk-form-actions"><button className="button" type="button" disabled={!runtimeReachable || !clusterArn || !messageTopic || peek.isPending} onClick={() => peek.mutate()}>{peek.isPending ? "Peeking" : "Peek messages"}</button><button className="button primary" type="submit" disabled={!runtimeReachable || !clusterArn || !messageTopic || !messageValue || produce.isPending}>{produce.isPending ? <Loader2 size={13} className="spin"/> : <Send size={13}/>}{produce.isPending ? "Producing" : "Produce message"}</button></div>
+      </form>
+      <div className="msk-resource-list">{messages.map((message) => <article className="apigateway-route-item" key={`${message.partition}:${message.offset}`}><div className="apigateway-route-select"><pre>{message.value ?? ""}</pre><small>Partition {message.partition} · Offset {message.offset} · Timestamp {formatTimestamp(message.timestamp)}</small>{message.key && <small>Key: <code>{message.key}</code></small>}</div></article>)}{messages.length === 0 && <p className="muted compact-text">Select a topic and peek to inspect up to 50 messages.</p>}</div>
     </section>
-    <section className="table-panel">
+
-      <div className="dynamic-stage-header"><div><p className="eyebrow">Consumer groups</p><h3>Lag</h3></div></div><form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); if (clusterArn && groupId.trim()) loadLag.mutate(); }}><label className="dynamic-field"><span>Consumer group ID</span><input className="input" value={groupId} onChange={(event) => setGroupId(event.target.value)} required /></label><button className="button" type="submit" disabled={!runtimeReachable || !clusterArn || !groupId.trim() || loadLag.isPending}>{loadLag.isPending ? "Loading" : "View lag"}</button></form>{lag.map((topicLag) => <div className="apigateway-route-item" key={topicLag.topic}><div className="apigateway-route-select"><code>{topicLag.topic}</code><small>Total lag: {topicLag.totalLag}</small>{topicLag.partitions.map((partition) => <small key={partition.partition}>Partition {partition.partition}: {partition.currentOffset} / {partition.endOffset}, lag {partition.lag}</small>)}</div></div>)}{error instanceof Error && <p className="error-text compact-text">{error.message}</p>}
+    <section className="table-panel msk-service-section">
+      <header className="msk-section-header"><div className="msk-section-heading"><span><Activity size={17}/></span><div><p className="eyebrow">Consumer groups</p><h3>Lag inspection</h3><p className="muted compact-text">Compare committed offsets with partition end offsets.</p></div></div></header>
+      <form className="msk-form msk-lag-form" onSubmit={(event) => { event.preventDefault(); if (clusterArn && groupId.trim()) loadLag.mutate(); }}><label className="dynamic-field"><span>Consumer group ID <em className="field-required">*</em></span><input className="input" aria-label="Consumer group ID" value={groupId} onChange={(event) => setGroupId(event.target.value)} placeholder="checkout-workers" required /></label><div className="msk-form-actions"><button className="button primary" type="submit" disabled={!runtimeReachable || !clusterArn || !groupId.trim() || loadLag.isPending}>{loadLag.isPending ? "Loading" : "View lag"}</button></div></form>
+      <div className="msk-resource-list">{lag.map((topicLag) => <div className="apigateway-route-item" key={topicLag.topic}><div className="apigateway-route-select"><code>{topicLag.topic}</code><small>Total lag: {topicLag.totalLag}</small>{topicLag.partitions.map((partition) => <small key={partition.partition}>Partition {partition.partition}: {partition.currentOffset} / {partition.endOffset}, lag {partition.lag}</small>)}</div></div>)}</div>
+      {error instanceof Error && <p className="error-text compact-text msk-error">{error.message}</p>}
     </section>
   </div>;
 }

packages/frontend/src/components/ServerLaunchProgress.tsx

@@ -5,15 +5,8 @@ interface ServerLaunchProgressProps {
 
 export function ServerLaunchProgress({name, description}: ServerLaunchProgressProps) {
     return <div className="server-launch-progress" role="status" aria-live="polite">
-        <svg viewBox="0 0 256 256" aria-hidden="true">
+        <img className="server-launch-progress-art" src={serverLaunchAnimation} alt="Animated server launch icon"/>
-            <path fill="#45515D" d="M18 145 48 65c1.4-3.7 5-6 9-6h143c4 0 7.6 2.4 9 6l29 80H18Z"/>
-            <path fill="#68737F" d="M40 145 69 65c1.4-3.7 5-6 9-6h122c4 0 7.6 2.4 9 6l29 80H40Z"/>
-            <rect x="18" y="143" width="220" height="54" rx="13" fill="#3B334A"/>
-            <path fill="#2C2638" d="M18 156c0-7.2 5.8-13 13-13h20c-7.2 0-13 5.8-13 13v28c0 7.2 5.8 13 13 13H31c-7.2 0-13-5.8-13-13v-28Z"/>
-            <rect x="39.5" y="159.5" width="21" height="21" rx="10.5" fill="none" stroke="#FFC735" strokeWidth="4.5"><animate attributeName="width" values="21;35;57;35;21;35;57;35;21" dur="1.64s" repeatCount="indefinite"/></rect>
-            <g fill="#2FB6A2"><circle cx="112" cy="161" r="4"/><circle cx="130" cy="161" r="4"/><circle cx="148" cy="161" r="4"/><circle cx="166" cy="161" r="4"/><circle cx="184" cy="161" r="4"/><circle cx="202" cy="161" r="4"/><circle cx="220" cy="161" r="4"/><circle cx="112" cy="179" r="4"/><circle cx="130" cy="179" r="4"/><circle cx="148" cy="179" r="4"/><circle cx="166" cy="179" r="4"/><circle cx="184" cy="179" r="4"/><circle cx="202" cy="179" r="4"/><circle cx="220" cy="179" r="4"/></g>
-            <rect x="108" y="156" width="116" height="28" fill="#3B334A" opacity="0"><animate attributeName="width" values="0;72;92;72;0;72;92;72;0" dur="1.64s" repeatCount="indefinite"/><animate attributeName="x" values="224;152;132;152;224;152;132;152;224" dur="1.64s" repeatCount="indefinite"/><animate attributeName="opacity" values="0;1;1;1;0;1;1;1;0" dur="1.64s" repeatCount="indefinite"/></rect>
-        </svg>
         <div><strong>Launching {name || 'instance'}</strong><small>{description}</small></div>
     </div>
 }
+import serverLaunchAnimation from '../../../../svgAsset/server-for-lightmode.svg'

packages/frontend/src/components/TargetGroupPanel.tsx

@@ -3,7 +3,7 @@ import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query'
 import {useEffect, useState} from 'react'
 import {getLoadBalancingDependencies, listFlatItems, putFlatItem, deleteFlatItem} from '@/api/cloudProxyClient'
 import {useAccountId} from '@/lib/accountStore'
-import {LoadBalancingProgress} from '@/components/LoadBalancingProgress'
+import {TargetHealthIcon} from '@/components/LoadBalancingProgress'
 import type {CloudResource} from '@/types/resource'
 
 type Props = {
@@ -12,16 +12,19 @@ type Props = {
 }
 
 type TargetInstance = {id: string; name: string; privateIp: string | null}
+type PendingTarget = {id: string; name: string; port: number}
 
 export function TargetGroupPanel({resource, runtimeReachable}: Props) {
     const accountId = useAccountId()
     const queryClient = useQueryClient()
     const [instanceId, setInstanceId] = useState('')
     const [port, setPort] = useState('')
+    const [pendingTargets, setPendingTargets] = useState<PendingTarget[]>([])
     const dependenciesQuery = useQuery({
         queryKey: ['target-group-instances', accountId],
         queryFn: ({signal}) => getTargetGroupInstances(signal),
         enabled: Boolean(resource) && runtimeReachable,
+        refetchInterval: pendingTargets.length ? 500 : false,
     })
     const healthQuery = useQuery({
         queryKey: ['target-group-health', accountId, resource?.id],
@@ -34,26 +37,33 @@ export function TargetGroupPanel({resource, runtimeReachable}: Props) {
         setPort(typeof resource?.metadata.port === 'number' ? String(resource.metadata.port) : '')
     }, [resource?.id, resource?.metadata.port])
 
+    useEffect(() => {
+        const targets = healthQuery.data?.items ?? []
+        setPendingTargets((current) => current.filter((pending) => {
+            const state = stringValue(targets.find((target) => stringValue(target.body.id) === pending.id && Number(target.body.port) === pending.port)?.body.state).toLowerCase()
+            return state !== 'healthy' && state !== 'unhealthy'
+        }))
+    }, [healthQuery.data])
+
+    useEffect(() => {
+        if (!pendingTargets.length) {
+            return
+        }
+        const interval = window.setInterval(() => {
+            void healthQuery.refetch()
+        }, 1_000)
+        return () => window.clearInterval(interval)
+    }, [pendingTargets.length, healthQuery.refetch])
+
     const refresh = () => {
         void Promise.all([dependenciesQuery.refetch(), healthQuery.refetch()])
     }
     const registerMutation = useMutation({
-        mutationFn: async () => {
+        mutationFn: (target: PendingTarget) => putFlatItem('aws', 'targetgroups', resource?.id ?? '', {id: target.id, port: target.port}),
-            const startedAt = Date.now()
+        onSuccess: (_, target) => {
-            await putFlatItem('aws', 'targetgroups', resource?.id ?? '', {id: instanceId, port: Number(port)})
+            setPendingTargets((current) => [...current, target])
-            while (true) {
+            void queryClient.invalidateQueries({queryKey: ['target-group-health', accountId, resource?.id]})
-                const health = await listFlatItems('aws', 'targetgroups', resource?.id ?? '')
-                const target = health.items.find((item) => stringValue(item.body.id) === instanceId && Number(item.body.port) === Number(port))
-                const state = stringValue(target?.body.state).toLowerCase()
-                if (state === 'healthy' || state === 'unhealthy') {
-                    const remaining = 5_000 - (Date.now() - startedAt)
-                    if (remaining > 0) await new Promise<void>((resolve) => setTimeout(resolve, remaining))
-                    return
-                }
-                await new Promise<void>((resolve) => setTimeout(resolve, 500))
-            }
         },
-        onSuccess: () => queryClient.invalidateQueries({queryKey: ['target-group-health', accountId, resource?.id]}),
     })
     const deregisterMutation = useMutation({
         mutationFn: (targetKey: string) => deleteFlatItem('aws', 'targetgroups', resource?.id ?? '', targetKey),
@@ -68,22 +78,23 @@ export function TargetGroupPanel({resource, runtimeReachable}: Props) {
     const targets = healthQuery.data?.items ?? []
     const validPort = /^\d+$/.test(port) && Number(port) >= 1 && Number(port) <= 65535
     const error = healthQuery.error ?? dependenciesQuery.error ?? registerMutation.error ?? deregisterMutation.error
+    const pendingRows = pendingTargets.filter((pending) => !targets.some((target) => stringValue(target.body.id) === pending.id && Number(target.body.port) === pending.port))
+
     return <section className="table-panel" style={{marginTop: 16}}>
         <div className="input-row resource-table-bar">
             <div><p className="eyebrow">Target health</p><span className="muted">{targets.length} registered targets in {resource.name}</span></div>
             <button className="button" type="button" disabled={!runtimeReachable || healthQuery.isFetching} onClick={refresh}><RefreshCw size={14}/>{healthQuery.isFetching ? 'Loading' : 'Refresh'}</button>
         </div>
-        <form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); if (instanceId && validPort) registerMutation.mutate() }}>
+        <form className="dynamic-form" onSubmit={(event) => { event.preventDefault(); const instance = instances.find((candidate) => candidate.id === instanceId); if (instance && validPort) registerMutation.mutate({id: instance.id, name: instance.name, port: Number(port)}) }}>
-            <label className="dynamic-field"><span>Running instance</span><select className="input" value={instanceId} onChange={(event) => setInstanceId(event.target.value)} disabled={dependenciesQuery.isLoading || registerMutation.isPending}><option value="">Select an instance</option>{instances.map((instance) => <option key={instance.id} value={instance.id}>{instance.name} ({instance.id}{instance.privateIp ? `, ${instance.privateIp}` : ''})</option>)}</select></label>
+            <label className="dynamic-field"><span>Running instance</span><select className="input" value={instanceId} onChange={(event) => setInstanceId(event.target.value)} disabled={dependenciesQuery.isLoading}><option value="">Select an instance</option>{instances.map((instance) => <option key={instance.id} value={instance.id}>{instance.name} ({instance.id}{instance.privateIp ? `, ${instance.privateIp}` : ''})</option>)}</select></label>
-            <label className="dynamic-field"><span>Target port</span><input className="input" type="number" min="1" max="65535" value={port} onChange={(event) => setPort(event.target.value)} disabled={registerMutation.isPending}/></label>
+            <label className="dynamic-field"><span>Target port</span><input className="input" type="number" min="1" max="65535" value={port} onChange={(event) => setPort(event.target.value)}/></label>
-            <div style={{alignSelf: 'end'}}><button className="button primary" type="submit" disabled={!runtimeReachable || !instanceId || !validPort || registerMutation.isPending}>{registerMutation.isPending ? 'Registering' : 'Register target'}</button></div>
+            <div style={{alignSelf: 'end'}}><button className="button primary" type="submit" disabled={!runtimeReachable || !instanceId || !validPort}>Register target</button></div>
             {instances.length === 0 && dependenciesQuery.isSuccess && <p className="muted">No running instances are available in this account.</p>}
-            {registerMutation.isPending && <div className="dynamic-field--span"><LoadBalancingProgress kind="target" description="Waiting for the target health check to become healthy or unhealthy."/></div>}
         </form>
         {error instanceof Error && <p className="error-text compact-text" role="alert">{error.message}</p>}
         {healthQuery.isLoading && <div className="muted padded">Loading target health</div>}
-        {healthQuery.isSuccess && targets.length === 0 && <div className="empty compact"><h3>No registered targets</h3><p>Register a running instance to see its ELB health state.</p></div>}
+        {healthQuery.isSuccess && targets.length === 0 && pendingRows.length === 0 && <div className="empty compact"><h3>No registered targets</h3><p>Register a running instance to see its ELB health state.</p></div>}
-        {targets.length > 0 && <div className="cosmos-items-table"><table><thead><tr><th>Instance</th><th>Port</th><th>State</th><th>Reason</th><th>Description</th><th/></tr></thead><tbody>{targets.map((target) => <tr key={target.id}><td><code>{stringValue(target.body.id)}</code></td><td>{stringValue(target.body.port)}</td><td>{stringValue(target.body.state) || '-'}</td><td>{stringValue(target.body.reason) || '-'}</td><td>{stringValue(target.body.description) || '-'}</td><td><button className="icon-btn danger" type="button" title="Deregister target" aria-label={`Deregister ${stringValue(target.body.id)}`} disabled={!runtimeReachable || deregisterMutation.isPending} onClick={() => deregisterMutation.mutate(target.id)}><Trash2 size={14}/></button></td></tr>)}</tbody></table></div>}
+        {(targets.length > 0 || pendingRows.length > 0) && <div className="cosmos-items-table target-health-table"><table><thead><tr><th>Instance</th><th>Port</th><th>State</th><th>Reason</th><th>Description</th><th/></tr></thead><tbody>{pendingRows.map((target) => <tr key={`${target.id}:${target.port}`}><td><code>{target.id}</code></td><td>{target.port}</td><td><span className="target-state"><TargetHealthIcon state="checking"/>Checking</span></td><td>-</td><td>Waiting for target health.</td><td/></tr>)}{targets.map((target) => { const state = stringValue(target.body.state); return <tr key={target.id}><td><code>{stringValue(target.body.id)}</code></td><td>{stringValue(target.body.port)}</td><td><span className="target-state"><TargetHealthIcon state={state}/>{state || '-'}</span></td><td>{stringValue(target.body.reason) || '-'}</td><td>{stringValue(target.body.description) || '-'}</td><td><button className="icon-btn danger" type="button" title="Deregister target" aria-label={`Deregister ${stringValue(target.body.id)}`} disabled={!runtimeReachable || deregisterMutation.isPending} onClick={() => deregisterMutation.mutate(target.id)}><Trash2 size={14}/></button></td></tr>})}</tbody></table></div>}
     </section>
 }
 

packages/frontend/src/index.css

@@ -976,6 +976,21 @@ pre,
 .workflow-studio > .dynamic-stage-header { min-height: 58px; margin: 0; padding: 9px 18px; border-bottom: 1px solid var(--border); }
 .workflow-studio > .dynamic-stage-header h3 { margin: 1px 0 0; font-size: 15px; }
 .workflow-studio > .compact-text { margin: 0; padding: 7px 18px; border-bottom: 1px solid var(--border-faint); }
+.codebuild-progress { display: flex; align-items: center; gap: 18px; margin: 16px; padding: 16px 18px; border: 1px solid color-mix(in srgb, var(--link) 42%, var(--border)); border-radius: 10px; background: color-mix(in srgb, var(--link) 6%, var(--surface)); }
+.codebuild-progress h3 { margin: 3px 0 0; color: var(--text-bright); font-size: 14px; }
+.codebuild-progress p:last-child { margin: 5px 0 0; }
+.codebuild-progress-art { width: 112px; height: 103px; flex: 0 0 auto; overflow: visible; }
+.pipeline-release-progress { display: flex; align-items: center; gap: 18px; margin: 16px; padding: 16px 18px; border: 1px solid color-mix(in srgb, #e38c6c 46%, var(--border)); border-radius: 10px; background: color-mix(in srgb, #e38c6c 8%, var(--surface)); }
+.pipeline-release-progress h3 { margin: 3px 0 0; color: var(--text-bright); font-size: 14px; }
+.pipeline-release-progress p:last-child { margin: 5px 0 0; }
+.pipeline-release-art { width: 112px; height: 112px; flex: 0 0 auto; overflow: visible; }
+.codebuild-art-outline { stroke: #050505; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; }
+.codebuild-art-binary { font-family: Arial, sans-serif; font-size: 51px; font-weight: 600; fill: #43bed0; }
+.codebuild-art-gear { transform-box: fill-box; transform-origin: center; animation: codebuild-gear-spin 4s linear infinite; }
+@keyframes codebuild-gear-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) { .codebuild-art-gear { animation: none; } .codebuild-art-binary animate { display: none; } }
+@media (max-width: 520px) { .codebuild-progress { align-items: flex-start; margin: 12px; padding: 14px; } .codebuild-progress-art { width: 76px; height: 70px; } }
+@media (max-width: 520px) { .pipeline-release-progress { align-items: flex-start; margin: 12px; padding: 14px; } .pipeline-release-art { width: 76px; height: 76px; } }
 .workflow-studio-actions { display: flex; align-items: center; gap: 8px; }
 .workflow-save-definition { min-height: 30px; border-color: var(--workflow-save-border); background: var(--workflow-save-bg); color: var(--workflow-save-text); font-size: 11px; }
 .workflow-save-definition:not(:disabled):hover { border-color: var(--workflow-save-hover-border); background: var(--workflow-save-hover-bg); }
@@ -2881,6 +2896,8 @@ pre,
     align-items: start;
 }
 
+.ec2-launch-form { display: flex; flex-direction: column; gap: 18px; width: 100%; }
+
 .launch-form-group {
     grid-column: 1 / -1;
     display: flex;
@@ -2894,11 +2911,87 @@ pre,
     margin-top: 6px;
 }
 
-.launch-form-group::after {
+.launch-form-group::after { content: ''; flex: 1; height: 1px; background: var(--border); }
-    content: '';
+
-    flex: 1;
+.launch-form-header {
-    height: 1px;
+    display: flex;
-    background: var(--border);
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 24px;
+    padding-bottom: 4px;
+}
+
+.launch-form-header h3,
+.launch-form-header p { margin-bottom: 0; }
+
+.launch-form-header > span {
+    flex: 0 0 auto;
+    padding: 5px 9px;
+    border: 1px solid color-mix(in srgb, var(--link) 36%, var(--border));
+    border-radius: 999px;
+    background: color-mix(in srgb, var(--link) 9%, var(--surface));
+    color: var(--link);
+    font-size: 10px;
+    font-weight: 700;
+    letter-spacing: .05em;
+    text-transform: uppercase;
+}
+
+.launch-stepper {
+    display: grid;
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+    gap: 6px;
+    overflow-x: auto;
+}
+
+.launch-stepper button {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 145px;
+    padding: 9px 10px;
+    border: 1px solid var(--border);
+    border-radius: 8px;
+    background: var(--surface);
+    color: var(--text-3);
+    font: inherit;
+    font-size: 11px;
+    font-weight: 600;
+    text-align: left;
+}
+
+.launch-stepper button:not(:disabled) { cursor: pointer; }
+.launch-stepper button:disabled { opacity: .58; }
+.launch-stepper button.active { border-color: color-mix(in srgb, var(--link) 52%, var(--border)); background: color-mix(in srgb, var(--link) 8%, var(--surface)); color: var(--text); }
+.launch-stepper b { display: grid; width: 22px; height: 22px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--raised); color: var(--text-3); font-size: 10px; }
+.launch-stepper button.active b { background: var(--link); color: #fff; }
+
+.launch-form-section {
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+    width: 100%;
+}
+
+.launch-section-title {
+    display: flex;
+    align-items: flex-start;
+    gap: 11px;
+    padding: 14px 16px;
+    border: 1px solid var(--border);
+    border-radius: 10px;
+    background: color-mix(in srgb, var(--surface) 94%, var(--bg));
+}
+
+.launch-section-title > svg { flex: 0 0 auto; margin-top: 1px; color: var(--link); }
+.launch-section-title h4 { margin: 0; color: var(--text-bright); font-size: 13px; }
+.launch-section-title p { margin: 3px 0 0; color: var(--text-3); font-size: 11px; line-height: 1.4; }
+
+.launch-form-grid {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 18px 22px;
+    align-items: start;
 }
 
 .launch-field {
@@ -2913,6 +3006,14 @@ pre,
     text-transform: uppercase;
 }
 
+.ec2-launch-form .launch-field { gap: 8px; min-width: 0; }
+.ec2-launch-form .launch-field > span { letter-spacing: .025em; text-transform: none; }
+.ec2-launch-form .launch-field .input,
+.ec2-launch-form .launch-field .textarea,
+.ec2-launch-form .launch-field select { width: 100%; min-width: 0; }
+.ec2-launch-form .launch-field .input { min-height: 38px; }
+.ec2-launch-form .launch-field small { color: var(--text-3); font-size: 10px; line-height: 1.4; }
+
 .launch-field--span {
     grid-column: 1 / -1;
 }
@@ -2927,6 +3028,25 @@ pre,
     border-top: 1px solid var(--border);
 }
 
+.ec2-launch-form .launch-form-actions { margin-top: 0; padding-top: 4px; border-top: 0; }
+
+.launch-choice-row { display: flex; gap: 8px; }
+.launch-choice-row label { display: flex; flex: 1; align-items: center; gap: 7px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text-2); font-size: 11px; cursor: pointer; }
+.launch-choice-row input { accent-color: var(--link); }
+.launch-key-create { display: grid; grid-template-columns: minmax(0, 1fr) 120px auto; gap: 8px; align-items: center; }
+.launch-key-create .button.primary { grid-column: 1 / -1; justify-self: start; }
+.launch-review { padding: 14px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
+.launch-review .meta-grid { margin-top: 2px; }
+
+@media (max-width: 720px) {
+    .launch-form-grid { grid-template-columns: 1fr; }
+    .ec2-launch-form .launch-field--span { grid-column: auto; }
+    .launch-stepper { grid-template-columns: repeat(4, minmax(145px, 1fr)); }
+    .launch-form-header { gap: 12px; }
+    .launch-key-create { grid-template-columns: 1fr; }
+    .launch-key-create .button.primary { grid-column: auto; }
+}
+
 .ami-catalog {
     display: grid;
     gap: 12px;
@@ -3414,6 +3534,35 @@ pre,
     min-width: 0;
 }
 
+.msk-workspace { grid-template-columns: minmax(0, 1fr); gap: 18px; }
+.msk-service-section { border-radius: 10px; }
+.msk-section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 16px 18px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 94%, var(--bg)); }
+.msk-section-heading { display: flex; align-items: flex-start; gap: 11px; min-width: 0; }
+.msk-section-heading > span { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--link) 30%, var(--border)); border-radius: 8px; background: color-mix(in srgb, var(--link) 9%, var(--surface)); color: var(--link); }
+.msk-section-heading h3 { margin: 2px 0 0; color: var(--text-bright); font-size: 13px; }
+.msk-section-heading p:last-child { margin: 4px 0 0; }
+.msk-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 22px; align-items: start; padding: 18px; }
+.msk-form .dynamic-field { gap: 8px; }
+.msk-form .dynamic-field > span { letter-spacing: .025em; text-transform: none; }
+.msk-form .input { width: 100%; min-width: 0; min-height: 38px; }
+.msk-form .subnet-multiselect { min-height: 88px; }
+.msk-form-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding-top: 2px; }
+.msk-form-actions > span { margin-right: auto; color: var(--text-3); font-size: 10px; line-height: 1.4; }
+.msk-active-resource { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px; padding: 16px 18px; border-top: 1px solid var(--border); background: var(--surface); }
+.msk-active-resource .dynamic-field { gap: 8px; }
+.msk-resource-list { display: grid; gap: 6px; padding: 0 18px 18px; }
+.msk-resource-list > .compact-text { margin: 0; padding: 10px 0; }
+.msk-lag-form { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
+.msk-lag-form .msk-form-actions { grid-column: auto; }
+.msk-error { margin: 0 18px 18px; }
+
+@media (max-width: 720px) {
+    .msk-form, .msk-lag-form { grid-template-columns: minmax(0, 1fr); }
+    .msk-form .dynamic-field--span, .msk-form-actions, .msk-lag-form .msk-form-actions { grid-column: auto; }
+    .msk-active-resource { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
+    .msk-section-header { gap: 12px; }
+}
+
 .sns-topic-summary {
     display: flex;
     justify-content: space-between;
@@ -4881,6 +5030,34 @@ button.console-service-card {
     gap: 14px;
 }
 
+.codedeploy-create-form { display: flex; flex-direction: column; gap: 18px; width: 100%; }
+.codedeploy-form-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 4px; }
+.codedeploy-form-header h3, .codedeploy-form-header p { margin-bottom: 0; }
+.codedeploy-form-header > span { flex: 0 0 auto; padding: 5px 9px; border: 1px solid color-mix(in srgb, var(--link) 36%, var(--border)); border-radius: 999px; background: color-mix(in srgb, var(--link) 9%, var(--surface)); color: var(--link); font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
+.codedeploy-form-section { display: flex; flex-direction: column; gap: 18px; padding: 18px; border: 1px solid var(--border); border-radius: 10px; background: color-mix(in srgb, var(--surface) 94%, var(--bg)); }
+.codedeploy-section-title { display: flex; align-items: flex-start; gap: 11px; padding-bottom: 13px; border-bottom: 1px solid var(--border); }
+.codedeploy-section-title > svg { flex: 0 0 auto; margin-top: 1px; color: var(--link); }
+.codedeploy-section-title h4 { margin: 0; color: var(--text-bright); font-size: 13px; }
+.codedeploy-section-title p { margin: 3px 0 0; color: var(--text-3); font-size: 11px; line-height: 1.4; }
+.codedeploy-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 22px; align-items: start; }
+.codedeploy-form-grid .dynamic-field { gap: 8px; }
+.codedeploy-form-grid .dynamic-field > span { letter-spacing: .025em; text-transform: none; }
+.codedeploy-form-grid .input { min-height: 38px; }
+.codedeploy-listener-field { grid-column: 1 / -1; }
+.codedeploy-target-card { padding: 14px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
+.codedeploy-target-card b { width: max-content; padding: 3px 8px; border-radius: 999px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
+.codedeploy-target-card.blue { border-color: color-mix(in srgb, #45b5fa 42%, var(--border)); }
+.codedeploy-target-card.blue b { background: color-mix(in srgb, #45b5fa 18%, var(--surface)); color: #2398df; }
+.codedeploy-target-card.green { border-color: color-mix(in srgb, #62c9aa 48%, var(--border)); }
+.codedeploy-target-card.green b { background: color-mix(in srgb, #62c9aa 18%, var(--surface)); color: #278f70; }
+.codedeploy-rollback { display: flex; align-items: flex-start; gap: 10px; min-height: 38px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); cursor: pointer; }
+.codedeploy-rollback input { margin-top: 2px; accent-color: var(--link); }
+.codedeploy-rollback span, .codedeploy-rollback strong, .codedeploy-rollback small { display: block; }
+.codedeploy-rollback strong { color: var(--text); font-size: 11px; }
+.codedeploy-rollback small { margin-top: 3px; color: var(--text-3); font-size: 10px; line-height: 1.35; }
+.codedeploy-form-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 4px; }
+@media (max-width: 720px) { .codedeploy-form-grid { grid-template-columns: 1fr; } .codedeploy-listener-field { grid-column: auto; } .codedeploy-form-header { gap: 12px; } }
+
 .ec2-readiness-grid {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
@@ -4914,6 +5091,25 @@ button.console-service-card {
     color: var(--status-error);
 }
 
+.ec2-readiness-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
+.ec2-launch-cpu { width: 42px; height: 42px; flex: 0 0 auto; }
+.ec2-cpu-pins { fill: none; stroke: #17162b; stroke-width: 2; stroke-linecap: round; }
+.ec2-launch-cpu.active .ec2-cpu-pins { animation: ec2-cpu-pin 1.2s ease-in-out infinite; }
+.ec2-cpu-chip { fill: #45b5fa; stroke: #17162b; stroke-width: 2.5; }
+.ec2-cpu-label { font: 25px Arial, sans-serif; fill: #17162b; letter-spacing: 4px; }
+.ec2-cpu-pulse { fill: none; stroke: #8bd6ff; stroke-width: 2; opacity: 0; transform-origin: 67px 66px; }
+.ec2-launch-cpu.active .ec2-cpu-pulse { animation: ec2-cpu-pulse 1.8s ease-out infinite; }
+.ec2-cpu-dots { fill: #17162b; }
+.ec2-ssh-heartbeat { width: 72px; height: 25px; overflow: visible; }
+.ec2-ssh-heartbeat path { fill: none; stroke: var(--text-3); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
+.ec2-ssh-heartbeat.active path { stroke: #ef5b5b; stroke-dasharray: 118; animation: ec2-ekg-trace 1.55s linear infinite; }
+.ec2-key-ready { width: 45px; height: 45px; margin: -4px -4px -8px 0; }
+@keyframes ec2-cpu-pin { 0%, 100% { stroke: #17162b; } 50% { stroke: #45b5fa; } }
+@keyframes ec2-cpu-pulse { 0% { opacity: .8; transform: scale(.75); } 100% { opacity: 0; transform: scale(1.08); } }
+@keyframes ec2-ekg-trace { from { stroke-dashoffset: 118; } to { stroke-dashoffset: 0; } }
+
+@media (prefers-reduced-motion: reduce) { .ec2-launch-cpu.active .ec2-cpu-pins, .ec2-launch-cpu.active .ec2-cpu-pulse, .ec2-ssh-heartbeat.active path { animation: none; } }
+
 .ec2-connect-error,
 .ec2-check-result {
     display: flex;
@@ -5908,11 +6104,11 @@ button.console-service-card {
 .lightsail-config { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
 .lightsail-config label { display: grid; gap: 6px; font-weight: 600; }
 .server-launch-progress { display: flex; align-items: center; gap: 14px; margin-top: 20px; padding: 13px 16px; border: 1px solid color-mix(in srgb, #ec7211 45%, var(--border)); border-radius: 9px; background: color-mix(in srgb, #ec7211 8%, var(--surface)); }
-.server-launch-progress svg { width: 70px; height: 56px; flex: 0 0 auto; }
+.server-launch-progress-art { width: 70px; height: 56px; flex: 0 0 auto; }
 .server-launch-progress div { display: flex; flex-direction: column; gap: 3px; }
 .server-launch-progress small { color: var(--text-muted); }
 .database-launch-progress { display: flex; align-items: center; gap: 14px; margin-top: 20px; padding: 13px 16px; border: 1px solid color-mix(in srgb, #1769c2 45%, var(--border)); border-radius: 9px; background: color-mix(in srgb, #1769c2 8%, var(--surface)); }
-.database-launch-progress svg { width: 56px; height: 56px; flex: 0 0 auto; }
+.database-launch-progress-art { width: 56px; height: 56px; flex: 0 0 auto; }
 .database-launch-progress div { display: flex; flex-direction: column; gap: 3px; }
 .database-launch-progress small { color: var(--text-muted); }
 .database-led { animation: database-led-blink 1.4s ease-in-out infinite; }
@@ -5921,11 +6117,12 @@ button.console-service-card {
 .database-led-d { animation-delay: .66s; }
 @keyframes database-led-blink { 0%, 25%, 100% { opacity: .28; } 45%, 72% { opacity: 1; } }
 .load-balancing-progress { display: flex; align-items: center; gap: 14px; margin-top: 16px; padding: 13px 16px; border: 1px solid color-mix(in srgb, #ffc52e 45%, var(--border)); border-radius: 9px; background: color-mix(in srgb, #ffc52e 8%, var(--surface)); }
-.load-balancing-progress svg { width: 72px; height: 64px; flex: 0 0 auto; }
+.load-balancing-progress-art, .load-balancing-progress svg { width: 72px; height: 64px; flex: 0 0 auto; }
 .load-balancing-progress div { display: flex; flex-direction: column; gap: 3px; }
 .load-balancing-progress small { color: var(--text-muted); }
 .lb-device { fill: #30283d; }.lb-panel { fill: #2b2440; stroke: #17132f; stroke-width: 5; }.lb-wire { fill: none; stroke: #17132f; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }.lb-yellow { fill: #ffc12d; }.lb-green { fill: #31aa98; }.lb-port { fill: none; stroke: #ffc52e; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }.lb-ports { animation: lb-port-morph 4.5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }.lb-hub { animation: lb-hub-pulse 4.5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }.lb-blink-1 { animation: lb-blink-one 4.5s steps(1, end) infinite; }.lb-blink-2 { animation: lb-blink-two 4.5s steps(1, end) infinite; }.lb-blink-3 { animation: lb-blink-three 4.5s steps(1, end) infinite; }
 @keyframes lb-blink-one { 0%, 18%, 42%, 68%, 100% { opacity: 1; } 19%, 41%, 69%, 84% { opacity: .22; } } @keyframes lb-blink-two { 0%, 28%, 58%, 88%, 100% { opacity: .28; } 29%, 57%, 89%, 99% { opacity: 1; } } @keyframes lb-blink-three { 0%, 12%, 48%, 76%, 100% { opacity: 1; } 13%, 47%, 77%, 92% { opacity: .2; } } @keyframes lb-port-morph { 0%, 18%, 82%, 100% { transform: scaleX(.62); } 42%, 62% { transform: scaleX(1.18); } } @keyframes lb-hub-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.13); } }
+.target-health-table table { min-width: 860px; table-layout: fixed; }.target-health-table th, .target-health-table td { padding: 14px 16px; vertical-align: middle; }.target-health-table th:nth-child(1) { width: 215px; }.target-health-table th:nth-child(2) { width: 70px; }.target-health-table th:nth-child(3) { width: 145px; }.target-health-table th:nth-child(4) { width: 170px; }.target-health-table th:last-child { width: 48px; }.target-health-table code { font-size: 12px; }.target-state { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; text-transform: capitalize; }.target-state-icon { display: inline-block; width: 48px; height: 38px; flex: 0 0 auto; }.target-state-icon svg { width: 100%; height: 100%; }.target-state-icon--checking { animation: target-checking 1.2s ease-in-out infinite; }.target-state-icon--unhealthy { color: #cc3d3d; } @keyframes target-checking { 50% { opacity: .4; } }
 @media (max-width: 640px) { .lightsail-launch { padding: 18px; } .lightsail-config { grid-template-columns: 1fr; } .lightsail-platform, .lightsail-blueprint, .lightsail-plans button { width: 100%; } }
 
 .lightsail-instance-panel { overflow: visible; }

svgAsset/CodeBuild.svg

@@ -0,0 +1,99 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="300" height="275" viewBox="0 0 300 275"
+ role="img" aria-label="Animated binary configuration icon">
+<style>
+.outline{stroke:#050505;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
+.binary{font-family:Arial,sans-serif;font-size:51px;font-weight:600;fill:#43bed0}
+.gear{transform-box:fill-box;transform-origin:center;animation:spin 4s linear infinite}
+@keyframes spin{to{transform:rotate(360deg)}}
+</style>
+
+<!-- browser -->
+<rect x="83" y="56" width="165" height="158" fill="#fff" class="outline"/>
+<line x1="84" y1="96" x2="247" y2="96" class="outline"/>
+<circle cx="108" cy="77" r="4"/>
+<circle cx="126" cy="77" r="4"/>
+<line x1="174" y1="77" x2="224" y2="77" class="outline"/>
+
+<!-- Binary rows: characters change independently for a continuous effect -->
+<g class="binary">
+  <text x="98" y="149">0
+    <animate attributeName="opacity" values="1;1;0;0;1" dur="1.8s" repeatCount="indefinite"/>
+  </text>
+  <text x="98" y="149" opacity="0">1
+    <animate attributeName="opacity" values="0;0;1;1;0" dur="1.8s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="127" y="149">1
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".35s" dur="2.1s" repeatCount="indefinite"/>
+  </text>
+  <text x="127" y="149" opacity="0">0
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".35s" dur="2.1s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="156" y="149">0
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".7s" dur="1.9s" repeatCount="indefinite"/>
+  </text>
+  <text x="156" y="149" opacity="0">1
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".7s" dur="1.9s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="185" y="149">1
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".15s" dur="2.3s" repeatCount="indefinite"/>
+  </text>
+  <text x="185" y="149" opacity="0">0
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".15s" dur="2.3s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="214" y="149">0
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".9s" dur="2s" repeatCount="indefinite"/>
+  </text>
+  <text x="214" y="149" opacity="0">1
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".9s" dur="2s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="98" y="197">1
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".5s" dur="2.2s" repeatCount="indefinite"/>
+  </text>
+  <text x="98" y="197" opacity="0">0
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".5s" dur="2.2s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="127" y="197">0
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".1s" dur="1.85s" repeatCount="indefinite"/>
+  </text>
+  <text x="127" y="197" opacity="0">1
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".1s" dur="1.85s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="156" y="197">1
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".8s" dur="2.4s" repeatCount="indefinite"/>
+  </text>
+  <text x="156" y="197" opacity="0">0
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".8s" dur="2.4s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="185" y="197">0
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".25s" dur="2s" repeatCount="indefinite"/>
+  </text>
+  <text x="185" y="197" opacity="0">1
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".25s" dur="2s" repeatCount="indefinite"/>
+  </text>
+
+  <text x="214" y="197">1
+    <animate attributeName="opacity" values="1;1;0;0;1" begin=".65s" dur="1.95s" repeatCount="indefinite"/>
+  </text>
+  <text x="214" y="197" opacity="0">0
+    <animate attributeName="opacity" values="0;0;1;1;0" begin=".65s" dur="1.95s" repeatCount="indefinite"/>
+  </text>
+</g>
+
+<!-- rotating cog -->
+<g class="gear">
+<path d="M225 163 L236 167 L244 161 L254 171 L249 180 L254 190 L265 193
+L265 207 L254 210 L249 220 L254 229 L244 239 L235 234 L225 238 L222 249
+L208 249 L205 238 L195 234 L186 239 L176 229 L181 220 L177 210 L166 207
+L166 193 L177 190 L181 180 L176 171 L186 161 L195 167 L205 163 L208 152
+L222 152 Z" fill="#fff" class="outline"/>
+<circle cx="215.5" cy="200.5" r="16" fill="#fff" class="outline"/>
+</g>
+</svg>

svgAsset/animated-cpu.svg

@@ -0,0 +1,29 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="140" height="140" viewBox="0 0 140 140" role="img" aria-label="Animated CPU">
+<style>
+.pin{stroke:#17162b;stroke-width:2;stroke-linecap:round}
+.chip{fill:#45b5fa;stroke:#17162b;stroke-width:2.5}
+.cpu{font: 25px Arial,sans-serif;fill:#17162b;letter-spacing:4px}
+.pulse{fill:none;stroke:#8bd6ff;stroke-width:2;opacity:0;animation:pulse 1.8s ease-out infinite}
+.p1{animation:pin 1.2s ease-in-out infinite}.p2{animation:pin 1.2s .2s ease-in-out infinite}.p3{animation:pin 1.2s .4s ease-in-out infinite}
+@keyframes pin{0%,100%{stroke:#17162b}50%{stroke:#45b5fa}}
+@keyframes pulse{0%{opacity:.8;transform:scale(.75)}100%{opacity:0;transform:scale(1.08)}}
+</style>
+
+<!-- pins -->
+<g>
+ <path class="pin p1" d="M40 25V13M58 25V13M76 25V13M94 25V13"/>
+ <path class="pin p2" d="M40 106v13M58 106v13M76 106v13M94 106v13"/>
+ <path class="pin p3" d="M27 40H14M27 58H14M27 76H14M27 94H14"/>
+ <path class="pin p1" d="M107 40h13M107 58h13M107 76h13M107 94h13"/>
+</g>
+
+<rect class="chip" x="27" y="26" width="80" height="80" rx="6"/>
+<rect class="pulse" x="31" y="30" width="72" height="72" rx="4" transform-origin="67px 66px"/>
+<text class="cpu" x="38" y="76">CPU</text>
+
+<!-- animated processing/data dots -->
+<g fill="#17162b">
+ <circle r="2.5"><animateMotion dur="1.5s" repeatCount="indefinite" path="M31 45 H103"/><animate attributeName="opacity" values="0;1;1;0" dur="1.5s" repeatCount="indefinite"/></circle>
+ <circle r="2.5"><animateMotion begin=".45s" dur="1.5s" repeatCount="indefinite" path="M103 89 H31"/><animate attributeName="opacity" begin=".45s" values="0;1;1;0" dur="1.5s" repeatCount="indefinite"/></circle>
+</g>
+</svg>

svgAsset/animated_load_balancer.svg

@@ -0,0 +1,52 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="140" height="140" viewBox="0 0 140 140" role="img" aria-label="Animated load balancer">
+  <style>
+    .device { fill:#30283d; }
+    .wire { fill:none; stroke:#30283d; stroke-width:2.4; stroke-linecap:round; }
+    .led { fill:#ffc12d; }
+    .blink1 { animation:blink 1.15s ease-in-out infinite; }
+    .blink2 { animation:blink 1.15s .25s ease-in-out infinite; }
+    .blink3 { animation:blink 1.15s .5s ease-in-out infinite; }
+    @keyframes blink { 0%,100%{opacity:.25} 45%,65%{opacity:1} }
+  </style>
+
+  <!-- Load balancer -->
+  <rect class="device" x="20" y="28" width="96" height="29" rx="4"/>
+  <circle class="led blink1" cx="35" cy="42.5" r="5.3"/>
+  <g class="led">
+    <circle class="blink1" cx="72" cy="37" r="2"/>
+    <circle class="blink2" cx="81" cy="37" r="2"/>
+    <circle class="blink3" cx="97" cy="37" r="2"/>
+    <circle class="blink2" cx="106" cy="37" r="2"/>
+    <circle class="blink3" cx="64" cy="47" r="2"/>
+    <circle class="blink1" cx="75" cy="47" r="2"/>
+    <circle class="blink2" cx="85" cy="47" r="2"/>
+    <circle class="blink3" cx="97" cy="47" r="2"/>
+    <circle class="blink1" cx="106" cy="47" r="2"/>
+  </g>
+
+  <!-- Connections -->
+  <path id="leftPath" class="wire" d="M58 64 L49 83 L42 97"/>
+  <path id="rightPath" class="wire" d="M79 64 L88 83 L94 97"/>
+
+  <!-- Packets moving from balancer down each branch -->
+  <circle r="3.2" fill="#ffc12d">
+    <animateMotion dur="1.55s" repeatCount="indefinite" path="M58 64 L49 83 L42 97"/>
+    <animate attributeName="opacity" values="0;1;1;0" keyTimes="0;.08;.82;1" dur="1.55s" repeatCount="indefinite"/>
+  </circle>
+  <circle r="3.2" fill="#ffc12d">
+    <animateMotion begin=".72s" dur="1.55s" repeatCount="indefinite" path="M79 64 L88 83 L94 97"/>
+    <animate attributeName="opacity" begin=".72s" values="0;1;1;0" keyTimes="0;.08;.82;1" dur="1.55s" repeatCount="indefinite"/>
+  </circle>
+
+  <!-- Backend boxes -->
+  <rect class="device" x="24" y="88" width="36" height="19" rx="5"/>
+  <rect class="device" x="77" y="88" width="36" height="19" rx="5"/>
+
+  <!-- brief receiving pulse -->
+  <rect x="24" y="88" width="36" height="19" rx="5" fill="#ffc12d" opacity="0">
+    <animate attributeName="opacity" values="0;0;.20;0" keyTimes="0;.72;.86;1" dur="1.55s" repeatCount="indefinite"/>
+  </rect>
+  <rect x="77" y="88" width="36" height="19" rx="5" fill="#ffc12d" opacity="0">
+    <animate attributeName="opacity" begin=".72s" values="0;0;.20;0" keyTimes="0;.72;.86;1" dur="1.55s" repeatCount="indefinite"/>
+  </rect>
+</svg>

svgAsset/cloud-code.svg

@@ -0,0 +1,662 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><title>Generated Animation</title>
+<desc>41 frames, 2.020s duration</desc>
+<g id="animationGroup">
+<g id="frame0" opacity="0">
+
+<path d="M0,0 L13,1 L29,6 L40,12 L49,19 L59,31 L66,45 L69,57 L69,75 L65,87 L65,90 L76,97 L84,105 L90,117 L92,125 L92,139 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-127,149 L-135,138 L-140,126 L-141,121 L-141,101 L-137,85 L-131,73 L-123,63 L-113,55 L-101,49 L-85,45 L-73,44 L-71,38 L-64,27 L-53,16 L-39,8 L-26,3 L-15,1 Z " fill="#9FCBF8" transform="translate(153,36)"/>
+<path d="M0,0 L3,0 L3,4 L-9,11 L-19,20 L-22,23 L-20,27 L-7,37 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-19,13 L-4,2 Z " fill="#1E2129" transform="translate(98,113)"/>
+<path d="M0,0 L5,1 L18,10 L28,19 L30,21 L30,26 L20,36 L4,47 L0,47 L1,43 L13,35 L24,26 L25,22 L16,14 L2,5 L0,4 Z " fill="#1D2028" transform="translate(154,113)"/>
+<path d="M0,0 L68,0 L70,2 L69,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(63,222)"/>
+<path d="M0,0 L10,1 L24,8 L32,15 L38,24 L42,33 L43,37 L43,53 L41,53 L39,36 L34,24 L28,16 L19,9 L6,4 L0,3 Z " fill="#232731" transform="translate(160,50)"/>
+<path d="M0,0 L3,0 L2,7 L-11,43 L-13,46 L-16,45 L-15,40 L-1,1 Z " fill="#1E212A" transform="translate(134,114)"/>
+<path d="M0,0 L5,0 L4,3 L-12,7 L-28,15 L-40,26 L-47,37 L-49,40 L-51,40 L-50,35 L-41,22 L-31,13 L-17,5 L-5,1 Z " fill="#15151B" transform="translate(123,25)"/>
+<path d="M0,0 L32,0 L33,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L7,0 L15,3 L19,7 L18,11 L11,7 L6,5 L0,3 Z " fill="#1F232B" transform="translate(77,80)"/>
+<path d="M0,0 L10,1 L12,3 L10,5 L0,3 Z " fill="#282E39" transform="translate(160,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.000000;0.009901" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame1" opacity="0">
+
+<path d="M0,0 L13,1 L24,4 L34,8 L46,16 L54,24 L61,34 L67,47 L69,55 L70,65 L68,80 L65,87 L65,90 L75,96 L80,100 L86,108 L90,116 L92,123 L92,141 L88,153 L82,161 L75,167 L66,171 L62,172 L-81,172 L-98,168 L-114,160 L-124,151 L-133,141 L-139,129 L-141,120 L-141,104 L-138,89 L-133,77 L-126,67 L-116,57 L-104,50 L-91,46 L-76,44 L-73,43 L-67,31 L-56,19 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF8" transform="translate(152,36)"/>
+<path d="M0,0 L4,1 L15,8 L28,19 L29,26 L22,34 L5,46 L0,47 L1,43 L15,33 L22,27 L24,27 L24,22 L14,13 L3,6 L-1,3 Z " fill="#1E212A" transform="translate(154,113)"/>
+<path d="M0,0 L3,0 L3,4 L-9,11 L-22,23 L-20,27 L-7,37 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-19,13 L-4,2 Z " fill="#1E2129" transform="translate(97,113)"/>
+<path d="M0,0 L66,0 L68,1 L68,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(65,222)"/>
+<path d="M0,0 L7,1 L20,6 L29,13 L35,20 L41,32 L43,40 L43,52 L42,54 L40,54 L39,40 L35,27 L29,18 L20,10 L12,6 L0,3 Z " fill="#242933" transform="translate(160,50)"/>
+<path d="M0,0 L3,0 L2,7 L-11,40 L-14,46 L-17,45 L-16,40 L-2,3 Z " fill="#1E2129" transform="translate(134,114)"/>
+<path d="M0,0 L4,0 L4,3 L-11,7 L-27,15 L-39,26 L-47,39 L-51,40 L-51,37 L-48,34 L-42,25 L-35,17 L-22,8 L-11,3 Z " fill="#15151B" transform="translate(121,25)"/>
+<path d="M0,0 L33,0 L33,3 L-1,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L8,0 L16,4 L20,8 L19,11 L14,9 L10,6 L0,3 Z " fill="#1E2129" transform="translate(76,80)"/>
+<path d="M0,0 L3,1 L3,13 L2,15 L0,15 Z " fill="#282E39" transform="translate(200,89)"/>
+<path d="M0,0 L7,2 L6,5 L0,2 Z " fill="#1E222A" transform="translate(171,53)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.009901;0.024752" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame2" opacity="0">
+
+<path d="M0,0 L18,2 L30,6 L41,12 L53,23 L61,34 L67,47 L70,62 L70,71 L67,84 L65,90 L75,96 L82,102 L89,113 L92,122 L92,142 L88,153 L84,159 L77,166 L66,171 L63,172 L-81,172 L-98,168 L-112,161 L-121,154 L-130,145 L-138,131 L-141,119 L-141,105 L-138,89 L-132,75 L-125,66 L-116,57 L-106,51 L-91,46 L-75,44 L-72,41 L-66,30 L-55,18 L-41,9 L-29,4 L-15,1 Z " fill="#9FCAF7" transform="translate(151,36)"/>
+<path d="M0,0 L4,1 L3,4 L-8,11 L-21,22 L-20,26 L-12,33 L4,44 L3,47 L-2,46 L-16,36 L-24,29 L-26,26 L-26,21 L-21,16 L-11,7 Z " fill="#1E212A" transform="translate(95,113)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L24,32 L11,42 L3,47 L0,47 L0,43 L11,36 L22,27 L24,25 L23,21 L15,14 L0,4 Z " fill="#1C1F27" transform="translate(154,113)"/>
+<path d="M0,0 L9,1 L20,6 L28,12 L36,21 L41,32 L43,39 L43,53 L42,55 L39,55 L39,38 L35,27 L29,18 L20,10 L8,5 L0,2 Z " fill="#222731" transform="translate(159,50)"/>
+<path d="M0,0 L65,0 L66,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(67,222)"/>
+<path d="M0,0 L3,1 L2,7 L-13,40 L-15,45 L-19,45 L-18,40 L-2,4 Z " fill="#1D2028" transform="translate(134,114)"/>
+<path d="M0,0 L1,3 L-17,9 L-29,16 L-38,24 L-45,34 L-48,40 L-55,40 L-55,38 L-50,36 L-44,26 L-37,18 L-26,10 L-12,3 Z " fill="#15151B" transform="translate(121,25)"/>
+<path d="M0,0 L35,0 L35,3 L0,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L8,0 L16,5 L19,8 L19,11 L15,10 L9,6 L0,3 Z " fill="#1B1D25" transform="translate(76,80)"/>
+<path d="M0,0 L3,1 L4,5 L4,19 L3,21 L0,21 Z " fill="#282E39" transform="translate(198,84)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.024752;0.034653" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame3" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L52,23 L59,32 L65,44 L68,54 L69,61 L69,72 L66,84 L64,90 L73,95 L82,103 L88,113 L91,122 L92,136 L90,146 L86,155 L79,164 L69,170 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-130,146 L-137,135 L-141,124 L-142,116 L-142,107 L-140,93 L-135,79 L-128,68 L-118,58 L-104,50 L-91,46 L-76,44 L-73,41 L-66,29 L-57,19 L-44,10 L-30,4 L-16,1 Z " fill="#9FCAF7" transform="translate(151,36)"/>
+<path d="M0,0 L4,1 L3,4 L-8,11 L-21,22 L-20,26 L-12,33 L4,44 L3,47 L-2,46 L-18,34 L-24,29 L-26,26 L-26,21 L-16,11 L-3,2 Z " fill="#1C1F27" transform="translate(93,113)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L23,33 L5,46 L0,47 L1,43 L16,32 L24,25 L23,21 L14,13 L0,4 Z " fill="#1C1F27" transform="translate(154,113)"/>
+<path d="M0,0 L11,2 L24,9 L33,18 L38,26 L41,34 L42,40 L42,53 L40,57 L38,57 L38,38 L34,27 L28,18 L28,16 L24,14 L15,8 L5,4 L0,2 Z " fill="#232731" transform="translate(159,50)"/>
+<path d="M0,0 L3,1 L2,6 L-11,30 L-19,43 L-23,42 L-21,37 L-8,14 Z " fill="#1E2129" transform="translate(135,115)"/>
+<path d="M0,0 L63,0 L64,3 L-1,3 Z " fill="#15151B" transform="translate(69,222)"/>
+<path d="M0,0 L4,0 L3,3 L-12,8 L-25,16 L-32,22 L-40,33 L-43,39 L-52,39 L-51,36 L-45,35 L-38,24 L-27,13 L-16,6 L-4,1 Z " fill="#15151B" transform="translate(115,26)"/>
+<path d="M0,0 L37,0 L37,3 L0,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L10,3 L17,8 L18,12 L14,12 L9,8 L5,6 L-2,4 L-2,1 Z " fill="#1E2029" transform="translate(77,79)"/>
+<path d="M0,0 L5,2 L4,5 L-2,2 Z " fill="#272D38" transform="translate(176,56)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.034653;0.049505" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame4" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,59 L69,73 L67,82 L64,88 L64,90 L73,95 L83,104 L88,113 L91,121 L92,127 L92,137 L90,147 L85,157 L79,164 L69,170 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-137,135 L-141,123 L-142,113 L-141,99 L-137,84 L-130,71 L-119,59 L-108,52 L-99,48 L-85,45 L-76,44 L-73,42 L-68,32 L-58,20 L-47,12 L-33,5 L-15,1 Z " fill="#9FCAF7" transform="translate(150,36)"/>
+<path d="M0,0 L4,1 L2,5 L-12,14 L-21,22 L-20,26 L-11,34 L4,44 L3,47 L-2,46 L-16,36 L-25,28 L-26,21 L-21,15 L-8,5 Z " fill="#1E2129" transform="translate(91,113)"/>
+<path d="M0,0 L4,1 L15,8 L26,17 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L18,31 L24,26 L23,20 L10,10 L0,4 Z " fill="#1E212A" transform="translate(154,113)"/>
+<path d="M0,0 L10,2 L20,7 L29,14 L36,24 L40,34 L41,39 L41,54 L37,58 L36,56 L37,53 L37,37 L32,25 L26,16 L15,8 L8,5 L0,3 Z " fill="#222731" transform="translate(159,50)"/>
+<path d="M0,0 L4,1 L2,6 L-8,19 L-20,36 L-23,40 L-27,39 L-25,34 L-15,21 L-5,7 Z " fill="#1D2029" transform="translate(136,117)"/>
+<path d="M0,0 L61,0 L63,1 L63,3 L-1,3 Z " fill="#15151B" transform="translate(71,222)"/>
+<path d="M0,0 L1,3 L-15,9 L-26,16 L-36,26 L-42,36 L-44,39 L-55,39 L-55,37 L-45,36 L-43,30 L-36,21 L-29,14 L-18,7 L-7,2 Z " fill="#15151B" transform="translate(115,26)"/>
+<path d="M0,0 L37,0 L38,3 L-1,3 Z " fill="#15151B" transform="translate(149,222)"/>
+<path d="M0,0 L10,3 L16,7 L18,9 L18,13 L14,12 L9,8 L-1,5 L-2,1 Z " fill="#1E222A" transform="translate(76,79)"/>
+<path d="M0,0 L6,1 L5,4 L0,3 Z " fill="#2E3643" transform="translate(159,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.049505;0.059406" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame5" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,20 L58,30 L66,46 L69,57 L69,75 L66,85 L64,89 L76,97 L83,104 L89,114 L92,125 L92,138 L90,147 L84,159 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-127,149 L-135,138 L-139,130 L-141,122 L-141,101 L-137,85 L-130,71 L-119,59 L-108,52 L-95,47 L-76,44 L-72,40 L-67,31 L-58,21 L-50,14 L-40,8 L-26,3 L-15,1 Z " fill="#9FCAF7" transform="translate(149,36)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-21,22 L-21,26 L-7,37 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,26 L-26,20 L-19,13 L-4,2 Z " fill="#1D2029" transform="translate(89,113)"/>
+<path d="M0,0 L5,1 L17,9 L27,18 L30,21 L30,26 L25,31 L15,40 L4,47 L0,47 L1,43 L13,35 L23,27 L25,25 L24,21 L12,11 L1,4 Z " fill="#1C1E27" transform="translate(154,113)"/>
+<path d="M0,0 L12,3 L23,10 L30,16 L38,30 L40,37 L40,55 L37,59 L35,59 L36,54 L36,37 L32,26 L24,15 L14,8 L7,5 L0,3 Z " fill="#252A34" transform="translate(159,50)"/>
+<path d="M0,0 L3,0 L2,3 L-13,9 L-25,18 L-32,25 L-40,38 L-53,39 L-53,36 L-41,35 L-39,29 L-32,20 L-25,13 L-14,6 L-3,1 Z " fill="#15151B" transform="translate(110,27)"/>
+<path d="M0,0 L3,0 L2,4 L-13,20 L-20,27 L-27,35 L-31,36 L-31,32 L-19,20 L-12,12 Z " fill="#1C1F27" transform="translate(138,119)"/>
+<path d="M0,0 L59,0 L60,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(74,222)"/>
+<path d="M0,0 L39,0 L39,3 L0,3 Z " fill="#15151B" transform="translate(149,222)"/>
+<path d="M0,0 L10,3 L16,7 L19,10 L19,13 L14,12 L8,7 L-1,5 L-2,1 Z " fill="#1E212A" transform="translate(75,79)"/>
+<path d="M0,0 L2,1 L2,15 L-1,19 L-3,19 L-2,14 L-1,11 Z " fill="#17181E" transform="translate(197,90)"/>
+<path d="M0,0 L1,3 L-2,7 L-4,7 L-3,2 Z " fill="#252B35" transform="translate(198,102)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.059406;0.074257" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame6" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L53,23 L62,36 L67,48 L69,56 L69,76 L65,87 L65,90 L75,96 L84,105 L91,119 L92,124 L92,140 L88,153 L82,161 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-131,144 L-138,132 L-141,121 L-141,103 L-138,88 L-130,72 L-122,62 L-110,53 L-98,48 L-85,45 L-75,44 L-73,43 L-67,31 L-56,19 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF7" transform="translate(148,36)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-20,21 L-21,25 L-12,33 L4,44 L4,47 L-2,46 L-16,36 L-25,28 L-26,21 L-21,16 L-11,7 Z " fill="#1E212A" transform="translate(86,113)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L13,41 L4,47 L0,47 L1,43 L14,34 L25,25 L23,21 L13,12 L0,4 Z " fill="#1D2028" transform="translate(155,113)"/>
+<path d="M0,0 L9,1 L20,7 L28,14 L34,22 L39,36 L39,54 L36,59 L34,59 L35,54 L36,46 L34,31 L28,20 L20,11 L9,5 L0,2 Z " fill="#21262F" transform="translate(159,51)"/>
+<path d="M0,0 L4,1 L3,4 L-11,15 L-27,28 L-33,32 L-35,32 L-36,29 L-28,22 L-11,9 Z " fill="#1D2029" transform="translate(139,121)"/>
+<path d="M0,0 L4,0 L4,2 L-13,10 L-23,18 L-30,26 L-36,36 L-37,37 L-52,38 L-52,36 L-44,34 L-38,33 L-32,23 L-23,13 L-13,6 Z " fill="#15151B" transform="translate(106,28)"/>
+<path d="M0,0 L57,0 L58,3 L-1,3 L-2,1 Z " fill="#15151B" transform="translate(76,222)"/>
+<path d="M0,0 L41,0 L41,3 L0,3 Z " fill="#15151B" transform="translate(149,222)"/>
+<path d="M0,0 L7,0 L15,4 L20,9 L20,13 L16,12 L9,6 L0,4 Z " fill="#20242E" transform="translate(73,80)"/>
+<path d="M0,0 L1,0 L1,18 L-2,23 L-4,23 L-3,18 L-2,10 L-2,2 Z " fill="#262C37" transform="translate(197,87)"/>
+<path d="M0,0 L7,1 L8,3 L2,3 L0,2 Z " fill="#1C1E26" transform="translate(159,51)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.074257;0.084158" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame7" opacity="0">
+
+<path d="M0,0 L18,2 L30,6 L39,11 L48,18 L55,25 L62,36 L67,47 L70,62 L70,70 L67,84 L65,90 L75,96 L82,102 L89,113 L92,122 L92,142 L88,153 L84,159 L77,166 L66,171 L63,172 L-81,172 L-98,168 L-114,160 L-126,149 L-132,142 L-139,128 L-141,119 L-141,105 L-138,89 L-132,75 L-125,66 L-116,57 L-106,51 L-91,46 L-75,44 L-72,41 L-66,30 L-55,18 L-41,9 L-29,4 L-15,1 Z " fill="#9FCAF7" transform="translate(147,36)"/>
+<path d="M0,0 L4,1 L15,8 L26,17 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L15,33 L24,26 L23,21 L14,13 L3,6 L-1,3 Z " fill="#1E212A" transform="translate(156,113)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-21,21 L-22,25 L-10,35 L2,43 L3,47 L-2,46 L-15,37 L-25,28 L-27,26 L-26,20 L-19,13 L-4,2 Z " fill="#1D2028" transform="translate(84,113)"/>
+<path d="M0,0 L10,2 L22,9 L29,16 L36,28 L39,38 L39,52 L35,60 L32,60 L34,55 L35,52 L35,37 L31,26 L25,17 L16,9 L8,5 L0,2 Z " fill="#1F232C" transform="translate(159,51)"/>
+<path d="M0,0 L4,1 L3,4 L-15,14 L-36,26 L-39,26 L-38,22 L-21,12 Z " fill="#1E2029" transform="translate(140,124)"/>
+<path d="M0,0 L2,2 L-17,12 L-28,22 L-35,33 L-37,37 L-54,39 L-54,36 L-39,33 L-32,22 L-24,13 L-10,4 Z " fill="#15151B" transform="translate(106,28)"/>
+<path d="M0,0 L55,0 L57,1 L57,3 L-1,3 Z " fill="#15151B" transform="translate(78,222)"/>
+<path d="M0,0 L42,0 L42,3 L-1,3 Z " fill="#15151B" transform="translate(150,222)"/>
+<path d="M0,0 L7,0 L15,4 L21,10 L20,13 L17,13 L12,8 L7,5 L0,3 Z " fill="#1B1D25" transform="translate(72,80)"/>
+<path d="M0,0 L1,0 L1,14 L-3,22 L-6,22 L-4,17 L-1,12 Z " fill="#303846" transform="translate(197,89)"/>
+<path d="M0,0 L7,1 L6,4 L0,2 Z " fill="#252A35" transform="translate(159,51)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.084158;0.099010" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame8" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,20 L58,30 L66,46 L69,59 L69,73 L67,82 L64,88 L64,90 L73,95 L83,104 L90,117 L92,127 L92,137 L90,147 L85,157 L79,164 L69,170 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-137,135 L-141,123 L-142,112 L-140,94 L-136,82 L-130,71 L-119,59 L-108,52 L-99,48 L-85,45 L-76,44 L-73,42 L-68,32 L-58,20 L-47,12 L-33,5 L-15,1 Z " fill="#9FCAF7" transform="translate(147,36)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-20,21 L-21,25 L-12,33 L4,44 L4,47 L-2,46 L-21,32 L-26,26 L-26,21 L-16,11 L-3,2 Z " fill="#1C1F27" transform="translate(81,113)"/>
+<path d="M0,0 L6,2 L16,9 L27,18 L29,21 L28,28 L18,37 L5,46 L0,47 L1,43 L15,33 L24,25 L23,21 L11,11 L0,4 Z " fill="#1D2028" transform="translate(157,113)"/>
+<path d="M0,0 L9,2 L17,6 L27,15 L33,23 L36,30 L38,37 L38,52 L35,60 L31,62 L32,58 L34,53 L34,38 L31,28 L25,18 L18,11 L10,6 L0,3 Z " fill="#242833" transform="translate(159,51)"/>
+<path d="M0,0 L4,0 L4,4 L-36,19 L-41,20 L-41,16 L-21,8 Z " fill="#1F222B" transform="translate(140,127)"/>
+<path d="M0,0 L3,0 L2,3 L-12,10 L-22,18 L-30,29 L-34,36 L-53,38 L-52,35 L-40,33 L-35,33 L-33,27 L-27,19 L-17,9 L-5,2 Z " fill="#15151B" transform="translate(102,29)"/>
+<path d="M0,0 L54,0 L55,3 L-1,3 Z " fill="#15151B" transform="translate(80,222)"/>
+<path d="M0,0 L44,0 L44,3 L0,3 Z " fill="#15151B" transform="translate(150,222)"/>
+<path d="M0,0 L10,3 L16,7 L19,10 L19,14 L15,13 L8,7 L-1,5 L-2,1 Z " fill="#1E212A" transform="translate(73,79)"/>
+<path d="M0,0 L2,0 L2,8 L-1,16 L-5,18 L-4,14 L-1,7 Z " fill="#1F222B" transform="translate(195,95)"/>
+<path d="M0,0 L3,1 L3,8 L1,8 L1,15 L0,15 Z " fill="#2E3643" transform="translate(194,87)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.099010;0.108911" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame9" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L53,23 L62,36 L67,48 L69,56 L69,76 L65,87 L65,90 L75,96 L84,105 L91,119 L92,124 L92,139 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-126,150 L-135,138 L-140,126 L-141,121 L-141,102 L-137,85 L-131,73 L-122,62 L-113,55 L-101,49 L-85,45 L-73,44 L-71,38 L-64,27 L-54,17 L-43,10 L-32,5 L-21,2 Z " fill="#9FCAF8" transform="translate(146,36)"/>
+<path d="M0,0 L4,1 L2,5 L-8,11 L-19,20 L-21,22 L-20,26 L-11,34 L3,44 L3,47 L-2,46 L-16,36 L-26,27 L-26,21 L-20,14 L-5,3 Z " fill="#1D2029" transform="translate(79,113)"/>
+<path d="M0,0 L5,1 L17,9 L27,18 L30,21 L30,26 L26,31 L9,44 L4,47 L0,47 L1,43 L13,35 L23,27 L25,25 L24,21 L9,9 L0,4 Z " fill="#1D2028" transform="translate(157,113)"/>
+<path d="M0,0 L9,2 L19,7 L28,15 L36,29 L38,36 L38,54 L34,62 L31,63 L32,59 L35,51 L35,40 L32,29 L28,21 L20,12 L10,6 L0,2 Z " fill="#21252E" transform="translate(158,51)"/>
+<path d="M0,0 L2,0 L2,3 L-13,11 L-23,20 L-30,29 L-34,36 L-47,38 L-54,38 L-54,36 L-38,33 L-35,33 L-33,28 L-27,19 L-18,10 L-4,2 Z " fill="#15151B" transform="translate(101,29)"/>
+<path d="M0,0 L4,1 L3,4 L-9,7 L-38,13 L-44,13 L-43,9 L-22,5 Z " fill="#1E212A" transform="translate(141,130)"/>
+<path d="M0,0 L52,0 L53,3 L-1,3 Z " fill="#15151B" transform="translate(82,222)"/>
+<path d="M0,0 L45,0 L45,3 L0,3 Z " fill="#15151B" transform="translate(150,222)"/>
+<path d="M0,0 L9,1 L15,4 L21,10 L20,14 L16,12 L9,6 L0,3 Z " fill="#1E212A" transform="translate(71,80)"/>
+<path d="M0,0 L2,0 L2,15 L-2,23 L-5,24 L-4,20 L-1,12 Z " fill="#191A21" transform="translate(194,90)"/>
+<path d="M0,0 L9,2 L12,4 L10,6 L0,2 Z " fill="#29303B" transform="translate(158,51)"/>
+<path d="M0,0 L1,4 L-3,10 L-5,10 L-4,6 Z " fill="#21252E" transform="translate(194,104)"/>
+<path d="M0,0 L3,1 L4,8 L1,9 Z " fill="#29303C" transform="translate(192,82)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.108911;0.123762" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame10" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L52,23 L59,32 L65,44 L68,54 L69,61 L69,72 L66,84 L64,90 L73,95 L82,103 L88,113 L91,122 L92,135 L90,146 L86,155 L79,164 L69,170 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-130,146 L-137,135 L-141,124 L-142,117 L-142,107 L-140,93 L-134,77 L-126,66 L-118,58 L-104,50 L-91,46 L-76,44 L-73,41 L-68,32 L-60,22 L-49,13 L-33,5 L-16,1 Z " fill="#9FCAF7" transform="translate(146,36)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L13,41 L4,47 L0,47 L1,43 L14,34 L25,25 L23,21 L13,12 L0,4 Z " fill="#1D2028" transform="translate(158,113)"/>
+<path d="M0,0 L4,1 L2,5 L-12,14 L-21,22 L-20,27 L-1,41 L3,44 L3,47 L-2,46 L-16,36 L-25,28 L-26,21 L-21,15 L-8,5 Z " fill="#1D2028" transform="translate(77,113)"/>
+<path d="M0,0 L10,3 L20,9 L27,16 L32,23 L36,34 L37,38 L37,52 L33,62 L29,64 L30,60 L33,52 L33,37 L29,26 L23,17 L14,9 L0,3 Z " fill="#21242E" transform="translate(159,51)"/>
+<path d="M0,0 L20,0 L19,4 L-9,6 L-29,6 L-28,2 Z " fill="#21262F" transform="translate(125,134)"/>
+<path d="M0,0 L4,0 L3,3 L-9,9 L-19,17 L-26,26 L-31,35 L-52,38 L-52,35 L-33,31 L-26,20 L-19,12 L-6,3 Z " fill="#15151B" transform="translate(98,30)"/>
+<path d="M0,0 L50,0 L52,1 L52,3 L-1,3 Z " fill="#15151B" transform="translate(84,222)"/>
+<path d="M0,0 L46,0 L46,3 L-1,3 Z " fill="#15151B" transform="translate(151,222)"/>
+<path d="M0,0 L7,0 L17,5 L22,11 L21,14 L17,12 L11,7 L1,4 Z " fill="#1D2028" transform="translate(70,80)"/>
+<path d="M0,0 L1,0 L1,14 L-3,24 L-7,26 L-6,22 L-3,14 L-2,8 L-1,8 Z " fill="#2E3643" transform="translate(195,89)"/>
+<path d="M0,0 L1,3 L-3,9 L-5,9 L-4,5 L-2,1 Z " fill="#20242D" transform="translate(193,106)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.123762;0.133663" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame11" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L53,23 L62,36 L67,48 L69,56 L69,76 L65,87 L65,90 L75,96 L84,105 L91,119 L92,124 L92,140 L88,153 L82,161 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-126,150 L-135,138 L-140,126 L-141,121 L-141,102 L-137,85 L-129,70 L-120,60 L-106,51 L-91,46 L-73,44 L-71,38 L-64,27 L-54,17 L-43,10 L-32,5 L-21,2 Z " fill="#9FCAF8" transform="translate(145,36)"/>
+<path d="M0,0 L4,1 L15,8 L27,18 L29,21 L28,28 L18,37 L5,46 L0,47 L1,43 L19,30 L24,25 L23,21 L11,11 L0,4 Z " fill="#1E2129" transform="translate(159,113)"/>
+<path d="M0,0 L3,1 L1,5 L-10,12 L-22,22 L-21,26 L-12,34 L3,44 L3,47 L-3,46 L-19,34 L-25,29 L-27,26 L-26,20 L-19,13 L-7,4 Z " fill="#1D2029" transform="translate(76,113)"/>
+<path d="M0,0 L10,3 L21,10 L28,18 L34,29 L36,36 L36,54 L31,64 L28,65 L30,59 L33,53 L33,43 L31,31 L25,20 L18,12 L8,6 L-1,2 Z " fill="#21252F" transform="translate(159,51)"/>
+<path d="M0,0 L3,1 L0,4 L-11,10 L-21,19 L-29,30 L-32,35 L-50,38 L-54,38 L-53,35 L-46,33 L-33,32 L-31,27 L-25,18 L-17,10 L-5,2 Z " fill="#15151B" transform="translate(98,30)"/>
+<path d="M0,0 L17,1 L46,3 L48,4 L47,8 L6,5 L0,4 Z " fill="#20242D" transform="translate(96,133)"/>
+<path d="M0,0 L49,0 L50,3 L-1,3 Z " fill="#15151B" transform="translate(86,222)"/>
+<path d="M0,0 L47,0 L47,3 L0,3 Z " fill="#15151B" transform="translate(151,222)"/>
+<path d="M0,0 L9,1 L15,4 L21,10 L21,14 L17,13 L9,6 L0,3 Z " fill="#1D2029" transform="translate(70,80)"/>
+<path d="M0,0 L2,0 L2,15 L-3,25 L-6,26 L-4,20 L-1,14 Z " fill="#1A1C24" transform="translate(193,90)"/>
+<path d="M0,0 L2,3 L2,6 L0,6 L-1,10 L-2,2 L0,2 Z " fill="#333D4C" transform="translate(193,84)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.133663;0.148515" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame12" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,59 L69,74 L65,87 L65,90 L76,97 L83,104 L88,112 L91,121 L92,127 L92,137 L90,147 L84,159 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-135,138 L-139,130 L-141,123 L-141,99 L-137,85 L-130,71 L-119,59 L-108,52 L-98,48 L-85,45 L-76,44 L-73,42 L-68,32 L-58,20 L-47,12 L-33,5 L-15,1 Z " fill="#9FCAF8" transform="translate(145,36)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L7,45 L4,47 L0,47 L1,43 L18,31 L24,26 L25,23 L18,16 L4,6 L-1,3 Z " fill="#1E2129" transform="translate(159,113)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-20,21 L-21,25 L-16,30 L-1,41 L4,44 L4,47 L-2,46 L-21,32 L-26,26 L-26,21 L-17,12 L-3,2 Z " fill="#1D2029" transform="translate(74,113)"/>
+<path d="M0,0 L10,3 L21,10 L29,20 L34,30 L36,37 L36,53 L32,63 L30,66 L27,66 L29,61 L32,54 L32,38 L28,25 L21,15 L13,9 L0,3 Z " fill="#303947" transform="translate(159,51)"/>
+<path d="M0,0 L10,1 L27,5 L47,10 L47,14 L34,12 L7,6 L0,3 Z " fill="#1E212A" transform="translate(96,130)"/>
+<path d="M0,0 L2,0 L0,4 L-11,10 L-20,17 L-28,28 L-32,35 L-47,37 L-54,38 L-55,36 L-46,33 L-33,32 L-31,26 L-24,17 L-16,9 L-5,2 Z " fill="#15151B" transform="translate(98,30)"/>
+<path d="M0,0 L47,0 L49,2 L48,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(88,222)"/>
+<path d="M0,0 L48,0 L48,3 L0,3 Z " fill="#15151B" transform="translate(151,222)"/>
+<path d="M0,0 L10,3 L21,10 L29,20 L31,23 L31,27 L29,27 L22,16 L13,9 L0,3 Z " fill="#21252F" transform="translate(159,51)"/>
+<path d="M0,0 L10,3 L16,7 L20,11 L20,15 L16,14 L8,7 L-2,4 L-2,1 Z " fill="#1D2029" transform="translate(71,79)"/>
+<path d="M0,0 L2,0 L2,9 L-2,19 L-4,22 L-7,22 L-5,17 L-1,8 Z " fill="#1E222A" transform="translate(193,95)"/>
+<path d="M0,0 L2,3 L4,8 L4,11 L2,11 L1,13 L-1,2 Z " fill="#2B323E" transform="translate(190,76)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.148515;0.158416" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame13" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,21 L58,30 L66,46 L69,60 L69,73 L65,86 L64,90 L73,95 L82,103 L88,113 L91,122 L92,136 L90,147 L85,157 L79,164 L69,170 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-129,147 L-136,137 L-141,124 L-142,116 L-142,107 L-139,90 L-134,78 L-127,67 L-118,58 L-104,50 L-91,46 L-76,44 L-73,41 L-66,29 L-57,19 L-44,10 L-33,5 L-15,1 Z " fill="#9FCAF7" transform="translate(145,36)"/>
+<path d="M0,0 L5,1 L18,10 L28,19 L30,22 L29,27 L20,36 L4,47 L0,47 L1,43 L14,34 L24,26 L25,23 L20,18 L10,10 L0,4 Z " fill="#1D2028" transform="translate(159,113)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-21,22 L-21,26 L-13,33 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,26 L-26,21 L-20,14 L-7,4 Z " fill="#1D2029" transform="translate(74,113)"/>
+<path d="M0,0 L9,3 L19,9 L27,17 L34,30 L36,38 L36,54 L30,66 L27,67 L28,62 L32,54 L32,38 L29,28 L23,18 L20,15 L20,13 L16,11 L0,3 Z " fill="#232832" transform="translate(159,51)"/>
+<path d="M0,0 L6,1 L32,11 L45,16 L45,20 L36,18 L0,4 Z " fill="#1D2028" transform="translate(97,127)"/>
+<path d="M0,0 L2,2 L-3,5 L-14,12 L-22,19 L-31,33 L-32,35 L-51,38 L-55,38 L-54,35 L-34,31 L-27,20 L-21,13 L-10,5 Z " fill="#15151B" transform="translate(98,30)"/>
+<path d="M0,0 L48,0 L48,3 L-1,3 Z " fill="#15151B" transform="translate(152,222)"/>
+<path d="M0,0 L47,0 L48,3 L-1,3 Z " fill="#15151B" transform="translate(89,222)"/>
+<path d="M0,0 L10,3 L18,9 L20,12 L19,16 L12,10 L8,7 L-1,5 L-2,1 Z " fill="#1E2129" transform="translate(71,79)"/>
+<path d="M0,0 L2,4 L2,12 L-4,24 L-7,25 L-6,20 L-2,12 Z " fill="#21252F" transform="translate(193,93)"/>
+<path d="M0,0 L2,4 L2,12 L-1,16 L-2,2 L0,2 Z " fill="#323B49" transform="translate(193,85)"/>
+<path d="M0,0 L2,4 L2,9 L-1,11 Z " fill="#181920" transform="translate(193,93)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.158416;0.173267" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame14" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,21 L58,30 L66,46 L69,60 L69,73 L65,86 L64,90 L73,95 L82,103 L88,113 L91,122 L92,136 L90,147 L85,157 L79,164 L69,170 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-129,147 L-136,137 L-141,124 L-142,108 L-140,94 L-136,82 L-130,71 L-121,61 L-112,54 L-99,48 L-85,45 L-76,44 L-73,41 L-66,29 L-57,19 L-44,10 L-33,5 L-15,1 Z " fill="#9FCAF7" transform="translate(145,36)"/>
+<path d="M0,0 L5,1 L18,10 L28,19 L30,22 L29,27 L20,36 L4,47 L0,47 L1,43 L14,34 L24,26 L25,23 L20,18 L10,10 L0,4 Z " fill="#1D2028" transform="translate(159,113)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-21,22 L-21,26 L-9,36 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,26 L-26,21 L-20,14 L-7,4 Z " fill="#1E2129" transform="translate(74,113)"/>
+<path d="M0,0 L7,1 L18,7 L27,16 L32,25 L36,36 L36,53 L30,65 L27,67 L27,63 L31,56 L32,52 L32,36 L28,24 L19,12 L9,6 L0,2 Z " fill="#222630" transform="translate(159,52)"/>
+<path d="M0,0 L4,1 L29,14 L43,22 L42,26 L37,24 L8,9 L0,4 Z " fill="#1E212A" transform="translate(98,124)"/>
+<path d="M0,0 L3,0 L2,3 L-9,9 L-19,17 L-26,26 L-31,35 L-53,38 L-53,35 L-33,31 L-26,20 L-19,12 L-6,3 Z " fill="#15151B" transform="translate(97,30)"/>
+<path d="M0,0 L49,0 L49,3 L0,3 Z " fill="#15151B" transform="translate(152,222)"/>
+<path d="M0,0 L45,0 L47,2 L46,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(91,222)"/>
+<path d="M0,0 L7,0 L17,5 L22,11 L22,15 L18,13 L10,6 L1,4 Z " fill="#1E212A" transform="translate(69,80)"/>
+<path d="M0,0 L1,0 L1,17 L-5,29 L-8,31 L-8,27 L-4,20 L-2,6 L-1,6 Z " fill="#303846" transform="translate(194,88)"/>
+<path d="M0,0 L1,4 L-5,13 L-7,12 L-5,8 Z " fill="#20242D" transform="translate(192,106)"/>
+<path d="M0,0 L2,0 L3,3 L3,14 L1,11 Z " fill="#181920" transform="translate(191,83)"/>
+<path d="M0,0 L3,1 L5,7 L3,7 L2,9 Z " fill="#262B36" transform="translate(188,76)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.173267;0.183168" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame15" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,20 L58,30 L66,46 L69,59 L69,73 L67,82 L64,88 L64,90 L73,95 L83,104 L90,117 L92,128 L92,137 L90,147 L85,157 L79,164 L69,170 L62,172 L-81,172 L-95,169 L-108,164 L-121,155 L-129,147 L-138,133 L-141,123 L-142,111 L-140,94 L-136,82 L-130,71 L-119,59 L-108,52 L-99,48 L-85,45 L-76,44 L-73,42 L-68,32 L-58,20 L-47,12 L-33,5 L-15,1 Z " fill="#9FCAF8" transform="translate(145,36)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L13,41 L4,47 L0,47 L1,43 L14,34 L24,26 L24,22 L19,17 L7,8 L0,4 Z " fill="#1C1F27" transform="translate(159,113)"/>
+<path d="M0,0 L4,1 L2,5 L-8,11 L-19,20 L-21,22 L-20,27 L-3,40 L3,44 L3,47 L-2,46 L-16,36 L-26,27 L-26,21 L-16,11 L-2,1 Z " fill="#1D1F28" transform="translate(74,113)"/>
+<path d="M0,0 L5,0 L17,7 L22,12 L28,19 L33,29 L35,37 L35,53 L32,60 L28,67 L25,67 L27,62 L31,53 L31,37 L29,29 L24,19 L19,14 L19,12 L15,10 L6,5 L0,2 Z " fill="#222630" transform="translate(160,52)"/>
+<path d="M0,0 L4,1 L22,14 L38,25 L40,29 L37,30 L14,14 L-1,3 Z " fill="#1D1F28" transform="translate(100,122)"/>
+<path d="M0,0 L3,1 L-1,4 L-13,11 L-22,19 L-30,31 L-32,35 L-50,38 L-54,38 L-53,35 L-37,32 L-33,32 L-31,26 L-24,17 L-16,9 L-5,2 Z " fill="#15151B" transform="translate(98,30)"/>
+<path d="M0,0 L50,0 L50,3 L0,3 Z " fill="#15151B" transform="translate(152,222)"/>
+<path d="M0,0 L44,0 L46,1 L46,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(92,222)"/>
+<path d="M0,0 L10,3 L16,7 L21,13 L20,16 L16,14 L8,7 L-1,5 L-2,1 Z " fill="#20232D" transform="translate(71,79)"/>
+<path d="M0,0 L1,0 L1,16 L-2,23 L-6,30 L-9,30 L-7,25 L-3,16 L-2,6 L-1,6 Z " fill="#2D3542" transform="translate(194,89)"/>
+<path d="M0,0 L1,4 L-4,13 L-7,13 L-5,8 Z " fill="#1E212A" transform="translate(192,106)"/>
+<path d="M0,0 L1,3 L-1,6 L-4,6 L-2,1 Z " fill="#232732" transform="translate(189,113)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.183168;0.198020" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame16" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,58 L69,74 L65,87 L65,90 L76,97 L83,104 L88,112 L91,121 L92,126 L92,138 L89,150 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-135,138 L-139,130 L-141,122 L-141,100 L-137,85 L-130,71 L-119,59 L-108,52 L-95,47 L-85,45 L-75,44 L-72,40 L-67,31 L-58,21 L-50,14 L-38,7 L-21,2 Z " fill="#9FCAF7" transform="translate(145,36)"/>
+<path d="M0,0 L4,1 L14,7 L27,18 L30,22 L29,27 L21,35 L7,45 L4,47 L0,47 L1,43 L18,31 L24,26 L25,23 L18,16 L2,5 L-1,3 Z " fill="#1E2129" transform="translate(159,113)"/>
+<path d="M0,0 L3,1 L1,5 L-10,12 L-22,22 L-21,26 L-12,34 L3,44 L3,47 L-3,46 L-19,34 L-25,29 L-27,26 L-26,20 L-19,13 L-4,2 Z " fill="#1D2029" transform="translate(75,113)"/>
+<path d="M0,0 L6,1 L17,7 L27,17 L33,29 L35,36 L35,54 L29,66 L26,68 L26,64 L30,57 L31,53 L31,37 L29,29 L24,19 L18,12 L9,6 L0,2 Z " fill="#21242E" transform="translate(160,52)"/>
+<path d="M0,0 L4,1 L12,9 L20,16 L33,28 L36,30 L35,34 L31,32 L20,22 L12,15 L-1,3 Z " fill="#1D1F28" transform="translate(102,120)"/>
+<path d="M0,0 L3,0 L2,3 L-11,10 L-21,19 L-28,28 L-32,35 L-53,38 L-53,35 L-37,32 L-33,32 L-31,26 L-24,17 L-16,9 L-5,2 Z " fill="#15151B" transform="translate(98,30)"/>
+<path d="M0,0 L49,0 L49,3 L-1,3 Z " fill="#15151B" transform="translate(153,222)"/>
+<path d="M0,0 L45,0 L46,3 L-1,3 Z " fill="#15151B" transform="translate(92,222)"/>
+<path d="M0,0 L10,3 L16,7 L21,13 L20,16 L16,14 L8,7 L-2,4 Z " fill="#1E212A" transform="translate(71,79)"/>
+<path d="M0,0 L3,1 L3,19 L-3,31 L-6,33 L-6,29 L-2,22 L-1,18 Z " fill="#272D38" transform="translate(192,87)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.198020;0.207921" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame17" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L52,22 L61,34 L66,45 L69,56 L69,75 L66,85 L64,89 L76,97 L84,105 L90,116 L92,125 L92,139 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-127,149 L-135,138 L-140,126 L-141,121 L-141,101 L-137,85 L-131,73 L-123,63 L-113,55 L-101,49 L-85,45 L-73,44 L-71,38 L-64,27 L-53,16 L-39,8 L-26,3 L-15,1 Z " fill="#9FCAF8" transform="translate(145,36)"/>
+<path d="M0,0 L4,1 L15,8 L28,19 L29,26 L22,34 L5,46 L0,47 L1,43 L15,33 L22,27 L24,27 L24,22 L14,13 L3,6 L-1,3 Z " fill="#1E2029" transform="translate(159,113)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-20,21 L-21,26 L-7,37 L3,43 L3,47 L-2,46 L-16,36 L-25,28 L-26,21 L-16,11 L-3,2 Z " fill="#1E2029" transform="translate(75,113)"/>
+<path d="M0,0 L6,1 L16,6 L25,14 L33,28 L35,35 L35,53 L31,63 L28,68 L25,68 L27,63 L32,52 L32,38 L29,28 L22,16 L14,9 L0,2 Z " fill="#232832" transform="translate(160,52)"/>
+<path d="M0,0 L4,2 L15,14 L22,22 L31,32 L33,37 L29,37 L16,23 L9,15 L-1,3 Z " fill="#1E2129" transform="translate(104,118)"/>
+<path d="M0,0 L2,0 L2,3 L-12,10 L-21,17 L-30,29 L-34,36 L-54,39 L-54,36 L-47,34 L-35,33 L-33,28 L-25,17 L-15,8 Z " fill="#15151B" transform="translate(100,29)"/>
+<path d="M0,0 L49,0 L49,3 L-1,3 Z " fill="#15151B" transform="translate(153,222)"/>
+<path d="M0,0 L45,0 L46,3 L-1,3 Z " fill="#15151B" transform="translate(92,222)"/>
+<path d="M0,0 L7,0 L15,4 L22,11 L21,15 L17,13 L9,6 L0,3 Z " fill="#1F222B" transform="translate(70,80)"/>
+<path d="M0,0 L2,1 L2,15 L-2,25 L-5,30 L-8,30 L-6,25 L-1,14 Z " fill="#1D2028" transform="translate(193,90)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.207921;0.222772" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame18" opacity="0">
+
+<path d="M0,0 L13,1 L25,4 L39,11 L48,18 L58,29 L66,45 L69,55 L70,66 L69,77 L65,88 L65,90 L75,96 L80,100 L86,108 L90,116 L92,123 L92,141 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-98,168 L-114,160 L-126,149 L-133,141 L-138,131 L-141,120 L-141,104 L-138,89 L-133,77 L-126,67 L-116,57 L-104,50 L-91,46 L-75,44 L-72,41 L-67,31 L-55,18 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF8" transform="translate(145,36)"/>
+<path d="M0,0 L5,1 L17,9 L29,20 L30,21 L30,26 L25,31 L16,39 L4,47 L0,47 L1,43 L13,35 L23,27 L25,25 L24,21 L9,9 L0,4 Z " fill="#1C1F27" transform="translate(158,113)"/>
+<path d="M0,0 L4,1 L2,5 L-12,14 L-21,22 L-20,27 L-1,41 L3,43 L3,47 L-2,46 L-16,36 L-25,28 L-26,21 L-16,11 L-2,1 Z " fill="#1D1F27" transform="translate(76,113)"/>
+<path d="M0,0 L6,1 L16,6 L26,15 L31,23 L35,34 L35,54 L31,63 L28,68 L26,68 L27,63 L32,53 L32,39 L29,28 L25,20 L16,10 L0,2 Z " fill="#232832" transform="translate(160,52)"/>
+<path d="M0,0 L3,0 L16,19 L26,32 L29,37 L28,40 L24,38 L11,20 L-1,3 Z " fill="#1C1F27" transform="translate(106,117)"/>
+<path d="M0,0 L3,0 L2,3 L-13,11 L-23,20 L-30,30 L-34,36 L-48,38 L-53,38 L-53,36 L-47,34 L-35,32 L-29,22 L-20,12 L-10,5 Z " fill="#15151B" transform="translate(100,29)"/>
+<path d="M0,0 L48,0 L48,3 L-1,3 Z " fill="#15151B" transform="translate(153,222)"/>
+<path d="M0,0 L45,0 L46,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(92,222)"/>
+<path d="M0,0 L7,0 L15,4 L22,11 L21,15 L17,13 L12,8 L6,5 L0,3 Z " fill="#1D2029" transform="translate(70,80)"/>
+<path d="M0,0 L2,0 L2,17 L-2,26 L-5,31 L-7,31 L-6,26 L-1,16 Z " fill="#1C1E26" transform="translate(193,89)"/>
+<path d="M0,0 L3,1 L5,10 L3,10 L2,12 Z " fill="#292F3B" transform="translate(190,79)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.222772;0.232673" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame19" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L52,23 L59,32 L65,44 L68,54 L69,61 L69,73 L65,86 L64,90 L73,95 L82,103 L88,113 L91,122 L92,135 L90,146 L86,155 L79,164 L69,170 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-130,146 L-137,135 L-141,124 L-142,117 L-142,106 L-139,90 L-134,77 L-126,66 L-118,58 L-104,50 L-91,46 L-76,44 L-73,41 L-68,32 L-60,22 L-49,13 L-33,5 L-16,1 Z " fill="#9FCAF7" transform="translate(146,36)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-20,21 L-21,25 L-12,33 L4,44 L4,47 L-2,46 L-17,35 L-25,28 L-26,21 L-16,11 L-3,2 Z " fill="#1D2028" transform="translate(77,113)"/>
+<path d="M0,0 L5,1 L19,11 L28,19 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L18,31 L24,26 L25,23 L18,16 L5,7 L-1,3 Z " fill="#1D2029" transform="translate(158,113)"/>
+<path d="M0,0 L6,1 L15,6 L25,15 L31,25 L34,33 L35,37 L35,52 L30,64 L26,68 L25,65 L30,56 L31,52 L31,38 L28,27 L22,17 L15,10 L0,2 Z " fill="#232732" transform="translate(161,52)"/>
+<path d="M0,0 L4,2 L15,22 L25,39 L25,43 L21,42 L8,19 L-1,4 Z " fill="#1E212A" transform="translate(108,115)"/>
+<path d="M0,0 L4,1 L0,4 L-12,10 L-22,18 L-31,30 L-34,36 L-53,38 L-52,35 L-36,32 L-29,21 L-23,14 L-11,5 Z " fill="#15151B" transform="translate(101,29)"/>
+<path d="M0,0 L49,0 L49,3 L0,3 Z " fill="#15151B" transform="translate(152,222)"/>
+<path d="M0,0 L46,0 L47,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(91,222)"/>
+<path d="M0,0 L7,0 L17,5 L22,11 L21,15 L14,9 L6,5 L0,3 Z " fill="#1D1F28" transform="translate(70,80)"/>
+<path d="M0,0 L1,0 L0,8 L-6,18 L-8,17 L-6,12 L-1,1 Z " fill="#21252E" transform="translate(194,102)"/>
+<path d="M0,0 L1,0 L1,15 L-2,14 L-2,8 L-1,8 Z " fill="#333D4C" transform="translate(195,89)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.232673;0.247525" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame20" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,20 L58,30 L66,46 L69,58 L69,74 L65,87 L65,90 L76,97 L83,104 L89,114 L92,126 L92,138 L89,150 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-117,158 L-128,148 L-135,138 L-140,127 L-141,122 L-141,100 L-137,85 L-130,71 L-119,59 L-108,52 L-95,47 L-85,45 L-75,44 L-72,40 L-67,31 L-58,21 L-50,14 L-40,8 L-26,3 L-15,1 Z " fill="#9FCAF7" transform="translate(146,36)"/>
+<path d="M0,0 L5,1 L17,9 L29,20 L30,21 L30,26 L25,31 L16,39 L4,47 L0,47 L1,43 L13,35 L23,27 L25,25 L24,21 L9,9 L0,4 Z " fill="#1C1F27" transform="translate(157,113)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-21,21 L-22,25 L-14,32 L-1,41 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,26 L-26,20 L-18,12 L-2,1 Z " fill="#1C1E26" transform="translate(79,113)"/>
+<path d="M0,0 L9,2 L20,9 L29,20 L33,29 L35,36 L35,53 L31,62 L28,67 L26,67 L27,62 L31,53 L31,36 L28,26 L21,15 L14,9 L4,4 L0,2 Z " fill="#222731" transform="translate(161,52)"/>
+<path d="M0,0 L3,2 L12,22 L21,42 L21,45 L17,44 L10,29 L-1,6 L-1,1 Z " fill="#1D2028" transform="translate(111,114)"/>
+<path d="M0,0 L2,2 L-15,11 L-26,20 L-33,30 L-37,37 L-54,39 L-54,36 L-38,34 L-36,28 L-29,19 L-20,10 L-8,3 Z " fill="#15151B" transform="translate(104,28)"/>
+<path d="M0,0 L47,0 L48,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(90,222)"/>
+<path d="M0,0 L48,0 L48,3 L0,3 Z " fill="#15151B" transform="translate(152,222)"/>
+<path d="M0,0 L11,3 L20,11 L20,15 L16,14 L8,7 L-1,5 L-1,1 Z " fill="#1E222A" transform="translate(72,79)"/>
+<path d="M0,0 L1,0 L1,12 L3,12 L0,22 L-4,28 L-6,28 L-5,23 L-1,14 Z " fill="#333D4C" transform="translate(193,91)"/>
+<path d="M0,0 L3,1 L5,8 L5,23 L3,23 L2,11 Z " fill="#1C1F27" transform="translate(191,80)"/>
+<path d="M0,0 L3,3 L-1,9 L-3,9 L-2,4 Z " fill="#262B36" transform="translate(190,110)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.247525;0.257426" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame21" opacity="0">
+
+<path d="M0,0 L13,1 L24,4 L34,8 L46,16 L54,24 L61,34 L67,47 L69,55 L70,68 L68,80 L65,90 L75,96 L80,100 L86,108 L90,116 L92,123 L92,140 L88,153 L82,161 L75,167 L66,171 L62,172 L-81,172 L-98,168 L-114,160 L-124,151 L-133,141 L-139,129 L-141,120 L-141,104 L-138,89 L-133,77 L-126,67 L-116,57 L-104,50 L-91,46 L-75,44 L-73,43 L-67,31 L-56,19 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF7" transform="translate(146,36)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-19,20 L-21,22 L-20,26 L-11,34 L3,43 L3,47 L-2,46 L-16,36 L-25,28 L-26,21 L-21,15 L-8,5 Z " fill="#1E2129" transform="translate(80,113)"/>
+<path d="M0,0 L4,1 L15,8 L28,19 L29,26 L22,34 L5,46 L0,47 L1,43 L15,33 L22,27 L24,27 L24,22 L14,13 L3,6 L-1,3 Z " fill="#1D2029" transform="translate(157,113)"/>
+<path d="M0,0 L5,1 L17,7 L26,15 L32,24 L35,31 L36,37 L36,55 L31,65 L28,66 L29,62 L33,53 L33,38 L28,24 L21,15 L12,8 L0,3 Z " fill="#21252F" transform="translate(160,51)"/>
+<path d="M0,0 L4,1 L18,40 L19,45 L15,46 L2,10 L0,6 Z " fill="#1F232C" transform="translate(112,114)"/>
+<path d="M0,0 L4,1 L3,3 L-9,8 L-21,16 L-30,26 L-36,36 L-37,37 L-44,38 L-53,38 L-53,36 L-38,33 L-32,23 L-23,13 L-9,4 Z " fill="#15151B" transform="translate(104,28)"/>
+<path d="M0,0 L48,0 L50,2 L49,3 L-1,3 Z " fill="#15151B" transform="translate(88,222)"/>
+<path d="M0,0 L47,0 L47,3 L0,3 Z " fill="#15151B" transform="translate(152,222)"/>
+<path d="M0,0 L8,0 L16,5 L22,11 L21,14 L17,13 L12,8 L6,5 L0,3 Z " fill="#1E2129" transform="translate(71,80)"/>
+<path d="M0,0 L2,0 L3,3 L3,21 L-2,31 L-5,32 L-4,28 L0,19 Z " fill="#15161C" transform="translate(193,85)"/>
+<path d="M0,0 L3,0 L0,9 L-3,13 L-5,13 L-4,9 Z " fill="#20232D" transform="translate(193,104)"/>
+<path d="M0,0 L3,1 L5,5 L5,8 L3,8 L2,10 Z " fill="#262C37" transform="translate(190,77)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.257426;0.272277" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame22" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,21 L58,30 L66,46 L69,60 L69,73 L65,86 L64,90 L73,95 L83,104 L90,118 L92,128 L92,136 L89,150 L83,159 L79,164 L69,170 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-129,147 L-136,137 L-140,127 L-142,116 L-141,99 L-137,84 L-130,71 L-121,61 L-112,54 L-99,48 L-85,45 L-76,44 L-73,41 L-66,29 L-57,19 L-44,10 L-33,5 L-15,1 Z " fill="#9FCAF8" transform="translate(147,36)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-22,23 L-20,27 L-7,37 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-19,13 L-4,2 Z " fill="#1D2029" transform="translate(82,113)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L13,41 L4,47 L0,47 L1,43 L14,34 L25,25 L23,21 L13,12 L0,4 Z " fill="#1D2028" transform="translate(156,113)"/>
+<path d="M0,0 L5,1 L19,8 L28,17 L33,26 L36,34 L37,38 L37,53 L34,60 L31,64 L29,64 L31,58 L33,53 L33,37 L29,26 L23,17 L14,9 L6,5 L0,3 Z " fill="#232731" transform="translate(160,51)"/>
+<path d="M0,0 L4,1 L9,20 L15,41 L15,47 L11,46 L4,22 L0,6 Z " fill="#20242D" transform="translate(114,113)"/>
+<path d="M0,0 L4,0 L4,2 L-10,8 L-21,16 L-30,25 L-37,37 L-52,38 L-51,35 L-39,33 L-31,21 L-22,12 L-8,3 Z " fill="#15151B" transform="translate(105,28)"/>
+<path d="M0,0 L50,0 L51,3 L-1,3 Z " fill="#15151B" transform="translate(86,222)"/>
+<path d="M0,0 L46,0 L46,3 L0,3 Z " fill="#15151B" transform="translate(151,222)"/>
+<path d="M0,0 L10,3 L18,9 L20,14 L16,14 L8,7 L-1,5 L-2,1 Z " fill="#1D1F28" transform="translate(73,79)"/>
+<path d="M0,0 L1,4 L-3,10 L-5,10 L-3,4 Z " fill="#1C1E26" transform="translate(194,105)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.272277;0.282178" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame23" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L53,23 L62,36 L67,48 L69,56 L69,75 L66,85 L64,89 L75,96 L84,105 L90,116 L92,125 L92,139 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-126,150 L-135,138 L-140,126 L-141,121 L-141,102 L-138,88 L-133,76 L-124,64 L-115,56 L-101,49 L-85,45 L-73,44 L-71,38 L-64,27 L-53,16 L-39,8 L-26,3 L-15,1 Z " fill="#9FCAF7" transform="translate(147,36)"/>
+<path d="M0,0 L3,1 L1,5 L-10,12 L-21,21 L-22,25 L-13,33 L3,44 L3,47 L-3,46 L-22,32 L-27,26 L-27,21 L-17,11 L-4,2 Z " fill="#1C1F27" transform="translate(84,113)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L24,32 L11,42 L3,47 L-1,47 L0,43 L11,36 L22,27 L24,25 L23,21 L11,11 L0,4 Z " fill="#1D2028" transform="translate(156,113)"/>
+<path d="M0,0 L7,1 L19,7 L28,15 L36,29 L38,36 L38,55 L34,62 L31,62 L33,57 L35,52 L35,42 L32,29 L27,20 L20,12 L10,6 L0,2 Z " fill="#1F232C" transform="translate(159,51)"/>
+<path d="M0,0 L3,0 L2,3 L-14,10 L-25,18 L-32,25 L-40,38 L-53,39 L-53,36 L-41,35 L-39,30 L-31,19 L-21,10 L-13,5 Z " fill="#15151B" transform="translate(108,27)"/>
+<path d="M0,0 L4,1 L12,42 L12,47 L8,47 L5,34 L1,11 L0,7 Z " fill="#1E2029" transform="translate(116,113)"/>
+<path d="M0,0 L51,0 L53,1 L53,3 L-1,3 Z " fill="#15151B" transform="translate(84,222)"/>
+<path d="M0,0 L45,0 L45,3 L0,3 Z " fill="#15151B" transform="translate(151,222)"/>
+<path d="M0,0 L7,0 L15,4 L21,10 L20,14 L16,12 L9,6 L0,4 Z " fill="#1E212A" transform="translate(72,80)"/>
+<path d="M0,0 L3,0 L2,4 L-1,10 L-4,10 L-2,5 Z " fill="#262B36" transform="translate(194,103)"/>
+<path d="M0,0 L3,1 L4,8 L2,8 L1,11 Z " fill="#29303C" transform="translate(193,82)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.282178;0.297030" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame24" opacity="0">
+
+<path d="M0,0 L18,2 L30,6 L41,12 L53,23 L60,32 L66,44 L69,54 L70,61 L70,72 L67,84 L65,90 L74,95 L82,102 L89,113 L92,122 L93,134 L91,146 L87,155 L80,163 L72,169 L63,172 L-81,172 L-98,168 L-112,161 L-121,154 L-129,146 L-136,135 L-140,124 L-141,118 L-141,106 L-138,89 L-132,75 L-124,65 L-116,57 L-105,51 L-95,47 L-85,45 L-75,44 L-72,41 L-66,30 L-56,19 L-43,10 L-32,5 L-15,1 Z " fill="#9FCAF7" transform="translate(147,36)"/>
+<path d="M0,0 L4,1 L2,5 L-8,11 L-19,20 L-21,22 L-20,27 L-4,39 L3,44 L3,47 L-2,46 L-16,36 L-26,27 L-27,22 L-20,14 L-5,3 Z " fill="#1D2029" transform="translate(85,113)"/>
+<path d="M0,0 L5,1 L19,11 L28,19 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L18,31 L24,26 L25,23 L18,16 L4,6 L-1,3 Z " fill="#1D2028" transform="translate(155,113)"/>
+<path d="M0,0 L10,1 L22,8 L30,16 L36,26 L39,34 L40,43 L40,52 L36,60 L34,60 L35,55 L36,52 L36,37 L32,26 L26,17 L17,9 L9,5 L0,2 Z " fill="#20232D" transform="translate(158,51)"/>
+<path d="M0,0 L4,1 L7,25 L9,43 L9,48 L5,47 L3,32 L0,10 Z " fill="#1D2028" transform="translate(118,113)"/>
+<path d="M0,0 L4,1 L2,3 L-11,8 L-22,15 L-28,20 L-37,32 L-40,38 L-52,39 L-52,36 L-42,34 L-35,23 L-30,17 L-18,8 L-6,2 Z " fill="#15151B" transform="translate(109,27)"/>
+<path d="M0,0 L53,0 L54,3 L-1,3 Z " fill="#15151B" transform="translate(82,222)"/>
+<path d="M0,0 L43,0 L43,3 L-1,3 Z " fill="#15151B" transform="translate(151,222)"/>
+<path d="M0,0 L7,0 L15,4 L20,9 L21,13 L18,14 L13,8 L7,5 L0,3 Z " fill="#1B1E26" transform="translate(72,80)"/>
+<path d="M0,0 L1,3 L-3,11 L-5,11 L-4,6 L-3,3 Z " fill="#242934" transform="translate(197,100)"/>
+<path d="M0,0 L10,1 L8,2 L8,4 L3,3 L0,2 Z " fill="#2A313D" transform="translate(158,51)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.297030;0.306931" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame25" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,20 L59,31 L67,48 L69,57 L69,74 L65,87 L65,90 L76,97 L84,105 L90,117 L92,125 L92,138 L90,147 L84,159 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-127,149 L-135,138 L-139,130 L-141,122 L-141,100 L-137,85 L-130,71 L-120,60 L-110,53 L-98,48 L-85,45 L-76,44 L-72,40 L-67,31 L-58,21 L-50,14 L-40,8 L-26,3 L-15,1 Z " fill="#9FCAF7" transform="translate(148,36)"/>
+<path d="M0,0 L3,1 L1,5 L-10,12 L-22,22 L-21,26 L-10,35 L3,44 L3,47 L-3,46 L-19,34 L-25,29 L-27,26 L-27,21 L-17,11 L-2,1 Z " fill="#1C1F27" transform="translate(87,113)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L25,31 L11,42 L3,47 L-1,47 L0,43 L11,36 L22,27 L24,25 L23,21 L11,11 L0,4 Z " fill="#1D1F27" transform="translate(155,113)"/>
+<path d="M0,0 L12,3 L22,9 L32,19 L39,33 L40,37 L40,54 L37,59 L35,59 L36,54 L36,37 L32,26 L24,15 L14,8 L0,3 Z " fill="#262C37" transform="translate(158,50)"/>
+<path d="M0,0 L1,3 L-14,9 L-26,16 L-36,26 L-44,39 L-55,39 L-55,37 L-45,36 L-43,30 L-35,20 L-25,11 L-10,3 Z " fill="#15151B" transform="translate(113,26)"/>
+<path d="M0,0 L4,1 L6,39 L6,48 L2,48 L0,25 Z " fill="#1D2028" transform="translate(120,113)"/>
+<path d="M0,0 L54,0 L56,2 L55,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(80,222)"/>
+<path d="M0,0 L42,0 L42,3 L0,3 Z " fill="#15151B" transform="translate(150,222)"/>
+<path d="M0,0 L10,3 L16,7 L20,11 L19,14 L15,13 L8,7 L-2,4 L-2,1 Z " fill="#1D2028" transform="translate(74,79)"/>
+<path d="M0,0 L2,1 L2,14 L-1,19 L-3,19 L-2,14 L-1,11 Z " fill="#17171E" transform="translate(196,90)"/>
+<path d="M0,0 L1,2 L-2,7 L-4,7 L-3,2 Z " fill="#222630" transform="translate(197,102)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.306931;0.321782" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame26" opacity="0">
+
+<path d="M0,0 L18,2 L32,7 L42,13 L52,22 L60,32 L67,47 L70,62 L70,71 L67,84 L65,90 L75,96 L82,102 L89,113 L92,123 L92,141 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-98,168 L-114,160 L-126,149 L-133,141 L-139,128 L-141,119 L-141,105 L-138,89 L-132,75 L-125,66 L-116,57 L-106,51 L-91,46 L-75,44 L-72,41 L-66,30 L-55,18 L-41,9 L-29,4 L-15,1 Z " fill="#9FCAF7" transform="translate(148,36)"/>
+<path d="M0,0 L3,0 L2,5 L-8,11 L-18,19 L-22,24 L-17,29 L-4,39 L3,44 L3,47 L-2,46 L-19,34 L-26,27 L-27,22 L-20,14 L-5,3 Z " fill="#1D2028" transform="translate(88,113)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L13,41 L4,47 L0,47 L1,43 L14,34 L24,26 L24,22 L13,12 L0,4 Z " fill="#1D2028" transform="translate(154,113)"/>
+<path d="M0,0 L9,2 L21,8 L31,17 L37,27 L41,41 L41,53 L38,58 L36,58 L37,52 L37,39 L33,27 L27,18 L18,10 L7,5 L0,3 Z " fill="#1E212A" transform="translate(158,50)"/>
+<path d="M0,0 L4,0 L4,48 L0,47 Z " fill="#1B1D24" transform="translate(121,113)"/>
+<path d="M0,0 L3,0 L2,3 L-14,9 L-25,16 L-33,23 L-40,33 L-43,39 L-53,39 L-53,37 L-45,35 L-39,25 L-32,17 L-20,8 L-4,1 Z " fill="#15151B" transform="translate(113,26)"/>
+<path d="M0,0 L57,0 L58,3 L-1,3 Z " fill="#15151B" transform="translate(77,222)"/>
+<path d="M0,0 L40,0 L41,3 L-1,3 Z " fill="#15151B" transform="translate(150,222)"/>
+<path d="M0,0 L7,0 L15,4 L21,10 L20,13 L17,13 L12,8 L7,5 L0,3 Z " fill="#1A1C23" transform="translate(73,80)"/>
+<path d="M0,0 L1,0 L1,12 L-2,17 L-4,17 L-3,11 L-1,9 Z " fill="#2F3744" transform="translate(198,91)"/>
+<path d="M0,0 L7,1 L5,2 L5,4 L0,3 Z " fill="#2C3441" transform="translate(158,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.321782;0.331683" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame27" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,58 L69,74 L65,87 L65,90 L76,97 L83,104 L89,114 L92,126 L92,138 L89,150 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-135,138 L-140,127 L-141,122 L-141,100 L-137,85 L-130,71 L-119,59 L-108,52 L-95,47 L-76,44 L-72,40 L-67,31 L-58,21 L-50,14 L-38,7 L-21,2 Z " fill="#9FCAF8" transform="translate(149,36)"/>
+<path d="M0,0 L4,1 L15,8 L26,17 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L15,33 L24,26 L23,21 L14,13 L3,6 L-1,3 Z " fill="#1E222A" transform="translate(154,113)"/>
+<path d="M0,0 L4,1 L2,5 L-9,12 L-20,21 L-21,25 L-12,33 L4,44 L4,47 L-2,46 L-16,36 L-25,28 L-26,21 L-16,11 L-3,2 Z " fill="#1E2029" transform="translate(89,113)"/>
+<path d="M0,0 L10,2 L20,7 L29,14 L36,24 L40,33 L41,37 L41,54 L39,57 L37,57 L37,37 L34,29 L29,20 L24,15 L18,10 L10,6 L0,3 Z " fill="#222730" transform="translate(158,50)"/>
+<path d="M0,0 L5,1 L3,3 L-9,7 L-22,14 L-32,23 L-39,32 L-43,39 L-52,39 L-52,37 L-50,36 L-44,36 L-42,30 L-34,20 L-24,11 L-12,4 Z " fill="#15151B" transform="translate(113,26)"/>
+<path d="M0,0 L58,0 L60,2 L59,3 L-1,3 Z " fill="#15151B" transform="translate(75,222)"/>
+<path d="M0,0 L3,0 L3,20 L2,47 L-2,48 L-2,24 Z " fill="#1B1D24" transform="translate(123,113)"/>
+<path d="M0,0 L40,0 L40,3 L0,3 Z " fill="#15151B" transform="translate(149,222)"/>
+<path d="M0,0 L10,3 L16,7 L19,10 L18,14 L14,12 L8,7 L-1,5 L-2,1 Z " fill="#1E2129" transform="translate(75,79)"/>
+<path d="M0,0 L1,0 L1,9 L3,9 L1,14 L-1,14 Z " fill="#384353" transform="translate(196,93)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.331683;0.346535" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame28" opacity="0">
+
+<path d="M0,0 L13,1 L25,4 L39,11 L48,18 L58,29 L66,44 L69,55 L70,68 L68,80 L65,90 L75,96 L81,101 L88,111 L92,123 L92,141 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-98,168 L-114,160 L-126,149 L-133,141 L-138,131 L-141,120 L-141,104 L-138,89 L-133,77 L-126,67 L-116,57 L-104,50 L-91,46 L-75,44 L-72,41 L-66,30 L-55,18 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF7" transform="translate(149,36)"/>
+<path d="M0,0 L3,1 L1,5 L-10,12 L-22,22 L-21,26 L-10,35 L3,44 L3,47 L-3,46 L-19,34 L-25,29 L-27,26 L-27,21 L-17,11 L-4,2 Z " fill="#1D2028" transform="translate(91,113)"/>
+<path d="M0,0 L6,2 L16,9 L27,18 L29,21 L29,26 L23,33 L7,45 L3,47 L0,47 L1,43 L16,32 L24,25 L23,21 L11,11 L0,4 Z " fill="#1D2028" transform="translate(154,113)"/>
+<path d="M0,0 L9,1 L20,6 L28,12 L36,21 L41,32 L43,41 L43,52 L41,56 L39,56 L39,40 L35,27 L29,18 L21,11 L11,6 L1,3 Z " fill="#21252F" transform="translate(157,50)"/>
+<path d="M0,0 L3,0 L3,9 L0,42 L-2,48 L-5,47 L-5,37 L-1,1 Z " fill="#1F222B" transform="translate(125,113)"/>
+<path d="M0,0 L60,0 L61,3 L-1,3 L-2,1 Z " fill="#15151B" transform="translate(73,222)"/>
+<path d="M0,0 L5,0 L5,2 L-12,8 L-21,13 L-31,21 L-37,28 L-43,38 L-44,39 L-51,39 L-50,36 L-45,35 L-38,24 L-32,17 L-20,8 L-7,2 Z " fill="#15151B" transform="translate(114,26)"/>
+<path d="M0,0 L38,0 L38,3 L-1,3 Z " fill="#15151B" transform="translate(149,222)"/>
+<path d="M0,0 L9,1 L15,4 L20,9 L20,13 L17,13 L12,8 L6,5 L0,3 Z " fill="#1B1E26" transform="translate(74,80)"/>
+<path d="M0,0 L1,0 L1,11 L-1,15 L-3,15 L-2,10 L-1,9 Z " fill="#333D4B" transform="translate(199,91)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.346535;0.356436" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame29" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,59 L69,73 L66,85 L63,90 L68,92 L77,98 L85,107 L90,117 L92,127 L92,137 L90,147 L84,159 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-135,138 L-139,130 L-141,123 L-141,99 L-138,87 L-130,71 L-119,59 L-108,52 L-98,48 L-85,45 L-76,44 L-73,42 L-68,32 L-58,20 L-47,12 L-33,5 L-15,1 Z " fill="#9FCBF7" transform="translate(150,36)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L23,33 L5,46 L0,47 L0,43 L11,36 L22,27 L24,25 L23,21 L15,14 L0,4 Z " fill="#1D1F28" transform="translate(154,113)"/>
+<path d="M0,0 L3,0 L3,4 L-7,10 L-17,18 L-22,23 L-20,27 L-3,40 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-18,12 L-2,1 Z " fill="#1C1E26" transform="translate(92,113)"/>
+<path d="M0,0 L9,1 L18,5 L26,11 L34,19 L40,31 L42,39 L42,53 L41,55 L39,55 L38,38 L35,28 L28,17 L19,10 L10,6 L0,3 Z " fill="#242933" transform="translate(158,50)"/>
+<path d="M0,0 L4,1 L1,23 L-2,47 L-6,48 L-6,38 L-1,1 Z " fill="#1E212A" transform="translate(126,113)"/>
+<path d="M0,0 L61,0 L63,2 L62,3 L-1,3 L-2,1 Z " fill="#15151B" transform="translate(71,222)"/>
+<path d="M0,0 L6,0 L3,3 L-13,8 L-27,17 L-36,26 L-42,36 L-44,39 L-50,39 L-51,37 L-45,36 L-43,30 L-36,21 L-29,14 L-18,7 L-8,2 Z " fill="#15151B" transform="translate(115,26)"/>
+<path d="M0,0 L38,0 L38,3 L0,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L10,3 L16,7 L19,10 L19,13 L14,12 L9,8 L-1,5 L-2,1 Z " fill="#20232C" transform="translate(76,79)"/>
+<path d="M0,0 L2,1 L2,11 L1,13 L-1,13 Z " fill="#181A21" transform="translate(198,92)"/>
+<path d="M0,0 L2,0 L3,7 L2,7 L1,15 L0,15 Z " fill="#323B49" transform="translate(197,86)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.356436;0.371287" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame30" opacity="0">
+
+<path d="M0,0 L13,1 L24,4 L34,8 L46,16 L54,24 L63,38 L68,51 L70,67 L68,80 L64,89 L75,96 L80,100 L86,108 L90,116 L92,123 L92,140 L88,153 L82,161 L75,167 L66,171 L62,172 L-81,172 L-98,168 L-114,160 L-124,151 L-131,144 L-137,134 L-140,125 L-141,120 L-141,103 L-138,89 L-133,77 L-127,68 L-121,61 L-108,52 L-95,47 L-85,45 L-75,44 L-73,43 L-67,31 L-56,19 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF7" transform="translate(150,36)"/>
+<path d="M0,0 L3,0 L3,4 L-11,13 L-21,21 L-22,25 L-14,32 L-1,41 L3,44 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-18,12 L-2,1 Z " fill="#1D1F27" transform="translate(93,113)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L25,31 L11,42 L3,47 L-1,47 L0,43 L11,36 L22,27 L24,25 L23,21 L15,14 L0,4 Z " fill="#1D1F27" transform="translate(154,113)"/>
+<path d="M0,0 L11,2 L23,8 L33,17 L40,29 L43,43 L43,51 L42,54 L40,54 L38,35 L34,25 L27,16 L18,9 L5,4 L0,3 Z " fill="#21252E" transform="translate(158,50)"/>
+<path d="M0,0 L3,0 L2,10 L-3,38 L-5,47 L-9,47 L-8,36 L-2,3 Z " fill="#1F232C" transform="translate(128,113)"/>
+<path d="M0,0 L63,0 L64,3 L-1,3 Z " fill="#15151B" transform="translate(69,222)"/>
+<path d="M0,0 L3,1 L0,4 L-16,9 L-28,16 L-39,26 L-47,39 L-48,40 L-53,40 L-53,37 L-49,36 L-43,26 L-36,18 L-24,9 L-11,3 Z " fill="#15151B" transform="translate(119,25)"/>
+<path d="M0,0 L37,0 L37,3 L0,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L7,0 L15,4 L20,9 L19,12 L15,11 L15,9 L11,7 L0,4 Z " fill="#1F232C" transform="translate(75,80)"/>
+<path d="M0,0 L3,0 L5,10 L3,10 L2,12 Z " fill="#272C37" transform="translate(195,79)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.371287;0.381188" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame31" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,21 L58,30 L66,46 L69,60 L69,73 L65,86 L64,90 L73,95 L83,104 L90,118 L92,128 L92,136 L89,150 L82,161 L73,168 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-129,147 L-136,137 L-140,127 L-142,115 L-141,99 L-137,84 L-130,71 L-119,59 L-108,52 L-99,48 L-85,45 L-76,44 L-73,41 L-66,29 L-58,20 L-46,11 L-33,5 L-15,1 Z " fill="#9FCAF7" transform="translate(151,36)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L24,32 L11,42 L3,47 L0,47 L0,43 L11,36 L22,27 L24,25 L23,21 L15,14 L0,4 Z " fill="#1C1F27" transform="translate(154,113)"/>
+<path d="M0,0 L3,0 L2,4 L-10,12 L-22,22 L-21,26 L-10,35 L3,44 L3,47 L-2,46 L-14,38 L-26,27 L-27,22 L-20,14 L-7,4 Z " fill="#1C1E26" transform="translate(94,113)"/>
+<path d="M0,0 L9,1 L19,5 L28,12 L36,21 L41,31 L43,38 L43,53 L40,54 L39,38 L36,29 L32,21 L27,15 L17,8 L6,4 L0,2 Z " fill="#1F222B" transform="translate(158,50)"/>
+<path d="M0,0 L63,0 L65,1 L65,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(68,222)"/>
+<path d="M0,0 L3,0 L2,9 L-5,42 L-7,48 L-10,47 L-9,38 L-4,13 L-1,1 Z " fill="#1F222B" transform="translate(129,113)"/>
+<path d="M0,0 L2,0 L2,3 L-13,7 L-27,14 L-34,20 L-36,20 L-38,24 L-44,31 L-49,40 L-54,40 L-53,37 L-50,37 L-48,31 L-41,22 L-34,15 L-23,8 L-12,3 Z " fill="#15151B" transform="translate(121,25)"/>
+<path d="M0,0 L35,0 L35,3 L0,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L3,0 L7,10 L8,14 L8,29 L5,30 L4,14 L1,5 Z " fill="#262C37" transform="translate(193,74)"/>
+<path d="M0,0 L10,3 L18,9 L17,13 L13,11 L7,7 L-2,4 L-2,1 Z " fill="#1D2028" transform="translate(77,79)"/>
+<path d="M0,0 L9,1 L17,4 L15,7 L6,4 L0,2 Z " fill="#21252E" transform="translate(158,50)"/>
+<path d="M0,0 L3,0 L5,6 L3,6 L2,8 Z " fill="#2D3441" transform="translate(193,74)"/>
+<path d="M0,0 L9,1 L8,4 L1,3 Z " fill="#272D38" transform="translate(158,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.381188;0.396040" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame32" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L53,23 L62,36 L67,48 L69,56 L69,76 L65,87 L65,90 L75,96 L84,105 L90,116 L92,124 L92,139 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-126,150 L-135,138 L-140,126 L-141,121 L-141,102 L-138,88 L-134,78 L-127,68 L-120,60 L-110,53 L-98,48 L-85,45 L-73,44 L-71,38 L-64,27 L-53,16 L-39,8 L-26,3 L-15,1 Z " fill="#9FCAF8" transform="translate(151,36)"/>
+<path d="M0,0 L6,2 L20,12 L29,21 L29,26 L24,32 L11,42 L3,47 L0,47 L0,43 L11,36 L22,27 L24,25 L23,21 L15,14 L0,4 Z " fill="#1C1F27" transform="translate(154,113)"/>
+<path d="M0,0 L3,1 L1,5 L-9,11 L-22,22 L-21,26 L-13,33 L3,44 L2,47 L-3,46 L-19,34 L-27,26 L-27,21 L-17,11 L-2,1 Z " fill="#1C1E26" transform="translate(95,113)"/>
+<path d="M0,0 L3,1 L2,10 L-4,33 L-7,47 L-11,47 L-10,38 L-4,12 L-1,1 Z " fill="#222630" transform="translate(130,113)"/>
+<path d="M0,0 L65,0 L67,1 L67,3 L-1,3 Z " fill="#15151B" transform="translate(66,222)"/>
+<path d="M0,0 L4,0 L4,3 L-11,7 L-27,15 L-39,26 L-48,40 L-52,40 L-51,37 L-49,37 L-47,32 L-39,21 L-30,13 L-16,5 L-5,1 Z " fill="#15151B" transform="translate(120,25)"/>
+<path d="M0,0 L9,1 L21,6 L31,14 L39,25 L43,36 L43,53 L41,53 L39,37 L36,27 L29,17 L21,10 L10,5 L1,3 Z " fill="#20232D" transform="translate(158,50)"/>
+<path d="M0,0 L34,0 L35,3 L-1,3 Z " fill="#15151B" transform="translate(148,222)"/>
+<path d="M0,0 L7,0 L16,4 L20,8 L19,12 L14,9 L10,6 L0,3 Z " fill="#1D2028" transform="translate(75,80)"/>
+<path d="M0,0 L9,1 L9,4 L1,3 Z " fill="#2C3340" transform="translate(158,50)"/>
+<path d="M0,0 L7,1 L10,2 L10,4 L3,3 Z " fill="#1C1F27" transform="translate(165,52)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.396040;0.405941" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame33" opacity="0">
+
+<path d="M0,0 L18,2 L30,6 L41,12 L53,23 L62,35 L67,47 L69,54 L70,62 L70,71 L68,81 L65,90 L75,96 L82,102 L89,113 L92,122 L93,133 L91,146 L87,155 L80,163 L74,168 L63,172 L-81,172 L-98,168 L-112,161 L-121,154 L-129,146 L-136,135 L-140,124 L-141,118 L-141,105 L-138,89 L-132,75 L-124,65 L-116,57 L-105,51 L-95,47 L-85,45 L-75,44 L-72,41 L-66,30 L-56,19 L-43,10 L-32,5 L-15,1 Z " fill="#9FCAF7" transform="translate(151,36)"/>
+<path d="M0,0 L4,1 L3,4 L-8,11 L-19,20 L-21,22 L-20,26 L-11,34 L4,44 L3,47 L-2,46 L-16,36 L-24,29 L-26,26 L-25,19 L-15,10 Z " fill="#1E222A" transform="translate(95,113)"/>
+<path d="M0,0 L6,2 L16,9 L27,18 L29,21 L29,26 L23,33 L7,45 L3,47 L0,47 L1,43 L16,32 L24,25 L23,21 L14,13 L0,4 Z " fill="#1D2028" transform="translate(154,113)"/>
+<path d="M0,0 L7,0 L23,7 L33,16 L39,25 L43,36 L44,41 L44,53 L41,53 L40,39 L37,29 L31,19 L23,11 L13,6 L1,3 Z " fill="#21252F" transform="translate(158,50)"/>
+<path d="M0,0 L66,0 L68,2 L67,3 L-1,3 Z " fill="#15151B" transform="translate(65,222)"/>
+<path d="M0,0 L3,1 L2,8 L-5,35 L-8,46 L-13,47 L-11,38 L-3,7 Z " fill="#21252F" transform="translate(131,113)"/>
+<path d="M0,0 L4,0 L3,3 L-12,7 L-26,14 L-37,23 L-46,36 L-48,40 L-52,40 L-50,36 L-43,25 L-37,18 L-26,10 L-14,4 Z " fill="#15151B" transform="translate(121,25)"/>
+<path d="M0,0 L35,0 L35,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L8,0 L18,6 L20,10 L17,12 L9,6 L0,3 Z " fill="#1D1F28" transform="translate(76,80)"/>
+<path d="M0,0 L7,0 L23,7 L21,10 L13,6 L1,3 Z " fill="#242933" transform="translate(158,50)"/>
+<path d="M0,0 L7,0 L9,2 L9,4 L1,3 Z " fill="#343F4E" transform="translate(158,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.405941;0.420792" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame34" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,58 L69,74 L65,87 L65,90 L76,97 L83,104 L88,112 L91,121 L92,126 L92,137 L90,147 L84,159 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-135,138 L-139,130 L-141,122 L-141,100 L-137,85 L-130,71 L-119,59 L-108,52 L-95,47 L-76,44 L-72,40 L-67,31 L-58,20 L-47,12 L-35,6 L-21,2 Z " fill="#9FCAF7" transform="translate(152,36)"/>
+<path d="M0,0 L3,0 L3,4 L-7,10 L-18,19 L-22,24 L-17,29 L-4,39 L3,44 L3,47 L-2,46 L-15,37 L-26,27 L-27,22 L-19,13 L-5,3 Z " fill="#1E212A" transform="translate(96,113)"/>
+<path d="M0,0 L4,1 L15,8 L28,19 L29,26 L22,34 L5,46 L0,47 L1,43 L15,33 L24,25 L23,21 L14,13 L3,6 L-1,3 Z " fill="#1E212A" transform="translate(154,113)"/>
+<path d="M0,0 L67,0 L69,2 L68,3 L-1,3 Z " fill="#15151B" transform="translate(64,222)"/>
+<path d="M0,0 L10,1 L25,9 L31,14 L38,24 L43,37 L43,53 L40,52 L39,37 L35,26 L27,15 L17,8 L6,4 L0,3 Z " fill="#222630" transform="translate(159,50)"/>
+<path d="M0,0 L3,1 L1,10 L-3,24 L-9,44 L-10,47 L-14,47 L-12,37 L-3,7 Z " fill="#1F222B" transform="translate(132,113)"/>
+<path d="M0,0 L5,0 L4,3 L-12,7 L-24,13 L-33,20 L-40,27 L-46,37 L-48,40 L-51,40 L-51,37 L-49,37 L-47,31 L-39,21 L-29,12 L-19,6 L-5,1 Z " fill="#15151B" transform="translate(121,25)"/>
+<path d="M0,0 L34,0 L34,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L9,2 L17,8 L17,12 L13,11 L8,7 L-1,5 L-2,1 Z " fill="#1F222B" transform="translate(78,79)"/>
+<path d="M0,0 L3,1 L3,17 L0,16 Z " fill="#2A303D" transform="translate(199,86)"/>
+<path d="M0,0 L10,1 L11,4 L0,3 Z " fill="#282E3A" transform="translate(159,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.420792;0.430693" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame35" opacity="0">
+
+<path d="M0,0 L13,1 L30,6 L43,14 L53,23 L62,36 L67,48 L69,56 L69,76 L65,87 L65,90 L75,96 L84,105 L91,119 L92,124 L92,140 L88,153 L82,161 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-131,144 L-138,132 L-141,121 L-141,103 L-138,88 L-130,72 L-122,62 L-110,53 L-98,48 L-85,45 L-73,43 L-67,31 L-56,19 L-45,11 L-32,5 L-21,2 Z " fill="#9FCAF8" transform="translate(152,36)"/>
+<path d="M0,0 L4,1 L15,8 L26,17 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L15,33 L24,26 L23,21 L14,13 L4,6 L-1,3 Z " fill="#1E222A" transform="translate(154,113)"/>
+<path d="M0,0 L3,1 L1,5 L-9,11 L-22,22 L-21,26 L-13,33 L3,44 L2,47 L-3,46 L-19,34 L-27,26 L-27,21 L-17,11 L-2,1 Z " fill="#1B1D25" transform="translate(97,113)"/>
+<path d="M0,0 L67,0 L68,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(64,222)"/>
+<path d="M0,0 L6,0 L5,3 L-11,7 L-27,15 L-39,26 L-48,40 L-50,40 L-49,35 L-40,22 L-29,12 L-14,4 Z " fill="#15151B" transform="translate(121,25)"/>
+<path d="M0,0 L4,0 L3,5 L-2,21 L-9,44 L-10,46 L-14,45 L-12,36 L-2,4 Z " fill="#1F222B" transform="translate(132,114)"/>
+<path d="M0,0 L10,1 L24,8 L33,16 L40,27 L43,37 L43,53 L41,53 L38,32 L33,22 L24,12 L10,5 L1,3 Z " fill="#21262F" transform="translate(159,50)"/>
+<path d="M0,0 L33,0 L34,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L7,0 L15,3 L20,8 L19,11 L14,9 L10,6 L0,3 Z " fill="#1C1F27" transform="translate(76,80)"/>
+<path d="M0,0 L10,1 L19,5 L15,7 L6,4 L0,2 Z " fill="#29303C" transform="translate(159,50)"/>
+<path d="M0,0 L8,1 L8,3 L1,3 Z " fill="#242933" transform="translate(159,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.430693;0.445545" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame36" opacity="0">
+
+<path d="M0,0 L18,2 L30,6 L41,12 L53,23 L61,34 L67,47 L69,54 L70,62 L70,71 L68,81 L65,90 L75,96 L82,102 L89,113 L92,123 L92,142 L88,153 L84,159 L77,166 L66,171 L63,172 L-81,172 L-98,168 L-112,161 L-121,154 L-130,145 L-138,131 L-141,119 L-141,105 L-138,89 L-132,75 L-125,66 L-116,57 L-106,51 L-95,47 L-85,45 L-75,44 L-72,41 L-66,30 L-55,18 L-41,9 L-29,4 L-15,1 Z " fill="#9FCAF7" transform="translate(152,36)"/>
+<path d="M0,0 L3,0 L3,4 L-7,10 L-18,19 L-22,24 L-17,29 L-4,39 L3,44 L3,47 L-2,46 L-15,37 L-26,27 L-27,22 L-19,13 L-5,3 Z " fill="#1E212A" transform="translate(97,113)"/>
+<path d="M0,0 L5,1 L19,11 L28,19 L30,22 L29,27 L22,34 L7,45 L4,47 L0,47 L1,43 L18,31 L25,25 L23,20 L10,10 L0,4 Z " fill="#1D1F28" transform="translate(154,113)"/>
+<path d="M0,0 L68,0 L69,3 L-1,3 Z " fill="#15151B" transform="translate(63,222)"/>
+<path d="M0,0 L10,1 L26,9 L34,17 L40,27 L44,39 L44,53 L41,52 L40,38 L36,27 L30,18 L23,11 L13,6 L1,3 Z " fill="#242933" transform="translate(159,50)"/>
+<path d="M0,0 L3,0 L2,7 L-11,45 L-15,45 L-13,36 L-1,1 Z " fill="#1E212A" transform="translate(133,114)"/>
+<path d="M0,0 L5,0 L4,3 L-15,8 L-29,16 L-37,23 L-46,36 L-48,40 L-51,39 L-46,29 L-37,18 L-26,10 L-12,3 Z " fill="#15151B" transform="translate(122,25)"/>
+<path d="M0,0 L33,0 L33,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L8,0 L16,5 L19,8 L18,11 L14,9 L9,6 L0,3 Z " fill="#1D1F28" transform="translate(77,80)"/>
+<path d="M0,0 L3,1 L3,15 L0,14 Z " fill="#272D39" transform="translate(200,88)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.445545;0.455446" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame37" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L50,21 L58,30 L66,46 L69,60 L69,73 L65,86 L64,90 L73,95 L83,104 L90,118 L92,128 L92,136 L89,150 L82,161 L73,168 L62,172 L-81,172 L-96,169 L-110,163 L-122,154 L-129,147 L-136,137 L-140,127 L-142,115 L-141,99 L-137,84 L-130,71 L-119,59 L-108,52 L-99,48 L-85,45 L-76,44 L-73,41 L-66,29 L-58,20 L-46,11 L-33,5 L-15,1 Z " fill="#9FCAF7" transform="translate(153,36)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L13,41 L4,47 L0,47 L1,43 L14,34 L25,25 L23,20 L10,10 L0,4 Z " fill="#1D1F28" transform="translate(154,113)"/>
+<path d="M0,0 L4,1 L3,4 L-8,11 L-21,22 L-20,26 L-12,33 L4,44 L3,47 L-2,46 L-16,36 L-24,29 L-26,26 L-26,21 L-16,11 L-3,2 Z " fill="#1D2029" transform="translate(97,113)"/>
+<path d="M0,0 L68,0 L70,2 L69,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(63,222)"/>
+<path d="M0,0 L10,1 L26,9 L35,18 L41,28 L44,38 L44,53 L41,52 L40,39 L36,26 L28,15 L18,8 L5,4 L0,2 Z " fill="#1E212A" transform="translate(159,50)"/>
+<path d="M0,0 L4,0 L3,5 L-11,45 L-15,45 L-13,36 L-1,2 Z " fill="#1E212A" transform="translate(133,114)"/>
+<path d="M0,0 L6,0 L5,3 L-9,6 L-20,11 L-30,17 L-37,23 L-44,33 L-48,40 L-50,40 L-49,35 L-42,24 L-33,15 L-19,6 L-5,1 Z " fill="#15151B" transform="translate(122,25)"/>
+<path d="M0,0 L33,0 L33,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L3,0 L7,10 L8,14 L8,29 L5,28 L4,15 L0,2 Z " fill="#2B323F" transform="translate(195,74)"/>
+<path d="M0,0 L10,3 L17,8 L17,12 L13,11 L5,6 L-2,4 L-2,1 Z " fill="#1C1F27" transform="translate(79,79)"/>
+<path d="M0,0 L10,1 L12,2 L12,5 L1,3 Z " fill="#2C3340" transform="translate(159,50)"/>
+<path d="M0,0 L5,1 L12,5 L11,8 L0,2 Z " fill="#222731" transform="translate(171,53)"/>
+<path d="M0,0 L3,0 L5,4 L5,9 L2,8 Z " fill="#252B35" transform="translate(195,74)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.455446;0.470297" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame38" opacity="0">
+
+<path d="M0,0 L17,2 L29,6 L40,12 L51,21 L60,33 L66,46 L69,58 L69,74 L65,87 L65,90 L76,97 L83,104 L88,112 L91,121 L92,126 L92,138 L89,150 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-108,164 L-118,157 L-128,148 L-135,138 L-139,130 L-141,122 L-141,100 L-137,85 L-130,71 L-119,59 L-108,52 L-95,47 L-76,44 L-72,40 L-67,31 L-58,21 L-50,14 L-38,7 L-21,2 Z " fill="#9FCAF7" transform="translate(153,36)"/>
+<path d="M0,0 L5,1 L18,10 L29,20 L30,25 L23,33 L9,44 L4,47 L0,47 L1,43 L14,34 L24,26 L25,23 L21,18 L7,8 L0,4 Z " fill="#1D1F27" transform="translate(154,113)"/>
+<path d="M0,0 L3,0 L2,4 L-9,11 L-22,22 L-21,26 L-10,35 L3,44 L3,47 L-2,46 L-13,39 L-26,27 L-27,22 L-20,14 L-10,6 Z " fill="#1B1E26" transform="translate(98,113)"/>
+<path d="M0,0 L68,0 L70,2 L69,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(63,222)"/>
+<path d="M0,0 L3,0 L2,7 L-5,26 L-11,43 L-13,46 L-16,45 L-15,39 L-1,1 Z " fill="#1E2029" transform="translate(134,114)"/>
+<path d="M0,0 L9,1 L25,9 L31,14 L38,24 L42,33 L43,37 L43,53 L41,53 L39,38 L36,28 L30,18 L22,11 L12,6 L0,3 Z " fill="#222731" transform="translate(160,50)"/>
+<path d="M0,0 L5,0 L4,3 L-13,7 L-28,15 L-38,24 L-45,33 L-49,40 L-51,40 L-50,35 L-43,24 L-35,16 L-25,9 L-15,4 Z " fill="#15151B" transform="translate(123,25)"/>
+<path d="M0,0 L32,0 L33,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L9,2 L17,8 L16,12 L12,10 L8,7 L-1,5 L-2,1 Z " fill="#1E222A" transform="translate(79,79)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.470297;0.480198" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame39" opacity="0">
+
+<path d="M0,0 L13,1 L29,6 L40,12 L49,19 L59,31 L67,48 L69,57 L69,75 L66,85 L64,89 L76,97 L84,105 L90,117 L92,125 L92,138 L90,148 L84,159 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-127,149 L-135,138 L-139,130 L-141,122 L-141,101 L-137,85 L-130,71 L-120,60 L-110,53 L-98,48 L-85,45 L-73,44 L-71,38 L-65,28 L-53,16 L-40,8 L-26,3 L-15,1 Z " fill="#9FCAF7" transform="translate(153,36)"/>
+<path d="M0,0 L5,1 L18,10 L28,19 L30,22 L29,27 L20,36 L4,47 L0,47 L1,43 L17,32 L25,25 L23,20 L13,12 L0,4 Z " fill="#1D2028" transform="translate(154,113)"/>
+<path d="M0,0 L3,0 L2,4 L-10,12 L-21,21 L-22,25 L-10,35 L2,43 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-18,12 L-2,1 Z " fill="#1D1F28" transform="translate(98,113)"/>
+<path d="M0,0 L68,0 L70,2 L69,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(63,222)"/>
+<path d="M0,0 L10,1 L24,8 L32,15 L39,26 L42,33 L43,38 L43,53 L41,53 L39,38 L36,28 L30,18 L21,10 L10,5 L0,3 Z " fill="#20232C" transform="translate(160,50)"/>
+<path d="M0,0 L3,0 L2,7 L-12,45 L-16,45 L-15,40 L-3,6 Z " fill="#1D2028" transform="translate(134,114)"/>
+<path d="M0,0 L5,0 L4,3 L-12,7 L-28,15 L-38,24 L-45,33 L-49,40 L-51,40 L-50,35 L-43,24 L-35,16 L-25,9 L-12,3 Z " fill="#15151B" transform="translate(123,25)"/>
+<path d="M0,0 L32,0 L33,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L7,0 L15,3 L19,7 L18,11 L11,7 L6,5 L0,3 Z " fill="#1E212A" transform="translate(77,80)"/>
+<path d="M0,0 L10,1 L12,3 L10,5 L0,3 Z " fill="#2A313D" transform="translate(160,50)"/>
+<path d="M0,0 L3,1 L4,8 L2,8 L1,10 Z " fill="#272D39" transform="translate(199,82)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.480198;0.495050" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame40" opacity="0">
+
+<path d="M0,0 L13,1 L29,6 L40,12 L49,19 L59,31 L66,45 L69,57 L69,75 L65,87 L65,90 L76,97 L84,105 L90,117 L92,125 L92,139 L89,151 L83,160 L75,167 L66,171 L62,172 L-81,172 L-95,169 L-107,164 L-118,157 L-127,149 L-135,138 L-140,126 L-141,121 L-141,101 L-137,85 L-131,73 L-123,63 L-113,55 L-101,49 L-85,45 L-73,44 L-71,38 L-64,27 L-53,16 L-39,8 L-26,3 L-15,1 Z " fill="#9FCAF7" transform="translate(153,36)"/>
+<path d="M0,0 L3,0 L3,4 L-9,11 L-19,20 L-21,20 L-22,25 L-10,35 L2,43 L3,47 L-2,46 L-15,37 L-25,28 L-27,25 L-26,20 L-19,13 L-4,2 Z " fill="#1E2029" transform="translate(98,113)"/>
+<path d="M0,0 L5,1 L18,10 L28,19 L30,22 L29,27 L20,36 L4,47 L0,47 L1,43 L13,35 L24,26 L25,22 L16,14 L2,5 L0,4 Z " fill="#1C1F27" transform="translate(154,113)"/>
+<path d="M0,0 L68,0 L70,2 L69,3 L-2,3 L-2,1 Z " fill="#15151B" transform="translate(63,222)"/>
+<path d="M0,0 L3,0 L2,7 L-12,45 L-16,45 L-15,39 L-1,1 Z " fill="#1E2129" transform="translate(134,114)"/>
+<path d="M0,0 L10,1 L24,8 L32,15 L38,24 L42,33 L43,37 L43,53 L41,53 L39,37 L36,28 L30,18 L22,11 L10,5 L0,3 Z " fill="#222630" transform="translate(160,50)"/>
+<path d="M0,0 L5,0 L4,3 L-12,7 L-28,15 L-40,26 L-47,37 L-49,40 L-51,40 L-50,35 L-41,22 L-31,13 L-17,5 L-5,1 Z " fill="#15151B" transform="translate(123,25)"/>
+<path d="M0,0 L32,0 L33,3 L0,3 Z " fill="#15151B" transform="translate(147,222)"/>
+<path d="M0,0 L7,0 L15,3 L19,7 L18,11 L11,7 L6,5 L0,3 Z " fill="#1E222A" transform="translate(77,80)"/>
+<path d="M0,0 L3,1 L4,5 L4,21 L2,21 L0,5 Z " fill="#1E212A" transform="translate(199,82)"/>
+<path d="M0,0 L10,1 L12,3 L10,5 L0,3 Z " fill="#2C3340" transform="translate(160,50)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.495050;1.000000" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+</g>
+</svg>

svgAsset/db-creation.svg

@@ -0,0 +1,35 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
+<style>
+  .led{fill:#35d0b5}
+  .a{animation:blink 1.4s ease-in-out infinite}
+  .b{animation:blink 1.4s .22s ease-in-out infinite}
+  .c{animation:blink 1.4s .44s ease-in-out infinite}
+  .d{animation:blink 1.4s .66s ease-in-out infinite}
+  @keyframes blink{0%,25%,100%{opacity:.28}45%,72%{opacity:1}}
+</style>
+
+<!-- database body -->
+<path d="M7 11C7 15 14.6 17 24 17S41 15 41 11v26c0 4-7.6 6-17 6S7 41 7 37Z" fill="#0D3D8C"/>
+<path d="M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z" fill="#1769C2">
+ <animate attributeName="d" dur="1.3s" repeatCount="indefinite"
+ values="M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z;
+ M7 9C7 13 14.6 15 24 15S41 13 41 9v14c0 4-7.6 6-17 6S7 27 7 23Z;
+ M7 11C7 15 14.6 17 24 17S41 15 41 11v14c0 4-7.6 6-17 6S7 29 7 25Z"/>
+</path>
+
+<!-- animated top -->
+<g>
+ <path d="M7 11C7 7 14.6 5 24 5S41 7 41 11v7c0 4-7.6 6-17 6S7 22 7 18Z" fill="#1976D2"/>
+ <ellipse cx="24" cy="11" rx="17" ry="5.5" fill="#2B91E3"/>
+ <ellipse cx="24" cy="9.7" rx="14.5" ry="3.5" fill="#39A0EA" opacity=".35"/>
+ <animateTransform attributeName="transform" type="translate" values="0 0;0 -3;0 0" dur="1.3s" repeatCount="indefinite"/>
+</g>
+
+<!-- server-style activity indicators -->
+<g>
+ <circle class="led a" cx="16" cy="35.5" r="1.6"/>
+ <circle class="led b" cx="21.3" cy="36.2" r="1.6"/>
+ <circle class="led c" cx="26.7" cy="36.2" r="1.6"/>
+ <circle class="led d" cx="32" cy="35.5" r="1.6"/>
+</g>
+</svg>

svgAsset/server-for-lightmode.svg

@@ -0,0 +1,835 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><title>Generated Animation</title>
+<desc>41 frames, 2.020s duration</desc>
+<g id="animationGroup">
+<g id="frame0" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-31,74 L-24,53 L-20,43 L-13,23 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L13,15 L7,32 L3,43 L-3,60 L-8,74 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L22,0 L17,4 L15,8 L14,21 L13,23 L13,31 L14,33 L15,46 L17,51 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L9,0 L14,3 L17,8 L17,15 L14,21 L9,24 L0,24 L-7,18 L-8,16 L-8,8 L-4,2 Z " fill="#F5BE38" transform="translate(45,158)"/>
+<path d="M0,0 L7,0 L12,5 L11,12 L7,16 L0,16 L-4,12 L-5,5 Z " fill="#403846" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9986" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A87" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C88" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9C88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C88" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9C88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L1,7 L0,6 Z " fill="#2D9D88" transform="translate(217,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9D88" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L0,6 Z " fill="#2CA18B" transform="translate(217,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA18B" transform="translate(200,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.000000;0.009901" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame1" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-5,3 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L19,3 L17,3 L14,12 L-5,66 L-11,82 L-12,83 L-27,84 L-32,87 L-34,87 L-31,77 L-16,34 L-6,7 L-3,2 Z " fill="#444C57" transform="translate(54,59)"/>
+<path d="M0,0 L22,0 L16,7 L15,21 L14,23 L14,31 L15,33 L16,46 L18,50 L24,53 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-1,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L10,0 L17,6 L18,15 L15,20 L10,24 L0,24 L-7,18 L-8,16 L-8,8 L-4,2 Z " fill="#F1BB38" transform="translate(45,158)"/>
+<path d="M0,0 L8,0 L12,4 L12,12 L7,16 L1,16 L-4,12 L-5,5 Z " fill="#3D3646" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9B87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L1,7 L-1,6 L-1,1 Z " fill="#2D9E89" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2E9A86" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9E89" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2CA08A" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA28B" transform="translate(200,176)"/>
+<path d="M0,0 L2,1 L-5,8 L-6,6 L-1,1 Z " fill="#2E2A3A" transform="translate(24,143)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.009901;0.024752" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame2" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383446" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L153,84 L-33,83 L-25,59 L-9,14 L-5,4 Z " fill="#616B76" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L-1,54 L-11,82 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L20,0 L20,2 L15,5 L13,9 L12,22 L11,24 L11,32 L12,34 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L13,0 L19,5 L21,9 L20,17 L15,23 L13,24 L0,24 L-7,16 L-7,8 L-3,2 Z " fill="#EEB938" transform="translate(44,158)"/>
+<path d="M0,0 L10,0 L14,4 L14,12 L11,15 L8,16 L0,16 L-4,12 L-4,4 Z " fill="#3A3546" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9986" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L3,7 L-1,6 L-1,1 Z " fill="#2D9A87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9C87" transform="translate(200,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9C87" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.024752;0.034653" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame3" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-5,3 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L19,3 L17,3 L14,12 L-5,66 L-11,82 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L12,22 L11,24 L12,45 L15,50 L15,52 L21,54 L21,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L14,0 L19,3 L22,9 L21,18 L16,23 L14,24 L0,24 L-6,19 L-8,16 L-8,8 L-2,1 Z " fill="#413945" transform="translate(45,158)"/>
+<path d="M0,0 L14,0 L19,3 L22,9 L21,18 L16,23 L14,24 L0,24 L-6,19 L-8,16 L-8,8 L-2,1 Z M3,3 L-2,6 L-4,9 L-3,16 L1,20 L12,20 L17,17 L18,15 L18,9 L14,4 L11,3 Z " fill="#F9C138" transform="translate(45,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.034653;0.049505" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame4" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-27,62 L-12,20 L-7,6 L-2,1 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L12,17 L-3,60 L-11,82 L-12,83 L-27,84 L-32,86 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444C57" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L15,21 L14,23 L14,31 L16,46 L21,52 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-2,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L12,0 L18,3 L22,8 L22,18 L18,23 L12,26 L0,26 L-5,24 L-11,17 L-11,9 L-7,3 Z " fill="#EAB639" transform="translate(48,157)"/>
+<path d="M0,0 L16,0 L20,4 L20,11 L16,15 L14,16 L0,16 L-5,11 L-5,5 Z " fill="#3B3546" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2C9D88" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.049505;0.059406" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame5" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383445" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-5,3 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L19,3 L17,3 L14,12 L-5,66 L-11,82 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L21,0 L16,5 L15,8 L14,21 L13,23 L13,31 L14,33 L15,46 L17,50 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L22,0 L27,3 L30,8 L30,15 L27,21 L22,24 L0,24 L-7,16 L-7,8 L-3,2 Z " fill="#3C3645" transform="translate(44,158)"/>
+<path d="M0,0 L22,0 L27,3 L30,8 L30,15 L27,21 L22,24 L0,24 L-7,16 L-7,8 L-3,2 Z M2,4 L-3,9 L-2,16 L2,20 L21,20 L26,15 L26,9 L21,4 Z " fill="#F1BB38" transform="translate(44,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9986" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.059406;0.074257" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame6" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-10,80 L-12,83 L-27,84 L-32,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L15,21 L14,23 L14,31 L15,33 L16,45 L19,50 L25,53 L25,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-2,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L20,0 L27,4 L30,9 L30,17 L27,22 L20,26 L0,26 L-5,24 L-11,17 L-11,9 L-7,3 Z " fill="#3A3546" transform="translate(48,157)"/>
+<path d="M0,0 L20,0 L27,4 L30,9 L30,17 L27,22 L20,26 L0,26 L-5,24 L-11,17 L-11,9 L-7,3 Z M-2,5 L-6,9 L-7,15 L-2,21 L20,21 L24,19 L26,16 L26,10 L21,5 Z " fill="#E7B439" transform="translate(48,157)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2CA08A" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,5 Z " fill="#2CA18B" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,4 Z " fill="#2CA08A" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,2 Z " fill="#2CA08A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.074257;0.084158" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame7" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-27,62 L-12,20 L-7,6 L-2,1 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L12,17 L-3,60 L-11,82 L174,83 L174,84 L-29,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444C57" transform="translate(54,59)"/>
+<path d="M0,0 L22,0 L17,4 L15,8 L14,21 L13,23 L13,31 L14,33 L15,46 L17,51 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-4,5 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L25,0 L31,3 L35,9 L35,18 L31,23 L25,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z " fill="#3B3546" transform="translate(47,157)"/>
+<path d="M0,0 L25,0 L31,3 L35,9 L35,18 L31,23 L25,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-6,16 L-1,21 L26,21 L31,16 L31,10 L26,5 Z " fill="#E6B339" transform="translate(47,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9986" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C88" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA28B" transform="translate(128,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.084158;0.099010" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame8" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393345" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-5,66 L-11,82 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L29,0 L35,3 L39,8 L39,18 L34,24 L29,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z " fill="#3A3445" transform="translate(47,157)"/>
+<path d="M0,0 L21,0 L15,7 L14,21 L13,23 L13,31 L14,33 L15,46 L17,50 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L29,0 L35,3 L39,8 L39,18 L34,24 L29,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L29,21 L34,18 L35,16 L35,9 L31,5 Z " fill="#E5B339" transform="translate(47,157)"/>
+<path d="M0,0 L5,2 L4,7 L0,8 L-2,7 L-2,1 Z " fill="#2D9785" transform="translate(147,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9C88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L2,7 L-1,5 Z " fill="#2C9C87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.099010;0.108911" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame9" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-2,1 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L16,7 L-3,60 L-11,82 L175,83 L175,84 L-29,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L34,0 L41,4 L44,9 L44,17 L41,22 L33,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z " fill="#3B3445" transform="translate(47,157)"/>
+<path d="M0,0 L22,0 L17,4 L15,8 L14,21 L13,23 L13,31 L14,33 L15,46 L17,51 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-4,5 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L34,0 L41,4 L44,9 L44,17 L41,22 L33,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L34,21 L38,19 L40,16 L40,10 L35,5 Z " fill="#E5B239" transform="translate(47,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#309A86" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2E9E89" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2E9D88" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.108911;0.123762" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame10" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L11,21 L-4,63 L-11,82 L-12,83 L-27,84 L-34,87 L-31,77 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L38,0 L44,4 L47,7 L48,10 L48,17 L42,24 L38,26 L0,26 L-6,22 L-10,17 L-10,9 L-6,3 Z " fill="#3B3545" transform="translate(47,157)"/>
+<path d="M0,0 L22,0 L16,7 L15,21 L14,23 L14,31 L15,33 L16,46 L18,50 L24,53 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-2,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L38,0 L44,4 L47,7 L48,10 L48,17 L42,24 L38,26 L0,26 L-6,22 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L39,21 L44,16 L44,10 L39,5 Z " fill="#E5B239" transform="translate(47,157)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2E9F8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA08B" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA18B" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2E9F8A" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.123762;0.133663" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame11" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-24,54 L-7,7 L-4,2 Z " fill="#616B76" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-9,77 L-12,83 L-27,84 L-32,87 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444C58" transform="translate(54,59)"/>
+<path d="M0,0 L34,0 L41,4 L44,10 L43,19 L38,24 L34,26 L0,26 L-8,21 L-10,17 L-10,9 L-6,3 Z " fill="#3A3546" transform="translate(51,157)"/>
+<path d="M0,0 L15,0 L19,2 L14,6 L13,8 L13,47 L15,51 L21,54 L21,55 L-1,55 L-7,51 L-9,47 L-9,7 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L34,0 L41,4 L44,10 L43,19 L38,24 L34,26 L0,26 L-8,21 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-6,16 L-1,21 L35,21 L40,16 L40,10 L35,5 Z " fill="#E5B239" transform="translate(51,157)"/>
+<path d="M0,0 L5,0 L6,5 L1,7 L-1,6 L-1,1 Z " fill="#2D9F8A" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2D9F8A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2D9F8B" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2D9F8A" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F8A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.133663;0.148515" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame12" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L11,21 L-4,63 L-11,82 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L30,0 L37,4 L40,9 L40,17 L37,22 L30,26 L0,26 L-6,22 L-9,18 L-9,8 L-4,2 Z " fill="#3A3446" transform="translate(55,157)"/>
+<path d="M0,0 L30,0 L37,4 L40,9 L40,17 L37,22 L30,26 L0,26 L-6,22 L-9,18 L-9,8 L-4,2 Z M-1,5 L-5,9 L-5,16 L0,21 L31,21 L36,16 L36,10 L31,5 Z " fill="#E6B339" transform="translate(55,157)"/>
+<path d="M0,0 L5,0 L6,5 L1,7 L-1,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9E89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9E89" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9F89" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.148515;0.158416" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame13" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L154,84 L-33,83 L-28,67 L-25,59 L-20,46 L-13,25 L-9,14 L-5,5 Z " fill="#616B76" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L10,23 L3,42 L-1,54 L-5,66 L-8,74 L-12,83 L-27,84 L-32,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L16,45 L19,50 L25,53 L25,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-2,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L25,0 L32,4 L35,9 L35,17 L32,22 L25,26 L0,26 L-7,22 L-10,17 L-10,8 L-5,2 Z " fill="#3B3546" transform="translate(60,157)"/>
+<path d="M0,0 L25,0 L32,4 L35,9 L35,17 L32,22 L25,26 L0,26 L-7,22 L-10,17 L-10,8 L-5,2 Z M-1,5 L-6,10 L-6,16 L-1,21 L26,21 L31,16 L31,10 L26,5 Z " fill="#E8B439" transform="translate(60,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2F9D88" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L3,7 L-1,6 L-1,1 Z " fill="#309B87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA08A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA08A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA08A" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA08A" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.158416;0.173267" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame14" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-5,66 L-11,82 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L20,0 L14,7 L14,46 L16,50 L21,54 L0,54 L-6,50 L-8,46 L-8,6 L-3,1 Z " fill="#231E2C" transform="translate(26,143)"/>
+<path d="M0,0 L21,0 L27,3 L31,10 L30,19 L25,24 L21,26 L0,26 L-7,22 L-10,17 L-10,9 L-6,3 Z " fill="#3C3545" transform="translate(64,157)"/>
+<path d="M0,0 L21,0 L27,3 L31,10 L30,19 L25,24 L21,26 L0,26 L-7,22 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L22,21 L27,16 L27,10 L22,5 Z " fill="#E7B439" transform="translate(64,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L1,7 L-1,6 L-1,1 Z " fill="#2C9E89" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9F89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9F8A" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9E89" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.173267;0.183168" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame15" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383445" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L152,84 L-33,83 L-25,59 L-9,14 L-5,4 Z " fill="#616B76" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L-1,54 L-11,82 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L20,0 L14,7 L14,46 L16,50 L22,53 L22,54 L0,54 L-6,50 L-8,46 L-8,6 L-3,1 Z " fill="#231E2C" transform="translate(26,143)"/>
+<path d="M0,0 L21,0 L26,3 L29,8 L29,16 L26,21 L21,24 L0,24 L-7,18 L-8,16 L-8,8 L-4,2 Z " fill="#3E3844" transform="translate(66,158)"/>
+<path d="M0,0 L21,0 L26,3 L29,8 L29,16 L26,21 L21,24 L0,24 L-7,18 L-8,16 L-8,8 L-4,2 Z M4,3 L-2,6 L-4,9 L-3,16 L1,20 L20,20 L25,15 L25,9 L20,4 L17,3 Z " fill="#F4BD38" transform="translate(66,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,4 L4,7 L0,6 L-1,1 Z " fill="#2E9C88" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2D9F8A" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2CA18B" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,4 Z " fill="#2D9F8A" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA08B" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.183168;0.198020" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame16" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-24,54 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-9,77 L-12,83 L-27,84 L-32,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D57" transform="translate(54,59)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-5,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L12,0 L20,4 L23,9 L23,17 L19,23 L12,26 L0,26 L-6,23 L-10,18 L-10,8 L-6,3 Z " fill="#EAB639" transform="translate(72,157)"/>
+<path d="M0,0 L16,0 L21,5 L21,11 L15,16 L1,16 L-3,12 L-4,5 Z " fill="#3B3546" transform="translate(70,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9885" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9A86" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9985" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9C87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2C9B87" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.198020;0.207921" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame17" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-24,54 L-7,7 L-4,2 Z " fill="#616B76" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-9,77 L-12,83 L-26,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L14,0 L19,1 L14,5 L12,9 L12,46 L15,51 L21,54 L21,55 L-2,55 L-8,51 L-10,47 L-10,7 L-7,6 L-5,2 Z " fill="#231E2C" transform="translate(28,142)"/>
+<path d="M0,0 L15,0 L20,3 L23,8 L23,15 L20,21 L15,24 L0,24 L-5,20 L-7,16 L-7,7 L-3,2 Z " fill="#F2BC38" transform="translate(72,158)"/>
+<path d="M0,0 L13,0 L18,5 L18,11 L13,16 L1,16 L-4,11 L-4,5 Z " fill="#3E3746" transform="translate(73,162)"/>
+<path d="M0,0 L5,0 L6,4 L4,7 L-1,6 L-1,1 Z " fill="#2D9A87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L3,7 L-1,6 L-1,1 Z " fill="#2E9B87" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9986" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2E9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9D88" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.207921;0.222772" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame18" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-2,1 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L16,7 L-3,60 L-11,82 L-12,83 L-27,84 L-32,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-5,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L12,0 L17,3 L20,8 L20,15 L17,21 L12,24 L0,24 L-6,19 L-7,17 L-7,7 L-2,1 Z " fill="#F5BE38" transform="translate(75,158)"/>
+<path d="M0,0 L6,1 L11,6 L11,12 L6,17 L-3,17 L-8,12 L-8,5 L-4,1 Z " fill="#3D3746" transform="translate(80,161)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9986" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9B87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9C88" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L1,7 L-1,6 L-1,1 Z " fill="#2D9A87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,5 Z " fill="#2C9C88" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(128,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.222772;0.232673" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame19" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L152,84 L-33,83 L-24,56 L-6,6 L-1,1 Z " fill="#616B76" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L0,51 L-11,82 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#454D58" transform="translate(54,59)"/>
+<path d="M0,0 L20,0 L20,2 L15,5 L13,9 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L11,0 L16,5 L18,8 L18,16 L14,22 L10,24 L0,24 L-7,18 L-8,9 L-5,4 Z " fill="#F0BC39" transform="translate(77,158)"/>
+<path d="M0,0 L8,0 L13,5 L12,12 L9,15 L7,16 L0,16 L-4,12 L-4,4 Z " fill="#3C3647" transform="translate(78,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9986" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,4 L4,7 L-1,6 L-1,1 Z " fill="#2D9C88" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F8A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F8A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.232673;0.247525" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame20" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-5,3 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L19,3 L17,3 L14,12 L-5,66 L-11,82 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L21,0 L15,7 L15,46 L17,50 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L8,2 L13,9 L13,17 L9,23 L6,25 L0,26 L-7,23 L-11,19 L-12,17 L-12,9 L-8,3 Z " fill="#F1BD39" transform="translate(82,157)"/>
+<path d="M0,0 L7,0 L11,4 L12,10 L10,14 L6,16 L-1,15 L-4,12 L-5,6 L-2,1 Z " fill="#3B3547" transform="translate(79,162)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2E9D88" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2EA08A" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2DA38C" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2EA08A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2EA08A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2EA28B" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2EA08A" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2DA28B" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2DA18B" transform="translate(200,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2DA18B" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L0,6 Z " fill="#2CA28C" transform="translate(217,158)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA28C" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2DA38B" transform="translate(182,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.247525;0.257426" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame21" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393445" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-10,80 L-12,83 L-29,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L11,0 L17,1 L12,5 L10,9 L10,46 L13,51 L19,54 L19,55 L-4,55 L-10,51 L-12,47 L-12,7 L-9,6 L-7,2 Z " fill="#231E2C" transform="translate(30,142)"/>
+<path d="M0,0 L9,2 L14,9 L14,17 L10,23 L3,26 L-6,24 L-11,19 L-12,11 L-10,6 L-4,1 Z " fill="#EEBA39" transform="translate(81,157)"/>
+<path d="M0,0 L8,0 L13,5 L12,12 L7,16 L1,16 L-4,12 L-4,4 Z " fill="#3B3546" transform="translate(78,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9A86" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9E89" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L0,6 Z " fill="#2CA18B" transform="translate(199,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.257426;0.272277" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame22" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L154,84 L-32,83 L-30,73 L-26,62 L-21,49 L-14,29 L-7,10 L-4,3 Z " fill="#616B76" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L9,27 L5,38 L0,52 L-5,66 L-10,80 L-11,83 L-25,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#454D58" transform="translate(54,59)"/>
+<path d="M0,0 L13,0 L18,1 L13,5 L11,9 L11,46 L14,51 L20,54 L20,55 L-3,55 L-9,51 L-11,47 L-11,7 L-8,6 L-6,2 Z " fill="#231E2C" transform="translate(29,142)"/>
+<path d="M0,0 L12,0 L17,3 L20,9 L19,18 L14,23 L12,24 L0,24 L-6,19 L-7,17 L-7,7 L-2,1 Z " fill="#F6BF38" transform="translate(75,158)"/>
+<path d="M0,0 L6,1 L11,6 L10,13 L6,17 L-3,17 L-8,12 L-8,5 L-4,1 Z " fill="#3C3647" transform="translate(80,161)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2C9F89" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2C9F89" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,4 Z " fill="#2C9F89" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,176)"/>
+<path d="M0,0 L5,1 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2C9F89" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA18B" transform="translate(200,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.272277;0.282178" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame23" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L11,21 L-4,63 L-11,82 L175,83 L175,84 L-28,85 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L20,0 L14,7 L14,47 L19,52 L21,54 L0,54 L-6,50 L-8,46 L-8,6 L-4,2 Z " fill="#231E2C" transform="translate(26,143)"/>
+<path d="M0,0 L15,0 L20,3 L23,8 L23,15 L20,21 L15,24 L0,24 L-5,20 L-7,17 L-7,7 L-3,2 Z " fill="#F2BC38" transform="translate(72,158)"/>
+<path d="M0,0 L13,0 L18,5 L18,11 L13,16 L1,16 L-4,11 L-4,5 Z " fill="#3D3746" transform="translate(73,162)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2C9F8A" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08B" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2CA28C" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,158)"/>
+<path d="M0,0 L6,0 L6,6 L0,6 Z " fill="#2CA08A" transform="translate(199,158)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA08B" transform="translate(200,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA18B" transform="translate(182,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.282178;0.297030" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame24" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-33,83 L-31,74 L-9,12 L-5,4 Z " fill="#636C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L16,7 L0,52 L-11,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L21,0 L15,7 L15,46 L17,50 L23,53 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L10,0 L17,2 L22,9 L22,17 L18,23 L10,26 L0,26 L-7,23 L-11,18 L-11,8 L-6,2 Z " fill="#EEB938" transform="translate(73,157)"/>
+<path d="M0,0 L16,0 L20,4 L21,9 L18,14 L15,16 L1,16 L-4,11 L-4,5 Z " fill="#3A3447" transform="translate(70,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2F9A85" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2F9A85" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2E9C87" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2D9F89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2DA08A" transform="translate(200,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.297030;0.306931" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame25" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383445" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L153,84 L-33,83 L-25,59 L-6,6 L-1,1 Z " fill="#616C77" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L-1,54 L-11,82 L-12,83 L-27,84 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L20,0 L14,7 L14,46 L16,50 L22,53 L22,54 L0,54 L-6,50 L-8,46 L-8,6 L-3,1 Z " fill="#231E2C" transform="translate(26,143)"/>
+<path d="M0,0 L21,0 L28,6 L29,8 L29,15 L26,20 L21,24 L0,24 L-7,18 L-8,16 L-8,8 L-5,3 Z " fill="#3E3745" transform="translate(66,158)"/>
+<path d="M0,0 L21,0 L28,6 L29,8 L29,15 L26,20 L21,24 L0,24 L-7,18 L-8,16 L-8,8 L-5,3 Z M4,3 L-2,6 L-4,9 L-3,16 L1,20 L19,20 L23,18 L25,14 L24,7 L20,4 L17,3 Z " fill="#F7C038" transform="translate(66,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2C9D88" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+<path d="M0,0 L6,0 L6,6 L0,6 Z " fill="#2C9F89" transform="translate(199,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA08A" transform="translate(182,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.306931;0.321782" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame26" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-24,54 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-9,77 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L25,0 L32,6 L33,8 L33,15 L30,20 L25,24 L0,24 L-7,18 L-8,16 L-8,8 L-5,3 Z " fill="#3F3745" transform="translate(62,158)"/>
+<path d="M0,0 L25,0 L32,6 L33,8 L33,15 L30,20 L25,24 L0,24 L-7,18 L-8,16 L-8,8 L-5,3 Z M4,3 L-2,6 L-4,9 L-3,16 L1,20 L24,20 L28,16 L29,9 L24,4 L21,3 Z " fill="#F6BF38" transform="translate(62,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9A87" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(200,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.321782;0.331683" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame27" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-2,1 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L16,7 L-3,60 L-11,82 L-12,83 L-27,84 L-32,87 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L22,0 L16,7 L16,46 L18,50 L24,53 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-1,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L25,0 L32,4 L35,9 L35,17 L32,22 L25,26 L0,26 L-7,22 L-10,17 L-10,8 L-5,2 Z " fill="#3B3546" transform="translate(60,157)"/>
+<path d="M0,0 L25,0 L32,4 L35,9 L35,17 L32,22 L25,26 L0,26 L-7,22 L-10,17 L-10,8 L-5,2 Z M-1,5 L-6,10 L-6,16 L-1,21 L26,21 L31,16 L31,10 L26,5 Z " fill="#E8B439" transform="translate(60,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9986" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.331683;0.346535" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame28" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-24,54 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-9,77 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L16,46 L21,52 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-1,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L30,0 L37,4 L40,9 L40,16 L37,22 L30,26 L0,26 L-6,22 L-9,18 L-9,8 L-4,2 Z " fill="#3A3446" transform="translate(55,157)"/>
+<path d="M0,0 L30,0 L37,4 L40,9 L40,16 L37,22 L30,26 L0,26 L-6,22 L-9,18 L-9,8 L-4,2 Z M-1,5 L-5,9 L-5,16 L0,21 L31,21 L35,17 L36,10 L31,5 Z " fill="#E6B339" transform="translate(55,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.346535;0.356436" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame29" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L11,21 L-4,63 L-11,82 L-12,83 L-25,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L34,0 L41,4 L44,9 L44,16 L41,22 L34,26 L0,26 L-8,21 L-10,17 L-10,9 L-6,3 Z " fill="#3A3446" transform="translate(51,157)"/>
+<path d="M0,0 L13,0 L18,1 L13,5 L11,9 L11,46 L14,51 L20,54 L20,55 L-3,55 L-9,51 L-11,47 L-11,7 L-8,6 L-6,2 Z " fill="#231E2C" transform="translate(29,142)"/>
+<path d="M0,0 L34,0 L41,4 L44,9 L44,16 L41,22 L34,26 L0,26 L-8,21 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L34,21 L39,17 L40,10 L35,5 Z " fill="#E5B33A" transform="translate(51,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9885" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2C9C88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.356436;0.371287" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame30" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L153,84 L-33,83 L-26,62 L-7,9 L-3,2 Z " fill="#626C77" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L-3,60 L-11,82 L-12,83 L-27,84 L-33,86 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L38,0 L44,4 L47,7 L48,10 L48,17 L45,22 L38,26 L0,26 L-6,22 L-10,17 L-10,9 L-6,3 Z " fill="#3B3445" transform="translate(47,157)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L12,22 L11,24 L11,32 L12,34 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-6,3 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L38,0 L44,4 L47,7 L48,10 L48,17 L45,22 L38,26 L0,26 L-6,22 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L38,21 L44,16 L44,10 L39,5 Z " fill="#E5B239" transform="translate(47,157)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA08A" transform="translate(182,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.371287;0.381188" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame31" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-10,80 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L34,0 L41,4 L44,9 L44,17 L40,23 L34,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z " fill="#3B3446" transform="translate(47,157)"/>
+<path d="M0,0 L22,0 L17,4 L15,8 L14,21 L13,23 L13,31 L14,33 L15,45 L18,50 L24,53 L24,54 L1,54 L-5,50 L-7,46 L-7,6 L-4,5 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L34,0 L41,4 L44,9 L44,17 L40,23 L34,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-5,17 L-1,21 L34,21 L40,16 L40,10 L35,5 Z " fill="#E4B239" transform="translate(47,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9885" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9C87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.381188;0.396040" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame32" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-10,80 L-12,83 L-27,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L30,0 L35,3 L39,7 L40,16 L36,22 L30,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z " fill="#3B3445" transform="translate(47,157)"/>
+<path d="M0,0 L15,0 L20,1 L15,5 L13,9 L12,22 L11,24 L11,32 L12,34 L13,46 L16,51 L22,54 L22,55 L-1,55 L-7,51 L-9,47 L-9,7 L-6,6 L-4,2 Z " fill="#231E2C" transform="translate(27,142)"/>
+<path d="M0,0 L30,0 L35,3 L39,7 L40,16 L36,22 L30,26 L0,26 L-5,23 L-10,17 L-10,9 L-6,3 Z M-1,5 L-6,10 L-6,16 L-1,21 L31,21 L35,17 L35,9 L31,5 Z " fill="#E3B239" transform="translate(47,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.396040;0.405941" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame33" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393445" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-27,62 L-12,20 L-7,6 L-2,1 Z " fill="#626B76" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L12,17 L-3,60 L-11,82 L-12,83 L-26,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L14,0 L19,1 L14,5 L12,9 L11,22 L10,24 L10,32 L11,34 L12,46 L15,51 L21,54 L21,55 L-2,55 L-8,51 L-10,47 L-10,7 L-7,6 L-5,2 Z " fill="#231E2C" transform="translate(28,142)"/>
+<path d="M0,0 L30,0 L36,4 L38,8 L38,17 L34,22 L27,25 L3,25 L-2,22 L-7,16 L-7,8 L-4,3 Z " fill="#3B3545" transform="translate(44,158)"/>
+<path d="M0,0 L30,0 L36,4 L38,8 L38,17 L34,22 L27,25 L3,25 L-2,22 L-7,16 L-7,8 L-4,3 Z M2,4 L-3,9 L-3,15 L2,20 L29,20 L34,15 L34,9 L29,4 Z " fill="#ECB739" transform="translate(44,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9A86" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2C9B87" transform="translate(164,158)"/>
+<path d="M0,0 L5,2 L4,7 L0,8 L-2,6 L-1,1 Z " fill="#2D9A86" transform="translate(129,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9D89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08B" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.405941;0.420792" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame34" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-5,66 L-11,82 L-12,83 L-26,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#434C57" transform="translate(54,59)"/>
+<path d="M0,0 L14,0 L19,1 L14,5 L12,9 L11,22 L10,24 L10,32 L11,34 L12,46 L15,51 L21,54 L21,55 L-2,55 L-8,51 L-10,47 L-10,7 L-7,6 L-5,2 Z " fill="#231E2C" transform="translate(28,142)"/>
+<path d="M0,0 L26,0 L33,6 L34,8 L34,15 L31,20 L26,24 L0,24 L-7,16 L-7,8 L-4,3 Z " fill="#3E3746" transform="translate(44,158)"/>
+<path d="M0,0 L26,0 L33,6 L34,8 L34,15 L31,20 L26,24 L0,24 L-7,16 L-7,8 L-4,3 Z M5,3 L-1,6 L-3,10 L-2,16 L2,20 L25,20 L29,16 L30,9 L25,4 L22,3 Z " fill="#F5BF38" transform="translate(44,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9785" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9785" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9B88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9C89" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18C" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA18C" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA18C" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA18C" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18C" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18C" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.420792;0.430693" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame35" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L126,0 L132,5 L138,21 L160,84 L159,87 L154,84 L-33,83 L-26,62 L-17,38 L-10,17 L-5,5 Z " fill="#616B76" transform="translate(75,59)"/>
+<path d="M0,0 L21,0 L16,6 L6,34 L-3,60 L-11,82 L-12,83 L-27,84 L-32,86 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#434D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L15,21 L14,23 L14,31 L15,33 L16,46 L21,52 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-2,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L15,0 L23,4 L26,9 L26,17 L22,23 L15,26 L0,26 L-5,24 L-11,17 L-11,9 L-8,4 L-4,1 Z " fill="#3C3545" transform="translate(48,157)"/>
+<path d="M0,0 L15,0 L23,4 L26,9 L26,17 L22,23 L15,26 L0,26 L-5,24 L-11,17 L-11,9 L-8,4 L-4,1 Z M-2,5 L-7,10 L-6,17 L-2,21 L17,21 L21,17 L22,10 L17,5 Z " fill="#EAB638" transform="translate(48,157)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L2,7 L-1,6 L-1,1 Z " fill="#2C9E89" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,4 L4,7 L-1,6 L-1,1 Z " fill="#2C9D88" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,2 Z " fill="#2C9E89" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,2 Z " fill="#2CA18B" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.430693;0.445545" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame36" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393445" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-10,80 L-12,83 L-25,84 L-32,87 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L13,0 L18,1 L13,5 L11,9 L10,22 L9,24 L9,32 L12,49 L17,53 L20,55 L-3,55 L-9,51 L-11,47 L-11,7 L-8,6 L-6,2 Z " fill="#231E2C" transform="translate(29,142)"/>
+<path d="M0,0 L12,0 L18,3 L22,8 L22,18 L18,23 L12,26 L0,26 L-5,24 L-11,17 L-11,9 L-7,3 Z " fill="#EAB639" transform="translate(48,157)"/>
+<path d="M0,0 L16,0 L20,4 L20,11 L17,15 L14,16 L0,16 L-4,12 L-5,7 L-2,1 Z " fill="#3B3545" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2CA18B" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2CA28B" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA28B" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA28B" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,4 L5,6 L0,6 L-1,1 Z " fill="#2CA18B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,2 Z " fill="#2CA18B" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,2 Z " fill="#2CA18B" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,6 L-1,1 Z " fill="#2CA28B" transform="translate(182,176)"/>
+<path d="M0,0 L5,1 L5,6 L-1,6 L-1,1 Z " fill="#2CA28B" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,6 L-1,1 Z " fill="#2CA28B" transform="translate(146,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.445545;0.455446" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame37" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393346" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L152,84 L-34,83 L-27,62 L-12,20 L-7,6 L-2,1 Z " fill="#616B76" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L12,17 L-3,60 L-11,82 L174,83 L174,84 L-29,85 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L22,0 L17,4 L15,8 L14,21 L13,23 L13,31 L15,46 L20,52 L23,54 L1,54 L-5,50 L-7,46 L-7,6 L-4,5 L-2,1 Z " fill="#231E2C" transform="translate(25,143)"/>
+<path d="M0,0 L14,0 L19,3 L22,8 L22,15 L19,21 L14,24 L0,24 L-7,18 L-8,16 L-8,8 L-5,3 Z " fill="#403946" transform="translate(45,158)"/>
+<path d="M0,0 L14,0 L19,3 L22,8 L22,15 L19,21 L14,24 L0,24 L-7,18 L-8,16 L-8,8 L-5,3 Z M4,3 L-2,6 L-4,9 L-3,16 L1,20 L13,20 L18,15 L18,9 L14,4 Z " fill="#F7BF38" transform="translate(45,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2D9885" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L3,7 L-1,6 L-1,1 Z " fill="#2D9A86" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L3,7 L-1,6 L-1,1 Z " fill="#2C9A86" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9A86" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9C87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9A86" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2C9B87" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(200,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E89" transform="translate(110,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.455446;0.470297" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame38" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L10,23 L-10,80 L-12,83 L-27,84 L-33,86 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L15,21 L14,23 L14,31 L17,48 L22,52 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-3,2 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L13,0 L19,5 L21,9 L21,15 L17,21 L13,24 L0,24 L-7,16 L-7,8 L-3,2 Z " fill="#EFBA38" transform="translate(44,158)"/>
+<path d="M0,0 L10,0 L14,4 L14,12 L11,15 L8,16 L0,16 L-4,12 L-5,5 Z " fill="#3D3645" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2F9886" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9987" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2E9B88" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L1,7 L0,6 Z " fill="#2D9C88" transform="translate(217,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9C88" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F8A" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08B" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E8A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E8A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08B" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9E8A" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA08B" transform="translate(200,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.470297;0.480198" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame39" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#393446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-22,49 L-7,7 L-4,2 Z " fill="#626C77" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L11,21 L-4,63 L-11,82 L-12,83 L-27,84 L-32,86 L-33,89 L-35,88 L-16,34 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L15,21 L14,23 L14,31 L15,33 L16,45 L19,50 L25,53 L25,54 L2,54 L-4,50 L-6,46 L-6,6 L-3,5 L-2,1 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L10,0 L16,5 L18,9 L17,18 L10,24 L0,24 L-7,18 L-8,16 L-8,8 L-4,2 Z " fill="#F2BC38" transform="translate(45,158)"/>
+<path d="M0,0 L8,0 L12,4 L12,12 L8,16 L0,16 L-5,11 L-5,5 Z " fill="#3F3745" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9885" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L-1,6 L-1,1 Z " fill="#2E9985" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(200,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L1,7 L0,6 Z " fill="#2D9C87" transform="translate(217,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9C87" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2D9D88" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2CA08A" transform="translate(110,158)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.480198;0.495050" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame40" opacity="0">
+
+<path d="M0,0 L147,0 L153,5 L159,21 L181,84 L184,92 L184,130 L181,135 L175,138 L-28,138 L-34,134 L-36,130 L-36,90 L-23,54 L-6,7 L-3,2 Z " fill="#383446" transform="translate(54,59)"/>
+<path d="M0,0 L125,0 L131,5 L137,21 L159,84 L158,87 L153,84 L-34,83 L-31,74 L-24,53 L-20,43 L-13,23 L-7,7 L-4,2 Z " fill="#616B76" transform="translate(76,59)"/>
+<path d="M0,0 L22,0 L17,5 L13,15 L7,32 L3,43 L-3,60 L-8,74 L-12,83 L-27,84 L-33,86 L-34,88 L-32,79 L-17,37 L-6,7 L-3,2 Z " fill="#444D58" transform="translate(54,59)"/>
+<path d="M0,0 L23,0 L18,4 L16,8 L15,21 L14,23 L14,31 L15,33 L16,46 L18,51 L24,53 L24,54 L2,54 L-4,50 L-6,46 L-6,6 L-5,4 L-3,4 L-3,2 Z " fill="#231E2C" transform="translate(24,143)"/>
+<path d="M0,0 L10,0 L15,3 L18,8 L18,16 L15,21 L10,24 L0,24 L-7,16 L-7,8 L-3,2 Z " fill="#F3BD38" transform="translate(44,158)"/>
+<path d="M0,0 L7,0 L12,5 L12,11 L7,16 L0,16 L-4,12 L-5,5 Z " fill="#3F3846" transform="translate(46,162)"/>
+<path d="M0,0 L5,0 L6,5 L3,7 L-1,6 L-1,1 Z " fill="#2D9A87" transform="translate(164,158)"/>
+<path d="M0,0 L5,0 L6,4 L3,7 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(182,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(146,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2C9B87" transform="translate(128,158)"/>
+<path d="M0,0 L5,0 L6,5 L4,7 L0,6 L-1,1 Z " fill="#2D9B87" transform="translate(110,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L-1,6 L-1,1 Z " fill="#2D9B87" transform="translate(182,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L1,7 L0,6 Z " fill="#2D9C87" transform="translate(217,158)"/>
+<path d="M0,0 L5,0 L5,6 L0,7 L-1,6 L-1,1 Z " fill="#2D9C87" transform="translate(200,158)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9D88" transform="translate(164,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(146,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(128,176)"/>
+<path d="M0,0 L5,0 L6,5 L5,6 L0,6 L-1,1 Z " fill="#2C9F89" transform="translate(110,176)"/>
+<path d="M0,0 L5,0 L6,1 L6,6 L0,6 Z " fill="#2CA08A" transform="translate(217,176)"/>
+<path d="M0,0 L5,0 L5,6 L-1,6 L-1,1 Z " fill="#2CA08A" transform="translate(200,176)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.495050;1.000000" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+</g>
+</svg>

svgAsset/server_network_animation.svg

@@ -0,0 +1,61 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 362 356" width="362" height="356" role="img" aria-label="Animated server network icon">
+<style>
+  .dark{fill:#17132f}.panel{fill:#2b2440;stroke:#17132f;stroke-width:5}.led{fill:#31aa98}
+  .port{fill:none;stroke:#ffc52e;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
+  .wire{fill:none;stroke:#17132f;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
+  .blink1{animation:b1 4.5s steps(1,end) infinite}.blink2{animation:b2 4.5s steps(1,end) infinite}.blink3{animation:b3 4.5s steps(1,end) infinite}
+  .ports{animation:portMorph 4.5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
+  .hub{animation:hubPulse 4.5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
+  .packet{fill:#31aa98;filter:drop-shadow(0 0 2px rgba(49,170,152,.65))}
+  @keyframes b1{0%,18%,42%,68%,100%{opacity:1}19%,41%,69%,84%{opacity:.22}85%,99%{opacity:1}}
+  @keyframes b2{0%,28%,58%,88%,100%{opacity:.28}29%,57%,89%,99%{opacity:1}}
+  @keyframes b3{0%,12%,48%,76%,100%{opacity:1}13%,47%,77%,92%{opacity:.2}93%,99%{opacity:1}}
+  @keyframes portMorph{0%,18%,82%,100%{transform:scaleX(.62)}42%,62%{transform:scaleX(1.18)}}
+  @keyframes hubPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.13)}}
+</style>
+<!-- server chassis -->
+<rect class="panel" x="49" y="68" width="270" height="68" rx="15"/>
+<rect class="panel" x="49" y="135" width="270" height="68" rx="15"/>
+<!-- left separators/shading -->
+<path d="M67 72v59M67 140v58" stroke="#241d38" stroke-width="6" opacity=".65"/>
+<!-- animated yellow ports -->
+<g class="ports"><rect class="port" x="81" y="92" width="47" height="25" rx="13"/></g>
+<g class="ports"><rect class="port" x="81" y="158" width="47" height="25" rx="13"/></g>
+<!-- LEDs top -->
+<g>
+ <circle class="led blink1" cx="178" cy="95" r="6.5"/><circle class="led blink2" cx="197" cy="95" r="6.5"/><circle class="led blink3" cx="216" cy="95" r="6.5"/><circle class="led blink1" cx="236" cy="95" r="6.5"/><circle class="led blink2" cx="256" cy="95" r="6.5"/><circle class="led blink3" cx="276" cy="95" r="6.5"/><circle class="led blink1" cx="295" cy="95" r="6.5"/>
+ <circle class="led blink3" cx="178" cy="115" r="6.5"/><circle class="led blink1" cx="197" cy="115" r="6.5"/><circle class="led blink2" cx="216" cy="115" r="6.5"/><circle class="led blink3" cx="236" cy="115" r="6.5"/><circle class="led blink1" cx="256" cy="115" r="6.5"/><circle class="led blink2" cx="276" cy="115" r="6.5"/><circle class="led blink3" cx="295" cy="115" r="6.5"/>
+</g>
+<!-- LEDs bottom -->
+<g>
+ <circle class="led blink2" cx="178" cy="162" r="6.5"/><circle class="led blink3" cx="197" cy="162" r="6.5"/><circle class="led blink1" cx="216" cy="162" r="6.5"/><circle class="led blink2" cx="236" cy="162" r="6.5"/><circle class="led blink3" cx="256" cy="162" r="6.5"/><circle class="led blink1" cx="276" cy="162" r="6.5"/>
+ <circle class="led blink1" cx="178" cy="181" r="6.5"/><circle class="led blink2" cx="197" cy="181" r="6.5"/><circle class="led blink3" cx="216" cy="181" r="6.5"/><circle class="led blink1" cx="236" cy="181" r="6.5"/><circle class="led blink2" cx="256" cy="181" r="6.5"/><circle class="led blink3" cx="276" cy="181" r="6.5"/>
+</g>
+<!-- center hub -->
+<path class="dark" d="M163 202h42c0 13-8 21-21 21s-21-8-21-21z"/>
+<path class="wire" d="M184 222v31M184 253c0 10-6 14-17 14M184 253c0 10 6 14 17 14"/>
+<!-- horizontal network -->
+<path class="wire" d="M55 267H307"/>
+<path class="dark" d="M43 249h8c10 0 17 8 17 17s-7 18-17 18h-8zM325 249h-8c-10 0-17 8-17 17s7 18 17 18h8z"/>
+<!-- connection/data indicators: packets originate on the lower branches, converge at the hub, then travel upward into the servers -->
+<g>
+  <circle class="packet" r="7">
+    <animateMotion dur="3.8s" begin="0s" repeatCount="indefinite" path="M66 267 H184 V181"/>
+    <animate attributeName="opacity" values="0;1;1;1;0" keyTimes="0;.05;.78;.96;1" dur="3.8s" begin="0s" repeatCount="indefinite"/>
+  </circle>
+  <circle class="packet" r="7">
+    <animateMotion dur="3.8s" begin="1.25s" repeatCount="indefinite" path="M302 267 H184 V162"/>
+    <animate attributeName="opacity" values="0;1;1;1;0" keyTimes="0;.05;.78;.96;1" dur="3.8s" begin="1.25s" repeatCount="indefinite"/>
+  </circle>
+  <circle class="packet" r="6.5">
+    <animateMotion dur="3.8s" begin="2.5s" repeatCount="indefinite" path="M120 267 H184 V115"/>
+    <animate attributeName="opacity" values="0;1;1;1;0" keyTimes="0;.05;.78;.96;1" dur="3.8s" begin="2.5s" repeatCount="indefinite"/>
+  </circle>
+  <circle class="packet" r="6.5">
+    <animateMotion dur="3.8s" begin="3.15s" repeatCount="indefinite" path="M250 267 H184 V95"/>
+    <animate attributeName="opacity" values="0;1;1;1;0" keyTimes="0;.05;.78;.96;1" dur="3.8s" begin="3.15s" repeatCount="indefinite"/>
+  </circle>
+</g>
+<!-- small hub activity indicator -->
+<g class="hub"><circle class="led" cx="184" cy="267" r="8"/></g>
+</svg>

svgAsset/system-solid-369-code-hover-pinch.svg

@@ -0,0 +1,252 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><title>Generated Animation</title>
+<desc>41 frames, 2.020s duration</desc>
+<g id="animationGroup">
+<g id="frame0" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,32 L87,36 L67,110 L57,147 L57,155 L62,160 L69,159 L72,156 L84,112 L102,45 L102,36 L97,32 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L49,131 L49,125 L42,117 L22,97 L24,93 L47,70 L49,67 L49,61 L44,56 Z M118,56 L113,61 L113,67 L120,75 L140,95 L138,99 L114,123 L113,125 L113,131 L118,136 L124,136 L132,129 L159,102 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.000000;0.009901" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame1" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M93,32 L88,35 L85,43 L57,148 L57,155 L61,159 L66,160 L71,157 L74,150 L101,49 L102,45 L102,37 L98,33 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L48,132 L49,126 L47,122 L42,118 L38,113 L32,108 L25,100 L21,98 L24,93 L47,70 L49,66 L48,60 L44,56 Z M118,56 L114,60 L113,66 L117,72 L140,95 L138,99 L115,122 L113,126 L114,132 L118,136 L124,136 L132,129 L160,101 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.009901;0.024752" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame2" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M91,34 L86,39 L57,148 L58,155 L62,158 L68,158 L73,153 L93,79 L102,45 L102,39 L98,34 Z M37,56 L29,63 L1,91 L0,99 L9,109 L35,135 L37,136 L43,136 L48,131 L48,125 L41,117 L21,97 L23,93 L47,69 L48,67 L48,61 L43,56 Z M119,56 L114,61 L114,67 L121,75 L141,95 L139,99 L115,123 L114,125 L114,131 L119,136 L125,136 L133,129 L160,102 L162,98 L161,91 L127,57 L125,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.024752;0.034653" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame3" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,36 L87,39 L84,47 L59,140 L58,144 L58,151 L63,156 L70,155 L73,152 L83,116 L102,45 L100,39 L96,36 Z M36,56 L28,63 L0,91 L-1,93 L-1,99 L6,107 L34,135 L36,136 L42,136 L46,132 L47,126 L44,121 L20,97 L22,93 L45,70 L47,66 L46,59 L42,56 Z M120,56 L116,59 L115,66 L119,72 L142,95 L140,99 L116,123 L115,130 L118,135 L120,136 L126,136 L134,129 L162,101 L163,99 L163,93 L156,85 L128,57 L126,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.034653;0.049505" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame4" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,39 L87,42 L85,44 L62,129 L59,140 L59,149 L64,153 L71,152 L74,149 L96,68 L101,50 L100,43 L97,40 Z M34,56 L24,65 L-1,90 L-3,94 L-2,100 L5,108 L31,134 L34,136 L40,136 L45,131 L45,125 L38,117 L18,97 L20,93 L44,69 L45,67 L45,61 L40,56 Z M122,56 L117,61 L117,67 L124,75 L144,95 L142,99 L118,123 L117,125 L117,131 L122,136 L128,136 L138,127 L163,102 L165,97 L164,92 L163,90 L161,90 L159,86 L131,58 L128,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.049505;0.059406" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame5" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M33,56 L25,63 L-4,92 L-4,100 L31,135 L38,136 L43,132 L43,124 L16,97 L18,93 L27,85 L34,77 L41,71 L43,68 L43,60 L38,56 Z M124,56 L119,60 L118,65 L122,72 L129,78 L136,86 L146,96 L141,101 L130,113 L119,124 L118,129 L121,134 L123,136 L129,136 L137,129 L166,100 L166,93 L159,85 L131,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.059406;0.074257" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame6" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M31,56 L23,63 L-5,91 L-6,93 L-6,99 L1,107 L29,135 L31,136 L37,136 L41,132 L42,126 L39,121 L15,97 L17,93 L40,70 L42,66 L41,59 L37,56 Z M125,56 L121,60 L120,67 L127,75 L147,95 L145,99 L122,122 L120,126 L121,133 L125,136 L131,136 L139,129 L167,101 L168,99 L168,93 L161,85 L133,57 L131,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.074257;0.084158" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame7" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M88,49 L83,53 L65,118 L61,132 L61,139 L66,144 L73,143 L77,139 L94,76 L99,58 L97,52 L93,49 Z M30,56 L22,63 L-7,92 L-7,100 L28,135 L30,136 L36,136 L40,132 L41,127 L38,122 L13,97 L15,93 L27,82 L34,74 L39,69 L41,63 L38,58 L35,56 Z M127,56 L122,60 L121,66 L126,73 L131,77 L138,85 L149,96 L144,101 L133,113 L128,118 L123,123 L121,127 L122,132 L126,136 L132,136 L140,129 L169,100 L169,93 L162,85 L134,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.084158;0.099010" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame8" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M88,51 L83,55 L77,74 L62,129 L62,138 L67,142 L74,141 L77,138 L98,62 L98,56 L94,52 Z M29,56 L21,63 L-8,92 L-8,100 L27,135 L34,136 L39,132 L39,124 L12,97 L14,93 L34,73 L39,68 L39,60 L34,56 Z M128,56 L123,60 L122,65 L126,72 L134,79 L141,87 L150,96 L144,103 L123,124 L122,129 L125,134 L128,136 L135,135 L170,100 L170,92 L135,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.099010;0.108911" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame9" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M87,53 L82,57 L62,129 L62,135 L66,140 L70,141 L75,139 L78,135 L95,73 L98,62 L97,57 L93,53 Z M28,56 L20,63 L-8,91 L-9,93 L-9,99 L-2,107 L26,135 L28,136 L34,136 L38,132 L39,126 L37,122 L29,115 L20,106 L14,99 L11,96 L28,79 L33,74 L38,68 L39,62 L37,58 L34,56 Z M128,56 L123,62 L124,68 L131,76 L150,95 L150,98 L142,105 L137,111 L129,118 L123,126 L124,132 L128,136 L134,136 L142,129 L170,101 L171,99 L171,93 L164,85 L136,57 L134,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.108911;0.123762" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame10" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M27,56 L19,63 L-9,91 L-10,98 L-6,104 L25,135 L27,136 L33,136 L38,131 L38,125 L31,117 L11,97 L13,93 L37,69 L38,67 L38,61 L33,56 Z M129,56 L124,61 L124,67 L131,75 L151,95 L149,99 L125,123 L124,125 L124,131 L129,136 L135,136 L143,129 L170,102 L172,98 L171,92 L162,82 L157,77 L150,70 L145,66 L138,58 L135,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.123762;0.133663" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame11" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M27,56 L19,63 L-9,91 L-10,93 L-10,99 L-3,107 L25,135 L27,136 L33,136 L37,132 L38,126 L36,122 L28,115 L20,107 L13,99 L11,98 L12,94 L27,79 L32,74 L37,68 L38,62 L36,58 L33,56 Z M129,56 L124,62 L125,68 L132,76 L151,95 L151,98 L143,105 L138,110 L138,112 L134,114 L127,121 L124,126 L125,132 L129,136 L135,136 L143,129 L171,101 L172,99 L172,93 L165,85 L137,57 L135,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.133663;0.148515" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame12" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M87,55 L82,59 L77,75 L63,125 L63,134 L68,138 L74,138 L78,134 L97,67 L97,60 L93,56 Z M27,56 L19,63 L-10,92 L-11,97 L-7,104 L-2,108 L2,113 L10,120 L15,125 L23,134 L27,136 L34,135 L37,132 L37,124 L10,97 L12,93 L37,68 L37,60 L32,56 Z M130,56 L125,60 L125,68 L130,73 L137,80 L143,87 L148,91 L151,95 L153,95 L146,103 L125,124 L125,132 L130,136 L137,135 L142,130 L150,123 L157,115 L163,110 L167,105 L172,100 L172,92 L137,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.148515;0.158416" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame13" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M26,56 L18,63 L13,69 L5,76 L0,81 L-10,92 L-11,97 L-7,104 L15,126 L19,130 L21,130 L23,134 L26,136 L32,136 L37,131 L37,124 L10,97 L12,93 L36,69 L37,67 L37,60 L32,56 Z M88,55 L83,58 L80,64 L63,125 L63,133 L68,138 L75,137 L78,134 L97,67 L97,60 L93,56 Z M130,56 L125,61 L125,68 L152,95 L150,99 L126,123 L125,125 L125,132 L130,136 L136,136 L141,132 L141,130 L144,129 L149,124 L170,103 L173,97 L171,91 L137,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.158416;0.173267" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame14" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M27,56 L23,58 L16,66 L5,76 L0,81 L-10,92 L-11,97 L-7,104 L14,125 L20,130 L25,135 L26,136 L32,136 L37,131 L37,124 L10,97 L12,93 L36,69 L37,67 L37,60 L32,56 Z M88,55 L83,58 L80,64 L64,122 L63,125 L63,133 L68,138 L75,137 L78,134 L97,67 L97,60 L93,56 Z M130,56 L125,61 L125,68 L152,95 L150,99 L126,123 L125,125 L125,132 L130,136 L136,136 L141,132 L146,126 L154,119 L170,103 L173,97 L171,91 L137,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.173267;0.183168" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame15" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M87,55 L82,59 L77,75 L63,125 L63,134 L68,138 L74,138 L78,134 L97,67 L97,60 L93,56 Z M27,56 L19,63 L-10,92 L-11,97 L-7,104 L-2,108 L2,113 L10,120 L15,125 L23,134 L27,136 L34,135 L37,132 L37,124 L10,97 L12,93 L37,68 L37,60 L32,56 Z M130,56 L125,60 L125,68 L130,73 L137,80 L143,87 L148,91 L151,95 L153,95 L146,103 L125,124 L125,132 L130,136 L137,135 L142,130 L150,123 L157,115 L163,110 L167,105 L172,100 L172,92 L137,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.183168;0.198020" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame16" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M87,55 L83,57 L79,68 L63,125 L63,134 L66,138 L74,138 L78,134 L97,67 L97,60 L92,55 Z M27,56 L19,63 L-10,92 L-10,99 L-3,107 L25,135 L27,136 L33,136 L37,132 L38,127 L36,122 L28,115 L19,106 L13,99 L9,95 L13,93 L18,88 L26,80 L31,74 L36,69 L38,63 L36,58 L33,56 Z M129,56 L125,60 L124,66 L128,72 L152,96 L147,101 L137,112 L129,119 L125,124 L124,130 L126,134 L129,136 L135,136 L143,129 L172,100 L172,93 L165,85 L137,57 L135,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.198020;0.207921" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame17" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M87,54 L82,58 L72,93 L63,125 L62,133 L65,138 L67,139 L73,139 L78,135 L94,77 L97,66 L97,59 L94,55 Z M27,56 L19,63 L-9,91 L-10,93 L-10,99 L-3,107 L25,135 L27,136 L33,136 L38,131 L38,125 L31,117 L11,97 L13,93 L36,70 L38,67 L38,61 L33,56 Z M129,56 L125,60 L124,67 L131,75 L151,95 L149,99 L126,122 L124,126 L125,133 L129,136 L135,136 L143,129 L171,101 L172,94 L168,88 L137,57 L135,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.207921;0.222772" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame18" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M88,53 L83,56 L78,71 L62,129 L62,135 L67,140 L73,140 L78,135 L92,84 L98,62 L96,56 L92,53 Z M28,56 L20,63 L-9,92 L-9,100 L-4,105 L3,113 L11,120 L16,125 L23,133 L28,136 L35,135 L38,132 L38,124 L11,97 L13,93 L38,68 L38,60 L33,56 Z M129,56 L124,60 L124,68 L129,73 L136,80 L142,87 L147,92 L150,95 L152,95 L145,103 L124,124 L124,132 L129,136 L136,135 L141,130 L148,124 L155,116 L161,111 L166,105 L171,100 L171,92 L136,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.222772;0.232673" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame19" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M87,52 L82,57 L62,129 L62,137 L66,141 L73,141 L77,138 L98,63 L98,57 L93,52 Z M28,56 L20,63 L-7,90 L-9,94 L-8,100 L-1,108 L26,135 L28,136 L34,136 L39,131 L39,125 L32,117 L12,97 L14,93 L38,69 L39,67 L39,61 L34,56 Z M128,56 L123,61 L123,67 L130,75 L150,95 L148,99 L124,123 L123,125 L123,131 L128,136 L134,136 L142,129 L169,102 L171,98 L170,92 L163,85 L158,80 L138,60 L134,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.232673;0.247525" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame20" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M88,50 L83,54 L76,78 L61,132 L62,139 L66,143 L72,143 L77,139 L85,109 L98,62 L98,54 L93,50 Z M29,56 L21,63 L-7,91 L-8,98 L-4,104 L27,135 L29,136 L35,136 L40,131 L40,125 L33,117 L13,97 L15,93 L39,69 L40,67 L40,61 L35,56 Z M127,56 L122,61 L122,67 L129,75 L149,95 L147,99 L123,123 L122,125 L122,131 L127,136 L133,136 L141,129 L168,102 L170,98 L169,92 L160,82 L155,77 L142,65 L135,57 L133,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.247525;0.257426" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame21" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M88,48 L83,53 L72,92 L61,132 L61,141 L65,145 L72,145 L76,141 L87,102 L99,58 L98,51 L94,48 Z M30,56 L20,65 L-5,90 L-7,94 L-6,100 L1,108 L27,134 L30,136 L36,136 L41,131 L41,125 L34,117 L14,97 L16,93 L40,69 L41,67 L41,61 L36,56 Z M126,56 L121,61 L121,68 L148,95 L146,99 L122,123 L121,125 L121,132 L126,136 L132,136 L142,127 L167,102 L169,98 L168,92 L132,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.257426;0.272277" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame22" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M90,45 L85,48 L82,56 L60,136 L60,142 L64,147 L68,148 L73,146 L76,142 L99,58 L99,50 L94,45 Z M32,56 L28,58 L21,66 L6,81 L2,84 L2,86 L0,86 L-5,92 L-6,97 L-2,104 L2,106 L4,110 L15,120 L19,125 L25,130 L30,135 L31,136 L37,136 L42,132 L42,124 L15,97 L17,93 L42,68 L42,60 L37,56 Z M125,56 L120,61 L120,68 L135,83 L140,88 L145,94 L147,95 L145,99 L121,123 L120,125 L120,132 L125,136 L132,135 L137,130 L146,122 L152,115 L159,109 L166,101 L168,96 L166,91 L132,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.272277;0.282178" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame23" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M89,43 L84,48 L60,136 L60,145 L63,149 L69,150 L74,147 L77,138 L100,54 L100,48 L95,43 Z M33,56 L25,63 L-4,92 L-4,100 L31,135 L38,136 L43,132 L43,124 L16,97 L18,93 L38,73 L43,68 L43,60 L38,56 Z M124,56 L119,60 L118,65 L122,72 L130,79 L137,87 L146,96 L140,103 L119,124 L118,129 L121,134 L124,136 L131,135 L166,100 L166,93 L159,85 L131,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.282178;0.297030" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame24" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M90,41 L85,45 L75,81 L59,140 L59,146 L63,151 L67,152 L72,150 L75,146 L95,72 L100,54 L100,45 L95,41 Z M34,56 L26,63 L-3,92 L-3,100 L2,105 L8,112 L16,119 L20,124 L28,131 L32,135 L39,136 L44,132 L44,124 L17,97 L19,93 L44,68 L44,60 L39,56 Z M123,56 L118,60 L118,68 L123,73 L137,88 L139,88 L141,92 L144,95 L146,95 L139,103 L118,124 L118,132 L123,136 L130,135 L135,130 L142,124 L149,116 L155,111 L160,105 L165,100 L165,92 L130,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.297030;0.306931" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame25" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,39 L87,42 L84,47 L65,118 L59,140 L59,149 L64,153 L71,152 L74,149 L96,68 L101,50 L100,43 L97,40 Z M34,56 L24,65 L19,70 L11,78 L6,83 L1,88 L1,90 L-1,90 L-3,94 L-2,100 L7,110 L31,134 L34,136 L40,136 L45,131 L45,125 L38,117 L18,97 L20,93 L44,69 L45,67 L45,61 L40,56 Z M122,56 L117,60 L117,67 L124,75 L144,95 L142,99 L117,124 L117,131 L122,136 L128,136 L138,127 L162,103 L165,97 L163,90 L161,90 L159,86 L152,80 L145,72 L139,67 L132,59 L128,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.306931;0.321782" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame26" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M91,38 L87,40 L83,51 L58,144 L59,150 L63,154 L69,154 L74,150 L91,86 L101,49 L101,43 L96,38 Z M35,56 L27,63 L-1,91 L-2,93 L-2,99 L5,107 L33,135 L35,136 L41,136 L46,131 L46,125 L39,117 L19,97 L21,93 L44,70 L46,67 L46,61 L41,56 Z M121,56 L116,61 L116,67 L123,75 L143,95 L141,99 L117,123 L116,125 L116,131 L121,136 L127,136 L135,129 L162,102 L164,99 L164,93 L157,85 L129,57 L127,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.321782;0.331683" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame27" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M91,37 L86,41 L79,65 L62,129 L58,143 L58,150 L62,155 L70,155 L74,150 L94,75 L101,49 L101,41 L96,37 Z M36,56 L28,63 L-1,92 L-1,100 L34,135 L41,136 L46,132 L46,124 L19,97 L21,93 L31,84 L38,76 L44,71 L46,68 L46,60 L41,56 Z M121,56 L116,60 L115,65 L119,72 L126,78 L133,86 L143,96 L138,101 L127,113 L116,124 L115,129 L118,134 L120,136 L126,136 L134,129 L162,101 L163,99 L163,92 L128,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.331683;0.346535" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame28" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M91,36 L86,40 L65,118 L58,144 L58,152 L62,156 L69,156 L73,152 L83,116 L102,45 L100,39 L96,36 Z M36,56 L28,63 L0,91 L-1,93 L-1,99 L6,107 L34,135 L36,136 L42,136 L47,131 L47,125 L40,117 L20,97 L22,93 L46,69 L47,67 L47,61 L42,56 Z M120,56 L115,61 L115,67 L122,75 L142,95 L140,99 L116,123 L115,125 L115,131 L120,136 L126,136 L134,129 L161,102 L163,98 L162,91 L128,57 L126,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.346535;0.356436" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame29" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,35 L87,38 L82,54 L62,129 L58,144 L58,153 L63,157 L70,156 L73,153 L98,60 L102,45 L101,39 L96,35 Z M37,56 L33,58 L26,66 L11,81 L5,86 L0,92 L-1,97 L3,104 L8,109 L20,120 L24,125 L31,131 L36,136 L42,136 L47,132 L47,124 L20,97 L22,93 L47,68 L47,60 L42,56 Z M120,56 L115,60 L115,68 L129,82 L134,87 L141,95 L143,95 L136,103 L115,124 L115,132 L120,136 L127,135 L132,130 L141,122 L147,115 L154,109 L161,101 L162,100 L162,92 L155,85 L150,80 L130,60 L127,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.356436;0.371287" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame30" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M93,34 L88,37 L85,43 L58,144 L57,151 L60,156 L63,158 L69,157 L73,153 L98,60 L102,45 L101,38 L98,35 Z M37,56 L29,63 L1,91 L0,93 L0,99 L7,107 L35,135 L37,136 L43,136 L47,132 L48,126 L46,122 L40,117 L35,112 L22,98 L20,98 L23,93 L46,70 L48,66 L47,60 L43,56 Z M119,56 L115,60 L114,66 L118,72 L141,95 L139,99 L116,122 L114,126 L115,132 L119,136 L125,136 L133,129 L161,101 L162,99 L162,93 L155,85 L127,57 L125,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.371287;0.381188" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame31" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,34 L88,36 L85,43 L62,129 L57,147 L58,155 L62,158 L68,158 L73,153 L98,60 L102,45 L102,39 L97,34 Z M37,56 L29,63 L1,91 L0,93 L0,99 L7,107 L35,135 L37,136 L43,136 L48,131 L48,125 L41,117 L21,97 L23,93 L47,69 L48,67 L48,61 L43,56 Z M119,56 L114,61 L114,67 L121,75 L141,95 L139,99 L115,123 L114,125 L114,131 L119,136 L125,136 L133,129 L160,102 L162,98 L161,91 L127,57 L125,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.381188;0.396040" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame32" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M93,33 L87,37 L81,58 L57,147 L57,153 L61,158 L66,159 L72,156 L77,138 L102,45 L102,38 L98,34 Z M37,56 L27,65 L2,90 L0,94 L1,100 L8,108 L34,134 L37,136 L43,136 L48,131 L48,125 L41,117 L21,97 L23,93 L47,69 L48,67 L48,61 L43,56 Z M119,56 L114,61 L114,67 L121,75 L141,95 L139,99 L115,123 L114,125 L114,131 L119,136 L125,136 L135,127 L160,102 L162,98 L161,92 L154,84 L128,58 L125,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.396040;0.405941" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame33" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,33 L87,37 L81,58 L57,148 L57,154 L62,159 L70,158 L73,154 L97,64 L102,45 L102,37 L97,33 Z M38,56 L30,63 L1,92 L0,97 L4,104 L9,108 L13,113 L21,120 L25,125 L32,131 L36,135 L43,136 L48,132 L48,124 L21,97 L23,93 L48,68 L48,60 L43,56 Z M119,56 L114,60 L114,68 L119,73 L127,81 L132,87 L137,91 L140,95 L142,95 L135,103 L114,124 L114,132 L119,136 L126,135 L131,130 L139,123 L146,115 L152,110 L157,105 L161,100 L161,92 L126,57 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.405941;0.420792" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame34" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M91,33 L87,37 L81,58 L57,148 L57,154 L61,159 L68,159 L73,154 L94,75 L102,45 L102,37 L98,33 Z M38,56 L30,63 L1,92 L1,100 L36,135 L38,136 L44,136 L48,132 L49,127 L46,122 L27,103 L22,98 L21,95 L26,90 L36,81 L42,74 L47,69 L49,63 L46,58 L43,56 Z M118,56 L114,60 L113,65 L117,72 L123,77 L130,85 L141,96 L136,101 L126,112 L119,118 L114,124 L113,129 L116,134 L118,136 L124,136 L132,129 L160,101 L161,99 L161,92 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.420792;0.430693" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame35" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M93,32 L88,35 L85,43 L57,148 L57,155 L61,159 L65,160 L70,158 L73,154 L102,45 L102,37 L98,33 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L48,132 L49,126 L47,122 L39,115 L31,107 L24,99 L22,98 L23,94 L47,70 L49,66 L48,60 L44,56 Z M118,56 L114,60 L113,66 L117,72 L140,95 L141,98 L137,100 L115,122 L113,126 L114,132 L118,136 L124,136 L132,129 L160,101 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.430693;0.445545" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame36" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M93,32 L88,35 L85,43 L64,122 L57,148 L57,155 L60,159 L66,160 L71,157 L74,150 L101,49 L102,45 L102,36 L97,32 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L48,132 L49,126 L46,121 L41,116 L35,111 L28,103 L22,97 L24,93 L47,70 L49,66 L48,60 L44,56 Z M118,56 L114,60 L113,66 L117,72 L140,95 L138,99 L115,122 L113,126 L114,132 L118,136 L124,136 L132,129 L160,101 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.445545;0.455446" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame37" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M93,32 L88,35 L85,43 L65,118 L57,148 L57,155 L60,159 L67,160 L71,158 L74,150 L94,75 L103,41 L101,35 L97,32 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L48,132 L49,126 L46,121 L22,97 L24,93 L47,70 L49,66 L48,59 L44,56 Z M118,56 L114,59 L113,67 L122,77 L140,95 L138,99 L114,123 L113,131 L118,136 L124,136 L132,129 L160,101 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.455446;0.470297" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame38" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,32 L87,36 L74,84 L57,147 L57,155 L62,160 L69,159 L72,156 L84,112 L102,45 L102,36 L97,32 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L48,132 L49,125 L42,117 L22,97 L24,93 L47,70 L49,66 L48,59 L44,56 Z M118,56 L113,61 L113,67 L120,75 L140,95 L138,99 L114,123 L113,125 L113,131 L118,136 L124,136 L132,129 L159,102 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.470297;0.480198" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame39" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,32 L87,36 L67,110 L57,147 L57,155 L62,160 L69,159 L72,156 L84,112 L102,45 L102,36 L97,32 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L49,131 L49,125 L42,117 L22,97 L24,93 L47,70 L49,67 L49,61 L44,56 Z M118,56 L113,61 L113,67 L120,75 L140,95 L138,99 L114,123 L113,125 L113,131 L118,136 L124,136 L132,129 L159,102 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.480198;0.495050" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+<g id="frame40" opacity="0">
+
+<path d="M0,0 L162,0 L169,3 L174,8 L177,15 L177,177 L174,184 L166,191 L162,192 L0,192 L-7,189 L-14,181 L-15,177 L-15,15 L-12,8 L-7,3 Z M92,32 L87,36 L67,110 L57,147 L57,155 L62,160 L69,159 L72,156 L84,112 L102,45 L102,36 L97,32 Z M38,56 L30,63 L2,91 L1,93 L1,99 L8,107 L36,135 L38,136 L44,136 L49,131 L49,125 L42,117 L22,97 L24,93 L47,70 L49,67 L49,61 L44,56 Z M118,56 L113,61 L113,67 L120,75 L140,95 L138,99 L114,123 L113,125 L113,131 L118,136 L124,136 L132,129 L159,102 L161,99 L161,93 L154,85 L126,57 L124,56 Z " fill="#11122F" transform="translate(47,32)"/>
+
+<animate attributeName="opacity" dur="2.020000s" values="0;1;0" keyTimes="0;0.495050;1.000000" calcMode="discrete" repeatCount="indefinite" begin="0s"/>
+</g>
+</g>
+</svg>