UI: zebra stripes tint with pane, sit below scrollbar

- Stripes now translucent (`rgba(0,0,0,0.04)` light, `rgba(255,255,255,0.04)` dark), so the pane tint shows through and the stripe row inherits the pane's hue. Old opaque `--color-bg-stripe` covered any underlying tint.
- Tinting now actually visible: `.content`'s opaque `--color-bg-primary` was painting over `.file-pane`'s inline tint style. New `--color-pane-bg` CSS var propagates the resolved pane bg (tinted or not) to `.content`, so the bg is visible and stripes composite over it correctly.
- Dropped the `@supports not (color-mix)` and `[data-force-old-webkit]` fallback entries for `--color-bg-stripe` — the new rgba value doesn't need a fallback.
- Verified `a11y-contrast` row-state matrix still passes across every (mode × tint × variant) combo; the synthesizer already composites non-opaque stripes over the resolved pane bg.

Author: vdavid

apps/desktop/src/app.css

@@ -145,11 +145,14 @@
   --color-toast-success-bg: #f0fdf4;
 
   /* === Striped rows (zebra striping for file lists) ===
-     A tiny 4 % mix of `--color-text-primary` into the pane bg. Defined
-     against an opaque `#ffffff` base (rather than `--color-bg-primary`)
-     so the value stays stable if `--color-bg-primary` is ever swapped
-     for a translucent token in the future. */
-  --color-bg-stripe: color-mix(in oklch, #ffffff, var(--color-text-primary) 4%);
+     A faint black overlay (~4% alpha) that composites over whatever
+     pane bg sits beneath. Translucent on purpose: when a pane is
+     tinted via `appearance.tint{Local,Smb,Mtp}`, the tint shows
+     through the stripe so the zebra pattern keeps the pane's hue
+     instead of falling back to a neutral gray. The `row_state_matrix`
+     a11y synthesizer composites this over the resolved pane bg per
+     tint, so the WCAG check covers every (tint × mode) combination. */
+  --color-bg-stripe: rgba(0, 0, 0, 0.04);
 
   /* === Volume tint palette (12 hues + none) ===
      The 100% saturated swatches shown in the Settings color picker for
@@ -452,7 +455,6 @@
     --color-warning-bg-solid: #f3e5dc;
     --color-disk-ok: #74a376;
     --color-disk-warning: #e47b42;
-    --color-bg-stripe: #f6f6f6;
     --color-git-portal-subtle: rgba(13, 124, 138, 0.15);
     --color-overlay: rgba(0, 0, 0, 0.5);
     --color-overlay-light: rgba(0, 0, 0, 0.4);
@@ -484,7 +486,6 @@
   --color-warning-bg-solid: #f3e5dc;
   --color-disk-ok: #74a376;
   --color-disk-warning: #e47b42;
-  --color-bg-stripe: #f6f6f6;
   --color-git-portal-subtle: rgba(13, 124, 138, 0.15);
   --color-overlay: rgba(0, 0, 0, 0.5);
   --color-overlay-light: rgba(0, 0, 0, 0.4);
@@ -614,10 +615,9 @@
     --color-git-portal-subtle: color-mix(in oklch, var(--color-git-portal), transparent 85%);
 
     /* === Striped rows (dark) ===
-       Same logic as light mode: opaque base so striped rows are a single
-       layer that replaces the pane's translucent backdrop, not a second
-       translucent layer that doubles its alpha. */
-    --color-bg-stripe: color-mix(in oklch, #1e1e1e, var(--color-text-primary) 4%);
+       Faint white overlay (~4% alpha). Same translucent-on-tint
+       rationale as light mode: lets the pane tint show through. */
+    --color-bg-stripe: rgba(255, 255, 255, 0.04);
 
     /* === Search Highlight === */
     --color-highlight: rgba(255, 213, 100, 0.9);

apps/desktop/src/lib/file-explorer/pane/FilePane.svelte

@@ -2365,7 +2365,7 @@
     onkeydown={() => {}}
     role="region"
     aria-label="{paneId === 'left' ? 'Left' : 'Right'} file pane"
-    style={paneTintBg ? `background-color: ${paneTintBg}` : undefined}
+    style={paneTintBg ? `--color-pane-bg: ${paneTintBg}` : undefined}
     data-pane-tint={paneTintName ?? undefined}
 >
     <!-- svelte-ignore a11y_no_static_element_interactions -->
@@ -2582,6 +2582,15 @@
         display: flex;
         flex-direction: column;
         overflow: hidden;
+        /* Pane bg propagation hook. The inline style on `.file-pane`
+           overrides this with the tinted color when the user picks a
+           tint for the volume's kind; otherwise it falls back to the
+           untinted base. `.content` reads it so the bg actually paints
+           where downstream views can see it (the file-pane itself sits
+           behind .content, so an inline `background-color` here was
+           invisible). Striped rows use a translucent overlay, so the
+           tint shows through them too. */
+        --color-pane-bg: var(--color-bg-primary);
     }
 
     .header {
@@ -2642,8 +2651,10 @@
            color leaks through. Downstream views (FullList / BriefList /
            ErrorPane / …) keep their interior elements transparent so this
            stays the single base layer. Highlights (selection, cursor) sit
-           on top intentionally. */
-        background-color: var(--color-bg-primary);
+           on top intentionally. `--color-pane-bg` tracks the user's per-volume
+           tint (set inline on `.file-pane`); without a tint it resolves
+           to `--color-bg-primary`. */
+        background-color: var(--color-pane-bg);
     }
 
     .error-message {