Professionelles Redesign + Directus-Auth + Tag/Nacht-Modus

- Vollbild App-Shell mit Topbar, drei-Spalten-Workspace
- Login-Seite mit Directus JWT-Authentifizierung (in-memory Token)
- Tag/Nacht-Modus mit CSS Custom Properties (Systemfarbe als Default)
- Directus 'pictures' Collection (status=new) als Bildquelle in DrawIt
- Pfeil-Navigation durch Bilder mit Bildnummer-Anzeige
- Neues Design-System: Indigo-Akzent, SVG-Icons, professionelle Typografie
- ThemeProvider, AuthProvider, PrivateRoute, Topbar-Komponente

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

frontend/src/api.ts

@@ -1,5 +1,38 @@
 import type { ObjectMeta, Sentence } from './types'
 
+const DIRECTUS_URL = 'https://db.hejyou.com'
+
+export async function directusLogin(email: string, password: string): Promise<string> {
+  const res = await fetch(`${DIRECTUS_URL}/auth/login`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ email, password }),
+  })
+  const data = await res.json()
+  if (!res.ok) throw new Error(data.errors?.[0]?.message || 'Login fehlgeschlagen')
+  return data.data.access_token
+}
+
+export interface DirectusPicture {
+  id: string
+  media: string
+  status: string
+}
+
+export async function getDirectusPictures(token: string): Promise<DirectusPicture[]> {
+  const res = await fetch(
+    `${DIRECTUS_URL}/items/pictures?filter[status][_eq]=new&fields=id,media,status&sort=date_created`,
+    { headers: { Authorization: `Bearer ${token}` } }
+  )
+  if (!res.ok) throw new Error('Fehler beim Laden der Directus-Bilder')
+  const data = await res.json()
+  return data.data as DirectusPicture[]
+}
+
+export function directusAssetUrl(mediaId: string, token: string): string {
+  return `${DIRECTUS_URL}/assets/${mediaId}?access_token=${token}`
+}
+
 export async function getImages(mode: 'draw' | 'generate'): Promise<string[]> {
   const res = await fetch(`/api/images?mode=${mode}`)
   if (!res.ok) throw new Error('Fehler beim Laden der Bilder')