@nice2dev/icons 1.2.1 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/CHANGELOG.md +39 -0
  2. package/dist/cjs/NiceDesktopIconExporter.js +7 -3
  3. package/dist/cjs/NiceFaviconGenerator.js +6 -2
  4. package/dist/cjs/NiceIconPicker.js +20 -10
  5. package/dist/cjs/NiceIconPreview.js +3 -1
  6. package/dist/cjs/NiceIconSetCreator.js +7 -2
  7. package/dist/cjs/NtdIconBadge.js +18 -3
  8. package/dist/cjs/NtdIconMorph.js +3 -1
  9. package/dist/cjs/design-tokens.js +2 -0
  10. package/dist/cjs/iconMetadata.js +4 -0
  11. package/dist/cjs/icons/actions.js +22 -0
  12. package/dist/cjs/icons/index.js +8 -0
  13. package/dist/cjs/icons/shapes.js +67 -0
  14. package/dist/cjs/index.js +8 -0
  15. package/dist/cjs/nicetodev-icons.css +1 -1
  16. package/dist/cjs/resolver.js +9 -0
  17. package/dist/cjs/utilities.js +4 -2
  18. package/dist/esm/NiceDesktopIconExporter.js +7 -3
  19. package/dist/esm/NiceFaviconGenerator.js +6 -2
  20. package/dist/esm/NiceIconPicker.js +20 -10
  21. package/dist/esm/NiceIconPreview.js +3 -1
  22. package/dist/esm/NiceIconSetCreator.js +7 -2
  23. package/dist/esm/NtdIconBadge.js +18 -3
  24. package/dist/esm/NtdIconMorph.js +3 -1
  25. package/dist/esm/design-tokens.js +2 -0
  26. package/dist/esm/iconMetadata.js +4 -0
  27. package/dist/esm/icons/actions.js +21 -1
  28. package/dist/esm/icons/index.js +2 -2
  29. package/dist/esm/icons/shapes.js +62 -1
  30. package/dist/esm/index.js +2 -2
  31. package/dist/esm/nicetodev-icons.css +1 -1
  32. package/dist/esm/resolver.js +9 -0
  33. package/dist/esm/utilities.js +4 -2
  34. package/dist/types/design-tokens.d.ts +2 -0
  35. package/dist/types/icons/actions.d.ts +2 -0
  36. package/dist/types/icons/index.d.ts +2 -2
  37. package/dist/types/icons/shapes.d.ts +6 -0
  38. package/package.json +3 -1
@@ -201,7 +201,69 @@ const NtdShuffle = /* @__PURE__ */ createIcon.createIcon({
201
201
  vivid: ({ primaryColor, secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("polyline", { points: "16,3 21,3 21,8", stroke: primaryColor, strokeWidth: "2", fill: "none" }), jsxRuntime.jsx("line", { x1: "4", y1: "20", x2: "21", y2: "3", stroke: secondaryColor, strokeWidth: "1.8" }), jsxRuntime.jsx("polyline", { points: "21,16 21,21 16,21", stroke: "#3B82F6", strokeWidth: "1.5", fill: "none" }), jsxRuntime.jsx("line", { x1: "15", y1: "15", x2: "21", y2: "21", stroke: secondaryColor, strokeWidth: "1.5" }), jsxRuntime.jsx("line", { x1: "4", y1: "4", x2: "9", y2: "9", stroke: secondaryColor, strokeWidth: "1.5" })] })),
202
202
  },
203
203
  });
204
+ // Geometry construction tools (1.2.2: NiceGeometry drew these as the glyphs • — ⊥ ∥ ⊙ ∠).
205
+ // Same names as the NiceIcon built-ins in ui-core, mapped in resolver.ts.
206
+ const NtdPoint = /* @__PURE__ */ createIcon.createIcon({
207
+ displayName: 'NtdPoint',
208
+ paths: {
209
+ solid: ({ primaryColor, strokeWidth: _strokeWidth }) => (jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "5", fill: primaryColor })),
210
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: primaryColor })] })),
211
+ duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth: _strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "9", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "4", fill: primaryColor })] })),
212
+ vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "5", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "5", fill: "white", opacity: "0.1" })] })),
213
+ },
214
+ });
215
+ // A segment: a line between two marked endpoints (unlike NtdLine-style rays, it ends).
216
+ const NtdSegment = /* @__PURE__ */ createIcon.createIcon({
217
+ displayName: 'NtdSegment',
218
+ paths: {
219
+ solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("line", { x1: "5", y1: "19", x2: "19", y2: "5", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round" }), jsxRuntime.jsx("circle", { cx: "5", cy: "19", r: "2.5", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "19", cy: "5", r: "2.5", fill: primaryColor })] })),
220
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("line", { x1: "6.8", y1: "17.2", x2: "17.2", y2: "6.8", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round" }), jsxRuntime.jsx("circle", { cx: "5", cy: "19", r: "2.5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("circle", { cx: "19", cy: "5", r: "2.5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
221
+ duotone: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("line", { x1: "5", y1: "19", x2: "19", y2: "5", stroke: secondaryColor, strokeWidth: strokeWidth, strokeLinecap: "round" }), jsxRuntime.jsx("circle", { cx: "5", cy: "19", r: "2.5", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "19", cy: "5", r: "2.5", fill: primaryColor })] })),
222
+ vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("line", { x1: "5", y1: "19", x2: "19", y2: "5", stroke: primaryColor, strokeWidth: "2.2" }), jsxRuntime.jsx("circle", { cx: "5", cy: "19", r: "2.5", fill: primaryColor }), jsxRuntime.jsx("circle", { cx: "19", cy: "5", r: "2.5", fill: primaryColor })] })),
223
+ },
224
+ });
225
+ // Perpendicular (⊥): a base line, the perpendicular from its middle and the right-angle mark.
226
+ const NtdPerpendicular = /* @__PURE__ */ createIcon.createIcon({
227
+ displayName: 'NtdPerpendicular',
228
+ paths: {
229
+ solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M3 20h18M12 20V4", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("rect", { x: "12", y: "15", width: "5", height: "5", fill: primaryColor })] })),
230
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M3 20h18M12 20V4M12 15h5v5", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" })),
231
+ duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("rect", { x: "12", y: "15", width: "5", height: "5", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: "M3 20h18M12 20V4M12 15h5v5", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" })] })),
232
+ vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M3 20h18M12 20V4", stroke: primaryColor, strokeWidth: "2.2", fill: "none" }), jsxRuntime.jsx("rect", { x: "12", y: "15", width: "5", height: "5", fill: primaryColor })] })),
233
+ },
234
+ });
235
+ // Parallel (∥): two lines at the same slope.
236
+ const NtdParallel = /* @__PURE__ */ createIcon.createIcon({
237
+ displayName: 'NtdParallel',
238
+ paths: {
239
+ solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M4 16L14 6M10 20L20 10", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" })),
240
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M4 16L14 6M10 20L20 10", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" })),
241
+ duotone: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M4 16L14 6", stroke: secondaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("path", { d: "M10 20L20 10", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" })] })),
242
+ vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsx("path", { d: "M4 16L14 6M10 20L20 10", stroke: primaryColor, strokeWidth: "2.2", strokeLinecap: "round", fill: "none" })),
243
+ },
244
+ });
245
+ // Midpoint (⊙): a segment with end ticks and its middle marked.
246
+ const NtdMidpoint = /* @__PURE__ */ createIcon.createIcon({
247
+ displayName: 'NtdMidpoint',
248
+ paths: {
249
+ solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M3 12h6M15 12h6M3 9v6M21 9v6", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3", fill: primaryColor })] })),
250
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M3 12h6M15 12h6M3 9v6M21 9v6", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
251
+ duotone: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M3 12h6M15 12h6M3 9v6M21 9v6", stroke: secondaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3", fill: primaryColor })] })),
252
+ vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M3 12h6M15 12h6M3 9v6M21 9v6", stroke: primaryColor, strokeWidth: "2.2", strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3", fill: primaryColor })] })),
253
+ },
254
+ });
255
+ // Angle bisector (∠): two rays from a vertex, the ray halfway between them and the angle arc.
256
+ const NtdAngleBisector = /* @__PURE__ */ createIcon.createIcon({
257
+ displayName: 'NtdAngleBisector',
258
+ paths: {
259
+ solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M4 20h17M4 20L16 5M4 20l14.4-6.9M10 20a6 6 0 0 0-2.25-4.68", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("circle", { cx: "4", cy: "20", r: "2", fill: primaryColor })] })),
260
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M4 20h17M4 20L16 5M4 20l14.4-6.9M10 20a6 6 0 0 0-2.25-4.68", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" })),
261
+ duotone: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M4 20h17M4 20L16 5M10 20a6 6 0 0 0-2.25-4.68", stroke: primaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("path", { d: "M4 20l14.4-6.9", stroke: secondaryColor, strokeWidth: strokeWidth, strokeLinecap: "round", fill: "none" })] })),
262
+ vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M4 20h17M4 20L16 5M4 20l14.4-6.9M10 20a6 6 0 0 0-2.25-4.68", stroke: primaryColor, strokeWidth: "2.2", strokeLinecap: "round", fill: "none" }), jsxRuntime.jsx("circle", { cx: "4", cy: "20", r: "2", fill: primaryColor })] })),
263
+ },
264
+ });
204
265
 
