diff --git a/public/index.html b/public/index.html
index 2aa1b61..c44876b 100644
--- a/public/index.html
+++ b/public/index.html
@@ -253,70 +253,87 @@
         }
 
         /* New Admin Interface Styles: sidebar + content */
+        /* Admin layout — Stitch style sidebar + content pane */
         .admin-layout {
             display: grid;
             grid-template-columns: 260px 1fr;
-            gap: 20px;
+            gap: 24px;
             align-items: start;
         }
 
         .admin-sidebar {
-            background: white;
-            padding: 20px;
+            background: #eff4ff;
+            padding: 16px;
+            border: 1px solid #c3c6d7;
             border-radius: 8px;
-            box-shadow: 0 2px 10px rgba(0,0,0,0.08);
             position: sticky;
-            top: 20px;
+            top: 76px;
         }
 
         .admin-sidebar h2 {
+            margin: 0 0 4px 0;
+            color: #0b1c30;
+            font-size: 14px;
+            font-weight: 600;
+            padding: 0 8px;
+        }
+        .admin-sidebar .admin-sidebar-subtitle {
             margin: 0 0 16px 0;
-            color: #2c3e50;
-            text-align: left;
-            font-size: 18px;
+            color: #434655;
+            font-size: 13px;
+            padding: 0 8px;
         }
 
         .admin-main {
             min-width: 0;
+            display: flex;
+            flex-direction: column;
+            gap: 24px;
         }
 
         .admin-categories {
             display: flex;
             flex-direction: column;
-            gap: 6px;
+            gap: 2px;
         }
 
         .admin-cat-btn {
             display: flex;
             align-items: center;
-            gap: 10px;
-            padding: 10px 14px;
-            background: #ffffff;
-            border: 1px solid #dee2e6;
+            gap: 12px;
+            padding: 8px 12px;
+            background: transparent;
+            border: none;
             border-radius: 8px;
             cursor: pointer;
             transition: all 0.15s ease;
             text-align: left;
-            font-size: 14px;
+            font-family: inherit;
+            font-size: 13px;
             font-weight: 500;
-            color: #2c3e50;
+            color: #434655;
             width: 100%;
         }
-
+        .admin-cat-btn .material-symbols-outlined {
+            font-size: 20px;
+            color: #737686;
+            flex-shrink: 0;
+        }
         .admin-cat-btn:hover {
-            background: #e3f2fd;
-            border-color: #2196f3;
+            background: #dce9ff;
+            color: #0b1c30;
+        }
+        .admin-cat-btn:hover .material-symbols-outlined {
+            color: #0b1c30;
         }
-
         .admin-cat-btn.active {
-            background: #2196f3;
-            color: white;
-            border-color: #1976d2;
+            background: #2563eb;
+            color: #ffffff;
+            font-weight: 600;
         }
