Better <Digits />

site/src/pages/[...framework]/_Digits.astro

@@ -1,6 +1,3 @@
-<span
-	class="text-muted *:*:text-primary whitespace-nowrap text-center text-[.75em] leading-none *:*:absolute *:relative *:*:bottom-full *:*:left-0 *:inline-block *:*:w-full *:w-[1.5ch] *:*:text-[.75em] *:*:font-medium *:*:normal-nums *:*:tracking-tighter"
-	><span>4<span>1</span></span><span>2<span>0</span></span>.<span>1<span>-1</span></span><span
-		>5<span>-2</span></span
-	></span
+<span class="*:text-muted whitespace-nowrap"
+	>3<sup>2</sup>4<sup>1</sup>2<sup>0</sup>.5<sup>-1</sup></span
 >

site/src/pages/[...framework]/index.mdx

@@ -242,7 +242,7 @@ See the [input example](/examples/#input) for a usage scenario.
 	<code>digits<Type>: Record{'<number, { max?: number }>'}</Type></code>
 </h3>
 
-Configure digits based on their position in the number (i.e. <Digits/>). This can be helpful for time-related displays,
+Configure digits based on their position in the number (i.e. for 342.5, the positions are: <Digits />). This can be helpful for time-related displays,
 to ensure e.g. 59 -> 00. See the [countdown example](/examples/#countdown) for a demo.
 
 <Note>

site/tailwind.config.ts

@@ -87,6 +87,10 @@ export default {
 					css: {
 						'line-height': '1.7',
 
+						th: {
+							'@apply font-semibold': {}
+						},
+
 						a: {
 							'font-weight': 'unset',
 							'@apply link-underline': {}