diff --git a/nsysu_selector_helper/package.json b/nsysu_selector_helper/package.json
index a27dd2f..58c95ca 100644
--- a/nsysu_selector_helper/package.json
+++ b/nsysu_selector_helper/package.json
@@ -10,20 +10,25 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@ant-design/icons": "^5.3.7",
+    "@swc/plugin-styled-components": "^2.0.9",
     "antd": "^5.19.0",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react-dom": "^18.3.1",
+    "styled-components": "^6.1.11"
   },
   "devDependencies": {
     "@types/node": "^20.14.9",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
+    "@types/styled-components": "^5.1.34",
     "@typescript-eslint/eslint-plugin": "^7.13.1",
     "@typescript-eslint/parser": "^7.13.1",
     "@vitejs/plugin-react-swc": "^3.5.0",
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-react-refresh": "^0.4.7",
+    "prettier": "^3.3.2",
     "typescript": "^5.2.2",
     "vite": "^5.3.1"
   }
diff --git a/nsysu_selector_helper/src/App.tsx b/nsysu_selector_helper/src/App.tsx
index 1ad76d3..1213a79 100644
--- a/nsysu_selector_helper/src/App.tsx
+++ b/nsysu_selector_helper/src/App.tsx
@@ -3,6 +3,7 @@ import { ConfigProvider, Button, List, Typography, Select } from 'antd';
 import { useThemeConfig } from '@/hooks/useThemeConfig';
 import { NSYSUCourseAPI } from '@/api/NSYSUCourseAPI';
 import { Course, AcademicYear } from '@/types';
+import SectionHeader from "#/SectionHeader.tsx";
 
 const { Option } = Select;
 
@@ -49,49 +50,7 @@ const App: FC = () => {
 
   return (
     <ConfigProvider theme={themeConfig}>
-      <div style={{ padding: '20px' }}>
-        <Typography.Title level={2}>Course Viewer</Typography.Title>
-        <Select
-          defaultValue={semesters?.latest}
-          style={{ width: 200, marginBottom: '20px' }}
-          onChange={(value) => setSelectedSemester(value)}
-        >
-          {semesters && Object.entries(semesters.history).map(([year, label]) => (
-            <Option key={year} value={year}>{label} ({year})</Option>
-          ))}
-        </Select>
-        <Button
-          type="primary"
-          onClick={async () => {
-            if (selectedSemester) {
-              setLoading(true);
-              try {
-                const updates = await NSYSUCourseAPI.getSemesterUpdates(selectedSemester);
-                const courses = await NSYSUCourseAPI.getCourses(selectedSemester, updates.latest);
-                setCourses(courses);
-              } catch (error) {
-                console.error('Error fetching courses:', error);
-              } finally {
-                setLoading(false);
-              }
-            }
-          }}
-          loading={loading}
-        >
-          Load Selected Semester Courses
-        </Button>
-        <Typography.Title level={3} style={{ marginTop: '20px' }}>Total: {courses.length}</Typography.Title>
-        <List
-          bordered
-          dataSource={courses}
-          renderItem={course => (
-            <List.Item>
-              <Typography.Text>{course.id} {course.name}</Typography.Text> - {course.teacher} ({course.credit} credits)
-            </List.Item>
-          )}
-          style={{ marginTop: '20px' }}
-        />
-      </div>
+      <SectionHeader/>
     </ConfigProvider>
   );
 };
