Add WCAG 2.1 Level AA accessibility across all components

src/lib/components/TimerRing.svelte

@@ -4,6 +4,8 @@
     size?: number;
     strokeWidth?: number;
     accentColor?: string;
+    label?: string;
+    valueText?: string;
     children?: import("svelte").Snippet;
   }
 
@@ -12,6 +14,8 @@
     size = 280,
     strokeWidth = 8,
     accentColor = "#ff4d00",
+    label = "Timer",
+    valueText = "",
     children,
   }: Props = $props();
 
@@ -44,9 +48,16 @@
 <div
   class="relative flex items-center justify-center"
   style="width: {size}px; height: {size}px;"
+  role="progressbar"
+  aria-valuemin={0}
+  aria-valuemax={100}
+  aria-valuenow={Math.round(progress * 100)}
+  aria-label={label}
+  aria-valuetext={valueText}
 >
   <!-- Glow SVG — drawn larger than the container so blur isn't clipped -->
   <svg
+    aria-hidden="true"
     width={viewSize}
     height={viewSize}
     class="pointer-events-none absolute"
@@ -136,6 +147,7 @@
 
   <!-- Non-glow SVG — exact size, draws the track + crisp ring -->
   <svg
+    aria-hidden="true"
     width={size}
     height={size}
     class="absolute"