feat: журнальная главная, страница Зеро, TG-баннер, stats, auto-publish UI

- Журнальная главная: hero, CategoryRow, PopularBlock, RecentBlock (Сегодня/Вчера/Неделя)
- ArticleCard: 3 размера (hero/regular/compact), цветной badge без дублей тегов
- ArticleCoverSVG: 6 брендовых палитр, аватар Зеро в углу вместо #ZEROPOST
- /about/zero: страница персонажа с галереей 8 поз
- Footer: TG-баннер с аватаром Зеро на каждой странице
- Конец статьи: блок «Понравилась? → Подписаться на канал»
- ChannelEditor: 4 вкладки (Настройки/Расписание/Авто-публикация/Ручная)
- AutoPublishTab: toggle, категории, delay, template, live preview
- ArticlePicker: typeahead с was_sent_to_channel / next_scheduled_at флагами
- /admin/channels/[id]/stats: график роста подписчиков (recharts)
- Dashboard: блок TG-статистики (подписчики, delta 24h/7d, постов)
- Header: упрощён до 2 пунктов desktop + расширенное мобильное меню
- AutogenPanel: корректные time-picker'ы, calcNextRun с учётом last_run_at

app/page.js

@@ -7,17 +7,24 @@ import Stats from '@/components/Stats';
 import NowBlock from '@/components/NowBlock';
 import NotesBlock from '@/components/NotesBlock';
 import SeriesGrid from '@/components/SeriesGrid';
+import CategoryRow from '@/components/CategoryRow';
+import PopularBlock from '@/components/PopularBlock';
+import RecentBlock from '@/components/RecentBlock';
 import Reveal from '@/components/Reveal';
-import { listArticles, listTags, getStats, getLive, listNotes, listSeries, listCategories } from '@/lib/engine';
+import { getHomeData, listTags, getStats, getLive, listNotes, listSeries, listCategories } from '@/lib/engine';
 import { Sparkles, ArrowRight } from 'lucide-react';
 
 export const dynamic = 'force-dynamic';
 
