rearange utilities styles.

src/components.css

@@ -60,7 +60,7 @@
     align-items: center;
   }
 
-  :where(.spacer, .extendable) {
+  .spacer {
     flex: 1 1;
   }
 

src/index.css

@@ -3,3 +3,4 @@
 @import 'sanitize.css/forms.css' layer(base);
 @import './theme.css';
 @import './components.css';
+@import './utilities.css';

src/utilities.css

@@ -0,0 +1,20 @@
+@layer utilities {
+  .extendable {
+    flex: 1 1;
+  }
+
+  .grow {
+    flex-grow: 1;
+  }
+
+  .shrink {
+    flex-shrink: 1;
+  }
+
+  .empty_prompt {
+    padding-block: calc(var(--spacing) * 1);
+    text-align: center;
+    font-size: calc(var(--font-size) * 0.8);
+    color: var(--color-on-surface-variant);
+  }
+}