fix(mobile): align the Home brand mark with the page leading edge

[iscekic]

Changelog for users

• The Home screen's Kilo mark now shares the same left edge as the LIVE NOW label, the session card, and the two action buttons.
• In landscape, the Home body stays clear of the device's side cutout instead of sliding underneath the sensor.
• Portrait Home keeps its existing spacing, because zero side insets add no padding.

Changelog for maintainers

• Home now reads the safe-area insets and wraps its body in a view that turns non-zero left and right insets into padding.
• The header already cleared those insets, so the brand mark and the body now clear the same sensor by the same amount.
• The header gutter dropped from a header-only 22px inset to the page gutter the sections, cards, and actions use.
• The centered feedback body gets the same wrapper, so the error and empty feedback states share the leading edge.
• Zero side insets collapse the wrapper style to a no-op, so portrait geometry is unchanged.
• Review the mounted tests first: they fake the insets and assert the logo, sections, cards, and actions share one leading edge.
• The non-mounted Home test now mocks the safe-area context, because the screen calls the insets hook.

E2E proof

[e2] Rotate Home portrait -> landscape -> portrait: the logo stays on the page gutter and the body keeps the same leading edge in both orientations, with no jump, blank or duplicate loading indicator… — android emulator-5604: frames go 1080x2400 -> 2400x1080 -> 1080x2400 and the measured leading edge is identical across the swap — logo mark x=55..123 in both legs, primary action button x=37 in both legs, LIVE NOW row x=39 in both legs (e2-geometry.log lines 54-58); the portrait uiautomator digest puts the logo element [37,149] on the same gutter as LIVE NOW [36,282], buttons [37,660] and EXPLORE [36,946] with no loading/ActivityIndicator row (e2-portrait.digest), and every leg lists one header, one session card and one pair of action buttons with no blank frame (e2-rotation.digest); captures…

[e1] landscape Home, dark, live session — brand mark on the page leading edge — Android emulator-5554 in dark mode (e1-dark-mode.log: 'RadioButton "Dark" [checked]'), default account with live session ses_f4476a6f5ffeuPIkCY891DyLTh set to permission via needs-input.sh; rotated landscape (e1-orientation.log: 'orientation landscape', capture 2400x1080) and Home rendered the header brand mark, 'LIVE NOW', the card 'NEEDS INPUT' and 'New coding task' / 'New task from a picture' (e1-digest.log); the logo-vs-label/card/button alignment and sensor clearance are visual claims owned by the visual reviewer, not judged here; no behavioral error observed.

[e3] landscape Home, dark, live section in accepted empty state — Android emulator-5554 in dark mode, signed out then signed in as a fresh empty account (e3-login-empty.log: '==> signed in as e2e-empty-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25@example.com (otp)'); rotated landscape (capture 2400x1080) and Home rendered the empty live card 'Nothing running right now' plus the brand mark and both action buttons (e3-digest.log); default account restored via login.sh (e3-login-default.log); alignment/sensor clearance left to the visual reviewer; no behavioral error observed.

[e2] Rotate Home portrait -> landscape -> portrait: the logo stays on the page gutter and the body keeps the same leading edge in both orientations, with no jump, blank or duplicate loading indicator…

[e2] Rotate Home portrait -> landscape -> portrait: the logo stays on the page gutter and the body keeps the same leading edge in both orientations, with no jump, blank or duplicate loading indicator…

E2E proof — log excerpts

