lilia-app-designlisted

# Lilia App Design ## Core Direction Design the app as a restrained engineering tool. Prioritize clear position, current state, available actions, and decisions that need user attention. Every main view must answer: - Where am I? - What is the current state? - Does the user need to act? Never show technical implementation notes, roadmap placeholders, or UI that looks functional but is not wired to real behavior. Sidebar items, buttons, menu entries, disabled controls, and status surfaces must represent actual reachable state or real unavailable state. ## Layout: use Stack presets, never hand-written layout fields The desktop is a NanaUI retained tree (`apps/desktop/src/desktop.rs` + `runtime_shell.rs`). There is no CSS. Vertical stacking is the layout engine default; a horizontal row only exists if you ask for it. - Compose rows with the `Stack` presets from `nana-ui::runtime::Stack`: `row` (toolbar, shrink to content), `fill_row` (span leftover width), `bar` (full-width, no grow: top/bottom bars), `column` (vertical, height from content), `fill_column` (main content area: fill leftover height, grow 1, shrink 1). - The most common composition bug: using `column` where `fill_column` is needed — the main pane stops stretching and bottom composers stop hugging the bottom. Main content areas and composer-pane bodies use `fill_column`. - `apps/desktop/src/runtime_layout.rs` is the app-shell composition idiom built on these presets; its `reconcile_children` pattern is how o