animot-presenter 0.5.11 → 0.5.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -176,6 +176,9 @@
176
176
  let codeHighlights = $state<Map<string, string>>(new Map());
177
177
  let elementContent = $state<Map<string, CanvasElement>>(new Map());
178
178
  let previousCodeContent = $state<Map<string, string>>(new Map());
179
+ // Snapshot of charts on the OUTGOING slide so the renderer can tween
180
+ // data values into the new slide. Updated alongside previousCodeContent.
181
+ let previousChartContent = $state<Map<string, ChartElement>>(new Map());
179
182
  let codeMorphState = $state<Map<string, {oldCode: string, newCode: string, mode: CodeAnimationMode, speed: number, highlightColor: string}>>(new Map());
180
183
  let textTypewriterState = $state<Map<string, {fullText: string, displayedChars: number, isAnimating: boolean}>>(new Map());
181
184
  let typewriterIntervals = new Map<string, ReturnType<typeof setInterval>>();
@@ -518,6 +521,7 @@
518
521
 
519
522
  codeMorphState = new Map();
520
523
  previousCodeContent = newPreviousCodeContent;
524
+ previousChartContent = new Map();
521
525
  shapeMorphStates = new Map();
522
526
  elementContent = new Map(elementContent);
523
527
  currentSlideIndex = 0;
@@ -554,6 +558,7 @@
554
558
  const newElementContent = new Map(elementContent);
555
559
  const newCodeMorphState = new Map(codeMorphState);
556
560
  const newPreviousCodeContent = new Map(previousCodeContent);
561
+ const newPreviousChartContent = new Map(previousChartContent);
557
562
  for (const elementId of allElementIds) {
558
563
  const targetEl = getElementInSlide(targetSlide, elementId);
559
564
  const animated = animatedElements.get(elementId);
@@ -564,6 +569,12 @@
564
569
  newCodeMorphState.set(elementId, { oldCode: prevCode, newCode: codeEl.code, mode: codeEl.animation?.mode || 'highlight-changes', speed: codeEl.animation?.typewriterSpeed || 50, highlightColor: codeEl.animation?.highlightColor || '#fef08a' });
565
570
  newPreviousCodeContent.set(elementId, codeEl.code);
566
571
  }
572
+ if (targetEl.type === 'chart') {
573
+ const outgoing = elementContent.get(elementId);
574
+ if (outgoing && outgoing.type === 'chart') {
575
+ newPreviousChartContent.set(elementId, JSON.parse(JSON.stringify(outgoing)));
576
+ }
577
+ }
567
578
  newElementContent.set(elementId, JSON.parse(JSON.stringify(targetEl)));
568
579
  if (animated) {
569
580
  animated.x.to(targetEl.position.x, { duration: 0 }); animated.y.to(targetEl.position.y, { duration: 0 });
@@ -604,6 +615,7 @@
604
615
  shapeMorphStates = new Map();
605
616
  codeMorphState = newCodeMorphState;
606
617
  previousCodeContent = newPreviousCodeContent;
618
+ previousChartContent = newPreviousChartContent;
607
619
  elementContent = newElementContent;
608
620
  animatedElements = new Map(animatedElements);
609
621
  currentSlideIndex = targetIndex;
@@ -659,14 +671,23 @@
659
671
  }
660
672
 
661
673
  // Update elementContent BEFORE animations start so rendered elements
662
- // (especially SVG viewBox) use target slide data while animating
674
+ // (especially SVG viewBox) use target slide data while animating.
675
+ // For charts, snapshot OUTGOING values into previousChartContent first
676
+ // so the new render tweens from them.
663
677
  for (const elementId of allElementIds) {
664
678
  const targetEl = getElementInSlide(targetSlide, elementId);
665
679
  if (targetEl && targetEl.type !== 'code') {
680
+ if (targetEl.type === 'chart') {
681
+ const outgoing = elementContent.get(elementId);
682
+ if (outgoing && outgoing.type === 'chart') {
683
+ previousChartContent.set(elementId, JSON.parse(JSON.stringify(outgoing)));
684
+ }
685
+ }
666
686
  elementContent.set(elementId, JSON.parse(JSON.stringify(targetEl)));
667
687
  }
668
688
  }
669
689
  elementContent = new Map(elementContent);
690
+ previousChartContent = new Map(previousChartContent);
670
691
 
671
692
  interface AnimationTask { elementId: string; order: number; delay: number; elementDuration: number; run: () => Promise<void>[]; }
672
693
  const animationTasks: AnimationTask[] = [];
@@ -1339,7 +1360,11 @@
1339
1360
  {:else if element.type === 'counter'}
1340
1361
  <CounterRenderer element={element as CounterElement} slideId={currentSlide?.id ?? ''} />
1341
1362
  {:else if element.type === 'chart'}
1342
- <ChartRenderer element={element as ChartElement} slideId={currentSlide?.id ?? ''} />
1363
+ <ChartRenderer
1364
+ element={element as ChartElement}
1365
+ slideId={currentSlide?.id ?? ''}
1366
+ previousElement={previousChartContent.get(element.id) ?? null}
1367
+ />
1343
1368
  {:else if element.type === 'icon'}
1344
1369
  <IconRenderer element={element as IconElement} />
1345
1370
  {:else if element.type === 'svg'}
