@nice2dev/icons 1.3.2 → 1.3.4

package/dist/cjs/icons/social.js

@@ -2,6 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var createIcon = require('../createIcon.js');
+var iconParts = require('../iconParts.js');
 
 const NtdAtSign = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdAtSign',
@@ -48,15 +49,8 @@ const NtdThumbsDown = /* @__PURE__ */ createIcon.createIcon({
         vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("rect", { x: "17", y: "2", width: "4", height: "11", rx: "1", fill: secondaryColor })] })),
     },
 });
-const NtdBellRing = /* @__PURE__ */ createIcon.createIcon({
-    displayName: 'NtdBellRing',
-    paths: {
-        solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M13.73 21a2 2 0 01-3.46 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M2 4l1.5 1.5", stroke: secondaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("path", { d: "M22 4l-1.5 1.5", stroke: secondaryColor, strokeWidth: strokeWidth })] })),
-        outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M13.73 21a2 2 0 01-3.46 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M2 4l1.5 1.5", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("path", { d: "M22 4l-1.5 1.5", stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M13.73 21a2 2 0 01-3.46 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M2 4l1.5 1.5", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("path", { d: "M22 4l-1.5 1.5", stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9", fill: "white", opacity: "0.1" }), jsxRuntime.jsx("path", { d: "M13.73 21a2 2 0 01-3.46 0", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" }), jsxRuntime.jsx("path", { d: "M2 4l1.5 1.5", stroke: "#3B82F6", strokeWidth: "1.5" }), jsxRuntime.jsx("path", { d: "M22 4l-1.5 1.5", stroke: "#3B82F6", strokeWidth: "1.5" })] })),
-    },
-});
+// NtdBell's bell (iconParts' bellIcon) with ring marks
+const NtdBellRing = /* @__PURE__ */ iconParts.bellIcon('NtdBellRing', true);
 const NtdMegaphone = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdMegaphone',
     paths: {

package/dist/cjs/icons/travel.js

@@ -2,6 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var createIcon = require('../createIcon.js');
+var iconParts = require('../iconParts.js');
 
 /* ────────────────────────────────────────────────────────────────────────────
    TRANSPORTATION
@@ -42,13 +43,29 @@ const NtdCar = /* @__PURE__ */ createIcon.createIcon({
         vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M5 11l2-5h10l2 5M3 14v4a1 1 0 001 1h2a1 1 0 001-1v-1h10v1a1 1 0 001 1h2a1 1 0 001-1v-4a2 2 0 00-2-2H5a2 2 0 00-2 2z", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M5 11l2-5h10l2 5M3 14v4a1 1 0 001 1h2a1 1 0 001-1v-1h10v1a1 1 0 001 1h2a1 1 0 001-1v-4a2 2 0 00-2-2H5a2 2 0 00-2 2z", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("circle", { cx: "7", cy: "15", r: "1.5", fill: "white", opacity: "0.5" }), jsxRuntime.jsx("circle", { cx: "17", cy: "15", r: "1.5", fill: "white", opacity: "0.5" })] })),
     },
 });
+// NtdBus: seen from the front — the body with a big windscreen (its top frame 1.75, 30% less than
+// the side view's), the driver (NtdUser's head and shoulders) in it on the left, two headlights and
+// a bumper line below it, and the wheels as rectangles under the body (round side-view wheels
+// read oddly). Filled, the windscreen, the headlights and the bumper are in the accent colour and
+// the driver primary.
+const BUS_BODY = { x: 3, y: 2, width: 18, height: 17, rx: 2.5 };
+const BUS_WINDOW = { x: 4.75, y: 3.75, width: 14.5, height: 7.5, rx: 1 };
+/** The driver, cut off by the windscreen's bottom edge. */
+const BUS_DRIVER = 'M8.4 5.3a1.6 1.6 0 110 3.2 1.6 1.6 0 110-3.2zM5.6 11.5v-.1a2.3 2.3 0 012.3-2.3h1a2.3 2.3 0 012.3 2.3v.1z';
+const BUS_LIGHTS = 'M6.6 13.7a1.3 1.3 0 110 2.6 1.3 1.3 0 110-2.6zM17.4 13.7a1.3 1.3 0 110 2.6 1.3 1.3 0 110-2.6z';
+const BUS_BUMPER = 'M3 17.4h18';
+const BUS_WHEELS = 'M5.5 18h3v3a1 1 0 01-1 1h-1a1 1 0 01-1-1zM15.5 18h3v3a1 1 0 01-1 1h-1a1 1 0 01-1-1z';
+function busFilled({ primaryColor, uid }, glass, details, detailOpacity) {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: BUS_WHEELS, fill: primaryColor }), jsxRuntime.jsx("rect", { ...BUS_BODY, fill: primaryColor }), jsxRuntime.jsxs("g", { opacity: detailOpacity, children: [jsxRuntime.jsx("path", { d: BUS_LIGHTS, fill: details }), iconParts.within(uid, 'body', jsxRuntime.jsx("rect", { ...BUS_BODY }), jsxRuntime.jsx("path", { d: BUS_BUMPER, stroke: details, strokeWidth: "1.2" }))] }), jsxRuntime.jsx("rect", { ...BUS_WINDOW, fill: glass }), iconParts.within(uid, 'window', jsxRuntime.jsx("rect", { ...BUS_WINDOW }), jsxRuntime.jsx("path", { d: BUS_DRIVER, fill: primaryColor }))] }));
+}
 const NtdBus = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdBus',
     paths: {
-        solid: ({ primaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "14", rx: "2", fill: primaryColor }), jsxRuntime.jsx("rect", { x: "5", y: "6", width: "5", height: "4", rx: "1", fill: "white", opacity: "0.5" }), jsxRuntime.jsx("rect", { x: "11", y: "6", width: "5", height: "4", rx: "1", fill: "white", opacity: "0.5" }), jsxRuntime.jsx("rect", { x: "5", y: "12", width: "14", height: "2", rx: "0.5", fill: "white", opacity: "0.3" }), jsxRuntime.jsx("circle", { cx: "7", cy: "18", r: "2", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "17", cy: "18", r: "2", fill: primaryColor })] })),
-        outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "14", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("rect", { x: "5", y: "6", width: "5", height: "4", rx: "1", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("rect", { x: "11", y: "6", width: "5", height: "4", rx: "1", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M5 12h14", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("circle", { cx: "7", cy: "18", r: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("circle", { cx: "17", cy: "18", r: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "14", rx: "2", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "14", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("rect", { x: "5", y: "6", width: "5", height: "4", rx: "1", fill: primaryColor }), jsxRuntime.jsx("rect", { x: "11", y: "6", width: "5", height: "4", rx: "1", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M5 12h14", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("circle", { cx: "7", cy: "18", r: "2", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "17", cy: "18", r: "2", fill: primaryColor })] })),
-        vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "14", rx: "2", fill: primaryColor }), jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "14", rx: "2", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("rect", { x: "5", y: "6", width: "5", height: "4", rx: "1", fill: "white", opacity: "0.5" }), jsxRuntime.jsx("rect", { x: "11", y: "6", width: "5", height: "4", rx: "1", fill: "white", opacity: "0.5" }), jsxRuntime.jsx("rect", { x: "5", y: "12", width: "14", height: "2", rx: "0.5", fill: "white", opacity: "0.3" }), jsxRuntime.jsx("circle", { cx: "7", cy: "18", r: "2", fill: "#F59E0B" }), jsxRuntime.jsx("circle", { cx: "17", cy: "18", r: "2", fill: "#F59E0B" })] })),
+        solid: (props) => busFilled(props, props.accentColor, props.accentColor, props.accentOpacity),
+        outline: ({ primaryColor, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { ...BUS_BODY, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("rect", { ...BUS_WINDOW, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), iconParts.within(uid, 'window', jsxRuntime.jsx("rect", { ...BUS_WINDOW }), jsxRuntime.jsx("path", { d: BUS_DRIVER, fill: primaryColor })), jsxRuntime.jsx("path", { d: "M6.6 14a1 1 0 110 2 1 1 0 110-2zM17.4 14a1 1 0 110 2 1 1 0 110-2z", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M6 19v2a1 1 0 001 1h1a1 1 0 001-1v-2M15 19v2a1 1 0 001 1h1a1 1 0 001-1v-2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
+        // fills only: the body and the driver primary, the windscreen and the details secondary
+        duotone: (props) => busFilled(props, props.secondaryColor, props.secondaryColor, 1),
+        vivid: (props) => busFilled(props, props.secondaryColor, props.accentColor, props.accentOpacity),
     },
 });
 const NtdShip = /* @__PURE__ */ createIcon.createIcon({

package/dist/cjs/icons/ui.js

@@ -29,21 +29,24 @@ const NtdUser = /* @__PURE__ */ createIcon.createIcon({
     paths: {
         solid: ({ primaryColor, strokeWidth: _strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", fill: primaryColor })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", fill: secondaryColor })] })),
+        // fills only, like vivid: the head primary, the shoulders secondary
+        duotone: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", fill: secondaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2", fill: secondaryColor })] })),
     },
 });
-// NtdAdmin: NtdUser in a tie — the same head and shoulders, a knot at the collar and a blade down
-// the chest.
+// NtdAdmin: NtdUser in a tie — the same head and shoulders, a knot at the collar and a blade that
+// runs down the chest to the bottom edge, cut off there (a whole short tie with its tip read
+// comic).
 const ADMIN_BODY = 'M20.8 21.9v-2.2a4.4 4.4 0 00-4.4-4.4H7.6a4.4 4.4 0 00-4.4 4.4v2.2';
