[CLAUDE] FE-Admin: redesign Phase 1 — density-first design system (NAMGROUP-ref, giữ brand)

Tham khảo NAMGROUP density conventions, GIỮ brand #1F7DC1 + Be Vietnam Pro.
- index.css: density heading ladder (semibold, drop font-bold) + .label-eyebrow util
- 6 UI primitives (Button/Input/Label/Select/Textarea/Dialog): text-xs font-semibold, py-1.5 ≤36px, rounded-lg, brand focus-ring
- 6 shell (DataTable sticky-thead+RowActions/Layout brand-rail/TopBar/PageHeader/PhaseBadge/EmptyState)
- DashboardPage flagship: KPI cards + brand-tinted icon chips + uppercase labels

Visual-only — functionality unchanged (Button variant/size keys stable 51 call-sites, props/forwardRef intact). build 0 TS err. reviewer PASS 0 blocker (2 minor slate-400 hint a11y defer). fe-admin only (fe-user mirror = Phase 3). Dashboard live-visual blocked by dev auth-rig → xem live sau deploy.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

fe-admin/src/components/Layout.tsx

@@ -242,10 +242,12 @@ function MenuLeaf({ node, depth }: { node: MenuNode; depth: number }) {
       to={path}
       title={node.label}
       className={cn(
-        'block rounded-md leading-snug transition',
-        isDeep ? 'px-3 py-1 text-[11px]' : 'px-3 py-2 text-[12px] font-medium',
+        // Density-first: active leaf gets a brand left-rail + tint (crisp
+        // selected affordance, NAMGROUP). Inactive stays quiet slate.
+        'relative block rounded-md leading-snug transition-colors',
+        isDeep ? 'px-3 py-1 text-[11px]' : 'px-3 py-1.5 text-[12px] font-medium',
         isActive
-          ? 'bg-brand-50 text-brand-700'
+          ? 'bg-brand-50 font-semibold text-brand-700 before:absolute before:inset-y-1 before:left-0 before:w-0.5 before:rounded-full before:bg-brand-600'
           : 'text-slate-600 hover:bg-slate-100 hover:text-slate-900',
       )}
     >