feat(web): унифицировать ReUI PRO — ResourcePage, KpiStatGrid, chrome

Списки на ResourcePage, KPI на EvoBGP hybrid KpiStatGrid; удалены DataGridCard/SectionCards/ModeToggle; обновлены rules, skill и design contract.

Co-authored-by: Cursor <[email protected]>

docs/ui-design-contract.md

@@ -1,24 +1,29 @@
 # UI Design Contract (ops apps)
 
-Единый контракт для vps-tracker, CFDM и EvoBGP. Surface: **ReUI Frame**. Kit API: `apps/web/src/components/reui-kit/`.
+Единый контракт для **CFDM · vps-tracker · EvoBGP · EvoFirewall · auth-portal**.  
+Surface: **ReUI Frame**. Kit: `apps/web/src/components/reui-kit/`.  
+Иерархия: **ReUI PRO > shadcn primitives**.
 
-Карта: [llms.txt](https://reui.io/llms.txt) · [Styling](https://reui.io/docs/styling) · [License](https://reui.io/docs/license-setup) · [Blocks](https://reui.io/blocks)
+Карта: [llms.txt](https://reui.io/llms.txt) · [Styling](https://reui.io/docs/styling) · [License](https://reui.io/docs/license-setup) · [Blocks](https://reui.io/blocks) · [MCP](https://reui.io/docs/mcp)
 
 ## Surface
 
+Project lock: **`surface: frame`**. Ops / list / dashboard / detail / settings — только **Frame**, не shadcn Card как shell. Не смешивать Card и Frame на одном ops-экране.
+
 ```ts
-// apps/web/src/lib/ui-surface.ts
+// apps/web/src/lib/ui-surface.ts (где есть)
 export const UI_SURFACE = 'frame' as const
 ```
 
-Ops / list / dashboard / detail / settings — только **Frame**, не shadcn Card как shell. Не смешивать Card и Frame на одном ops-экране.
+Settings: секции через Frame + `gap` (без hairline `Separator` под PageHeader); `SettingRow` без `FieldSeparator` по умолчанию (`separated` opt-in). Preview: [settings-3](https://reui.io/preview/base/settings-3) · [settings-16](https://reui.io/preview/base/settings-16).
 
 ## Canonical PRO references
 
 | Зона | Block | Preview |
 |------|-------|---------|
 | Shell | `app-shell-12` (+ cmdk/monitor где нужно) | https://reui.io/preview/base/app-shell-12 · https://reui.io/preview/base/app-shell-7 |
-| KPI | horizontal compact hybrid (icon left + label/Badge + value ± variant; EvoBGP visual) | https://reui.io/preview/base/stats-12 |
+| KPI | horizontal compact hybrid (EvoBGP SoT: icon left + label/Badge + value ± variant) | https://reui.io/preview/base/stats-12 |
+| Quick Actions | Frame tiles (sibling KPI) + Badge «Перейти» | https://reui.io/preview/base/stats-12 · https://reui.io/preview/base/card-12 |
 | Dashboard | `dashboard-1` | https://reui.io/preview/base/dashboard-1 |
 | Lists | `data-grid-filtering-2` | https://reui.io/preview/base/data-grid-filtering-2 |
 | Settings | `settings-16` + SettingRow | https://reui.io/preview/base/settings-16 |
@@ -30,71 +35,86 @@ Ops / list / dashboard / detail / settings — только **Frame**, не shad
 
 | Component | Role |
 |-----------|------|
-| `ResourcePage` | Frame + line tabs + Filters + DataGrid |
-| `KpiStatGrid` | horizontal compact hybrid KPI tiles (`variant`, Badge) |
-| `QuickActionGrid` | KPI-like quick action tiles under/after KPI (gated by `showQuickActions`) |
-| `OpsDashboard` | KPI + charts + attention queue (+ optional `afterKpi`) |
+| `ResourcePage` | Frame + line tabs + Filters + DataGrid (primary lists; without Filters → simple CRUD grid) |
+| `FrameDataGrid` | Internal / embedded Frame grid used by ResourcePage simple mode |
+| `KpiStatGrid` | EvoBGP hybrid KPI tiles (`items`/`cards`, `variant`, Badge) |
+| `QuickActionGrid` | KPI-like quick action tiles (gated by `showQuickActions`) |
+| `OpsDashboard` | KPI + optional `afterKpi` + charts + attention queue |
 | `SettingsShell` | settings nav + Outlet |
 | `DetailPanel` | detail Frame sections |
 | `filter-utils` | apply/clear ReUI Filters |
 
+`KpiStatGrid` / `QuickActionGrid` markup — SoT **EvoBGP**; в остальных apps diff только `@scope/ui` imports.
+
 ## Dashboard layout
 
 | App | Section order |
 |-----|---------------|
-| EvoBGP / CFDM | KPI → **QuickActionGrid** → charts / rest |
+| EvoBGP / CFDM / EvoFirewall | KPI → **QuickActionGrid** → charts / rest |
 | vps-tracker | banner → KPI → charts → attention → **QuickActionGrid** → CSV |
+| auth-portal | portal-specific; Quick Actions при наличии dashboard |
 
-Gating: DB preference `showQuickActions` / `show_quick_actions` / `ui_show_quick_actions` (default `true`).
+Gating: DB `show_quick_actions` / `showQuickActions` / `ui_show_quick_actions` (default `true`).
 
 ## Shared App Shell chrome
 
-Эталон: **EvoBGP** production AppShell + ReUI [app-shell-12](https://reui.io/preview/base/app-shell-12).
-
-При переключении между vps-tracker / CFDM / EvoBGP меняются **только** sidebar nav labels/hrefs и `main` content. Разметка, ширина, фон и hover chrome идентичны.
+Эталон разметки: production apps + ReUI [app-shell-12](https://reui.io/preview/base/app-shell-12).  
+При переключении между apps меняются **только** sidebar nav labels/hrefs и `main` content.
 
 | Токен / зона | Значение |
 |--------------|----------|
-| `SIDEBAR_WIDTH` / `--sidebar-width` | `240px` (в `packages/ui` sidebar + Provider style) |
-| Sidebar / hover colors | theme `--sidebar` / `--sidebar-accent` из `globals.css` — **без** AppShell `color-mix` override |
+| `SIDEBAR_WIDTH` / `--sidebar-width` | `240px` |
+| Sidebar / hover colors | theme `--sidebar` / `--sidebar-accent` — **без** AppShell `color-mix` override |
 | Header | `h-12`, `sticky`, `border-b`, `px-4 md:px-6` |
 | Header left | `SidebarTrigger` + `Separator` + Breadcrumb |
-| Header right | **AppsMenu** → **SystemMonitorPopover** (без Search / ModeToggle в chrome) |
-| Sidebar | AppSwitcher → SpaceSwitcher → groups (`SidebarGroupContent`) → icons `size-4` → **NavUser** в `SidebarFooter` ([app-shell-1](https://reui.io/preview/base/app-shell-1)) |
-| Theme | segmented toggle **внутри NavUser** (не ModeToggle в header) |
+| Header right | **AppsMenu** → **SystemMonitorPopover** (тема — в NavUser) |
+| Sidebar | AppSwitcher → groups → icons `size-4` → **NavUser** в `SidebarFooter` |
 | `main` | `gap-4 md:gap-6`, `px-4 py-4 md:px-6 md:py-5` |
 | Search | hotkey ⌘K / Ctrl+K only (не кнопка в header) |
 
-Запрещено в chrome: `SidebarRail`, sync-row footer, Search/Ctrl+K pill в header, issues Badge в header, muted/hover cascade на right-cluster, Provider `color-mix` для `--sidebar*`, ModeToggle в header (тема только в NavUser).
+Запрещено в chrome: `SidebarRail`, sync-row footer, Search pill в header, issues Badge в header, `ModeToggle` в header (тема только в NavUser), Provider `color-mix` для `--sidebar*`.
 
-App Switcher: source of truth — auth-portal `GET /api/v1/app-switcher`. Ids: `cfdm` · `vps` · `bgp`. Admin: portal `/admin/apps`. Локальный editor убран.
+NavUser (footer): avatar + name/email; dropdown — Настройки / Тема (segmented) / Выйти. Preview: [app-shell-1](https://reui.io/preview/base/app-shell-1).
 
-QuickActionGrid icons: только semantic **text** (`text-info` / `text-primary` / …) на kit `bg-muted` — без solid `bg-primary` fills. Preview: [stats-12](https://reui.io/preview/base/stats-12).
+App Switcher: auth-portal `GET /api/v1/app-switcher`. Ids: `cfdm` · `vps` · `bgp` · `fw`. Admin: portal `/admin/apps`.
+
+QuickActionGrid / KPI icons: только semantic **text** (`text-info` / `text-primary` / …) на kit `bg-muted` — без solid fills.
 
 ## System monitor
 
-`SystemMonitorPopover` in app header next to `ModeToggle` (после AppsMenu). Preview: https://reui.io/preview/base/app-shell-12 · https://reui.io/preview/base/app-shell-7
+`SystemMonitorPopover` in header after AppsMenu. Preview: https://reui.io/preview/base/app-shell-12 · https://reui.io/preview/base/app-shell-7
 
 ## MCP workflow
 
-1. MCP `user-reui` — `search` / `get_block` / `get_component` with `surface: "frame"`
+1. MCP `user-reui` — `search` / `get_block` / `compose_page` / `get_component` with `surface: "frame"`
 2. Cite `previewUrl` + `docsUrl`
 3. CLI from `apps/web`: `pnpm dlx shadcn@latest add @reui/...`
-4. Adapt into kit — do not hand-roll KPI/grid/settings rows
+4. Adapt into kit — do not hand-roll KPI / Quick Actions / grid / settings rows
 5. `validate_usage` / `get_audit_checklist`
 
-Primitives: MCP `plugin-shadcn-shadcn` + `@cfdm/ui` / `@evobgp/ui`.
+Primitives: MCP `plugin-shadcn-shadcn` + project `@scope/ui` (`@cfdm/ui` / `@evobgp/ui` / `@evofw/ui` / `@authportal/ui`).
+
+## License
+
+```env
+# apps/web/.env.local (gitignored)
+REUI_LICENSE_KEY=
+```
+
+`apps/web/components.json` → `@reui` с `Authorization: Bearer ${REUI_LICENSE_KEY}`.
 
 ## Spacing
 
-- AppShell main: `gap-4 md:gap-6`, `px-4 py-4 md:px-6 md:py-5` (shared chrome)
+- AppShell main / PageShell: `gap-4 md:gap-6`, `px-4 py-4 md:px-6 md:py-5`
 - No `space-y-*` / `space-x-*` — use `flex` + `gap-*`
 - Max 1 primary CTA per screen
-- Semantic tokens only (`variant="success"|"info"|"warning"`) — no raw `bg-emerald-*`
+- Semantic tokens only — no raw `bg-emerald-*`
 
 ## Forbidden
 
 - Card as ops list/dashboard shell
-- Hand-rolled data tables when ReUI DataGrid exists
-- Hand-rolled KPI grids when `KpiStatGrid` exists
+- Hand-rolled data tables when ReUI DataGrid / `ResourcePage` exists
+- Hand-rolled KPI when `KpiStatGrid` exists
+- Hand-rolled Quick Actions when `QuickActionGrid` exists
+- SectionCards / DataGridCard as design эталон
 - Mixing Card and Frame surfaces on one ops screen