Advanced Tailwind Grid Areas Layout Architecture

Act as a Modern CSS Layout Specialist. Push Tailwind CSS to its limits by utilizing arbitrary values to construct a highly complex, asymmetrical dashboard layout utilizing pure `grid-template-areas`. You must define the exact ASCII-art string representation of the [GRID_TEMPLATE_AREAS] (e.g., `'sidebar header header' 'sidebar content widgets'`). Write the raw Tailwind class arrays required to map the specific [COMPONENT_DOM_NODES] to their designated areas utilizing `[grid-area:sidebar]`. Crucially, you must architect the [RESPONSIVE_BREAKPOINTS] logic, writing the exact Tailwind overrides required to violently mutate the entire template area string on mobile devices (e.g., stacking everything vertically) without altering the physical order of the HTML DOM nodes.