fix+feat: fix invisible result values, inline symbol into label

Fix: .result-value was using color: var(--pico-color) which broke when
our custom palette variables weren't in scope. Now inherits body color —
Pico handles light/dark correctly without us needing to re-assert it.

Feat: unit symbol merged inline into label as 'Blurbs (bl)', replacing
the separate third line. Removes .result-symbol CSS rule. Cards are
shorter and less cluttered.

src/app.css

@@ -88,7 +88,9 @@
   font-weight: 600;
   font-variant-numeric: tabular-nums;
   word-break: break-all;
-  color: var(--pico-color); /* explicit; do not rely on inheritance */
+  /* No explicit color — inherit from body. Pico sets this correctly for both
+     light (#373c44) and dark (#c2c7d0). Overriding with a CSS var here is
+     what caused the invisible-text regression. */
 }
 
 .result-label {
@@ -96,11 +98,7 @@
   color: var(--color-label);
 }
 
-.result-symbol {
+/* .result-symbol removed — symbol is now rendered inline in the label */
-  font-size: 0.75rem;
-  color: var(--pico-muted-color);
-  font-style: italic;
-}
 
 /* ── Highlighted result (above grid) ──────────────────────────────────────── */
 .highlighted-result {

src/components/ConversionResult.svelte

@@ -57,6 +57,5 @@
   aria-pressed={highlighted}
 >
   <span class="result-value">{formattedValue}</span>
-  <span class="result-label">{unit.labelPlural}</span>
+  <span class="result-label">{unit.labelPlural} ({unit.symbol})</span>
-  <span class="result-symbol">{unit.symbol}</span>
 </div>