<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" as="image" href="/betterstickies-logo.webp"/><link rel="preload" as="image" href="/features/custom-backgrounds.webp"/><link rel="preload" as="image" href="/features/paste-anything.webp"/><link rel="preload" as="image" href="/features/reminders.webp"/><link rel="preload" as="image" href="/features/pin-always-on-top.webp"/><link rel="preload" as="image" href="/features/rich-text-formatting.webp"/><link rel="preload" as="image" href="/features/hover-preview.webp"/><link rel="preload" as="image" href="/features/snap-to-grid.webp"/><link rel="stylesheet" href="/assets/styles-y0rHNqnN.css" data-precedence="default"/><title>BetterStickies - Free Sticky Notes App for Windows, Linux &amp; macOS</title><meta name="description" content="Free, offline sticky notes app for desktop. Paste anything, set reminders, use GIF backgrounds. No installation needed. Works on Windows, Linux, and macOS."/><meta name="keywords" content="desktop sticky notes, paste anything, gif backgrounds, reminders, offline notes, sticky notes, sticky notes app, desktop sticky notes, sticky notes for linux, sticky notes for windows, sticky notes for mac, free sticky notes, offline sticky notes, note taking app, desktop notes, reminder app, productivity app, adhd tools, quick notes"/><meta name="author" content="BetterStickies"/><meta name="twitter:title" content="BetterStickies - Free Sticky Notes App for Windows, Linux &amp; macOS"/><meta name="twitter:description" content="Free, offline sticky notes app for desktop. Paste anything, set reminders, use GIF backgrounds. No installation needed. Works on Windows, Linux, and macOS."/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:image" content="https://betterstickies.com/og-image.webp"/><meta property="og:type" content="website"/><meta property="og:site_name" content="BetterStickies"/><meta property="og:title" content="BetterStickies - Free Sticky Notes App for Windows, Linux &amp; macOS"/><meta property="og:description" content="Free, offline sticky notes app for desktop. Paste anything, set reminders, use GIF backgrounds. No installation needed. Works on Windows, Linux, and macOS."/><meta property="og:image" content="https://betterstickies.com/og-image.webp"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:url" content="https://betterstickies.com"/><link rel="modulepreload" href="/assets/index-DOEk9GHd.js"/><link rel="modulepreload" href="/assets/vendor-router-BM_gpive.js"/><link rel="modulepreload" href="/assets/index-03HvKtdE.js"/><link rel="modulepreload" href="/assets/footer-BiWlWkH-.js"/><link rel="modulepreload" href="/assets/navigation_documentation-DCmGNuDC.js"/><link rel="modulepreload" href="/assets/badge-D0ZBLB04.js"/><link rel="modulepreload" href="/assets/account-dialog-CLej2DW0.js"/><link rel="modulepreload" href="/assets/x-0NAsj-D6.js"/><link rel="modulepreload" href="/assets/platform-icons-DZOZzBYN.js"/><link rel="modulepreload" href="/assets/pricing-section-Amvrpb1q.js"/><link rel="modulepreload" href="/assets/dashboard_statusrevoked1-uJkk90r-.js"/><link rel="modulepreload" href="/assets/payment-icons-CD8u-8C4.js"/><link rel="modulepreload" href="/assets/tooltip-DfDnHjCv.js"/><link rel="modulepreload" href="/assets/index-BDprKo4s.js"/><link rel="modulepreload" href="/assets/check-jWBtocJu.js"/><link rel="modulepreload" href="/assets/branding_appname1-CqBeI92W.js"/><link rel="modulepreload" href="/assets/pricing_nosubscription1-Bj07JRNA.js"/><link rel="modulepreload" href="/assets/payments_manageportal1-CkiSWPVH.js"/><link rel="modulepreload" href="/assets/pricing_onetimepayment2-d7ZdSBKT.js"/><link rel="modulepreload" href="/assets/useParityPricing-BDq1A3il.js"/><link rel="modulepreload" href="/assets/store-badges-eE4blqQH.js"/><link rel="modulepreload" href="/assets/auth_login_magiclinkerror2-Dzqsf55D.js"/><link rel="modulepreload" href="/assets/checkout_tryagain1-DQ1QIqma.js"/><link rel="modulepreload" href="/assets/privacy_footer_note-CLXNMgg_.js"/><link rel="modulepreload" href="/assets/changelog_v250_contextlinks1-BsGmakz9.js"/><link rel="modulepreload" href="/assets/blog_category_title-jksqV1HQ.js"/><link rel="modulepreload" href="/assets/blog_tag_title-DUfogKv3.js"/><link rel="modulepreload" href="/assets/blog_post_count-mWeJQ7Ry.js"/><link rel="modulepreload" href="/assets/blog_back_to_blog-CCYMD96D.js"/><link rel="modulepreload" href="/assets/blog_pillar_article-wmtQzEX-.js"/><link rel="modulepreload" href="/assets/blog_no_posts-QLMqm33-.js"/><link rel="modulepreload" href="/assets/blog_also_in_english-BCt7id1B.js"/><link rel="modulepreload" href="/assets/guide_sidebar_troubleshooting-CpzslfA3.js"/><link rel="modulepreload" href="/assets/guide_pagesubtitle1-DPkgnKIA.js"/><link rel="modulepreload" href="/assets/guide_screenshotcomingsoon2-D9-ZptSd.js"/><link rel="modulepreload" href="/assets/sheet-CCbP3Deo.js"/><link rel="modulepreload" href="/assets/accordion-D9cd35RC.js"/><link rel="modulepreload" href="/assets/separator-4pYPvyH-.js"/><link rel="modulepreload" href="/assets/index-CAkabU63.js"/><link rel="modulepreload" href="/assets/index-D0LAUlSG.js"/><link rel="modulepreload" href="/assets/auth-client-1raD8Du0.js"/><link rel="modulepreload" href="/assets/chevron-right-DU0ORMHo.js"/><link rel="modulepreload" href="/assets/index-C3cLYItm.js"/><link rel="modulepreload" href="/assets/index-CWyUGC1z.js"/><link rel="modulepreload" href="/assets/index-CzayUBu3.js"/><link rel="modulepreload" href="/assets/index-ZVsFb7Qt.js"/><link rel="modulepreload" href="/assets/sparkles-BiXE9uK9.js"/><link rel="modulepreload" href="/assets/loader-circle-gt14OGy8.js"/><link rel="preload" href="/assets/styles-y0rHNqnN.css" as="style"/><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.webp"/><link rel="manifest" href="/manifest.json"/><link rel="icon" type="image/png" sizes="48x48" href="/favicon-48x48.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="icon" href="/favicon.ico"/><link rel="preload" href="/hero-video-poster.webp" as="image" fetchPriority="high"/><link rel="preload" href="/fonts/Inter-Regular.woff2" as="font" type="font/woff2" crossorigin="anonymous"/><link rel="preload" href="/fonts/Inter-Medium.woff2" as="font" type="font/woff2" crossorigin="anonymous"/><link rel="preload" href="/fonts/Inter-SemiBold.woff2" as="font" type="font/woff2" crossorigin="anonymous"/><link rel="preload" href="/fonts/vt323-v18-latin-regular.woff2" as="font" type="font/woff2" crossorigin="anonymous"/><script type="application/ld+json">{"@context":"https://schema.org","@type":"SoftwareApplication","name":"BetterStickies","applicationCategory":"ProductivityApplication","operatingSystem":"Windows, Linux, macOS","offers":{"@type":"Offer","price":"0","priceCurrency":"USD","description":"Free version with core features"},"aggregateRating":{"@type":"AggregateRating","ratingValue":"5.0","bestRating":"5","worstRating":"1","ratingCount":"5"},"description":"Free, offline, fully customizable sticky notes for Windows, macOS, and Linux. Paste anything, set reminders, use custom backgrounds, and more.","downloadUrl":"https://betterstickies.com/download","softwareVersion":"1.0.0","author":{"@type":"Organization","name":"BetterStickies"}}</script></head><body><!--$--><div class="min-h-screen bg-background"><nav style="top:var(--announcement-h, 0px)" class="fixed left-0 right-0 z-50 transition-all duration-500 ease-out bg-transparent"><div class="mx-auto max-w-7xl px-8 lg:px-12"><div class="flex items-center justify-between h-20"><a class="group flex items-center gap-3 no-underline shrink-0 active" href="/" data-status="active" aria-current="page"><img src="/betterstickies-logo.webp" alt="BetterStickies Logo" class="h-12 w-12 transition-transform duration-300 group-hover:scale-110"/><span class="text-2xl sm:text-3xl font-bold font-mono bg-gradient-to-r from-brand-pink to-accent bg-clip-text text-transparent group-hover:from-primary group-hover:to-primary/80 transition-all duration-300 hidden sm:inline">BetterStickies</span></a><div class="hidden lg:flex items-center space-x-1"><div class="group relative"><a href="/download" class="flex items-center gap-2 rounded-lg transition-all duration-300 text-base sm:text-lg font-medium px-4 py-2.5 text-muted-foreground hover:text-foreground hover:bg-accent/50">Download</a><div class="absolute bottom-0 left-1/2 transform -translate-x-1/2 w-0 h-0.5 bg-gradient-to-r from-primary to-primary/80 transition-all duration-300 group-hover:w-3/4"></div></div><div class="group relative"><a href="/changelog" class="flex items-center gap-2 rounded-lg transition-all duration-300 text-base sm:text-lg font-medium px-4 py-2.5 text-muted-foreground hover:text-foreground hover:bg-accent/50">Changelog</a><div class="absolute bottom-0 left-1/2 transform -translate-x-1/2 w-0 h-0.5 bg-gradient-to-r from-primary to-primary/80 transition-all duration-300 group-hover:w-3/4"></div></div><div class="group relative"><a href="/pricing" class="flex items-center gap-2 rounded-lg transition-all duration-300 text-base sm:text-lg font-medium px-4 py-2.5 text-muted-foreground hover:text-foreground hover:bg-accent/50">Pricing</a><div class="absolute bottom-0 left-1/2 transform -translate-x-1/2 w-0 h-0.5 bg-gradient-to-r from-primary to-primary/80 transition-all duration-300 group-hover:w-3/4"></div></div><div class="group relative"><a href="/guide" class="flex items-center gap-2 rounded-lg transition-all duration-300 text-base sm:text-lg font-medium px-4 py-2.5 text-muted-foreground hover:text-foreground hover:bg-accent/50">Guide</a><div class="absolute bottom-0 left-1/2 transform -translate-x-1/2 w-0 h-0.5 bg-gradient-to-r from-primary to-primary/80 transition-all duration-300 group-hover:w-3/4"></div></div><div class="ml-2 pl-2 border-l border-border/30 flex items-center gap-1"><button data-slot="dropdown-menu-trigger" data-variant="ghost" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50 size-9 relative overflow-hidden transition-all duration-200 ease-in-out hover:scale-105 active:scale-95 focus:ring-2 focus:ring-ring focus:ring-offset-2 aspect-square" aria-label="Toggle theme" type="button" id="radix-_R_1ihb6_" aria-haspopup="menu" aria-expanded="false" data-state="closed"><div class="relative flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-monitor h-4 w-4 transition-all duration-300 ease-in-out rotate-0 scale-100" aria-hidden="true"><rect width="20" height="14" x="2" y="3" rx="2"></rect><line x1="8" x2="16" y1="21" y2="21"></line><line x1="12" x2="12" y1="17" y2="21"></line></svg></div><span class="sr-only">Current theme: <!-- -->System (undefined)</span></button><button data-slot="dropdown-menu-trigger" data-variant="ghost" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50 size-9" title="Change language" type="button" id="radix-_R_2ihb6_" aria-haspopup="menu" aria-expanded="false" data-state="closed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe size-5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg><span class="sr-only">Language selector</span></button></div></div><div class="hidden lg:block"><a href="/login"><button data-slot="button" data-variant="outline" data-size="default" class="inline-flex items-center justify-center whitespace-nowrap rounded-md font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs dark:bg-input/30 dark:border-input dark:hover:bg-input/50 py-2 has-[&gt;svg]:px-3 gap-2 h-11 px-6 text-base border-secondary/60 text-secondary hover:bg-secondary/10 hover:text-secondary hover:border-secondary"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-log-in h-5 w-5" aria-hidden="true"><path d="m10 17 5-5-5-5"></path><path d="M15 12H3"></path><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"></path></svg>Sign In</button></a></div><div class="lg:hidden flex items-center gap-1 shrink-0"><button data-slot="button" data-variant="ghost" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:text-accent-foreground dark:hover:bg-accent/50 size-9 hover:bg-accent/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu h-5 w-5" aria-hidden="true"><path d="M4 5h16"></path><path d="M4 12h16"></path><path d="M4 19h16"></path></svg><span class="sr-only">Open navigation menu</span></button><button data-slot="dropdown-menu-trigger" data-variant="ghost" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50 size-9 relative overflow-hidden transition-all duration-200 ease-in-out hover:scale-105 active:scale-95 focus:ring-2 focus:ring-ring focus:ring-offset-2 aspect-square" aria-label="Toggle theme" type="button" id="radix-_R_khb6_" aria-haspopup="menu" aria-expanded="false" data-state="closed"><div class="relative flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-monitor h-4 w-4 transition-all duration-300 ease-in-out rotate-0 scale-100" aria-hidden="true"><rect width="20" height="14" x="2" y="3" rx="2"></rect><line x1="8" x2="16" y1="21" y2="21"></line><line x1="12" x2="12" y1="17" y2="21"></line></svg></div><span class="sr-only">Current theme: <!-- -->System (undefined)</span></button><button data-slot="dropdown-menu-trigger" data-variant="ghost" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50 size-9" title="Change language" type="button" id="radix-_R_shb6_" aria-haspopup="menu" aria-expanded="false" data-state="closed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe size-5" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg><span class="sr-only">Language selector</span></button></div></div></div></nav><aside class="fixed right-8 top-1/2 -translate-y-1/2 hidden xl:block z-40"><nav class="flex flex-col gap-1"><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to Home" aria-current="location"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-primary font-semibold">Home</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-primary before:scale-[2] after:absolute after:inset-0 after:rounded-full after:bg-primary after:animate-ping after:opacity-75"></span></button><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to Philosophy"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-muted-foreground group-hover:text-foreground">Philosophy</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-muted-foreground before:scale-100 group-hover:before:bg-primary group-hover:before:scale-150"></span></button><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to Features"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-muted-foreground group-hover:text-foreground">Features</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-muted-foreground before:scale-100 group-hover:before:bg-primary group-hover:before:scale-150"></span></button><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to Showcase"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-muted-foreground group-hover:text-foreground">Showcase</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-muted-foreground before:scale-100 group-hover:before:bg-primary group-hover:before:scale-150"></span></button><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to Reviews"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-muted-foreground group-hover:text-foreground">Reviews</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-muted-foreground before:scale-100 group-hover:before:bg-primary group-hover:before:scale-150"></span></button><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to Pricing"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-muted-foreground group-hover:text-foreground">Pricing</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-muted-foreground before:scale-100 group-hover:before:bg-primary group-hover:before:scale-150"></span></button><button class="group relative flex items-center justify-end gap-3 py-3 px-4 rounded-lg transition-all duration-200 hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2" aria-label="Navigate to FAQ"><span class="text-sm sm:text-base font-sans text-right whitespace-nowrap transition-all duration-200 text-muted-foreground group-hover:text-foreground">FAQ</span><span class="relative flex h-2 w-2 shrink-0 before:absolute before:inset-0 before:rounded-full before:transition-all before:duration-200 before:bg-muted-foreground before:scale-100 group-hover:before:bg-primary group-hover:before:scale-150"></span></button></nav></aside><main><section id="hero" class="relative px-8 lg:px-12 py-20 sm:py-28 lg:py-32"><div class="mx-auto max-w-7xl"><div class="grid grid-cols-1 lg:grid-cols-2 gap-16 lg:gap-20 items-center"><div class="flex flex-col justify-center"><div class="flex flex-wrap gap-2 mb-8"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden border-transparent bg-secondary text-secondary-foreground [a&amp;]:hover:bg-secondary/90 text-xs font-semibold font-sans px-3 py-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-heart mr-1.5 h-3.5 w-3.5" aria-hidden="true"><path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5"></path></svg>Free Forever</span><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden border-transparent bg-secondary text-secondary-foreground [a&amp;]:hover:bg-secondary/90 text-xs font-semibold font-sans px-3 py-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock mr-1.5 h-3.5 w-3.5" aria-hidden="true"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>Offline-First</span></div><h1 class="text-6xl sm:text-7xl lg:text-8xl font-bold font-mono tracking-tight text-foreground mb-6">Sticky Notes Reimagined<span class="block text-secondary mt-2">for Modern Desktops</span></h1><p class="text-xl sm:text-2xl lg:text-3xl font-sans leading-relaxed text-muted-foreground mb-10">Free, offline, fully customizable, and portable sticky notes for Windows, macOS, and Linux. Paste anything, set reminders, use custom backgrounds, and manage your thoughts with ease.</p><div class="flex flex-col sm:flex-row gap-5"><a data-slot="button" data-variant="default" data-size="lg" href="/download" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground hover:bg-primary/90 rounded-md has-[&gt;svg]:px-4 group h-14 px-8 text-base sm:text-lg font-sans inline-flex items-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-monitor mr-2 h-5 w-5 transition-transform group-hover:scale-110" aria-hidden="true"><rect width="20" height="14" x="2" y="3" rx="2"></rect><line x1="8" x2="16" y1="21" y2="21"></line><line x1="12" x2="12" y1="17" y2="21"></line></svg>Download for Desktop</a><a data-slot="button" data-variant="outline" data-size="lg" href="/download" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border border-foreground/15 bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 rounded-md has-[&gt;svg]:px-4 h-14 px-8 text-base sm:text-lg font-sans inline-flex items-center">All Platforms<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right ml-2 h-5 w-5" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div></div><div class="flex items-center justify-center lg:justify-end"><div class="group relative overflow-hidden rounded-2xl border border-primary/20 shadow-2xl hover:shadow-primary/20 transition-shadow duration-300 cursor-pointer w-full aspect-video"><video src="/hero-video.webm" poster="/hero-video-poster.webp" autoPlay="" muted="" loop="" playsInline="" preload="metadata" fetchPriority="high" class="w-full h-full object-cover"></video><div class="absolute inset-0 flex items-center justify-center bg-black/20 transition-opacity duration-300 opacity-0 group-hover:opacity-100"><button type="button" class="flex items-center justify-center w-16 h-16 rounded-full bg-background/90 backdrop-blur-sm border border-primary/30 text-foreground transition-transform duration-200 hover:scale-110 active:scale-95" aria-label="Pause video"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pause w-6 h-6" aria-hidden="true"><rect x="14" y="3" width="5" height="18" rx="1"></rect><rect x="5" y="3" width="5" height="18" rx="1"></rect></svg></button><button type="button" class="absolute bottom-4 right-4 flex items-center justify-center w-10 h-10 rounded-lg bg-background/90 backdrop-blur-sm border border-primary/30 text-foreground transition-all duration-200 hover:scale-110 active:scale-95" aria-label="Expand video"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-maximize2 lucide-maximize-2 w-4 h-4" aria-hidden="true"><path d="M15 3h6v6"></path><path d="m21 3-7 7"></path><path d="m3 21 7-7"></path><path d="M9 21H3v-6"></path></svg></button></div></div></div></div></div><div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80"><div class="relative left-[calc(50%-11rem)] aspect-[1155/678] w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-gradient-to-tr from-primary to-secondary opacity-20 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]" style="clip-path:polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"></div></div></section><section class="py-8 sm:py-12"><div class="mx-auto max-w-7xl px-8 lg:px-12"><div class="flex flex-col items-center gap-5"><p class="text-sm tracking-widest uppercase text-muted-foreground font-sans font-medium">Also available on</p><div class="flex flex-wrap items-center justify-center gap-4"><a href="https://snapcraft.io/betterstickies" target="_blank" rel="noopener noreferrer" aria-label="Snap Store" class="inline-flex rounded-lg border border-border/50 bg-card transition-all duration-300 hover:scale-105 hover:border-border hover:shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"><img src="/stores/snap-store-white.svg" alt="Snap Store" class="h-12 sm:h-14" loading="lazy"/></a><a href="https://apps.microsoft.com/detail/9NS7LLQJX1QG" target="_blank" rel="noopener noreferrer" aria-label="Microsoft Store" class="inline-flex rounded-lg border border-border/50 bg-card transition-all duration-300 hover:scale-105 hover:border-border hover:shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"><img src="/stores/windows-store-light.svg" alt="Microsoft Store" class="h-12 sm:h-14" loading="lazy"/></a></div></div></div></section><section id="philosophy" class="relative py-20 sm:py-28 lg:py-32 overflow-hidden"><div class="relative z-10 mx-auto max-w-4xl px-8 lg:px-12"><h2 class="text-4xl sm:text-5xl font-mono tracking-tight text-foreground text-center" style="animation:fade-in-up 0.6s ease-out both">Why Sticky Notes?</h2><blockquote class="relative mt-10 lg:mt-12" style="animation:fade-in-up 0.6s ease-out 0.15s both"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote mx-auto mb-6 h-10 w-10 text-primary opacity-60 sm:h-12 sm:w-12" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><p class="text-lg sm:text-xl leading-relaxed mx-auto max-w-3xl text-center font-sans text-muted-foreground">Sticky notes have been helping people think, plan, and get things done for decades — no manual needed. Research shows spatial organization and visual cues naturally boost memory and focus. BetterStickies is built to keep that simplicity while adding the benefits of digital: searchable, customizable, always on your screen. No accounts, no cloud, no tracking. Your notes stay on your device — always.</p><p class="text-xl sm:text-2xl mt-8 text-center font-mono text-foreground" style="animation:fade-in-up 0.6s ease-out 0.3s both">Simple tools, done right.</p></blockquote></div></section><section id="features" class="py-20 sm:py-28 lg:py-32"><div class="mx-auto max-w-7xl px-8 lg:px-12"><div class="mx-auto max-w-3xl text-center"><h2 class="text-4xl sm:text-5xl font-mono tracking-tight text-foreground">Powerful Features</h2><p class="text-lg sm:text-xl font-sans mt-6 text-muted-foreground">Everything you need for efficient note-taking and task management</p></div><div class="mt-10 lg:mt-12"><div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/custom-backgrounds.webp" alt="Custom Backgrounds" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette h-4 w-4 text-primary" aria-hidden="true"><path d="M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z"></path><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Custom Backgrounds</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Express yourself with animated GIFs, custom images, or solid colors as note backgrounds. Make every note uniquely yours.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Creative</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="h-24 bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5 flex items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-code h-10 w-10 text-primary/40" aria-hidden="true"><path d="m16 18 6-6-6-6"></path><path d="m8 6-6 6 6 6"></path></svg></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-code h-4 w-4 text-primary" aria-hidden="true"><path d="m16 18 6-6-6-6"></path><path d="m8 6-6 6 6 6"></path></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Code Blocks</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Paste or type code with automatic language detection and theme-aware styling. Supports Python, JavaScript, SQL, HTML, and more.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Developer</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/paste-anything.webp" alt="Paste Anything" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-clipboard h-4 w-4 text-primary" aria-hidden="true"><rect width="8" height="4" x="8" y="2" rx="1" ry="1"></rect><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"></path></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Paste Anything</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Text, links, screenshots, files, and code — paste anything. Images display inline with resize options. Code is auto-detected and formatted. Your digital scratchpad for everything.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Versatile</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/reminders.webp" alt="Reminders" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-bell h-4 w-4 text-primary" aria-hidden="true"><path d="M10.268 21a2 2 0 0 0 3.464 0"></path><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"></path></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Reminders</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Set simple desktop reminders with sound alerts and system notifications.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Handy</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/pin-always-on-top.webp" alt="Pin &amp; Always on Top" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pin h-4 w-4 text-primary" aria-hidden="true"><path d="M12 17v5"></path><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"></path></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Pin &amp; Always on Top</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Lock notes in place and keep them visible above all windows while you work.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Essential</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/rich-text-formatting.webp" alt="Rich Text Formatting" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-type h-4 w-4 text-primary" aria-hidden="true"><path d="M12 4v16"></path><path d="M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2"></path><path d="M9 20h6"></path></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Rich Text Formatting</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Add titles, create todo lists, insert links, and highlight important text to organize your notes.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Organized</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/hover-preview.webp" alt="Hover Preview" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-eye h-4 w-4 text-primary" aria-hidden="true"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"></path><circle cx="12" cy="12" r="3"></circle></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Hover Preview</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Hover over pasted images and PDFs to see a quick preview without opening them.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Quick Peek</span></div></div></div><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 shadow-sm group hover:shadow-lg transition-all duration-300 hover:-translate-y-1 overflow-hidden h-full flex flex-col"><div class="bg-gradient-to-br from-primary/5 via-primary/10 to-primary/5"><img src="/features/snap-to-grid.webp" alt="Snap to Grid" class="w-full h-auto object-cover"/></div><div class="p-4 flex-1 flex flex-col"><div class="flex items-center gap-2 mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-grid3x3 lucide-grid-3x3 h-4 w-4 text-primary" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M3 15h18"></path><path d="M9 3v18"></path><path d="M15 3v18"></path></svg><h3 class="text-xl sm:text-2xl font-mono text-foreground">Snap to Grid</h3></div><p class="text-sm leading-relaxed font-sans text-muted-foreground flex-1">Easily organize and align your notes on the desktop with snap-to-grid placement.</p><div class="mt-3"><span data-slot="badge" class="inline-flex items-center justify-center rounded-md border px-2.5 py-1 w-fit whitespace-nowrap shrink-0 [&amp;&gt;svg]:size-3.5 gap-1.5 [&amp;&gt;svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden font-sans text-foreground [a&amp;]:hover:bg-accent [a&amp;]:hover:text-accent-foreground text-xs font-semibold">Organized</span></div></div></div></div></div><div class="mt-10 max-w-5xl mx-auto"><h3 class="text-xl sm:text-2xl font-mono text-foreground mb-6 text-center">More Features</h3><div class="hidden md:flex flex-wrap items-center justify-center gap-2"><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search h-4 w-4 text-primary" aria-hidden="true"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg><span class="text-sm font-sans text-foreground">Search &amp; Restore</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe h-4 w-4 text-primary" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg><span class="text-sm font-sans text-foreground">RTL Support</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-file-braces h-4 w-4 text-primary" aria-hidden="true"><path d="M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"></path><path d="M14 2v5a1 1 0 0 0 1 1h5"></path><path d="M10 12a1 1 0 0 0-1 1v1a1 1 0 0 1-1 1 1 1 0 0 1 1 1v1a1 1 0 0 0 1 1"></path><path d="M14 18a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1 1 1 0 0 1-1-1v-1a1 1 0 0 0-1-1"></path></svg><span class="text-sm font-sans text-foreground">Export to JSON</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-monitor-smartphone h-4 w-4 text-primary" aria-hidden="true"><path d="M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8"></path><path d="M10 19v-3.96 3.15"></path><path d="M7 19h5"></path><rect width="6" height="10" x="16" y="12" rx="2"></rect></svg><span class="text-sm font-sans text-foreground">Multi-Monitor Support</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap h-4 w-4 text-primary" aria-hidden="true"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg><span class="text-sm font-sans text-foreground">No Installation</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-eye-off h-4 w-4 text-primary" aria-hidden="true"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"></path><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"></path><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"></path><path d="m2 2 20 20"></path></svg><span class="text-sm font-sans text-foreground">Hide Notes</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-move h-4 w-4 text-primary" aria-hidden="true"><path d="M12 2v20"></path><path d="m15 19-3 3-3-3"></path><path d="m19 9 3 3-3 3"></path><path d="M2 12h20"></path><path d="m5 9-3 3 3 3"></path><path d="m9 5 3-3 3 3"></path></svg><span class="text-sm font-sans text-foreground">Drag &amp; Resize</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-laptop h-4 w-4 text-primary" aria-hidden="true"><path d="M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z"></path><path d="M20.054 15.987H3.946"></path></svg><span class="text-sm font-sans text-foreground">Cross-Platform</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wifi-off h-4 w-4 text-primary" aria-hidden="true"><path d="M12 20h.01"></path><path d="M8.5 16.429a5 5 0 0 1 7 0"></path><path d="M5 12.859a10 10 0 0 1 5.17-2.69"></path><path d="M19 12.859a10 10 0 0 0-2.007-1.523"></path><path d="M2 8.82a15 15 0 0 1 4.177-2.643"></path><path d="M22 8.82a15 15 0 0 0-11.288-3.764"></path><path d="m2 2 20 20"></path></svg><span class="text-sm font-sans text-foreground">Offline Support</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-list-checks h-4 w-4 text-primary" aria-hidden="true"><path d="M13 5h8"></path><path d="M13 12h8"></path><path d="M13 19h8"></path><path d="m3 17 2 2 4-4"></path><path d="m3 7 2 2 4-4"></path></svg><span class="text-sm font-sans text-foreground">Nested Todos</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-keyboard h-4 w-4 text-primary" aria-hidden="true"><path d="M10 8h.01"></path><path d="M12 12h.01"></path><path d="M14 8h.01"></path><path d="M16 12h.01"></path><path d="M18 8h.01"></path><path d="M6 8h.01"></path><path d="M7 16h10"></path><path d="M8 12h.01"></path><rect width="20" height="16" x="2" y="4" rx="2"></rect></svg><span class="text-sm font-sans text-foreground">Custom Shortcuts</span></div><div class="inline-flex items-center gap-1.5 px-3 py-2 rounded-full border bg-card hover:bg-accent/50 transition-all duration-200 hover:scale-105 hover:shadow-sm cursor-help" data-state="closed" data-slot="tooltip-trigger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevrons-up-down h-4 w-4 text-primary" aria-hidden="true"><path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path></svg><span class="text-sm font-sans text-foreground">Collapsible Notes</span></div></div><div class="md:hidden grid grid-cols-1 gap-2"><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search h-4 w-4 text-primary" aria-hidden="true"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Search &amp; Restore</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Find any note instantly and recover deleted notes from trash whenever you need them.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe h-4 w-4 text-primary" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">RTL Support</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Native support for Arabic, Hebrew, and other right-to-left languages with automatic detection.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-file-braces h-4 w-4 text-primary" aria-hidden="true"><path d="M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"></path><path d="M14 2v5a1 1 0 0 0 1 1h5"></path><path d="M10 12a1 1 0 0 0-1 1v1a1 1 0 0 1-1 1 1 1 0 0 1 1 1v1a1 1 0 0 0 1 1"></path><path d="M14 18a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1 1 1 0 0 1-1-1v-1a1 1 0 0 0-1-1"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Export to JSON</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Export your notes as JSON files - no vendor lock-in, your data stays yours.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-monitor-smartphone h-4 w-4 text-primary" aria-hidden="true"><path d="M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8"></path><path d="M10 19v-3.96 3.15"></path><path d="M7 19h5"></path><rect width="6" height="10" x="16" y="12" rx="2"></rect></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Multi-Monitor Support</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Spread your notes across all your screens seamlessly.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap h-4 w-4 text-primary" aria-hidden="true"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">No Installation</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Download and run instantly - no setup, no admin rights needed.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-eye-off h-4 w-4 text-primary" aria-hidden="true"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"></path><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"></path><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"></path><path d="m2 2 20 20"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Hide Notes</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Temporarily hide notes to declutter your workspace instead of deleting them.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-move h-4 w-4 text-primary" aria-hidden="true"><path d="M12 2v20"></path><path d="m15 19-3 3-3-3"></path><path d="m19 9 3 3-3 3"></path><path d="M2 12h20"></path><path d="m5 9-3 3 3 3"></path><path d="m9 5 3-3 3 3"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Drag &amp; Resize</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Freely position and resize your notes across multiple monitors with smooth interactions.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-laptop h-4 w-4 text-primary" aria-hidden="true"><path d="M18 5a2 2 0 0 1 2 2v8.526a2 2 0 0 0 .212.897l1.068 2.127a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45l1.068-2.127A2 2 0 0 0 4 15.526V7a2 2 0 0 1 2-2z"></path><path d="M20.054 15.987H3.946"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Cross-Platform</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Works seamlessly on Windows, macOS, and Linux with consistent experience.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-wifi-off h-4 w-4 text-primary" aria-hidden="true"><path d="M12 20h.01"></path><path d="M8.5 16.429a5 5 0 0 1 7 0"></path><path d="M5 12.859a10 10 0 0 1 5.17-2.69"></path><path d="M19 12.859a10 10 0 0 0-2.007-1.523"></path><path d="M2 8.82a15 15 0 0 1 4.177-2.643"></path><path d="M22 8.82a15 15 0 0 0-11.288-3.764"></path><path d="m2 2 20 20"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Offline Support</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Fully functional without internet connection - complete privacy and reliability.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-list-checks h-4 w-4 text-primary" aria-hidden="true"><path d="M13 5h8"></path><path d="M13 12h8"></path><path d="M13 19h8"></path><path d="m3 17 2 2 4-4"></path><path d="m3 7 2 2 4-4"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Nested Todos</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Create hierarchical checklists with Tab/Shift+Tab indentation for complex tasks.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-keyboard h-4 w-4 text-primary" aria-hidden="true"><path d="M10 8h.01"></path><path d="M12 12h.01"></path><path d="M14 8h.01"></path><path d="M16 12h.01"></path><path d="M18 8h.01"></path><path d="M6 8h.01"></path><path d="M7 16h10"></path><path d="M8 12h.01"></path><rect width="20" height="16" x="2" y="4" rx="2"></rect></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Custom Shortcuts</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Remap any keyboard shortcut with smart conflict detection.</p></div></div><div class="flex items-start gap-3 p-3 rounded-lg border bg-card"><div class="flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-primary/10 mt-0.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevrons-up-down h-4 w-4 text-primary" aria-hidden="true"><path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path></svg></div><div class="flex-1 min-w-0"><h4 class="text-sm font-medium font-mono text-foreground mb-1">Collapsible Notes</h4><p class="text-xs sm:text-sm leading-relaxed font-sans text-muted-foreground">Collapse notes to header-only view to save screen space.</p></div></div></div></div></div></section><section id="showcase" class="py-20 sm:py-28 lg:py-32 bg-muted/30"><div class="mx-auto max-w-7xl px-8 lg:px-12"><div class="mx-auto max-w-3xl text-center"><h2 class="text-4xl sm:text-5xl font-mono tracking-tight text-foreground">Made for Every Workflow</h2><p class="text-lg sm:text-xl font-sans mt-6 text-muted-foreground">Sticky notes are a proven method for capturing ideas. We&#x27;re digitizing them right, with features that paper could never have.</p></div><div class="mx-auto mt-12 lg:mt-16 max-w-5xl"><div class="relative w-full" role="region" aria-roledescription="carousel" data-slot="carousel"><div class="overflow-hidden" data-slot="carousel-content"><div class="flex -ml-4"><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4"><div class="space-y-0"><div class="relative w-full aspect-[2/1] overflow-hidden rounded-t-lg bg-background"><img src="/features/quick-capture.webp" alt="Quick Capture Mode" class="w-full h-full object-contain" loading="lazy"/></div><div data-slot="card" class="bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm rounded-t-none border-t-0"><div data-slot="card-header" class="@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 pb-6"><div class="flex items-center gap-3"><div class="inline-flex items-center justify-center p-2.5 rounded-lg bg-accent/15 shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap h-6 w-6 text-accent" aria-hidden="true"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg></div><div><div data-slot="card-title" class="font-semibold text-2xl sm:text-3xl font-mono text-foreground">Quick Capture Mode</div><div data-slot="card-description" class="text-muted-foreground text-sm sm:text-base font-sans mt-1">Capture thoughts without breaking focus.</div></div></div><ul class="mt-4 space-y-2"><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Always on Top keeps notes visible while browsing</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Paste links, screenshots, or text instantly</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Your inbox before Obsidian or Notion</span></li></ul></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4"><div class="space-y-0"><div class="relative w-full aspect-[2/1] overflow-hidden rounded-t-lg bg-background"><img src="/features/workflow-widgets.webp" alt="Workflow Widgets" class="w-full h-full object-contain" loading="lazy"/></div><div data-slot="card" class="bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm rounded-t-none border-t-0"><div data-slot="card-header" class="@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 pb-6"><div class="flex items-center gap-3"><div class="inline-flex items-center justify-center p-2.5 rounded-lg bg-accent/15 shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-panels-top-left h-6 w-6 text-accent" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M9 21V9"></path></svg></div><div><div data-slot="card-title" class="font-semibold text-2xl sm:text-3xl font-mono text-foreground">Workflow Widgets</div><div data-slot="card-description" class="text-muted-foreground text-sm sm:text-base font-sans mt-1">Your tools, always within reach.</div></div></div><ul class="mt-4 space-y-2"><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Pin folders and files to your desktop</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Position notes anywhere you need them</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Snap to grid for clean arrangements</span></li></ul></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4"><div class="space-y-0"><div class="relative w-full aspect-[2/1] overflow-hidden rounded-t-lg bg-background"><img src="/features/simple-tasks.webp" alt="Simple Task Management" class="w-full h-full object-contain" loading="lazy"/></div><div data-slot="card" class="bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm rounded-t-none border-t-0"><div data-slot="card-header" class="@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 pb-6"><div class="flex items-center gap-3"><div class="inline-flex items-center justify-center p-2.5 rounded-lg bg-accent/15 shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-list-todo h-6 w-6 text-accent" aria-hidden="true"><path d="M13 5h8"></path><path d="M13 12h8"></path><path d="M13 19h8"></path><path d="m3 17 2 2 4-4"></path><rect x="3" y="4" width="6" height="6" rx="1"></rect></svg></div><div><div data-slot="card-title" class="font-semibold text-2xl sm:text-3xl font-mono text-foreground">Simple Task Management</div><div data-slot="card-description" class="text-muted-foreground text-sm sm:text-base font-sans mt-1">The time-tested sticky note method, digitized.</div></div></div><ul class="mt-4 space-y-2"><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Quick reminders that actually get seen</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Todo lists without the complexity</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">No learning curve, just start using it</span></li></ul></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4"><div class="space-y-0"><div class="relative w-full aspect-[2/1] overflow-hidden rounded-t-lg bg-background"><img src="/features/make-it-yours.webp" alt="Make It Yours" class="w-full h-full object-contain" loading="lazy"/></div><div data-slot="card" class="bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm rounded-t-none border-t-0"><div data-slot="card-header" class="@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 pb-6"><div class="flex items-center gap-3"><div class="inline-flex items-center justify-center p-2.5 rounded-lg bg-accent/15 shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette h-6 w-6 text-accent" aria-hidden="true"><path d="M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z"></path><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle></svg></div><div><div data-slot="card-title" class="font-semibold text-2xl sm:text-3xl font-mono text-foreground">Make It Yours</div><div data-slot="card-description" class="text-muted-foreground text-sm sm:text-base font-sans mt-1">Not just functional, but beautiful.</div></div></div><ul class="mt-4 space-y-2"><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Solid colors, gradients, or GIF backgrounds</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Color-code by project or context</span></li><li class="flex items-start gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success shrink-0 mt-0.5" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-base sm:text-lg font-sans text-muted-foreground">Transform your desktop workspace</span></li></ul></div></div></div></div></div></div><button data-slot="carousel-previous" data-variant="outline" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border border-foreground/15 bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 absolute size-8 rounded-full top-1/2 -translate-y-1/2 font-sans left-2 sm:-left-12 lg:-left-16" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-left" aria-hidden="true"><path d="m12 19-7-7 7-7"></path><path d="M19 12H5"></path></svg><span class="sr-only">Previous slide</span></button><button data-slot="carousel-next" data-variant="outline" data-size="icon" class="inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border border-foreground/15 bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 absolute size-8 rounded-full top-1/2 -translate-y-1/2 font-sans right-2 sm:-right-12 lg:-right-16" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg><span class="sr-only">Next slide</span></button></div><div class="flex justify-center mt-8 gap-2" aria-label="Carousel indicators"><div class="h-2 rounded-full transition-all w-8 bg-primary" aria-label="Slide 1" aria-current="true"></div><div class="h-2 rounded-full transition-all w-2 bg-muted-foreground/30" aria-label="Slide 2"></div><div class="h-2 rounded-full transition-all w-2 bg-muted-foreground/30" aria-label="Slide 3"></div><div class="h-2 rounded-full transition-all w-2 bg-muted-foreground/30" aria-label="Slide 4"></div></div><div class="sr-only" aria-live="polite" aria-atomic="true">Showing use case <!-- -->1<!-- --> of <!-- -->4</div></div></div></section><section id="reviews" class="py-20 sm:py-28 lg:py-32 bg-background"><div class="mx-auto max-w-7xl px-8 lg:px-12"><div class="mx-auto max-w-3xl text-center"><h2 class="text-4xl sm:text-5xl font-mono tracking-tight text-foreground">Loved by Users Worldwide</h2><p class="text-lg sm:text-xl mt-6 text-muted-foreground">See what our community is saying about BetterStickies across the web</p></div><div class="mt-12 lg:mt-16"><div class="relative w-full" role="region" aria-roledescription="carousel" data-slot="carousel"><div class="overflow-hidden" data-slot="carousel-content"><div class="flex -ml-4 md:-ml-6 items-stretch"><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4 md:pl-6 md:basis-1/2 lg:basis-1/3"><div data-slot="card" class="text-card-foreground gap-6 rounded-xl py-6 shadow-sm group relative overflow-hidden flex flex-col h-full border-2 hover:border-primary/50 transition-all duration-500 ease-out bg-card hover:-translate-y-1 hover:shadow-xl"><div data-slot="card-content" class="p-6 lg:p-8 flex flex-col h-full"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote h-6 w-6 mb-3 opacity-50 text-primary transition-all duration-300 group-hover:opacity-80 group-hover:scale-110" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><p class="text-sm sm:text-base leading-relaxed text-foreground flex-grow italic">“<!-- -->Many highly functional sticky notes for Linux have disappeared due to the discontinuation of GNOME&#x27;s API. Thank you for creating a sustainable, highly functional sticky note software. I am Japanese — thank you for providing input method support for Asian regions. I will continue to use this, and I hope it will support Linux for a long time.<!-- -->”</p><div class="h-px mt-5 mb-5 bg-gradient-to-r from-transparent via-border to-transparent"></div><div class="flex items-center gap-3 flex-shrink-0"><span data-slot="avatar" class="relative flex size-8 shrink-0 overflow-hidden rounded-full h-10 w-10 flex-shrink-0 ring-2 ring-offset-2 ring-offset-card ring-primary/20"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full font-semibold text-sm bg-primary/10 text-primary">M</span></span><div class="flex-1 min-w-0"><div class="text-sm sm:text-base font-semibold text-foreground truncate">midnight.express</div><div class="flex items-center gap-1.5 mt-0.5 text-primary text-xs"><svg stroke="currentColor" fill="currentColor" stroke-width="0" role="img" viewBox="0 0 24 24" class="h-3 w-3" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M20.216 6.415l-.132-.666c-.119-.598-.388-1.163-1.001-1.379-.197-.069-.42-.098-.57-.241-.152-.143-.196-.366-.231-.572-.065-.378-.125-.756-.192-1.133-.057-.325-.102-.69-.25-.987-.195-.4-.597-.634-.996-.788a5.723 5.723 0 00-.626-.194c-1-.263-2.05-.36-3.077-.416a25.834 25.834 0 00-3.7.062c-.915.083-1.88.184-2.75.5-.318.116-.646.256-.888.501-.297.302-.393.77-.177 1.146.154.267.415.456.692.58.36.162.737.284 1.123.366 1.075.238 2.189.331 3.287.37 1.218.05 2.437.01 3.65-.118.299-.033.598-.073.896-.119.352-.054.578-.513.474-.834-.124-.383-.457-.531-.834-.473-.466.074-.96.108-1.382.146-1.177.08-2.358.082-3.536.006a22.228 22.228 0 01-1.157-.107c-.086-.01-.18-.025-.258-.036-.243-.036-.484-.08-.724-.13-.111-.027-.111-.185 0-.212h.005c.277-.06.557-.108.838-.147h.002c.131-.009.263-.032.394-.048a25.076 25.076 0 013.426-.12c.674.019 1.347.067 2.017.144l.228.031c.267.04.533.088.798.145.392.085.895.113 1.07.542.055.137.08.288.111.431l.319 1.484a.237.237 0 01-.199.284h-.003c-.037.006-.075.01-.112.015a36.704 36.704 0 01-4.743.295 37.059 37.059 0 01-4.699-.304c-.14-.017-.293-.042-.417-.06-.326-.048-.649-.108-.973-.161-.393-.065-.768-.032-1.123.161-.29.16-.527.404-.675.701-.154.316-.199.66-.267 1-.069.34-.176.707-.135 1.056.087.753.613 1.365 1.37 1.502a39.69 39.69 0 0011.343.376.483.483 0 01.535.53l-.071.697-1.018 9.907c-.041.41-.047.832-.125 1.237-.122.637-.553 1.028-1.182 1.171-.577.131-1.165.2-1.756.205-.656.004-1.31-.025-1.966-.022-.699.004-1.556-.06-2.095-.58-.475-.458-.54-1.174-.605-1.793l-.731-7.013-.322-3.094c-.037-.351-.286-.695-.678-.678-.336.015-.718.3-.678.679l.228 2.185.949 9.112c.147 1.344 1.174 2.068 2.446 2.272.742.12 1.503.144 2.257.156.966.016 1.942.053 2.892-.122 1.408-.258 2.465-1.198 2.616-2.657.34-3.332.683-6.663 1.024-9.995l.215-2.087a.484.484 0 01.39-.426c.402-.078.787-.212 1.074-.518.455-.488.546-1.124.385-1.766zm-1.478.772c-.145.137-.363.201-.578.233-2.416.359-4.866.54-7.308.46-1.748-.06-3.477-.254-5.207-.498-.17-.024-.353-.055-.47-.18-.22-.236-.111-.71-.054-.995.052-.26.152-.609.463-.646.484-.057 1.046.148 1.526.22.577.088 1.156.159 1.737.212 2.48.226 5.002.19 7.472-.14.45-.06.899-.13 1.345-.21.399-.072.84-.206 1.08.206.166.281.188.657.162.974a.544.544 0 01-.169.364zm-6.159 3.9c-.862.37-1.84.788-3.109.788a5.884 5.884 0 01-1.569-.217l.877 9.004c.065.78.717 1.38 1.5 1.38 0 0 1.243.065 1.658.065.447 0 1.786-.065 1.786-.065.783 0 1.434-.6 1.499-1.38l.94-9.95a3.996 3.996 0 00-1.322-.238c-.826 0-1.491.284-2.26.613z"></path></svg><span>Buy Me a Coffee</span></div></div></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4 md:pl-6 md:basis-1/2 lg:basis-1/3"><div data-slot="card" class="text-card-foreground gap-6 rounded-xl py-6 shadow-sm group relative overflow-hidden flex flex-col h-full border-2 hover:border-primary/50 transition-all duration-500 ease-out bg-card hover:-translate-y-1 hover:shadow-xl"><div data-slot="card-content" class="p-6 lg:p-8 flex flex-col h-full"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote h-6 w-6 mb-3 opacity-50 text-premium-gold transition-all duration-300 group-hover:opacity-80 group-hover:scale-110" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><p class="text-sm sm:text-base leading-relaxed text-foreground flex-grow italic">“<!-- -->I like it. Going to use this in my daily life and paid the $7 for premium/to support you. Thank you.<!-- -->”</p><div class="h-px mt-5 mb-5 bg-gradient-to-r from-transparent via-border to-transparent"></div><div class="flex items-center gap-3 flex-shrink-0"><span data-slot="avatar" class="relative flex size-8 shrink-0 overflow-hidden rounded-full h-10 w-10 flex-shrink-0 ring-2 ring-offset-2 ring-offset-card ring-premium-gold/20"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full font-semibold text-sm bg-premium-gold/10 text-premium-gold">B</span></span><div class="flex-1 min-w-0"><div class="text-sm sm:text-base font-semibold text-foreground truncate">Billy_McSkintos</div><div class="flex items-center gap-1.5 mt-0.5 text-premium-gold text-xs"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="h-3 w-3" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M201.5 305.5c-13.8 0-24.9-11.1-24.9-24.6 0-13.8 11.1-24.9 24.9-24.9 13.6 0 24.6 11.1 24.6 24.9 0 13.6-11.1 24.6-24.6 24.6zM504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zm-132.3-41.2c-9.4 0-17.7 3.9-23.8 10-22.4-15.5-52.6-25.5-86.1-26.6l17.4-78.3 55.4 12.5c0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.3 24.9-24.9s-11.1-24.9-24.9-24.9c-9.7 0-18 5.8-22.1 13.8l-61.2-13.6c-3-.8-6.1 1.4-6.9 4.4l-19.1 86.4c-33.2 1.4-63.1 11.3-85.5 26.8-6.1-6.4-14.7-10.2-24.1-10.2-34.9 0-46.3 46.9-14.4 62.8-1.1 5-1.7 10.2-1.7 15.5 0 52.6 59.2 95.2 132 95.2 73.1 0 132.3-42.6 132.3-95.2 0-5.3-.6-10.8-1.9-15.8 31.3-16 19.8-62.5-14.9-62.5zM302.8 331c-18.2 18.2-76.1 17.9-93.6 0-2.2-2.2-6.1-2.2-8.3 0-2.5 2.5-2.5 6.4 0 8.6 22.8 22.8 87.3 22.8 110.2 0 2.5-2.2 2.5-6.1 0-8.6-2.2-2.2-6.1-2.2-8.3 0zm7.7-75c-13.6 0-24.6 11.1-24.6 24.9 0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.1 24.9-24.6 0-13.8-11-24.9-24.9-24.9z"></path></svg><span>Reddit</span></div></div></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4 md:pl-6 md:basis-1/2 lg:basis-1/3"><div data-slot="card" class="text-card-foreground gap-6 rounded-xl py-6 shadow-sm group relative overflow-hidden flex flex-col h-full border-2 hover:border-primary/50 transition-all duration-500 ease-out bg-card hover:-translate-y-1 hover:shadow-xl"><div data-slot="card-content" class="p-6 lg:p-8 flex flex-col h-full"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote h-6 w-6 mb-3 opacity-50 text-premium-gold transition-all duration-300 group-hover:opacity-80 group-hover:scale-110" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><p class="text-sm sm:text-base leading-relaxed text-foreground flex-grow italic">“<!-- -->I&#x27;m really loving how I can put GIFs and pictures on my desktop. No other program does it as well as yours.<!-- -->”</p><div class="h-px mt-5 mb-5 bg-gradient-to-r from-transparent via-border to-transparent"></div><div class="flex items-center gap-3 flex-shrink-0"><span data-slot="avatar" class="relative flex size-8 shrink-0 overflow-hidden rounded-full h-10 w-10 flex-shrink-0 ring-2 ring-offset-2 ring-offset-card ring-premium-gold/20"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full font-semibold text-sm bg-premium-gold/10 text-premium-gold">S</span></span><div class="flex-1 min-w-0"><div class="text-sm sm:text-base font-semibold text-foreground truncate">senza_misura</div><div class="flex items-center gap-1.5 mt-0.5 text-premium-gold text-xs"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="h-3 w-3" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M201.5 305.5c-13.8 0-24.9-11.1-24.9-24.6 0-13.8 11.1-24.9 24.9-24.9 13.6 0 24.6 11.1 24.6 24.9 0 13.6-11.1 24.6-24.6 24.6zM504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zm-132.3-41.2c-9.4 0-17.7 3.9-23.8 10-22.4-15.5-52.6-25.5-86.1-26.6l17.4-78.3 55.4 12.5c0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.3 24.9-24.9s-11.1-24.9-24.9-24.9c-9.7 0-18 5.8-22.1 13.8l-61.2-13.6c-3-.8-6.1 1.4-6.9 4.4l-19.1 86.4c-33.2 1.4-63.1 11.3-85.5 26.8-6.1-6.4-14.7-10.2-24.1-10.2-34.9 0-46.3 46.9-14.4 62.8-1.1 5-1.7 10.2-1.7 15.5 0 52.6 59.2 95.2 132 95.2 73.1 0 132.3-42.6 132.3-95.2 0-5.3-.6-10.8-1.9-15.8 31.3-16 19.8-62.5-14.9-62.5zM302.8 331c-18.2 18.2-76.1 17.9-93.6 0-2.2-2.2-6.1-2.2-8.3 0-2.5 2.5-2.5 6.4 0 8.6 22.8 22.8 87.3 22.8 110.2 0 2.5-2.2 2.5-6.1 0-8.6-2.2-2.2-6.1-2.2-8.3 0zm7.7-75c-13.6 0-24.6 11.1-24.6 24.9 0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.1 24.9-24.6 0-13.8-11-24.9-24.9-24.9z"></path></svg><span>Reddit</span></div></div></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4 md:pl-6 md:basis-1/2 lg:basis-1/3"><div data-slot="card" class="text-card-foreground gap-6 rounded-xl py-6 shadow-sm group relative overflow-hidden flex flex-col h-full border-2 hover:border-primary/50 transition-all duration-500 ease-out bg-card hover:-translate-y-1 hover:shadow-xl"><div data-slot="card-content" class="p-6 lg:p-8 flex flex-col h-full"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote h-6 w-6 mb-3 opacity-50 text-brand-pink transition-all duration-300 group-hover:opacity-80 group-hover:scale-110" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><p class="text-sm sm:text-base leading-relaxed text-foreground flex-grow italic">“<!-- -->I was searching for something to replace simple sticky notes and came across a Reddit post.<!-- -->”</p><div class="h-px mt-5 mb-5 bg-gradient-to-r from-transparent via-border to-transparent"></div><div class="flex items-center gap-3 flex-shrink-0"><span data-slot="avatar" class="relative flex size-8 shrink-0 overflow-hidden rounded-full h-10 w-10 flex-shrink-0 ring-2 ring-offset-2 ring-offset-card ring-brand-pink/20"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full font-semibold text-sm bg-brand-pink/10 text-brand-pink">C</span></span><div class="flex-1 min-w-0"><div class="text-sm sm:text-base font-semibold text-foreground truncate">caravan</div><div class="flex items-center gap-1.5 mt-0.5 text-brand-pink text-xs"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 640 512" class="h-3 w-3" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"></path></svg><span>Discord</span></div></div></div></div></div></div><div role="group" aria-roledescription="slide" data-slot="carousel-item" class="min-w-0 shrink-0 grow-0 basis-full pl-4 md:pl-6 md:basis-1/2 lg:basis-1/3"><div data-slot="card" class="text-card-foreground gap-6 rounded-xl py-6 shadow-sm group relative overflow-hidden flex flex-col h-full border-2 hover:border-primary/50 transition-all duration-500 ease-out bg-card hover:-translate-y-1 hover:shadow-xl"><div data-slot="card-content" class="p-6 lg:p-8 flex flex-col h-full"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote h-6 w-6 mb-3 opacity-50 text-premium-gold transition-all duration-300 group-hover:opacity-80 group-hover:scale-110" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><p class="text-sm sm:text-base leading-relaxed text-foreground flex-grow italic">“<!-- -->This is really cool! Thanks!<!-- -->”</p><div class="h-px mt-5 mb-5 bg-gradient-to-r from-transparent via-border to-transparent"></div><div class="flex items-center gap-3 flex-shrink-0"><span data-slot="avatar" class="relative flex size-8 shrink-0 overflow-hidden rounded-full h-10 w-10 flex-shrink-0 ring-2 ring-offset-2 ring-offset-card ring-premium-gold/20"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full font-semibold text-sm bg-premium-gold/10 text-premium-gold">F</span></span><div class="flex-1 min-w-0"><div class="text-sm sm:text-base font-semibold text-foreground truncate">forteller</div><div class="flex items-center gap-1.5 mt-0.5 text-premium-gold text-xs"><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="h-3 w-3" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M201.5 305.5c-13.8 0-24.9-11.1-24.9-24.6 0-13.8 11.1-24.9 24.9-24.9 13.6 0 24.6 11.1 24.6 24.9 0 13.6-11.1 24.6-24.6 24.6zM504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zm-132.3-41.2c-9.4 0-17.7 3.9-23.8 10-22.4-15.5-52.6-25.5-86.1-26.6l17.4-78.3 55.4 12.5c0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.3 24.9-24.9s-11.1-24.9-24.9-24.9c-9.7 0-18 5.8-22.1 13.8l-61.2-13.6c-3-.8-6.1 1.4-6.9 4.4l-19.1 86.4c-33.2 1.4-63.1 11.3-85.5 26.8-6.1-6.4-14.7-10.2-24.1-10.2-34.9 0-46.3 46.9-14.4 62.8-1.1 5-1.7 10.2-1.7 15.5 0 52.6 59.2 95.2 132 95.2 73.1 0 132.3-42.6 132.3-95.2 0-5.3-.6-10.8-1.9-15.8 31.3-16 19.8-62.5-14.9-62.5zM302.8 331c-18.2 18.2-76.1 17.9-93.6 0-2.2-2.2-6.1-2.2-8.3 0-2.5 2.5-2.5 6.4 0 8.6 22.8 22.8 87.3 22.8 110.2 0 2.5-2.2 2.5-6.1 0-8.6-2.2-2.2-6.1-2.2-8.3 0zm7.7-75c-13.6 0-24.6 11.1-24.6 24.9 0 13.6 11.1 24.6 24.6 24.6 13.8 0 24.9-11.1 24.9-24.6 0-13.8-11-24.9-24.9-24.9z"></path></svg><span>Reddit</span></div></div></div></div></div></div></div></div><button data-slot="carousel-previous" data-variant="outline" data-size="icon" class="items-center justify-center gap-2 whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border border-foreground/15 bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 absolute size-8 rounded-full top-1/2 -translate-y-1/2 hidden sm:flex -left-4 lg:-left-6" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-left" aria-hidden="true"><path d="m12 19-7-7 7-7"></path><path d="M19 12H5"></path></svg><span class="sr-only">Previous slide</span></button><button data-slot="carousel-next" data-variant="outline" data-size="icon" class="items-center justify-center gap-2 whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border border-foreground/15 bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 absolute size-8 rounded-full top-1/2 -translate-y-1/2 hidden sm:flex -right-4 lg:-right-6" disabled=""><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg><span class="sr-only">Next slide</span></button></div></div></div></section><section id="pricing" class="py-20 sm:py-28 lg:py-32"><div class="mx-auto max-w-7xl px-8 lg:px-12"><div class="mx-auto max-w-3xl text-center"><h2 class="text-4xl sm:text-5xl font-mono tracking-tight text-foreground">Free Forever, Premium Optional</h2><p class="text-lg sm:text-xl font-sans mt-4 text-muted-foreground">BetterStickies is free to use. Premium helps fund continued development.</p></div><div class="mx-auto mt-9 max-w-2xl text-center"><div class="flex flex-col items-center gap-2"><div class="inline-flex items-center gap-2 rounded-full border border-success/30 bg-success/10 px-4 py-1.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 text-success/80" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans font-medium text-foreground/90">Free version is fully functional</span></div><p class="text-sm font-sans text-muted-foreground">5 notes · 1 reminder · 1 GIF background — no time limits, no signup</p></div><a href="/download" data-slot="button" data-variant="outline" data-size="default" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 py-2 has-[&gt;svg]:px-3 mt-3 h-10 border-foreground/10 bg-card/40 px-6 text-sm font-sans shadow-sm hover:border-foreground/15 hover:bg-card/70 font-medium">Download Free</a></div><div class="mx-auto mt-10 max-w-md"><div data-slot="card" class="bg-card text-card-foreground gap-6 rounded-xl border py-6 relative flex flex-col premium-card-bg premium-border premium-gradient premium-glow-effect shadow-2xl hover:shadow-premium transition-all duration-500 transform hover:-translate-y-1 !gap-4 !py-5"><div data-slot="card-header" class="@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 pb-3"><div class="flex items-center justify-between gap-3"><h3 class="text-2xl sm:text-3xl font-mono text-foreground">Premium</h3><span class="inline-flex items-center gap-1 rounded-full px-2.5 py-0.5 bg-primary/20 border-2 border-primary/50 text-xs font-sans font-medium text-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles h-3 w-3 text-primary" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg>One-time payment</span></div><div class="mt-3 text-center"><div class="flex items-baseline justify-center gap-2"><span class="text-lg font-sans text-muted-foreground line-through">$9.99</span><span class="text-4xl sm:text-5xl font-mono text-foreground">$7.99</span></div><span class="mt-2 inline-flex items-center rounded-full px-2.5 py-0.5 bg-success/20 border-2 border-success/50 text-xs font-sans font-medium text-foreground">20% OFF for V1 Release</span><p class="mt-1 text-sm font-sans text-muted-foreground">One-time payment</p></div></div><div data-slot="card-content" class="pt-0 pb-5 px-6"><div class="space-y-4"><div><h4 class="text-base font-sans font-semibold text-foreground mb-1.5 flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-infinity h-4 w-4 text-primary" aria-hidden="true"><path d="M6 16c5 0 7-8 12-8a4 4 0 0 1 0 8c-5 0-7-8-12-8a4 4 0 1 0 0 8"></path></svg>Remove All Limits</h4><ul class="space-y-1 pl-6"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 flex-shrink-0 text-primary" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans text-muted-foreground">Unlimited sticky notes</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 flex-shrink-0 text-primary" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans text-muted-foreground">Unlimited reminders</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 flex-shrink-0 text-primary" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans text-muted-foreground">Unlimited GIF backgrounds</span></li></ul></div><div><h4 class="text-base font-sans font-semibold text-foreground mb-1.5 flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap h-4 w-4 text-primary" aria-hidden="true"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg>Exclusive Perks</h4><ul class="space-y-1 pl-6"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 flex-shrink-0 text-primary" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans text-muted-foreground">Private Discord channel access</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 flex-shrink-0 text-primary" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans text-muted-foreground">3× voting power on feature roadmap</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check h-4 w-4 flex-shrink-0 text-primary" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg><span class="text-sm font-sans text-muted-foreground">Early access to new features</span></li></ul></div></div><button data-slot="button" data-variant="default" data-size="lg" class="inline-flex items-center justify-center gap-2 transition-all disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 shrink-0 [&amp;_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground hover:bg-primary/90 rounded-md px-6 has-[&gt;svg]:px-4 whitespace-normal premium-button w-full h-11 mt-5 text-base font-sans font-semibold"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles h-4 w-4 mr-2" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg>Get Premium</button><p class="mt-2 text-center text-xs font-sans text-muted-foreground">No subscription. No recurring fees. Ever.</p><div class="flex items-center justify-center gap-2 flex-wrap mt-3"><img src="/payments/visa.svg" alt="Visa" class="h-6" loading="lazy"/><img src="/payments/mastercard.svg" alt="Mastercard" class="h-6" loading="lazy"/><img src="/payments/amex.svg" alt="American Express" class="h-6" loading="lazy"/><img src="/payments/paypal.svg" alt="PayPal" class="h-6" loading="lazy"/><img src="/payments/applepay.svg" alt="Apple Pay" class="h-6" loading="lazy"/><img src="/payments/googlepay.svg" alt="Google Pay" class="h-6" loading="lazy"/><img src="/payments/alipay.svg" alt="Alipay" class="h-6" loading="lazy"/><img src="/payments/wechatpay.svg" alt="WeChat Pay" class="h-6" loading="lazy"/><img src="/payments/unionpay.svg" alt="UnionPay" class="h-6" loading="lazy"/><img src="/payments/discover.svg" alt="Discover" class="h-6" loading="lazy"/><img src="/payments/jcb.svg" alt="JCB" class="h-6" loading="lazy"/><img src="/payments/diners.svg" alt="Diners Club" class="h-6" loading="lazy"/></div></div></div></div><div class="mx-auto mt-16 max-w-2xl text-center"><p class="text-sm font-sans text-muted-foreground">Your purchase directly supports an independent developer. Thank you for believing in community-driven software.</p></div></div></section><section id="support" class="py-12 sm:py-16"><div class="mx-auto max-w-2xl px-8 lg:px-12 text-center"><h2 class="text-2xl sm:text-3xl font-mono tracking-tight text-foreground">Fuel the Development</h2><p class="mt-3 font-sans text-sm text-muted-foreground max-w-lg mx-auto">BetterStickies is built by a solo developer. Every coffee keeps the free version alive and new features coming.</p><div class="mt-6 flex flex-wrap items-center justify-center gap-4"><a href="https://buymeacoffee.com/betterstickies" target="_blank" rel="noopener noreferrer" aria-label="Buy Me a Coffee" class="inline-flex rounded-xl transition-all duration-300 hover:scale-105 hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me a Coffee" class="h-[50px] sm:h-[60px] rounded-xl" loading="lazy"/></a></div><p class="mt-5 text-sm font-sans text-muted-foreground">Already premium? You&#x27;re already amazing. This is just extra fuel.</p></div></section><section id="faq" class="py-20 sm:py-28 lg:py-32 bg-muted/30"><div class="mx-auto max-w-4xl px-8 lg:px-12"><div class="mx-auto max-w-3xl text-center"><h2 class="text-4xl sm:text-5xl font-mono tracking-tight text-foreground">Frequently Asked Questions</h2><p class="text-lg sm:text-xl font-sans mt-6 text-muted-foreground">Everything you need to know about BetterStickies</p></div><div class="mx-auto mt-12 lg:mt-16"><div data-slot="accordion" class="w-full space-y-5" data-orientation="vertical"><div data-state="closed" data-orientation="vertical" data-slot="accordion-item" class="last:border-b-0 border rounded-lg px-8 bg-card"><h3 data-orientation="vertical" data-state="closed" class="flex"><button type="button" aria-controls="radix-_R_4qbb6_" aria-expanded="false" data-state="closed" data-orientation="vertical" id="radix-_R_qbb6_" data-slot="accordion-trigger" class="focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md text-sm font-medium transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&amp;[data-state=open]&gt;svg]:rotate-180 text-left hover:no-underline py-6" data-radix-collection-item=""><span class="text-xl sm:text-2xl font-semibold font-mono text-foreground pr-4">Will BetterStickies be free forever?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></button></h3><div data-state="closed" id="radix-_R_4qbb6_" hidden="" role="region" aria-labelledby="radix-_R_qbb6_" data-orientation="vertical" data-slot="accordion-content" class="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm" style="--radix-accordion-content-height:var(--radix-collapsible-content-height);--radix-accordion-content-width:var(--radix-collapsible-content-width)"></div></div><div data-state="closed" data-orientation="vertical" data-slot="accordion-item" class="last:border-b-0 border rounded-lg px-8 bg-card"><h3 data-orientation="vertical" data-state="closed" class="flex"><button type="button" aria-controls="radix-_R_5abb6_" aria-expanded="false" data-state="closed" data-orientation="vertical" id="radix-_R_1abb6_" data-slot="accordion-trigger" class="focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md text-sm font-medium transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&amp;[data-state=open]&gt;svg]:rotate-180 text-left hover:no-underline py-6" data-radix-collection-item=""><span class="text-xl sm:text-2xl font-semibold font-mono text-foreground pr-4">Is my data safe and private?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></button></h3><div data-state="closed" id="radix-_R_5abb6_" hidden="" role="region" aria-labelledby="radix-_R_1abb6_" data-orientation="vertical" data-slot="accordion-content" class="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm" style="--radix-accordion-content-height:var(--radix-collapsible-content-height);--radix-accordion-content-width:var(--radix-collapsible-content-width)"></div></div><div data-state="closed" data-orientation="vertical" data-slot="accordion-item" class="last:border-b-0 border rounded-lg px-8 bg-card"><h3 data-orientation="vertical" data-state="closed" class="flex"><button type="button" aria-controls="radix-_R_5qbb6_" aria-expanded="false" data-state="closed" data-orientation="vertical" id="radix-_R_1qbb6_" data-slot="accordion-trigger" class="focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md text-sm font-medium transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&amp;[data-state=open]&gt;svg]:rotate-180 text-left hover:no-underline py-6" data-radix-collection-item=""><span class="text-xl sm:text-2xl font-semibold font-mono text-foreground pr-4">What do I get with premium?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></button></h3><div data-state="closed" id="radix-_R_5qbb6_" hidden="" role="region" aria-labelledby="radix-_R_1qbb6_" data-orientation="vertical" data-slot="accordion-content" class="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm" style="--radix-accordion-content-height:var(--radix-collapsible-content-height);--radix-accordion-content-width:var(--radix-collapsible-content-width)"></div></div><div data-state="closed" data-orientation="vertical" data-slot="accordion-item" class="last:border-b-0 border rounded-lg px-8 bg-card"><h3 data-orientation="vertical" data-state="closed" class="flex"><button type="button" aria-controls="radix-_R_6abb6_" aria-expanded="false" data-state="closed" data-orientation="vertical" id="radix-_R_2abb6_" data-slot="accordion-trigger" class="focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md text-sm font-medium transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&amp;[data-state=open]&gt;svg]:rotate-180 text-left hover:no-underline py-6" data-radix-collection-item=""><span class="text-xl sm:text-2xl font-semibold font-mono text-foreground pr-4">Which platforms are supported?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></button></h3><div data-state="closed" id="radix-_R_6abb6_" hidden="" role="region" aria-labelledby="radix-_R_2abb6_" data-orientation="vertical" data-slot="accordion-content" class="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm" style="--radix-accordion-content-height:var(--radix-collapsible-content-height);--radix-accordion-content-width:var(--radix-collapsible-content-width)"></div></div></div></div><div class="mx-auto mt-12 flex flex-col items-center gap-3"><p class="text-lg sm:text-xl leading-relaxed font-sans text-muted-foreground text-center">Have more questions?</p><div class="flex flex-col sm:flex-row items-center gap-2 sm:gap-6"><a href="/guide" class="inline-flex items-center gap-2 text-foreground hover:underline font-medium">Read the guide</a><span class="hidden sm:inline text-muted-foreground/40">|</span><a href="mailto:support@betterstickies.com" class="text-foreground hover:underline font-medium">support@betterstickies.com</a></div></div></div></section></main><footer class="border-t bg-background"><div class="mx-auto max-w-7xl px-8 py-16 md:flex md:items-center md:justify-between lg:px-12"><div class="flex flex-col md:flex-row md:items-center md:space-x-8 space-y-6 md:space-y-0"><div><h3 class="text-2xl font-semibold font-mono text-foreground">BetterStickies</h3><ul role="list" class="mt-3 space-y-2"><li><a href="/roadmap" class="text-base font-medium font-sans text-muted-foreground hover:text-foreground inline-flex items-center group">Roadmap</a></li><li><a href="/changelog" class="text-base font-medium font-sans text-muted-foreground hover:text-foreground inline-flex items-center group">Changelog</a></li><li><a href="/privacy" class="text-base font-medium font-sans text-muted-foreground hover:text-foreground inline-flex items-center group">Privacy Policy</a></li></ul></div></div><div class="mt-8 md:mt-0 flex flex-col items-start md:items-end space-y-4"><div class="flex space-x-6"><a href="https://github.com/HimaSphere/BetterStickies" target="_blank" rel="noopener noreferrer" class="text-muted-foreground hover:text-foreground transition-colors" title="GitHub"><span class="sr-only">GitHub</span><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 496 512" class="h-6 w-6" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"></path></svg></a><a href="https://discord.gg/8gGZSUJjZd" target="_blank" rel="noopener noreferrer" class="text-muted-foreground hover:text-foreground transition-colors" title="Discord"><span class="sr-only">Discord</span><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 640 512" class="h-6 w-6" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"></path></svg></a><a href="https://www.reddit.com/r/BetterStickies/" target="_blank" rel="noopener noreferrer" class="text-muted-foreground hover:text-foreground transition-colors" title="Reddit"><span class="sr-only">Reddit</span><svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" class="h-6 w-6" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path d="M0 256C0 114.6 114.6 0 256 0S512 114.6 512 256s-114.6 256-256 256L37.1 512c-13.7 0-20.5-16.5-10.9-26.2L75 437C28.7 390.7 0 326.7 0 256zM349.6 153.6c23.6 0 42.7-19.1 42.7-42.7s-19.1-42.7-42.7-42.7c-20.6 0-37.8 14.6-41.8 34c-34.5 3.7-61.4 33-61.4 68.4l0 .2c-37.5 1.6-71.8 12.3-99 29.1c-10.1-7.8-22.8-12.5-36.5-12.5c-33 0-59.8 26.8-59.8 59.8c0 24 14.1 44.6 34.4 54.1c2 69.4 77.6 125.2 170.6 125.2s168.7-55.9 170.6-125.3c20.2-9.6 34.1-30.2 34.1-54c0-33-26.8-59.8-59.8-59.8c-13.7 0-26.3 4.6-36.4 12.4c-27.4-17-62.1-27.7-100-29.1l0-.2c0-25.4 18.9-46.5 43.4-49.9l0 0c4.4 18.8 21.3 32.8 41.5 32.8zM177.1 246.9c16.7 0 29.5 17.6 28.5 39.3s-13.5 29.6-30.3 29.6s-31.4-8.8-30.4-30.5s15.4-38.3 32.1-38.3zm190.1 38.3c1 21.7-13.7 30.5-30.4 30.5s-29.3-7.9-30.3-29.6c-1-21.7 11.8-39.3 28.5-39.3s31.2 16.6 32.1 38.3zm-48.1 56.7c-10.3 24.6-34.6 41.9-63 41.9s-52.7-17.3-63-41.9c-1.2-2.9 .8-6.2 3.9-6.5c18.4-1.9 38.3-2.9 59.1-2.9s40.7 1 59.1 2.9c3.1 .3 5.1 3.6 3.9 6.5z"></path></svg></a></div><a href="mailto:support@betterstickies.com" class="inline-flex items-center gap-2 text-base font-medium font-sans text-muted-foreground hover:text-foreground transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-mail h-4 w-4" aria-hidden="true"><path d="m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7"></path><rect x="2" y="4" width="20" height="16" rx="2"></rect></svg>support@betterstickies.com</a><p class="text-xs sm:text-sm font-sans text-muted-foreground">© <!-- -->2026<!-- --> <!-- -->BetterStickies<!-- -->.</p></div></div></footer></div><!--/$--><script class="$tsr" id="$tsr-stream-barrier">(self.$R=self.$R||{})["tsr"]=[];self.$_TSR={h(){this.hydrated=!0,this.c()},e(){this.streamEnded=!0,this.c()},c(){this.hydrated&&this.streamEnded&&(delete self.$_TSR,delete self.$R.tsr)},p(e){this.initialized?e():this.buffer.push(e)},buffer:[]};$_TSR.router=($R=>$R[0]={manifest:$R[1]={routes:$R[2]={__root__:$R[3]={preloads:$R[4]=["/assets/index-DOEk9GHd.js","/assets/vendor-router-BM_gpive.js"],scripts:$R[5]=[$R[6]={attrs:$R[7]={type:"module",async:!0,src:"/assets/index-DOEk9GHd.js"}}]},"/":$R[8]={preloads:$R[9]=["/assets/index-03HvKtdE.js","/assets/footer-BiWlWkH-.js","/assets/navigation_documentation-DCmGNuDC.js","/assets/badge-D0ZBLB04.js","/assets/account-dialog-CLej2DW0.js","/assets/x-0NAsj-D6.js","/assets/platform-icons-DZOZzBYN.js","/assets/pricing-section-Amvrpb1q.js","/assets/dashboard_statusrevoked1-uJkk90r-.js","/assets/payment-icons-CD8u-8C4.js","/assets/tooltip-DfDnHjCv.js","/assets/index-BDprKo4s.js","/assets/check-jWBtocJu.js","/assets/branding_appname1-CqBeI92W.js","/assets/pricing_nosubscription1-Bj07JRNA.js","/assets/payments_manageportal1-CkiSWPVH.js","/assets/pricing_onetimepayment2-d7ZdSBKT.js","/assets/useParityPricing-BDq1A3il.js","/assets/store-badges-eE4blqQH.js","/assets/auth_login_magiclinkerror2-Dzqsf55D.js","/assets/checkout_tryagain1-DQ1QIqma.js","/assets/privacy_footer_note-CLXNMgg_.js","/assets/changelog_v250_contextlinks1-BsGmakz9.js","/assets/blog_category_title-jksqV1HQ.js","/assets/blog_tag_title-DUfogKv3.js","/assets/blog_post_count-mWeJQ7Ry.js","/assets/blog_back_to_blog-CCYMD96D.js","/assets/blog_pillar_article-wmtQzEX-.js","/assets/blog_no_posts-QLMqm33-.js","/assets/blog_also_in_english-BCt7id1B.js","/assets/guide_sidebar_troubleshooting-CpzslfA3.js","/assets/guide_pagesubtitle1-DPkgnKIA.js","/assets/guide_screenshotcomingsoon2-D9-ZptSd.js","/assets/sheet-CCbP3Deo.js","/assets/accordion-D9cd35RC.js","/assets/separator-4pYPvyH-.js","/assets/index-CAkabU63.js","/assets/index-D0LAUlSG.js","/assets/auth-client-1raD8Du0.js","/assets/chevron-right-DU0ORMHo.js","/assets/index-C3cLYItm.js","/assets/index-CWyUGC1z.js","/assets/index-CzayUBu3.js","/assets/index-ZVsFb7Qt.js","/assets/sparkles-BiXE9uK9.js","/assets/loader-circle-gt14OGy8.js"]}}},matches:$R[10]=[$R[11]={i:"__root__ ",u:1780233451447,s:"success",ssr:!0},$R[12]={i:"  ",u:1780233451447,s:"success",ssr:!0}],lastMatchId:"  ",dehydratedData:$R[13]={queryStream:$R[14]=($R[15]=(e) => new ReadableStream({ start: (r) => {
  e.on({ next: (a) => {
    try {
      r.enqueue(a);
    } catch (t) {
    }
  }, throw: (a) => {
    r.error(a);
  }, return: () => {
    try {
      r.close();
    } catch (a) {
    }
  } });
} }))($R[16]=($R[17]=() => {
  let e = [], r = [], t = true, n2 = false, a = 0, s = (l, g, S) => {
    for (S = 0; S < a; S++) r[S] && r[S][g](l);
  }, i = (l, g, S, d) => {
    for (g = 0, S = e.length; g < S; g++) d = e[g], !t && g === S - 1 ? l[n2 ? "return" : "throw"](d) : l.next(d);
  }, u = (l, g) => (t && (g = a++, r[g] = l), i(l), () => {
    t && (r[g] = r[a], r[a--] = void 0);
  });
  return { __SEROVAL_STREAM__: true, on: (l) => u(l), next: (l) => {
    t && (e.push(l), s(l, "next"));
  }, throw: (l) => {
    t && (e.push(l), s(l, "throw"), t = false, n2 = false, r.length = 0);
  }, return: (l) => {
    t && (e.push(l), s(l, "return"), t = false, n2 = true, r.length = 0);
  } };
})())}})($R["tsr"]);document.currentScript.remove()</script><script type="module" async="" src="/assets/index-DOEk9GHd.js"></script><script>($R=>$R[16].return(void 0))($R["tsr"]);$_TSR.e();document.currentScript.remove()</script></body></html>