[Hona]

Tabs stop at the +

• The tab strip had padding-inline-end: 12px. Sticky offsets respect scroll-container padding, so the sticky + stuck 12px before the clip edge and scrolled tabs showed in that gap.
• Only a 20px ::after patch on the + covered the gap. When it did not paint, the selected tab showed after the +.
• Now the strip has no end padding and the sticky + box owns the 12px, so its edge is the clip edge. The patch is gone, and the + no longer moves 8px when the strip scrolls to the end.

flowchart LR
  subgraph Before
    A[tabs] --> B["+ (sticky)"] --> C["12px padding<br/>tabs show here"] --> D[clip edge]
  end
  subgraph After
    E[tabs] --> F["+ (sticky, owns 12px)"] --> G[clip edge]
  end

Loading

Before (gap exposed)	After

Tabs share the review toggle's row

• The toggle and the panel actions used a 48px row (51px above a side dock), but the tab strip was 52px. Tabs and + sat 2px below the toggle (0.5px when stacked).
• The bar now sets one --tabs-bar-height (48px, or 51px when stacked) for the strip and the actions:

<div
  class="session-review-v2-tabs-bar sticky top-0 shrink-0 flex items-center"
  style={{ "--tabs-bar-height": props.stacked ? "51px" : "48px" }}
>

	Header	Toggle	Tabs and +
Before	53px	24px	26px
After	49px	24px	24px
After, stacked	52px (same as the dock header)	25.5px	25.5px

Before	After

• review.spec.ts now also checks that the + is centered on the toggle.

File icons keep their left edge

• File tab icons had margin-inline-start: -2px, but the tab trigger clips at its edge (overflow: hidden), so the first 2px of every file icon was cut.
• The file tab pill now has 8px start padding and the label gap is 8px, so the icon and text stay where they were, with nothing pulled past the clip.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.