diff --git a/TESTING.md b/TESTING.md
new file mode 100644
index 0000000..5d61c6e
--- /dev/null
+++ b/TESTING.md
@@ -0,0 +1,211 @@
+# Testing Guide - Unbroken Tactical Barbell Tracker
+
+This guide explains how to test different workouts and training blocks without manually progressing through the entire program.
+
+## Testing Different Workouts via IndexedDB
+
+The app stores workout progress in IndexedDB, which can be modified directly in the browser to test different workout types (HIIT, LISS, strength, etc.) without completing entire blocks.
+
+### Method 1: Browser DevTools (Recommended)
+
+1. **Start the development server:**
+   ```bash
+   npm run dev
+   ```
+
+2. **Open the app in your browser:**
+   - Navigate to http://localhost:5173
+
+3. **Open Browser DevTools:**
+   - Press F12 or right-click → Inspect
+   - Go to the "Application" tab (Chrome) or "Storage" tab (Firefox)
+
+4. **Navigate to IndexedDB:**
+   - Expand "IndexedDB" in the left sidebar
+   - Find "UnbrokenTracker" database
+   - Expand it to see object stores:
+     - `workoutState` - Contains current progress (week, day, completed workouts)
+     - `trainingPlanState` - Contains the custom training plan
+     - `exerciseState` - Contains maxes and rep maxes
+     - `preferencesState` - Contains user preferences
+
+5. **Modify workout progress:**
+   - Click on `workoutState` object store
+   - Find the record with key "data"
+   - Double-click the value to edit the JSON
+   - Modify these fields:
+     ```json
+     {
+       "currentWeek": 1,     // Week number (1-based)
+       "currentDay": 1,      // Day number (1-based, 1-7 for each week)
+       "completedWorkouts": [], // Array of completed workouts
+       "completedSets": {}   // Object tracking completed sets
+     }
+     ```
+
+6. **Examples of useful test values:**
+
+   **Test HIIT workouts (Powerbuilding Block 3):**
+   ```json
+   {
+     "currentWeek": 1,
+     "currentDay": 3,
+     "completedWorkouts": [],
+     "completedSets": {}
+   }
+   ```
+
+   **Test different HIIT variations:**
+   ```json
+   {
+     "currentWeek": 2,
+     "currentDay": 3,
+     "completedWorkouts": [],
+     "completedSets": {}
+   }
+   ```
+
+   **Test LISS workouts (Endurance Block):**
+   ```json
+   {
+     "currentWeek": 1,
+     "currentDay": 2,
+     "completedWorkouts": [],
+     "completedSets": {}
+   }
+   ```
+
+7. **Refresh the page:**
+   - After modifying IndexedDB values, refresh the browser page
+   - Navigate to the "Workout" tab
+   - Click "Start Today's Workout" to see the modified workout
+
+### Method 2: Console Commands
+
+You can also modify the workout state programmatically using the browser console:
+
+1. **Open Browser Console:**
+   - Press F12 → Console tab
+
+2. **Get current state:**
+   ```javascript
+   // Open IndexedDB and read current state
+   const request = indexedDB.open('UnbrokenTracker', 1);
+   request.onsuccess = function(event) {
+     const db = event.target.result;
+     const transaction = db.transaction(['workoutState'], 'readonly');
+     const store = transaction.objectStore('workoutState');
+     const getRequest = store.get('data');
+     getRequest.onsuccess = function() {
+       console.log('Current workout state:', getRequest.result);
+     };
+   };
+   ```
+
+3. **Set new state:**
+   ```javascript
+   // Modify workout state to test different workouts
+   const request = indexedDB.open('UnbrokenTracker', 1);
+   request.onsuccess = function(event) {
+     const db = event.target.result;
+     const transaction = db.transaction(['workoutState'], 'readwrite');
+     const store = transaction.objectStore('workoutState');
+     
+     const newState = {
+       currentWeek: 1,    // Change this
+       currentDay: 3,     // Change this (day 3 often has HIIT in powerbuilding blocks)
+       completedWorkouts: [],
+       completedSets: {}
+     };
+     
+     store.put(newState, 'data');
+     console.log('Updated workout state:', newState);
+     // Refresh the page after this
+   };
+   ```
+
+## Available Workout Types by Block and Day
+
+### Get Ready Block (Week 1)
+- Day 1: Rest day
+
+### Endurance Block 1 (Weeks 1-8)
+- Days 1, 3, 5: Strength workouts (Overhead Press, Front Squat, Weighted Pull-up)
+- Days 2, 4, 6: LISS cardio (running, various durations)
+- Day 7: Rest
+
+### Powerbuilding Block 3 (Weeks 1-3) - Contains HIIT
+- Days 1, 4: Strength + Hypertrophy workouts
+- **Day 3: HIIT workout** - "Reset-20" activity
+  - Week 1: 20 seconds, 5 rounds
+  - Week 2: 15 seconds, 4 rounds  
+  - Week 3: 15 seconds, 4 rounds
+- Days 2, 5: Hypertrophy workouts
+- Days 6, 7: Rest
+
+### Bodybuilding Block (Weeks 1-3)
+- Days 1, 3, 4: Hypertrophy workouts
+- Day 2, 5: Hypertrophy workouts
+- **Day 3: HIIT workout** - "Hill Sprints"
+  - Week 1: 3 rounds
+  - Week 2: 5 rounds
+  - Week 3: 7 rounds
+- Days 6, 7: Rest
+
+### Strength Block (Weeks 1-6)
+- Days 1, 2, 4, 5: Strength workouts
+- **Days 3, 6: HIIT workouts** - Various activities (Tempo Run, 600m Resets, GC 9)
+- Day 7: Rest
+
+## Quick Testing Scenarios
+
+### Test HIIT Timer Functionality
+1. Set `currentWeek: 1, currentDay: 3` (Powerbuilding Block 3)
+2. Refresh page and start workout
+3. Test round progression, pause/resume, reset functionality
+
+### Test LISS Timer Functionality  
+1. Set `currentWeek: 1, currentDay: 2` (Endurance Block 1)
+2. Refresh page and start workout
+3. Test timer countdown, pause/resume functionality
+
+### Test Different HIIT Variations
+1. **Short rounds:** Set to Powerbuilding Block 3, Week 2/3 (15s rounds)
+2. **Longer rounds:** Set to Powerbuilding Block 3, Week 1 (20s rounds)
+3. **Different activities:** Set to Strength Block for "Tempo Run" or "600m Resets"
+
+## Reset Progress for Clean Testing
+
+To start fresh testing:
+
+1. **Via Settings Page:**
+   - Navigate to Settings tab
+   - Click "Reset All Progress"
+   - Confirm the reset
+
+2. **Via Console:**
+   ```javascript
+   // Clear all IndexedDB data
+   const request = indexedDB.open('UnbrokenTracker', 1);
+   request.onsuccess = function(event) {
+     const db = event.target.result;
+     const storeNames = ['workoutState', 'trainingPlanState', 'exerciseState', 'preferencesState'];
+     
+     storeNames.forEach(storeName => {
+       const transaction = db.transaction([storeName], 'readwrite');
+       const store = transaction.objectStore(storeName);
+       store.clear();
+     });
+     
+     console.log('All data cleared');
+     // Refresh the page after this
+   };
+   ```
+
+## Notes
+
+- Always refresh the page after modifying IndexedDB data
+- The app will automatically load the new state on page refresh
+- Component-level timer state (HIIT/LISS timers) resets automatically when components re-render
+- Workout state persistence only applies to training progression, not UI timer state
+- Test on development server (`npm run dev`) for best debugging experience
\ No newline at end of file
diff --git a/src/lib/blockTemplates.ts b/src/lib/blockTemplates.ts
index 3afb514..22a84d1 100644
--- a/src/lib/blockTemplates.ts
+++ b/src/lib/blockTemplates.ts
@@ -2,6 +2,15 @@
 // Contains workout configuration templates for different training blocks
 
 export const blockTemplates = {
+  getready: {
+    weeks: [
+      {
+        days: [
+          { type: "rest" }
+        ]
+      }
+    ]
+  },
   endurance1: {
     weeks: [
       {
diff --git a/src/lib/stores.ts b/src/lib/stores.ts
index eec27f8..844f960 100644
--- a/src/lib/stores.ts
+++ b/src/lib/stores.ts
@@ -3,27 +3,6 @@ import { writable } from 'svelte/store'
 import type { CompletedWorkout, CustomPlanBlock } from '$lib/types'
 
 // Store interfaces
-interface UIState {
-  activeTab: string
-  showResetConfirm: boolean
-  restTimer: {
-    isActive: boolean
-    timeLeft: number
-    totalTime: number
-    workoutType: 'strength' | 'hypertrophy' | null
-    phase: 'initial' | 'extended'
-    startTime: number
-  }
-  lissTimer: {
-    isActive: boolean
-    isPaused: boolean
-    timeLeft: number
-    totalTime: number
-    startTime: number
-    pausedTime: number
-  }
-}
-
 interface WorkoutState {
   currentWeek: number
   currentDay: number
@@ -180,32 +159,8 @@ const createPersistedStore = <T>(
   }
 }
 
-// UI Store (not persisted - transient state)
-const defaultUIState: UIState = {
-  activeTab: 'overview',
-  showResetConfirm: false,
-  restTimer: {
-    isActive: false,
-    timeLeft: 0,
-    totalTime: 0,
-    workoutType: null,
-    phase: 'initial',
-    startTime: 0
-  },
-  lissTimer: {
-    isActive: false,
-    isPaused: false,
-    timeLeft: 0,
-    totalTime: 0,
-    startTime: 0,
-    pausedTime: 0
-  }
-}
-
-export const uiStore = writable<UIState>(defaultUIState)
-
 // Workout Store (persisted)
-const defaultWorkoutState: WorkoutState = {
+export const defaultWorkoutState: WorkoutState = {
   currentWeek: 1,
   currentDay: 1,
   completedWorkouts: [],
@@ -215,8 +170,9 @@ const defaultWorkoutState: WorkoutState = {
 export const workoutStore = createPersistedStore('workoutState', defaultWorkoutState)
 
 // Training Plan Store (persisted)  
-const defaultTrainingPlanState: TrainingPlanState = {
+export const defaultTrainingPlanState: TrainingPlanState = {
   customPlan: [
+    { name: "Get Ready", weeks: 1, type: "getready" },
     { name: "Endurance Block 1", weeks: 8, type: "endurance1" },
     { name: "Powerbuilding Block 1", weeks: 3, type: "powerbuilding1" },
     { name: "Powerbuilding Block 2", weeks: 3, type: "powerbuilding2" },
@@ -233,7 +189,7 @@ const defaultTrainingPlanState: TrainingPlanState = {
 export const trainingPlanStore = createPersistedStore('trainingPlanState', defaultTrainingPlanState)
 
 // Exercise Store (persisted)
-const defaultExerciseState: ExerciseState = {
+export const defaultExerciseState: ExerciseState = {
   maxes: { 
     benchpress: 100, 
     squat: 120, 
@@ -251,7 +207,7 @@ const defaultExerciseState: ExerciseState = {
 export const exerciseStore = createPersistedStore('exerciseState', defaultExerciseState)
 
 // Preferences Store (persisted)
-const defaultPreferencesState: PreferencesState = {
+export const defaultPreferencesState: PreferencesState = {
   weightUnit: 'kg'
 }
 
diff --git a/src/lib/types.ts b/src/lib/types.ts
index 6c4ab3f..a99731c 100644
--- a/src/lib/types.ts
+++ b/src/lib/types.ts
@@ -58,35 +58,6 @@ export interface CompletedWorkout {
   details: Workout;
 }
 
-export interface AppState {
-  activeTab: string;
-  currentWeek: number;
-  currentDay: number;
-  completedWorkouts: CompletedWorkout[];
-  customPlan: CustomPlanBlock[];
-  maxes: Record<string, number>;
-  tenRMs: Record<string, number>;
-  weightUnit: string;
-  completedSets: Record<string, boolean>;
-  showResetConfirm: boolean;
-  restTimer: {
-    isActive: boolean;
-    timeLeft: number;
-    totalTime: number;
-    workoutType: 'strength' | 'hypertrophy' | null;
-    phase: 'initial' | 'extended';
-    startTime: number;
-  };
-  lissTimer: {
-    isActive: boolean;
-    isPaused: boolean;
-    timeLeft: number;
-    totalTime: number;
-    startTime: number;
-    pausedTime: number;
-  };
-}
-
 export interface WarmupSet {
   weight: number;
   reps: number;
diff --git a/src/routes/api/workout/complete/+server.ts b/src/routes/api/workout/complete/+server.ts
index 7c79093..074e48b 100644
--- a/src/routes/api/workout/complete/+server.ts
+++ b/src/routes/api/workout/complete/+server.ts
@@ -34,7 +34,11 @@ export async function POST({ request }) {
     const blockTemplate = blockTemplates[blockType as keyof typeof blockTemplates]
     const maxWeeks = blockTemplate?.weeks?.length || 8
     
-    if (newDay > 7) {
+    // Check if the next day exists in the current week
+    const currentWeekTemplate = blockTemplate?.weeks?.[currentWeek - 1]
+    const maxDaysInCurrentWeek = currentWeekTemplate?.days?.length || 7
+    
+    if (newDay > maxDaysInCurrentWeek) {
       newDay = 1
       newWeek++
       if (newWeek > maxWeeks) {
diff --git a/src/routes/settings/ResetProgress.svelte b/src/routes/settings/ResetProgress.svelte
index 9a3ceb7..6a822c1 100644
--- a/src/routes/settings/ResetProgress.svelte
+++ b/src/routes/settings/ResetProgress.svelte
@@ -1,22 +1,25 @@
 <script lang="ts">
   import { 
     clearAllStorage, 
-    uiStore, 
     workoutStore, 
     trainingPlanStore, 
     exerciseStore, 
-    preferencesStore 
+    preferencesStore,
+    defaultWorkoutState,
+    defaultTrainingPlanState,
+    defaultExerciseState,
+    defaultPreferencesState
   } from '$lib/stores'
   
-  // Access UI state directly from store
-  const showResetConfirm = $derived($uiStore.showResetConfirm)
+  // Local component state for reset confirmation dialog
+  let showResetConfirm = $state(false)
   
   const onShowReset = () => {
-    uiStore.update(state => ({ ...state, showResetConfirm: true }))
+    showResetConfirm = true
   }
   
   const onCancelReset = () => {
-    uiStore.update(state => ({ ...state, showResetConfirm: false }))
+    showResetConfirm = false
   }
 
   // Reset functionality - reset all stores to defaults
@@ -24,62 +27,14 @@
     try {
       await clearAllStorage()
       
-      // Reset all stores to their default values
-      uiStore.set({
-        activeTab: 'overview',
-        showResetConfirm: false,
-        restTimer: {
-          isActive: false,
-          timeLeft: 0,
-          totalTime: 0,
-          workoutType: null,
-          phase: 'initial',
-          startTime: 0
-        },
-        lissTimer: {
-          isActive: false,
-          isPaused: false,
-          timeLeft: 0,
-          totalTime: 0,
-          startTime: 0,
-          pausedTime: 0
-        }
-      })
-      
-      workoutStore.set({
-        currentWeek: 1,
-        currentDay: 1,
-        completedWorkouts: [],
-        completedSets: {}
-      })
-      
-      trainingPlanStore.set({
-        customPlan: [
-          { name: "Endurance Block 1", weeks: 8, type: "endurance1" },
-          { name: "Powerbuilding Block 1", weeks: 3, type: "powerbuilding1" },
-          { name: "Powerbuilding Block 2", weeks: 3, type: "powerbuilding2" },
-          { name: "Powerbuilding Block 3", weeks: 3, type: "powerbuilding3" },
-          { name: "Bodybuilding Block", weeks: 3, type: "bodybuilding" },
-          { name: "Bodybuilding Block", weeks: 3, type: "bodybuilding" },
-          { name: "Bodybuilding Block", weeks: 3, type: "bodybuilding" },
-          { name: "Powerbuilding Block 3 - Bulgarian", weeks: 3, type: "powerbuilding3bulgarian" },
-          { name: "Strength Block", weeks: 6, type: "strength" },
-          { name: "Endurance Block 1", weeks: 8, type: "endurance1" }
-        ]
-      })
-      
-      exerciseStore.set({
-        maxes: { 
-          benchpress: 100, squat: 120, deadlift: 140, trapbardeadlift: 130, 
-          overheadpress: 60, frontsquat: 90, weightedpullup: 20, powerclean: 80, 
-          romaniandeadlift: 120 
-        },
-        tenRMs: {}
-      })
-      
-      preferencesStore.set({
-        weightUnit: 'kg'
-      })
+      // Reset all stores to their default values - use the imported defaults from stores.ts
+      workoutStore.set(defaultWorkoutState)
+      trainingPlanStore.set(defaultTrainingPlanState)
+      exerciseStore.set(defaultExerciseState)
+      preferencesStore.set(defaultPreferencesState)
+
+      // Close the dialog
+      showResetConfirm = false
     } catch (error) {
       console.error('Failed to reset app:', error)
     }
diff --git a/src/routes/workout/+page.svelte b/src/routes/workout/+page.svelte
index 9149e29..395d283 100644
--- a/src/routes/workout/+page.svelte
+++ b/src/routes/workout/+page.svelte
@@ -1,6 +1,8 @@
 <script lang="ts">
   import { goto } from '$app/navigation'
-  import CardioWorkouts from './CardioWorkouts.svelte'
+  import type { CardioWorkout } from '$lib/types'
+  import LISSWorkout from './LISSWorkout.svelte'
+  import HIITWorkout from './HIITWorkout.svelte'
   import StrengthWorkouts from './StrengthWorkouts.svelte'
   import RestWorkouts from './RestWorkouts.svelte'
 
@@ -30,7 +32,7 @@
 
   const handleCompleteWorkout = async () => {
     // Import stores dynamically to ensure they're available
-    const { workoutStore, trainingPlanStore, uiStore } = await import('$lib/stores')
+    const { workoutStore, trainingPlanStore } = await import('$lib/stores')
     const { get } = await import('svelte/store')
     
     const workoutState = get(workoutStore)
@@ -72,28 +74,6 @@
         }))
       }
       
-      // Reset UI state
-      uiStore.update(state => ({
-        ...state,
-        activeTab: 'overview',
-        restTimer: {
-          isActive: false,
-          timeLeft: 0,
-          totalTime: 0,
-          workoutType: null,
-          phase: 'initial',
-          startTime: 0
-        },
-        lissTimer: {
-          isActive: false,
-          isPaused: false,
-          timeLeft: 0,
-          totalTime: 0,
-          startTime: 0,
-          pausedTime: 0
-        }
-      }))
-      
       goto('/')
     }
   }
@@ -111,10 +91,17 @@
       onCompleteWorkout={handleCompleteWorkout}
     />
   {:else if renderWorkout() === 'cardio' && getCurrentWorkout}
-    <CardioWorkouts 
-      workout={getCurrentWorkout}
-      onCompleteWorkout={handleCompleteWorkout}
-    />
+    {#if (getCurrentWorkout as CardioWorkout).type === 'liss'}
+      <LISSWorkout 
+        workout={getCurrentWorkout}
+        onCompleteWorkout={handleCompleteWorkout}
+      />
+    {:else if (getCurrentWorkout as CardioWorkout).type === 'hiit'}
+      <HIITWorkout 
+        workout={getCurrentWorkout}
+        onCompleteWorkout={handleCompleteWorkout}
+      />
+    {/if}
   {:else if renderWorkout() === 'rest' && getCurrentWorkout}
     <RestWorkouts 
       workout={getCurrentWorkout}
diff --git a/src/routes/workout/CardioWorkouts.svelte b/src/routes/workout/CardioWorkouts.svelte
deleted file mode 100644
index c383ccd..0000000
--- a/src/routes/workout/CardioWorkouts.svelte
+++ /dev/null
@@ -1,242 +0,0 @@
-<script lang="ts">
-  import type { Workout, CardioWorkout } from '$lib/types'
-  import { Play, Pause, Square } from 'lucide-svelte'
-  import { showRestCompleteNotification } from '$lib/utils'
-  import { uiStore } from '$lib/stores'
-
-  interface CardioWorkoutsProps {
-    workout: Workout
-    onCompleteWorkout: () => void
-  }
-
-  let { workout, onCompleteWorkout }: CardioWorkoutsProps = $props()
-
-  // Lookup tables for cardio workout configurations
-  const CARDIO_WORKOUT_CONFIGS = {
-    liss: { 
-      bg: 'from-green-500 to-blue-500', 
-      button: 'Complete LISS Cardio' 
-    },
-    hiit: { 
-      bg: 'from-orange-500 to-red-500', 
-      button: 'Complete HIIT Cardio' 
-    }
-  } as const
-
-  // Derive cardio workout with proper typing
-  const cardioWorkout = $derived(() => workout as CardioWorkout)
-  
-  // Derive config based on workout type
-  const config = $derived(() => {
-    const type = cardioWorkout().type
-    return CARDIO_WORKOUT_CONFIGS[type as keyof typeof CARDIO_WORKOUT_CONFIGS]
-  })
-
-  // LiSS Timer functionality
-  const lissTimer = $derived($uiStore.lissTimer)
-  
-  // Update store function
-  const updateLissTimer = (updates: Partial<typeof lissTimer>) => {
-    uiStore.update(state => ({
-      ...state,
-      lissTimer: { ...state.lissTimer, ...updates }
-    }))
-  }
-
-  // Start LiSS timer function
-  const startLissTimer = () => {
-    const duration = cardioWorkout().duration
-    if (duration === undefined) return
-    
-    const durationInSeconds = duration * 60
-    const now = Date.now()
-    
-    if (lissTimer.isPaused) {
-      // Resume from pause
-      updateLissTimer({
-        isActive: true,
-        isPaused: false,
-        startTime: now - (lissTimer.totalTime - lissTimer.timeLeft) * 1000
-      })
-    } else {
-      // Start fresh
-      updateLissTimer({
-        isActive: true,
-        isPaused: false,
-        timeLeft: durationInSeconds,
-        totalTime: durationInSeconds,
-        startTime: now,
-        pausedTime: 0
-      })
-    }
-  }
-
-  // Pause LiSS timer function
-  const pauseLissTimer = () => {
-    updateLissTimer({
-      isActive: false,
-      isPaused: true,
-      pausedTime: Date.now()
-    })
-  }
-
-  // Stop LiSS timer function
-  const stopLissTimer = () => {
-    updateLissTimer({
-      isActive: false,
-      isPaused: false,
-      timeLeft: 0,
-      totalTime: 0,
-      startTime: 0,
-      pausedTime: 0
-    })
-  }
-
-  // Timer interval effect - timestamp-based to prevent background throttling
-  $effect(() => {
-    let interval: number | undefined
-    
-    if (lissTimer.isActive && lissTimer.timeLeft > 0) {
-      interval = setInterval(() => {
-        const now = Date.now()
-        const elapsedSeconds = Math.floor((now - lissTimer.startTime) / 1000)
-        const newTimeLeft = Math.max(0, lissTimer.totalTime - elapsedSeconds)
-        
-        updateLissTimer({ timeLeft: newTimeLeft })
-      }, 100) // Check more frequently for smoother updates
-    }
-
-    return () => {
-      if (interval) clearInterval(interval)
-    }
-  })
-
-  // Separate effect to handle notification when timer reaches 0
-  $effect(() => {
-    if (lissTimer.isActive && lissTimer.timeLeft === 0) {
-      showRestCompleteNotification()
-      // Auto-pause when complete
-      updateLissTimer({ isActive: false, isPaused: false })
-    }
-  })
-
-  // Derived timer display values
-  const displayDuration = $derived(() => {
-    if (workout.type === 'liss' && cardioWorkout().duration !== undefined) {
-      if (lissTimer.isActive || lissTimer.isPaused || lissTimer.timeLeft > 0) {
-        // Show countdown timer
-        const minutes = Math.floor(lissTimer.timeLeft / 60)
-        const seconds = lissTimer.timeLeft % 60
-        return `${minutes}:${seconds.toString().padStart(2, '0')}`
-      } else {
-        // Show initial duration
-        return cardioWorkout().duration
-      }
-    }
-    return cardioWorkout().duration
-  })
-
-  const showTimerControls = $derived(() => {
-    return workout.type === 'liss' && cardioWorkout().duration !== undefined
-  })
-
-  // Derived button states for conditional styling
-  const buttonStates = $derived(() => {
-    const isStartDisabled = lissTimer.isActive
-    const isPauseDisabled = !lissTimer.isActive
-    const isStopDisabled = !lissTimer.isActive && !lissTimer.isPaused
-    
-    return {
-      start: {
-        disabled: isStartDisabled,
-        class: isStartDisabled 
-          ? 'flex-1 bg-green-500 text-white font-semibold py-3 rounded-lg transition-all flex items-center justify-center gap-2 opacity-40 cursor-not-allowed'
-          : 'flex-1 bg-green-500 hover:bg-green-600 text-white font-semibold py-3 rounded-lg transition-all flex items-center justify-center gap-2 opacity-100'
-      },
-      pause: {
-        disabled: isPauseDisabled,
-        class: isPauseDisabled
-          ? 'flex-1 bg-yellow-500 text-white font-semibold py-3 rounded-lg transition-all flex items-center justify-center gap-2 opacity-40 cursor-not-allowed'
-          : 'flex-1 bg-yellow-500 hover:bg-yellow-600 text-white font-semibold py-3 rounded-lg transition-all flex items-center justify-center gap-2 opacity-100'
-      },
-      stop: {
-        disabled: isStopDisabled,
-        class: isStopDisabled
-          ? 'flex-1 bg-red-500 text-white font-semibold py-3 rounded-lg transition-all flex items-center justify-center gap-2 opacity-40 cursor-not-allowed'
-          : 'flex-1 bg-red-500 hover:bg-red-600 text-white font-semibold py-3 rounded-lg transition-all flex items-center justify-center gap-2 opacity-100'
-      }
-    }
-  })
-</script>
-
-{#if workout.type === 'liss' || workout.type === 'hiit'}
-  <div>
-    <div class="bg-gradient-to-r {config().bg} text-white p-6 rounded-lg text-center">
-      <h3 class="text-2xl font-bold mb-2">
-        {cardioWorkout().activity}
-      </h3>
-      {#if cardioWorkout().duration !== undefined}
-        <div class="text-4xl font-bold">{displayDuration()}</div>
-        <div class="text-sm opacity-90 mt-1">
-          {#if workout.type === 'liss'}
-            minutes
-          {:else}
-            seconds
-          {/if}
-        </div>
-      {/if}
-      {#if cardioWorkout().distance !== undefined}
-        <div class="text-4xl font-bold">{cardioWorkout().distance}</div>
-        <div class="text-sm opacity-90 mt-1">
-          {#if workout.type === 'liss'}
-            km
-          {:else}
-            m
-          {/if}
-        </div>
-      {/if}
-      {#if cardioWorkout().rounds !== undefined}
-        <div class="text-2xl font-semibold mt-2">
-          {cardioWorkout().rounds} rounds
-        </div>
-      {/if}
-    </div>
-    
-    {#if showTimerControls()}
-      <!-- Timer control buttons -->
-      <div class="flex gap-2 mt-4">
-        <button 
-          onclick={buttonStates().start.disabled ? undefined : startLissTimer} 
-          disabled={buttonStates().start.disabled}
-          class={buttonStates().start.class}
-        >
-          <Play class="w-5 h-5" stroke="none" fill="currentColor" />
-          Start
-        </button>
-        <button 
-          onclick={buttonStates().pause.disabled ? undefined : pauseLissTimer} 
-          disabled={buttonStates().pause.disabled}
-          class={buttonStates().pause.class}
-        >
-          <Pause class="w-5 h-5" stroke="none" fill="currentColor" />
-          Pause
-        </button>
-        <button 
-          onclick={buttonStates().stop.disabled ? undefined : stopLissTimer} 
-          disabled={buttonStates().stop.disabled}
-          class={buttonStates().stop.class}
-        >
-          <Square class="w-5 h-5" stroke="none" fill="currentColor" />
-          Stop
-        </button>
-      </div>
-    {/if}
-    
-    <button 
-      onclick={onCompleteWorkout} 
-      class="w-full bg-green-500 hover:bg-green-600 text-white font-semibold py-3 rounded-lg transition-colors mt-4"
-    >
-      {config().button}
-    </button>
-  </div>
-{/if}
\ No newline at end of file
diff --git a/src/routes/workout/HIITWorkout.svelte b/src/routes/workout/HIITWorkout.svelte
new file mode 100644
index 0000000..df05870
--- /dev/null
+++ b/src/routes/workout/HIITWorkout.svelte
@@ -0,0 +1,280 @@
+<script lang="ts">
+  import type { Workout, CardioWorkout } from '$lib/types'
+  import { Play, Pause, Square, CheckCircle } from 'lucide-svelte'
+  import { showRestCompleteNotification } from '$lib/utils'
+
+  interface HIITWorkoutProps {
+    workout: Workout
+    onCompleteWorkout: () => void
+  }
+
+  let { workout, onCompleteWorkout }: HIITWorkoutProps = $props()
+
+  // Derive cardio workout with proper typing
+  const cardioWorkout = $derived(() => workout as CardioWorkout)
+
+  // HIIT timer state - using runes for reactive state management
+  let hiitTimer = $state({
+    isActive: false,
+    isPaused: false,
+    timeLeft: 0,
+    totalTime: 0,
+    startTime: 0,
+    pausedTime: 0,
+    currentRound: 0,
+    totalRounds: 0,
+    roundCompleted: false
+  })
+
+  // HIIT timer functions
+  const startTimer = () => {
+    const { duration, rounds } = workoutData()
+    if (!rounds) return
+    
+    // Use -1 duration for rounds-only workouts (Hill Sprints)
+    const effectiveDuration = duration ?? -1
+    
+    const now = Date.now()
+    if (hiitTimer.isPaused) {
+      hiitTimer.isActive = true
+      hiitTimer.isPaused = false
+      hiitTimer.startTime = now - (hiitTimer.totalTime - hiitTimer.timeLeft) * 1000
+    } else if (hiitTimer.currentRound === 0) {
+      // Starting first round
+      Object.assign(hiitTimer, {
+        isActive: effectiveDuration > 0, isPaused: false, 
+        timeLeft: effectiveDuration > 0 ? effectiveDuration : 0, 
+        totalTime: effectiveDuration > 0 ? effectiveDuration : 0,
+        startTime: now, pausedTime: 0, currentRound: 1, totalRounds: rounds, 
+        roundCompleted: false // Don't mark as completed immediately for rounds-only
+      })
+    } else if (hiitTimer.roundCompleted) {
+      // Starting next round after completion - currentRound is already correct
+      if (hiitTimer.currentRound <= hiitTimer.totalRounds) {
+        Object.assign(hiitTimer, {
+          isActive: effectiveDuration > 0, isPaused: false, 
+          timeLeft: effectiveDuration > 0 ? effectiveDuration : 0, 
+          totalTime: effectiveDuration > 0 ? effectiveDuration : 0,
+          startTime: now, pausedTime: 0,
+          roundCompleted: false // Reset completion status
+        })
+      }
+    } else {
+      // Resuming current round
+      Object.assign(hiitTimer, {
+        isActive: effectiveDuration > 0, isPaused: false, 
+        timeLeft: effectiveDuration > 0 ? effectiveDuration : 0, 
+        totalTime: effectiveDuration > 0 ? effectiveDuration : 0,
+        startTime: now, pausedTime: 0
+      })
+    }
+  }
+
+  const pauseTimer = () => {
+    hiitTimer.isActive = false
+    hiitTimer.isPaused = true
+    hiitTimer.pausedTime = Date.now()
+  }
+
+  const stopTimer = () => {
+    Object.assign(hiitTimer, {
+      isActive: false, isPaused: false, timeLeft: 0, totalTime: 0,
+      startTime: 0, pausedTime: 0, currentRound: 0, totalRounds: 0, roundCompleted: false
+    })
+  }
+
+  const completeCurrentRound = () => {
+    if (hiitTimer.currentRound < hiitTimer.totalRounds) {
+      hiitTimer.currentRound++
+      hiitTimer.roundCompleted = true
+      Object.assign(hiitTimer, {
+        isActive: false, isPaused: false, timeLeft: 0
+      })
+    } else {
+      Object.assign(hiitTimer, {
+        isActive: false, isPaused: false, roundCompleted: true, timeLeft: 0
+      })
+    }
+  }
+
+  // Timer interval effect - timestamp-based to prevent background throttling
+  $effect(() => {
+    let interval: number | undefined
+    
+    if (hiitTimer.isActive && hiitTimer.timeLeft > 0) {
+      interval = setInterval(() => {
+        const now = Date.now()
+        const elapsedSeconds = Math.floor((now - hiitTimer.startTime) / 1000)
+        const newTimeLeft = Math.max(0, hiitTimer.totalTime - elapsedSeconds)
+        
+        hiitTimer.timeLeft = newTimeLeft
+      }, 100) // Check more frequently for smoother updates
+    }
+
+    return () => {
+      if (interval) clearInterval(interval)
+    }
+  })
+
+  // Timer completion effect
+  $effect(() => {
+    if (hiitTimer.isActive && hiitTimer.timeLeft === 0) {
+      showRestCompleteNotification()
+      completeCurrentRound()
+    }
+  })
+
+  // Derived display values
+  const workoutData = $derived(() => cardioWorkout())
+  const hasRounds = $derived(() => workoutData().rounds !== undefined)
+  const workoutComplete = $derived(() => hiitTimer.totalRounds > 0 && hiitTimer.currentRound >= hiitTimer.totalRounds && hiitTimer.roundCompleted)
+  
+  const displayTime = $derived(() => {
+    // Don't show time for rounds-only workouts
+    if (workoutData().duration === undefined) return undefined
+    
+    if (hiitTimer.isActive || hiitTimer.isPaused || hiitTimer.timeLeft > 0) {
+      const minutes = Math.floor(hiitTimer.timeLeft / 60)
+      const seconds = hiitTimer.timeLeft % 60
+      return `${minutes}:${seconds.toString().padStart(2, '0')}`
+    }
+    return workoutData().duration
+  })
+
+  const roundDisplay = $derived(() => {
+    if (!hasRounds()) return ''
+    return hiitTimer.totalRounds > 0 
+      ? `Round ${hiitTimer.currentRound} of ${hiitTimer.totalRounds}`
+      : `${workoutData().rounds} rounds`
+  })
+
+  // Button states for conditional logic only (no styling)
+  const buttonStates = $derived(() => {
+    const isRoundsOnly = workoutData().duration === undefined
+    const startDisabled = (hiitTimer.isActive && !isRoundsOnly) || workoutComplete()
+    const pauseDisabled = !hiitTimer.isActive || isRoundsOnly
+    const stopDisabled = !hiitTimer.isActive && !hiitTimer.isPaused && hiitTimer.currentRound === 0
+    
+    return {
+      start: {
+        disabled: startDisabled,
+        text: workoutComplete() ? 'All Rounds Complete' :
+              hiitTimer.currentRound === 0 ? 'Start Round 1' : 
+              hiitTimer.roundCompleted ? `Start Round ${hiitTimer.currentRound}` : 
+              isRoundsOnly ? `Complete Round ${hiitTimer.currentRound}` : 'Resume Round'
+      },
+      pause: {
+        disabled: pauseDisabled
+      },
+      stop: {
+        disabled: stopDisabled
+      }
+    }
+  })
+</script>
+
+<div>
+  <div class="bg-gradient-to-r from-orange-500 to-red-500 text-white p-6 rounded-lg text-center">
+    <h3 class="text-2xl font-bold mb-2">{workoutData().activity}</h3>
+    
+    {#if displayTime() !== undefined}
+      <div class="text-4xl font-bold">{displayTime()}</div>
+      <div class="text-sm opacity-90 mt-1">seconds</div>
+    {/if}
+    
+    {#if workoutData().distance !== undefined}
+      <div class="text-4xl font-bold">{workoutData().distance}</div>
+      <div class="text-sm opacity-90 mt-1">meters</div>
+    {/if}
+    
+    {#if hasRounds()}
+      <div class="text-2xl font-semibold mt-2">{roundDisplay()}</div>
+    {/if}
+    
+    {#if workoutComplete()}
+      <div class="text-white text-lg font-semibold mt-2 flex items-center justify-center gap-2">
+        <CheckCircle class="w-6 h-6" />
+        All Rounds Complete!
+      </div>
+    {/if}
+  </div>
+  
+  {#if hasRounds()}
+    {@const states = buttonStates()}
+    
+    <!-- Unified HIIT controls for all workout types -->
+    <div class="flex gap-2 mt-4">
+      <button 
+        onclick={states.start?.disabled ? undefined : () => {
+          if (workoutComplete()) return;
+          const isRoundsOnly = workoutData().duration === undefined;
+          if (isRoundsOnly && hiitTimer.currentRound > 0 && !hiitTimer.roundCompleted) {
+            completeCurrentRound();
+          } else {
+            startTimer();
+          }
+        }} 
+        disabled={states.start?.disabled} 
+        class="btn-start {states.start?.disabled ? 'disabled' : ''}"
+      >
+        <Play class="w-5 h-5" stroke="none" fill="currentColor" />
+        {states.start?.text}
+      </button>
+      {#if workoutData().duration !== undefined && states.pause}
+        <button 
+          onclick={states.pause?.disabled ? undefined : pauseTimer} 
+          disabled={states.pause?.disabled} 
+          class="btn-pause {states.pause?.disabled ? 'disabled' : ''}"
+        >
+          <Pause class="w-5 h-5" stroke="none" fill="currentColor" />
+          Pause
+        </button>
+      {/if}
+      <button 
+        onclick={states.stop?.disabled ? undefined : stopTimer} 
+        disabled={states.stop?.disabled} 
+        class="btn-stop {states.stop?.disabled ? 'disabled' : ''}"
+      >
+        <Square class="w-5 h-5" stroke="none" fill="currentColor" />
+        Reset
+      </button>
+    </div>
+  {/if}
+  
+  <button 
+    onclick={onCompleteWorkout} 
+    class="w-full bg-green-500 hover:bg-green-600 text-white font-semibold py-3 rounded-lg transition-colors mt-4"
+  >
+    Complete HIIT Cardio
+  </button>
+</div>
+
+<style>
+  @reference "tailwindcss";
+  
+  .btn-start,
+  .btn-pause,
+  .btn-stop {
+    @apply font-semibold py-3 rounded-lg transition-all duration-200 flex items-center justify-center gap-2 text-white;
+  }
+
+  .btn-start {
+    @apply flex-1 bg-green-500 hover:bg-green-600;
+  }
+
+  .btn-pause {
+    @apply flex-1 bg-yellow-500 hover:bg-yellow-600;
+  }
+
+  .btn-stop {
+    @apply flex-1 bg-red-500 hover:bg-red-600;
+  }
+
+  .disabled {
+    @apply opacity-40 cursor-not-allowed;
+  }
+  
+  .disabled:hover {
+    @apply opacity-40;
+  }
+</style>
\ No newline at end of file
diff --git a/src/routes/workout/LISSWorkout.svelte b/src/routes/workout/LISSWorkout.svelte
new file mode 100644
index 0000000..830feb6
--- /dev/null
+++ b/src/routes/workout/LISSWorkout.svelte
@@ -0,0 +1,222 @@
+<script lang="ts">
+  import type { Workout, CardioWorkout } from '$lib/types'
+  import { Play, Pause, Square } from 'lucide-svelte'
+  import { showRestCompleteNotification } from '$lib/utils'
+
+  interface LISSWorkoutProps {
+    workout: Workout
+    onCompleteWorkout: () => void
+  }
+
+  let { workout, onCompleteWorkout }: LISSWorkoutProps = $props()
+
+  // Derive cardio workout with proper typing
+  const cardioWorkout = $derived(() => workout as CardioWorkout)
+
+  // LISS timer state - using runes for reactive state management
+  let lissTimer = $state({
+    isActive: false,
+    isPaused: false,
+    timeLeft: 0,
+    totalTime: 0,
+    startTime: 0,
+    pausedTime: 0
+  })
+
+  // LISS timer functions
+  const startTimer = () => {
+    const duration = cardioWorkout().duration
+    if (duration === undefined) return
+    
+    const durationInSeconds = duration * 60
+    const now = Date.now()
+    
+    if (lissTimer.isPaused) {
+      // Resume from pause
+      lissTimer.isActive = true
+      lissTimer.isPaused = false
+      lissTimer.startTime = now - (lissTimer.totalTime - lissTimer.timeLeft) * 1000
+    } else {
+      // Start fresh
+      lissTimer.isActive = true
+      lissTimer.isPaused = false
+      lissTimer.timeLeft = durationInSeconds
+      lissTimer.totalTime = durationInSeconds
+      lissTimer.startTime = now
+      lissTimer.pausedTime = 0
+    }
+  }
+
+  const pauseTimer = () => {
+    lissTimer.isActive = false
+    lissTimer.isPaused = true
+    lissTimer.pausedTime = Date.now()
+  }
+
+  const stopTimer = () => {
+    lissTimer.isActive = false
+    lissTimer.isPaused = false
+    lissTimer.timeLeft = 0
+    lissTimer.totalTime = 0
+    lissTimer.startTime = 0
+    lissTimer.pausedTime = 0
+  }
+
+  // Timer interval effect - timestamp-based to prevent background throttling
+  $effect(() => {
+    let interval: number | undefined
+    
+    if (lissTimer.isActive && lissTimer.timeLeft > 0) {
+      interval = setInterval(() => {
+        const now = Date.now()
+        const elapsedSeconds = Math.floor((now - lissTimer.startTime) / 1000)
+        const newTimeLeft = Math.max(0, lissTimer.totalTime - elapsedSeconds)
+        
+        lissTimer.timeLeft = newTimeLeft
+      }, 100) // Check more frequently for smoother updates
+    }
+
+    return () => {
+      if (interval) clearInterval(interval)
+    }
+  })
+
+  // Timer completion effect
+  $effect(() => {
+    if (lissTimer.isActive && lissTimer.timeLeft === 0) {
+      showRestCompleteNotification()
+      // Auto-pause when complete
+      lissTimer.isActive = false
+      lissTimer.isPaused = false
+    }
+  })
+
+  // Derived timer display values
+  const displayDuration = $derived(() => {
+    if (cardioWorkout().duration !== undefined) {
+      if (lissTimer.isActive || lissTimer.isPaused || lissTimer.timeLeft > 0) {
+        // Show countdown timer
+        const minutes = Math.floor(lissTimer.timeLeft / 60)
+        const seconds = lissTimer.timeLeft % 60
+        return `${minutes}:${seconds.toString().padStart(2, '0')}`
+      } else {
+        // Show initial duration
+        return cardioWorkout().duration
+      }
+    }
+    return cardioWorkout().duration
+  })
+
+  const showTimerControls = $derived(() => {
+    return cardioWorkout().duration !== undefined
+  })
+
+  // Button states for conditional logic only (no styling)
+  const buttonStates = $derived(() => {
+    const isStartDisabled = lissTimer.isActive
+    const isPauseDisabled = !lissTimer.isActive
+    const isStopDisabled = !lissTimer.isActive && !lissTimer.isPaused
+    
+    return {
+      start: {
+        disabled: isStartDisabled
+      },
+      pause: {
+        disabled: isPauseDisabled
+      },
+      stop: {
+        disabled: isStopDisabled
+      }
+    }
+  })
+</script>
+
+<div>
+  <div class="bg-gradient-to-r from-green-500 to-blue-500 text-white p-6 rounded-lg text-center">
+    <h3 class="text-2xl font-bold mb-2">
+      {cardioWorkout().activity}
+    </h3>
+    {#if cardioWorkout().duration !== undefined}
+      <div class="text-4xl font-bold">
+        {displayDuration()}
+      </div>
+      <div class="text-sm opacity-90 mt-1">minutes</div>
+    {/if}
+    {#if cardioWorkout().distance !== undefined}
+      <div class="text-4xl font-bold">{cardioWorkout().distance}</div>
+      <div class="text-sm opacity-90 mt-1">km</div>
+    {/if}
+    {#if cardioWorkout().rounds !== undefined}
+      <div class="text-2xl font-semibold mt-2">
+        {cardioWorkout().rounds} rounds
+      </div>
+    {/if}
+  </div>
+  
+  {#if showTimerControls()}
+    <!-- LISS Timer control buttons -->
+    <div class="flex gap-2 mt-4">
+      <button 
+        onclick={buttonStates().start?.disabled ? undefined : startTimer} 
+        disabled={buttonStates().start?.disabled}
+        class="btn-start {buttonStates().start?.disabled ? 'disabled' : ''}"
+      >
+        <Play class="w-5 h-5" stroke="none" fill="currentColor" />
+        Start
+      </button>
+      <button 
+        onclick={buttonStates().pause?.disabled ? undefined : pauseTimer} 
+        disabled={buttonStates().pause?.disabled}
+        class="btn-pause {buttonStates().pause?.disabled ? 'disabled' : ''}"
+      >
+        <Pause class="w-5 h-5" stroke="none" fill="currentColor" />
+        Pause
+      </button>
+      <button 
+        onclick={buttonStates().stop?.disabled ? undefined : stopTimer} 
+        disabled={buttonStates().stop?.disabled}
+        class="btn-stop {buttonStates().stop?.disabled ? 'disabled' : ''}"
+      >
+        <Square class="w-5 h-5" stroke="none" fill="currentColor" />
+        Stop
+      </button>
+    </div>
+  {/if}
+  
+  <button 
+    onclick={onCompleteWorkout} 
+    class="w-full bg-green-500 hover:bg-green-600 text-white font-semibold py-3 rounded-lg transition-colors mt-4"
+  >
+    Complete LISS Cardio
+  </button>
+</div>
+
+<style>
+  @reference "tailwindcss";
+  
+  .btn-start,
+  .btn-pause,
+  .btn-stop {
+    @apply flex-1 font-semibold py-3 rounded-lg transition-all duration-200 flex items-center justify-center gap-2 text-white;
+  }
+
+  .btn-start {
+    @apply bg-green-500 hover:bg-green-600;
+  }
+
+  .btn-pause {
+    @apply bg-yellow-500 hover:bg-yellow-600;
+  }
+
+  .btn-stop {
+    @apply bg-red-500 hover:bg-red-600;
+  }
+
+  .disabled {
+    @apply opacity-40 cursor-not-allowed;
+  }
+  
+  .disabled:hover {
+    @apply opacity-40;
+  }
+</style>
\ No newline at end of file
diff --git a/src/routes/workout/RestTimer.svelte b/src/routes/workout/RestTimer.svelte
index 9eceb56..83d6eed 100644
--- a/src/routes/workout/RestTimer.svelte
+++ b/src/routes/workout/RestTimer.svelte
@@ -1,45 +1,57 @@
 <script lang="ts">
   import { Clock } from 'lucide-svelte'
   import { showRestCompleteNotification } from '$lib/utils'
-  import { uiStore } from '$lib/stores'
-  
-  // Access rest timer directly from store without local state
-  const restTimer = $derived($uiStore.restTimer)
-  
-  // Update store function
-  const updateRestTimer = (updates: Partial<typeof restTimer>) => {
-    uiStore.update(state => ({
-      ...state,
-      restTimer: { ...state.restTimer, ...updates }
-    }))
+
+  interface RestTimerProps {
+    workoutType: 'strength' | 'hypertrophy'
+    onStop: () => void
   }
 
-  // Stop rest timer function
-  const stopRestTimer = () => {
-    updateRestTimer({
-      isActive: false,
-      timeLeft: 0,
-      totalTime: 0,
-      workoutType: null,
-      phase: 'initial',
-      startTime: 0
-    })
+  let { workoutType, onStop }: RestTimerProps = $props()
+
+  // Local rest timer state using runes - managed internally
+  let restTimer = $state({
+    isActive: false,
+    timeLeft: 0,
+    totalTime: 0,
+    phase: 'initial' as 'initial' | 'extended',
+    startTime: 0
+  })
+
+  // Start the rest timer
+  export const start = () => {
+    const initialTime = workoutType === 'strength' ? 180 : 90 // 3 min for strength, 1.5 min for hypertrophy
+    const now = Date.now()
+    
+    restTimer.isActive = true
+    restTimer.timeLeft = initialTime
+    restTimer.totalTime = initialTime
+    restTimer.phase = 'initial'
+    restTimer.startTime = now
   }
 
   // Extend rest timer function - matching original React implementation
   const extendRestTimer = () => {
-    if (restTimer.workoutType === 'strength' && restTimer.phase === 'initial') {
+    if (workoutType === 'strength' && restTimer.phase === 'initial') {
       const extendedTime = 120 // Additional 2 minutes to reach 5 minutes total
       const now = Date.now()
-      updateRestTimer({
-        timeLeft: extendedTime,
-        totalTime: extendedTime,
-        phase: 'extended',
-        startTime: now
-      })
+      restTimer.timeLeft = extendedTime
+      restTimer.totalTime = extendedTime
+      restTimer.phase = 'extended'
+      restTimer.startTime = now
     }
   }
 
+  // Stop rest timer function
+  const stopRestTimer = () => {
+    restTimer.isActive = false
+    restTimer.timeLeft = 0
+    restTimer.totalTime = 0
+    restTimer.phase = 'initial'
+    restTimer.startTime = 0
+    onStop()
+  }
+
   // Derived progress percentage
   const progressPercent = $derived(() => {
     if (restTimer.totalTime === 0) return 0
@@ -47,7 +59,6 @@
   })
 
   // Timer interval effect - timestamp-based to prevent background throttling
-  // IMPORTANT: Rest timer won't show until user accepts or rejects notification permissions
   $effect(() => {
     let interval: number | undefined
     
@@ -57,7 +68,7 @@
         const elapsedSeconds = Math.floor((now - restTimer.startTime) / 1000)
         const newTimeLeft = Math.max(0, restTimer.totalTime - elapsedSeconds)
         
-        updateRestTimer({ timeLeft: newTimeLeft })
+        restTimer.timeLeft = newTimeLeft
       }, 100) // Check more frequently for smoother updates
     }
 
@@ -106,7 +117,7 @@
       >
         {restTimer.timeLeft === 0 ? 'Complete Rest' : 'Skip Rest'}
       </button>
-      {#if restTimer.workoutType === 'strength' && restTimer.phase !== 'extended' && restTimer.timeLeft === 0}
+      {#if workoutType === 'strength' && restTimer.phase !== 'extended' && restTimer.timeLeft === 0}
         <button
           onclick={extendRestTimer}
           class="flex-1 bg-red-500 hover:bg-red-600 text-white font-medium py-2 px-4 rounded-lg transition-colors text-sm"
diff --git a/src/routes/workout/StrengthWorkouts.svelte b/src/routes/workout/StrengthWorkouts.svelte
index 452ab8a..a8a1238 100644
--- a/src/routes/workout/StrengthWorkouts.svelte
+++ b/src/routes/workout/StrengthWorkouts.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import { CheckCircle } from 'lucide-svelte'
-  import { workoutStore, exerciseStore, preferencesStore, uiStore } from '$lib/stores'
+  import { workoutStore, exerciseStore, preferencesStore } from '$lib/stores'
   import RestTimer from './RestTimer.svelte'
   import type { 
     Workout, 
@@ -27,6 +27,10 @@
   const tenRMs = $derived($exerciseStore.tenRMs)
   const weightUnit = $derived($preferencesStore.weightUnit)
 
+  // Local state for showing rest timer
+  let showRest = $state(false)
+  let restTimerRef = $state<{ start: () => void } | undefined>(undefined)
+
   const toggleSet = async (exerciseAndSchemeIndex: string, setIndex: number) => {
     const key = `${exerciseAndSchemeIndex}-${setIndex}`
     const isBeingCompleted = !completedSets[key]
@@ -46,25 +50,21 @@
         // Request notification permission without blocking (don't await)
         requestNotificationPermission()
         
-        const initialTime = workout.type === 'strength' ? 180 : 90 // 3 min for strength, 1.5 min for hypertrophy
-        const now = Date.now()
-        
-        // Update rest timer state in store
-        uiStore.update(state => ({
-          ...state,
-          restTimer: {
-            isActive: true,
-            timeLeft: initialTime,
-            totalTime: initialTime,
-            workoutType: workout.type as 'strength' | 'hypertrophy',
-            phase: 'initial',
-            startTime: now
-          }
-        }))
+        // Show rest timer and start it
+        showRest = true
+        // Wait for the component to render before calling start
+        await new Promise(resolve => setTimeout(resolve, 0))
+        if (restTimerRef) {
+          restTimerRef.start()
+        }
       }
     }
   }
 
+  const onRestComplete = () => {
+    showRest = false
+  }
+
   // Derive strength workout with proper typing - more idiomatic than casting everywhere
   const strengthWorkout = $derived(() => workout as StrengthWorkout | HypertrophyWorkout)
 
@@ -85,7 +85,13 @@
 
 {#if workout.type === 'strength' || workout.type === 'hypertrophy'}
   <div class="space-y-4">
-    <RestTimer />
+    {#if showRest}
+      <RestTimer 
+        workoutType={workout.type}
+        onStop={onRestComplete}
+        bind:this={restTimerRef}
+      />
+    {/if}
     {#each (strengthWorkout().exercises || []) as exercise, exerciseIndex}
       {@const setSchemes = (strengthWorkout().sets || '').split(',')}
       {@const exerciseSetSchemes = getExerciseData(exerciseIndex, 0).shouldMapByIndex ? [setSchemes[exerciseIndex]] : setSchemes}