diff --git a/nsysu_selector_helper/src/api/NSYSUCourseAPI.ts b/nsysu_selector_helper/src/api/NSYSUCourseAPI.ts
index 22633ca..049081e 100644
--- a/nsysu_selector_helper/src/api/NSYSUCourseAPI.ts
+++ b/nsysu_selector_helper/src/api/NSYSUCourseAPI.ts
@@ -3,6 +3,9 @@ import { AcademicYear, Course, SemesterUpdate } from '@/types';
 const BASE_URL = 'https://whats2000.github.io/NSYSUCourseAPI';
 
 export class NSYSUCourseAPI {
+  /**
+   * 取得所有可用學期列表
+   */
   static async getAvailableSemesters(): Promise<AcademicYear> {
     const response = await fetch(`${BASE_URL}/version.json`);
     if (!response.ok) {
@@ -11,6 +14,10 @@ export class NSYSUCourseAPI {
     return response.json();
   }
 
+  /**
+   * 取得指定學年度的學期更新資訊
+   * @param academicYear - 學年度
+   */
   static async getSemesterUpdates(academicYear: string): Promise<SemesterUpdate> {
     const response = await fetch(`${BASE_URL}/${academicYear}/version.json`);
     if (!response.ok) {
@@ -19,6 +26,11 @@ export class NSYSUCourseAPI {
     return response.json();
   }
 
+  /**
+   * 取得指定學年度、更新時間的所有課程
+   * @param academicYear - 學年度
+   * @param updateTime - 更新時間
+   */
   static async getCourses(academicYear: string, updateTime: string): Promise<Course[]> {
     const response = await fetch(`${BASE_URL}/${academicYear}/${updateTime}/all.json`);
     if (!response.ok) {
@@ -31,6 +43,9 @@ export class NSYSUCourseAPI {
     });
   }
 
+  /**
+   * 取得最新學期的所有課程
+   */
   static async getLatestCourses(): Promise<Course[]> {
     const semesters = await NSYSUCourseAPI.getAvailableSemesters();
     const latestAcademicYear = semesters.latest;
diff --git a/nsysu_selector_helper/src/assets/banner.svg b/nsysu_selector_helper/src/assets/banner.svg
new file mode 100644
index 0000000..c169a7d
--- /dev/null
+++ b/nsysu_selector_helper/src/assets/banner.svg
@@ -0,0 +1,85 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 315.22 64.87">
+    <defs>
+        <style>
+            .cls-1{fill:#61a089;}.cls-1,.cls-2,.cls-3,.cls-4{stroke:#fff;stroke-miterlimit:10;stroke-width:0.75px;}.cls-2{fill:#d8ba75;}.cls-3{fill:#ad9e61;}.cls-4{fill:#5e9db4;}.cls-5{fill:#fff;}.cls-6{fill:#fff;}
+        </style>
+    </defs>
+    <g id="Layer_2">
+        <g id="Layer_1-2">
+            <rect class="cls-1" x="0.38" y="38.8" width="34.44" height="12.89" rx="6.44"/>
+            <rect class="cls-2" x="0.38" y="0.38" width="34.44" height="34.44" rx="6.43"/>
+            <rect class="cls-3" x="38.74" y="13" width="34.44" height="12.89" rx="6.44"/>
+            <rect class="cls-4" x="38.74" y="30.05" width="34.44" height="34.44" rx="6.43"/>
+            <path class="cls-5"
+                  d="M56,56.38h-.17a2.1,2.1,0,0,1-1.55-.88L46.83,45.2a2.12,2.12,0,0,1,3.45-2.48L56.22,51,75,32.17a2.12,2.12,0,0,1,3,3L57.46,55.76A2.14,2.14,0,0,1,56,56.38Z"/>
+            <path class="cls-6"
+                  d="M92.86,17.45l1.5.34c.25,0,.38.2.38.29v0H100V13.75l1.55.31a.47.47,0,0,1,.38.29V18.1H106a1.35,1.35,0,0,0,1.1-.67l1.59.49c.86.27.3,1.06.3,1.46V25.7c0,1-.92,1.41-1.89,1.23v-1.3h-5.21V33c0,1.13-1,1.49-1.93,1.26V25.63H94.74v.51c0,1-.94,1.42-1.88,1.22Zm7.12,7V19.29H94.74v5.15Zm7.14,0V19.29h-5.21v5.15Z"/>
+            <path class="cls-6"
+                  d="M118.56,18.53l1.51.31c.22.05.36.16.36.3V30.5h5.12V14.24l1.55.34a.35.35,0,0,1,.33.33V30.5h5.12V18.4l1.53.33c.2.05.34.18.34.32v13.2c0,1.06-1,1.35-1.87,1.19V31.8H120.43v.05c0,1.06-1,1.46-1.87,1.28Z"/>
+            <path class="cls-6"
+                  d="M142,33.78a18,18,0,0,0,6.18-5.25,16.37,16.37,0,0,0,2.65-7.35l0-.38h-7.32c-.38,0-.51-.25-1-1.24H151c.11-1.75.13-3.79.06-5.59l1.46.29c.54.11.66.32.61.72,0,1.1-.07,2.88-.18,4.58h6.52c.42,0,.67-.18,1.1-.67.47.52.85.81.85,1.14,0,.52-.47.77-1.24.77h-7.21a18.09,18.09,0,0,0,2.95,6.6,16.61,16.61,0,0,0,6,5.28c.2.11.27.29,0,.38-.49.18-1,.45-1.39.59a1.4,1.4,0,0,1-1.62-.3A18.56,18.56,0,0,1,154.3,28a17.15,17.15,0,0,1-1.82-5,14.74,14.74,0,0,1-3.14,6.63,13.33,13.33,0,0,1-7.12,4.51C142,34.23,141.73,33.92,142,33.78Z"/>
+            <path class="cls-6"
+                  d="M169.61,21.83c.11-.27.47-.2.47,0v.5h.56L170,15.07l1.39.25a.48.48,0,0,1,.24.09,12.25,12.25,0,0,0,2.77-1.69l.69.74c.34.34.34.52-.11.68a28.86,28.86,0,0,1-3.23.92l.13,1.28h1.39c.43,0,.59-.09,1-.49.43.4.74.62.74.89,0,.5-.4.68-1.05.68h-1.94l.16,1.37h1.24c.42,0,.58-.14,1-.56.41.4.77.67.77.94,0,.52-.43.7-1.1.7h-1.78l.16,1.48h10.33l.18-1.53h-1.62c-.33,0-.4-.25-.78-1.08H183l.18-1.34h-1.81c-.34,0-.48-.25-.81-1.08h2.76l.16-1.42h-2.32c-.31,0-.4-.16-.81-1.08h2.36a1.18,1.18,0,0,0,1-.49l1.21.49c1,.41.32.9.27,1.24l-.85,6.29H185a1.33,1.33,0,0,0,1.1-.43l.83.86c.45.44.45.53,0,.89-.76.59-1.82,1.58-2.4,2-.25.15-.56,0-.36-.32s.78-1.23,1-1.82H170a4.94,4.94,0,0,1-.27,1.26c-.72,2.14-2.94,1.12-1.84-.2A9.73,9.73,0,0,0,169.61,21.83Zm7,6.65V27.16l1.48.29a21.68,21.68,0,0,0,2-1.42H172c-.38,0-.51-.33-.83-1.12h9.32a1.38,1.38,0,0,0,1-.43l.81.83c.49.5.4.65.11.83a27.21,27.21,0,0,1-3.95,1.91v.43h6.4c.4,0,.63-.27,1-.7.45.43.9.7.9,1.08s-.54.79-1.24.79h-7.09v3.48a1.13,1.13,0,0,1-1.82.88,11.19,11.19,0,0,0-2.3-1.15c-.22-.09-.2-.34.05-.34.52,0,2,0,2.09,0s.11-.09.11-.18V29.65h-7.73c-.38,0-.47-.29-.89-1.17Zm.07-8.36c-.38-.33-.77-.65-1.1-.92s-.14-.49.2-.38,1,.38,1.5.59a15.33,15.33,0,0,0,1.2-1.62l.87.7c.36.26.36.33.2.49s-.58.56-1.07,1a5.05,5.05,0,0,1,1,.63c1,.83.41,2.2-.87,1.12-.34-.29-.72-.61-1.13-.94a16.92,16.92,0,0,1-2.26,1.41c-.32.16-.45-.18-.27-.34C175.58,21.29,176.19,20.71,176.73,20.12Zm1.19-3.25a18.66,18.66,0,0,1-2.09,1.48c-.29.18-.45-.2-.27-.36a19.3,19.3,0,0,0,1.62-1.82c-.43-.4-.86-.78-1.22-1.1s-.11-.52.23-.38a14.93,14.93,0,0,1,1.57.7,12.64,12.64,0,0,0,.94-1.4l.93.61c.36.25.33.36.18.54s-.52.54-.9.9a3.42,3.42,0,0,1,.49.33c1.19,1,.29,2.25-.81,1.15C178.39,17.32,178.17,17.09,177.92,16.87Z"/>
+            <path class="cls-6"
+                  d="M195,33.15c-.63.88-.76.83-2.25-.38A20.92,20.92,0,0,0,195.9,30V25.16h-2c-.34,0-.41-.3-.76-1.15h2a1,1,0,0,0,.88-.52l1.23.45c.95.34.41.86.41,1.26v4.74a5,5,0,0,0,1.73,1.39s0,0,0,0a28.25,28.25,0,0,0,3.86-3.62H199.4c-.38,0-.49-.22-.94-1.14h4.06V24.46h-2.15c-.32,0-.41-.25-.84-1.15h3V21.45l1.39.29c.23.05.36.16.36.36v1.21h2.5V21.45l1.39.29c.22.05.36.18.36.36v1.21h1.23c.36,0,.52-.15.9-.58.43.43.79.7.79,1,0,.47-.43.72-1.17.72h-1.75v2.07h2.2c.4,0,.65-.25,1-.66.45.43.86.77.86,1.13s-.5.67-1.24.67h-8l.88.83c.47.45.45.56,0,.88A20.34,20.34,0,0,1,200,31.6c2.15.81,4.87.65,7.21.59a51.06,51.06,0,0,0,5.95-.5c.25,0,.29.18.22.25-.53.52-.74.76-1.19,1.21a1.11,1.11,0,0,1-.94.43,36,36,0,0,1-4.11.2c-4.24-.07-8.4.16-10.38-3.41C196.25,31.29,195.69,32.23,195,33.15ZM194,18.82A8.69,8.69,0,0,1,197,20.53c.85.92-.18,2.69-1.28,1.28-.76-1-1.48-1.8-2.09-2.63C193.56,19.05,193.6,18.69,194,18.82Zm.81-4a6.74,6.74,0,0,1,2.74,1.32c1.26,1.08.16,2.88-1,1.44-.59-.7-1.28-1.6-1.91-2.38C194.32,15,194.5,14.78,194.77,14.85Zm4.38-.52,1.17.25c.31.06.4.2.4.27h1.42a.93.93,0,0,0,.76-.45l1.19.36c.88.27.36.6.36,1.1V18c0,.87-.67,1.1-1.55,1v-.52h-2.18v.22c0,1.15.05,1.2.79,1.26a6.84,6.84,0,0,0,2.49-.13.72.72,0,0,0,.45-.61l.12-.49c0-.14.29-.16.33,0a2,2,0,0,0,.5,1.1c.49.4.29.9-.3,1.15a8.45,8.45,0,0,1-2.89.31c-3-.11-3.06-.27-3.06-3Zm3.75,3V15.81h-2.18v1.57Zm3.87,9.15V24.46h-2.5v2.07Zm-.88-12.2,1.17.25c.31.06.4.18.4.27h1.44a.91.91,0,0,0,.79-.45l1.16.36c1,.29.39.69.39,1.14V18c0,.8-.7,1-1.55.94v-.54h-2.23v.22c0,1.15,0,1.2.79,1.26a8.31,8.31,0,0,0,2.83-.15.73.73,0,0,0,.45-.59l.11-.49c0-.14.29-.16.34,0a2,2,0,0,0,.51,1.1c.48.43.27.9-.31,1.15a10.79,10.79,0,0,1-3.23.31c-3-.11-3.06-.27-3.06-3Zm1.28,13.75a11,11,0,0,1,3.48,1.5c1.28,1,.5,2.83-1,1.42-.88-.84-1.8-1.73-2.72-2.56C206.77,28.32,206.79,28,207.17,28.08Zm2.52-10.7V15.81h-2.23v1.57Z"/>
+            <path class="cls-6"
+                  d="M224.36,17.72c.41,0,.67-.2,1.06-.67.49.47.83.74.83,1.05,0,.54-.38.79-1.15.79h-5.95c-.36,0-.45-.25-.83-1.17Zm-1.08,3c.41,0,.65-.2,1-.68.57.52.83.75.83,1.06,0,.54-.42.76-1.14.76h-4c-.36,0-.45-.22-.83-1.14Zm0,2.94c.42,0,.6-.2,1-.67.54.49.83.76.83,1.08,0,.51-.45.74-1.17.74h-3.84c-.36,0-.43-.25-.83-1.15Zm-3.89,2.54,1.28.27a.52.52,0,0,1,.38.29h1.44a1.22,1.22,0,0,0,1-.54l1.34.43c.9.29.32.85.32,1.35V32.3c0,1.05-.79,1.23-1.66,1.14V32.25H221v.34c0,1.1-.65,1.37-1.66,1.28ZM221,13.77a5,5,0,0,1,2.06,1.73c.81,1.5-.74,2.9-1.46,1-.24-.63-.69-1.89-1-2.45C220.57,13.81,220.79,13.63,221,13.77Zm2.36,17.29V27.92H221v3.14Zm11-1.68a14,14,0,0,1-1.64-2.83v6.53c0,1-.9,1.26-1.73,1.08V27.09a14.23,14.23,0,0,1-5.48,5.19c-.41.18-.48-.18-.27-.36a19.26,19.26,0,0,0,4.76-6.05h-4c-.4,0-.49-.22-.87-1.12h5.84V22.82h-2.29c-.14.81-.92,1-1.69.88V14.46l1.39.3c.21,0,.32.15.32.27h5.46a1,1,0,0,0,.87-.5l1.37.41c.88.27.34.85.34,1.25v6.5c0,.89-.85,1.12-1.71,1v-.83h-2.33v1.93h4c.43,0,.63-.22,1-.67.52.47.81.81.81,1.08,0,.51-.43.71-1.14.71h-4.16a20.65,20.65,0,0,0,1.82,2.39,18.41,18.41,0,0,0,3.48,2.87c.2.14.16.29.05.34-1.62.65-1.67.78-2.32.2A15,15,0,0,1,234.45,29.38Zm-3.37-11V16.13h-2.27v2.29Zm0,3.3v-2.2h-2.27v2.2Zm4.06-3.3V16.13h-2.33v2.29Zm0,3.3v-2.2h-2.33v2.2Z"/>
+            <path class="cls-6"
+                  d="M248.92,19.18l1.12.65c.7.41.72.5.54.9a26.84,26.84,0,0,1-6.06,8c-.32.25-.59,0-.34-.36A39.72,39.72,0,0,0,248.92,19.18ZM250.42,32c.59,0,2.92,0,3,0s.11-.09.11-.18v-18l1.5.29c.27,0,.45.22.45.33V32.75c0,1.08-1,2.11-2.18,1a7.08,7.08,0,0,0-2.94-1.41C250.18,32.32,250.2,32,250.42,32ZM258.53,20A24.74,24.74,0,0,1,264,25.81c.92,1.73-.39,3.32-1.69,1.23-1.12-1.79-2.38-4.11-4.13-6.78C258,20,258.22,19.68,258.53,20Z"/>
+            <path class="cls-6"
+                  d="M270.11,31.6l-.79-1c.68-.11,1.39-.24,2.11-.38V14.73l1.42.3c.22,0,.34.15.34.29h2.38a1.26,1.26,0,0,0,1-.5l1.44.48c.83.27.32.8.32,1.3V28.68l1.66-.45c.2-.06.56.21.16.43a77.39,77.39,0,0,1-8.88,3.28A.81.81,0,0,1,270.11,31.6ZM276.55,20V16.49h-3.36V20Zm0,4.67v-3.5h-3.36v3.5Zm0,4.43V25.85h-3.36v4C274.33,29.63,275.48,29.38,276.55,29.11Zm5-2.65a32.55,32.55,0,0,0,.59-5.84h-2.56c-.36,0-.5-.41-.83-1.19h3.43c0-1.82,0-3.69,0-5.37l1.37.25c.29,0,.43.2.43.38,0,1.62,0,3.21,0,4.74h1.66a1.12,1.12,0,0,0,1-.54l1.35.47c1.1.38.45.92.45,1.33a51.8,51.8,0,0,1-.47,7.75c-.54,3.52-1.17,4.44-2.09,5.16a1.06,1.06,0,0,1-1.41-.09,7.89,7.89,0,0,0-1.94-1.19c-.24-.11-.06-.34.12-.31,2.22.27,2.35.15,2.67-.41a9.65,9.65,0,0,0,.85-3,54.39,54.39,0,0,0,.5-8h-2.68a27,27,0,0,1-.85,6.51,10.54,10.54,0,0,1-7.57,7c-.27.07-.45-.27-.27-.38C278.42,32,280.8,29.81,281.56,26.46Z"/>
+            <path class="cls-6"
+                  d="M301.43,32.12c.58,0,2.47.07,2.58,0s.13-.11.13-.18v-6H296c-.41,0-.54-.27-1-1.26h9.16V21.23h-5.79c-.36,0-.47-.3-.92-1.24h6.71v-3.5a66.23,66.23,0,0,1-7.12.13c-.4,0-.36-.45,0-.49a97.51,97.51,0,0,0,14-2.27l.76.9c.54.63.38.78-.29.9-1.46.24-3.37.47-5.41.67V20h4.53c.38,0,.61-.18,1.06-.65.47.49.85.74.85,1.14s-.47.75-1.26.75h-5.18v3.45h7.16c.41,0,.65-.2,1.08-.65.49.47.9.81.9,1.15,0,.49-.47.76-1.28.76h-7.86v6.74c0,1.17-1.22,2-2.14,1.21a6.52,6.52,0,0,0-2.56-1.39C301.11,32.43,301.13,32.12,301.43,32.12Z"/>
+            <path class="cls-6"
+                  d="M100.05,40.57v8.22h-.36l-.63-.73-5.18-5.75h-.12v6.47l-.33,0-.34,0V40.57h.47l5.69,6.19h.13V40.57l.34,0Z"/>
+            <path class="cls-6"
+                  d="M102,47.16h.13a3,3,0,0,0,.79.91,2,2,0,0,0,1.16.33,1.56,1.56,0,0,0,1.2-.51,1.74,1.74,0,0,0,.48-1.24,1.53,1.53,0,0,0-1-1.41L103,44.43a1.9,1.9,0,0,1-1-1.73,2.08,2.08,0,0,1,.8-1.73,3.19,3.19,0,0,1,2.8-.43,2,2,0,0,1,.78.43l-.14.36s-.07.23-.18.62H106a1.68,1.68,0,0,0-.57-.77,1.68,1.68,0,0,0-2,.12,1.3,1.3,0,0,0-.44,1,1.56,1.56,0,0,0,1,1.42l1.83.8a1.81,1.81,0,0,1,1,1.65,2.58,2.58,0,0,1-.86,2,3.12,3.12,0,0,1-2.1.71,3.42,3.42,0,0,1-1.08-.19,1.89,1.89,0,0,1-.88-.5,2.4,2.4,0,0,0,.12-.48A5.09,5.09,0,0,0,102,47.16Z"/>
+            <path class="cls-6"
+                  d="M111.61,45.1v3.69l-.53,0-.53,0V45.33l-2.94-4.76.67,0,.66,0c.27.52.66,1.24,1.19,2.16s.89,1.54,1.09,1.86a9.78,9.78,0,0,0,.7-1.1c.24-.42.55-1,.94-1.69q.31-.61.66-1.23l.46,0,.47,0c-.29.38-.58.78-.85,1.21l-1.32,2.12c-.16.25-.29.46-.38.62A6.23,6.23,0,0,0,111.61,45.1Z"/>
+            <path class="cls-6"
+                  d="M115.52,47.16h.12a3.06,3.06,0,0,0,.8.91,2,2,0,0,0,1.16.33,1.58,1.58,0,0,0,1.2-.51,1.74,1.74,0,0,0,.48-1.24,1.54,1.54,0,0,0-1-1.41l-1.81-.81a1.89,1.89,0,0,1-1-1.73,2.07,2.07,0,0,1,.79-1.73,3.21,3.21,0,0,1,2.81-.43,2.12,2.12,0,0,1,.78.43c-.06.13-.1.25-.14.36s-.07.23-.18.62h-.12a1.68,1.68,0,0,0-.57-.77,1.7,1.7,0,0,0-2,.12,1.29,1.29,0,0,0-.43,1,1.56,1.56,0,0,0,1,1.42l1.82.8a1.8,1.8,0,0,1,1,1.65,2.55,2.55,0,0,1-.87,2,3.09,3.09,0,0,1-2.1.71,3.42,3.42,0,0,1-1.08-.19,1.91,1.91,0,0,1-.87-.5q.08-.26.12-.48C115.46,47.59,115.49,47.4,115.52,47.16Z"/>
+            <path class="cls-6"
+                  d="M123,40.57v4.59a4.08,4.08,0,0,0,.55,2.39,2.48,2.48,0,0,0,2.1.81,2.29,2.29,0,0,0,2-.92,4.17,4.17,0,0,0,.59-2.4V40.57l.33,0,.34,0v4.77A3.58,3.58,0,0,1,128,48a3.54,3.54,0,0,1-2.57.91,3.73,3.73,0,0,1-2.6-.83,2.49,2.49,0,0,1-.71-1.25,6.13,6.13,0,0,1-.15-1.46v-4.8l.52,0Z"/>
+            <path class="cls-6"
+                  d="M141.06,47.49l-.06.75a3.67,3.67,0,0,1-1.23.51,6.15,6.15,0,0,1-1.43.16,4.08,4.08,0,0,1-3.09-1.16,4.31,4.31,0,0,1-1.13-3.13,4,4,0,0,1,1.31-3.12,4.64,4.64,0,0,1,3.21-1.11,6,6,0,0,1,1.31.15,6.08,6.08,0,0,1,1.27.41c0,.12-.09.27-.14.45s-.08.33-.11.47h-.08a2.66,2.66,0,0,0-.47-.41,3.12,3.12,0,0,0-1.82-.62A3,3,0,0,0,136.12,42a4.22,4.22,0,0,0-.82,2.68,4.09,4.09,0,0,0,.88,2.75,3,3,0,0,0,2.33,1,3.78,3.78,0,0,0,1.33-.26A4.09,4.09,0,0,0,141.06,47.49Z"/>
+            <path class="cls-6"
+                  d="M142.16,45.87a2.73,2.73,0,0,1,.87-2.09,3.08,3.08,0,0,1,2.18-.81,2.7,2.7,0,0,1,2,.8A3,3,0,0,1,148,45.9a3,3,0,0,1-.75,2.07,2.92,2.92,0,0,1-2.25.91,2.74,2.74,0,0,1-2-.82A3,3,0,0,1,142.16,45.87Zm3-2.52a1.66,1.66,0,0,0-1.56.86,3.56,3.56,0,0,0-.42,1.84,3.08,3.08,0,0,0,.42,1.68,1.64,1.64,0,0,0,2.9-.2,3.6,3.6,0,0,0,.4-1.69,3.4,3.4,0,0,0-.36-1.64A1.5,1.5,0,0,0,145.2,43.35Z"/>
+            <path class="cls-6"
+                  d="M154.16,43v5.75l-.48,0-.48,0v-1a2,2,0,0,1-1.91,1.13,1.87,1.87,0,0,1-1.49-.55,2.57,2.57,0,0,1-.49-1.76V43.05l.48,0,.48,0v3.25a2.75,2.75,0,0,0,.33,1.51,1.47,1.47,0,0,0,2.32-.15,2.5,2.5,0,0,0,.28-1.28V43.05l.48,0Z"/>
+            <path class="cls-6"
+                  d="M156.18,48.79V43.05l.48,0,.48,0v1.22l.06-.15a3,3,0,0,1,.67-.79,1.37,1.37,0,0,1,.84-.34.92.92,0,0,1,.37.06l-.17,1-.25-.1a.79.79,0,0,0-.31-.09,1.25,1.25,0,0,0-.42.08.78.78,0,0,0-.35.22,1.8,1.8,0,0,0-.36.66,3.44,3.44,0,0,0-.08.86v3.11l-.48,0Z"/>
+            <path class="cls-6"
+                  d="M160.05,47.62h.1a1.9,1.9,0,0,0,.6.63,1.37,1.37,0,0,0,.78.26,1.2,1.2,0,0,0,.81-.32,1,1,0,0,0,.36-.78c0-.49-.47-.88-1.41-1.15s-1.42-.77-1.42-1.51a1.65,1.65,0,0,1,.55-1.31,2.12,2.12,0,0,1,1.41-.47,3,3,0,0,1,.8.11,1.75,1.75,0,0,1,.55.21,4.7,4.7,0,0,0-.28.85h-.11a1.35,1.35,0,0,0-.41-.55.94.94,0,0,0-.61-.24,1.15,1.15,0,0,0-.78.26.9.9,0,0,0-.31.73c0,.48.47.87,1.41,1.18s1.42.79,1.42,1.46a1.7,1.7,0,0,1-.71,1.43,2.46,2.46,0,0,1-1.5.47,3.8,3.8,0,0,1-.79-.1,2.7,2.7,0,0,1-.71-.29c0-.14.1-.29.14-.43A2.57,2.57,0,0,0,160.05,47.62Z"/>
+            <path class="cls-6"
+                  d="M169.35,47.56v.62a4,4,0,0,1-1,.51,3.07,3.07,0,0,1-1.08.19,2.8,2.8,0,0,1-2.06-.79,3,3,0,0,1-.78-2.16,3.06,3.06,0,0,1,.7-2.1,2.59,2.59,0,0,1,2.05-.86,2.21,2.21,0,0,1,1.72.72,3.17,3.17,0,0,1,.72,2.24l-2.44,0H165.5a2.83,2.83,0,0,0,.49,1.74,1.85,1.85,0,0,0,1.59.74,2.16,2.16,0,0,0,1.06-.28A3.27,3.27,0,0,0,169.35,47.56Zm-3.85-2.11h3.19a2.9,2.9,0,0,0-.3-1.45,1.27,1.27,0,0,0-1.2-.65,1.48,1.48,0,0,0-1.27.66A2.4,2.4,0,0,0,165.5,45.45Z"/>
+            <path class="cls-6"
+                  d="M174.26,47.16h.12a3.06,3.06,0,0,0,.8.91,2,2,0,0,0,1.16.33,1.58,1.58,0,0,0,1.2-.51,1.74,1.74,0,0,0,.48-1.24,1.54,1.54,0,0,0-1-1.41l-1.81-.81a1.89,1.89,0,0,1-1-1.73,2.07,2.07,0,0,1,.79-1.73,3.21,3.21,0,0,1,2.81-.43,2.12,2.12,0,0,1,.78.43c-.06.13-.1.25-.14.36s-.07.23-.18.62h-.12a1.68,1.68,0,0,0-.57-.77,1.7,1.7,0,0,0-2,.12,1.29,1.29,0,0,0-.43,1,1.56,1.56,0,0,0,1,1.42l1.82.8a1.8,1.8,0,0,1,1,1.65,2.55,2.55,0,0,1-.87,2,3.09,3.09,0,0,1-2.1.71,3.42,3.42,0,0,1-1.08-.19,1.91,1.91,0,0,1-.87-.5,3.36,3.36,0,0,0,.12-.48C174.2,47.59,174.23,47.4,174.26,47.16Z"/>
+            <path class="cls-6"
+                  d="M184.9,47.56v.62a4,4,0,0,1-1,.51,3.07,3.07,0,0,1-1.08.19,2.77,2.77,0,0,1-2.05-.79,3,3,0,0,1-.78-2.16,3.06,3.06,0,0,1,.69-2.1,2.59,2.59,0,0,1,2.05-.86,2.19,2.19,0,0,1,1.72.72,3.17,3.17,0,0,1,.72,2.24l-2.44,0h-1.69a2.89,2.89,0,0,0,.49,1.74,1.85,1.85,0,0,0,1.59.74,2.19,2.19,0,0,0,1.07-.28A3.49,3.49,0,0,0,184.9,47.56Zm-3.85-2.11h3.19a2.9,2.9,0,0,0-.3-1.45,1.25,1.25,0,0,0-1.2-.65,1.48,1.48,0,0,0-1.27.66A2.4,2.4,0,0,0,181.05,45.45Z"/>
+            <path class="cls-6" d="M186.85,48.79v-9l.48,0,.48,0v9l-.48,0Z"/>
+            <path class="cls-6"
+                  d="M194.38,47.56v.62a4,4,0,0,1-1,.51,3.07,3.07,0,0,1-1.08.19,2.77,2.77,0,0,1-2.05-.79,3,3,0,0,1-.78-2.16,3.06,3.06,0,0,1,.69-2.1,2.59,2.59,0,0,1,2.05-.86,2.19,2.19,0,0,1,1.72.72,3.17,3.17,0,0,1,.72,2.24l-2.44,0h-1.69a2.89,2.89,0,0,0,.49,1.74,1.85,1.85,0,0,0,1.59.74,2.19,2.19,0,0,0,1.07-.28A3.49,3.49,0,0,0,194.38,47.56Zm-3.85-2.11h3.19a2.9,2.9,0,0,0-.3-1.45,1.25,1.25,0,0,0-1.2-.65A1.48,1.48,0,0,0,191,44,2.4,2.4,0,0,0,190.53,45.45Z"/>
+            <path class="cls-6"
+                  d="M200.64,43.47l-.28.79h-.1c0-.07-.1-.14-.15-.21a1.08,1.08,0,0,0-.17-.19,1.33,1.33,0,0,0-.53-.35,1.65,1.65,0,0,0-.66-.13,1.83,1.83,0,0,0-1.55.76,2.79,2.79,0,0,0-.51,1.7,2.89,2.89,0,0,0,.6,1.89,2,2,0,0,0,1.58.74,1.82,1.82,0,0,0,.9-.22,4.35,4.35,0,0,0,.76-.56l.07,0-.06.55a3,3,0,0,1-1.84.6,3.08,3.08,0,0,1-2.29-.85,2.94,2.94,0,0,1-.78-2.13,2.74,2.74,0,0,1,.87-2.15,3.2,3.2,0,0,1,2.24-.78,4,4,0,0,1,1,.12A3,3,0,0,1,200.64,43.47Z"/>
+            <path class="cls-6"
+                  d="M202.08,41.85l1-.37V43h1.27a1.7,1.7,0,0,0,0,.26.88.88,0,0,0,0,.2H203v3.4a3.25,3.25,0,0,0,.12,1,.75.75,0,0,0,.76.52,1.13,1.13,0,0,0,.3,0l.24-.05v.29a3.62,3.62,0,0,1-.51.16,1.93,1.93,0,0,1-.49.06,1.27,1.27,0,0,1-1-.39,2.47,2.47,0,0,1-.34-1.5v-3.5h-.75a.63.63,0,0,0,0-.23.75.75,0,0,0,0-.23h.75Z"/>
+            <path class="cls-6"
+                  d="M206.9,41a.6.6,0,0,1-.18.44.6.6,0,0,1-.86,0,.6.6,0,0,1-.18-.44.6.6,0,0,1,.18-.43.58.58,0,0,1,.43-.18.58.58,0,0,1,.42.18A.54.54,0,0,1,206.9,41Zm-.13,2.06v5.74l-.48,0-.48,0V43.05l.48,0Z"/>
+            <path class="cls-6"
+                  d="M208.45,45.87a2.73,2.73,0,0,1,.87-2.09A3.06,3.06,0,0,1,211.5,43a2.7,2.7,0,0,1,2,.8,3.26,3.26,0,0,1,0,4.2,2.9,2.9,0,0,1-2.24.91,2.74,2.74,0,0,1-2-.82A3,3,0,0,1,208.45,45.87Zm3-2.52a1.68,1.68,0,0,0-1.56.86,3.56,3.56,0,0,0-.42,1.84,3.08,3.08,0,0,0,.42,1.68,1.62,1.62,0,0,0,1.46.78,1.58,1.58,0,0,0,1.45-1,3.6,3.6,0,0,0,.39-1.69,3.4,3.4,0,0,0-.36-1.64A1.48,1.48,0,0,0,211.48,43.35Z"/>
+            <path class="cls-6"
+                  d="M215.7,48.79V43.05l.48,0,.48,0v1.09a2.17,2.17,0,0,1,.81-.86,2.12,2.12,0,0,1,1.12-.31,1.76,1.76,0,0,1,1.47.57,2.76,2.76,0,0,1,.46,1.77v3.47l-.48,0-.48,0v-3.2a3.13,3.13,0,0,0-.24-1.41,1.13,1.13,0,0,0-1.09-.58,1.32,1.32,0,0,0-1.26.65,3.67,3.67,0,0,0-.31,1.75v2.78l-.48,0Z"/>
+            <path class="cls-6"
+                  d="M232.11,44V40.57l.53,0,.53,0v8.22l-.53,0-.53,0V44.65h-1l-1.57,0-1.47,0-1.06,0v4.14l-.53,0-.53,0V40.57l.53,0,.53,0V44l1.51,0,1,0h.94Z"/>
+            <path class="cls-6"
+                  d="M239.65,47.56v.62a4,4,0,0,1-1,.51,3,3,0,0,1-1.08.19,2.77,2.77,0,0,1-2-.79,3,3,0,0,1-.78-2.16,3,3,0,0,1,.7-2.1,2.57,2.57,0,0,1,2.05-.86,2.18,2.18,0,0,1,1.71.72,3.17,3.17,0,0,1,.72,2.24l-2.43,0H235.8a2.83,2.83,0,0,0,.49,1.74,1.83,1.83,0,0,0,1.58.74,2.17,2.17,0,0,0,1.07-.28A3.53,3.53,0,0,0,239.65,47.56Zm-3.85-2.11H239a2.9,2.9,0,0,0-.3-1.45,1.27,1.27,0,0,0-1.2-.65,1.47,1.47,0,0,0-1.27.66A2.4,2.4,0,0,0,235.8,45.45Z"/>
+            <path class="cls-6" d="M241.59,48.79v-9l.48,0,.48,0v9l-.48,0Z"/>
+            <path class="cls-6"
+                  d="M245.56,51.87l-.48,0-.48,0V43.05l.48,0,.48,0v1.21a2.68,2.68,0,0,1,.82-1,2.33,2.33,0,0,1,1.24-.32,2.17,2.17,0,0,1,1.78.83,2.92,2.92,0,0,1,.63,1.92,3.47,3.47,0,0,1-.72,2.31,2.34,2.34,0,0,1-1.87.85,2,2,0,0,1-1.09-.29,2.3,2.3,0,0,1-.76-.86Zm0-5.8A2.83,2.83,0,0,0,246,47.7a1.54,1.54,0,0,0,1.35.67,1.38,1.38,0,0,0,1.27-.78,3.77,3.77,0,0,0,.37-1.82,3.39,3.39,0,0,0-.33-1.63,1.4,1.4,0,0,0-1.32-.76,1.49,1.49,0,0,0-1.4.93A3.89,3.89,0,0,0,245.56,46.07Z"/>
+            <path class="cls-6"
+                  d="M255.87,47.56v.62a4,4,0,0,1-1,.51,3.07,3.07,0,0,1-1.08.19,2.8,2.8,0,0,1-2.06-.79,3,3,0,0,1-.78-2.16,3.06,3.06,0,0,1,.7-2.1,2.59,2.59,0,0,1,2.05-.86,2.21,2.21,0,0,1,1.72.72,3.17,3.17,0,0,1,.72,2.24l-2.44,0H252a2.83,2.83,0,0,0,.49,1.74,1.85,1.85,0,0,0,1.59.74,2.16,2.16,0,0,0,1.06-.28A3.27,3.27,0,0,0,255.87,47.56ZM252,45.45h3.19a2.9,2.9,0,0,0-.3-1.45,1.27,1.27,0,0,0-1.2-.65,1.48,1.48,0,0,0-1.27.66A2.4,2.4,0,0,0,252,45.45Z"/>
+            <path class="cls-6"
+                  d="M257.58,48.79V43.05l.48,0,.48,0v1.22l.06-.15a3,3,0,0,1,.67-.79,1.37,1.37,0,0,1,.84-.34.92.92,0,0,1,.37.06l-.17,1-.25-.1a.79.79,0,0,0-.31-.09,1.25,1.25,0,0,0-.42.08.78.78,0,0,0-.35.22,1.8,1.8,0,0,0-.36.66,3.44,3.44,0,0,0-.08.86v3.11l-.48,0Z"/>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/nsysu_selector_helper/src/components/SectionHeader.tsx b/nsysu_selector_helper/src/components/SectionHeader.tsx
new file mode 100644
index 0000000..3255f5f
--- /dev/null
+++ b/nsysu_selector_helper/src/components/SectionHeader.tsx
@@ -0,0 +1,93 @@
+import { FC } from 'react';
+import { Flex, Menu, MenuProps, theme } from 'antd';
+import {
+  BookFilled,
+  BookOutlined,
+  FileDoneOutlined,
+  FileSearchOutlined,
+  NotificationOutlined,
+} from '@ant-design/icons';
+import banner from '@/assets/banner.svg';
+import styled from 'styled-components';
+
+type HeaderProps = {};
+
+const HeaderContainer = styled(Flex)<{
+  $primaryColor: string;
+  $textColor: string;
+}>`
+  padding: 0 20px;
+
+  background-color: ${(props) => props.$primaryColor};
+  color: ${(props) => props.$textColor};
+`;
+
+const StyledMenu = styled(Menu)<{
+  $textColor: string;
+}>`
+  padding-bottom: 5px;
+  background: transparent;
+
+  li.ant-menu-item {
+    background-color: transparent;
+    color: ${(props) => props.$textColor} !important;
+  }
+
+  li.ant-menu-item-selected::after {
+    border-bottom-color: ${(props) => props.$textColor} !important;
+  }
+
+  li.ant-menu-item-active::after {
+    border-bottom-color: ${(props) => props.$textColor} !important;
+  }
+`;
+
+const Brand = styled.img`
+  height: 36px;
+  margin-right: 20px;
+
+  @media (max-width: 290px) {
+    display: none;
+  }
+`;
+
+const SectionHeader: FC<HeaderProps> = () => {
+  const { token } = theme.useToken();
+  const primaryColor = token.colorPrimary;
+  const textColor = '#ffffff';
+
+  const navTabs: MenuProps['items'] = [
+    { key: 'all-courses', label: '所有課程', icon: <BookOutlined /> },
+    { key: 'semester-compulsory', label: '學期必修', icon: <BookFilled /> },
+    {
+      key: 'course-detective',
+      label: '課程偵探',
+      icon: <FileSearchOutlined />,
+    },
+    { key: 'selected-export', label: '已選匯出', icon: <FileDoneOutlined /> },
+    { key: 'announcements', label: '公告', icon: <NotificationOutlined /> },
+  ];
+
+  return (
+    <HeaderContainer
+      $primaryColor={primaryColor}
+      $textColor={textColor}
+      justify={'space-between'}
+    >
+      <Flex align={'center'} justify={'center'} style={{ padding: '5px' }}>
+        <Brand src={banner as string} alt='NSYSU Selector Helper' />
+      </Flex>
+      <StyledMenu
+        $textColor={textColor}
+        mode='horizontal'
+        items={navTabs}
+        style={{
+          marginLeft: 'auto',
+        }}
+        selectedKeys={['all-courses']}
+      />
+    </HeaderContainer>
+  );
+};
+
+export default SectionHeader;
diff --git a/nsysu_selector_helper/vite.config.ts b/nsysu_selector_helper/vite.config.ts
index d29803f..3751a69 100644
--- a/nsysu_selector_helper/vite.config.ts
+++ b/nsysu_selector_helper/vite.config.ts
@@ -4,7 +4,11 @@ import react from '@vitejs/plugin-react-swc'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react({
+    plugins: [
+      ['@swc/plugin-styled-components', { displayName: false }],
+    ],
+  })],
   resolve: {
     alias: [
       {find: '@', replacement: resolve(__dirname, 'src')},
diff --git a/nsysu_selector_helper/yarn.lock b/nsysu_selector_helper/yarn.lock
index b868633..137bfe1 100644
--- a/nsysu_selector_helper/yarn.lock
+++ b/nsysu_selector_helper/yarn.lock
@@ -29,7 +29,7 @@
 
 "@ant-design/icons@^5.3.7":
   version "5.3.7"
-  resolved "https://registry.npmjs.org/@ant-design/icons/-/icons-5.3.7.tgz"
+  resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-5.3.7.tgz#d9f3654bf7934ee5faba43f91b5a187f5309ec68"
   integrity sha512-bCPXTAg66f5bdccM4TT21SQBDO1Ek2gho9h3nO9DAKXJP4sq+5VBjrQMSxMVXSB3HyEz+cUbHQ5+6ogxCOpaew==
   dependencies:
     "@ant-design/colors" "^7.0.0"
@@ -66,6 +66,23 @@
   resolved "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz"
   integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==
 
+"@emotion/is-prop-valid@1.2.2":
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz#d4175076679c6a26faa92b03bb786f9e52612337"
+  integrity sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==
+  dependencies:
+    "@emotion/memoize" "^0.8.1"
+
+"@emotion/memoize@^0.8.1":
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.8.1.tgz#c1ddb040429c6d21d38cc945fe75c818cfb68e17"
+  integrity sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==
+
+"@emotion/unitless@0.8.1":
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.8.1.tgz#182b5a4704ef8ad91bde93f7a860a88fd92c79a3"
+  integrity sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==
+
 "@emotion/unitless@^0.7.5":
   version "0.7.5"
   resolved "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz"
@@ -494,6 +511,13 @@
   resolved "https://registry.npmjs.org/@swc/counter/-/counter-0.1.3.tgz"
   integrity sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==
 
+"@swc/plugin-styled-components@^2.0.9":
+  version "2.0.9"
+  resolved "https://registry.yarnpkg.com/@swc/plugin-styled-components/-/plugin-styled-components-2.0.9.tgz#e65d8e4af5e4f1f2eb86d350e217b3510a83ccd6"
+  integrity sha512-0aPv7lNed27qs8JBklLkVSlLhpPRU3YKRnKplObaAyhNWbpbOkCbVSTay5ArFT2Gz1rz844Np7l4DMozEtZRBg==
+  dependencies:
+    "@swc/counter" "^0.1.3"
+
 "@swc/types@^0.1.9":
   version "0.1.9"
   resolved "https://registry.npmjs.org/@swc/types/-/types-0.1.9.tgz"
@@ -506,6 +530,14 @@
   resolved "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz"
   integrity sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==
 
+"@types/hoist-non-react-statics@*":
+  version "3.3.5"
+  resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz#dab7867ef789d87e2b4b0003c9d65c49cc44a494"
+  integrity sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==
+  dependencies:
+    "@types/react" "*"
+    hoist-non-react-statics "^3.3.0"
+
 "@types/node@^20.14.9":
   version "20.14.9"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-20.14.9.tgz#12e8e765ab27f8c421a1820c99f5f313a933b420"
@@ -533,6 +565,20 @@
     "@types/prop-types" "*"
     csstype "^3.0.2"
 
+"@types/styled-components@^5.1.34":
+  version "5.1.34"
+  resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-5.1.34.tgz#4107df8ef8a7eaba4fa6b05f78f93fba4daf0300"
+  integrity sha512-mmiVvwpYklFIv9E8qfxuPyIt/OuyIrn6gMOAMOFUO3WJfSrSE+sGUoa4PiZj77Ut7bKZpaa6o1fBKS/4TOEvnA==
+  dependencies:
+    "@types/hoist-non-react-statics" "*"
+    "@types/react" "*"
+    csstype "^3.0.2"
+
+"@types/stylis@4.2.5":
+  version "4.2.5"
+  resolved "https://registry.yarnpkg.com/@types/stylis/-/stylis-4.2.5.tgz#1daa6456f40959d06157698a653a9ab0a70281df"
+  integrity sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==
+
 "@typescript-eslint/eslint-plugin@^7.13.1":
   version "7.15.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.15.0.tgz"
@@ -759,6 +805,11 @@ callsites@^3.0.0:
   resolved "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz"
   integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
 
+camelize@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.1.tgz#89b7e16884056331a35d6b5ad064332c91daa6c3"
+  integrity sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==
+
 chalk@^4.0.0:
   version "4.1.2"
   resolved "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz"
@@ -810,7 +861,21 @@ cross-spawn@^7.0.2:
     shebang-command "^2.0.0"
     which "^2.0.1"
 
-csstype@^3.0.2, csstype@^3.1.3:
+css-color-keywords@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
+  integrity sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==
+
+css-to-react-native@3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-3.2.0.tgz#cdd8099f71024e149e4f6fe17a7d46ecd55f1e32"
+  integrity sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==
+  dependencies:
+    camelize "^1.0.0"
+    css-color-keywords "^1.0.0"
+    postcss-value-parser "^4.0.2"
+
+csstype@3.1.3, csstype@^3.0.2, csstype@^3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz"
   integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
@@ -1114,6 +1179,13 @@ has-flag@^4.0.0:
   resolved "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz"
   integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
 
+hoist-non-react-statics@^3.3.0:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
+  integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
+  dependencies:
+    react-is "^16.7.0"
+
 ignore@^5.2.0, ignore@^5.3.1:
   version "5.3.1"
   resolved "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz"
@@ -1342,7 +1414,7 @@ path-type@^4.0.0:
   resolved "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz"
   integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
 
-picocolors@^1.0.1:
+picocolors@^1.0.0, picocolors@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz"
   integrity sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==
@@ -1352,6 +1424,20 @@ picomatch@^2.3.1:
   resolved "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz"
   integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
 
+postcss-value-parser@^4.0.2:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
+  integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
+
+postcss@8.4.38:
+  version "8.4.38"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.38.tgz#b387d533baf2054288e337066d81c6bee9db9e0e"
+  integrity sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.0.0"
+    source-map-js "^1.2.0"
+
 postcss@^8.4.38:
   version "8.4.39"
   resolved "https://registry.npmjs.org/postcss/-/postcss-8.4.39.tgz"
@@ -1366,6 +1452,11 @@ prelude-ls@^1.2.1:
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz"
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
+prettier@^3.3.2:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.3.2.tgz#03ff86dc7c835f2d2559ee76876a3914cec4a90a"
+  integrity sha512-rAVeHYMcv8ATV5d508CFdn+8/pHPpXeIid1DdrPwXnaAdH7cqjVbpJaT5eq4yRAFU/lsbwYwSF/n5iNrdJHPQA==
+
 punycode@^2.1.0:
   version "2.3.1"
   resolved "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz"
@@ -1735,6 +1826,11 @@ react-dom@^18.3.1:
     loose-envify "^1.1.0"
     scheduler "^0.23.2"
 
+react-is@^16.7.0:
+  version "16.13.1"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
+  integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
+
 react-is@^18.2.0:
   version "18.3.1"
   resolved "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz"
@@ -1825,6 +1921,11 @@ semver@^7.6.0:
   resolved "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz"
   integrity sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==
 
+shallowequal@1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
+  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
+
 shebang-command@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz"
@@ -1864,7 +1965,22 @@ strip-json-comments@^3.1.1:
   resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz"
   integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
 
-stylis@^4.0.13:
+styled-components@^6.1.11:
+  version "6.1.11"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-6.1.11.tgz#01948e5195bf1d39e57e0a85b41958c80e40cfb8"
+  integrity sha512-Ui0jXPzbp1phYij90h12ksljKGqF8ncGx+pjrNPsSPhbUUjWT2tD1FwGo2LF6USCnbrsIhNngDfodhxbegfEOA==
+  dependencies:
+    "@emotion/is-prop-valid" "1.2.2"
+    "@emotion/unitless" "0.8.1"
+    "@types/stylis" "4.2.5"
+    css-to-react-native "3.2.0"
+    csstype "3.1.3"
+    postcss "8.4.38"
+    shallowequal "1.1.0"
+    stylis "4.3.2"
+    tslib "2.6.2"
+
+stylis@4.3.2, stylis@^4.0.13:
   version "4.3.2"
   resolved "https://registry.npmjs.org/stylis/-/stylis-4.3.2.tgz"
   integrity sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==
@@ -1903,6 +2019,11 @@ ts-api-utils@^1.3.0:
   resolved "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.3.0.tgz"
   integrity sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ==
 
+tslib@2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
+  integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
+
 type-check@^0.4.0, type-check@~0.4.0:
   version "0.4.0"
   resolved "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz"