[{"data":1,"prerenderedAt":4},["ShallowReactive",2],{"example-src-whoop-dashboard":3},"\u003Cgui version=\"0.2\" name=\"WhoopDashboard\">\n  \u003Ctokens>\n    \u003C!-- Color Palette -->\n    \u003Ccolor name=\"bg\" value=\"#08080C\" \u002F>\n    \u003Ccolor name=\"surface\" value=\"#111116\" \u002F>\n    \u003Ccolor name=\"surface-elevated\" value=\"#181822\" \u002F>\n    \u003Ccolor name=\"border\" value=\"#1F1F2C\" \u002F>\n    \u003Ccolor name=\"text-primary\" value=\"#FFFFFF\" \u002F>\n    \u003Ccolor name=\"text-secondary\" value=\"#9BA3B0\" \u002F>\n    \u003Ccolor name=\"text-tertiary\" value=\"#64748B\" \u002F>\n    \n    \u003C!-- Accent Colors -->\n    \u003Ccolor name=\"recovery-green\" value=\"#00E676\" \u002F>\n    \u003Ccolor name=\"recovery-green-bg\" value=\"#00E67626\" \u002F>\n    \u003Ccolor name=\"strain-orange\" value=\"#FF5F1F\" \u002F>\n    \u003Ccolor name=\"strain-orange-bg\" value=\"#FF5F1F26\" \u002F>\n    \u003Ccolor name=\"sleep-teal\" value=\"#00E5FF\" \u002F>\n    \u003Ccolor name=\"sleep-teal-bg\" value=\"#00E5FF26\" \u002F>\n    \u003Ccolor name=\"stress-purple\" value=\"#AF52DE\" \u002F>\n    \u003Ccolor name=\"stress-purple-bg\" value=\"#AF52DE26\" \u002F>\n    \u003Ccolor name=\"white\" value=\"#FFFFFF\" \u002F>\n\n    \u003C!-- Spacing Scale -->\n    \u003Cnumber name=\"space-xs\" value=\"4\" \u002F>\n    \u003Cnumber name=\"space-sm\" value=\"8\" \u002F>\n    \u003Cnumber name=\"space-md\" value=\"12\" \u002F>\n    \u003Cnumber name=\"space-lg\" value=\"16\" \u002F>\n    \u003Cnumber name=\"space-xl\" value=\"24\" \u002F>\n    \u003Cnumber name=\"space-xxl\" value=\"32\" \u002F>\n\n    \u003C!-- Corner Radius Scale -->\n    \u003Cnumber name=\"radius-subtle\" value=\"8\" \u002F>\n    \u003Cnumber name=\"radius-card\" value=\"16\" \u002F>\n    \u003Cnumber name=\"radius-pill\" value=\"999\" \u002F>\n  \u003C\u002Ftokens>\n\n  \u003Cstyles>\n    \u003C!-- Typography Scales (Optimized line-heights for breathing room) -->\n    \u003Ctext-style name=\"Display\" font-family=\"SF Pro\" font-size=\"40\" font-weight=\"700\" line-height=\"52\" \u002F>\n    \u003Ctext-style name=\"LargeTitle\" font-family=\"SF Pro\" font-size=\"34\" font-weight=\"700\" line-height=\"42\" \u002F>\n    \u003Ctext-style name=\"Headline\" font-family=\"SF Pro\" font-size=\"17\" font-weight=\"600\" line-height=\"24\" \u002F>\n    \u003Ctext-style name=\"Body\" font-family=\"SF Pro\" font-size=\"17\" font-weight=\"400\" line-height=\"24\" \u002F>\n    \u003Ctext-style name=\"Subheadline\" font-family=\"SF Pro\" font-size=\"15\" font-weight=\"400\" line-height=\"22\" \u002F>\n    \u003Ctext-style name=\"Footnote\" font-family=\"SF Pro\" font-size=\"13\" font-weight=\"400\" line-height=\"20\" \u002F>\n    \u003Ctext-style name=\"Caption\" font-family=\"SF Pro\" font-size=\"12\" font-weight=\"500\" line-height=\"18\" letter-spacing=\"0.4\" \u002F>\n    \u003Ctext-style name=\"Tiny\" font-family=\"SF Pro\" font-size=\"10\" font-weight=\"600\" line-height=\"16\" letter-spacing=\"0.8\" \u002F>\n  \u003C\u002Fstyles>\n\n  \u003Cfonts>\n    \u003Cfont family=\"SF Pro\" source=\"system\" weights=\"400 500 600 700\" styles=\"normal\" \u002F>\n    \u003Cfont family=\"Inter\" source=\"google\" weights=\"400 500 600 700\" styles=\"normal\" \u002F>\n  \u003C\u002Ffonts>\n\n  \u003Ccomponents>\n    \u003C!-- Reusable Metric Widget Component -->\n    \u003Ccomponent name=\"Widget\u002FMetric\" id=\"comp-metric\">\n      \u003Cprops>\n        \u003Cprop name=\"value\" type=\"text\" target=\"val-text\" \u002F>\n        \u003Cprop name=\"label\" type=\"text\" target=\"lbl-text\" \u002F>\n      \u003C\u002Fprops>\n      \u003Ccol gap=\"4\" align=\"top-center\">\n        \u003Ctext id=\"val-text\" value=\"--\" font-family=\"SF Pro\" font-size=\"18\" font-weight=\"700\" color=\"$text-primary\" line-height=\"22\" \u002F>\n        \u003Ctext id=\"lbl-text\" value=\"--\" font-family=\"SF Pro\" font-size=\"11\" font-weight=\"500\" color=\"$text-secondary\" line-height=\"14\" letter-spacing=\"0.4\" \u002F>\n      \u003C\u002Fcol>\n    \u003C\u002Fcomponent>\n  \u003C\u002Fcomponents>\n\n  \u003C!-- iOS Root Layout Canvas (Width strictly 390px, heights flow cleanly for scroll) -->\n  \u003Ccol w=\"390\" fill=\"$bg\">\n    \n    \u003C!-- iOS Top Safe Area Spacer -->\n    \u003Ccol h=\"47\" \u002F>\n\n    \u003C!-- Section 1: Navigation & Header Area -->\n    \u003Crow role=\"top-navigation-bar\" w=\"fill\" p=\"16 20 8 20\" align=\"middle-left\" gap=\"12\">\n      \u003Ctext text-style=\"LargeTitle\" value=\"Today\" color=\"$text-primary\" \u002F>\n      \n      \u003C!-- Date Switcher Pager -->\n      \u003Crow fill=\"$surface\" p=\"4 12\" radius=\"$radius-pill\" align=\"middle-center\" gap=\"8\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fchevron-left.svg?color=%23FFFFFF\" w=\"12\" h=\"12\" \u002F>\n        \u003Ctext text-style=\"Footnote\" value=\"TODAY, MAY 27\" color=\"$text-primary\" font-weight=\"600\" \u002F>\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fchevron-right.svg?color=%23FFFFFF\" w=\"12\" h=\"12\" \u002F>\n      \u003C\u002Frow>\n\n      \u003Ccol w=\"fill\" \u002F>\n\n      \u003C!-- User Profile avatar matching iOS HIG -->\n      \u003Cimg role=\"avatar\" src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1534528741775-53994a69daeb?auto=format&fit=crop&w=96&h=96&q=80\" w=\"36\" h=\"36\" radius=\"18\" fit=\"cover\" \u002F>\n    \u003C\u002Frow>\n\n    \u003C!-- Main Content Stream (Enforced w=\"fill\" stretching) -->\n    \u003Ccol w=\"fill\" p=\"8 16 12 16\" gap=\"16\">\n\n      \u003C!-- Pillar 1: Recovery Card (Conic progress ring) -->\n      \u003Ccol role=\"card\" w=\"fill\" fill=\"$surface\" radius=\"$radius-card\" p=\"$space-lg\" gap=\"$space-lg\">\n        \u003Cappearance>\n          \u003Cfill type=\"linear-gradient\" value=\"linear-gradient(135deg, #111116 0%, #0C1E14 100%)\" \u002F>\n        \u003C\u002Fappearance>\n        \n        \u003Crow w=\"fill\" gap=\"16\" align=\"middle-left\">\n          \u003C!-- Conic progress ring for Recovery (92% = 331deg) -->\n          \u003Cframe w=\"80\" h=\"80\">\n            \u003Cellipse fill=\"conic-gradient(from 0deg at 50% 50%, $recovery-green 0deg, $recovery-green 331deg, $border 331deg, $border 360deg)\" w=\"80\" h=\"80\" x=\"0\" y=\"0\" \u002F>\n            \u003Cellipse fill=\"$surface\" w=\"66\" h=\"66\" x=\"7\" y=\"7\" \u002F>\n            \u003Ccol w=\"80\" h=\"80\" x=\"0\" y=\"0\" align=\"middle-center\">\n              \u003Ctext value=\"92%\" font-family=\"SF Pro\" font-size=\"18\" font-weight=\"700\" color=\"$recovery-green\" line-height=\"22\" \u002F>\n            \u003C\u002Fcol>\n          \u003C\u002Fframe>\n\n          \u003C!-- Recovery Diagnostic Info -->\n          \u003Ccol gap=\"4\" w=\"fill\">\n            \u003Ctext text-style=\"Tiny\" value=\"RECOVERY\" color=\"$text-secondary\" \u002F>\n            \u003Crow gap=\"8\" align=\"middle-left\" w=\"fill\">\n              \u003Ctext text-style=\"Headline\" value=\"Peak Recovery\" color=\"$white\" \u002F>\n              \u003Crow fill=\"$recovery-green-bg\" p=\"2 8\" radius=\"$radius-pill\">\n                \u003Ctext text-style=\"Tiny\" value=\"PEAK\" color=\"$recovery-green\" font-weight=\"700\" \u002F>\n              \u003C\u002Frow>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Footnote\" value=\"Autonomic nervous system is highly adapted and fully primed.\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- Vertical Spacing between Donut+Data and KPIs below -->\n        \u003Ccol h=\"8\" \u002F>\n        \u003Cline fill=\"$border\" \u002F>\n        \u003Ccol h=\"8\" \u002F>\n\n        \u003C!-- Sub-metrics Grid (HRV, RHR, Skin Temp) -->\n        \u003Crow w=\"fill\" align=\"middle-center\" gap=\"$space-md\">\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"74 ms\" label=\"HRV\" \u002F>\n          \u003C\u002Fcol>\n          \u003Cline fill=\"$border\" direction=\"vertical\" h=\"28\" \u002F>\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"48 bpm\" label=\"RHR\" \u002F>\n          \u003C\u002Fcol>\n          \u003Cline fill=\"$border\" direction=\"vertical\" h=\"28\" \u002F>\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"+0.2 °F\" label=\"SKIN TEMP\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n      \u003C\u002Fcol>\n\n      \u003C!-- Pillar 2: Strain Card (Conic progress ring + detailed Activity list) -->\n      \u003Ccol role=\"card\" w=\"fill\" fill=\"$surface\" radius=\"$radius-card\" p=\"$space-lg\" gap=\"$space-lg\">\n        \u003Cappearance>\n          \u003Cfill type=\"linear-gradient\" value=\"linear-gradient(135deg, #111116 0%, #20120D 100%)\" \u002F>\n        \u003C\u002Fappearance>\n        \n        \u003Crow w=\"fill\" gap=\"16\" align=\"middle-left\">\n          \u003C!-- Conic progress ring for Strain (14.8\u002F21 = 70.4% = 253deg) -->\n          \u003Cframe w=\"80\" h=\"80\">\n            \u003Cellipse fill=\"conic-gradient(from 0deg at 50% 50%, $strain-orange 0deg, $strain-orange 253deg, $border 253deg, $border 360deg)\" w=\"80\" h=\"80\" x=\"0\" y=\"0\" \u002F>\n            \u003Cellipse fill=\"$surface\" w=\"66\" h=\"66\" x=\"7\" y=\"7\" \u002F>\n            \u003Ccol w=\"80\" h=\"80\" x=\"0\" y=\"0\" align=\"middle-center\">\n              \u003Ctext value=\"14.8\" font-family=\"SF Pro\" font-size=\"18\" font-weight=\"700\" color=\"$strain-orange\" line-height=\"22\" \u002F>\n            \u003C\u002Fcol>\n          \u003C\u002Fframe>\n\n          \u003C!-- Strain Info -->\n          \u003Ccol gap=\"4\" w=\"fill\">\n            \u003Ctext text-style=\"Tiny\" value=\"DAY STRAIN\" color=\"$text-secondary\" \u002F>\n            \u003Crow gap=\"8\" align=\"middle-left\" w=\"fill\">\n              \u003Ctext text-style=\"Headline\" value=\"Optimal Strain Achieved\" color=\"$white\" \u002F>\n              \u003Crow fill=\"$strain-orange-bg\" p=\"2 8\" radius=\"$radius-pill\">\n                \u003Ctext text-style=\"Tiny\" value=\"HIGH\" color=\"$strain-orange\" font-weight=\"700\" \u002F>\n              \u003C\u002Frow>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Footnote\" value=\"Excellent workout stimulus. Target zone (12.0 - 16.5) achieved.\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- Vertical Spacing between Donut+Data and KPIs below -->\n        \u003Ccol h=\"8\" \u002F>\n        \u003Cline fill=\"$border\" \u002F>\n        \u003Ccol h=\"8\" \u002F>\n\n        \u003C!-- Sub-metrics Grid (Cals, Avg HR, Max HR) -->\n        \u003Crow w=\"fill\" align=\"middle-center\" gap=\"$space-md\">\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"942 kcal\" label=\"ACT. CALS\" \u002F>\n          \u003C\u002Fcol>\n          \u003Cline fill=\"$border\" direction=\"vertical\" h=\"28\" \u002F>\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"134 bpm\" label=\"AVG HR\" \u002F>\n          \u003C\u002Fcol>\n          \u003Cline fill=\"$border\" direction=\"vertical\" h=\"28\" \u002F>\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"182 bpm\" label=\"MAX HR\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- Vertical Spacing before Activity Log -->\n        \u003Ccol h=\"8\" \u002F>\n        \u003Cline fill=\"$border\" \u002F>\n        \u003Ccol h=\"8\" \u002F>\n\n        \u003C!-- Rich Activity log details inside Strain -->\n        \u003Ccol gap=\"10\" w=\"fill\">\n          \u003Ctext text-style=\"Tiny\" value=\"TODAY'S ACTIVITIES\" color=\"$text-secondary\" \u002F>\n          \n          \u003C!-- Activity 1 -->\n          \u003Crow w=\"fill\" fill=\"$surface-elevated\" p=\"10 12\" radius=\"$radius-subtle\" align=\"middle-left\" gap=\"10\">\n            \u003Crow w=\"28\" h=\"28\" radius=\"14\" fill=\"$strain-orange-bg\" align=\"middle-center\">\n              \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Factivity.svg?color=%23FF5F1F\" w=\"14\" h=\"14\" \u002F>\n            \u003C\u002Frow>\n            \u003Ccol gap=\"2\">\n              \u003Ctext font-family=\"SF Pro\" font-size=\"14\" font-weight=\"600\" value=\"Morning Trail Running\" color=\"$white\" line-height=\"18\" \u002F>\n              \u003Ctext text-style=\"Footnote\" value=\"45 mins • Avg HR 152 bpm\" color=\"$text-secondary\" \u002F>\n            \u003C\u002Fcol>\n            \u003Ccol w=\"fill\" \u002F>\n            \u003Ccol align=\"middle-right\">\n              \u003Ctext font-family=\"SF Pro\" font-size=\"14\" font-weight=\"700\" value=\"9.4\" color=\"$strain-orange\" line-height=\"18\" \u002F>\n              \u003Ctext text-style=\"Tiny\" value=\"STRAIN\" color=\"$text-tertiary\" \u002F>\n            \u003C\u002Fcol>\n          \u003C\u002Frow>\n\n          \u003C!-- Activity 2 -->\n          \u003Crow w=\"fill\" fill=\"$surface-elevated\" p=\"10 12\" radius=\"$radius-subtle\" align=\"middle-left\" gap=\"10\">\n            \u003Crow w=\"28\" h=\"28\" radius=\"14\" fill=\"$strain-orange-bg\" align=\"middle-center\">\n              \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fflame.svg?color=%23FF5F1F\" w=\"14\" h=\"14\" \u002F>\n            \u003C\u002Frow>\n            \u003Ccol gap=\"2\">\n              \u003Ctext font-family=\"SF Pro\" font-size=\"14\" font-weight=\"600\" value=\"Strength Training\" color=\"$white\" line-height=\"18\" \u002F>\n              \u003Ctext text-style=\"Footnote\" value=\"1h 10m • Avg HR 118 bpm\" color=\"$text-secondary\" \u002F>\n            \u003C\u002Fcol>\n            \u003Ccol w=\"fill\" \u002F>\n            \u003Ccol align=\"middle-right\">\n              \u003Ctext font-family=\"SF Pro\" font-size=\"14\" font-weight=\"700\" value=\"11.2\" color=\"$strain-orange\" line-height=\"18\" \u002F>\n              \u003Ctext text-style=\"Tiny\" value=\"STRAIN\" color=\"$text-tertiary\" \u002F>\n            \u003C\u002Fcol>\n          \u003C\u002Frow>\n        \u003C\u002Fcol>\n      \u003C\u002Fcol>\n\n      \u003C!-- Pillar 3: Sleep Card (Conic progress ring) -->\n      \u003Ccol role=\"card\" w=\"fill\" fill=\"$surface\" radius=\"$radius-card\" p=\"$space-lg\" gap=\"$space-lg\">\n        \u003Cappearance>\n          \u003Cfill type=\"linear-gradient\" value=\"linear-gradient(135deg, #111116 0%, #0B1E22 100%)\" \u002F>\n        \u003C\u002Fappearance>\n        \n        \u003Crow w=\"fill\" gap=\"16\" align=\"middle-left\">\n          \u003C!-- Conic progress ring for Sleep (88% = 317deg) -->\n          \u003Cframe w=\"80\" h=\"80\">\n            \u003Cellipse fill=\"conic-gradient(from 0deg at 50% 50%, $sleep-teal 0deg, $sleep-teal 317deg, $border 317deg, $border 360deg)\" w=\"80\" h=\"80\" x=\"0\" y=\"0\" \u002F>\n            \u003Cellipse fill=\"$surface\" w=\"66\" h=\"66\" x=\"7\" y=\"7\" \u002F>\n            \u003Ccol w=\"80\" h=\"80\" x=\"0\" y=\"0\" align=\"middle-center\">\n              \u003Ctext value=\"88%\" font-family=\"SF Pro\" font-size=\"18\" font-weight=\"700\" color=\"$sleep-teal\" line-height=\"22\" \u002F>\n            \u003C\u002Fcol>\n          \u003C\u002Fframe>\n\n          \u003C!-- Sleep Info -->\n          \u003Ccol gap=\"4\" w=\"fill\">\n            \u003Ctext text-style=\"Tiny\" value=\"SLEEP PERFORMANCE\" color=\"$text-secondary\" \u002F>\n            \u003Crow gap=\"8\" align=\"middle-left\" w=\"fill\">\n              \u003Ctext text-style=\"Headline\" value=\"8h 12m Duration\" color=\"$white\" \u002F>\n              \u003Crow fill=\"$sleep-teal-bg\" p=\"2 8\" radius=\"$radius-pill\">\n                \u003Ctext text-style=\"Tiny\" value=\"OPTIMAL\" color=\"$sleep-teal\" font-weight=\"700\" \u002F>\n              \u003C\u002Frow>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Footnote\" value=\"High restorative sleep. Sleeping consistency is at 94%.\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- Vertical Spacing between Donut+Data and KPIs below -->\n        \u003Ccol h=\"8\" \u002F>\n        \u003Cline fill=\"$border\" \u002F>\n        \u003Ccol h=\"8\" \u002F>\n\n        \u003C!-- Sub-metrics Grid (Duration, REM, Deep) -->\n        \u003Crow w=\"fill\" align=\"middle-center\" gap=\"$space-md\">\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"8h 12m\" label=\"DURATION\" \u002F>\n          \u003C\u002Fcol>\n          \u003Cline fill=\"$border\" direction=\"vertical\" h=\"28\" \u002F>\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"2h 14m\" label=\"REM\" \u002F>\n          \u003C\u002Fcol>\n          \u003Cline fill=\"$border\" direction=\"vertical\" h=\"28\" \u002F>\n          \u003Ccol w=\"fill\" align=\"top-center\">\n            \u003Cinstance component=\"comp-metric\" value=\"1h 56m\" label=\"DEEP\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n      \u003C\u002Fcol>\n\n      \u003C!-- Section 4: Stress Monitor -->\n      \u003Ccol role=\"card\" w=\"fill\" fill=\"$surface\" radius=\"$radius-card\" p=\"$space-lg\" gap=\"$space-md\">\n        \u003Cappearance>\n          \u003Cfill type=\"linear-gradient\" value=\"linear-gradient(135deg, #111116 0%, #170F1C 100%)\" \u002F>\n        \u003C\u002Fappearance>\n\n        \u003Crow w=\"fill\" align=\"middle-left\">\n          \u003Ccol gap=\"2\">\n            \u003Ctext text-style=\"Tiny\" value=\"STRESS MONITOR\" color=\"$text-secondary\" \u002F>\n            \u003Ctext text-style=\"Headline\" value=\"Stress Level: Stable\" color=\"$white\" \u002F>\n          \u003C\u002Fcol>\n          \u003Ccol w=\"fill\" \u002F>\n          \u003Crow fill=\"$stress-purple-bg\" p=\"6 12\" radius=\"$radius-pill\" align=\"middle-center\">\n            \u003Ctext text-style=\"Tiny\" value=\"2.1 \u002F 4.0\" color=\"$stress-purple\" font-weight=\"700\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n\n        \u003C!-- Spacers and line -->\n        \u003Ccol h=\"6\" \u002F>\n        \u003Cline fill=\"$border\" \u002F>\n        \u003Ccol h=\"6\" \u002F>\n\n        \u003C!-- Stress indicator layout -->\n        \u003Crow w=\"fill\" gap=\"12\" align=\"middle-left\">\n          \u003Ccol gap=\"4\" w=\"fill\">\n            \u003Ctext text-style=\"Footnote\" value=\"Your stress is stable. High-stress spikes detected at 10:15 AM (during meeting) but quickly normalized via deep breathing techniques.\" color=\"$text-secondary\" \u002F>\n            \u003Crow gap=\"6\" align=\"middle-left\" pt=\"4\">\n              \u003Cellipse fill=\"$stress-purple\" w=\"8\" h=\"8\" \u002F>\n              \u003Ctext text-style=\"Tiny\" value=\"12 MINS OF HIGH STRESS DETECTED\" color=\"$stress-purple\" font-weight=\"600\" \u002F>\n            \u003C\u002Frow>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n      \u003C\u002Fcol>\n\n      \u003C!-- Section 5: Weekly Trends -->\n      \u003Ccol role=\"card\" w=\"fill\" fill=\"$surface\" radius=\"$radius-card\" p=\"$space-lg\" gap=\"$space-lg\">\n        \u003Ccol gap=\"2\" w=\"fill\">\n          \u003Ctext text-style=\"Tiny\" value=\"WEEKLY SUMMARY\" color=\"$text-secondary\" \u002F>\n          \u003Ctext text-style=\"Headline\" value=\"Strain & Recovery Trends\" color=\"$white\" \u002F>\n        \u003C\u002Fcol>\n\n        \u003Cline fill=\"$border\" \u002F>\n\n        \u003C!-- 7-Day Custom Bar Chart (Recovery & Strain bars side-by-side) -->\n        \u003Crow w=\"fill\" gap=\"auto\" align=\"bottom-center\" h=\"130\" p=\"4 0 0 0\">\n          \n          \u003C!-- Mon -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"45\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"70\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"M\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n\n          \u003C!-- Tue -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"30\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"85\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"T\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n\n          \u003C!-- Wed -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"80\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"50\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"W\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n\n          \u003C!-- Thu -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"90\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"65\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"T\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n\n          \u003C!-- Fri -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"75\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"45\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"F\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n\n          \u003C!-- Sat -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"50\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"95\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"S\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n\n          \u003C!-- Sun -->\n          \u003Ccol gap=\"8\" align=\"middle-center\">\n            \u003Crow gap=\"4\" align=\"bottom-center\" h=\"100\">\n              \u003Crect w=\"10\" h=\"85\" fill=\"$recovery-green\" radius=\"4\" \u002F>\n              \u003Crect w=\"10\" h=\"30\" fill=\"$strain-orange\" radius=\"4\" \u002F>\n            \u003C\u002Frow>\n            \u003Ctext text-style=\"Tiny\" value=\"S\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n          \n        \u003C\u002Frow>\n      \u003C\u002Fcol>\n\n      \u003C!-- Section 6: WHOOP Coach Insights Card -->\n      \u003Ccol role=\"card\" w=\"fill\" fill=\"$surface\" radius=\"$radius-card\" p=\"$space-lg\" gap=\"12\">\n        \u003Crow align=\"middle-left\" w=\"fill\">\n          \u003Crow gap=\"6\" align=\"middle-left\">\n            \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fsparkles.svg?color=%2300E676\" w=\"14\" h=\"14\" \u002F>\n            \u003Ctext text-style=\"Tiny\" value=\"WHOOP COACH\" color=\"$recovery-green\" font-weight=\"600\" \u002F>\n          \u003C\u002Frow>\n          \u003Ccol w=\"fill\" \u002F>\n          \u003Ctext text-style=\"Tiny\" value=\"AI ADVISOR\" color=\"$text-tertiary\" \u002F>\n        \u003C\u002Frow>\n        \n        \u003Ctext text-style=\"Headline\" value=\"Primed for high cardiovascular strain.\" color=\"$text-primary\" \u002F>\n        \n        \u003Ctext text-style=\"Footnote\" color=\"$text-secondary\" line-height=\"18\">\n          \u003Csegment value=\"Your recovery is at \" color=\"$text-secondary\" \u002F>\n          \u003Csegment value=\"92% (Peak)\" color=\"$recovery-green\" font-weight=\"600\" \u002F>\n          \u003Csegment value=\" today. Your heart rate variability is higher than your weekly average. Your cardiovascular system is completely adapted and primed for intense training. Make sure to target \" color=\"$text-secondary\" \u002F>\n          \u003Csegment value=\"12.0 to 16.5 Strain\" color=\"$strain-orange\" font-weight=\"600\" \u002F>\n          \u003Csegment value=\" to maximize training stimulus and accelerate athletic adaptability.\" color=\"$text-secondary\" \u002F>\n        \u003C\u002Ftext>\n      \u003C\u002Fcol>\n\n      \u003Ccol h=\"12\" \u002F>\n\n    \u003C\u002Fcol>\n\n    \u003C!-- Section 7: iOS Fixed-Style Bottom Tab Bar Spacer -->\n    \u003Crow role=\"tab-bar\" w=\"390\" h=\"83\" fill=\"$surface\" p=\"10 24 34 24\" gap=\"auto\" align=\"middle-center\" border=\"1 $border\">\n      \n      \u003C!-- Tab 1: Today (Active) -->\n      \u003Ccol gap=\"4\" align=\"middle-center\" w=\"50\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Flayout-dashboard.svg?color=%23FFFFFF\" w=\"20\" h=\"20\" \u002F>\n        \u003Ctext text-style=\"Tiny\" value=\"Today\" color=\"$text-primary\" font-weight=\"600\" \u002F>\n      \u003C\u002Fcol>\n\n      \u003C!-- Tab 2: Strain (Inactive) -->\n      \u003Ccol gap=\"4\" align=\"middle-center\" w=\"50\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fflame.svg?color=%2364748B\" w=\"20\" h=\"20\" \u002F>\n        \u003Ctext text-style=\"Tiny\" value=\"Strain\" color=\"$text-tertiary\" \u002F>\n      \u003C\u002Fcol>\n\n      \u003C!-- Tab 3: Recovery (Inactive) -->\n      \u003Ccol gap=\"4\" align=\"middle-center\" w=\"50\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fheart-pulse.svg?color=%2364748B\" w=\"20\" h=\"20\" \u002F>\n        \u003Ctext text-style=\"Tiny\" value=\"Recovery\" color=\"$text-tertiary\" \u002F>\n      \u003C\u002Fcol>\n\n      \u003C!-- Tab 4: Sleep (Inactive) -->\n      \u003Ccol gap=\"4\" align=\"middle-center\" w=\"50\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fmoon.svg?color=%2364748B\" w=\"20\" h=\"20\" \u002F>\n        \u003Ctext text-style=\"Tiny\" value=\"Sleep\" color=\"$text-tertiary\" \u002F>\n      \u003C\u002Fcol>\n\n      \u003C!-- Tab 5: Coach (Inactive) -->\n      \u003Ccol gap=\"4\" align=\"middle-center\" w=\"50\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fsparkles.svg?color=%2364748B\" w=\"20\" h=\"20\" \u002F>\n        \u003Ctext text-style=\"Tiny\" value=\"Coach\" color=\"$text-tertiary\" \u002F>\n      \u003C\u002Fcol>\n      \n    \u003C\u002Frow>\n\n  \u003C\u002Fcol>\n\u003C\u002Fgui>\n",1784753172952]