refactor: приведение проекта к стайлгайду

- Разделён globals.css на styles/variables.css, media.css, reset.css
- Добавлен styles/index.css как единая точка входа глобальных стилей
- Вынесен MantineProvider в app/providers/
- Переименован .ui.tsx в .tsx в шаблоне component
- Приведены CSS-токены радиусов к числовой шкале (--radius-1, --radius-2...)
- Добавлен слой src/layouts/
- Настроен Biome: одинарные кавычки, исключены .templates, разрешён @custom-media
- Обновлён .vscode/settings.json (quickfix.biome → source.fixAll.biome)
- Обновлён AGENTS.md с правилами для агентов

src/app/globals.css

@@ -1,71 +0,0 @@
-/* Цвета */
-:root {
-  --color-text: #1a1a1a;
-  --color-text-secondary: #6b7280;
-  --color-bg: #ffffff;
-  --color-bg-secondary: #f9fafb;
-  --color-border: #e5e7eb;
-  --color-primary: #228be6;
-  --color-error: #fa5252;
-  --color-success: #40c057;
-  --color-warning: #fab005;
-}
-
-/* Отступы */
-:root {
-  --space-1: 4px;
-  --space-2: 8px;
-  --space-3: 12px;
-  --space-4: 16px;
-  --space-5: 20px;
-  --space-6: 24px;
-  --space-8: 32px;
-  --space-10: 40px;
-  --space-12: 48px;
-  --space-16: 64px;
-}
-
-/* Скругления */
-:root {
-  --radius-sm: 4px;
-  --radius-md: 8px;
-  --radius-lg: 12px;
-  --radius-xl: 16px;
-  --radius-full: 9999px;
-}
-
-/* Медиа-запросы (Mobile First) */
-@custom-media --xs (min-width: 36em);
-@custom-media --sm (min-width: 48em);
-@custom-media --md (min-width: 62em);
-@custom-media --lg (min-width: 75em);
-@custom-media --xl (min-width: 88em);
-
-/* Базовые стили */
-html {
-  height: 100%;
-}
-
-html,
-body {
-  max-width: 100vw;
-  overflow-x: hidden;
-}
-
-body {
-  min-height: 100%;
-  display: flex;
-  flex-direction: column;
-  color: var(--color-text);
-  background: var(--color-bg);
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}

src/app/layout.tsx

@@ -1,8 +1,9 @@
-import type { PropsWithChildren } from 'react'
-import type { Metadata } from 'next'
-import { ColorSchemeScript, MantineProvider } from '@mantine/core'
-import '@mantine/core/styles.css'
-import './globals.css'
+import { ColorSchemeScript } from '@mantine/core';
+import type { Metadata } from 'next';
+import type { PropsWithChildren } from 'react';
+import { MantineProvider } from './providers';
+import '@mantine/core/styles.css';
+import './styles/index.css';
 
 export const metadata: Metadata = {
   title: {
@@ -27,7 +28,7 @@ export const metadata: Metadata = {
   twitter: {
     card: 'summary_large_image',
   },
-}
+};
 
 export default function RootLayout({ children }: PropsWithChildren) {
   return (
@@ -39,5 +40,5 @@ export default function RootLayout({ children }: PropsWithChildren) {
         <MantineProvider>{children}</MantineProvider>
       </body>
     </html>
-  )
+  );
 }

src/app/page.tsx

@@ -1,11 +1,11 @@
-import type { Metadata } from 'next'
-import { HomeScreen } from '@/screens/home'
+import type { Metadata } from 'next';
+import { HomeScreen } from '@/screens/home';
 
 export const metadata: Metadata = {
   title: 'Главная',
   description: 'Главная страница приложения',
-}
+};
 
 export default function HomePage() {
-  return <HomeScreen />
+  return <HomeScreen />;
 }

src/app/providers/index.ts

@@ -0,0 +1 @@
+export { MantineProvider } from './mantine-provider';

src/app/providers/mantine-provider.tsx

@@ -0,0 +1,11 @@
+'use client';
+
+import { MantineProvider as BaseMantineProvider } from '@mantine/core';
+import type { PropsWithChildren } from 'react';
+
+/**
+ * Провайдер Mantine UI.
+ */
+export const MantineProvider = ({ children }: PropsWithChildren) => {
+  return <BaseMantineProvider>{children}</BaseMantineProvider>;
+};

src/app/styles/index.css

@@ -0,0 +1,3 @@
+@import "./variables.css";
+@import "./media.css";
+@import "./reset.css";

src/app/styles/media.css

@@ -0,0 +1,6 @@
+/* Медиа-запросы (Mobile First) */
+@custom-media --xs (min-width: 36em);
+@custom-media --sm (min-width: 48em);
+@custom-media --md (min-width: 62em);
+@custom-media --lg (min-width: 75em);
+@custom-media --xl (min-width: 88em);

src/app/styles/reset.css

@@ -0,0 +1,28 @@
+/* Базовые стили */
+html {
+  height: 100%;
+}
+
+html,
+body {
+  max-width: 100vw;
+  overflow-x: hidden;
+}
+
+body {
+  min-height: 100%;
+  display: flex;
+  flex-direction: column;
+  color: var(--color-text);
+  background: var(--color-bg);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}

src/app/styles/variables.css

@@ -0,0 +1,35 @@
+/* Цвета */
+:root {
+  --color-text: #1a1a1a;
+  --color-text-secondary: #6b7280;
+  --color-bg: #ffffff;
+  --color-bg-secondary: #f9fafb;
+  --color-border: #e5e7eb;
+  --color-primary: #228be6;
+  --color-error: #fa5252;
+  --color-success: #40c057;
+  --color-warning: #fab005;
+}
+
+/* Отступы */
+:root {
+  --space-1: 4px;
+  --space-2: 8px;
+  --space-3: 12px;
+  --space-4: 16px;
+  --space-5: 20px;
+  --space-6: 24px;
+  --space-8: 32px;
+  --space-10: 40px;
+  --space-12: 48px;
+  --space-16: 64px;
+}
+
+/* Скругления */
+:root {
+  --radius-1: 4px;
+  --radius-2: 8px;
+  --radius-3: 12px;
+  --radius-4: 16px;
+  --radius-full: 9999px;
+}

src/screens/home/home.screen.tsx

@@ -1,6 +1,6 @@
-import type { FC } from 'react'
-import { Container, Title, Text, Image, Stack } from '@mantine/core'
-import styles from './styles/home.module.css'
+import { Container, Image, Stack, Text, Title } from '@mantine/core';
+import type { FC } from 'react';
+import styles from './styles/home.module.css';
 
 /**
  * Главный экран приложения.
@@ -18,11 +18,9 @@ export const HomeScreen: FC = () => {
             fit="contain"
           />
           <Title order={1}>Добро пожаловать</Title>
-          <Text c="dimmed">
-            Шаблон приложения на Next.js и TypeScript.
-          </Text>
+          <Text c="dimmed">Шаблон приложения на Next.js и TypeScript.</Text>
         </Stack>
       </Container>
     </div>
-  )
-}
+  );
+};

src/screens/home/index.ts

@@ -1 +1 @@
-export { HomeScreen } from './home.screen'
+export { HomeScreen } from './home.screen';