diff --git a/zebra-report/index.html b/zebra-report/index.html
index 35d3ea2..5a3438b 100644
--- a/zebra-report/index.html
+++ b/zebra-report/index.html
@@ -56,13 +56,14 @@
.row {
display: grid;
grid-auto-flow: column;
- grid-auto-columns: max-content;
+ grid-auto-columns: minmax(0, max-content);
align-items: center; gap: 0.75rem; margin-bottom: 0.75rem;
+ min-width: 0;
}
.row:has(> :first-child + input[type=text]),
.row:has(> :first-child + input[type=password]),
.row:has(> :first-child + select) {
- grid-template-columns: max-content minmax(0, 1fr);
+ grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
}
.row:has(> input[type=text]:first-child),
.row:has(> input[type=password]:first-child),
@@ -1747,8 +1748,8 @@ logLine('sys', 'chat content lives in encrypted SRTP audio. no IP packets carry
diff --git a/zebra-report/zebra-audio.html b/zebra-report/zebra-audio.html
index a7674cf..f744be0 100644
--- a/zebra-report/zebra-audio.html
+++ b/zebra-report/zebra-audio.html
@@ -42,13 +42,14 @@
.row {
display: grid;
grid-auto-flow: column;
- grid-auto-columns: max-content;
+ grid-auto-columns: minmax(0, max-content);
align-items: center; gap: 0.75rem; margin-bottom: 0.75rem;
+ min-width: 0;
}
.row:has(> :first-child + input[type=text]),
.row:has(> :first-child + input[type=password]),
.row:has(> :first-child + select) {
- grid-template-columns: max-content minmax(0, 1fr);
+ grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
}
.row:has(> input[type=text]:first-child),
.row:has(> input[type=password]:first-child),
@@ -747,8 +748,8 @@ else wirePuppet();
diff --git a/zebra-report/zebra-spaces.html b/zebra-report/zebra-spaces.html
index 5f5a86f..3b0063d 100644
--- a/zebra-report/zebra-spaces.html
+++ b/zebra-report/zebra-spaces.html
@@ -311,13 +311,17 @@
.row {
display: grid;
grid-auto-flow: column;
- grid-auto-columns: max-content;
+ /* minmax(0,max-content) so a long single-child label (e.g. the
+ * 'music mode — …' description) can shrink and wrap inside the
+ * controls column instead of overflowing horizontally */
+ grid-auto-columns: minmax(0, max-content);
align-items: center; gap: 0.6rem; margin-bottom: 0.6rem;
+ min-width: 0;
}
.row:has(> :first-child + input[type=text]),
.row:has(> :first-child + input[type=password]),
.row:has(> :first-child + select) {
- grid-template-columns: max-content minmax(0, 1fr);
+ grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
}
.row:has(> input[type=text]:first-child),
.row:has(> input[type=password]:first-child),
@@ -2322,8 +2326,8 @@ logLine('', 'ready — pick a handle, type a rendezvous code, enter the space');