From 5a13f2516cd560f681307edbab1e2c70f087b25e Mon Sep 17 00:00:00 2001
From: NeilClack <cnclack@pm.me>
Date: Tue, 7 Jul 2026 09:50:57 -0500
Subject: [PATCH] style: strip to grayscale wireframe

- Remap all non-gray colors (blue, green, red, purple, slate) to gray
  equivalents via Tailwind v4 @theme overrides in layout.css
- Zero out all border-radius values (square everything)
- Zero out all shadow values (no depth)
- Disable all transitions and animations globally
- Change theme-color meta tag from purple (#7B2D8E) to gray (#6b7280)
- Clean up undefined 'underlined' class and typo bg-grey-200
---
 src/routes/+error.svelte      |  9 ++--
 src/routes/+layout.svelte     |  2 +-
 src/routes/layout.css         | 85 +++++++++++++++++++++++++++++++++++
 src/routes/login/+page.svelte |  2 +-
 4 files changed, 90 insertions(+), 8 deletions(-)

diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index f58b511..d8fbc10 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -6,11 +6,8 @@
 <Window>
 	{#if $page.status === 403}
 		<h1>Not Authorized</h1>
-		<p>
-			You don't have permission to view this page. Click <a
-				href="/"
-				class="underlined text-blue-600">here</a
-			> to return home.
-		</p>
+      <p>
+        You don't have permission to view this page. <a href="/">Go home</a>.
+      </p>
 	{/if}
 </Window>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 160f018..e923d9b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -10,7 +10,7 @@
 	<link rel="icon" href={favicon} />
 	<title>Rhema Wave Technologies</title>
 	<meta name="description" content="Rhema Wave Technologies User Portal — manage proclamations, audio content, and solfeggio frequencies." />
-	<meta name="theme-color" content="#7B2D8E" />
+	<meta name="theme-color" content="#6b7280" />
 	<meta property="og:title" content="Rhema Wave Technologies" />
 	<meta property="og:description" content="Manage proclamations, audio content, and solfeggio frequencies." />
 	<meta property="og:type" content="website" />
diff --git a/src/routes/layout.css b/src/routes/layout.css
index cd67023..b66f9a6 100644
--- a/src/routes/layout.css
+++ b/src/routes/layout.css
@@ -1,3 +1,88 @@
 @import 'tailwindcss';
 @plugin '@tailwindcss/forms';
 @plugin '@tailwindcss/typography';
+
+/* ------------------------------------------------------------------ */
+/*  Wireframe theme — remap all non-gray colors to grayscale           */
+/* ------------------------------------------------------------------ */
+@theme {
+  /* blue → gray */
+  --color-blue-50: #f3f4f6;
+  --color-blue-100: #e5e7eb;
+  --color-blue-200: #d1d5db;
+  --color-blue-300: #9ca3af;
+  --color-blue-400: #6b7280;
+  --color-blue-500: #6b7280;
+  --color-blue-600: #4b5563;
+  --color-blue-700: #374151;
+  --color-blue-800: #1f2937;
+  /* green → gray */
+  --color-green-50: #f3f4f6;
+  --color-green-100: #e5e7eb;
+  --color-green-200: #d1d5db;
+  --color-green-300: #9ca3af;
+  --color-green-400: #6b7280;
+  --color-green-500: #6b7280;
+  --color-green-600: #4b5563;
+  --color-green-700: #374151;
+  --color-green-800: #1f2937;
+  /* red → gray */
+  --color-red-50: #f3f4f6;
+  --color-red-100: #e5e7eb;
+  --color-red-200: #d1d5db;
+  --color-red-300: #9ca3af;
+  --color-red-400: #6b7280;
+  --color-red-500: #6b7280;
+  --color-red-600: #4b5563;
+  --color-red-700: #374151;
+  --color-red-800: #1f2937;
+  /* purple → gray */
+  --color-purple-50: #f3f4f6;
+  --color-purple-100: #e5e7eb;
+  --color-purple-200: #d1d5db;
+  --color-purple-300: #9ca3af;
+  --color-purple-400: #6b7280;
+  --color-purple-500: #6b7280;
+  --color-purple-600: #4b5563;
+  --color-purple-700: #374151;
+  --color-purple-800: #1f2937;
+  --color-purple-900: #111827;
+  /* slate → gray */
+  --color-slate-50: #f8fafc;
+  --color-slate-100: #f1f5f9;
+  --color-slate-200: #e2e8f0;
+  --color-slate-300: #cbd5e1;
+  --color-slate-400: #94a3b8;
+  --color-slate-500: #64748b;
+  --color-slate-600: #475569;
+  --color-slate-700: #334155;
+  --color-slate-800: #1e293b;
+  --color-slate-900: #111827;
+
+  /* zero out decorative radii */
+  --radius: 0px;
+  --radius-sm: 0px;
+  --radius-md: 0px;
+  --radius-lg: 0px;
+  --radius-xl: 0px;
+  --radius-2xl: 0px;
+  --radius-3xl: 0px;
+
+  /* zero out shadows */
+  --shadow-sm: 0 0 #0000;
+  --shadow: 0 0 #0000;
+  --shadow-md: 0 0 #0000;
+  --shadow-lg: 0 0 #0000;
+  --shadow-xl: 0 0 #0000;
+  --shadow-2xl: 0 0 #0000;
+}
+
+/* ------------------------------------------------------------------ */
+/*  Force-disable transitions, animations, and remaining decoration    */
+/* ------------------------------------------------------------------ */
+*,
+::before,
+::after {
+  transition: none !important;
+  animation: none !important;
+}
diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte
index 79af796..e6e002e 100644
--- a/src/routes/login/+page.svelte
+++ b/src/routes/login/+page.svelte
@@ -39,7 +39,7 @@
 		{/if}
 		<form
 			onsubmit={handleSubmit}
-			class="bg-grey-200 my-6 flex flex-col items-center justify-center"
+			class="my-6 flex flex-col items-center justify-center"
 		>
 			<p>Login</p>
 			<input type="email" placeholder="Email Address" bind:value={email} required class="my-2" />