266
+ exports.NtdAngleBisector = NtdAngleBisector;
205
267
  exports.NtdArrowDownCircle = NtdArrowDownCircle;
206
268
  exports.NtdArrowLeftCircle = NtdArrowLeftCircle;
207
269
  exports.NtdArrowRightCircle = NtdArrowRightCircle;
@@ -215,11 +277,16 @@ exports.NtdCross = NtdCross;
215
277
  exports.NtdDiamond = NtdDiamond;
216
278
  exports.NtdHexagon = NtdHexagon;
217
279
  exports.NtdMaximize = NtdMaximize;
280
+ exports.NtdMidpoint = NtdMidpoint;
218
281
  exports.NtdMinimize = NtdMinimize;
219
282
  exports.NtdMove = NtdMove;
220
283
  exports.NtdOctagon = NtdOctagon;
284
+ exports.NtdParallel = NtdParallel;
221
285
  exports.NtdPentagon = NtdPentagon;
286
+ exports.NtdPerpendicular = NtdPerpendicular;
287
+ exports.NtdPoint = NtdPoint;
222
288
  exports.NtdRepeat = NtdRepeat;
289
+ exports.NtdSegment = NtdSegment;
223
290
  exports.NtdShuffle = NtdShuffle;
224
291
  exports.NtdSquare = NtdSquare;
225
292
  exports.NtdStar4 = NtdStar4;
package/dist/cjs/index.js CHANGED
@@ -106,6 +106,7 @@ exports.NtdCopy = actions.NtdCopy;
106
106
  exports.NtdDownload = actions.NtdDownload;
107
107
  exports.NtdEdit = actions.NtdEdit;
108
108
  exports.NtdFilter = actions.NtdFilter;
109
+ exports.NtdGroup = actions.NtdGroup;
109
110
  exports.NtdLink = actions.NtdLink;
110
111
  exports.NtdLock = actions.NtdLock;
111
112
  exports.NtdLogIn = actions.NtdLogIn;
@@ -122,6 +123,7 @@ exports.NtdShare = actions.NtdShare;
122
123
  exports.NtdSort = actions.NtdSort;
123
124
  exports.NtdTrash = actions.NtdTrash;
124
125
  exports.NtdUndo = actions.NtdUndo;
126
+ exports.NtdUngroup = actions.NtdUngroup;
125
127
  exports.NtdUnlock = actions.NtdUnlock;
126
128
  exports.NtdUpload = actions.NtdUpload;
127
129
  exports.NtdZoomIn = actions.NtdZoomIn;
@@ -288,6 +290,7 @@ exports.NtdTree = weather.NtdTree;
288
290
  exports.NtdUmbrella = weather.NtdUmbrella;
289
291
  exports.NtdWave = weather.NtdWave;
290
292
  exports.NtdWind = weather.NtdWind;
293
+ exports.NtdAngleBisector = shapes.NtdAngleBisector;
291
294
  exports.NtdArrowDownCircle = shapes.NtdArrowDownCircle;
292
295
  exports.NtdArrowLeftCircle = shapes.NtdArrowLeftCircle;
293
296
  exports.NtdArrowRightCircle = shapes.NtdArrowRightCircle;
@@ -301,11 +304,16 @@ exports.NtdCross = shapes.NtdCross;
301
304
  exports.NtdDiamond = shapes.NtdDiamond;
302
305
  exports.NtdHexagon = shapes.NtdHexagon;
303
306
  exports.NtdMaximize = shapes.NtdMaximize;
307
+ exports.NtdMidpoint = shapes.NtdMidpoint;
304
308
  exports.NtdMinimize = shapes.NtdMinimize;
305
309
  exports.NtdMove = shapes.NtdMove;
306
310
  exports.NtdOctagon = shapes.NtdOctagon;
311
+ exports.NtdParallel = shapes.NtdParallel;
307
312
  exports.NtdPentagon = shapes.NtdPentagon;
313
+ exports.NtdPerpendicular = shapes.NtdPerpendicular;
314
+ exports.NtdPoint = shapes.NtdPoint;
308
315
  exports.NtdRepeat = shapes.NtdRepeat;
