Standardize border radius to rounded-md across all route components

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/arc-web/app/routes/pipelines.tsx

@@ -81,7 +81,7 @@ function PrCard({
   actions?: string[];
 }) {
   return (
-    <Link to={`/runs/${pr.id}`} className="group block rounded-lg border border-white/[0.06] bg-navy-800/80 p-4 transition-all duration-200 hover:border-white/[0.12] hover:bg-navy-800 hover:shadow-lg hover:shadow-black/20">
+    <Link to={`/runs/${pr.id}`} className="group block rounded-md border border-white/[0.06] bg-navy-800/80 p-4 transition-all duration-200 hover:border-white/[0.12] hover:bg-navy-800 hover:shadow-lg hover:shadow-black/20">
       <div className="mb-2 flex items-center gap-1.5">
         <Icon className={`size-3.5 shrink-0 ${iconColor}`} />
         <span className="font-mono text-xs font-medium text-teal-500">

apps/arc-web/app/routes/run-overview.tsx

@@ -318,7 +318,7 @@ export default function RunOverview() {
 
       <div className="min-w-0 flex-1">
         {workflow ? (
-          <div className="rounded-lg border border-white/[0.06] bg-navy-900/40 overflow-hidden">
+          <div className="rounded-md border border-white/[0.06] bg-navy-900/40 overflow-hidden">
             <DotDiagram dot={workflow.graph} />
           </div>
         ) : (

apps/arc-web/app/routes/run-stages.tsx

@@ -112,7 +112,7 @@ function ToolRow({ tool }: { tool: ToolUse }) {
 
 function ToolBlock({ tools }: { tools: ToolUse[] }) {
   return (
-    <div className="rounded-lg border border-white/[0.06] bg-white/[0.01] overflow-hidden">
+    <div className="rounded-md border border-white/[0.06] bg-white/[0.01] overflow-hidden">
       {tools.map((tool, i) => (
         <ToolRow key={i} tool={tool} />
       ))}
@@ -122,7 +122,7 @@ function ToolBlock({ tools }: { tools: ToolUse[] }) {
 
 function SystemBlock({ content }: { content: string }) {
   return (
-    <div className="rounded-lg border border-amber/10 bg-amber/5 overflow-hidden">
+    <div className="rounded-md border border-amber/10 bg-amber/5 overflow-hidden">
       <div className="flex items-center gap-2 px-3 py-2">
         <CommandLineIcon className="size-4 shrink-0 text-amber" />
         <span className="text-xs font-medium text-ice-300">System Prompt</span>
@@ -136,7 +136,7 @@ function SystemBlock({ content }: { content: string }) {
 
 function AssistantBlock({ content }: { content: string }) {
   return (
-    <div className="rounded-lg border border-teal-500/10 bg-teal-500/5 overflow-hidden">
+    <div className="rounded-md border border-teal-500/10 bg-teal-500/5 overflow-hidden">
       <div className="flex items-center gap-2 px-3 py-2">
         <ChatBubbleLeftIcon className="size-4 shrink-0 text-teal-500" />
         <span className="text-xs font-medium text-ice-300">Assistant</span>

apps/arc-web/app/routes/run-usage.tsx

@@ -16,7 +16,7 @@ function formatTokens(n: number) {
 
 export default function RunUsage() {
   return (
-    <div className="rounded-lg border border-white/[0.06] overflow-hidden">
+    <div className="rounded-md border border-white/[0.06] overflow-hidden">
       <table className="w-full text-sm">
         <thead>
           <tr className="border-b border-white/[0.06] bg-navy-800/60 text-left text-xs text-navy-600">

apps/arc-web/app/routes/workflow-diagram.tsx

@@ -148,7 +148,7 @@ export default function WorkflowDiagram() {
   }
 
   return (
-    <div className="relative rounded-lg border border-white/[0.06] bg-navy-900/40">
+    <div className="relative rounded-md border border-white/[0.06] bg-navy-900/40">
       <div className="absolute right-3 top-3 z-10 flex items-center gap-2">
         <div className="flex items-center gap-0.5 rounded-md border border-white/[0.06] bg-navy-800/90 p-0.5">
           <button

apps/arc-web/app/routes/workflow-runs.tsx

@@ -17,7 +17,7 @@ function GitPullRequestIcon({ className }: { className?: string }) {
 function RunRow({ run }: { run: RunWithStatus }) {
   const colors = statusColors[run.status];
   return (
-    <Link to={`/runs/${run.id}`} className="grid items-center rounded-lg border border-white/[0.06] bg-navy-800/80 px-4 py-3 transition-all duration-200 hover:border-white/[0.12] hover:bg-navy-800" style={{ gridColumn: "1 / -1", gridTemplateColumns: "subgrid" }}>
+    <Link to={`/runs/${run.id}`} className="grid items-center rounded-md border border-white/[0.06] bg-navy-800/80 px-4 py-3 transition-all duration-200 hover:border-white/[0.12] hover:bg-navy-800" style={{ gridColumn: "1 / -1", gridTemplateColumns: "subgrid" }}>
       <span className="flex items-center gap-2 pr-2">
         <span className={`size-2 shrink-0 rounded-full ${colors.dot}`} />
         <span className={`text-xs font-medium ${colors.text}`}>{run.statusLabel}</span>
@@ -78,14 +78,14 @@ export default function WorkflowRuns() {
             placeholder="Search runs..."
             value={query}
             onChange={(e) => setQuery(e.target.value)}
-            className="w-full rounded-lg border border-white/[0.06] bg-navy-800/80 py-2 pl-9 pr-3 text-sm text-ice-100 placeholder-navy-600 outline-none transition-colors focus:border-teal-500/40 focus:ring-0"
+            className="w-full rounded-md border border-white/[0.06] bg-navy-800/80 py-2 pl-9 pr-3 text-sm text-ice-100 placeholder-navy-600 outline-none transition-colors focus:border-teal-500/40 focus:ring-0"
           />
         </div>
         <div className="relative">
           <select
             value={statusFilter}
             onChange={(e) => setStatusFilter(e.target.value as ColumnStatus | "all")}
-            className="appearance-none rounded-lg border border-white/[0.06] bg-navy-800/80 py-2 pl-3 pr-8 text-sm text-ice-100 outline-none transition-colors focus:border-teal-500/40 focus:ring-0"
+            className="appearance-none rounded-md border border-white/[0.06] bg-navy-800/80 py-2 pl-3 pr-8 text-sm text-ice-100 outline-none transition-colors focus:border-teal-500/40 focus:ring-0"
           >
             <option value="all">All statuses</option>
             {columns.map((col) => (

apps/arc-web/app/routes/workflows.tsx

@@ -90,7 +90,7 @@ function EllipsisIcon({ className }: { className?: string }) {
 function WorkflowCard({ workflow }: { workflow: Workflow }) {
   const Icon = workflow.icon;
   return (
-    <div className="group flex items-center gap-4 rounded-lg border border-white/[0.06] bg-navy-800/80 p-4 transition-all duration-200 hover:border-white/[0.12] hover:bg-navy-800 hover:shadow-lg hover:shadow-black/20">
+    <div className="group flex items-center gap-4 rounded-md border border-white/[0.06] bg-navy-800/80 p-4 transition-all duration-200 hover:border-white/[0.12] hover:bg-navy-800 hover:shadow-lg hover:shadow-black/20">
       <Link to={`/workflows/${workflow.slug}`} className="flex min-w-0 flex-1 items-center gap-4">
         <div
           className="flex size-9 shrink-0 items-center justify-center rounded-md border bg-navy-900/60"
@@ -144,7 +144,7 @@ export default function Workflows() {
           placeholder="Search workflows..."
           value={query}
           onChange={(e) => setQuery(e.target.value)}
-          className="w-full rounded-lg border border-white/[0.06] bg-navy-800/80 py-2 pl-9 pr-3 text-sm text-ice-100 placeholder-navy-600 outline-none transition-colors focus:border-teal-500/40 focus:ring-0"
+          className="w-full rounded-md border border-white/[0.06] bg-navy-800/80 py-2 pl-9 pr-3 text-sm text-ice-100 placeholder-navy-600 outline-none transition-colors focus:border-teal-500/40 focus:ring-0"
         />
       </div>
       <div className="space-y-3">