feat: Sidebar Neumorphismus-Redesign + responsives Kollabieren

- 1024–1279px: Icon-only Sidebar (64px), Logo als Akzent-Icon
- ≥ 1280px: Sidebar mit Labels (200px), Logo Gradient-Text
- Neumorphischer Hintergrund (--sidebar-bg), eigene Light/Dark-Schatten-Tokens
- Hover: raised box-shadow (konvex gehoben)
- Aktiv: inset box-shadow (konkav gedrückt) + Akzentstreifen links
- Sidebar-Schatten statt Border-right für Tiefentrennung
- Smooth transition bei Breakpoint-Wechsel

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

public/styles/tokens.css

@@ -104,8 +104,14 @@
    * Layout
    * -------------------------------------------------------- */
   --nav-height-mobile: 64px;
-  --sidebar-width: 256px;
+  --sidebar-width: 64px;           /* collapsed icon-only (1024–1279px) */
+  --sidebar-width-expanded: 200px; /* full sidebar (1280px+) */
   --content-max-width: 1200px;
+
+  /* Sidebar Neumorphismus */
+  --sidebar-bg: #E8E8EE;
+  --sidebar-shadow-light: rgba(255, 255, 255, 0.82);
+  --sidebar-shadow-dark: rgba(148, 148, 170, 0.28);
   --safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);
 
   /* --------------------------------------------------------
@@ -138,6 +144,10 @@
     --color-text-secondary: #AEAEB2; /* WCAG AA: ~4.6:1 auf #2C2C2E */
     --color-text-disabled: #48484A;
 
+    --sidebar-bg: #19191D;
+    --sidebar-shadow-light: rgba(255, 255, 255, 0.05);
+    --sidebar-shadow-dark: rgba(0, 0, 0, 0.55);
+
     --color-accent-light: #1A3A5C;
     --color-success-light: #1A3A26;
     --color-warning-light: #3A2800;