Update RootLayout component to adjust container width based on route: integrate useRouterState for dynamic max-width handling, allowing admin pages to have a wider layout while keeping public pages compact.

frontend/src/routes/__root.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react'
-import { createRootRoute, Link, Outlet } from '@tanstack/react-router'
+import { createRootRoute, Link, Outlet, useRouterState } from '@tanstack/react-router'
 import { useTranslation } from 'react-i18next'
 import { Menu, Radio, X } from 'lucide-react'
 import { useAuthStore } from '@/features/auth/store'
@@ -17,6 +17,10 @@ function RootLayout() {
   const { theme, setTheme } = useTheme()
   const [menuOpen, setMenuOpen] = useState(false)
 
+  // Админка — с таблицами; ей даём больше ширины, публичные страницы оставляем компактными.
+  const pathname = useRouterState({ select: (s) => s.location.pathname })
+  const containerMax = pathname.startsWith('/admin') ? 'max-w-screen-2xl' : 'max-w-5xl'
+
   useEffect(() => {
     void bootstrapSession()
   }, [])
@@ -32,7 +36,7 @@ function RootLayout() {
   return (
     <div className="flex min-h-screen flex-col">
       <header className="border-b border-border">
-        <div className="mx-auto flex max-w-5xl items-center justify-between gap-4 px-4 py-3">
+        <div className={cn('mx-auto flex items-center justify-between gap-4 px-4 py-3', containerMax)}>
           <Link to="/" className="crt-glow flex items-center gap-2 text-lg font-bold tracking-widest">
             <Radio className="h-5 w-5" />
             {t('appName')}
@@ -129,7 +133,7 @@ function RootLayout() {
         )}
       </header>
 
-      <main className={cn('mx-auto w-full max-w-5xl flex-1 px-4 py-8')}>
+      <main className={cn('mx-auto w-full flex-1 px-4 py-8', containerMax)}>
         <Outlet />
       </main>