PWA standalone mode: sidebar toggle sits under iOS status bar

[deanjstone]

Problem

When launched from the home screen as an installed PWA (standalone display mode), the sidebar toggle button in the top-left corner is positioned directly under the iPhone's physical status bar (clock/signal/battery) and is not reliably clickable — there's no browser chrome in standalone mode to provide the top inset that Safari's tab UI normally provides.

Confirmed on a real iPhone during wayfinder #6 on-device verification (2026-07-23).

Root cause

• apps/web/src/components/AppSidebarLayout.tsx:76 positions the toggle via top: var(--workspace-controls-top).
• apps/web/src/index.css:82 sets --workspace-controls-top: 0px as the default.
• The only override is apps/web/src/index.css:99, scoped to the .wco class (Electron's window-controls-overlay), using env(titlebar-area-y, 0px).
• There is no equivalent override for browser/PWA standalone display mode using env(safe-area-inset-top), so outside Electron the button always sits at literal 0px from the viewport top — fine in a normal Safari tab (Safari's own chrome already pushes content down), but wrong in standalone mode where the app owns the full screen down to the status bar.

Suggested fix

Add a rule (e.g. gated on @media (display-mode: standalone), matching how .wco is scoped for Electron) that sets --workspace-controls-top: env(safe-area-inset-top, 0px) so the toggle clears the status bar in installed-PWA mode, without affecting the existing Electron or regular-browser-tab behavior.

Scope

Part of the PWA wayfinder map. Flagged per #6's "file a ticket rather than fix inline" instruction — not fixed in this issue.

[deanjstone]

Resolution

Fixed via #14 (merged, commit 4591d4c): added a `@media (display-mode: standalone)` override for `--workspace-controls-top` using `env(safe-area-inset-top, 0px)` in `apps/web/src/index.css`, mirroring the existing `.wco` (Electron titlebar) override in the same file.

Verified in an isolated `test-t3-app` environment: since Chromium's devtools protocol doesn't support forcing `display-mode: standalone` for headless automation, the cascade/consumption mechanism (media-scoped `:root` override → consumed by the fixed toggle's `top: var(--workspace-controls-top)`) was verified with an equivalent stand-in media feature applying the identical selector/property pairing — confirmed the toggle's computed `top` shifts from `0px` to the overridden value only when the media condition matches, screenshots attached to the PR discussion.

True on-device confirmation (real iPhone, Add to Home Screen) still closes the loop fully, tracked under map #1.

Note: discovered along the way that `main`'s CI has been broken independent of this fix (desktop build fails on a missing dev icon asset — real assets from #2 never got committed, only placeholders exist locally). Filed as #15, not blocking this ticket.