fix: some small css fixes

web/src/app.d.ts

@@ -10,4 +10,9 @@ declare global {
 	}
 }
 
+declare module '*.css?raw' {
+	const content: string;
+	export default content;
+}
+
 export {};

web/src/lib/components/DropOverlay.svelte

@@ -89,7 +89,7 @@
 		background: color-mix(in srgb, var(--accent) 10%, var(--surface));
 		border: 2px dashed var(--accent);
 		border-radius: var(--radius-m);
-		color: var(--accent);
+		color: var(--link);
 		font-weight: 600;
 		text-align: center;
 		pointer-events: none;

web/src/lib/components/DropZone.svelte

@@ -105,7 +105,7 @@
 	.dropzone:hover,
 	.dropzone:focus-visible,
 	.dragging {
-		border-color: var(--accent);
+		border-color: var(--link);
 		background: color-mix(in srgb, var(--accent) 6%, var(--surface));
 	}
 

web/src/lib/components/chain/ChainToolBlock.svelte

@@ -133,7 +133,7 @@
 		height: 1.4rem;
 		border-radius: var(--radius-s);
 		background: color-mix(in srgb, var(--accent) 10%, var(--surface));
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	.remove {
@@ -173,7 +173,7 @@
 		padding: 2px var(--space-2);
 		border-radius: var(--radius-s);
 		background: color-mix(in srgb, var(--accent) 12%, var(--surface));
-		color: var(--accent);
+		color: var(--link);
 		font-size: var(--text-xs);
 	}
 </style>

web/src/lib/components/search/ToolCard.svelte

@@ -89,7 +89,7 @@
 		justify-content: center;
 		border-radius: var(--radius-s);
 		background: color-mix(in srgb, var(--accent) 10%, var(--surface));
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	.text {

web/src/lib/components/search/ToolSearch.svelte

@@ -130,7 +130,7 @@
 	}
 
 	input:focus {
-		border-color: var(--accent);
+		border-color: var(--link);
 		outline: none;
 	}
 

web/src/lib/components/tool/ResultCard.svelte

@@ -117,7 +117,7 @@
 		padding: 2px var(--space-2);
 		border-radius: var(--radius-s);
 		background: color-mix(in srgb, var(--accent) 12%, var(--surface));
-		color: var(--accent);
+		color: var(--link);
 		font-size: var(--text-xs);
 	}
 </style>

web/src/lib/components/tool/TextResult.svelte

@@ -89,7 +89,7 @@
 	}
 
 	.actions .secondary:hover {
-		border-color: var(--accent);
+		border-color: var(--link);
-		color: var(--accent);
+		color: var(--link);
 	}
 </style>

web/src/lib/components/ui/Button.svelte

@@ -68,8 +68,8 @@
 	}
 
 	button.secondary:hover:not(:disabled) {
-		border-color: var(--accent);
+		border-color: var(--link);
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	button:disabled {

web/src/lib/components/ui/ColorField.svelte

@@ -69,13 +69,13 @@
 	}
 
 	.pipette:hover {
-		border-color: var(--accent);
+		border-color: var(--link);
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	.pipette[aria-pressed='true'] {
-		border-color: var(--accent);
+		border-color: var(--link);
-		color: var(--accent);
+		color: var(--link);
 		background: color-mix(in srgb, var(--accent) 10%, var(--surface));
 	}
 </style>

web/src/lib/components/ui/SliderField.svelte

@@ -71,7 +71,7 @@
 	input[type='range'] {
 		flex: 1;
 		min-width: 3rem;
-		accent-color: var(--accent);
+		accent-color: var(--link);
 		margin: 0;
 	}
 
@@ -96,8 +96,8 @@
 	}
 
 	.step:hover:not(:disabled) {
-		border-color: var(--accent);
+		border-color: var(--link);
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	.step:disabled {

web/src/lib/palette.test.ts

@@ -1,6 +1,10 @@
-import { readFileSync } from 'node:fs';
-import { join } from 'node:path';
 import { describe, expect, it } from 'vitest';
+// @ts-expect-error node types are not wired into svelte-check; vitest resolves fine
+import { readFileSync } from 'node:fs';
+
+declare const process: { cwd(): string };
+
+const css = readFileSync('src/app.css', 'utf8');
 
 type Tokens = Record<string, string>;
 
@@ -48,7 +52,7 @@ function mix(fgHex: string, alpha: number, bgHex: string): string {
 	return `#${out.map((v) => v.toString(16).padStart(2, '0')).join('')}`;
 }
 
-const css = readFileSync(join(__dirname, '..', 'app.css'), 'utf8');
+const cssText = css;
 const light = parseBlock(css, ':root');
 const darkRaw = parseBlock(css, "[data-theme='dark']");
 const dark: Tokens = { ...light, ...darkRaw };

web/src/routes/+layout.svelte

@@ -103,7 +103,7 @@
 
 	.brand:hover {
 		text-decoration: none;
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	nav {
@@ -120,7 +120,7 @@
 	}
 
 	.nav-link:hover {
-		color: var(--accent);
+		color: var(--link);
 		background: var(--bg);
 		text-decoration: none;
 	}
@@ -148,7 +148,7 @@
 	}
 
 	.lang-btn:hover {
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	.lang-btn.active {
@@ -158,7 +158,7 @@
 
 	.workspace-link {
 		font-weight: 600;
-		color: var(--accent);
+		color: var(--link);
 	}
 
 	main {

web/src/routes/+page.svelte

@@ -102,6 +102,6 @@
 	}
 
 	.back:hover {
-		color: var(--accent);
+		color: var(--link);
 	}
 </style>