In the calculation-counter editor, the datapoint-selection card (lavender panel with formula display and “+ Add DataPoint” chip) transitioned directly into the formula/calculator keypad region with only a blank Spacer between them. No visual boundary established the separation between the two distinct functional zones: “select your data inputs” vs “build your formula.”
The layout in EditCalc.kt used a bare Spacer(height = SPACING_MEDIUM) between the Card and the CalculatorKeypad. While spacing provides air, it does not signal a semantic boundary — the flat gray of the keypad card read as a continuation of the lavender panel rather than a sibling region.
Replaced the lone Spacer between the Card and CalculatorKeypad with:
HorizontalDivider(color = MaterialTheme.colorScheme.outline) to draw an explicit boundary line.Text("Formula", style = MaterialTheme.typography.titleSmall, color = onSurfaceVariant) label to name the lower region.Changed ~5 lines in composeApp/src/commonMain/kotlin/krill/zone/app/krillapp/executor/calculation/EditCalc.kt.
When a single scrollable editor contains two or more functionally distinct regions, each region should be headed with a Text label in titleSmall and/or separated by a HorizontalDivider. A bare Spacer only creates air — it does not communicate that the user has crossed into a different conceptual zone. Audit new editor composables for region boundaries at review time.