316
+ exports.NtdSegment = shapes.NtdSegment;
309
317
  exports.NtdShuffle = shapes.NtdShuffle;
310
318
  exports.NtdSquare = shapes.NtdSquare;
311
319
  exports.NtdStar4 = shapes.NtdStar4;
@@ -1 +1 @@
1
- .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}.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}}
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}}.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-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}
@@ -132,6 +132,15 @@ const NAME_MAP = {
132
132
  package: 'NtdPackage',
133
133
  layers: 'NtdLayers',
134
134
  grid: 'NtdGrid',
135
+ // 1.2.2: geometry tools and object grouping (built-ins of the same names in ui-core)
136
+ point: 'NtdPoint',
137
+ segment: 'NtdSegment',
138
+ perpendicular: 'NtdPerpendicular',
139
+ parallel: 'NtdParallel',
140
+ midpoint: 'NtdMidpoint',
141
+ 'angle-bisector': 'NtdAngleBisector',
142
+ group: 'NtdGroup',
143
+ ungroup: 'NtdUngroup',
135
144
  list: 'NtdList',
136
145
  table: 'NtdTable',
137
146
  monitor: 'NtdMonitor',
@@ -338,16 +338,18 @@ function isValidIconName(name) {
338
338
  function useBatchIcons(configs) {
339
339
  const [icons, setIcons] = React.useState(new Map());
340
340
  const [isLoading, setIsLoading] = React.useState(true);
341
+ // the names, not the array: a new array of the same icons must not reload them
342
+ const namesKey = configs.map((c) => c.name).join(',');
341
343
  React.useEffect(() => {
342
344
  const loadIcons = async () => {
343
345
  setIsLoading(true);
344
- const names = configs.map((c) => c.name);
346
+ const names = namesKey ? namesKey.split(',') : [];
345
347
  const loadedIcons = await preloadIcons(names);
346
348
  setIcons(loadedIcons);
347
349
  setIsLoading(false);
348
350
  };
349
351
  loadIcons();
350
- }, [configs.map((c) => c.name).join(',')]);
352
+ }, [namesKey]);
351
353
  const renderIcon = React.useCallback((name, additionalProps) => {
352
354
  const Icon = icons.get(name);
353
355
  const config = configs.find((c) => c.name === name);
@@ -1,4 +1,5 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { useNiceTranslation } from '@nice2dev/ui-core';
2
3
  import { useState, useMemo, useCallback } from 'react';
3
4
 
4
5
  /* ══════════════════════════════════════════════════════════════════════════════
@@ -624,24 +625,27 @@ Note: iconutil is only available on macOS.
624
625
  * ```
625
626
  */
626
627
  const NiceDesktopIconExporter = ({ icon, initialConfig, onExport, className = '', }) => {
628
+ const { t } = useNiceTranslation();
627
629
  const { config, setConfig, icons, isExporting, progress, exportAll, downloadAll, downloadSingle, } = useDesktopIconExporter(icon, initialConfig);
628
630
  const handleExport = async () => {
629
631
  await exportAll();
630
632
  onExport === null || onExport === void 0 ? void 0 : onExport(icons);
631
633
  };
632
634
  const IconComponent = icon;
633
- return (jsxs("div", { className: `nice-desktop-icon-exporter ${className}`, children: [jsxs("div", { className: "nice-desktop-icon-exporter__preview", children: [jsx("h3", { children: "Preview" }), jsx("div", { className: "nice-desktop-icon-exporter__preview-grid", children: [16, 32, 48, 64, 128, 256].map((size) => (jsxs("div", { className: "nice-desktop-icon-exporter__preview-item", children: [jsx("div", { className: "nice-desktop-icon-exporter__preview-box", style: {
635
+ return (jsxs("div", { className: `nice-desktop-icon-exporter ${className}`, children: [jsxs("div", { className: "nice-desktop-icon-exporter__preview", children: [jsx("h3", { children: t('desktopIconExporter.preview', 'Preview') }), jsx("div", { className: "nice-desktop-icon-exporter__preview-grid", children: [16, 32, 48, 64, 128, 256].map((size) => (jsxs("div", { className: "nice-desktop-icon-exporter__preview-item", children: [jsx("div", { className: "nice-desktop-icon-exporter__preview-box", style: {
634
636
  width: Math.min(size, 128),
635
637
  height: Math.min(size, 128),
636
638
  backgroundColor: config.backgroundColor || '#f0f0f0',
637
- }, children: jsx(IconComponent, { size: Math.min(size, 128) * (1 - config.padding * 2), fill: config.fillColor }) }), jsxs("span", { children: [size, "\u00D7", size] })] }, size))) })] }), jsxs("div", { className: "nice-desktop-icon-exporter__config", children: [jsx("h3", { children: "Configuration" }), jsxs("label", { children: ["Icon Name:", jsx("input", { type: "text", value: config.name, onChange: (e) => setConfig((c) => ({ ...c, name: e.target.value })) })] }), jsxs("label", { children: ["Fill Color:", jsx("input", { type: "color", value: config.fillColor, onChange: (e) => setConfig((c) => ({ ...c, fillColor: e.target.value })) })] }), jsxs("label", { children: ["Background:", jsx("input", { type: "color", value: config.backgroundColor || '#ffffff', onChange: (e) => setConfig((c) => ({ ...c, backgroundColor: e.target.value })) }), jsx("button", { onClick: () => setConfig((c) => ({ ...c, backgroundColor: undefined })), children: "Transparent" })] }), jsxs("label", { children: ["Padding: ", Math.round(config.padding * 100), "%", jsx("input", { type: "range", min: "0", max: "0.3", step: "0.01", value: config.padding, onChange: (e) => setConfig((c) => ({ ...c, padding: parseFloat(e.target.value) })) })] }), jsxs("div", { className: "nice-desktop-icon-exporter__platforms", children: [jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeWindows, onChange: (e) => setConfig((c) => ({ ...c, includeWindows: e.target.checked })) }), "Windows (.ico)"] }), jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeMacOS, onChange: (e) => setConfig((c) => ({ ...c, includeMacOS: e.target.checked })) }), "macOS (.iconset)"] }), jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeLinux, onChange: (e) => setConfig((c) => ({ ...c, includeLinux: e.target.checked })) }), "Linux (hicolor)"] }), jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeRetina, onChange: (e) => setConfig((c) => ({ ...c, includeRetina: e.target.checked })) }), "HiDPI/Retina (@2x, @3x)"] })] }), jsxs("div", { className: "nice-desktop-icon-exporter__sizes", children: [jsx("h4", { children: "Sizes:" }), DESKTOP_ICON_SIZES.map(({ size, label }) => (jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.sizes.includes(size), onChange: (e) => {
639
+ }, children: jsx(IconComponent, { size: Math.min(size, 128) * (1 - config.padding * 2), fill: config.fillColor }) }), jsxs("span", { children: [size, "\u00D7", size] })] }, size))) })] }), jsxs("div", { className: "nice-desktop-icon-exporter__config", children: [jsx("h3", { children: t('desktopIconExporter.configuration', 'Configuration') }), jsxs("label", { children: [t('desktopIconExporter.iconName', 'Icon Name:'), jsx("input", { type: "text", value: config.name, onChange: (e) => setConfig((c) => ({ ...c, name: e.target.value })) })] }), jsxs("label", { children: [t('desktopIconExporter.fillColor', 'Fill Color:'), jsx("input", { type: "color", value: config.fillColor, onChange: (e) => setConfig((c) => ({ ...c, fillColor: e.target.value })) })] }), jsxs("label", { children: [t('desktopIconExporter.background', 'Background:'), jsx("input", { type: "color", value: config.backgroundColor || '#ffffff', onChange: (e) => setConfig((c) => ({ ...c, backgroundColor: e.target.value })) }), jsx("button", { onClick: () => setConfig((c) => ({ ...c, backgroundColor: undefined })), children: t('desktopIconExporter.transparent', 'Transparent') })] }), jsxs("label", { children: [t('desktopIconExporter.padding', 'Padding: {padding}%').replace('{padding}', String(Math.round(config.padding * 100))), jsx("input", { type: "range", min: "0", max: "0.3", step: "0.01", value: config.padding, onChange: (e) => setConfig((c) => ({ ...c, padding: parseFloat(e.target.value) })) })] }), jsxs("div", { className: "nice-desktop-icon-exporter__platforms", children: [jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeWindows, onChange: (e) => setConfig((c) => ({ ...c, includeWindows: e.target.checked })) }), t('desktopIconExporter.windowsIco', 'Windows (.ico)')] }), jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeMacOS, onChange: (e) => setConfig((c) => ({ ...c, includeMacOS: e.target.checked })) }), t('desktopIconExporter.macosIconset', 'macOS (.iconset)')] }), jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeLinux, onChange: (e) => setConfig((c) => ({ ...c, includeLinux: e.target.checked })) }), t('desktopIconExporter.linuxHicolor', 'Linux (hicolor)')] }), jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.includeRetina, onChange: (e) => setConfig((c) => ({ ...c, includeRetina: e.target.checked })) }), t('desktopIconExporter.hidpiRetina2x3x', 'HiDPI/Retina (@2x, @3x)')] })] }), jsxs("div", { className: "nice-desktop-icon-exporter__sizes", children: [jsx("h4", { children: t('desktopIconExporter.sizes', 'Sizes:') }), DESKTOP_ICON_SIZES.map(({ size, label }) => (jsxs("label", { children: [jsx("input", { type: "checkbox", checked: config.sizes.includes(size), onChange: (e) => {
638
640
  setConfig((c) => ({
639
641
  ...c,
640
642
  sizes: e.target.checked
641
643
  ? [...c.sizes, size].sort((a, b) => a - b)
642
644
  : c.sizes.filter((s) => s !== size),
643
645
  }));
644
- } }), label] }, size)))] })] }), jsxs("div", { className: "nice-desktop-icon-exporter__actions", children: [jsx("button", { onClick: handleExport, disabled: isExporting, children: isExporting ? `Exporting... ${Math.round(progress)}%` : 'Generate Icons' }), jsx("button", { onClick: downloadAll, disabled: isExporting || icons.length === 0, children: "Download All (ZIP)" })] }), icons.length > 0 && (jsxs("div", { className: "nice-desktop-icon-exporter__results", children: [jsxs("h3", { children: ["Generated Icons (", icons.length, ")"] }), jsx("div", { className: "nice-desktop-icon-exporter__results-grid", children: icons.map((exportedIcon) => (jsxs("div", { className: "nice-desktop-icon-exporter__result-item", children: [jsx("img", { src: exportedIcon.dataUrl, alt: exportedIcon.filename }), jsx("span", { children: exportedIcon.filename }), jsx("button", { onClick: () => downloadSingle(exportedIcon), children: "Download" })] }, exportedIcon.filename))) })] }))] }));
646
+ } }), label] }, size)))] })] }), jsxs("div", { className: "nice-desktop-icon-exporter__actions", children: [jsx("button", { onClick: handleExport, disabled: isExporting, children: isExporting
647
+ ? t('desktopIconExporter.exporting', 'Exporting... {progress}%').replace('{progress}', String(Math.round(progress)))
648
+ : t('desktopIconExporter.generateIcons', 'Generate Icons') }), jsx("button", { onClick: downloadAll, disabled: isExporting || icons.length === 0, children: t('desktopIconExporter.downloadAllZip', 'Download All (ZIP)') })] }), icons.length > 0 && (jsxs("div", { className: "nice-desktop-icon-exporter__results", children: [jsx("h3", { children: t('desktopIconExporter.generatedIcons', 'Generated Icons ({icons})').replace('{icons}', String(icons.length)) }), jsx("div", { className: "nice-desktop-icon-exporter__results-grid", children: icons.map((exportedIcon) => (jsxs("div", { className: "nice-desktop-icon-exporter__result-item", children: [jsx("img", { src: exportedIcon.dataUrl, alt: exportedIcon.filename }), jsx("span", { children: exportedIcon.filename }), jsx("button", { onClick: () => downloadSingle(exportedIcon), children: t('desktopIconExporter.download', 'Download') })] }, exportedIcon.filename))) })] }))] }));
645
649
  };