-const ADMIN_TIE = 'M10.8 15.3h2.4l-.6 1.6.8 3.2L12 21.2l-1.4-1.1.8-3.2z';
+const ADMIN_TIE = 'M10.7 15.3h2.6l-.65 1.8 1.05 4.8h-3.4l1.05-4.8z';
 const NtdAdmin = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdAdmin',
     paths: {
         solid: ({ primaryColor, accentColor, accentOpacity }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: ADMIN_BODY, fill: primaryColor }), jsxRuntime.jsx("path", { d: ADMIN_TIE, fill: accentColor, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: ADMIN_BODY, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: ADMIN_TIE, fill: primaryColor })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: ADMIN_BODY, fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: ADMIN_BODY, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: ADMIN_TIE, fill: primaryColor })] })),
-        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("path", { d: ADMIN_BODY, fill: secondaryColor }), jsxRuntime.jsx("path", { d: ADMIN_TIE, fill: primaryColor })] })),
+        // as NtdUser: fills only, the head (and the tie) primary, the shoulders secondary
+        duotone: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: ADMIN_BODY, fill: secondaryColor }), jsxRuntime.jsx("path", { d: ADMIN_TIE, fill: primaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "7.6", r: "4.4", fill: primaryColor }), jsxRuntime.jsx("path", { d: ADMIN_BODY, fill: secondaryColor }), jsxRuntime.jsx("path", { d: ADMIN_TIE, fill: primaryColor })] })),
     },
 });
 const NtdUsers = /* @__PURE__ */ createIcon.createIcon({
@@ -55,13 +58,17 @@ const NtdUsers = /* @__PURE__ */ createIcon.createIcon({
         vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "9", cy: "7", r: "4", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "9", cy: "7", r: "4", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("path", { d: "M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2", fill: secondaryColor }), jsxRuntime.jsx("path", { d: "M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75", stroke: "white", strokeWidth: "1", fill: "none" })] })),
     },
 });
+// NtdHeart: duotone fills the heart primary inside a secondary outline (the other way round
+// before); vivid splits it down the middle — primary left, secondary right — inside an accent
+// outline (it was an accent seam between the halves).
+const HEART = 'M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z';
 const NtdHeart = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdHeart',
     paths: {
         solid: ({ primaryColor, strokeWidth: _strokeWidth }) => (jsxRuntime.jsx("path", { d: "M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z", fill: primaryColor })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: "M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z", fill: "white", opacity: "0.1" })] })),
+        duotone: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: HEART, fill: primaryColor, stroke: secondaryColor, strokeWidth: strokeWidth })),
+        vivid: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: HEART, fill: secondaryColor }), iconParts.within(uid, 'left', jsxRuntime.jsx("rect", { x: "0", y: "0", width: "12", height: "24" }), jsxRuntime.jsx("path", { d: HEART, fill: primaryColor })), jsxRuntime.jsx("path", { d: HEART, stroke: accentColor, strokeWidth: strokeWidth, opacity: accentOpacity, fill: "none" })] })),
     },
 });
 const NtdStar = /* @__PURE__ */ createIcon.createIcon({
@@ -73,24 +80,18 @@ const NtdStar = /* @__PURE__ */ createIcon.createIcon({
         vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z", fill: "white", opacity: "0.1" })] })),
     },
 });
-const NtdBell = /* @__PURE__ */ createIcon.createIcon({
-    displayName: 'NtdBell',
-    paths: {
-        solid: ({ primaryColor, strokeWidth: _strokeWidth }) => (jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9zM13.73 21a2 2 0 01-3.46 0", fill: primaryColor, stroke: primaryColor, strokeWidth: "1" })),
-        outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M13.73 21a2 2 0 01-3.46 0", stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9z", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M13.73 21a2 2 0 01-3.46 0", stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9zM13.73 21a2 2 0 01-3.46 0", fill: primaryColor, stroke: primaryColor, strokeWidth: "1" }), jsxRuntime.jsx("path", { d: "M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9zM13.73 21a2 2 0 01-3.46 0", fill: "white", opacity: "0.1" })] })),
-    },
-});
+const NtdBell = /* @__PURE__ */ iconParts.bellIcon('NtdBell', false);
 const NtdEye = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdEye',
     paths: {
-        // the whole eye primary, the iris in the accent colour around a primary pupil (it was a
-        // 15% tint with a primary dot)
-        solid: ({ primaryColor, accentColor, accentOpacity }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3.6", fill: accentColor, opacity: accentOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "1.6", fill: primaryColor })] })),
+        // the whole eye primary, the iris a thin ring in the accent colour (r 4.5) around a large pupil
+        // (r 3.4) — primary here (the filled variants do not use secondary), secondary in duotone and
+        // vivid
+        solid: ({ primaryColor, accentColor, accentOpacity }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "4.5", fill: accentColor, opacity: accentOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3.4", fill: primaryColor })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3", fill: primaryColor })] })),
-        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: primaryColor }), jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3.6", fill: secondaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "1.6", fill: primaryColor })] })),
+        // the eye primary, the ring in the accent colour, the pupil secondary
+        duotone: ({ primaryColor, secondaryColor, accentColor, accentOpacity }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "4.5", fill: accentColor, opacity: accentOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3.4", fill: secondaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor, accentColor, accentOpacity }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "4.5", fill: accentColor, opacity: accentOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3.4", fill: secondaryColor })] })),
     },
 });
 const NtdEyeOff = /* @__PURE__ */ createIcon.createIcon({
@@ -147,30 +148,68 @@ const NtdHelp = /* @__PURE__ */ createIcon.createIcon({
         vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: "white", opacity: "0.08" }), jsxRuntime.jsx("circle", { cx: "12", cy: "17", r: "1", fill: secondaryColor }), jsxRuntime.jsx("path", { d: "M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3", stroke: "white", strokeWidth: "1", fill: "none", opacity: "0.4" })] })),
     },
 });
-/** The hands: minute 6.8 long, hour 5.4 (were 6 and 4.5). */
+/**
+ * The hands: minute 6.8 long, hour 5.4 (were 6 and 4.5) — twice the stroke width in every variant
+ * but `outline`.
+ */
 const CLOCK_HANDS = 'M12 5.2V12l4.83 2.41';
 const NtdClock = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdClock',
     paths: {
-        solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: accentColor, strokeWidth: strokeWidth, opacity: accentOpacity })] })),
+        solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: accentColor, strokeWidth: strokeWidth * 2, opacity: accentOpacity })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: "white", opacity: "0.1" }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: secondaryColor, strokeWidth: "1.8" })] })),
+        duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: primaryColor, strokeWidth: strokeWidth * 2 })] })),
+        vivid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: "white", opacity: "0.1" }), jsxRuntime.jsx("path", { d: CLOCK_HANDS, stroke: secondaryColor, strokeWidth: strokeWidth * 2 })] })),
+    },
+});
+// NtdHourglass: two plates and the curved glass between them, the sand running from the top bulb
+// (resting at the neck) through a thread onto a pile in the bottom one. Under the `turn` animation
+// the sand pours while the glass holds, in step with the turns (animations.css): each bulb draws
+// its sand twice — at the neck and piled on the base — both scaled from a full bulb, which the
+// CSS swaps between; at rest they are drawn here part way through. Duotone and vivid: the sand
+// secondary.
+const HOURGLASS_PLATES = [
+    { x: 4, y: 2, width: 16, height: 2.5, rx: 1 },
+    { x: 4, y: 19.5, width: 16, height: 2.5, rx: 1 },
+];
+const HOURGLASS_GLASS = 'M6.5 4.5v1.3c0 2.9 2.1 4.6 4.1 6.2-2 1.6-4.1 3.3-4.1 6.2v1.3M17.5 4.5v1.3c0 2.9-2.1 4.6-4.1 6.2 2 1.6 4.1 3.3 4.1 6.2v1.3';
+/** A full bulb of sand: the top one (apex at the neck 12,11.4, base at 5.8) and the bottom one. */
+const HOURGLASS_SAND_TOP = 'M8.2 5.8h7.6c0 2.3-1.5 3.9-3.8 5.6-2.3-1.7-3.8-3.3-3.8-5.6z';
+const HOURGLASS_SAND_BOTTOM = 'M8.2 18.2h7.6c0-2.3-1.5-3.9-3.8-5.6-2.3 1.7-3.8 3.3-3.8 5.6z';
+function hourglassSand(fill, strokeWidth) {
+    const part = (name) => `ntd-hourglass-sand ntd-hourglass-sand--${name}`;
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { className: part('top-neck'), d: HOURGLASS_SAND_TOP, fill: fill, transform: "translate(12 11.4) scale(0.6) translate(-12 -11.4)" }), jsxRuntime.jsx("path", { className: part('top-base'), d: HOURGLASS_SAND_TOP, fill: fill, transform: "scale(0)" }), jsxRuntime.jsx("path", { className: part('bottom-neck'), d: HOURGLASS_SAND_BOTTOM, fill: fill, transform: "scale(0)" }), jsxRuntime.jsx("path", { className: part('bottom-base'), d: HOURGLASS_SAND_BOTTOM, fill: fill, transform: "translate(0 18.2) scale(1 0.45) translate(0 -18.2)" }), jsxRuntime.jsx("path", { className: part('stream-up'), d: "M12 11.6V6.4", stroke: fill, strokeWidth: strokeWidth * 0.5, opacity: "0" }), jsxRuntime.jsx("path", { className: part('stream-down'), d: "M12 12.4V17.6", stroke: fill, strokeWidth: strokeWidth * 0.5 })] }));
+}
+function hourglassFilled(frame, sand, strokeWidth) {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [HOURGLASS_PLATES.map((p) => (jsxRuntime.jsx("rect", { ...p, fill: frame }, p.y))), jsxRuntime.jsx("path", { d: HOURGLASS_GLASS, stroke: frame, strokeWidth: strokeWidth, fill: "none" }), hourglassSand(sand, strokeWidth)] }));
+}
+const NtdHourglass = /* @__PURE__ */ createIcon.createIcon({
+    displayName: 'NtdHourglass',
+    paths: {
+        solid: ({ primaryColor, strokeWidth }) => hourglassFilled(primaryColor, primaryColor, strokeWidth),
+        outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: `M4.5 3.25h15M4.5 20.75h15${HOURGLASS_GLASS}`, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), hourglassSand(primaryColor, strokeWidth)] })),
+        duotone: ({ primaryColor, secondaryColor, strokeWidth }) => hourglassFilled(primaryColor, secondaryColor, strokeWidth),
+        vivid: ({ primaryColor, secondaryColor, strokeWidth }) => hourglassFilled(primaryColor, secondaryColor, strokeWidth),
     },
 });
 // The binder rings are 1.6x the stroke wide; the header line is a cut across the page, kept
