@nice2dev/icons 1.3.9 → 1.3.11

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 (40) hide show
  1. package/CHANGELOG.md +57 -0
  2. package/dist/cjs/NiceIconPicker.js +42 -21
  3. package/dist/cjs/NiceIconValue.js +44 -0
  4. package/dist/cjs/client.js +6 -1
  5. package/dist/cjs/iconHtml.js +0 -18
  6. package/dist/cjs/iconStack.js +3 -1
  7. package/dist/cjs/iconValue.js +473 -0
  8. package/dist/cjs/icons/actions.js +39 -8
  9. package/dist/cjs/icons/files.js +23 -2
  10. package/dist/cjs/icons/fintech.js +12 -5
  11. package/dist/cjs/icons/index.js +1 -0
  12. package/dist/cjs/icons/media.js +7 -4
  13. package/dist/cjs/icons/realestate.js +8 -7
  14. package/dist/cjs/icons/shapes.js +55 -4
  15. package/dist/cjs/index.js +7 -1
  16. package/dist/cjs/nicetodev-icons.css +1 -1
  17. package/dist/esm/NiceIconPicker.js +43 -22
  18. package/dist/esm/NiceIconValue.js +41 -0
  19. package/dist/esm/client.js +3 -1
  20. package/dist/esm/iconHtml.js +1 -18
  21. package/dist/esm/iconStack.js +3 -1
  22. package/dist/esm/iconValue.js +470 -0
  23. package/dist/esm/icons/actions.js +39 -9
  24. package/dist/esm/icons/files.js +23 -2
  25. package/dist/esm/icons/fintech.js +12 -5
  26. package/dist/esm/icons/index.js +1 -1
  27. package/dist/esm/icons/media.js +8 -5
  28. package/dist/esm/icons/realestate.js +8 -7
  29. package/dist/esm/icons/shapes.js +55 -4
  30. package/dist/esm/index.js +4 -2
  31. package/dist/esm/nicetodev-icons.css +1 -1
  32. package/dist/types/NiceIconPicker.d.ts +22 -16
  33. package/dist/types/NiceIconValue.d.ts +40 -0
  34. package/dist/types/client.d.ts +6 -2
  35. package/dist/types/iconHtml.d.ts +1 -23
  36. package/dist/types/iconValue.d.ts +22 -0
  37. package/dist/types/icons/actions.d.ts +1 -0
  38. package/dist/types/icons/index.d.ts +1 -1
  39. package/dist/types/index.d.ts +6 -2
  40. package/package.json +2 -2
@@ -265,13 +265,16 @@ const NtdWifi = /* @__PURE__ */ createIcon.createIcon({
265
265
  vivid: ({ primaryColor, secondaryColor, strokeWidth }) => wifiFilled(primaryColor, secondaryColor, strokeWidth),
266
266
  },
267
267
  });
268
+ // NtdBluetooth, round 40: the rune 1.5 × the stroke width in every variant but `outline` (vivid had
269
+ // a fixed 2.2), scaled to 10/11 about the centre so the heavier tips stay in the box in `sharp`.
270
+ const BLUETOOTH = 'M7 7l10 10-5 5V2l5 5-10 10';
268
271
  const NtdBluetooth = /* @__PURE__ */ createIcon.createIcon({
269
272
  displayName: 'NtdBluetooth',
270
273
  paths: {
271
- solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M6.5 6.5l11 11L12 23V1l5.5 5.5-11 11", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })),
272
- outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: "M6.5 6.5l11 11L12 23V1l5.5 5.5-11 11", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })),
273
- duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M12 1l5.5 5.5L12 12l5.5 5.5L12 23V1z", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: "M6.5 6.5l11 11L12 23V1l5.5 5.5-11 11", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
274
- vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("path", { d: "M6.5 6.5l11 11L12 23V1l5.5 5.5-11 11", stroke: primaryColor, strokeWidth: "2.2", fill: "none" }) })),
274
+ solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: BLUETOOTH, stroke: primaryColor, strokeWidth: strokeWidth * 1.5, fill: "none" })),
275
+ outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: BLUETOOTH, stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })),
276
+ duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: "M12 2l5 5-5 5 5 5-5 5z", fill: secondaryColor, opacity: secondaryOpacity }), jsxRuntime.jsx("path", { d: BLUETOOTH, stroke: primaryColor, strokeWidth: strokeWidth * 1.5, fill: "none" })] })),
277
+ vivid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsx("path", { d: BLUETOOTH, stroke: primaryColor, strokeWidth: strokeWidth * 1.5, fill: "none" })),
275
278
  },
276
279
  });
277
280
  // ── Relocated from brand packs ──