646
650
 
647
651
  export { DESKTOP_ICON_SIZES, LINUX_HICOLOR_DIRS, NiceDesktopIconExporter, RETINA_VARIANTS, useDesktopIconExporter };
@@ -1,4 +1,5 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { useNiceTranslation } from '@nice2dev/ui-core';
2
3
  import { useState, useCallback } from 'react';
3
4
  import { NtdDownload } from './icons/actions.js';
4
5
 
@@ -223,6 +224,7 @@ function useFaviconGenerator(icon, fill = '#1e1e1e', initialConfig) {
223
224
  * Favicon generator component for creating all favicon variants.
224
225
  */
225
226
  function NiceFaviconGenerator({ icon, fill = '#1e1e1e', manifestConfig, onGenerate, className = '', }) {
227
+ const { t } = useNiceTranslation();
226
228
  const { config, setConfig, assets, isGenerating, generate, downloadAll, downloadSingle, getManifestJson, getHtmlTags, } = useFaviconGenerator(icon, fill, manifestConfig);
227
229
  const [activeTab, setActiveTab] = useState('preview');
228
230
  const handleGenerate = async () => {
@@ -231,10 +233,12 @@ function NiceFaviconGenerator({ icon, fill = '#1e1e1e', manifestConfig, onGenera
231
233
  onGenerate(assets, getManifestJson());
232
234
  }
233
235
  };
234
- return (jsxs("div", { className: `nice-favicon-generator ${className}`, style: styles.container, children: [jsxs("div", { style: styles.section, children: [jsx("h3", { style: styles.sectionTitle, children: "Manifest Configuration" }), jsxs("div", { style: styles.formGrid, children: [jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: "App Name" }), jsx("input", { type: "text", value: config.name, onChange: (e) => setConfig((c) => ({ ...c, name: e.target.value })), style: styles.input })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: "Short Name" }), jsx("input", { type: "text", value: config.shortName, onChange: (e) => setConfig((c) => ({ ...c, shortName: e.target.value })), style: styles.input })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: "Theme Color" }), jsx("input", { type: "color", value: config.themeColor, onChange: (e) => setConfig((c) => ({ ...c, themeColor: e.target.value })), style: styles.colorInput })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: "Background Color" }), jsx("input", { type: "color", value: config.backgroundColor, onChange: (e) => setConfig((c) => ({ ...c, backgroundColor: e.target.value })), style: styles.colorInput })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: "Display Mode" }), jsxs("select", { value: config.display, onChange: (e) => setConfig((c) => ({ ...c, display: e.target.value })), style: styles.input, children: [jsx("option", { value: "standalone", children: "Standalone" }), jsx("option", { value: "fullscreen", children: "Fullscreen" }), jsx("option", { value: "minimal-ui", children: "Minimal UI" }), jsx("option", { value: "browser", children: "Browser" })] })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: "Start URL" }), jsx("input", { type: "text", value: config.startUrl, onChange: (e) => setConfig((c) => ({ ...c, startUrl: e.target.value })), style: styles.input })] })] })] }), jsxs("div", { style: styles.actions, children: [jsx("button", { onClick: handleGenerate, disabled: isGenerating, style: {
236
+ return (jsxs("div", { className: `nice-favicon-generator ${className}`, style: styles.container, children: [jsxs("div", { style: styles.section, children: [jsx("h3", { style: styles.sectionTitle, children: t('faviconGenerator.manifestConfiguration', 'Manifest Configuration') }), jsxs("div", { style: styles.formGrid, children: [jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: t('faviconGenerator.appName', 'App Name') }), jsx("input", { type: "text", value: config.name, onChange: (e) => setConfig((c) => ({ ...c, name: e.target.value })), style: styles.input })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: t('faviconGenerator.shortName', 'Short Name') }), jsx("input", { type: "text", value: config.shortName, onChange: (e) => setConfig((c) => ({ ...c, shortName: e.target.value })), style: styles.input })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: t('faviconGenerator.themeColor', 'Theme Color') }), jsx("input", { type: "color", value: config.themeColor, onChange: (e) => setConfig((c) => ({ ...c, themeColor: e.target.value })), style: styles.colorInput })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: t('faviconGenerator.backgroundColor', 'Background Color') }), jsx("input", { type: "color", value: config.backgroundColor, onChange: (e) => setConfig((c) => ({ ...c, backgroundColor: e.target.value })), style: styles.colorInput })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: t('faviconGenerator.displayMode', 'Display Mode') }), jsxs("select", { value: config.display, onChange: (e) => setConfig((c) => ({ ...c, display: e.target.value })), style: styles.input, children: [jsx("option", { value: "standalone", children: t('faviconGenerator.standalone', 'Standalone') }), jsx("option", { value: "fullscreen", children: t('faviconGenerator.fullscreen', 'Fullscreen') }), jsx("option", { value: "minimal-ui", children: t('faviconGenerator.minimalUi', 'Minimal UI') }), jsx("option", { value: "browser", children: t('faviconGenerator.browser', 'Browser') })] })] }), jsxs("div", { style: styles.formGroup, children: [jsx("label", { style: styles.label, children: t('faviconGenerator.startUrl', 'Start URL') }), jsx("input", { type: "text", value: config.startUrl, onChange: (e) => setConfig((c) => ({ ...c, startUrl: e.target.value })), style: styles.input })] })] })] }), jsxs("div", { style: styles.actions, children: [jsx("button", { onClick: handleGenerate, disabled: isGenerating, style: {
235
237
  ...styles.button,
236
238
  ...(isGenerating ? styles.buttonDisabled : styles.buttonPrimary),
237
- }, children: isGenerating ? 'Generating...' : 'Generate Favicons' }), assets.length > 0 && (jsx("button", { onClick: downloadAll, style: { ...styles.button, ...styles.buttonSecondary }, children: "Download All" }))] }), assets.length > 0 && (jsxs("div", { style: styles.section, children: [jsxs("div", { style: styles.tabs, children: [jsx("button", { style: { ...styles.tab, ...(activeTab === 'preview' ? styles.tabActive : {}) }, onClick: () => setActiveTab('preview'), children: "Preview" }), jsx("button", { style: { ...styles.tab, ...(activeTab === 'manifest' ? styles.tabActive : {}) }, onClick: () => setActiveTab('manifest'), children: "manifest.json" }), jsx("button", { style: { ...styles.tab, ...(activeTab === 'html' ? styles.tabActive : {}) }, onClick: () => setActiveTab('html'), children: "HTML Tags" })] }), activeTab === 'preview' && (jsx("div", { style: styles.assetGrid, children: assets.map((asset) => (jsxs("div", { style: styles.assetCard, children: [jsx("div", { style: styles.assetPreview, children: jsx("img", { src: asset.dataUrl, alt: asset.filename, style: { maxWidth: '64px', maxHeight: '64px' } }) }), jsxs("div", { style: styles.assetInfo, children: [jsx("span", { style: styles.assetName, children: asset.filename }), jsxs("span", { style: styles.assetSize, children: [asset.size, "x", asset.size] }), jsx("span", { style: styles.assetPurpose, children: asset.purpose })] }), jsx("button", { onClick: () => downloadSingle(asset), style: styles.downloadBtn, "aria-label": `Download ${asset.filename}`, children: jsx(NtdDownload, { size: 14, variant: "outline" }) })] }, asset.filename))) })), activeTab === 'manifest' && jsx("pre", { style: styles.codeBlock, children: getManifestJson() }), activeTab === 'html' && jsx("pre", { style: styles.codeBlock, children: getHtmlTags() })] })), jsxs("div", { style: styles.reference, children: [jsx("h4", { style: styles.referenceTitle, children: "Favicon Sizes Reference" }), jsxs("table", { style: styles.table, children: [jsx("thead", { children: jsxs("tr", { children: [jsx("th", { style: styles.th, children: "File" }), jsx("th", { style: styles.th, children: "Size" }), jsx("th", { style: styles.th, children: "Purpose" })] }) }), jsx("tbody", { children: FAVICON_SIZES.map((f) => (jsxs("tr", { children: [jsxs("td", { style: styles.td, children: [f.name, ".", f.format] }), jsxs("td", { style: styles.td, children: [f.size, "x", f.size] }), jsx("td", { style: styles.td, children: f.purpose })] }, f.name))) })] })] })] }));
239
+ }, children: isGenerating
240
+ ? t('faviconGenerator.generating', 'Generating...')
241
+ : t('faviconGenerator.generateFavicons', 'Generate Favicons') }), assets.length > 0 && (jsx("button", { onClick: downloadAll, style: { ...styles.button, ...styles.buttonSecondary }, children: t('faviconGenerator.downloadAll', 'Download All') }))] }), assets.length > 0 && (jsxs("div", { style: styles.section, children: [jsxs("div", { style: styles.tabs, children: [jsx("button", { style: { ...styles.tab, ...(activeTab === 'preview' ? styles.tabActive : {}) }, onClick: () => setActiveTab('preview'), children: t('faviconGenerator.preview', 'Preview') }), jsx("button", { style: { ...styles.tab, ...(activeTab === 'manifest' ? styles.tabActive : {}) }, onClick: () => setActiveTab('manifest'), children: "manifest.json" }), jsx("button", { style: { ...styles.tab, ...(activeTab === 'html' ? styles.tabActive : {}) }, onClick: () => setActiveTab('html'), children: t('faviconGenerator.htmlTags', 'HTML Tags') })] }), activeTab === 'preview' && (jsx("div", { style: styles.assetGrid, children: assets.map((asset) => (jsxs("div", { style: styles.assetCard, children: [jsx("div", { style: styles.assetPreview, children: jsx("img", { src: asset.dataUrl, alt: asset.filename, style: { maxWidth: '64px', maxHeight: '64px' } }) }), jsxs("div", { style: styles.assetInfo, children: [jsx("span", { style: styles.assetName, children: asset.filename }), jsxs("span", { style: styles.assetSize, children: [asset.size, "x", asset.size] }), jsx("span", { style: styles.assetPurpose, children: asset.purpose })] }), jsx("button", { onClick: () => downloadSingle(asset), style: styles.downloadBtn, "aria-label": t('faviconGenerator.download', 'Download {filename}').replace('{filename}', String(asset.filename)), children: jsx(NtdDownload, { size: 14, variant: "outline" }) })] }, asset.filename))) })), activeTab === 'manifest' && jsx("pre", { style: styles.codeBlock, children: getManifestJson() }), activeTab === 'html' && jsx("pre", { style: styles.codeBlock, children: getHtmlTags() })] })), jsxs("div", { style: styles.reference, children: [jsx("h4", { style: styles.referenceTitle, children: t('faviconGenerator.faviconSizesReference', 'Favicon Sizes Reference') }), jsxs("table", { style: styles.table, children: [jsx("thead", { children: jsxs("tr", { children: [jsx("th", { style: styles.th, children: t('faviconGenerator.file', 'File') }), jsx("th", { style: styles.th, children: t('faviconGenerator.size', 'Size') }), jsx("th", { style: styles.th, children: t('faviconGenerator.purpose', 'Purpose') })] }) }), jsx("tbody", { children: FAVICON_SIZES.map((f) => (jsxs("tr", { children: [jsxs("td", { style: styles.td, children: [f.name, ".", f.format] }), jsxs("td", { style: styles.td, children: [f.size, "x", f.size] }), jsx("td", { style: styles.td, children: f.purpose })] }, f.name))) })] })] })] }));
238
242
  }
