snapshot: preserve compact builder rule and custom-field refinement

backend/workflows/static/workflows/css/form_builder.css

@@ -643,16 +643,16 @@ body {
 
 .conditional-rule-grid {
   display: grid;
-  gap: 12px;
+  gap: 10px;
 }
 
 .conditional-rule-card {
   border: 1px solid #d7e0ec;
-  border-radius: 16px;
+  border-radius: 14px;
   background: linear-gradient(180deg, #fbfdff 0%, #ffffff 100%);
-  padding: 14px;
+  padding: 12px;
   display: grid;
-  gap: 12px;
+  gap: 10px;
   transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
 }
 
@@ -666,8 +666,8 @@ body {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
-  gap: 16px;
+  gap: 12px;
-  padding-bottom: 10px;
+  padding-bottom: 8px;
   border-bottom: 1px solid #e6edf6;
 }
 
@@ -676,8 +676,8 @@ body {
 }
 
 .conditional-rule-head h3 {
-  margin: 2px 0 4px;
+  margin: 2px 0 2px;
-  font-size: 16px;
+  font-size: 15px;
   color: #142033;
 }
 
@@ -698,39 +698,45 @@ body {
 .conditional-toggle {
   display: inline-flex;
   align-items: center;
-  gap: 8px;
+  gap: 6px;
   color: #5f7089;
-  font-size: 12px;
+  font-size: 11px;
   font-weight: 800;
   white-space: nowrap;
 }
 
 .conditional-toggle input[type='checkbox'] {
-  width: 16px;
+  width: 15px;
-  height: 16px;
+  height: 15px;
+}
+
+.conditional-meta-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 10px;
 }
 
 .conditional-targets {
   display: grid;
-  gap: 8px;
+  gap: 6px;
-  padding: 12px;
+  padding: 10px 12px;
   border: 1px solid #e7edf6;
-  border-radius: 14px;
+  border-radius: 12px;
   background: #f9fbff;
 }
 
 .conditional-rule-summary {
   display: grid;
-  gap: 8px;
+  gap: 6px;
-  padding: 12px;
+  padding: 10px 12px;
   border: 1px solid #dbe6f5;
-  border-radius: 14px;
+  border-radius: 12px;
   background: linear-gradient(180deg, #f6faff, #ffffff);
 }
 
 .conditional-summary-prefix {
   color: #294567;
-  font-size: 12px;
+  font-size: 11px;
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.04em;
@@ -744,7 +750,7 @@ body {
 
 .conditional-target-label {
   color: #5f7089;
-  font-size: 12px;
+  font-size: 11px;
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.04em;
@@ -763,23 +769,23 @@ body {
 
 .conditional-sentence-builder {
   display: grid;
-  gap: 10px;
+  gap: 8px;
 }
 
 .conditional-sentence-row {
   display: grid;
   grid-template-columns: minmax(180px, 1.2fr) minmax(220px, 1.3fr) minmax(160px, 0.9fr) minmax(160px, 0.9fr);
-  gap: 10px;
+  gap: 8px;
   align-items: end;
-  padding: 12px;
+  padding: 10px 12px;
   border: 1px solid #e5ebf3;
-  border-radius: 14px;
+  border-radius: 12px;
   background: #f8fbff;
 }
 
 .conditional-sentence-label {
   color: #33506f;
-  font-size: 12px;
+  font-size: 11px;
   font-weight: 800;
   line-height: 1.45;
   text-transform: uppercase;
@@ -789,10 +795,10 @@ body {
 .conditional-sentence-row select,
 .conditional-sentence-row input[type='text'] {
   width: 100%;
-  min-height: 40px;
+  min-height: 38px;
   border: 1px solid #cbd5e1;
   border-radius: 10px;
-  padding: 8px 10px;
+  padding: 7px 9px;
   box-sizing: border-box;
   background: #fff;
 }
@@ -838,16 +844,16 @@ body {
 
 .conditional-extra-clause {
   border: 1px dashed #d7e0ec;
-  border-radius: 14px;
+  border-radius: 12px;
   background: #fbfdff;
 }
 
 .conditional-extra-clause summary {
   list-style: none;
   cursor: pointer;
-  padding: 10px 12px;
+  padding: 8px 12px;
   color: #35506f;
-  font-size: 12px;
+  font-size: 11px;
   font-weight: 800;
   letter-spacing: 0.03em;
   text-transform: uppercase;
@@ -1392,34 +1398,54 @@ body {
 }
 
 .custom-fields-surface .builder-entity-form {
-  gap: 10px;
+  gap: 8px;
-  padding: 14px;
+  padding: 12px;
 }
 
 .custom-fields-surface .builder-entity-grid {
-  gap: 10px;
+  gap: 8px;
 }
 
 .custom-fields-surface .builder-group-stack {
-  gap: 10px;
+  gap: 8px;
 }
 
 .custom-fields-surface .builder-group-card {
-  border-radius: 16px;
-}
-
-.custom-fields-surface .builder-group-head {
-  padding: 10px 12px;
-}
-
-.custom-fields-surface .builder-entity-card {
-  padding: 14px;
-  gap: 10px;
   border-radius: 14px;
 }
 
+.custom-fields-surface .builder-group-head {
+  padding: 8px 12px;
+}
+
+.custom-fields-surface .builder-entity-card {
+  padding: 11px 12px;
+  gap: 8px;
+  border-radius: 12px;
+}
+
 .custom-fields-surface .builder-entity-card-head strong {
-  font-size: 14px;
+  font-size: 13px;
+}
+
+.custom-fields-surface .builder-entity-card-head {
+  gap: 10px;
+}
+
+.custom-fields-surface .builder-switch-stack {
+  gap: 6px;
+}
+
+.custom-fields-surface .builder-entity-control span {
+  font-size: 11px;
+}
+
+.custom-fields-surface .builder-entity-control input[type='text'],
+.custom-fields-surface .builder-entity-control input[type='number'],
+.custom-fields-surface .builder-entity-control select,
+.custom-fields-surface .builder-entity-control textarea {
+  min-height: 38px;
+  padding: 7px 9px;
 }
 
 .builder-entity-form {
@@ -1789,6 +1815,10 @@ body {
     grid-template-columns: 1fr;
   }
 
+  .conditional-meta-grid {
+    grid-template-columns: 1fr;
+  }
+
   .builder-entity-card-head {
     flex-direction: column;
     align-items: flex-start;

backend/workflows/templates/workflows/form_builder.html

@@ -368,6 +368,7 @@
                     <input type="checkbox" name="conditional_active_{{ item.target_key }}" {% if item.is_active %}checked{% endif %} />
                   </label>
                 </div>
+                <div class="conditional-meta-grid">
                   <div class="conditional-rule-summary">
                     <span class="conditional-summary-prefix">{% trans "Sichtbar, wenn" %}</span>
                     <div class="conditional-summary-chips">
@@ -398,6 +399,7 @@
                       {% endfor %}
                     </div>
                   </div>
+                </div>
                 <div class="conditional-sentence-builder">
                   {% with first_clause=item.clauses.0 second_clause=item.clauses.1 %}
                   <div class="conditional-sentence-row">
@@ -435,9 +437,6 @@
                   </details>
                   {% endwith %}
                 </div>
-                <div class="conditional-clause-list">
-                  <span class="mini">{% trans "Nutzen Sie die zusätzliche Bedingung nur, wenn ein zweites Kriterium wirklich nötig ist." %}</span>
-                </div>
               </section>
               {% endif %}
               {% endfor %}