Make cards a bit more compact

frontend/editor/src/core/ui/OptionCard.css

@@ -7,8 +7,16 @@
   height: 100%;
 }
 
+/* Icon and title share a row. */
+.sui-option-card__head {
+  display: flex;
+  align-items: center;
+  gap: 0.625rem;
+}
+
 .sui-option-card__icon {
   display: inline-flex;
+  flex-shrink: 0;
   align-items: center;
   justify-content: center;
   width: 2.25rem;

frontend/editor/src/core/ui/OptionCard.tsx

@@ -70,10 +70,12 @@ export function OptionCard({
       onKeyDown={interactive ? onKeyDown : undefined}
       aria-disabled={disabled || undefined}
     >
-      <span className="sui-option-card__icon" aria-hidden>
-        {icon}
-      </span>
-      <h3 className="sui-option-card__title">{title}</h3>
+      <div className="sui-option-card__head">
+        <span className="sui-option-card__icon" aria-hidden>
+          {icon}
+        </span>
+        <h3 className="sui-option-card__title">{title}</h3>
+      </div>
       {description && <p className="sui-option-card__desc">{description}</p>}
       {(disabled ? note : cta) && (
         <span className="sui-option-card__foot">{disabled ? note : cta}</span>

frontend/editor/src/portal/views/Pipelines.tsx

@@ -299,7 +299,7 @@ export function Pipelines() {
           <h2 className="portal-pipelines__section-title">
             {t("portal.pipelines.templates.title")}
           </h2>
-          <CardRail itemWidth="16rem" itemHeight="12rem">
+          <CardRail itemWidth="16rem" itemHeight="10.75rem">
             {galleryEntries.map((entry) => (
               <PipelineTemplateCard
                 key={entry.category.id}