@ltm-blueverse/alpha-semantic-hub 0.7.0 → 0.7.2

package/explorer/src/App.tsx

@@ -85,7 +85,7 @@ const PREVIEW_DOTS = Array.from({ length: 42 }, (_, i) => ({
   cx: 170 + ((i * 73) % 330),
   cy: 170 + ((i * 47) % 210),
   r: 2 + (i % 3),
-  fill: (['#43d17a', '#ff2d4b', '#ff7a45', '#ff9daf'] as const)[i % 4],
+  fill: (['#178a4c', '#ff2d4b', '#e86a2e', '#e0556d'] as const)[i % 4],
 }));
 
 const navItems: NavItem[] = [
@@ -103,34 +103,34 @@ function readInitialWorkspace(): WorkspaceId {
 
 const shellStyles = `
   :root {
-    --app-bg: #0b0508;
-    --panel-bg: rgba(11, 5, 8, 0.82);
+    --app-bg: #ffffff;
+    --panel-bg: rgba(255, 255, 255, 0.82);
     --panel-border: rgba(255, 120, 140, 0.14);
-    --text-main: #fff0f2;
-    --text-muted: #c99aa3;
+    --text-main: #2d1619;
+    --text-muted: #aa485b;
     --accent: #ff2d4b;
-    --accent-strong: #ff6b81;
-    --warm: #ff7a45;
-    --success: #4cc38a;
+    --accent-strong: #d41736;
+    --warm: #e86a2e;
+    --success: #1f9d5f;
 
     /* ── Shared workspace design tokens ── */
-    --ws-bg: #080407;
-    --ws-surface: rgba(255,255,255,0.028);
+    --ws-bg: #f9f7f7;
+    --ws-surface: rgba(28, 20, 24,0.028);
     --ws-surface-hover: rgba(255,45,75,0.07);
     --ws-border: rgba(255,45,75,0.13);
     --ws-border-strong: rgba(255,45,75,0.26);
-    --ws-text: #ffe9ec;
+    --ws-text: #2d1619;
     --ws-text-muted: #8f6d75;
     --ws-text-dim: #6b4c54;
     --ws-accent: #ff2d4b;
     --ws-accent-soft: rgba(255,45,75,0.12);
-    --ws-green: #4cc38a;
+    --ws-green: #1f9d5f;
     --ws-green-soft: rgba(76,195,138,0.12);
-    --ws-amber: #ff7a45;
+    --ws-amber: #e86a2e;
     --ws-amber-soft: rgba(242,182,109,0.12);
-    --ws-red: #ff7b72;
+    --ws-red: #ec2315;
     --ws-red-soft: rgba(255,123,114,0.12);
-    --ws-purple: #c084fc;
+    --ws-purple: #8b5cf6;
     --ws-purple-soft: rgba(192,132,252,0.1);
     --ws-radius: 10px;
     --ws-radius-sm: 6px;
@@ -255,7 +255,7 @@ const shellStyles = `
   .ws-btn--primary {
     background: linear-gradient(135deg, rgba(255,45,75,0.28), rgba(56,210,160,0.16));
     border-color: rgba(255,45,75,0.4);
-    color: #ffeef1;
+    color: #2d161a;
     box-shadow: 0 0 0 1px rgba(255,45,75,0.08) inset;
   }
 
@@ -267,7 +267,7 @@ const shellStyles = `
   }
 
   .ws-btn--ghost {
-    background: rgba(255,255,255,0.04);
+    background: rgba(28, 20, 24,0.04);
     border-color: var(--ws-border);
     color: var(--ws-text-muted);
   }
@@ -281,13 +281,13 @@ const shellStyles = `
   .ws-btn--danger {
     background: var(--ws-red-soft);
     border-color: rgba(255,123,114,0.3);
-    color: #ff9e97;
+    color: #46211e;
   }
 
   .ws-btn--success {
     background: var(--ws-green-soft);
     border-color: rgba(76,195,138,0.3);
-    color: #6ee7b7;
+    color: #0f8f6e;
   }
 
   .ws-btn:disabled {
@@ -347,12 +347,12 @@ const shellStyles = `
     white-space: nowrap;
   }
 
-  .ws-pill--accent { color: #ff6b81; background: var(--ws-accent-soft); border: 1px solid rgba(255,45,75,0.22); }
-  .ws-pill--green  { color: #6ee7b7; background: var(--ws-green-soft);  border: 1px solid rgba(76,195,138,0.28); }
-  .ws-pill--amber  { color: #fbbf24; background: var(--ws-amber-soft);  border: 1px solid rgba(242,182,109,0.28); }
-  .ws-pill--red    { color: #fca5a5; background: var(--ws-red-soft);    border: 1px solid rgba(255,123,114,0.28); }
-  .ws-pill--purple { color: #d8b4fe; background: var(--ws-purple-soft); border: 1px solid rgba(192,132,252,0.22); }
-  .ws-pill--mono   { color: var(--ws-text-muted); background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); }
+  .ws-pill--accent { color: #d41736; background: var(--ws-accent-soft); border: 1px solid rgba(255,45,75,0.22); }
+  .ws-pill--green  { color: #0f8f6e; background: var(--ws-green-soft);  border: 1px solid rgba(76,195,138,0.28); }
+  .ws-pill--amber  { color: #b45309; background: var(--ws-amber-soft);  border: 1px solid rgba(242,182,109,0.28); }
+  .ws-pill--red    { color: #4e2121; background: var(--ws-red-soft);    border: 1px solid rgba(255,123,114,0.28); }
+  .ws-pill--purple { color: #9333ea; background: var(--ws-purple-soft); border: 1px solid rgba(192,132,252,0.22); }
+  .ws-pill--mono   { color: var(--ws-text-muted); background: rgba(28, 20, 24,0.04); border: 1px solid rgba(28, 20, 24,0.08); }
 
   .ws-divider {
     height: 1px;
@@ -419,7 +419,7 @@ const shellStyles = `
   .ws-list-item--active {
     background: var(--ws-accent-soft);
     border-color: var(--ws-border-strong);
-    color: #ffeef1;
+    color: #2d161a;
   }
 
   .ws-stat-grid {
@@ -473,7 +473,7 @@ const shellStyles = `
   }
 
   .ws-skeleton {
-    background: rgba(255,255,255,0.06);
+    background: rgba(28, 20, 24,0.06);
     border-radius: 8px;
     animation: ws-skeleton 1.4s ease-in-out infinite;
   }
@@ -494,7 +494,7 @@ const shellStyles = `
     background:
       radial-gradient(circle at top left, rgba(255, 45, 75, 0.12), transparent 32%),
       radial-gradient(circle at bottom right, rgba(242, 182, 109, 0.08), transparent 26%),
-      linear-gradient(180deg, #091322 0%, #050b15 100%);
+      linear-gradient(180deg, #f7f7f7 0%, #f6f6f6 100%);
     font-family: "Segoe UI", "SF Pro Display", sans-serif;
   }
 
@@ -505,7 +505,7 @@ const shellStyles = `
     flex-direction: column;
     gap: 12px;
     border-right: 1px solid var(--panel-border);
-    background: rgba(6, 3, 5, 0.92);
+    background: rgba(255, 255, 255, 0.92);
     backdrop-filter: blur(18px);
   }
 
@@ -518,7 +518,7 @@ const shellStyles = `
     color: var(--text-main);
     background: linear-gradient(135deg, rgba(255, 45, 75, 0.22), rgba(255, 107, 129, 0.08));
     border: 1px solid rgba(255, 107, 129, 0.18);
-    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
+    box-shadow: inset 0 1px 0 rgba(28, 20, 24,0.08);
     font-size: 11px;
     font-weight: 700;
     letter-spacing: 0.12em;
@@ -549,7 +549,7 @@ const shellStyles = `
     color: var(--text-main);
     background: linear-gradient(180deg, rgba(255, 45, 75, 0.18), rgba(255, 45, 75, 0.08));
     border-color: rgba(255, 107, 129, 0.22);
-    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
+    box-shadow: inset 0 1px 0 rgba(28, 20, 24,0.08);
   }
 
   .nav-label {
@@ -568,7 +568,7 @@ const shellStyles = `
   .workspace-header {
     padding: 14px 22px;
     border-bottom: 1px solid var(--panel-border);
-    background: linear-gradient(180deg, rgba(11, 5, 8, 0.94), rgba(11, 5, 8, 0.82));
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.82));
     backdrop-filter: blur(18px);
     display: flex;
     align-items: center;
@@ -580,7 +580,7 @@ const shellStyles = `
   .workspace-header--compact {
     min-height: 60px;
     padding: 10px 18px;
-    background: linear-gradient(180deg, rgba(11, 5, 8, 0.92), rgba(11, 5, 8, 0.72));
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.72));
   }
 
   .workspace-header--compact .workspace-title {
@@ -654,7 +654,7 @@ const shellStyles = `
 
   .workspace-tab {
     border: 1px solid rgba(255, 107, 129, 0.18);
-    background: rgba(12, 6, 9, 0.56);
+    background: rgba(255, 255, 255, 0.56);
     color: var(--text-muted);
     border-radius: 999px;
     padding: 8px 12px;
@@ -669,7 +669,7 @@ const shellStyles = `
     color: var(--text-main);
     background: rgba(255, 45, 75, 0.16);
     border-color: rgba(255, 107, 129, 0.3);
-    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
+    box-shadow: inset 0 1px 0 rgba(28, 20, 24,0.05);
   }
 
   .workspace-body {
@@ -688,7 +688,7 @@ const shellStyles = `
     background:
       radial-gradient(ellipse 80% 50% at 50% -10%, rgba(255, 45, 75, 0.18) 0%, transparent 60%),
       radial-gradient(ellipse 60% 40% at 80% 90%, rgba(242, 182, 109, 0.1) 0%, transparent 50%),
-      linear-gradient(180deg, #080407 0%, #03070f 100%);
+      linear-gradient(180deg, #f9f7f7 0%, #f5f5f6 100%);
     scrollbar-width: thin;
     scrollbar-color: rgba(255,45,75,0.18) transparent;
   }
@@ -735,19 +735,19 @@ const shellStyles = `
     align-items: center;
     gap: 10px;
     margin-bottom: 24px;
-    --status-color: #4cc38a;
+    --status-color: #1f9d5f;
     --status-shadow-a: 0 0 0 3px rgba(76, 195, 138, 0.22), 0 0 12px rgba(76, 195, 138, 0.5);
     --status-shadow-b: 0 0 0 5px rgba(76, 195, 138, 0.1), 0 0 20px rgba(76, 195, 138, 0.35);
   }
 
   .landing-status-bar[data-status='checking'] {
-    --status-color: #ff7a45;
+    --status-color: #e86a2e;
     --status-shadow-a: 0 0 0 3px rgba(242, 182, 109, 0.22), 0 0 12px rgba(242, 182, 109, 0.5);
     --status-shadow-b: 0 0 0 5px rgba(242, 182, 109, 0.1), 0 0 20px rgba(242, 182, 109, 0.35);
   }
 
   .landing-status-bar[data-status='offline'] {
-    --status-color: #ff7b72;
+    --status-color: #ec2315;
     --status-shadow-a: 0 0 0 3px rgba(255, 123, 114, 0.22), 0 0 12px rgba(255, 123, 114, 0.5);
     --status-shadow-b: 0 0 0 5px rgba(255, 123, 114, 0.1), 0 0 20px rgba(255, 123, 114, 0.35);
   }
@@ -788,7 +788,7 @@ const shellStyles = `
     border-radius: 999px;
     border: 1px solid rgba(255, 45, 75, 0.3);
     background: rgba(255, 45, 75, 0.08);
-    color: #ff6b81;
+    color: #d41736;
     font: 700 11px/1 "JetBrains Mono", monospace;
     letter-spacing: 0.08em;
     text-transform: uppercase;
@@ -800,7 +800,7 @@ const shellStyles = `
     width: 16px;
     height: 16px;
     border-radius: 6px;
-    background: linear-gradient(135deg, #ff2d4b, #56d3a0);
+    background: linear-gradient(135deg, #ff2d4b, #0f8f6e);
     display: grid;
     place-items: center;
     flex: 0 0 auto;
@@ -813,12 +813,12 @@ const shellStyles = `
     width: 7px;
     height: 7px;
     border-radius: 999px;
-    background: rgba(3, 10, 20, 0.8);
+    background: rgba(255, 255, 255, 0.8);
   }
 
   .landing-title {
     margin: 0 0 20px;
-    color: #f0f7ff;
+    color: #16212d;
     font-family: "Inter", "Segoe UI", sans-serif;
     font-size: clamp(38px, 4.8vw, 72px);
     line-height: 1.08;
@@ -828,7 +828,7 @@ const shellStyles = `
 
   .landing-title span {
     color: transparent;
-    background: linear-gradient(100deg, #ff6b81 0%, #4cc38a 50%, #ff7a45 100%);
+    background: linear-gradient(100deg, #d41736 0%, #1f9d5f 50%, #e86a2e 100%);
     -webkit-background-clip: text;
     background-clip: text;
   }
@@ -855,8 +855,8 @@ const shellStyles = `
     padding: 12px 22px;
     border-radius: 12px;
     border: 1px solid rgba(255, 45, 75, 0.5);
-    background: linear-gradient(135deg, rgba(255, 45, 75, 0.28), rgba(56, 210, 160, 0.18));
-    color: #ffeef1;
+    background: linear-gradient(135deg, rgba(255, 45, 75, 0.28), rgba(212, 23, 54, 0.14));
+    color: #2d161a;
     font-size: 14px;
     font-weight: 700;
     cursor: pointer;
@@ -866,7 +866,7 @@ const shellStyles = `
 
   .landing-cta-primary:hover {
     transform: translateY(-2px);
-    background: linear-gradient(135deg, rgba(255, 45, 75, 0.38), rgba(56, 210, 160, 0.26));
+    background: linear-gradient(135deg, rgba(255, 45, 75, 0.38), rgba(212, 23, 54, 0.22));
     box-shadow: 0 0 0 1px rgba(255, 45, 75, 0.18) inset, 0 14px 32px rgba(255, 45, 75, 0.22);
   }
 
@@ -877,7 +877,7 @@ const shellStyles = `
     padding: 12px 18px;
     border-radius: 12px;
     border: 1px solid rgba(255, 154, 171, 0.14);
-    background: rgba(255, 255, 255, 0.04);
+    background: rgba(28, 20, 24, 0.04);
     color: #8fafc8;
     font-size: 14px;
     font-weight: 600;
@@ -887,8 +887,8 @@ const shellStyles = `
 
   .landing-cta-secondary:hover {
     border-color: rgba(255, 154, 171, 0.26);
-    color: #c5dcef;
-    background: rgba(255, 255, 255, 0.07);
+    color: #27435b;
+    background: rgba(28, 20, 24, 0.07);
   }
 
   /* ── Preview panel ─────────────────────────────────────── */
@@ -900,8 +900,8 @@ const shellStyles = `
     background:
       radial-gradient(circle at 40% 30%, rgba(255, 45, 75, 0.14), transparent 46%),
       radial-gradient(circle at 70% 70%, rgba(242, 182, 109, 0.1), transparent 38%),
-      linear-gradient(145deg, rgba(8, 17, 28, 0.96), rgba(3, 8, 14, 0.88));
-    box-shadow: 0 24px 72px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255,255,255,0.04) inset;
+      linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.88));
+    box-shadow: 0 24px 72px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(28, 20, 24,0.04) inset;
     aspect-ratio: 4/3.2;
     min-height: 340px;
   }
@@ -912,7 +912,7 @@ const shellStyles = `
     left: 0;
     right: 0;
     height: 38px;
-    background: rgba(4, 10, 18, 0.82);
+    background: rgba(255, 255, 255, 0.82);
     border-bottom: 1px solid rgba(255, 45, 75, 0.1);
     backdrop-filter: blur(12px);
     display: flex;
@@ -937,7 +937,7 @@ const shellStyles = `
     border-radius: 6px;
     background: rgba(255, 45, 75, 0.12);
     border: 1px solid rgba(255, 45, 75, 0.2);
-    color: #ff6b81;
+    color: #d41736;
     font: 600 10px/1 "JetBrains Mono", monospace;
     letter-spacing: 0.06em;
   }
@@ -982,9 +982,9 @@ const shellStyles = `
   .landing-timeline-card {
     position: absolute;
     border: 1px solid rgba(255, 45, 75, 0.16);
-    background: rgba(6, 3, 5, 0.84);
+    background: rgba(255, 255, 255, 0.84);
     backdrop-filter: blur(20px);
-    box-shadow: 0 12px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.04) inset;
+    box-shadow: 0 12px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(28, 20, 24,0.04) inset;
   }
 
   .landing-command-card {
@@ -1004,14 +1004,14 @@ const shellStyles = `
     border-radius: 10px;
     display: grid;
     place-items: center;
-    color: #56d3a0;
+    color: #0f8f6e;
     background: rgba(76, 195, 138, 0.1);
     border: 1px solid rgba(76, 195, 138, 0.2);
     flex: 0 0 auto;
   }
 
   .landing-command-label {
-    color: #c8dff0;
+    color: #28475e;
     font-size: 12px;
     font-weight: 700;
   }
