@nice2dev/icons 1.3.17 → 1.3.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +30 -0
- package/README.md +20 -0
- package/dist/cjs/animationControls.js +10 -5
- package/dist/cjs/animationSpeed.js +33 -0
- package/dist/cjs/createIcon.js +26 -6
- package/dist/cjs/iconStyles.js +56 -22
- package/dist/cjs/reducedMotion.js +30 -0
- package/dist/cjs/smilAnimations.js +5 -1
- package/dist/cjs/utilities.js +4 -25
- package/dist/esm/animationControls.js +10 -5
- package/dist/esm/animationSpeed.js +34 -1
- package/dist/esm/createIcon.js +28 -8
- package/dist/esm/iconStyles.js +57 -23
- package/dist/esm/nicetodev-icons.css +1 -1
- package/dist/esm/reducedMotion.js +30 -0
- package/dist/esm/smilAnimations.js +6 -2
- package/dist/esm/utilities.js +5 -26
- package/dist/types/animationSpeed.d.ts +9 -0
- package/dist/types/iconStyles.d.ts +6 -0
- package/dist/types/reducedMotion.d.ts +6 -0
- package/dist/types/smilAnimations.d.ts +7 -1
- package/dist/types/types.d.ts +19 -0
- package/dist/types/utilities.d.ts +2 -2
- package/package.json +2 -2
- package/dist/cjs/nicetodev-icons.css +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.ntd-icon{display:inline-block;vertical-align:-.125em;flex-shrink:0;transition:color .2s ease,transform .2s ease}.ntd-anim-spin{animation:ntd-spin calc(1s * var(--ntd-anim-scale, 2)) linear infinite}.ntd-anim-spin-reverse{animation:ntd-spin calc(1s * var(--ntd-anim-scale, 2)) linear infinite reverse}@keyframes ntd-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ntd-anim-pulse{animation:ntd-pulse calc(2s * var(--ntd-anim-scale, 2)) cubic-bezier(.4,0,.6,1) infinite}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce calc(1s * var(--ntd-anim-scale, 2)) ease infinite}@keyframes ntd-bounce{0%,to{transform:translateY(0);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0,0,.2,1)}}.ntd-anim-shake{animation:ntd-shake calc(.6s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.ntd-anim-float{animation:ntd-float calc(3s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-flip{0%{transform:perspective(400px) rotateY(0)}40%{transform:perspective(400px) rotateY(170deg)}50%{transform:perspective(400px) rotateY(190deg)}80%{transform:perspective(400px) rotateY(360deg)}to{transform:perspective(400px) rotateY(360deg)}}.ntd-anim-turn{animation:ntd-turn var(--ntd-anim-duration, calc(4s * var(--ntd-anim-scale, 2))) infinite}@keyframes ntd-turn{0%{transform:rotate(0);animation-timing-function:cubic-bezier(.65,0,.35,1)}12.5%,50%{transform:rotate(180deg);animation-timing-function:cubic-bezier(.65,0,.35,1)}62.5%,to{transform:rotate(0)}}.ntd-anim-turn .ntd-hourglass-sand{transform-box:view-box;animation-duration:var(--ntd-anim-duration, calc(4s * var(--ntd-anim-scale, 2)));animation-timing-function:linear;animation-iteration-count:infinite}.ntd-anim-turn .ntd-hourglass-sand--top-neck{transform-origin:12px 11.4px;animation-name:ntd-hourglass-top-neck}.ntd-anim-turn .ntd-hourglass-sand--top-base{transform-origin:12px 5.8px;animation-name:ntd-hourglass-top-base}.ntd-anim-turn .ntd-hourglass-sand--bottom-neck{transform-origin:12px 12.6px;animation-name:ntd-hourglass-bottom-neck}.ntd-anim-turn .ntd-hourglass-sand--bottom-base{transform-origin:12px 18.2px;animation-name:ntd-hourglass-bottom-base}.ntd-anim-turn .ntd-hourglass-sand--stream-up{animation-name:ntd-hourglass-stream-up}.ntd-anim-turn .ntd-hourglass-sand--stream-down{animation-name:ntd-hourglass-stream-down}@keyframes ntd-hourglass-top-base{0%,12.5%{transform:scaleY(0)}50%,62.5%{transform:scaleY(1)}62.6%,to{transform:scaleY(0)}}@keyframes ntd-hourglass-top-neck{0%,50%{transform:scale(0)}50.1%,62.5%{transform:scale(1)}to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-neck{0%,12.5%{transform:scale(1)}50%,to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-base{0%,62.5%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes ntd-hourglass-stream-up{0%,13%,49.5%,to{opacity:0}14%,48.5%{opacity:1}}@keyframes ntd-hourglass-stream-down{0%,63%,99.5%,to{opacity:0}64%,98.5%{opacity:1}}.ntd-anim-glow{animation:ntd-glow calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-glow{0%,to{filter:drop-shadow(0 0 2px currentColor)}50%{filter:drop-shadow(0 0 12px currentColor) drop-shadow(0 0 20px currentColor)}}.ntd-anim-wiggle{animation:ntd-wiggle calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-rubber{0%{transform:scale(1)}30%{transform:scaleX(1.25) scaleY(.75)}40%{transform:scaleX(.75) scaleY(1.25)}50%{transform:scaleX(1.15) scaleY(.85)}65%{transform:scaleX(.95) scaleY(1.05)}75%{transform:scaleX(1.05) scaleY(.95)}to{transform:scale(1)}}.ntd-anim-swing{animation:ntd-swing calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite;transform-origin:top center}@keyframes ntd-swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0)}}.ntd-anim-tada{animation:ntd-tada calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0)}10%,20%{transform:scale(.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}to{transform:scale(1) rotate(0)}}.ntd-anim-heartbeat{animation:ntd-heartbeat calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-heartbeat{0%{transform:scale(1)}14%{transform:scale(1.3)}28%{transform:scale(1)}42%{transform:scale(1.3)}70%{transform:scale(1)}}.ntd-anim-fade-in{animation:ntd-fade-in calc(.5s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ntd-anim-slide-up{animation:ntd-slide-up calc(.4s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-jello{animation:ntd-jello calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skew(0) skewY(0)}11.1%{transform:skew(-12.5deg) skewY(-12.5deg)}22.2%{transform:skew(6.25deg) skewY(6.25deg)}33.3%{transform:skew(-3.125deg) skewY(-3.125deg)}44.4%{transform:skew(1.5625deg) skewY(1.5625deg)}55.5%{transform:skew(-.78125deg) skewY(-.78125deg)}66.6%{transform:skew(.390625deg) skewY(.390625deg)}77.7%{transform:skew(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop calc(.6s * var(--ntd-anim-scale, 2)) ease-out infinite}@keyframes ntd-pop{0%{transform:scale(1)}15%{transform:scale(1.35)}30%{transform:scale(.9)}45%{transform:scale(1.1)}60%{transform:scale(.97)}75%{transform:scale(1.03)}to{transform:scale(1)}}.ntd-anim-squeeze{animation:ntd-squeeze calc(1.4s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-squeeze{0%,to{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(.7) scaleY(1.3)}50%{transform:scaleX(1) scaleY(1)}75%{transform:scaleX(1.3) scaleY(.7)}}.ntd-anim-drop{animation:ntd-drop calc(.8s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-drop{0%{opacity:0;transform:translateY(-40px) scale(.8)}60%{opacity:1;transform:translateY(4px) scale(1.05)}75%{transform:translateY(-2px) scale(.98)}90%{transform:translateY(1px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-rise{animation:ntd-rise calc(.7s * var(--ntd-anim-scale, 2)) cubic-bezier(.16,1,.3,1) forwards}@keyframes ntd-rise{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-slide-left{animation:ntd-slide-left calc(.5s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.ntd-anim-slide-right{animation:ntd-slide-right calc(.5s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.ntd-anim-slide-down{animation:ntd-slide-down calc(.4s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-roll-in{animation:ntd-roll-in calc(.8s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translate(-100%) rotate(-120deg)}to{opacity:1;transform:translate(0) rotate(0)}}.ntd-anim-flash{animation:ntd-flash calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate calc(.3s * var(--ntd-anim-scale, 2)) linear infinite}@keyframes ntd-vibrate{0%{transform:translate(0)}20%{transform:translate(-1px,1px)}40%{transform:translate(1px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}to{transform:translate(0)}}.ntd-anim-wobble{animation:ntd-wobble calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translate(0) rotate(0)}15%{transform:translate(-15%) rotate(-5deg)}30%{transform:translate(10%) rotate(3deg)}45%{transform:translate(-10%) rotate(-3deg)}60%{transform:translate(5%) rotate(2deg)}75%{transform:translate(-3%) rotate(-1deg)}to{transform:translate(0) rotate(0)}}.ntd-anim-spiral{animation:ntd-spiral calc(2s * var(--ntd-anim-scale, 2)) linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0) scale(.8)}25%{transform:rotate(90deg) scale(1.1)}50%{transform:rotate(180deg) scale(.8)}75%{transform:rotate(270deg) scale(1.1)}to{transform:rotate(360deg) scale(.8)}}.ntd-anim-ping{animation:ntd-ping calc(1.5s * var(--ntd-anim-scale, 2)) ease-out infinite}@keyframes ntd-ping{0%{transform:scale(1);opacity:1}70%{transform:scale(1.6);opacity:0}71%{transform:scale(1);opacity:0}to{transform:scale(1);opacity:1}}.ntd-anim-flicker{animation:ntd-flicker calc(1.5s * var(--ntd-anim-scale, 2)) steps(1) infinite}@keyframes ntd-flicker{0%{opacity:1}4%{opacity:.3}8%{opacity:1}12%{opacity:.6}16%{opacity:1}20%{opacity:.2}22%{opacity:1}50%{opacity:1}52%{opacity:.4}54%{opacity:1}80%{opacity:1}82%{opacity:.3}85%{opacity:1}90%{opacity:.5}92%{opacity:1}}.ntd-anim-tilt{animation:ntd-tilt calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe calc(4s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-breathe{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.85}}.ntd-anim-drift{animation:ntd-drift calc(4s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(5px) rotate(1deg)}50%{transform:translate(0) rotate(0)}75%{transform:translate(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit calc(3s * var(--ntd-anim-scale, 2)) linear infinite}@keyframes ntd-orbit{0%{transform:translate(0)}25%{transform:translate(4px,-4px)}50%{transform:translateY(-6px)}75%{transform:translate(-4px,-4px)}to{transform:translate(0)}}.ntd-anim-crush{animation:ntd-crush calc(.8s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-crush{0%,to{transform:scaleY(1) scaleX(1)}40%{transform:scaleY(.3) scaleX(1.3)}60%{transform:scaleY(1.15) scaleX(.9)}80%{transform:scaleY(.95) scaleX(1.02)}}.ntd-anim-stretch{animation:ntd-stretch calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-stretch{0%,to{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(1.4) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}}.ntd-anim-dissolve{animation:ntd-dissolve calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-dissolve{0%,to{opacity:1;filter:blur(0)}50%{opacity:.1;filter:blur(4px)}}.ntd-anim-materialize{animation:ntd-materialize calc(.8s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-materialize{0%{opacity:0;filter:blur(8px);transform:scale(.6)}60%{opacity:.8;filter:blur(1px);transform:scale(1.05)}to{opacity:1;filter:blur(0);transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway calc(2.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble calc(.15s * var(--ntd-anim-scale, 2)) linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0)}25%{transform:translate(-.5px,.5px) rotate(-.5deg)}50%{transform:translate(.5px,-.5px) rotate(.5deg)}75%{transform:translate(-.5px,-.5px) rotate(-.5deg)}to{transform:translate(0) rotate(0)}}.ntd-anim-rock{animation:ntd-rock calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0) rotateY(0)}25%{transform:perspective(300px) rotateX(10deg) rotateY(10deg)}50%{transform:perspective(300px) rotateX(-5deg) rotateY(-10deg)}75%{transform:perspective(300px) rotateX(8deg) rotateY(-5deg)}}.ntd-anim-glitch{animation:ntd-glitch calc(.8s * var(--ntd-anim-scale, 2)) steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skew(2deg)}10%{transform:translate(3px,-1px) skew(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skew(-3deg)}44%{transform:translate(-2px,-2px) skew(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skew(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple calc(1.6s * var(--ntd-anim-scale, 2)) ease-out infinite}@keyframes ntd-ripple{0%{transform:scale(1);opacity:1}30%{transform:scale(1.15);opacity:.8}50%{transform:scale(1);opacity:1}70%{transform:scale(1.08);opacity:.9}to{transform:scale(1);opacity:1}}.ntd-anim-implode{animation:ntd-implode calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-implode{0%,to{transform:scale(1);opacity:1}40%{transform:scale(.2) rotate(20deg);opacity:.3}60%{transform:scale(.15) rotate(25deg);opacity:.2}80%{transform:scale(1.1) rotate(0);opacity:1}}.ntd-anim-explode{animation:ntd-explode calc(1.4s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-explode{0%,to{transform:scale(1);opacity:1}30%{transform:scale(1.8);opacity:.6}50%{transform:scale(2);opacity:0}51%{transform:scale(.5);opacity:0}70%{transform:scale(1.1);opacity:.8}85%{transform:scale(.95);opacity:1}}.ntd-anim-rotate-x{animation:ntd-rotate-x calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0)}to{transform:perspective(400px) rotateX(360deg)}}.ntd-anim-morph{animation:ntd-morph calc(3s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-morph{0%,to{transform:scaleX(1) scaleY(1) rotate(0);border-radius:0}20%{transform:scaleX(1.1) scaleY(.9) rotate(2deg)}40%{transform:scaleX(.9) scaleY(1.1) rotate(-1deg)}60%{transform:scaleX(1.05) scaleY(.95) rotate(1deg)}80%{transform:scaleX(.95) scaleY(1.05) rotate(-2deg)}}.ntd-anim-levitate{animation:ntd-levitate calc(3s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-levitate{0%,to{transform:translateY(0);filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}50%{transform:translateY(-10px);filter:drop-shadow(0 12px 8px rgba(0,0,0,.1))}}.ntd-anim-dash{animation:ntd-dash calc(.8s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-dash{0%,to{transform:translate(0) scaleX(1);opacity:1}30%{transform:translate(-3px) scaleX(.9);opacity:.8}60%{transform:translate(15px) scaleX(1.15);opacity:.6}80%{transform:translate(2px) scaleX(1);opacity:.9}}.ntd-anim-twist{animation:ntd-twist calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp calc(1s * var(--ntd-anim-scale, 2)) ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-stomp{0%,to{transform:translateY(0) scaleY(1) scaleX(1)}20%{transform:translateY(-15px) scaleY(1.1) scaleX(.95)}50%{transform:translateY(0) scaleY(.7) scaleX(1.2)}65%{transform:translateY(-3px) scaleY(1.05) scaleX(.98)}80%{transform:translateY(0) scaleY(.95) scaleX(1.03)}}.ntd-anim-flap{animation:ntd-flap calc(.6s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(8px) rotate(2deg)}50%{transform:translate(0) rotate(0)}75%{transform:translate(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink calc(1.4s * var(--ntd-anim-scale, 2)) steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal calc(1s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-reveal{0%{clip-path:circle(0% at 50% 50%);opacity:.5}to{clip-path:circle(75% at 50% 50%);opacity:1}}.ntd-anim-vortex{animation:ntd-vortex calc(.8s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-vortex{0%{transform:rotate(-540deg) scale(0);opacity:0}60%{transform:rotate(20deg) scale(1.1);opacity:1}80%{transform:rotate(-10deg) scale(.95)}to{transform:rotate(0) scale(1);opacity:1}}.ntd-anim-meteor{animation:ntd-meteor calc(.7s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-meteor{0%{transform:translate(30px,-30px) rotate(15deg) scale(.5);opacity:0}70%{transform:translate(-2px,2px) rotate(-2deg) scale(1.05);opacity:1}to{transform:translate(0) rotate(0) scale(1);opacity:1}}.ntd-anim-scale-in{animation:ntd-scale-in calc(.5s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.ntd-anim-scale-out{animation:ntd-scale-out calc(.4s * var(--ntd-anim-scale, 2)) ease-in forwards}@keyframes ntd-scale-out{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}.ntd-anim-pendulum{animation:ntd-pendulum calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0)}25%{transform:rotate(25deg)}50%{transform:rotate(0)}75%{transform:rotate(-25deg)}to{transform:rotate(0)}}.ntd-anim-surge{animation:ntd-surge calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-surge{0%,to{transform:scale(1);filter:drop-shadow(0 0 0 currentColor)}15%{transform:scale(1.2);filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor)}30%{transform:scale(.95);filter:drop-shadow(0 0 2px currentColor)}45%{transform:scale(1.1);filter:drop-shadow(0 0 6px currentColor)}60%{transform:scale(1);filter:drop-shadow(0 0 0 currentColor)}}.ntd-anim-radar{animation:ntd-radar calc(2s * var(--ntd-anim-scale, 2)) linear infinite}@keyframes ntd-radar{0%{transform:rotate(0);opacity:1}50%{opacity:.4}to{transform:rotate(360deg);opacity:1}}.ntd-anim-typewriter{animation:ntd-typewriter calc(1s * var(--ntd-anim-scale, 2)) steps(12) forwards}@keyframes ntd-typewriter{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.ntd-anim-unfold{animation:ntd-unfold calc(.7s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-unfold{0%{transform:scaleY(.05) scaleX(1.3);opacity:.3}50%{transform:scaleY(1.1) scaleX(.95);opacity:.9}70%{transform:scaleY(.95) scaleX(1.02);opacity:1}to{transform:scaleY(1) scaleX(1);opacity:1}}.ntd-anim-fold{animation:ntd-fold calc(.6s * var(--ntd-anim-scale, 2)) ease-in forwards}@keyframes ntd-fold{0%{transform:scaleY(1) scaleX(1);opacity:1}to{transform:scaleY(.05) scaleX(1.3);opacity:0}}.ntd-anim-scatter{animation:ntd-scatter calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-scatter{0%,to{transform:scale(1) rotate(0);opacity:1;filter:blur(0)}20%{transform:scale(1.3) rotate(5deg);opacity:.6;filter:blur(2px)}40%{transform:scale(1.5) rotate(-3deg);opacity:.2;filter:blur(4px)}50%{transform:scale(.8) rotate(0);opacity:0;filter:blur(6px)}65%{transform:scale(.6) rotate(-5deg);opacity:.3;filter:blur(3px)}80%{transform:scale(.95) rotate(2deg);opacity:.8;filter:blur(1px)}}.ntd-anim-assemble{animation:ntd-assemble calc(1s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-assemble{0%{transform:scale(2) rotate(15deg);opacity:0;filter:blur(8px)}30%{transform:scale(.8) rotate(-5deg);opacity:.5;filter:blur(3px)}60%{transform:scale(1.1) rotate(2deg);opacity:.9;filter:blur(1px)}80%{transform:scale(.97) rotate(-1deg);opacity:1;filter:blur(0)}to{transform:scale(1) rotate(0);opacity:1;filter:blur(0)}}.ntd-anim-neon{animation:ntd-neon calc(2s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-neon{0%,to{opacity:1;filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}10%{opacity:.4;filter:drop-shadow(0 0 0 currentColor)}11%{opacity:1;filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}15%{opacity:.3;filter:drop-shadow(0 0 0 currentColor)}16%{opacity:1;filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}50%{opacity:1;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor)}}.ntd-anim-earthquake{animation:ntd-earthquake calc(.5s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-earthquake{0%,to{transform:translate(0)}10%{transform:translate(-4px,2px) rotate(-1deg)}20%{transform:translate(3px,-3px) rotate(1deg)}30%{transform:translate(-2px,4px) rotate(-2deg)}40%{transform:translate(4px,-1px) rotate(2deg)}50%{transform:translate(-3px,3px) rotate(-1deg)}60%{transform:translate(2px,-4px) rotate(1deg)}70%{transform:translate(-4px,1px) rotate(-2deg)}80%{transform:translate(3px,2px) rotate(2deg)}90%{transform:translate(-1px,-3px) rotate(-1deg)}}.ntd-anim-signature{transform-origin:center;animation:ntd-signature-enter calc(.65s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}.ntd-anim-signature path,.ntd-anim-signature line,.ntd-anim-signature polyline,.ntd-anim-signature polygon,.ntd-anim-signature circle,.ntd-anim-signature rect,.ntd-anim-signature ellipse{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke calc(1.7s * var(--ntd-anim-scale, 2)) ease-out calc(.05s * var(--ntd-anim-scale, 2)) forwards,ntd-signature-fill calc(.55s * var(--ntd-anim-scale, 2)) ease-out calc(1.05s * var(--ntd-anim-scale, 2)) forwards;filter:drop-shadow(0 0 0 currentColor)}@keyframes ntd-signature-enter{0%{opacity:.08;transform:scale(.05) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(0)}to{opacity:1;transform:scale(1)}}@keyframes ntd-signature-stroke{0%{stroke-dashoffset:150;filter:drop-shadow(0 0 0 currentColor)}65%{stroke-dashoffset:0;filter:drop-shadow(0 0 6px currentColor)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 2px currentColor)}}@keyframes ntd-signature-fill{0%{fill-opacity:.05}to{fill-opacity:1}}.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence circle,.ntd-anim-draw-sequence rect,.ntd-anim-draw-sequence ellipse{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence calc(1.6s * var(--ntd-anim-scale, 2)) ease-out forwards}.ntd-anim-draw-sequence path:nth-child(1),.ntd-anim-draw-sequence line:nth-child(1),.ntd-anim-draw-sequence polyline:nth-child(1),.ntd-anim-draw-sequence polygon:nth-child(1),.ntd-anim-draw-sequence circle:nth-child(1),.ntd-anim-draw-sequence rect:nth-child(1),.ntd-anim-draw-sequence ellipse:nth-child(1){animation-delay:calc(0s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2){animation-delay:calc(.2s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3){animation-delay:calc(.4s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-sequence{0%{stroke-dashoffset:160;fill-opacity:0}75%{stroke-dashoffset:0;fill-opacity:.15}to{stroke-dashoffset:0;fill-opacity:1}}.ntd-anim-stroke-order path,.ntd-anim-stroke-order line,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order circle,.ntd-anim-stroke-order rect,.ntd-anim-stroke-order ellipse{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order calc(2s * var(--ntd-anim-scale, 2)) linear forwards}@keyframes ntd-stroke-order{0%{stroke-dashoffset:220;opacity:.2}30%{opacity:1}to{stroke-dashoffset:0;opacity:1}}.ntd-anim-glow-trace path,.ntd-anim-glow-trace line,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace circle,.ntd-anim-glow-trace rect,.ntd-anim-glow-trace ellipse{stroke-dasharray:180;animation:ntd-glow-trace calc(2.8s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-glow-trace{0%{stroke-dashoffset:180;filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{stroke-dashoffset:0;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 14px currentColor);opacity:1}to{stroke-dashoffset:-180;filter:drop-shadow(0 0 2px currentColor);opacity:.5}}.ntd-anim-seal-stamp{transform-origin:center;animation:ntd-seal-stamp calc(.75s * var(--ntd-anim-scale, 2)) cubic-bezier(.22,1,.36,1) forwards}@keyframes ntd-seal-stamp{0%{opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg);filter:blur(2px)}45%{opacity:1;transform:translateY(2px) scale(.94) rotate(0);filter:blur(0)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw path,.ntd-anim-draw line,.ntd-anim-draw polyline,.ntd-anim-draw polygon,.ntd-anim-draw circle,.ntd-anim-draw rect,.ntd-anim-draw ellipse{stroke-dasharray:120;stroke-dashoffset:120;animation:ntd-draw-stroke calc(1.2s * var(--ntd-anim-scale, 2)) ease-out forwards,ntd-draw-fill calc(.4s * var(--ntd-anim-scale, 2)) ease-out calc(.8s * var(--ntd-anim-scale, 2)) forwards;fill-opacity:0}@keyframes ntd-draw-stroke{0%{stroke-dashoffset:120}to{stroke-dashoffset:0}}@keyframes ntd-draw-fill{0%{fill-opacity:0}to{fill-opacity:1}}.ntd-anim-draw-from-dot{transform-origin:center;animation:ntd-draw-dot-enter calc(.45s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot rect,.ntd-anim-draw-from-dot ellipse{stroke-dasharray:140;stroke-dashoffset:140;animation:ntd-draw-dot-stroke calc(1.35s * var(--ntd-anim-scale, 2)) ease-out calc(.15s * var(--ntd-anim-scale, 2)) forwards,ntd-draw-fill calc(.45s * var(--ntd-anim-scale, 2)) ease-out calc(.95s * var(--ntd-anim-scale, 2)) forwards;fill-opacity:0}@keyframes ntd-draw-dot-enter{0%{opacity:.15;transform:scale(.08)}60%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes ntd-draw-dot-stroke{0%{stroke-dashoffset:140}to{stroke-dashoffset:0}}.ntd-anim-draw-loop path,.ntd-anim-draw-loop line,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop circle,.ntd-anim-draw-loop rect,.ntd-anim-draw-loop ellipse{stroke-dasharray:140;animation:ntd-draw-loop-stroke calc(2.4s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-draw-loop-stroke{0%{stroke-dashoffset:140;opacity:0}25%{stroke-dashoffset:0;opacity:1}60%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-140;opacity:.2}}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:circle(0% at 50% 50%);transform-box:fill-box;transform-origin:center;animation:ntd-draw-shape-pop calc(.7s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) calc(.35s * var(--ntd-anim-scale, 2)) forwards}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:calc(.5s * var(--ntd-anim-scale, 2))}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:calc(.65s * var(--ntd-anim-scale, 2))}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:calc(.8s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-shape-pop{0%{fill-opacity:0;clip-path:circle(0% at 50% 50%);transform:scale(.5)}60%{fill-opacity:.9;clip-path:circle(75% at 50% 50%);transform:scale(1.08)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:circle(0% at 50% 50%);transform-box:fill-box;transform-origin:center;animation:ntd-draw-dot-shape-burst calc(.65s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) calc(.25s * var(--ntd-anim-scale, 2)) forwards}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:calc(.4s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:calc(.55s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:calc(.7s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-dot-shape-burst{0%{fill-opacity:0;clip-path:circle(0% at 50% 50%);transform:scale(.1)}50%{fill-opacity:.85;clip-path:circle(65% at 50% 50%);transform:scale(1.14)}75%{clip-path:circle(88% at 50% 50%);transform:scale(.97)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom;animation:ntd-draw-seq-shape-wipe calc(.6s * var(--ntd-anim-scale, 2)) cubic-bezier(.22,1,.36,1) forwards}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(1){animation-delay:calc(0s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:calc(.2s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:calc(.4s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:calc(.6s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-seq-shape-wipe{0%{fill-opacity:0;clip-path:inset(100% 0 0 0);transform:scaleY(.6)}70%{fill-opacity:.9;clip-path:inset(5% 0 0 0);transform:scaleY(1.04)}to{fill-opacity:1;clip-path:inset(0 0 0 0);transform:scaleY(1)}}.ntd-anim-draw-loop :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-draw-loop-shape-pulse calc(2.4s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-draw-loop-shape-pulse{0%{clip-path:circle(0% at 50% 50%);opacity:0}25%{clip-path:circle(100% at 50% 50%);opacity:1}60%{clip-path:circle(100% at 50% 50%);opacity:1}to{clip-path:circle(0% at 50% 50%);opacity:.2}}.ntd-anim-signature :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:circle(0% at 50% 50%);transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 0 0 currentColor);animation:ntd-signature-shape-stamp calc(.8s * var(--ntd-anim-scale, 2)) cubic-bezier(.22,1,.36,1) calc(.5s * var(--ntd-anim-scale, 2)) forwards}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0% at 50% 50%);transform:scale(.35) rotate(-6deg);filter:drop-shadow(0 0 0 currentColor)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);transform:scale(1.08) rotate(0);filter:drop-shadow(0 0 8px currentColor)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1);filter:drop-shadow(0 0 2px currentColor)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:inset(0 100% 0 0);animation:ntd-stroke-order-shape-wipe calc(1.2s * var(--ntd-anim-scale, 2)) ease-out calc(.3s * var(--ntd-anim-scale, 2)) forwards}@keyframes ntd-stroke-order-shape-wipe{0%{fill-opacity:0;clip-path:inset(0 100% 0 0)}40%{fill-opacity:.7}to{fill-opacity:1;clip-path:inset(0 0 0 0)}}.ntd-anim-glow-trace :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-glow-trace-shape calc(2.8s * var(--ntd-anim-scale, 2)) ease-in-out infinite}@keyframes ntd-glow-trace-shape{0%{clip-path:circle(0% at 50% 50%);filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 16px currentColor);opacity:1}to{clip-path:circle(0% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);opacity:.4}}.nice-icon-stacker{display:flex;flex-direction:column;gap:var(--nice-space-3, 12px);min-width:0;color:var(--nice-text-primary, inherit);font-size:var(--nice-font-size-sm, .8125rem)}.nice-icon-stacker :where(button){display:inline-flex;align-items:center;gap:var(--nice-space-1-5, 6px);padding:var(--nice-space-1, 4px) var(--nice-space-2, 8px);border:1px solid transparent;border-radius:var(--nice-radius-md, 6px);background:transparent;color:inherit;font:inherit;cursor:pointer}.nice-icon-stacker :where(button:hover:not(:disabled)){background:var(--nice-bg-hover, var(--nice-bg-secondary, #f1f5f9))}.nice-icon-stacker :where(button:disabled){opacity:.45;cursor:not-allowed}.nice-icon-stacker :where(input[type=text]){box-sizing:border-box;width:5em;padding:var(--nice-space-1, 4px) var(--nice-space-2, 8px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-primary, #fff);color:var(--nice-text-primary, inherit);font:inherit}.nice-icon-stacker :where(input[type=range]){flex:1 1 auto;min-width:0;accent-color:var(--nice-color-primary, #3b82f6)}.nice-icon-stacker :where(button,input,summary):focus-visible{outline:none;box-shadow:var(--nice-focus-ring, 0 0 0 2px var(--nice-color-primary, #3b82f6))}.nice-icon-stacker__bar{display:flex;align-items:center;gap:var(--nice-space-1, 4px)}.nice-icon-stacker__title{flex:1 1 auto;color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem);font-weight:var(--nice-font-weight-semibold, 600);letter-spacing:.04em;text-transform:uppercase}.nice-icon-stacker :where(.nice-icon-stacker__add){border-color:var(--nice-border-color, #e2e8f0);font-weight:var(--nice-font-weight-medium, 500)}.nice-icon-stacker :where(.nice-icon-stacker__add:hover:not(:disabled)){border-color:var(--nice-color-primary, #3b82f6);color:var(--nice-color-primary, #3b82f6)}.nice-icon-stacker__empty{margin:0;padding:var(--nice-space-4, 16px);border:1px dashed var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-lg, 8px);color:var(--nice-text-secondary, #64748b);text-align:center}.nice-icon-stacker__top{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--nice-space-3, 12px)}.nice-icon-stacker__preview{display:flex;flex:0 0 auto;flex-direction:column;align-items:center;gap:var(--nice-space-2, 8px);padding:var(--nice-space-3, 12px);border-radius:var(--nice-radius-lg, 8px);background:var(--nice-bg-secondary, #f8fafc)}.nice-icon-stacker__preview-main{display:inline-flex}.nice-icon-stacker__preview-small{display:flex;align-items:flex-end;gap:var(--nice-space-2, 8px)}.nice-icon-stacker__preview-small>span{display:inline-flex}.nice-icon-stacker__layers-wrap{display:flex;flex:1 1 180px;flex-direction:column;gap:var(--nice-space-1, 4px);min-width:0}.nice-icon-stacker__layers{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}.nice-icon-stacker__layer{--nice-icon-stacker-depth: 0;display:flex;align-items:center;padding-left:calc(var(--nice-icon-stacker-depth, 0) * var(--nice-space-4, 16px));border-radius:var(--nice-radius-md, 6px)}.nice-icon-stacker__layer:hover{background:var(--nice-bg-hover, var(--nice-bg-secondary, #f1f5f9))}.nice-icon-stacker__layer.nice-icon-stacker__layer--selected{background:color-mix(in srgb,var(--nice-color-primary, #3b82f6) 14%,transparent)}.nice-icon-stacker :where(.nice-icon-stacker__layer-select){flex:1 1 auto;min-width:0;padding:var(--nice-space-1, 4px) var(--nice-space-1-5, 6px);text-align:left}.nice-icon-stacker :where(.nice-icon-stacker__layer-select:hover:not(:disabled)){background:transparent}.nice-icon-stacker__layer-icon{display:inline-flex;flex:0 0 auto}.nice-icon-stacker__layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nice-icon-stacker__layer--selected .nice-icon-stacker__layer-name{font-weight:var(--nice-font-weight-semibold, 600)}.nice-icon-stacker__layer-text{padding:0 var(--nice-space-1, 4px);border-radius:var(--nice-radius-sm, 4px);background:var(--nice-bg-tertiary, #f1f5f9);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker__badge{margin-left:auto;padding:0 var(--nice-space-1-5, 6px);border-radius:var(--nice-radius-full, 9999px);background:var(--nice-bg-tertiary, #f1f5f9);color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker :where(.nice-icon-stacker__remove){flex:0 0 auto;padding:var(--nice-space-1, 4px);color:var(--nice-text-secondary, #64748b);opacity:0}.nice-icon-stacker__layer:hover .nice-icon-stacker__remove,.nice-icon-stacker__layer--selected .nice-icon-stacker__remove,.nice-icon-stacker .nice-icon-stacker__remove:focus-visible{opacity:1}.nice-icon-stacker__hint{color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker__inspector{display:flex;flex-direction:column;gap:var(--nice-space-2, 8px);padding:var(--nice-space-2, 8px) var(--nice-space-3, 12px) var(--nice-space-3, 12px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-lg, 8px)}.nice-icon-stacker__inspector-head{display:flex;align-items:center;gap:var(--nice-space-1-5, 6px);font-weight:var(--nice-font-weight-semibold, 600)}.nice-icon-stacker__inspector-head small{color:var(--nice-text-secondary, #64748b);font-weight:var(--nice-font-weight-normal, 400)}.nice-icon-stacker__inspector-body{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--nice-space-3, 12px)}.nice-icon-stacker__pad{display:flex;flex:0 0 auto;flex-direction:column;align-items:stretch;gap:var(--nice-space-1-5, 6px)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto){justify-content:center;padding:2px var(--nice-space-2, 8px);border-color:var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-full, 9999px);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto[aria-checked=true]){border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-color-primary, #3b82f6);color:var(--nice-text-on-primary, #fff)}.nice-icon-stacker__pad-box{display:grid;grid-template-columns:repeat(5,16px);grid-template-rows:repeat(5,16px);place-items:center;padding:var(--nice-space-1, 4px);border:1.5px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-secondary, #f8fafc)}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot){width:10px;height:10px;padding:0;border:1.5px solid color-mix(in srgb,currentColor 55%,transparent);border-radius:50%}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot:hover:not(:disabled)){border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-primary-tint-20, transparent)}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot[aria-checked=true]){width:12px;height:12px;border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-color-primary, #3b82f6)}.nice-icon-stacker__fields{display:flex;flex:1 1 140px;flex-direction:column;gap:var(--nice-space-2, 8px);min-width:0}.nice-icon-stacker__field{display:flex;align-items:center;gap:var(--nice-space-2, 8px);min-width:0}.nice-icon-stacker__field>span{flex:0 0 auto;min-width:4.5em;color:var(--nice-text-secondary, #64748b)}.nice-icon-stacker__field output{flex:0 0 auto;min-width:3.5ch;font-variant-numeric:tabular-nums;text-align:right}.nice-icon-stacker__field :where(input[aria-invalid=true]){border-color:var(--nice-color-error, #ef4444)}.nice-icon-stacker__more>summary{width:max-content;border-radius:var(--nice-radius-sm, 4px);color:var(--nice-text-secondary, #64748b);cursor:pointer}.nice-icon-stacker__more-body{display:flex;flex-direction:column;gap:var(--nice-space-2, 8px);padding-top:var(--nice-space-2, 8px)}.nice-icon-stacker__swatches{display:flex;flex-wrap:wrap;gap:var(--nice-space-1, 4px) var(--nice-space-3, 12px)}.nice-icon-stacker__swatch{display:inline-flex;align-items:center}.nice-icon-stacker__swatch-pick{position:relative;display:inline-flex;align-items:center;gap:var(--nice-space-1-5, 6px);cursor:pointer}.nice-icon-stacker__swatch-pick input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.nice-icon-stacker__swatch-pick:focus-within{border-radius:var(--nice-radius-sm, 4px);box-shadow:var(--nice-focus-ring, 0 0 0 2px var(--nice-color-primary, #3b82f6))}.nice-icon-stacker__swatch-dot{width:16px;height:16px;border:1px solid var(--nice-border-color, #e2e8f0);border-radius:50%}.nice-icon-stacker__swatch-pick--auto .nice-icon-stacker__swatch-dot{border:1.5px dashed color-mix(in srgb,currentColor 55%,transparent);background:transparent}.nice-icon-stacker :where(.nice-icon-stacker__reset){padding:2px;color:var(--nice-text-secondary, #64748b)}.nice-icon-stacker__code>summary{width:max-content;border-radius:var(--nice-radius-sm, 4px);color:var(--nice-text-secondary, #64748b);cursor:pointer}.nice-icon-stacker__code pre{box-sizing:border-box;width:100%;margin:var(--nice-space-2, 8px) 0;padding:var(--nice-space-3, 12px);overflow-x:auto;border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-secondary, #f8fafc);font-family:var(--nice-font-mono, ui-monospace, monospace);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker :where(.nice-icon-stacker__code button){border-color:var(--nice-border-color, #e2e8f0)}.ntd-picker{--ntd-picker-border: var(--nice-border-color, #3a3a4a);--ntd-picker-radius: var(--nice-radius-lg, 10px);--ntd-picker-bg: var(--nice-bg-elevated, #1e1e2a);--ntd-picker-text: var(--nice-text-primary, #f0f0f5);--ntd-picker-accent: var(--nice-color-primary, #6c5ce7);--ntd-picker-accent-hover: var(--nice-color-primary-hover, #5b4cdb);--ntd-picker-accent-alpha: var(--nice-primary-tint-20, rgba(108, 92, 231, .2));--ntd-picker-muted: var(--nice-text-muted, #606078);--ntd-picker-text-secondary: var(--nice-text-secondary, #a0a0b4);--ntd-picker-input-bg: var(--nice-bg-inset, #14141c);position:relative;display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.ntd-picker-trigger{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:var(--ntd-picker-radius, 10px);background:var(--ntd-picker-bg, #1e1e2a);color:var(--ntd-picker-text, #f0f0f5);font-size:.875rem;font-family:inherit;cursor:pointer;transition:border-color .2s,box-shadow .2s;min-width:160px;user-select:none}.ntd-picker-trigger:hover{border-color:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-trigger:focus-visible{outline:none;border-color:var(--ntd-picker-accent, #6c5ce7);box-shadow:0 0 0 3px var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .25))}.ntd-picker-trigger-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12))}.ntd-picker-trigger-label{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ntd-picker-trigger-placeholder{color:var(--ntd-picker-muted, #606078)}.ntd-picker-trigger-chevron{flex-shrink:0;transition:transform .2s;color:var(--ntd-picker-muted, #606078)}.ntd-picker.ntd-picker--open .ntd-picker-trigger-chevron{transform:rotate(180deg)}.ntd-picker-dropdown{position:absolute;top:calc(100% + 6px);left:0;z-index:1000;width:380px;max-height:460px;display:flex;flex-direction:column;background:var(--ntd-picker-bg, #1e1e2a);border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:var(--ntd-picker-radius, 10px);box-shadow:0 12px 40px #0006,0 4px 12px #0003;overflow:hidden;animation:ntd-picker-appear .2s ease-out}@keyframes ntd-picker-appear{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-picker-search{position:relative;padding:10px 12px;border-bottom:1px solid var(--ntd-picker-border, #3a3a4a);flex-shrink:0}.ntd-picker-search-icon{position:absolute;left:22px;top:50%;transform:translateY(-50%);color:var(--ntd-picker-muted, #606078);pointer-events:none}.ntd-picker-search input{width:100%;padding:8px 12px 8px 34px;border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:8px;background:var(--ntd-picker-input-bg, #14141c);color:var(--ntd-picker-text, #f0f0f5);font-size:.82rem;font-family:inherit;outline:none;transition:border-color .2s}.ntd-picker-search input:focus{border-color:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-search input::placeholder{color:var(--ntd-picker-muted, #606078)}.ntd-picker-tabs{display:flex;gap:2px;padding:6px 10px;border-bottom:1px solid var(--ntd-picker-border, #3a3a4a);overflow-x:auto;flex-shrink:0;scrollbar-width:none}.ntd-picker-tabs::-webkit-scrollbar{display:none}.ntd-picker-tab{padding:5px 10px;border:none;border-radius:6px;background:transparent;color:var(--ntd-picker-muted, #606078);font-size:.72rem;font-family:inherit;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .15s;text-transform:uppercase;letter-spacing:.03em}.ntd-picker-tab:hover{color:var(--ntd-picker-text, #f0f0f5);background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12))}.ntd-picker-tab.ntd-picker-tab--active{color:#fff;background:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-grid-wrap{flex:1;overflow-y:auto;padding:8px;scrollbar-width:thin;scrollbar-color:var(--ntd-picker-border, #3a3a4a) transparent}.ntd-picker-grid-wrap::-webkit-scrollbar{width:5px}.ntd-picker-grid-wrap::-webkit-scrollbar-track{background:transparent}.ntd-picker-grid-wrap::-webkit-scrollbar-thumb{background:var(--ntd-picker-border, #3a3a4a);border-radius:3px}.ntd-picker-category-label{font-size:.68rem;font-weight:600;color:var(--ntd-picker-muted, #606078);text-transform:uppercase;letter-spacing:.05em;padding:6px 4px 4px;margin-top:4px}.ntd-picker-category-label:first-child{margin-top:0}.ntd-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:4px}.ntd-picker-cell{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;border:none;border-radius:8px;background:transparent;color:var(--ntd-picker-text, #f0f0f5);cursor:pointer;transition:all .15s;position:relative}.ntd-picker-cell:hover{background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12));transform:scale(1.1)}.ntd-picker-cell.ntd-picker-cell--selected{background:var(--ntd-picker-accent, #6c5ce7);color:#fff;box-shadow:0 2px 8px var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .25))}.ntd-picker-cell:focus-visible{outline:2px solid var(--ntd-picker-accent, #6c5ce7);outline-offset:1px}.ntd-picker-cell:after{content:attr(data-name);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);padding:3px 8px;border-radius:5px;background:var(--ntd-picker-text, #f0f0f5);color:var(--ntd-picker-bg, #1e1e2a);font-size:.65rem;font-weight:500;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;z-index:10}.ntd-picker-cell:hover:after{opacity:1}.ntd-picker-cell.ntd-picker-cell--draggable{cursor:grab}.ntd-picker-cell.ntd-picker-cell--draggable:active{cursor:grabbing}.ntd-picker-cell.ntd-picker-cell--draggable:hover:before{content:"";position:absolute;inset:0;border:2px dashed var(--ntd-picker-accent, #6c5ce7);border-radius:8px;opacity:.5;pointer-events:none}.ntd-picker-empty{padding:32px 16px;text-align:center;color:var(--ntd-picker-muted, #606078);font-size:.82rem}.ntd-picker-empty-icon{font-size:2rem;margin-bottom:8px;opacity:.4}.ntd-picker-footer{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-top:1px solid var(--ntd-picker-border, #3a3a4a);flex-shrink:0}.ntd-picker-count{font-size:.7rem;color:var(--ntd-picker-muted, #606078)}.ntd-picker-clear{padding:4px 10px;border:none;border-radius:5px;background:transparent;color:var(--ntd-picker-muted, #606078);font-size:.72rem;font-family:inherit;cursor:pointer;transition:all .15s}.ntd-picker-clear:hover{background:#ff50501f;color:#ff5050}.ntd-picker-multi-badge{display:flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--ntd-picker-accent, #6c5ce7);color:#fff;font-size:.7rem;font-weight:600}.ntd-picker-cell-check{position:absolute;top:2px;right:2px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--ntd-picker-accent, #6c5ce7);color:#fff;pointer-events:none}.ntd-picker-cell.ntd-picker-cell--multi-select{position:relative}.ntd-picker-cell-fav{position:absolute;top:2px;left:2px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;border:none;border-radius:50%;background:transparent;color:var(--ntd-picker-muted, #606078);cursor:pointer;opacity:0;transition:all .15s;padding:0}.ntd-picker-cell-wrap{position:relative}.ntd-picker-cell-wrap:hover .ntd-picker-cell-fav,.ntd-picker-cell-fav.ntd-picker-cell-fav--active{opacity:1}.ntd-picker-cell-fav:hover{color:#feca57;transform:scale(1.2)}.ntd-picker-cell-fav.ntd-picker-cell-fav--active{color:#feca57}.ntd-picker-tab-special{display:inline-flex;align-items:center;gap:4px}.ntd-picker-tab-special svg{width:10px;height:10px}.ntd-picker-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;margin-left:2px;border-radius:8px;background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .2));font-size:.65rem;font-weight:600}.ntd-picker-tab.ntd-picker-tab--active .ntd-picker-tab-count{background:#fff3}.ntd-picker-done{padding:4px 12px;border:none;border-radius:5px;background:var(--ntd-picker-accent, #6c5ce7);color:#fff;font-size:.72rem;font-family:inherit;font-weight:500;cursor:pointer;transition:all .15s}.ntd-picker-done:hover{background:var(--ntd-picker-accent-hover, #5b4cdb);transform:translateY(-1px)}.ntd-picker.ntd-picker--disabled .ntd-picker-trigger{opacity:.5;cursor:not-allowed}.ntd-picker.ntd-picker--multi .ntd-picker-trigger{border-style:dashed}.ntd-picker.ntd-picker--icon-only .ntd-picker-trigger{min-width:0;padding:4px}.ntd-picker-views{display:flex;flex-shrink:0;gap:2px;margin:10px 12px 0;padding:3px;border-radius:8px;background:var(--ntd-picker-input-bg, #14141c)}.ntd-picker-view{display:inline-flex;flex:1;align-items:center;justify-content:center;gap:6px;padding:5px 10px;border:none;border-radius:6px;background:transparent;color:var(--ntd-picker-text-secondary, #a0a0b4);font-family:inherit;font-size:.78rem;font-weight:500;cursor:pointer;transition:background .15s,color .15s}.ntd-picker-view:hover:not(:disabled){color:var(--ntd-picker-text, #f0f0f5)}.ntd-picker-view.ntd-picker-view--active{background:var(--ntd-picker-bg, #1e1e2a);color:var(--ntd-picker-text, #f0f0f5);box-shadow:0 0 0 1px var(--ntd-picker-border, #3a3a4a)}.ntd-picker-view:disabled{opacity:.45;cursor:not-allowed}.ntd-picker-view:focus-visible,.ntd-picker-back:focus-visible{outline:2px solid var(--ntd-picker-accent, #6c5ce7);outline-offset:1px}.ntd-picker-banner{display:flex;flex-shrink:0;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--ntd-picker-border, #3a3a4a);background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12));color:var(--ntd-picker-text, #f0f0f5);font-size:.8rem}.ntd-picker-back{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:6px;background:var(--ntd-picker-bg, #1e1e2a);color:inherit;cursor:pointer}.ntd-picker-back:hover{border-color:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-panel{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.ntd-picker-dropdown.ntd-picker-dropdown--stack{max-height:min(620px,85vh)}.ntd-picker-dropdown.ntd-picker-dropdown--up{top:auto;bottom:calc(100% + 6px)}.ntd-picker-dropdown.ntd-picker-dropdown--end{right:0;left:auto}.ntd-picker-stack{--nice-border-color: var(--ntd-picker-border);--nice-bg-primary: var(--ntd-picker-input-bg);--nice-bg-secondary: var(--ntd-picker-input-bg);--nice-bg-tertiary: var(--ntd-picker-accent-alpha);--nice-bg-hover: var(--ntd-picker-accent-alpha);--nice-text-primary: var(--ntd-picker-text);--nice-text-secondary: var(--ntd-picker-text-secondary);--nice-color-primary: var(--ntd-picker-accent);flex:1 1 auto;min-height:0;padding:12px;overflow-y:auto;scrollbar-width:thin}.ntd-picker-stack[hidden],.ntd-picker-serializer{display:none}.ntd-picker-grid.ntd-picker-grid--names{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.ntd-picker-grid--names .ntd-picker-cell{justify-content:flex-start;gap:8px;aspect-ratio:auto;padding:6px 8px}.ntd-picker-grid--names .ntd-picker-cell:hover{transform:none}.ntd-picker-grid--names .ntd-picker-cell:after{content:none}.ntd-picker-cell-name{overflow:hidden;font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}.nice-desktop-icon-exporter{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--nice-space-4, 16px);min-width:0;color:var(--nice-text-primary, inherit);font-size:var(--nice-font-size-sm, .8125rem)}.nice-desktop-icon-exporter :where(h3,h4){margin:0 0 var(--nice-space-2, 8px);font-weight:var(--nice-font-weight-semibold, 600)}.nice-desktop-icon-exporter :where(h3){font-size:var(--nice-font-size-md, .875rem)}.nice-desktop-icon-exporter :where(h4){color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem)}.nice-desktop-icon-exporter :where(button){padding:var(--nice-space-1-5, 6px) var(--nice-space-3, 12px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-primary, #fff);color:var(--nice-text-primary, inherit);font:inherit;cursor:pointer}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary, #f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){opacity:.5;cursor:not-allowed}.nice-desktop-icon-exporter :where(input[type=text]){box-sizing:border-box;padding:var(--nice-space-1-5, 6px) var(--nice-space-2, 8px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-primary, #fff);color:var(--nice-text-primary, inherit);font:inherit}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary, #3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{outline:none;box-shadow:var(--nice-focus-ring, 0 0 0 2px var(--nice-color-primary, #3b82f6))}.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__results{min-width:0;padding:var(--nice-space-3, 12px);background:var(--nice-bg-elevated, var(--nice-bg-primary, #fff));border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-lg, 8px)}.nice-desktop-icon-exporter__preview-grid{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--nice-space-3, 12px)}.nice-desktop-icon-exporter__preview-item{display:flex;flex-direction:column;align-items:center;gap:var(--nice-space-1, 4px);color:var(--nice-text-muted, #94a3b8);font-size:var(--nice-font-size-xs, .75rem);font-variant-numeric:tabular-nums}.nice-desktop-icon-exporter__preview-box{display:flex;align-items:center;justify-content:center;border-radius:var(--nice-radius-sm, 4px)}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5, 10px)}.nice-desktop-icon-exporter__config>label{display:flex;flex-wrap:wrap;align-items:center;gap:var(--nice-space-2, 8px);color:var(--nice-text-secondary, #64748b);font-weight:var(--nice-font-weight-medium, 500)}.nice-desktop-icon-exporter__config>label>input[type=text],.nice-desktop-icon-exporter__config>label>input[type=range]{flex:1 1 140px;min-width:0}.nice-desktop-icon-exporter__platforms,.nice-desktop-icon-exporter__sizes{display:flex;flex-wrap:wrap;gap:var(--nice-space-1-5, 6px) var(--nice-space-4, 16px)}.nice-desktop-icon-exporter__sizes>h4{flex-basis:100%;margin:0}.nice-desktop-icon-exporter__platforms label,.nice-desktop-icon-exporter__sizes label{display:inline-flex;align-items:center;gap:var(--nice-space-1-5, 6px);cursor:pointer}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;grid-column:1 / -1;gap:var(--nice-space-2, 8px)}.nice-desktop-icon-exporter__actions>button:first-child{border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-color-primary, #3b82f6);color:var(--nice-text-on-primary, #fff);font-weight:var(--nice-font-weight-medium, 500)}.nice-desktop-icon-exporter__results{grid-column:1 / -1}.nice-desktop-icon-exporter__results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--nice-space-2, 8px)}.nice-desktop-icon-exporter__result-item{display:flex;flex-direction:column;align-items:center;gap:var(--nice-space-1, 4px);padding:var(--nice-space-2, 8px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-width:64px;max-height:64px}.nice-desktop-icon-exporter__result-item>span{max-width:100%;overflow:hidden;color:var(--nice-text-secondary, #64748b);font-family:var(--nice-font-mono, ui-monospace, monospace);font-size:var(--nice-font-size-xxs, .625rem);text-overflow:ellipsis;white-space:nowrap}
|
|
1
|
+
.ntd-icon{display:inline-block;vertical-align:-.125em;flex-shrink:0;transition:color .2s ease,transform .2s ease}.ntd-anim-spin{animation:ntd-spin calc(1s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite)}.ntd-anim-spin-reverse{animation:ntd-spin calc(1s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite) reverse}@keyframes ntd-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ntd-anim-pulse{animation:ntd-pulse calc(2s * var(--ntd-anim-scale, 2)) cubic-bezier(.4,0,.6,1) var(--ntd-anim-iterations, infinite)}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce calc(1s * var(--ntd-anim-scale, 2)) ease var(--ntd-anim-iterations, infinite)}@keyframes ntd-bounce{0%,to{transform:translateY(0);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0,0,.2,1)}}.ntd-anim-shake{animation:ntd-shake calc(.6s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.ntd-anim-float{animation:ntd-float calc(3s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-flip{0%{transform:perspective(400px) rotateY(0)}40%{transform:perspective(400px) rotateY(170deg)}50%{transform:perspective(400px) rotateY(190deg)}80%{transform:perspective(400px) rotateY(360deg)}to{transform:perspective(400px) rotateY(360deg)}}.ntd-anim-turn{animation:ntd-turn var(--ntd-anim-duration, calc(4s * var(--ntd-anim-scale, 2))) var(--ntd-anim-iterations, infinite)}@keyframes ntd-turn{0%{transform:rotate(0);animation-timing-function:cubic-bezier(.65,0,.35,1)}12.5%,50%{transform:rotate(180deg);animation-timing-function:cubic-bezier(.65,0,.35,1)}62.5%,to{transform:rotate(0)}}.ntd-anim-turn .ntd-hourglass-sand{transform-box:view-box;animation-duration:var(--ntd-anim-duration, calc(4s * var(--ntd-anim-scale, 2)));animation-timing-function:linear;animation-iteration-count:var(--ntd-anim-iterations, infinite)}.ntd-anim-turn .ntd-hourglass-sand--top-neck{transform-origin:12px 11.4px;animation-name:ntd-hourglass-top-neck}.ntd-anim-turn .ntd-hourglass-sand--top-base{transform-origin:12px 5.8px;animation-name:ntd-hourglass-top-base}.ntd-anim-turn .ntd-hourglass-sand--bottom-neck{transform-origin:12px 12.6px;animation-name:ntd-hourglass-bottom-neck}.ntd-anim-turn .ntd-hourglass-sand--bottom-base{transform-origin:12px 18.2px;animation-name:ntd-hourglass-bottom-base}.ntd-anim-turn .ntd-hourglass-sand--stream-up{animation-name:ntd-hourglass-stream-up}.ntd-anim-turn .ntd-hourglass-sand--stream-down{animation-name:ntd-hourglass-stream-down}@keyframes ntd-hourglass-top-base{0%,12.5%{transform:scaleY(0)}50%,62.5%{transform:scaleY(1)}62.6%,to{transform:scaleY(0)}}@keyframes ntd-hourglass-top-neck{0%,50%{transform:scale(0)}50.1%,62.5%{transform:scale(1)}to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-neck{0%,12.5%{transform:scale(1)}50%,to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-base{0%,62.5%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes ntd-hourglass-stream-up{0%,13%,49.5%,to{opacity:0}14%,48.5%{opacity:1}}@keyframes ntd-hourglass-stream-down{0%,63%,99.5%,to{opacity:0}64%,98.5%{opacity:1}}.ntd-anim-glow{animation:ntd-glow calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-glow{0%,to{filter:drop-shadow(0 0 2px currentColor)}50%{filter:drop-shadow(0 0 12px currentColor) drop-shadow(0 0 20px currentColor)}}.ntd-anim-wiggle{animation:ntd-wiggle calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-rubber{0%{transform:scale(1)}30%{transform:scaleX(1.25) scaleY(.75)}40%{transform:scaleX(.75) scaleY(1.25)}50%{transform:scaleX(1.15) scaleY(.85)}65%{transform:scaleX(.95) scaleY(1.05)}75%{transform:scaleX(1.05) scaleY(.95)}to{transform:scale(1)}}.ntd-anim-swing{animation:ntd-swing calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite);transform-origin:top center}@keyframes ntd-swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0)}}.ntd-anim-tada{animation:ntd-tada calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-tada{0%{transform:scale(1) rotate(0)}10%,20%{transform:scale(.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}to{transform:scale(1) rotate(0)}}.ntd-anim-heartbeat{animation:ntd-heartbeat calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-heartbeat{0%{transform:scale(1)}14%{transform:scale(1.3)}28%{transform:scale(1)}42%{transform:scale(1.3)}70%{transform:scale(1)}}.ntd-anim-fade-in{animation:ntd-fade-in calc(.5s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ntd-anim-slide-up{animation:ntd-slide-up calc(.4s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-jello{animation:ntd-jello calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-jello{0%,to{transform:skew(0) skewY(0)}11.1%{transform:skew(-12.5deg) skewY(-12.5deg)}22.2%{transform:skew(6.25deg) skewY(6.25deg)}33.3%{transform:skew(-3.125deg) skewY(-3.125deg)}44.4%{transform:skew(1.5625deg) skewY(1.5625deg)}55.5%{transform:skew(-.78125deg) skewY(-.78125deg)}66.6%{transform:skew(.390625deg) skewY(.390625deg)}77.7%{transform:skew(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop calc(.6s * var(--ntd-anim-scale, 2)) ease-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-pop{0%{transform:scale(1)}15%{transform:scale(1.35)}30%{transform:scale(.9)}45%{transform:scale(1.1)}60%{transform:scale(.97)}75%{transform:scale(1.03)}to{transform:scale(1)}}.ntd-anim-squeeze{animation:ntd-squeeze calc(1.4s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-squeeze{0%,to{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(.7) scaleY(1.3)}50%{transform:scaleX(1) scaleY(1)}75%{transform:scaleX(1.3) scaleY(.7)}}.ntd-anim-drop{animation:ntd-drop calc(.8s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-drop{0%{opacity:0;transform:translateY(-40px) scale(.8)}60%{opacity:1;transform:translateY(4px) scale(1.05)}75%{transform:translateY(-2px) scale(.98)}90%{transform:translateY(1px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-rise{animation:ntd-rise calc(.7s * var(--ntd-anim-scale, 2)) cubic-bezier(.16,1,.3,1) forwards}@keyframes ntd-rise{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-slide-left{animation:ntd-slide-left calc(.5s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.ntd-anim-slide-right{animation:ntd-slide-right calc(.5s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.ntd-anim-slide-down{animation:ntd-slide-down calc(.4s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-roll-in{animation:ntd-roll-in calc(.8s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translate(-100%) rotate(-120deg)}to{opacity:1;transform:translate(0) rotate(0)}}.ntd-anim-flash{animation:ntd-flash calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate calc(.3s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite)}@keyframes ntd-vibrate{0%{transform:translate(0)}20%{transform:translate(-1px,1px)}40%{transform:translate(1px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}to{transform:translate(0)}}.ntd-anim-wobble{animation:ntd-wobble calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-wobble{0%{transform:translate(0) rotate(0)}15%{transform:translate(-15%) rotate(-5deg)}30%{transform:translate(10%) rotate(3deg)}45%{transform:translate(-10%) rotate(-3deg)}60%{transform:translate(5%) rotate(2deg)}75%{transform:translate(-3%) rotate(-1deg)}to{transform:translate(0) rotate(0)}}.ntd-anim-spiral{animation:ntd-spiral calc(2s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite)}@keyframes ntd-spiral{0%{transform:rotate(0) scale(.8)}25%{transform:rotate(90deg) scale(1.1)}50%{transform:rotate(180deg) scale(.8)}75%{transform:rotate(270deg) scale(1.1)}to{transform:rotate(360deg) scale(.8)}}.ntd-anim-ping{animation:ntd-ping calc(1.5s * var(--ntd-anim-scale, 2)) ease-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-ping{0%{transform:scale(1);opacity:1}70%{transform:scale(1.6);opacity:0}71%{transform:scale(1);opacity:0}to{transform:scale(1);opacity:1}}.ntd-anim-flicker{animation:ntd-flicker calc(1.5s * var(--ntd-anim-scale, 2)) steps(1) var(--ntd-anim-iterations, infinite)}@keyframes ntd-flicker{0%{opacity:1}4%{opacity:.3}8%{opacity:1}12%{opacity:.6}16%{opacity:1}20%{opacity:.2}22%{opacity:1}50%{opacity:1}52%{opacity:.4}54%{opacity:1}80%{opacity:1}82%{opacity:.3}85%{opacity:1}90%{opacity:.5}92%{opacity:1}}.ntd-anim-tilt{animation:ntd-tilt calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite);transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe calc(4s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-breathe{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.85}}.ntd-anim-drift{animation:ntd-drift calc(4s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-drift{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(5px) rotate(1deg)}50%{transform:translate(0) rotate(0)}75%{transform:translate(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit calc(3s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite)}@keyframes ntd-orbit{0%{transform:translate(0)}25%{transform:translate(4px,-4px)}50%{transform:translateY(-6px)}75%{transform:translate(-4px,-4px)}to{transform:translate(0)}}.ntd-anim-crush{animation:ntd-crush calc(.8s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-crush{0%,to{transform:scaleY(1) scaleX(1)}40%{transform:scaleY(.3) scaleX(1.3)}60%{transform:scaleY(1.15) scaleX(.9)}80%{transform:scaleY(.95) scaleX(1.02)}}.ntd-anim-stretch{animation:ntd-stretch calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-stretch{0%,to{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(1.4) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}}.ntd-anim-dissolve{animation:ntd-dissolve calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-dissolve{0%,to{opacity:1;filter:blur(0)}50%{opacity:.1;filter:blur(4px)}}.ntd-anim-materialize{animation:ntd-materialize calc(.8s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-materialize{0%{opacity:0;filter:blur(8px);transform:scale(.6)}60%{opacity:.8;filter:blur(1px);transform:scale(1.05)}to{opacity:1;filter:blur(0);transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway calc(2.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite);transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble calc(.15s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite)}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0)}25%{transform:translate(-.5px,.5px) rotate(-.5deg)}50%{transform:translate(.5px,-.5px) rotate(.5deg)}75%{transform:translate(-.5px,-.5px) rotate(-.5deg)}to{transform:translate(0) rotate(0)}}.ntd-anim-rock{animation:ntd-rock calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite);transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-snap{0%,30%{transform:rotate(0)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0) rotateY(0)}25%{transform:perspective(300px) rotateX(10deg) rotateY(10deg)}50%{transform:perspective(300px) rotateX(-5deg) rotateY(-10deg)}75%{transform:perspective(300px) rotateX(8deg) rotateY(-5deg)}}.ntd-anim-glitch{animation:ntd-glitch calc(.8s * var(--ntd-anim-scale, 2)) steps(1) var(--ntd-anim-iterations, infinite)}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skew(2deg)}10%{transform:translate(3px,-1px) skew(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skew(-3deg)}44%{transform:translate(-2px,-2px) skew(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skew(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple calc(1.6s * var(--ntd-anim-scale, 2)) ease-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-ripple{0%{transform:scale(1);opacity:1}30%{transform:scale(1.15);opacity:.8}50%{transform:scale(1);opacity:1}70%{transform:scale(1.08);opacity:.9}to{transform:scale(1);opacity:1}}.ntd-anim-implode{animation:ntd-implode calc(1.2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-implode{0%,to{transform:scale(1);opacity:1}40%{transform:scale(.2) rotate(20deg);opacity:.3}60%{transform:scale(.15) rotate(25deg);opacity:.2}80%{transform:scale(1.1) rotate(0);opacity:1}}.ntd-anim-explode{animation:ntd-explode calc(1.4s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-explode{0%,to{transform:scale(1);opacity:1}30%{transform:scale(1.8);opacity:.6}50%{transform:scale(2);opacity:0}51%{transform:scale(.5);opacity:0}70%{transform:scale(1.1);opacity:.8}85%{transform:scale(.95);opacity:1}}.ntd-anim-rotate-x{animation:ntd-rotate-x calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0)}to{transform:perspective(400px) rotateX(360deg)}}.ntd-anim-morph{animation:ntd-morph calc(3s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-morph{0%,to{transform:scaleX(1) scaleY(1) rotate(0);border-radius:0}20%{transform:scaleX(1.1) scaleY(.9) rotate(2deg)}40%{transform:scaleX(.9) scaleY(1.1) rotate(-1deg)}60%{transform:scaleX(1.05) scaleY(.95) rotate(1deg)}80%{transform:scaleX(.95) scaleY(1.05) rotate(-2deg)}}.ntd-anim-levitate{animation:ntd-levitate calc(3s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-levitate{0%,to{transform:translateY(0);filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}50%{transform:translateY(-10px);filter:drop-shadow(0 12px 8px rgba(0,0,0,.1))}}.ntd-anim-dash{animation:ntd-dash calc(.8s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-dash{0%,to{transform:translate(0) scaleX(1);opacity:1}30%{transform:translate(-3px) scaleX(.9);opacity:.8}60%{transform:translate(15px) scaleX(1.15);opacity:.6}80%{transform:translate(2px) scaleX(1);opacity:.9}}.ntd-anim-twist{animation:ntd-twist calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-twist{0%,to{transform:rotate(0) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp calc(1s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite);transform-origin:bottom center}@keyframes ntd-stomp{0%,to{transform:translateY(0) scaleY(1) scaleX(1)}20%{transform:translateY(-15px) scaleY(1.1) scaleX(.95)}50%{transform:translateY(0) scaleY(.7) scaleX(1.2)}65%{transform:translateY(-3px) scaleY(1.05) scaleX(.98)}80%{transform:translateY(0) scaleY(.95) scaleX(1.03)}}.ntd-anim-flap{animation:ntd-flap calc(.6s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-skate{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(8px) rotate(2deg)}50%{transform:translate(0) rotate(0)}75%{transform:translate(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink calc(1.4s * var(--ntd-anim-scale, 2)) steps(1) var(--ntd-anim-iterations, infinite)}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal calc(1s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-reveal{0%{clip-path:circle(0% at 50% 50%);opacity:.5}to{clip-path:circle(75% at 50% 50%);opacity:1}}.ntd-anim-vortex{animation:ntd-vortex calc(.8s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-vortex{0%{transform:rotate(-540deg) scale(0);opacity:0}60%{transform:rotate(20deg) scale(1.1);opacity:1}80%{transform:rotate(-10deg) scale(.95)}to{transform:rotate(0) scale(1);opacity:1}}.ntd-anim-meteor{animation:ntd-meteor calc(.7s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-meteor{0%{transform:translate(30px,-30px) rotate(15deg) scale(.5);opacity:0}70%{transform:translate(-2px,2px) rotate(-2deg) scale(1.05);opacity:1}to{transform:translate(0) rotate(0) scale(1);opacity:1}}.ntd-anim-scale-in{animation:ntd-scale-in calc(.5s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.ntd-anim-scale-out{animation:ntd-scale-out calc(.4s * var(--ntd-anim-scale, 2)) ease-in forwards}@keyframes ntd-scale-out{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}.ntd-anim-pendulum{animation:ntd-pendulum calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite);transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0)}25%{transform:rotate(25deg)}50%{transform:rotate(0)}75%{transform:rotate(-25deg)}to{transform:rotate(0)}}.ntd-anim-surge{animation:ntd-surge calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-surge{0%,to{transform:scale(1);filter:drop-shadow(0 0 0 currentColor)}15%{transform:scale(1.2);filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor)}30%{transform:scale(.95);filter:drop-shadow(0 0 2px currentColor)}45%{transform:scale(1.1);filter:drop-shadow(0 0 6px currentColor)}60%{transform:scale(1);filter:drop-shadow(0 0 0 currentColor)}}.ntd-anim-radar{animation:ntd-radar calc(2s * var(--ntd-anim-scale, 2)) linear var(--ntd-anim-iterations, infinite)}@keyframes ntd-radar{0%{transform:rotate(0);opacity:1}50%{opacity:.4}to{transform:rotate(360deg);opacity:1}}.ntd-anim-typewriter{animation:ntd-typewriter calc(1s * var(--ntd-anim-scale, 2)) steps(12) forwards}@keyframes ntd-typewriter{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.ntd-anim-unfold{animation:ntd-unfold calc(.7s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-unfold{0%{transform:scaleY(.05) scaleX(1.3);opacity:.3}50%{transform:scaleY(1.1) scaleX(.95);opacity:.9}70%{transform:scaleY(.95) scaleX(1.02);opacity:1}to{transform:scaleY(1) scaleX(1);opacity:1}}.ntd-anim-fold{animation:ntd-fold calc(.6s * var(--ntd-anim-scale, 2)) ease-in forwards}@keyframes ntd-fold{0%{transform:scaleY(1) scaleX(1);opacity:1}to{transform:scaleY(.05) scaleX(1.3);opacity:0}}.ntd-anim-scatter{animation:ntd-scatter calc(1.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-scatter{0%,to{transform:scale(1) rotate(0);opacity:1;filter:blur(0)}20%{transform:scale(1.3) rotate(5deg);opacity:.6;filter:blur(2px)}40%{transform:scale(1.5) rotate(-3deg);opacity:.2;filter:blur(4px)}50%{transform:scale(.8) rotate(0);opacity:0;filter:blur(6px)}65%{transform:scale(.6) rotate(-5deg);opacity:.3;filter:blur(3px)}80%{transform:scale(.95) rotate(2deg);opacity:.8;filter:blur(1px)}}.ntd-anim-assemble{animation:ntd-assemble calc(1s * var(--ntd-anim-scale, 2)) ease-out forwards}@keyframes ntd-assemble{0%{transform:scale(2) rotate(15deg);opacity:0;filter:blur(8px)}30%{transform:scale(.8) rotate(-5deg);opacity:.5;filter:blur(3px)}60%{transform:scale(1.1) rotate(2deg);opacity:.9;filter:blur(1px)}80%{transform:scale(.97) rotate(-1deg);opacity:1;filter:blur(0)}to{transform:scale(1) rotate(0);opacity:1;filter:blur(0)}}.ntd-anim-neon{animation:ntd-neon calc(2s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-neon{0%,to{opacity:1;filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}10%{opacity:.4;filter:drop-shadow(0 0 0 currentColor)}11%{opacity:1;filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}15%{opacity:.3;filter:drop-shadow(0 0 0 currentColor)}16%{opacity:1;filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor)}50%{opacity:1;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor)}}.ntd-anim-earthquake{animation:ntd-earthquake calc(.5s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-earthquake{0%,to{transform:translate(0)}10%{transform:translate(-4px,2px) rotate(-1deg)}20%{transform:translate(3px,-3px) rotate(1deg)}30%{transform:translate(-2px,4px) rotate(-2deg)}40%{transform:translate(4px,-1px) rotate(2deg)}50%{transform:translate(-3px,3px) rotate(-1deg)}60%{transform:translate(2px,-4px) rotate(1deg)}70%{transform:translate(-4px,1px) rotate(-2deg)}80%{transform:translate(3px,2px) rotate(2deg)}90%{transform:translate(-1px,-3px) rotate(-1deg)}}.ntd-anim-signature{transform-origin:center;animation:ntd-signature-enter calc(.65s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}.ntd-anim-signature path,.ntd-anim-signature line,.ntd-anim-signature polyline,.ntd-anim-signature polygon,.ntd-anim-signature circle,.ntd-anim-signature rect,.ntd-anim-signature ellipse{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke calc(1.7s * var(--ntd-anim-scale, 2)) ease-out calc(.05s * var(--ntd-anim-scale, 2)) forwards,ntd-signature-fill calc(.55s * var(--ntd-anim-scale, 2)) ease-out calc(1.05s * var(--ntd-anim-scale, 2)) forwards;filter:drop-shadow(0 0 0 currentColor)}@keyframes ntd-signature-enter{0%{opacity:.08;transform:scale(.05) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(0)}to{opacity:1;transform:scale(1)}}@keyframes ntd-signature-stroke{0%{stroke-dashoffset:150;filter:drop-shadow(0 0 0 currentColor)}65%{stroke-dashoffset:0;filter:drop-shadow(0 0 6px currentColor)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 2px currentColor)}}@keyframes ntd-signature-fill{0%{fill-opacity:.05}to{fill-opacity:1}}.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence circle,.ntd-anim-draw-sequence rect,.ntd-anim-draw-sequence ellipse{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence calc(1.6s * var(--ntd-anim-scale, 2)) ease-out forwards}.ntd-anim-draw-sequence path:nth-child(1),.ntd-anim-draw-sequence line:nth-child(1),.ntd-anim-draw-sequence polyline:nth-child(1),.ntd-anim-draw-sequence polygon:nth-child(1),.ntd-anim-draw-sequence circle:nth-child(1),.ntd-anim-draw-sequence rect:nth-child(1),.ntd-anim-draw-sequence ellipse:nth-child(1){animation-delay:calc(0s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2){animation-delay:calc(.2s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3){animation-delay:calc(.4s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-sequence{0%{stroke-dashoffset:160;fill-opacity:0}75%{stroke-dashoffset:0;fill-opacity:.15}to{stroke-dashoffset:0;fill-opacity:1}}.ntd-anim-stroke-order path,.ntd-anim-stroke-order line,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order circle,.ntd-anim-stroke-order rect,.ntd-anim-stroke-order ellipse{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order calc(2s * var(--ntd-anim-scale, 2)) linear forwards}@keyframes ntd-stroke-order{0%{stroke-dashoffset:220;opacity:.2}30%{opacity:1}to{stroke-dashoffset:0;opacity:1}}.ntd-anim-glow-trace path,.ntd-anim-glow-trace line,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace circle,.ntd-anim-glow-trace rect,.ntd-anim-glow-trace ellipse{stroke-dasharray:180;animation:ntd-glow-trace calc(2.8s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-glow-trace{0%{stroke-dashoffset:180;filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{stroke-dashoffset:0;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 14px currentColor);opacity:1}to{stroke-dashoffset:-180;filter:drop-shadow(0 0 2px currentColor);opacity:.5}}.ntd-anim-seal-stamp{transform-origin:center;animation:ntd-seal-stamp calc(.75s * var(--ntd-anim-scale, 2)) cubic-bezier(.22,1,.36,1) forwards}@keyframes ntd-seal-stamp{0%{opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg);filter:blur(2px)}45%{opacity:1;transform:translateY(2px) scale(.94) rotate(0);filter:blur(0)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw path,.ntd-anim-draw line,.ntd-anim-draw polyline,.ntd-anim-draw polygon,.ntd-anim-draw circle,.ntd-anim-draw rect,.ntd-anim-draw ellipse{stroke-dasharray:120;stroke-dashoffset:120;animation:ntd-draw-stroke calc(1.2s * var(--ntd-anim-scale, 2)) ease-out forwards,ntd-draw-fill calc(.4s * var(--ntd-anim-scale, 2)) ease-out calc(.8s * var(--ntd-anim-scale, 2)) forwards;fill-opacity:0}@keyframes ntd-draw-stroke{0%{stroke-dashoffset:120}to{stroke-dashoffset:0}}@keyframes ntd-draw-fill{0%{fill-opacity:0}to{fill-opacity:1}}.ntd-anim-draw-from-dot{transform-origin:center;animation:ntd-draw-dot-enter calc(.45s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) forwards}.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot rect,.ntd-anim-draw-from-dot ellipse{stroke-dasharray:140;stroke-dashoffset:140;animation:ntd-draw-dot-stroke calc(1.35s * var(--ntd-anim-scale, 2)) ease-out calc(.15s * var(--ntd-anim-scale, 2)) forwards,ntd-draw-fill calc(.45s * var(--ntd-anim-scale, 2)) ease-out calc(.95s * var(--ntd-anim-scale, 2)) forwards;fill-opacity:0}@keyframes ntd-draw-dot-enter{0%{opacity:.15;transform:scale(.08)}60%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes ntd-draw-dot-stroke{0%{stroke-dashoffset:140}to{stroke-dashoffset:0}}.ntd-anim-draw-loop path,.ntd-anim-draw-loop line,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop circle,.ntd-anim-draw-loop rect,.ntd-anim-draw-loop ellipse{stroke-dasharray:140;animation:ntd-draw-loop-stroke calc(2.4s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-draw-loop-stroke{0%{stroke-dashoffset:140;opacity:0}25%{stroke-dashoffset:0;opacity:1}60%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-140;opacity:.2}}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:circle(0% at 50% 50%);transform-box:fill-box;transform-origin:center;animation:ntd-draw-shape-pop calc(.7s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) calc(.35s * var(--ntd-anim-scale, 2)) forwards}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:calc(.5s * var(--ntd-anim-scale, 2))}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:calc(.65s * var(--ntd-anim-scale, 2))}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:calc(.8s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-shape-pop{0%{fill-opacity:0;clip-path:circle(0% at 50% 50%);transform:scale(.5)}60%{fill-opacity:.9;clip-path:circle(75% at 50% 50%);transform:scale(1.08)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:circle(0% at 50% 50%);transform-box:fill-box;transform-origin:center;animation:ntd-draw-dot-shape-burst calc(.65s * var(--ntd-anim-scale, 2)) cubic-bezier(.34,1.56,.64,1) calc(.25s * var(--ntd-anim-scale, 2)) forwards}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:calc(.4s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:calc(.55s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:calc(.7s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-dot-shape-burst{0%{fill-opacity:0;clip-path:circle(0% at 50% 50%);transform:scale(.1)}50%{fill-opacity:.85;clip-path:circle(65% at 50% 50%);transform:scale(1.14)}75%{clip-path:circle(88% at 50% 50%);transform:scale(.97)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom;animation:ntd-draw-seq-shape-wipe calc(.6s * var(--ntd-anim-scale, 2)) cubic-bezier(.22,1,.36,1) forwards}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(1){animation-delay:calc(0s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:calc(.2s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:calc(.4s * var(--ntd-anim-scale, 2))}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:calc(.6s * var(--ntd-anim-scale, 2))}@keyframes ntd-draw-seq-shape-wipe{0%{fill-opacity:0;clip-path:inset(100% 0 0 0);transform:scaleY(.6)}70%{fill-opacity:.9;clip-path:inset(5% 0 0 0);transform:scaleY(1.04)}to{fill-opacity:1;clip-path:inset(0 0 0 0);transform:scaleY(1)}}.ntd-anim-draw-loop :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-draw-loop-shape-pulse calc(2.4s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-draw-loop-shape-pulse{0%{clip-path:circle(0% at 50% 50%);opacity:0}25%{clip-path:circle(100% at 50% 50%);opacity:1}60%{clip-path:circle(100% at 50% 50%);opacity:1}to{clip-path:circle(0% at 50% 50%);opacity:.2}}.ntd-anim-signature :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:circle(0% at 50% 50%);transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 0 0 currentColor);animation:ntd-signature-shape-stamp calc(.8s * var(--ntd-anim-scale, 2)) cubic-bezier(.22,1,.36,1) calc(.5s * var(--ntd-anim-scale, 2)) forwards}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0% at 50% 50%);transform:scale(.35) rotate(-6deg);filter:drop-shadow(0 0 0 currentColor)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);transform:scale(1.08) rotate(0);filter:drop-shadow(0 0 8px currentColor)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1);filter:drop-shadow(0 0 2px currentColor)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;clip-path:inset(0 100% 0 0);animation:ntd-stroke-order-shape-wipe calc(1.2s * var(--ntd-anim-scale, 2)) ease-out calc(.3s * var(--ntd-anim-scale, 2)) forwards}@keyframes ntd-stroke-order-shape-wipe{0%{fill-opacity:0;clip-path:inset(0 100% 0 0)}40%{fill-opacity:.7}to{fill-opacity:1;clip-path:inset(0 0 0 0)}}.ntd-anim-glow-trace :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-glow-trace-shape calc(2.8s * var(--ntd-anim-scale, 2)) ease-in-out var(--ntd-anim-iterations, infinite)}@keyframes ntd-glow-trace-shape{0%{clip-path:circle(0% at 50% 50%);filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 16px currentColor);opacity:1}to{clip-path:circle(0% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);opacity:.4}}@media(prefers-reduced-motion:reduce){.ntd-icon:not(.ntd-motion-ignore),.ntd-icon:not(.ntd-motion-ignore) *{animation:none!important}}.nice-icon-stacker{display:flex;flex-direction:column;gap:var(--nice-space-3, 12px);min-width:0;color:var(--nice-text-primary, inherit);font-size:var(--nice-font-size-sm, .8125rem)}.nice-icon-stacker :where(button){display:inline-flex;align-items:center;gap:var(--nice-space-1-5, 6px);padding:var(--nice-space-1, 4px) var(--nice-space-2, 8px);border:1px solid transparent;border-radius:var(--nice-radius-md, 6px);background:transparent;color:inherit;font:inherit;cursor:pointer}.nice-icon-stacker :where(button:hover:not(:disabled)){background:var(--nice-bg-hover, var(--nice-bg-secondary, #f1f5f9))}.nice-icon-stacker :where(button:disabled){opacity:.45;cursor:not-allowed}.nice-icon-stacker :where(input[type=text]){box-sizing:border-box;width:5em;padding:var(--nice-space-1, 4px) var(--nice-space-2, 8px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-primary, #fff);color:var(--nice-text-primary, inherit);font:inherit}.nice-icon-stacker :where(input[type=range]){flex:1 1 auto;min-width:0;accent-color:var(--nice-color-primary, #3b82f6)}.nice-icon-stacker :where(button,input,summary):focus-visible{outline:none;box-shadow:var(--nice-focus-ring, 0 0 0 2px var(--nice-color-primary, #3b82f6))}.nice-icon-stacker__bar{display:flex;align-items:center;gap:var(--nice-space-1, 4px)}.nice-icon-stacker__title{flex:1 1 auto;color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem);font-weight:var(--nice-font-weight-semibold, 600);letter-spacing:.04em;text-transform:uppercase}.nice-icon-stacker :where(.nice-icon-stacker__add){border-color:var(--nice-border-color, #e2e8f0);font-weight:var(--nice-font-weight-medium, 500)}.nice-icon-stacker :where(.nice-icon-stacker__add:hover:not(:disabled)){border-color:var(--nice-color-primary, #3b82f6);color:var(--nice-color-primary, #3b82f6)}.nice-icon-stacker__empty{margin:0;padding:var(--nice-space-4, 16px);border:1px dashed var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-lg, 8px);color:var(--nice-text-secondary, #64748b);text-align:center}.nice-icon-stacker__top{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--nice-space-3, 12px)}.nice-icon-stacker__preview{display:flex;flex:0 0 auto;flex-direction:column;align-items:center;gap:var(--nice-space-2, 8px);padding:var(--nice-space-3, 12px);border-radius:var(--nice-radius-lg, 8px);background:var(--nice-bg-secondary, #f8fafc)}.nice-icon-stacker__preview-main{display:inline-flex}.nice-icon-stacker__preview-small{display:flex;align-items:flex-end;gap:var(--nice-space-2, 8px)}.nice-icon-stacker__preview-small>span{display:inline-flex}.nice-icon-stacker__layers-wrap{display:flex;flex:1 1 180px;flex-direction:column;gap:var(--nice-space-1, 4px);min-width:0}.nice-icon-stacker__layers{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}.nice-icon-stacker__layer{--nice-icon-stacker-depth: 0;display:flex;align-items:center;padding-left:calc(var(--nice-icon-stacker-depth, 0) * var(--nice-space-4, 16px));border-radius:var(--nice-radius-md, 6px)}.nice-icon-stacker__layer:hover{background:var(--nice-bg-hover, var(--nice-bg-secondary, #f1f5f9))}.nice-icon-stacker__layer.nice-icon-stacker__layer--selected{background:color-mix(in srgb,var(--nice-color-primary, #3b82f6) 14%,transparent)}.nice-icon-stacker :where(.nice-icon-stacker__layer-select){flex:1 1 auto;min-width:0;padding:var(--nice-space-1, 4px) var(--nice-space-1-5, 6px);text-align:left}.nice-icon-stacker :where(.nice-icon-stacker__layer-select:hover:not(:disabled)){background:transparent}.nice-icon-stacker__layer-icon{display:inline-flex;flex:0 0 auto}.nice-icon-stacker__layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nice-icon-stacker__layer--selected .nice-icon-stacker__layer-name{font-weight:var(--nice-font-weight-semibold, 600)}.nice-icon-stacker__layer-text{padding:0 var(--nice-space-1, 4px);border-radius:var(--nice-radius-sm, 4px);background:var(--nice-bg-tertiary, #f1f5f9);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker__badge{margin-left:auto;padding:0 var(--nice-space-1-5, 6px);border-radius:var(--nice-radius-full, 9999px);background:var(--nice-bg-tertiary, #f1f5f9);color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker :where(.nice-icon-stacker__remove){flex:0 0 auto;padding:var(--nice-space-1, 4px);color:var(--nice-text-secondary, #64748b);opacity:0}.nice-icon-stacker__layer:hover .nice-icon-stacker__remove,.nice-icon-stacker__layer--selected .nice-icon-stacker__remove,.nice-icon-stacker .nice-icon-stacker__remove:focus-visible{opacity:1}.nice-icon-stacker__hint{color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker__inspector{display:flex;flex-direction:column;gap:var(--nice-space-2, 8px);padding:var(--nice-space-2, 8px) var(--nice-space-3, 12px) var(--nice-space-3, 12px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-lg, 8px)}.nice-icon-stacker__inspector-head{display:flex;align-items:center;gap:var(--nice-space-1-5, 6px);font-weight:var(--nice-font-weight-semibold, 600)}.nice-icon-stacker__inspector-head small{color:var(--nice-text-secondary, #64748b);font-weight:var(--nice-font-weight-normal, 400)}.nice-icon-stacker__inspector-body{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--nice-space-3, 12px)}.nice-icon-stacker__pad{display:flex;flex:0 0 auto;flex-direction:column;align-items:stretch;gap:var(--nice-space-1-5, 6px)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto){justify-content:center;padding:2px var(--nice-space-2, 8px);border-color:var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-full, 9999px);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto[aria-checked=true]){border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-color-primary, #3b82f6);color:var(--nice-text-on-primary, #fff)}.nice-icon-stacker__pad-box{display:grid;grid-template-columns:repeat(5,16px);grid-template-rows:repeat(5,16px);place-items:center;padding:var(--nice-space-1, 4px);border:1.5px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-secondary, #f8fafc)}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot){width:10px;height:10px;padding:0;border:1.5px solid color-mix(in srgb,currentColor 55%,transparent);border-radius:50%}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot:hover:not(:disabled)){border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-primary-tint-20, transparent)}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot[aria-checked=true]){width:12px;height:12px;border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-color-primary, #3b82f6)}.nice-icon-stacker__fields{display:flex;flex:1 1 140px;flex-direction:column;gap:var(--nice-space-2, 8px);min-width:0}.nice-icon-stacker__field{display:flex;align-items:center;gap:var(--nice-space-2, 8px);min-width:0}.nice-icon-stacker__field>span{flex:0 0 auto;min-width:4.5em;color:var(--nice-text-secondary, #64748b)}.nice-icon-stacker__field output{flex:0 0 auto;min-width:3.5ch;font-variant-numeric:tabular-nums;text-align:right}.nice-icon-stacker__field :where(input[aria-invalid=true]){border-color:var(--nice-color-error, #ef4444)}.nice-icon-stacker__more>summary{width:max-content;border-radius:var(--nice-radius-sm, 4px);color:var(--nice-text-secondary, #64748b);cursor:pointer}.nice-icon-stacker__more-body{display:flex;flex-direction:column;gap:var(--nice-space-2, 8px);padding-top:var(--nice-space-2, 8px)}.nice-icon-stacker__swatches{display:flex;flex-wrap:wrap;gap:var(--nice-space-1, 4px) var(--nice-space-3, 12px)}.nice-icon-stacker__swatch{display:inline-flex;align-items:center}.nice-icon-stacker__swatch-pick{position:relative;display:inline-flex;align-items:center;gap:var(--nice-space-1-5, 6px);cursor:pointer}.nice-icon-stacker__swatch-pick input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.nice-icon-stacker__swatch-pick:focus-within{border-radius:var(--nice-radius-sm, 4px);box-shadow:var(--nice-focus-ring, 0 0 0 2px var(--nice-color-primary, #3b82f6))}.nice-icon-stacker__swatch-dot{width:16px;height:16px;border:1px solid var(--nice-border-color, #e2e8f0);border-radius:50%}.nice-icon-stacker__swatch-pick--auto .nice-icon-stacker__swatch-dot{border:1.5px dashed color-mix(in srgb,currentColor 55%,transparent);background:transparent}.nice-icon-stacker :where(.nice-icon-stacker__reset){padding:2px;color:var(--nice-text-secondary, #64748b)}.nice-icon-stacker__code>summary{width:max-content;border-radius:var(--nice-radius-sm, 4px);color:var(--nice-text-secondary, #64748b);cursor:pointer}.nice-icon-stacker__code pre{box-sizing:border-box;width:100%;margin:var(--nice-space-2, 8px) 0;padding:var(--nice-space-3, 12px);overflow-x:auto;border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-secondary, #f8fafc);font-family:var(--nice-font-mono, ui-monospace, monospace);font-size:var(--nice-font-size-xs, .75rem)}.nice-icon-stacker :where(.nice-icon-stacker__code button){border-color:var(--nice-border-color, #e2e8f0)}.ntd-picker{--ntd-picker-border: var(--nice-border-color, #3a3a4a);--ntd-picker-radius: var(--nice-radius-lg, 10px);--ntd-picker-bg: var(--nice-bg-elevated, #1e1e2a);--ntd-picker-text: var(--nice-text-primary, #f0f0f5);--ntd-picker-accent: var(--nice-color-primary, #6c5ce7);--ntd-picker-accent-hover: var(--nice-color-primary-hover, #5b4cdb);--ntd-picker-accent-alpha: var(--nice-primary-tint-20, rgba(108, 92, 231, .2));--ntd-picker-muted: var(--nice-text-muted, #606078);--ntd-picker-text-secondary: var(--nice-text-secondary, #a0a0b4);--ntd-picker-input-bg: var(--nice-bg-inset, #14141c);position:relative;display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.ntd-picker-trigger{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:var(--ntd-picker-radius, 10px);background:var(--ntd-picker-bg, #1e1e2a);color:var(--ntd-picker-text, #f0f0f5);font-size:.875rem;font-family:inherit;cursor:pointer;transition:border-color .2s,box-shadow .2s;min-width:160px;user-select:none}.ntd-picker-trigger:hover{border-color:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-trigger:focus-visible{outline:none;border-color:var(--ntd-picker-accent, #6c5ce7);box-shadow:0 0 0 3px var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .25))}.ntd-picker-trigger-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12))}.ntd-picker-trigger-label{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ntd-picker-trigger-placeholder{color:var(--ntd-picker-muted, #606078)}.ntd-picker-trigger-chevron{flex-shrink:0;transition:transform .2s;color:var(--ntd-picker-muted, #606078)}.ntd-picker.ntd-picker--open .ntd-picker-trigger-chevron{transform:rotate(180deg)}.ntd-picker-dropdown{position:absolute;top:calc(100% + 6px);left:0;z-index:1000;width:380px;max-height:460px;display:flex;flex-direction:column;background:var(--ntd-picker-bg, #1e1e2a);border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:var(--ntd-picker-radius, 10px);box-shadow:0 12px 40px #0006,0 4px 12px #0003;overflow:hidden;animation:ntd-picker-appear .2s ease-out}@keyframes ntd-picker-appear{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-picker-search{position:relative;padding:10px 12px;border-bottom:1px solid var(--ntd-picker-border, #3a3a4a);flex-shrink:0}.ntd-picker-search-icon{position:absolute;left:22px;top:50%;transform:translateY(-50%);color:var(--ntd-picker-muted, #606078);pointer-events:none}.ntd-picker-search input{width:100%;padding:8px 12px 8px 34px;border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:8px;background:var(--ntd-picker-input-bg, #14141c);color:var(--ntd-picker-text, #f0f0f5);font-size:.82rem;font-family:inherit;outline:none;transition:border-color .2s}.ntd-picker-search input:focus{border-color:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-search input::placeholder{color:var(--ntd-picker-muted, #606078)}.ntd-picker-tabs{display:flex;gap:2px;padding:6px 10px;border-bottom:1px solid var(--ntd-picker-border, #3a3a4a);overflow-x:auto;flex-shrink:0;scrollbar-width:none}.ntd-picker-tabs::-webkit-scrollbar{display:none}.ntd-picker-tab{padding:5px 10px;border:none;border-radius:6px;background:transparent;color:var(--ntd-picker-muted, #606078);font-size:.72rem;font-family:inherit;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .15s;text-transform:uppercase;letter-spacing:.03em}.ntd-picker-tab:hover{color:var(--ntd-picker-text, #f0f0f5);background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12))}.ntd-picker-tab.ntd-picker-tab--active{color:#fff;background:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-grid-wrap{flex:1;overflow-y:auto;padding:8px;scrollbar-width:thin;scrollbar-color:var(--ntd-picker-border, #3a3a4a) transparent}.ntd-picker-grid-wrap::-webkit-scrollbar{width:5px}.ntd-picker-grid-wrap::-webkit-scrollbar-track{background:transparent}.ntd-picker-grid-wrap::-webkit-scrollbar-thumb{background:var(--ntd-picker-border, #3a3a4a);border-radius:3px}.ntd-picker-category-label{font-size:.68rem;font-weight:600;color:var(--ntd-picker-muted, #606078);text-transform:uppercase;letter-spacing:.05em;padding:6px 4px 4px;margin-top:4px}.ntd-picker-category-label:first-child{margin-top:0}.ntd-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:4px}.ntd-picker-cell{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;border:none;border-radius:8px;background:transparent;color:var(--ntd-picker-text, #f0f0f5);cursor:pointer;transition:all .15s;position:relative}.ntd-picker-cell:hover{background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12));transform:scale(1.1)}.ntd-picker-cell.ntd-picker-cell--selected{background:var(--ntd-picker-accent, #6c5ce7);color:#fff;box-shadow:0 2px 8px var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .25))}.ntd-picker-cell:focus-visible{outline:2px solid var(--ntd-picker-accent, #6c5ce7);outline-offset:1px}.ntd-picker-cell:after{content:attr(data-name);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);padding:3px 8px;border-radius:5px;background:var(--ntd-picker-text, #f0f0f5);color:var(--ntd-picker-bg, #1e1e2a);font-size:.65rem;font-weight:500;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;z-index:10}.ntd-picker-cell:hover:after{opacity:1}.ntd-picker-cell.ntd-picker-cell--draggable{cursor:grab}.ntd-picker-cell.ntd-picker-cell--draggable:active{cursor:grabbing}.ntd-picker-cell.ntd-picker-cell--draggable:hover:before{content:"";position:absolute;inset:0;border:2px dashed var(--ntd-picker-accent, #6c5ce7);border-radius:8px;opacity:.5;pointer-events:none}.ntd-picker-empty{padding:32px 16px;text-align:center;color:var(--ntd-picker-muted, #606078);font-size:.82rem}.ntd-picker-empty-icon{font-size:2rem;margin-bottom:8px;opacity:.4}.ntd-picker-footer{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-top:1px solid var(--ntd-picker-border, #3a3a4a);flex-shrink:0}.ntd-picker-count{font-size:.7rem;color:var(--ntd-picker-muted, #606078)}.ntd-picker-clear{padding:4px 10px;border:none;border-radius:5px;background:transparent;color:var(--ntd-picker-muted, #606078);font-size:.72rem;font-family:inherit;cursor:pointer;transition:all .15s}.ntd-picker-clear:hover{background:#ff50501f;color:#ff5050}.ntd-picker-multi-badge{display:flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--ntd-picker-accent, #6c5ce7);color:#fff;font-size:.7rem;font-weight:600}.ntd-picker-cell-check{position:absolute;top:2px;right:2px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--ntd-picker-accent, #6c5ce7);color:#fff;pointer-events:none}.ntd-picker-cell.ntd-picker-cell--multi-select{position:relative}.ntd-picker-cell-fav{position:absolute;top:2px;left:2px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;border:none;border-radius:50%;background:transparent;color:var(--ntd-picker-muted, #606078);cursor:pointer;opacity:0;transition:all .15s;padding:0}.ntd-picker-cell-wrap{position:relative}.ntd-picker-cell-wrap:hover .ntd-picker-cell-fav,.ntd-picker-cell-fav.ntd-picker-cell-fav--active{opacity:1}.ntd-picker-cell-fav:hover{color:#feca57;transform:scale(1.2)}.ntd-picker-cell-fav.ntd-picker-cell-fav--active{color:#feca57}.ntd-picker-tab-special{display:inline-flex;align-items:center;gap:4px}.ntd-picker-tab-special svg{width:10px;height:10px}.ntd-picker-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;margin-left:2px;border-radius:8px;background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .2));font-size:.65rem;font-weight:600}.ntd-picker-tab.ntd-picker-tab--active .ntd-picker-tab-count{background:#fff3}.ntd-picker-done{padding:4px 12px;border:none;border-radius:5px;background:var(--ntd-picker-accent, #6c5ce7);color:#fff;font-size:.72rem;font-family:inherit;font-weight:500;cursor:pointer;transition:all .15s}.ntd-picker-done:hover{background:var(--ntd-picker-accent-hover, #5b4cdb);transform:translateY(-1px)}.ntd-picker.ntd-picker--disabled .ntd-picker-trigger{opacity:.5;cursor:not-allowed}.ntd-picker.ntd-picker--multi .ntd-picker-trigger{border-style:dashed}.ntd-picker.ntd-picker--icon-only .ntd-picker-trigger{min-width:0;padding:4px}.ntd-picker-views{display:flex;flex-shrink:0;gap:2px;margin:10px 12px 0;padding:3px;border-radius:8px;background:var(--ntd-picker-input-bg, #14141c)}.ntd-picker-view{display:inline-flex;flex:1;align-items:center;justify-content:center;gap:6px;padding:5px 10px;border:none;border-radius:6px;background:transparent;color:var(--ntd-picker-text-secondary, #a0a0b4);font-family:inherit;font-size:.78rem;font-weight:500;cursor:pointer;transition:background .15s,color .15s}.ntd-picker-view:hover:not(:disabled){color:var(--ntd-picker-text, #f0f0f5)}.ntd-picker-view.ntd-picker-view--active{background:var(--ntd-picker-bg, #1e1e2a);color:var(--ntd-picker-text, #f0f0f5);box-shadow:0 0 0 1px var(--ntd-picker-border, #3a3a4a)}.ntd-picker-view:disabled{opacity:.45;cursor:not-allowed}.ntd-picker-view:focus-visible,.ntd-picker-back:focus-visible{outline:2px solid var(--ntd-picker-accent, #6c5ce7);outline-offset:1px}.ntd-picker-banner{display:flex;flex-shrink:0;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--ntd-picker-border, #3a3a4a);background:var(--ntd-picker-accent-alpha, rgba(108, 92, 231, .12));color:var(--ntd-picker-text, #f0f0f5);font-size:.8rem}.ntd-picker-back{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:1px solid var(--ntd-picker-border, #3a3a4a);border-radius:6px;background:var(--ntd-picker-bg, #1e1e2a);color:inherit;cursor:pointer}.ntd-picker-back:hover{border-color:var(--ntd-picker-accent, #6c5ce7)}.ntd-picker-panel{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.ntd-picker-dropdown.ntd-picker-dropdown--stack{max-height:min(620px,85vh)}.ntd-picker-dropdown.ntd-picker-dropdown--up{top:auto;bottom:calc(100% + 6px)}.ntd-picker-dropdown.ntd-picker-dropdown--end{right:0;left:auto}.ntd-picker-stack{--nice-border-color: var(--ntd-picker-border);--nice-bg-primary: var(--ntd-picker-input-bg);--nice-bg-secondary: var(--ntd-picker-input-bg);--nice-bg-tertiary: var(--ntd-picker-accent-alpha);--nice-bg-hover: var(--ntd-picker-accent-alpha);--nice-text-primary: var(--ntd-picker-text);--nice-text-secondary: var(--ntd-picker-text-secondary);--nice-color-primary: var(--ntd-picker-accent);flex:1 1 auto;min-height:0;padding:12px;overflow-y:auto;scrollbar-width:thin}.ntd-picker-stack[hidden],.ntd-picker-serializer{display:none}.ntd-picker-grid.ntd-picker-grid--names{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.ntd-picker-grid--names .ntd-picker-cell{justify-content:flex-start;gap:8px;aspect-ratio:auto;padding:6px 8px}.ntd-picker-grid--names .ntd-picker-cell:hover{transform:none}.ntd-picker-grid--names .ntd-picker-cell:after{content:none}.ntd-picker-cell-name{overflow:hidden;font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}.nice-desktop-icon-exporter{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--nice-space-4, 16px);min-width:0;color:var(--nice-text-primary, inherit);font-size:var(--nice-font-size-sm, .8125rem)}.nice-desktop-icon-exporter :where(h3,h4){margin:0 0 var(--nice-space-2, 8px);font-weight:var(--nice-font-weight-semibold, 600)}.nice-desktop-icon-exporter :where(h3){font-size:var(--nice-font-size-md, .875rem)}.nice-desktop-icon-exporter :where(h4){color:var(--nice-text-secondary, #64748b);font-size:var(--nice-font-size-xs, .75rem)}.nice-desktop-icon-exporter :where(button){padding:var(--nice-space-1-5, 6px) var(--nice-space-3, 12px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-primary, #fff);color:var(--nice-text-primary, inherit);font:inherit;cursor:pointer}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary, #f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){opacity:.5;cursor:not-allowed}.nice-desktop-icon-exporter :where(input[type=text]){box-sizing:border-box;padding:var(--nice-space-1-5, 6px) var(--nice-space-2, 8px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);background:var(--nice-bg-primary, #fff);color:var(--nice-text-primary, inherit);font:inherit}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary, #3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{outline:none;box-shadow:var(--nice-focus-ring, 0 0 0 2px var(--nice-color-primary, #3b82f6))}.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__results{min-width:0;padding:var(--nice-space-3, 12px);background:var(--nice-bg-elevated, var(--nice-bg-primary, #fff));border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-lg, 8px)}.nice-desktop-icon-exporter__preview-grid{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--nice-space-3, 12px)}.nice-desktop-icon-exporter__preview-item{display:flex;flex-direction:column;align-items:center;gap:var(--nice-space-1, 4px);color:var(--nice-text-muted, #94a3b8);font-size:var(--nice-font-size-xs, .75rem);font-variant-numeric:tabular-nums}.nice-desktop-icon-exporter__preview-box{display:flex;align-items:center;justify-content:center;border-radius:var(--nice-radius-sm, 4px)}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5, 10px)}.nice-desktop-icon-exporter__config>label{display:flex;flex-wrap:wrap;align-items:center;gap:var(--nice-space-2, 8px);color:var(--nice-text-secondary, #64748b);font-weight:var(--nice-font-weight-medium, 500)}.nice-desktop-icon-exporter__config>label>input[type=text],.nice-desktop-icon-exporter__config>label>input[type=range]{flex:1 1 140px;min-width:0}.nice-desktop-icon-exporter__platforms,.nice-desktop-icon-exporter__sizes{display:flex;flex-wrap:wrap;gap:var(--nice-space-1-5, 6px) var(--nice-space-4, 16px)}.nice-desktop-icon-exporter__sizes>h4{flex-basis:100%;margin:0}.nice-desktop-icon-exporter__platforms label,.nice-desktop-icon-exporter__sizes label{display:inline-flex;align-items:center;gap:var(--nice-space-1-5, 6px);cursor:pointer}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;grid-column:1 / -1;gap:var(--nice-space-2, 8px)}.nice-desktop-icon-exporter__actions>button:first-child{border-color:var(--nice-color-primary, #3b82f6);background:var(--nice-color-primary, #3b82f6);color:var(--nice-text-on-primary, #fff);font-weight:var(--nice-font-weight-medium, 500)}.nice-desktop-icon-exporter__results{grid-column:1 / -1}.nice-desktop-icon-exporter__results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--nice-space-2, 8px)}.nice-desktop-icon-exporter__result-item{display:flex;flex-direction:column;align-items:center;gap:var(--nice-space-1, 4px);padding:var(--nice-space-2, 8px);border:1px solid var(--nice-border-color, #e2e8f0);border-radius:var(--nice-radius-md, 6px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-width:64px;max-height:64px}.nice-desktop-icon-exporter__result-item>span{max-width:100%;overflow:hidden;color:var(--nice-text-secondary, #64748b);font-family:var(--nice-font-mono, ui-monospace, monospace);font-size:var(--nice-font-size-xxs, .625rem);text-overflow:ellipsis;white-space:nowrap}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { useSyncExternalStore } from "react";
|
|
2
|
+
const QUERY = "(prefers-reduced-motion: reduce)";
|
|
3
|
+
const hasMatchMedia = () => typeof window !== "undefined" && typeof window.matchMedia === "function";
|
|
4
|
+
function subscribe(callback) {
|
|
5
|
+
if (!hasMatchMedia()) {
|
|
6
|
+
return () => {
|
|
7
|
+
};
|
|
8
|
+
}
|
|
9
|
+
const mq = window.matchMedia(QUERY);
|
|
10
|
+
if (typeof mq.addEventListener === "function") {
|
|
11
|
+
mq.addEventListener("change", callback);
|
|
12
|
+
return () => mq.removeEventListener("change", callback);
|
|
13
|
+
}
|
|
14
|
+
mq.addListener?.(callback);
|
|
15
|
+
return () => mq.removeListener?.(callback);
|
|
16
|
+
}
|
|
17
|
+
function snapshot() {
|
|
18
|
+
return hasMatchMedia() ? window.matchMedia(QUERY).matches === true : false;
|
|
19
|
+
}
|
|
20
|
+
function usePrefersReducedMotion() {
|
|
21
|
+
return useSyncExternalStore(subscribe, snapshot, () => false);
|
|
22
|
+
}
|
|
23
|
+
function useStillMotion(mode) {
|
|
24
|
+
const reduce = usePrefersReducedMotion();
|
|
25
|
+
return reduce && mode !== "ignore";
|
|
26
|
+
}
|
|
27
|
+
export {
|
|
28
|
+
usePrefersReducedMotion,
|
|
29
|
+
useStillMotion
|
|
30
|
+
};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { durationScale } from "./animationSpeed.js";
|
|
2
|
+
import { stillTree, durationScale } from "./animationSpeed.js";
|
|
3
|
+
import { useStillMotion } from "./reducedMotion.js";
|
|
3
4
|
const DEFAULT_CONFIG = {
|
|
4
5
|
duration: 1,
|
|
5
6
|
repeatCount: "indefinite",
|
|
@@ -320,9 +321,11 @@ function SmilAnimationWrapper({
|
|
|
320
321
|
easing = "ease-in-out",
|
|
321
322
|
delay = 0,
|
|
322
323
|
center = { x: 12, y: 12 },
|
|
324
|
+
reducedMotion,
|
|
323
325
|
children
|
|
324
326
|
}) {
|
|
325
|
-
const
|
|
327
|
+
const still = useStillMotion(reducedMotion);
|
|
328
|
+
const generated = generateSmilAnimation(
|
|
326
329
|
{
|
|
327
330
|
type: animation,
|
|
328
331
|
// 1 s before 1.3.17; a given duration keeps its length
|
|
@@ -333,6 +336,7 @@ function SmilAnimationWrapper({
|
|
|
333
336
|
},
|
|
334
337
|
center
|
|
335
338
|
);
|
|
339
|
+
const animationElements = still ? stillTree(generated) : generated;
|
|
336
340
|
const needsOriginTransform = [
|
|
337
341
|
"heartbeat",
|
|
338
342
|
"scale-pulse",
|
package/dist/esm/utilities.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { useEffect, useState, useCallback, createElement
|
|
1
|
+
import { useEffect, useState, useCallback, createElement } from "react";
|
|
2
|
+
import { usePrefersReducedMotion } from "./reducedMotion.js";
|
|
2
3
|
/**
|
|
3
4
|
* @file utilities.ts
|
|
4
5
|
* @description Utility hooks and functions for @nice2dev/icons
|
|
@@ -85,31 +86,8 @@ function useIcon(iconName, options = {}) {
|
|
|
85
86
|
}, [iconName, cache, fallback]);
|
|
86
87
|
return state;
|
|
87
88
|
}
|
|
88
|
-
function subscribeToReducedMotion(callback) {
|
|
89
|
-
if (typeof window === "undefined") {
|
|
90
|
-
return () => {
|
|
91
|
-
};
|
|
92
|
-
}
|
|
93
|
-
const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
|
|
94
|
-
const handler = () => callback();
|
|
95
|
-
mediaQuery.addEventListener("change", handler);
|
|
96
|
-
return () => mediaQuery.removeEventListener("change", handler);
|
|
97
|
-
}
|
|
98
|
-
function getReducedMotionSnapshot() {
|
|
99
|
-
if (typeof window === "undefined") {
|
|
100
|
-
return false;
|
|
101
|
-
}
|
|
102
|
-
return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
103
|
-
}
|
|
104
|
-
function getReducedMotionServerSnapshot() {
|
|
105
|
-
return false;
|
|
106
|
-
}
|
|
107
89
|
function useReducedMotion() {
|
|
108
|
-
return
|
|
109
|
-
subscribeToReducedMotion,
|
|
110
|
-
getReducedMotionSnapshot,
|
|
111
|
-
getReducedMotionServerSnapshot
|
|
112
|
-
);
|
|
90
|
+
return usePrefersReducedMotion();
|
|
113
91
|
}
|
|
114
92
|
async function preloadIcons(iconNames) {
|
|
115
93
|
const results = /* @__PURE__ */ new Map();
|
|
@@ -143,7 +121,8 @@ function withReducedMotionProps(props, prefersReducedMotion) {
|
|
|
143
121
|
...props,
|
|
144
122
|
animation: void 0,
|
|
145
123
|
animationDuration: void 0,
|
|
146
|
-
gradientAnimation: void 0
|
|
124
|
+
gradientAnimation: void 0,
|
|
125
|
+
smilAnimation: void 0
|
|
147
126
|
};
|
|
148
127
|
}
|
|
149
128
|
function createAccessibleIconProps(options) {
|
|
@@ -17,3 +17,12 @@ export declare function durationScale(durationGiven: boolean, speed?: number): n
|
|
|
17
17
|
* inside a style decorator handles its own speed).
|
|
18
18
|
*/
|
|
19
19
|
export declare function retimeTree(node: React.ReactNode, scale: number): React.ReactNode;
|
|
20
|
+
/**
|
|
21
|
+
* The tree held still, for users who ask for reduced motion (1.3.18): every SVG animation element
|
|
22
|
+
* starts at once, lasts a millisecond and plays once. One that keeps its result (`fill="freeze"`, an
|
|
23
|
+
* entrance) shows its last frame; a loop rests on the shape as drawn. Component elements are passed
|
|
24
|
+
* as they are, like in {@link retimeTree}.
|
|
25
|
+
*/
|
|
26
|
+
export declare function stillTree(node: React.ReactNode): React.ReactNode;
|
|
27
|
+
/** The tree paced by `scale` — or held still (`still`, reduced motion). */
|
|
28
|
+
export declare function motionTree(node: React.ReactNode, scale: number, still: boolean): React.ReactNode;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { type IconReducedMotion } from './reducedMotion';
|
|
2
3
|
export type IconStyleIntensity = 'subtle' | 'normal' | 'dense';
|
|
3
4
|
export interface IconStyleBaseProps {
|
|
4
5
|
children: React.ReactNode;
|
|
@@ -11,6 +12,11 @@ export interface IconStyleBaseProps {
|
|
|
11
12
|
duration?: number;
|
|
12
13
|
/** Pace of the decorations (1.3.17): every time is divided by it. */
|
|
13
14
|
animationSpeed?: number;
|
|
15
|
+
/**
|
|
16
|
+
* The "reduce motion" setting (1.3.18): `'auto'` (default) holds the decorations still for users
|
|
17
|
+
* who ask for it — entrances show their result, loops stop; `'ignore'` plays them anyway.
|
|
18
|
+
*/
|
|
19
|
+
reducedMotion?: IconReducedMotion;
|
|
14
20
|
/** Amount of decorative elements. @default 'normal' */
|
|
15
21
|
intensity?: IconStyleIntensity;
|
|
16
22
|
className?: string;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/** Whether the user asks for reduced motion — follows the setting while it changes. */
|
|
2
|
+
export declare function usePrefersReducedMotion(): boolean;
|
|
3
|
+
/** How an icon treats the reduce-motion setting: `'auto'` stops its animations, `'ignore'` plays them. */
|
|
4
|
+
export type IconReducedMotion = 'auto' | 'ignore';
|
|
5
|
+
/** Whether an icon should hold still: the user asks for reduced motion and the icon does not ignore it. */
|
|
6
|
+
export declare function useStillMotion(mode: IconReducedMotion | undefined): boolean;
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
* ```
|
|
15
15
|
*/
|
|
16
16
|
import React from 'react';
|
|
17
|
+
import { type IconReducedMotion } from './reducedMotion';
|
|
17
18
|
/**
|
|
18
19
|
* SMIL animation types available for icons.
|
|
19
20
|
*
|
|
@@ -72,6 +73,11 @@ export interface SmilAnimationWrapperProps {
|
|
|
72
73
|
x: number;
|
|
73
74
|
y: number;
|
|
74
75
|
};
|
|
76
|
+
/**
|
|
77
|
+
* The "reduce motion" setting (1.3.18): `'auto'` (default) shows the animation's last frame for
|
|
78
|
+
* users who ask for it; `'ignore'` plays it anyway.
|
|
79
|
+
*/
|
|
80
|
+
reducedMotion?: IconReducedMotion;
|
|
75
81
|
/** Child elements to animate */
|
|
76
82
|
children: React.ReactNode;
|
|
77
83
|
}
|
|
@@ -87,7 +93,7 @@ export interface SmilAnimationWrapperProps {
|
|
|
87
93
|
* </svg>
|
|
88
94
|
* ```
|
|
89
95
|
*/
|
|
90
|
-
export declare function SmilAnimationWrapper({ animation, duration, animationSpeed, repeatCount, easing, delay, center, children, }: SmilAnimationWrapperProps): React.JSX.Element;
|
|
96
|
+
export declare function SmilAnimationWrapper({ animation, duration, animationSpeed, repeatCount, easing, delay, center, reducedMotion, children, }: SmilAnimationWrapperProps): React.JSX.Element;
|
|
91
97
|
/**
|
|
92
98
|
* Creates a SMIL animation definition that can be referenced by id.
|
|
93
99
|
* Useful for applying the same animation to multiple elements.
|
package/dist/types/types.d.ts
CHANGED
|
@@ -223,6 +223,25 @@ export interface NtdIconProps extends Omit<SVGProps<SVGSVGElement>, 'ref'> {
|
|
|
223
223
|
* `smilDuration` keeps its length and is only divided by this.
|
|
224
224
|
*/
|
|
225
225
|
animationSpeed?: number;
|
|
226
|
+
/**
|
|
227
|
+
* `'single'` plays a looping `animation` once (1.3.18) — a flip, a spin, a bounce — the parts an
|
|
228
|
+
* icon animates inside itself included. Default `'loop'`. One-shot animations (`fade-in`, `draw`…)
|
|
229
|
+
* play once either way.
|
|
230
|
+
*/
|
|
231
|
+
animationMode?: 'loop' | 'single';
|
|
232
|
+
/**
|
|
233
|
+
* Change it to play the animations again (1.3.18): the icon starts its CSS and SVG animations
|
|
234
|
+
* over, e.g. `playKey={count}` bumped on an event.
|
|
235
|
+
*/
|
|
236
|
+
playKey?: string | number;
|
|
237
|
+
/** Play the animations again on every click of the icon (1.3.18); `onClick` still runs. */
|
|
238
|
+
replayOnClick?: boolean;
|
|
239
|
+
/**
|
|
240
|
+
* The operating system's "reduce motion" setting (1.3.18). `'auto'` (default): for users who ask
|
|
241
|
+
* for it the icon holds still — no CSS animation, its SVG animations jump to their last frame
|
|
242
|
+
* (an entrance shows its result, a loop rests on the shape as drawn). `'ignore'` plays anyway.
|
|
243
|
+
*/
|
|
244
|
+
reducedMotion?: 'auto' | 'ignore';
|
|
226
245
|
/** SMIL animation to apply (SVG-native, no CSS required) */
|
|
227
246
|
smilAnimation?: SmilAnimationType;
|
|
228
247
|
/** SMIL animation duration in seconds (default: 1) */
|
|
@@ -90,8 +90,8 @@ export declare function getRegisteredIconNames(): string[];
|
|
|
90
90
|
*/
|
|
91
91
|
export declare function useIcon(iconName: string | undefined, options?: UseIconOptions): UseIconResult;
|
|
92
92
|
/**
|
|
93
|
-
* Hook that returns true if user prefers reduced motion
|
|
94
|
-
*
|
|
93
|
+
* Hook that returns true if user prefers reduced motion — the store the icons themselves follow
|
|
94
|
+
* since 1.3.18 (they hold still on their own; `reducedMotion="ignore"` opts out).
|
|
95
95
|
*
|
|
96
96
|
* @returns Whether the user prefers reduced motion
|
|
97
97
|
*
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nice2dev/icons",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.18",
|
|
4
4
|
"description": "Beautiful, lightweight, multi-color SVG icon library for React with animations",
|
|
5
5
|
"author": "NiceToDev <contact@nicetodev.com>",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE",
|
|
@@ -109,7 +109,7 @@
|
|
|
109
109
|
},
|
|
110
110
|
"devDependencies": {
|
|
111
111
|
"@chromatic-com/storybook": "^5.3.1",
|
|
112
|
-
"@nice2dev/ui-core": "^1.3.
|
|
112
|
+
"@nice2dev/ui-core": "^1.3.18",
|
|
113
113
|
"@storybook/addon-a11y": "^10.6.6",
|
|
114
114
|
"@storybook/addon-docs": "^10.6.6",
|
|
115
115
|
"@storybook/react-vite": "^10.6.6",
|