diff --git a/biome.json b/biome.json
index 3a50816..9f08c83 100644
--- a/biome.json
+++ b/biome.json
@@ -32,6 +32,9 @@
       "correctness": {
         "noUnusedImports": "error",
         "noUndeclaredVariables": "error"
+      },
+      "nursery": {
+        "useSortedClasses": "error"
       }
     }
   },
diff --git a/src/app/(protected)/dashboard/page.tsx b/src/app/(protected)/dashboard/page.tsx
index 88ef91d..a6ae3d0 100644
--- a/src/app/(protected)/dashboard/page.tsx
+++ b/src/app/(protected)/dashboard/page.tsx
@@ -1,8 +1,8 @@
 export default function Dashboard() {
   return (
-    <div className="flex flex-col items-center justify-center w-full flex-1 bg-gray-100 gap-4">
-      <h1 className="text-6xl font-bold">Welcome here!</h1>
-      <h2 className="text-xl font-medium">
+    <div className="flex w-full flex-1 flex-col items-center justify-center gap-4 bg-gray-100">
+      <h1 className="font-bold text-6xl">Welcome here!</h1>
+      <h2 className="font-medium text-xl">
         If you see this, you successfully authenticated.
       </h2>
     </div>
diff --git a/src/app/(protected)/layout.tsx b/src/app/(protected)/layout.tsx
index ac808c5..84db903 100644
--- a/src/app/(protected)/layout.tsx
+++ b/src/app/(protected)/layout.tsx
@@ -18,8 +18,8 @@ export default async function Layout({
   return (
     <SidebarProvider defaultOpen={defaultOpen}>
       <AppSidebar />
-      <main className="relative flex flex-1 min-h-screen bg-gray-100">
-        <div className="flex-1 flex flex-col">
+      <main className="relative flex min-h-screen flex-1 bg-gray-100">
+        <div className="flex flex-1 flex-col">
           <TopMenu />
           {children}
         </div>
diff --git a/src/app/(protected)/settings/page.tsx b/src/app/(protected)/settings/page.tsx
index 21d4b76..a6d3283 100644
--- a/src/app/(protected)/settings/page.tsx
+++ b/src/app/(protected)/settings/page.tsx
@@ -23,7 +23,7 @@ export default async function SettingsPage() {
   const hasPassword = Boolean(user?.password);
 
   return (
-    <div className="relative flex flex-1 flex-col items-center justify-center min-w-[320px] max-h-svh bg-background md:rounded-[20px]">
+    <div className="relative flex max-h-svh min-w-[320px] flex-1 flex-col items-center justify-center bg-background md:rounded-[20px]">
       <Card className="w-full max-w-md p-4">
         <CardHeader>
           <CardTitle>Settings</CardTitle>
diff --git a/src/app/(public)/layout.tsx b/src/app/(public)/layout.tsx
index a77f506..2128329 100644
--- a/src/app/(public)/layout.tsx
+++ b/src/app/(public)/layout.tsx
@@ -13,11 +13,11 @@ export default async function Layout({
   const session = await auth();
 
   return (
-    <div className="flex flex-col flex-1 w-full">
-      <header className="flex w-full py-4 gap-4 justify-end items-center container">
+    <div className="flex w-full flex-1 flex-col">
+      <header className="container flex w-full items-center justify-end gap-4 py-4">
         <Link
           href="/"
-          className="flex gap-2 items-center mr-auto font-medium text-lg whitespace-pre"
+          className="mr-auto flex items-center gap-2 whitespace-pre font-medium text-lg"
         >
           <Image src="/icon.svg" alt="Catalyst" width={30} height={30} />
           Catalyst
@@ -36,7 +36,7 @@ export default async function Layout({
         )}
       </header>
       {children}
-      <footer className="flex w-full py-4 justify-start container">
+      <footer className="container flex w-full justify-start py-4">
         <CatalystBadge />
       </footer>
     </div>
diff --git a/src/app/(public)/page.tsx b/src/app/(public)/page.tsx
index 8ec765e..93a2453 100644
--- a/src/app/(public)/page.tsx
+++ b/src/app/(public)/page.tsx
@@ -84,37 +84,37 @@ export default function Home() {
   ];
 
   return (
-    <main className="flex flex-col items-center flex-1 overflow-x-hidden">
+    <main className="flex flex-1 flex-col items-center overflow-x-hidden">
       {/* Hero Section */}
       <section className="w-full">
-        <div className="flex flex-col items-center justify-center gap-6 min-h-[60vh] lg:min-h-[40rem] mx-auto px-6 py-20 text-center container">
+        <div className="container mx-auto flex min-h-[60vh] flex-col items-center justify-center gap-6 px-6 py-20 text-center lg:min-h-[40rem]">
           <Badge variant="outline" className="mb-2">
-            <Sparkles className="w-3 h-3 mr-1" />
+            <Sparkles className="mr-1 h-3 w-3" />
             Production Ready
           </Badge>
-          <h1 className="text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight">
+          <h1 className="font-bold text-5xl tracking-tight md:text-6xl lg:text-7xl">
             Ship{" "}
-            <span className="inline-block bg-gradient-to-r from-slate-500 via-white to-slate-500 bg-[length:200%_auto] animate-shine [text-shadow:0_0.5px_1px_rgba(0,0,0,0.2)]">
+            <span className="inline-block animate-shine bg-[length:200%_auto] bg-gradient-to-r from-slate-500 via-white to-slate-500 [text-shadow:0_0.5px_1px_rgba(0,0,0,0.2)]">
               Faster
             </span>{" "}
             With
-            <span className="block text-primary mt-2">Catalyst</span>
+            <span className="mt-2 block text-primary">Catalyst</span>
           </h1>
-          <p className="text-xl text-muted-foreground max-w-2xl">
+          <p className="max-w-2xl text-muted-foreground text-xl">
             A modern, full-stack Next.js starter kit with authentication, payments,
             database, and everything you need to build your next project.
           </p>
-          <div className="flex gap-3 mt-4">
-            <Badge variant="secondary" className="text-sm px-3 py-1">
+          <div className="mt-4 flex gap-3">
+            <Badge variant="secondary" className="px-3 py-1 text-sm">
               TypeScript
             </Badge>
-            <Badge variant="secondary" className="text-sm px-3 py-1">
+            <Badge variant="secondary" className="px-3 py-1 text-sm">
               tRPC
             </Badge>
-            <Badge variant="secondary" className="text-sm px-3 py-1">
+            <Badge variant="secondary" className="px-3 py-1 text-sm">
               Server Components
             </Badge>
-            <Badge variant="secondary" className="text-sm px-3 py-1">
+            <Badge variant="secondary" className="px-3 py-1 text-sm">
               Server Actions
             </Badge>
           </div>
@@ -128,14 +128,14 @@ export default function Home() {
       {/* Integrations section with diagonal borders */}
       <section className="w-full bg-muted">
         <div className="container relative z-10 py-6">
-          <div className="text-center mb-12">
-            <h2 className="text-3xl font-bold mb-3">Built with the best tools</h2>
+          <div className="mb-12 text-center">
+            <h2 className="mb-3 font-bold text-3xl">Built with the best tools</h2>
             <p className="text-muted-foreground">
               Pre-configured and ready to use. Spend less time on setup, more on shipping.
             </p>
           </div>
 
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
             {integrations.map((integration) => {
               const Icon = integration.icon;
               return (
@@ -144,8 +144,8 @@ export default function Home() {
                     <Card className="border-0">
                       <CardHeader>
                         <div className="flex items-center gap-3">
-                          <div className="p-2 rounded-lg bg-primary/10">
-                            <Icon className="w-5 h-5 text-primary" />
+                          <div className="rounded-lg bg-primary/10 p-2">
+                            <Icon className="h-5 w-5 text-primary" />
                           </div>
                           <CardTitle className="text-lg">
                             {integration.category}
@@ -175,17 +175,17 @@ export default function Home() {
       </div>
 
       {/* Features Section */}
-      <section className="w-full max-w-7xl mx-auto px-6 py-24">
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+      <section className="mx-auto w-full max-w-7xl px-6 py-24">
+        <div className="grid grid-cols-1 gap-8 md:grid-cols-3">
           <ScrollReveal delay={0}>
             <ScrollFloat direction="y" distance={-30} stopPercentage={50} lag={3}>
-              <div className="flex flex-col items-center text-center gap-3">
+              <div className="flex flex-col items-center gap-3 text-center">
                 <CursorFloat radius={30} lag={2} intensity={0.3}>
-                  <div className="p-3 rounded-full bg-primary/10">
-                    <Code2 className="w-6 h-6 text-primary" />
+                  <div className="rounded-full bg-primary/10 p-3">
+                    <Code2 className="h-6 w-6 text-primary" />
                   </div>
                 </CursorFloat>
-                <h3 className="text-xl font-semibold">Type-Safe</h3>
+                <h3 className="font-semibold text-xl">Type-Safe</h3>
                 <p className="text-muted-foreground text-sm">
                   End-to-end type safety with TypeScript, tRPC, Zod validation, and Prisma
                   ORM.
@@ -195,13 +195,13 @@ export default function Home() {
           </ScrollReveal>
           <ScrollReveal delay={0.1}>
             <ScrollFloat direction="y" distance={-30} stopPercentage={50} lag={3}>
-              <div className="flex flex-col items-center text-center gap-3">
+              <div className="flex flex-col items-center gap-3 text-center">
                 <CursorFloat radius={30} lag={2} intensity={0.3}>
-                  <div className="p-3 rounded-full bg-primary/10">
-                    <Zap className="w-6 h-6 text-primary" />
+                  <div className="rounded-full bg-primary/10 p-3">
+                    <Zap className="h-6 w-6 text-primary" />
                   </div>
                 </CursorFloat>
-                <h3 className="text-xl font-semibold">Lightning Fast</h3>
+                <h3 className="font-semibold text-xl">Lightning Fast</h3>
                 <p className="text-muted-foreground text-sm">
                   Built on Next.js 15 with React Server Components and powered by Bun.js.
                 </p>
@@ -210,13 +210,13 @@ export default function Home() {
           </ScrollReveal>
           <ScrollReveal delay={0.2}>
             <ScrollFloat direction="y" distance={-30} stopPercentage={50} lag={3}>
-              <div className="flex flex-col items-center text-center gap-3">
+              <div className="flex flex-col items-center gap-3 text-center">
                 <CursorFloat radius={30} lag={2} intensity={0.3}>
-                  <div className="p-3 rounded-full bg-primary/10">
-                    <FileCode className="w-6 h-6 text-primary" />
+                  <div className="rounded-full bg-primary/10 p-3">
+                    <FileCode className="h-6 w-6 text-primary" />
                   </div>
                 </CursorFloat>
-                <h3 className="text-xl font-semibold">Developer Experience</h3>
+                <h3 className="font-semibold text-xl">Developer Experience</h3>
                 <p className="text-muted-foreground text-sm">
                   Pre-configured tooling with Biome, Husky, and best practices out of the
                   box.
diff --git a/src/app/(public)/privacy-policy/page.tsx b/src/app/(public)/privacy-policy/page.tsx
index 5f80f59..13b4e0f 100644
--- a/src/app/(public)/privacy-policy/page.tsx
+++ b/src/app/(public)/privacy-policy/page.tsx
@@ -22,8 +22,8 @@ export const metadata: Metadata = {
 
 export default function PrivacyPolicy() {
   return (
-    <main className="container max-w-6xl space-y-4 my-8">
-      <h1 className="text-4xl font-semibold">Privacy Policy</h1>
+    <main className="container my-8 max-w-6xl space-y-4">
+      <h1 className="font-semibold text-4xl">Privacy Policy</h1>
       <p className="text-muted-foreground">Last updated: May 18, 2025</p>
       <p>
         This Privacy Policy describes Our policies and procedures on the collection, use
@@ -35,16 +35,16 @@ export default function PrivacyPolicy() {
         Service, You agree to the collection and use of information in accordance with
         this Privacy Policy.
       </p>
-      <h2 className="text-3xl font-semibold">Interpretation and Definitions</h2>
-      <h3 className="text-2xl font-semibold">Interpretation</h3>
+      <h2 className="font-semibold text-3xl">Interpretation and Definitions</h2>
+      <h3 className="font-semibold text-2xl">Interpretation</h3>
       <p>
         The words of which the initial letter is capitalized have meanings defined under
         the following conditions. The following definitions shall have the same meaning
         regardless of whether they appear in singular or in plural.
       </p>
-      <h3 className="text-2xl font-semibold">Definitions</h3>
+      <h3 className="font-semibold text-2xl">Definitions</h3>
       <p>For the purposes of this Privacy Policy:</p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>
           <p>
             <strong>Account</strong> means a unique account created for You to access our
@@ -143,15 +143,15 @@ export default function PrivacyPolicy() {
           </p>
         </li>
       </ul>
-      <h2 className="text-3xl font-semibold">Collecting and Using Your Personal Data</h2>
-      <h3 className="text-2xl font-semibold">Types of Data Collected</h3>
-      <h4 className="text-xl font-semibold">Personal Data</h4>
+      <h2 className="font-semibold text-3xl">Collecting and Using Your Personal Data</h2>
+      <h3 className="font-semibold text-2xl">Types of Data Collected</h3>
+      <h4 className="font-semibold text-xl">Personal Data</h4>
       <p>
         While using Our Service, We may ask You to provide Us with certain personally
         identifiable information that can be used to contact or identify You. Personally
         identifiable information may include, but is not limited to:
       </p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>
           <p>Email address</p>
         </li>
@@ -162,7 +162,7 @@ export default function PrivacyPolicy() {
           <p>Usage Data</p>
         </li>
       </ul>
-      <h4 className="text-xl font-semibold">Usage Data</h4>
+      <h4 className="font-semibold text-xl">Usage Data</h4>
       <p>Usage Data is collected automatically when using the Service.</p>
       <p>
         Usage Data may include information such as Your Device's Internet Protocol address
@@ -181,14 +181,14 @@ export default function PrivacyPolicy() {
         We may also collect information that Your browser sends whenever You visit our
         Service or when You access the Service by or through a mobile device.
       </p>
-      <h4 className="text-xl font-semibold">
+      <h4 className="font-semibold text-xl">
         Information from Third-Party Social Media Services
       </h4>
       <p>
         The Company allows You to create an account and log in to use the Service through
         the following Third-party Social Media Services:
       </p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>Google</li>
       </ul>
       <p>
@@ -204,14 +204,14 @@ export default function PrivacyPolicy() {
         giving the Company permission to use, share, and store it in a manner consistent
         with this Privacy Policy.
       </p>
-      <h4 className="text-xl font-semibold">Tracking Technologies and Cookies</h4>
+      <h4 className="font-semibold text-xl">Tracking Technologies and Cookies</h4>
       <p>
         We use Cookies and similar tracking technologies to track the activity on Our
         Service and store certain information. Tracking technologies used are beacons,
         tags, and scripts to collect and track information and to improve and analyze Our
         Service. The technologies We use may include:
       </p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>
           <strong>Cookies or Browser Cookies.</strong> A cookie is a small file placed on
           Your Device. You can instruct Your browser to refuse all Cookies or to indicate
@@ -234,7 +234,7 @@ export default function PrivacyPolicy() {
         while Session Cookies are deleted as soon as You close Your web browser.
       </p>
       <p>We use both Session and Persistent Cookies for the purposes set out below:</p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>
           <p>
             <strong>Necessary / Essential Cookies</strong>
@@ -279,9 +279,9 @@ export default function PrivacyPolicy() {
         For more information about the cookies we use and your choices regarding cookies,
         please visit our Cookies Policy or the Cookies section of our Privacy Policy.
       </p>
-      <h3 className="text-2xl font-semibold">Use of Your Personal Data</h3>
+      <h3 className="font-semibold text-2xl">Use of Your Personal Data</h3>
       <p>The Company may use Personal Data for the following purposes:</p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>
           <p>
             <strong>To provide and maintain our Service</strong>, including to monitor the
@@ -347,7 +347,7 @@ export default function PrivacyPolicy() {
         </li>
       </ul>
       <p>We may share Your personal information in the following situations:</p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>
           <strong>With Service Providers:</strong> We may share Your personal information
           with Service Providers to monitor and analyze the use of our Service, to contact
@@ -385,7 +385,7 @@ export default function PrivacyPolicy() {
           for any other purpose with Your consent.
         </li>
       </ul>
-      <h3 className="text-2xl font-semibold">Retention of Your Personal Data</h3>
+      <h3 className="font-semibold text-2xl">Retention of Your Personal Data</h3>
       <p>
         The Company will retain Your Personal Data only for as long as is necessary for
         the purposes set out in this Privacy Policy. We will retain and use Your Personal
@@ -399,7 +399,7 @@ export default function PrivacyPolicy() {
         to strengthen the security or to improve the functionality of Our Service, or We
         are legally obligated to retain this data for longer time periods.
       </p>
-      <h3 className="text-2xl font-semibold">Transfer of Your Personal Data</h3>
+      <h3 className="font-semibold text-2xl">Transfer of Your Personal Data</h3>
       <p>
         Your information, including Personal Data, is processed at the Company's operating
         offices and in any other places where the parties involved in the processing are
@@ -419,7 +419,7 @@ export default function PrivacyPolicy() {
         are adequate controls in place including the security of Your data and other
         personal information.
       </p>
-      <h3 className="text-2xl font-semibold">Delete Your Personal Data</h3>
+      <h3 className="font-semibold text-2xl">Delete Your Personal Data</h3>
       <p>
         You have the right to delete or request that We assist in deleting the Personal
         Data that We have collected about You.
@@ -439,39 +439,39 @@ export default function PrivacyPolicy() {
         Please note, however, that We may need to retain certain information when we have
         a legal obligation or lawful basis to do so.
       </p>
-      <h3 className="text-2xl font-semibold">Disclosure of Your Personal Data</h3>
-      <h4 className="text-xl font-semibold">Business Transactions</h4>
+      <h3 className="font-semibold text-2xl">Disclosure of Your Personal Data</h3>
+      <h4 className="font-semibold text-xl">Business Transactions</h4>
       <p>
         If the Company is involved in a merger, acquisition or asset sale, Your Personal
         Data may be transferred. We will provide notice before Your Personal Data is
         transferred and becomes subject to a different Privacy Policy.
       </p>
-      <h4 className="text-xl font-semibold">Law enforcement</h4>
+      <h4 className="font-semibold text-xl">Law enforcement</h4>
       <p>
         Under certain circumstances, the Company may be required to disclose Your Personal
         Data if required to do so by law or in response to valid requests by public
         authorities (e.g. a court or a government agency).
       </p>
-      <h4 className="text-xl font-semibold">Other legal requirements</h4>
+      <h4 className="font-semibold text-xl">Other legal requirements</h4>
       <p>
         The Company may disclose Your Personal Data in the good faith belief that such
         action is necessary to:
       </p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         <li>Comply with a legal obligation</li>
         <li>Protect and defend the rights or property of the Company</li>
         <li>Prevent or investigate possible wrongdoing in connection with the Service</li>
         <li>Protect the personal safety of Users of the Service or the public</li>
         <li>Protect against legal liability</li>
       </ul>
-      <h3 className="text-2xl font-semibold">Security of Your Personal Data</h3>
+      <h3 className="font-semibold text-2xl">Security of Your Personal Data</h3>
       <p>
         The security of Your Personal Data is important to Us, but remember that no method
         of transmission over the Internet, or method of electronic storage is 100% secure.
         While We strive to use commercially acceptable means to protect Your Personal
         Data, We cannot guarantee its absolute security.
       </p>
-      <h2 className="text-3xl font-semibold">Children's Privacy</h2>
+      <h2 className="font-semibold text-3xl">Children's Privacy</h2>
       <p>
         Our Service does not address anyone under the age of 13. We do not knowingly
         collect personally identifiable information from anyone under the age of 13. If
@@ -485,7 +485,7 @@ export default function PrivacyPolicy() {
         Your country requires consent from a parent, We may require Your parent's consent
         before We collect and use that information.
       </p>
-      <h2 className="text-3xl font-semibold">Links to Other Websites</h2>
+      <h2 className="font-semibold text-3xl">Links to Other Websites</h2>
       <p>
         Our Service may contain links to other websites that are not operated by Us. If
         You click on a third party link, You will be directed to that third party's site.
@@ -495,7 +495,7 @@ export default function PrivacyPolicy() {
         We have no control over and assume no responsibility for the content, privacy
         policies or practices of any third party sites or services.
       </p>
-      <h2 className="text-3xl font-semibold">Changes to this Privacy Policy</h2>
+      <h2 className="font-semibold text-3xl">Changes to this Privacy Policy</h2>
       <p>
         We may update Our Privacy Policy from time to time. We will notify You of any
         changes by posting the new Privacy Policy on this page.
@@ -509,9 +509,9 @@ export default function PrivacyPolicy() {
         You are advised to review this Privacy Policy periodically for any changes.
         Changes to this Privacy Policy are effective when they are posted on this page.
       </p>
-      <h2 className="text-3xl font-semibold">Contact Us</h2>
+      <h2 className="font-semibold text-3xl">Contact Us</h2>
       <p>If you have any questions about this Privacy Policy, You can contact us:</p>
-      <ul className="list-disc ml-10 space-y-4">
+      <ul className="ml-10 list-disc space-y-4">
         {/* TODO: change to the actual email */}
         <li>By email: hello@example.com</li>
       </ul>
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index a5dcaaa..08f1dff 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -51,7 +51,7 @@ export default function RootLayout({
         <Analytics />
       </head>
       <body
-        className={cn(inter.className, "flex flex-col min-h-svh min-w-80 justify-center")}
+        className={cn(inter.className, "flex min-h-svh min-w-80 flex-col justify-center")}
       >
         <Providers>
           {children}
diff --git a/src/components/auth/auth-card.tsx b/src/components/auth/auth-card.tsx
index 9a4721a..a73a307 100644
--- a/src/components/auth/auth-card.tsx
+++ b/src/components/auth/auth-card.tsx
@@ -38,7 +38,7 @@ export default function AuthCard({
       <CardContent className="flex flex-col gap-4">
         {children}
         {(hasGitHub || hasGoogle) && (
-          <p className="mx-auto text-sm text-muted-foreground">or continue with</p>
+          <p className="mx-auto text-muted-foreground text-sm">or continue with</p>
         )}
         {hasGoogle && <OAuthForm provider="google" />}
         {hasGitHub && <OAuthForm provider="github" />}
diff --git a/src/components/auth/last-used-indicator.tsx b/src/components/auth/last-used-indicator.tsx
index ee2a9c3..1deea55 100644
--- a/src/components/auth/last-used-indicator.tsx
+++ b/src/components/auth/last-used-indicator.tsx
@@ -25,7 +25,7 @@ export default function LastUsedIndicator({
     isLastUsed && (
       <div
         className={cn(
-          "flex absolute top-0 bottom-0 right-4 sm:-right-28 items-center justify-center gap-2 text-foreground text-sm sm:text-lg",
+          "sm:-right-28 absolute top-0 right-4 bottom-0 flex items-center justify-center gap-2 text-foreground text-sm sm:text-lg",
           lobster.className,
           className
         )}
diff --git a/src/components/auth/login-form.tsx b/src/components/auth/login-form.tsx
index e2584a1..6ff6daf 100644
--- a/src/components/auth/login-form.tsx
+++ b/src/components/auth/login-form.tsx
@@ -59,7 +59,7 @@ export default function LoginForm() {
           {...register("email")}
         />
         {errors.email && (
-          <span className="text-xs text-destructive">{errors.email.message}</span>
+          <span className="text-destructive text-xs">{errors.email.message}</span>
         )}
       </Label>
       <Label htmlFor="password" className="flex flex-col gap-1">
@@ -71,7 +71,7 @@ export default function LoginForm() {
           {...register("password")}
         />
         {errors.password && (
-          <span className="text-xs text-destructive">{errors.password.message}</span>
+          <span className="text-destructive text-xs">{errors.password.message}</span>
         )}
       </Label>
       <PendingSubmitButton isPending={isLoading} text="Sign in" className="mt-[18px]" />
diff --git a/src/components/auth/oauth-button.tsx b/src/components/auth/oauth-button.tsx
index 1497ef4..1e94bfb 100644
--- a/src/components/auth/oauth-button.tsx
+++ b/src/components/auth/oauth-button.tsx
@@ -14,7 +14,7 @@ export default function OAuthButton({
   return (
     <Button
       type="submit"
-      className="relative flex gap-2 w-full bg-white text-black hover:bg-gray-100 border"
+      className="relative flex w-full gap-2 border bg-white text-black hover:bg-gray-100"
       onClick={() => {
         localStorage.setItem("catalyst-auth-method", provider);
       }}
diff --git a/src/components/auth/register-form.tsx b/src/components/auth/register-form.tsx
index 8cf7876..cfa4577 100644
--- a/src/components/auth/register-form.tsx
+++ b/src/components/auth/register-form.tsx
@@ -60,7 +60,7 @@ export default function RegisterForm() {
           {...register("name")}
         />
         {errors.name && (
-          <span className="text-xs text-destructive">{errors.name.message}</span>
+          <span className="text-destructive text-xs">{errors.name.message}</span>
         )}
       </Label>
       <Label htmlFor="email" className="flex flex-col gap-1">
@@ -72,7 +72,7 @@ export default function RegisterForm() {
           {...register("email")}
         />
         {errors.email && (
-          <span className="text-xs text-destructive">{errors.email.message}</span>
+          <span className="text-destructive text-xs">{errors.email.message}</span>
         )}
       </Label>
       <Label htmlFor="password" className="flex flex-col gap-1">
@@ -84,7 +84,7 @@ export default function RegisterForm() {
           {...register("password")}
         />
         {errors.password && (
-          <span className="text-xs text-destructive">{errors.password.message}</span>
+          <span className="text-destructive text-xs">{errors.password.message}</span>
         )}
       </Label>
       <PendingSubmitButton isPending={isLoading} text="Sign up" className="mt-[18px]" />
diff --git a/src/components/cookie-popup.tsx b/src/components/cookie-popup.tsx
index df1fa47..dc35fe7 100644
--- a/src/components/cookie-popup.tsx
+++ b/src/components/cookie-popup.tsx
@@ -62,23 +62,23 @@ export default function CookiePopup() {
   return (
     <div
       className={cn(
-        "fixed bottom-4 right-4 max-w-[calc(100vw-2rem)] bg-background p-4 rounded-lg shadow-lg border sm:max-w-md z-50",
+        "fixed right-4 bottom-4 z-50 max-w-[calc(100vw-2rem)] rounded-lg border bg-background p-4 shadow-lg sm:max-w-md",
         "cookie-popup-bottom",
         isExiting && "exiting"
       )}
     >
-      <div className="flex items-center gap-2 mb-2">
+      <div className="mb-2 flex items-center gap-2">
         <Cookie />
         <h4 className="font-semibold">Cookie consent</h4>
       </div>
-      <div className="text-sm mb-3">
+      <div className="mb-3 text-sm">
         <p>This website uses cookies to improve the user experience.</p>
       </div>
-      <div className="flex flex-col-reverse sm:flex-row justify-end gap-2">
+      <div className="flex flex-col-reverse justify-end gap-2 sm:flex-row">
         <Button variant="link" asChild>
           <Link href="/privacy-policy">Read more</Link>
         </Button>
-        <Button onClick={handleReject} variant="ghost" className="w-full sm:w-28 border">
+        <Button onClick={handleReject} variant="ghost" className="w-full border sm:w-28">
           Reject
         </Button>
         <Button onClick={handleAccept} className="w-full sm:w-28">
diff --git a/src/components/footer/catalyst-badge.tsx b/src/components/footer/catalyst-badge.tsx
index a602f0b..0ea606a 100644
--- a/src/components/footer/catalyst-badge.tsx
+++ b/src/components/footer/catalyst-badge.tsx
@@ -11,11 +11,14 @@ export default function CatalystBadge() {
     setSource(`utm_source=${window.location.hostname}`);
   }, []);
 
+  const queryParams = [source, medium, campaign].filter(Boolean).join("&");
+
   return (
     <a
-      href={`https://catalyst.richardkovacs.dev/?${source}&${medium}&${campaign}`}
+      href={`https://catalyst.richardkovacs.dev/?${queryParams}`}
       target="_blank"
-      className="text-sm py-1 px-2 rounded flex items-center gap-1.5 shadow-md bg-card dark:bg-input border text-foreground hover:bg-input/50 transition-colors"
+      rel="noopener noreferrer"
+      className="flex items-center gap-1.5 rounded border bg-card px-2 py-1 text-foreground text-sm shadow-md transition-colors hover:bg-input/50 dark:bg-input"
     >
       <span>Made with</span>
       {/** biome-ignore lint/performance/noImgElement: Vercel bypass */}
diff --git a/src/components/mark-all-as-read-button.tsx b/src/components/mark-all-as-read-button.tsx
index 8c4e2fb..4150653 100644
--- a/src/components/mark-all-as-read-button.tsx
+++ b/src/components/mark-all-as-read-button.tsx
@@ -11,7 +11,7 @@ export default function MarkAllAsReadButton({
     <Button
       variant="ghost"
       size="sm"
-      className="text-sm text-muted-foreground"
+      className="text-muted-foreground text-sm"
       onClick={() => readNotifications(notifications.map((n: Notification) => n.id))}
     >
       Mark all as read
diff --git a/src/components/notification-item.tsx b/src/components/notification-item.tsx
index 7c01e76..2b2954f 100644
--- a/src/components/notification-item.tsx
+++ b/src/components/notification-item.tsx
@@ -19,23 +19,23 @@ export function NotificationItem({
     <li>
       <Link
         href={notification.link || "#"}
-        className="flex gap-2 p-2 items-start rounded hover:bg-accent transition-colors duration-200"
+        className="flex items-start gap-2 rounded p-2 transition-colors duration-200 hover:bg-accent"
         onClick={() => readNotification(notification.id)}
       >
-        <span className="relative inline-flex shrink-0 rounded-full size-2 bg-green-500 mt-2"></span>
+        <span className="relative mt-2 inline-flex size-2 shrink-0 rounded-full bg-green-500"></span>
         <div className="flex flex-col gap-1">
           <p>{notification.title}</p>
-          <p className="text-sm text-muted-foreground text-pretty">
+          <p className="text-pretty text-muted-foreground text-sm">
             {notification.content}
           </p>
-          <span className="text-xs text-muted-foreground">
+          <span className="text-muted-foreground text-xs">
             {formatTimeAgo(notification.createdAt)}
           </span>
         </div>
         <Button
           variant="ghost"
           size="icon"
-          className="ml-auto hover:bg-muted/50 shrink-0 rounded-full"
+          className="ml-auto shrink-0 rounded-full hover:bg-muted/50"
           onClick={handleNotificationClick}
         >
           <Ellipsis size={20} />
diff --git a/src/components/notification-menu.tsx b/src/components/notification-menu.tsx
index 6fbce9f..b528926 100644
--- a/src/components/notification-menu.tsx
+++ b/src/components/notification-menu.tsx
@@ -20,16 +20,16 @@ export default async function NotificationMenu() {
           {notifications.length > 0 && (
             <Badge
               variant="destructive"
-              className="absolute inline-flex items-center justify-center p-0 size-4 -top-0.5 -right-0.5 text-[10px]"
+              className="-top-0.5 -right-0.5 absolute inline-flex size-4 items-center justify-center p-0 text-[10px]"
             >
               {notifications.length > 9 ? "9+" : notifications.length}
             </Badge>
           )}
         </Button>
       </PopoverTrigger>
-      <PopoverContent className="flex flex-col gap-2 mr-4 py-2 pl-2 pr-0 w-96">
-        <p className="pt-2 pl-4 text-xl font-semibold">Notifications</p>
-        <Separator className="bg-accent mr-2 w-auto" />
+      <PopoverContent className="mr-4 flex w-96 flex-col gap-2 py-2 pr-0 pl-2">
+        <p className="pt-2 pl-4 font-semibold text-xl">Notifications</p>
+        <Separator className="mr-2 w-auto bg-accent" />
         {notifications.length > 0 ? (
           <div className="flex flex-col items-center gap-2">
             <ScrollArea className="h-96 pr-2">
@@ -39,13 +39,13 @@ export default async function NotificationMenu() {
                 ))}
               </ul>
             </ScrollArea>
-            <Separator className="bg-accent mr-2" />
+            <Separator className="mr-2 bg-accent" />
             <div className="flex w-full justify-start">
               <MarkAllAsReadButton notifications={notifications} />
             </div>
           </div>
         ) : (
-          <p className="text-center my-4 text-muted-foreground">No notifications</p>
+          <p className="my-4 text-center text-muted-foreground">No notifications</p>
         )}
       </PopoverContent>
     </Popover>
diff --git a/src/components/settings/delete-account-form.tsx b/src/components/settings/delete-account-form.tsx
index a353fea..433d66c 100644
--- a/src/components/settings/delete-account-form.tsx
+++ b/src/components/settings/delete-account-form.tsx
@@ -34,8 +34,8 @@ export default function DeleteAccountForm() {
 
   return (
     <div className="flex flex-col gap-2">
-      <h4 className="text-lg font-semibold">Delete Account</h4>
-      <p className="text-sm text-muted-foreground">
+      <h4 className="font-semibold text-lg">Delete Account</h4>
+      <p className="text-muted-foreground text-sm">
         This action is irreversible. All your data will be permanently deleted.
       </p>
       <AlertDialog open={open} onOpenChange={setOpen}>
diff --git a/src/components/settings/password-form.tsx b/src/components/settings/password-form.tsx
index 09dcc81..f2f73c6 100644
--- a/src/components/settings/password-form.tsx
+++ b/src/components/settings/password-form.tsx
@@ -69,7 +69,7 @@ export default function PasswordForm({ hasPassword }: { hasPassword: boolean })
           <Label htmlFor="current-password">Current Password</Label>
           <Input type="password" id="current-password" {...register("currentPassword")} />
           {errors.currentPassword && (
-            <span className="text-xs text-destructive">
+            <span className="text-destructive text-xs">
               {errors.currentPassword.message}
             </span>
           )}
@@ -79,14 +79,14 @@ export default function PasswordForm({ hasPassword }: { hasPassword: boolean })
         <Label htmlFor="new-password">New Password</Label>
         <Input type="password" id="new-password" {...register("newPassword")} />
         {errors.newPassword && (
-          <span className="text-xs text-destructive">{errors.newPassword.message}</span>
+          <span className="text-destructive text-xs">{errors.newPassword.message}</span>
         )}
       </div>
       <div>
         <Label htmlFor="confirm-password">Confirm Password</Label>
         <Input type="password" id="confirm-password" {...register("confirmPassword")} />
         {errors.confirmPassword && (
-          <span className="text-xs text-destructive">
+          <span className="text-destructive text-xs">
             {errors.confirmPassword.message}
           </span>
         )}
diff --git a/src/components/sidebar/app-sidebar.tsx b/src/components/sidebar/app-sidebar.tsx
index 2f60a59..cb216e6 100644
--- a/src/components/sidebar/app-sidebar.tsx
+++ b/src/components/sidebar/app-sidebar.tsx
@@ -23,7 +23,7 @@ export async function AppSidebar() {
 
   return (
     <Sidebar>
-      <SidebarHeader className="pl-[22px] py-3.5">
+      <SidebarHeader className="py-3.5 pl-[22px]">
         <Link href="/dashboard" className="flex items-center gap-2">
           <Image src="/icon.svg" alt="Catalyst" width={28} height={28} />
           Catalyst
diff --git a/src/components/sidebar/profile-menu.tsx b/src/components/sidebar/profile-menu.tsx
index 628e87c..c97e027 100644
--- a/src/components/sidebar/profile-menu.tsx
+++ b/src/components/sidebar/profile-menu.tsx
@@ -31,21 +31,22 @@ export default function ProfileMenu() {
       <DropdownMenuLabel>My Account</DropdownMenuLabel>
       <DropdownMenuSeparator />
       {billingPortalUrl && (
-        <DropdownMenuItem className="p-0 h-10">
+        <DropdownMenuItem className="h-10 p-0">
           <a
             href={billingPortalUrl}
             target="_blank"
-            className="flex items-center gap-2 size-full px-2 py-1.5"
+            rel="noopener noreferrer"
+            className="flex size-full items-center gap-2 px-2 py-1.5"
           >
             <CreditCard className="shrink-0" />
             <span>Billing</span>
           </a>
         </DropdownMenuItem>
       )}
-      <DropdownMenuItem className="p-0 h-10">
+      <DropdownMenuItem className="h-10 p-0">
         <Link
           href="/settings"
-          className="flex items-center gap-2 size-full px-2 py-1.5"
+          className="flex size-full items-center gap-2 px-2 py-1.5"
           onClick={() => isMobile && setOpenMobile(false)}
         >
           <Settings className="shrink-0" />
@@ -53,11 +54,11 @@ export default function ProfileMenu() {
         </Link>
       </DropdownMenuItem>
       <DropdownMenuSeparator />
-      <DropdownMenuItem className="p-0 h-10">
+      <DropdownMenuItem className="h-10 p-0">
         <a
           href="/privacy-policy"
           target="_blank"
-          className="flex items-center gap-2 size-full px-2 py-1.5"
+          className="flex size-full items-center gap-2 px-2 py-1.5"
           onClick={() => isMobile && setOpenMobile(false)}
           rel="noopener"
         >
diff --git a/src/components/top-menu.tsx b/src/components/top-menu.tsx
index 15bb0ef..8838eab 100644
--- a/src/components/top-menu.tsx
+++ b/src/components/top-menu.tsx
@@ -3,7 +3,7 @@ import NotificationMenu from "./notification-menu";
 
 export default function TopMenu() {
   return (
-    <div className="flex justify-between items-center px-4 py-2 bg-sidebar">
+    <div className="flex items-center justify-between bg-sidebar px-4 py-2">
       <SidebarTrigger />
       <NotificationMenu />
     </div>
diff --git a/src/components/ui/alert-dialog.tsx b/src/components/ui/alert-dialog.tsx
index 9c6ddc1..3e8a753 100644
--- a/src/components/ui/alert-dialog.tsx
+++ b/src/components/ui/alert-dialog.tsx
@@ -20,7 +20,7 @@ function AlertDialogOverlay({
     <AlertDialogPrimitive.Overlay
       data-slot="alert-dialog-overlay"
       className={cn(
-        "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80 data-[state=closed]:animate-out data-[state=open]:animate-in",
         className
       )}
       {...props}
@@ -38,7 +38,7 @@ function AlertDialogContent({
       <AlertDialogPrimitive.Content
         data-slot="alert-dialog-content"
         className={cn(
-          "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+          "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=open]:animate-in sm:rounded-lg",
           className
         )}
         {...props}
@@ -83,7 +83,7 @@ function AlertDialogTitle({
   return (
     <AlertDialogPrimitive.Title
       data-slot="alert-dialog-title"
-      className={cn("text-lg font-semibold", className)}
+      className={cn("font-semibold text-lg", className)}
       {...props}
     />
   );
@@ -96,7 +96,7 @@ function AlertDialogDescription({
   return (
     <AlertDialogPrimitive.Description
       data-slot="alert-dialog-description"
-      className={cn("text-sm text-muted-foreground", className)}
+      className={cn("text-muted-foreground text-sm", className)}
       {...props}
     />
   );
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index ca75787..1be86fe 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -29,7 +29,7 @@ function CardTitle({ className, ...props }: React.HTMLAttributes<HTMLHeadingElem
   return (
     <h3
       data-slot="card-title"
-      className={cn("text-2xl font-semibold leading-none tracking-tight", className)}
+      className={cn("font-semibold text-2xl leading-none tracking-tight", className)}
       {...props}
     />
   );
@@ -42,7 +42,7 @@ function CardDescription({
   return (
     <p
       data-slot="card-description"
-      className={cn("text-sm text-muted-foreground", className)}
+      className={cn("text-muted-foreground text-sm", className)}
       {...props}
     />
   );
diff --git a/src/components/ui/diagonal-edge.tsx b/src/components/ui/diagonal-edge.tsx
index 325c082..52b7a6a 100644
--- a/src/components/ui/diagonal-edge.tsx
+++ b/src/components/ui/diagonal-edge.tsx
@@ -85,7 +85,7 @@ export function DiagonalEdge({
 
   return (
     <div
-      className={cn("absolute w-0 h-0", positionClasses[corner], className)}
+      className={cn("absolute h-0 w-0", positionClasses[corner], className)}
       style={getBorderStyles()}
     />
   );
diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx
index dd53125..b4e6ea6 100644
--- a/src/components/ui/dropdown-menu.tsx
+++ b/src/components/ui/dropdown-menu.tsx
@@ -50,7 +50,7 @@ function DropdownMenuSubContent({
     <DropdownMenuPrimitive.SubContent
       data-slot="dropdown-menu-sub-content"
       className={cn(
-        "z-50 min-w-32 overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-dropdown-menu-content-transform-origin)",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-32 origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=closed]:animate-out data-[state=open]:animate-in",
         className
       )}
       {...props}
@@ -69,7 +69,7 @@ function DropdownMenuContent({
         data-slot="dropdown-menu-content"
         sideOffset={sideOffset}
         className={cn(
-          "z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-32 overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-dropdown-menu-content-transform-origin)",
+          "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-32 origin-(--radix-dropdown-menu-content-transform-origin) overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in",
           className
         )}
         {...props}
@@ -108,7 +108,7 @@ function DropdownMenuCheckboxItem({
     <DropdownMenuPrimitive.CheckboxItem
       data-slot="dropdown-menu-checkbox-item"
       className={cn(
-        "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-hidden transition-colors focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
+        "relative flex cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden transition-colors focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
         className
       )}
       checked={checked}
@@ -133,7 +133,7 @@ function DropdownMenuRadioItem({
     <DropdownMenuPrimitive.RadioItem
       data-slot="dropdown-menu-radio-item"
       className={cn(
-        "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-hidden transition-colors focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
+        "relative flex cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden transition-colors focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
         className
       )}
       {...props}
@@ -158,7 +158,7 @@ function DropdownMenuLabel({
   return (
     <DropdownMenuPrimitive.Label
       data-slot="dropdown-menu-label"
-      className={cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
+      className={cn("px-2 py-1.5 font-semibold text-sm", inset && "pl-8", className)}
       {...props}
     />
   );
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 3974566..65b5b2f 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -8,7 +8,7 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
       data-slot="input"
       type={type}
       className={cn(
-        "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:font-medium file:text-foreground file:text-sm placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         className
       )}
       {...props}
diff --git a/src/components/ui/popover.tsx b/src/components/ui/popover.tsx
index 3706e65..6bdd532 100644
--- a/src/components/ui/popover.tsx
+++ b/src/components/ui/popover.tsx
@@ -22,7 +22,7 @@ function PopoverContent({
         align={align}
         sideOffset={sideOffset}
         className={cn(
-          "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+          "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=closed]:animate-out data-[state=open]:animate-in",
           className
         )}
         {...props}
diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx
index f37d434..daa3edd 100644
--- a/src/components/ui/sheet.tsx
+++ b/src/components/ui/sheet.tsx
@@ -23,7 +23,7 @@ function SheetOverlay({
     <SheetPrimitive.Overlay
       data-slot="sheet-overlay"
       className={cn(
-        "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80 data-[state=closed]:animate-out data-[state=open]:animate-in",
         className
       )}
       {...props}
@@ -69,7 +69,7 @@ function SheetContent({
         {...props}
       >
         {children}
-        <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
+        <SheetPrimitive.Close className="absolute top-4 right-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
           <X className="h-4 w-4" />
           <span className="sr-only">Close</span>
         </SheetPrimitive.Close>
@@ -108,7 +108,7 @@ function SheetTitle({
   return (
     <SheetPrimitive.Title
       data-slot="sheet-title"
-      className={cn("text-lg font-semibold text-foreground", className)}
+      className={cn("font-semibold text-foreground text-lg", className)}
       {...props}
     />
   );
@@ -121,7 +121,7 @@ function SheetDescription({
   return (
     <SheetPrimitive.Description
       data-slot="sheet-description"
-      className={cn("text-sm text-muted-foreground", className)}
+      className={cn("text-muted-foreground text-sm", className)}
       {...props}
     />
   );
diff --git a/src/components/ui/shiny-border.tsx b/src/components/ui/shiny-border.tsx
index 8cf50a2..3839eb3 100644
--- a/src/components/ui/shiny-border.tsx
+++ b/src/components/ui/shiny-border.tsx
@@ -11,14 +11,14 @@ export function ShinyBorder({
   className?: string;
 }) {
   return (
-    <div className={cn("relative group", className)}>
+    <div className={cn("group relative", className)}>
       {/* Gray border always visible */}
-      <div className="absolute -inset-[1px] rounded-lg border border-border transition-colors duration-300" />
+      <div className="-inset-[1px] absolute rounded-lg border border-border transition-colors duration-300" />
 
       {/* Rotating steel gradient on hover - blurred light particle */}
-      <div className="absolute -inset-[1px] rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-500 overflow-hidden">
+      <div className="-inset-[1px] absolute overflow-hidden rounded-lg opacity-0 transition-opacity duration-500 group-hover:opacity-100">
         <div
-          className="absolute -inset-[100px] animate-spin-slow blur-md"
+          className="-inset-[100px] absolute animate-spin-slow blur-md"
           style={{
             background: `conic-gradient(
               from 0deg at 50% 50%,
@@ -35,7 +35,7 @@ export function ShinyBorder({
       </div>
 
       {/* Content */}
-      <div className="relative bg-background rounded-lg">{children}</div>
+      <div className="relative rounded-lg bg-background">{children}</div>
     </div>
   );
 }
diff --git a/src/components/ui/sidebar.tsx b/src/components/ui/sidebar.tsx
index 1cbdfea..d90a022 100644
--- a/src/components/ui/sidebar.tsx
+++ b/src/components/ui/sidebar.tsx
@@ -197,7 +197,7 @@ function Sidebar({
   return (
     <div
       data-slot="sidebar"
-      className="group peer hidden md:block text-sidebar-foreground"
+      className="group peer hidden text-sidebar-foreground md:block"
       data-state={state}
       data-collapsible={state === "collapsed" ? collapsible : ""}
       data-variant={variant}
@@ -206,7 +206,7 @@ function Sidebar({
       {/* This is what handles the sidebar gap on desktop */}
       <div
         className={cn(
-          "duration-200 relative h-svh w-(--sidebar-width) bg-transparent transition-[width] ease-linear",
+          "relative h-svh w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
           "group-data-[collapsible=offcanvas]:w-0",
           "group-data-[side=right]:rotate-180",
           variant === "floating" || variant === "inset"
@@ -216,7 +216,7 @@ function Sidebar({
       />
       <div
         className={cn(
-          "duration-200 fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] ease-linear md:flex",
+          "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",
           side === "left"
             ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]"
             : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
@@ -277,10 +277,10 @@ function SidebarRail({ className, ...props }: React.ComponentProps<"button">) {
       onClick={toggleSidebar}
       title="Toggle Sidebar"
       className={cn(
-        "absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex",
+        "-translate-x-1/2 group-data-[side=left]:-right-4 absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=right]:left-0 sm:flex",
         "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
         "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
-        "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar",
+        "group-data-[collapsible=offcanvas]:translate-x-0 hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:after:left-full",
         "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
         "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
         className
@@ -296,7 +296,7 @@ function SidebarInset({ className, ...props }: React.ComponentProps<"main">) {
       data-slot="sidebar-inset"
       className={cn(
         "relative flex min-h-svh flex-1 flex-col bg-background",
-        "peer-data-[variant=inset]:min-h-[calc(100svh-(--spacing(4)))] md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm",
+        "peer-data-[variant=inset]:min-h-[calc(100svh-(--spacing(4)))] md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2 md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm",
         className
       )}
       {...props}
@@ -391,7 +391,7 @@ function SidebarGroupLabel({
       data-slot="sidebar-group-label"
       data-sidebar="group-label"
       className={cn(
-        "duration-200 flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-hidden ring-sidebar-ring transition-[margin,opa] ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "flex h-8 shrink-0 items-center rounded-md px-2 font-medium text-sidebar-foreground/70 text-xs outline-hidden ring-sidebar-ring transition-[margin,opa] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
         "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
         className
       )}
@@ -412,9 +412,9 @@ function SidebarGroupAction({
       data-slot="sidebar-group-action"
       data-sidebar="group-action"
       className={cn(
-        "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+        "absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
         // Increases the hit area of the button on mobile.
-        "after:absolute after:-inset-2 md:after:hidden",
+        "after:-inset-2 after:absolute md:after:hidden",
         "group-data-[collapsible=icon]:hidden",
         className
       )}
@@ -544,9 +544,9 @@ function SidebarMenuAction({
       data-slot="sidebar-menu-action"
       data-sidebar="menu-action"
       className={cn(
-        "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
+        "absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-hidden ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
         // Increases the hit area of the button on mobile.
-        "after:absolute after:-inset-2 md:after:hidden",
+        "after:-inset-2 after:absolute md:after:hidden",
         "peer-data-[size=sm]/menu-button:top-1",
         "peer-data-[size=default]/menu-button:top-1.5",
         "peer-data-[size=lg]/menu-button:top-2.5",
@@ -566,7 +566,7 @@ function SidebarMenuBadge({ className, ...props }: React.ComponentProps<"div">)
       data-slot="sidebar-menu-badge"
       data-sidebar="menu-badge"
       className={cn(
-        "absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground select-none pointer-events-none",
+        "pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 font-medium text-sidebar-foreground text-xs tabular-nums",
         "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
         "peer-data-[size=sm]/menu-button:top-1",
         "peer-data-[size=default]/menu-button:top-1.5",
@@ -595,14 +595,14 @@ function SidebarMenuSkeleton({
     <div
       data-slot="sidebar-menu-skeleton"
       data-sidebar="menu-skeleton"
-      className={cn("rounded-md h-8 flex gap-2 px-2 items-center", className)}
+      className={cn("flex h-8 items-center gap-2 rounded-md px-2", className)}
       {...props}
     >
       {showIcon && (
         <Skeleton className="size-4 rounded-md" data-sidebar="menu-skeleton-icon" />
       )}
       <Skeleton
-        className="h-4 flex-1 max-w-(--skeleton-width)"
+        className="h-4 max-w-(--skeleton-width) flex-1"
         data-sidebar="menu-skeleton-text"
         style={
           {
@@ -620,7 +620,7 @@ function SidebarMenuSub({ className, ...props }: React.ComponentProps<"ul">) {
       data-slot="sidebar-menu-sub"
       data-sidebar="menu-sub"
       className={cn(
-        "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
+        "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-sidebar-border border-l px-2.5 py-0.5",
         "group-data-[collapsible=icon]:hidden",
         className
       )}
@@ -653,7 +653,7 @@ function SidebarMenuSubButton({
       data-size={size}
       data-active={isActive}
       className={cn(
-        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-hidden ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
+        "-translate-x-px flex h-7 min-w-0 items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-hidden ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
         "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
         size === "sm" && "text-xs",
         size === "md" && "text-sm",
diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx
index e46c0db..2c9f318 100644
--- a/src/components/ui/tooltip.tsx
+++ b/src/components/ui/tooltip.tsx
@@ -21,7 +21,7 @@ function TooltipContent({
       data-slot="tooltip-content"
       sideOffset={sideOffset}
       className={cn(
-        "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "fade-in-0 zoom-in-95 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 animate-in overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-popover-foreground text-sm shadow-md data-[state=closed]:animate-out",
         className
       )}
       {...props}