Add persistent live controls and interaction notes

src/app.css

@@ -1025,7 +1025,7 @@ textarea:focus {
 }
 
 .live-status-row {
-	grid-template-columns: minmax(12rem, 1fr) auto auto;
+	grid-template-columns: minmax(8rem, 1fr) auto auto auto;
 	gap: 0.45rem;
 	padding-top: 0.35rem;
 	border-top: 1px solid var(--line);
@@ -1047,7 +1047,9 @@ textarea:focus {
 
 .live-output-state small,
 .live-next-inline small,
-.section-countdown span {
+.section-countdown span,
+.total-countdown span,
+.total-countdown small {
 	color: var(--text-faint);
 	font-size: 0.59rem;
 	font-weight: 720;
@@ -1132,7 +1134,13 @@ textarea:focus {
 	box-shadow: 0 0 0 0.25rem color-mix(in srgb, #d65c55 15%, transparent);
 }
 
-.section-countdown {
+.live-pulse.paused {
+	background: #d69b3e;
+	box-shadow: 0 0 0 0.25rem color-mix(in srgb, #d69b3e 15%, transparent);
+}
+
+.section-countdown,
+.total-countdown {
 	display: grid;
 	min-width: 6.8rem;
 	gap: 0.08rem;
@@ -1143,11 +1151,30 @@ textarea:focus {
 	text-align: center;
 }
 
-.section-countdown strong {
+.total-countdown {
+	color: var(--text);
+	cursor: pointer;
+	font: inherit;
+}
+
+.total-countdown:hover,
+.total-countdown:focus-visible {
+	border-color: var(--gold);
+}
+
+.section-countdown strong,
+.total-countdown strong {
 	font-size: 0.78rem;
 	font-variant-numeric: tabular-nums;
 }
 
+.total-countdown small {
+	color: var(--gold-strong);
+	font-size: 0.5rem;
+	letter-spacing: 0;
+	text-transform: none;
+}
+
 .section-countdown.warning {
 	border-color: #f3ba63;
 	color: #b87600;
@@ -1893,7 +1920,8 @@ textarea:focus {
 		padding: 0.4rem 0.55rem;
 	}
 
-	.section-countdown {
+	.section-countdown,
+	.total-countdown {
 		padding: 0.25rem 0.45rem;
 	}
 
@@ -1946,7 +1974,7 @@ textarea:focus {
 	}
 
 	.live-status-row {
-		grid-template-columns: minmax(0, 1fr) auto auto;
+		grid-template-columns: minmax(0, 1fr) auto auto auto;
 		gap: 0.3rem;
 		padding-top: 0.2rem;
 	}
@@ -1963,8 +1991,9 @@ textarea:focus {
 		padding-inline: 0.35rem;
 	}
 
-	.section-countdown {
-		min-width: 5.5rem;
+	.section-countdown,
+	.total-countdown {
+		min-width: 4.8rem;
 		padding: 0.28rem 0.4rem;
 	}