feat(skills): dots neon en todos los tools + glow via CSS variable

- Todos los tools tienen ahora un color asignado (antes varios no tenían)
- Dot usa --dot CSS variable: background + box-shadow del mismo color
- Efecto neon: 0 0 5px 1px + 0 0 2px (doble capa de glow)
- Hover intensifica el glow: 8px 2px + 3px
- Tools sin color brand propio usan colores temáticos del dominio

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: devsart95

src/components/sections/Skills.tsx

@@ -37,8 +37,8 @@ const DOMAINS: Domain[] = [
       { label: 'Gemini API',          color: '#4285f4' },
       { label: 'Vertex AI',           color: '#34a853' },
       { label: 'Google AI Studio',    color: '#ea4335' },
-      { label: 'LLM Pipelines' },
-      { label: 'Multi-agent Systems' },
+      { label: 'LLM Pipelines',       color: '#9333ea' },
+      { label: 'Multi-agent Systems', color: '#7c3aed' },
       { label: 'n8n AI Workflows',    color: '#ef6c00' },
     ],
   },
@@ -53,12 +53,12 @@ const DOMAINS: Domain[] = [
       </svg>
     ),
     tools: [
-      { label: 'SaaS Architecture' },
-      { label: 'ERP Systems' },
-      { label: 'Multi-tenant Apps' },
-      { label: 'CRM / POS' },
-      { label: 'Fiscal Integrations' },
-      { label: 'Vertical SaaS' },
+      { label: 'SaaS Architecture',   color: '#22d3ee' },
+      { label: 'ERP Systems',         color: '#0891b2' },
+      { label: 'Multi-tenant Apps',   color: '#0e7490' },
+      { label: 'CRM / POS',          color: '#0369a1' },
+      { label: 'Fiscal Integrations', color: '#3b82f6' },
+      { label: 'Vertical SaaS',       color: '#60a5fa' },
       { label: 'Turborepo Monorepo',  color: '#ef4444' },
       { label: 'tRPC',               color: '#398ccb' },
       { label: 'Drizzle ORM',        color: '#c4e34a' },
@@ -80,7 +80,7 @@ const DOMAINS: Domain[] = [
       { label: 'Node.js',       color: '#539e43' },
       { label: 'Astro',         color: '#ff5d01' },
       { label: 'Flutter',       color: '#54c5f8' },
-      { label: 'REST API Design' },
+      { label: 'REST API Design',    color: '#94a3b8' },
       { label: 'NestJS',        color: '#e0234e' },
       { label: 'Git / CI/CD',   color: '#f05032' },
     ],
@@ -101,9 +101,9 @@ const DOMAINS: Domain[] = [
       { label: 'Django',        color: '#0c4b33' },
       { label: 'Pydantic',      color: '#e92063' },
       { label: 'PostgreSQL',    color: '#336791' },
-      { label: 'Pandas / NumPy' },
-      { label: 'PDF Processing' },
-      { label: 'Script Automation' },
+      { label: 'Pandas / NumPy',     color: '#4dabcf' },
+      { label: 'PDF Processing',     color: '#ef4444' },
+      { label: 'Script Automation',  color: '#22c55e' },
     ],
   },
   {
@@ -120,11 +120,11 @@ const DOMAINS: Domain[] = [
     tools: [
       { label: 'WhatsApp API',    color: '#25d366' },
       { label: 'Telegram API',    color: '#2ca5e0' },
-      { label: 'AI Chatbots' },
-      { label: 'n8n Workflows',   color: '#ef6c00' },
-      { label: 'LLM Integration' },
-      { label: 'Automation Pipelines' },
-      { label: 'Bot Builders' },
+      { label: 'AI Chatbots',          color: '#a855f7' },
+      { label: 'n8n Workflows',        color: '#ef6c00' },
+      { label: 'LLM Integration',      color: '#8b5cf6' },
+      { label: 'Automation Pipelines', color: '#f59e0b' },
+      { label: 'Bot Builders',         color: '#f472b6' },
     ],
   },
   {
@@ -141,8 +141,8 @@ const DOMAINS: Domain[] = [
       { label: 'Docker / Compose', color: '#2496ed' },
       { label: 'GitHub Actions',  color: '#e2e8f0' },
       { label: 'VPS Linux',       color: '#fcc624' },
-      { label: 'Caddy / Traefik' },
-      { label: 'Bash Scripting' },
+      { label: 'Caddy / Traefik',   color: '#00acd7' },
+      { label: 'Bash Scripting',    color: '#4ade80' },
     ],
   },
 ]
@@ -188,12 +188,10 @@ export function Skills() {
                 <div className="sd-tools">
                   {d.tools.map(tool => (
                     <span key={tool.label} className="sd-tool">
-                      {tool.color && (
-                        <span
-                          className="sd-tool-dot"
-                          style={{ background: tool.color }}
-                        />
-                      )}
+                      <span
+                        className="sd-tool-dot"
+                        style={{ '--dot': tool.color ?? 'rgba(148,163,184,.4)' } as React.CSSProperties}
+                      />
                       {tool.label}
                     </span>
                   ))}

src/index.css

@@ -619,13 +619,18 @@ h2 {
   width: 6px; height: 6px;
   border-radius: 50%;
   flex-shrink: 0;
-  opacity: .75;
+  background: var(--dot);
+  box-shadow: 0 0 5px 1px var(--dot), 0 0 2px var(--dot);
+  opacity: .8;
 }
 .skill-domain:hover .sd-tool:hover {
   color: var(--sd-color, var(--accent));
   border-color: color-mix(in srgb, var(--sd-color, var(--accent)) 50%, transparent);
 }
-.skill-domain:hover .sd-tool:hover .sd-tool-dot { opacity: 1; }
+.skill-domain:hover .sd-tool:hover .sd-tool-dot {
+  opacity: 1;
+  box-shadow: 0 0 8px 2px var(--dot), 0 0 3px var(--dot);
+}
 /* light theme */
 [data-theme="light"] .skill-domain { background: rgba(255,255,255,.88); }
 [data-theme="light"] .sd-tool {