@buoy-gg/floating-tools-core 7.0.4 → 7.0.6

package/lib/module/icons/generated/icon-data.g.js

@@ -0,0 +1,5198 @@
+"use strict";
+
+// GENERATED by scripts/gen-icons.mjs — DO NOT EDIT.
+// Source of truth: shared/icons/*.json  (format: shared/icons/SPEC.md)
+//
+// To change an icon, edit its JSON and re-run `node scripts/gen-icons.mjs`.
+
+// ===========================================
+// BENCHMARK
+// ===========================================
+
+export const BENCHMARK_ICON_COLOR = '#F59E0B';
+export const benchmarkIconData = {
+  color: BENCHMARK_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 1,
+    r: 7,
+    border: true,
+    borderWidth: 1.5,
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 1,
+    r: 5,
+    fill: 'color',
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -2,
+    y: -10,
+    width: 4,
+    height: 3,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -1,
+    y: -7.5,
+    width: 2,
+    height: 2,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -0.75,
+    y: -4,
+    width: 1.5,
+    height: 5,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.9,
+    rotation: -45,
+    rotateFromCenter: true
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 1,
+    r: 1,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -0.5,
+    y: -5,
+    width: 1,
+    height: 2,
+    fill: 'color',
+    opacity: 0.5
+  }, {
+    type: 'rect',
+    x: 4,
+    y: 0.5,
+    width: 2,
+    height: 1,
+    fill: 'color',
+    opacity: 0.5
+  }, {
+    type: 'rect',
+    x: -0.5,
+    y: 5,
+    width: 1,
+    height: 2,
+    fill: 'color',
+    opacity: 0.5
+  }, {
+    type: 'rect',
+    x: -6,
+    y: 0.5,
+    width: 2,
+    height: 1,
+    fill: 'color',
+    opacity: 0.5
+  }]
+};
+
+// ===========================================
+// CONSOLE
+// ===========================================
+
+export const CONSOLE_ICON_COLOR = '#10B981';
+export const consoleIconData = {
+  color: CONSOLE_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -10,
+    width: 20,
+    height: 20,
+    fill: 'color',
+    borderRadius: 4.5,
+    opacity: 0.08
+  }, {
+    type: 'rect',
+    x: -10,
+    y: -10,
+    width: 20,
+    height: 20,
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 4.5,
+    opacity: 0.9,
+    glow: true,
+    glowRadius: 3
+  }, {
+    type: 'line',
+    x1: -5.5,
+    y1: -3.4,
+    x2: -1.8,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 1.7
+  }, {
+    type: 'line',
+    x1: -1.8,
+    y1: 0,
+    x2: -5.5,
+    y2: 3.4,
+    stroke: 'color',
+    strokeWidth: 1.7
+  }, {
+    type: 'line',
+    x1: 0.8,
+    y1: 3.6,
+    x2: 5.6,
+    y2: 3.6,
+    stroke: 'color',
+    strokeWidth: 1.7,
+    opacity: 0.9
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-A
+// ===========================================
+
+export const curveTestAData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 6,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 3,
+    opacity: 1,
+    scaleX: 1.5,
+    scaleY: 0.8
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-B
+// ===========================================
+
+export const curveTestBData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 6,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 3,
+    opacity: 1,
+    scaleX: 0.6,
+    scaleY: 1.4
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-C
+// ===========================================
+
+export const curveTestCData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -4,
+    width: 20,
+    height: 8,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 3,
+    borderRadius: 4,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-D
+// ===========================================
+
+export const curveTestDData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -4,
+    width: 20,
+    height: 8,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 4,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-E
+// ===========================================
+
+export const curveTestEData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -4,
+    width: 20,
+    height: 8,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 2,
+    borderRadius: 4,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-F
+// ===========================================
+
+export const curveTestFData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -4,
+    width: 20,
+    height: 8,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 2,
+    borderRadius: 4,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-G
+// ===========================================
+
+export const curveTestGData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -6,
+    y: -3,
+    width: 16,
+    height: 6,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-H
+// ===========================================
+
+export const curveTestHData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -22,
+    y: -3,
+    width: 16,
+    height: 6,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-I
+// ===========================================
+
+export const curveTestIData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -7,
+    width: 20,
+    height: 6,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -12,
+    y: 1,
+    width: 20,
+    height: 6,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-J
+// ===========================================
+
+export const curveTestJData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -6,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -12,
+    y: 1,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-K
+// ===========================================
+
+export const curveTestKData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -5,
+    width: 20,
+    height: 4,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1,
+    borderRadius: 2,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -12,
+    y: 1,
+    width: 20,
+    height: 4,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1,
+    borderRadius: 2,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-L
+// ===========================================
+
+export const curveTestLData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -6,
+    y: -8,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -14,
+    y: 3,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-M
+// ===========================================
+
+export const curveTestMData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -7,
+    y: -5,
+    width: 18,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -11,
+    y: 0,
+    width: 18,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-N
+// ===========================================
+
+export const curveTestNData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -6,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2.5,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -12,
+    y: 1,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2.5,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-O
+// ===========================================
+
+export const curveTestOData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -6,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1,
+    borderRadius: 2.5,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -12,
+    y: 1,
+    width: 20,
+    height: 5,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1,
+    borderRadius: 2.5,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// CURVE-TEST-P
+// ===========================================
+
+export const curveTestPData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -7,
+    width: 20,
+    height: 7,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3.5,
+    opacity: 1
+  }, {
+    type: 'rect',
+    x: -12,
+    y: 0,
+    width: 20,
+    height: 7,
+    fill: 'transparent',
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3.5,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// ENV
+// ===========================================
+
+export const ENV_ICON_COLOR = '#4AFF9F';
+export const envIconData = {
+  color: ENV_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -11,
+    y: 3,
+    width: 22,
+    height: 10,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -10,
+    y: 4,
+    width: 20,
+    height: 8,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.85
+  }, {
+    type: 'rect',
+    x: -9,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -7,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -5,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -3,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -1,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 1,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 3,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 5,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 7,
+    y: 5.5,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -8,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -6,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -4,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -2,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 0,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 2,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 4,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: 6,
+    y: 7.2,
+    width: 1.5,
+    height: 1.2,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -5,
+    y: 9.5,
+    width: 10,
+    height: 1,
+    fill: '#000',
+    borderRadius: 0.2,
+    opacity: 0.25
+  }, {
+    type: 'rect',
+    x: -9,
+    y: -10,
+    width: 18,
+    height: 12,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -8,
+    y: -9,
+    width: 16,
+    height: 10,
+    fill: '#000',
+    borderRadius: 0.5,
+    opacity: 0.5
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -8,
+    width: 10,
+    height: 0.5,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -6,
+    width: 7,
+    height: 0.5,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -4,
+    width: 4,
+    height: 0.5,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -1,
+    y: 10,
+    width: 2,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.8
+  }, {
+    type: 'rect',
+    x: -3.6000000000000005,
+    y: -6.4,
+    width: 1,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.4
+  }, {
+    type: 'rect',
+    x: 3.5999999999999996,
+    y: -6.4,
+    width: 1,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.4
+  }, {
+    type: 'rect',
+    x: 0,
+    y: -1.6000000000000014,
+    width: 1,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.4
+  }]
+};
+
+// ===========================================
+// EVENTS
+// ===========================================
+
+export const EVENTS_ICON_COLOR = '#00D4FF';
+export const eventsIconData = {
+  color: EVENTS_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: -7,
+    cy: -7,
+    r: 2.5,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: -7,
+    cy: -7,
+    r: 1.4,
+    fill: '#000000',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: -7,
+    cy: 0,
+    r: 2.5,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: -7,
+    cy: 0,
+    r: 1.4,
+    fill: '#000000',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: -7,
+    cy: 7,
+    r: 2.5,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: -7,
+    cy: 7,
+    r: 1.4,
+    fill: '#000000',
+    opacity: 1
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -4.2,
+    x2: -7,
+    y2: -2.8,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.8
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 2.8,
+    x2: -7,
+    y2: 4.2,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.8
+  }, {
+    type: 'line',
+    x1: -4.2,
+    y1: -7,
+    x2: -1,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.7
+  }, {
+    type: 'line',
+    x1: -4.2,
+    y1: 0,
+    x2: -1,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.7
+  }, {
+    type: 'line',
+    x1: -4.2,
+    y1: 7,
+    x2: -1,
+    y2: 7,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.7
+  }, {
+    type: 'rect',
+    x: -1,
+    y: -10,
+    width: 11,
+    height: 6,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.95
+  }, {
+    type: 'rect',
+    x: 0,
+    y: -9,
+    width: 9,
+    height: 4,
+    fill: '#000000',
+    borderRadius: 0.5,
+    opacity: 1
+  }, {
+    type: 'line',
+    x1: 1.5,
+    y1: -7.5,
+    x2: 7.5,
+    y2: -7.5,
+    stroke: 'color',
+    strokeWidth: 1.2,
+    opacity: 0.8
+  }, {
+    type: 'line',
+    x1: 1.5,
+    y1: -5.8,
+    x2: 6,
+    y2: -5.8,
+    stroke: 'color',
+    strokeWidth: 1.2,
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -1,
+    y: -3,
+    width: 11,
+    height: 6,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.95
+  }, {
+    type: 'rect',
+    x: 0,
+    y: -2,
+    width: 9,
+    height: 4,
+    fill: '#000000',
+    borderRadius: 0.5,
+    opacity: 1
+  }, {
+    type: 'line',
+    x1: 1.5,
+    y1: -0.5,
+    x2: 7.5,
+    y2: -0.5,
+    stroke: 'color',
+    strokeWidth: 1.2,
+    opacity: 0.8
+  }, {
+    type: 'line',
+    x1: 1.5,
+    y1: 1.2,
+    x2: 5,
+    y2: 1.2,
+    stroke: 'color',
+    strokeWidth: 1.2,
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -1,
+    y: 4,
+    width: 11,
+    height: 6,
+    fill: 'color',
+    borderRadius: 1,
+    opacity: 0.95
+  }, {
+    type: 'rect',
+    x: 0,
+    y: 5,
+    width: 9,
+    height: 4,
+    fill: '#000000',
+    borderRadius: 0.5,
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: 2,
+    cy: 6.2,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 4,
+    cy: 6.2,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 6,
+    cy: 6.2,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 8,
+    cy: 6.2,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 2,
+    cy: 8,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 4,
+    cy: 8,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 6,
+    cy: 8,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 8,
+    cy: 8,
+    r: 0.6,
+    fill: 'color',
+    opacity: 0.9
+  }]
+};
+
+// ===========================================
+// HIGHLIGHT
+// ===========================================
+
+export const HIGHLIGHT_ICON_COLOR = '#10B981';
+export const highlightIconData = {
+  color: HIGHLIGHT_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -10,
+    width: 20,
+    height: 20,
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 3,
+    opacity: 0.2
+  }, {
+    type: 'rect',
+    x: -7.5,
+    y: -7.5,
+    width: 15,
+    height: 15,
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2.5,
+    opacity: 0.4
+  }, {
+    type: 'rect',
+    x: -6,
+    y: -6,
+    width: 12,
+    height: 12,
+    fill: 'color',
+    borderRadius: 2,
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -5,
+    y: -5,
+    width: 10,
+    height: 10,
+    fill: 'color',
+    borderRadius: 1.5,
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -3.5,
+    y: -3.5,
+    width: 7,
+    height: 7,
+    fill: '#000',
+    borderRadius: 1,
+    opacity: 0.4
+  }, {
+    type: 'rect',
+    x: -2,
+    y: -2,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.7
+  }, {
+    type: 'rect',
+    x: -2,
+    y: 0,
+    width: 3,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.5
+  }, {
+    type: 'rect',
+    x: -2,
+    y: 2,
+    width: 2,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.4
+  }, {
+    type: 'rect',
+    x: -3,
+    y: -4.5,
+    width: 6,
+    height: 1.5,
+    fill: '#fff',
+    borderRadius: 0.75,
+    opacity: 0.2
+  }, {
+    type: 'circle',
+    cx: -8,
+    cy: -8,
+    r: 1,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'circle',
+    cx: 8,
+    cy: -8,
+    r: 1,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'circle',
+    cx: -8,
+    cy: 8,
+    r: 1,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'circle',
+    cx: 8,
+    cy: 8,
+    r: 1,
+    fill: 'color',
+    opacity: 0.6
+  }]
+};
+
+// ===========================================
+// HIGHLIGHTER
+// ===========================================
+
+export const HIGHLIGHTER_ICON_COLOR = '#10B981';
+export const RENDERS_ICON_COLOR = HIGHLIGHTER_ICON_COLOR;
+export const highlighterIconData = {
+  color: HIGHLIGHTER_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -9.1706052144883,
+    y: 5.692099788303082,
+    width: 3.478505426185217,
+    height: 3.478505426185217,
+    fill: 'color',
+    rotation: 45
+  }, {
+    type: 'rect',
+    x: -10.119288512538814,
+    y: 8.538149682454623,
+    width: 6,
+    height: 4,
+    fill: 'bg'
+  }, {
+    type: 'line',
+    x1: -10.119288512538814,
+    y1: 7.905694150420948,
+    x2: -6.640783086353596,
+    y2: 7.905694150420948,
+    stroke: 'color',
+    strokeWidth: 1.5
+  }, {
+    type: 'line',
+    x1: -6.957010852370434,
+    y1: 5.059644256269407,
+    x2: -2.846049894151541,
+    y2: 5.059644256269407,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    rotation: 44
+  }, {
+    type: 'line',
+    x1: -5.91,
+    y1: -4.11,
+    x2: 7.27,
+    y2: -4.33,
+    stroke: 'color',
+    strokeWidth: 2.1,
+    rotation: 145
+  }, {
+    type: 'line',
+    x1: -1.56,
+    y1: 1.05,
+    x2: 10.435516278555651,
+    y2: -2.846049894151541,
+    stroke: 'color',
+    strokeWidth: 2.1,
+    rotation: 145
+  }, {
+    type: 'line',
+    x1: 4.110960958218893,
+    y1: -6.640783086353596,
+    x2: 9.486832980505138,
+    y2: -6.640783086353596,
+    stroke: 'color',
+    strokeWidth: 2.2,
+    rotation: 44
+  }, {
+    type: 'line',
+    x1: -4.743416490252569,
+    y1: -1.5811388300841895,
+    x2: 1.5811388300841895,
+    y2: 4.743416490252569,
+    stroke: 'color',
+    strokeWidth: 2.9
+  }, {
+    type: 'line',
+    x1: -6.957010852370434,
+    y1: 1.2649110640673518,
+    x2: -2.2135943621178655,
+    y2: 2.2135943621178655,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    rotation: 77
+  }, {
+    type: 'line',
+    x1: -1.2649110640673518,
+    y1: 0.9486832980505138,
+    x2: -2.5298221281347035,
+    y2: 7.905694150420948,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    rotation: 77
+  }, {
+    type: 'rect',
+    x: -4.427188724235731,
+    y: 0.9486832980505138,
+    width: 3.794733192202055,
+    height: 4.110960958218893,
+    fill: 'color'
+  }, {
+    type: 'line',
+    x1: -7.58946638440411,
+    y1: 1.8973665961010275,
+    x2: -0.9486832980505138,
+    y2: 1.8973665961010275,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    rotation: -48
+  }, {
+    type: 'line',
+    x1: -5.375872022286244,
+    y1: 4.110960958218893,
+    x2: 1.2649110640673518,
+    y2: 4.110960958218893,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    rotation: -48
+  }]
+};
+
+/** Legacy alias — same object identity as highlighterIconData. */
+export const rendersIconData = highlighterIconData;
+
+// ===========================================
+// IMAGE-OVERLAY
+// ===========================================
+
+export const IMAGE_OVERLAY_ICON_COLOR = '#A855F7';
+export const imageOverlayIconData = {
+  color: IMAGE_OVERLAY_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -10,
+    width: 14,
+    height: 14,
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2,
+    opacity: 0.25
+  }, {
+    type: 'rect',
+    x: -5,
+    y: -5,
+    width: 15,
+    height: 15,
+    fill: 'color',
+    borderRadius: 2.5,
+    opacity: 0.12
+  }, {
+    type: 'rect',
+    x: -4,
+    y: -4,
+    width: 14,
+    height: 14,
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 2,
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 0.5,
+    cy: 0.5,
+    r: 1.5,
+    fill: 'color',
+    opacity: 0.8
+  }, {
+    type: 'line',
+    x1: -1.915,
+    y1: 10.69,
+    x2: 3,
+    y2: 7.25,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.7
+  }, {
+    type: 'line',
+    x1: 2.5,
+    y1: 7.25,
+    x2: 7.415,
+    y2: 10.69,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 0.7
+  }, {
+    type: 'circle',
+    cx: -10,
+    cy: -10,
+    r: 1,
+    fill: 'color',
+    opacity: 0.5
+  }, {
+    type: 'circle',
+    cx: 4,
+    cy: -10,
+    r: 1,
+    fill: 'color',
+    opacity: 0.5
+  }, {
+    type: 'circle',
+    cx: -10,
+    cy: 4,
+    r: 1,
+    fill: 'color',
+    opacity: 0.5
+  }, {
+    type: 'rect',
+    x: -1,
+    y: -3.5,
+    width: 8,
+    height: 1.5,
+    fill: '#ffffff',
+    borderRadius: 0.75,
+    opacity: 0.15
+  }]
+};
+
+// ===========================================
+// IMAGES
+// ===========================================
+
+export const IMAGES_ICON_COLOR = '#C084FC';
+export const imagesIconData = {
+  color: IMAGES_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -10,
+    width: 20,
+    height: 20,
+    fill: 'color',
+    borderRadius: 4.5,
+    opacity: 0.08
+  }, {
+    type: 'rect',
+    x: -10,
+    y: -10,
+    width: 20,
+    height: 20,
+    border: true,
+    borderWidth: 1.5,
+    borderRadius: 4.5,
+    opacity: 0.9,
+    glow: true,
+    glowRadius: 3
+  }, {
+    type: 'circle',
+    cx: 4.3,
+    cy: -4.4,
+    r: 1.9,
+    fill: 'color',
+    opacity: 0.95
+  }, {
+    type: 'triangle',
+    x: 3.6,
+    y: 6.4,
+    size: 4.6,
+    direction: 'up',
+    fill: 'color',
+    opacity: 0.55
+  }, {
+    type: 'triangle',
+    x: -1.8,
+    y: 6.4,
+    size: 7.6,
+    direction: 'up',
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'line',
+    x1: -6.8,
+    y1: 6.4,
+    x2: 6.8,
+    y2: 6.4,
+    stroke: 'color',
+    strokeWidth: 1.2,
+    opacity: 0.35
+  }]
+};
+
+// ===========================================
+// IMPERSONATE
+// ===========================================
+
+export const IMPERSONATE_ICON_COLOR = '#F59E0B';
+export const impersonateIconData = {
+  color: IMPERSONATE_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 4.5,
+    cy: -5.5,
+    r: 2.8,
+    border: true,
+    borderWidth: 1.4,
+    opacity: 0.28
+  }, {
+    type: 'rect',
+    x: 0.2,
+    y: -1.2,
+    width: 8.6,
+    height: 8,
+    border: true,
+    borderWidth: 1.4,
+    borderRadius: 4,
+    opacity: 0.28
+  }, {
+    type: 'rect',
+    x: -8.4,
+    y: 0,
+    width: 11.8,
+    height: 9,
+    fill: 'bg',
+    border: true,
+    borderWidth: 1.7,
+    borderRadius: 5,
+    opacity: 0.95
+  }, {
+    type: 'circle',
+    cx: -2.5,
+    cy: -5,
+    r: 3.6,
+    fill: 'bg',
+    border: true,
+    borderWidth: 1.7,
+    glow: true,
+    glowRadius: 3
+  }, {
+    type: 'rect',
+    x: -6.1,
+    y: -5.9,
+    width: 7.2,
+    height: 1.7,
+    fill: 'color',
+    borderRadius: 0.85,
+    opacity: 0.9
+  }]
+};
+
+// ===========================================
+// JOTAI
+// ===========================================
+
+export const JOTAI_ICON_COLOR = '#6C47FF';
+export const jotaiIconData = {
+  color: JOTAI_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 9.5,
+    border: true,
+    borderWidth: 1.4,
+    opacity: 0.5,
+    scaleY: 0.38
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 9.5,
+    border: true,
+    borderWidth: 1.4,
+    opacity: 0.5,
+    scaleX: 0.38
+  }, {
+    type: 'circle',
+    cx: 8.8,
+    cy: 0,
+    r: 1.35,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: -8.8,
+    r: 1.35,
+    fill: 'color',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 2.9,
+    fill: 'color',
+    glow: true,
+    glowRadius: 4
+  }]
+};
+
+// ===========================================
+// NETWORK
+// ===========================================
+
+export const NETWORK_ICON_COLOR = '#00D4FF';
+export const networkIconData = {
+  color: NETWORK_ICON_COLOR,
+  bgColor: 'rgba(8, 12, 21, 0.95)',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 9,
+    fill: 'bg',
+    border: true,
+    borderWidth: 2,
+    glow: true,
+    glowRadius: 4
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 9,
+    border: true,
+    borderWidth: 2,
+    opacity: 0.6,
+    scaleX: 0.45
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 9,
+    border: true,
+    borderWidth: 2,
+    opacity: 0.6,
+    scaleX: 1.33,
+    scaleY: 0.6
+  }]
+};
+
+// ===========================================
+// QUERY
+// ===========================================
+
+export const QUERY_ICON_COLOR = '#FF3366';
+export const queryIconData = {
+  color: QUERY_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 0,
+    y2: -8,
+    stroke: '#10B981',
+    strokeWidth: 1.2,
+    opacity: 0.5
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 7.6,
+    y2: -2.5,
+    stroke: '#3B82F6',
+    strokeWidth: 1.2,
+    opacity: 0.5
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 4.7,
+    y2: 6.5,
+    stroke: '#F59E0B',
+    strokeWidth: 1.2,
+    opacity: 0.5
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: -4.7,
+    y2: 6.5,
+    stroke: '#8B5CF6',
+    strokeWidth: 1.2,
+    opacity: 0.5
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: -7.6,
+    y2: -2.5,
+    stroke: '#6B7280',
+    strokeWidth: 1.2,
+    opacity: 0.5
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: -8,
+    r: 2.2,
+    fill: '#10B981',
+    opacity: 0.2
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: -8,
+    r: 1.6,
+    fill: '#10B981',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 7.6,
+    cy: -2.5,
+    r: 2.2,
+    fill: '#3B82F6',
+    opacity: 0.2
+  }, {
+    type: 'circle',
+    cx: 7.6,
+    cy: -2.5,
+    r: 1.6,
+    fill: '#3B82F6',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 4.7,
+    cy: 6.5,
+    r: 2.2,
+    fill: '#F59E0B',
+    opacity: 0.2
+  }, {
+    type: 'circle',
+    cx: 4.7,
+    cy: 6.5,
+    r: 1.6,
+    fill: '#F59E0B',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: -4.7,
+    cy: 6.5,
+    r: 2.2,
+    fill: '#8B5CF6',
+    opacity: 0.2
+  }, {
+    type: 'circle',
+    cx: -4.7,
+    cy: 6.5,
+    r: 1.6,
+    fill: '#8B5CF6',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: -7.6,
+    cy: -2.5,
+    r: 2.2,
+    fill: '#6B7280',
+    opacity: 0.2
+  }, {
+    type: 'circle',
+    cx: -7.6,
+    cy: -2.5,
+    r: 1.6,
+    fill: '#6B7280',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 4.5,
+    fill: 'color',
+    opacity: 0.1
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 3,
+    fill: 'color',
+    opacity: 0.95
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 1.3,
+    fill: '#fff',
+    opacity: 0.35
+  }]
+};
+
+// ===========================================
+// REDUX
+// ===========================================
+
+export const REDUX_ICON_COLOR = '#764abc';
+export const reduxIconData = {
+  color: REDUX_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: -1.16,
+    cy: -2.2135943621178655,
+    r: 1.4,
+    fill: 'color',
+    opacity: 1,
+    scaleX: 1,
+    scaleY: 1
+  }, {
+    type: 'circle',
+    cx: -2.846049894151541,
+    cy: 4.110960958218893,
+    r: 1.4,
+    fill: 'color',
+    opacity: 1,
+    scaleX: 1,
+    scaleY: 1
+  }, {
+    type: 'circle',
+    cx: 3.89,
+    cy: 2.31,
+    r: 1.4,
+    fill: 'color',
+    opacity: 1,
+    scaleX: 1,
+    scaleY: 1
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -2.2135943621178655,
+    x2: 3.162277660168379,
+    y2: 8.538149682454623,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 1,
+    curveX: 8.221921916437786,
+    curveY: -6.00832755431992,
+    curve2X: 12.01665510863984,
+    curve2Y: 7.273238618387272
+  }, {
+    type: 'line',
+    x1: -7.273238618387272,
+    y1: 0.31622776601683794,
+    x2: 3.478505426185217,
+    y2: 3.162277660168379,
+    stroke: 'color',
+    strokeWidth: 1.5,
+    opacity: 1,
+    curveX: -12.01665510863984,
+    curveY: 10.435516278555651,
+    curve2X: 4.427188724235731,
+    curve2Y: 7.58946638440411
+  }, {
+    type: 'line',
+    x1: 4.743416490252569,
+    y1: -3.794733192202055,
+    x2: -3.478505426185217,
+    y2: 3.478505426185217,
+    stroke: 'color',
+    strokeWidth: 1.1,
+    opacity: 1,
+    curveX: 3.162277660168379,
+    curveY: -11.384199576606164,
+    curve2X: -9.803060746521975,
+    curve2Y: -10.119288512538814
+  }]
+};
+
+// ===========================================
+// ROUTE-DOT
+// ===========================================
+
+export const routeDotIconData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 8,
+    fill: 'color',
+    opacity: 0.3
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 3,
+    fill: 'bg',
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// ROUTE-PATH
+// ===========================================
+
+export const routePathIconData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'smootharc',
+    cx: -3,
+    cy: -2,
+    r: 5,
+    portion: 'bottom',
+    stroke: 'color',
+    strokeWidth: 3,
+    opacity: 1
+  }, {
+    type: 'smootharc',
+    cx: 3,
+    cy: 2,
+    r: 5,
+    portion: 'top',
+    stroke: 'color',
+    strokeWidth: 3,
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// ROUTE-PIN
+// ===========================================
+
+export const routePinIconData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: -2,
+    r: 5,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'triangle',
+    x: 0,
+    y: 4,
+    size: 5,
+    direction: 'down',
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: -2,
+    r: 2,
+    fill: 'bg',
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// ROUTE-TWO-PINS
+// ===========================================
+
+export const routeTwoPinsIconData = {
+  color: '#FF9F1C',
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: -6,
+    cy: 4,
+    r: 3.5,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'triangle',
+    x: -6,
+    y: 8.5,
+    size: 3.5,
+    direction: 'down',
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: -6,
+    cy: 4,
+    r: 1.4,
+    fill: 'bg',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: 6,
+    cy: -5,
+    r: 3.5,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'triangle',
+    x: 6,
+    y: -0.5,
+    size: 3.5,
+    direction: 'down',
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'circle',
+    cx: 6,
+    cy: -5,
+    r: 1.4,
+    fill: 'bg',
+    opacity: 1
+  }]
+};
+
+// ===========================================
+// ROUTES
+// ===========================================
+
+export const ROUTES_ICON_COLOR = '#FF9F1C';
+export const routesIconData = {
+  color: ROUTES_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 2.846049894151541,
+    cy: 1.2649110640673518,
+    r: 4.110960958218893,
+    fill: '#FF9F1C',
+    scaleY: 0.94
+  }, {
+    type: 'circle',
+    cx: 6.00832755431992,
+    cy: 6.324555320336758,
+    r: 4,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: 6.324555320336758,
+    cy: -6.324555320336758,
+    r: 3.794733192202055,
+    fill: 'color',
+    scaleY: 0.97
+  }, {
+    type: 'circle',
+    cx: 6.324555320336758,
+    cy: -6.00832755431992,
+    r: 1.5811388300841895,
+    fill: 'bg'
+  }, {
+    type: 'circle',
+    cx: -6.324555320336758,
+    cy: 3.478505426185217,
+    r: 3.794733192202055,
+    fill: 'color',
+    scaleY: 0.97
+  }, {
+    type: 'circle',
+    cx: -6.324555320336758,
+    cy: 3.478505426185217,
+    r: 1.5811388300841895,
+    fill: 'bg'
+  }, {
+    type: 'line',
+    x1: -8.854377448471462,
+    y1: 4.743416490252569,
+    x2: -6.00832755431992,
+    y2: 9.803060746521975,
+    stroke: 'color',
+    strokeWidth: 1.5
+  }, {
+    type: 'line',
+    x1: -3.162277660168379,
+    y1: 3.162277660168379,
+    x2: -6.640783086353596,
+    y2: 9.803060746521975,
+    stroke: 'color',
+    strokeWidth: 1.8
+  }, {
+    type: 'rect',
+    x: -7.273238618387272,
+    y: 6.324555320336758,
+    width: 1.8973665961010275,
+    height: 2.2135943621178655,
+    fill: 'color'
+  }, {
+    type: 'line',
+    x1: 1.2649110640673518,
+    y1: 1.2649110640673518,
+    x2: 9.1706052144883,
+    y2: 1.2649110640673518,
+    stroke: 'bg',
+    strokeWidth: 2.4
+  }, {
+    type: 'line',
+    x1: 9.486832980505138,
+    y1: -6.640783086353596,
+    x2: 6.00832755431992,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 1.8
+  }, {
+    type: 'line',
+    x1: 3.478505426185217,
+    y1: -5.375872022286244,
+    x2: 6.640783086353596,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 1.5
+  }, {
+    type: 'rect',
+    x: 5.692099788303082,
+    y: -3.478505426185217,
+    width: 1.8973665961010275,
+    height: 2.2135943621178655,
+    fill: 'color'
+  }, {
+    type: 'rect',
+    x: 2.846049894151541,
+    y: 10,
+    width: 6,
+    height: 4,
+    fill: 'bg'
+  }, {
+    type: 'line',
+    x1: -0.31622776601683794,
+    y1: 6.324555320336758,
+    x2: 7.58946638440411,
+    y2: 6.324555320336758,
+    stroke: 'bg',
+    strokeWidth: 2.3
+  }, {
+    type: 'rect',
+    x: -2.5298221281347035,
+    y: 7.5,
+    width: 7.273238618387272,
+    height: 2.5,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// SENTRY
+// ===========================================
+
+export const SENTRY_ICON_COLOR = '#FF3366';
+export const sentryIconData = {
+  color: SENTRY_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 1,
+    r: 8,
+    fill: 'color',
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -6,
+    y: -4,
+    width: 12,
+    height: 14,
+    fill: 'color',
+    borderRadius: 6,
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -4,
+    y: -9,
+    width: 8,
+    height: 6,
+    fill: 'color',
+    borderRadius: 4,
+    opacity: 0.95
+  }, {
+    type: 'rect',
+    x: -3,
+    y: -12,
+    width: 0.8,
+    height: 4,
+    fill: 'color',
+    opacity: 0.7,
+    rotation: -15
+  }, {
+    type: 'circle',
+    cx: -4,
+    cy: -12,
+    r: 1.2,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: 2.2,
+    y: -12,
+    width: 0.8,
+    height: 4,
+    fill: 'color',
+    opacity: 0.7,
+    rotation: 15
+  }, {
+    type: 'circle',
+    cx: 4,
+    cy: -12,
+    r: 1.2,
+    fill: 'color',
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -10,
+    y: -2,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    opacity: 0.8,
+    rotation: -20
+  }, {
+    type: 'rect',
+    x: -10,
+    y: 1,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    opacity: 0.8,
+    rotation: -10
+  }, {
+    type: 'rect',
+    x: -10,
+    y: 4,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    opacity: 0.8,
+    rotation: 10
+  }, {
+    type: 'rect',
+    x: 6,
+    y: -2,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    opacity: 0.8,
+    rotation: 20
+  }, {
+    type: 'rect',
+    x: 6,
+    y: 1,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    opacity: 0.8,
+    rotation: 10
+  }, {
+    type: 'rect',
+    x: 6,
+    y: 4,
+    width: 4,
+    height: 1,
+    fill: 'color',
+    opacity: 0.8,
+    rotation: -10
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 1,
+    r: 1,
+    fill: '#fff',
+    opacity: 0.3
+  }]
+};
+
+// ===========================================
+// STORAGE
+// ===========================================
+
+export const STORAGE_ICON_COLOR = '#FFB800';
+export const storageIconData = {
+  color: STORAGE_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'rect',
+    x: -9,
+    y: -7,
+    width: 18,
+    height: 8,
+    fill: 'color',
+    borderRadius: 4,
+    opacity: 0.1
+  }, {
+    type: 'rect',
+    x: -8,
+    y: -6,
+    width: 16,
+    height: 6,
+    fill: 'color',
+    borderRadius: 3,
+    opacity: 0.9
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -5.5,
+    width: 14,
+    height: 2,
+    fill: '#fff',
+    borderRadius: 1,
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -8,
+    y: -6,
+    width: 16,
+    height: 6,
+    border: true,
+    borderWidth: 0.5,
+    borderRadius: 3,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -9,
+    y: -2.2,
+    width: 18,
+    height: 8,
+    fill: 'color',
+    borderRadius: 4,
+    opacity: 0.1
+  }, {
+    type: 'rect',
+    x: -8,
+    y: -1.2,
+    width: 16,
+    height: 6,
+    fill: 'color',
+    borderRadius: 3,
+    opacity: 0.8
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -0.7,
+    width: 14,
+    height: 2,
+    fill: '#fff',
+    borderRadius: 1,
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -8,
+    y: -1.2,
+    width: 16,
+    height: 6,
+    border: true,
+    borderWidth: 0.5,
+    borderRadius: 3,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -9,
+    y: 2.6,
+    width: 18,
+    height: 8,
+    fill: 'color',
+    borderRadius: 4,
+    opacity: 0.1
+  }, {
+    type: 'rect',
+    x: -8,
+    y: 3.6,
+    width: 16,
+    height: 6,
+    fill: 'color',
+    borderRadius: 3,
+    opacity: 0.7
+  }, {
+    type: 'rect',
+    x: -7,
+    y: 4.1,
+    width: 14,
+    height: 2,
+    fill: '#fff',
+    borderRadius: 1,
+    opacity: 0.15
+  }, {
+    type: 'rect',
+    x: -8,
+    y: 3.6,
+    width: 16,
+    height: 6,
+    border: true,
+    borderWidth: 0.5,
+    borderRadius: 3,
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -0.25,
+    y: -3.6,
+    width: 0.5,
+    height: 6,
+    fill: 'color',
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -0.25,
+    y: 1.2,
+    width: 0.5,
+    height: 6,
+    fill: 'color',
+    opacity: 0.3
+  }, {
+    type: 'rect',
+    x: -0.5,
+    y: -3.5,
+    width: 1,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -0.5,
+    y: 1.3,
+    width: 1,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.6
+  }, {
+    type: 'rect',
+    x: -0.5,
+    y: 6.1,
+    width: 1,
+    height: 1,
+    fill: 'color',
+    borderRadius: 0.5,
+    opacity: 0.6
+  }]
+};
+
+// ===========================================
+// WIFI
+// ===========================================
+
+export const WIFI_ICON_COLOR = '#00D4FF';
+export const wifiIconData = {
+  color: WIFI_ICON_COLOR,
+  bgColor: '#000',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 6,
+    r: 2,
+    fill: 'color',
+    opacity: 1
+  }, {
+    type: 'smootharc',
+    cx: 0,
+    cy: 6,
+    r: 5,
+    portion: 'top',
+    stroke: 'color',
+    strokeWidth: 2,
+    opacity: 0.9
+  }, {
+    type: 'smootharc',
+    cx: 0,
+    cy: 6,
+    r: 8,
+    portion: 'top',
+    stroke: 'color',
+    strokeWidth: 2,
+    opacity: 0.7
+  }, {
+    type: 'smootharc',
+    cx: 0,
+    cy: 6,
+    r: 11,
+    portion: 'top',
+    stroke: 'color',
+    strokeWidth: 2,
+    opacity: 0.5
+  }]
+};
+
+// ===========================================
+// ZUSTAND
+// ===========================================
+
+export const ZUSTAND_ICON_COLOR = '#C08552';
+export const zustandIconData = {
+  color: ZUSTAND_ICON_COLOR,
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: -5.5,
+    cy: -6,
+    r: 2.9,
+    fill: 'color',
+    opacity: 0.95
+  }, {
+    type: 'circle',
+    cx: 5.5,
+    cy: -6,
+    r: 2.9,
+    fill: 'color',
+    opacity: 0.95
+  }, {
+    type: 'circle',
+    cx: -5.5,
+    cy: -6,
+    r: 1.3,
+    fill: 'bg',
+    opacity: 0.55
+  }, {
+    type: 'circle',
+    cx: 5.5,
+    cy: -6,
+    r: 1.3,
+    fill: 'bg',
+    opacity: 0.55
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0.5,
+    r: 7.5,
+    fill: 'color',
+    glow: true,
+    glowRadius: 4
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 3.6,
+    r: 3.4,
+    fill: 'bg',
+    opacity: 0.5
+  }, {
+    type: 'circle',
+    cx: -3,
+    cy: -1.2,
+    r: 1.15,
+    fill: 'bg',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 3,
+    cy: -1.2,
+    r: 1.15,
+    fill: 'bg',
+    opacity: 0.9
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 2.3,
+    r: 1.15,
+    fill: 'bg',
+    opacity: 0.9
+  }]
+};
+
+// ===========================================
+// ACTIVITY
+// ===========================================
+
+export const activityGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -9,
+    y1: 0,
+    x2: -5,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -5,
+    y1: 0,
+    x2: -2,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: -6,
+    x2: 2,
+    y2: 6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2,
+    y1: 6,
+    x2: 5,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 5,
+    y1: 0,
+    x2: 9,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// ALERT-CIRCLE
+// ===========================================
+
+export const alertCircleGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -5,
+    x2: 0,
+    y2: 1,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 4.5,
+    r: 1.05,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// ALERT-TRIANGLE
+// ===========================================
+
+export const alertTriangleGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -9,
+    x2: -9,
+    y2: 8,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -9,
+    x2: 9,
+    y2: 8,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: 8,
+    x2: 9,
+    y2: 8,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -3,
+    x2: 0,
+    y2: 1,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 4,
+    r: 1,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// ARROW-DOWN-TO-LINE
+// ===========================================
+
+export const arrowDownToLineGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -9,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -6,
+    y1: -3,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 6,
+    y1: -3,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 8,
+    x2: 8,
+    y2: 8,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// ARROW-DOWN
+// ===========================================
+
+export const arrowDownGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -7,
+    x2: 0,
+    y2: 7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 0,
+    x2: 0,
+    y2: 7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: 0,
+    x2: 0,
+    y2: 7,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// ARROW-UP
+// ===========================================
+
+export const arrowUpGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: 7,
+    x2: 0,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 0,
+    x2: 0,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: 0,
+    x2: 0,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// BAR-CHART
+// ===========================================
+
+export const barChartGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: 8,
+    x2: 0,
+    y2: -2,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 6,
+    y1: 8,
+    x2: 6,
+    y2: -8,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -6,
+    y1: 8,
+    x2: -6,
+    y2: 2,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// BOX
+// ===========================================
+
+export const boxGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 9,
+    y1: 4,
+    x2: 9,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: -4,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -9,
+    x2: -9,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: -4,
+    x2: -9,
+    y2: 4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: 4,
+    x2: 0,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 9,
+    x2: 9,
+    y2: 4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 9,
+    x2: 0,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: -9,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 9,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// BRACES
+// ===========================================
+
+export const bracesGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -3,
+    y1: -9,
+    x2: -6,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveX: -2.2
+  }, {
+    type: 'line',
+    x1: -6,
+    y1: 0,
+    x2: -3,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveX: -2.2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 0,
+    x2: -6,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 3,
+    y1: -9,
+    x2: 6,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveX: 2.2
+  }, {
+    type: 'line',
+    x1: 6,
+    y1: 0,
+    x2: 3,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveX: 2.2
+  }, {
+    type: 'line',
+    x1: 8,
+    y1: 0,
+    x2: 6,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// BUG
+// ===========================================
+
+export const bugGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -4,
+    y: -6,
+    width: 8,
+    height: 13,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 4
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: -2,
+    x2: -8,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: 3,
+    x2: -8,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -2,
+    x2: 8,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: 3,
+    x2: 8,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2.5,
+    y1: -7.5,
+    x2: -1,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2.5,
+    y1: -7.5,
+    x2: 1,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CHECK-CIRCLE
+// ===========================================
+
+export const checkCircleGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -2,
+    x2: -1,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -1,
+    y1: 3,
+    x2: -4,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CHECK
+// ===========================================
+
+export const checkGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 8,
+    y1: -6,
+    x2: -3,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -3,
+    y1: 5,
+    x2: -8,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CHEVRON-DOWN
+// ===========================================
+
+export const chevronDownGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -6,
+    y1: -3,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 3,
+    x2: 6,
+    y2: -3,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CHEVRON-LEFT
+// ===========================================
+
+export const chevronLeftGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 3,
+    y1: 6,
+    x2: -3,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -3,
+    y1: 0,
+    x2: 3,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CHEVRON-RIGHT
+// ===========================================
+
+export const chevronRightGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -3,
+    y1: 6,
+    x2: 3,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 3,
+    y1: 0,
+    x2: -3,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CHEVRON-UP
+// ===========================================
+
+export const chevronUpGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 6,
+    y1: 3,
+    x2: 0,
+    y2: -3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -3,
+    x2: -6,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CIRCLE
+// ===========================================
+
+export const circleGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }]
+};
+
+// ===========================================
+// CLOCK
+// ===========================================
+
+export const clockGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -6,
+    x2: 0,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 4,
+    y2: 2,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// CODE
+// ===========================================
+
+export const codeGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -3,
+    y1: 6,
+    x2: -9,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: 0,
+    x2: -3,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 3,
+    y1: -6,
+    x2: 9,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 0,
+    x2: 3,
+    y2: 6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// COPY
+// ===========================================
+
+export const copyGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -9,
+    y: -9,
+    width: 13,
+    height: 13,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2,
+    opacity: 0.55
+  }, {
+    type: 'rect',
+    x: -4,
+    y: -4,
+    width: 13,
+    height: 13,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }]
+};
+
+// ===========================================
+// CROP
+// ===========================================
+
+export const cropGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -9,
+    y1: -4,
+    x2: -9,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: -9,
+    x2: -4,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -9,
+    x2: 9,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: -9,
+    x2: 9,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 4,
+    x2: 9,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 9,
+    x2: 4,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: 9,
+    x2: -9,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: 9,
+    x2: -9,
+    y2: 4,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// DATABASE
+// ===========================================
+
+export const databaseGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -7,
+    y: -9,
+    width: 14,
+    height: 4,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -5,
+    width: 14,
+    height: 4,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'rect',
+    x: -7,
+    y: -1,
+    width: 14,
+    height: 8,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -5,
+    x2: 7,
+    y2: -5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -1,
+    x2: 7,
+    y2: -1,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// DOWNLOAD
+// ===========================================
+
+export const downloadGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -9,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: -1,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -1,
+    x2: 0,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 5,
+    x2: 8,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 5,
+    x2: -8,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 8,
+    y1: 5,
+    x2: 8,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 9,
+    x2: 8,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// EYE-OFF
+// ===========================================
+
+export const eyeOffGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveY: -10
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveY: 10
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: -9,
+    x2: 9,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// EYE
+// ===========================================
+
+export const eyeGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveY: -10
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2,
+    curveY: 10
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }]
+};
+
+// ===========================================
+// FILE-TEXT
+// ===========================================
+
+export const fileTextGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -8,
+    y: -10,
+    width: 12,
+    height: 20,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -10,
+    x2: 8,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 8,
+    y1: -6,
+    x2: 8,
+    y2: 10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 8,
+    y1: 10,
+    x2: -8,
+    y2: 10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: 0,
+    x2: 4,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: 4,
+    x2: 4,
+    y2: 4,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: -4,
+    x2: 1,
+    y2: -4,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// FILM
+// ===========================================
+
+export const filmGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -9,
+    width: 20,
+    height: 18,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'line',
+    x1: -5,
+    y1: -9,
+    x2: -5,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 5,
+    y1: -9,
+    x2: 5,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// FILTER
+// ===========================================
+
+export const filterGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 10,
+    y1: -9,
+    x2: -10,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: -9,
+    x2: -2,
+    y2: 0.5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 10,
+    y1: -9,
+    x2: 2,
+    y2: 0.5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: 0.5,
+    x2: -2,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2,
+    y1: 0.5,
+    x2: 2,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// GAUGE
+// ===========================================
+
+export const gaugeGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'arc',
+    cx: 0,
+    cy: 3,
+    r: 9,
+    startAngle: 180,
+    endAngle: 360,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 3,
+    x2: 4.5,
+    y2: -1.5,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// GIT-BRANCH
+// ===========================================
+
+export const gitBranchGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -6,
+    y1: -8,
+    x2: -6,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: 6,
+    cy: -6,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'circle',
+    cx: -6,
+    cy: 7,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'arc',
+    cx: -3,
+    cy: -3,
+    r: 9,
+    startAngle: 270,
+    endAngle: 360,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// GLOBE
+// ===========================================
+
+export const globeGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2,
+    scaleX: 0.45
+  }]
+};
+
+// ===========================================
+// GRIP-VERTICAL
+// ===========================================
+
+export const gripVerticalGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: -3,
+    cy: -7,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: -3,
+    cy: 0,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: -3,
+    cy: 7,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: 3,
+    cy: -7,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: 3,
+    cy: 0,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: 3,
+    cy: 7,
+    r: 1.3,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// HASH
+// ===========================================
+
+export const hashGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -8,
+    y1: -3,
+    x2: 8,
+    y2: -3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 3,
+    x2: 8,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: -9,
+    x2: -4,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -9,
+    x2: 2,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// HOME
+// ===========================================
+
+export const homeGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -9,
+    y1: -2,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -9,
+    x2: 9,
+    y2: -2,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -3,
+    x2: -7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: -3,
+    x2: 7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 9,
+    x2: 7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: 9,
+    x2: -2,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: 3,
+    x2: 2,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2,
+    y1: 3,
+    x2: 2,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// IMAGE-OFF
+// ===========================================
+
+export const imageOffGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -9,
+    y: -9,
+    width: 18,
+    height: 18,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'circle',
+    cx: -3.5,
+    cy: -3.5,
+    r: 1.6,
+    fill: 'color'
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: 9,
+    x2: 9,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// IMAGE
+// ===========================================
+
+export const imageGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -9,
+    y: -9,
+    width: 18,
+    height: 18,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'circle',
+    cx: -3.5,
+    cy: -3.5,
+    r: 1.6,
+    fill: 'color'
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 8,
+    x2: 2,
+    y2: -1,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2,
+    y1: -1,
+    x2: 9,
+    y2: 6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// INFO
+// ===========================================
+
+export const infoGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 4,
+    x2: 0,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: -4,
+    r: 1,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// KEY
+// ===========================================
+
+export const keyGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: -5,
+    cy: 0,
+    r: 5,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'circle',
+    cx: -5,
+    cy: 0,
+    r: 1.5,
+    fill: 'color'
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 9,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: 0,
+    x2: 7,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 0,
+    x2: 9,
+    y2: 2,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// LAYERS
+// ===========================================
+
+export const layersGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -10,
+    x2: -10,
+    y2: -5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: -5,
+    x2: 0,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 10,
+    y2: -5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 10,
+    y1: -5,
+    x2: 0,
+    y2: -10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: 0,
+    x2: 0,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 5,
+    x2: 10,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -10,
+    y1: 5,
+    x2: 0,
+    y2: 10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 10,
+    x2: 10,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// LINK
+// ===========================================
+
+export const linkGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -4,
+    y: -2,
+    width: 8,
+    height: 4,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'rect',
+    x: -8,
+    y: -2,
+    width: 8,
+    height: 4,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'rect',
+    x: 0,
+    y: -2,
+    width: 8,
+    height: 4,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }]
+};
+
+// ===========================================
+// LOCK
+// ===========================================
+
+export const lockGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -9,
+    y: -1,
+    width: 18,
+    height: 11,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'arc',
+    cx: 0,
+    cy: -1,
+    r: 5,
+    startAngle: 180,
+    endAngle: 360,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -5,
+    y1: -1,
+    x2: -5,
+    y2: -3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 5,
+    y1: -1,
+    x2: 5,
+    y2: -3,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// MINUS
+// ===========================================
+
+export const minusGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -7,
+    y1: 0,
+    x2: 7,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// MORE-VERTICAL
+// ===========================================
+
+export const moreVerticalGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: -7,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 1.3,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 7,
+    r: 1.3,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// MUSIC
+// ===========================================
+
+export const musicGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -3,
+    y1: 6,
+    x2: -3,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 4,
+    x2: 9,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -3,
+    y1: -7,
+    x2: 9,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: -6,
+    cy: 6,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'circle',
+    cx: 6,
+    cy: 4,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }]
+};
+
+// ===========================================
+// NAVIGATION
+// ===========================================
+
+export const navigationGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -9,
+    y1: -1,
+    x2: 10,
+    y2: -10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 10,
+    y1: -10,
+    x2: 1,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 1,
+    y1: 9,
+    x2: -1,
+    y2: 1,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -1,
+    y1: 1,
+    x2: -9,
+    y2: -1,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// PAUSE
+// ===========================================
+
+export const pauseGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -6,
+    y: -8,
+    width: 4,
+    height: 16,
+    fill: 'color',
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'rect',
+    x: 2,
+    y: -8,
+    width: 4,
+    height: 16,
+    fill: 'color',
+    border: true,
+    borderWidth: 2
+  }]
+};
+
+// ===========================================
+// PIN
+// ===========================================
+
+export const pinGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: -4,
+    r: 4,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 0,
+    x2: 0,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -5,
+    y1: -8,
+    x2: 5,
+    y2: -8,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// PLAY
+// ===========================================
+
+export const playGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -7,
+    y1: -9,
+    x2: -7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -9,
+    x2: 7,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: 0,
+    x2: -7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// PLUS
+// ===========================================
+
+export const plusGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -7,
+    x2: 0,
+    y2: 7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 0,
+    x2: 7,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// POWER
+// ===========================================
+
+export const powerGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -10,
+    x2: 0,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// REFRESH-CW
+// ===========================================
+
+export const refreshCwGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'arc',
+    cx: 0,
+    cy: 0,
+    r: 9,
+    startAngle: -70,
+    endAngle: 190,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'triangle',
+    x: 0,
+    y: -9,
+    size: 3.6,
+    direction: 'right',
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// SEARCH
+// ===========================================
+
+export const searchGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: -1,
+    cy: -1,
+    r: 8,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 9,
+    x2: 4.649999999999999,
+    y2: 4.649999999999999,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// SERVER
+// ===========================================
+
+export const serverGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -10,
+    y: -9,
+    width: 20,
+    height: 8,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'rect',
+    x: -10,
+    y: 1,
+    width: 20,
+    height: 8,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'circle',
+    cx: -5.5,
+    cy: -5,
+    r: 1.05,
+    fill: 'color'
+  }, {
+    type: 'circle',
+    cx: -5.5,
+    cy: 5,
+    r: 1.05,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// SETTINGS
+// ===========================================
+
+export const settingsGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 3,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: -11,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 9,
+    x2: 0,
+    y2: 11,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7.78,
+    y1: -7.78,
+    x2: -6.36,
+    y2: -6.36,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 6.359999999999999,
+    y1: 6.359999999999999,
+    x2: 7.780000000000001,
+    y2: 7.780000000000001,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -11,
+    y1: 0,
+    x2: -9,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: 0,
+    x2: 11,
+    y2: 0,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7.78,
+    y1: 7.780000000000001,
+    x2: -6.36,
+    y2: 6.359999999999999,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 6.359999999999999,
+    y1: -6.36,
+    x2: 7.780000000000001,
+    y2: -7.78,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// SHIELD
+// ===========================================
+
+export const shieldGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: -10,
+    x2: -7,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -7,
+    x2: -7,
+    y2: -1,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: -1,
+    x2: 0,
+    y2: 10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 0,
+    y1: 10,
+    x2: 7,
+    y2: -1,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: -1,
+    x2: 7,
+    y2: -7,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: -7,
+    x2: 0,
+    y2: -10,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// TRASH-2
+// ===========================================
+
+export const trash2GlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: -9,
+    y1: -6,
+    x2: 9,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: -6,
+    x2: 7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 7,
+    y1: 9,
+    x2: -7,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -7,
+    y1: 9,
+    x2: -7,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: -1,
+    x2: -2,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2,
+    y1: -1,
+    x2: 2,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: -6,
+    x2: -4,
+    y2: -8,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: -8,
+    x2: 4,
+    y2: -8,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -8,
+    x2: 4,
+    y2: -6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// UNLOCK
+// ===========================================
+
+export const unlockGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'rect',
+    x: -9,
+    y: -1,
+    width: 18,
+    height: 11,
+    border: true,
+    borderWidth: 2,
+    borderRadius: 2
+  }, {
+    type: 'arc',
+    cx: 0,
+    cy: -1,
+    r: 5,
+    startAngle: 180,
+    endAngle: 300,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -5,
+    y1: -1,
+    x2: -5,
+    y2: -3,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// UPLOAD
+// ===========================================
+
+export const uploadGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 0,
+    y1: 3,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -4,
+    y1: -5,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 4,
+    y1: -5,
+    x2: 0,
+    y2: -9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 5,
+    x2: 8,
+    y2: 5,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 5,
+    x2: -8,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 8,
+    y1: 5,
+    x2: 8,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -8,
+    y1: 9,
+    x2: 8,
+    y2: 9,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// USER
+// ===========================================
+
+export const userGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: -4,
+    r: 4,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'arc',
+    cx: 0,
+    cy: 9,
+    r: 7,
+    startAngle: 180,
+    endAngle: 360,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// WIFI
+// ===========================================
+
+export const wifiGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'smootharc',
+    cx: 0,
+    cy: 6,
+    r: 10,
+    portion: 'top',
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'smootharc',
+    cx: 0,
+    cy: 6,
+    r: 6.5,
+    portion: 'top',
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'circle',
+    cx: 0,
+    cy: 6,
+    r: 1.15,
+    fill: 'color'
+  }]
+};
+
+// ===========================================
+// X-CIRCLE
+// ===========================================
+
+export const xCircleGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'circle',
+    cx: 0,
+    cy: 0,
+    r: 10,
+    border: true,
+    borderWidth: 2
+  }, {
+    type: 'line',
+    x1: 3,
+    y1: -3,
+    x2: -3,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -3,
+    y1: -3,
+    x2: 3,
+    y2: 3,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// X
+// ===========================================
+
+export const xGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 6,
+    y1: -6,
+    x2: -6,
+    y2: 6,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -6,
+    y1: -6,
+    x2: 6,
+    y2: 6,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};
+
+// ===========================================
+// ZAP
+// ===========================================
+
+export const zapGlyphData = {
+  color: '#E0E0E0',
+  bgColor: '#0a0a0f',
+  elements: [{
+    type: 'line',
+    x1: 1,
+    y1: -10,
+    x2: -9,
+    y2: 2,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -9,
+    y1: 2,
+    x2: -2,
+    y2: 2,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -2,
+    y1: 2,
+    x2: -1,
+    y2: 10,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: -1,
+    y1: 10,
+    x2: 9,
+    y2: -2,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 9,
+    y1: -2,
+    x2: 2,
+    y2: -2,
+    stroke: 'color',
+    strokeWidth: 2
+  }, {
+    type: 'line',
+    x1: 2,
+    y1: -2,
+    x2: 1,
+    y2: -10,
+    stroke: 'color',
+    strokeWidth: 2
+  }]
+};