.tool-icon .tia{transform-box:fill-box;transform-origin:50%}.tool-icon-duo [fill-opacity]{fill:var(--color-paper);fill-opacity:1}:is(.tool-icon-trigger:hover,.tool-icon-trigger:focus-visible) .tool-icon .tia,.tool-icon.is-playing .tia{animation:var(--ti-anim)}.tool-icon .merge-l{--ti-anim:ti-merge-l 1.2s cubic-bezier(.5, 0, .3, 1)}.tool-icon .merge-r{--ti-anim:ti-merge-r 1.2s cubic-bezier(.5, 0, .3, 1)}@keyframes ti-merge-l{40%,60%{transform:translate(3.5px)}}@keyframes ti-merge-r{40%,60%{transform:translate(-3.5px)}}.tool-icon :is(.snip-a,.snip-b){transform-box:view-box;transform-origin:12px 12px}.tool-icon .snip-a{--ti-anim:ti-snip-a 1s ease-in-out}.tool-icon .snip-b{--ti-anim:ti-snip-b 1s ease-in-out}@keyframes ti-snip-a{25%,75%{transform:rotate(-13deg)}50%{transform:none}}@keyframes ti-snip-b{25%,75%{transform:rotate(13deg)}50%{transform:none}}.tool-icon .squash{--ti-anim:ti-squash 1.2s ease-in-out}.tool-icon .push-l{--ti-anim:ti-push-l 1.2s ease-in-out}.tool-icon .push-r{--ti-anim:ti-push-r 1.2s ease-in-out}@keyframes ti-squash{45%,60%{transform:scale(.72,.9)}}@keyframes ti-push-l{45%,60%{transform:translate(2.5px)}}@keyframes ti-push-r{45%,60%{transform:translate(-2.5px)}}.tool-icon .swap-a{--ti-anim:ti-swap-a 1.4s cubic-bezier(.6, 0, .3, 1)}.tool-icon .swap-d{--ti-anim:ti-swap-d 1.4s cubic-bezier(.6, 0, .3, 1)}@keyframes ti-swap-a{40%,60%{transform:translate(10px,10px)}}@keyframes ti-swap-d{40%,60%{transform:translate(-10px,-10px)}}.tool-icon .turn{--ti-anim:ti-turn 1.3s cubic-bezier(.6, 0, .3, 1.2)}@keyframes ti-turn{40%,60%{transform:rotate(90deg)scale(.85)}}.tool-icon .drop{--ti-anim:ti-drop 1.3s ease-in}@keyframes ti-drop{50%{opacity:0;transform:translate(3px,6px)rotate(20deg)}51%{opacity:0;transform:none}to{opacity:1}}.tool-icon .lift{--ti-anim:ti-lift 1s cubic-bezier(.2, .8, .3, 1.3)}@keyframes ti-lift{0%{opacity:0;transform:translate(-4px,5px)scale(.5)}30%{opacity:0}}.tool-icon .slide-in{--ti-anim:ti-slide-in 1s cubic-bezier(.2, .8, .3, 1.2)}@keyframes ti-slide-in{0%{opacity:0;transform:translate(-9px,-4px)rotate(-14deg)}25%{opacity:0}}.tool-icon .pop-out{--ti-anim:ti-pop-out .9s cubic-bezier(.2, .8, .3, 1.4)}.tool-icon .bounce{--ti-anim:ti-bounce .6s ease-in-out .7s}@keyframes ti-pop-out{0%{opacity:0;transform:translate(-5px,-5px)scale(.4)}20%{opacity:0}}@keyframes ti-bounce{40%{transform:translateY(-2px)}}.tool-icon .badge{--ti-anim:ti-badge .9s cubic-bezier(.2, .8, .3, 1.5)}@keyframes ti-badge{0%,20%{opacity:0;transform:scale(.2)}60%{opacity:1;transform:scale(1.2)}}.tool-icon .stamp{--ti-anim:ti-stamp 1.2s cubic-bezier(.5, 0, .3, 1)}.tool-icon .ink{stroke-dasharray:1;--ti-anim:ti-draw .5s ease-out .5s both}@keyframes ti-stamp{20%{transform:translateY(-3px)}45%{transform:translateY(2.5px)}65%{transform:translateY(-1px)}}.tool-icon .grow{--ti-anim:ti-grow 1.3s cubic-bezier(.5, 0, .3, 1.2);transform-origin:0 100%}@keyframes ti-grow{40%,60%{transform:scale(1.63)}}.tool-icon .spin{--ti-anim:ti-spin 1s cubic-bezier(.6, 0, .3, 1)}@keyframes ti-spin{to{transform:rotate(180deg)}}.tool-icon .eq-1{--ti-anim:ti-eq .9s ease-in-out}.tool-icon .eq-2{--ti-anim:ti-eq .9s ease-in-out .12s}.tool-icon .eq-3{--ti-anim:ti-eq .9s ease-in-out .24s}@keyframes ti-eq{30%{transform:scaleY(.45)}65%{transform:scaleY(1.3)}}.tool-icon .write{stroke-dasharray:1;--ti-anim:ti-draw .45s ease-out both}.tool-icon .w2{--ti-anim:ti-draw .4s ease-out .15s both}.tool-icon .w3{--ti-anim:ti-draw .45s ease-out .3s both}.tool-icon .w4{--ti-anim:ti-draw .45s ease-out .45s both}.tool-icon .w5{--ti-anim:ti-draw .4s ease-out .6s both}.tool-icon .w-long{--ti-anim:ti-draw 1s ease-in-out both}@keyframes ti-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.tool-icon .pen{--ti-anim:ti-pen 1s ease-in-out}@keyframes ti-pen{0%{transform:translate(-9px,3px)rotate(-8deg)}25%{transform:translate(-7px,2px)rotate(4deg)}50%{transform:translate(-4px,2.5px)rotate(-6deg)}75%{transform:translate(-1px,1.5px)rotate(4deg)}}.tool-icon .arrow{--ti-anim:ti-arrow .7s cubic-bezier(.5, 0, .8, .6)}.tool-icon .pulse{--ti-anim:ti-pulse .5s ease-out .65s}@keyframes ti-arrow{0%{opacity:0;transform:translate(7px,-7px)}30%{opacity:1}}@keyframes ti-pulse{50%{transform:scale(1.12)}}.tool-icon .erase{--ti-anim:ti-erase 1.4s ease-in-out}@keyframes ti-erase{35%,65%{opacity:0}}.tool-icon .swish{--ti-anim:ti-swish 1.3s ease-in-out;transform-box:view-box;transform-origin:12px 5px}.tool-icon .twinkle{--ti-anim:ti-twinkle 1.3s ease-in-out;vector-effect:non-scaling-stroke}@keyframes ti-swish{25%{transform:rotate(-8deg)}55%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}@keyframes ti-twinkle{40%{transform:scale(1.5)rotate(45deg)}70%{transform:scale(.8)rotate(90deg)}}.tool-icon :is(.grow,.squash) *{vector-effect:non-scaling-stroke}.upsell{--upsell-out:cubic-bezier(.3, .7, .3, 1);--upsell-pop:cubic-bezier(.3, .7, .3, 1.25)}.upsell[open]{animation:upsell-in .34s var(--upsell-pop) both}.upsell[open]::backdrop{animation:.25s ease-out both upsell-fade}@keyframes upsell-in{0%{opacity:0;transform:translateY(28px)scale(.92)}}@keyframes upsell-fade{0%{opacity:0}}.upsell-glow{z-index:-1;filter:blur(42px);opacity:.4;border-radius:9999px;animation:9s ease-in-out infinite alternate upsell-drift;position:absolute}.upsell-glow-sky{top:-35%;background:var(--color-brand-sky);width:15rem;height:12rem;inset-inline-start:-18%}.upsell-glow-pink{bottom:-45%;background:var(--color-brand-pink);width:15rem;height:12rem;animation-duration:11s;animation-direction:alternate-reverse;inset-inline-end:-15%}.upsell-glow-lavender{top:-20%;background:var(--color-brand-lavender);width:9rem;height:8rem;animation-duration:7.5s;animation-delay:-3s;inset-inline-end:5%}@keyframes upsell-drift{to{transform:translate(2.5rem,1.5rem)scale(1.15)}}.upsell-dots{z-index:-1;background-image:radial-gradient(color-mix(in srgb, var(--color-on-dark) 16%, transparent) 1.2px, transparent 1.3px);background-size:18px 18px;position:absolute;inset:0;mask-image:radial-gradient(70% 80% at 50% 30%,#000 10%,#0000 75%)}.upsell-rays{aspect-ratio:1;background:repeating-conic-gradient(color-mix(in srgb, var(--color-brand-lemon) 30%, transparent) 0deg 8deg, transparent 8deg 24deg);pointer-events:none;border-radius:9999px;width:15rem;animation:32s linear infinite upsell-spin;position:absolute;top:50%;left:50%;translate:-50% -50%;mask-image:radial-gradient(closest-side,#000 20%,#0000 100%)}@keyframes upsell-spin{to{rotate:360deg}}.upsell-float{animation:3.6s ease-in-out .9s infinite upsell-bob}.upsell-crown{animation:upsell-drop .65s var(--upsell-out) .1s both}@keyframes upsell-drop{0%{opacity:0;transform:translateY(-56px)rotate(-28deg)scale(.6)}55%{opacity:1;transform:translateY(5px)rotate(7deg)scale(1.08)}78%{transform:translateY(-2px)rotate(-3deg)scale(.98)}to{opacity:1;transform:none}}.upsell-halo{border:2px solid var(--color-brand-lemon);pointer-events:none;border-radius:9999px;animation:2.8s ease-out .6s infinite both upsell-halo;position:absolute;inset:0}@keyframes upsell-halo{0%{opacity:0;transform:scale(.95)}8%{opacity:.9;transform:scale(1)}60%,to{opacity:0;transform:scale(1.75)}}.upsell-spark{animation:2.2s ease-in-out infinite both upsell-twinkle}.upsell-spark-2{animation-duration:2.9s;animation-delay:-1.1s}.upsell-spark-3{animation-duration:1.9s;animation-delay:-.5s}@keyframes upsell-twinkle{0%,to{opacity:1;transform:scale(1)rotate(0)}50%{opacity:.3;transform:scale(.45)rotate(45deg)}}.upsell-sticker{animation:upsell-pop .45s var(--upsell-pop) .26s both}.upsell-stickers>:nth-child(2) .upsell-sticker{animation-delay:.32s}.upsell-stickers>:nth-child(3) .upsell-sticker{animation-delay:.38s}.upsell-stickers>:nth-child(4) .upsell-sticker{animation-delay:.44s}.upsell-bob{animation:4.2s ease-in-out infinite upsell-bob}.upsell-stickers>:nth-child(2) .upsell-bob{animation-duration:3.7s;animation-delay:-1.1s}.upsell-stickers>:nth-child(3) .upsell-bob{animation-duration:4.8s;animation-delay:-2.2s}.upsell-stickers>:nth-child(4) .upsell-bob{animation-duration:5.2s;animation-delay:-.6s}.upsell-sticker .tool-icon.is-playing .tia{animation-delay:.6s}@keyframes upsell-bob{50%{translate:0 -6px}}@keyframes upsell-pop{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:none}}.upsell-rise{animation:upsell-rise .4s var(--upsell-out) .16s both}@keyframes upsell-rise{0%{opacity:0;transform:translateY(12px)}}.upsell-perks>li{--upsell-at:.22s;animation:upsell-rise .4s var(--upsell-out) var(--upsell-at) both}.upsell-perks>li:nth-child(2){--upsell-at:.27s}.upsell-perks>li:nth-child(3){--upsell-at:.32s}.upsell-perks>li:nth-child(4){--upsell-at:.37s}.upsell-perks>li:nth-child(5){--upsell-at:.42s}.upsell-perks>li:nth-child(6){--upsell-at:.47s}.upsell-perks>li:nth-child(n+7){--upsell-at:.52s}.upsell-tick{animation:upsell-tick .45s var(--upsell-pop) calc(var(--upsell-at) + .12s) both}@keyframes upsell-tick{0%{transform:scale(.2)rotate(-30deg)}to{transform:none}}.upsell-cta{animation:upsell-pop .4s var(--upsell-pop) .42s both}.upsell-cta:is(:hover,:focus-visible) .upsell-cta-crown{animation:.5s ease-in-out upsell-wiggle}@keyframes upsell-wiggle{25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}@media (prefers-reduced-motion:reduce){.upsell[open],.upsell[open]::backdrop,.upsell *,.upsell :after{animation:none!important}.upsell-halo,.upsell-cta:after{display:none}}
