From d5fe045b361a3735509bfa2549efa0bd185bc7de Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Thu, 16 Apr 2026 17:02:53 -0700
Subject: fix: performance issues for styled-componnt CSS animations

---
 src/app/create/page.styles.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)

(limited to 'src/app/create/page.styles.ts')

diff --git a/src/app/create/page.styles.ts b/src/app/create/page.styles.ts
index 341ba08..b54e095 100644
--- a/src/app/create/page.styles.ts
+++ b/src/app/create/page.styles.ts
@@ -85,6 +85,19 @@ export const GenerateButton = styled.button`
   }
 `;
 
+export const ModeButton = styled.button<{ $active: boolean }>`
+  height: 42px;
+  padding: 0 24px;
+  border-radius: 10px;
+  border: none;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 600;
+  background-color: ${(p) => (p.$active ? "#1a1a1a" : "#e5e5e5")};
+  color: ${(p) => (p.$active ? "#fff" : "#1a1a1a")};
+  transition: background-color 0.15s;
+`;
+
 export const OutputSection = styled.div`
   margin-top: 32px;
   display: flex;
-- 
cgit v1.2.3