[e1] landscape Home, dark, live session — brand mark on the page leading edge -> pass :: Android emulator-5554 in dark mode (e1-dark-mode.log: 'RadioButton "Dark" [checked]'), default account with live session ses_f4476a6f5ffeuPIkCY891DyLTh set to permission via needs-input.sh; rotated landscape (e1-orientation.log: 'orientation landscape', capture 2400x1080) and Home rendered the header brand mark, 'LIVE NOW', the card 'NEEDS INPUT' and 'New coding task' / 'New task from a picture' (e1-digest.log); the logo-vs-label/card/button alignment and sensor clearance are visual claims owned by the visual reviewer, not judged here; no behavioral error observed.
[e3] landscape Home, dark, live section in accepted empty state -> pass :: Android emulator-5554 in dark mode, signed out then signed in as a fresh empty account (e3-login-empty.log: '==> signed in as e2e-empty-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25@example.com (otp)'); rotated landscape (capture 2400x1080) and Home rendered the empty live card 'Nothing running right now' plus the brand mark and both action buttons (e3-digest.log); default account restored via login.sh (e3-login-default.log); alignment/sensor clearance left to the visual reviewer; no behavioral error observed.
[e2] Rotate Home portrait -> landscape -> portrait: the logo stays on the page g -> pass :: android emulator-5604: frames go 1080x2400 -> 2400x1080 -> 1080x2400 and the measured leading edge is identical across the swap — logo mark x=55..123 in both legs, primary action button x=37 in both legs, LIVE NOW row x=39 in both legs (e2-geometry.log lines 54-58); the portrait uiautomator digest puts the logo element [37,149] on the same gutter as LIVE NOW [36,282], buttons [37,660] and EXPLORE [36,946] with no loading/ActivityIndicator row (e2-portrait.digest), and every leg lists one header, one session card and one pair of action buttons with no blank frame (e2-rotation.digest); captures for the visual reviewer: e2-portrait.png, e2-landscape.png, e2-portrait-return.png. Landscape side i

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e1-dark-mode.log

# Source: sim MCP a11y snapshot of the live device, 2026-09-19 (portrait).
# The Dark radio is the selected appearance, so the app renders in dark mode.
Button "Go back"
android.view.View "Preferences"
Button "General"
TextView "General"
Button "Voice input, Transcribe voice input with a Kilo gateway model instead of the device's speech recognition. Your recording is sent to the Kilo gateway."
TextView "Voice input"
Button "Translate tool summaries, Send each tool summary to a model to translate it into your app language. The original is shown if translation fails."
TextView "Translate tool summaries"
TextView "APPEARANCE"
android.view.View "Appearance"
RadioButton "System"
TextView "System"
RadioButton "Light"
TextView "Light"
RadioButton "Dark" [checked]
TextView "Dark"
TextView "FEATURE FLAGS"
TextView "mobile-pr-review"
TextView "Enabled · default · not loaded"
TextView "mobile-quick-chat"
TextView "Off · default · not loaded"
TextView "v1.0.11"

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e1-orientation.log

# e1/e3 orientation proof — android emulator-5554 (appium do rotate)
orientation landscape
orientation portrait
# capture dimensions (landscape): e1-landscape-home-live.png 2400x1080; e3-landscape-home-empty.png 2400x1080

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e1-digest.log

# Account: e2e-mobile-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25-android@example.com
# Live session ses_f4476a6f5ffeuPIkCY891DyLTh, status set to permission via needs-input.sh.
# Source: sim MCP a11y snapshot of the live device, 2026-09-19 (after rotate landscape).
# Header brand mark + LIVE NOW + session card + both action buttons are on screen.
android.view.View "Kilo"
TextView "LIVE NOW"
Button "See all"
TextView "SEE ALL"
Button "New session - 2026-09-19T21:18:55.754Z, needs input, kwf/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25, and CLOUD"
TextView "CLOUD"
TextView "NEEDS INPUT"
TextView "New session - 2026-09-19T21:18:55.754Z"
TextView "kwf/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25"
Button "New coding task"
TextView "New coding task"
Button "New task from a picture"
TextView "New task from a picture"
android.view.View "Home, tab, 1 of 3" [checked]
TextView "HOME" [checked]
android.view.View "Agents, 1 needs input, tab, 2 of 3"
TextView "1"
TextView "AGENTS"
android.view.View "Profile, tab, 3 of 3"
TextView "PROFILE"

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e3-login-empty.log