-// inside it so it meets the sides flush (its round caps stuck out of both).
-const CALENDAR_HEAD = 'M5 4h14a2 2 0 012 2v4H3V6a2 2 0 012-2z';
-const CALENDAR_SHEET = 'M3 10h18v10a2 2 0 01-2 2H5a2 2 0 01-2-2z';
+// inside it so it meets the sides flush (its round caps stuck out of both). Filled — solid and
+// duotone alike — the header and the rings are secondary over a primary sheet, the line between
+// them in the accent colour. The header is a plain band clipped to the page, so `sharp` and
+// `rounded` (which re-shape the page's `<rect>`) square or round its top corners with the page's.
+const CALENDAR_PAGE = { x: 3, y: 4, width: 18, height: 18, rx: 2 };
+const CALENDAR_HEAD_BAND = 'M3 4h18v5.5H3z';
+const CALENDAR_RINGS = 'M16 2v4M8 2v4';
+function calendarFilled({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth, uid, }) {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { ...CALENDAR_PAGE, fill: primaryColor }), iconParts.within(uid, 'header', jsxRuntime.jsx("rect", { ...CALENDAR_PAGE }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: CALENDAR_HEAD_BAND, fill: secondaryColor }), jsxRuntime.jsx("path", { d: "M3 9.5h18", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity })] })), jsxRuntime.jsx("path", { d: CALENDAR_RINGS, stroke: secondaryColor, strokeWidth: strokeWidth * 1.6 })] }));
+}
 const NtdCalendar = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdCalendar',
     paths: {
-        solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", fill: primaryColor }), jsxRuntime.jsx("line", { x1: "16", y1: "2", x2: "16", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), jsxRuntime.jsx("line", { x1: "8", y1: "2", x2: "8", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), iconParts.within(uid, 'header', jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }), jsxRuntime.jsx("line", { x1: "3", y1: "10", x2: "21", y2: "10", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }))] })),
-        outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("line", { x1: "16", y1: "2", x2: "16", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), jsxRuntime.jsx("line", { x1: "8", y1: "2", x2: "8", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), jsxRuntime.jsx("line", { x1: "3", y1: "10", x2: "21", y2: "10", stroke: primaryColor, strokeWidth: strokeWidth })] })),
-        // fills only: the header and the rings primary, the sheet secondary, the line between them
-        // in the accent colour
-        duotone: ({ primaryColor, secondaryColor, accentColor, accentOpacity, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: CALENDAR_SHEET, fill: secondaryColor }), jsxRuntime.jsx("path", { d: CALENDAR_HEAD, fill: primaryColor }), jsxRuntime.jsx("line", { x1: "16", y1: "2", x2: "16", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), jsxRuntime.jsx("line", { x1: "8", y1: "2", x2: "8", y2: "6", stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), iconParts.within(uid, 'header', jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }), jsxRuntime.jsx("line", { x1: "3", y1: "10", x2: "21", y2: "10", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }))] })),
-        vivid: ({ primaryColor, secondaryColor, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", fill: primaryColor }), jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", fill: "white", opacity: "0.1" }), jsxRuntime.jsx("line", { x1: "16", y1: "2", x2: "16", y2: "6", stroke: secondaryColor, strokeWidth: "2.9" }), jsxRuntime.jsx("line", { x1: "8", y1: "2", x2: "8", y2: "6", stroke: secondaryColor, strokeWidth: "2.9" }), iconParts.within(uid, 'header', jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }), jsxRuntime.jsx("line", { x1: "3", y1: "10", x2: "21", y2: "10", stroke: secondaryColor, strokeWidth: "1.5" }))] })),
+        solid: calendarFilled,
+        outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: CALENDAR_RINGS, stroke: primaryColor, strokeWidth: strokeWidth * 1.6 }), jsxRuntime.jsx("path", { d: "M3 9.5h18", stroke: primaryColor, strokeWidth: strokeWidth })] })),
+        duotone: calendarFilled,
+        vivid: calendarFilled,
     },
 });
 const NtdTag = /* @__PURE__ */ createIcon.createIcon({
@@ -249,11 +288,12 @@ const NtdGlobe = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdGlobe',
     paths: {
         // a filled globe with its grid in the accent colour, kept inside the disc (it was the
-        // outline's rings, unfilled)
-        solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), iconParts.within(uid, 'grid', jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }), jsxRuntime.jsx("path", { d: GLOBE_GRID, stroke: accentColor, strokeWidth: strokeWidth * 0.75, opacity: accentOpacity, fill: "none" }))] })),
+        // outline's rings, unfilled). The grid is 1.5x the stroke in the filled variants, but stays
+        // at 0.75x in the cutout, which is drawn from this layer too.
+        solid: ({ variant, primaryColor, accentColor, accentOpacity, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), iconParts.within(uid, 'grid', jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }), jsxRuntime.jsx("path", { d: GLOBE_GRID, stroke: accentColor, strokeWidth: strokeWidth * (variant === 'cutout' ? 0.75 : 1.5), opacity: accentOpacity, fill: "none" }))] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M2 12h20M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10A15.3 15.3 0 0112 2z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: "M2 12h20M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10A15.3 15.3 0 0112 2z", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
-        vivid: ({ primaryColor, secondaryColor, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), iconParts.within(uid, 'grid', jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }), jsxRuntime.jsx("path", { d: GLOBE_GRID, stroke: secondaryColor, strokeWidth: strokeWidth * 0.75, fill: "none" }))] })),
+        vivid: ({ primaryColor, secondaryColor, strokeWidth, uid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), iconParts.within(uid, 'grid', jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }), jsxRuntime.jsx("path", { d: GLOBE_GRID, stroke: secondaryColor, strokeWidth: strokeWidth * 1.5, fill: "none" }))] })),
     },
 });
 const NtdMap = /* @__PURE__ */ createIcon.createIcon({
@@ -327,6 +367,7 @@ exports.NtdGlobe = NtdGlobe;
 exports.NtdHeart = NtdHeart;
 exports.NtdHelp = NtdHelp;
 exports.NtdHome = NtdHome;
+exports.NtdHourglass = NtdHourglass;
 exports.NtdInfo = NtdInfo;
 exports.NtdMap = NtdMap;
 exports.NtdMoon = NtdMoon;

package/dist/cjs/icons/weather.js

@@ -2,6 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var createIcon = require('../createIcon.js');
+var iconParts = require('../iconParts.js');
 
 const NtdSunrise = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdSunrise',
@@ -119,18 +120,18 @@ const NtdTree = /* @__PURE__ */ createIcon.createIcon({
     },
 });
 // NtdMountain: a snowcap that follows the slopes down to an edge with three uneven notches, like a
-// price chart (it had two even ones). The snow is in the accent colour, in secondary in duotone
-// and vivid; the outline draws the snow line too.
+// price chart (it had two even ones). The snow is secondary — in the accent colour, which is the
+// page colour by default, it did not show; the outline draws the snow line too.
 const MOUNTAIN = 'M12 2L2 22h20L12 2z';
 const MOUNTAIN_SNOW = 'M12 2L15 8L14 10.2L13.1 9.4L11.9 11L10.6 9.1L9.5 10.4L8.4 9.2Z';
 const MOUNTAIN_SNOW_LINE = 'M8.4 9.2L9.5 10.4L10.6 9.1L11.9 11L13.1 9.4L14 10.2L15 8';
 const NtdMountain = /* @__PURE__ */ createIcon.createIcon({
     displayName: 'NtdMountain',
     paths: {
-        solid: ({ primaryColor, accentColor, accentOpacity }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: MOUNTAIN, fill: primaryColor }), jsxRuntime.jsx("path", { d: MOUNTAIN_SNOW, fill: accentColor, opacity: accentOpacity })] })),
+        solid: (props) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: MOUNTAIN, fill: props.primaryColor }), jsxRuntime.jsx("path", { d: MOUNTAIN_SNOW, fill: iconParts.detailColor(props) })] })),
         outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: MOUNTAIN, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("path", { d: MOUNTAIN_SNOW_LINE, stroke: primaryColor, strokeWidth: strokeWidth * 0.8, fill: "none" })] })),
         duotone: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: MOUNTAIN, fill: primaryColor }), jsxRuntime.jsx("path", { d: MOUNTAIN_SNOW, fill: secondaryColor })] })),
