[{"data":1,"prerenderedAt":4},["ShallowReactive",2],{"example-src-spotify-desktop":3},"\u003Cgui version=\"0.2\" name=\"SpotifyDesktop\">\n  \u003Ctokens>\n    \u003C!-- Spotify Premium Dark Brand Palette -->\n    \u003Ccolor name=\"bg-base\" value=\"#000000\" \u002F>\n    \u003Ccolor name=\"bg-main\" value=\"#121212\" \u002F>\n    \u003Ccolor name=\"surface-card\" value=\"#181818\" \u002F>\n    \u003Ccolor name=\"surface-card-hover\" value=\"#242424\" \u002F>\n    \u003Ccolor name=\"surface-elevated\" value=\"#282828\" \u002F>\n    \u003Ccolor name=\"accent-green\" value=\"#1DB954\" \u002F>\n    \n    \u003C!-- Text Colors -->\n    \u003Ccolor name=\"text-primary\" value=\"#FFFFFF\" \u002F>\n    \u003Ccolor name=\"text-secondary\" value=\"#B3B3B3\" \u002F>\n    \u003Ccolor name=\"text-muted\" value=\"#727272\" \u002F>\n    \u003Ccolor name=\"border-hairline\" value=\"#202020\" \u002F>\n\n    \u003C!-- Radii -->\n    \u003Cnumber name=\"radius-sm\" value=\"4\" \u002F>\n    \u003Cnumber name=\"radius-md\" value=\"8\" \u002F>\n    \u003Cnumber name=\"radius-full\" value=\"9999\" \u002F>\n  \u003C\u002Ftokens>\n\n  \u003Cstyles>\n    \u003C!-- Spotify Typography Style Scale -->\n    \u003Ctext-style name=\"Sidebar\u002FItem\" font-family=\"Inter\" font-size=\"14\" font-weight=\"600\" line-height=\"20\" \u002F>\n    \u003Ctext-style name=\"Sidebar\u002FLibraryHeader\" font-family=\"Inter\" font-size=\"14\" font-weight=\"600\" line-height=\"20\" \u002F>\n    \u003Ctext-style name=\"Sidebar\u002FPill\" font-family=\"Inter\" font-size=\"12\" font-weight=\"500\" line-height=\"16\" \u002F>\n    \u003Ctext-style name=\"Sidebar\u002FCardTitle\" font-family=\"Inter\" font-size=\"13\" font-weight=\"600\" line-height=\"18\" \u002F>\n    \u003Ctext-style name=\"Sidebar\u002FCardDesc\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" line-height=\"16\" \u002F>\n\n    \u003Ctext-style name=\"Dashboard\u002FGreeting\" font-family=\"Inter\" font-size=\"28\" font-weight=\"600\" line-height=\"34\" letter-spacing=\"-0.6\" \u002F>\n    \u003Ctext-style name=\"Dashboard\u002FSectionHeader\" font-family=\"Inter\" font-size=\"20\" font-weight=\"600\" line-height=\"26\" letter-spacing=\"-0.4\" \u002F>\n    \u003Ctext-style name=\"Dashboard\u002FQuickTitle\" font-family=\"Inter\" font-size=\"13\" font-weight=\"600\" line-height=\"18\" \u002F>\n    \n    \u003Ctext-style name=\"AlbumCard\u002FTitle\" font-family=\"Inter\" font-size=\"13\" font-weight=\"600\" line-height=\"16\" \u002F>\n    \u003Ctext-style name=\"AlbumCard\u002FDesc\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" line-height=\"14\" \u002F>\n\n    \u003Ctext-style name=\"Rightbar\u002FHeader\" font-family=\"Inter\" font-size=\"15\" font-weight=\"600\" line-height=\"20\" \u002F>\n    \u003Ctext-style name=\"Rightbar\u002FSectionHeader\" font-family=\"Inter\" font-size=\"13\" font-weight=\"600\" line-height=\"18\" \u002F>\n    \u003Ctext-style name=\"Rightbar\u002FText\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" line-height=\"15\" \u002F>\n\n    \u003Ctext-style name=\"Player\u002FTrackTitle\" font-family=\"Inter\" font-size=\"14\" font-weight=\"600\" line-height=\"18\" \u002F>\n    \u003Ctext-style name=\"Player\u002FTrackArtist\" font-family=\"Inter\" font-size=\"12\" font-weight=\"400\" line-height=\"16\" \u002F>\n    \u003Ctext-style name=\"Player\u002FTime\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" line-height=\"14\" \u002F>\n  \u003C\u002Fstyles>\n\n  \u003Cfonts>\n    \u003Cfont family=\"Inter\" source=\"google\" weights=\"400 500 600\" styles=\"normal\" \u002F>\n  \u003C\u002Ffonts>\n\n  \u003C!-- Root Canvas (Fixed Desktop Frame: 1440w x 900h) -->\n  \u003Cframe w=\"1440\" h=\"900\" fill=\"$bg-base\" clip=\"true\">\n\n    \u003C!-- ==================== LEFT SIDEBAR NAVIGATION ==================== -->\n    \u003Ccol role=\"sidebar\" w=\"240\" h=\"112\" fill=\"$bg-main\" radius=\"$radius-md\" p=\"16 20\" gap=\"16\" abs=\"true\" x=\"8\" y=\"8\">\n      \u003C!-- Home (Active) -->\n      \u003Crow w=\"fill\" gap=\"16\" align=\"middle-left\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fhome.svg?color=%23ffffff\" w=\"22\" h=\"22\" \u002F>\n        \u003Ctext value=\"Home\" text-style=\"Sidebar\u002FItem\" color=\"$text-primary\" \u002F>\n      \u003C\u002Frow>\n      \n      \u003C!-- Search (Inactive) -->\n      \u003Crow w=\"fill\" gap=\"16\" align=\"middle-left\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fsearch.svg?color=%23b3b3b3\" w=\"22\" h=\"22\" \u002F>\n        \u003Ctext value=\"Search\" text-style=\"Sidebar\u002FItem\" color=\"$text-secondary\" \u002F>\n      \u003C\u002Frow>\n    \u003C\u002Fcol>\n\n    \u003C!-- ==================== LEFT SIDEBAR LIBRARY ==================== -->\n    \u003Ccol role=\"navigation-menu\" w=\"240\" h=\"674\" fill=\"$bg-main\" radius=\"$radius-md\" p=\"14\" gap=\"12\" abs=\"true\" x=\"8\" y=\"128\">\n      \u003C!-- Library Header -->\n      \u003Crow w=\"fill\" gap=\"auto\" align=\"middle-left\">\n        \u003Crow gap=\"10\" align=\"middle-left\">\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Flibrary.svg?color=%23b3b3b3\" w=\"22\" h=\"22\" \u002F>\n          \u003Ctext value=\"Your Library\" text-style=\"Sidebar\u002FLibraryHeader\" color=\"$text-secondary\" \u002F>\n        \u003C\u002Frow>\n        \u003Crow gap=\"10\" align=\"middle-right\">\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fplus.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Farrow-right.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \u003C\u002Frow>\n      \u003C\u002Frow>\n\n      \u003C!-- Filter Pills -->\n      \u003Crow w=\"fill\" gap=\"6\" align=\"middle-left\">\n        \u003Crow role=\"chip\" fill=\"$surface-card-hover\" radius=\"10\" p=\"4 10\" align=\"middle-center\">\n          \u003Ctext value=\"Playlists\" text-style=\"Sidebar\u002FPill\" color=\"$text-primary\" \u002F>\n        \u003C\u002Frow>\n        \u003Crow role=\"chip\" fill=\"$surface-card-hover\" radius=\"10\" p=\"4 10\" align=\"middle-center\">\n          \u003Ctext value=\"Artists\" text-style=\"Sidebar\u002FPill\" color=\"$text-primary\" \u002F>\n        \u003C\u002Frow>\n      \u003C\u002Frow>\n\n      \u003C!-- Scrollable list representation (Tightly packed with 7 items) -->\n      \u003Ccol w=\"fill\" gap=\"8\">\n        \n        \u003C!-- List Item 1: Liked Songs -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\" radius=\"$radius-sm\">\n          \u003C!-- Liked Songs Gradient Thumbnail -->\n          \u003Cframe w=\"38\" h=\"38\" fill=\"linear-gradient(135deg, #450af5 0%, #c4efd9 100%)\" radius=\"$radius-sm\">\n            \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fheart.svg?color=%23ffffff\" w=\"16\" h=\"16\" abs=\"true\" x=\"11\" y=\"11\" \u002F>\n          \u003C\u002Fframe>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"Liked Songs\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Crow gap=\"4\" align=\"middle-left\">\n              \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fpin.svg?color=%231db954\" w=\"10\" h=\"10\" \u002F>\n              \u003Ctext value=\"Playlist • 420 songs\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n            \u003C\u002Frow>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- List Item 2: Discover Weekly -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=80&h=80&q=80\" w=\"38\" h=\"38\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"Nevermind – Nirvana\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Album • 1991\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- List Item 3: Chill Lofi Beats -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1516450360452-9312f5e86fc7?auto=format&fit=crop&w=80&h=80&q=80\" w=\"38\" h=\"38\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"Jagged Little Pill\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Album • Alanis Morissette\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- List Item 4: Release Radar -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1459749411175-04bf5292ceea?auto=format&fit=crop&w=80&h=80&q=80\" w=\"38\" h=\"38\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"Ready to Die – Biggie\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Album • 1994\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- List Item 5: Lofi Coding Mix -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1598387846148-47e82ee120cc?auto=format&fit=crop&w=80&h=80&q=80\" w=\"38\" h=\"38\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"All Eyez on Me\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Album • 2Pac\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- List Item 6: Next.js Radio -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1470229538611-16ba8c7ffbd7?auto=format&fit=crop&w=80&h=80&q=80\" w=\"38\" h=\"38\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"Spiceworld – Spice Girls\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Album • 1997\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n        \u003C!-- List Item 7: Auto Layout Sessions -->\n        \u003Crow w=\"fill\" gap=\"10\" align=\"middle-left\" p=\"2\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1506157786151-b8491531f063?auto=format&fit=crop&w=80&h=80&q=80\" w=\"38\" h=\"38\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\">\n            \u003Ctext value=\"90's Hip Hop Mix\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Playlist • Jinson Johny\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Fcol>\n        \u003C\u002Frow>\n\n      \u003C\u002Fcol>\n    \u003C\u002Fcol>\n\n    \u003C!-- ==================== CENTRAL MUSIC CONTENT AREA ==================== -->\n    \u003Ccol w=\"888\" h=\"794\" fill=\"$bg-main\" radius=\"$radius-md\" abs=\"true\" x=\"256\" y=\"8\" clip=\"true\" gap=\"0\">\n      \n      \u003C!-- Top Action bar -->\n      \u003Crow role=\"toolbar\" w=\"fill\" h=\"60\" p=\"12 24\" align=\"middle-left\" gap=\"auto\">\n        \u003C!-- Navigation Chevrons -->\n        \u003Crow gap=\"8\" align=\"middle-left\">\n          \u003Crow w=\"28\" h=\"28\" fill=\"#000000B3\" radius=\"14\" align=\"middle-center\">\n            \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fchevron-left.svg?color=%23ffffff\" w=\"18\" h=\"18\" \u002F>\n          \u003C\u002Frow>\n          \u003Crow w=\"28\" h=\"28\" fill=\"#000000B3\" radius=\"14\" align=\"middle-center\">\n            \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fchevron-right.svg?color=%23ffffff\" w=\"18\" h=\"18\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n\n        \u003C!-- User Controls -->\n        \u003Crow gap=\"12\" align=\"middle-right\">\n          \u003C!-- Premium Badge -->\n          \u003Crow role=\"badge\" fill=\"$text-primary\" radius=\"12\" p=\"4 12\" align=\"middle-center\">\n            \u003Ctext value=\"Explore Premium\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"#000000\" \u002F>\n          \u003C\u002Frow>\n          \u003C!-- Profile Profile -->\n          \u003Crow role=\"avatar\" fill=\"#000000B3\" radius=\"14\" p=\"2\" gap=\"8\" align=\"middle-left\">\n            \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1534528741775-53994a69daeb?auto=format&fit=crop&w=80&h=80&q=80\" w=\"24\" h=\"24\" radius=\"12\" fit=\"cover\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n      \u003C\u002Frow>\n\n      \u003C!-- Inner Dashboard Scroll flow (Tightly Packed with minimal padding) -->\n      \u003Ccol w=\"fill\" h=\"734\" clip=\"true\" p=\"0 24 24 24\" gap=\"24\">\n        \n        \u003C!-- Section 1: Good Evening Quick Play Grid (Curated Vibrant Pics, No hover buttons) -->\n        \u003Ccol w=\"fill\" gap=\"12\">\n          \u003Ctext value=\"Good evening\" text-style=\"Dashboard\u002FGreeting\" color=\"$text-primary\" \u002F>\n          \n          \u003Cgrid cols=\"268 268 268\" gap=\"12\" w=\"828\">\n            \n            \u003C!-- Quick item 1 -->\n            \u003Crow role=\"card\" w=\"fill\" fill=\"$surface-card\" radius=\"$radius-sm\" gap=\"12\" align=\"middle-left\" clip=\"true\" gc=\"1\" gr=\"1\" h=\"56\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=100&h=100&q=80\" w=\"56\" h=\"56\" fit=\"cover\" \u002F>\n              \u003Ctext value=\"Teen Spirit – Nirvana\" text-style=\"Dashboard\u002FQuickTitle\" color=\"$text-primary\" \u002F>\n            \u003C\u002Frow>\n\n            \u003C!-- Quick item 2 -->\n            \u003Crow role=\"card\" w=\"fill\" fill=\"$surface-card\" radius=\"$radius-sm\" gap=\"12\" align=\"middle-left\" clip=\"true\" gc=\"2\" gr=\"1\" h=\"56\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1516450360452-9312f5e86fc7?auto=format&fit=crop&w=100&h=100&q=80\" w=\"56\" h=\"56\" fit=\"cover\" \u002F>\n              \u003Ctext value=\"Waterfalls – TLC\" text-style=\"Dashboard\u002FQuickTitle\" color=\"$text-primary\" \u002F>\n            \u003C\u002Frow>\n\n            \u003C!-- Quick item 3 -->\n            \u003Crow role=\"card\"  w=\"fill\" fill=\"$surface-card\" radius=\"$radius-sm\" gap=\"12\" align=\"middle-left\" clip=\"true\" gc=\"3\" gr=\"1\" h=\"56\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1470229538611-16ba8c7ffbd7?auto=format&fit=crop&w=100&h=100&q=80\" w=\"56\" h=\"56\" fit=\"cover\" \u002F>\n              \u003Ctext value=\"Wannabe – Spice Girls\" text-style=\"Dashboard\u002FQuickTitle\" color=\"$text-primary\" \u002F>\n            \u003C\u002Frow>\n\n            \u003C!-- Quick item 4 -->\n            \u003Crow role=\"card\" w=\"fill\" fill=\"$surface-card\" radius=\"$radius-sm\" gap=\"12\" align=\"middle-left\" clip=\"true\" gc=\"1\" gr=\"2\" h=\"56\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1598387846148-47e82ee120cc?auto=format&fit=crop&w=100&h=100&q=80\" w=\"56\" h=\"56\" fit=\"cover\" \u002F>\n              \u003Ctext value=\"California Love – 2Pac\" text-style=\"Dashboard\u002FQuickTitle\" color=\"$text-primary\" \u002F>\n            \u003C\u002Frow>\n\n            \u003C!-- Quick item 5 -->\n            \u003Crow role=\"card\" w=\"fill\" fill=\"$surface-card\" radius=\"$radius-sm\" gap=\"12\" align=\"middle-left\" clip=\"true\" gc=\"2\" gr=\"2\" h=\"56\">\n              \u003Cframe w=\"56\" h=\"56\" fill=\"linear-gradient(135deg, #450af5 0%, #c4efd9 100%)\">\n                \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fheart.svg?color=%23ffffff\" w=\"24\" h=\"24\" abs=\"true\" x=\"16\" y=\"16\" \u002F>\n              \u003C\u002Fframe>\n              \u003Ctext value=\"Liked Songs\" text-style=\"Dashboard\u002FQuickTitle\" color=\"$text-primary\" \u002F>\n            \u003C\u002Frow>\n\n            \u003C!-- Quick item 6 -->\n            \u003Crow role=\"card\" w=\"fill\" fill=\"$surface-card\" radius=\"$radius-sm\" gap=\"12\" align=\"middle-left\" clip=\"true\" gc=\"3\" gr=\"2\" h=\"56\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1459749411175-04bf5292ceea?auto=format&fit=crop&w=100&h=100&q=80\" w=\"56\" h=\"56\" fit=\"cover\" \u002F>\n              \u003Ctext value=\"Hypnotize – Biggie\" text-style=\"Dashboard\u002FQuickTitle\" color=\"$text-primary\" \u002F>\n            \u003C\u002Frow>\n\n          \u003C\u002Fgrid>\n        \u003C\u002Fcol>\n\n        \u003C!-- Section 2: Recently Played Curated Cards (Curated Vibrant Pics: 156px wide each) -->\n        \u003Ccol w=\"fill\" gap=\"12\">\n          \u003Crow w=\"fill\" gap=\"auto\" align=\"bottom-left\">\n            \u003Ctext value=\"Recently Played\" text-style=\"Dashboard\u002FSectionHeader\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Show all\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Frow>\n\n          \u003Crow gap=\"12\" align=\"top-left\">\n            \u003C!-- Card 1 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Nevermind\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"Nirvana • 1991\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 2 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1516450360452-9312f5e86fc7?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"CrazySexyCool\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"TLC • 1994\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 3 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1470229538611-16ba8c7ffbd7?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Spice\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"Spice Girls • 1996\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 4 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1598387846148-47e82ee120cc?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"All Eyez on Me\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"2Pac • 1996\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 5 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1459749411175-04bf5292ceea?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Ready to Die\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"The Notorious B.I.G. • 1994\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n          \u003C\u002Frow>\n        \u003C\u002Fcol>\n\n        \u003C!-- Section 3: Made For Jinson Category -->\n        \u003Ccol w=\"fill\" gap=\"12\">\n          \u003Crow w=\"fill\" gap=\"auto\" align=\"bottom-left\">\n            \u003Ctext value=\"Made for Jinson\" text-style=\"Dashboard\u002FSectionHeader\" color=\"$text-primary\" \u002F>\n            \u003Ctext value=\"Show all\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Frow>\n\n          \u003Crow gap=\"12\" align=\"top-left\">\n            \u003C!-- Card 1 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\" >\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Jinson's 90s Mix\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"Nirvana · TLC · 2Pac\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 2 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1516450360452-9312f5e86fc7?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Jinson's R&B Mix\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"TLC · Mariah · Whitney\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 3 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1470229538611-16ba8c7ffbd7?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Jinson's Pop Mix\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"Spice Girls · Backstreet Boys\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 4 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1598387846148-47e82ee120cc?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Jinson's Hip-Hop Mix\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"2Pac · Biggie · Jay-Z\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n            \u003C!-- Card 5 -->\n            \u003Ccol role=\"card\" w=\"156\" fill=\"$surface-card\" p=\"12\" radius=\"$radius-md\" gap=\"8\" align=\"top-left\">\n              \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1459749411175-04bf5292ceea?auto=format&fit=crop&w=132&h=132&q=80\" w=\"132\" h=\"132\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n              \u003Ccol gap=\"2\">\n                \u003Ctext value=\"Jinson's Grunge Mix\" text-style=\"AlbumCard\u002FTitle\" color=\"$text-primary\" \u002F>\n                \u003Ctext value=\"Nirvana · Pearl Jam · STP\" text-style=\"AlbumCard\u002FDesc\" color=\"$text-secondary\" \u002F>\n              \u003C\u002Fcol>\n            \u003C\u002Fcol>\n\n          \u003C\u002Frow>\n        \u003C\u002Fcol>\n\n      \u003C\u002Fcol>\n    \u003C\u002Fcol>\n\n    \u003C!-- ==================== RIGHT SIDEBAR: NOW PLAYING VIEW ==================== -->\n    \u003Ccol role=\"sidebar\" w=\"280\" h=\"794\" fill=\"$bg-main\" radius=\"$radius-md\" p=\"16\" gap=\"12\" abs=\"true\" x=\"1152\" y=\"8\" clip=\"true\">\n      \u003C!-- Rightbar Header -->\n      \u003Crow w=\"fill\" gap=\"auto\" align=\"middle-left\">\n        \u003Ctext value=\"Now Playing\" text-style=\"Rightbar\u002FHeader\" color=\"$text-primary\" \u002F>\n        \u003Crow gap=\"10\" align=\"middle-right\">\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fmore-horizontal.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fx.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \u003C\u002Frow>\n      \u003C\u002Frow>\n\n      \u003C!-- Vibrant Abstract fluid-art Cover -->\n      \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=248&h=248&q=80\" w=\"248\" h=\"248\" radius=\"$radius-md\" fit=\"cover\" \u002F>\n\n      \u003C!-- Song Details -->\n      \u003Crow w=\"fill\" gap=\"auto\" align=\"middle-left\">\n        \u003Ccol gap=\"2\">\n          \u003Ctext value=\"Smells Like Teen Spirit\" text-style=\"Sidebar\u002FCardTitle\" color=\"$text-primary\" \u002F>\n          \u003Ctext value=\"Nirvana • Nevermind\" text-style=\"Sidebar\u002FCardDesc\" color=\"$text-secondary\" \u002F>\n        \u003C\u002Fcol>\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fheart.svg?color=%231db954\" w=\"20\" h=\"20\" \u002F>\n      \u003C\u002Frow>\n\n      \u003C!-- Mini Artist Bio Card -->\n      \u003Ccol w=\"fill\" fill=\"$surface-elevated\" radius=\"$radius-md\" p=\"12\" gap=\"8\">\n        \u003Ctext value=\"About the artist\" text-style=\"Rightbar\u002FSectionHeader\" color=\"$text-primary\" \u002F>\n        \u003Ctext value=\"Jinson Johny is the creator of the .gui visual layout standard, transforming how design maps directly to binary layout specification packages.\" text-style=\"Rightbar\u002FText\" color=\"$text-secondary\" line-height=\"15\" \u002F>\n      \u003C\u002Fcol>\n\n      \u003C!-- Expanded Next in Queue section (4 song items) -->\n      \u003Ccol w=\"fill\" gap=\"8\" pt=\"4\">\n        \u003Crow w=\"fill\" gap=\"auto\" align=\"middle-left\">\n          \u003Ctext value=\"Next in queue\" text-style=\"Rightbar\u002FSectionHeader\" color=\"$text-primary\" \u002F>\n          \u003Ctext value=\"Open queue\" text-style=\"Rightbar\u002FText\" color=\"$accent-green\" \u002F>\n        \u003C\u002Frow>\n        \n        \u003C!-- Queue Item 1 -->\n        \u003Crow w=\"fill\" gap=\"8\" align=\"middle-left\" p=\"4\" radius=\"$radius-sm\" fill=\"$surface-elevated\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1511678892159-0c2a5e3ad4bf?auto=format&fit=crop&w=80&h=80&q=80\" w=\"36\" h=\"36\" radius=\"4\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\" w=\"140\">\n            \u003Ctext value=\"Smells Like Teen Spirit\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"$text-primary\" truncate=\"true\" \u002F>\n            \u003Ctext value=\"Nirvana\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" color=\"$text-secondary\" truncate=\"true\" \u002F>\n          \u003C\u002Fcol>\n          \u003Crow w=\"fill\" align=\"middle-right\" pr=\"4\">\n            \u003Ctext value=\"5:01\" text-style=\"Rightbar\u002FText\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n\n        \u003C!-- Queue Item 2 -->\n        \u003Crow w=\"fill\" gap=\"8\" align=\"middle-left\" p=\"4\" radius=\"$radius-sm\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=80&h=80&q=80\" w=\"36\" h=\"36\" radius=\"4\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\" w=\"140\">\n            \u003Ctext value=\"Waterfalls\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"$text-primary\" truncate=\"true\" \u002F>\n            \u003Ctext value=\"TLC\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" color=\"$text-secondary\" truncate=\"true\" \u002F>\n          \u003C\u002Fcol>\n          \u003Crow w=\"fill\" align=\"middle-right\" pr=\"4\">\n            \u003Ctext value=\"4:40\" text-style=\"Rightbar\u002FText\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n\n        \u003C!-- Queue Item 3 -->\n        \u003Crow w=\"fill\" gap=\"8\" align=\"middle-left\" p=\"4\" radius=\"$radius-sm\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1499382569865-45bcb8b3bc71?auto=format&fit=crop&w=80&h=80&q=80\" w=\"36\" h=\"36\" radius=\"4\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\" w=\"140\">\n            \u003Ctext value=\"No Diggity\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"$text-primary\" truncate=\"true\" \u002F>\n            \u003Ctext value=\"Blackstreet\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" color=\"$text-secondary\" truncate=\"true\" \u002F>\n          \u003C\u002Fcol>\n          \u003Crow w=\"fill\" align=\"middle-right\" pr=\"4\">\n            \u003Ctext value=\"4:02\" text-style=\"Rightbar\u002FText\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n\n        \u003C!-- Queue Item 4 -->\n        \u003Crow w=\"fill\" gap=\"8\" align=\"middle-left\" p=\"4\" radius=\"$radius-sm\">\n          \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1549388604-817d15aaab94?auto=format&fit=crop&w=80&h=80&q=80\" w=\"36\" h=\"36\" radius=\"4\" fit=\"cover\" \u002F>\n          \u003Ccol gap=\"1\" w=\"140\">\n            \u003Ctext value=\"Wannabe\" font-family=\"Inter\" font-size=\"12\" font-weight=\"600\" color=\"$text-primary\" truncate=\"true\" \u002F>\n            \u003Ctext value=\"Spice Girls\" font-family=\"Inter\" font-size=\"11\" font-weight=\"400\" color=\"$text-secondary\" truncate=\"true\" \u002F>\n          \u003C\u002Fcol>\n          \u003Crow w=\"fill\" align=\"middle-right\" pr=\"4\">\n            \u003Ctext value=\"3:18\" text-style=\"Rightbar\u002FText\" color=\"$text-secondary\" \u002F>\n          \u003C\u002Frow>\n        \u003C\u002Frow>\n\n      \u003C\u002Fcol>\n\n    \u003C\u002Fcol>\n\n    \u003C!-- ==================== PERSISTENT BOTTOM PLAYER BAR ==================== -->\n    \u003Crow w=\"1440\" h=\"90\" fill=\"$bg-base\" abs=\"true\" x=\"0\" y=\"810\" p=\"0 16\" align=\"middle-left\" gap=\"auto\">\n      \n      \u003C!-- Left Track Descriptor -->\n      \u003Crow gap=\"16\" align=\"middle-left\" w=\"340\">\n        \u003C!-- Thumbnail -->\n        \u003Cimg src=\"https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=80&h=80&q=80\" w=\"56\" h=\"56\" radius=\"$radius-sm\" fit=\"cover\" \u002F>\n        \n        \u003C!-- Titles -->\n        \u003Ccol gap=\"2\">\n          \u003Ctext value=\"Smells Like Teen Spirit\" text-style=\"Player\u002FTrackTitle\" color=\"$text-primary\" \u002F>\n          \u003Ctext value=\"Nirvana • Nevermind\" text-style=\"Player\u002FTrackArtist\" color=\"$text-secondary\" \u002F>\n        \u003C\u002Fcol>\n        \n        \u003C!-- Liked heart + picture-in-picture -->\n        \u003Crow gap=\"12\" align=\"middle-left\" pl=\"8\">\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fheart.svg?color=%231db954\" w=\"18\" h=\"18\" \u002F>\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fpip.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \u003C\u002Frow>\n      \u003C\u002Frow>\n\n      \u003C!-- Center Playback Controls -->\n      \u003Ccol gap=\"8\" align=\"middle-center\" w=\"760\">\n        \u003C!-- Control buttons -->\n        \u003Crow gap=\"24\" align=\"middle-center\">\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fshuffle.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fskip-back.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n          \n          \u003C!-- Circular Play button -->\n          \u003Crow role=\"button\" w=\"36\" h=\"36\" radius=\"18\" fill=\"$text-primary\" align=\"middle-center\">\n            \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fpause.svg?color=%23000000\" w=\"16\" h=\"16\" \u002F>\n          \u003C\u002Frow>\n          \n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fskip-forward.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n          \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Frepeat.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \u003C\u002Frow>\n\n        \u003C!-- Progress Slider -->\n        \u003Crow gap=\"10\" align=\"middle-center\">\n          \u003Ctext value=\"2:17\" text-style=\"Player\u002FTime\" color=\"$text-secondary\" \u002F>\n          \n          \u003C!-- Slider tracks -->\n          \u003Cframe role=\"slider\" w=\"400\" h=\"4\">\n            \u003C!-- Active slider -->\n            \u003Crect w=\"400\" h=\"4\" radius=\"2\" fill=\"$text-secondary\" abs=\"true\" x=\"0\" y=\"0\" \u002F>\n            \u003Crect w=\"184\" h=\"4\" radius=\"2\" fill=\"$accent-green\" abs=\"true\" x=\"0\" y=\"0\" \u002F>\n            \u003Cellipse w=\"10\" h=\"10\" fill=\"$text-primary\" abs=\"true\" x=\"179\" y=\"-3\" \u002F>\n          \u003C\u002Fframe>\n          \n          \u003Ctext value=\"5:01\" text-style=\"Player\u002FTime\" color=\"$text-secondary\" \u002F>\n        \u003C\u002Frow>\n      \u003C\u002Fcol>\n\n      \u003C!-- Right System volume controls -->\n      \u003Crow gap=\"16\" align=\"middle-right\" w=\"340\">\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fmic-2.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Flist-music.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fspeaker.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n        \n        \u003C!-- Volume slider bar -->\n        \u003Cframe w=\"90\" h=\"4\">\n          \u003Crect w=\"90\" h=\"4\" radius=\"2\" fill=\"$text-secondary\" abs=\"true\" x=\"0\" y=\"0\" \u002F>\n          \u003Crect w=\"60\" h=\"4\" radius=\"2\" fill=\"$text-primary\" abs=\"true\" x=\"0\" y=\"0\" \u002F>\n        \u003C\u002Fframe>\n        \n        \u003Cimg src=\"https:\u002F\u002Fapi.iconify.design\u002Flucide\u002Fmaximize-2.svg?color=%23b3b3b3\" w=\"18\" h=\"18\" \u002F>\n      \u003C\u002Frow>\n\n    \u003C\u002Frow>\n\n  \u003C\u002Fframe>\n\u003C\u002Fgui>\n",1784753173029]