-
-        .admin-icon {
-            font-size: 18px;
-            line-height: 1;
+        .admin-cat-btn.active .material-symbols-outlined {
+            color: #ffffff;
+            font-variation-settings: 'FILL' 1;
         }
 
         @media (max-width: 900px) {
@@ -356,59 +373,56 @@
 
         .admin-category {
             display: none;
-            animation: fadeIn 0.3s ease-in;
         }
-
         .admin-category.active {
-            display: block;
+            display: flex;
+            flex-direction: column;
+            gap: 24px;
         }
 
+        /* Each admin sub-page is now a column of bordered cards */
         .admin-page {
-            background: white;
-            border-radius: 12px;
-            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
-            overflow: hidden;
+            display: flex;
+            flex-direction: column;
+            gap: 24px;
         }
 
         .admin-header {
-            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-            color: white;
-            padding: 30px;
-            text-align: center;
+            background: transparent;
+            padding: 0;
+            text-align: left;
+            color: inherit;
+            border-bottom: 1px solid #c3c6d7;
+            padding-bottom: 16px;
         }
-
         .admin-header h3 {
-            margin: 0 0 10px 0;
+            margin: 0 0 4px 0;
             font-size: 24px;
             font-weight: 600;
+            color: #0b1c30;
+            letter-spacing: -0.01em;
         }
-
         .admin-header p {
             margin: 0;
-            opacity: 0.9;
-            font-size: 16px;
-        }
-
-        .admin-form-section {
-            padding: 30px;
-            border-bottom: 1px solid #eee;
-            background: #f8f9fa;
-        }
-
-        .admin-form-section h4 {
-            margin: 0 0 20px 0;
-            color: #495057;
-            font-size: 18px;
+            color: #434655;
+            font-size: 14px;
+            opacity: 1;
         }
 
+        .admin-form-section,
         .admin-content-section {
-            padding: 30px;
+            padding: 20px;
+            background: #ffffff;
+            border: 1px solid #c3c6d7;
+            border-radius: 8px;
+            box-shadow: 0 2px 4px rgba(0,0,0,0.04);
         }
-
+        .admin-form-section h4,
         .admin-content-section h4 {
-            margin: 0 0 20px 0;
-            color: #495057;
-            font-size: 18px;
+            margin: 0 0 16px 0;
+            color: #0b1c30;
+            font-size: 16px;
+            font-weight: 600;
         }
 
         .form-row {
@@ -473,37 +487,87 @@
         }
 
         .admin-list {
-            display: grid;
-            gap: 10px;
+            display: flex;
+            flex-direction: column;
+            gap: 8px;
         }
 
         .admin-table {
             width: 100%;
             border-collapse: collapse;
-            margin-top: 10px;
+            font-size: 13px;
         }
-
-        .admin-table th,
-        .admin-table td {
-            padding: 12px;
-            text-align: left;
-            border-bottom: 1px solid #dee2e6;
+        .admin-table thead {
+            background: #dce9ff;
+            border-bottom: 2px solid #c3c6d7;
         }
-
         .admin-table th {
-            background: #f8f9fa;
-            font-weight: 600;
-            color: #495057;
+            padding: 10px 16px;
+            text-align: left;
+            font-family: 'Hanken Grotesk', sans-serif;
+            font-size: 11px;
+            font-weight: 700;
+            letter-spacing: 0.05em;
+            text-transform: uppercase;
+            color: #434655;
         }
-
-        .admin-table tr:hover {
-            background: #f8f9fa;
+        .admin-table td {
+            padding: 8px 16px;
+            border-bottom: 1px solid rgba(195, 198, 215, 0.3);
+            color: #0b1c30;
+        }
+        .admin-table tbody tr:nth-child(even) {
+            background: rgba(239, 244, 255, 0.5);
+        }
+        .admin-table tbody tr:hover {
+            background: rgba(211, 228, 254, 0.3);
         }
 
         .table-container {
             overflow-x: auto;
+            border: 1px solid #c3c6d7;
+            border-radius: 8px;
+            background: #ffffff;
+        }
+
+        /* Admin table action buttons — Stitch-like text buttons.
+           Overrides the table-button reset for the admin tables. */
+        .admin-table button {
+            background: #ffffff;
+            color: #434655;
+            padding: 4px 10px;
+            border: 1px solid #c3c6d7;
             border-radius: 6px;
-            border: 1px solid #dee2e6;
+            font-size: 12px;
+            font-weight: 500;
+            cursor: pointer;
+            font-family: inherit;
+            transition: background 0.15s, color 0.15s, border-color 0.15s;
+        }
+        .admin-table button:hover {
+            background: #dce9ff;
+            color: #0b1c30;
+            border-color: #2563eb;
+        }
+        .admin-table button.btn-success,
+        .admin-table button.btn-primary {
+            background: #2563eb;
+            color: #ffffff;
+            border-color: #2563eb;
+        }
+        .admin-table button.btn-success:hover,
+        .admin-table button.btn-primary:hover {
+            background: #004ac6;
+            border-color: #004ac6;
+        }
+        .admin-table button.btn-danger {
+            background: #ffffff;
+            color: #ba1a1a;
+            border-color: #ffdad6;
+        }
+        .admin-table button.btn-danger:hover {
+            background: #ffdad6;
+            border-color: #ba1a1a;
         }
 
         @keyframes fadeIn {
@@ -526,6 +590,55 @@
             }
         }
         
+        /* Compact admin form controls */
+        .admin-form-section input[type=text],
+        .admin-form-section input[type=number],
+        .admin-form-section input[type=date],
+        .admin-form-section select,
+        .admin-form-section textarea {
+            padding: 6px 10px;
+            border: 1px solid #c3c6d7;
+            border-radius: 6px;
+            font-size: 13px;
+            font-family: inherit;
+            background: #ffffff;
+            color: #0b1c30;
+        }
+        .admin-form-section input:focus,
+        .admin-form-section select:focus,
+        .admin-form-section textarea:focus {
+            outline: none;
+            border-color: #2563eb;
+            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
+        }
+        .admin-form-section label {
+            font-size: 11px;
+            font-weight: 700;
+            letter-spacing: 0.05em;
+            text-transform: uppercase;
+            color: #434655;
+            min-width: 0;
+        }
+        /* Admin form buttons (primary + ghost) */
+        .admin-form-section .btn-success,
+        .admin-form-section .btn-primary,
+        .admin-form-section button.btn {
+            background: #2563eb;
+            color: #ffffff;
+            padding: 8px 16px;
+            border-radius: 8px;
+            font-size: 13px;
+            font-weight: 500;
+            border: none;
+            cursor: pointer;
+            transition: background 0.15s;
+        }
+        .admin-form-section .btn-success:hover,
+        .admin-form-section .btn-primary:hover,
+        .admin-form-section button.btn:hover {
+            background: #004ac6;
+        }
+
         .add-form {
             display: flex;
             gap: 10px;
@@ -1128,38 +1241,39 @@
                 <!-- Sidebar -->
                 <aside class="admin-sidebar">
                     <h2>Administration</h2>
+                    <p class="admin-sidebar-subtitle">Systemsteuerung</p>
                     <div class="admin-categories">
                         <button class="admin-cat-btn active" onclick="showAdminCategory('anbieter')">
-                            <span class="admin-icon">🏢</span>
+                            <span class="material-symbols-outlined">corporate_fare</span>
                             <span>Anbieter</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('vos')">
-                            <span class="admin-icon">🔢</span>
-                            <span>VOs (Vertriebspartner)</span>
+                            <span class="material-symbols-outlined">badge</span>
+                            <span>VOs</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('tarife')">
-                            <span class="admin-icon">📋</span>
+                            <span class="material-symbols-outlined">receipt_long</span>
                             <span>Tarife</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('tarifoptionen')">
-                            <span class="admin-icon">⚙️</span>
+                            <span class="material-symbols-outlined">tune</span>
                             <span>Tarifoptionen</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('mitarbeiter-prozentsaetze')">
-                            <span class="admin-icon">📊</span>
-                            <span>Mitarbeiter-Prozentsätze</span>
+                            <span class="material-symbols-outlined">percent</span>
+                            <span>MA-Prozentsätze</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('mitarbeiter-provisionen')">
-                            <span class="admin-icon">👤</span>
-                            <span>Mitarbeiter-Provisionen</span>
+                            <span class="material-symbols-outlined">payments</span>
+                            <span>MA-Provisionen</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('provisionsregeln')">
-                            <span class="admin-icon">📝</span>
+                            <span class="material-symbols-outlined">rule</span>
                             <span>Provisionsregeln</span>
                         </button>
                         <button class="admin-cat-btn" onclick="showAdminCategory('global-provisionsregeln')">
-                            <span class="admin-icon">🌐</span>
-                            <span>Globale Provisionsregeln</span>
+                            <span class="material-symbols-outlined">public</span>
+                            <span>Globale Regeln</span>
                         </button>
                     </div>
                 </aside>