All tweaks added

frontend/src/components/ui/Layout.jsx

@@ -8,6 +8,7 @@ const nav = [
   { to: '/routes', label: 'Routes', icon: '🗺️' },
   { to: '/records', label: 'Records', icon: '🏆' },
   { to: '/upload', label: 'Import', icon: '⬆️' },
+  { to: '/profile', label: 'Profile', icon: '⚙️' },
 ]
 
 export default function Layout() {
@@ -21,51 +22,38 @@ export default function Layout() {
 
   return (
     <div className="flex h-screen overflow-hidden bg-gray-950">
-      {/* Sidebar */}
       <aside className="w-56 flex-shrink-0 bg-gray-900 border-r border-gray-800 flex flex-col">
-        {/* Logo */}
         <div className="px-4 py-5 border-b border-gray-800">
           <h1 className="text-lg font-bold text-white tracking-tight">
             <span className="text-blue-400">Mile</span>Vault
           </h1>
-          {user && (
-            <p className="text-xs text-gray-500 mt-0.5">@{user.username}</p>
-          )}
+          {user && <p className="text-xs text-gray-500 mt-0.5">@{user.username}{user.is_admin ? ' · admin' : ''}</p>}
         </div>
 
-        {/* Nav */}
         <nav className="flex-1 py-4 overflow-y-auto">
           {nav.map(({ to, label, icon, exact }) => (
-            <NavLink
-              key={to}
-              to={to}
-              end={exact}
+            <NavLink key={to} to={to} end={exact}
               className={({ isActive }) =>
                 `flex items-center gap-3 px-4 py-2.5 text-sm transition-colors ${
                   isActive
                     ? 'bg-blue-600/20 text-blue-400 border-r-2 border-blue-400'
                     : 'text-gray-400 hover:text-gray-100 hover:bg-gray-800'
                 }`
-              }
-            >
+              }>
               <span>{icon}</span>
               {label}
             </NavLink>
           ))}
         </nav>
 
-        {/* Footer */}
         <div className="px-4 py-4 border-t border-gray-800">
-          <button
-            onClick={handleLogout}
-            className="w-full text-left text-xs text-gray-500 hover:text-gray-300 transition-colors"
-          >
+          <button onClick={handleLogout}
+            className="w-full text-left text-xs text-gray-500 hover:text-gray-300 transition-colors">
             Sign out
           </button>
         </div>
       </aside>
 
-      {/* Main content */}
       <main className="flex-1 overflow-y-auto">
         <Outlet />
       </main>