a11y: Tasks 9,13-17 - Settings ARIA, MiniTimer, overlays, ColorPicker, ActivityManager

- Settings: breathing radiogroup/radio, sound aria-pressed, contrast tokens,
  placeholder contrast, reset aria-live, abbreviation tags, title tooltips,
  back button 44px target
- MiniTimer: paused text #555→#a8a8a8 for AAA contrast
- MicrobreakOverlay: alertdialog role, sr-only heading, aria-describedby
- BreakOverlay: alertdialog role, sr-only heading, aria-label
- ColorPicker: enlarge swatches 22→28px with 44px hit areas, aria-pressed
- ActivityManager: enlarge action buttons to 44px targets, contrast tokens

src/lib/components/MicrobreakOverlay.svelte

@@ -38,17 +38,18 @@
   });
 </script>
 
-<div class="microbreak-card">
+<div class="microbreak-card" role="alertdialog" aria-label="Microbreak" aria-describedby="microbreak-msg">
+  <h2 class="sr-only">Microbreak</h2>
   <div class="flex items-center gap-3 mb-2">
     <svg aria-hidden="true" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#7c6aef" stroke-width="1.5">
       <path d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z"/>
       <circle cx="12" cy="12" r="3"/>
     </svg>
-    <span class="text-[15px] font-medium text-white">Look away — 20 feet for {timeRemaining}s</span>
+    <span id="microbreak-msg" class="text-[15px] font-medium text-white">Look away — 20 feet for {timeRemaining}s</span>
   </div>
 
   {#if activity && $config.microbreak_show_activity}
-    <p class="text-[12px] text-[#8a8a8a] mb-3 ml-[34px]">
+    <p class="text-[12px] text-text-sec mb-3 ml-[34px]">
       {activity.text}
     </p>
   {/if}