fix: stop leaking CSS rules from dynamic UI styles (#1084) (#1103)

* fix: stop leaking CSS rules from dynamic position styles

* Fix floating surfaces on web

* Stop diff controls growing Unistyles rules

* Use inline style escape hatch in diff pane

* Centralize dynamic style escape hatches

* Restore startup workspace navigation

* Upgrade Unistyles for web cleanup fix

* Update review style test for inline styles

* Use redirect for startup workspace restore

* Update startup redirect test

packages/app/src/review/surface.test.tsx

@@ -3,6 +3,7 @@ import "@/test/window-local-storage";
 import { act, fireEvent, render, renderHook, cleanup } from "@testing-library/react";
 import React from "react";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { inlineUnistylesStyle } from "@/styles/unistyles-inline-style";
 import { useReviewDraftStore, type ReviewDraftComment } from "./store";
 import { buildReviewableDiffTargetKey, type ReviewableDiffTarget } from "@/utils/diff-layout";
 import {
@@ -275,7 +276,7 @@ describe("git diff inline review helpers", () => {
         viewportWidth: 320,
         pinToViewport: true,
       }),
-    ).toEqual([{ position: "sticky", left: 0 }, { width: 320 }]);
+    ).toEqual([{ position: "sticky", left: 0 }, inlineUnistylesStyle({ width: 320 })]);
   });
 
   it("keeps the gutter add-comment target accessible and clicking opens the editor", () => {

packages/app/src/review/surface.tsx

@@ -15,6 +15,7 @@ import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { Button } from "@/components/ui/button";
 import { Shortcut } from "@/components/ui/shortcut";
 import { isWeb } from "@/constants/platform";
+import { inlineUnistylesStyle } from "@/styles/unistyles-inline-style";
 import type { ShortcutKey } from "@/utils/format-shortcut";
 import { useWorkspaceFocusRestoration } from "@/workspace/focus";
 import { useReviewDraftComments, useReviewDraftStore, type ReviewDraftComment } from "./store";
@@ -391,7 +392,7 @@ export function InlineReviewThread({
     () => [
       styles.threadContainer,
       getInlineReviewThreadViewportStyle({ viewportWidth, pinToViewport }),
-      { minHeight: height },
+      inlineUnistylesStyle({ minHeight: height }),
     ],
     [viewportWidth, pinToViewport, height],
   );
@@ -478,7 +479,8 @@ export function getInlineReviewThreadViewportStyle({
   viewportWidth?: number;
   pinToViewport: boolean;
 }): StyleProp<ViewStyle> {
-  const widthStyle = viewportWidth && viewportWidth > 0 ? { width: viewportWidth } : null;
+  const widthStyle =
+    viewportWidth && viewportWidth > 0 ? inlineUnistylesStyle({ width: viewportWidth }) : null;
   if (!pinToViewport || !isWeb) {
     return widthStyle;
   }