…macOS

PR #880 declared the seam fixed ("panel border-l flush with titlebar
slot border-l, seam continuous") but a post-release regression report
showed the two border-l's are offset by 8px on macOS only.

## Root cause

`[data-component="titlebar-shell"][data-shell-os="macos"]` in
`packages/app/src/index.css` carried a symmetric `padding-inline: 8px`,
which pushed the titlebar's right rail (and therefore the tabs slot
pinned to its right edge) 8px inboard of the viewport. The right-panel
`<aside>` directly below sits in a sibling layout tree without that
padding, so its body's `border-left` reached the actual viewport edge
— the two `border-l`s ended up 8px apart, breaking the seam.

The titlebar comment in PR #880 explicitly assumed the right rail's
outer edge = viewport.right ("`pr-2` lives on `#pawwork-titlebar-right`
… so it reads as 'toggle inset from viewport edge' when closed and
'gap between toggle and tabs border-l' when open"). That assumption
was true on Windows (no equivalent padding rule) but false on macOS.

Snap target `right-panel-titlebar` was supposed to catch this — its
own comment names the seam as the contract — but the 8px x-axis offset
slipped through visual review.

## Fix

`padding-inline: 8px` → `padding-inline-start: 8px`. The toggle's
existing `pr-2` provides the closed-state inset from the viewport
edge (8px instead of 16px, which matches macOS native toolbar
conventions for the rightmost control).

## Regression test

Added `tabs slot border-l aligns horizontally with the right-panel
body border-l` to `titlebar-right-rail-contract.spec.ts`. Asserts
`|tabs.left - body.left| < 1px` (sub-pixel tolerance for Retina
rounding). Confirmed red→green: with the old `padding-inline: 8px`
the test fails with `Received: 8`; with the fix it passes.

## Verified

- `bun run test:e2e:local titlebar-right-rail-contract.spec.ts` — 4/4
  pass (including the new x-axis seam assertion)
- `bun run snap right-panel-titlebar` — passes, grid PNG shows the
  light + dark seam continuous from titlebar top to viewport bottom
- `bun run lint` — clean
- `bun --cwd packages/app run typecheck` — clean

Follow-up to PR #880, addresses the post-release regression report.

Two follow-ups to the macOS seam fix earlier in this PR, both surfaced
once the alignment seam was visibly continuous and motion against it
became readable:

## 1. Stable toggle position (replaces #880's slide)

PR #880 made the right utility toggle an in-flow flex sibling of the
titlebar tabs slot, so opening the right panel pushed the toggle left
by `--right-panel-width` over the 240ms transition. The slide read as
visually jarring once the seam was aligned and the motion became
visible against the now-continuous border-l.

Fix: `#pawwork-titlebar-right` is now absolute-positioned to the
rail's top-right corner (`right-2` on macOS, `right-0` on Windows),
so its x-coordinate stays at `viewport.right - 8px` regardless of
panel state. The tabs slot is the only flex sibling and pins to the
rail's right edge as before; the toggle visually overlaps the tabs
slot's rightmost area but in practice doesn't collide — Kobalte's
`Tabs.List` sizes to content (~150px for 1-4 chips), leaving the
trailing `+` button in the middle of the panel column with empty
space at the corner for the toggle to float in.

Regression test `right utility toggle keeps the same x-position across
open/close` in `titlebar-right-rail-contract.spec.ts`: asserts
`|toggle.right(open) - toggle.right(closed)| < 12px`. Pre-fix this
came back `Received: 229.25` (the full panel-width displacement);
post-fix it's within sub-pixel rounding.

## 2. Drag-resize seam sync

While dragging the panel resize handle, the body's `<aside>` inline
`width` snapped to each pointermove (its transition is gated on the
session-scope `props.size.active()`), but `--right-panel-width` on
the desktop shell kept its 240ms cubic-bezier transition because the
shell's gate uses `state.sizing` — a layout.tsx-local flag scoped to
the sidebar resize handler only. The two sides of the seam moved at
different speeds; one led, one trailed, visibly drifting apart.

Fix: a small effect in `SessionSidePanel` mirrors
`props.size.active()` to a `data-resizing-right-panel` attribute on
`<desktop-shell>`. A CSS rule in `index.css` matches the attribute
and disables the shell's transition while the user is dragging. This
avoids plumbing session-scope sizing state into the global layout
context — the bridge stays one attribute wide and one CSS rule
shallow. The 120ms timeout in `createSizing` re-enables the
transition shortly after the user lets go, so the open/close
animation still uses the full 240ms cubic-bezier curve.

## Verified

- `bun run test:e2e:local titlebar-right-rail-contract.spec.ts`
  — 5/5 pass (incl. the new x-position-stability assertion)
- `bun run snap right-panel-titlebar` — passes; grid PNG shows
  toggle at corner in both states, seam continuous
- `bun run lint` — clean
- `bun --cwd packages/app run typecheck` — clean
- Manual Electron verification (mac): toggle stable across open/close,
  drag-resize seam moves as one continuous line.

Three review items from the post-#887 review thread, all verified and
fixed.

## P1 — tabs slot reserves explicit right-edge for absolute toggle

Reviewer flagged: the right utility toggle is absolute-positioned over
the rightmost area of the tabs slot, while the `+` add-tab button
lives in the portalled Tabs.List. If `+` ever reaches the slot's
right edge, clicks meant for it get intercepted by the toggle's
hit-target.

Verified: today the collision doesn't happen — Kobalte's Tabs.List
renders at content-width (~150px for 1-4 chips, measured 192.5px in
DEBUG dump) instead of the `width: 100%` declared in tabs.css, so
the `+` sits ~180px clear of the toggle. But that's a CSS coincidence,
not a contract. Any future change (consumer `w-full`, tabs.css
refactor, Kobalte upgrade) makes the list fill the slot and collapses
the safety margin.

Fix: `#pawwork-titlebar-tabs` slot now declares
`padding-right: 44px` (toggle 30 + viewport inset 8 + gap 4 + 2px
buffer for Tabs.List internal `px-1`) when `tabsRailActive()`.
Physical `padding-right` matches the physical `right-2`/`right-0`
on the toggle so RTL stays consistent. The reserve makes the
no-collision guarantee independent of Tabs.List's intrinsic sizing.

Title comment block on the slot rewritten to explain the reserve
instead of the CSS-coincidence it replaces.

## P2 — sizing effect no longer leaks data-resizing-right-panel

Reviewer flagged: the effect that mirrors `props.size.active()` to
`data-resizing-right-panel` early-returns on `!isDesktop()` without
removing the attribute, and has no `onCleanup` to remove it on
unmount. Because the CSS rule that reads the attribute uses
`transition: none !important`, a leak would silently kill the
shell's open/close transitions until the next page load.

Three leak paths closed:
1. `isDesktop()` flips false mid-drag — effect now always
   `removeAttribute` first, then optionally re-sets only when
   desktop AND active. Early-return after the cleanup is safe.
2. Component unmounts with active=true (navigation away from
   session) — `onCleanup` always removes the attribute regardless
   of state.
3. Stale attribute from previous instance — same "always clear
   first" pattern handles this too.

Did NOT take reviewer's "more optimal: use layout state instead of
querySelector global DOM" because lifting session-scope sizing into
the layout context expands this hotfix PR into a refactor; tracked
separately (see future follow-up).

## P3 — tests now cover the user-visible "+" contract

Reviewer flagged: the existing toggle-position test asserted only
that the toggle exists, not that `+` is clickable; the test comment
claimed "open/closed are two DOM nodes" but the actual implementation
keeps one node and absolute-positions its container; `waitForTimeout(300)`
is brittle.

Fixed:
- Toggle-position test comment rewritten — explicitly notes one DOM
  node, absolute-positioned, so pre/post toggle.right are pixel-
  identical (tolerance tightened from 12px to 1px).
- `waitForTimeout(300)` replaced with `expect.poll` for
  toggle-right stability (two consecutive reads within sub-pixel).
- New test `+ add-tab button stays clickable and does not close
  the panel`: clicks `+`, asserts panel stays open AND dropdown
  menu opens. Uses raw `page.locator` instead of `getByRole` for
  the toggle check because Kobalte's DropdownMenu marks the rest
  of the page `inert` while open and `getByRole` filters it.
- New test `+ stays clickable even if Tabs.List is forced to fill
  the slot (collision guard)`: runtime-injects
  `[data-slot="tabs-list"] { width: 100% !important }` via
  `page.addStyleTag`, then asserts (a) plus.right < toggle.left
  geometrically and (b) the click still opens dropdown without
  closing panel. This is the fortification test that proves the P1
  reserve actually protects against the future-CSS scenario.
- New test `data-resizing-right-panel attribute does not leak when
  viewport drops below the desktop breakpoint mid-resize state`:
  manually sets the attribute, flips viewport below 768px,
  asserts attribute is removed. Pins the P2 cleanup contract.

## Verified

- `bun run test:e2e:local titlebar-right-rail-contract.spec.ts`
  — 8/8 pass (3 original + 1 from earlier #887 work + 1 toggle-position
  + 2 "+" overlap + 1 P2 leak)
- `bun run snap right-panel-titlebar` — grid PNG unchanged
  (padding-end reserve is invisible because content fits well within
  the available space)
- `bun run lint` — clean
- `bun --cwd packages/app run typecheck` — clean

Toggle moved to absolute right-2 in this PR; the closed-state inset
comment still pointed at the removed pr-2 utility.

- x-axis seam test: poll for steady state instead of reading
  immediately after open. Panel aside width and shell
  --right-panel-width both run 240ms transitions on panel open/close,
  and data-resizing-right-panel only gates drag, so mid-flight
  sub-pixel drift could bust the <1px tolerance.

- toggle x-position test: normalize aria-expanded to false before
  sampling the closed state, instead of relying on the e2e harness
  default. Same lookup uses page.locator (DropdownMenu marks the rest
  inert when open, breaking getByRole).