@@ -1031,7 +1031,7 @@ const shellStyles = `
   }
 
   .landing-dossier-kicker {
-    color: #56d3a0;
+    color: #0f8f6e;
     font: 700 9px/1 "JetBrains Mono", monospace;
     letter-spacing: 0.1em;
     text-transform: uppercase;
@@ -1039,7 +1039,7 @@ const shellStyles = `
 
   .landing-dossier-title {
     margin-top: 6px;
-    color: #e8f4ff;
+    color: #16222e;
     font: 800 20px/1 "Inter", sans-serif;
     letter-spacing: -0.04em;
   }
@@ -1055,7 +1055,7 @@ const shellStyles = `
     font-weight: 600;
   }
 
-  .landing-dossier-row strong { color: #ff7a45; font-weight: 700; }
+  .landing-dossier-row strong { color: #e86a2e; font-weight: 700; }
 
   .landing-timeline-card {
     left: 14px;
@@ -1080,7 +1080,7 @@ const shellStyles = `
   }
 
   .landing-timeline-badge {
-    color: #ff6b81;
+    color: #d41736;
     font: 700 9px/1 "JetBrains Mono", monospace;
     letter-spacing: 0.06em;
   }
@@ -1098,7 +1098,7 @@ const shellStyles = `
     position: absolute;
     inset: 0 28% 0 0;
     border-radius: inherit;
-    background: linear-gradient(90deg, #4cc38a, #ff2d4b, #ff7a45);
+    background: linear-gradient(90deg, #1f9d5f, #ff2d4b, #e86a2e);
   }
 
   .landing-timeline-labels {
@@ -1120,7 +1120,7 @@ const shellStyles = `
     padding: 18px 20px;
     border-radius: 16px;
     border: 1px solid rgba(255, 154, 171, 0.09);
