diff --git a/artifacts/toolrate/src/index.css b/artifacts/toolrate/src/index.css index 49699cb..e4e1720 100644 --- a/artifacts/toolrate/src/index.css +++ b/artifacts/toolrate/src/index.css @@ -99,7 +99,7 @@ --popover-foreground: 222 47% 11%; --popover-border: 214 32% 91%; - --primary: 14 100% 57%; /* Sharp Builder Orange */ + --primary: 262 83% 58%; /* Violet accent */ --primary-foreground: 0 0% 100%; --secondary: 210 40% 96%; @@ -115,17 +115,17 @@ --destructive-foreground: 0 0% 100%; --input: 214 32% 91%; - --ring: 14 100% 57%; + --ring: 262 83% 58%; - --chart-1: 14 100% 57%; + --chart-1: 262 83% 58%; --chart-2: 222 47% 11%; - --chart-3: 187 100% 42%; + --chart-3: 264 80% 70%; --chart-4: 43 100% 50%; --chart-5: 280 80% 50%; - --glow-1: 187 100% 50%; /* cyan */ - --glow-2: 265 100% 68%; /* violet */ - --glow-3: 14 100% 57%; /* orange (primary) */ + --glow-1: 262 88% 62%; /* violet (accent) */ + --glow-2: 285 92% 72%; /* magenta/violet */ + --glow-3: 214 92% 62%; /* lavender-blue */ --app-font-sans: 'Inter', sans-serif; --app-font-serif: Georgia, serif; @@ -227,6 +227,10 @@ --chart-4: 43 100% 50%; --chart-5: 280 80% 50%; + --glow-1: 187 100% 50%; /* cyan */ + --glow-2: 265 100% 68%; /* violet */ + --glow-3: 14 100% 57%; /* orange (primary) */ + --shadow-2xs: 0px 1px 2px 0px rgba(0,0,0,0.5); --shadow-xs: 0px 1px 3px 0px rgba(0,0,0,0.5); --shadow-sm: 0px 2px 4px 0px rgba(0,0,0,0.5), 0px 1px 2px -1px rgba(0,0,0,0.5); @@ -496,4 +500,43 @@ .neon-pulse { animation: none; } .neon-spin { animation: none; } } +} + +/* ------------------------------------------------------------------ */ +/* LIGHT MODE — violet neon tuning + * Binds glow highlights so they read clearly on white/light surfaces + * instead of washing out to grey. Scoped to light only; dark untouched. + * ------------------------------------------------------------------ */ +:root:not(.dark) .neon-glow { + box-shadow: + 0 0 0 1px hsl(var(--glow-1) / 0.5), + 0 0 22px -3px hsl(var(--glow-1) / 0.55), + 0 0 52px -10px hsl(var(--glow-2) / 0.4); +} + +:root:not(.dark) .neon-glow-primary { + box-shadow: + 0 0 0 1px hsl(var(--primary) / 0.55), + 0 0 20px -2px hsl(var(--primary) / 0.5), + 0 0 44px -10px hsl(var(--primary) / 0.4); +} + +:root:not(.dark) .neon-bar { + box-shadow: + 0 0 10px 0 hsl(var(--glow-1) / 0.55), + 0 0 22px -2px hsl(var(--glow-2) / 0.5); +} + +/* Pastel ambient wash behind the light page */ +:root:not(.dark) body { + background-image: + radial-gradient(1200px 800px at 8% -6%, hsl(var(--glow-1) / 0.09), transparent 60%), + radial-gradient(1100px 700px at 100% 0%, hsl(var(--glow-2) / 0.08), transparent 55%), + radial-gradient(1000px 800px at 50% 110%, hsl(var(--glow-3) / 0.06), transparent 60%); + background-attachment: fixed; +} + +/* Cards get a subtle violet-tinted border for more surface depth */ +:root:not(.dark) .bg-card { + border-color: hsl(var(--glow-1) / 0.18); } \ No newline at end of file