+const CATEGORY_ORDER = ['ai-tools', 'ai-dev', 'automation', 'cybersec'];
+
 export default async function HomePage() {
-  let articles = [], tags = [], stats = null, live = null, notes = [], series = [], categories = [];
+  let home = { hero: null, byCategory: {}, popular: [], recent: [] };
+  let tags = [], stats = null, live = null, notes = [], series = [], categories = [];
+
   try {
-    [articles, tags, stats, live, notes, series, categories] = await Promise.all([
-      listArticles({ limit: 13 }),
+    [home, tags, stats, live, notes, series, categories] = await Promise.all([
+      getHomeData(),
       listTags(),
       getStats(),
       getLive(),
@@ -29,16 +36,19 @@ export default async function HomePage() {
     console.error('Home load failed:', err.message);
   }
 
-  const [featured, ...rest] = articles;
+  const { hero, byCategory = {}, popular = [], recent = [] } = home || {};
+  const hasAnyArticles = !!hero
+    || Object.values(byCategory).some(arr => arr.length > 0)
+    || recent.length > 0;
 
   return (
     <>
       <Header />
 
-      {/* Hero */}
-      <section className="relative overflow-hidden min-h-[88vh] sm:min-h-0 flex items-center sm:block">
+      {/* HERO — описание блога */}
+      <section className="relative overflow-hidden min-h-[55vh] sm:min-h-0 flex items-center sm:block">
         <HeroImage />
-        <div className="container-wide pt-6 pb-10 sm:pt-20 sm:pb-24 lg:pt-28 lg:pb-32 relative z-10 w-full">
+        <div className="container-wide pt-6 pb-10 sm:pt-16 sm:pb-20 lg:pt-24 lg:pb-24 relative z-10 w-full">
           <Reveal>
             <div className="max-w-xl lg:max-w-2xl reveal">
               <div
@@ -48,16 +58,16 @@ export default async function HomePage() {
                 <Sparkles className="w-3.5 h-3.5" />
                 Блог, который ведёт ИИ
               </div>
-              <h1 className="text-[2.5rem] sm:text-6xl lg:text-7xl font-bold tracking-tight leading-[1.05] mb-5 ink">
+              <h1 className="text-[2.5rem] sm:text-5xl lg:text-6xl font-bold tracking-tight leading-[1.05] mb-5 ink">
                 Технологии<br />
                 <span className="mute">по делу.</span>
               </h1>
-              <p className="text-base sm:text-lg lg:text-xl mute mb-8 max-w-lg leading-relaxed">
-                ИИ, кибербезопасность, автоматизация и разработка. Разборы инструментов, рабочие промпты, реальные кейсы — без воды и хайпа. Эксперимент: блог, который ведёт ИИ, а человек только следит за курсом.
+              <p className="text-base sm:text-lg mute mb-8 max-w-lg leading-relaxed">
+                ИИ, кибербезопасность, автоматизация и разработка. Разборы инструментов, рабочие промпты, реальные кейсы — без воды и хайпа.
               </p>
               <div className="flex flex-col sm:flex-row gap-3">
-                <Link href="#articles" className="btn btn-primary w-full sm:w-auto">
-                  Читать статьи <ArrowRight className="w-4 h-4" />
+                <Link href="#hero-article" className="btn btn-primary w-full sm:w-auto">
+                  Читать <ArrowRight className="w-4 h-4" />
                 </Link>
                 <Link href="/about" className="btn btn-ghost w-full sm:w-auto">
                   Как это работает
@@ -68,28 +78,14 @@ export default async function HomePage() {
         </div>
       </section>
 
-      {/* Сейчас — live indicator */}
-      <Reveal>
-        <div className="reveal">
-          <NowBlock live={live} />
-        </div>
-      </Reveal>
-
-      {/* Stats */}
-      <Reveal>
-        <div className="reveal">
-          <Stats data={stats} />
-        </div>
-      </Reveal>
-
-      {/* Категории */}
+      {/* Темы (категории) — навигатор */}
       {categories.length > 0 && (
-        <section className="container-wide py-10">
-          <h2 className="text-xs font-semibold uppercase tracking-widest mute mb-5">Темы</h2>
+        <section className="container-wide pt-8 pb-6">
+          <h2 className="text-xs font-semibold uppercase tracking-widest mute mb-4">Темы</h2>
           <div className="grid grid-cols-2 sm:grid-cols-4 gap-3">
             {categories.map(cat => {
               const colorMap = {
-                emerald: 'bg-emerald-50 dark:bg-emerald-950 border-emerald-200 dark:border-emerald-800 text-emerald-700 dark:text-emerald-300 hover:border-emerald-400 dark:hover:border-emerald-600',
+                emerald: 'bg-emerald-50 dark:bg-emerald-950 border-emerald-200 dark:border-emerald-800 text-emerald-700 dark:text-emerald-300 hover:border-emerald-400',
                 red:     'bg-red-50 dark:bg-red-950 border-red-200 dark:border-red-800 text-red-700 dark:text-red-300 hover:border-red-400',
                 amber:   'bg-amber-50 dark:bg-amber-950 border-amber-200 dark:border-amber-800 text-amber-700 dark:text-amber-300 hover:border-amber-400',
                 blue:    'bg-blue-50 dark:bg-blue-950 border-blue-200 dark:border-blue-800 text-blue-700 dark:text-blue-300 hover:border-blue-400',
@@ -108,16 +104,25 @@ export default async function HomePage() {
         </section>
       )}
 
-      {/* Featured */}
-      {featured && (
+      {/* HERO ARTICLE — главная статья сверху */}
+      {hero && (
         <Reveal>
-          <section id="articles" className="container-wide pb-8 reveal">
-            <ArticleCard article={featured} featured />
+          <section id="hero-article" className="container-wide pb-8 reveal">
+            <ArticleCard article={hero} featured />
           </section>
         </Reveal>
       )}
 
-      {/* Серии */}
+      {/* СВЕЖИЕ — сразу после главной статьи (важнее всего для возвращающегося читателя) */}
+      {recent.length > 0 && (
+        <Reveal>
+          <div className="reveal">
+            <RecentBlock articles={recent} />
+          </div>
+        </Reveal>
+      )}
+
+      {/* СЕРИИ */}
       {series.length > 0 && (
         <Reveal>
           <div className="reveal">
@@ -126,27 +131,34 @@ export default async function HomePage() {
         </Reveal>
       )}
 
-      {/* Rest */}
-      {rest.length > 0 && (
+      {/* КАТЕГОРИЙНЫЕ РЯДЫ */}
+      {CATEGORY_ORDER.map(cat => (
+        <Reveal key={cat}>
+          <div className="reveal">
+            <CategoryRow category={cat} articles={byCategory[cat] || []} />
+          </div>
+        </Reveal>
+      ))}
+
+      {/* ПОПУЛЯРНОЕ ЗА МЕСЯЦ */}
+      {popular.length > 0 && (
         <Reveal>
-          <section className="container-wide pb-12 reveal">
-            <h2 className="text-sm font-medium uppercase tracking-widest mute mb-5">
-              Последние материалы
-            </h2>
-            <div className="grid sm:grid-cols-2 lg:grid-cols-3 gap-5">
-              {rest.map(a => <ArticleCard key={a.id} article={a} />)}
-            </div>
-          </section>
+          <div className="reveal">
+            <PopularBlock articles={popular} />
+          </div>
         </Reveal>
       )}
 
-      {articles.length === 0 && (
+      {!hasAnyArticles && (
         <section className="container-wide py-20 text-center">
           <p className="mute">Скоро здесь появятся первые статьи. ИИ уже работает над ними.</p>
         </section>
       )}
 
-      {/* Заметки редактора */}
+      {/* МЕТА: что прямо сейчас + стата + заметки (вынесены ниже основного контента) */}
+      <Reveal><div className="reveal"><NowBlock live={live} /></div></Reveal>
+      <Reveal><div className="reveal"><Stats data={stats} /></div></Reveal>
+
       {notes.length > 0 && (
         <Reveal>
           <div className="reveal">
@@ -155,11 +167,11 @@ export default async function HomePage() {
         </Reveal>
       )}
 
-      {/* Tags */}
+      {/* TAGS CLOUD — в самом низу */}
       {tags.length > 0 && (
         <Reveal>
           <section className="container-wide pb-12 reveal">
-            <h2 className="text-sm font-medium uppercase tracking-widest mute mb-4">Темы</h2>
+            <h2 className="text-sm font-medium uppercase tracking-widest mute mb-4">Все теги</h2>
             <div className="flex flex-wrap gap-2">
               {tags.map(t => (
                 <Link key={t.tag} href={`/tag/${encodeURIComponent(t.tag)}`} className="tag">