-        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: MOUNTAIN, fill: primaryColor }), jsxRuntime.jsx("path", { d: MOUNTAIN, fill: "white", opacity: "0.08" }), jsxRuntime.jsx("path", { d: MOUNTAIN_SNOW, fill: secondaryColor })] })),
+        vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: MOUNTAIN, fill: primaryColor }), jsxRuntime.jsx("path", { d: MOUNTAIN_SNOW, fill: secondaryColor })] })),
     },
 });
 const NtdWave = /* @__PURE__ */ createIcon.createIcon({

package/dist/cjs/index.js

@@ -145,6 +145,7 @@ exports.NtdGlobe = ui.NtdGlobe;
 exports.NtdHeart = ui.NtdHeart;
 exports.NtdHelp = ui.NtdHelp;
 exports.NtdHome = ui.NtdHome;
+exports.NtdHourglass = ui.NtdHourglass;
 exports.NtdInfo = ui.NtdInfo;
 exports.NtdMap = ui.NtdMap;
 exports.NtdMoon = ui.NtdMoon;

package/dist/cjs/nicetodev-icons.css

@@ -1 +1 @@
-.ntd-icon{display:inline-block;flex-shrink:0;transition:color .2s ease,transform .2s ease;vertical-align:-.125em}.ntd-anim-spin{animation:ntd-spin 1s linear infinite}.ntd-anim-spin-reverse{animation:ntd-spin 1s linear infinite reverse}@keyframes ntd-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ntd-anim-pulse{animation:ntd-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce 1s ease infinite}@keyframes ntd-bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(0)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(-25%)}}.ntd-anim-shake{animation:ntd-shake .6s ease-in-out infinite}@keyframes ntd-shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-2px)}20%,40%,60%,80%{transform:translateX(2px)}}.ntd-anim-float{animation:ntd-float 3s ease-in-out infinite}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip 1.2s 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(1turn)}to{transform:perspective(400px) rotateY(1turn)}}.ntd-anim-glow{animation:ntd-glow 2s 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 1s ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber 1s 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 1s 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(0deg)}}.ntd-anim-tada{animation:ntd-tada 1.2s ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0deg)}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(0deg)}}.ntd-anim-heartbeat{animation:ntd-heartbeat 1.2s 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 .5s 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 .4s 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 1s ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skewX(0deg) skewY(0deg)}11.1%{transform:skewX(-12.5deg) skewY(-12.5deg)}22.2%{transform:skewX(6.25deg) skewY(6.25deg)}33.3%{transform:skewX(-3.125deg) skewY(-3.125deg)}44.4%{transform:skewX(1.5625deg) skewY(1.5625deg)}55.5%{transform:skewX(-.78125deg) skewY(-.78125deg)}66.6%{transform:skewX(.390625deg) skewY(.390625deg)}77.7%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop .6s 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 1.4s 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 .8s 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 .7s 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 .5s ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-right{animation:ntd-slide-right .5s ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-down{animation:ntd-slide-down .4s 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 .8s ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0deg)}}.ntd-anim-flash{animation:ntd-flash 1s ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate .3s 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 1.2s ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-15%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-10%) rotate(-3deg)}60%{transform:translateX(5%) rotate(2deg)}75%{transform:translateX(-3%) rotate(-1deg)}to{transform:translateX(0) rotate(0deg)}}.ntd-anim-spiral{animation:ntd-spiral 2s linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0deg) 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(1turn) scale(.8)}}.ntd-anim-ping{animation:ntd-ping 1.5s ease-out infinite}@keyframes ntd-ping{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(1.6)}71%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}.ntd-anim-flicker{animation:ntd-flicker 1.5s 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 2s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0deg)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe 4s ease-in-out infinite}@keyframes ntd-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.ntd-anim-drift{animation:ntd-drift 4s ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(5px) rotate(1deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit 3s 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 .8s 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 1s 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 2s ease-in-out infinite}@keyframes ntd-dissolve{0%,to{filter:blur(0);opacity:1}50%{filter:blur(4px);opacity:.1}}.ntd-anim-materialize{animation:ntd-materialize .8s ease-out forwards}@keyframes ntd-materialize{0%{filter:blur(8px);opacity:0;transform:scale(.6)}60%{filter:blur(1px);opacity:.8;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway 2.5s ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble .15s linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0deg)}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(0deg)}}.ntd-anim-rock{animation:ntd-rock 1.5s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0deg)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap 1.5s ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0deg)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp 2s ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0deg) rotateY(0deg)}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 .8s steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skewX(2deg)}10%{transform:translate(3px,-1px) skewX(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skewX(-3deg)}44%{transform:translate(-2px,-2px) skewX(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skewX(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse 1.5s ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple 1.6s ease-out infinite}@keyframes ntd-ripple{0%{opacity:1;transform:scale(1)}30%{opacity:.8;transform:scale(1.15)}50%{opacity:1;transform:scale(1)}70%{opacity:.9;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.ntd-anim-implode{animation:ntd-implode 1.2s ease-in-out infinite}@keyframes ntd-implode{0%,to{opacity:1;transform:scale(1)}40%{opacity:.3;transform:scale(.2) rotate(20deg)}60%{opacity:.2;transform:scale(.15) rotate(25deg)}80%{opacity:1;transform:scale(1.1) rotate(0deg)}}.ntd-anim-explode{animation:ntd-explode 1.4s ease-in-out infinite}@keyframes ntd-explode{0%,to{opacity:1;transform:scale(1)}30%{opacity:.6;transform:scale(1.8)}50%{opacity:0;transform:scale(2)}51%{opacity:0;transform:scale(.5)}70%{opacity:.8;transform:scale(1.1)}85%{opacity:1;transform:scale(.95)}}.ntd-anim-rotate-x{animation:ntd-rotate-x 1.5s ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0deg)}to{transform:perspective(400px) rotateX(1turn)}}.ntd-anim-morph{animation:ntd-morph 3s ease-in-out infinite}@keyframes ntd-morph{0%,to{border-radius:0;transform:scaleX(1) scaleY(1) rotate(0deg)}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 3s ease-in-out infinite}@keyframes ntd-levitate{0%,to{filter:drop-shadow(0 2px 2px rgba(0,0,0,.2));transform:translateY(0)}50%{filter:drop-shadow(0 12px 8px rgba(0,0,0,.1));transform:translateY(-10px)}}.ntd-anim-dash{animation:ntd-dash .8s ease-in-out infinite}@keyframes ntd-dash{0%,to{opacity:1;transform:translateX(0) scaleX(1)}30%{opacity:.8;transform:translateX(-3px) scaleX(.9)}60%{opacity:.6;transform:translateX(15px) scaleX(1.15)}80%{opacity:.9;transform:translateX(2px) scaleX(1)}}.ntd-anim-twist{animation:ntd-twist 1.5s ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0deg) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0deg) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp 1s 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 .6s ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0deg) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate 2s ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(8px) rotate(2deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink 1.4s steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal 1s 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 .8s ease-out forwards}@keyframes ntd-vortex{0%{opacity:0;transform:rotate(-540deg) scale(0)}60%{opacity:1;transform:rotate(20deg) scale(1.1)}80%{transform:rotate(-10deg) scale(.95)}to{opacity:1;transform:rotate(0deg) scale(1)}}.ntd-anim-meteor{animation:ntd-meteor .7s ease-out forwards}@keyframes ntd-meteor{0%{opacity:0;transform:translate(30px,-30px) rotate(15deg) scale(.5)}70%{opacity:1;transform:translate(-2px,2px) rotate(-2deg) scale(1.05)}to{opacity:1;transform:translate(0) rotate(0deg) scale(1)}}.ntd-anim-scale-in{animation:ntd-scale-in .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.ntd-anim-scale-out{animation:ntd-scale-out .4s ease-in forwards}@keyframes ntd-scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ntd-anim-pendulum{animation:ntd-pendulum 2s ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0deg)}25%{transform:rotate(25deg)}50%{transform:rotate(0deg)}75%{transform:rotate(-25deg)}to{transform:rotate(0deg)}}.ntd-anim-surge{animation:ntd-surge 1.5s ease-in-out infinite}@keyframes ntd-surge{0%,to{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}15%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);transform:scale(1.2)}30%{filter:drop-shadow(0 0 2px currentColor);transform:scale(.95)}45%{filter:drop-shadow(0 0 6px currentColor);transform:scale(1.1)}60%{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}}.ntd-anim-radar{animation:ntd-radar 2s linear infinite}@keyframes ntd-radar{0%{opacity:1;transform:rotate(0deg)}50%{opacity:.4}to{opacity:1;transform:rotate(1turn)}}.ntd-anim-typewriter{animation:ntd-typewriter 1s 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 .7s ease-out forwards}@keyframes ntd-unfold{0%{opacity:.3;transform:scaleY(.05) scaleX(1.3)}50%{opacity:.9;transform:scaleY(1.1) scaleX(.95)}70%{opacity:1;transform:scaleY(.95) scaleX(1.02)}to{opacity:1;transform:scaleY(1) scaleX(1)}}.ntd-anim-fold{animation:ntd-fold .6s ease-in forwards}@keyframes ntd-fold{0%{opacity:1;transform:scaleY(1) scaleX(1)}to{opacity:0;transform:scaleY(.05) scaleX(1.3)}}.ntd-anim-scatter{animation:ntd-scatter 1.5s ease-in-out infinite}@keyframes ntd-scatter{0%,to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}20%{filter:blur(2px);opacity:.6;transform:scale(1.3) rotate(5deg)}40%{filter:blur(4px);opacity:.2;transform:scale(1.5) rotate(-3deg)}50%{filter:blur(6px);opacity:0;transform:scale(.8) rotate(0deg)}65%{filter:blur(3px);opacity:.3;transform:scale(.6) rotate(-5deg)}80%{filter:blur(1px);opacity:.8;transform:scale(.95) rotate(2deg)}}.ntd-anim-assemble{animation:ntd-assemble 1s ease-out forwards}@keyframes ntd-assemble{0%{filter:blur(8px);opacity:0;transform:scale(2) rotate(15deg)}30%{filter:blur(3px);opacity:.5;transform:scale(.8) rotate(-5deg)}60%{filter:blur(1px);opacity:.9;transform:scale(1.1) rotate(2deg)}80%{filter:blur(0);opacity:1;transform:scale(.97) rotate(-1deg)}to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}}.ntd-anim-neon{animation:ntd-neon 2s ease-in-out infinite}@keyframes ntd-neon{0%,to{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}10%{filter:drop-shadow(0 0 0 currentColor);opacity:.4}11%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}15%{filter:drop-shadow(0 0 0 currentColor);opacity:.3}16%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}50%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor);opacity:1}}.ntd-anim-earthquake{animation:ntd-earthquake .5s 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{animation:ntd-signature-enter .65s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-signature circle,.ntd-anim-signature ellipse,.ntd-anim-signature line,.ntd-anim-signature path,.ntd-anim-signature polygon,.ntd-anim-signature polyline,.ntd-anim-signature rect{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke 1.7s ease-out .05s forwards,ntd-signature-fill .55s ease-out 1.05s 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(0deg)}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 circle,.ntd-anim-draw-sequence ellipse,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence rect{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence 1.6s ease-out forwards}.ntd-anim-draw-sequence circle:first-child,.ntd-anim-draw-sequence ellipse:first-child,.ntd-anim-draw-sequence line:first-child,.ntd-anim-draw-sequence path:first-child,.ntd-anim-draw-sequence polygon:first-child,.ntd-anim-draw-sequence polyline:first-child,.ntd-anim-draw-sequence rect:first-child{animation-delay:0s}.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3){animation-delay:.4s}@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 circle,.ntd-anim-stroke-order ellipse,.ntd-anim-stroke-order line,.ntd-anim-stroke-order path,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order rect{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order 2s 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 circle,.ntd-anim-glow-trace ellipse,.ntd-anim-glow-trace line,.ntd-anim-glow-trace path,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace rect{stroke-dasharray:180;animation:ntd-glow-trace 2.8s 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{animation:ntd-seal-stamp .75s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center}@keyframes ntd-seal-stamp{0%{filter:blur(2px);opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg)}45%{filter:blur(0);opacity:1;transform:translateY(2px) scale(.94) rotate(0deg)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw circle,.ntd-anim-draw ellipse,.ntd-anim-draw line,.ntd-anim-draw path,.ntd-anim-draw polygon,.ntd-anim-draw polyline,.ntd-anim-draw rect{stroke-dasharray:120;stroke-dashoffset:120;fill-opacity:0;animation:ntd-draw-stroke 1.2s ease-out forwards,ntd-draw-fill .4s ease-out .8s forwards}@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{animation:ntd-draw-dot-enter .45s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot ellipse,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot rect{stroke-dasharray:140;stroke-dashoffset:140;fill-opacity:0;animation:ntd-draw-dot-stroke 1.35s ease-out .15s forwards,ntd-draw-fill .45s ease-out .95s forwards}@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 circle,.ntd-anim-draw-loop ellipse,.ntd-anim-draw-loop line,.ntd-anim-draw-loop path,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop rect{stroke-dasharray:140;animation:ntd-draw-loop-stroke 2.4s 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;animation:ntd-draw-shape-pop .7s cubic-bezier(.34,1.56,.64,1) .35s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.5s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.65s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.8s}@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;animation:ntd-draw-dot-shape-burst .65s cubic-bezier(.34,1.56,.64,1) .25s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.4s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.55s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.7s}@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;animation:ntd-draw-seq-shape-wipe .6s cubic-bezier(.22,1,.36,1) forwards;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):first-child{animation-delay:0s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.4s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.6s}@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 2.4s 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;animation:ntd-signature-shape-stamp .8s cubic-bezier(.22,1,.36,1) .5s forwards;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform-box:fill-box;transform-origin:center}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform:scale(.35) rotate(-6deg)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);filter:drop-shadow(0 0 8px currentColor);transform:scale(1.08) rotate(0deg)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);transform:scale(1)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-stroke-order-shape-wipe 1.2s ease-out .3s forwards;clip-path:inset(0 100% 0 0)}@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 2.8s 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}}.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-input-bg:var(--nice-bg-inset,#14141c);display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;position:relative}.ntd-picker-trigger{align-items:center;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:var(--ntd-picker-radius,10px);color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.875rem;gap:8px;min-width:160px;padding:8px 14px;transition:border-color .2s,box-shadow .2s;user-select:none}.ntd-picker-trigger:hover{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-trigger:focus-visible{border-color:var(--ntd-picker-accent,#6c5ce7);box-shadow:0 0 0 3px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));outline:none}.ntd-picker-trigger-icon{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));border-radius:6px;display:flex;flex-shrink:0;height:28px;justify-content:center;width:28px}.ntd-picker-trigger-label{flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.ntd-picker-trigger-chevron,.ntd-picker-trigger-placeholder{color:var(--ntd-picker-muted,#606078)}.ntd-picker-trigger-chevron{flex-shrink:0;transition:transform .2s}.ntd-picker.ntd-picker--open .ntd-picker-trigger-chevron{transform:rotate(180deg)}.ntd-picker-dropdown{animation:ntd-picker-appear .2s ease-out;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 rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.2);display:flex;flex-direction:column;left:0;max-height:460px;overflow:hidden;position:absolute;top:calc(100% + 6px);width:380px;z-index:1000}@keyframes ntd-picker-appear{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-picker-search{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);flex-shrink:0;padding:10px 12px;position:relative}.ntd-picker-search-icon{color:var(--ntd-picker-muted,#606078);left:22px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.ntd-picker-search input{background:var(--ntd-picker-input-bg,#14141c);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);font-family:inherit;font-size:.82rem;outline:none;padding:8px 12px 8px 34px;transition:border-color .2s;width:100%}.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{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;gap:2px;overflow-x:auto;padding:6px 10px;scrollbar-width:none}.ntd-picker-tabs::-webkit-scrollbar{display:none}.ntd-picker-tab{background:transparent;border:none;border-radius:6px;color:var(--ntd-picker-muted,#606078);cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;letter-spacing:.03em;padding:5px 10px;text-transform:uppercase;transition:all .15s;white-space:nowrap}.ntd-picker-tab:hover{background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-tab.ntd-picker-tab--active{background:var(--ntd-picker-accent,#6c5ce7);color:#fff}.ntd-picker-grid-wrap{flex:1;overflow-y:auto;padding:8px;scrollbar-color:var(--ntd-picker-border,#3a3a4a) transparent;scrollbar-width:thin}.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{color:var(--ntd-picker-muted,#606078);font-size:.68rem;font-weight:600;letter-spacing:.05em;margin-top:4px;padding:6px 4px 4px;text-transform:uppercase}.ntd-picker-category-label:first-child{margin-top:0}.ntd-picker-grid{display:grid;gap:4px;grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}.ntd-picker-cell{align-items:center;aspect-ratio:1;background:transparent;border:none;border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:flex;justify-content:center;position:relative;transition:all .15s;width:100%}.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);box-shadow:0 2px 8px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));color:#fff}.ntd-picker-cell:focus-visible{outline:2px solid var(--ntd-picker-accent,#6c5ce7);outline-offset:1px}.ntd-picker-cell:after{background:var(--ntd-picker-text,#f0f0f5);border-radius:5px;bottom:calc(100% + 6px);color:var(--ntd-picker-bg,#1e1e2a);content:attr(data-name);font-size:.65rem;font-weight:500;left:50%;opacity:0;padding:3px 8px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .15s;white-space:nowrap;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{border:2px dashed var(--ntd-picker-accent,#6c5ce7);border-radius:8px;content:"";inset:0;opacity:.5;pointer-events:none;position:absolute}.ntd-picker-empty{color:var(--ntd-picker-muted,#606078);font-size:.82rem;padding:32px 16px;text-align:center}.ntd-picker-empty-icon{font-size:2rem;margin-bottom:8px;opacity:.4}.ntd-picker-footer{align-items:center;border-top:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;justify-content:space-between;padding:8px 12px}.ntd-picker-count{font-size:.7rem}.ntd-picker-clear,.ntd-picker-count{color:var(--ntd-picker-muted,#606078)}.ntd-picker-clear{background:transparent;border:none;border-radius:5px;cursor:pointer;font-family:inherit;font-size:.72rem;padding:4px 10px;transition:all .15s}.ntd-picker-clear:hover{background:rgba(255,80,80,.12);color:#ff5050}.ntd-picker-multi-badge{border-radius:10px;font-size:.7rem;font-weight:600;height:20px;min-width:20px;padding:0 6px}.ntd-picker-cell-check,.ntd-picker-multi-badge{align-items:center;background:var(--ntd-picker-accent,#6c5ce7);color:#fff;display:flex;justify-content:center}.ntd-picker-cell-check{border-radius:50%;height:16px;pointer-events:none;position:absolute;right:2px;top:2px;width:16px}.ntd-picker-cell.ntd-picker-cell--multi-select{position:relative}.ntd-picker-cell-fav{align-items:center;background:transparent;border:none;border-radius:50%;color:var(--ntd-picker-muted,#606078);cursor:pointer;display:flex;height:16px;justify-content:center;left:2px;opacity:0;padding:0;position:absolute;top:2px;transition:all .15s;width:16px}.ntd-picker-cell-fav.ntd-picker-cell-fav--active,.ntd-picker-cell:hover .ntd-picker-cell-fav{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{align-items:center;display:inline-flex;gap:4px}.ntd-picker-tab-special svg{height:10px;width:10px}.ntd-picker-tab-count{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.2));border-radius:8px;display:inline-flex;font-size:.65rem;font-weight:600;height:16px;justify-content:center;margin-left:2px;min-width:16px;padding:0 4px}.ntd-picker-tab.ntd-picker-tab--active .ntd-picker-tab-count{background:hsla(0,0%,100%,.2)}.ntd-picker-done{background:var(--ntd-picker-accent,#6c5ce7);border:none;border-radius:5px;color:#fff;cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;padding:4px 12px;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{cursor:not-allowed;opacity:.5}.ntd-picker.ntd-picker--multi .ntd-picker-trigger{border-style:dashed}.nice-desktop-icon-exporter{color:var(--nice-text-primary,inherit);display:grid;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-4,16px);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));min-width:0}.nice-desktop-icon-exporter :where(h3,h4){font-weight:var(--nice-font-weight-semibold,600);margin:0 0 var(--nice-space-2,8px)}.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){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);color:var(--nice-text-primary,inherit);cursor:pointer;font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-3,12px)}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary,#f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){cursor:not-allowed;opacity:.5}.nice-desktop-icon-exporter :where(input[type=text]){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;color:var(--nice-text-primary,inherit);font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__results{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);min-width:0;padding:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-grid{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-item{align-items:center;color:var(--nice-text-muted,#94a3b8);display:flex;flex-direction:column;font-size:var(--nice-font-size-xs,.75rem);font-variant-numeric:tabular-nums;gap:var(--nice-space-1,4px)}.nice-desktop-icon-exporter__preview-box{align-items:center;border-radius:var(--nice-radius-sm,4px);display:flex;justify-content:center}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5,10px)}.nice-desktop-icon-exporter__config>label{align-items:center;color:var(--nice-text-secondary,#64748b);display:flex;flex-wrap:wrap;font-weight:var(--nice-font-weight-medium,500);gap:var(--nice-space-2,8px)}.nice-desktop-icon-exporter__config>label>input[type=range],.nice-desktop-icon-exporter__config>label>input[type=text]{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{align-items:center;cursor:pointer;display:inline-flex;gap:var(--nice-space-1-5,6px)}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;gap:var(--nice-space-2,8px);grid-column:1/-1}.nice-desktop-icon-exporter__actions>button:first-child{background:var(--nice-color-primary,#3b82f6);border-color: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;gap:var(--nice-space-2,8px);grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.nice-desktop-icon-exporter__result-item{align-items:center;border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:flex;flex-direction:column;gap:var(--nice-space-1,4px);padding:var(--nice-space-2,8px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-height:64px;max-width:64px}.nice-desktop-icon-exporter__result-item>span{color:var(--nice-text-secondary,#64748b);font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xxs,.625rem);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.nice-desktop-icon-exporter{color:var(--nice-text-primary,inherit);display:grid;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-4,16px);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));min-width:0}.nice-desktop-icon-exporter :where(h3,h4){font-weight:var(--nice-font-weight-semibold,600);margin:0 0 var(--nice-space-2,8px)}.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){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);color:var(--nice-text-primary,inherit);cursor:pointer;font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-3,12px)}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary,#f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){cursor:not-allowed;opacity:.5}.nice-desktop-icon-exporter :where(input[type=text]){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;color:var(--nice-text-primary,inherit);font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__results{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);min-width:0;padding:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-grid{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-item{align-items:center;color:var(--nice-text-muted,#94a3b8);display:flex;flex-direction:column;font-size:var(--nice-font-size-xs,.75rem);font-variant-numeric:tabular-nums;gap:var(--nice-space-1,4px)}.nice-desktop-icon-exporter__preview-box{align-items:center;border-radius:var(--nice-radius-sm,4px);display:flex;justify-content:center}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5,10px)}.nice-desktop-icon-exporter__config>label{align-items:center;color:var(--nice-text-secondary,#64748b);display:flex;flex-wrap:wrap;font-weight:var(--nice-font-weight-medium,500);gap:var(--nice-space-2,8px)}.nice-desktop-icon-exporter__config>label>input[type=range],.nice-desktop-icon-exporter__config>label>input[type=text]{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{align-items:center;cursor:pointer;display:inline-flex;gap:var(--nice-space-1-5,6px)}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;gap:var(--nice-space-2,8px);grid-column:1/-1}.nice-desktop-icon-exporter__actions>button:first-child{background:var(--nice-color-primary,#3b82f6);border-color: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;gap:var(--nice-space-2,8px);grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.nice-desktop-icon-exporter__result-item{align-items:center;border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:flex;flex-direction:column;gap:var(--nice-space-1,4px);padding:var(--nice-space-2,8px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-height:64px;max-width:64px}.nice-desktop-icon-exporter__result-item>span{color:var(--nice-text-secondary,#64748b);font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xxs,.625rem);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ntd-icon{display:inline-block;flex-shrink:0;transition:color .2s ease,transform .2s ease;vertical-align:-.125em}.ntd-anim-spin{animation:ntd-spin 1s linear infinite}.ntd-anim-spin-reverse{animation:ntd-spin 1s linear infinite reverse}@keyframes ntd-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ntd-anim-pulse{animation:ntd-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce 1s ease infinite}@keyframes ntd-bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(0)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(-25%)}}.ntd-anim-shake{animation:ntd-shake .6s ease-in-out infinite}@keyframes ntd-shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-2px)}20%,40%,60%,80%{transform:translateX(2px)}}.ntd-anim-float{animation:ntd-float 3s ease-in-out infinite}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip 1.2s 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(1turn)}to{transform:perspective(400px) rotateY(1turn)}}.ntd-anim-turn{animation:ntd-turn var(--ntd-anim-duration,4s) infinite}@keyframes ntd-turn{0%{animation-timing-function:cubic-bezier(.65,0,.35,1);transform:rotate(0deg)}12.5%,50%{animation-timing-function:cubic-bezier(.65,0,.35,1);transform:rotate(180deg)}62.5%,to{transform:rotate(0deg)}}.ntd-anim-turn .ntd-hourglass-sand{animation-duration:var(--ntd-anim-duration,4s);animation-iteration-count:infinite;animation-timing-function:linear;transform-box:view-box}.ntd-anim-turn .ntd-hourglass-sand--top-neck{animation-name:ntd-hourglass-top-neck;transform-origin:12px 11.4px}.ntd-anim-turn .ntd-hourglass-sand--top-base{animation-name:ntd-hourglass-top-base;transform-origin:12px 5.8px}.ntd-anim-turn .ntd-hourglass-sand--bottom-neck{animation-name:ntd-hourglass-bottom-neck;transform-origin:12px 12.6px}.ntd-anim-turn .ntd-hourglass-sand--bottom-base{animation-name:ntd-hourglass-bottom-base;transform-origin:12px 18.2px}.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 2s 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 1s ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber 1s 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 1s 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(0deg)}}.ntd-anim-tada{animation:ntd-tada 1.2s ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0deg)}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(0deg)}}.ntd-anim-heartbeat{animation:ntd-heartbeat 1.2s 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 .5s 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 .4s 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 1s ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skewX(0deg) skewY(0deg)}11.1%{transform:skewX(-12.5deg) skewY(-12.5deg)}22.2%{transform:skewX(6.25deg) skewY(6.25deg)}33.3%{transform:skewX(-3.125deg) skewY(-3.125deg)}44.4%{transform:skewX(1.5625deg) skewY(1.5625deg)}55.5%{transform:skewX(-.78125deg) skewY(-.78125deg)}66.6%{transform:skewX(.390625deg) skewY(.390625deg)}77.7%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop .6s 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 1.4s 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 .8s 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 .7s 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 .5s ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-right{animation:ntd-slide-right .5s ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-down{animation:ntd-slide-down .4s 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 .8s ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0deg)}}.ntd-anim-flash{animation:ntd-flash 1s ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate .3s 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 1.2s ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-15%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-10%) rotate(-3deg)}60%{transform:translateX(5%) rotate(2deg)}75%{transform:translateX(-3%) rotate(-1deg)}to{transform:translateX(0) rotate(0deg)}}.ntd-anim-spiral{animation:ntd-spiral 2s linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0deg) 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(1turn) scale(.8)}}.ntd-anim-ping{animation:ntd-ping 1.5s ease-out infinite}@keyframes ntd-ping{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(1.6)}71%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}.ntd-anim-flicker{animation:ntd-flicker 1.5s 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 2s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0deg)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe 4s ease-in-out infinite}@keyframes ntd-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.ntd-anim-drift{animation:ntd-drift 4s ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(5px) rotate(1deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit 3s 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 .8s 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 1s 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 2s ease-in-out infinite}@keyframes ntd-dissolve{0%,to{filter:blur(0);opacity:1}50%{filter:blur(4px);opacity:.1}}.ntd-anim-materialize{animation:ntd-materialize .8s ease-out forwards}@keyframes ntd-materialize{0%{filter:blur(8px);opacity:0;transform:scale(.6)}60%{filter:blur(1px);opacity:.8;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway 2.5s ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble .15s linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0deg)}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(0deg)}}.ntd-anim-rock{animation:ntd-rock 1.5s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0deg)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap 1.5s ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0deg)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp 2s ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0deg) rotateY(0deg)}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 .8s steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skewX(2deg)}10%{transform:translate(3px,-1px) skewX(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skewX(-3deg)}44%{transform:translate(-2px,-2px) skewX(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skewX(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse 1.5s ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple 1.6s ease-out infinite}@keyframes ntd-ripple{0%{opacity:1;transform:scale(1)}30%{opacity:.8;transform:scale(1.15)}50%{opacity:1;transform:scale(1)}70%{opacity:.9;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.ntd-anim-implode{animation:ntd-implode 1.2s ease-in-out infinite}@keyframes ntd-implode{0%,to{opacity:1;transform:scale(1)}40%{opacity:.3;transform:scale(.2) rotate(20deg)}60%{opacity:.2;transform:scale(.15) rotate(25deg)}80%{opacity:1;transform:scale(1.1) rotate(0deg)}}.ntd-anim-explode{animation:ntd-explode 1.4s ease-in-out infinite}@keyframes ntd-explode{0%,to{opacity:1;transform:scale(1)}30%{opacity:.6;transform:scale(1.8)}50%{opacity:0;transform:scale(2)}51%{opacity:0;transform:scale(.5)}70%{opacity:.8;transform:scale(1.1)}85%{opacity:1;transform:scale(.95)}}.ntd-anim-rotate-x{animation:ntd-rotate-x 1.5s ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0deg)}to{transform:perspective(400px) rotateX(1turn)}}.ntd-anim-morph{animation:ntd-morph 3s ease-in-out infinite}@keyframes ntd-morph{0%,to{border-radius:0;transform:scaleX(1) scaleY(1) rotate(0deg)}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 3s ease-in-out infinite}@keyframes ntd-levitate{0%,to{filter:drop-shadow(0 2px 2px rgba(0,0,0,.2));transform:translateY(0)}50%{filter:drop-shadow(0 12px 8px rgba(0,0,0,.1));transform:translateY(-10px)}}.ntd-anim-dash{animation:ntd-dash .8s ease-in-out infinite}@keyframes ntd-dash{0%,to{opacity:1;transform:translateX(0) scaleX(1)}30%{opacity:.8;transform:translateX(-3px) scaleX(.9)}60%{opacity:.6;transform:translateX(15px) scaleX(1.15)}80%{opacity:.9;transform:translateX(2px) scaleX(1)}}.ntd-anim-twist{animation:ntd-twist 1.5s ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0deg) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0deg) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp 1s 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 .6s ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0deg) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate 2s ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(8px) rotate(2deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink 1.4s steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal 1s 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 .8s ease-out forwards}@keyframes ntd-vortex{0%{opacity:0;transform:rotate(-540deg) scale(0)}60%{opacity:1;transform:rotate(20deg) scale(1.1)}80%{transform:rotate(-10deg) scale(.95)}to{opacity:1;transform:rotate(0deg) scale(1)}}.ntd-anim-meteor{animation:ntd-meteor .7s ease-out forwards}@keyframes ntd-meteor{0%{opacity:0;transform:translate(30px,-30px) rotate(15deg) scale(.5)}70%{opacity:1;transform:translate(-2px,2px) rotate(-2deg) scale(1.05)}to{opacity:1;transform:translate(0) rotate(0deg) scale(1)}}.ntd-anim-scale-in{animation:ntd-scale-in .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.ntd-anim-scale-out{animation:ntd-scale-out .4s ease-in forwards}@keyframes ntd-scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ntd-anim-pendulum{animation:ntd-pendulum 2s ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0deg)}25%{transform:rotate(25deg)}50%{transform:rotate(0deg)}75%{transform:rotate(-25deg)}to{transform:rotate(0deg)}}.ntd-anim-surge{animation:ntd-surge 1.5s ease-in-out infinite}@keyframes ntd-surge{0%,to{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}15%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);transform:scale(1.2)}30%{filter:drop-shadow(0 0 2px currentColor);transform:scale(.95)}45%{filter:drop-shadow(0 0 6px currentColor);transform:scale(1.1)}60%{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}}.ntd-anim-radar{animation:ntd-radar 2s linear infinite}@keyframes ntd-radar{0%{opacity:1;transform:rotate(0deg)}50%{opacity:.4}to{opacity:1;transform:rotate(1turn)}}.ntd-anim-typewriter{animation:ntd-typewriter 1s 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 .7s ease-out forwards}@keyframes ntd-unfold{0%{opacity:.3;transform:scaleY(.05) scaleX(1.3)}50%{opacity:.9;transform:scaleY(1.1) scaleX(.95)}70%{opacity:1;transform:scaleY(.95) scaleX(1.02)}to{opacity:1;transform:scaleY(1) scaleX(1)}}.ntd-anim-fold{animation:ntd-fold .6s ease-in forwards}@keyframes ntd-fold{0%{opacity:1;transform:scaleY(1) scaleX(1)}to{opacity:0;transform:scaleY(.05) scaleX(1.3)}}.ntd-anim-scatter{animation:ntd-scatter 1.5s ease-in-out infinite}@keyframes ntd-scatter{0%,to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}20%{filter:blur(2px);opacity:.6;transform:scale(1.3) rotate(5deg)}40%{filter:blur(4px);opacity:.2;transform:scale(1.5) rotate(-3deg)}50%{filter:blur(6px);opacity:0;transform:scale(.8) rotate(0deg)}65%{filter:blur(3px);opacity:.3;transform:scale(.6) rotate(-5deg)}80%{filter:blur(1px);opacity:.8;transform:scale(.95) rotate(2deg)}}.ntd-anim-assemble{animation:ntd-assemble 1s ease-out forwards}@keyframes ntd-assemble{0%{filter:blur(8px);opacity:0;transform:scale(2) rotate(15deg)}30%{filter:blur(3px);opacity:.5;transform:scale(.8) rotate(-5deg)}60%{filter:blur(1px);opacity:.9;transform:scale(1.1) rotate(2deg)}80%{filter:blur(0);opacity:1;transform:scale(.97) rotate(-1deg)}to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}}.ntd-anim-neon{animation:ntd-neon 2s ease-in-out infinite}@keyframes ntd-neon{0%,to{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}10%{filter:drop-shadow(0 0 0 currentColor);opacity:.4}11%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}15%{filter:drop-shadow(0 0 0 currentColor);opacity:.3}16%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}50%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor);opacity:1}}.ntd-anim-earthquake{animation:ntd-earthquake .5s 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{animation:ntd-signature-enter .65s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-signature circle,.ntd-anim-signature ellipse,.ntd-anim-signature line,.ntd-anim-signature path,.ntd-anim-signature polygon,.ntd-anim-signature polyline,.ntd-anim-signature rect{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke 1.7s ease-out .05s forwards,ntd-signature-fill .55s ease-out 1.05s 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(0deg)}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 circle,.ntd-anim-draw-sequence ellipse,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence rect{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence 1.6s ease-out forwards}.ntd-anim-draw-sequence circle:first-child,.ntd-anim-draw-sequence ellipse:first-child,.ntd-anim-draw-sequence line:first-child,.ntd-anim-draw-sequence path:first-child,.ntd-anim-draw-sequence polygon:first-child,.ntd-anim-draw-sequence polyline:first-child,.ntd-anim-draw-sequence rect:first-child{animation-delay:0s}.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3){animation-delay:.4s}@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 circle,.ntd-anim-stroke-order ellipse,.ntd-anim-stroke-order line,.ntd-anim-stroke-order path,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order rect{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order 2s 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 circle,.ntd-anim-glow-trace ellipse,.ntd-anim-glow-trace line,.ntd-anim-glow-trace path,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace rect{stroke-dasharray:180;animation:ntd-glow-trace 2.8s 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{animation:ntd-seal-stamp .75s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center}@keyframes ntd-seal-stamp{0%{filter:blur(2px);opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg)}45%{filter:blur(0);opacity:1;transform:translateY(2px) scale(.94) rotate(0deg)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw circle,.ntd-anim-draw ellipse,.ntd-anim-draw line,.ntd-anim-draw path,.ntd-anim-draw polygon,.ntd-anim-draw polyline,.ntd-anim-draw rect{stroke-dasharray:120;stroke-dashoffset:120;fill-opacity:0;animation:ntd-draw-stroke 1.2s ease-out forwards,ntd-draw-fill .4s ease-out .8s forwards}@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{animation:ntd-draw-dot-enter .45s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot ellipse,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot rect{stroke-dasharray:140;stroke-dashoffset:140;fill-opacity:0;animation:ntd-draw-dot-stroke 1.35s ease-out .15s forwards,ntd-draw-fill .45s ease-out .95s forwards}@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 circle,.ntd-anim-draw-loop ellipse,.ntd-anim-draw-loop line,.ntd-anim-draw-loop path,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop rect{stroke-dasharray:140;animation:ntd-draw-loop-stroke 2.4s 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;animation:ntd-draw-shape-pop .7s cubic-bezier(.34,1.56,.64,1) .35s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.5s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.65s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.8s}@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;animation:ntd-draw-dot-shape-burst .65s cubic-bezier(.34,1.56,.64,1) .25s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.4s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.55s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.7s}@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;animation:ntd-draw-seq-shape-wipe .6s cubic-bezier(.22,1,.36,1) forwards;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):first-child{animation-delay:0s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.4s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.6s}@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 2.4s 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;animation:ntd-signature-shape-stamp .8s cubic-bezier(.22,1,.36,1) .5s forwards;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform-box:fill-box;transform-origin:center}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform:scale(.35) rotate(-6deg)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);filter:drop-shadow(0 0 8px currentColor);transform:scale(1.08) rotate(0deg)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);transform:scale(1)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-stroke-order-shape-wipe 1.2s ease-out .3s forwards;clip-path:inset(0 100% 0 0)}@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 2.8s 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}}.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-input-bg:var(--nice-bg-inset,#14141c);display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;position:relative}.ntd-picker-trigger{align-items:center;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:var(--ntd-picker-radius,10px);color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.875rem;gap:8px;min-width:160px;padding:8px 14px;transition:border-color .2s,box-shadow .2s;user-select:none}.ntd-picker-trigger:hover{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-trigger:focus-visible{border-color:var(--ntd-picker-accent,#6c5ce7);box-shadow:0 0 0 3px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));outline:none}.ntd-picker-trigger-icon{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));border-radius:6px;display:flex;flex-shrink:0;height:28px;justify-content:center;width:28px}.ntd-picker-trigger-label{flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.ntd-picker-trigger-chevron,.ntd-picker-trigger-placeholder{color:var(--ntd-picker-muted,#606078)}.ntd-picker-trigger-chevron{flex-shrink:0;transition:transform .2s}.ntd-picker.ntd-picker--open .ntd-picker-trigger-chevron{transform:rotate(180deg)}.ntd-picker-dropdown{animation:ntd-picker-appear .2s ease-out;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 rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.2);display:flex;flex-direction:column;left:0;max-height:460px;overflow:hidden;position:absolute;top:calc(100% + 6px);width:380px;z-index:1000}@keyframes ntd-picker-appear{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-picker-search{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);flex-shrink:0;padding:10px 12px;position:relative}.ntd-picker-search-icon{color:var(--ntd-picker-muted,#606078);left:22px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.ntd-picker-search input{background:var(--ntd-picker-input-bg,#14141c);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);font-family:inherit;font-size:.82rem;outline:none;padding:8px 12px 8px 34px;transition:border-color .2s;width:100%}.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{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;gap:2px;overflow-x:auto;padding:6px 10px;scrollbar-width:none}.ntd-picker-tabs::-webkit-scrollbar{display:none}.ntd-picker-tab{background:transparent;border:none;border-radius:6px;color:var(--ntd-picker-muted,#606078);cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;letter-spacing:.03em;padding:5px 10px;text-transform:uppercase;transition:all .15s;white-space:nowrap}.ntd-picker-tab:hover{background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-tab.ntd-picker-tab--active{background:var(--ntd-picker-accent,#6c5ce7);color:#fff}.ntd-picker-grid-wrap{flex:1;overflow-y:auto;padding:8px;scrollbar-color:var(--ntd-picker-border,#3a3a4a) transparent;scrollbar-width:thin}.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{color:var(--ntd-picker-muted,#606078);font-size:.68rem;font-weight:600;letter-spacing:.05em;margin-top:4px;padding:6px 4px 4px;text-transform:uppercase}.ntd-picker-category-label:first-child{margin-top:0}.ntd-picker-grid{display:grid;gap:4px;grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}.ntd-picker-cell{align-items:center;aspect-ratio:1;background:transparent;border:none;border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:flex;justify-content:center;position:relative;transition:all .15s;width:100%}.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);box-shadow:0 2px 8px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));color:#fff}.ntd-picker-cell:focus-visible{outline:2px solid var(--ntd-picker-accent,#6c5ce7);outline-offset:1px}.ntd-picker-cell:after{background:var(--ntd-picker-text,#f0f0f5);border-radius:5px;bottom:calc(100% + 6px);color:var(--ntd-picker-bg,#1e1e2a);content:attr(data-name);font-size:.65rem;font-weight:500;left:50%;opacity:0;padding:3px 8px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .15s;white-space:nowrap;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{border:2px dashed var(--ntd-picker-accent,#6c5ce7);border-radius:8px;content:"";inset:0;opacity:.5;pointer-events:none;position:absolute}.ntd-picker-empty{color:var(--ntd-picker-muted,#606078);font-size:.82rem;padding:32px 16px;text-align:center}.ntd-picker-empty-icon{font-size:2rem;margin-bottom:8px;opacity:.4}.ntd-picker-footer{align-items:center;border-top:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;justify-content:space-between;padding:8px 12px}.ntd-picker-count{font-size:.7rem}.ntd-picker-clear,.ntd-picker-count{color:var(--ntd-picker-muted,#606078)}.ntd-picker-clear{background:transparent;border:none;border-radius:5px;cursor:pointer;font-family:inherit;font-size:.72rem;padding:4px 10px;transition:all .15s}.ntd-picker-clear:hover{background:rgba(255,80,80,.12);color:#ff5050}.ntd-picker-multi-badge{border-radius:10px;font-size:.7rem;font-weight:600;height:20px;min-width:20px;padding:0 6px}.ntd-picker-cell-check,.ntd-picker-multi-badge{align-items:center;background:var(--ntd-picker-accent,#6c5ce7);color:#fff;display:flex;justify-content:center}.ntd-picker-cell-check{border-radius:50%;height:16px;pointer-events:none;position:absolute;right:2px;top:2px;width:16px}.ntd-picker-cell.ntd-picker-cell--multi-select{position:relative}.ntd-picker-cell-fav{align-items:center;background:transparent;border:none;border-radius:50%;color:var(--ntd-picker-muted,#606078);cursor:pointer;display:flex;height:16px;justify-content:center;left:2px;opacity:0;padding:0;position:absolute;top:2px;transition:all .15s;width:16px}.ntd-picker-cell-fav.ntd-picker-cell-fav--active,.ntd-picker-cell:hover .ntd-picker-cell-fav{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{align-items:center;display:inline-flex;gap:4px}.ntd-picker-tab-special svg{height:10px;width:10px}.ntd-picker-tab-count{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.2));border-radius:8px;display:inline-flex;font-size:.65rem;font-weight:600;height:16px;justify-content:center;margin-left:2px;min-width:16px;padding:0 4px}.ntd-picker-tab.ntd-picker-tab--active .ntd-picker-tab-count{background:hsla(0,0%,100%,.2)}.ntd-picker-done{background:var(--ntd-picker-accent,#6c5ce7);border:none;border-radius:5px;color:#fff;cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;padding:4px 12px;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{cursor:not-allowed;opacity:.5}.ntd-picker.ntd-picker--multi .ntd-picker-trigger{border-style:dashed}

package/dist/esm/createIcon.js

@@ -187,7 +187,10 @@ function createIcon(options) {
                 ? `transform ${transition}`
                 : undefined;
         const animStyle = {
-            ...(animationDuration ? { animationDuration } : {}),
+            // the variable carries the duration to the parts an icon animates inside itself
+            ...(animationDuration
+                ? { animationDuration, '--ntd-anim-duration': animationDuration }
+                : {}),
             ...(transformString ? { transform: transformString } : {}),
             ...(transformString ? { transformOrigin } : {}),
             ...(transitionValue ? { transition: transitionValue } : {}),
@@ -223,7 +226,6 @@ function createIcon(options) {
         const iconContent = variant === 'mini' ? (jsx("g", { transform: `translate(${center.x} ${center.y}) scale(${MINI_SCALE}) translate(${-center.x} ${-center.y})`, children: rendered })) : (rendered);
         return (jsxs("svg", { ref: ref, xmlns: "http://www.w3.org/2000/svg", viewBox: viewBox, width: resolvedSize, height: resolvedSize, fill: "none", strokeLinecap: strokeLinecap, strokeLinejoin: strokeLinejoin, className: classes, style: animStyle, role: title ? 'img' : 'presentation', "aria-hidden": title ? undefined : true, "aria-label": title, ...rest, children: [title && jsx("title", { children: title }), gradient && (jsx("defs", { children: renderGradientDef(gradId, gradient, gradientType, gradientAngle, gradientAnimation) })), is3d && jsx("defs", { children: render3dFilterDef(filterId) }), isCutout && (jsx("defs", { children: jsxs("mask", { id: maskId, children: [jsx("rect", { x: "0", y: "0", width: "24", height: "24", fill: "white" }), jsx("g", { transform: "translate(12,12) scale(0.8) translate(-12,-12)", children: paths.solid({
                                     ...renderProps,
-                                    variant: 'solid',
                                     primaryColor: 'black',
                                     secondaryColor: 'black',
                                     accentColor: 'white',

package/dist/esm/figmaExport.js

@@ -104,6 +104,7 @@ function exportIconToSvgString(svgElement, options = {}) {
         clone.style.animation = '';
         clone.style.animationName = '';
         clone.style.animationDuration = '';
+        clone.style.removeProperty('--ntd-anim-duration');
         // Remove SMIL animation elements
         clone.querySelectorAll('animate, animateTransform, animateMotion').forEach((el) => el.remove());
     }