Implement dark-first design system with Geist typography

Add Tailwind v4 @theme tokens for surfaces, accents, text, borders,
and status colors. Self-host Geist Sans/Mono variable fonts. Redesign
nav with backdrop blur and active states, home page with gradient hero.
Migrate all 50+ components from ad-hoc gray/blue Tailwind classes to
semantic theme tokens (surface-*, text-*, border-*, accent-*, status-*).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/components/admin/EvolutionFormModal.tsx

@@ -74,7 +74,7 @@ export function EvolutionFormModal({
         <select
           value={trigger}
           onChange={(e) => setTrigger(e.target.value)}
-          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+          className="w-full px-3 py-2 border rounded-md bg-surface-2 border-border-default"
         >
           {TRIGGER_OPTIONS.map((t) => (
             <option key={t} value={t}>
@@ -92,7 +92,7 @@ export function EvolutionFormModal({
           value={minLevel}
           onChange={(e) => setMinLevel(e.target.value)}
           placeholder="Optional"
-          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+          className="w-full px-3 py-2 border rounded-md bg-surface-2 border-border-default"
         />
       </div>
       <div>
@@ -102,7 +102,7 @@ export function EvolutionFormModal({
           value={item}
           onChange={(e) => setItem(e.target.value)}
           placeholder="e.g. thunder-stone"
-          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+          className="w-full px-3 py-2 border rounded-md bg-surface-2 border-border-default"
         />
       </div>
       <div>
@@ -112,7 +112,7 @@ export function EvolutionFormModal({
           value={heldItem}
           onChange={(e) => setHeldItem(e.target.value)}
           placeholder="Optional"
-          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+          className="w-full px-3 py-2 border rounded-md bg-surface-2 border-border-default"
         />
       </div>
       <div>
@@ -122,7 +122,7 @@ export function EvolutionFormModal({
           value={condition}
           onChange={(e) => setCondition(e.target.value)}
           placeholder="e.g. high-happiness, daytime"
-          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+          className="w-full px-3 py-2 border rounded-md bg-surface-2 border-border-default"
         />
       </div>
       <div>
@@ -132,7 +132,7 @@ export function EvolutionFormModal({
           value={region}
           onChange={(e) => setRegion(e.target.value)}
           placeholder="e.g. alola (blank = all regions)"
-          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+          className="w-full px-3 py-2 border rounded-md bg-surface-2 border-border-default"
         />
       </div>
     </FormModal>