Prevent horizontal overflow on mobile (overflow-x: hidden on html/body)

src/app/globals.css

@@ -97,6 +97,7 @@
 html,
 body {
   height: 100%;
+  overflow-x: hidden;
 }
 
 body {

src/app/page.tsx

@@ -8,7 +8,7 @@ export default async function Home() {
   const [games, session] = await Promise.all([listPublishedGames(), getCurrentSession()]);
 
   return (
-    <div className="mx-auto w-full max-w-6xl flex-1 px-4 py-8 sm:px-6">
+    <div className="mx-auto w-full max-w-[1800px] flex-1 px-4 py-8 sm:px-6">
       <div className="mb-8 flex flex-wrap items-center justify-between gap-4">
         <div>
           <h1 className="font-display text-2xl font-bold tracking-tight">Лаунчер</h1>

src/components/header.tsx

@@ -13,7 +13,7 @@ export async function Header() {
 
   return (
     <header className="border-b border-border bg-surface">
-      <div className="mx-auto flex max-w-6xl flex-wrap items-center gap-x-6 gap-y-2 px-4 py-3 sm:px-6">
+      <div className="mx-auto flex max-w-[1800px] flex-wrap items-center gap-x-6 gap-y-2 px-4 py-3 sm:px-6">
         <Link href="/" className="flex items-center gap-2 font-display text-[15px] font-bold tracking-tight">
           <div className="flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-accent text-white">
             <Gamepad2 size={15} strokeWidth={2.5} />