Commite589f77
feat(design): unify the design-system foundation + shared UI primitives
feat(design): unify the design-system foundation + shared UI primitives Design-foundation build (ultracode, owner-authorized edit of the §4.7 locked layout.tsx/components.tsx). Zero intended visual regression — the layout.tsx dedup keeps every cascade-winning value; the palette pass only substitutes hardcoded hexes for the tokens they already duplicated. layout.tsx: - Fix the --t-base collision: it was defined as 14px (type) then 200ms (motion), so motion won and --font-size-base/h4/.btn-lg resolved to an invalid 200ms. Renamed the motion token to --dur-base (8 refs updated); --t-base is now correctly 14px. - Collapse self-overriding duplicate rules to one each, preserving the cascade-winning value: .btn-primary (dead --accent-gradient removed; solid var(--accent) already won → clean flat button), .card/.card:hover, .auth-container, .empty-state, the heading scale, and a/a:hover. components.tsx (additive, theme-aware, no hardcoded hex): - New shared primitives PageHeader, Card, Badge (neutral/success/warn/ danger/info), Button (primary/secondary/ghost × sm/md/lg) + types, all consuming the layout.tsx token system. No existing exports changed. palette: 122 route files — hardcoded brand-blues → var(--accent) and off-token greens/reds → var(--green)/var(--red). Color values only, no structural edits; alpha variants with no token equivalent left as-is. This unifies the palette and repairs the default light theme. test(u-polish): assert btn-primary's real solid var(--accent) instead of the removed dead gradient. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
125 files changed+954−642e589f77aa912aa0577fb9840e94e7f975cb2f3bd
125 changed files+954−642
Modifiedsrc/__tests__/u-polish.test.ts+7−4View fileUnifiedSplit
@@ -102,11 +102,14 @@ describe("Block U2 — button polish", () => {
102102 expect(body).toMatch(/\.btn:disabled[\s\S]*?opacity:\s*0\.5/);
103103 });
104104
105 it("btn-primary has a gradient background and smooth transitions", async () => {
105 it("btn-primary has a solid accent background and smooth transitions", async () => {
106106 const body = await fetchLayoutHtml();
107 // Calm Infrastructure restyle (2026-06-13): shimmer animation removed;
108 // replaced with a solid accent-gradient + fast transform/box-shadow transitions.
109 expect(body).toMatch(/\.btn-primary\b[\s\S]*?background:\s*var\(--accent-gradient\)/);
107 // Design-foundation build (2026-07-24): the earlier `.btn-primary` gradient
108 // rule was DEAD — a later `.btn-primary { background: var(--accent) }` in the
109 // polish layer won the cascade, so the button always rendered solid. The
110 // dead gradient declaration was removed; primary is a flat var(--accent)
111 // (the clean, Vercel-like look). Assert the real, winning value.
112 expect(body).toMatch(/\.btn-primary\b[\s\S]*?background:\s*var\(--accent\)/);
110113 expect(body).toMatch(/\.btn-primary\b[\s\S]*?transition:[\s\S]*?transform\s+180ms/);
111114 });
112115});
Modifiedsrc/routes/activity.tsx+7−7View fileUnifiedSplit
@@ -228,12 +228,12 @@ const styles = `
228228 color: var(--text-muted);
229229 box-shadow: inset 0 0 0 1px var(--border);
230230 }
231 .act-row-icon.kind-ai { background: rgba(91,110,232,0.18); color: #5b6ee8; box-shadow: inset 0 0 0 1px rgba(91,110,232,0.40); }
231 .act-row-icon.kind-ai { background: rgba(91,110,232,0.18); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.40); }
232232 .act-row-icon.kind-code { background: rgba(95,143,160,0.14); color: #6fd6e6; box-shadow: inset 0 0 0 1px rgba(95,143,160,0.32); }
233 .act-row-icon.kind-pr { background: rgba(52,211,153,0.13); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
233 .act-row-icon.kind-pr { background: rgba(52,211,153,0.13); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
234234 .act-row-icon.kind-issue { background: rgba(251,191,36,0.12); color: #fde68a; box-shadow: inset 0 0 0 1px rgba(251,191,36,0.30); }
235235 .act-row-icon.kind-social { background: rgba(244,114,182,0.12); color: #f9a8d4; box-shadow: inset 0 0 0 1px rgba(244,114,182,0.30); }
236 .act-row-icon.kind-merge { background: rgba(91,110,232,0.16); color: #5b6ee8; box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32); }
236 .act-row-icon.kind-merge { background: rgba(91,110,232,0.16); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32); }
237237
238238 .act-row-main { flex: 1; min-width: 0; }
239239 .act-row-title {
@@ -253,12 +253,12 @@ const styles = `
253253 text-transform: lowercase;
254254 font-weight: 600;
255255 }
256 .act-verb.kind-ai { color: #5b6ee8; }
256 .act-verb.kind-ai { color: var(--accent); }
257257 .act-verb.kind-code { color: #6fd6e6; }
258 .act-verb.kind-pr { color: #6ee7b7; }
258 .act-verb.kind-pr { color: var(--green); }
259259 .act-verb.kind-issue { color: #fde68a; }
260260 .act-verb.kind-social { color: #f9a8d4; }
261 .act-verb.kind-merge { color: #5b6ee8; }
261 .act-verb.kind-merge { color: var(--accent); }
262262
263263 .act-badge {
264264 display: inline-flex;
@@ -273,7 +273,7 @@ const styles = `
273273 font-variant-numeric: tabular-nums;
274274 }
275275 .act-badge.ai-event {
276 color: #5b6ee8;
276 color: var(--accent);
277277 background: rgba(91,110,232,0.18);
278278 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.40);
279279 }
Modifiedsrc/routes/admin-advancement.tsx+2−2View fileUnifiedSplit
@@ -703,7 +703,7 @@ const ADV_SCAN_CSS = `
703703 width: 18px; height: 18px;
704704 border-radius: 6px;
705705 background: rgba(91,110,232,0.14);
706 color: #5b6ee8;
706 color: var(--accent);
707707 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
708708 }
709709 .adv-scan-eyebrow .adv-scan-who { color: var(--accent); font-weight: 600; }
@@ -908,7 +908,7 @@ const ADV_SCAN_CSS = `
908908 }
909909 .adv-scan-urgency.is-high {
910910 background: rgba(248,113,113,0.12);
911 color: #fca5a5;
911 color: var(--red);
912912 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
913913 }
914914 .adv-scan-urgency.is-medium {
Modifiedsrc/routes/admin-command.tsx+2−2View fileUnifiedSplit
@@ -390,7 +390,7 @@ app.get("/admin/command", async (c) => {
390390 font-weight: 600;
391391 border: 1px solid transparent;
392392 }
393 .cmd-pill-ok { background: rgba(35,134,54,0.12); border-color: rgba(35,134,54,0.25); color: #3fb950; }
393 .cmd-pill-ok { background: rgba(35,134,54,0.12); border-color: rgba(35,134,54,0.25); color: var(--green); }
394394 .cmd-pill-err { background: rgba(248,81,73,0.12); border-color: rgba(248,81,73,0.25); color: #f85149; }
395395 .cmd-pill-warn { background: rgba(210,153,34,0.12); border-color: rgba(210,153,34,0.25); color: #d29922; }
396396 .cmd-pill-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
@@ -467,7 +467,7 @@ app.get("/admin/command", async (c) => {
467467 font-weight: 600;
468468 }
469469 .cmd-badge-fail { background: rgba(248,81,73,0.15); color: #f85149; }
470 .cmd-badge-ok { background: rgba(35,134,54,0.15); color: #3fb950; }
470 .cmd-badge-ok { background: rgba(35,134,54,0.15); color: var(--green); }
471471 .cmd-badge-warn { background: rgba(210,153,34,0.15); color: #d29922; }
472472 .cmd-badge-pending { background: rgba(130,80,223,0.15); color: #9a7fde; }
473473 .cmd-badge-running { background: rgba(88,166,255,0.15); color: #58a6ff; }
Modifiedsrc/routes/admin-deletions.tsx+2−2View fileUnifiedSplit
@@ -68,7 +68,7 @@ const styles = `
6868 .adm-del-section-title { font-family: var(--font-display); font-size: 16px; font-weight: 700; letter-spacing: -0.012em; color: var(--text-strong); margin: 0 0 var(--space-3); display: flex; align-items: center; gap: 10px; }
6969 .adm-del-badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 9999px; font-size: 11px; font-weight: 700; }
7070 .adm-del-badge-warn { background: rgba(251,146,60,0.15); color: #fdba74; box-shadow: inset 0 0 0 1px rgba(251,146,60,0.35); }
71 .adm-del-badge-ok { background: rgba(52,211,153,0.12); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
71 .adm-del-badge-ok { background: rgba(52,211,153,0.12); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
7272
7373 .adm-del-table { width: 100%; border-collapse: collapse; background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
7474 .adm-del-table thead th { text-align: left; font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); padding: 10px 14px; background: rgba(255,255,255,0.015); border-bottom: 1px solid var(--border); }
@@ -77,7 +77,7 @@ const styles = `
7777 .adm-del-table tbody tr:hover td { background: rgba(255,255,255,0.018); }
7878 .adm-del-table code { font-family: var(--font-mono); font-size: 11.5px; color: var(--text-strong); }
7979
80 .adm-del-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 7px; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; line-height: 1; transition: background 120ms, border-color 120ms, color 120ms; border: 1px solid rgba(248,113,113,0.45); background: rgba(248,113,113,0.08); color: #fca5a5; }
80 .adm-del-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 7px; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; line-height: 1; transition: background 120ms, border-color 120ms, color 120ms; border: 1px solid rgba(248,113,113,0.45); background: rgba(248,113,113,0.08); color: var(--red); }
8181 .adm-del-btn:hover { background: rgba(248,113,113,0.18); border-color: rgba(248,113,113,0.70); color: #fecaca; }
8282
8383 .adm-del-empty { padding: var(--space-6); text-align: center; color: var(--text-muted); font-size: 13.5px; background: var(--bg-elevated); border: 1px dashed var(--border); border-radius: 14px; }
Modifiedsrc/routes/admin-deploys-page.tsx+14−14View fileUnifiedSplit
@@ -707,9 +707,9 @@ function renderDeployModal(
707707 : "·";
708708 const colour =
709709 s === "succeeded"
710 ? "#34d399"
710 ? "var(--green)"
711711 : s === "failed"
712 ? "#f87171"
712 ? "var(--red)"
713713 : s === "in_progress"
714714 ? "#fbbf24"
715715 : "var(--text-muted)";
@@ -813,12 +813,12 @@ const DEPLOY_MODAL_JS = `
813813 var icon = li.querySelector('.step-icon');
814814 var detail = li.querySelector('.step-detail');
815815 if (status === 'succeeded') {
816 if (icon) { icon.textContent = '✓'; icon.style.color = '#34d399'; }
816 if (icon) { icon.textContent = '✓'; icon.style.color = 'var(--green)'; }
817817 if (detail) detail.textContent = typeof durationMs === 'number'
818818 ? ('completed in ' + Math.round(durationMs/1000) + 's')
819819 : 'completed';
820820 } else if (status === 'failed') {
821 if (icon) { icon.textContent = '✗'; icon.style.color = '#f87171'; }
821 if (icon) { icon.textContent = '✗'; icon.style.color = 'var(--red)'; }
822822 if (detail) detail.textContent = 'failed';
823823 } else if (status === 'in_progress') {
824824 if (icon) { icon.textContent = '⏳'; icon.style.color = '#fbbf24'; }
@@ -1066,9 +1066,9 @@ const DEPLOYS_PAGE_CSS = `
10661066 .deploys-stat-empty { color: var(--text-muted); font-weight: 600; }
10671067 .deploys-tabular { font-variant-numeric: tabular-nums; }
10681068
1069 .deploys-rate.is-good { color: #6ee7b7; }
1069 .deploys-rate.is-good { color: var(--green); }
10701070 .deploys-rate.is-warn { color: #fde68a; }
1071 .deploys-rate.is-bad { color: #fca5a5; }
1071 .deploys-rate.is-bad { color: var(--red); }
10721072
10731073 /* ─── SHA pill ─── */
10741074 .deploys-sha-pill {
@@ -1107,8 +1107,8 @@ const DEPLOYS_PAGE_CSS = `
11071107 background: currentColor;
11081108 flex-shrink: 0;
11091109 }
1110 .deploys-sha-dot.is-green { background: #34d399; box-shadow: 0 0 0 2px rgba(52,211,153,0.18); }
1111 .deploys-sha-dot.is-failed { background: #f87171; box-shadow: 0 0 0 2px rgba(248,113,113,0.20); }
1110 .deploys-sha-dot.is-green { background: var(--green); box-shadow: 0 0 0 2px rgba(52,211,153,0.18); }
1111 .deploys-sha-dot.is-failed { background: var(--red); box-shadow: 0 0 0 2px rgba(248,113,113,0.20); }
11121112 .deploys-sha-dot.is-rolling {
11131113 background: #fbbf24;
11141114 box-shadow: 0 0 0 2px rgba(251,191,36,0.22);
@@ -1174,7 +1174,7 @@ const DEPLOYS_PAGE_CSS = `
11741174 text-transform: uppercase;
11751175 letter-spacing: 0.14em;
11761176 font-weight: 700;
1177 color: #6ee7b7;
1177 color: var(--green);
11781178 }
11791179 .deploys-lastgood-body {
11801180 display: inline-flex;
@@ -1389,7 +1389,7 @@ const DEPLOYS_PAGE_CSS = `
13891389 padding: 2px 8px;
13901390 border-radius: 9999px;
13911391 background: rgba(91,110,232,0.14);
1392 color: #5b6ee8;
1392 color: var(--accent);
13931393 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
13941394 font-weight: 700;
13951395 }
@@ -1446,15 +1446,15 @@ const DEPLOYS_PAGE_CSS = `
14461446 border-color: rgba(52,211,153,0.32);
14471447 color: #bbf7d0;
14481448 }
1449 .deploys-step.is-succeeded .deploys-step-dot { background: #34d399; }
1450 .deploys-step.is-succeeded .deploys-step-dur { color: #6ee7b7; }
1449 .deploys-step.is-succeeded .deploys-step-dot { background: var(--green); }
1450 .deploys-step.is-succeeded .deploys-step-dur { color: var(--green); }
14511451 .deploys-step.is-failed {
14521452 background: rgba(248,113,113,0.10);
14531453 border-color: rgba(248,113,113,0.36);
14541454 color: #fecaca;
14551455 }
1456 .deploys-step.is-failed .deploys-step-dot { background: #f87171; }
1457 .deploys-step.is-failed .deploys-step-dur { color: #fca5a5; }
1456 .deploys-step.is-failed .deploys-step-dot { background: var(--red); }
1457 .deploys-step.is-failed .deploys-step-dur { color: var(--red); }
14581458 .deploys-step.is-in_progress {
14591459 background: rgba(251,191,36,0.10);
14601460 border-color: rgba(251,191,36,0.36);
Modifiedsrc/routes/admin-diagnose.tsx+4−4View fileUnifiedSplit
@@ -664,9 +664,9 @@ function checkVapronWebhook(): CheckResult {
664664
665665function pill(status: CheckStatus): any {
666666 const map: Record<CheckStatus, { bg: string; fg: string; label: string }> = {
667 green: { bg: "rgba(52,211,153,0.16)", fg: "#34d399", label: "✓ OK" },
667 green: { bg: "rgba(52,211,153,0.16)", fg: "var(--green)", label: "✓ OK" },
668668 yellow: { bg: "rgba(245,158,11,0.16)", fg: "#f59e0b", label: "! WARN" },
669 red: { bg: "rgba(248,113,113,0.16)", fg: "#f87171", label: "× FAIL" },
669 red: { bg: "rgba(248,113,113,0.16)", fg: "var(--red)", label: "× FAIL" },
670670 };
671671 const s = map[status];
672672 return (
@@ -931,7 +931,7 @@ const healthStyles = `
931931 box-shadow: 0 0 0 3px rgba(255,255,255,0.04);
932932 }
933933 .health-card-dot.is-green {
934 background: #34d399;
934 background: var(--green);
935935 box-shadow: 0 0 0 3px rgba(52,211,153,0.16);
936936 }
937937 .health-card-dot.is-yellow {
@@ -939,7 +939,7 @@ const healthStyles = `
939939 box-shadow: 0 0 0 3px rgba(245,158,11,0.18);
940940 }
941941 .health-card-dot.is-red {
942 background: #f87171;
942 background: var(--red);
943943 box-shadow: 0 0 0 3px rgba(248,113,113,0.22);
944944 animation: health-pulse 1.8s ease-in-out infinite;
945945 }
Modifiedsrc/routes/admin-env-health.tsx+3−3View fileUnifiedSplit
@@ -84,7 +84,7 @@ const styles = `
8484 width: 18px; height: 18px;
8585 border-radius: 6px;
8686 background: rgba(91,110,232,0.14);
87 color: #5b6ee8;
87 color: var(--accent);
8888 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
8989 }
9090 .admin-envh-title {
@@ -190,12 +190,12 @@ const styles = `
190190 }
191191 .admin-envh-status.is-set {
192192 background: rgba(52,211,153,0.14);
193 color: #6ee7b7;
193 color: var(--green);
194194 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
195195 }
196196 .admin-envh-status.is-missing {
197197 background: rgba(248,113,113,0.10);
198 color: #fca5a5;
198 color: var(--red);
199199 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
200200 }
201201 .admin-envh-status .dot {
Modifiedsrc/routes/admin-integrations.tsx+3−3View fileUnifiedSplit
@@ -85,7 +85,7 @@ const styles = `
8585 width: 18px; height: 18px;
8686 border-radius: 6px;
8787 background: rgba(91,110,232,0.14);
88 color: #5b6ee8;
88 color: var(--accent);
8989 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
9090 }
9191 .admin-int-title {
@@ -226,7 +226,7 @@ const styles = `
226226 }
227227 .admin-int-status.is-set {
228228 background: rgba(52,211,153,0.14);
229 color: #6ee7b7;
229 color: var(--green);
230230 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
231231 }
232232 .admin-int-status.is-missing {
@@ -354,7 +354,7 @@ const styles = `
354354 }
355355 .admin-int-spec-copy.is-copied {
356356 background: #ecfdf5;
357 border-color: #6ee7b7;
357 border-color: var(--green);
358358 color: #047857;
359359 }
360360 .admin-int-spec-copy svg { display: block; }
Modifiedsrc/routes/admin-ops.tsx+10−10View fileUnifiedSplit
@@ -298,7 +298,7 @@ const opsStyles = `
298298 width: 18px; height: 18px;
299299 border-radius: 6px;
300300 background: rgba(91,110,232,0.14);
301 color: #5b6ee8;
301 color: var(--accent);
302302 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
303303 }
304304 .ops-eyebrow .ops-who { color: var(--accent); font-weight: 600; }
@@ -419,7 +419,7 @@ const opsStyles = `
419419 width: 26px; height: 26px;
420420 border-radius: 8px;
421421 background: rgba(91,110,232,0.12);
422 color: #5b6ee8;
422 color: var(--accent);
423423 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
424424 flex-shrink: 0;
425425 }
@@ -479,7 +479,7 @@ const opsStyles = `
479479 border-color: rgba(248,113,113,0.40);
480480 color: #fecaca;
481481 }
482 .ops-toggle.is-danger .ops-toggle-dot { background: #f87171; box-shadow: 0 0 0 3px rgba(248,113,113,0.25); }
482 .ops-toggle.is-danger .ops-toggle-dot { background: var(--red); box-shadow: 0 0 0 3px rgba(248,113,113,0.25); }
483483 .ops-toggle-status {
484484 display: flex;
485485 align-items: center;
@@ -533,7 +533,7 @@ const opsStyles = `
533533 box-shadow: 0 0 0 3px rgba(107,114,128,0.16);
534534 }
535535 .ops-light.is-pass {
536 background: #34d399;
536 background: var(--green);
537537 box-shadow: 0 0 0 3px rgba(52,211,153,0.22), 0 0 8px rgba(52,211,153,0.45);
538538 }
539539 .ops-light.is-warn {
@@ -541,7 +541,7 @@ const opsStyles = `
541541 box-shadow: 0 0 0 3px rgba(251,191,36,0.22), 0 0 8px rgba(251,191,36,0.40);
542542 }
543543 .ops-light.is-fail {
544 background: #f87171;
544 background: var(--red);
545545 box-shadow: 0 0 0 3px rgba(248,113,113,0.22), 0 0 10px rgba(248,113,113,0.50);
546546 animation: opsPulse 1.8s ease-in-out infinite;
547547 }
@@ -580,7 +580,7 @@ const opsStyles = `
580580 }
581581 .ops-readiness-summary.is-ok {
582582 background: rgba(52,211,153,0.14);
583 color: #6ee7b7;
583 color: var(--green);
584584 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
585585 }
586586 .ops-readiness-summary.is-fail {
@@ -600,8 +600,8 @@ const opsStyles = `
600600 font-size: 11.5px;
601601 font-weight: 600;
602602 }
603 .ops-pill.is-ok { background: rgba(52,211,153,0.16); color: #6ee7b7; }
604 .ops-pill.is-bad { background: rgba(248,113,113,0.16); color: #fca5a5; }
603 .ops-pill.is-ok { background: rgba(52,211,153,0.16); color: var(--green); }
604 .ops-pill.is-bad { background: rgba(248,113,113,0.16); color: var(--red); }
605605 .ops-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
606606
607607 /* ─── Deploy meta strip ─── */
@@ -690,7 +690,7 @@ const opsStyles = `
690690 .ops-copy.is-copied {
691691 background: rgba(52,211,153,0.14);
692692 border-color: rgba(52,211,153,0.45);
693 color: #6ee7b7;
693 color: var(--green);
694694 }
695695 .ops-copy svg { display: block; }
696696
@@ -765,7 +765,7 @@ const opsStyles = `
765765 }
766766 .ops-btn-danger {
767767 background: transparent;
768 color: #fca5a5;
768 color: var(--red);
769769 border-color: rgba(248,113,113,0.35);
770770 }
771771 .ops-btn-danger:hover:not(:disabled) {
Modifiedsrc/routes/admin-security.tsx+5−5View fileUnifiedSplit
@@ -78,9 +78,9 @@ const securityStyles = `
7878 }
7979 .sec-stat-label { font-size: 12px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 6px; }
8080 .sec-stat-value { font-size: 2rem; font-weight: 800; }
81 .sec-stat-value.danger { color: #f87171; }
81 .sec-stat-value.danger { color: var(--red); }
8282 .sec-stat-value.warning { color: #fb923c; }
83 .sec-stat-value.ok { color: #34d399; }
83 .sec-stat-value.ok { color: var(--green); }
8484
8585 .sec-section { margin-bottom: var(--space-6); }
8686 .sec-section h2 { font-size: 16px; font-weight: 700; margin: 0 0 12px; }
@@ -95,9 +95,9 @@ const securityStyles = `
9595 display: inline-block; padding: 2px 8px; border-radius: 100px;
9696 font-size: 11px; font-weight: 600;
9797 }
98 .sec-badge.red { background: #f871711a; color: #f87171; }
98 .sec-badge.red { background: #f871711a; color: var(--red); }
9999 .sec-badge.orange { background: #fb923c1a; color: #fb923c; }
100 .sec-badge.green { background: #34d3991a; color: #34d399; }
100 .sec-badge.green { background: #34d3991a; color: var(--green); }
101101
102102 /* SOC 2 checklist */
103103 .soc2-page { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
@@ -126,7 +126,7 @@ const securityStyles = `
126126 .soc2-text { flex: 1; }
127127 .soc2-label { font-weight: 600; }
128128 .soc2-desc { color: var(--text-muted); margin-top: 2px; font-size: 12.5px; }
129 .soc2-status-ok { color: #34d399; }
129 .soc2-status-ok { color: var(--green); }
130130 .soc2-status-warn { color: #fb923c; }
131131 .soc2-section-card {
132132 background: var(--bg-elevated); border: 1px solid var(--border);
Modifiedsrc/routes/admin-self-host.tsx+10−10View fileUnifiedSplit
@@ -285,7 +285,7 @@ const SELFHOST_CSS = `
285285 width: 18px; height: 18px;
286286 border-radius: 6px;
287287 background: rgba(91,110,232,0.14);
288 color: #5b6ee8;
288 color: var(--accent);
289289 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
290290 }
291291 .selfhost-eyebrow .selfhost-who { color: var(--accent); font-weight: 600; }
@@ -368,12 +368,12 @@ const SELFHOST_CSS = `
368368 }
369369 .selfhost-status-pill.is-ok {
370370 background: rgba(52,211,153,0.14);
371 color: #6ee7b7;
371 color: var(--green);
372372 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.36);
373373 }
374374 .selfhost-status-pill.is-bad {
375375 background: rgba(248,113,113,0.10);
376 color: #fca5a5;
376 color: var(--red);
377377 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.36);
378378 }
379379 .selfhost-status-pill .dot {
@@ -461,7 +461,7 @@ const SELFHOST_CSS = `
461461 width: 26px; height: 26px;
462462 border-radius: 8px;
463463 background: rgba(91,110,232,0.12);
464 color: #5b6ee8;
464 color: var(--accent);
465465 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
466466 flex-shrink: 0;
467467 }
@@ -526,12 +526,12 @@ const SELFHOST_CSS = `
526526 }
527527 .selfhost-pill.is-ok {
528528 background: rgba(52,211,153,0.14);
529 color: #6ee7b7;
529 color: var(--green);
530530 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
531531 }
532532 .selfhost-pill.is-bad {
533533 background: rgba(248,113,113,0.12);
534 color: #fca5a5;
534 color: var(--red);
535535 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
536536 }
537537 .selfhost-pill.is-warn {
@@ -678,8 +678,8 @@ const SELFHOST_CSS = `
678678 border-radius: 9999px;
679679 flex-shrink: 0;
680680 }
681 .selfhost-sha-dot.is-green { background: #34d399; box-shadow: 0 0 0 2px rgba(52,211,153,0.18); }
682 .selfhost-sha-dot.is-failed { background: #f87171; box-shadow: 0 0 0 2px rgba(248,113,113,0.20); }
681 .selfhost-sha-dot.is-green { background: var(--green); box-shadow: 0 0 0 2px rgba(52,211,153,0.18); }
682 .selfhost-sha-dot.is-failed { background: var(--red); box-shadow: 0 0 0 2px rgba(248,113,113,0.20); }
683683 .selfhost-sha-dot.is-rolling {
684684 background: #fbbf24;
685685 box-shadow: 0 0 0 2px rgba(251,191,36,0.22);
@@ -708,8 +708,8 @@ const SELFHOST_CSS = `
708708 font-size: 11.5px;
709709 font-weight: 600;
710710 }
711 .selfhost-row-status.is-ok { background: rgba(52,211,153,0.14); color: #6ee7b7; }
712 .selfhost-row-status.is-bad { background: rgba(248,113,113,0.16); color: #fca5a5; }
711 .selfhost-row-status.is-ok { background: rgba(52,211,153,0.14); color: var(--green); }
712 .selfhost-row-status.is-bad { background: rgba(248,113,113,0.16); color: var(--red); }
713713 .selfhost-row-status .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
714714
715715 /* ─── 403 fallback ─── */
Modifiedsrc/routes/admin-server-targets.tsx+1−1View fileUnifiedSplit
@@ -79,7 +79,7 @@ const card =
7979const inputStyle =
8080 "width:100%;background:#0b0e13;border:1px solid #1f2937;color:#e5e7eb;padding:8px 10px;border-radius:6px;font-family:ui-monospace,monospace";
8181const btn =
82 "background:#1f6feb;border:0;color:#fff;padding:8px 14px;border-radius:6px;cursor:pointer;font-size:14px";
82 "background:var(--accent);border:0;color:#fff;padding:8px 14px;border-radius:6px;cursor:pointer;font-size:14px";
8383const btnDanger =
8484 "background:#a02020;border:0;color:#fff;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:13px";
8585const btnSecondary =
Modifiedsrc/routes/admin-status.tsx+8−8View fileUnifiedSplit
@@ -475,7 +475,7 @@ const STATUS_CSS = `
475475 width: 18px; height: 18px;
476476 border-radius: 6px;
477477 background: rgba(52,211,153,0.14);
478 color: #6ee7b7;
478 color: var(--green);
479479 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.35);
480480 }
481481 .status-who { color: var(--accent); font-weight: 600; }
@@ -557,7 +557,7 @@ const STATUS_CSS = `
557557 .status-live-dot {
558558 width: 8px; height: 8px;
559559 border-radius: 9999px;
560 background: #34d399;
560 background: var(--green);
561561 box-shadow: 0 0 0 3px rgba(52,211,153,0.20);
562562 animation: status-pulse 1.4s ease-in-out infinite;
563563 flex-shrink: 0;
@@ -567,7 +567,7 @@ const STATUS_CSS = `
567567 box-shadow: 0 0 0 3px rgba(251,191,36,0.22);
568568 }
569569 .status-live.is-off .status-live-dot {
570 background: #f87171;
570 background: var(--red);
571571 box-shadow: 0 0 0 3px rgba(248,113,113,0.22);
572572 animation: none;
573573 }
@@ -716,7 +716,7 @@ const STATUS_CSS = `
716716 margin-top: 4px;
717717 font-family: var(--font-mono);
718718 font-size: 11.5px;
719 color: #fca5a5;
719 color: var(--red);
720720 line-height: 1.4;
721721 }
722722
@@ -729,11 +729,11 @@ const STATUS_CSS = `
729729 vertical-align: middle;
730730 }
731731 .status-dot.is-green {
732 background: #34d399;
732 background: var(--green);
733733 box-shadow: 0 0 0 3px rgba(52,211,153,0.18), 0 0 8px rgba(52,211,153,0.40);
734734 }
735735 .status-dot.is-red {
736 background: #f87171;
736 background: var(--red);
737737 box-shadow: 0 0 0 3px rgba(248,113,113,0.20), 0 0 10px rgba(248,113,113,0.45);
738738 animation: status-pulse 1.6s ease-in-out infinite;
739739 }
@@ -779,7 +779,7 @@ const STATUS_CSS = `
779779 align-items: center;
780780 gap: 6px;
781781 font-size: 12px;
782 color: #fca5a5;
782 color: var(--red);
783783 }
784784 .status-feed-action code {
785785 font-family: var(--font-mono);
@@ -788,7 +788,7 @@ const STATUS_CSS = `
788788 border: 1px solid rgba(248,113,113,0.28);
789789 padding: 1px 6px;
790790 border-radius: 4px;
791 color: #fca5a5;
791 color: var(--red);
792792 text-transform: uppercase;
793793 letter-spacing: 0.06em;
794794 font-weight: 700;
Modifiedsrc/routes/admin-stripe.tsx+3−3View fileUnifiedSplit
@@ -94,9 +94,9 @@ const styles = `
9494 .adm-stripe-table code { font-family: var(--font-mono); font-size: 11px; color: var(--text-strong); }
9595
9696 .adm-stripe-pill { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 9999px; font-size: 11px; font-weight: 700; }
97 .adm-stripe-pill-active { background: rgba(52,211,153,0.12); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
97 .adm-stripe-pill-active { background: rgba(52,211,153,0.12); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
9898 .adm-stripe-pill-warn { background: rgba(251,146,60,0.12); color: #fdba74; box-shadow: inset 0 0 0 1px rgba(251,146,60,0.32); }
99 .adm-stripe-pill-err { background: rgba(248,113,113,0.12); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.35); }
99 .adm-stripe-pill-err { background: rgba(248,113,113,0.12); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.35); }
100100 .adm-stripe-pill-muted { background: rgba(255,255,255,0.04); color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--border); }
101101
102102 .adm-stripe-mismatch-row td { background: rgba(251,146,60,0.05) !important; }
@@ -288,7 +288,7 @@ adminStripe.get("/admin/stripe", async (c) => {
288288 : <span style="color:var(--text-muted)">—</span>
289289 }
290290 {r.stripeError && (
291 <span style="color:#fca5a5;font-size:11px;display:block;margin-top:2px" title={r.stripeError}>
291 <span style="color:var(--red);font-size:11px;display:block;margin-top:2px" title={r.stripeError}>
292292 ⚠ fetch failed
293293 </span>
294294 )}
Modifiedsrc/routes/admin.tsx+24−24View fileUnifiedSplit
@@ -104,7 +104,7 @@ const adminStyles = `
104104 width: 18px; height: 18px;
105105 border-radius: 6px;
106106 background: rgba(91,110,232,0.14);
107 color: #5b6ee8;
107 color: var(--accent);
108108 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
109109 }
110110 .admin-hero-eyebrow .admin-who {
@@ -277,7 +277,7 @@ const adminStyles = `
277277 width: 26px; height: 26px;
278278 border-radius: 8px;
279279 background: rgba(91,110,232,0.12);
280 color: #5b6ee8;
280 color: var(--accent);
281281 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
282282 }
283283 .admin-stat-value {
@@ -470,7 +470,7 @@ const adminStyles = `
470470 }
471471 .admin-pill.is-on {
472472 background: rgba(52,211,153,0.14);
473 color: #6ee7b7;
473 color: var(--green);
474474 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
475475 }
476476 .admin-pill.is-off {
@@ -814,7 +814,7 @@ const admUsersStyles = `
814814 width: 22px; height: 22px;
815815 border-radius: 6px;
816816 background: rgba(91,110,232,0.14);
817 color: #5b6ee8;
817 color: var(--accent);
818818 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
819819 }
820820 .adm-users-title {
@@ -961,7 +961,7 @@ const admUsersStyles = `
961961 .adm-users-btn-primary:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 10px 24px -8px rgba(91,110,232,0.55); }
962962 .adm-users-btn-danger {
963963 background: transparent;
964 color: #fca5a5;
964 color: var(--red);
965965 border-color: rgba(248,113,113,0.40);
966966 }
967967 .adm-users-btn-danger:hover {
@@ -1094,7 +1094,7 @@ const admUsersStyles = `
10941094 width: 56px; height: 56px;
10951095 border-radius: 16px;
10961096 background: rgba(91,110,232,0.10);
1097 color: #5b6ee8;
1097 color: var(--accent);
10981098 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
10991099 margin-bottom: var(--space-3);
11001100 }
@@ -1175,7 +1175,7 @@ const admReposStyles = `
11751175 width: 22px; height: 22px;
11761176 border-radius: 6px;
11771177 background: rgba(91,110,232,0.14);
1178 color: #5b6ee8;
1178 color: var(--accent);
11791179 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
11801180 }
11811181 .adm-repos-title {
@@ -1272,7 +1272,7 @@ const admReposStyles = `
12721272 .adm-repos-btn-ghost:hover { color: var(--text); background: rgba(255,255,255,0.03); border-color: var(--border-strong); }
12731273 .adm-repos-btn-danger {
12741274 background: transparent;
1275 color: #fca5a5;
1275 color: var(--red);
12761276 border-color: rgba(248,113,113,0.40);
12771277 }
12781278 .adm-repos-btn-danger:hover {
@@ -1311,7 +1311,7 @@ const admReposStyles = `
13111311 width: 38px; height: 38px;
13121312 border-radius: 10px;
13131313 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.12));
1314 color: #5b6ee8;
1314 color: var(--accent);
13151315 display: inline-flex;
13161316 align-items: center;
13171317 justify-content: center;
@@ -1387,7 +1387,7 @@ const admReposStyles = `
13871387 width: 56px; height: 56px;
13881388 border-radius: 16px;
13891389 background: rgba(91,110,232,0.10);
1390 color: #5b6ee8;
1390 color: var(--accent);
13911391 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
13921392 margin-bottom: var(--space-3);
13931393 }
@@ -1460,7 +1460,7 @@ const admFlagsStyles = `
14601460 width: 22px; height: 22px;
14611461 border-radius: 6px;
14621462 background: rgba(91,110,232,0.14);
1463 color: #5b6ee8;
1463 color: var(--accent);
14641464 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
14651465 }
14661466 .adm-flags-title {
@@ -1675,7 +1675,7 @@ const admDigestsStyles = `
16751675 width: 22px; height: 22px;
16761676 border-radius: 6px;
16771677 background: rgba(91,110,232,0.14);
1678 color: #5b6ee8;
1678 color: var(--accent);
16791679 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
16801680 }
16811681 .adm-digests-title {
@@ -1761,7 +1761,7 @@ const admDigestsStyles = `
17611761 .adm-digests-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
17621762 .adm-digests-pill.is-on {
17631763 background: rgba(52,211,153,0.14);
1764 color: #6ee7b7;
1764 color: var(--green);
17651765 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
17661766 }
17671767
@@ -1787,7 +1787,7 @@ const admDigestsStyles = `
17871787 width: 26px; height: 26px;
17881788 border-radius: 8px;
17891789 background: rgba(91,110,232,0.12);
1790 color: #5b6ee8;
1790 color: var(--accent);
17911791 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
17921792 flex-shrink: 0;
17931793 }
@@ -1953,7 +1953,7 @@ const admDigestsStyles = `
19531953 width: 56px; height: 56px;
19541954 border-radius: 16px;
19551955 background: rgba(91,110,232,0.10);
1956 color: #5b6ee8;
1956 color: var(--accent);
19571957 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
19581958 margin-bottom: var(--space-3);
19591959 }
@@ -2026,7 +2026,7 @@ const admAutopilotStyles = `
20262026 width: 22px; height: 22px;
20272027 border-radius: 6px;
20282028 background: rgba(91,110,232,0.14);
2029 color: #5b6ee8;
2029 color: var(--accent);
20302030 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
20312031 }
20322032 .adm-autopilot-title {
@@ -2131,7 +2131,7 @@ const admAutopilotStyles = `
21312131 width: 26px; height: 26px;
21322132 border-radius: 8px;
21332133 background: rgba(91,110,232,0.12);
2134 color: #5b6ee8;
2134 color: var(--accent);
21352135 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
21362136 }
21372137 .adm-autopilot-stat-value {
@@ -2163,7 +2163,7 @@ const admAutopilotStyles = `
21632163 .adm-autopilot-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
21642164 .adm-autopilot-pill.is-on {
21652165 background: rgba(52,211,153,0.14);
2166 color: #6ee7b7;
2166 color: var(--green);
21672167 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
21682168 }
21692169 .adm-autopilot-pill.is-off {
@@ -2255,11 +2255,11 @@ const admAutopilotStyles = `
22552255 box-shadow: 0 0 0 3px rgba(107,114,128,0.16);
22562256 }
22572257 .adm-autopilot-task-light.is-ok {
2258 background: #34d399;
2258 background: var(--green);
22592259 box-shadow: 0 0 0 3px rgba(52,211,153,0.22), 0 0 8px rgba(52,211,153,0.45);
22602260 }
22612261 .adm-autopilot-task-light.is-fail {
2262 background: #f87171;
2262 background: var(--red);
22632263 box-shadow: 0 0 0 3px rgba(248,113,113,0.22), 0 0 10px rgba(248,113,113,0.50);
22642264 animation: admApPulse 1.8s ease-in-out infinite;
22652265 }
@@ -2293,7 +2293,7 @@ const admAutopilotStyles = `
22932293 }
22942294 .adm-autopilot-task-status.is-ok {
22952295 background: rgba(52,211,153,0.14);
2296 color: #6ee7b7;
2296 color: var(--green);
22972297 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
22982298 }
22992299 .adm-autopilot-task-status.is-fail {
@@ -2348,7 +2348,7 @@ const admAutopilotStyles = `
23482348 width: 56px; height: 56px;
23492349 border-radius: 16px;
23502350 background: rgba(91,110,232,0.10);
2351 color: #5b6ee8;
2351 color: var(--accent);
23522352 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
23532353 margin-bottom: var(--space-3);
23542354 }
@@ -2427,7 +2427,7 @@ const admAnalyticsStyles = `
24272427 .adm-analytics-eyebrow-pill {
24282428 display: inline-flex; align-items: center; justify-content: center;
24292429 width: 22px; height: 22px; border-radius: 6px;
2430 background: rgba(91,110,232,0.14); color: #5b6ee8;
2430 background: rgba(91,110,232,0.14); color: var(--accent);
24312431 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
24322432 }
24332433 .adm-analytics-title {
@@ -2524,7 +2524,7 @@ const admAnalyticsStyles = `
25242524 background: rgba(91,110,232,0.12); color: #c5b3ff;
25252525 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
25262526 }
2527 .adm-analytics-pill.is-ok { background: rgba(52,211,153,0.12); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.28); }
2527 .adm-analytics-pill.is-ok { background: rgba(52,211,153,0.12); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.28); }
25282528 .adm-analytics-pill.is-err { background: rgba(248,113,113,0.12); color: #fecaca; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.28); }
25292529
25302530 (max-width: 720px) {
Modifiedsrc/routes/advisories.tsx+3−3View fileUnifiedSplit
@@ -346,7 +346,7 @@ const styles = `
346346 border-radius: 6px;
347347 font-family: var(--font-mono);
348348 font-size: 12px;
349 color: #6ee7b7;
349 color: var(--green);
350350 background: rgba(52,211,153,0.10);
351351 border: 1px solid rgba(52,211,153,0.28);
352352 }
@@ -429,7 +429,7 @@ const styles = `
429429 line-height: 1.4;
430430 }
431431 .adv-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
432 .adv-pill.is-critical { background: rgba(248,113,113,0.16); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.42); }
432 .adv-pill.is-critical { background: rgba(248,113,113,0.16); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.42); }
433433 .adv-pill.is-high { background: rgba(251,146,60,0.14); color: #fdba74; box-shadow: inset 0 0 0 1px rgba(251,146,60,0.36); }
434434 .adv-pill.is-medium { background: rgba(251,191,36,0.12); color: #fde68a; box-shadow: inset 0 0 0 1px rgba(251,191,36,0.32); }
435435 .adv-pill.is-low { background: rgba(96,165,250,0.12); color: #93c5fd; box-shadow: inset 0 0 0 1px rgba(96,165,250,0.32); }
@@ -450,7 +450,7 @@ const styles = `
450450 border: 1px solid var(--border);
451451 }
452452 .adv-status.is-dismissed { color: #cbd5e1; }
453 .adv-status.is-fixed { color: #6ee7b7; border-color: rgba(52,211,153,0.32); background: rgba(52,211,153,0.10); }
453 .adv-status.is-fixed { color: var(--green); border-color: rgba(52,211,153,0.32); background: rgba(52,211,153,0.10); }
454454
455455 /* Empty state — dashed orb card */
456456 .adv-empty {
Modifiedsrc/routes/agent-pipelines.tsx+1−1View fileUnifiedSplit
@@ -94,7 +94,7 @@ const styles = `
9494 border: 1px solid transparent;
9595 }
9696 .ap-badge-active { background: rgba(54,197,100,0.1); color: #36c564; border-color: rgba(54,197,100,0.3); }
97 .ap-badge-idle { background: rgba(91,110,232,0.1); color: #5b6ee8; border-color: rgba(91,110,232,0.3); }
97 .ap-badge-idle { background: rgba(91,110,232,0.1); color: var(--accent); border-color: rgba(91,110,232,0.3); }
9898 .ap-badge-expired { background: rgba(255,100,80,0.1); color: #ff6450; border-color: rgba(255,100,80,0.3); }
9999 .ap-card {
100100 border: 1px solid var(--border);
Modifiedsrc/routes/ai-archaeology.tsx+2−2View fileUnifiedSplit
@@ -398,7 +398,7 @@ const styles = `
398398 }
399399 .arch-icon-issue {
400400 background: rgba(248,113,113,0.12);
401 color: #f87171;
401 color: var(--red);
402402 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.28);
403403 }
404404
@@ -438,7 +438,7 @@ const styles = `
438438 }
439439 .arch-type-commit { background: rgba(140,109,255,0.12); color: #a78bfa; }
440440 .arch-type-pr { background: rgba(52,211,153,0.12); color: #10b981; }
441 .arch-type-issue { background: rgba(248,113,113,0.12); color: #f87171; }
441 .arch-type-issue { background: rgba(248,113,113,0.12); color: var(--red); }
442442
443443 /* Empty states */
444444 .arch-empty {
Modifiedsrc/routes/ai-changelog.tsx+2−2View fileUnifiedSplit
@@ -91,7 +91,7 @@ const styles = `
9191 width: 18px; height: 18px;
9292 border-radius: 6px;
9393 background: rgba(91,110,232,0.14);
94 color: #5b6ee8;
94 color: var(--accent);
9595 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
9696 }
9797 .ai-changelog-title {
@@ -347,7 +347,7 @@ const styles = `
347347 .ai-changelog-copy:hover { background: #f3f4f6; border-color: #9ca3af; }
348348 .ai-changelog-copy.is-copied {
349349 background: #ecfdf5;
350 border-color: #6ee7b7;
350 border-color: var(--green);
351351 color: #047857;
352352 }
353353 .ai-changelog-copy svg { display: block; }
Modifiedsrc/routes/ai-explain.tsx+3−3View fileUnifiedSplit
@@ -96,7 +96,7 @@ const styles = `
9696 width: 18px; height: 18px;
9797 border-radius: 6px;
9898 background: rgba(91,110,232,0.14);
99 color: #5b6ee8;
99 color: var(--accent);
100100 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
101101 }
102102
@@ -152,7 +152,7 @@ const styles = `
152152 letter-spacing: 0.04em;
153153 text-transform: uppercase;
154154 background: rgba(52,211,153,0.12);
155 color: #6ee7b7;
155 color: var(--green);
156156 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
157157 }
158158 .ai-explain-meta .ai-explain-pill .dot {
@@ -260,7 +260,7 @@ const styles = `
260260 }
261261 .ai-explain-copy.is-copied {
262262 background: #ecfdf5;
263 border-color: #6ee7b7;
263 border-color: var(--green);
264264 color: #047857;
265265 }
266266 .ai-explain-copy svg { display: block; }
Modifiedsrc/routes/ai-tests.tsx+2−2View fileUnifiedSplit
@@ -104,7 +104,7 @@ const styles = `
104104 width: 18px; height: 18px;
105105 border-radius: 6px;
106106 background: rgba(91,110,232,0.14);
107 color: #5b6ee8;
107 color: var(--accent);
108108 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
109109 }
110110 .ai-tests-title {
@@ -347,7 +347,7 @@ const styles = `
347347 .ai-tests-copy:hover { background: #f3f4f6; border-color: #9ca3af; }
348348 .ai-tests-copy.is-copied {
349349 background: #ecfdf5;
350 border-color: #6ee7b7;
350 border-color: var(--green);
351351 color: #047857;
352352 }
353353 .ai-tests-copy svg { display: block; }
Modifiedsrc/routes/ai-workspace.tsx+7−7View fileUnifiedSplit
@@ -91,15 +91,15 @@ const wsStyles = `
9191 transition: background 200ms;
9292 }
9393 .ws-step.is-done .ws-step-dot {
94 background: #34d399;
94 background: var(--green);
9595 }
9696 .ws-step.is-active .ws-step-dot {
97 background: #5b6ee8;
97 background: var(--accent);
9898 box-shadow: 0 0 0 4px rgba(91,110,232,0.22);
9999 animation: ws-pulse 1.4s ease-in-out infinite;
100100 }
101101 .ws-step.is-failed .ws-step-dot {
102 background: #f87171;
102 background: var(--red);
103103 }
104104 ws-pulse {
105105 0%, 100% { box-shadow: 0 0 0 4px rgba(91,110,232,0.22); }
@@ -112,9 +112,9 @@ const wsStyles = `
112112 line-height: 1.4;
113113 padding-top: 1px;
114114 }
115 .ws-step.is-done .ws-step-label { color: #34d399; }
115 .ws-step.is-done .ws-step-label { color: var(--green); }
116116 .ws-step.is-active .ws-step-label { color: var(--text-strong); }
117 .ws-step.is-failed .ws-step-label { color: #f87171; }
117 .ws-step.is-failed .ws-step-label { color: var(--red); }
118118 .ws-step-desc {
119119 font-size: 12.5px;
120120 color: var(--text-muted);
@@ -209,12 +209,12 @@ const wsStyles = `
209209 }
210210 .ws-badge-done {
211211 background: rgba(52,211,153,0.12);
212 color: #34d399;
212 color: var(--green);
213213 border: 1px solid rgba(52,211,153,0.3);
214214 }
215215 .ws-badge-failed {
216216 background: rgba(248,113,113,0.12);
217 color: #f87171;
217 color: var(--red);
218218 border: 1px solid rgba(248,113,113,0.3);
219219 }
220220`;
Modifiedsrc/routes/api-docs.tsx+3−3View fileUnifiedSplit
@@ -160,7 +160,7 @@ const apiDocsStyles = `
160160 }
161161 .apidocs-method.m-get {
162162 background: rgba(52,211,153,0.14);
163 color: #6ee7b7;
163 color: var(--green);
164164 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
165165 }
166166 .apidocs-method.m-post {
@@ -233,7 +233,7 @@ const apiDocsStyles = `
233233 }
234234 .apidocs-badge.is-scope {
235235 background: rgba(52,211,153,0.14);
236 color: #6ee7b7;
236 color: var(--green);
237237 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
238238 }
239239 .apidocs-badge .dot { width: 5px; height: 5px; border-radius: 9999px; background: currentColor; }
@@ -326,7 +326,7 @@ const apiDocsStyles = `
326326 }
327327 .apidocs-spec-copy.is-copied {
328328 background: #ecfdf5;
329 border-color: #6ee7b7;
329 border-color: var(--green);
330330 color: #047857;
331331 }
332332 .apidocs-spec-copy svg { display: block; }
Modifiedsrc/routes/ask.tsx+2−2View fileUnifiedSplit
@@ -265,7 +265,7 @@ const askCss = `
265265 width: 18px; height: 18px;
266266 border-radius: 6px;
267267 background: rgba(91,110,232,0.14);
268 color: #5b6ee8;
268 color: var(--accent);
269269 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
270270 }
271271 .ask-eyebrow-who { color: var(--accent); font-weight: 700; text-transform: none; letter-spacing: 0; font-size: 12.5px; }
@@ -332,7 +332,7 @@ const askCss = `
332332 width: 36px; height: 36px;
333333 border-radius: 10px;
334334 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.10));
335 color: #5b6ee8;
335 color: var(--accent);
336336 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
337337 flex-shrink: 0;
338338 }
Modifiedsrc/routes/audit.tsx+1−1View fileUnifiedSplit
@@ -351,7 +351,7 @@ const AUDIT_CSS = `
351351 width: 18px; height: 18px;
352352 border-radius: 6px;
353353 background: rgba(91,110,232,0.14);
354 color: #5b6ee8;
354 color: var(--accent);
355355 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
356356 }
357357 .audit-eyebrow-who { color: var(--accent); font-weight: 600; }
Modifiedsrc/routes/automation-settings.tsx+3−3View fileUnifiedSplit
@@ -108,12 +108,12 @@ const automationStyles = `
108108 }
109109 .automation-banner-success {
110110 background: rgba(52,211,153,0.08);
111 color: #6ee7b7;
111 color: var(--green);
112112 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
113113 }
114114 .automation-banner-error {
115115 background: rgba(248,113,113,0.08);
116 color: #fca5a5;
116 color: var(--red);
117117 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
118118 }
119119 .automation-card {
@@ -175,7 +175,7 @@ const automationStyles = `
175175 padding: 2px 8px;
176176 border-radius: 9999px;
177177 background: rgba(91,110,232,0.12);
178 color: #5b6ee8;
178 color: var(--accent);
179179 white-space: nowrap;
180180 }
181181 .automation-foot {
Modifiedsrc/routes/billing-usage.tsx+1−1View fileUnifiedSplit
@@ -179,7 +179,7 @@ const styles = `
179179
180180 /* Trend chart */
181181 .cost-trend { width: 100%; height: 140px; display: block; }
182 .cost-trend-line { stroke: #5b6ee8; stroke-width: 2; fill: none; }
182 .cost-trend-line { stroke: var(--accent); stroke-width: 2; fill: none; }
183183 .cost-trend-fill { fill: url(#cost-grad); opacity: 0.45; }
184184 .cost-trend-axis { stroke: var(--border); stroke-width: 1; opacity: 0.6; }
185185 .cost-trend-label { fill: var(--text-muted); font-family: var(--font-mono); font-size: 10px; }
Modifiedsrc/routes/billing.tsx+2−2View fileUnifiedSplit
@@ -349,7 +349,7 @@ const styles = `
349349 }
350350 .bill-plan-badge.is-current {
351351 background: rgba(52,211,153,0.18);
352 color: #6ee7b7;
352 color: var(--green);
353353 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.50);
354354 }
355355 .bill-plan-name {
@@ -389,7 +389,7 @@ const styles = `
389389 }
390390 .bill-plan-feats .check {
391391 flex-shrink: 0;
392 color: #34d399;
392 color: var(--green);
393393 font-weight: 700;
394394 }
395395 .bill-plan-feats .x {
Modifiedsrc/routes/build-agent-spec.tsx+2−2View fileUnifiedSplit
@@ -67,7 +67,7 @@ const styles = `
6767 width: 18px; height: 18px;
6868 border-radius: 6px;
6969 background: rgba(91,110,232,0.14);
70 color: #5b6ee8;
70 color: var(--accent);
7171 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
7272 }
7373 .ba-spec-title {
@@ -152,7 +152,7 @@ const styles = `
152152 }
153153 .ba-spec-copy.is-copied {
154154 background: #ecfdf5;
155 border-color: #6ee7b7;
155 border-color: var(--green);
156156 color: #047857;
157157 }
158158 .ba-spec-copy svg { display: block; }
Modifiedsrc/routes/claude-web.tsx+1−1View fileUnifiedSplit
@@ -73,7 +73,7 @@ const card =
7373const inputStyle =
7474 "width:100%;background:#0b0e13;border:1px solid #1f2937;color:#e5e7eb;padding:10px 12px;border-radius:6px;font-size:16px";
7575const btn =
76 "background:#1f6feb;border:0;color:#fff;padding:10px 16px;border-radius:6px;cursor:pointer;font-size:15px";
76 "background:var(--accent);border:0;color:#fff;padding:10px 16px;border-radius:6px;cursor:pointer;font-size:15px";
7777
7878// ─── GET /:owner/:repo/claude ───────────────────────────────────────────────
7979
Modifiedsrc/routes/code-scanning.tsx+4−4View fileUnifiedSplit
@@ -168,8 +168,8 @@ const styles = `
168168 font-variant-numeric: tabular-nums;
169169 line-height: 1;
170170 }
171 .sec-stat.is-red .sec-stat-value { color: #fca5a5; }
172 .sec-stat.is-green .sec-stat-value { color: #6ee7b7; }
171 .sec-stat.is-red .sec-stat-value { color: var(--red); }
172 .sec-stat.is-green .sec-stat-value { color: var(--green); }
173173 .sec-stat-hint {
174174 margin-top: 6px;
175175 font-size: 12px;
@@ -282,8 +282,8 @@ const styles = `
282282 line-height: 1.4;
283283 }
284284 .sec-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
285 .sec-pill.is-passed { background: rgba(52,211,153,0.14); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
286 .sec-pill.is-failed { background: rgba(248,113,113,0.12); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.34); }
285 .sec-pill.is-passed { background: rgba(52,211,153,0.14); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
286 .sec-pill.is-failed { background: rgba(248,113,113,0.12); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.34); }
287287 .sec-pill.is-repaired { background: rgba(91,110,232,0.14); color: #c4b5fd; box-shadow: inset 0 0 0 1px rgba(91,110,232,0.34); }
288288 .sec-pill.is-skipped { background: rgba(148,163,184,0.10); color: #cbd5e1; box-shadow: inset 0 0 0 1px rgba(148,163,184,0.28); }
289289 .sec-pill.is-pending,
Modifiedsrc/routes/codebase-migrator.tsx+2−2View fileUnifiedSplit
@@ -418,7 +418,7 @@ const migrateStyles = `
418418 .mgp-phase.is-active {
419419 background: rgba(245,158,11,0.12);
420420 border-color: rgba(245,158,11,0.40);
421 color: #fbbf24;
421 color: var(--yellow);
422422 }
423423 .mgp-phase.is-done-phase {
424424 background: rgba(34,197,94,0.10);
@@ -428,7 +428,7 @@ const migrateStyles = `
428428 .mgp-phase.is-failed-phase {
429429 background: rgba(239,68,68,0.10);
430430 border-color: rgba(239,68,68,0.28);
431 color: #f87171;
431 color: var(--red);
432432 }
433433
434434 /* Progress bar */
Modifiedsrc/routes/collaborators.tsx+3−3View fileUnifiedSplit
@@ -211,7 +211,7 @@ const collabStyles = `
211211 width: 26px; height: 26px;
212212 border-radius: 8px;
213213 background: rgba(91,110,232,0.12);
214 color: #5b6ee8;
214 color: var(--accent);
215215 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
216216 flex-shrink: 0;
217217 }
@@ -306,7 +306,7 @@ const collabStyles = `
306306 }
307307 .collab-btn-danger {
308308 background: transparent;
309 color: #fca5a5;
309 color: var(--red);
310310 border-color: rgba(248,113,113,0.35);
311311 }
312312 .collab-btn-danger:hover {
@@ -456,7 +456,7 @@ const collabStyles = `
456456 }
457457 .collab-pill.is-accepted {
458458 background: rgba(52,211,153,0.14);
459 color: #6ee7b7;
459 color: var(--green);
460460 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
461461 }
462462
Modifiedsrc/routes/comment-moderation.tsx+1−1View fileUnifiedSplit
@@ -147,7 +147,7 @@ const QUEUE_STYLES = `
147147 }
148148 .modq-btn:hover { border-color: var(--text-muted, #9aa4b2); }
149149 .modq-btn-approve {
150 color: #56d364;
150 color: var(--green);
151151 border-color: rgba(86, 211, 100, 0.45);
152152 background: rgba(86, 211, 100, 0.08);
153153 }
Modifiedsrc/routes/compare.tsx+1−1View fileUnifiedSplit
@@ -131,7 +131,7 @@ const COMPARE_STYLES = `
131131 font-size: 12px;
132132 }
133133 .compare-branch-card.is-base .compare-branch-label strong { color: #ff9d76; }
134 .compare-branch-card.is-head .compare-branch-label strong { color: #5b6ee8; }
134 .compare-branch-card.is-head .compare-branch-label strong { color: var(--accent); }
135135 .compare-branch-select {
136136 appearance: none;
137137 -webkit-appearance: none;
Modifiedsrc/routes/connect-claude.tsx+2−2View fileUnifiedSplit
@@ -471,7 +471,7 @@ const styles = `
471471 .connect-claude-token-display .dot {
472472 width: 8px; height: 8px;
473473 border-radius: 50%;
474 background: #3fb950;
474 background: var(--green);
475475 box-shadow: 0 0 8px rgba(63,185,80,0.6);
476476 flex-shrink: 0;
477477 }
@@ -624,7 +624,7 @@ const styles = `
624624 flex-shrink: 0;
625625 }
626626 .connect-claude-status.is-live .connect-claude-status-dot {
627 background: #3fb950;
627 background: var(--green);
628628 box-shadow: 0 0 8px rgba(63,185,80,0.6);
629629 }
630630 .connect-claude-status-main { flex: 1; }
Modifiedsrc/routes/contributors.tsx+3−3View fileUnifiedSplit
@@ -490,8 +490,8 @@ const contribStyles = `
490490 letter-spacing: 0.06em;
491491 font-weight: 600;
492492 }
493 .contrib-add { color: #6ee7b7; }
494 .contrib-del { color: #fca5a5; }
493 .contrib-add { color: var(--green); }
494 .contrib-del { color: var(--red); }
495495
496496 /* ─── Section cards ─── */
497497 .contrib-section {
@@ -539,7 +539,7 @@ const contribStyles = `
539539 width: 26px; height: 26px;
540540 border-radius: 8px;
541541 background: rgba(91,110,232,0.12);
542 color: #5b6ee8;
542 color: var(--accent);
543543 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
544544 flex-shrink: 0;
545545 }
Modifiedsrc/routes/dashboard.tsx+1−1View fileUnifiedSplit
@@ -1866,7 +1866,7 @@ const QuickActionsPanel = ({
18661866 justify-content: center;
18671867 border-radius: 5px;
18681868 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.14));
1869 color: #5b6ee8;
1869 color: var(--accent);
18701870 font-size: 11px;
18711871 font-weight: 700;
18721872 flex-shrink: 0;
Modifiedsrc/routes/debt-map.tsx+12−12View fileUnifiedSplit
@@ -446,7 +446,7 @@ const styles = `
446446 color: var(--text-muted);
447447 margin-bottom: var(--space-4);
448448 }
449 .dm-no-ai strong { color: #fbbf24; }
449 .dm-no-ai strong { color: var(--yellow); }
450450
451451 /* ── Running state ────────────────────────────────────────────────────────── */
452452 .dm-running {
@@ -464,7 +464,7 @@ const styles = `
464464 .dm-spinner {
465465 width: 16px; height: 16px;
466466 border: 2px solid rgba(91,110,232,0.3);
467 border-top-color: #5b6ee8;
467 border-top-color: var(--accent);
468468 border-radius: 9999px;
469469 animation: dm-spin 0.8s linear infinite;
470470 flex-shrink: 0;
@@ -484,9 +484,9 @@ const styles = `
484484// ─── Helpers ──────────────────────────────────────────────────────────────────
485485
486486function debtColor(score: number): string {
487 if (score <= 33) return "#34d399"; // green
488 if (score <= 66) return "#fbbf24"; // yellow
489 return "#f87171"; // red
487 if (score <= 33) return "var(--green)"; // green
488 if (score <= 66) return "var(--yellow)"; // yellow
489 return "var(--red)"; // red
490490}
491491
492492// ─── Route: GET /:owner/:repo/debt-map ────────────────────────────────────────
@@ -646,15 +646,15 @@ debtMapRoutes.get(
646646 Node size = lines of code • Colour = debt score
647647 </span>
648648 <span class="dm-legend-item">
649 <span class="dm-legend-dot" style="background:#34d399;" />
649 <span class="dm-legend-dot" style="background:var(--green);" />
650650 Low (0-33)
651651 </span>
652652 <span class="dm-legend-item">
653 <span class="dm-legend-dot" style="background:#fbbf24;" />
653 <span class="dm-legend-dot" style="background:var(--yellow);" />
654654 Medium (34-66)
655655 </span>
656656 <span class="dm-legend-item">
657 <span class="dm-legend-dot" style="background:#f87171;" />
657 <span class="dm-legend-dot" style="background:var(--red);" />
658658 High (67-100)
659659 </span>
660660 </div>
@@ -961,9 +961,9 @@ function buildGraphScript(
961961 });
962962
963963 function debtColor(score){
964 if(score <= 33) return '#34d399';
965 if(score <= 66) return '#fbbf24';
966 return '#f87171';
964 if(score <= 33) return 'var(--green)';
965 if(score <= 66) return 'var(--yellow)';
966 return 'var(--red)';
967967 }
968968
969969 // Force simulation
@@ -1224,7 +1224,7 @@ function buildControlScript(
12241224 window.location.reload();
12251225 } else if(data.status === 'error'){
12261226 var runBar = document.getElementById('dm-running-bar');
1227 if(runBar) runBar.innerHTML = '<span style="color:#f87171;">Analysis failed: '+(data.error||'unknown error')+'</span>';
1227 if(runBar) runBar.innerHTML = '<span style="color:var(--red);">Analysis failed: '+(data.error||'unknown error')+'</span>';
12281228 var btn2 = document.getElementById('dm-trigger-btn');
12291229 if(btn2){ btn2.disabled = false; btn2.textContent = 'Retry'; }
12301230 } else {
Modifiedsrc/routes/demo.tsx+4−4View fileUnifiedSplit
@@ -580,7 +580,7 @@ const DEMO_CSS = `
580580 width: 8px;
581581 height: 8px;
582582 border-radius: 50%;
583 background: #34d399;
583 background: var(--green);
584584 box-shadow: 0 0 8px rgba(52,211,153,0.7);
585585 animation: demo-page-pulse 1.6s infinite;
586586 }
@@ -652,7 +652,7 @@ const DEMO_CSS = `
652652 .demo-page-reset.is-done {
653653 border-color: rgba(52,211,153,0.45);
654654 background: rgba(52,211,153,0.10);
655 color: #6ee7b7;
655 color: var(--green);
656656 }
657657
658658 /* ─── Section cards ─── */
@@ -926,13 +926,13 @@ const DEMO_CSS = `
926926 .demo-page-kind-auto_merge-merged,
927927 .demo-page-kind-auto-merge-merged {
928928 background: rgba(52,211,153,0.12);
929 color: #34d399;
929 color: var(--green);
930930 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.28);
931931 }
932932 .demo-page-kind-ai_build-dispatched,
933933 .demo-page-kind-ai-build-dispatched {
934934 background: rgba(91,110,232,0.15);
935 color: #5b6ee8;
935 color: var(--accent);
936936 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
937937 }
938938 .demo-page-kind-ai_review-posted,
Modifiedsrc/routes/dep-updater.tsx+3−3View fileUnifiedSplit
@@ -195,7 +195,7 @@ const depStyles = `
195195 width: 26px; height: 26px;
196196 border-radius: 8px;
197197 background: rgba(91,110,232,0.12);
198 color: #5b6ee8;
198 color: var(--accent);
199199 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
200200 flex-shrink: 0;
201201 }
@@ -382,7 +382,7 @@ const depStyles = `
382382 .dep-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
383383 .dep-pill.is-success {
384384 background: rgba(52,211,153,0.14);
385 color: #6ee7b7;
385 color: var(--green);
386386 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
387387 }
388388 .dep-pill.is-no-updates {
@@ -392,7 +392,7 @@ const depStyles = `
392392 }
393393 .dep-pill.is-failed {
394394 background: rgba(248,113,113,0.14);
395 color: #fca5a5;
395 color: var(--red);
396396 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
397397 }
398398 .dep-pill.is-running {
Modifiedsrc/routes/deploy-targets.tsx+5−5View fileUnifiedSplit
@@ -155,12 +155,12 @@ const styles = `
155155 }
156156 .dt-banner-success {
157157 background: rgba(52,211,153,0.08);
158 color: #6ee7b7;
158 color: var(--green);
159159 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
160160 }
161161 .dt-banner-error {
162162 background: rgba(248,113,113,0.08);
163 color: #fca5a5;
163 color: var(--red);
164164 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
165165 }
166166 .dt-banner-icon {
@@ -173,8 +173,8 @@ const styles = `
173173 font-size: 12px;
174174 font-weight: 700;
175175 }
176 .dt-banner-success .dt-banner-icon { background: rgba(52,211,153,0.18); color: #34d399; }
177 .dt-banner-error .dt-banner-icon { background: rgba(248,113,113,0.18); color: #f87171; }
176 .dt-banner-success .dt-banner-icon { background: rgba(52,211,153,0.18); color: var(--green); }
177 .dt-banner-error .dt-banner-icon { background: rgba(248,113,113,0.18); color: var(--red); }
178178
179179 /* ─── Section cards ─── */
180180 .dt-section {
@@ -327,7 +327,7 @@ const styles = `
327327 }
328328 .dt-status-verified {
329329 background: rgba(52,211,153,0.12);
330 color: #6ee7b7;
330 color: var(--green);
331331 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.28);
332332 }
333333 .dt-status-unverified {
Modifiedsrc/routes/deployments.tsx+12−12View fileUnifiedSplit
@@ -66,7 +66,7 @@ const deployStyles = `
6666 width: 18px; height: 18px;
6767 border-radius: 6px;
6868 background: rgba(91,110,232,0.14);
69 color: #5b6ee8;
69 color: var(--accent);
7070 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
7171 }
7272 .dk-title {
@@ -244,12 +244,12 @@ const deployStyles = `
244244 }
245245 .dk-status.is-success {
246246 background: rgba(52,211,153,0.14);
247 color: #6ee7b7;
247 color: var(--green);
248248 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
249249 }
250250 .dk-status.is-failed {
251251 background: rgba(248,113,113,0.14);
252 color: #fca5a5;
252 color: var(--red);
253253 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
254254 }
255255 .dk-status.is-blocked {
@@ -375,7 +375,7 @@ const deployStyles = `
375375 }
376376 .dk-kv td a { color: var(--accent); text-decoration: none; }
377377 .dk-kv td a:hover { text-decoration: underline; }
378 .dk-kv .dk-blocked { color: #fca5a5; }
378 .dk-kv .dk-blocked { color: var(--red); }
379379 .dk-retry {
380380 margin-top: var(--space-4);
381381 display: flex;
@@ -839,7 +839,7 @@ const cloudDeploySettingsStyles = `
839839 .cds-badge {
840840 display: inline-flex; align-items: center; padding: 2px 8px;
841841 border-radius: 6px; font-size: 11px; font-weight: 700;
842 background: rgba(91,110,232,0.14); color: #5b6ee8;
842 background: rgba(91,110,232,0.14); color: var(--accent);
843843 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.3);
844844 }
845845 .cds-mono { font-family: var(--font-mono); font-size: 12px; }
@@ -862,14 +862,14 @@ const cloudDeploySettingsStyles = `
862862 .cds-btn-primary:hover { filter: brightness(1.1); }
863863 .cds-btn-ghost { background: rgba(255,255,255,0.03); border-color: var(--border); color: var(--text); }
864864 .cds-btn-ghost:hover { background: rgba(255,255,255,0.06); border-color: var(--border-strong); }
865 .cds-btn-danger { background: rgba(239,68,68,0.12); border-color: rgba(239,68,68,0.35); color: #fca5a5; }
865 .cds-btn-danger { background: rgba(239,68,68,0.12); border-color: rgba(239,68,68,0.35); color: var(--red); }
866866 .cds-btn-danger:hover { background: rgba(239,68,68,0.2); }
867867 .cds-footer { margin-top: var(--space-4); display: flex; justify-content: flex-end; }
868868 .cds-empty { padding: var(--space-5); text-align: center; color: var(--text-muted); font-size: 13px; }
869869 .cds-status { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700;
870870 padding: 2px 8px; border-radius: 9999px; }
871 .cds-status.is-success { background: rgba(52,211,153,0.14); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
872 .cds-status.is-failed { background: rgba(248,113,113,0.14); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32); }
871 .cds-status.is-success { background: rgba(52,211,153,0.14); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
872 .cds-status.is-failed { background: rgba(248,113,113,0.14); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32); }
873873 .cds-status.is-running, .cds-status.is-pending { background: rgba(96,165,250,0.14); color: #bfdbfe; box-shadow: inset 0 0 0 1px rgba(96,165,250,0.32); }
874874 .cds-status.is-cancelled { background: rgba(107,114,128,0.16); color: #d1d5db; box-shadow: inset 0 0 0 1px rgba(107,114,128,0.32); }
875875 .cds-runs { display: flex; flex-direction: column; gap: 0; }
@@ -941,17 +941,17 @@ dep.get("/:owner/:repo/settings/deployments", requireAuth, async (c) => {
941941 </header>
942942
943943 {flash === "added" && (
944 <div style="background:rgba(52,211,153,0.1);border:1px solid rgba(52,211,153,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:#6ee7b7;margin-bottom:var(--space-4);">
944 <div style="background:rgba(52,211,153,0.1);border:1px solid rgba(52,211,153,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:var(--green);margin-bottom:var(--space-4);">
945945 Integration added successfully.
946946 </div>
947947 )}
948948 {flash === "deleted" && (
949 <div style="background:rgba(248,113,113,0.1);border:1px solid rgba(248,113,113,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:#fca5a5;margin-bottom:var(--space-4);">
949 <div style="background:rgba(248,113,113,0.1);border:1px solid rgba(248,113,113,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:var(--red);margin-bottom:var(--space-4);">
950950 Integration removed.
951951 </div>
952952 )}
953953 {flash === "error" && (
954 <div style="background:rgba(248,113,113,0.1);border:1px solid rgba(248,113,113,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:#fca5a5;margin-bottom:var(--space-4);">
954 <div style="background:rgba(248,113,113,0.1);border:1px solid rgba(248,113,113,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:var(--red);margin-bottom:var(--space-4);">
955955 Error: SERVER_TARGETS_KEY env var is not set. Cloud deploy tokens cannot
956956 be encrypted.
957957 </div>
@@ -1318,7 +1318,7 @@ dep.get("/:owner/:repo/cloud-deployments", softAuth, async (c) => {
13181318 )}
13191319 {run.status === "failed" && run.errorMessage && (
13201320 <span
1321 style="font-size:11.5px;color:#fca5a5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"
1321 style="font-size:11.5px;color:var(--red);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"
13221322 title={run.errorMessage}
13231323 >
13241324 {run.errorMessage.slice(0, 60)}
Modifiedsrc/routes/deps.tsx+2−2View fileUnifiedSplit
@@ -289,13 +289,13 @@ const depsStyles = `
289289 }
290290 .deps-chip.is-vuln-zero {
291291 background: rgba(52,211,153,0.10);
292 color: #6ee7b7;
292 color: var(--green);
293293 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.28);
294294 }
295295 .deps-chip .vuln-dot {
296296 width: 6px; height: 6px;
297297 border-radius: 9999px;
298 background: #f87171;
298 background: var(--red);
299299 box-shadow: 0 0 0 2px rgba(248,113,113,0.20);
300300 }
301301
Modifiedsrc/routes/developer-apps.tsx+4−4View fileUnifiedSplit
@@ -266,12 +266,12 @@ const devStyles = `
266266 }
267267 .dev-pill.is-active {
268268 background: rgba(52,211,153,0.14);
269 color: #6ee7b7;
269 color: var(--green);
270270 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
271271 }
272272 .dev-pill.is-revoked {
273273 background: rgba(248,113,113,0.12);
274 color: #fca5a5;
274 color: var(--red);
275275 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
276276 }
277277 .dev-pill.is-public {
@@ -344,7 +344,7 @@ const devStyles = `
344344
345345 .dev-section.is-danger { border-color: rgba(248,113,113,0.30); }
346346 .dev-section.is-danger .dev-section-head { border-bottom-color: rgba(248,113,113,0.30); }
347 .dev-section.is-danger .dev-section-title { color: #fca5a5; }
347 .dev-section.is-danger .dev-section-title { color: var(--red); }
348348
349349 /* ─── Field ─── */
350350 .dev-field { margin-bottom: var(--space-4); }
@@ -524,7 +524,7 @@ const devStyles = `
524524 }
525525 .dev-btn-danger {
526526 background: transparent;
527 color: #fca5a5;
527 color: var(--red);
528528 border-color: rgba(248,113,113,0.40);
529529 }
530530 .dev-btn-danger:hover {
Modifiedsrc/routes/developer-program.tsx+1−1View fileUnifiedSplit
@@ -389,7 +389,7 @@ const devprogCss = `
389389 display: flex; align-items: center; justify-content: center;
390390 font-size: 14px;
391391 flex-shrink: 0;
392 color: #34d399;
392 color: var(--green);
393393 }
394394
395395 /* ─── Docs link strip ─── */
Modifiedsrc/routes/discussions.tsx+3−3View fileUnifiedSplit
@@ -338,11 +338,11 @@ const styles = `
338338 letter-spacing: 0.06em;
339339 text-transform: uppercase;
340340 background: rgba(91,110,232,0.10);
341 color: #5b6ee8;
341 color: var(--accent);
342342 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
343343 }
344344 .disc-tag.is-pinned { background: rgba(252,211,77,0.10); color: #fcd34d; box-shadow: inset 0 0 0 1px rgba(252,211,77,0.32); }
345 .disc-tag.is-closed { background: rgba(248,113,113,0.10); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32); }
345 .disc-tag.is-closed { background: rgba(248,113,113,0.10); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32); }
346346 .disc-tag.is-locked { background: rgba(148,163,184,0.10); color: #cbd5e1; box-shadow: inset 0 0 0 1px rgba(148,163,184,0.32); }
347347
348348 .disc-card-meta {
@@ -484,7 +484,7 @@ const styles = `
484484 padding: 2px 9px;
485485 border-radius: 9999px;
486486 background: rgba(52,211,153,0.12);
487 color: #34d399;
487 color: var(--green);
488488 font-size: 11px;
489489 font-weight: 700;
490490 border: 1px solid rgba(52,211,153,0.35);
Modifiedsrc/routes/docs-tracking.tsx+2−2View fileUnifiedSplit
@@ -232,7 +232,7 @@ const docTrackingStyles = `
232232 border-radius: 6px;
233233 }
234234 .doctrk-section-meta a {
235 color: #5b6ee8;
235 color: var(--accent);
236236 text-decoration: none;
237237 }
238238 .doctrk-section-meta a:hover { text-decoration: underline; }
@@ -260,7 +260,7 @@ const docTrackingStyles = `
260260 }
261261 .doctrk-pill.is-fresh {
262262 background: rgba(52,211,153,0.10);
263 color: #6ee7b7;
263 color: var(--green);
264264 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
265265 }
266266 .doctrk-pill.is-unseen {
Modifiedsrc/routes/editor.tsx+5−5View fileUnifiedSplit
@@ -271,7 +271,7 @@ function CODEMIRROR_INIT_SCRIPT(args: {
271271 },
272272 '.cm-content': {
273273 padding: '12px 14px',
274 caretColor: '#5b6ee8',
274 caretColor: 'var(--accent)',
275275 },
276276 '.cm-focused': {
277277 outline: 'none',
@@ -298,7 +298,7 @@ function CODEMIRROR_INIT_SCRIPT(args: {
298298 maxHeight: '70vh',
299299 },
300300 '.cm-cursor': {
301 borderLeftColor: '#5b6ee8',
301 borderLeftColor: 'var(--accent)',
302302 },
303303 });
304304
@@ -984,7 +984,7 @@ const editorStyles = `
984984 width: 10px;
985985 height: 10px;
986986 border: 1.5px solid rgba(164,139,255,0.3);
987 border-top-color: #5b6ee8;
987 border-top-color: var(--accent);
988988 border-radius: 50%;
989989 animation: ai-spin 0.7s linear infinite;
990990 }
@@ -1014,7 +1014,7 @@ const editorStyles = `
10141014 font-weight: 700;
10151015 text-transform: uppercase;
10161016 letter-spacing: 0.1em;
1017 color: #5b6ee8;
1017 color: var(--accent);
10181018 }
10191019 .ai-explain-panel-close {
10201020 background: none;
@@ -1088,7 +1088,7 @@ const editorStyles = `
10881088 align-items: center;
10891089 gap: 4px;
10901090 font-size: 11px;
1091 color: #5b6ee8;
1091 color: var(--accent);
10921092 background: rgba(91,110,232,0.08);
10931093 border: 1px solid rgba(91,110,232,0.20);
10941094 border-radius: 999px;
Modifiedsrc/routes/email-verification.tsx+2−2View fileUnifiedSplit
@@ -351,7 +351,7 @@ const evStyles = `
351351 width: 18px; height: 18px;
352352 border-radius: 6px;
353353 background: rgba(91,110,232,0.14);
354 color: #5b6ee8;
354 color: var(--accent);
355355 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
356356 }
357357 .ev-crumb { color: var(--text-muted); text-decoration: none; }
@@ -510,7 +510,7 @@ const evStyles = `
510510 width: 26px; height: 26px;
511511 border-radius: 8px;
512512 background: rgba(91,110,232,0.12);
513 color: #5b6ee8;
513 color: var(--accent);
514514 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
515515 flex-shrink: 0;
516516 }
Modifiedsrc/routes/engineering-insights.tsx+8−8View fileUnifiedSplit
@@ -227,8 +227,8 @@ const styles = `
227227 color: var(--text-muted);
228228 margin-bottom: 4px;
229229 }
230 .ei-kpi-delta.up { color: #34d399; }
231 .ei-kpi-delta.down { color: #f87171; }
230 .ei-kpi-delta.up { color: var(--green); }
231 .ei-kpi-delta.down { color: var(--red); }
232232 .ei-kpi-sub {
233233 font-size: 12px;
234234 color: var(--text-muted);
@@ -383,7 +383,7 @@ const styles = `
383383 margin-right: 8px;
384384 flex-shrink: 0;
385385 }
386 .ei-contributor-rank.top1 { background: rgba(251,191,36,0.15); color: #fbbf24; }
386 .ei-contributor-rank.top1 { background: rgba(251,191,36,0.15); color: var(--yellow); }
387387 .ei-contributor-rank.top2 { background: rgba(156,163,175,0.15); color: #9ca3af; }
388388 .ei-contributor-rank.top3 { background: rgba(217,119,6,0.15); color: #d97706; }
389389 .ei-avatar {
@@ -423,7 +423,7 @@ const styles = `
423423 .ei-alert.red {
424424 border: 1px solid rgba(248,113,113,0.3);
425425 background: rgba(248,113,113,0.07);
426 color: #fca5a5;
426 color: var(--red);
427427 }
428428 .ei-alert.amber {
429429 border: 1px solid rgba(251,191,36,0.3);
@@ -433,7 +433,7 @@ const styles = `
433433 .ei-alert.green {
434434 border: 1px solid rgba(52,211,153,0.3);
435435 background: rgba(52,211,153,0.07);
436 color: #6ee7b7;
436 color: var(--green);
437437 }
438438 .ei-alert-icon { font-size: 16px; line-height: 1.4; flex-shrink: 0; }
439439 .ei-alert strong { font-weight: 700; }
@@ -516,9 +516,9 @@ const styles = `
516516 letter-spacing: 0.08em;
517517 margin-bottom: var(--space-3);
518518 }
519 .ei-health-badge.red { background: rgba(248,113,113,0.12); color: #f87171; }
520 .ei-health-badge.amber { background: rgba(251,191,36,0.12); color: #fbbf24; }
521 .ei-health-badge.green { background: rgba(52,211,153,0.12); color: #34d399; }
519 .ei-health-badge.red { background: rgba(248,113,113,0.12); color: var(--red); }
520 .ei-health-badge.amber { background: rgba(251,191,36,0.12); color: var(--yellow); }
521 .ei-health-badge.green { background: rgba(52,211,153,0.12); color: var(--green); }
522522 .ei-health-num {
523523 font-family: var(--font-display);
524524 font-size: 28px;
Modifiedsrc/routes/environments.tsx+2−2View fileUnifiedSplit
@@ -325,7 +325,7 @@ const envsStyles = `
325325 }
326326 .envs-pill.is-active {
327327 background: rgba(52,211,153,0.10);
328 color: #6ee7b7;
328 color: var(--green);
329329 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
330330 }
331331 .envs-pill.is-protected {
@@ -488,7 +488,7 @@ const envsStyles = `
488488 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.14));
489489 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
490490 display: flex; align-items: center; justify-content: center;
491 color: #5b6ee8;
491 color: var(--accent);
492492 }
493493 .envs-empty-title {
494494 font-family: var(--font-display);
Modifiedsrc/routes/explain.tsx+4−4View fileUnifiedSplit
@@ -81,7 +81,7 @@ const STYLES = `
8181 display: inline-flex; align-items: center; justify-content: center;
8282 width: 18px; height: 18px; border-radius: 6px;
8383 background: rgba(91,110,232,0.14);
84 color: #5b6ee8;
84 color: var(--accent);
8585 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
8686 }
8787 .explain-title {
@@ -136,7 +136,7 @@ const STYLES = `
136136 .explain-spinner {
137137 width: 36px; height: 36px; flex-shrink: 0;
138138 border: 3px solid rgba(91,110,232,0.18);
139 border-top-color: #5b6ee8;
139 border-top-color: var(--accent);
140140 border-radius: 50%;
141141 animation: explain-spin 0.8s linear infinite;
142142 }
@@ -191,7 +191,7 @@ const STYLES = `
191191 display: flex; align-items: center; justify-content: center;
192192 width: 22px; height: 22px; border-radius: 6px;
193193 background: rgba(91,110,232,0.12);
194 color: #5b6ee8;
194 color: var(--accent);
195195 flex-shrink: 0;
196196 }
197197 .explain-card-title {
@@ -406,7 +406,7 @@ const STYLES = `
406406 padding: 2px 8px; border-radius: 9999px;
407407 font-size: 10.5px; font-weight: 600; letter-spacing: 0.04em;
408408 text-transform: uppercase;
409 background: rgba(52,211,153,0.12); color: #6ee7b7;
409 background: rgba(52,211,153,0.12); color: var(--green);
410410 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
411411 }
412412 .explain-cached-pill .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
Modifiedsrc/routes/gates.tsx+12−12View fileUnifiedSplit
@@ -131,7 +131,7 @@ const gatesStyles = `
131131 width: 18px; height: 18px;
132132 border-radius: 6px;
133133 background: rgba(91,110,232,0.14);
134 color: #5b6ee8;
134 color: var(--accent);
135135 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
136136 }
137137 .gates-title {
@@ -303,9 +303,9 @@ const gatesStyles = `
303303 background: currentColor;
304304 opacity: 0.55;
305305 }
306 .gates-stat.is-pass { color: #34d399; }
307 .gates-stat.is-repaired { color: #5b6ee8; }
308 .gates-stat.is-fail { color: #f87171; }
306 .gates-stat.is-pass { color: var(--green); }
307 .gates-stat.is-repaired { color: var(--accent); }
308 .gates-stat.is-fail { color: var(--red); }
309309 .gates-stat.is-skipped { color: var(--text-muted); }
310310 .gates-stat-num {
311311 font-family: var(--font-display);
@@ -355,7 +355,7 @@ const gatesStyles = `
355355 width: 26px; height: 26px;
356356 border-radius: 8px;
357357 background: rgba(91,110,232,0.12);
358 color: #5b6ee8;
358 color: var(--accent);
359359 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
360360 flex-shrink: 0;
361361 }
@@ -395,9 +395,9 @@ const gatesStyles = `
395395 background: #6b7280;
396396 box-shadow: 0 0 0 3px rgba(107,114,128,0.18);
397397 }
398 .gates-run-light.is-pass { background: #34d399; box-shadow: 0 0 0 3px rgba(52,211,153,0.22), 0 0 8px rgba(52,211,153,0.40); }
399 .gates-run-light.is-fail { background: #f87171; box-shadow: 0 0 0 3px rgba(248,113,113,0.22), 0 0 10px rgba(248,113,113,0.45); }
400 .gates-run-light.is-repaired { background: #5b6ee8; box-shadow: 0 0 0 3px rgba(91,110,232,0.22), 0 0 8px rgba(91,110,232,0.40); }
398 .gates-run-light.is-pass { background: var(--green); box-shadow: 0 0 0 3px rgba(52,211,153,0.22), 0 0 8px rgba(52,211,153,0.40); }
399 .gates-run-light.is-fail { background: var(--red); box-shadow: 0 0 0 3px rgba(248,113,113,0.22), 0 0 10px rgba(248,113,113,0.45); }
400 .gates-run-light.is-repaired { background: var(--accent); box-shadow: 0 0 0 3px rgba(91,110,232,0.22), 0 0 8px rgba(91,110,232,0.40); }
401401 .gates-run-body { flex: 1; min-width: 0; }
402402 .gates-run-head {
403403 display: flex;
@@ -421,7 +421,7 @@ const gatesStyles = `
421421 letter-spacing: 0.06em;
422422 border-radius: 9999px;
423423 }
424 .gates-run-pill.is-pass { background: rgba(52,211,153,0.14); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
424 .gates-run-pill.is-pass { background: rgba(52,211,153,0.14); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
425425 .gates-run-pill.is-fail { background: rgba(248,113,113,0.14); color: #fecaca; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
426426 .gates-run-pill.is-repaired { background: rgba(91,110,232,0.14); color: #c4b5fd; box-shadow: inset 0 0 0 1px rgba(91,110,232,0.30); }
427427 .gates-run-pill.is-skipped { background: rgba(255,255,255,0.04); color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--border); }
@@ -530,7 +530,7 @@ const gatesStyles = `
530530 margin-top: 3px;
531531 flex-shrink: 0;
532532 width: 18px; height: 18px;
533 accent-color: #5b6ee8;
533 accent-color: var(--accent);
534534 cursor: pointer;
535535 }
536536 .gates-toggle-text { flex: 1; min-width: 0; }
@@ -593,7 +593,7 @@ const gatesStyles = `
593593 }
594594 .gates-chip.is-on {
595595 background: rgba(52,211,153,0.12);
596 color: #6ee7b7;
596 color: var(--green);
597597 border-color: rgba(52,211,153,0.30);
598598 }
599599 .gates-chip.is-warn {
@@ -667,7 +667,7 @@ const gatesStyles = `
667667 transition: border-color 120ms ease, background 120ms ease;
668668 }
669669 .gates-checkbox:hover { border-color: rgba(91,110,232,0.45); background: rgba(91,110,232,0.06); }
670 .gates-checkbox input { accent-color: #5b6ee8; cursor: pointer; }
670 .gates-checkbox input { accent-color: var(--accent); cursor: pointer; }
671671 .gates-checkbox.is-num { gap: 8px; padding: 4px 8px 4px 11px; }
672672
673673 /* ─── Buttons ─── */
Modifiedsrc/routes/gists.tsx+3−3View fileUnifiedSplit
@@ -140,7 +140,7 @@ const gistsStyles = `
140140 }
141141 .gists-btn-danger {
142142 background: transparent;
143 color: #fca5a5;
143 color: var(--red);
144144 border-color: rgba(248,113,113,0.35);
145145 }
146146 .gists-btn-danger:hover {
@@ -275,7 +275,7 @@ const gistsStyles = `
275275 }
276276 .gists-pill.is-public {
277277 background: rgba(52,211,153,0.14);
278 color: #6ee7b7;
278 color: var(--green);
279279 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
280280 }
281281 .gists-pill.is-secret {
@@ -426,7 +426,7 @@ const gistsStyles = `
426426 flex-wrap: wrap;
427427 }
428428 .gists-detail-title a { color: #c4b5fd; text-decoration: none; }
429 .gists-detail-title a:hover { color: #5b6ee8; text-decoration: underline; }
429 .gists-detail-title a:hover { color: var(--accent); text-decoration: underline; }
430430 .gists-detail-actions { display: flex; gap: 8px; flex-wrap: wrap; }
431431
432432 /* Star button */
Modifiedsrc/routes/health-score.tsx+7−7View fileUnifiedSplit
@@ -139,10 +139,10 @@ const styles = `
139139 letter-spacing: 0.06em;
140140 text-transform: uppercase;
141141 }
142 .hs-grade-elite { background: rgba(52,211,153,.15); color: #34d399; border: 1px solid rgba(52,211,153,.3); }
142 .hs-grade-elite { background: rgba(52,211,153,.15); color: var(--green); border: 1px solid rgba(52,211,153,.3); }
143143 .hs-grade-strong { background: rgba(96,165,250,.15); color: #60a5fa; border: 1px solid rgba(96,165,250,.3); }
144144 .hs-grade-improving { background: rgba(250,204,21,.15); color: #facc15; border: 1px solid rgba(250,204,21,.3); }
145 .hs-grade-needs-attention { background: rgba(248,113,113,.15); color: #f87171; border: 1px solid rgba(248,113,113,.3); }
145 .hs-grade-needs-attention { background: rgba(248,113,113,.15); color: var(--red); border: 1px solid rgba(248,113,113,.3); }
146146
147147 .hs-hero-text {
148148 flex: 1;
@@ -212,9 +212,9 @@ const styles = `
212212 }
213213
214214 /* Bar fill colours keyed to component */
215 .hs-fill-security { background: #f87171; }
216 .hs-fill-security.good { background: #34d399; }
217 .hs-fill-greenGates { background: #34d399; }
215 .hs-fill-security { background: var(--red); }
216 .hs-fill-security.good { background: var(--green); }
217 .hs-fill-greenGates { background: var(--green); }
218218 .hs-fill-velocity { background: #60a5fa; }
219219 .hs-fill-maintenance { background: #a78bfa; }
220220
@@ -244,10 +244,10 @@ function gaugeProps(score: number): { dasharray: string; dashoffset: string; col
244244 const circumference = 2 * Math.PI * 50; // ≈ 314.16
245245 const dashoffset = circumference * (1 - score / 100);
246246 const color =
247 score >= 85 ? "#34d399" :
247 score >= 85 ? "var(--green)" :
248248 score >= 70 ? "#60a5fa" :
249249 score >= 50 ? "#facc15" :
250 "#f87171";
250 "var(--red)";
251251 return {
252252 dasharray: circumference.toFixed(2),
253253 dashoffset: dashoffset.toFixed(2),
Modifiedsrc/routes/hot-files.tsx+3−3View fileUnifiedSplit
@@ -219,9 +219,9 @@ const styles = `
219219 text-transform: uppercase;
220220 letter-spacing: 0.04em;
221221 }
222 .hf-risk-high { background: rgba(248,113,113,0.18); color: #f87171; }
223 .hf-risk-medium { background: rgba(251,191, 36,0.18); color: #fbbf24; }
224 .hf-risk-low { background: rgba( 52,211,153,0.18); color: #34d399; }
222 .hf-risk-high { background: rgba(248,113,113,0.18); color: var(--red); }
223 .hf-risk-medium { background: rgba(251,191, 36,0.18); color: var(--yellow); }
224 .hf-risk-low { background: rgba( 52,211,153,0.18); color: var(--green); }
225225
226226 /* Empty state */
227227 .hf-empty {
Modifiedsrc/routes/import-bulk.tsx+2−2View fileUnifiedSplit
@@ -415,12 +415,12 @@ const importBulkStyles = `
415415 flex-shrink: 0;
416416 }
417417 .import-bulk-badge-success {
418 color: #3fb950;
418 color: var(--green);
419419 background: rgba(63,185,80,0.13);
420420 border: 1px solid rgba(63,185,80,0.28);
421421 }
422422 .import-bulk-badge-success .import-bulk-badge-dot {
423 background: #3fb950;
423 background: var(--green);
424424 box-shadow: 0 0 6px rgba(63,185,80,0.7);
425425 }
426426 .import-bulk-badge-warn {
Modifiedsrc/routes/import-secrets.tsx+2−2View fileUnifiedSplit
@@ -106,7 +106,7 @@ const checklistStyles = `
106106 width: 18px; height: 18px;
107107 border-radius: 6px;
108108 background: rgba(91,110,232,0.14);
109 color: #5b6ee8;
109 color: var(--accent);
110110 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
111111 }
112112 .is-checklist-title {
@@ -247,7 +247,7 @@ const checklistStyles = `
247247 background: currentColor;
248248 }
249249 .is-checklist-pill.is-saved {
250 color: #6ee7b7;
250 color: var(--green);
251251 background: rgba(52,211,153,0.14);
252252 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
253253 }
Modifiedsrc/routes/inbox.tsx+5−5View fileUnifiedSplit
@@ -276,9 +276,9 @@ const styles = `
276276 color: var(--text);
277277 margin-top: 1px;
278278 }
279 .inbox-row-icon.is-mention { color: #fbbf24; background: rgba(251,191,36,0.10); border-color: rgba(251,191,36,0.25); }
279 .inbox-row-icon.is-mention { color: var(--yellow); background: rgba(251,191,36,0.10); border-color: rgba(251,191,36,0.25); }
280280 .inbox-row-icon.is-review { color: #60a5fa; background: rgba(96,165,250,0.10); border-color: rgba(96,165,250,0.25); }
281 .inbox-row-icon.is-ci { color: #f87171; background: rgba(248,113,113,0.10); border-color: rgba(248,113,113,0.25); }
281 .inbox-row-icon.is-ci { color: var(--red); background: rgba(248,113,113,0.10); border-color: rgba(248,113,113,0.25); }
282282 .inbox-row-icon.is-ai {
283283 color: #fff;
284284 background: linear-gradient(135deg, #5b6ee8 0%, #5f8fa0 100%);
@@ -288,7 +288,7 @@ const styles = `
288288 .inbox-row-icon.is-ci .inbox-ci-dot {
289289 width: 8px; height: 8px;
290290 border-radius: 9999px;
291 background: #f87171;
291 background: var(--red);
292292 box-shadow: 0 0 8px rgba(248,113,113,0.55);
293293 }
294294
@@ -343,9 +343,9 @@ const styles = `
343343 text-transform: uppercase;
344344 border-radius: 9999px;
345345 }
346 .inbox-row-kind.is-mention { background: rgba(251,191,36,0.13); color: #fbbf24; }
346 .inbox-row-kind.is-mention { background: rgba(251,191,36,0.13); color: var(--yellow); }
347347 .inbox-row-kind.is-review { background: rgba(96,165,250,0.13); color: #93c5fd; }
348 .inbox-row-kind.is-ci { background: rgba(248,113,113,0.13); color: #fca5a5; }
348 .inbox-row-kind.is-ci { background: rgba(248,113,113,0.13); color: var(--red); }
349349 .inbox-row-kind.is-ai-finding {
350350 background: linear-gradient(135deg, rgba(91,110,232,0.20), rgba(95,143,160,0.18));
351351 color: #d6c7ff;
Modifiedsrc/routes/incident-hooks.tsx+1−1View fileUnifiedSplit
@@ -925,7 +925,7 @@ const ihStyles = `
925925 .ih-btn-danger {
926926 background: rgba(248,113,113,0.08);
927927 border-color: rgba(248,113,113,0.30);
928 color: #fca5a5;
928 color: var(--red);
929929 }
930930 .ih-btn-danger:hover { background: rgba(248,113,113,0.14); }
931931
Modifiedsrc/routes/insights.tsx+6−6View fileUnifiedSplit
@@ -149,7 +149,7 @@ const styles = `
149149 font-variant-numeric: tabular-nums;
150150 line-height: 1;
151151 }
152 .insights-stat-value.is-warn { color: #fca5a5; }
152 .insights-stat-value.is-warn { color: var(--red); }
153153 .insights-stat-trend {
154154 margin-top: 6px;
155155 display: inline-flex;
@@ -159,8 +159,8 @@ const styles = `
159159 font-variant-numeric: tabular-nums;
160160 color: var(--text-muted);
161161 }
162 .insights-stat-trend.is-up { color: #6ee7b7; }
163 .insights-stat-trend.is-down { color: #fca5a5; }
162 .insights-stat-trend.is-up { color: var(--green); }
163 .insights-stat-trend.is-down { color: var(--red); }
164164 .insights-stat-trend .arrow { font-size: 11px; line-height: 1; }
165165 .insights-stat-hint {
166166 margin-top: 6px;
@@ -246,8 +246,8 @@ const styles = `
246246 white-space: nowrap;
247247 font-variant-numeric: tabular-nums;
248248 }
249 .insights-card-meta .add { color: #6ee7b7; }
250 .insights-card-meta .del { color: #fca5a5; }
249 .insights-card-meta .add { color: var(--green); }
250 .insights-card-meta .del { color: var(--red); }
251251
252252 .insights-coupled {
253253 font-family: var(--font-mono);
@@ -367,7 +367,7 @@ const styles = `
367367 box-shadow: inset 0 0 0 1px rgba(96,165,250,0.30);
368368 }
369369 .insights-dep-unused {
370 color: #fca5a5;
370 color: var(--red);
371371 font-weight: 600;
372372 }
373373
Modifiedsrc/routes/invites.tsx+2−2View fileUnifiedSplit
@@ -87,7 +87,7 @@ const invStyles = `
8787 width: 18px; height: 18px;
8888 border-radius: 6px;
8989 background: rgba(91,110,232,0.14);
90 color: #5b6ee8;
90 color: var(--accent);
9191 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
9292 }
9393 .inv-title {
@@ -174,7 +174,7 @@ const invStyles = `
174174 width: 26px; height: 26px;
175175 border-radius: 8px;
176176 background: rgba(91,110,232,0.12);
177 color: #5b6ee8;
177 color: var(--accent);
178178 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
179179 flex-shrink: 0;
180180 }
Modifiedsrc/routes/issues-dashboard.tsx+6−6View fileUnifiedSplit
@@ -205,8 +205,8 @@ const styles = `
205205 align-items: center;
206206 justify-content: center;
207207 }
208 .idash-row-icon.is-open { color: #34d399; }
209 .idash-row-icon.is-closed { color: #5b6ee8; }
208 .idash-row-icon.is-open { color: var(--green); }
209 .idash-row-icon.is-closed { color: var(--accent); }
210210 .idash-row-main { flex: 1; min-width: 0; }
211211 .idash-row-title {
212212 font-family: var(--font-display);
@@ -272,8 +272,8 @@ const styles = `
272272 background: currentColor;
273273 }
274274 .idash-badge.ai-triaged { color: #93c5fd; background: rgba(96,165,250,0.12); box-shadow: inset 0 0 0 1px rgba(96,165,250,0.32); }
275 .idash-badge.ai-fix { color: #6ee7b7; background: rgba(52,211,153,0.13); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
276 .idash-badge.ai-progress { color: #5b6ee8; background: rgba(91,110,232,0.18); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.36); }
275 .idash-badge.ai-fix { color: var(--green); background: rgba(52,211,153,0.13); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
276 .idash-badge.ai-progress { color: var(--accent); background: rgba(91,110,232,0.18); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.36); }
277277 .idash-badge.ai-progress .dot { animation: idashPulse 1.6s ease-in-out infinite; }
278278
279279 idashPulse {
@@ -292,8 +292,8 @@ const styles = `
292292 letter-spacing: 0.02em;
293293 text-transform: uppercase;
294294 }
295 .idash-state-pill.is-open { background: rgba(52,211,153,0.13); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
296 .idash-state-pill.is-closed { background: rgba(91,110,232,0.16); color: #5b6ee8; box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32); }
295 .idash-state-pill.is-open { background: rgba(52,211,153,0.13); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
296 .idash-state-pill.is-closed { background: rgba(91,110,232,0.16); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32); }
297297
298298 .idash-empty {
299299 padding: 60px 20px;
Modifiedsrc/routes/issues.tsx+8−8View fileUnifiedSplit
@@ -313,8 +313,8 @@ const issuesStyles = `
313313 align-items: center;
314314 justify-content: center;
315315 }
316 .issues-row-icon.is-open { color: #34d399; }
317 .issues-row-icon.is-closed { color: #5b6ee8; }
316 .issues-row-icon.is-open { color: var(--green); }
317 .issues-row-icon.is-closed { color: var(--accent); }
318318 .issues-row-main { flex: 1; min-width: 0; }
319319 .issues-row-title {
320320 font-family: var(--font-display);
@@ -472,12 +472,12 @@ const issuesStyles = `
472472 }
473473 .issues-state-pill.is-open {
474474 background: rgba(52,211,153,0.12);
475 color: #34d399;
475 color: var(--green);
476476 border: 1px solid rgba(52,211,153,0.35);
477477 }
478478 .issues-state-pill.is-closed {
479479 background: rgba(182,157,255,0.12);
480 color: #5b6ee8;
480 color: var(--accent);
481481 border: 1px solid rgba(182,157,255,0.35);
482482 }
483483 .issues-detail-spacer { flex: 1; }
@@ -522,8 +522,8 @@ const issuesStyles = `
522522 }
523523 .issues-sub-row:hover { background: var(--bg-hover); }
524524 .issues-sub-row-icon { font-size: 12px; flex-shrink: 0; }
525 .issues-sub-row-icon.is-open { color: #3fb950; }
526 .issues-sub-row-icon.is-closed { color: #5b6ee8; }
525 .issues-sub-row-icon.is-open { color: var(--green); }
526 .issues-sub-row-icon.is-closed { color: var(--accent); }
527527 .issues-sub-row-title { flex: 1; min-width: 0; }
528528 .issues-sub-row-title a { color: var(--text); text-decoration: none; font-weight: 500; }
529529 .issues-sub-row-title a:hover { color: var(--accent); text-decoration: underline; }
@@ -723,14 +723,14 @@ const issuesStyles = `
723723 .iss-linked-pr-row { display: flex; align-items: center; gap: 10px; padding: 9px 16px; border-bottom: 1px solid var(--border); font-size: 13px; text-decoration: none; color: inherit; }
724724 .iss-linked-pr-row:last-child { border-bottom: none; }
725725 .iss-linked-pr-row:hover { background: var(--bg-hover); }
726 .iss-linked-pr-icon.is-open { color: #34d399; }
726 .iss-linked-pr-icon.is-open { color: var(--green); }
727727 .iss-linked-pr-icon.is-merged { color: #a78bfa; }
728728 .iss-linked-pr-icon.is-closed { color: #8b949e; }
729729 .iss-linked-pr-icon.is-draft { color: #8b949e; }
730730 .iss-linked-pr-title { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
731731 .iss-linked-pr-num { color: var(--text-muted); font-size: 12px; }
732732 .iss-linked-pr-state { font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 9999px; }
733 .iss-linked-pr-state.is-open { color: #34d399; background: rgba(52,211,153,0.10); }
733 .iss-linked-pr-state.is-open { color: var(--green); background: rgba(52,211,153,0.10); }
734734 .iss-linked-pr-state.is-merged { color: #a78bfa; background: rgba(167,139,250,0.10); }
735735 .iss-linked-pr-state.is-closed { color: #8b949e; background: var(--bg-tertiary); }
736736 .iss-linked-pr-state.is-draft { color: #8b949e; background: var(--bg-tertiary); }
Modifiedsrc/routes/legal.tsx+1−1View fileUnifiedSplit
@@ -79,7 +79,7 @@ const legalStyles = `
7979 width: 18px; height: 18px;
8080 border-radius: 6px;
8181 background: rgba(91,110,232,0.14);
82 color: #5b6ee8;
82 color: var(--accent);
8383 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
8484 }
8585 .legal-page-title {
Modifiedsrc/routes/marketplace-agents.tsx+1−1View fileUnifiedSplit
@@ -528,7 +528,7 @@ const styles = `
528528 }
529529 .amkt-btn-danger {
530530 background: transparent;
531 color: #fca5a5;
531 color: var(--red);
532532 border-color: rgba(248,113,113,0.35);
533533 }
534534 .amkt-btn-danger:hover {
Modifiedsrc/routes/marketplace.tsx+1−1View fileUnifiedSplit
@@ -478,7 +478,7 @@ const styles = `
478478 }
479479 .mkt-btn-danger {
480480 background: transparent;
481 color: #fca5a5;
481 color: var(--red);
482482 border-color: rgba(248,113,113,0.35);
483483 padding: 6px 12px;
484484 font-size: 12px;
Modifiedsrc/routes/migrate.tsx+2−2View fileUnifiedSplit
@@ -522,7 +522,7 @@ const migrateStyles = `
522522 50% { opacity: 0.55; }
523523 }
524524 (prefers-reduced-motion: reduce) { .mig-prog-status-cloning { animation: none; } }
525 .mig-prog-status-done { color: #3fb950; background: rgba(63,185,80,0.13); border: 1px solid rgba(63,185,80,0.28); }
525 .mig-prog-status-done { color: var(--green); background: rgba(63,185,80,0.13); border: 1px solid rgba(63,185,80,0.28); }
526526 .mig-prog-status-failed { color: #f85149; background: rgba(248,81,73,0.13); border: 1px solid rgba(248,81,73,0.28); }
527527 .mig-prog-error { font-size: 11.5px; color: #f85149; margin-top: 2px; word-break: break-all; }
528528
@@ -541,7 +541,7 @@ const migrateStyles = `
541541 font-size: 24px;
542542 font-weight: 800;
543543 letter-spacing: -0.022em;
544 color: #3fb950;
544 color: var(--green);
545545 margin: 0 0 8px;
546546 }
547547 .mig-prog-complete-sub { font-size: 14px; color: var(--text-muted); margin: 0 0 16px; }
Modifiedsrc/routes/migration-assistant.tsx+2−2View fileUnifiedSplit
@@ -267,12 +267,12 @@ const migpropStyles = `
267267 letter-spacing: 0.04em;
268268 text-transform: uppercase;
269269 background: rgba(110,231,183,0.14);
270 color: #6ee7b7;
270 color: var(--green);
271271 box-shadow: inset 0 0 0 1px rgba(110,231,183,0.32);
272272 }
273273 .migprop-pill.is-error {
274274 background: rgba(248,113,113,0.14);
275 color: #fca5a5;
275 color: var(--red);
276276 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
277277 }
278278 .migprop-explanation {
Modifiedsrc/routes/migrations.tsx+3−3View fileUnifiedSplit
@@ -223,7 +223,7 @@ const migStyles = `
223223 .mig-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
224224 .mig-pill.is-applied {
225225 background: rgba(52,211,153,0.14);
226 color: #6ee7b7;
226 color: var(--green);
227227 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
228228 }
229229 .mig-pill.is-pending {
@@ -280,8 +280,8 @@ const migStyles = `
280280 border-radius: 9999px;
281281 flex-shrink: 0;
282282 }
283 .mig-check-dot.is-ok { background: #34d399; box-shadow: 0 0 0 3px rgba(52,211,153,0.18); }
284 .mig-check-dot.is-fail { background: #f87171; box-shadow: 0 0 0 3px rgba(248,113,113,0.18); }
283 .mig-check-dot.is-ok { background: var(--green); box-shadow: 0 0 0 3px rgba(52,211,153,0.18); }
284 .mig-check-dot.is-fail { background: var(--red); box-shadow: 0 0 0 3px rgba(248,113,113,0.18); }
285285 .mig-check-detail {
286286 font-size: 12px;
287287 color: var(--text-muted);
Modifiedsrc/routes/mirrors.tsx+5−5View fileUnifiedSplit
@@ -235,7 +235,7 @@ const mirrorStyles = `
235235 width: 26px; height: 26px;
236236 border-radius: 8px;
237237 background: rgba(91,110,232,0.12);
238 color: #5b6ee8;
238 color: var(--accent);
239239 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
240240 flex-shrink: 0;
241241 }
@@ -291,7 +291,7 @@ const mirrorStyles = `
291291 color: var(--text);
292292 cursor: pointer;
293293 }
294 .mirror-checkbox-row input { accent-color: #5b6ee8; }
294 .mirror-checkbox-row input { accent-color: var(--accent); }
295295
296296 /* ─── Buttons ─── */
297297 .mirror-btn {
@@ -335,7 +335,7 @@ const mirrorStyles = `
335335 }
336336 .mirror-btn-danger {
337337 background: transparent;
338 color: #fca5a5;
338 color: var(--red);
339339 border-color: rgba(248,113,113,0.35);
340340 }
341341 .mirror-btn-danger:hover {
@@ -363,12 +363,12 @@ const mirrorStyles = `
363363 .mirror-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
364364 .mirror-pill.is-ok {
365365 background: rgba(52,211,153,0.14);
366 color: #6ee7b7;
366 color: var(--green);
367367 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
368368 }
369369 .mirror-pill.is-error {
370370 background: rgba(248,113,113,0.14);
371 color: #fca5a5;
371 color: var(--red);
372372 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
373373 }
374374 .mirror-pill.is-pending {
Modifiedsrc/routes/onboarding.tsx+2−2View fileUnifiedSplit
@@ -179,7 +179,7 @@ const styles = `
179179 width: 30px; height: 30px;
180180 border-radius: 9px;
181181 background: rgba(91,110,232,0.12);
182 color: #5b6ee8;
182 color: var(--accent);
183183 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
184184 margin-left: auto;
185185 flex-shrink: 0;
@@ -265,7 +265,7 @@ const styles = `
265265 letter-spacing: 0.04em;
266266 text-transform: uppercase;
267267 background: rgba(52,211,153,0.14);
268 color: #6ee7b7;
268 color: var(--green);
269269 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
270270 }
271271 .onb-step-done-badge .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
Modifiedsrc/routes/org-health.tsx+8−8View fileUnifiedSplit
@@ -31,9 +31,9 @@ orgHealthRoutes.use("*", softAuth);
3131// ---------------------------------------------------------------------------
3232
3333function scoreColor(score: number): string {
34 if (score >= 80) return "#34d399";
35 if (score >= 50) return "#fbbf24";
36 return "#f87171";
34 if (score >= 80) return "var(--green)";
35 if (score >= 50) return "var(--yellow)";
36 return "var(--red)";
3737}
3838
3939function scorePillClass(score: number): string {
@@ -180,9 +180,9 @@ const styles = `
180180 margin-top: 14px;
181181 font-variant-numeric: tabular-nums;
182182 }
183 .oh-pill--good { color: #34d399; border-color: rgba(52,211,153,0.5); background: rgba(52,211,153,0.08); }
184 .oh-pill--warn { color: #fbbf24; border-color: rgba(251,191,36,0.5); background: rgba(251,191,36,0.08); }
185 .oh-pill--bad { color: #f87171; border-color: rgba(248,113,113,0.5); background: rgba(248,113,113,0.08); }
183 .oh-pill--good { color: var(--green); border-color: rgba(52,211,153,0.5); background: rgba(52,211,153,0.08); }
184 .oh-pill--warn { color: var(--yellow); border-color: rgba(251,191,36,0.5); background: rgba(251,191,36,0.08); }
185 .oh-pill--bad { color: var(--red); border-color: rgba(248,113,113,0.5); background: rgba(248,113,113,0.08); }
186186
187187 /* AI summary card */
188188 .oh-ai-card {
@@ -297,8 +297,8 @@ const styles = `
297297 }
298298
299299 /* Trend arrows */
300 .oh-trend--up { color: #34d399; font-weight: 700; }
301 .oh-trend--down { color: #f87171; font-weight: 700; }
300 .oh-trend--up { color: var(--green); font-weight: 700; }
301 .oh-trend--down { color: var(--red); font-weight: 700; }
302302 .oh-trend--stable { color: var(--text-muted); }
303303
304304 /* Recompute button */
Modifiedsrc/routes/org-insights.tsx+7−7View fileUnifiedSplit
@@ -415,8 +415,8 @@ const styles = `
415415 font-variant-numeric: tabular-nums;
416416 line-height: 1;
417417 }
418 .org-ins-stat-value.is-good { color: #6ee7b7; }
419 .org-ins-stat-value.is-warn { color: #fca5a5; }
418 .org-ins-stat-value.is-good { color: var(--green); }
419 .org-ins-stat-value.is-warn { color: var(--red); }
420420 .org-ins-stat-value.is-info { color: #93c5fd; }
421421 .org-ins-stat-value.is-accent {
422422 background-image: linear-gradient(135deg, #5b6ee8 0%, #5f8fa0 100%);
@@ -453,8 +453,8 @@ const styles = `
453453 font-variant-numeric: tabular-nums;
454454 line-height: 1;
455455 }
456 .org-ins-gate-value.is-good { color: #6ee7b7; }
457 .org-ins-gate-value.is-warn { color: #fca5a5; }
456 .org-ins-gate-value.is-good { color: var(--green); }
457 .org-ins-gate-value.is-warn { color: var(--red); }
458458 .org-ins-gate-value.is-soft { color: #c4b5fd; }
459459 .org-ins-gate-label {
460460 margin-top: 6px;
@@ -518,7 +518,7 @@ const styles = `
518518 width: 28px; height: 28px;
519519 border-radius: 8px;
520520 background: rgba(91,110,232,0.10);
521 color: #5b6ee8;
521 color: var(--accent);
522522 font-family: var(--font-mono);
523523 font-size: 12px;
524524 font-weight: 700;
@@ -558,8 +558,8 @@ const styles = `
558558 font-size: 13px;
559559 font-variant-numeric: tabular-nums;
560560 }
561 .org-ins-card-meta.is-good { color: #6ee7b7; }
562 .org-ins-card-meta.is-warn { color: #fca5a5; }
561 .org-ins-card-meta.is-good { color: var(--green); }
562 .org-ins-card-meta.is-warn { color: var(--red); }
563563 .org-ins-card-meta.is-mid { color: #fcd34d; }
564564 .org-ins-card-meta.is-muted { color: var(--text-muted); }
565565
Modifiedsrc/routes/org-secrets.tsx+2−2View fileUnifiedSplit
@@ -146,7 +146,7 @@ const osecStyles = `
146146 .osec-flash-err {
147147 background: rgba(239,68,68,0.10);
148148 border: 1px solid rgba(239,68,68,0.28);
149 color: #fca5a5;
149 color: var(--red);
150150 }
151151
152152 /* ─── Form card ─── */
@@ -235,7 +235,7 @@ const osecStyles = `
235235 }
236236 .osec-btn-danger {
237237 background: transparent;
238 color: #f87171;
238 color: var(--red);
239239 border-color: rgba(239,68,68,0.35);
240240 padding: 6px 12px;
241241 font-size: 12.5px;
Modifiedsrc/routes/org-sso-settings.tsx+1−1View fileUnifiedSplit
@@ -242,7 +242,7 @@ const orgSsoCss = `
242242 text-transform: uppercase;
243243 margin-left: var(--space-3);
244244 }
245 .org-sso-status.is-on { background: rgba(52,211,153,0.12); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
245 .org-sso-status.is-on { background: rgba(52,211,153,0.12); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
246246 .org-sso-status.is-off { background: rgba(148,163,184,0.10); color: #cbd5e1; box-shadow: inset 0 0 0 1px rgba(148,163,184,0.28); }
247247 .org-sso-status .dot { width: 5px; height: 5px; border-radius: 9999px; background: currentColor; }
248248`;
Modifiedsrc/routes/orgs.tsx+2−2View fileUnifiedSplit
@@ -93,7 +93,7 @@ const orgsStyles = `
9393 width: 18px; height: 18px;
9494 border-radius: 6px;
9595 background: rgba(91,110,232,0.14);
96 color: #5b6ee8;
96 color: var(--accent);
9797 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
9898 }
9999 .orgs-crumb { color: var(--text-muted); text-decoration: none; }
@@ -371,7 +371,7 @@ const orgsStyles = `
371371 width: 26px; height: 26px;
372372 border-radius: 8px;
373373 background: rgba(91,110,232,0.12);
374 color: #5b6ee8;
374 color: var(--accent);
375375 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
376376 flex-shrink: 0;
377377 }
Modifiedsrc/routes/packages.tsx+2−2View fileUnifiedSplit
@@ -174,7 +174,7 @@ const pkgStyles = `
174174 }
175175 .pkg-btn-danger {
176176 background: transparent;
177 color: #fca5a5;
177 color: var(--red);
178178 border-color: rgba(248,113,113,0.35);
179179 padding: 6px 12px;
180180 font-size: 12px;
@@ -391,7 +391,7 @@ const pkgStyles = `
391391 text-transform: uppercase;
392392 letter-spacing: 0.04em;
393393 background: rgba(248,113,113,0.12);
394 color: #fca5a5;
394 color: var(--red);
395395 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
396396 }
397397
Modifiedsrc/routes/pages.tsx+4−4View fileUnifiedSplit
@@ -225,7 +225,7 @@ const pagesStyles = `
225225 width: 26px; height: 26px;
226226 border-radius: 8px;
227227 background: rgba(91,110,232,0.12);
228 color: #5b6ee8;
228 color: var(--accent);
229229 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
230230 flex-shrink: 0;
231231 }
@@ -267,7 +267,7 @@ const pagesStyles = `
267267 color: #c4b5fd;
268268 text-decoration: none;
269269 }
270 .pages-url-value a:hover { color: #5b6ee8; text-decoration: underline; }
270 .pages-url-value a:hover { color: var(--accent); text-decoration: underline; }
271271
272272 /* Fields */
273273 .pages-field { margin-bottom: 16px; }
@@ -398,12 +398,12 @@ const pagesStyles = `
398398 .pages-status .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
399399 .pages-status.is-success {
400400 background: rgba(52,211,153,0.14);
401 color: #6ee7b7;
401 color: var(--green);
402402 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
403403 }
404404 .pages-status.is-failed {
405405 background: rgba(248,113,113,0.14);
406 color: #fca5a5;
406 color: var(--red);
407407 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
408408 }
409409 .pages-status.is-pending {
Modifiedsrc/routes/passkeys.tsx+7−7View fileUnifiedSplit
@@ -110,7 +110,7 @@ const pkStyles = `
110110 width: 18px; height: 18px;
111111 border-radius: 6px;
112112 background: rgba(91,110,232,0.14);
113 color: #5b6ee8;
113 color: var(--accent);
114114 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
115115 }
116116 .pk-crumb { color: var(--text-muted); text-decoration: none; }
@@ -267,7 +267,7 @@ const pkStyles = `
267267 width: 26px; height: 26px;
268268 border-radius: 8px;
269269 background: rgba(91,110,232,0.12);
270 color: #5b6ee8;
270 color: var(--accent);
271271 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
272272 flex-shrink: 0;
273273 }
@@ -292,7 +292,7 @@ const pkStyles = `
292292 min-height: 18px;
293293 }
294294 .pk-cta-status.is-error { color: #fecaca; }
295 .pk-cta-status.is-progress { color: #5b6ee8; }
295 .pk-cta-status.is-progress { color: var(--accent); }
296296
297297 /* ─── Passkey list ─── */
298298 .pk-list {
@@ -323,7 +323,7 @@ const pkStyles = `
323323 width: 40px; height: 40px;
324324 border-radius: 10px;
325325 background: rgba(91,110,232,0.10);
326 color: #5b6ee8;
326 color: var(--accent);
327327 display: flex;
328328 align-items: center;
329329 justify-content: center;
@@ -350,7 +350,7 @@ const pkStyles = `
350350 padding: 2px 8px;
351351 border-radius: 9999px;
352352 background: rgba(91,110,232,0.10);
353 color: #5b6ee8;
353 color: var(--accent);
354354 font-size: 10.5px;
355355 font-weight: 600;
356356 letter-spacing: 0.04em;
@@ -417,7 +417,7 @@ const pkStyles = `
417417 width: 48px; height: 48px;
418418 border-radius: 12px;
419419 background: rgba(91,110,232,0.10);
420 color: #5b6ee8;
420 color: var(--accent);
421421 display: flex;
422422 align-items: center;
423423 justify-content: center;
@@ -506,7 +506,7 @@ const pkStyles = `
506506 flex-shrink: 0;
507507 width: 18px; height: 18px;
508508 margin-top: 1px;
509 color: #fbbf24;
509 color: var(--yellow);
510510 }
511511 .pk-warning strong { color: #fef3c7; font-weight: 700; }
512512
Modifiedsrc/routes/personal-chat.tsx+3−3View fileUnifiedSplit
@@ -605,7 +605,7 @@ const pchatCss = `
605605 width: 18px; height: 18px;
606606 border-radius: 6px;
607607 background: rgba(91,110,232,0.14);
608 color: #5b6ee8;
608 color: var(--accent);
609609 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
610610 }
611611 .pchat-eyebrow-who {
@@ -848,7 +848,7 @@ const pchatCss = `
848848 width: 36px; height: 36px;
849849 border-radius: 10px;
850850 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.10));
851 color: #5b6ee8;
851 color: var(--accent);
852852 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
853853 flex-shrink: 0;
854854 }
@@ -984,7 +984,7 @@ const pchatCss = `
984984 text-decoration: none;
985985 }
986986 .pchat-sources-repo {
987 color: #5b6ee8;
987 color: var(--accent);
988988 font-weight: 700;
989989 }
990990 .pchat-sources-sep { color: var(--text-muted); }
Modifiedsrc/routes/pipeline.tsx+5−5View fileUnifiedSplit
@@ -211,7 +211,7 @@ app.get("/:owner/:repo/pipeline", async (c) => {
211211 font-weight: 700;
212212 line-height: 1;
213213 }
214 .pl-summary-val.ok { color: #3fb950; }
214 .pl-summary-val.ok { color: var(--green); }
215215 .pl-summary-val.err { color: #f85149; }
216216 .pl-summary-val.warn { color: #d29922; }
217217 .pl-summary-val.neutral { color: var(--text); }
@@ -271,13 +271,13 @@ app.get("/:owner/:repo/pipeline", async (c) => {
271271 justify-content: center;
272272 font-size: 10px;
273273 }
274 .pl-event-dot.gate-passed { background: #3fb950; }
274 .pl-event-dot.gate-passed { background: var(--green); }
275275 .pl-event-dot.gate-failed { background: #f85149; }
276276 .pl-event-dot.gate-running { background: #58a6ff; }
277277 .pl-event-dot.gate-pending { background: var(--text-muted); }
278278 .pl-event-dot.gate-skipped { background: var(--border-strong); }
279279 .pl-event-dot.gate-repaired { background: #d29922; }
280 .pl-event-dot.deploy-success { background: #3fb950; }
280 .pl-event-dot.deploy-success { background: var(--green); }
281281 .pl-event-dot.deploy-failed { background: #f85149; }
282282 .pl-event-dot.deploy-blocked { background: #d29922; }
283283 .pl-event-dot.deploy-running { background: #58a6ff; }
@@ -318,13 +318,13 @@ app.get("/:owner/:repo/pipeline", async (c) => {
318318 padding: 2px 8px;
319319 border-radius: 8px;
320320 }
321 .pl-status-passed { background: rgba(63,185,80,0.12); color: #3fb950; }
321 .pl-status-passed { background: rgba(63,185,80,0.12); color: var(--green); }
322322 .pl-status-failed { background: rgba(248,81,73,0.12); color: #f85149; }
323323 .pl-status-running { background: rgba(88,166,255,0.12); color: #58a6ff; }
324324 .pl-status-pending { background: rgba(130,80,223,0.10); color: #9a7fde; }
325325 .pl-status-skipped { background: var(--bg-inset); color: var(--text-muted); }
326326 .pl-status-repaired { background: rgba(210,153,34,0.12); color: #d29922; }
327 .pl-status-success { background: rgba(63,185,80,0.12); color: #3fb950; }
327 .pl-status-success { background: rgba(63,185,80,0.12); color: var(--green); }
328328 .pl-status-blocked { background: rgba(210,153,34,0.12); color: #d29922; }
329329
330330 .pl-event-meta {
Modifiedsrc/routes/previews.tsx+4−4View fileUnifiedSplit
@@ -283,7 +283,7 @@ const previewStyles = `
283283 }
284284 .preview-pill.is-ready {
285285 background: rgba(52,211,153,0.10);
286 color: #6ee7b7;
286 color: var(--green);
287287 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
288288 }
289289 .preview-pill.is-failed {
@@ -314,7 +314,7 @@ const previewStyles = `
314314 font-size: 12px;
315315 font-weight: 600;
316316 font-family: var(--font-mono);
317 color: #5b6ee8;
317 color: var(--accent);
318318 background: rgba(91,110,232,0.08);
319319 border: 1px solid rgba(91,110,232,0.22);
320320 cursor: pointer;
@@ -380,7 +380,7 @@ const previewStyles = `
380380 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.14));
381381 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
382382 display: flex; align-items: center; justify-content: center;
383 color: #5b6ee8;
383 color: var(--accent);
384384 }
385385 .preview-empty-title {
386386 font-family: var(--font-display);
@@ -424,7 +424,7 @@ const previewStyles = `
424424 }
425425 .preview-tabbar a.is-active {
426426 color: var(--text-strong);
427 border-bottom-color: #5b6ee8;
427 border-bottom-color: var(--accent);
428428 }
429429 .preview-tabbar a:hover { color: var(--text); }
430430`;
Modifiedsrc/routes/projects.tsx+2−2View fileUnifiedSplit
@@ -235,7 +235,7 @@ const projStyles = `
235235 .proj-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
236236 .proj-pill.is-open {
237237 background: rgba(52,211,153,0.14);
238 color: #6ee7b7;
238 color: var(--green);
239239 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
240240 }
241241 .proj-pill.is-closed {
@@ -406,7 +406,7 @@ const projStyles = `
406406 font-weight: 600;
407407 text-transform: capitalize;
408408 }
409 .proj-kcard-state.is-open { background: rgba(52,211,153,0.14); color: #6ee7b7; }
409 .proj-kcard-state.is-open { background: rgba(52,211,153,0.14); color: var(--green); }
410410 .proj-kcard-state.is-closed { background: rgba(148,163,184,0.16); color: #94a3b8; }
411411 .proj-kcard-state.is-merged { background: rgba(167,139,250,0.14); color: #c4b5fd; }
412412 .proj-kcard-state.is-draft { background: rgba(148,163,184,0.12); color: #94a3b8; }
Modifiedsrc/routes/protected-tags.tsx+3−3View fileUnifiedSplit
@@ -110,7 +110,7 @@ const ptStyles = `
110110 width: 18px; height: 18px;
111111 border-radius: 6px;
112112 background: rgba(91,110,232,0.14);
113 color: #5b6ee8;
113 color: var(--accent);
114114 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
115115 }
116116 .pt-title {
@@ -262,7 +262,7 @@ const ptStyles = `
262262 width: 26px; height: 26px;
263263 border-radius: 8px;
264264 background: rgba(91,110,232,0.12);
265 color: #5b6ee8;
265 color: var(--accent);
266266 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
267267 flex-shrink: 0;
268268 }
@@ -318,7 +318,7 @@ const ptStyles = `
318318 font-weight: 600;
319319 border-radius: 9999px;
320320 background: rgba(52,211,153,0.10);
321 color: #6ee7b7;
321 color: var(--green);
322322 border: 1px solid rgba(52,211,153,0.30);
323323 }
324324 .pt-chip .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
Modifiedsrc/routes/pulls-dashboard.tsx+11−11View fileUnifiedSplit
@@ -187,9 +187,9 @@ const styles = `
187187 align-items: center;
188188 justify-content: center;
189189 }
190 .pdash-row-icon.is-open { color: #34d399; }
191 .pdash-row-icon.is-merged { color: #5b6ee8; }
192 .pdash-row-icon.is-closed { color: #f87171; }
190 .pdash-row-icon.is-open { color: var(--green); }
191 .pdash-row-icon.is-merged { color: var(--accent); }
192 .pdash-row-icon.is-closed { color: var(--red); }
193193 .pdash-row-icon.is-draft { color: var(--text-muted); }
194194 .pdash-row-main { flex: 1; min-width: 0; }
195195 .pdash-row-title {
@@ -249,12 +249,12 @@ const styles = `
249249 border-radius: 9999px;
250250 background: currentColor;
251251 }
252 .pdash-badge.ai-pass { color: #6ee7b7; background: rgba(52,211,153,0.13); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
253 .pdash-badge.ai-fail { color: #fca5a5; background: rgba(248,113,113,0.13); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
252 .pdash-badge.ai-pass { color: var(--green); background: rgba(52,211,153,0.13); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
253 .pdash-badge.ai-fail { color: var(--red); background: rgba(248,113,113,0.13); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
254254 .pdash-badge.ai-pending { color: #fde68a; background: rgba(251,191,36,0.10); box-shadow: inset 0 0 0 1px rgba(251,191,36,0.30); }
255 .pdash-badge.gt-pass { color: #6ee7b7; background: rgba(52,211,153,0.13); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
256 .pdash-badge.gt-fail { color: #fca5a5; background: rgba(248,113,113,0.13); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
257 .pdash-badge.am-yes { color: #5b6ee8; background: rgba(91,110,232,0.18); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.36); }
255 .pdash-badge.gt-pass { color: var(--green); background: rgba(52,211,153,0.13); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
256 .pdash-badge.gt-fail { color: var(--red); background: rgba(248,113,113,0.13); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
257 .pdash-badge.am-yes { color: var(--accent); background: rgba(91,110,232,0.18); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.36); }
258258 .pdash-state-pill {
259259 display: inline-flex;
260260 align-items: center;
@@ -266,9 +266,9 @@ const styles = `
266266 letter-spacing: 0.02em;
267267 text-transform: uppercase;
268268 }
269 .pdash-state-pill.is-open { background: rgba(52,211,153,0.13); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
270 .pdash-state-pill.is-merged { background: rgba(91,110,232,0.16); color: #5b6ee8; box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32); }
271 .pdash-state-pill.is-closed { background: rgba(248,113,113,0.13); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
269 .pdash-state-pill.is-open { background: rgba(52,211,153,0.13); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30); }
270 .pdash-state-pill.is-merged { background: rgba(91,110,232,0.16); color: var(--accent); box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32); }
271 .pdash-state-pill.is-closed { background: rgba(248,113,113,0.13); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30); }
272272 .pdash-state-pill.is-draft { background: rgba(255,255,255,0.06); color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--border); }
273273
274274 .pdash-empty {
Modifiedsrc/routes/pulls.tsx+33−33View fileUnifiedSplit
@@ -303,7 +303,7 @@ const PRS_LIST_STYLES = `
303303 margin-top: 2px;
304304 }
305305 .prs-row-icon.state-open { color: var(--green); background: rgba(52,211,153,0.12); }
306 .prs-row-icon.state-merged { color: #5b6ee8; background: rgba(91,110,232,0.16); }
306 .prs-row-icon.state-merged { color: var(--accent); background: rgba(91,110,232,0.16); }
307307 .prs-row-icon.state-closed { color: var(--red); background: rgba(248,113,113,0.12); }
308308 .prs-row-icon.state-draft { color: var(--text-muted); background: rgba(255,255,255,0.05); }
309309 .prs-row-body { flex: 1; min-width: 0; }
@@ -365,12 +365,12 @@ const PRS_LIST_STYLES = `
365365 background: rgba(91,110,232,0.10);
366366 }
367367 .prs-tag.is-approved {
368 color: #34d399;
368 color: var(--green);
369369 border-color: rgba(52,211,153,0.40);
370370 background: rgba(52,211,153,0.08);
371371 }
372372 .prs-tag.is-changes {
373 color: #f87171;
373 color: var(--red);
374374 border-color: rgba(248,113,113,0.40);
375375 background: rgba(248,113,113,0.08);
376376 }
@@ -522,7 +522,7 @@ const PRS_DETAIL_STYLES = `
522522 border: 1px solid transparent;
523523 }
524524 .prs-state-pill.state-open { color: var(--green); background: rgba(52,211,153,0.12); border-color: rgba(52,211,153,0.35); }
525 .prs-state-pill.state-merged { color: #5b6ee8; background: rgba(91,110,232,0.16); border-color: rgba(91,110,232,0.45); }
525 .prs-state-pill.state-merged { color: var(--accent); background: rgba(91,110,232,0.16); border-color: rgba(91,110,232,0.45); }
526526 .prs-state-pill.state-closed { color: var(--red); background: rgba(248,113,113,0.12); border-color: rgba(248,113,113,0.35); }
527527 .prs-state-pill.state-draft { color: var(--text-muted); background: rgba(255,255,255,0.05); border-color: var(--border-strong); }
528528
@@ -573,12 +573,12 @@ const PRS_DETAIL_STYLES = `
573573 cursor: default;
574574 }
575575 .prs-branch-sync.is-behind {
576 color: #f87171;
576 color: var(--red);
577577 border-color: rgba(248,113,113,0.35);
578578 background: rgba(248,113,113,0.07);
579579 }
580580 .prs-branch-sync.is-synced {
581 color: #34d399;
581 color: var(--green);
582582 border-color: rgba(52,211,153,0.35);
583583 background: rgba(52,211,153,0.07);
584584 }
@@ -919,8 +919,8 @@ const PRS_DETAIL_STYLES = `
919919 font-size: 13px;
920920 }
921921 .prs-review-icon { font-size: 15px; font-weight: 700; flex-shrink: 0; }
922 .prs-review-approved .prs-review-icon { color: #34d399; }
923 .prs-review-changes .prs-review-icon { color: #f87171; }
922 .prs-review-approved .prs-review-icon { color: var(--green); }
923 .prs-review-changes .prs-review-icon { color: var(--red); }
924924 .prs-reviewer-avatar {
925925 width: 24px; height: 24px; border-radius: 50%;
926926 background: var(--accent); color: #fff;
@@ -934,7 +934,7 @@ const PRS_DETAIL_STYLES = `
934934 padding: 8px 14px; border-radius: 8px; font-size: 13px;
935935 font-weight: 600; cursor: pointer;
936936 background: rgba(52,211,153,0.12);
937 color: #34d399;
937 color: var(--green);
938938 border: 1px solid rgba(52,211,153,0.35);
939939 transition: background 120ms;
940940 }
@@ -944,7 +944,7 @@ const PRS_DETAIL_STYLES = `
944944 padding: 8px 14px; border-radius: 8px; font-size: 13px;
945945 font-weight: 600; cursor: pointer;
946946 background: rgba(248,113,113,0.10);
947 color: #f87171;
947 color: var(--red);
948948 border: 1px solid rgba(248,113,113,0.30);
949949 transition: background 120ms;
950950 }
@@ -1002,7 +1002,7 @@ const PRS_DETAIL_STYLES = `
10021002 .live-pill-dot {
10031003 width: 8px; height: 8px;
10041004 border-radius: 9999px;
1005 background: #34d399;
1005 background: var(--green);
10061006 box-shadow: 0 0 0 2px rgba(52,211,153,0.18);
10071007 animation: live-pulse 1.6s ease-in-out infinite;
10081008 }
@@ -1141,10 +1141,10 @@ const PRS_DETAIL_STYLES = `
11411141 }
11421142 .slash-pill-body p:first-child { margin-top: 0; }
11431143 .slash-pill-body p:last-child { margin-bottom: 0; }
1144 .slash-pill.slash-cmd-merge { border-left-color: #56d364; }
1144 .slash-pill.slash-cmd-merge { border-left-color: var(--green); }
11451145 .slash-pill.slash-cmd-rebase { border-left-color: #f0883e; }
11461146 .slash-pill.slash-cmd-needs-work { border-left-color: #f85149; }
1147 .slash-pill.slash-cmd-lgtm { border-left-color: #56d364; }
1147 .slash-pill.slash-cmd-lgtm { border-left-color: var(--green); }
11481148 .slash-pill.slash-cmd-stage { border-left-color: #5f8fa0; }
11491149
11501150 /* ─── Branch-preview pill (migration 0062). Scoped .preview-*. */
@@ -1170,7 +1170,7 @@ const PRS_DETAIL_STYLES = `
11701170 .preview-prpill.is-building .preview-prpill-dot {
11711171 animation: previewPrPulse 1.4s ease-in-out infinite;
11721172 }
1173 .preview-prpill.is-ready { color: #6ee7b7; border-color: rgba(52,211,153,0.30); }
1173 .preview-prpill.is-ready { color: var(--green); border-color: rgba(52,211,153,0.30); }
11741174 .preview-prpill.is-failed { color: #fecaca; border-color: rgba(248,113,113,0.35); }
11751175 .preview-prpill.is-expired { color: #cbd5e1; border-color: rgba(148,163,184,0.30); }
11761176 previewPrPulse {
@@ -1374,12 +1374,12 @@ const PRS_DETAIL_STYLES = `
13741374 color: var(--text-muted);
13751375 }
13761376 .prs-tasks-pill.is-complete {
1377 color: #34d399;
1377 color: var(--green);
13781378 border-color: rgba(52,211,153,0.40);
13791379 background: rgba(52,211,153,0.08);
13801380 }
13811381 .prs-tasks-progress { display: inline-block; width: 36px; height: 4px; border-radius: 9999px; background: var(--border); overflow: hidden; vertical-align: middle; }
1382 .prs-tasks-progress-bar { height: 100%; border-radius: 9999px; background: #34d399; }
1382 .prs-tasks-progress-bar { height: 100%; border-radius: 9999px; background: var(--green); }
13831383
13841384 /* ─── Update branch button ─── */
13851385 .prs-update-branch-btn {
@@ -1423,12 +1423,12 @@ const PRS_DETAIL_STYLES = `
14231423 .prs-linked-issue-row:last-child { border-bottom: none; }
14241424 .prs-linked-issue-row:hover { background: var(--bg-hover); }
14251425 .prs-linked-issue-icon { flex: 0 0 auto; font-size: 14px; }
1426 .prs-linked-issue-icon.is-open { color: #34d399; }
1426 .prs-linked-issue-icon.is-open { color: var(--green); }
14271427 .prs-linked-issue-icon.is-closed { color: #8b949e; }
14281428 .prs-linked-issue-title { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
14291429 .prs-linked-issue-num { color: var(--text-muted); font-size: 12px; }
14301430 .prs-linked-issue-state { font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 9999px; }
1431 .prs-linked-issue-state.is-open { color: #34d399; background: rgba(52,211,153,0.10); }
1431 .prs-linked-issue-state.is-open { color: var(--green); background: rgba(52,211,153,0.10); }
14321432 .prs-linked-issue-state.is-closed { color: #8b949e; background: var(--bg-tertiary); }
14331433
14341434 /* ─── Commits tab ─── */
@@ -1462,15 +1462,15 @@ const PRS_DETAIL_STYLES = `
14621462 .prs-ci-row { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--border); }
14631463 .prs-ci-row:last-child { border-bottom: none; }
14641464 .prs-ci-icon { flex: 0 0 auto; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 11px; font-weight: 700; }
1465 .prs-ci-icon.is-success { background: rgba(52,211,153,0.20); color: #34d399; }
1466 .prs-ci-icon.is-pending { background: rgba(251,191,36,0.20); color: #fbbf24; }
1467 .prs-ci-icon.is-failure, .prs-ci-icon.is-error { background: rgba(248,113,113,0.20); color: #f87171; }
1465 .prs-ci-icon.is-success { background: rgba(52,211,153,0.20); color: var(--green); }
1466 .prs-ci-icon.is-pending { background: rgba(251,191,36,0.20); color: var(--yellow); }
1467 .prs-ci-icon.is-failure, .prs-ci-icon.is-error { background: rgba(248,113,113,0.20); color: var(--red); }
14681468 .prs-ci-context { flex: 1 1 auto; font-size: 13px; font-weight: 500; color: var(--text); }
14691469 .prs-ci-desc { font-size: 12px; color: var(--text-muted); }
14701470 .prs-ci-pill { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 9999px; }
1471 .prs-ci-pill.is-success { color: #34d399; background: rgba(52,211,153,0.10); }
1472 .prs-ci-pill.is-pending { color: #fbbf24; background: rgba(251,191,36,0.10); }
1473 .prs-ci-pill.is-failure, .prs-ci-pill.is-error { color: #f87171; background: rgba(248,113,113,0.10); }
1471 .prs-ci-pill.is-success { color: var(--green); background: rgba(52,211,153,0.10); }
1472 .prs-ci-pill.is-pending { color: var(--yellow); background: rgba(251,191,36,0.10); }
1473 .prs-ci-pill.is-failure, .prs-ci-pill.is-error { color: var(--red); background: rgba(248,113,113,0.10); }
14741474 .prs-ci-link { font-size: 12px; color: var(--accent); text-decoration: none; }
14751475 .prs-ci-link:hover { text-decoration: underline; }
14761476
@@ -1490,12 +1490,12 @@ const PRS_DETAIL_STYLES = `
14901490 }
14911491 .trio-pill:hover { opacity: 0.8; }
14921492 .trio-pill.is-pass {
1493 color: #34d399;
1493 color: var(--green);
14941494 background: rgba(52,211,153,0.10);
14951495 border-color: rgba(52,211,153,0.35);
14961496 }
14971497 .trio-pill.is-fail {
1498 color: #f87171;
1498 color: var(--red);
14991499 background: rgba(248,113,113,0.10);
15001500 border-color: rgba(248,113,113,0.35);
15011501 }
@@ -1753,17 +1753,17 @@ const IMPACT_STYLES = `
17531753 border: 1.5px solid transparent;
17541754 }
17551755 .impact-score.score-low {
1756 color: #34d399;
1756 color: var(--green);
17571757 background: rgba(52,211,153,0.12);
17581758 border-color: rgba(52,211,153,0.35);
17591759 }
17601760 .impact-score.score-medium {
1761 color: #fbbf24;
1761 color: var(--yellow);
17621762 background: rgba(251,191,36,0.12);
17631763 border-color: rgba(251,191,36,0.35);
17641764 }
17651765 .impact-score.score-high {
1766 color: #f87171;
1766 color: var(--red);
17671767 background: rgba(248,113,113,0.12);
17681768 border-color: rgba(248,113,113,0.35);
17691769 }
@@ -1829,7 +1829,7 @@ const IMPACT_STYLES = `
18291829 border: 1px solid rgba(248,113,113,0.15);
18301830 }
18311831 .impact-downstream h4 {
1832 color: #f87171;
1832 color: var(--red);
18331833 }
18341834 .impact-empty {
18351835 font-size: 12.5px;
@@ -1987,7 +1987,7 @@ function placePill(sessionId,username,colour,line,typing){
19871987 var pill=document.createElement('span');
19881988 pill.className='presence-line-pill'+(typing?' is-typing':'');
19891989 pill.setAttribute('data-presence-sid',sessionId);
1990 pill.style.background=colour||'#5b6ee8';
1990 pill.style.background=colour||'var(--accent)';
19911991 pill.textContent=(username||'?').slice(0,12)+(typing?' typing':'');
19921992 row.appendChild(pill);
19931993}
@@ -5026,8 +5026,8 @@ pulls.get("/:owner/:repo/pulls/:number", softAuth, requireRepoAccess("read"), as
50265026 const statusColor = !hasReviewed
50275027 ? "var(--text-muted)"
50285028 : review?.state === "approved"
5029 ? "#34d399"
5030 : "#f87171";
5029 ? "var(--green)"
5030 : "var(--red)";
50315031 return (
50325032 <div class="prs-review-row" style={`gap:8px`}>
50335033 <span class="prs-reviewer-avatar">
Modifiedsrc/routes/pulse.tsx+1−1View fileUnifiedSplit
@@ -297,7 +297,7 @@ pulseRoutes.get(
297297 label="PRs opened"
298298 value={Number(prsOpened)}
299299 sub={`${Number(prsMerged)} merged · ${Number(prsClosed)} closed`}
300 color="#5b6ee8"
300 color="var(--accent)"
301301 />
302302 <StatCard
303303 label="Commits"
Modifiedsrc/routes/push-notifications.tsx+2−2View fileUnifiedSplit
@@ -101,7 +101,7 @@ const PN_STYLES = `
101101}
102102.pn-banner-dot {
103103 width: 7px; height: 7px; border-radius: 50%;
104 background: #3fb950;
104 background: var(--green);
105105 flex-shrink: 0;
106106}
107107.pn-banner.is-error .pn-banner-dot { background: #f85149; }
@@ -253,7 +253,7 @@ const PN_STYLES = `
253253 color: var(--text-muted);
254254 min-height: 1.4em;
255255}
256#pn-js-status.ok { color: #3fb950; }
256#pn-js-status.ok { color: var(--green); }
257257#pn-js-status.err { color: #f85149; }
258258`;
259259
Modifiedsrc/routes/push-watch.tsx+7−7View fileUnifiedSplit
@@ -321,7 +321,7 @@ const pwStyles = `
321321 width: 22px; height: 22px;
322322 border-radius: 6px;
323323 background: rgba(91,110,232,0.14);
324 color: #5b6ee8;
324 color: var(--accent);
325325 display: flex; align-items: center; justify-content: center;
326326 font-size: 12px;
327327 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.3);
@@ -367,7 +367,7 @@ const pwStyles = `
367367 font-family: var(--font-mono, monospace);
368368 font-size: 12px;
369369 background: rgba(91,110,232,0.10);
370 color: #5b6ee8;
370 color: var(--accent);
371371 border-radius: 4px;
372372 padding: 2px 7px;
373373 border: 1px solid rgba(91,110,232,0.22);
@@ -426,16 +426,16 @@ const pwStyles = `
426426 background: currentColor;
427427 flex-shrink: 0;
428428 }
429 .pw-pill-green { background: rgba(52,211,153,0.12); color: #34d399; border: 1px solid rgba(52,211,153,0.25); }
429 .pw-pill-green { background: rgba(52,211,153,0.12); color: var(--green); border: 1px solid rgba(52,211,153,0.25); }
430430 .pw-pill-teal { background: rgba(95,143,160,0.12); color: #5f8fa0; border: 1px solid rgba(95,143,160,0.25); }
431 .pw-pill-red { background: rgba(248,113,113,0.12); color: #f87171; border: 1px solid rgba(248,113,113,0.25); }
432 .pw-pill-yellow { background: rgba(251,191,36,0.12); color: #fbbf24; border: 1px solid rgba(251,191,36,0.25); }
431 .pw-pill-red { background: rgba(248,113,113,0.12); color: var(--red); border: 1px solid rgba(248,113,113,0.25); }
432 .pw-pill-yellow { background: rgba(251,191,36,0.12); color: var(--yellow); border: 1px solid rgba(251,191,36,0.25); }
433433 .pw-pill-gray { background: rgba(139,148,158,0.12); color: #8b949e; border: 1px solid rgba(139,148,158,0.22); }
434434 .pw-pill-spin::after {
435435 content: '';
436436 display: inline-block;
437437 width: 8px; height: 8px;
438 border: 1.5px solid #fbbf24;
438 border: 1.5px solid var(--yellow);
439439 border-top-color: transparent;
440440 border-radius: 50%;
441441 animation: pw-spin 0.8s linear infinite;
@@ -490,7 +490,7 @@ const pwStyles = `
490490 .pw-poll-dot {
491491 width: 6px; height: 6px;
492492 border-radius: 50%;
493 background: #fbbf24;
493 background: var(--yellow);
494494 animation: pw-pulse 1.6s ease-in-out infinite;
495495 }
496496 pw-pulse { 0%,100%{opacity:1} 50%{opacity:0.35} }
Modifiedsrc/routes/refactors.tsx+4−4View fileUnifiedSplit
@@ -147,7 +147,7 @@ const refacStyles = `
147147 margin: 0;
148148 }
149149 .refac-card-title a { color: inherit; text-decoration: none; }
150 .refac-card-title a:hover { color: #5b6ee8; }
150 .refac-card-title a:hover { color: var(--accent); }
151151 .refac-card-meta {
152152 font-size: 12px;
153153 color: var(--text-muted);
@@ -176,10 +176,10 @@ const refacStyles = `
176176 color: var(--text-muted);
177177 }
178178 .refac-pill.is-planning { color: #5f8fa0; border-color: rgba(95,143,160,0.35); background: rgba(95,143,160,0.08); }
179 .refac-pill.is-building { color: #5b6ee8; border-color: rgba(91,110,232,0.35); background: rgba(91,110,232,0.08); }
179 .refac-pill.is-building { color: var(--accent); border-color: rgba(91,110,232,0.35); background: rgba(91,110,232,0.08); }
180180 .refac-pill.is-ready_for_review { color: #4ade80; border-color: rgba(74,222,128,0.35); background: rgba(74,222,128,0.08); }
181181 .refac-pill.is-merged { color: #4ade80; border-color: rgba(74,222,128,0.45); background: rgba(74,222,128,0.12); }
182 .refac-pill.is-failed { color: #fca5a5; border-color: rgba(252,165,165,0.35); background: rgba(252,165,165,0.08); }
182 .refac-pill.is-failed { color: var(--red); border-color: rgba(252,165,165,0.35); background: rgba(252,165,165,0.08); }
183183 .refac-pill.is-pending { color: var(--text-muted); }
184184 .refac-pill.is-opened { color: #4ade80; border-color: rgba(74,222,128,0.35); background: rgba(74,222,128,0.08); }
185185
@@ -281,7 +281,7 @@ const refacStyles = `
281281 .refac-pr-error {
282282 margin-top: 4px;
283283 font-size: 11px;
284 color: #fca5a5;
284 color: var(--red);
285285 font-family: var(--font-mono);
286286 }
287287
Modifiedsrc/routes/releases.tsx+2−2View fileUnifiedSplit
@@ -166,7 +166,7 @@ const relStyles = `
166166 }
167167 .rel-btn-danger {
168168 background: transparent;
169 color: #fca5a5;
169 color: var(--red);
170170 border-color: rgba(248,113,113,0.35);
171171 }
172172 .rel-btn-danger:hover {
@@ -288,7 +288,7 @@ const relStyles = `
288288 .rel-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
289289 .rel-pill.is-latest {
290290 background: rgba(52,211,153,0.14);
291 color: #6ee7b7;
291 color: var(--green);
292292 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
293293 }
294294 .rel-pill.is-draft {
Modifiedsrc/routes/repo-chat.tsx+2−2View fileUnifiedSplit
@@ -498,7 +498,7 @@ const rchatCss = `
498498 width: 18px; height: 18px;
499499 border-radius: 6px;
500500 background: rgba(91,110,232,0.14);
501 color: #5b6ee8;
501 color: var(--accent);
502502 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
503503 }
504504 .rchat-eyebrow-who {
@@ -682,7 +682,7 @@ const rchatCss = `
682682 width: 36px; height: 36px;
683683 border-radius: 10px;
684684 background: linear-gradient(135deg, rgba(91,110,232,0.18), rgba(95,143,160,0.10));
685 color: #5b6ee8;
685 color: var(--accent);
686686 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
687687 flex-shrink: 0;
688688 }
Modifiedsrc/routes/repo-health.tsx+6−6View fileUnifiedSplit
@@ -180,9 +180,9 @@ const styles = `
180180 font-weight: 700;
181181 letter-spacing: 0.04em;
182182 }
183 .rh-score-pill--green { background: rgba(52,211,153,.15); color: #34d399; border: 1px solid rgba(52,211,153,.3); }
183 .rh-score-pill--green { background: rgba(52,211,153,.15); color: var(--green); border: 1px solid rgba(52,211,153,.3); }
184184 .rh-score-pill--yellow { background: rgba(250,204,21,.15); color: #facc15; border: 1px solid rgba(250,204,21,.3); }
185 .rh-score-pill--red { background: rgba(248,113,113,.15); color: #f87171; border: 1px solid rgba(248,113,113,.3); }
185 .rh-score-pill--red { background: rgba(248,113,113,.15); color: var(--red); border: 1px solid rgba(248,113,113,.3); }
186186
187187 /* Recompute button */
188188 .rh-recompute-btn {
@@ -261,9 +261,9 @@ const styles = `
261261 border-radius: 4px;
262262 transition: width 500ms ease;
263263 }
264 .rh-bar-green { background: #34d399; }
264 .rh-bar-green { background: var(--green); }
265265 .rh-bar-yellow { background: #facc15; }
266 .rh-bar-red { background: #f87171; }
266 .rh-bar-red { background: var(--red); }
267267 .rh-bar-blue { background: #60a5fa; }
268268 .rh-bar-purple { background: #a78bfa; }
269269
@@ -288,9 +288,9 @@ function gaugeProps(score: number) {
288288 const circumference = 2 * Math.PI * r;
289289 const dashoffset = circumference * (1 - score / 100);
290290 const color =
291 score >= 80 ? "#34d399" :
291 score >= 80 ? "var(--green)" :
292292 score >= 50 ? "#facc15" :
293 "#f87171";
293 "var(--red)";
294294 return {
295295 r,
296296 cx: 70,
Modifiedsrc/routes/repo-settings.tsx+7−7View fileUnifiedSplit
@@ -131,12 +131,12 @@ const repoSettingsStyles = `
131131 }
132132 .repo-settings-banner-success {
133133 background: rgba(52,211,153,0.08);
134 color: #6ee7b7;
134 color: var(--green);
135135 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
136136 }
137137 .repo-settings-banner-error {
138138 background: rgba(248,113,113,0.08);
139 color: #fca5a5;
139 color: var(--red);
140140 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
141141 }
142142 .repo-settings-banner-icon {
@@ -151,11 +151,11 @@ const repoSettingsStyles = `
151151 }
152152 .repo-settings-banner-success .repo-settings-banner-icon {
153153 background: rgba(52,211,153,0.18);
154 color: #34d399;
154 color: var(--green);
155155 }
156156 .repo-settings-banner-error .repo-settings-banner-icon {
157157 background: rgba(248,113,113,0.18);
158 color: #f87171;
158 color: var(--red);
159159 }
160160
161161 /* ─── Section cards ─── */
@@ -402,7 +402,7 @@ const repoSettingsStyles = `
402402 }
403403 .repo-settings-pill.is-on {
404404 background: rgba(91,110,232,0.14);
405 color: #5b6ee8;
405 color: var(--accent);
406406 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
407407 }
408408 .repo-settings-pill.is-off {
@@ -448,7 +448,7 @@ const repoSettingsStyles = `
448448 font-weight: 600;
449449 letter-spacing: 0.08em;
450450 text-transform: uppercase;
451 color: #f87171;
451 color: var(--red);
452452 margin-bottom: 6px;
453453 }
454454 .repo-settings-danger-title {
@@ -1338,7 +1338,7 @@ repoSettings.get("/:owner/:repo/settings", requireAuth, requireRepoAccess("admin
13381338 {rule.requiredApprovals} required approval{rule.requiredApprovals !== 1 ? "s" : ""}
13391339 </span>
13401340 {rule.requireHumanReview && (
1341 <span style="font-size:11px;font-weight:600;padding:2px 8px;border-radius:9999px;background:rgba(91,110,232,0.12);color:#5b6ee8">
1341 <span style="font-size:11px;font-weight:600;padding:2px 8px;border-radius:9999px;background:rgba(91,110,232,0.12);color:var(--accent)">
13421342 codeowner review required
13431343 </span>
13441344 )}
Modifiedsrc/routes/required-checks.tsx+6−6View fileUnifiedSplit
@@ -199,7 +199,7 @@ const rcStyles = `
199199 width: 18px; height: 18px;
200200 border-radius: 6px;
201201 background: rgba(91,110,232,0.14);
202 color: #5b6ee8;
202 color: var(--accent);
203203 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
204204 }
205205 .rc-title {
@@ -372,7 +372,7 @@ const rcStyles = `
372372 width: 26px; height: 26px;
373373 border-radius: 8px;
374374 background: rgba(91,110,232,0.12);
375 color: #5b6ee8;
375 color: var(--accent);
376376 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
377377 flex-shrink: 0;
378378 }
@@ -411,16 +411,16 @@ const rcStyles = `
411411 position: relative;
412412 }
413413 .rc-light.is-pass {
414 background: #34d399;
414 background: var(--green);
415415 box-shadow: 0 0 0 3px rgba(52,211,153,0.22), 0 0 10px rgba(52,211,153,0.45);
416416 }
417417 .rc-light.is-fail {
418 background: #f87171;
418 background: var(--red);
419419 box-shadow: 0 0 0 3px rgba(248,113,113,0.22), 0 0 12px rgba(248,113,113,0.50);
420420 animation: rcPulse 1.8s ease-in-out infinite;
421421 }
422422 .rc-light.is-warn {
423 background: #fbbf24;
423 background: var(--yellow);
424424 box-shadow: 0 0 0 3px rgba(251,191,36,0.22), 0 0 10px rgba(251,191,36,0.40);
425425 }
426426 .rc-light.is-idle {
@@ -462,7 +462,7 @@ const rcStyles = `
462462 letter-spacing: 0.06em;
463463 border-radius: 9999px;
464464 }
465 .rc-check-pill.is-pass { background: rgba(52,211,153,0.14); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
465 .rc-check-pill.is-pass { background: rgba(52,211,153,0.14); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
466466 .rc-check-pill.is-fail { background: rgba(248,113,113,0.14); color: #fecaca; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32); }
467467 .rc-check-pill.is-warn { background: rgba(251,191,36,0.14); color: #fde68a; box-shadow: inset 0 0 0 1px rgba(251,191,36,0.32); }
468468 .rc-check-pill.is-idle { background: rgba(255,255,255,0.04); color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--border); }
Modifiedsrc/routes/rulesets.tsx+2−2View fileUnifiedSplit
@@ -144,7 +144,7 @@ const rsStyles = `
144144 width: 18px; height: 18px;
145145 border-radius: 6px;
146146 background: rgba(91,110,232,0.14);
147 color: #5b6ee8;
147 color: var(--accent);
148148 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
149149 }
150150 .rs-title {
@@ -295,7 +295,7 @@ const rsStyles = `
295295 width: 26px; height: 26px;
296296 border-radius: 8px;
297297 background: rgba(91,110,232,0.12);
298 color: #5b6ee8;
298 color: var(--accent);
299299 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
300300 flex-shrink: 0;
301301 }
Modifiedsrc/routes/saved-replies.tsx+2−2View fileUnifiedSplit
@@ -104,7 +104,7 @@ const srStyles = `
104104 width: 18px; height: 18px;
105105 border-radius: 6px;
106106 background: rgba(91,110,232,0.14);
107 color: #5b6ee8;
107 color: var(--accent);
108108 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
109109 }
110110 .sr-crumb { color: var(--text-muted); text-decoration: none; }
@@ -193,7 +193,7 @@ const srStyles = `
193193 width: 26px; height: 26px;
194194 border-radius: 8px;
195195 background: rgba(91,110,232,0.12);
196 color: #5b6ee8;
196 color: var(--accent);
197197 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
198198 flex-shrink: 0;
199199 }
Modifiedsrc/routes/search.tsx+2−2View fileUnifiedSplit
@@ -307,12 +307,12 @@ const SearchPageStyle = () => (
307307 }
308308 .search-page-state-open {
309309 background: rgba(52,211,153,0.10);
310 color: #34d399;
310 color: var(--green);
311311 border: 1px solid rgba(52,211,153,0.30);
312312 }
313313 .search-page-state-closed {
314314 background: rgba(91,110,232,0.12);
315 color: #5b6ee8;
315 color: var(--accent);
316316 border: 1px solid rgba(91,110,232,0.30);
317317 }
318318 .search-page-state-merged {
Modifiedsrc/routes/security.tsx+2−2View fileUnifiedSplit
@@ -143,7 +143,7 @@ const styles = `
143143 color: var(--text-strong);
144144 font-variant-numeric: tabular-nums;
145145 }
146 .svp-count-card.is-critical .svp-count-value { color: #fca5a5; }
146 .svp-count-card.is-critical .svp-count-value { color: var(--red); }
147147 .svp-count-card.is-high .svp-count-value { color: #fdba74; }
148148 .svp-count-card.is-medium .svp-count-value { color: #fde047; }
149149 .svp-count-card.is-low .svp-count-value { color: #a5b4fc; }
@@ -264,7 +264,7 @@ const styles = `
264264 letter-spacing: 0.04em;
265265 white-space: nowrap;
266266 }
267 .svp-sev-pill.sev-critical { background: rgba(239,68,68,0.15); color: #fca5a5; border: 1px solid rgba(239,68,68,0.35); }
267 .svp-sev-pill.sev-critical { background: rgba(239,68,68,0.15); color: var(--red); border: 1px solid rgba(239,68,68,0.35); }
268268 .svp-sev-pill.sev-high { background: rgba(249,115,22,0.15); color: #fdba74; border: 1px solid rgba(249,115,22,0.35); }
269269 .svp-sev-pill.sev-medium { background: rgba(234,179,8,0.12); color: #fde047; border: 1px solid rgba(234,179,8,0.30); }
270270 .svp-sev-pill.sev-low { background: rgba(99,102,241,0.12); color: #a5b4fc; border: 1px solid rgba(99,102,241,0.28); }
Modifiedsrc/routes/settings-2fa.tsx+6−6View fileUnifiedSplit
@@ -101,7 +101,7 @@ const tfaStyles = `
101101 width: 18px; height: 18px;
102102 border-radius: 6px;
103103 background: rgba(91,110,232,0.14);
104 color: #5b6ee8;
104 color: var(--accent);
105105 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
106106 }
107107 .tfa-crumb { color: var(--text-muted); text-decoration: none; }
@@ -260,7 +260,7 @@ const tfaStyles = `
260260 width: 26px; height: 26px;
261261 border-radius: 8px;
262262 background: rgba(91,110,232,0.12);
263 color: #5b6ee8;
263 color: var(--accent);
264264 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
265265 flex-shrink: 0;
266266 }
@@ -454,10 +454,10 @@ const tfaStyles = `
454454 .tfa-recovery-pill .dot {
455455 width: 6px; height: 6px;
456456 border-radius: 9999px;
457 background: #34d399;
457 background: var(--green);
458458 }
459 .tfa-recovery-pill.is-low .dot { background: #fbbf24; }
460 .tfa-recovery-pill.is-empty .dot { background: #f87171; }
459 .tfa-recovery-pill.is-low .dot { background: var(--yellow); }
460 .tfa-recovery-pill.is-empty .dot { background: var(--red); }
461461
462462 /* ─── Warning banner (amber) ─── */
463463 .tfa-warning {
@@ -477,7 +477,7 @@ const tfaStyles = `
477477 flex-shrink: 0;
478478 width: 18px; height: 18px;
479479 margin-top: 1px;
480 color: #fbbf24;
480 color: var(--yellow);
481481 }
482482 .tfa-warning strong { color: #fef3c7; font-weight: 700; }
483483
Modifiedsrc/routes/settings-integrations.tsx+3−3View fileUnifiedSplit
@@ -79,7 +79,7 @@ const chatiStyles = `
7979 display: inline-flex; align-items: center; justify-content: center;
8080 width: 18px; height: 18px; border-radius: 6px;
8181 background: rgba(91,110,232,0.14);
82 color: #5b6ee8;
82 color: var(--accent);
8383 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.32);
8484 }
8585 .chati-title {
@@ -239,7 +239,7 @@ const chatiStyles = `
239239 text-transform: uppercase;
240240 flex-shrink: 0;
241241 }
242 .chati-pill.is-on { background: rgba(52,211,153,0.14); color: #6ee7b7; box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
242 .chati-pill.is-on { background: rgba(52,211,153,0.14); color: var(--green); box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32); }
243243 .chati-pill.is-off { background: rgba(107,114,128,0.16); color: #d1d5db; box-shadow: inset 0 0 0 1px rgba(107,114,128,0.32); }
244244 .chati-pill .dot { width: 6px; height: 6px; border-radius: 9999px; background: currentColor; }
245245
@@ -288,7 +288,7 @@ const chatiStyles = `
288288 .chati-btn-danger {
289289 background: rgba(248,113,113,0.08);
290290 border-color: rgba(248,113,113,0.30);
291 color: #fca5a5;
291 color: var(--red);
292292 }
293293 .chati-btn-danger:hover { background: rgba(248,113,113,0.14); border-color: rgba(248,113,113,0.50); color: #fecaca; }
294294 .chati-btn-primary {
Modifiedsrc/routes/settings.tsx+13−13View fileUnifiedSplit
@@ -272,7 +272,7 @@ const settingsStyles = `
272272 }
273273 .settings-sleep-state.is-on {
274274 background: rgba(91,110,232,0.14);
275 color: #5b6ee8;
275 color: var(--accent);
276276 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
277277 }
278278 .settings-sleep-state.is-off {
@@ -405,12 +405,12 @@ const settingsStyles = `
405405 }
406406 .settings-banner-success {
407407 background: rgba(52,211,153,0.08);
408 color: #6ee7b7;
408 color: var(--green);
409409 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
410410 }
411411 .settings-banner-error {
412412 background: rgba(248,113,113,0.08);
413 color: #fca5a5;
413 color: var(--red);
414414 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
415415 }
416416 .settings-banner-icon {
@@ -425,11 +425,11 @@ const settingsStyles = `
425425 }
426426 .settings-banner-success .settings-banner-icon {
427427 background: rgba(52,211,153,0.18);
428 color: #34d399;
428 color: var(--green);
429429 }
430430 .settings-banner-error .settings-banner-icon {
431431 background: rgba(248,113,113,0.18);
432 color: #f87171;
432 color: var(--red);
433433 }
434434
435435 /* ─── Danger zone ─── */
@@ -462,7 +462,7 @@ const settingsStyles = `
462462 font-weight: 600;
463463 letter-spacing: 0.08em;
464464 text-transform: uppercase;
465 color: #f87171;
465 color: var(--red);
466466 margin-bottom: 6px;
467467 }
468468 .settings-danger-title {
@@ -496,7 +496,7 @@ const settingsStyles = `
496496 outline: none;
497497 }
498498 .settings-danger-input:focus {
499 border-color: #f87171;
499 border-color: var(--red);
500500 box-shadow: 0 0 0 3px rgba(248,113,113,0.20);
501501 }
502502 .settings-danger-scheduled {
@@ -507,7 +507,7 @@ const settingsStyles = `
507507 margin-bottom: var(--space-3);
508508 font-size: 13.5px;
509509 }
510 .settings-danger-scheduled strong { color: #fca5a5; }
510 .settings-danger-scheduled strong { color: var(--red); }
511511
512512 /* ─── Responsive ─── */
513513 (max-width: 720px) {
@@ -658,7 +658,7 @@ settings.get("/settings", async (c) => {
658658 style={
659659 "display:inline-flex;align-items:center;justify-content:center;" +
660660 "width:32px;height:32px;border-radius:8px;" +
661 "background:rgba(52,211,153,0.14);color:#6ee7b7;font-weight:700;font-size:15px;"
661 "background:rgba(52,211,153,0.14);color:var(--green);font-weight:700;font-size:15px;"
662662 }
663663 aria-hidden="true"
664664 >
@@ -1320,7 +1320,7 @@ const notifsetStyles = `
13201320 width: 18px; height: 18px;
13211321 border-radius: 6px;
13221322 background: rgba(91,110,232,0.14);
1323 color: #5b6ee8;
1323 color: var(--accent);
13241324 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
13251325 }
13261326 .notifset-crumb { color: var(--text-muted); text-decoration: none; }
@@ -1428,7 +1428,7 @@ const notifsetStyles = `
14281428 }
14291429 .notifset-channel-pill.is-on {
14301430 background: rgba(52,211,153,0.14);
1431 color: #6ee7b7;
1431 color: var(--green);
14321432 border-color: rgba(52,211,153,0.32);
14331433 }
14341434 .notifset-channel-pill .dot { width: 5px; height: 5px; border-radius: 9999px; background: currentColor; }
@@ -1463,7 +1463,7 @@ const notifsetStyles = `
14631463 width: 26px; height: 26px;
14641464 border-radius: 8px;
14651465 background: rgba(91,110,232,0.12);
1466 color: #5b6ee8;
1466 color: var(--accent);
14671467 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
14681468 flex-shrink: 0;
14691469 }
@@ -1503,7 +1503,7 @@ const notifsetStyles = `
15031503 .notifset-rule input[type="checkbox"] {
15041504 margin-top: 2px;
15051505 flex-shrink: 0;
1506 accent-color: #5b6ee8;
1506 accent-color: var(--accent);
15071507 width: 16px;
15081508 height: 16px;
15091509 }
Modifiedsrc/routes/ship-agent.tsx+4−4View fileUnifiedSplit
@@ -81,12 +81,12 @@ const shipStyles = `
8181 .ship-phase.is-done {
8282 background: rgba(52,211,153,0.1);
8383 border-color: rgba(52,211,153,0.35);
84 color: #34d399;
84 color: var(--green);
8585 }
8686 .ship-phase.is-failed {
8787 background: rgba(248,113,113,0.1);
8888 border-color: rgba(248,113,113,0.35);
89 color: #f87171;
89 color: var(--red);
9090 }
9191 .ship-log {
9292 background: var(--bg-secondary);
@@ -103,8 +103,8 @@ const shipStyles = `
103103 word-break: break-all;
104104 }
105105 .ship-log-entry { display: block; }
106 .ship-log-entry.is-error { color: #f87171; }
107 .ship-log-entry.is-done { color: #34d399; }
106 .ship-log-entry.is-error { color: var(--red); }
107 .ship-log-entry.is-done { color: var(--green); }
108108 .ship-result {
109109 margin-top: 18px;
110110 padding: 14px 18px;
Modifiedsrc/routes/signing-keys.tsx+6−6View fileUnifiedSplit
@@ -64,7 +64,7 @@ const signingKeyStyles = `
6464 width: 18px; height: 18px;
6565 border-radius: 6px;
6666 background: rgba(91,110,232,0.14);
67 color: #5b6ee8;
67 color: var(--accent);
6868 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
6969 }
7070 .sk-title {
@@ -98,7 +98,7 @@ const signingKeyStyles = `
9898 border-radius: 4px;
9999 }
100100 .sk-sub .sk-verified {
101 color: #6ee7b7;
101 color: var(--green);
102102 font-weight: 600;
103103 }
104104
@@ -237,12 +237,12 @@ const signingKeyStyles = `
237237 }
238238 .sk-pill.is-active {
239239 background: rgba(52,211,153,0.14);
240 color: #6ee7b7;
240 color: var(--green);
241241 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
242242 }
243243 .sk-pill.is-expired {
244244 background: rgba(248,113,113,0.12);
245 color: #fca5a5;
245 color: var(--red);
246246 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
247247 }
248248
@@ -270,7 +270,7 @@ const signingKeyStyles = `
270270 .sk-btn-danger {
271271 background: rgba(248,113,113,0.08);
272272 border-color: rgba(248,113,113,0.30);
273 color: #fca5a5;
273 color: var(--red);
274274 }
275275 .sk-btn-danger:hover {
276276 background: rgba(248,113,113,0.14);
@@ -359,7 +359,7 @@ const signingKeyStyles = `
359359 width: 26px; height: 26px;
360360 border-radius: 8px;
361361 background: rgba(91,110,232,0.12);
362 color: #5b6ee8;
362 color: var(--accent);
363363 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
364364 }
365365 .sk-form-body { padding: var(--space-4) var(--space-5); }
Modifiedsrc/routes/sleep-mode.tsx+3−3View fileUnifiedSplit
@@ -388,7 +388,7 @@ const pageCss = `
388388 width: 18px; height: 18px;
389389 border-radius: 6px;
390390 background: rgba(91,110,232,0.14);
391 color: #5b6ee8;
391 color: var(--accent);
392392 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
393393 }
394394 .sleep-title {
@@ -483,7 +483,7 @@ const pageCss = `
483483 background: var(--text-faint);
484484 }
485485 .sleep-status-card.is-active .sleep-status-dot {
486 background: #3fb950;
486 background: var(--green);
487487 box-shadow: 0 0 0 4px rgba(63,185,80,0.18);
488488 }
489489 .sleep-status-card.is-inactive .sleep-status-dot {
@@ -500,7 +500,7 @@ const pageCss = `
500500 color: var(--text-strong);
501501 font-weight: 700;
502502 }
503 .sleep-status-card.is-active .sleep-status-title strong { color: #6ee7b7; }
503 .sleep-status-card.is-active .sleep-status-title strong { color: var(--green); }
504504 .sleep-status-card.is-inactive .sleep-status-title strong { color: var(--text-muted); }
505505 .sleep-status-sub {
506506 margin: 4px 0 0;
Modifiedsrc/routes/specs.tsx+5−5View fileUnifiedSplit
@@ -1057,12 +1057,12 @@ const progressStyles = `
10571057 background: rgba(34,197,94,0.12);
10581058 }
10591059 .sp-dot.is-active {
1060 border-color: #5b6ee8;
1060 border-color: var(--accent);
10611061 background: rgba(91,110,232,0.14);
10621062 animation: sp-pulse 1.6s ease-in-out infinite;
10631063 }
10641064 .sp-dot.is-error {
1065 border-color: #f87171;
1065 border-color: var(--red);
10661066 background: rgba(248,113,113,0.12);
10671067 }
10681068 sp-pulse {
@@ -1080,7 +1080,7 @@ const progressStyles = `
10801080 }
10811081 .sp-step-label.is-done { color: #22c55e; }
10821082 .sp-step-label.is-active { color: var(--text-strong); }
1083 .sp-step-label.is-error { color: #f87171; }
1083 .sp-step-label.is-error { color: var(--red); }
10841084 .sp-step-detail {
10851085 font-size: 12px;
10861086 color: var(--text-muted);
@@ -1135,12 +1135,12 @@ const progressStyles = `
11351135 .sp-error-card.is-visible { display: block; }
11361136 .sp-error-card p {
11371137 font-size: 13px;
1138 color: #fca5a5;
1138 color: var(--red);
11391139 margin: 0 0 10px;
11401140 }
11411141 .sp-error-card a {
11421142 font-size: 13px;
1143 color: #f87171;
1143 color: var(--red);
11441144 text-decoration: underline;
11451145 }
11461146`;
Modifiedsrc/routes/sponsors.tsx+1−1View fileUnifiedSplit
@@ -296,7 +296,7 @@ const sponsStyles = `
296296 color: var(--text);
297297 line-height: 1.45;
298298 }
299 .spons-tier-benefits li svg { flex-shrink: 0; margin-top: 2px; color: #6ee7b7; }
299 .spons-tier-benefits li svg { flex-shrink: 0; margin-top: 2px; color: var(--green); }
300300 .spons-tier-select {
301301 padding: 8px 10px;
302302 font-size: 12.5px;
Modifiedsrc/routes/sso.tsx+1−1View fileUnifiedSplit
@@ -158,7 +158,7 @@ const ssoStyles = `
158158 }
159159 .sso-status-pill.is-on {
160160 background: rgba(52,211,153,0.14);
161 color: #6ee7b7;
161 color: var(--green);
162162 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.36);
163163 }
164164 .sso-status-pill.is-off {
Modifiedsrc/routes/stale-branches.tsx+3−3View fileUnifiedSplit
@@ -184,12 +184,12 @@ const sbStyles = `
184184 .sb-flash.is-success {
185185 background: rgba(52,211,153,0.08);
186186 border-color: rgba(52,211,153,0.3);
187 color: #34d399;
187 color: var(--green);
188188 }
189189 .sb-flash.is-error {
190190 background: rgba(248,113,113,0.08);
191191 border-color: rgba(248,113,113,0.3);
192 color: #f87171;
192 color: var(--red);
193193 }
194194
195195 /* Protected-branches hint */
@@ -324,7 +324,7 @@ const sbStyles = `
324324 }
325325 .sb-btn-danger {
326326 background: rgba(248,113,113,0.12);
327 color: #f87171;
327 color: var(--red);
328328 border-color: rgba(248,113,113,0.35);
329329 }
330330 .sb-btn-danger:hover:not(:disabled) {
Modifiedsrc/routes/standups.tsx+1−1View fileUnifiedSplit
@@ -338,7 +338,7 @@ const pageCss = `
338338 background: rgba(255, 255, 255, 0.03);
339339 color: var(--text-muted, #aab0c2);
340340}
341.standup-pill.is-on { color: #5b6ee8; border-color: rgba(91,110,232, 0.4); }
341.standup-pill.is-on { color: var(--accent); border-color: rgba(91,110,232, 0.4); }
342342.standup-pill.is-off { opacity: .8; }
343343.standup-dot { width: 7px; height: 7px; border-radius: 9999px; background: currentColor; }
344344.standup-featured {
Modifiedsrc/routes/status.tsx+18−18View fileUnifiedSplit
@@ -870,12 +870,12 @@ const statusStyles = `
870870 width: 18px; height: 18px;
871871 border-radius: 6px;
872872 background: rgba(52,211,153,0.14);
873 color: #6ee7b7;
873 color: var(--green);
874874 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
875875 }
876876 .status-hero.is-degraded .status-eyebrow-pill {
877877 background: rgba(248,113,113,0.14);
878 color: #fca5a5;
878 color: var(--red);
879879 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
880880 }
881881 .status-title {
@@ -895,12 +895,12 @@ const statusStyles = `
895895 display: inline-block;
896896 width: 14px; height: 14px;
897897 border-radius: 50%;
898 background: #34d399;
898 background: var(--green);
899899 box-shadow: 0 0 0 5px rgba(52,211,153,0.18);
900900 flex-shrink: 0;
901901 }
902902 .status-hero.is-degraded .status-dot-big {
903 background: #f87171;
903 background: var(--red);
904904 box-shadow: 0 0 0 5px rgba(248,113,113,0.18);
905905 }
906906 .status-title-grad {
@@ -961,17 +961,17 @@ const statusStyles = `
961961 }
962962 .status-notice.is-ok {
963963 background: rgba(52,211,153,0.10);
964 color: #6ee7b7;
964 color: var(--green);
965965 border: 1px solid rgba(52,211,153,0.25);
966966 }
967967 .status-notice.is-warn {
968968 background: rgba(251,191,36,0.10);
969 color: #fbbf24;
969 color: var(--yellow);
970970 border: 1px solid rgba(251,191,36,0.25);
971971 }
972972 .status-notice.is-err {
973973 background: rgba(248,113,113,0.10);
974 color: #fca5a5;
974 color: var(--red);
975975 border: 1px solid rgba(248,113,113,0.25);
976976 }
977977
@@ -1054,7 +1054,7 @@ const statusStyles = `
10541054 .status-uptime-pct {
10551055 font-family: var(--font-mono);
10561056 font-size: 13px;
1057 color: #6ee7b7;
1057 color: var(--green);
10581058 font-weight: 600;
10591059 }
10601060
@@ -1077,12 +1077,12 @@ const statusStyles = `
10771077 }
10781078 .status-pill-ok {
10791079 background: rgba(52,211,153,0.14);
1080 color: #6ee7b7;
1080 color: var(--green);
10811081 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
10821082 }
10831083 .status-pill-down {
10841084 background: rgba(248,113,113,0.14);
1085 color: #fca5a5;
1085 color: var(--red);
10861086 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
10871087 }
10881088 .status-pill-idle {
@@ -1092,7 +1092,7 @@ const statusStyles = `
10921092 }
10931093 .status-pill-warn {
10941094 background: rgba(251,191,36,0.14);
1095 color: #fbbf24;
1095 color: var(--yellow);
10961096 box-shadow: inset 0 0 0 1px rgba(251,191,36,0.32);
10971097 }
10981098
@@ -1113,12 +1113,12 @@ const statusStyles = `
11131113 }
11141114 .status-sev-major {
11151115 background: rgba(251,191,36,0.14);
1116 color: #fbbf24;
1116 color: var(--yellow);
11171117 box-shadow: inset 0 0 0 1px rgba(251,191,36,0.32);
11181118 }
11191119 .status-sev-crit {
11201120 background: rgba(248,113,113,0.14);
1121 color: #fca5a5;
1121 color: var(--red);
11221122 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
11231123 }
11241124
@@ -1183,7 +1183,7 @@ const statusStyles = `
11831183 .status-alert-dot {
11841184 width: 8px; height: 8px;
11851185 border-radius: 9999px;
1186 background: #f87171;
1186 background: var(--red);
11871187 box-shadow: 0 0 0 3px rgba(248,113,113,0.18);
11881188 margin-top: 6px;
11891189 flex-shrink: 0;
@@ -1256,12 +1256,12 @@ const statusStyles = `
12561256 }
12571257 .status-count-pill.is-ok {
12581258 background: rgba(52,211,153,0.12);
1259 color: #6ee7b7;
1259 color: var(--green);
12601260 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
12611261 }
12621262 .status-count-pill.is-warn {
12631263 background: rgba(248,113,113,0.12);
1264 color: #fca5a5;
1264 color: var(--red);
12651265 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.32);
12661266 }
12671267
@@ -1395,8 +1395,8 @@ const statusStyles = `
13951395 font-size: 12.5px;
13961396 color: var(--text-muted);
13971397 }
1398 .status-tick-val.is-ok { color: #6ee7b7; }
1399 .status-tick-val.is-err { color: #fca5a5; }
1398 .status-tick-val.is-ok { color: var(--green); }
1399 .status-tick-val.is-err { color: var(--red); }
14001400 .status-tick-ms { color: var(--text-faint); font-size: 11.5px; }
14011401
14021402 /* ─── Footer links ─── */
Modifiedsrc/routes/symbols.tsx+1−1View fileUnifiedSplit
@@ -282,7 +282,7 @@ const symStyles = `
282282 .sym-kind.is-const,
283283 .sym-kind.is-var {
284284 background: rgba(52,211,153,0.12);
285 color: #6ee7b7;
285 color: var(--green);
286286 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.32);
287287 }
288288 .sym-kind.is-other {
Modifiedsrc/routes/team-collaborators.tsx+1−1View fileUnifiedSplit
@@ -383,7 +383,7 @@ const tcStyles = `
383383 border-radius: 999px;
384384 background: rgba(251,191,36,0.10);
385385 border: 1px solid rgba(251,191,36,0.35);
386 color: #fbbf24;
386 color: var(--yellow);
387387 text-transform: uppercase;
388388 letter-spacing: 0.04em;
389389 }
Modifiedsrc/routes/tokens.tsx+10−10View fileUnifiedSplit
@@ -112,7 +112,7 @@ const tokensStyles = `
112112 height: 22px;
113113 border-radius: 7px;
114114 background: rgba(91,110,232,0.14);
115 color: #5b6ee8;
115 color: var(--accent);
116116 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.30);
117117 flex-shrink: 0;
118118 }
@@ -159,7 +159,7 @@ const tokensStyles = `
159159 }
160160 .tokens-banner-success {
161161 background: rgba(52,211,153,0.08);
162 color: #6ee7b7;
162 color: var(--green);
163163 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
164164 }
165165 .tokens-banner-icon {
@@ -175,7 +175,7 @@ const tokensStyles = `
175175 }
176176 .tokens-banner-success .tokens-banner-icon {
177177 background: rgba(52,211,153,0.18);
178 color: #34d399;
178 color: var(--green);
179179 }
180180 .tokens-banner-body { flex: 1; min-width: 0; }
181181
@@ -205,7 +205,7 @@ const tokensStyles = `
205205 font-weight: 600;
206206 letter-spacing: 0.08em;
207207 text-transform: uppercase;
208 color: #5b6ee8;
208 color: var(--accent);
209209 margin-bottom: 6px;
210210 }
211211 .tokens-reveal-title {
@@ -334,12 +334,12 @@ const tokensStyles = `
334334 padding: 2px 8px;
335335 border-radius: 9999px;
336336 background: rgba(91,110,232,0.12);
337 color: #5b6ee8;
337 color: var(--accent);
338338 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.28);
339339 }
340340 .tokens-scope-chip.is-admin {
341341 background: rgba(248,113,113,0.10);
342 color: #fca5a5;
342 color: var(--red);
343343 box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);
344344 }
345345 .tokens-scope-chip.is-user {
@@ -361,7 +361,7 @@ const tokensStyles = `
361361 padding: 6px 12px;
362362 font-size: 12.5px;
363363 font-weight: 600;
364 color: #fca5a5;
364 color: var(--red);
365365 background: rgba(248,113,113,0.06);
366366 border: 1px solid rgba(248,113,113,0.30);
367367 border-radius: 8px;
@@ -408,7 +408,7 @@ const tokensStyles = `
408408 margin-bottom: 12px;
409409 border-radius: 12px;
410410 background: rgba(91,110,232,0.14);
411 color: #5b6ee8;
411 color: var(--accent);
412412 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.30);
413413 }
414414 .tokens-empty-icon svg { width: 22px; height: 22px; display: block; }
@@ -659,12 +659,12 @@ tokens.get("/settings/tokens", async (c) => {
659659 {error && (
660660 <div
661661 class="tokens-banner tokens-banner-success"
662 style="background: rgba(248,113,113,0.08); color: #fca5a5; box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);"
662 style="background: rgba(248,113,113,0.08); color: var(--red); box-shadow: inset 0 0 0 1px rgba(248,113,113,0.30);"
663663 role="alert"
664664 >
665665 <span
666666 class="tokens-banner-icon"
667 style="background: rgba(248,113,113,0.18); color: #f87171;"
667 style="background: rgba(248,113,113,0.18); color: var(--red);"
668668 aria-hidden="true"
669669 >
670670 !
Modifiedsrc/routes/traffic.tsx+2−2View fileUnifiedSplit
@@ -181,8 +181,8 @@ const styles = `
181181 font-variant-numeric: tabular-nums;
182182 color: var(--text-muted);
183183 }
184 .traffic-stat-trend.is-up { color: #6ee7b7; }
185 .traffic-stat-trend.is-down { color: #fca5a5; }
184 .traffic-stat-trend.is-up { color: var(--green); }
185 .traffic-stat-trend.is-down { color: var(--red); }
186186 .traffic-stat-trend .arrow { font-size: 11px; line-height: 1; }
187187 .traffic-stat-hint {
188188 margin-top: 6px;
Modifiedsrc/routes/velocity.tsx+2−2View fileUnifiedSplit
@@ -268,9 +268,9 @@ const styles = `
268268 font-variant-numeric: tabular-nums;
269269 line-height: 1;
270270 }
271 .vel-bucket-value.fast { color: #34d399; }
271 .vel-bucket-value.fast { color: var(--green); }
272272 .vel-bucket-value.normal { color: #60a5fa; }
273 .vel-bucket-value.slow { color: #f87171; }
273 .vel-bucket-value.slow { color: var(--red); }
274274 .vel-bucket-hint {
275275 font-size: 11px;
276276 color: var(--text-muted);
Modifiedsrc/routes/voice-to-pr.tsx+4−4View fileUnifiedSplit
@@ -94,7 +94,7 @@ const voiceCss = `
9494 width: 18px; height: 18px;
9595 border-radius: 6px;
9696 background: rgba(91,110,232,0.16);
97 color: #5b6ee8;
97 color: var(--accent);
9898 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
9999 }
100100 .voice-eyebrow-warn {
@@ -211,7 +211,7 @@ const voiceCss = `
211211 color: var(--text-muted);
212212 font-weight: 700;
213213 }
214 .voice-mic-label[data-recording="1"] { color: #f87171; }
214 .voice-mic-label[data-recording="1"] { color: var(--red); }
215215
216216 /* Transcript card */
217217 .voice-card {
@@ -380,7 +380,7 @@ const voiceCss = `
380380 }
381381 .voice-heard-kind[data-kind="spec"] {
382382 background: rgba(91,110,232,0.14);
383 color: #5b6ee8;
383 color: var(--accent);
384384 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.34);
385385 }
386386 .voice-heard-kind[data-kind="issue"] {
@@ -444,7 +444,7 @@ const voiceCss = `
444444 color: var(--text-muted);
445445 min-height: 18px;
446446 }
447 .voice-status[data-kind="error"] { color: #fca5a5; }
447 .voice-status[data-kind="error"] { color: var(--red); }
448448 .voice-status[data-kind="ok"] { color: #86efac; }
449449
450450 /* Mobile spacing tweaks (375px target) */
Modifiedsrc/routes/vs-github.tsx+3−3View fileUnifiedSplit
@@ -1325,7 +1325,7 @@ const pageCss = `
13251325 width: 18px; height: 18px;
13261326 border-radius: 6px;
13271327 background: rgba(91,110,232,0.14);
1328 color: #5b6ee8;
1328 color: var(--accent);
13291329 box-shadow: inset 0 0 0 1px rgba(91,110,232,0.35);
13301330 }
13311331
@@ -1460,7 +1460,7 @@ const pageCss = `
14601460 font-weight: 600;
14611461 }
14621462 .vsg-page .vsg-th-them, .vsg-page .vsg-th-us { text-align: left; }
1463 .vsg-page .vsg-th-us { color: #5b6ee8; }
1463 .vsg-page .vsg-th-us { color: var(--accent); }
14641464 .vsg-page .vsg-th-dot {
14651465 width: 7px; height: 7px; border-radius: 9999px;
14661466 flex-shrink: 0;
@@ -1574,7 +1574,7 @@ const pageCss = `
15741574 border-bottom: 1px dashed rgba(91,110,232,0.4);
15751575 transition: color 140ms ease;
15761576 }
1577 .vsg-page .vsg-note-link:hover { color: #5b6ee8; }
1577 .vsg-page .vsg-note-link:hover { color: var(--accent); }
15781578 .vsg-page .vsg-note-arrow { color: #5b6ee8; }
15791579 .vsg-page .vsg-cell-us.vsg-cell-yes .vsg-note { color: var(--text-strong); font-weight: 500; }
15801580 .vsg-page .vsg-cell-yes .vsg-note { color: var(--text); }
Modifiedsrc/routes/web.tsx+16−16View fileUnifiedSplit
@@ -1022,7 +1022,7 @@ const codeBrowseCss = `
10221022 padding: 1px 7px;
10231023 border-radius: 9999px;
10241024 background: rgba(52,211,153,0.16);
1025 color: #6ee7b7;
1025 color: var(--green);
10261026 box-shadow: inset 0 0 0 1px rgba(52,211,153,0.30);
10271027 text-transform: uppercase;
10281028 letter-spacing: 0.06em;
@@ -1087,7 +1087,7 @@ const codeBrowseCss = `
10871087 color: var(--text);
10881088 background: rgba(255,255,255,0.04);
10891089 }
1090 .commits-row-copy.is-copied { color: #6ee7b7; border-color: rgba(52,211,153,0.35); }
1090 .commits-row-copy.is-copied { color: var(--green); border-color: rgba(52,211,153,0.35); }
10911091 /* Push Watch link — eye icon next to the SHA chip */
10921092 .commits-row-watch {
10931093 display: inline-flex;
@@ -1252,8 +1252,8 @@ const codeBrowseCss = `
12521252 border: 1px solid var(--border);
12531253 font-variant-numeric: tabular-nums;
12541254 }
1255 .branches-row-divergence .ahead { color: #6ee7b7; }
1256 .branches-row-divergence .behind { color: #fca5a5; }
1255 .branches-row-divergence .ahead { color: var(--green); }
1256 .branches-row-divergence .behind { color: var(--red); }
12571257 .branches-row-actions {
12581258 display: flex;
12591259 align-items: center;
@@ -1282,7 +1282,7 @@ const codeBrowseCss = `
12821282 text-decoration: none;
12831283 }
12841284 .branches-btn-danger {
1285 color: #fca5a5;
1285 color: var(--red);
12861286 border-color: rgba(248,113,113,0.30);
12871287 }
12881288 .branches-btn-danger:hover {
@@ -1509,15 +1509,15 @@ const codeBrowseCss = `
15091509 font-variant-numeric: tabular-nums;
15101510 }
15111511 .commit-detail-stat strong { color: var(--text-strong); font-weight: 600; }
1512 .commit-detail-stat-add strong { color: #34d399; }
1513 .commit-detail-stat-del strong { color: #f87171; }
1512 .commit-detail-stat-add strong { color: var(--green); }
1513 .commit-detail-stat-del strong { color: var(--red); }
15141514 .commit-detail-stat-mark {
15151515 font-family: var(--font-mono);
15161516 font-weight: 700;
15171517 font-size: 14px;
15181518 }
1519 .commit-detail-stat-add .commit-detail-stat-mark { color: #34d399; }
1520 .commit-detail-stat-del .commit-detail-stat-mark { color: #f87171; }
1519 .commit-detail-stat-add .commit-detail-stat-mark { color: var(--green); }
1520 .commit-detail-stat-del .commit-detail-stat-mark { color: var(--red); }
15211521 .commit-detail-sha-full {
15221522 margin-left: auto;
15231523 font-family: var(--font-mono);
@@ -1543,8 +1543,8 @@ const codeBrowseCss = `
15431543 margin-bottom: 8px;
15441544 }
15451545 .commit-detail-checks-head strong { color: var(--text-strong); font-weight: 600; }
1546 .commit-detail-check-state-success { color: #34d399; font-weight: 600; }
1547 .commit-detail-check-state-failure { color: #f87171; font-weight: 600; }
1546 .commit-detail-check-state-success { color: var(--green); font-weight: 600; }
1547 .commit-detail-check-state-failure { color: var(--red); font-weight: 600; }
15481548 .commit-detail-check-state-pending { color: #d29922; font-weight: 600; }
15491549 .commit-detail-check-row { display: flex; flex-wrap: wrap; gap: 6px; }
15501550 .commit-detail-check {
@@ -3472,7 +3472,7 @@ web.get("/:owner/:repo", async (c) => {
34723472 .repo-health-badge:hover { filter: brightness(1.15); text-decoration: none; opacity: 0.9; }
34733473 .repo-health-badge-elite {
34743474 background: rgba(52,211,153,0.15);
3475 color: #6ee7b7;
3475 color: var(--green);
34763476 border-color: rgba(52,211,153,0.30);
34773477 }
34783478 .repo-health-badge-strong {
@@ -3487,7 +3487,7 @@ web.get("/:owner/:repo", async (c) => {
34873487 }
34883488 .repo-health-badge-needs-attention {
34893489 background: rgba(248,113,113,0.15);
3490 color: #fca5a5;
3490 color: var(--red);
34913491 border-color: rgba(248,113,113,0.30);
34923492 }
34933493
@@ -4346,7 +4346,7 @@ web.get("/:owner/:repo", async (c) => {
43464346 </h3>
43474347 <a
43484348 href={`/${owner}/${repo}/claude`}
4349 style="display:block;background:#1f6feb;color:#fff;text-align:center;padding:8px 14px;border-radius:6px;text-decoration:none;font-size:14px;font-weight:600;margin-bottom:8px"
4349 style="display:block;background:var(--accent);color:#fff;text-align:center;padding:8px 14px;border-radius:6px;text-decoration:none;font-size:14px;font-weight:600;margin-bottom:8px"
43504350 >
43514351 Claude Code sessions
43524352 </a>
@@ -6050,8 +6050,8 @@ web.get("/:owner/:repo/search", async (c) => {
60506050 white-space: nowrap;
60516051 flex-shrink: 0;
60526052 }
6053 .sem-conf-strong { background: rgba(52,211,153,0.12); color: #34d399; border: 1px solid rgba(52,211,153,0.30); }
6054 .sem-conf-possible { background: rgba(91,110,232,0.12); color: #5b6ee8; border: 1px solid rgba(91,110,232,0.30); }
6053 .sem-conf-strong { background: rgba(52,211,153,0.12); color: var(--green); border: 1px solid rgba(52,211,153,0.30); }
6054 .sem-conf-possible { background: rgba(91,110,232,0.12); color: var(--accent); border: 1px solid rgba(91,110,232,0.30); }
60556055 .sem-conf-weak { background: rgba(255,255,255,0.04); color: var(--text-muted); border: 1px solid var(--border); }
60566056 .sem-result-reason {
60576057 font-size: 12.5px;
Modifiedsrc/routes/wikis.tsx+1−1View fileUnifiedSplit
@@ -140,7 +140,7 @@ const wikiStyles = `
140140 }
141141 .wiki-btn-danger {
142142 background: transparent;
143 color: #fca5a5;
143 color: var(--red);
144144 border-color: rgba(248,113,113,0.35);
145145 }
146146 .wiki-btn-danger:hover {
Modifiedsrc/views/components.tsx+356−0View fileUnifiedSplit
@@ -1011,3 +1011,359 @@ export const settingsNavStyles = `
10111011 }
10121012 }
10131013`;
1014
1015/* ============================================================
1016 * Shared primitives — PageHeader / Card / Badge / Button
1017 * Additive, gx-namespaced (no collision with the legacy global
1018 * .btn/.card/.badge in layout.tsx). Every page that uses these
1019 * should include `sharedComponentStyles` once in a <style> block
1020 * (idempotent — duplicate identical <style> rules are harmless,
1021 * same contract as settingsNavStyles).
1022 * ============================================================ */
1023
1024/**
1025 * PageHeader — eyebrow + title + lede with an optional right-aligned
1026 * actions slot. One type scale; wraps cleanly on narrow viewports.
1027 */
1028export const PageHeader: FC<{
1029 title: string;
1030 eyebrow?: string;
1031 lede?: string;
1032 /** Right-aligned action slot — typically one or more <Button>. */
1033 actions?: any;
1034}> = ({ title, eyebrow, lede, actions }) => (
1035 <header class="gx-pagehead">
1036 <div class="gx-pagehead__lead">
1037 {eyebrow ? <span class="gx-pagehead__eyebrow">{eyebrow}</span> : null}
1038 <h1 class="gx-pagehead__title">{title}</h1>
1039 {lede ? <p class="gx-pagehead__lede">{lede}</p> : null}
1040 </div>
1041 {actions ? <div class="gx-pagehead__actions">{actions}</div> : null}
1042 </header>
1043);
1044
1045/**
1046 * Card — bordered surface. `padding` controls internal spacing,
1047 * `elevated` adds a soft shadow, `as` swaps the tag (e.g. "section").
1048 * Extra `class` values are appended so callers can add layout classes.
1049 */
1050export const Card: FC<{
1051 padding?: "none" | "sm" | "md" | "lg";
1052 elevated?: boolean;
1053 interactive?: boolean;
1054 as?: string;
1055 class?: string;
1056 children?: any;
1057}> = ({ padding = "md", elevated, interactive, as = "div", class: className, children }) => {
1058 const Tag = as as any;
1059 return (
1060 <Tag
1061 class={`gx-card${className ? " " + className : ""}`}
1062 data-pad={padding}
1063 data-elevated={elevated ? "" : undefined}
1064 data-interactive={interactive ? "" : undefined}
1065 >
1066 {children}
1067 </Tag>
1068 );
1069};
1070
1071export type BadgeVariant = "neutral" | "success" | "warn" | "danger" | "info";
1072
1073/**
1074 * Badge — small status pill. Variants map to the semantic tokens:
1075 * success→--green, warn→--yellow, danger→--red, info→--accent,
1076 * neutral→muted. `dot` prepends a filled status dot.
1077 */
1078export const Badge: FC<{
1079 variant?: BadgeVariant;
1080 dot?: boolean;
1081 children?: any;
1082}> = ({ variant = "neutral", dot, children }) => (
1083 <span class="gx-badge" data-variant={variant}>
1084 {dot ? <span class="gx-badge__dot" aria-hidden="true" /> : null}
1085 {children}
1086 </span>
1087);
1088
1089export type ButtonVariant = "primary" | "secondary" | "ghost";
1090export type ButtonSize = "sm" | "md" | "lg";
1091
1092/**
1093 * Button — renders an <a> when `href` is set, otherwise a <button>.
1094 * Variants: primary / secondary / ghost. Sizes: sm / md / lg.
1095 * Any extra props (name, value, onClick, data-*, form…) pass through.
1096 */
1097export const Button: FC<{
1098 variant?: ButtonVariant;
1099 size?: ButtonSize;
1100 href?: string;
1101 type?: "button" | "submit" | "reset";
1102 disabled?: boolean;
1103 block?: boolean;
1104 class?: string;
1105 children?: any;
1106 [key: string]: any;
1107}> = ({
1108 variant = "secondary",
1109 size = "md",
1110 href,
1111 type,
1112 disabled,
1113 block,
1114 class: className,
1115 children,
1116 ...rest
1117}) => {
1118 const cls = `gx-btn${block ? " gx-btn--block" : ""}${className ? " " + className : ""}`;
1119 if (href) {
1120 return (
1121 <a
1122 href={disabled ? undefined : href}
1123 class={cls}
1124 data-variant={variant}
1125 data-size={size}
1126 role="button"
1127 aria-disabled={disabled ? "true" : undefined}
1128 {...rest}
1129 >
1130 {children}
1131 </a>
1132 );
1133 }
1134 return (
1135 <button
1136 type={type || "button"}
1137 class={cls}
1138 data-variant={variant}
1139 data-size={size}
1140 disabled={disabled}
1141 {...rest}
1142 >
1143 {children}
1144 </button>
1145 );
1146};
1147
1148/**
1149 * Scoped styles for the shared primitives above. Include once per page
1150 * (idempotent). Pure token consumption — theme-aware for light + dark
1151 * via the token flip in layout.tsx; no hardcoded hex.
1152 */
1153export const sharedComponentStyles = `
1154 /* ---- PageHeader ------------------------------------------------ */
1155 .gx-pagehead {
1156 display: flex;
1157 align-items: flex-end;
1158 justify-content: space-between;
1159 gap: var(--space-6);
1160 flex-wrap: wrap;
1161 margin-bottom: var(--space-8);
1162 padding-bottom: var(--space-5);
1163 border-bottom: 1px solid var(--border);
1164 }
1165 .gx-pagehead__lead { min-width: 0; }
1166 .gx-pagehead__eyebrow {
1167 display: inline-flex;
1168 align-items: center;
1169 gap: 8px;
1170 font-family: var(--font-mono);
1171 font-size: var(--t-xs);
1172 font-weight: 500;
1173 letter-spacing: 0.14em;
1174 text-transform: uppercase;
1175 color: var(--accent);
1176 margin-bottom: var(--space-2);
1177 }
1178 .gx-pagehead__eyebrow::before {
1179 content: '';
1180 width: 18px;
1181 height: 1px;
1182 background: currentColor;
1183 opacity: 0.6;
1184 }
1185 .gx-pagehead__title {
1186 font-family: var(--font-display);
1187 font-size: clamp(var(--t-xl), 4vw, var(--t-2xl));
1188 line-height: var(--leading-tight);
1189 letter-spacing: -0.028em;
1190 color: var(--text-strong);
1191 margin: 0;
1192 }
1193 .gx-pagehead__lede {
1194 margin-top: var(--space-3);
1195 max-width: 60ch;
1196 font-size: var(--t-md);
1197 line-height: var(--leading-relaxed);
1198 color: var(--text-muted);
1199 }
1200 .gx-pagehead__actions {
1201 display: flex;
1202 align-items: center;
1203 gap: var(--space-2);
1204 flex-shrink: 0;
1205 }
1206 (max-width: 640px) {
1207 .gx-pagehead { align-items: flex-start; }
1208 .gx-pagehead__actions { width: 100%; }
1209 }
1210
1211 /* ---- Card ------------------------------------------------------ */
1212 .gx-card {
1213 background: var(--bg-elevated);
1214 border: 1px solid var(--border);
1215 border-radius: var(--radius-md);
1216 box-shadow: var(--elev-0);
1217 }
1218 .gx-card[data-pad="none"] { padding: 0; }
1219 .gx-card[data-pad="sm"] { padding: var(--space-3); }
1220 .gx-card[data-pad="md"] { padding: var(--space-5); }
1221 .gx-card[data-pad="lg"] { padding: var(--space-6); }
1222 .gx-card[data-elevated] { box-shadow: var(--elev-2); }
1223 .gx-card[data-interactive] {
1224 transition:
1225 border-color var(--dur-base) var(--ease),
1226 transform var(--dur-base) var(--ease-out-quart),
1227 box-shadow var(--dur-base) var(--ease);
1228 }
1229 .gx-card[data-interactive]:hover {
1230 border-color: var(--border-strong);
1231 box-shadow: var(--elev-2);
1232 transform: translateY(-2px);
1233 }
1234
1235 /* ---- Badge ----------------------------------------------------- */
1236 .gx-badge {
1237 display: inline-flex;
1238 align-items: center;
1239 gap: 5px;
1240 padding: 2px 9px;
1241 border-radius: var(--radius-full);
1242 font-size: var(--t-xs);
1243 font-weight: 500;
1244 line-height: 1.5;
1245 letter-spacing: 0.005em;
1246 border: 1px solid var(--border);
1247 background: var(--bg-tertiary);
1248 color: var(--text-muted);
1249 white-space: nowrap;
1250 }
1251 .gx-badge__dot {
1252 width: 6px;
1253 height: 6px;
1254 border-radius: var(--radius-full);
1255 background: currentColor;
1256 flex-shrink: 0;
1257 }
1258 .gx-badge[data-variant="success"] {
1259 color: var(--green);
1260 background: color-mix(in srgb, var(--green) 12%, transparent);
1261 border-color: color-mix(in srgb, var(--green) 30%, transparent);
1262 }
1263 .gx-badge[data-variant="warn"] {
1264 color: var(--yellow);
1265 background: color-mix(in srgb, var(--yellow) 12%, transparent);
1266 border-color: color-mix(in srgb, var(--yellow) 30%, transparent);
1267 }
1268 .gx-badge[data-variant="danger"] {
1269 color: var(--red);
1270 background: color-mix(in srgb, var(--red) 12%, transparent);
1271 border-color: color-mix(in srgb, var(--red) 30%, transparent);
1272 }
1273 .gx-badge[data-variant="info"] {
1274 color: var(--accent);
1275 background: color-mix(in srgb, var(--accent) 12%, transparent);
1276 border-color: color-mix(in srgb, var(--accent) 30%, transparent);
1277 }
1278 /* neutral is the base rule above — no override needed. */
1279
1280 /* ---- Button ---------------------------------------------------- */
1281 .gx-btn {
1282 display: inline-flex;
1283 align-items: center;
1284 justify-content: center;
1285 gap: 7px;
1286 font-family: var(--font-sans);
1287 font-weight: 500;
1288 line-height: 1.25;
1289 letter-spacing: -0.008em;
1290 border: 1px solid var(--border);
1291 border-radius: var(--radius-sm);
1292 background: var(--bg-elevated);
1293 color: var(--text);
1294 cursor: pointer;
1295 text-decoration: none;
1296 white-space: nowrap;
1297 user-select: none;
1298 transition:
1299 background 180ms ease,
1300 border-color 180ms ease,
1301 transform 180ms ease,
1302 box-shadow 180ms ease,
1303 color 180ms ease;
1304 }
1305 .gx-btn:hover { text-decoration: none; transform: translateY(-1px); }
1306 .gx-btn:active { transform: translateY(0); transition-duration: 80ms; }
1307 .gx-btn:focus-visible { outline: none; box-shadow: var(--ring); }
1308 .gx-btn[aria-disabled="true"],
1309 .gx-btn:disabled {
1310 opacity: 0.5;
1311 cursor: not-allowed;
1312 pointer-events: none;
1313 transform: none;
1314 }
1315 .gx-btn--block { width: 100%; }
1316
1317 /* sizes */
1318 .gx-btn[data-size="sm"] { padding: 4px 10px; font-size: var(--t-xs); gap: 5px; border-radius: var(--radius-sm); }
1319 .gx-btn[data-size="md"] { padding: 7px 14px; font-size: var(--t-sm); }
1320 .gx-btn[data-size="lg"] { padding: 11px 22px; font-size: var(--t-base); border-radius: var(--r); }
1321
1322 /* variant: primary — accent fill (dark), ink fill (light per platform language) */
1323 .gx-btn[data-variant="primary"] {
1324 background: var(--accent);
1325 border-color: transparent;
1326 color: white;
1327 font-weight: 600;
1328 box-shadow: var(--elev-1);
1329 }
1330 .gx-btn[data-variant="primary"]:hover {
1331 background: var(--accent-hover);
1332 color: white;
1333 box-shadow: var(--elev-2);
1334 }
1335 .gx-btn[data-variant="primary"]:active { background: var(--accent-pressed); }
1336 :root[data-theme='light'] .gx-btn[data-variant="primary"] {
1337 background: var(--text-strong);
1338 color: var(--bg-secondary);
1339 }
1340 :root[data-theme='light'] .gx-btn[data-variant="primary"]:hover {
1341 background: var(--text);
1342 color: var(--bg-secondary);
1343 }
1344
1345 /* variant: secondary — quiet elevated surface with stronger border */
1346 .gx-btn[data-variant="secondary"] {
1347 background: var(--bg-elevated);
1348 border-color: var(--border-strong);
1349 color: var(--text-strong);
1350 }
1351 .gx-btn[data-variant="secondary"]:hover {
1352 background: var(--bg-surface);
1353 border-color: var(--border-strong);
1354 box-shadow: var(--elev-1);
1355 }
1356
1357 /* variant: ghost — no chrome until hover */
1358 .gx-btn[data-variant="ghost"] {
1359 background: transparent;
1360 border-color: transparent;
1361 color: var(--text-muted);
1362 box-shadow: none;
1363 }
1364 .gx-btn[data-variant="ghost"]:hover {
1365 background: var(--bg-hover);
1366 color: var(--text-strong);
1367 border-color: var(--border);
1368 }
1369`;
Modifiedsrc/views/layout.tsx+55−102View fileUnifiedSplit
@@ -1165,7 +1165,7 @@ const css = `
11651165 --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
11661166 --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
11671167 --t-fast: 120ms;
1168 --t-base: 200ms;
1168 --dur-base: 200ms;
11691169 --t-slow: 360ms;
11701170 --t-slower:560ms;
11711171
@@ -1281,24 +1281,29 @@ const css = `
12811281 -moz-osx-font-smoothing: grayscale;
12821282 font-synthesis: none;
12831283 }
1284 /* Tighten heading rhythm — the body is 15/1.55, headings step down
1285 line-height inversely with size so display text doesn't feel airy. */
1284 /* Heading scale — confident, editorial, tight tracking. Single
1285 source of truth (token-based); the older hardcoded-px block that
1286 preceded this was fully overridden (dead) and has been folded in
1287 here, carrying over only its unique margin-top: 0. */
12861288 h1, h2, h3, h4, h5, h6 {
12871289 font-family: var(--font-display);
1288 color: var(--text-strong);
1290 font-weight: 600;
12891291 letter-spacing: -0.022em;
12901292 line-height: 1.18;
1291 font-weight: 650;
1293 color: var(--text-strong);
12921294 margin-top: 0;
12931295 }
1294 h1 { font-size: 28px; letter-spacing: -0.028em; }
1295 h2 { font-size: 22px; }
1296 h3 { font-size: 18px; letter-spacing: -0.018em; }
1297 h4 { font-size: 15.5px; letter-spacing: -0.012em; font-weight: 600; }
1298 /* Link refinement — underline only on hover/focus, never by default
1299 on internal nav. Prevents the "blue underline soup" look. */
1296 h1 { font-size: var(--t-xl); letter-spacing: -0.028em; }
1297 h2 { font-size: var(--t-lg); letter-spacing: -0.022em; }
1298 h3 { font-size: var(--t-md); font-weight: 600; letter-spacing: -0.015em; }
1299 h4 { font-size: var(--t-base); font-weight: 600; letter-spacing: -0.01em; }
1300 h5, h6 { font-size: var(--t-sm); font-weight: 600; letter-spacing: -0.005em; }
1301
1302 /* Link refinement — single collapsed rule. The earlier duplicate
1303 a{}/a:hover (underline on hover) was overridden by the later
1304 a:hover (no underline), which wins and is kept here. */
13001305 a { color: var(--text-link); text-decoration: none; transition: color var(--t-fast) var(--ease); }
1301 a:hover { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 3px; }
1306 a:hover { color: var(--accent-hover); text-decoration: none; }
13021307 a:focus-visible {
13031308 outline: none;
13041309 box-shadow: 0 0 0 3px rgba(91,110,232,0.32);
@@ -1308,23 +1313,6 @@ const css = `
13081313 /* No full-page atmosphere overlay — clean backgrounds signal trustworthy
13091314 infrastructure. Effects live on pages that earn them (landing hero only). */
13101315
1311 a { color: var(--text-link); text-decoration: none; transition: color var(--t-fast) var(--ease); }
1312 a:hover { color: var(--accent-hover); text-decoration: none; }
1313
1314 /* Heading scale — confident, editorial, tight tracking */
1315 h1, h2, h3, h4, h5, h6 {
1316 font-family: var(--font-display);
1317 font-weight: 600;
1318 letter-spacing: -0.022em;
1319 line-height: 1.18;
1320 color: var(--text-strong);
1321 }
1322 h1 { font-size: var(--t-xl); letter-spacing: -0.028em; }
1323 h2 { font-size: var(--t-lg); letter-spacing: -0.022em; }
1324 h3 { font-size: var(--t-md); font-weight: 600; letter-spacing: -0.015em; }
1325 h4 { font-size: var(--t-base); font-weight: 600; letter-spacing: -0.01em; }
1326 h5, h6 { font-size: var(--t-sm); font-weight: 600; letter-spacing: -0.005em; }
1327
13281316 /* Editorial display heading utility — used by landing + marketing pages */
13291317 .display {
13301318 font-family: var(--font-display);
@@ -1518,7 +1506,7 @@ const css = `
15181506 background: var(--accent);
15191507 box-shadow: none;
15201508 flex-shrink: 0;
1521 transition: box-shadow var(--t-base) var(--ease);
1509 transition: box-shadow var(--dur-base) var(--ease);
15221510 }
15231511 .logo:hover { text-decoration: none; color: var(--text-strong); }
15241512 .logo:hover::before {
@@ -2035,16 +2023,14 @@ const css = `
20352023 }
20362024
20372025 .btn-primary {
2038 background: var(--accent-gradient);
2026 background: var(--accent);
20392027 border-color: transparent;
20402028 color: #fff;
20412029 font-weight: 600;
20422030 text-shadow: 0 1px 0 rgba(0,0,0,0.15);
20432031 box-shadow:
2044 inset 0 1px 0 rgba(255,255,255,0.22),
2045 inset 0 -1px 0 rgba(0,0,0,0.10),
2046 0 1px 2px rgba(0,0,0,0.40),
2047 0 0 0 1px rgba(91,110,232,0.30);
2032 inset 0 1px 0 rgba(255,255,255,0.12),
2033 0 1px 2px rgba(0,0,0,0.25);
20482034 transition:
20492035 background 180ms ease,
20502036 transform 180ms ease,
@@ -2056,11 +2042,10 @@ const css = `
20562042 background: var(--accent-hover);
20572043 border-color: transparent;
20582044 transform: translateY(-1px);
2045 filter: none;
20592046 box-shadow:
2060 inset 0 1px 0 rgba(255,255,255,0.30),
2061 inset 0 -1px 0 rgba(0,0,0,0.10),
2062 0 6px 18px -6px rgba(0,0,0,0.45),
2063 0 0 0 1px rgba(91,110,232,0.40);
2047 inset 0 1px 0 rgba(255,255,255,0.15),
2048 0 4px 12px rgba(0,0,0,0.25);
20642049 }
20652050 .btn-primary:active { transform: translateY(0); transition-duration: 80ms; }
20662051 /* U2 — primary focus ring uses the same accent box-shadow recipe. */
@@ -2215,19 +2200,17 @@ const css = `
22152200 /* Auth (register / login / verify) */
22162201 /* ============================================================ */
22172202 .auth-container {
2218 /* 2026 polish — wider, more generous, with a subtle accent-glow
2219 border and gradient top-edge so it reads as a premium product
2220 gateway, not a stock form. The 480px width feels intentional
2221 (not cramped, not endless). */
2203 /* Collapsed to one rule — the later plainer .auth-container (in the
2204 2026 polish layer) won on background/padding/border-radius/box-shadow,
2205 so those values are folded in here; the 480px width + centering +
2206 positioning survive from the original premium-gateway block. */
22222207 max-width: 480px;
22232208 margin: 72px auto;
2224 padding: 40px 40px 36px;
2225 background: var(--bg-elevated);
2209 padding: 32px;
2210 background: var(--bg-secondary);
22262211 border: 1px solid var(--border);
2227 border-radius: 16px;
2228 box-shadow:
2229 var(--elev-2),
2230 0 24px 64px -16px rgba(0, 0, 0, 0.30);
2212 border-radius: var(--r-lg);
2213 box-shadow: 0 4px 16px rgba(0,0,0,0.30), 0 0 0 1px var(--border);
22312214 position: relative;
22322215 overflow: hidden;
22332216 }
@@ -2280,8 +2263,8 @@ const css = `
22802263 font-weight: 500;
22812264 text-decoration: none;
22822265 transition:
2283 transform var(--t-base, 180ms) var(--ease, ease),
2284 box-shadow var(--t-base, 180ms) var(--ease, ease),
2266 transform var(--dur-base, 180ms) var(--ease, ease),
2267 box-shadow var(--dur-base, 180ms) var(--ease, ease),
22852268 background var(--t-fast, 120ms) var(--ease, ease),
22862269 border-color var(--t-fast, 120ms) var(--ease, ease);
22872270 }
@@ -2917,9 +2900,9 @@ const css = `
29172900 text-align: center;
29182901 padding: 80px 24px;
29192902 color: var(--text-muted);
2920 border: 1px solid var(--border);
2903 border: 1px dashed var(--border);
29212904 border-radius: var(--r-lg);
2922 background: var(--bg-elevated);
2905 background: var(--bg);
29232906 }
29242907 .empty-state h2 {
29252908 font-size: var(--t-xl);
@@ -3025,17 +3008,17 @@ const css = `
30253008 padding: 20px;
30263009 background: var(--bg-elevated);
30273010 transition:
3028 border-color var(--t-base) var(--ease),
3029 transform var(--t-base) var(--ease-out-quart),
3030 box-shadow var(--t-base) var(--ease);
3011 border-color 160ms cubic-bezier(0.16,1,0.3,1),
3012 transform 160ms cubic-bezier(0.16,1,0.3,1),
3013 box-shadow 200ms cubic-bezier(0.16,1,0.3,1);
30313014 position: relative;
30323015 overflow: hidden;
30333016 isolation: isolate;
30343017 }
30353018 .card:hover {
3036 border-color: var(--border-strong);
3037 box-shadow: var(--elev-2);
3038 transform: translateY(-2px);
3019 border-color: rgba(255,255,255,0.18);
3020 transform: translateY(-1px);
3021 box-shadow: 0 8px 24px rgba(0,0,0,0.30);
30393022 }
30403023 .card h3 { font-size: var(--t-md); margin-bottom: 6px; letter-spacing: -0.012em; }
30413024 .card h3 a { color: var(--text); font-weight: 600; }
@@ -3350,7 +3333,7 @@ const css = `
33503333 background: var(--bg-tertiary);
33513334 border: 1px solid var(--border);
33523335 border-radius: var(--r-full);
3353 transition: all var(--t-base) var(--ease);
3336 transition: all var(--dur-base) var(--ease);
33543337 }
33553338 .toggle-slider::before {
33563339 content: '';
@@ -3361,7 +3344,7 @@ const css = `
33613344 bottom: 2px;
33623345 background: var(--text-muted);
33633346 border-radius: var(--r-full);
3364 transition: all var(--t-base) var(--ease);
3347 transition: all var(--dur-base) var(--ease);
33653348 }
33663349 .toggle-switch input:checked + .toggle-slider {
33673350 background: var(--accent);
@@ -3402,20 +3385,8 @@ const css = `
34023385 outline: none;
34033386 box-shadow: var(--ring);
34043387 }
3405 .btn-primary {
3406 background: var(--accent);
3407 border-color: transparent;
3408 box-shadow:
3409 inset 0 1px 0 rgba(255,255,255,0.12),
3410 0 1px 2px rgba(0,0,0,0.25);
3411 }
3412 .btn-primary:hover {
3413 background: var(--accent-hover);
3414 filter: none;
3415 box-shadow:
3416 inset 0 1px 0 rgba(255,255,255,0.15),
3417 0 4px 12px rgba(0,0,0,0.25);
3418 }
3388 /* .btn-primary + .btn-primary:hover collapsed into the canonical rules
3389 earlier in the sheet; the dead duplicates that lived here were removed. */
34193390
34203391 /* Inputs: cleaner focus ring + hover */
34213392 .form-group input:hover,
@@ -3435,18 +3406,9 @@ const css = `
34353406 border-color: rgba(0,0,0,0.18);
34363407 }
34373408
3438 /* Cards: subtle hover lift */
3439 .card {
3440 transition:
3441 border-color 160ms cubic-bezier(0.16,1,0.3,1),
3442 transform 160ms cubic-bezier(0.16,1,0.3,1),
3443 box-shadow 200ms cubic-bezier(0.16,1,0.3,1);
3444 }
3445 .card:hover {
3446 border-color: rgba(255,255,255,0.18);
3447 transform: translateY(-1px);
3448 box-shadow: 0 8px 24px rgba(0,0,0,0.30);
3449 }
3409 /* Cards: subtle hover lift. The unscoped .card + .card:hover that
3410 lived here were collapsed into the canonical .card rules earlier in
3411 the sheet; only the light-theme hover override remains. */
34503412 :root[data-theme='light'] .card:hover {
34513413 border-color: rgba(0,0,0,0.18);
34523414 box-shadow: 0 8px 24px rgba(0,0,0,0.08);
@@ -3464,25 +3426,16 @@ const css = `
34643426 transition: color 120ms cubic-bezier(0.16,1,0.3,1);
34653427 }
34663428
3467 /* Auth card: subtle elevation so register/login feel premium */
3468 .auth-container {
3469 background: var(--bg-secondary);
3470 border: 1px solid var(--border);
3471 border-radius: var(--r-lg, 12px);
3472 padding: 32px;
3473 box-shadow: 0 4px 16px rgba(0,0,0,0.30), 0 0 0 1px var(--border);
3474 }
3429 /* Auth card: the unscoped .auth-container (and its redundant h2
3430 letter-spacing, byte-identical to the canonical h2 rule) were
3431 collapsed into the canonical rules earlier; only the light-theme
3432 shadow override remains. */
34753433 :root[data-theme='light'] .auth-container {
34763434 box-shadow: 0 4px 16px rgba(0,0,0,0.06), 0 0 0 1px var(--border);
34773435 }
3478 .auth-container h2 { letter-spacing: -0.025em; }
34793436
3480 /* Empty state: dashed border, generous padding */
3481 .empty-state {
3482 border: 1px dashed var(--border);
3483 border-radius: var(--r-lg, 12px);
3484 background: var(--bg);
3485 }
3437 /* Empty state: dashed border + var(--bg) background collapsed into the
3438 canonical .empty-state rule earlier; the dead duplicate was removed. */
34863439
34873440 /* Badges + commit-sha: smoother transition */
34883441 .commit-sha, .badge { transition: all 120ms cubic-bezier(0.16,1,0.3,1); }
34893442