device-state: android emulator-5554 is in the known state
Launch resource ready for android: HTTP 200, 66201682 bytes, 0.653522s
adb-reverse-env: emulator-5554 reversed 7 port(s)
Warning: Activity not started, intent has been delivered to currently running top-most instance.
Mobile E2E preflight passed for android device emulator-5554 in /home/igor_kilocode_ai/.local/share/kwf/wt/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25 (http://127.0.0.1:8281)
login.sh: phase=outbox-snapshot t=1789853156
==> signing out and requesting sign-in code for e2e-empty-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25@example.com
WAIT OK services mobile nextjs cloudflare-session-ingest 2s
device-state: android emulator-5554 is in the known state
Launch resource ready for android: HTTP 200, 66202182 bytes, 0.693636s
adb-reverse-env: emulator-5554 reversed 7 port(s)
Warning: Activity not started, intent has been delivered to currently running top-most instance.
Mobile E2E preflight passed for android device emulator-5554 in /home/igor_kilocode_ai/.local/share/kwf/wt/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25 (http://127.0.0.1:8281)
FLOW OK logout.js (android emulator-5554)
login.sh: phase=request-code t=1789853241
FLOW OK login-request-code.js (android emulator-5554)
login.sh: phase=outbox-delivery t=1789853287
==> verifying sign-in code
login.sh: phase=verify-code t=1789853292
FLOW OK login-verify-code.js (android emulator-5554)
FLOW OK dismiss-dialogs.js (android emulator-5554)
login.sh: phase=account-fixtures t=1789853350
login.sh: phase=report-result t=1789853354
==> signed in as e2e-empty-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25@example.com (otp)

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e3-digest.log

# e3 digest — Android emulator-5554, landscape, dark mode, Home tab, live section EMPTY.
# Account: e2e-empty-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25@example.com
# Source: sim MCP a11y snapshot of the live device, 2026-09-19 (after rotate landscape).
# The empty live card, the header brand mark and both action buttons are on screen.
android.view.View "Kilo"
TextView "LIVE NOW"
Button "See all"
TextView "SEE ALL"
TextView "Nothing running right now"
Button "New coding task"
TextView "New coding task"
Button "New task from a picture"
TextView "New task from a picture"
TextView "EXPLORE"
android.view.View "Home, tab, 1 of 3" [checked]
TextView "HOME" [checked]
android.view.View "Agents, tab, 2 of 3"
TextView "AGENTS"
android.view.View "Profile, tab, 3 of 3"
TextView "PROFILE"

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e3-login-default.log

Warning: Activity not started, intent has been delivered to currently running top-most instance.
Mobile E2E preflight passed for android device emulator-5554 in /home/igor_kilocode_ai/.local/share/kwf/wt/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25 (http://127.0.0.1:8281)
login.sh: phase=outbox-snapshot t=1789853446
==> signing out and requesting sign-in code for e2e-mobile-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25-android@example.com
WAIT OK services mobile nextjs cloudflare-session-ingest 2s
device-state: android emulator-5554 is in the known state
Launch resource ready for android: HTTP 200, 66203182 bytes, 0.688582s
adb-reverse-env: emulator-5554 reversed 7 port(s)
Warning: Activity not started, intent has been delivered to currently running top-most instance.
Mobile E2E preflight passed for android device emulator-5554 in /home/igor_kilocode_ai/.local/share/kwf/wt/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25 (http://127.0.0.1:8281)
appium.sh: cleared 1 stale session(s) on emulator-5554 before the flow
FLOW OK logout.js (android emulator-5554)
app process is gone after the launch (dev-launcher crash); cold relaunch (1/1)
cold launch through the dev-client link
login.sh: phase=request-code t=1789853573
FLOW OK login-request-code.js (android emulator-5554)
login.sh: phase=outbox-delivery t=1789853620
==> verifying sign-in code
login.sh: phase=verify-code t=1789853624
FLOW OK login-verify-code.js (android emulator-5554)
FLOW OK dismiss-dialogs.js (android emulator-5554)
login.sh: phase=account-fixtures t=1789853674
login.sh: phase=report-result t=1789853678
==> signed in as e2e-mobile-explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25-android@example.com (otp)

/home/igor_kilocode_ai/.local/share/kwf/sections/explorer-startup-landscape-the-kilo-logo-is-inset-45pt-in-dc00d-9c25/e2e-mobile-app/e2-geometry.log

   rows 450-472: x 90..678
   rows 500-525: x 90..945
   rows 541-559: x 90..487
   rows 660-775: x 37..1042
   rows 955-973: x 39..169
   rows 1056-1089: x 87..1002
   rows 1381-1414: x 87..1002
   rows 2234-2267: x 156..920
   rows 2290-2310: x 148..959
e2-landscape.png: dark rows in x[40,160): [[18, 43], [102, 131], [141, 170], [226, 244], [385, 407], [435, 460], [558, 673]]
   rows 18-43: x 84..2233
   rows 102-131: x 55..123
   rows 141-170: x 55..123
   rows 226-244: x 39..2233
   rows 385-407: x 90..678
   rows 435-460: x 90..1349
   rows 558-673: x 37..2234
# SUMMARY e2 rotation (android emulator-5604)
# portrait frame  e2-portrait-return.png -> (1080, 2400)
# landscape frame e2-landscape.png       -> (2400, 1080)
# header logo glyph left edge:  portrait x=55  landscape x=55  (rows 167-235 vs 102-170, x 55..123 both)
# body leading edge (dark primary button):  portrait x=37  landscape x=37
# body label row band (LIVE NOW + SEE ALL) leftmost dark:  portrait x=39  landscape x=39
# primary dark button bands: portrait 1 (rows 660-775 x 37..1042); landscape 1 (rows 558-673 x 37..2234)

Owner request

Explorer finding: startup-landscape: The Kilo logo is inset ~45pt inside the left edge used by the LIVE NOW label, the session card and the two action buttons, so the brand mark floats out of the page's leading alignment.

The user-agent explorer found this while using the app like a user.
One finding per item; the explorer never edits product code.

Flow: startup-landscape
Found on revision: 59ef790

Repro:

1. set this state first: account e2e-mobile-cloud-android@example.com signed in, $25 credits, a second organization, 4 Code Reviewer pull requests, one top-level session permission (ses_...), system night mode, device landscape.; the device in dark mode
2. open the app on emulator-5554
3. reach the screen the capture names (startup-landscape)
4. the capture shows the defect named below

Observed: The Kilo logo is inset ~45pt inside the left edge used by the LIVE NOW label, the session card and the two action buttons, so the brand mark floats out of the page's leading alignment.
Expected: the screen renders without this defect

Evidence (from the device run):

Follow-ups (not changed here)

• not proved live: Landscape with the live section in its accepted empty state: the empty 'Nothing running right now' card, the logo and the two action buttons still share one left edge and clear the sensor. (no capture cited it)
• not proved live: On the built app on emulator-5554, dark mode, signed in with a live session, rotate to landscape and open Home: the Kilo logo's left edge lines up with the LIVE NOW label, the session card's left border and both action buttons, and no page content sits under the left sensor/cutout area. (no capture cited it)

Open findings (not fixed here)

• not proved live: startup-landscape.png is no longer on the host that took it, so no publish can carry it

[kilo-code-bot]

Code Review Summary

Status: No Issues Found | Recommendation: Merge

Executive Summary

The Home body now shares the useSideInsetStyle landscape-inset hook with ScreenHeader, and the sign-out confirmation was extracted into useSignOutConfirmation; the changed code and its test mocks are consistent and I found no defects.

Files Reviewed (10 files)

• apps/mobile/src/components/agents/new-session-configure-form.test.ts
• apps/mobile/src/components/agents/session-list-header-actions.mounted.test.tsx
• apps/mobile/src/components/home/home-screen.mounted.test.tsx
• apps/mobile/src/components/home/home-screen.test.ts
• apps/mobile/src/components/home/home-screen.tsx
• apps/mobile/src/components/profile-screen.signout.mounted.test.tsx
• apps/mobile/src/components/profile-screen.tsx
• apps/mobile/src/components/screen-header.tsx
• apps/mobile/src/components/use-sign-out-confirmation.ts
• apps/mobile/src/lib/screen-insets.ts

Previous Review Summaries (2 snapshots, latest commit 63d5ddd)

Current summary above is authoritative. Previous snapshots are kept for context only.

Previous review (commit 63d5ddd)

Status: No Issues Found | Recommendation: Merge

Executive Summary

The landscape side-inset logic is now a single shared useSideInsetStyle hook consumed by both the HomeScreen body wrapper and ScreenHeader, and the Home header gutter moved to the page gutter (px-4); the changed code is consistent and I found no defects.

Files Reviewed (5 files)

• apps/mobile/src/lib/screen-insets.ts
• apps/mobile/src/components/screen-header.tsx
• apps/mobile/src/components/home/home-screen.tsx
• apps/mobile/src/components/home/home-screen.mounted.test.tsx
• apps/mobile/src/components/home/home-screen.test.ts

Previous review (commit d017b2f)

Status: No Issues Found | Recommendation: Merge

The Home body wrapper now applies the landscape side safe-area insets (paddingLeft/paddingRight) only when non-zero, and the header gutter changed from px-[22px] to the page gutter px-4. Header content lands at inset + 16 and the body sections/cards/actions at inset + 16 (their mx-4/px-4), so the brand mark and the body share one leading edge; portrait stays a no-op because zero insets leave the wrapper style undefined. The inline inset style matches the established ScreenHeader/sheet-header pattern, and no other tests render HomeScreen without the safe-area mock.

Files Reviewed (3 files)

• apps/mobile/src/components/home/home-screen.tsx
• apps/mobile/src/components/home/home-screen.mounted.test.tsx
• apps/mobile/src/components/home/home-screen.test.ts

---

_{Reviewed by deepseek-v4.1-flash · Input: 0 · Output: 0 · Cached: 0}

_{Review guidance: REVIEW.md from base branch main}

[iscekic]

bot: Cross-platform fix. Pushed 63d5ddd (kwf kwf-fix-platform-afec).

What changed:

• Home and the shared header now take their landscape side padding from one helper, so their leading edges can no longer drift apart.
• The helper serves iOS and Android with a single implementation; its comment names both cutout capabilities and no caller branches on the platform.
• Start the review at the new helper in the screen-insets module, beside the existing bottom-inset helper.
• Non-zero side insets become inner padding; zero insets return undefined, so portrait geometry is unchanged.
• The padding stays on an inner wrapper rather than the px-4/mx-4 gutter, because an inline padding on the gutter would beat the className and swallow it.
• The same wrapper covers the centered feedback state, so the empty and error bodies share the page leading edge.
• A mounted Home test re-renders with the platform flipped from iOS to Android and asserts the side-inset styles match, so a reintroduced platform branch fails it.
• The test's platform mock is a getter, so it can flip the platform without re-importing the module.

[iscekic]

This description names a scenario the proof did not capture:

• not proved live: Landscape with the live section in its accepted empty state: the empty 'Nothing running right now' card, the logo and the two action buttons still share one left edge and clear the sensor. (no capture cited it)

A repeated proof run rebuilds the same evidence, so no proof run is dispatched for a named gap. Merging with this gap open is your decision.

[eshurakov]

Approved after a shallow triage pass. No blocking findings.