fix: redesign top bar and filter panel for mobile

- Split top bar into two rows on mobile: title + filter icon, then
  full-width search below
- Desktop keeps single-row layout with search and filter inline
- Filter button: icon-only on mobile with active indicator dot
- Filter panel: full-screen overlay with backdrop on mobile,
  inline dropdown on desktop
- Outside-click closes filter panel
- Removed subtitle (only on desktop, saves space)

src/pages/ReferralNetwork/ReferralNetwork.tsx

@@ -34,19 +34,28 @@ export function ReferralNetwork() {
       className="relative flex h-[calc(100dvh-64px)] flex-col overflow-hidden bg-[#0a0a0f]"
     >
       {/* Top bar */}
-      <div className="relative z-20 flex shrink-0 items-center gap-3 border-b border-dark-700/50 bg-dark-900/90 px-4 py-3 backdrop-blur-md">
-        <AdminBackButton />
-        <div className="mr-2 min-w-0">
-          <h1 className="truncate text-sm font-bold text-dark-100 sm:text-lg">
+      <div className="relative z-20 shrink-0 border-b border-dark-700/50 bg-dark-900/90 backdrop-blur-md">
+        {/* Row 1: Back + Title + (desktop: search + filter) + (mobile: filter icon) */}
+        <div className="flex items-center gap-3 px-3 py-2 sm:px-4 sm:py-3">
+          <AdminBackButton />
+          <h1 className="min-w-0 truncate text-sm font-bold text-dark-100 sm:text-lg">
             {t('admin.referralNetwork.title')}
           </h1>
-          <p className="hidden text-xs text-dark-500 sm:block">
-            {t('admin.referralNetwork.subtitle')}
-          </p>
+          {/* Desktop: search + filter inline */}
+          <div className="hidden flex-1 items-center gap-2 sm:flex">
+            <NetworkSearch className="max-w-md flex-1" />
+            {networkData && <NetworkFilters data={networkData} />}
+          </div>
+          {/* Mobile: filter icon only */}
+          {networkData && (
+            <div className="ml-auto sm:hidden">
+              <NetworkFilters data={networkData} />
+            </div>
+          )}
         </div>
-        <div className="flex flex-1 items-center gap-2">
-          <NetworkSearch className="max-w-md flex-1" />
-          {networkData && <NetworkFilters data={networkData} />}
+        {/* Row 2 (mobile only): full-width search */}
+        <div className="px-3 pb-2 sm:hidden">
+          <NetworkSearch className="w-full" />
         </div>
       </div>