@@ -1 +1 @@
1
- .code-morph.svelte-1hmk0l{width:100%;height:100%;margin:0;padding:0;background:transparent;font-family:var(--font-mono, "JetBrains Mono", monospace);font-size:inherit;line-height:1.6;white-space:pre-wrap;word-wrap:break-word;color:#e6edf3;box-sizing:border-box;overflow:visible}.code-morph.svelte-1hmk0l pre{margin:0;padding:16px;background:transparent!important;font-family:var(--font-mono);font-size:inherit;line-height:1.6;overflow:visible}.code-morph.svelte-1hmk0l code{font-family:inherit;font-size:inherit;font-weight:inherit}.code-morph.svelte-1hmk0l .line-number{display:inline-block;width:2.5em;margin-right:1em;text-align:right;color:#6e7681;-webkit-user-select:none;user-select:none;opacity:.6}.code-morph.svelte-1hmk0l .word-highlight{background:var(--highlight-color, #facc15);color:#000;border-radius:3px;padding:1px 3px;margin:0 -3px;-webkit-box-decoration-break:clone;box-decoration-break:clone;animation:svelte-1hmk0l-fadeHighlight var(--duration, 1s) ease-out forwards}@keyframes svelte-1hmk0l-fadeHighlight{0%{background:var(--highlight-color, #facc15);color:#000}70%{background:var(--highlight-color, #facc15);color:#000}to{background:transparent;color:inherit}}.counter.svelte-1er5jjj{width:100%;height:100%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:hidden;white-space:nowrap}.chart.svelte-1mq2d7j{width:100%;height:100%;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}.chart-title.svelte-1mq2d7j{font-weight:600;text-align:center;margin-bottom:8px}.chart-content.svelte-1mq2d7j{flex:1;min-height:0}.chart-content.svelte-1mq2d7j svg:where(.svelte-1mq2d7j){width:100%;height:100%}.bar-chart.svelte-1mq2d7j,.line-chart.svelte-1mq2d7j{overflow:visible}.icon-element.svelte-2ld65o{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.icon-element.svelte-2ld65o svg{width:100%;height:100%}.flow-markers.svelte-15cxp1m{pointer-events:none}.embed-player.svelte-1u59mvz{position:relative;width:100%;height:100%;background:#000;overflow:hidden}.embed-frame.svelte-1u59mvz{width:100%;height:100%;display:block;border:0}.embed-frame.passthrough.svelte-1u59mvz{pointer-events:none}.custom-controls.svelte-1u59mvz{position:absolute;left:8px;right:8px;bottom:8px;display:flex;align-items:center;gap:10px;padding:6px 10px;background:#0009;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:8px;opacity:0;transition:opacity .2s}.embed-player.svelte-1u59mvz:hover .custom-controls:where(.svelte-1u59mvz),.custom-controls.svelte-1u59mvz:focus-within{opacity:1}.ctrl-btn.svelte-1u59mvz{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:4px;color:#fff;cursor:pointer}.ctrl-btn.svelte-1u59mvz:hover{background:#ffffff26}.ctrl-btn.svelte-1u59mvz svg:where(.svelte-1u59mvz){width:16px;height:16px}.scrub.svelte-1u59mvz{flex:1;accent-color:#6366f1}.time.svelte-1u59mvz{font-size:11px;color:#ffffffd9;font-variant-numeric:tabular-nums;min-width:80px;text-align:right}@keyframes float-vertical{0%,to{translate:0 0}50%{translate:0 calc(-1 * var(--float-amp, 10px))}}@keyframes float-horizontal{0%,to{translate:0 0}50%{translate:var(--float-amp, 10px) 0}}@keyframes float-both-0{0%{translate:0 0}15%{translate:calc(.8 * var(--float-amp, 10px)) calc(-.6 * var(--float-amp, 10px))}35%{translate:calc(-.4 * var(--float-amp, 10px)) calc(-1 * var(--float-amp, 10px))}55%{translate:calc(-.9 * var(--float-amp, 10px)) calc(.3 * var(--float-amp, 10px))}75%{translate:calc(.3 * var(--float-amp, 10px)) calc(.7 * var(--float-amp, 10px))}to{translate:0 0}}@keyframes float-both-1{0%{translate:0 0}20%{translate:calc(-.7 * var(--float-amp, 10px)) calc(-.8 * var(--float-amp, 10px))}40%{translate:calc(.5 * var(--float-amp, 10px)) calc(-.3 * var(--float-amp, 10px))}60%{translate:calc(.9 * var(--float-amp, 10px)) calc(.6 * var(--float-amp, 10px))}80%{translate:calc(-.4 * var(--float-amp, 10px)) calc(.9 * var(--float-amp, 10px))}to{translate:0 0}}@keyframes float-both-2{0%{translate:0 0}12%{translate:calc(.6 * var(--float-amp, 10px)) calc(.5 * var(--float-amp, 10px))}30%{translate:calc(1 * var(--float-amp, 10px)) calc(-.4 * var(--float-amp, 10px))}50%{translate:calc(-.3 * var(--float-amp, 10px)) calc(-.9 * var(--float-amp, 10px))}70%{translate:calc(-.8 * var(--float-amp, 10px)) calc(.2 * var(--float-amp, 10px))}88%{translate:calc(.2 * var(--float-amp, 10px)) calc(.8 * var(--float-amp, 10px))}to{translate:0 0}}@keyframes float-both-3{0%{translate:0 0}17%{translate:calc(-.9 * var(--float-amp, 10px)) calc(.4 * var(--float-amp, 10px))}33%{translate:calc(-.5 * var(--float-amp, 10px)) calc(-.7 * var(--float-amp, 10px))}50%{translate:calc(.7 * var(--float-amp, 10px)) calc(-.9 * var(--float-amp, 10px))}67%{translate:calc(.9 * var(--float-amp, 10px)) calc(.5 * var(--float-amp, 10px))}83%{translate:calc(-.2 * var(--float-amp, 10px)) calc(.8 * var(--float-amp, 10px))}to{translate:0 0}}.animot-svg-element.icon-anim-draw path,.animot-svg-element.icon-anim-draw circle,.animot-svg-element.icon-anim-draw rect,.animot-svg-element.icon-anim-draw line,.animot-svg-element.icon-anim-draw polyline,.animot-svg-element.icon-anim-draw polygon,.animot-svg-element.icon-anim-draw ellipse{stroke-dashoffset:var(--path-len, 1000);animation:animot-svg-draw var(--icon-anim-duration, .8s) ease-out forwards}.animot-svg-element.icon-anim-undraw path,.animot-svg-element.icon-anim-undraw circle,.animot-svg-element.icon-anim-undraw rect,.animot-svg-element.icon-anim-undraw line,.animot-svg-element.icon-anim-undraw polyline,.animot-svg-element.icon-anim-undraw polygon,.animot-svg-element.icon-anim-undraw ellipse{stroke-dashoffset:0;animation:animot-svg-undraw var(--icon-anim-duration, .8s) ease-out forwards}.animot-svg-element.icon-anim-draw-undraw path,.animot-svg-element.icon-anim-draw-undraw circle,.animot-svg-element.icon-anim-draw-undraw rect,.animot-svg-element.icon-anim-draw-undraw line,.animot-svg-element.icon-anim-draw-undraw polyline,.animot-svg-element.icon-anim-draw-undraw polygon,.animot-svg-element.icon-anim-draw-undraw ellipse{stroke-dashoffset:var(--path-len, 1000);animation:animot-svg-draw-undraw var(--icon-anim-duration, .8s) ease-out forwards}.animot-svg-element.icon-anim-loop path,.animot-svg-element.icon-anim-loop circle,.animot-svg-element.icon-anim-loop rect,.animot-svg-element.icon-anim-loop line,.animot-svg-element.icon-anim-loop polyline,.animot-svg-element.icon-anim-loop polygon,.animot-svg-element.icon-anim-loop ellipse{animation-iteration-count:infinite!important}.animot-svg-element.icon-anim-reverse path,.animot-svg-element.icon-anim-reverse circle,.animot-svg-element.icon-anim-reverse rect,.animot-svg-element.icon-anim-reverse line,.animot-svg-element.icon-anim-reverse polyline,.animot-svg-element.icon-anim-reverse polygon,.animot-svg-element.icon-anim-reverse ellipse{animation-direction:reverse!important}@keyframes animot-svg-draw{to{stroke-dashoffset:0}}@keyframes animot-svg-undraw{0%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}@keyframes animot-svg-draw-undraw{0%{stroke-dashoffset:var(--path-len, 1000)}50%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}.animot-presenter.svelte-16ocdv9 *{margin:0;padding:0;box-sizing:border-box}.animot-presenter.svelte-16ocdv9{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:transparent;line-height:normal;font-size:16px;font-weight:400;font-style:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;text-indent:0;text-align:left;color:inherit}.animot-canvas-wrapper.svelte-16ocdv9{display:flex;align-items:center;justify-content:center}.animot-canvas.svelte-16ocdv9{position:relative;overflow:hidden}.animot-element.svelte-16ocdv9{position:absolute;box-sizing:border-box;will-change:transform,opacity,left,top,width,height;isolation:isolate}.animot-element.floating.svelte-16ocdv9{animation-duration:var(--float-speed, 3s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-delay:var(--float-delay, 0s)}.animot-code-block.svelte-16ocdv9{width:100%;height:100%;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 32px #0006;margin:0;box-sizing:border-box}.animot-code-block.transparent-bg.svelte-16ocdv9{background:transparent!important;box-shadow:none}.animot-code-block.transparent-bg.svelte-16ocdv9 .animot-code-header:where(.svelte-16ocdv9){background:transparent;border-bottom-color:#ffffff0f}.animot-code-header.svelte-16ocdv9{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#0003;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;min-height:40px}.animot-window-controls.svelte-16ocdv9{display:flex;gap:8px;align-items:center;flex-shrink:0}.macos.svelte-16ocdv9 .animot-control:where(.svelte-16ocdv9){width:12px;height:12px;border-radius:50%;display:block}.macos.svelte-16ocdv9 .animot-control.close:where(.svelte-16ocdv9){background:#ff5f57}.macos.svelte-16ocdv9 .animot-control.minimize:where(.svelte-16ocdv9){background:#febc2e}.macos.svelte-16ocdv9 .animot-control.maximize:where(.svelte-16ocdv9){background:#28c840}.windows.svelte-16ocdv9 .animot-window-controls:where(.svelte-16ocdv9){order:99;margin-left:auto;gap:0}.windows.svelte-16ocdv9 .animot-control:where(.svelte-16ocdv9){display:flex;align-items:center;justify-content:center;width:28px;height:24px;border-radius:4px;color:#ffffff73}.animot-filename-tab.svelte-16ocdv9{display:flex;align-items:center;gap:6px;background:#ffffff0f;border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:4px 10px;max-width:220px;color:#fff6}.animot-file-icon.svelte-16ocdv9{flex-shrink:0}.animot-filename.svelte-16ocdv9{color:#ffffff8c;font-size:12px;line-height:18px}.animot-copy-code-btn.svelte-16ocdv9{display:flex;align-items:center;gap:5px;height:28px;padding:0 8px;margin-left:auto;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:#fff6;cursor:pointer;opacity:0;transition:opacity .2s,background .15s,color .15s;flex-shrink:0;font-size:12px;font-family:inherit;white-space:nowrap}.animot-copy-code-btn.svelte-16ocdv9:hover{background:#ffffff1f;color:#fffc}.animot-copy-code-btn.svelte-16ocdv9 svg:where(.svelte-16ocdv9){width:14px;height:14px;flex-shrink:0}.animot-copy-code-btn.svelte-16ocdv9 .animot-check-icon:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.svelte-16ocdv9 .animot-copied-label:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-copy-icon:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-copy-label:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-check-icon:where(.svelte-16ocdv9){display:block;color:#4ade80}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-copied-label:where(.svelte-16ocdv9){display:inline;color:#4ade80}.animot-copy-code-btn.animot-floating.svelte-16ocdv9{position:absolute;top:8px;right:8px;z-index:2}.animot-code-block.svelte-16ocdv9:hover .animot-copy-code-btn:where(.svelte-16ocdv9){opacity:1}.animot-code-content.svelte-16ocdv9{flex:1;overflow:hidden;position:relative}.animot-highlighted-code.svelte-16ocdv9{width:100%;height:100%}.animot-code-content.svelte-16ocdv9 pre,.animot-highlighted-code.svelte-16ocdv9 pre{margin:0;padding:16px;background:transparent!important;line-height:1.6;font-size:inherit;overflow:visible}.animot-highlighted-code.svelte-16ocdv9 code{font-family:inherit;font-size:inherit;font-weight:inherit}.animot-highlighted-code.svelte-16ocdv9 .line-number{display:inline-block;width:2.5em;margin-right:1em;text-align:right;color:#6e7681;-webkit-user-select:none;user-select:none;opacity:.6}.animot-text-element.svelte-16ocdv9{width:100%;height:100%;display:flex;align-items:center;white-space:pre-wrap;word-wrap:break-word}.animot-typewriter-cursor.svelte-16ocdv9{animation:svelte-16ocdv9-animot-blink .7s infinite;font-weight:100}@keyframes svelte-16ocdv9-animot-blink{0%,50%{opacity:1}51%,to{opacity:0}}.animot-arrow-element.svelte-16ocdv9{width:100%;height:100%}.arrow-animate-draw.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9){stroke-dashoffset:var(--path-len, 1000);animation:svelte-16ocdv9-animot-arrow-draw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-undraw.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9){stroke-dashoffset:0;animation:svelte-16ocdv9-animot-arrow-undraw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-draw-undraw.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9){stroke-dashoffset:var(--path-len, 1000);animation:svelte-16ocdv9-animot-arrow-draw-undraw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-head-styled-draw.svelte-16ocdv9{opacity:0;animation:svelte-16ocdv9-animot-arrow-head-appear var(--arrow-anim-duration, .5s) ease-out forwards;animation-delay:calc(var(--arrow-anim-duration, .5s) * .7)}.arrow-animate-draw.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9){opacity:0;animation:svelte-16ocdv9-animot-arrow-head-appear var(--arrow-anim-duration, .5s) ease-out forwards;animation-delay:calc(var(--arrow-anim-duration, .5s) * .7)}.arrow-animate-undraw.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9),.arrow-head-undraw.svelte-16ocdv9{opacity:1;animation:svelte-16ocdv9-animot-arrow-head-disappear var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-draw-undraw.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9),.arrow-head-draw-undraw.svelte-16ocdv9{opacity:0;animation:svelte-16ocdv9-animot-arrow-head-draw-undraw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-grow.svelte-16ocdv9{transform-origin:left center;animation:svelte-16ocdv9-animot-arrow-grow var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-anim-loop.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9),.arrow-anim-loop.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9){animation-iteration-count:infinite!important}.arrow-anim-reverse.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9),.arrow-anim-reverse.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9){animation-direction:reverse!important}@keyframes svelte-16ocdv9-animot-arrow-draw{to{stroke-dashoffset:0}}@keyframes svelte-16ocdv9-animot-arrow-undraw{0%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}@keyframes svelte-16ocdv9-animot-arrow-draw-undraw{0%{stroke-dashoffset:var(--path-len, 1000)}50%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}@keyframes svelte-16ocdv9-animot-arrow-head-appear{0%{opacity:0}to{opacity:1}}@keyframes svelte-16ocdv9-animot-arrow-head-disappear{0%{opacity:1}70%{opacity:1}to{opacity:0}}@keyframes svelte-16ocdv9-animot-arrow-head-draw-undraw{0%{opacity:0}35%{opacity:1}65%{opacity:1}to{opacity:0}}@keyframes svelte-16ocdv9-animot-arrow-grow{0%{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}.animot-image-element.svelte-16ocdv9{width:100%;height:100%;display:block}.animot-video-element.svelte-16ocdv9{width:100%;height:100%;display:block;background:#000}.animot-video-element.animot-embed-frame.svelte-16ocdv9{border:0;background:transparent}.animot-video-element.animot-embed-wrap.svelte-16ocdv9{overflow:hidden;background:#000}.animot-cinema-camera.svelte-16ocdv9{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:0 0}.animot-cinema-camera.active.svelte-16ocdv9{transition:transform var(--cinema-transition-duration, .8s) cubic-bezier(.65,0,.35,1)}.animot-cinema-camera.active.svelte-16ocdv9 .animot-element:where(.svelte-16ocdv9){transition:translate var(--cinema-transition-duration, .8s) cubic-bezier(.65,0,.35,1)}.animot-shape-element.svelte-16ocdv9{width:100%;height:100%;display:block;overflow:visible}.animot-canvas.svelte-16ocdv9{--transition-duration: .5s;transition:transform calc(var(--transition-duration) * .4) ease,opacity calc(var(--transition-duration) * .4) ease}.animot-canvas.transition-fade-out.svelte-16ocdv9{opacity:0}.animot-canvas.transition-fade-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-fadeIn calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-left-out.forward.svelte-16ocdv9{transform:translate(-100%);opacity:0}.animot-canvas.transition-slide-left-in.forward.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromRight calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-left-out.backward.svelte-16ocdv9{transform:translate(100%);opacity:0}.animot-canvas.transition-slide-left-in.backward.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromLeft calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-right-out.forward.svelte-16ocdv9{transform:translate(100%);opacity:0}.animot-canvas.transition-slide-right-in.forward.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromLeft calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-up-out.svelte-16ocdv9{transform:translateY(-100%);opacity:0}.animot-canvas.transition-slide-up-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromBottom calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-down-out.svelte-16ocdv9{transform:translateY(100%);opacity:0}.animot-canvas.transition-slide-down-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromTop calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-zoom-in-out.svelte-16ocdv9{transform:scale(.5);opacity:0}.animot-canvas.transition-zoom-in-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-zoomIn calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-zoom-out-out.svelte-16ocdv9{transform:scale(1.5);opacity:0}.animot-canvas.transition-zoom-out-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-zoomOut calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-flip-out.svelte-16ocdv9{transform:perspective(1000px) rotateY(90deg);opacity:0}.animot-canvas.transition-flip-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-flipIn calc(var(--transition-duration) * .6) ease forwards}@keyframes svelte-16ocdv9-animot-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromBottom{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromTop{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes svelte-16ocdv9-animot-zoomIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes svelte-16ocdv9-animot-zoomOut{0%{transform:scale(1.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes svelte-16ocdv9-animot-flipIn{0%{transform:perspective(1000px) rotateY(-90deg);opacity:0}to{transform:perspective(1000px) rotateY(0);opacity:1}}.animot-canvas.transition-flip-x-out.svelte-16ocdv9{transform:perspective(1000px) rotateX(90deg);opacity:0}.animot-canvas.transition-flip-x-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-flipXIn calc(var(--transition-duration) * .6) ease forwards}@keyframes svelte-16ocdv9-animot-flipXIn{0%{transform:perspective(1000px) rotateX(-90deg);opacity:0}to{transform:perspective(1000px) rotateX(0);opacity:1}}.animot-canvas.transition-flip-y-out.svelte-16ocdv9{transform:perspective(1000px) rotateY(90deg);opacity:0}.animot-canvas.transition-flip-y-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-flipYIn calc(var(--transition-duration) * .6) ease forwards}@keyframes svelte-16ocdv9-animot-flipYIn{0%{transform:perspective(1000px) rotateY(-90deg);opacity:0}to{transform:perspective(1000px) rotateY(0);opacity:1}}.animot-svg-element.svelte-16ocdv9{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.animot-svg-element.svelte-16ocdv9 svg{width:100%;height:100%}.animot-controls.svelte-16ocdv9{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:8px 16px;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:10px;opacity:0;transition:opacity .3s ease .15s;z-index:100}.animot-presenter.svelte-16ocdv9:hover .animot-controls:where(.svelte-16ocdv9),.animot-menu-visible.svelte-16ocdv9 .animot-controls:where(.svelte-16ocdv9){opacity:1;transition-delay:0s}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9){display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:6px;border:none;cursor:pointer;background:#ffffff1a;color:#fff;transition:background .2s}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9):hover:not(:disabled){background:#fff3}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9):disabled{opacity:.3;cursor:not-allowed}.animot-controls.svelte-16ocdv9 button.active:where(.svelte-16ocdv9){background:#6366f199}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9) svg:where(.svelte-16ocdv9){width:16px;height:16px}.animot-slide-indicator.svelte-16ocdv9{font-size:12px;color:#fff;min-width:50px;text-align:center;font-family:system-ui,sans-serif}.animot-arrow.svelte-16ocdv9{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;background:#00000080;color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s .15s;z-index:100;padding:0;margin:0}.animot-presenter.svelte-16ocdv9:hover .animot-arrow:where(.svelte-16ocdv9){opacity:1;transition-delay:0s}.animot-presenter.svelte-16ocdv9:hover .animot-arrow:where(.svelte-16ocdv9):disabled{opacity:.3;cursor:not-allowed}.animot-arrow.svelte-16ocdv9:hover:not(:disabled){background:#000000b3}.animot-arrow.svelte-16ocdv9 svg:where(.svelte-16ocdv9){width:20px;height:20px}.animot-arrow-left.svelte-16ocdv9{left:8px}.animot-arrow-right.svelte-16ocdv9{right:8px}.animot-progress-bar.svelte-16ocdv9{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff1a;z-index:100;opacity:0;transition:opacity .3s .15s}.animot-presenter.svelte-16ocdv9:hover .animot-progress-bar:where(.svelte-16ocdv9){opacity:1;transition-delay:0s}.animot-progress-fill.svelte-16ocdv9{height:100%;background:linear-gradient(135deg,#7c3aed,#ec4899);transition:width .6s ease}.animot-loading.svelte-16ocdv9{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.animot-spinner.svelte-16ocdv9{width:32px;height:32px;border:3px solid rgba(255,255,255,.2);border-top-color:#7c3aed;border-radius:50%;animation:svelte-16ocdv9-animot-spin .8s linear infinite}@keyframes svelte-16ocdv9-animot-spin{to{transform:rotate(360deg)}}.animot-error.svelte-16ocdv9{color:#ef4444;padding:20px;text-align:center;font-family:system-ui,sans-serif}
1
+ .code-morph.svelte-1hmk0l{width:100%;height:100%;margin:0;padding:0;background:transparent;font-family:var(--font-mono, "JetBrains Mono", monospace);font-size:inherit;line-height:1.6;white-space:pre-wrap;word-wrap:break-word;color:#e6edf3;box-sizing:border-box;overflow:visible}.code-morph.svelte-1hmk0l pre{margin:0;padding:16px;background:transparent!important;font-family:var(--font-mono);font-size:inherit;line-height:1.6;overflow:visible}.code-morph.svelte-1hmk0l code{font-family:inherit;font-size:inherit;font-weight:inherit}.code-morph.svelte-1hmk0l .line-number{display:inline-block;width:2.5em;margin-right:1em;text-align:right;color:#6e7681;-webkit-user-select:none;user-select:none;opacity:.6}.code-morph.svelte-1hmk0l .word-highlight{background:var(--highlight-color, #facc15);color:#000;border-radius:3px;padding:1px 3px;margin:0 -3px;-webkit-box-decoration-break:clone;box-decoration-break:clone;animation:svelte-1hmk0l-fadeHighlight var(--duration, 1s) ease-out forwards}@keyframes svelte-1hmk0l-fadeHighlight{0%{background:var(--highlight-color, #facc15);color:#000}70%{background:var(--highlight-color, #facc15);color:#000}to{background:transparent;color:inherit}}.counter.svelte-1er5jjj{width:100%;height:100%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:hidden;white-space:nowrap}.animot-chart.svelte-1mq2d7j{width:100%;height:100%;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}.animot-chart-title.svelte-1mq2d7j{font-weight:600;text-align:center;margin-bottom:8px}.animot-chart-content.svelte-1mq2d7j{flex:1;min-height:0;display:flex;flex-direction:column}.animot-chart-content.svelte-1mq2d7j svg:where(.svelte-1mq2d7j){width:100%;flex:1;min-height:0}.animot-bar-chart.svelte-1mq2d7j,.animot-line-chart.svelte-1mq2d7j{overflow:visible}.animot-series-legend.svelte-1mq2d7j{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;padding:6px 0 0;font-size:.85em}.animot-legend-item.svelte-1mq2d7j{display:inline-flex;align-items:center;gap:5px}.animot-swatch.svelte-1mq2d7j{width:10px;height:10px;border-radius:2px;display:inline-block}.icon-element.svelte-2ld65o{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.icon-element.svelte-2ld65o svg{width:100%;height:100%}.flow-markers.svelte-15cxp1m{pointer-events:none}.embed-player.svelte-1u59mvz{position:relative;width:100%;height:100%;background:#000;overflow:hidden}.embed-frame.svelte-1u59mvz{width:100%;height:100%;display:block;border:0}.embed-frame.passthrough.svelte-1u59mvz{pointer-events:none}.custom-controls.svelte-1u59mvz{position:absolute;left:8px;right:8px;bottom:8px;display:flex;align-items:center;gap:10px;padding:6px 10px;background:#0009;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:8px;opacity:0;transition:opacity .2s}.embed-player.svelte-1u59mvz:hover .custom-controls:where(.svelte-1u59mvz),.custom-controls.svelte-1u59mvz:focus-within{opacity:1}.ctrl-btn.svelte-1u59mvz{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:4px;color:#fff;cursor:pointer}.ctrl-btn.svelte-1u59mvz:hover{background:#ffffff26}.ctrl-btn.svelte-1u59mvz svg:where(.svelte-1u59mvz){width:16px;height:16px}.scrub.svelte-1u59mvz{flex:1;accent-color:#6366f1}.time.svelte-1u59mvz{font-size:11px;color:#ffffffd9;font-variant-numeric:tabular-nums;min-width:80px;text-align:right}@keyframes float-vertical{0%,to{translate:0 0}50%{translate:0 calc(-1 * var(--float-amp, 10px))}}@keyframes float-horizontal{0%,to{translate:0 0}50%{translate:var(--float-amp, 10px) 0}}@keyframes float-both-0{0%{translate:0 0}15%{translate:calc(.8 * var(--float-amp, 10px)) calc(-.6 * var(--float-amp, 10px))}35%{translate:calc(-.4 * var(--float-amp, 10px)) calc(-1 * var(--float-amp, 10px))}55%{translate:calc(-.9 * var(--float-amp, 10px)) calc(.3 * var(--float-amp, 10px))}75%{translate:calc(.3 * var(--float-amp, 10px)) calc(.7 * var(--float-amp, 10px))}to{translate:0 0}}@keyframes float-both-1{0%{translate:0 0}20%{translate:calc(-.7 * var(--float-amp, 10px)) calc(-.8 * var(--float-amp, 10px))}40%{translate:calc(.5 * var(--float-amp, 10px)) calc(-.3 * var(--float-amp, 10px))}60%{translate:calc(.9 * var(--float-amp, 10px)) calc(.6 * var(--float-amp, 10px))}80%{translate:calc(-.4 * var(--float-amp, 10px)) calc(.9 * var(--float-amp, 10px))}to{translate:0 0}}@keyframes float-both-2{0%{translate:0 0}12%{translate:calc(.6 * var(--float-amp, 10px)) calc(.5 * var(--float-amp, 10px))}30%{translate:calc(1 * var(--float-amp, 10px)) calc(-.4 * var(--float-amp, 10px))}50%{translate:calc(-.3 * var(--float-amp, 10px)) calc(-.9 * var(--float-amp, 10px))}70%{translate:calc(-.8 * var(--float-amp, 10px)) calc(.2 * var(--float-amp, 10px))}88%{translate:calc(.2 * var(--float-amp, 10px)) calc(.8 * var(--float-amp, 10px))}to{translate:0 0}}@keyframes float-both-3{0%{translate:0 0}17%{translate:calc(-.9 * var(--float-amp, 10px)) calc(.4 * var(--float-amp, 10px))}33%{translate:calc(-.5 * var(--float-amp, 10px)) calc(-.7 * var(--float-amp, 10px))}50%{translate:calc(.7 * var(--float-amp, 10px)) calc(-.9 * var(--float-amp, 10px))}67%{translate:calc(.9 * var(--float-amp, 10px)) calc(.5 * var(--float-amp, 10px))}83%{translate:calc(-.2 * var(--float-amp, 10px)) calc(.8 * var(--float-amp, 10px))}to{translate:0 0}}.animot-svg-element.icon-anim-draw path,.animot-svg-element.icon-anim-draw circle,.animot-svg-element.icon-anim-draw rect,.animot-svg-element.icon-anim-draw line,.animot-svg-element.icon-anim-draw polyline,.animot-svg-element.icon-anim-draw polygon,.animot-svg-element.icon-anim-draw ellipse{stroke-dashoffset:var(--path-len, 1000);animation:animot-svg-draw var(--icon-anim-duration, .8s) ease-out forwards}.animot-svg-element.icon-anim-undraw path,.animot-svg-element.icon-anim-undraw circle,.animot-svg-element.icon-anim-undraw rect,.animot-svg-element.icon-anim-undraw line,.animot-svg-element.icon-anim-undraw polyline,.animot-svg-element.icon-anim-undraw polygon,.animot-svg-element.icon-anim-undraw ellipse{stroke-dashoffset:0;animation:animot-svg-undraw var(--icon-anim-duration, .8s) ease-out forwards}.animot-svg-element.icon-anim-draw-undraw path,.animot-svg-element.icon-anim-draw-undraw circle,.animot-svg-element.icon-anim-draw-undraw rect,.animot-svg-element.icon-anim-draw-undraw line,.animot-svg-element.icon-anim-draw-undraw polyline,.animot-svg-element.icon-anim-draw-undraw polygon,.animot-svg-element.icon-anim-draw-undraw ellipse{stroke-dashoffset:var(--path-len, 1000);animation:animot-svg-draw-undraw var(--icon-anim-duration, .8s) ease-out forwards}.animot-svg-element.icon-anim-loop path,.animot-svg-element.icon-anim-loop circle,.animot-svg-element.icon-anim-loop rect,.animot-svg-element.icon-anim-loop line,.animot-svg-element.icon-anim-loop polyline,.animot-svg-element.icon-anim-loop polygon,.animot-svg-element.icon-anim-loop ellipse{animation-iteration-count:infinite!important}.animot-svg-element.icon-anim-reverse path,.animot-svg-element.icon-anim-reverse circle,.animot-svg-element.icon-anim-reverse rect,.animot-svg-element.icon-anim-reverse line,.animot-svg-element.icon-anim-reverse polyline,.animot-svg-element.icon-anim-reverse polygon,.animot-svg-element.icon-anim-reverse ellipse{animation-direction:reverse!important}@keyframes animot-svg-draw{to{stroke-dashoffset:0}}@keyframes animot-svg-undraw{0%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}@keyframes animot-svg-draw-undraw{0%{stroke-dashoffset:var(--path-len, 1000)}50%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}.animot-presenter.svelte-16ocdv9 *{margin:0;padding:0;box-sizing:border-box}.animot-presenter.svelte-16ocdv9{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:transparent;line-height:normal;font-size:16px;font-weight:400;font-style:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;text-indent:0;text-align:left;color:inherit}.animot-canvas-wrapper.svelte-16ocdv9{display:flex;align-items:center;justify-content:center}.animot-canvas.svelte-16ocdv9{position:relative;overflow:hidden}.animot-element.svelte-16ocdv9{position:absolute;box-sizing:border-box;will-change:transform,opacity,left,top,width,height;isolation:isolate}.animot-element.floating.svelte-16ocdv9{animation-duration:var(--float-speed, 3s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-delay:var(--float-delay, 0s)}.animot-code-block.svelte-16ocdv9{width:100%;height:100%;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 32px #0006;margin:0;box-sizing:border-box}.animot-code-block.transparent-bg.svelte-16ocdv9{background:transparent!important;box-shadow:none}.animot-code-block.transparent-bg.svelte-16ocdv9 .animot-code-header:where(.svelte-16ocdv9){background:transparent;border-bottom-color:#ffffff0f}.animot-code-header.svelte-16ocdv9{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#0003;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;min-height:40px}.animot-window-controls.svelte-16ocdv9{display:flex;gap:8px;align-items:center;flex-shrink:0}.macos.svelte-16ocdv9 .animot-control:where(.svelte-16ocdv9){width:12px;height:12px;border-radius:50%;display:block}.macos.svelte-16ocdv9 .animot-control.close:where(.svelte-16ocdv9){background:#ff5f57}.macos.svelte-16ocdv9 .animot-control.minimize:where(.svelte-16ocdv9){background:#febc2e}.macos.svelte-16ocdv9 .animot-control.maximize:where(.svelte-16ocdv9){background:#28c840}.windows.svelte-16ocdv9 .animot-window-controls:where(.svelte-16ocdv9){order:99;margin-left:auto;gap:0}.windows.svelte-16ocdv9 .animot-control:where(.svelte-16ocdv9){display:flex;align-items:center;justify-content:center;width:28px;height:24px;border-radius:4px;color:#ffffff73}.animot-filename-tab.svelte-16ocdv9{display:flex;align-items:center;gap:6px;background:#ffffff0f;border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:4px 10px;max-width:220px;color:#fff6}.animot-file-icon.svelte-16ocdv9{flex-shrink:0}.animot-filename.svelte-16ocdv9{color:#ffffff8c;font-size:12px;line-height:18px}.animot-copy-code-btn.svelte-16ocdv9{display:flex;align-items:center;gap:5px;height:28px;padding:0 8px;margin-left:auto;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:#fff6;cursor:pointer;opacity:0;transition:opacity .2s,background .15s,color .15s;flex-shrink:0;font-size:12px;font-family:inherit;white-space:nowrap}.animot-copy-code-btn.svelte-16ocdv9:hover{background:#ffffff1f;color:#fffc}.animot-copy-code-btn.svelte-16ocdv9 svg:where(.svelte-16ocdv9){width:14px;height:14px;flex-shrink:0}.animot-copy-code-btn.svelte-16ocdv9 .animot-check-icon:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.svelte-16ocdv9 .animot-copied-label:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-copy-icon:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-copy-label:where(.svelte-16ocdv9){display:none}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-check-icon:where(.svelte-16ocdv9){display:block;color:#4ade80}.animot-copy-code-btn.copied.svelte-16ocdv9 .animot-copied-label:where(.svelte-16ocdv9){display:inline;color:#4ade80}.animot-copy-code-btn.animot-floating.svelte-16ocdv9{position:absolute;top:8px;right:8px;z-index:2}.animot-code-block.svelte-16ocdv9:hover .animot-copy-code-btn:where(.svelte-16ocdv9){opacity:1}.animot-code-content.svelte-16ocdv9{flex:1;overflow:hidden;position:relative}.animot-highlighted-code.svelte-16ocdv9{width:100%;height:100%}.animot-code-content.svelte-16ocdv9 pre,.animot-highlighted-code.svelte-16ocdv9 pre{margin:0;padding:16px;background:transparent!important;line-height:1.6;font-size:inherit;overflow:visible}.animot-highlighted-code.svelte-16ocdv9 code{font-family:inherit;font-size:inherit;font-weight:inherit}.animot-highlighted-code.svelte-16ocdv9 .line-number{display:inline-block;width:2.5em;margin-right:1em;text-align:right;color:#6e7681;-webkit-user-select:none;user-select:none;opacity:.6}.animot-text-element.svelte-16ocdv9{width:100%;height:100%;display:flex;align-items:center;white-space:pre-wrap;word-wrap:break-word}.animot-typewriter-cursor.svelte-16ocdv9{animation:svelte-16ocdv9-animot-blink .7s infinite;font-weight:100}@keyframes svelte-16ocdv9-animot-blink{0%,50%{opacity:1}51%,to{opacity:0}}.animot-arrow-element.svelte-16ocdv9{width:100%;height:100%}.arrow-animate-draw.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9){stroke-dashoffset:var(--path-len, 1000);animation:svelte-16ocdv9-animot-arrow-draw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-undraw.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9){stroke-dashoffset:0;animation:svelte-16ocdv9-animot-arrow-undraw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-draw-undraw.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9){stroke-dashoffset:var(--path-len, 1000);animation:svelte-16ocdv9-animot-arrow-draw-undraw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-head-styled-draw.svelte-16ocdv9{opacity:0;animation:svelte-16ocdv9-animot-arrow-head-appear var(--arrow-anim-duration, .5s) ease-out forwards;animation-delay:calc(var(--arrow-anim-duration, .5s) * .7)}.arrow-animate-draw.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9){opacity:0;animation:svelte-16ocdv9-animot-arrow-head-appear var(--arrow-anim-duration, .5s) ease-out forwards;animation-delay:calc(var(--arrow-anim-duration, .5s) * .7)}.arrow-animate-undraw.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9),.arrow-head-undraw.svelte-16ocdv9{opacity:1;animation:svelte-16ocdv9-animot-arrow-head-disappear var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-draw-undraw.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9),.arrow-head-draw-undraw.svelte-16ocdv9{opacity:0;animation:svelte-16ocdv9-animot-arrow-head-draw-undraw var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-animate-grow.svelte-16ocdv9{transform-origin:left center;animation:svelte-16ocdv9-animot-arrow-grow var(--arrow-anim-duration, .5s) ease-out forwards}.arrow-anim-loop.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9),.arrow-anim-loop.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9){animation-iteration-count:infinite!important}.arrow-anim-reverse.svelte-16ocdv9 .arrow-path:where(.svelte-16ocdv9),.arrow-anim-reverse.svelte-16ocdv9 .arrow-head:where(.svelte-16ocdv9){animation-direction:reverse!important}@keyframes svelte-16ocdv9-animot-arrow-draw{to{stroke-dashoffset:0}}@keyframes svelte-16ocdv9-animot-arrow-undraw{0%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}@keyframes svelte-16ocdv9-animot-arrow-draw-undraw{0%{stroke-dashoffset:var(--path-len, 1000)}50%{stroke-dashoffset:0}to{stroke-dashoffset:var(--path-len, 1000)}}@keyframes svelte-16ocdv9-animot-arrow-head-appear{0%{opacity:0}to{opacity:1}}@keyframes svelte-16ocdv9-animot-arrow-head-disappear{0%{opacity:1}70%{opacity:1}to{opacity:0}}@keyframes svelte-16ocdv9-animot-arrow-head-draw-undraw{0%{opacity:0}35%{opacity:1}65%{opacity:1}to{opacity:0}}@keyframes svelte-16ocdv9-animot-arrow-grow{0%{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}.animot-image-element.svelte-16ocdv9{width:100%;height:100%;display:block}.animot-video-element.svelte-16ocdv9{width:100%;height:100%;display:block;background:#000}.animot-video-element.animot-embed-frame.svelte-16ocdv9{border:0;background:transparent}.animot-video-element.animot-embed-wrap.svelte-16ocdv9{overflow:hidden;background:#000}.animot-cinema-camera.svelte-16ocdv9{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:0 0}.animot-cinema-camera.active.svelte-16ocdv9{transition:transform var(--cinema-transition-duration, .8s) cubic-bezier(.65,0,.35,1)}.animot-cinema-camera.active.svelte-16ocdv9 .animot-element:where(.svelte-16ocdv9){transition:translate var(--cinema-transition-duration, .8s) cubic-bezier(.65,0,.35,1)}.animot-shape-element.svelte-16ocdv9{width:100%;height:100%;display:block;overflow:visible}.animot-canvas.svelte-16ocdv9{--transition-duration: .5s;transition:transform calc(var(--transition-duration) * .4) ease,opacity calc(var(--transition-duration) * .4) ease}.animot-canvas.transition-fade-out.svelte-16ocdv9{opacity:0}.animot-canvas.transition-fade-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-fadeIn calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-left-out.forward.svelte-16ocdv9{transform:translate(-100%);opacity:0}.animot-canvas.transition-slide-left-in.forward.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromRight calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-left-out.backward.svelte-16ocdv9{transform:translate(100%);opacity:0}.animot-canvas.transition-slide-left-in.backward.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromLeft calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-right-out.forward.svelte-16ocdv9{transform:translate(100%);opacity:0}.animot-canvas.transition-slide-right-in.forward.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromLeft calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-up-out.svelte-16ocdv9{transform:translateY(-100%);opacity:0}.animot-canvas.transition-slide-up-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromBottom calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-slide-down-out.svelte-16ocdv9{transform:translateY(100%);opacity:0}.animot-canvas.transition-slide-down-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-slideInFromTop calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-zoom-in-out.svelte-16ocdv9{transform:scale(.5);opacity:0}.animot-canvas.transition-zoom-in-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-zoomIn calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-zoom-out-out.svelte-16ocdv9{transform:scale(1.5);opacity:0}.animot-canvas.transition-zoom-out-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-zoomOut calc(var(--transition-duration) * .6) ease forwards}.animot-canvas.transition-flip-out.svelte-16ocdv9{transform:perspective(1000px) rotateY(90deg);opacity:0}.animot-canvas.transition-flip-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-flipIn calc(var(--transition-duration) * .6) ease forwards}@keyframes svelte-16ocdv9-animot-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromBottom{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes svelte-16ocdv9-animot-slideInFromTop{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes svelte-16ocdv9-animot-zoomIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes svelte-16ocdv9-animot-zoomOut{0%{transform:scale(1.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes svelte-16ocdv9-animot-flipIn{0%{transform:perspective(1000px) rotateY(-90deg);opacity:0}to{transform:perspective(1000px) rotateY(0);opacity:1}}.animot-canvas.transition-flip-x-out.svelte-16ocdv9{transform:perspective(1000px) rotateX(90deg);opacity:0}.animot-canvas.transition-flip-x-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-flipXIn calc(var(--transition-duration) * .6) ease forwards}@keyframes svelte-16ocdv9-animot-flipXIn{0%{transform:perspective(1000px) rotateX(-90deg);opacity:0}to{transform:perspective(1000px) rotateX(0);opacity:1}}.animot-canvas.transition-flip-y-out.svelte-16ocdv9{transform:perspective(1000px) rotateY(90deg);opacity:0}.animot-canvas.transition-flip-y-in.svelte-16ocdv9{animation:svelte-16ocdv9-animot-flipYIn calc(var(--transition-duration) * .6) ease forwards}@keyframes svelte-16ocdv9-animot-flipYIn{0%{transform:perspective(1000px) rotateY(-90deg);opacity:0}to{transform:perspective(1000px) rotateY(0);opacity:1}}.animot-svg-element.svelte-16ocdv9{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.animot-svg-element.svelte-16ocdv9 svg{width:100%;height:100%}.animot-controls.svelte-16ocdv9{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:8px 16px;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:10px;opacity:0;transition:opacity .3s ease .15s;z-index:100}.animot-presenter.svelte-16ocdv9:hover .animot-controls:where(.svelte-16ocdv9),.animot-menu-visible.svelte-16ocdv9 .animot-controls:where(.svelte-16ocdv9){opacity:1;transition-delay:0s}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9){display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:6px;border:none;cursor:pointer;background:#ffffff1a;color:#fff;transition:background .2s}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9):hover:not(:disabled){background:#fff3}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9):disabled{opacity:.3;cursor:not-allowed}.animot-controls.svelte-16ocdv9 button.active:where(.svelte-16ocdv9){background:#6366f199}.animot-controls.svelte-16ocdv9 button:where(.svelte-16ocdv9) svg:where(.svelte-16ocdv9){width:16px;height:16px}.animot-slide-indicator.svelte-16ocdv9{font-size:12px;color:#fff;min-width:50px;text-align:center;font-family:system-ui,sans-serif}.animot-arrow.svelte-16ocdv9{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;background:#00000080;color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s .15s;z-index:100;padding:0;margin:0}.animot-presenter.svelte-16ocdv9:hover .animot-arrow:where(.svelte-16ocdv9){opacity:1;transition-delay:0s}.animot-presenter.svelte-16ocdv9:hover .animot-arrow:where(.svelte-16ocdv9):disabled{opacity:.3;cursor:not-allowed}.animot-arrow.svelte-16ocdv9:hover:not(:disabled){background:#000000b3}.animot-arrow.svelte-16ocdv9 svg:where(.svelte-16ocdv9){width:20px;height:20px}.animot-arrow-left.svelte-16ocdv9{left:8px}.animot-arrow-right.svelte-16ocdv9{right:8px}.animot-progress-bar.svelte-16ocdv9{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff1a;z-index:100;opacity:0;transition:opacity .3s .15s}.animot-presenter.svelte-16ocdv9:hover .animot-progress-bar:where(.svelte-16ocdv9){opacity:1;transition-delay:0s}.animot-progress-fill.svelte-16ocdv9{height:100%;background:linear-gradient(135deg,#7c3aed,#ec4899);transition:width .6s ease}.animot-loading.svelte-16ocdv9{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.animot-spinner.svelte-16ocdv9{width:32px;height:32px;border:3px solid rgba(255,255,255,.2);border-top-color:#7c3aed;border-radius:50%;animation:svelte-16ocdv9-animot-spin .8s linear infinite}@keyframes svelte-16ocdv9-animot-spin{to{transform:rotate(360deg)}}.animot-error.svelte-16ocdv9{color:#ef4444;padding:20px;text-align:center;font-family:system-ui,sans-serif}