-    background: rgba(255, 255, 255, 0.025);
+    background: rgba(28, 20, 24, 0.025);
     position: relative;
     overflow: hidden;
     transition: border-color 200ms ease;
@@ -1141,15 +1141,15 @@ const shellStyles = `
   }
 
   .landing-metric-value {
-    color: #ffe9ec;
+    color: #2d1619;
     font: 800 28px/1 "Inter", sans-serif;
     letter-spacing: -0.04em;
   }
 
-  .landing-metric[data-tone='mint'] .landing-metric-value { color: #56d3a0; }
-  .landing-metric[data-tone='amber'] .landing-metric-value { color: #ff7a45; }
-  .landing-metric[data-tone='rose'] .landing-metric-value { color: #ff9daf; }
-  .landing-metric[data-tone='cyan'] .landing-metric-value { color: #ff6b81; }
+  .landing-metric[data-tone='mint'] .landing-metric-value { color: #0f8f6e; }
+  .landing-metric[data-tone='amber'] .landing-metric-value { color: #e86a2e; }
+  .landing-metric[data-tone='rose'] .landing-metric-value { color: #e0556d; }
+  .landing-metric[data-tone='cyan'] .landing-metric-value { color: #d41736; }
 
   .landing-metric-label {
     margin-top: 6px;
@@ -1168,7 +1168,7 @@ const shellStyles = `
   }
 
   .landing-section-title {
-    color: #c8dff0;
+    color: #28475e;
     font: 700 13px/1 "JetBrains Mono", monospace;
     letter-spacing: 0.1em;
     text-transform: uppercase;
@@ -1193,7 +1193,7 @@ const shellStyles = `
     padding: 22px;
     border-radius: 18px;
     border: 1px solid rgba(255, 154, 171, 0.09);
-    background: rgba(255, 255, 255, 0.025);
+    background: rgba(28, 20, 24, 0.025);
     cursor: pointer;
     text-align: left;
     color: inherit;
@@ -1243,14 +1243,14 @@ const shellStyles = `
     border-radius: 12px;
     display: grid;
     place-items: center;
-    color: #ff6b81;
+    color: #d41736;
     background: rgba(255, 45, 75, 0.1);
     border: 1px solid rgba(255, 45, 75, 0.2);
     margin-bottom: 14px;
   }
 
   .landing-workspace-card--primary .landing-workspace-card-icon {
-    color: #56d3a0;
+    color: #0f8f6e;
     background: rgba(76, 195, 138, 0.1);
     border-color: rgba(76, 195, 138, 0.22);
     width: 48px;
@@ -1260,7 +1260,7 @@ const shellStyles = `
   }
 
   .landing-workspace-card-eyebrow {
-    color: #56d3a0;
+    color: #0f8f6e;
     font: 700 10px/1 "JetBrains Mono", monospace;
     letter-spacing: 0.1em;
     text-transform: uppercase;
@@ -1268,7 +1268,7 @@ const shellStyles = `
   }
 
   .landing-workspace-card-title {
-    color: #e2effb;
+    color: #16222e;
     font: 700 16px/1.2 "Inter", sans-serif;
     letter-spacing: -0.025em;
     margin-bottom: 6px;
@@ -1291,7 +1291,7 @@ const shellStyles = `
     border-radius: 10px;
     display: grid;
     place-items: center;
-    color: #56d3a0;
+    color: #0f8f6e;
     background: rgba(76, 195, 138, 0.1);
     border: 1px solid rgba(76, 195, 138, 0.2);
     flex: 0 0 auto;
@@ -1312,7 +1312,7 @@ const shellStyles = `
     padding: 14px 18px;
     border: 1px solid rgba(255, 45, 75, 0.1);
     border-radius: 16px;
-    background: rgba(6, 3, 5, 0.6);
+    background: rgba(255, 255, 255, 0.6);
     backdrop-filter: blur(12px);
   }
 