@@ -19,15 +19,16 @@ const NtdHouse = /* @__PURE__ */ createIcon.createIcon({
19
19
  // NtdApartment: filled, the windows and the door are drawn as in the outline — frames — in the
20
20
  // accent colour (they were 50% white patches), the door kept inside the building. Duotone is fills
21
21
  // only: the building primary, the windows and the door secondary; vivid puts the door in the
22
- // accent colour.
23
- const APARTMENT = { x: 4, y: 4, width: 16, height: 18, rx: 2 };
22
+ // accent colour. Round 40: the building 15 wide (was 16) and the door 3.5 (was 4), the windows
23
+ // moved in to keep their margins.
24
+ const APARTMENT = { x: 4.5, y: 4, width: 15, height: 18, rx: 2 };
24
25
  const APARTMENT_WINDOWS = [
25
- { x: 7, y: 7 },
26
- { x: 14, y: 7 },
27
- { x: 7, y: 13 },
28
- { x: 14, y: 13 },
26
+ { x: 7.25, y: 7 },
27
+ { x: 13.75, y: 7 },
28
+ { x: 7.25, y: 13 },
29
+ { x: 13.75, y: 13 },
29
30
  ];
30
- const APARTMENT_DOOR = { x: 10, y: 18, width: 4, height: 4 };
31
+ const APARTMENT_DOOR = { x: 10.25, y: 18, width: 3.5, height: 4 };
31
32
  /** The door of the solid variants: it stops short of the ground, leaving a thin primary sill. */
32
33
  const APARTMENT_DOOR_SILL = { ...APARTMENT_DOOR, height: 3.25 };
33
34
  const NtdApartment = /* @__PURE__ */ createIcon.createIcon({
@@ -257,13 +257,64 @@ const NtdRepeat = /* @__PURE__ */ createIcon.createIcon({
257
257
  vivid: ({ primaryColor, secondaryColor, strokeWidth }) => repeatArrows(primaryColor, secondaryColor, strokeWidth),
258
258
  },
259
259
  });
260
+ // NtdShuffle, round 40: two S-curves (they were straight diagonals), a line glyph twice the stroke
261
+ // width in every variant but `outline`, with NtdRepeat's heads and shafts stopping short of the
262
+ // points. The arrow running down breaks where it passes under the other, its ends half a line width
263
+ // clear of it even with the square caps of `sharp` — worked out from the width, so the gap holds at
264
+ // any weight. Duotone and vivid: the arrow on top primary, the one under it secondary.
265
+ const SHUFFLE_HEADS = ['M18 3l3 3-3 3', 'M18 15l3 3-3 3'];
266
+ /** The curve of the arrow running down; the one on top is its mirror image. */
267
+ const SHUFFLE_UNDER = [
268
+ [5, 6],
269
+ [11, 6],
270
+ [11, 18],
271
+ [17, 18],
272
+ ];
273
+ /** Where the curves cross — also the centre the under curve is symmetric about. */
274
+ const SHUFFLE_CROSS = [11, 12];
275
+ const shufflePoint = (p) => `${+p[0].toFixed(2)} ${+p[1].toFixed(2)}`;
276
+ function shuffleArrows(over, under, width) {
277
+ const back = 21 - width * 0.35;
278
+ const [p0, p1, p2, p3] = SHUFFLE_UNDER;
279
+ const lerp = (a, b, t) => a.map((v, i) => v + (b[i] - v) * t);
280
+ /** de Casteljau: the controls and the end of the curve's part up to `t`. */
281
+ const at = (t) => {
282
+ const a = lerp(p0, p1, t);
283
+ const b = lerp(p1, p2, t);
284
+ const d = lerp(a, b, t);
285
+ return [a, d, lerp(d, lerp(b, lerp(p2, p3, t), t), t)];
286
+ };
287
+ // How far from the crossing a square-capped end stops. The curves cross at 53° (sin 0.8,
288
+ // cos 0.6); the cap's corner must stay half the other line plus a gap away — half a width, at
289
+ // most 1, or heavy lines would cut the whole curve — plus the half width the cap reaches past the
290
+ // end.
291
+ const gap = Math.min(width * 0.5, 1);
292
+ const clear = (width * 0.5 + gap + width * 0.5 * 0.6) / 0.8 + width * 0.5;
293
+ let lo = 0;
294
+ let hi = 0.5;
295
+ for (let i = 0; i < 24; i += 1) {
296
+ const mid = (lo + hi) / 2;
297
+ const end = at(mid)[2];
298
+ if (Math.hypot(end[0] - SHUFFLE_CROSS[0], end[1] - SHUFFLE_CROSS[1]) > clear) {
299
+ lo = mid;
300
+ }
301
+ else {
302
+ hi = mid;
303
+ }
304
+ }
305
+ const [c1, c2, end] = at(lo);
306
+ const turn = (p) => p.map((v, i) => 2 * SHUFFLE_CROSS[i] - v);
307
+ const underPath = `M3 6H5C${shufflePoint(c1)} ${shufflePoint(c2)} ${shufflePoint(end)}` +
308
+ `M${shufflePoint(turn(end))}C${shufflePoint(turn(c2))} ${shufflePoint(turn(c1))} 17 18H${back}`;
309
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { d: `${SHUFFLE_HEADS[1]}${underPath}`, stroke: under, strokeWidth: width, fill: "none" }), jsxRuntime.jsx("path", { d: `${SHUFFLE_HEADS[0]}M3 18H5C11 18 11 6 17 6H${back}`, stroke: over, strokeWidth: width, fill: "none" })] }));
310
+ }
260
311
  const NtdShuffle = /* @__PURE__ */ createIcon.createIcon({
261
312
  displayName: 'NtdShuffle',
262
313
  paths: {
263
- solid: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("polyline", { points: "16,3 21,3 21,8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("line", { x1: "4", y1: "20", x2: "21", y2: "3", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("polyline", { points: "21,16 21,21 16,21", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("line", { x1: "15", y1: "15", x2: "21", y2: "21", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("line", { x1: "4", y1: "4", x2: "9", y2: "9", stroke: primaryColor, strokeWidth: strokeWidth })] })),
264
- outline: ({ primaryColor, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("polyline", { points: "16,3 21,3 21,8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("line", { x1: "4", y1: "20", x2: "21", y2: "3", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("polyline", { points: "21,16 21,21 16,21", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("line", { x1: "15", y1: "15", x2: "21", y2: "21", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("line", { x1: "4", y1: "4", x2: "9", y2: "9", stroke: primaryColor, strokeWidth: strokeWidth })] })),
265
- duotone: ({ primaryColor, secondaryColor, secondaryOpacity, strokeWidth }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("line", { x1: "4", y1: "20", x2: "21", y2: "3", stroke: secondaryColor, strokeWidth: strokeWidth, opacity: secondaryOpacity + 0.2 }), jsxRuntime.jsx("polyline", { points: "16,3 21,3 21,8", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("polyline", { points: "21,16 21,21 16,21", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsxRuntime.jsx("line", { x1: "15", y1: "15", x2: "21", y2: "21", stroke: primaryColor, strokeWidth: strokeWidth }), jsxRuntime.jsx("line", { x1: "4", y1: "4", x2: "9", y2: "9", stroke: primaryColor, strokeWidth: strokeWidth })] })),
266
- 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" })] })),
314
+ solid: ({ primaryColor, strokeWidth }) => shuffleArrows(primaryColor, primaryColor, strokeWidth * 2),
315
+ outline: ({ primaryColor, strokeWidth }) => shuffleArrows(primaryColor, primaryColor, strokeWidth),
316
+ duotone: ({ primaryColor, secondaryColor, strokeWidth }) => shuffleArrows(primaryColor, secondaryColor, strokeWidth * 2),
317
+ vivid: ({ primaryColor, secondaryColor, strokeWidth }) => shuffleArrows(primaryColor, secondaryColor, strokeWidth * 2),
267
318
  },
268
319
  });
269
320
  // Geometry construction tools (1.2.2: NiceGeometry drew these as the glyphs • — ⊥ ∥ ⊙ ∠).
package/dist/cjs/index.js CHANGED
@@ -4,6 +4,8 @@ var types = require('./types.js');
4
4
  var createIcon = require('./createIcon.js');
5
5
  var smilAnimations = require('./smilAnimations.js');
6
6
  var NiceIconPicker = require('./NiceIconPicker.js');
7
+ var NiceIconValue = require('./NiceIconValue.js');
8
+ var iconValue = require('./iconValue.js');
7
9
  var iconHtml = require('./iconHtml.js');
8
10
  var NiceIconStacker = require('./NiceIconStacker.js');
9
11
  var iconStack = require('./iconStack.js');
@@ -71,7 +73,10 @@ exports.createSmilAnimationDef = smilAnimations.createSmilAnimationDef;
71
73
  exports.generateSmilAnimation = smilAnimations.generateSmilAnimation;
72
74
  exports.isSmilSupported = smilAnimations.isSmilSupported;
73
75
  exports.NiceIconPicker = NiceIconPicker.NiceIconPicker;
74
- exports.NiceIconHtml = iconHtml.NiceIconHtml;
76
+ exports.NiceIconHtml = NiceIconValue.NiceIconHtml;
77
+ exports.NiceIconValue = NiceIconValue.NiceIconValue;
78
+ exports.formatIconValue = iconValue.formatIconValue;
79
+ exports.parseIconValue = iconValue.parseIconValue;
75
80
  exports.parseIconHtml = iconHtml.parseIconHtml;
76
81
  exports.NiceIconStacker = NiceIconStacker.NiceIconStacker;
77
82
  exports.NiceIconStack = iconStack.NiceIconStack;
@@ -121,6 +126,7 @@ exports.NtdDownload = actions.NtdDownload;
121
126
  exports.NtdEdit = actions.NtdEdit;
122
127
  exports.NtdEditDetail = actions.NtdEditDetail;
123
128
  exports.NtdFilter = actions.NtdFilter;
129
+ exports.NtdFrameCorners = actions.NtdFrameCorners;
124
130
  exports.NtdGroup = actions.NtdGroup;
125
131
  exports.NtdLink = actions.NtdLink;
126
132
  exports.NtdLock = actions.NtdLock;
@@ -1 +1 @@
1
- .nice-desktop-icon-exporter{color:var(--nice-text-primary,inherit);display:grid;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-4,16px);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));min-width:0}.nice-desktop-icon-exporter :where(h3,h4){font-weight:var(--nice-font-weight-semibold,600);margin:0 0 var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(h3){font-size:var(--nice-font-size-md,.875rem)}.nice-desktop-icon-exporter :where(h4){color:var(--nice-text-secondary,#64748b);font-size:var(--nice-font-size-xs,.75rem)}.nice-desktop-icon-exporter :where(button){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);color:var(--nice-text-primary,inherit);cursor:pointer;font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-3,12px)}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary,#f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){cursor:not-allowed;opacity:.5}.nice-desktop-icon-exporter :where(input[type=text]){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;color:var(--nice-text-primary,inherit);font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__results{background:var(--nice-bg-elevated,var(--nice-bg-primary,#fff));border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);min-width:0;padding:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-grid{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-item{align-items:center;color:var(--nice-text-muted,#94a3b8);display:flex;flex-direction:column;font-size:var(--nice-font-size-xs,.75rem);font-variant-numeric:tabular-nums;gap:var(--nice-space-1,4px)}.nice-desktop-icon-exporter__preview-box{align-items:center;border-radius:var(--nice-radius-sm,4px);display:flex;justify-content:center}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5,10px)}.nice-desktop-icon-exporter__config>label{align-items:center;color:var(--nice-text-secondary,#64748b);display:flex;flex-wrap:wrap;font-weight:var(--nice-font-weight-medium,500);gap:var(--nice-space-2,8px)}.nice-desktop-icon-exporter__config>label>input[type=range],.nice-desktop-icon-exporter__config>label>input[type=text]{flex:1 1 140px;min-width:0}.nice-desktop-icon-exporter__platforms,.nice-desktop-icon-exporter__sizes{display:flex;flex-wrap:wrap;gap:var(--nice-space-1-5,6px) var(--nice-space-4,16px)}.nice-desktop-icon-exporter__sizes>h4{flex-basis:100%;margin:0}.nice-desktop-icon-exporter__platforms label,.nice-desktop-icon-exporter__sizes label{align-items:center;cursor:pointer;display:inline-flex;gap:var(--nice-space-1-5,6px)}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;gap:var(--nice-space-2,8px);grid-column:1/-1}.nice-desktop-icon-exporter__actions>button:first-child{background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-text-on-primary,#fff);font-weight:var(--nice-font-weight-medium,500)}.nice-desktop-icon-exporter__results{grid-column:1/-1}.nice-desktop-icon-exporter__results-grid{display:grid;gap:var(--nice-space-2,8px);grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.nice-desktop-icon-exporter__result-item{align-items:center;border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:flex;flex-direction:column;gap:var(--nice-space-1,4px);padding:var(--nice-space-2,8px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-height:64px;max-width:64px}.nice-desktop-icon-exporter__result-item>span{color:var(--nice-text-secondary,#64748b);font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xxs,.625rem);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ntd-icon{display:inline-block;flex-shrink:0;transition:color .2s ease,transform .2s ease;vertical-align:-.125em}.ntd-anim-spin{animation:ntd-spin 1s linear infinite}.ntd-anim-spin-reverse{animation:ntd-spin 1s linear infinite reverse}@keyframes ntd-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ntd-anim-pulse{animation:ntd-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce 1s ease infinite}@keyframes ntd-bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(0)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(-25%)}}.ntd-anim-shake{animation:ntd-shake .6s ease-in-out infinite}@keyframes ntd-shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-2px)}20%,40%,60%,80%{transform:translateX(2px)}}.ntd-anim-float{animation:ntd-float 3s ease-in-out infinite}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip 1.2s ease-in-out infinite}@keyframes ntd-flip{0%{transform:perspective(400px) rotateY(0)}40%{transform:perspective(400px) rotateY(170deg)}50%{transform:perspective(400px) rotateY(190deg)}80%{transform:perspective(400px) rotateY(1turn)}to{transform:perspective(400px) rotateY(1turn)}}.ntd-anim-turn{animation:ntd-turn var(--ntd-anim-duration,4s) infinite}@keyframes ntd-turn{0%{animation-timing-function:cubic-bezier(.65,0,.35,1);transform:rotate(0deg)}12.5%,50%{animation-timing-function:cubic-bezier(.65,0,.35,1);transform:rotate(180deg)}62.5%,to{transform:rotate(0deg)}}.ntd-anim-turn .ntd-hourglass-sand{animation-duration:var(--ntd-anim-duration,4s);animation-iteration-count:infinite;animation-timing-function:linear;transform-box:view-box}.ntd-anim-turn .ntd-hourglass-sand--top-neck{animation-name:ntd-hourglass-top-neck;transform-origin:12px 11.4px}.ntd-anim-turn .ntd-hourglass-sand--top-base{animation-name:ntd-hourglass-top-base;transform-origin:12px 5.8px}.ntd-anim-turn .ntd-hourglass-sand--bottom-neck{animation-name:ntd-hourglass-bottom-neck;transform-origin:12px 12.6px}.ntd-anim-turn .ntd-hourglass-sand--bottom-base{animation-name:ntd-hourglass-bottom-base;transform-origin:12px 18.2px}.ntd-anim-turn .ntd-hourglass-sand--stream-up{animation-name:ntd-hourglass-stream-up}.ntd-anim-turn .ntd-hourglass-sand--stream-down{animation-name:ntd-hourglass-stream-down}@keyframes ntd-hourglass-top-base{0%,12.5%{transform:scaleY(0)}50%,62.5%{transform:scaleY(1)}62.6%,to{transform:scaleY(0)}}@keyframes ntd-hourglass-top-neck{0%,50%{transform:scale(0)}50.1%,62.5%{transform:scale(1)}to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-neck{0%,12.5%{transform:scale(1)}50%,to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-base{0%,62.5%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes ntd-hourglass-stream-up{0%,13%,49.5%,to{opacity:0}14%,48.5%{opacity:1}}@keyframes ntd-hourglass-stream-down{0%,63%,99.5%,to{opacity:0}64%,98.5%{opacity:1}}.ntd-anim-glow{animation:ntd-glow 2s ease-in-out infinite}@keyframes ntd-glow{0%,to{filter:drop-shadow(0 0 2px currentColor)}50%{filter:drop-shadow(0 0 12px currentColor) drop-shadow(0 0 20px currentColor)}}.ntd-anim-wiggle{animation:ntd-wiggle 1s ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber 1s ease-in-out infinite}@keyframes ntd-rubber{0%{transform:scale(1)}30%{transform:scaleX(1.25) scaleY(.75)}40%{transform:scaleX(.75) scaleY(1.25)}50%{transform:scaleX(1.15) scaleY(.85)}65%{transform:scaleX(.95) scaleY(1.05)}75%{transform:scaleX(1.05) scaleY(.95)}to{transform:scale(1)}}.ntd-anim-swing{animation:ntd-swing 1s ease-in-out infinite;transform-origin:top center}@keyframes ntd-swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0deg)}}.ntd-anim-tada{animation:ntd-tada 1.2s ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0deg)}10%,20%{transform:scale(.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}to{transform:scale(1) rotate(0deg)}}.ntd-anim-heartbeat{animation:ntd-heartbeat 1.2s ease-in-out infinite}@keyframes ntd-heartbeat{0%{transform:scale(1)}14%{transform:scale(1.3)}28%{transform:scale(1)}42%{transform:scale(1.3)}70%{transform:scale(1)}}.ntd-anim-fade-in{animation:ntd-fade-in .5s ease-out forwards}@keyframes ntd-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ntd-anim-slide-up{animation:ntd-slide-up .4s ease-out forwards}@keyframes ntd-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-jello{animation:ntd-jello 1s ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skewX(0deg) skewY(0deg)}11.1%{transform:skewX(-12.5deg) skewY(-12.5deg)}22.2%{transform:skewX(6.25deg) skewY(6.25deg)}33.3%{transform:skewX(-3.125deg) skewY(-3.125deg)}44.4%{transform:skewX(1.5625deg) skewY(1.5625deg)}55.5%{transform:skewX(-.78125deg) skewY(-.78125deg)}66.6%{transform:skewX(.390625deg) skewY(.390625deg)}77.7%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop .6s ease-out infinite}@keyframes ntd-pop{0%{transform:scale(1)}15%{transform:scale(1.35)}30%{transform:scale(.9)}45%{transform:scale(1.1)}60%{transform:scale(.97)}75%{transform:scale(1.03)}to{transform:scale(1)}}.ntd-anim-squeeze{animation:ntd-squeeze 1.4s ease-in-out infinite}@keyframes ntd-squeeze{0%,to{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(.7) scaleY(1.3)}50%{transform:scaleX(1) scaleY(1)}75%{transform:scaleX(1.3) scaleY(.7)}}.ntd-anim-drop{animation:ntd-drop .8s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-drop{0%{opacity:0;transform:translateY(-40px) scale(.8)}60%{opacity:1;transform:translateY(4px) scale(1.05)}75%{transform:translateY(-2px) scale(.98)}90%{transform:translateY(1px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-rise{animation:ntd-rise .7s cubic-bezier(.16,1,.3,1) forwards}@keyframes ntd-rise{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-slide-left{animation:ntd-slide-left .5s ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-right{animation:ntd-slide-right .5s ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-down{animation:ntd-slide-down .4s ease-out forwards}@keyframes ntd-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-roll-in{animation:ntd-roll-in .8s ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0deg)}}.ntd-anim-flash{animation:ntd-flash 1s ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate .3s linear infinite}@keyframes ntd-vibrate{0%{transform:translate(0)}20%{transform:translate(-1px,1px)}40%{transform:translate(1px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}to{transform:translate(0)}}.ntd-anim-wobble{animation:ntd-wobble 1.2s ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-15%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-10%) rotate(-3deg)}60%{transform:translateX(5%) rotate(2deg)}75%{transform:translateX(-3%) rotate(-1deg)}to{transform:translateX(0) rotate(0deg)}}.ntd-anim-spiral{animation:ntd-spiral 2s linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0deg) scale(.8)}25%{transform:rotate(90deg) scale(1.1)}50%{transform:rotate(180deg) scale(.8)}75%{transform:rotate(270deg) scale(1.1)}to{transform:rotate(1turn) scale(.8)}}.ntd-anim-ping{animation:ntd-ping 1.5s ease-out infinite}@keyframes ntd-ping{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(1.6)}71%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}.ntd-anim-flicker{animation:ntd-flicker 1.5s steps(1) infinite}@keyframes ntd-flicker{0%{opacity:1}4%{opacity:.3}8%{opacity:1}12%{opacity:.6}16%{opacity:1}20%{opacity:.2}22%{opacity:1}50%{opacity:1}52%{opacity:.4}54%{opacity:1}80%{opacity:1}82%{opacity:.3}85%{opacity:1}90%{opacity:.5}92%{opacity:1}}.ntd-anim-tilt{animation:ntd-tilt 2s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0deg)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe 4s ease-in-out infinite}@keyframes ntd-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.ntd-anim-drift{animation:ntd-drift 4s ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(5px) rotate(1deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit 3s linear infinite}@keyframes ntd-orbit{0%{transform:translate(0)}25%{transform:translate(4px,-4px)}50%{transform:translateY(-6px)}75%{transform:translate(-4px,-4px)}to{transform:translate(0)}}.ntd-anim-crush{animation:ntd-crush .8s ease-in-out infinite}@keyframes ntd-crush{0%,to{transform:scaleY(1) scaleX(1)}40%{transform:scaleY(.3) scaleX(1.3)}60%{transform:scaleY(1.15) scaleX(.9)}80%{transform:scaleY(.95) scaleX(1.02)}}.ntd-anim-stretch{animation:ntd-stretch 1s ease-in-out infinite}@keyframes ntd-stretch{0%,to{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(1.4) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}}.ntd-anim-dissolve{animation:ntd-dissolve 2s ease-in-out infinite}@keyframes ntd-dissolve{0%,to{filter:blur(0);opacity:1}50%{filter:blur(4px);opacity:.1}}.ntd-anim-materialize{animation:ntd-materialize .8s ease-out forwards}@keyframes ntd-materialize{0%{filter:blur(8px);opacity:0;transform:scale(.6)}60%{filter:blur(1px);opacity:.8;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway 2.5s ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble .15s linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0deg)}25%{transform:translate(-.5px,.5px) rotate(-.5deg)}50%{transform:translate(.5px,-.5px) rotate(.5deg)}75%{transform:translate(-.5px,-.5px) rotate(-.5deg)}to{transform:translate(0) rotate(0deg)}}.ntd-anim-rock{animation:ntd-rock 1.5s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0deg)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap 1.5s ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0deg)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp 2s ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0deg) rotateY(0deg)}25%{transform:perspective(300px) rotateX(10deg) rotateY(10deg)}50%{transform:perspective(300px) rotateX(-5deg) rotateY(-10deg)}75%{transform:perspective(300px) rotateX(8deg) rotateY(-5deg)}}.ntd-anim-glitch{animation:ntd-glitch .8s steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skewX(2deg)}10%{transform:translate(3px,-1px) skewX(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skewX(-3deg)}44%{transform:translate(-2px,-2px) skewX(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skewX(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse 1.5s ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple 1.6s ease-out infinite}@keyframes ntd-ripple{0%{opacity:1;transform:scale(1)}30%{opacity:.8;transform:scale(1.15)}50%{opacity:1;transform:scale(1)}70%{opacity:.9;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.ntd-anim-implode{animation:ntd-implode 1.2s ease-in-out infinite}@keyframes ntd-implode{0%,to{opacity:1;transform:scale(1)}40%{opacity:.3;transform:scale(.2) rotate(20deg)}60%{opacity:.2;transform:scale(.15) rotate(25deg)}80%{opacity:1;transform:scale(1.1) rotate(0deg)}}.ntd-anim-explode{animation:ntd-explode 1.4s ease-in-out infinite}@keyframes ntd-explode{0%,to{opacity:1;transform:scale(1)}30%{opacity:.6;transform:scale(1.8)}50%{opacity:0;transform:scale(2)}51%{opacity:0;transform:scale(.5)}70%{opacity:.8;transform:scale(1.1)}85%{opacity:1;transform:scale(.95)}}.ntd-anim-rotate-x{animation:ntd-rotate-x 1.5s ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0deg)}to{transform:perspective(400px) rotateX(1turn)}}.ntd-anim-morph{animation:ntd-morph 3s ease-in-out infinite}@keyframes ntd-morph{0%,to{border-radius:0;transform:scaleX(1) scaleY(1) rotate(0deg)}20%{transform:scaleX(1.1) scaleY(.9) rotate(2deg)}40%{transform:scaleX(.9) scaleY(1.1) rotate(-1deg)}60%{transform:scaleX(1.05) scaleY(.95) rotate(1deg)}80%{transform:scaleX(.95) scaleY(1.05) rotate(-2deg)}}.ntd-anim-levitate{animation:ntd-levitate 3s ease-in-out infinite}@keyframes ntd-levitate{0%,to{filter:drop-shadow(0 2px 2px rgba(0,0,0,.2));transform:translateY(0)}50%{filter:drop-shadow(0 12px 8px rgba(0,0,0,.1));transform:translateY(-10px)}}.ntd-anim-dash{animation:ntd-dash .8s ease-in-out infinite}@keyframes ntd-dash{0%,to{opacity:1;transform:translateX(0) scaleX(1)}30%{opacity:.8;transform:translateX(-3px) scaleX(.9)}60%{opacity:.6;transform:translateX(15px) scaleX(1.15)}80%{opacity:.9;transform:translateX(2px) scaleX(1)}}.ntd-anim-twist{animation:ntd-twist 1.5s ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0deg) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0deg) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp 1s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-stomp{0%,to{transform:translateY(0) scaleY(1) scaleX(1)}20%{transform:translateY(-15px) scaleY(1.1) scaleX(.95)}50%{transform:translateY(0) scaleY(.7) scaleX(1.2)}65%{transform:translateY(-3px) scaleY(1.05) scaleX(.98)}80%{transform:translateY(0) scaleY(.95) scaleX(1.03)}}.ntd-anim-flap{animation:ntd-flap .6s ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0deg) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate 2s ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(8px) rotate(2deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink 1.4s steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal 1s ease-out forwards}@keyframes ntd-reveal{0%{clip-path:circle(0 at 50% 50%);opacity:.5}to{clip-path:circle(75% at 50% 50%);opacity:1}}.ntd-anim-vortex{animation:ntd-vortex .8s ease-out forwards}@keyframes ntd-vortex{0%{opacity:0;transform:rotate(-540deg) scale(0)}60%{opacity:1;transform:rotate(20deg) scale(1.1)}80%{transform:rotate(-10deg) scale(.95)}to{opacity:1;transform:rotate(0deg) scale(1)}}.ntd-anim-meteor{animation:ntd-meteor .7s ease-out forwards}@keyframes ntd-meteor{0%{opacity:0;transform:translate(30px,-30px) rotate(15deg) scale(.5)}70%{opacity:1;transform:translate(-2px,2px) rotate(-2deg) scale(1.05)}to{opacity:1;transform:translate(0) rotate(0deg) scale(1)}}.ntd-anim-scale-in{animation:ntd-scale-in .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.ntd-anim-scale-out{animation:ntd-scale-out .4s ease-in forwards}@keyframes ntd-scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ntd-anim-pendulum{animation:ntd-pendulum 2s ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0deg)}25%{transform:rotate(25deg)}50%{transform:rotate(0deg)}75%{transform:rotate(-25deg)}to{transform:rotate(0deg)}}.ntd-anim-surge{animation:ntd-surge 1.5s ease-in-out infinite}@keyframes ntd-surge{0%,to{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}15%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);transform:scale(1.2)}30%{filter:drop-shadow(0 0 2px currentColor);transform:scale(.95)}45%{filter:drop-shadow(0 0 6px currentColor);transform:scale(1.1)}60%{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}}.ntd-anim-radar{animation:ntd-radar 2s linear infinite}@keyframes ntd-radar{0%{opacity:1;transform:rotate(0deg)}50%{opacity:.4}to{opacity:1;transform:rotate(1turn)}}.ntd-anim-typewriter{animation:ntd-typewriter 1s steps(12) forwards}@keyframes ntd-typewriter{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.ntd-anim-unfold{animation:ntd-unfold .7s ease-out forwards}@keyframes ntd-unfold{0%{opacity:.3;transform:scaleY(.05) scaleX(1.3)}50%{opacity:.9;transform:scaleY(1.1) scaleX(.95)}70%{opacity:1;transform:scaleY(.95) scaleX(1.02)}to{opacity:1;transform:scaleY(1) scaleX(1)}}.ntd-anim-fold{animation:ntd-fold .6s ease-in forwards}@keyframes ntd-fold{0%{opacity:1;transform:scaleY(1) scaleX(1)}to{opacity:0;transform:scaleY(.05) scaleX(1.3)}}.ntd-anim-scatter{animation:ntd-scatter 1.5s ease-in-out infinite}@keyframes ntd-scatter{0%,to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}20%{filter:blur(2px);opacity:.6;transform:scale(1.3) rotate(5deg)}40%{filter:blur(4px);opacity:.2;transform:scale(1.5) rotate(-3deg)}50%{filter:blur(6px);opacity:0;transform:scale(.8) rotate(0deg)}65%{filter:blur(3px);opacity:.3;transform:scale(.6) rotate(-5deg)}80%{filter:blur(1px);opacity:.8;transform:scale(.95) rotate(2deg)}}.ntd-anim-assemble{animation:ntd-assemble 1s ease-out forwards}@keyframes ntd-assemble{0%{filter:blur(8px);opacity:0;transform:scale(2) rotate(15deg)}30%{filter:blur(3px);opacity:.5;transform:scale(.8) rotate(-5deg)}60%{filter:blur(1px);opacity:.9;transform:scale(1.1) rotate(2deg)}80%{filter:blur(0);opacity:1;transform:scale(.97) rotate(-1deg)}to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}}.ntd-anim-neon{animation:ntd-neon 2s ease-in-out infinite}@keyframes ntd-neon{0%,to{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}10%{filter:drop-shadow(0 0 0 currentColor);opacity:.4}11%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}15%{filter:drop-shadow(0 0 0 currentColor);opacity:.3}16%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}50%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor);opacity:1}}.ntd-anim-earthquake{animation:ntd-earthquake .5s ease-in-out infinite}@keyframes ntd-earthquake{0%,to{transform:translate(0)}10%{transform:translate(-4px,2px) rotate(-1deg)}20%{transform:translate(3px,-3px) rotate(1deg)}30%{transform:translate(-2px,4px) rotate(-2deg)}40%{transform:translate(4px,-1px) rotate(2deg)}50%{transform:translate(-3px,3px) rotate(-1deg)}60%{transform:translate(2px,-4px) rotate(1deg)}70%{transform:translate(-4px,1px) rotate(-2deg)}80%{transform:translate(3px,2px) rotate(2deg)}90%{transform:translate(-1px,-3px) rotate(-1deg)}}.ntd-anim-signature{animation:ntd-signature-enter .65s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-signature circle,.ntd-anim-signature ellipse,.ntd-anim-signature line,.ntd-anim-signature path,.ntd-anim-signature polygon,.ntd-anim-signature polyline,.ntd-anim-signature rect{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke 1.7s ease-out .05s forwards,ntd-signature-fill .55s ease-out 1.05s forwards;filter:drop-shadow(0 0 0 currentColor)}@keyframes ntd-signature-enter{0%{opacity:.08;transform:scale(.05) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(0deg)}to{opacity:1;transform:scale(1)}}@keyframes ntd-signature-stroke{0%{stroke-dashoffset:150;filter:drop-shadow(0 0 0 currentColor)}65%{stroke-dashoffset:0;filter:drop-shadow(0 0 6px currentColor)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 2px currentColor)}}@keyframes ntd-signature-fill{0%{fill-opacity:.05}to{fill-opacity:1}}.ntd-anim-draw-sequence circle,.ntd-anim-draw-sequence ellipse,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence rect{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence 1.6s ease-out forwards}.ntd-anim-draw-sequence circle:first-child,.ntd-anim-draw-sequence ellipse:first-child,.ntd-anim-draw-sequence line:first-child,.ntd-anim-draw-sequence path:first-child,.ntd-anim-draw-sequence polygon:first-child,.ntd-anim-draw-sequence polyline:first-child,.ntd-anim-draw-sequence rect:first-child{animation-delay:0s}.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3){animation-delay:.4s}@keyframes ntd-draw-sequence{0%{stroke-dashoffset:160;fill-opacity:0}75%{stroke-dashoffset:0;fill-opacity:.15}to{stroke-dashoffset:0;fill-opacity:1}}.ntd-anim-stroke-order circle,.ntd-anim-stroke-order ellipse,.ntd-anim-stroke-order line,.ntd-anim-stroke-order path,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order rect{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order 2s linear forwards}@keyframes ntd-stroke-order{0%{stroke-dashoffset:220;opacity:.2}30%{opacity:1}to{stroke-dashoffset:0;opacity:1}}.ntd-anim-glow-trace circle,.ntd-anim-glow-trace ellipse,.ntd-anim-glow-trace line,.ntd-anim-glow-trace path,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace rect{stroke-dasharray:180;animation:ntd-glow-trace 2.8s ease-in-out infinite}@keyframes ntd-glow-trace{0%{stroke-dashoffset:180;filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{stroke-dashoffset:0;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 14px currentColor);opacity:1}to{stroke-dashoffset:-180;filter:drop-shadow(0 0 2px currentColor);opacity:.5}}.ntd-anim-seal-stamp{animation:ntd-seal-stamp .75s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center}@keyframes ntd-seal-stamp{0%{filter:blur(2px);opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg)}45%{filter:blur(0);opacity:1;transform:translateY(2px) scale(.94) rotate(0deg)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw circle,.ntd-anim-draw ellipse,.ntd-anim-draw line,.ntd-anim-draw path,.ntd-anim-draw polygon,.ntd-anim-draw polyline,.ntd-anim-draw rect{stroke-dasharray:120;stroke-dashoffset:120;fill-opacity:0;animation:ntd-draw-stroke 1.2s ease-out forwards,ntd-draw-fill .4s ease-out .8s forwards}@keyframes ntd-draw-stroke{0%{stroke-dashoffset:120}to{stroke-dashoffset:0}}@keyframes ntd-draw-fill{0%{fill-opacity:0}to{fill-opacity:1}}.ntd-anim-draw-from-dot{animation:ntd-draw-dot-enter .45s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot ellipse,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot rect{stroke-dasharray:140;stroke-dashoffset:140;fill-opacity:0;animation:ntd-draw-dot-stroke 1.35s ease-out .15s forwards,ntd-draw-fill .45s ease-out .95s forwards}@keyframes ntd-draw-dot-enter{0%{opacity:.15;transform:scale(.08)}60%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes ntd-draw-dot-stroke{0%{stroke-dashoffset:140}to{stroke-dashoffset:0}}.ntd-anim-draw-loop circle,.ntd-anim-draw-loop ellipse,.ntd-anim-draw-loop line,.ntd-anim-draw-loop path,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop rect{stroke-dasharray:140;animation:ntd-draw-loop-stroke 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-stroke{0%{stroke-dashoffset:140;opacity:0}25%{stroke-dashoffset:0;opacity:1}60%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-140;opacity:.2}}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-shape-pop .7s cubic-bezier(.34,1.56,.64,1) .35s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.5s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.65s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.8s}@keyframes ntd-draw-shape-pop{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.5)}60%{fill-opacity:.9;clip-path:circle(75% at 50% 50%);transform:scale(1.08)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-dot-shape-burst .65s cubic-bezier(.34,1.56,.64,1) .25s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.4s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.55s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.7s}@keyframes ntd-draw-dot-shape-burst{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.1)}50%{fill-opacity:.85;clip-path:circle(65% at 50% 50%);transform:scale(1.14)}75%{clip-path:circle(88% at 50% 50%);transform:scale(.97)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-seq-shape-wipe .6s cubic-bezier(.22,1,.36,1) forwards;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):first-child{animation-delay:0s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.4s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.6s}@keyframes ntd-draw-seq-shape-wipe{0%{fill-opacity:0;clip-path:inset(100% 0 0 0);transform:scaleY(.6)}70%{fill-opacity:.9;clip-path:inset(5% 0 0 0);transform:scaleY(1.04)}to{fill-opacity:1;clip-path:inset(0 0 0 0);transform:scaleY(1)}}.ntd-anim-draw-loop :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-draw-loop-shape-pulse 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-shape-pulse{0%{clip-path:circle(0 at 50% 50%);opacity:0}25%{clip-path:circle(100% at 50% 50%);opacity:1}60%{clip-path:circle(100% at 50% 50%);opacity:1}to{clip-path:circle(0 at 50% 50%);opacity:.2}}.ntd-anim-signature :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-signature-shape-stamp .8s cubic-bezier(.22,1,.36,1) .5s forwards;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform-box:fill-box;transform-origin:center}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform:scale(.35) rotate(-6deg)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);filter:drop-shadow(0 0 8px currentColor);transform:scale(1.08) rotate(0deg)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);transform:scale(1)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-stroke-order-shape-wipe 1.2s ease-out .3s forwards;clip-path:inset(0 100% 0 0)}@keyframes ntd-stroke-order-shape-wipe{0%{fill-opacity:0;clip-path:inset(0 100% 0 0)}40%{fill-opacity:.7}to{fill-opacity:1;clip-path:inset(0 0 0 0)}}.ntd-anim-glow-trace :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-glow-trace-shape 2.8s ease-in-out infinite}@keyframes ntd-glow-trace-shape{0%{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 16px currentColor);opacity:1}to{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 2px currentColor);opacity:.4}}.nice-icon-stacker{color:var(--nice-text-primary,inherit);display:flex;flex-direction:column;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-3,12px);min-width:0}.nice-icon-stacker :where(button){align-items:center;background:transparent;border:1px solid transparent;border-radius:var(--nice-radius-md,6px);color:inherit;cursor:pointer;display:inline-flex;font:inherit;gap:var(--nice-space-1-5,6px);padding:var(--nice-space-1,4px) var(--nice-space-2,8px)}.nice-icon-stacker :where(button:hover:not(:disabled)){background:var(--nice-bg-hover,var(--nice-bg-secondary,#f1f5f9))}.nice-icon-stacker :where(button:disabled){cursor:not-allowed;opacity:.45}.nice-icon-stacker :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,4px) var(--nice-space-2,8px);width:5em}.nice-icon-stacker :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6);flex:1 1 auto;min-width:0}.nice-icon-stacker :where(button,input,summary):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-icon-stacker__bar{align-items:center;display:flex;gap:var(--nice-space-1,4px)}.nice-icon-stacker__title{color:var(--nice-text-secondary,#64748b);flex:1 1 auto;font-size:var(--nice-font-size-xs,.75rem);font-weight:var(--nice-font-weight-semibold,600);letter-spacing:.04em;text-transform:uppercase}.nice-icon-stacker :where(.nice-icon-stacker__add){border-color:var(--nice-border-color,#e2e8f0);font-weight:var(--nice-font-weight-medium,500)}.nice-icon-stacker :where(.nice-icon-stacker__add:hover:not(:disabled)){border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-color-primary,#3b82f6)}.nice-icon-stacker__empty{border:1px dashed var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);color:var(--nice-text-secondary,#64748b);margin:0;padding:var(--nice-space-4,16px);text-align:center}.nice-icon-stacker__top{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-icon-stacker__preview{align-items:center;background:var(--nice-bg-secondary,#f8fafc);border-radius:var(--nice-radius-lg,8px);display:flex;flex:0 0 auto;flex-direction:column;gap:var(--nice-space-2,8px);padding:var(--nice-space-3,12px)}.nice-icon-stacker__preview-main{display:inline-flex}.nice-icon-stacker__preview-small{align-items:flex-end;display:flex;gap:var(--nice-space-2,8px)}.nice-icon-stacker__preview-small>span{display:inline-flex}.nice-icon-stacker__layers-wrap{display:flex;flex:1 1 180px;flex-direction:column;gap:var(--nice-space-1,4px);min-width:0}.nice-icon-stacker__layers{display:flex;flex-direction:column;gap:2px;list-style:none;margin:0;padding:0}.nice-icon-stacker__layer{--nice-icon-stacker-depth:0;align-items:center;border-radius:var(--nice-radius-md,6px);display:flex;padding-left:calc(var(--nice-icon-stacker-depth, 0)*var(--nice-space-4, 16px))}.nice-icon-stacker__layer:hover{background:var(--nice-bg-hover,var(--nice-bg-secondary,#f1f5f9))}.nice-icon-stacker__layer.nice-icon-stacker__layer--selected{background:color-mix(in srgb,var(--nice-color-primary,#3b82f6) 14%,transparent)}.nice-icon-stacker :where(.nice-icon-stacker__layer-select){flex:1 1 auto;min-width:0;padding:var(--nice-space-1,4px) var(--nice-space-1-5,6px);text-align:left}.nice-icon-stacker :where(.nice-icon-stacker__layer-select:hover:not(:disabled)){background:transparent}.nice-icon-stacker__layer-icon{display:inline-flex;flex:0 0 auto}.nice-icon-stacker__layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nice-icon-stacker__layer--selected .nice-icon-stacker__layer-name{font-weight:var(--nice-font-weight-semibold,600)}.nice-icon-stacker__layer-text{border-radius:var(--nice-radius-sm,4px);padding:0 var(--nice-space-1,4px)}.nice-icon-stacker__badge,.nice-icon-stacker__layer-text{background:var(--nice-bg-tertiary,#f1f5f9);font-size:var(--nice-font-size-xs,.75rem)}.nice-icon-stacker__badge{border-radius:var(--nice-radius-full,9999px);color:var(--nice-text-secondary,#64748b);margin-left:auto;padding:0 var(--nice-space-1-5,6px)}.nice-icon-stacker :where(.nice-icon-stacker__remove){color:var(--nice-text-secondary,#64748b);flex:0 0 auto;opacity:0;padding:var(--nice-space-1,4px)}.nice-icon-stacker .nice-icon-stacker__remove:focus-visible,.nice-icon-stacker__layer--selected .nice-icon-stacker__remove,.nice-icon-stacker__layer:hover .nice-icon-stacker__remove{opacity:1}.nice-icon-stacker__hint{color:var(--nice-text-secondary,#64748b);font-size:var(--nice-font-size-xs,.75rem)}.nice-icon-stacker__inspector{border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);display:flex;flex-direction:column;gap:var(--nice-space-2,8px);padding:var(--nice-space-2,8px) var(--nice-space-3,12px) var(--nice-space-3,12px)}.nice-icon-stacker__inspector-head{align-items:center;display:flex;font-weight:var(--nice-font-weight-semibold,600);gap:var(--nice-space-1-5,6px)}.nice-icon-stacker__inspector-head small{color:var(--nice-text-secondary,#64748b);font-weight:var(--nice-font-weight-normal,400)}.nice-icon-stacker__inspector-body{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-icon-stacker__pad{align-items:stretch;display:flex;flex:0 0 auto;flex-direction:column;gap:var(--nice-space-1-5,6px)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto){border-color:var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-full,9999px);font-size:var(--nice-font-size-xs,.75rem);justify-content:center;padding:2px var(--nice-space-2,8px)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto[aria-checked=true]){background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-text-on-primary,#fff)}.nice-icon-stacker__pad-box{background:var(--nice-bg-secondary,#f8fafc);border:1.5px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:grid;grid-template-columns:repeat(5,16px);grid-template-rows:repeat(5,16px);padding:var(--nice-space-1,4px);place-items:center}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot){border:1.5px solid color-mix(in srgb,currentColor 55%,transparent);border-radius:50%;height:10px;padding:0;width:10px}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot:hover:not(:disabled)){background:var(--nice-primary-tint-20,transparent);border-color:var(--nice-color-primary,#3b82f6)}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot[aria-checked=true]){background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);height:12px;width:12px}.nice-icon-stacker__fields{display:flex;flex:1 1 140px;flex-direction:column;gap:var(--nice-space-2,8px);min-width:0}.nice-icon-stacker__field{align-items:center;display:flex;gap:var(--nice-space-2,8px);min-width:0}.nice-icon-stacker__field>span{color:var(--nice-text-secondary,#64748b);flex:0 0 auto;min-width:4.5em}.nice-icon-stacker__field output{flex:0 0 auto;font-variant-numeric:tabular-nums;min-width:3.5ch;text-align:right}.nice-icon-stacker__field :where(input[aria-invalid=true]){border-color:var(--nice-color-error,#ef4444)}.nice-icon-stacker__more>summary{border-radius:var(--nice-radius-sm,4px);color:var(--nice-text-secondary,#64748b);cursor:pointer;width:max-content}.nice-icon-stacker__more-body{display:flex;flex-direction:column;gap:var(--nice-space-2,8px);padding-top:var(--nice-space-2,8px)}.nice-icon-stacker__swatches{display:flex;flex-wrap:wrap;gap:var(--nice-space-1,4px) var(--nice-space-3,12px)}.nice-icon-stacker__swatch,.nice-icon-stacker__swatch-pick{align-items:center;display:inline-flex}.nice-icon-stacker__swatch-pick{cursor:pointer;gap:var(--nice-space-1-5,6px);position:relative}.nice-icon-stacker__swatch-pick input{cursor:pointer;height:100%;inset:0;opacity:0;position:absolute;width:100%}.nice-icon-stacker__swatch-pick:focus-within{border-radius:var(--nice-radius-sm,4px);box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6))}.nice-icon-stacker__swatch-dot{border:1px solid var(--nice-border-color,#e2e8f0);border-radius:50%;height:16px;width:16px}.nice-icon-stacker__swatch-pick--auto .nice-icon-stacker__swatch-dot{background:transparent;border:1.5px dashed color-mix(in srgb,currentColor 55%,transparent)}.nice-icon-stacker :where(.nice-icon-stacker__reset){color:var(--nice-text-secondary,#64748b);padding:2px}.nice-icon-stacker__code>summary{border-radius:var(--nice-radius-sm,4px);color:var(--nice-text-secondary,#64748b);cursor:pointer;width:max-content}.nice-icon-stacker__code pre{background:var(--nice-bg-secondary,#f8fafc);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xs,.75rem);margin:var(--nice-space-2,8px) 0;overflow-x:auto;padding:var(--nice-space-3,12px);width:100%}.nice-icon-stacker :where(.nice-icon-stacker__code button){border-color:var(--nice-border-color,#e2e8f0)}.ntd-picker{--ntd-picker-border:var(--nice-border-color,#3a3a4a);--ntd-picker-radius:var(--nice-radius-lg,10px);--ntd-picker-bg:var(--nice-bg-elevated,#1e1e2a);--ntd-picker-text:var(--nice-text-primary,#f0f0f5);--ntd-picker-accent:var(--nice-color-primary,#6c5ce7);--ntd-picker-accent-hover:var(--nice-color-primary-hover,#5b4cdb);--ntd-picker-accent-alpha:var(--nice-primary-tint-20,rgba(108,92,231,.2));--ntd-picker-muted:var(--nice-text-muted,#606078);--ntd-picker-text-secondary:var(--nice-text-secondary,#a0a0b4);--ntd-picker-input-bg:var(--nice-bg-inset,#14141c);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-wrap{position:relative}.ntd-picker-cell-fav.ntd-picker-cell-fav--active,.ntd-picker-cell-wrap: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}.ntd-picker.ntd-picker--icon-only .ntd-picker-trigger{min-width:0;padding:4px}.ntd-picker-views{background:var(--ntd-picker-input-bg,#14141c);border-radius:8px;display:flex;flex-shrink:0;gap:2px;margin:10px 12px 0;padding:3px}.ntd-picker-view{align-items:center;background:transparent;border:none;border-radius:6px;color:var(--ntd-picker-text-secondary,#a0a0b4);cursor:pointer;display:inline-flex;flex:1;font-family:inherit;font-size:.78rem;font-weight:500;gap:6px;justify-content:center;padding:5px 10px;transition:background .15s,color .15s}.ntd-picker-view:hover:not(:disabled){color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-view.ntd-picker-view--active{background:var(--ntd-picker-bg,#1e1e2a);box-shadow:0 0 0 1px var(--ntd-picker-border,#3a3a4a);color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-view:disabled{cursor:not-allowed;opacity:.45}.ntd-picker-back:focus-visible,.ntd-picker-view:focus-visible{outline:2px solid var(--ntd-picker-accent,#6c5ce7);outline-offset:1px}.ntd-picker-banner{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);color:var(--ntd-picker-text,#f0f0f5);display:flex;flex-shrink:0;font-size:.8rem;gap:8px;padding:8px 12px}.ntd-picker-back{align-items:center;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:6px;color:inherit;cursor:pointer;display:inline-flex;flex-shrink:0;height:26px;justify-content:center;padding:0;width:26px}.ntd-picker-back:hover{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-panel{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.ntd-picker-dropdown.ntd-picker-dropdown--stack{max-height:min(620px,85vh)}.ntd-picker-dropdown.ntd-picker-dropdown--up{bottom:calc(100% + 6px);top:auto}.ntd-picker-dropdown.ntd-picker-dropdown--end{left:auto;right:0}.ntd-picker-stack{--nice-border-color:var(--ntd-picker-border);--nice-bg-primary:var(--ntd-picker-input-bg);--nice-bg-secondary:var(--ntd-picker-input-bg);--nice-bg-tertiary:var(--ntd-picker-accent-alpha);--nice-bg-hover:var(--ntd-picker-accent-alpha);--nice-text-primary:var(--ntd-picker-text);--nice-text-secondary:var(--ntd-picker-text-secondary);--nice-color-primary:var(--ntd-picker-accent);flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px;scrollbar-width:thin}.ntd-picker-serializer,.ntd-picker-stack[hidden]{display:none}.ntd-picker-grid.ntd-picker-grid--names{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.ntd-picker-grid--names .ntd-picker-cell{aspect-ratio:auto;gap:8px;justify-content:flex-start;padding:6px 8px}.ntd-picker-grid--names .ntd-picker-cell:hover{transform:none}.ntd-picker-grid--names .ntd-picker-cell:after{content:none}.ntd-picker-cell-name{font-size:.78rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
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-turn{animation:ntd-turn var(--ntd-anim-duration,4s) infinite}@keyframes ntd-turn{0%{animation-timing-function:cubic-bezier(.65,0,.35,1);transform:rotate(0deg)}12.5%,50%{animation-timing-function:cubic-bezier(.65,0,.35,1);transform:rotate(180deg)}62.5%,to{transform:rotate(0deg)}}.ntd-anim-turn .ntd-hourglass-sand{animation-duration:var(--ntd-anim-duration,4s);animation-iteration-count:infinite;animation-timing-function:linear;transform-box:view-box}.ntd-anim-turn .ntd-hourglass-sand--top-neck{animation-name:ntd-hourglass-top-neck;transform-origin:12px 11.4px}.ntd-anim-turn .ntd-hourglass-sand--top-base{animation-name:ntd-hourglass-top-base;transform-origin:12px 5.8px}.ntd-anim-turn .ntd-hourglass-sand--bottom-neck{animation-name:ntd-hourglass-bottom-neck;transform-origin:12px 12.6px}.ntd-anim-turn .ntd-hourglass-sand--bottom-base{animation-name:ntd-hourglass-bottom-base;transform-origin:12px 18.2px}.ntd-anim-turn .ntd-hourglass-sand--stream-up{animation-name:ntd-hourglass-stream-up}.ntd-anim-turn .ntd-hourglass-sand--stream-down{animation-name:ntd-hourglass-stream-down}@keyframes ntd-hourglass-top-base{0%,12.5%{transform:scaleY(0)}50%,62.5%{transform:scaleY(1)}62.6%,to{transform:scaleY(0)}}@keyframes ntd-hourglass-top-neck{0%,50%{transform:scale(0)}50.1%,62.5%{transform:scale(1)}to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-neck{0%,12.5%{transform:scale(1)}50%,to{transform:scale(0)}}@keyframes ntd-hourglass-bottom-base{0%,62.5%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes ntd-hourglass-stream-up{0%,13%,49.5%,to{opacity:0}14%,48.5%{opacity:1}}@keyframes ntd-hourglass-stream-down{0%,63%,99.5%,to{opacity:0}64%,98.5%{opacity:1}}.ntd-anim-glow{animation:ntd-glow 2s ease-in-out infinite}@keyframes ntd-glow{0%,to{filter:drop-shadow(0 0 2px currentColor)}50%{filter:drop-shadow(0 0 12px currentColor) drop-shadow(0 0 20px currentColor)}}.ntd-anim-wiggle{animation:ntd-wiggle 1s ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber 1s ease-in-out infinite}@keyframes ntd-rubber{0%{transform:scale(1)}30%{transform:scaleX(1.25) scaleY(.75)}40%{transform:scaleX(.75) scaleY(1.25)}50%{transform:scaleX(1.15) scaleY(.85)}65%{transform:scaleX(.95) scaleY(1.05)}75%{transform:scaleX(1.05) scaleY(.95)}to{transform:scale(1)}}.ntd-anim-swing{animation:ntd-swing 1s ease-in-out infinite;transform-origin:top center}@keyframes ntd-swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0deg)}}.ntd-anim-tada{animation:ntd-tada 1.2s ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0deg)}10%,20%{transform:scale(.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}to{transform:scale(1) rotate(0deg)}}.ntd-anim-heartbeat{animation:ntd-heartbeat 1.2s ease-in-out infinite}@keyframes ntd-heartbeat{0%{transform:scale(1)}14%{transform:scale(1.3)}28%{transform:scale(1)}42%{transform:scale(1.3)}70%{transform:scale(1)}}.ntd-anim-fade-in{animation:ntd-fade-in .5s ease-out forwards}@keyframes ntd-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ntd-anim-slide-up{animation:ntd-slide-up .4s ease-out forwards}@keyframes ntd-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-jello{animation:ntd-jello 1s ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skewX(0deg) skewY(0deg)}11.1%{transform:skewX(-12.5deg) skewY(-12.5deg)}22.2%{transform:skewX(6.25deg) skewY(6.25deg)}33.3%{transform:skewX(-3.125deg) skewY(-3.125deg)}44.4%{transform:skewX(1.5625deg) skewY(1.5625deg)}55.5%{transform:skewX(-.78125deg) skewY(-.78125deg)}66.6%{transform:skewX(.390625deg) skewY(.390625deg)}77.7%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop .6s ease-out infinite}@keyframes ntd-pop{0%{transform:scale(1)}15%{transform:scale(1.35)}30%{transform:scale(.9)}45%{transform:scale(1.1)}60%{transform:scale(.97)}75%{transform:scale(1.03)}to{transform:scale(1)}}.ntd-anim-squeeze{animation:ntd-squeeze 1.4s ease-in-out infinite}@keyframes ntd-squeeze{0%,to{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(.7) scaleY(1.3)}50%{transform:scaleX(1) scaleY(1)}75%{transform:scaleX(1.3) scaleY(.7)}}.ntd-anim-drop{animation:ntd-drop .8s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-drop{0%{opacity:0;transform:translateY(-40px) scale(.8)}60%{opacity:1;transform:translateY(4px) scale(1.05)}75%{transform:translateY(-2px) scale(.98)}90%{transform:translateY(1px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-rise{animation:ntd-rise .7s cubic-bezier(.16,1,.3,1) forwards}@keyframes ntd-rise{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-slide-left{animation:ntd-slide-left .5s ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-right{animation:ntd-slide-right .5s ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-down{animation:ntd-slide-down .4s ease-out forwards}@keyframes ntd-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-roll-in{animation:ntd-roll-in .8s ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0deg)}}.ntd-anim-flash{animation:ntd-flash 1s ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate .3s linear infinite}@keyframes ntd-vibrate{0%{transform:translate(0)}20%{transform:translate(-1px,1px)}40%{transform:translate(1px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}to{transform:translate(0)}}.ntd-anim-wobble{animation:ntd-wobble 1.2s ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-15%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-10%) rotate(-3deg)}60%{transform:translateX(5%) rotate(2deg)}75%{transform:translateX(-3%) rotate(-1deg)}to{transform:translateX(0) rotate(0deg)}}.ntd-anim-spiral{animation:ntd-spiral 2s linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0deg) scale(.8)}25%{transform:rotate(90deg) scale(1.1)}50%{transform:rotate(180deg) scale(.8)}75%{transform:rotate(270deg) scale(1.1)}to{transform:rotate(1turn) scale(.8)}}.ntd-anim-ping{animation:ntd-ping 1.5s ease-out infinite}@keyframes ntd-ping{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(1.6)}71%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}.ntd-anim-flicker{animation:ntd-flicker 1.5s steps(1) infinite}@keyframes ntd-flicker{0%{opacity:1}4%{opacity:.3}8%{opacity:1}12%{opacity:.6}16%{opacity:1}20%{opacity:.2}22%{opacity:1}50%{opacity:1}52%{opacity:.4}54%{opacity:1}80%{opacity:1}82%{opacity:.3}85%{opacity:1}90%{opacity:.5}92%{opacity:1}}.ntd-anim-tilt{animation:ntd-tilt 2s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0deg)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe 4s ease-in-out infinite}@keyframes ntd-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.ntd-anim-drift{animation:ntd-drift 4s ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(5px) rotate(1deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit 3s linear infinite}@keyframes ntd-orbit{0%{transform:translate(0)}25%{transform:translate(4px,-4px)}50%{transform:translateY(-6px)}75%{transform:translate(-4px,-4px)}to{transform:translate(0)}}.ntd-anim-crush{animation:ntd-crush .8s ease-in-out infinite}@keyframes ntd-crush{0%,to{transform:scaleY(1) scaleX(1)}40%{transform:scaleY(.3) scaleX(1.3)}60%{transform:scaleY(1.15) scaleX(.9)}80%{transform:scaleY(.95) scaleX(1.02)}}.ntd-anim-stretch{animation:ntd-stretch 1s ease-in-out infinite}@keyframes ntd-stretch{0%,to{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(1.4) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}}.ntd-anim-dissolve{animation:ntd-dissolve 2s ease-in-out infinite}@keyframes ntd-dissolve{0%,to{filter:blur(0);opacity:1}50%{filter:blur(4px);opacity:.1}}.ntd-anim-materialize{animation:ntd-materialize .8s ease-out forwards}@keyframes ntd-materialize{0%{filter:blur(8px);opacity:0;transform:scale(.6)}60%{filter:blur(1px);opacity:.8;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway 2.5s ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble .15s linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0deg)}25%{transform:translate(-.5px,.5px) rotate(-.5deg)}50%{transform:translate(.5px,-.5px) rotate(.5deg)}75%{transform:translate(-.5px,-.5px) rotate(-.5deg)}to{transform:translate(0) rotate(0deg)}}.ntd-anim-rock{animation:ntd-rock 1.5s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0deg)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap 1.5s ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0deg)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp 2s ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0deg) rotateY(0deg)}25%{transform:perspective(300px) rotateX(10deg) rotateY(10deg)}50%{transform:perspective(300px) rotateX(-5deg) rotateY(-10deg)}75%{transform:perspective(300px) rotateX(8deg) rotateY(-5deg)}}.ntd-anim-glitch{animation:ntd-glitch .8s steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skewX(2deg)}10%{transform:translate(3px,-1px) skewX(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skewX(-3deg)}44%{transform:translate(-2px,-2px) skewX(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skewX(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse 1.5s ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple 1.6s ease-out infinite}@keyframes ntd-ripple{0%{opacity:1;transform:scale(1)}30%{opacity:.8;transform:scale(1.15)}50%{opacity:1;transform:scale(1)}70%{opacity:.9;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.ntd-anim-implode{animation:ntd-implode 1.2s ease-in-out infinite}@keyframes ntd-implode{0%,to{opacity:1;transform:scale(1)}40%{opacity:.3;transform:scale(.2) rotate(20deg)}60%{opacity:.2;transform:scale(.15) rotate(25deg)}80%{opacity:1;transform:scale(1.1) rotate(0deg)}}.ntd-anim-explode{animation:ntd-explode 1.4s ease-in-out infinite}@keyframes ntd-explode{0%,to{opacity:1;transform:scale(1)}30%{opacity:.6;transform:scale(1.8)}50%{opacity:0;transform:scale(2)}51%{opacity:0;transform:scale(.5)}70%{opacity:.8;transform:scale(1.1)}85%{opacity:1;transform:scale(.95)}}.ntd-anim-rotate-x{animation:ntd-rotate-x 1.5s ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0deg)}to{transform:perspective(400px) rotateX(1turn)}}.ntd-anim-morph{animation:ntd-morph 3s ease-in-out infinite}@keyframes ntd-morph{0%,to{border-radius:0;transform:scaleX(1) scaleY(1) rotate(0deg)}20%{transform:scaleX(1.1) scaleY(.9) rotate(2deg)}40%{transform:scaleX(.9) scaleY(1.1) rotate(-1deg)}60%{transform:scaleX(1.05) scaleY(.95) rotate(1deg)}80%{transform:scaleX(.95) scaleY(1.05) rotate(-2deg)}}.ntd-anim-levitate{animation:ntd-levitate 3s ease-in-out infinite}@keyframes ntd-levitate{0%,to{filter:drop-shadow(0 2px 2px rgba(0,0,0,.2));transform:translateY(0)}50%{filter:drop-shadow(0 12px 8px rgba(0,0,0,.1));transform:translateY(-10px)}}.ntd-anim-dash{animation:ntd-dash .8s ease-in-out infinite}@keyframes ntd-dash{0%,to{opacity:1;transform:translateX(0) scaleX(1)}30%{opacity:.8;transform:translateX(-3px) scaleX(.9)}60%{opacity:.6;transform:translateX(15px) scaleX(1.15)}80%{opacity:.9;transform:translateX(2px) scaleX(1)}}.ntd-anim-twist{animation:ntd-twist 1.5s ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0deg) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0deg) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp 1s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-stomp{0%,to{transform:translateY(0) scaleY(1) scaleX(1)}20%{transform:translateY(-15px) scaleY(1.1) scaleX(.95)}50%{transform:translateY(0) scaleY(.7) scaleX(1.2)}65%{transform:translateY(-3px) scaleY(1.05) scaleX(.98)}80%{transform:translateY(0) scaleY(.95) scaleX(1.03)}}.ntd-anim-flap{animation:ntd-flap .6s ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0deg) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate 2s ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(8px) rotate(2deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink 1.4s steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal 1s ease-out forwards}@keyframes ntd-reveal{0%{clip-path:circle(0 at 50% 50%);opacity:.5}to{clip-path:circle(75% at 50% 50%);opacity:1}}.ntd-anim-vortex{animation:ntd-vortex .8s ease-out forwards}@keyframes ntd-vortex{0%{opacity:0;transform:rotate(-540deg) scale(0)}60%{opacity:1;transform:rotate(20deg) scale(1.1)}80%{transform:rotate(-10deg) scale(.95)}to{opacity:1;transform:rotate(0deg) scale(1)}}.ntd-anim-meteor{animation:ntd-meteor .7s ease-out forwards}@keyframes ntd-meteor{0%{opacity:0;transform:translate(30px,-30px) rotate(15deg) scale(.5)}70%{opacity:1;transform:translate(-2px,2px) rotate(-2deg) scale(1.05)}to{opacity:1;transform:translate(0) rotate(0deg) scale(1)}}.ntd-anim-scale-in{animation:ntd-scale-in .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.ntd-anim-scale-out{animation:ntd-scale-out .4s ease-in forwards}@keyframes ntd-scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ntd-anim-pendulum{animation:ntd-pendulum 2s ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0deg)}25%{transform:rotate(25deg)}50%{transform:rotate(0deg)}75%{transform:rotate(-25deg)}to{transform:rotate(0deg)}}.ntd-anim-surge{animation:ntd-surge 1.5s ease-in-out infinite}@keyframes ntd-surge{0%,to{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}15%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);transform:scale(1.2)}30%{filter:drop-shadow(0 0 2px currentColor);transform:scale(.95)}45%{filter:drop-shadow(0 0 6px currentColor);transform:scale(1.1)}60%{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}}.ntd-anim-radar{animation:ntd-radar 2s linear infinite}@keyframes ntd-radar{0%{opacity:1;transform:rotate(0deg)}50%{opacity:.4}to{opacity:1;transform:rotate(1turn)}}.ntd-anim-typewriter{animation:ntd-typewriter 1s steps(12) forwards}@keyframes ntd-typewriter{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.ntd-anim-unfold{animation:ntd-unfold .7s ease-out forwards}@keyframes ntd-unfold{0%{opacity:.3;transform:scaleY(.05) scaleX(1.3)}50%{opacity:.9;transform:scaleY(1.1) scaleX(.95)}70%{opacity:1;transform:scaleY(.95) scaleX(1.02)}to{opacity:1;transform:scaleY(1) scaleX(1)}}.ntd-anim-fold{animation:ntd-fold .6s ease-in forwards}@keyframes ntd-fold{0%{opacity:1;transform:scaleY(1) scaleX(1)}to{opacity:0;transform:scaleY(.05) scaleX(1.3)}}.ntd-anim-scatter{animation:ntd-scatter 1.5s ease-in-out infinite}@keyframes ntd-scatter{0%,to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}20%{filter:blur(2px);opacity:.6;transform:scale(1.3) rotate(5deg)}40%{filter:blur(4px);opacity:.2;transform:scale(1.5) rotate(-3deg)}50%{filter:blur(6px);opacity:0;transform:scale(.8) rotate(0deg)}65%{filter:blur(3px);opacity:.3;transform:scale(.6) rotate(-5deg)}80%{filter:blur(1px);opacity:.8;transform:scale(.95) rotate(2deg)}}.ntd-anim-assemble{animation:ntd-assemble 1s ease-out forwards}@keyframes ntd-assemble{0%{filter:blur(8px);opacity:0;transform:scale(2) rotate(15deg)}30%{filter:blur(3px);opacity:.5;transform:scale(.8) rotate(-5deg)}60%{filter:blur(1px);opacity:.9;transform:scale(1.1) rotate(2deg)}80%{filter:blur(0);opacity:1;transform:scale(.97) rotate(-1deg)}to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}}.ntd-anim-neon{animation:ntd-neon 2s ease-in-out infinite}@keyframes ntd-neon{0%,to{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}10%{filter:drop-shadow(0 0 0 currentColor);opacity:.4}11%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}15%{filter:drop-shadow(0 0 0 currentColor);opacity:.3}16%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}50%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor);opacity:1}}.ntd-anim-earthquake{animation:ntd-earthquake .5s ease-in-out infinite}@keyframes ntd-earthquake{0%,to{transform:translate(0)}10%{transform:translate(-4px,2px) rotate(-1deg)}20%{transform:translate(3px,-3px) rotate(1deg)}30%{transform:translate(-2px,4px) rotate(-2deg)}40%{transform:translate(4px,-1px) rotate(2deg)}50%{transform:translate(-3px,3px) rotate(-1deg)}60%{transform:translate(2px,-4px) rotate(1deg)}70%{transform:translate(-4px,1px) rotate(-2deg)}80%{transform:translate(3px,2px) rotate(2deg)}90%{transform:translate(-1px,-3px) rotate(-1deg)}}.ntd-anim-signature{animation:ntd-signature-enter .65s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-signature circle,.ntd-anim-signature ellipse,.ntd-anim-signature line,.ntd-anim-signature path,.ntd-anim-signature polygon,.ntd-anim-signature polyline,.ntd-anim-signature rect{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke 1.7s ease-out .05s forwards,ntd-signature-fill .55s ease-out 1.05s forwards;filter:drop-shadow(0 0 0 currentColor)}@keyframes ntd-signature-enter{0%{opacity:.08;transform:scale(.05) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(0deg)}to{opacity:1;transform:scale(1)}}@keyframes ntd-signature-stroke{0%{stroke-dashoffset:150;filter:drop-shadow(0 0 0 currentColor)}65%{stroke-dashoffset:0;filter:drop-shadow(0 0 6px currentColor)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 2px currentColor)}}@keyframes ntd-signature-fill{0%{fill-opacity:.05}to{fill-opacity:1}}.ntd-anim-draw-sequence circle,.ntd-anim-draw-sequence ellipse,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence rect{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence 1.6s ease-out forwards}.ntd-anim-draw-sequence circle:first-child,.ntd-anim-draw-sequence ellipse:first-child,.ntd-anim-draw-sequence line:first-child,.ntd-anim-draw-sequence path:first-child,.ntd-anim-draw-sequence polygon:first-child,.ntd-anim-draw-sequence polyline:first-child,.ntd-anim-draw-sequence rect:first-child{animation-delay:0s}.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3){animation-delay:.4s}@keyframes ntd-draw-sequence{0%{stroke-dashoffset:160;fill-opacity:0}75%{stroke-dashoffset:0;fill-opacity:.15}to{stroke-dashoffset:0;fill-opacity:1}}.ntd-anim-stroke-order circle,.ntd-anim-stroke-order ellipse,.ntd-anim-stroke-order line,.ntd-anim-stroke-order path,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order rect{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order 2s linear forwards}@keyframes ntd-stroke-order{0%{stroke-dashoffset:220;opacity:.2}30%{opacity:1}to{stroke-dashoffset:0;opacity:1}}.ntd-anim-glow-trace circle,.ntd-anim-glow-trace ellipse,.ntd-anim-glow-trace line,.ntd-anim-glow-trace path,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace rect{stroke-dasharray:180;animation:ntd-glow-trace 2.8s ease-in-out infinite}@keyframes ntd-glow-trace{0%{stroke-dashoffset:180;filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{stroke-dashoffset:0;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 14px currentColor);opacity:1}to{stroke-dashoffset:-180;filter:drop-shadow(0 0 2px currentColor);opacity:.5}}.ntd-anim-seal-stamp{animation:ntd-seal-stamp .75s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center}@keyframes ntd-seal-stamp{0%{filter:blur(2px);opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg)}45%{filter:blur(0);opacity:1;transform:translateY(2px) scale(.94) rotate(0deg)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw circle,.ntd-anim-draw ellipse,.ntd-anim-draw line,.ntd-anim-draw path,.ntd-anim-draw polygon,.ntd-anim-draw polyline,.ntd-anim-draw rect{stroke-dasharray:120;stroke-dashoffset:120;fill-opacity:0;animation:ntd-draw-stroke 1.2s ease-out forwards,ntd-draw-fill .4s ease-out .8s forwards}@keyframes ntd-draw-stroke{0%{stroke-dashoffset:120}to{stroke-dashoffset:0}}@keyframes ntd-draw-fill{0%{fill-opacity:0}to{fill-opacity:1}}.ntd-anim-draw-from-dot{animation:ntd-draw-dot-enter .45s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot ellipse,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot rect{stroke-dasharray:140;stroke-dashoffset:140;fill-opacity:0;animation:ntd-draw-dot-stroke 1.35s ease-out .15s forwards,ntd-draw-fill .45s ease-out .95s forwards}@keyframes ntd-draw-dot-enter{0%{opacity:.15;transform:scale(.08)}60%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes ntd-draw-dot-stroke{0%{stroke-dashoffset:140}to{stroke-dashoffset:0}}.ntd-anim-draw-loop circle,.ntd-anim-draw-loop ellipse,.ntd-anim-draw-loop line,.ntd-anim-draw-loop path,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop rect{stroke-dasharray:140;animation:ntd-draw-loop-stroke 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-stroke{0%{stroke-dashoffset:140;opacity:0}25%{stroke-dashoffset:0;opacity:1}60%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-140;opacity:.2}}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-shape-pop .7s cubic-bezier(.34,1.56,.64,1) .35s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.5s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.65s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.8s}@keyframes ntd-draw-shape-pop{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.5)}60%{fill-opacity:.9;clip-path:circle(75% at 50% 50%);transform:scale(1.08)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-dot-shape-burst .65s cubic-bezier(.34,1.56,.64,1) .25s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.4s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.55s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.7s}@keyframes ntd-draw-dot-shape-burst{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.1)}50%{fill-opacity:.85;clip-path:circle(65% at 50% 50%);transform:scale(1.14)}75%{clip-path:circle(88% at 50% 50%);transform:scale(.97)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-seq-shape-wipe .6s cubic-bezier(.22,1,.36,1) forwards;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):first-child{animation-delay:0s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.4s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.6s}@keyframes ntd-draw-seq-shape-wipe{0%{fill-opacity:0;clip-path:inset(100% 0 0 0);transform:scaleY(.6)}70%{fill-opacity:.9;clip-path:inset(5% 0 0 0);transform:scaleY(1.04)}to{fill-opacity:1;clip-path:inset(0 0 0 0);transform:scaleY(1)}}.ntd-anim-draw-loop :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-draw-loop-shape-pulse 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-shape-pulse{0%{clip-path:circle(0 at 50% 50%);opacity:0}25%{clip-path:circle(100% at 50% 50%);opacity:1}60%{clip-path:circle(100% at 50% 50%);opacity:1}to{clip-path:circle(0 at 50% 50%);opacity:.2}}.ntd-anim-signature :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-signature-shape-stamp .8s cubic-bezier(.22,1,.36,1) .5s forwards;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform-box:fill-box;transform-origin:center}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform:scale(.35) rotate(-6deg)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);filter:drop-shadow(0 0 8px currentColor);transform:scale(1.08) rotate(0deg)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);transform:scale(1)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-stroke-order-shape-wipe 1.2s ease-out .3s forwards;clip-path:inset(0 100% 0 0)}@keyframes ntd-stroke-order-shape-wipe{0%{fill-opacity:0;clip-path:inset(0 100% 0 0)}40%{fill-opacity:.7}to{fill-opacity:1;clip-path:inset(0 0 0 0)}}.ntd-anim-glow-trace :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-glow-trace-shape 2.8s ease-in-out infinite}@keyframes ntd-glow-trace-shape{0%{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 16px currentColor);opacity:1}to{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 2px currentColor);opacity:.4}}.nice-icon-stacker{color:var(--nice-text-primary,inherit);display:flex;flex-direction:column;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-3,12px);min-width:0}.nice-icon-stacker :where(button){align-items:center;background:transparent;border:1px solid transparent;border-radius:var(--nice-radius-md,6px);color:inherit;cursor:pointer;display:inline-flex;font:inherit;gap:var(--nice-space-1-5,6px);padding:var(--nice-space-1,4px) var(--nice-space-2,8px)}.nice-icon-stacker :where(button:hover:not(:disabled)){background:var(--nice-bg-hover,var(--nice-bg-secondary,#f1f5f9))}.nice-icon-stacker :where(button:disabled){cursor:not-allowed;opacity:.45}.nice-icon-stacker :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,4px) var(--nice-space-2,8px);width:5em}.nice-icon-stacker :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6);flex:1 1 auto;min-width:0}.nice-icon-stacker :where(button,input,summary):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-icon-stacker__bar{align-items:center;display:flex;gap:var(--nice-space-1,4px)}.nice-icon-stacker__title{color:var(--nice-text-secondary,#64748b);flex:1 1 auto;font-size:var(--nice-font-size-xs,.75rem);font-weight:var(--nice-font-weight-semibold,600);letter-spacing:.04em;text-transform:uppercase}.nice-icon-stacker :where(.nice-icon-stacker__add){border-color:var(--nice-border-color,#e2e8f0);font-weight:var(--nice-font-weight-medium,500)}.nice-icon-stacker :where(.nice-icon-stacker__add:hover:not(:disabled)){border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-color-primary,#3b82f6)}.nice-icon-stacker__empty{border:1px dashed var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);color:var(--nice-text-secondary,#64748b);margin:0;padding:var(--nice-space-4,16px);text-align:center}.nice-icon-stacker__top{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-icon-stacker__preview{align-items:center;background:var(--nice-bg-secondary,#f8fafc);border-radius:var(--nice-radius-lg,8px);display:flex;flex:0 0 auto;flex-direction:column;gap:var(--nice-space-2,8px);padding:var(--nice-space-3,12px)}.nice-icon-stacker__preview-main{display:inline-flex}.nice-icon-stacker__preview-small{align-items:flex-end;display:flex;gap:var(--nice-space-2,8px)}.nice-icon-stacker__preview-small>span{display:inline-flex}.nice-icon-stacker__layers-wrap{display:flex;flex:1 1 180px;flex-direction:column;gap:var(--nice-space-1,4px);min-width:0}.nice-icon-stacker__layers{display:flex;flex-direction:column;gap:2px;list-style:none;margin:0;padding:0}.nice-icon-stacker__layer{--nice-icon-stacker-depth:0;align-items:center;border-radius:var(--nice-radius-md,6px);display:flex;padding-left:calc(var(--nice-icon-stacker-depth, 0)*var(--nice-space-4, 16px))}.nice-icon-stacker__layer:hover{background:var(--nice-bg-hover,var(--nice-bg-secondary,#f1f5f9))}.nice-icon-stacker__layer.nice-icon-stacker__layer--selected{background:color-mix(in srgb,var(--nice-color-primary,#3b82f6) 14%,transparent)}.nice-icon-stacker :where(.nice-icon-stacker__layer-select){flex:1 1 auto;min-width:0;padding:var(--nice-space-1,4px) var(--nice-space-1-5,6px);text-align:left}.nice-icon-stacker :where(.nice-icon-stacker__layer-select:hover:not(:disabled)){background:transparent}.nice-icon-stacker__layer-icon{display:inline-flex;flex:0 0 auto}.nice-icon-stacker__layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nice-icon-stacker__layer--selected .nice-icon-stacker__layer-name{font-weight:var(--nice-font-weight-semibold,600)}.nice-icon-stacker__layer-text{border-radius:var(--nice-radius-sm,4px);padding:0 var(--nice-space-1,4px)}.nice-icon-stacker__badge,.nice-icon-stacker__layer-text{background:var(--nice-bg-tertiary,#f1f5f9);font-size:var(--nice-font-size-xs,.75rem)}.nice-icon-stacker__badge{border-radius:var(--nice-radius-full,9999px);color:var(--nice-text-secondary,#64748b);margin-left:auto;padding:0 var(--nice-space-1-5,6px)}.nice-icon-stacker :where(.nice-icon-stacker__remove){color:var(--nice-text-secondary,#64748b);flex:0 0 auto;opacity:0;padding:var(--nice-space-1,4px)}.nice-icon-stacker .nice-icon-stacker__remove:focus-visible,.nice-icon-stacker__layer--selected .nice-icon-stacker__remove,.nice-icon-stacker__layer:hover .nice-icon-stacker__remove{opacity:1}.nice-icon-stacker__hint{color:var(--nice-text-secondary,#64748b);font-size:var(--nice-font-size-xs,.75rem)}.nice-icon-stacker__inspector{border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);display:flex;flex-direction:column;gap:var(--nice-space-2,8px);padding:var(--nice-space-2,8px) var(--nice-space-3,12px) var(--nice-space-3,12px)}.nice-icon-stacker__inspector-head{align-items:center;display:flex;font-weight:var(--nice-font-weight-semibold,600);gap:var(--nice-space-1-5,6px)}.nice-icon-stacker__inspector-head small{color:var(--nice-text-secondary,#64748b);font-weight:var(--nice-font-weight-normal,400)}.nice-icon-stacker__inspector-body{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-icon-stacker__pad{align-items:stretch;display:flex;flex:0 0 auto;flex-direction:column;gap:var(--nice-space-1-5,6px)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto){border-color:var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-full,9999px);font-size:var(--nice-font-size-xs,.75rem);justify-content:center;padding:2px var(--nice-space-2,8px)}.nice-icon-stacker :where(.nice-icon-stacker__pad-auto[aria-checked=true]){background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-text-on-primary,#fff)}.nice-icon-stacker__pad-box{background:var(--nice-bg-secondary,#f8fafc);border:1.5px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:grid;grid-template-columns:repeat(5,16px);grid-template-rows:repeat(5,16px);padding:var(--nice-space-1,4px);place-items:center}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot){border:1.5px solid color-mix(in srgb,currentColor 55%,transparent);border-radius:50%;height:10px;padding:0;width:10px}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot:hover:not(:disabled)){background:var(--nice-primary-tint-20,transparent);border-color:var(--nice-color-primary,#3b82f6)}.nice-icon-stacker :where(.nice-icon-stacker__pad-dot[aria-checked=true]){background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);height:12px;width:12px}.nice-icon-stacker__fields{display:flex;flex:1 1 140px;flex-direction:column;gap:var(--nice-space-2,8px);min-width:0}.nice-icon-stacker__field{align-items:center;display:flex;gap:var(--nice-space-2,8px);min-width:0}.nice-icon-stacker__field>span{color:var(--nice-text-secondary,#64748b);flex:0 0 auto;min-width:4.5em}.nice-icon-stacker__field output{flex:0 0 auto;font-variant-numeric:tabular-nums;min-width:3.5ch;text-align:right}.nice-icon-stacker__field :where(input[aria-invalid=true]){border-color:var(--nice-color-error,#ef4444)}.nice-icon-stacker__more>summary{border-radius:var(--nice-radius-sm,4px);color:var(--nice-text-secondary,#64748b);cursor:pointer;width:max-content}.nice-icon-stacker__more-body{display:flex;flex-direction:column;gap:var(--nice-space-2,8px);padding-top:var(--nice-space-2,8px)}.nice-icon-stacker__swatches{display:flex;flex-wrap:wrap;gap:var(--nice-space-1,4px) var(--nice-space-3,12px)}.nice-icon-stacker__swatch,.nice-icon-stacker__swatch-pick{align-items:center;display:inline-flex}.nice-icon-stacker__swatch-pick{cursor:pointer;gap:var(--nice-space-1-5,6px);position:relative}.nice-icon-stacker__swatch-pick input{cursor:pointer;height:100%;inset:0;opacity:0;position:absolute;width:100%}.nice-icon-stacker__swatch-pick:focus-within{border-radius:var(--nice-radius-sm,4px);box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6))}.nice-icon-stacker__swatch-dot{border:1px solid var(--nice-border-color,#e2e8f0);border-radius:50%;height:16px;width:16px}.nice-icon-stacker__swatch-pick--auto .nice-icon-stacker__swatch-dot{background:transparent;border:1.5px dashed color-mix(in srgb,currentColor 55%,transparent)}.nice-icon-stacker :where(.nice-icon-stacker__reset){color:var(--nice-text-secondary,#64748b);padding:2px}.nice-icon-stacker__code>summary{border-radius:var(--nice-radius-sm,4px);color:var(--nice-text-secondary,#64748b);cursor:pointer;width:max-content}.nice-icon-stacker__code pre{background:var(--nice-bg-secondary,#f8fafc);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xs,.75rem);margin:var(--nice-space-2,8px) 0;overflow-x:auto;padding:var(--nice-space-3,12px);width:100%}.nice-icon-stacker :where(.nice-icon-stacker__code button){border-color:var(--nice-border-color,#e2e8f0)}.ntd-picker{--ntd-picker-border:var(--nice-border-color,#3a3a4a);--ntd-picker-radius:var(--nice-radius-lg,10px);--ntd-picker-bg:var(--nice-bg-elevated,#1e1e2a);--ntd-picker-text:var(--nice-text-primary,#f0f0f5);--ntd-picker-accent:var(--nice-color-primary,#6c5ce7);--ntd-picker-accent-hover:var(--nice-color-primary-hover,#5b4cdb);--ntd-picker-accent-alpha:var(--nice-primary-tint-20,rgba(108,92,231,.2));--ntd-picker-muted:var(--nice-text-muted,#606078);--ntd-picker-text-secondary:var(--nice-text-secondary,#a0a0b4);--ntd-picker-input-bg:var(--nice-bg-inset,#14141c);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-wrap{position:relative}.ntd-picker-cell-fav.ntd-picker-cell-fav--active,.ntd-picker-cell-wrap: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}.ntd-picker.ntd-picker--icon-only .ntd-picker-trigger{min-width:0;padding:4px}.ntd-picker-views{background:var(--ntd-picker-input-bg,#14141c);border-radius:8px;display:flex;flex-shrink:0;gap:2px;margin:10px 12px 0;padding:3px}.ntd-picker-view{align-items:center;background:transparent;border:none;border-radius:6px;color:var(--ntd-picker-text-secondary,#a0a0b4);cursor:pointer;display:inline-flex;flex:1;font-family:inherit;font-size:.78rem;font-weight:500;gap:6px;justify-content:center;padding:5px 10px;transition:background .15s,color .15s}.ntd-picker-view:hover:not(:disabled){color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-view.ntd-picker-view--active{background:var(--ntd-picker-bg,#1e1e2a);box-shadow:0 0 0 1px var(--ntd-picker-border,#3a3a4a);color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-view:disabled{cursor:not-allowed;opacity:.45}.ntd-picker-back:focus-visible,.ntd-picker-view:focus-visible{outline:2px solid var(--ntd-picker-accent,#6c5ce7);outline-offset:1px}.ntd-picker-banner{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);color:var(--ntd-picker-text,#f0f0f5);display:flex;flex-shrink:0;font-size:.8rem;gap:8px;padding:8px 12px}.ntd-picker-back{align-items:center;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:6px;color:inherit;cursor:pointer;display:inline-flex;flex-shrink:0;height:26px;justify-content:center;padding:0;width:26px}.ntd-picker-back:hover{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-panel{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.ntd-picker-dropdown.ntd-picker-dropdown--stack{max-height:min(620px,85vh)}.ntd-picker-dropdown.ntd-picker-dropdown--up{bottom:calc(100% + 6px);top:auto}.ntd-picker-dropdown.ntd-picker-dropdown--end{left:auto;right:0}.ntd-picker-stack{--nice-border-color:var(--ntd-picker-border);--nice-bg-primary:var(--ntd-picker-input-bg);--nice-bg-secondary:var(--ntd-picker-input-bg);--nice-bg-tertiary:var(--ntd-picker-accent-alpha);--nice-bg-hover:var(--ntd-picker-accent-alpha);--nice-text-primary:var(--ntd-picker-text);--nice-text-secondary:var(--ntd-picker-text-secondary);--nice-color-primary:var(--ntd-picker-accent);flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px;scrollbar-width:thin}.ntd-picker-serializer,.ntd-picker-stack[hidden]{display:none}.ntd-picker-grid.ntd-picker-grid--names{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.ntd-picker-grid--names .ntd-picker-cell{aspect-ratio:auto;gap:8px;justify-content:flex-start;padding:6px 8px}.ntd-picker-grid--names .ntd-picker-cell:hover{transform:none}.ntd-picker-grid--names .ntd-picker-cell:after{content:none}.ntd-picker-cell-name{font-size:.78rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nice-desktop-icon-exporter{color:var(--nice-text-primary,inherit);display:grid;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-4,16px);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));min-width:0}.nice-desktop-icon-exporter :where(h3,h4){font-weight:var(--nice-font-weight-semibold,600);margin:0 0 var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(h3){font-size:var(--nice-font-size-md,.875rem)}.nice-desktop-icon-exporter :where(h4){color:var(--nice-text-secondary,#64748b);font-size:var(--nice-font-size-xs,.75rem)}.nice-desktop-icon-exporter :where(button){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);color:var(--nice-text-primary,inherit);cursor:pointer;font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-3,12px)}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary,#f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){cursor:not-allowed;opacity:.5}.nice-desktop-icon-exporter :where(input[type=text]){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;color:var(--nice-text-primary,inherit);font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__results{background:var(--nice-bg-elevated,var(--nice-bg-primary,#fff));border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);min-width:0;padding:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-grid{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-item{align-items:center;color:var(--nice-text-muted,#94a3b8);display:flex;flex-direction:column;font-size:var(--nice-font-size-xs,.75rem);font-variant-numeric:tabular-nums;gap:var(--nice-space-1,4px)}.nice-desktop-icon-exporter__preview-box{align-items:center;border-radius:var(--nice-radius-sm,4px);display:flex;justify-content:center}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5,10px)}.nice-desktop-icon-exporter__config>label{align-items:center;color:var(--nice-text-secondary,#64748b);display:flex;flex-wrap:wrap;font-weight:var(--nice-font-weight-medium,500);gap:var(--nice-space-2,8px)}.nice-desktop-icon-exporter__config>label>input[type=range],.nice-desktop-icon-exporter__config>label>input[type=text]{flex:1 1 140px;min-width:0}.nice-desktop-icon-exporter__platforms,.nice-desktop-icon-exporter__sizes{display:flex;flex-wrap:wrap;gap:var(--nice-space-1-5,6px) var(--nice-space-4,16px)}.nice-desktop-icon-exporter__sizes>h4{flex-basis:100%;margin:0}.nice-desktop-icon-exporter__platforms label,.nice-desktop-icon-exporter__sizes label{align-items:center;cursor:pointer;display:inline-flex;gap:var(--nice-space-1-5,6px)}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;gap:var(--nice-space-2,8px);grid-column:1/-1}.nice-desktop-icon-exporter__actions>button:first-child{background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-text-on-primary,#fff);font-weight:var(--nice-font-weight-medium,500)}.nice-desktop-icon-exporter__results{grid-column:1/-1}.nice-desktop-icon-exporter__results-grid{display:grid;gap:var(--nice-space-2,8px);grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.nice-desktop-icon-exporter__result-item{align-items:center;border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:flex;flex-direction:column;gap:var(--nice-space-1,4px);padding:var(--nice-space-2,8px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-height:64px;max-width:64px}.nice-desktop-icon-exporter__result-item>span{color:var(--nice-text-secondary,#64748b);font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xxs,.625rem);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@@ -1,13 +1,14 @@
1
1
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
2
  import { useRovingFocus, useNiceTranslation, useControllableState, useOverlayFocus } from '@nice2dev/ui-core';
3
3
  import { forwardRef, useRef, useState, useId, useMemo, useCallback, useImperativeHandle, useEffect, useLayoutEffect } from 'react';
4
- import { parseIconHtml, scopeIconHtmlIds, iconHtmlAttributes } from './iconHtml.js';
4
+ import { scopeIconHtmlIds, iconHtmlAttributes } from './iconHtml.js';
5
5
  import { NtdSearch, NtdCheck } from './icons/actions.js';
6
6
  import { NtdGrid } from './icons/files.js';
7
7
  import { NtdInbox } from './icons/media.js';
8
8
  import { NtdArrowLeft, NtdChevronDown } from './icons/navigation.js';
9
9
  import { NtdStar, NtdClock } from './icons/ui.js';
10
10
  import { iconDisplayName, renderIconStack } from './iconStack.js';
11
+ import { parseIconValue, formatIconValue } from './iconValue.js';
11
12
  import { NiceIconStacker } from './NiceIconStacker.js';
12
13
 
13
14
  const MAX_HISTORY_ITEMS = 20;
@@ -71,8 +72,8 @@ function saveToStorage(key, value) {
71
72
  * A fully-featured icon picker dropdown component.
72
73
  *
73
74
  * Provides a trigger button that opens a searchable, categorized icon grid. The value binds both
74
- * ways — `value` / `defaultValue` + `onChange` (1.3.9) — as the icon's export name or, with
75
- * `valueFormat="html"`, as the icon drawn in HTML, ready to store. With `stackable` the panel gets
75
+ * ways — `value` / `defaultValue` + `onChange` (1.3.9) — as the icon's export name, a stack as
76
+ * short code (`Folder(Star@tr)`), JSON or HTML (`valueFormat`). With `stackable` the panel gets
76
77
  * an "Overlays" tab where icons are stacked on the chosen one. Names show without `Ntd`; the
77
78
  * trigger shows the icon alone or the icon and its name (`displayMode`). Keyboard: arrows in the
78
79
  * grid, Escape to close.
@@ -85,7 +86,7 @@ function saveToStorage(key, value) {
85
86
  * import { NiceIconPicker } from '@nice2dev/icons';
86
87
  *
87
88
  * function IconField({ icons, value, onChange }) {
88
- * // stores `<svg data-ntd-icon="NtdStar" …>…</svg>`, a stack included
89
+ * // stores `NtdFolder`, or `Folder(Star@tr)` with a star stacked in its corner
89
90
  * return <NiceIconPicker icons={icons} value={value} onChange={onChange} stackable />;
90
91
  * }
91
92
  * ```
@@ -104,8 +105,8 @@ const NiceIconPicker = /* @__PURE__ */ forwardRef(function NiceIconPicker({ icon
104
105
  const [view, setView] = useState('icons');
105
106
  const [picking, setPicking] = useState(null);
106
107
  const panelId = useId();
107
- const valueFormat = valueFormatProp !== null && valueFormatProp !== void 0 ? valueFormatProp : (stackable ? 'html' : 'name');
108
- const canStack = stackable && !multiSelect && valueFormat === 'html';
108
+ const valueFormat = valueFormatProp !== null && valueFormatProp !== void 0 ? valueFormatProp : 'name';
109
+ const canStack = stackable && !multiSelect;
109
110
  const drawProps = useMemo(() => ({ accentColor: PAGE_ACCENT, ...iconProps, variant }), [iconProps, variant]);
110
111
  // Virtualization state
111
112
  const [visibleRange, setVisibleRange] = useState({ start: 0, end: virtualizedItemCount });
@@ -141,41 +142,61 @@ const NiceIconPicker = /* @__PURE__ */ forwardRef(function NiceIconPicker({ icon
141
142
  }, [entryOf]);
142
143
  const resolve = useCallback((n) => { var _a; return (_a = entryOf(n)) === null || _a === void 0 ? void 0 : _a.Component; }, [entryOf]);
143
144
  /* ─── The single value as a stack — a plain icon is a stack of one ─── */
145
+ // The last value emitted with its layers: read back, the text would number the layers anew
146
+ // (it keeps no ids) and the stacker would lose the layer it has selected.
147
+ const [emitted, setEmitted] = useState(null);
144
148
  const model = useMemo(() => {
145
149
  if (!value) {
146
150
  return NO_LAYERS;
147
151
  }
148
- const source = parseIconHtml(value);
149
- if (source) {
150
- return source.layers;
152
+ if ((emitted === null || emitted === void 0 ? void 0 : emitted.value) === value) {
153
+ return emitted.layers;
151
154
  }
152
- const entry = value.includes('<') ? undefined : entryOf(value);
153
- return entry ? [{ id: '1', icon: entry.name }] : NO_LAYERS;
154
- }, [value, entryOf]);
155
+ // a name as is first: an older value may hold one of the code's signs
156
+ const exact = value.includes('<') ? undefined : entryOf(value);
157
+ if (exact) {
158
+ return [{ id: '1', icon: exact.name }];
159
+ }
160
+ const layers = parseIconValue(value);
161
+ if (!layers || !entryOf(layers[0].icon)) {
162
+ return NO_LAYERS;
163
+ }
164
+ // the code names icons without `Ntd`; the stacker and the grid know them by entry name
165
+ return layers.map((l) => {
166
+ const entry = entryOf(l.icon);
167
+ return entry && entry.name !== l.icon ? { ...l, icon: entry.name } : l;
168
+ });
169
+ }, [value, emitted, entryOf]);
155
170
  // A stack waiting to be drawn into HTML: shown at once, emitted once drawn (below).
156
171
  const [pending, setPending] = useState(null);
157
172
  const shown = pending !== null && pending !== void 0 ? pending : model;
158
173
  const base = shown[0];
174
+ /** The name a stack's code gives an icon: without `Ntd`, unless that is another icon's name. */
175
+ const shortName = useCallback((n) => {
176
+ const short = iconDisplayName(n);
177
+ return short !== n && !byName.has(short) ? short : n;
178
+ }, [byName]);
159
179
  const onChangeRef = useRef(onChange);
160
180
  onChangeRef.current = onChange;
161
- const emit = useCallback((next, baseName) => {
162
- var _a, _b;
181
+ const emit = useCallback((next, layers) => {
182
+ var _a, _b, _c;
183
+ setEmitted(next === null ? null : { value: next, layers });
163
184
  setValue(next);
164
- (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, next, (_b = entryOf(baseName)) !== null && _b !== void 0 ? _b : null);
185
+ (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, next, (_c = entryOf((_b = layers[0]) === null || _b === void 0 ? void 0 : _b.icon)) !== null && _c !== void 0 ? _c : null);
165
186
  }, [setValue, entryOf]);
166
- /** Sets the single value to a stack: its base's name, or the stack drawn as HTML. */
187
+ /** Sets the single value to a stack: written as `valueFormat` holds it, HTML once drawn. */
167
188
  const commit = useCallback((layers) => {
168
189
  if (layers.length === 0) {
169
190
  setPending(null);
170
- emit(null);
191
+ emit(null, NO_LAYERS);
171
192
  }
172
- else if (valueFormat === 'name') {
173
- emit(layers[0].icon, layers[0].icon);
193
+ else if (valueFormat === 'html') {
194
+ setPending(layers);
174
195
  }
175
196
  else {
176
- setPending(layers);
197
+ emit(formatIconValue(layers, valueFormat, { shortName }), layers);
177
198
  }
178
- }, [valueFormat, emit]);
199
+ }, [valueFormat, emit, shortName]);
179
200
  // The HTML is the icon as drawn: the hidden copy below renders the pending stack, and its
180
201
  // markup — ids renamed after the drawing — is the new value, emitted before the paint.
181
202
  useIsoLayoutEffect(() => {
@@ -186,7 +207,7 @@ const NiceIconPicker = /* @__PURE__ */ forwardRef(function NiceIconPicker({ icon
186
207
  const svg = (_a = serializerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('svg');
187
208
  setPending(null);
188
209
  if (svg) {
189
- emit(scopeIconHtmlIds(svg.outerHTML), pending[0].icon);
210
+ emit(scopeIconHtmlIds(svg.outerHTML), pending);
190
211
  }
191
212
  }, [pending, emit]);
192
213
  const selectedValues = useMemo(() => (multiSelect ? values : base ? [base.icon] : NO_NAMES), [multiSelect, values, base]);
@@ -0,0 +1,41 @@
1
+ import { jsx, Fragment } from 'react/jsx-runtime';
2
+ import { renderIconStack } from './iconStack.js';
3
+ import { parseIconValue } from './iconValue.js';
4
+
5
+ /** The value's layers: a name the resolver knows as is (it may hold the code's signs), else parsed. */
6
+ function layersOf(value, icons) {
7
+ const text = value === null || value === void 0 ? void 0 : value.trim();
8
+ if (!text) {
9
+ return null;
10
+ }
11
+ const known = typeof icons === 'function' ? icons(text) : icons[text];
12
+ const plain = [{ id: '1', icon: text }];
13
+ return known ? plain : parseIconValue(text);
14
+ }
15
+ /**
16
+ * NiceIconValue (1.3.10) — shows an icon as NiceIconPicker stored it, whatever the format: a name,
17
+ * the code of a stack, JSON or HTML. It draws the icon again from the data; stored markup is never
18
+ * injected, so a value from a database cannot run anything. The rest of the props go to the base
19
+ * icon.
20
+ */
21
+ function NiceIconValue({ value, icons, values, fallback = null, ...baseProps }) {
22
+ const layers = layersOf(value, icons);
23
+ const drawn = layers ? renderIconStack(layers, icons, { baseProps, values }) : null;
24
+ return jsx(Fragment, { children: drawn !== null && drawn !== void 0 ? drawn : fallback });
25
+ }
26
+ if (process.env.NODE_ENV !== 'production') {
27
+ NiceIconValue.displayName = 'NiceIconValue';
28
+ }
29
+ /**
30
+ * NiceIconHtml (1.3.9) — shows an icon kept as HTML.
31
+ *
32
+ * @deprecated Since 1.3.10 use `NiceIconValue`, which reads every format the picker writes.
33
+ */
34
+ function NiceIconHtml({ html, ...props }) {
35
+ return jsx(NiceIconValue, { value: html, ...props });
36
+ }
37
+ if (process.env.NODE_ENV !== 'production') {
38
+ NiceIconHtml.displayName = 'NiceIconHtml';
39
+ }
40
+
41
+ export { NiceIconHtml, NiceIconValue };
@@ -1,6 +1,8 @@
1
1
  export { AnimationController, InteractiveIcon, PRESET_INTERACTIONS, PRESET_SEQUENCES, createAnimationSequence, createClickAnimation, createHoverAnimation, createVisibilityAnimation, useAnimationSequence } from './animationControls.js';
2
2
  export { NiceIconPicker } from './NiceIconPicker.js';
3
- export { NiceIconHtml, parseIconHtml } from './iconHtml.js';
3
+ export { NiceIconHtml, NiceIconValue } from './NiceIconValue.js';
4
+ export { formatIconValue, parseIconValue } from './iconValue.js';
5
+ export { parseIconHtml } from './iconHtml.js';
4
6
  export { NiceIconStacker } from './NiceIconStacker.js';
5
7
  export { NiceIconStack, addStackLayer, iconDisplayName, isValidTextBinding, niceIconStackCode, removeStackLayer, renderIconStack } from './iconStack.js';
6
8
  export { NtdIconMorph, NtdMorphPair, NtdPathMorph, useMorphState } from './NtdIconMorph.js';