239
243
  /* ══════════════════════════════════════════════════════════════════════════════
240
244
  Styles
@@ -1,4 +1,5 @@
1
1
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
+ import { useNiceTranslation } from '@nice2dev/ui-core';
2
3
  import { forwardRef, useState, useRef, useMemo, useCallback, useImperativeHandle, useEffect } from 'react';
3
4
  import { NtdSearch, NtdCheck } from './icons/actions.js';
4
5
  import { NtdGrid } from './icons/files.js';
@@ -69,8 +70,9 @@ function saveToStorage(key, value) {
69
70
  * }
70
71
  * ```
71
72
  */
72
- const NiceIconPicker = /* @__PURE__ */ forwardRef(function NiceIconPicker({ icons, value = null, values = [], onChange, onChangeMulti, multiSelect = false, maxSelections, placeholder = 'Select icon…', variant = 'solid', gridIconSize = 'md', triggerIconSize = 'sm', categories: categoriesProp, className, disabled = false, clearable = true, virtualized = false, virtualizedItemCount = 100, showHistory = false, showFavorites = false, storageKeyPrefix = 'ntd-icon-picker', enableDragAndDrop = false, onDragStart, onDragEnd, }, ref) {
73
+ const NiceIconPicker = /* @__PURE__ */ forwardRef(function NiceIconPicker({ icons, value = null, values = [], onChange, onChangeMulti, multiSelect = false, maxSelections, placeholder, variant = 'solid', gridIconSize = 'md', triggerIconSize = 'sm', categories: categoriesProp, className, disabled = false, clearable = true, virtualized = false, virtualizedItemCount = 100, showHistory = false, showFavorites = false, storageKeyPrefix = 'ntd-icon-picker', enableDragAndDrop = false, onDragStart, onDragEnd, }, ref) {
73
74
  var _a;
75
+ const { t } = useNiceTranslation();
74
76
  const [isOpen, setIsOpen] = useState(false);
75
77
  const [search, setSearch] = useState('');
76
78
  const [activeCategory, setActiveCategory] = useState(null);
@@ -386,19 +388,27 @@ const NiceIconPicker = /* @__PURE__ */ forwardRef(function NiceIconPicker({ icon
386
388
  if (selectedEntries.length === 1) {
387
389
  return readableName(selectedEntries[0].name);
388
390
  }
389
- return `${selectedEntries.length} icons selected`;
391
+ return t('iconPicker.iconsSelected', '{count} icons selected').replace('{count}', String(selectedEntries.length));
390
392
  }
391
- return selectedEntry ? readableName(selectedEntry.name) : placeholder;
392
- }, [multiSelect, selectedEntries, selectedEntry, placeholder]);
393
- return (jsxs("div", { ref: rootRef, className: `ntd-picker${isOpen ? ' ntd-picker--open' : ''}${disabled ? ' ntd-picker--disabled' : ''}${multiSelect ? ' ntd-picker--multi' : ''}${className ? ` ${className}` : ''}`, children: [jsxs("button", { type: "button", className: "ntd-picker-trigger", onClick: handleToggle, disabled: disabled, "aria-haspopup": "listbox", "aria-expanded": isOpen, children: [jsx("span", { className: "ntd-picker-trigger-icon", children: selectedEntry ? (jsx(selectedEntry.Component, { size: triggerIconSize, variant: variant })) : multiSelect && selectedEntries.length > 1 ? (jsx("span", { className: "ntd-picker-multi-badge", children: selectedEntries.length })) : (jsx(NtdGrid, { size: 16, variant: "outline" })) }), jsx("span", { className: `ntd-picker-trigger-label${!selectedEntry && selectedEntries.length === 0 ? ' ntd-picker-trigger-placeholder' : ''}`, children: triggerLabel }), jsx("span", { className: "ntd-picker-trigger-chevron", children: jsx(Chevron, {}) })] }), isOpen && (jsxs("div", { className: "ntd-picker-dropdown", role: "listbox", children: [jsxs("div", { className: "ntd-picker-search", children: [jsx("span", { className: "ntd-picker-search-icon", children: jsx(SearchIcon, {}) }), jsx("input", { ref: searchInputRef, type: "text", placeholder: "Search icons\u2026", value: search, onChange: (e) => setSearch(e.target.value), "aria-label": "Search icons" })] }), (allCategories.length > 1 || showFavorites || showHistory) && (jsxs("div", { className: "ntd-picker-tabs", role: "tablist", children: [jsx("button", { type: "button", className: `ntd-picker-tab${activeCategory === null ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory(null), role: "tab", "aria-selected": activeCategory === null, children: "All" }), showFavorites && (jsxs("button", { type: "button", className: `ntd-picker-tab ntd-picker-tab-special${activeCategory === '__favorites__' ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory('__favorites__'), role: "tab", "aria-selected": activeCategory === '__favorites__', title: "Favorites", children: [jsx(StarIcon, { filled: true }), " Favorites", favorites.length > 0 && (jsx("span", { className: "ntd-picker-tab-count", children: favorites.length }))] })), showHistory && history.length > 0 && (jsxs("button", { type: "button", className: `ntd-picker-tab ntd-picker-tab-special${activeCategory === '__history__' ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory('__history__'), role: "tab", "aria-selected": activeCategory === '__history__', title: "Recently used", children: [jsx(ClockIcon, {}), " Recent"] })), allCategories.map((cat) => (jsx("button", { type: "button", className: `ntd-picker-tab${activeCategory === cat ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory(cat), role: "tab", "aria-selected": activeCategory === cat, children: cat }, cat)))] })), jsx("div", { className: "ntd-picker-grid-wrap", ref: gridWrapRef, children: filtered.length === 0 ? (jsxs("div", { className: "ntd-picker-empty", children: [jsx("div", { className: "ntd-picker-empty-icon", children: jsx(NtdInbox, { size: 28, variant: "outline" }) }), activeCategory === '__favorites__'
394
- ? 'No favorites yet. Click the star icon to add.'
393
+ return selectedEntry
394
+ ? readableName(selectedEntry.name)
395
+ : (placeholder !== null && placeholder !== void 0 ? placeholder : t('iconPicker.selectIcon', 'Select icon…'));
396
+ }, [multiSelect, selectedEntries, selectedEntry, placeholder, t]);
397
+ return (jsxs("div", { ref: rootRef, className: `ntd-picker${isOpen ? ' ntd-picker--open' : ''}${disabled ? ' ntd-picker--disabled' : ''}${multiSelect ? ' ntd-picker--multi' : ''}${className ? ` ${className}` : ''}`, children: [jsxs("button", { type: "button", className: "ntd-picker-trigger", onClick: handleToggle, disabled: disabled, "aria-haspopup": "listbox", "aria-expanded": isOpen, children: [jsx("span", { className: "ntd-picker-trigger-icon", children: selectedEntry ? (jsx(selectedEntry.Component, { size: triggerIconSize, variant: variant })) : multiSelect && selectedEntries.length > 1 ? (jsx("span", { className: "ntd-picker-multi-badge", children: selectedEntries.length })) : (jsx(NtdGrid, { size: 16, variant: "outline" })) }), jsx("span", { className: `ntd-picker-trigger-label${!selectedEntry && selectedEntries.length === 0 ? ' ntd-picker-trigger-placeholder' : ''}`, children: triggerLabel }), jsx("span", { className: "ntd-picker-trigger-chevron", children: jsx(Chevron, {}) })] }), isOpen && (jsxs("div", { className: "ntd-picker-dropdown", role: "listbox", children: [jsxs("div", { className: "ntd-picker-search", children: [jsx("span", { className: "ntd-picker-search-icon", children: jsx(SearchIcon, {}) }), jsx("input", { ref: searchInputRef, type: "text", placeholder: t('iconPicker.searchIcons', 'Search icons…'), value: search, onChange: (e) => setSearch(e.target.value), "aria-label": t('iconPicker.searchIcons2', 'Search icons') })] }), (allCategories.length > 1 || showFavorites || showHistory) && (jsxs("div", { className: "ntd-picker-tabs", role: "tablist", children: [jsx("button", { type: "button", className: `ntd-picker-tab${activeCategory === null ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory(null), role: "tab", "aria-selected": activeCategory === null, children: t('iconPicker.all', 'All') }), showFavorites && (jsxs("button", { type: "button", className: `ntd-picker-tab ntd-picker-tab-special${activeCategory === '__favorites__' ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory('__favorites__'), role: "tab", "aria-selected": activeCategory === '__favorites__', title: t('iconPicker.favorites', 'Favorites'), children: [jsx(StarIcon, { filled: true }), " ", t('iconPicker.favorites', 'Favorites'), favorites.length > 0 && (jsx("span", { className: "ntd-picker-tab-count", children: favorites.length }))] })), showHistory && history.length > 0 && (jsxs("button", { type: "button", className: `ntd-picker-tab ntd-picker-tab-special${activeCategory === '__history__' ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory('__history__'), role: "tab", "aria-selected": activeCategory === '__history__', title: t('iconPicker.recentlyUsed', 'Recently used'), children: [jsx(ClockIcon, {}), " ", t('iconPicker.recent', 'Recent')] })), allCategories.map((cat) => (jsx("button", { type: "button", className: `ntd-picker-tab${activeCategory === cat ? ' ntd-picker-tab--active' : ''}`, onClick: () => setActiveCategory(cat), role: "tab", "aria-selected": activeCategory === cat, children: cat }, cat)))] })), jsx("div", { className: "ntd-picker-grid-wrap", ref: gridWrapRef, children: filtered.length === 0 ? (jsxs("div", { className: "ntd-picker-empty", children: [jsx("div", { className: "ntd-picker-empty-icon", children: jsx(NtdInbox, { size: 28, variant: "outline" }) }), activeCategory === '__favorites__'
398
+ ? t('iconPicker.noFavoritesYetClickThe', 'No favorites yet. Click the star icon to add.')
395
399
  : activeCategory === '__history__'
396
- ? 'No recent icons.'
397
- : 'No icons found'] })) : (jsxs(Fragment, { children: [virtualized && visibleRange.start > 0 && (jsx("div", { style: { height: Math.floor(visibleRange.start / 6) * 48 } })), Array.from(grouped.entries()).map(([category, entries]) => (jsxs("div", { children: [!activeCategory && !(activeCategory === null || activeCategory === void 0 ? void 0 : activeCategory.startsWith('__')) && (jsx("div", { className: "ntd-picker-category-label", children: category })), jsx("div", { className: "ntd-picker-grid", children: entries.map((entry) => {
400
+ ? t('iconPicker.noRecentIcons', 'No recent icons.')
401
+ : t('iconPicker.noIconsFound', 'No icons found')] })) : (jsxs(Fragment, { children: [virtualized && visibleRange.start > 0 && (jsx("div", { style: { height: Math.floor(visibleRange.start / 6) * 48 } })), Array.from(grouped.entries()).map(([category, entries]) => (jsxs("div", { children: [!activeCategory && !(activeCategory === null || activeCategory === void 0 ? void 0 : activeCategory.startsWith('__')) && (jsx("div", { className: "ntd-picker-category-label", children: category })), jsx("div", { className: "ntd-picker-grid", children: entries.map((entry) => {
398
402
  const isSelected = selectedValues.includes(entry.name);
399
403
  const isFavorite = favorites.includes(entry.name);
400
- return (jsxs("button", { type: "button", className: `ntd-picker-cell${isSelected ? ' ntd-picker-cell--selected' : ''}${multiSelect ? ' ntd-picker-cell--multi-select' : ''}${enableDragAndDrop ? ' ntd-picker-cell--draggable' : ''}`, onClick: () => handleSelect(entry), "data-name": readableName(entry.name), role: "option", "aria-selected": isSelected, title: readableName(entry.name), draggable: enableDragAndDrop, onDragStart: enableDragAndDrop ? (e) => handleDragStart(entry, e) : undefined, onDragEnd: enableDragAndDrop ? (e) => handleDragEnd(entry, e) : undefined, children: [jsx(entry.Component, { size: gridIconSize, variant: variant }), multiSelect && isSelected && (jsx("span", { className: "ntd-picker-cell-check", children: jsx(CheckIcon, {}) })), showFavorites && (jsx("button", { type: "button", className: `ntd-picker-cell-fav${isFavorite ? ' ntd-picker-cell-fav--active' : ''}`, onClick: (e) => handleFavoriteClick(e, entry.name), title: isFavorite ? 'Remove from favorites' : 'Add to favorites', children: jsx(StarIcon, { filled: isFavorite }) }))] }, entry.name));
401
- }) })] }, category))), virtualized && visibleRange.end < filtered.length && (jsx("div", { style: { height: Math.ceil((filtered.length - visibleRange.end) / 6) * 48 } }))] })) }), jsxs("div", { className: "ntd-picker-footer", children: [jsxs("span", { className: "ntd-picker-count", children: [filtered.length, " icon", filtered.length !== 1 ? 's' : '', multiSelect && selectedValues.length > 0 && (jsxs(Fragment, { children: [" \u2022 ", selectedValues.length, " selected"] })), maxSelections && multiSelect && jsxs(Fragment, { children: [" (max ", maxSelections, ")"] })] }), clearable && selectedValues.length > 0 && (jsxs("button", { type: "button", className: "ntd-picker-clear", onClick: handleClear, children: ["Clear", multiSelect ? ' all' : ' selection'] })), multiSelect && (jsx("button", { type: "button", className: "ntd-picker-done", onClick: () => setIsOpen(false), children: "Done" }))] })] }))] }));
404
+ return (jsxs("button", { type: "button", className: `ntd-picker-cell${isSelected ? ' ntd-picker-cell--selected' : ''}${multiSelect ? ' ntd-picker-cell--multi-select' : ''}${enableDragAndDrop ? ' ntd-picker-cell--draggable' : ''}`, onClick: () => handleSelect(entry), "data-name": readableName(entry.name), role: "option", "aria-selected": isSelected, title: readableName(entry.name), draggable: enableDragAndDrop, onDragStart: enableDragAndDrop ? (e) => handleDragStart(entry, e) : undefined, onDragEnd: enableDragAndDrop ? (e) => handleDragEnd(entry, e) : undefined, children: [jsx(entry.Component, { size: gridIconSize, variant: variant }), multiSelect && isSelected && (jsx("span", { className: "ntd-picker-cell-check", children: jsx(CheckIcon, {}) })), showFavorites && (jsx("button", { type: "button", className: `ntd-picker-cell-fav${isFavorite ? ' ntd-picker-cell-fav--active' : ''}`, onClick: (e) => handleFavoriteClick(e, entry.name), title: isFavorite
405
+ ? t('iconPicker.removeFromFavorites', 'Remove from favorites')
406
+ : t('iconPicker.addToFavorites', 'Add to favorites'), children: jsx(StarIcon, { filled: isFavorite }) }))] }, entry.name));
407
+ }) })] }, category))), virtualized && visibleRange.end < filtered.length && (jsx("div", { style: { height: Math.ceil((filtered.length - visibleRange.end) / 6) * 48 } }))] })) }), jsxs("div", { className: "ntd-picker-footer", children: [jsxs("span", { className: "ntd-picker-count", children: [(filtered.length === 1
408
+ ? t('iconPicker.iconCountOne', '{count} icon')
409
+ : t('iconPicker.iconCountMany', '{count} icons')).replace('{count}', String(filtered.length)), multiSelect && selectedValues.length > 0 && (jsxs(Fragment, { children: [' ', t('iconPicker.selected', '• {selectedValues} selected').replace('{selectedValues}', String(selectedValues.length))] })), maxSelections && multiSelect && (jsxs(Fragment, { children: [' ', t('iconPicker.max', '(max {maxSelections})').replace('{maxSelections}', String(maxSelections))] }))] }), clearable && selectedValues.length > 0 && (jsx("button", { type: "button", className: "ntd-picker-clear", onClick: handleClear, children: multiSelect
410
+ ? t('iconPicker.clearAll', 'Clear all')
411
+ : t('iconPicker.clearSelection', 'Clear selection') })), multiSelect && (jsx("button", { type: "button", className: "ntd-picker-done", onClick: () => setIsOpen(false), children: t('iconPicker.done', 'Done') }))] })] }))] }));
402
412
  });
403
413
 
404
414
  export { NiceIconPicker };