feat: add mobile layout with native app UX, identity page with ID card & passport

Mobile users (<768px) now see a native app-style home page with:
- Green gradient header with avatar, greeting, language/wallet/notification
- Horizontal scrollable score cards (auth-aware: login prompt for guests)
- App grid sections (Finance, Governance, Social, Education) with 4-col layout
- Bottom tab bar (Home / Citizen / Referral)
- MobileShell wrapper for consistent mobile navigation across pages

BeCitizen page redesigned for mobile with full-viewport hero screen,
scroll-to-reveal content, and compact benefits/process cards.

New Identity page (/identity) with realistic Kurdistan Republic ID card
and passport design. Users can fill personal info, upload photo from
camera/gallery, and save to device (localStorage only).

Desktop layout completely untouched. i18n keys added for all 6 languages.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

web/src/components/AppLayout.tsx

@@ -31,6 +31,8 @@ import { PezkuwiWalletButton } from './PezkuwiWalletButton';
 import { DEXDashboard } from './dex/DEXDashboard';
 import { P2PDashboard } from './p2p/P2PDashboard';
 import EducationPlatform from '../pages/EducationPlatform';
+import { useIsMobile } from '@/hooks/use-mobile';
+import MobileHomeLayout from './MobileHomeLayout';
 
 const AppLayout: React.FC = () => {
   const navigate = useNavigate();
@@ -52,6 +54,7 @@ const AppLayout: React.FC = () => {
   const { t } = useTranslation();
   const { isConnected } = useWebSocket();
   useWallet();
+  const isMobile = useIsMobile();
   const [, _setIsAdmin] = useState(false);
 
   // Close dropdown on outside click
@@ -72,6 +75,13 @@ const AppLayout: React.FC = () => {
   React.useEffect(() => {
     _setIsAdmin(false); // Admin status managed by AuthContext
   }, [user]);
+  // On mobile, when no feature panel is active, show the mobile home layout
+  const isFeaturePanelOpen = showDEX || showProposalWizard || showDelegation || showForum || showModeration || showTreasury || showStaking || showMultiSig || showEducation || showP2P;
+
+  if (isMobile && !isFeaturePanelOpen) {
+    return <MobileHomeLayout />;
+  }
+
   return (
     <div className="min-h-screen bg-gray-950 text-white">
       {/* Navigation */}