diff --git a/src/styles/tile-contract.css b/src/styles/tile-contract.css
new file mode 100644
index 0000000..df1fa61
--- /dev/null
+++ b/src/styles/tile-contract.css
@@ -0,0 +1,7 @@
+/* Letzte Kaskadenschicht fuer die verbindliche Segment-/Kachelgrammatik.
+   Ansichtsspezifische Breakpoints duerfen eine unvollstaendige Kachelzeile
+   nicht wieder auf die gesamte Segmentbreite strecken. */
+.donut-metric-rack {
+  grid-template-columns: repeat(auto-fill, var(--tile-compact-width));
+  justify-content: start;
+}
diff --git a/src/styles/ui-components.css b/src/styles/ui-components.css
index cefb965..3d1d7c7 100644
--- a/src/styles/ui-components.css
+++ b/src/styles/ui-components.css
@@ -421,26 +421,32 @@
 
 .tile-grid {
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(var(--tile-min-w), 1fr));
-  gap: var(--space-2);
-  padding: var(--space-3);
+  grid-template-columns: repeat(auto-fill, minmax(0, var(--tile-content-width)));
+  justify-content: start;
+  gap: var(--segment-gap);
+  padding: var(--segment-inset);
+  border: var(--bw-hairline) solid var(--segment-border);
+  border-radius: var(--segment-radius);
+  background: var(--segment-surface);
 }
 
 .tile {
   display: grid;
   grid-template-rows: auto 1fr auto;
+  min-width: 0;
   height: var(--tile-h);
   padding: var(--space-2) var(--space-3);
-  background: var(--surface-panel);
-  border: var(--bw-hairline) solid var(--border-subtle);
-  border-radius: var(--radius-sm);
+  background: var(--tile-surface);
+  border: var(--bw-hairline) solid var(--tile-border);
+  border-radius: var(--tile-radius);
+  box-shadow: var(--tile-card-shadow);
   cursor: pointer;
   overflow: hidden;
 }
-.tile:hover { background: var(--surface-hover); border-color: var(--border-strong); }
+.tile:hover { background: var(--tile-surface-hover); border-color: var(--border-strong); }
 .tile[aria-selected="true"] {
-  background: var(--surface-selected);
-  border-color: var(--selection-border);
+  background: var(--tile-surface-hover);
+  border-color: var(--tile-selected-border);
   border-width: var(--bw-emphasis);
   padding: calc(var(--space-2) - 1px) calc(var(--space-3) - 1px);
 }