@@ -1342,7 +1342,7 @@ const shellStyles = `
   }
 
   .landing-capability:hover {
-    color: #9be8ff;
+    color: #1493bd;
     border-color: rgba(255, 45, 75, 0.28);
     background: rgba(255, 45, 75, 0.1);
   }
@@ -1363,7 +1363,7 @@ const shellStyles = `
     display: grid;
     place-items: center;
     color: var(--text-muted);
-    background: linear-gradient(180deg, rgba(11, 5, 8, 0.8), rgba(5, 11, 21, 0.92));
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.92));
     font-size: 14px;
   }
 
@@ -1666,7 +1666,7 @@ function WelcomeScreen({
                 <path className="landing-preview-line landing-preview-line--warm" d="M204 118 C318 340 408 368 526 284" />
                 <path className="landing-preview-line" d="M110 310 C180 350 260 360 340 320 C420 280 480 260 510 240" />
                 <g className="landing-node">
-                  <circle cx="110" cy="310" r="10" fill="#4cc38a" fillOpacity="0.9" />
+                  <circle cx="110" cy="310" r="10" fill="#1f9d5f" fillOpacity="0.9" />
                   <circle cx="110" cy="310" r="20" fill="none" stroke="rgba(76,195,138,0.24)" strokeWidth="1.5" />
                   <circle cx="110" cy="310" r="34" fill="none" stroke="rgba(76,195,138,0.1)" strokeWidth="1" />
                 </g>
@@ -1675,16 +1675,16 @@ function WelcomeScreen({
                   <circle cx="204" cy="118" r="16" fill="none" stroke="rgba(255,45,75,0.24)" strokeWidth="1.5" />
                 </g>
                 <g className="landing-node">
-                  <circle cx="510" cy="240" r="13" fill="#ff7a45" fillOpacity="0.9" />
+                  <circle cx="510" cy="240" r="13" fill="#e86a2e" fillOpacity="0.9" />
                   <circle cx="510" cy="240" r="26" fill="none" stroke="rgba(242,182,109,0.26)" strokeWidth="1.5" />
                   <circle cx="510" cy="240" r="40" fill="none" stroke="rgba(242,182,109,0.1)" strokeWidth="1" />
                 </g>
                 <g className="landing-node">
-                  <circle cx="488" cy="144" r="6" fill="#ff9daf" fillOpacity="0.9" />
+                  <circle cx="488" cy="144" r="6" fill="#e0556d" fillOpacity="0.9" />
                   <circle cx="488" cy="144" r="14" fill="none" stroke="rgba(255,157,175,0.22)" strokeWidth="1.5" />
                 </g>
                 <g className="landing-node">
-                  <circle cx="340" cy="320" r="9" fill="#ff6b81" fillOpacity="0.9" />
+                  <circle cx="340" cy="320" r="9" fill="#d41736" fillOpacity="0.9" />
                   <circle cx="340" cy="320" r="20" fill="none" stroke="rgba(255,107,129,0.22)" strokeWidth="1.5" />
                 </g>
                 <g opacity="0.45">

package/explorer/src/index.css

@@ -15,8 +15,8 @@ html, body, #root {
   font-family: 'IBM Plex Sans', 'Space Grotesk', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  background: #0a0508;
-  color: #e8ccd1;
+  background: #fdfcfc;
+  color: #523036;
 }
 
 /* Focus ring for accessibility */
@@ -52,7 +52,7 @@ code, pre, .mono {
 /* Selection highlight */
 ::selection {
   background: rgba(255, 45, 75, 0.3);
-  color: #fff;
+  color: #16181d;
 }
 
 /* Spin animation for loaders */