From 5c67f1e2e06ea53262a6f6e193ef570eb303f772 Mon Sep 17 00:00:00 2001
From: josh <josh@thewrightserver.net>
Date: Thu, 7 May 2026 21:31:35 -0400
Subject: [PATCH] Match custody view layout to inventory view pattern

Use responsive clamped padding, full-width maxWidth, and even column
proportions so the page fills available space consistently with other
tabs.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 web/src/views/CustodyView.tsx | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/web/src/views/CustodyView.tsx b/web/src/views/CustodyView.tsx
index d75d510..7d7aad0 100644
--- a/web/src/views/CustodyView.tsx
+++ b/web/src/views/CustodyView.tsx
@@ -5,6 +5,8 @@ import { remainingShort } from "../stats.js";
 import { fmt, TYPE_GLYPHS } from "../format.js";
 import { Btn, Card, Icon } from "../components/primitives/index.js";
 
+const GRID_COLS = "32px 2fr 1fr 1fr 1fr 280px";
+
 export function CustodyView({
   data,
   onSelectItem,
@@ -32,17 +34,23 @@ export function CustodyView({
   );
 
   return (
-    <div style={{ padding: "40px 48px", maxWidth: 1200 }}>
-      <div style={{ marginBottom: 32 }}>
+    <div
+      style={{
+        padding: "clamp(32px, 3vw, 64px) clamp(40px, 3vw, 80px) 80px",
+        maxWidth: 2400,
+        margin: "0 auto",
+      }}
+    >
+      <div style={{ marginBottom: 24 }}>
+        <div className="smallcaps" style={{ color: "var(--ink-3)" }}>
+          {checkedOut.length} item{checkedOut.length === 1 ? "" : "s"} checked out
+        </div>
         <h1
           className="serif"
-          style={{ fontSize: 44, margin: 0, fontWeight: 500, letterSpacing: "-0.02em" }}
+          style={{ fontSize: 44, margin: "6px 0 0", fontWeight: 500, letterSpacing: "-0.02em" }}
         >
           My Custody
         </h1>
-        <div style={{ fontSize: 13, color: "var(--ink-3)", marginTop: 6 }}>
-          {checkedOut.length} item{checkedOut.length === 1 ? "" : "s"} checked out
-        </div>
       </div>
 
       {checkedOut.length === 0 ? (
@@ -69,7 +77,7 @@ export function CustodyView({
           <div
             style={{
               display: "grid",
-              gridTemplateColumns: "32px 2fr 1fr 0.8fr 0.8fr 260px",
+              gridTemplateColumns: GRID_COLS,
               padding: "10px 16px",
               fontSize: 11,
               color: "var(--ink-3)",
@@ -125,7 +133,7 @@ function CustodyRow({
     <div
       style={{
         display: "grid",
-        gridTemplateColumns: "32px 2fr 1fr 0.8fr 0.8fr 260px",
+        gridTemplateColumns: GRID_COLS,
         padding: "12px 16px",
         alignItems: "center",
         borderBottom: "1px solid var(--line)",