feat(platform-web): full-width console lists/overviews + consistent New version buttons (#35)

- Widen console list/overview pages to full width (agreements, services,
  reports/submissions/team ListPage, doc-types, console + admin overview)
- Service detail: move version-creation button right of the version picker
  (ungrouped) and rename to New version
- Match New version button styling across service-detail, agreement-detail
  and admin document-type detail

Author: sidmclaughlin

apps/platform-web/src/components/admin/document-types/admin-document-type-detail.tsx

@@ -73,7 +73,7 @@ export function AdminDocumentTypeDetail() {
         </div>
         <Button size="sm" type="button" disabled={add.isPending} onClick={() => add.mutate()}>
           <Plus className="size-4" aria-hidden />
-          Add version
+          New version
         </Button>
       </div>
 

apps/platform-web/src/components/admin/document-types/admin-document-types-list.tsx

@@ -23,7 +23,7 @@ export function AdminDocumentTypesList() {
   const { data: items = [] } = useQuery(adminDocumentTypesQueryOptions());
 
   return (
-    <div className="mx-auto flex max-w-[1320px] flex-col gap-4">
+    <div className="flex flex-col gap-4">
       <span className="text-sm text-muted-foreground">
         The document type catalog. Open a type to manage its versions.
       </span>

apps/platform-web/src/components/admin/pages/admin-overview.tsx

@@ -3,7 +3,7 @@ import { Info } from 'lucide-react';
 /** Admin overview — placeholder until the dashboard is defined. */
 export function AdminOverview() {
   return (
-    <div className="mx-auto flex max-w-[1320px] flex-col gap-4">
+    <div className="flex flex-col gap-4">
       <div className="flex items-center gap-2.5 rounded-xl border border-dashed border-border bg-card px-3.5 py-2.5 text-sm text-muted-foreground">
         <Info className="size-4 shrink-0" aria-hidden />
         Platform administration — the admin overview is being set up.

apps/platform-web/src/components/console/list-page.tsx

@@ -36,7 +36,7 @@ export function ListPage({
   children,
 }: ListPageProps) {
   return (
-    <div className="mx-auto flex max-w-[1320px] flex-col gap-4">
+    <div className="flex flex-col gap-4">
       {toolbar || actions ? (
         <div className="flex items-center justify-between gap-3">
           <div className="flex items-center gap-2">{toolbar}</div>

apps/platform-web/src/components/console/pages/overview.tsx

@@ -8,7 +8,7 @@ import { Info } from 'lucide-react';
  */
 export function OverviewPage() {
   return (
-    <div className="mx-auto flex max-w-[1320px] flex-col gap-4">
+    <div className="flex flex-col gap-4">
       <div className="flex items-center gap-2.5 rounded-xl border border-dashed border-border bg-card px-3.5 py-2.5 text-sm text-muted-foreground">
         <Info className="size-4 shrink-0" aria-hidden />
         Overview is being set up — placeholder layout shown until you choose what to track.

apps/platform-web/src/components/console/service-agreements/agreement-detail.tsx

@@ -9,7 +9,7 @@ import {
 import { Spinner } from '@repo/ui/spinner';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { Link } from '@tanstack/react-router';
-import { ChevronDown } from 'lucide-react';
+import { ChevronDown, Pencil } from 'lucide-react';
 import { useEffect, useState } from 'react';
 import { UnsavedChangesGuard } from '@/components/console/unsaved-changes-guard';
 import { useAuth } from '@/lib/auth';
@@ -134,13 +134,8 @@ function AgreementBody({
           {isGlobal ? <Badge color="grey">Global</Badge> : null}
           <VersionPicker versions={versions} selectedId={selectedId} onSelect={setSelectedId} />
           {latestPublished && editableContext(isGlobal, isAdmin) ? (
-            <Button
-              size="sm"
-              variant="outline"
-              type="button"
-              disabled={busy}
-              onClick={() => newVersion.mutate()}
-            >
+            <Button size="sm" type="button" disabled={busy} onClick={() => newVersion.mutate()}>
+              <Pencil className="size-4" aria-hidden />
               New version
             </Button>
           ) : null}

apps/platform-web/src/components/console/service-agreements/agreements-list.tsx

@@ -31,7 +31,7 @@ export function AgreementsList({ scope }: { scope: AgreementScope }) {
   };
 
   return (
-    <div className="mx-auto flex max-w-[1320px] flex-col gap-4">
+    <div className="flex flex-col gap-4">
       <div className="flex items-center justify-between gap-3">
         <span className="text-sm text-muted-foreground">
           {scope.kind === 'admin'

apps/platform-web/src/components/console/services/service-detail.tsx

@@ -250,25 +250,25 @@ export function ServiceDetail({
           </>
         )}
         <ButtonGroup>
-          {/* Current + published → start a new draft to edit; mutually exclusive with Go to current. */}
-          {isLatest && latest?.status === 'published' ? (
-            <Button
-              size="sm"
-              type="button"
-              disabled={addVersion.isPending}
-              onClick={() => addVersion.mutate()}
-            >
-              <Pencil className="size-4" aria-hidden />
-              Edit service details
-            </Button>
-          ) : null}
           {!isLatest && latest ? (
             <Button size="sm" variant="outline" type="button" onClick={goToCurrent}>
               Go to current
             </Button>
           ) : null}
           <VersionPicker versions={versions} selectedId={selected.id} onSelect={goToVersion} />
         </ButtonGroup>
+        {/* Current + published → start a new draft version; sits to the right of the version picker. */}
+        {isLatest && latest?.status === 'published' ? (
+          <Button
+            size="sm"
+            type="button"
+            disabled={addVersion.isPending}
+            onClick={() => addVersion.mutate()}
+          >
+            <Pencil className="size-4" aria-hidden />
+            New version
+          </Button>
+        ) : null}
         <ServiceMenu
           serviceId={id}
           versionId={selected.id}

apps/platform-web/src/components/console/services/services-list.tsx

@@ -27,7 +27,7 @@ export function ServicesList() {
   });
 
   return (
-    <div className="mx-auto flex max-w-[1320px] flex-col gap-4">
+    <div className="flex flex-col gap-4">
       <div className="flex items-center justify-between gap-3">
         <span className="text-sm text-muted-foreground">Service documents in this workspace.</span>
         <Button