feat(saju): api helpers (saju + compat) + 라우트 + 아이콘 + placeholder pages

src/api.js

@@ -769,3 +769,59 @@ export function tarotPatchReading(id, body) {
 export function tarotDeleteReading(id) {
   return apiDelete(`/api/tarot/readings/${id}`);
 }
+
+// ====== Saju ======
+
+export function sajuInterpret(body) {
+  return apiPost('/api/saju/interpret', body);
+}
+
+export function sajuListReadings({ page = 1, size = 20, favorite } = {}) {
+  const qs = new URLSearchParams();
+  qs.set('page', page);
+  qs.set('size', size);
+  if (favorite !== undefined) qs.set('favorite', favorite);
+  return apiGet(`/api/saju/readings?${qs.toString()}`);
+}
+
+export function sajuGetReading(id) {
+  return apiGet(`/api/saju/readings/${id}`);
+}
+
+export function sajuPatchReading(id, body) {
+  return apiPatch(`/api/saju/readings/${id}`, body);
+}
+
+export function sajuDeleteReading(id) {
+  return apiDelete(`/api/saju/readings/${id}`);
+}
+
+export function sajuCurrentFortune(readingId) {
+  return apiGet(`/api/saju/current-fortune?reading_id=${readingId}`);
+}
+
+// ====== Compatibility ======
+
+export function compatInterpret(body) {
+  return apiPost('/api/saju/compat/interpret', body);
+}
+
+export function compatListReadings({ page = 1, size = 20, favorite } = {}) {
+  const qs = new URLSearchParams();
+  qs.set('page', page);
+  qs.set('size', size);
+  if (favorite !== undefined) qs.set('favorite', favorite);
+  return apiGet(`/api/saju/compat/readings?${qs.toString()}`);
+}
+
+export function compatGetReading(id) {
+  return apiGet(`/api/saju/compat/readings/${id}`);
+}
+
+export function compatPatchReading(id, body) {
+  return apiPatch(`/api/saju/compat/readings/${id}`, body);
+}
+
+export function compatDeleteReading(id) {
+  return apiDelete(`/api/saju/compat/readings/${id}`);
+}

src/components/Icons.jsx

@@ -143,3 +143,13 @@ export const IconTarot = () =>
             <circle cx="12" cy="12" r="3" />
         </>
     );
+
+export const IconSaju = () =>
+    svg(
+        <>
+            <circle cx="12" cy="12" r="10" />
+            <path d="M12 2a10 10 0 0 0 0 20 5 5 0 0 1 0-10 5 5 0 0 0 0-10z" fill="currentColor" />
+            <circle cx="12" cy="7" r="1.5" fill="#fff" />
+            <circle cx="12" cy="17" r="1.5" fill="currentColor" />
+        </>
+    );

src/pages/saju/Compatibility.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+export default function Compatibility() {
+  return (
+    <div style={{ padding: '2rem', color: '#fff' }}>
+      <h1>궁합 분석</h1>
+      <p>UI 시안 적용 대기 중...</p>
+    </div>
+  );
+}

src/pages/saju/CompatibilityResult.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+export default function CompatibilityResult() {
+  return (
+    <div style={{ padding: '2rem', color: '#fff' }}>
+      <h1>궁합 분석 결과</h1>
+      <p>UI 시안 적용 대기 중...</p>
+    </div>
+  );
+}

src/pages/saju/Saju.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+export default function Saju() {
+  return (
+    <div style={{ padding: '2rem', color: '#fff' }}>
+      <h1>사주 분석</h1>
+      <p>UI 시안 적용 대기 중...</p>
+    </div>
+  );
+}

src/pages/saju/SajuResult.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+export default function SajuResult() {
+  return (
+    <div style={{ padding: '2rem', color: '#fff' }}>
+      <h1>사주 분석 결과</h1>
+      <p>UI 시안 적용 대기 중...</p>
+    </div>
+  );
+}

src/routes.jsx

@@ -12,6 +12,7 @@ import {
     IconInsta,
     IconPortfolio,
     IconTarot,
+    IconSaju,
 } from './components/Icons';
 
 const Home = lazy(() => import('./pages/home/Home'));
@@ -34,6 +35,10 @@ const Tarot = lazy(() => import('./pages/tarot/Tarot'));
 const TarotTodayCard = lazy(() => import('./pages/tarot/TodayCard'));
 const TarotReading = lazy(() => import('./pages/tarot/Reading'));
 const TarotHistory = lazy(() => import('./pages/tarot/History'));
+const Saju = lazy(() => import('./pages/saju/Saju'));
+const SajuResult = lazy(() => import('./pages/saju/SajuResult'));
+const Compatibility = lazy(() => import('./pages/saju/Compatibility'));
+const CompatibilityResult = lazy(() => import('./pages/saju/CompatibilityResult'));
 
 export const navLinks = [
     {
@@ -153,6 +158,15 @@ export const navLinks = [
         icon: <IconTarot />,
         accent: '#a78bfa',
     },
+    {
+        id: 'saju',
+        label: 'Saju',
+        path: '/saju',
+        subtitle: 'DESTINY',
+        description: '사주와 궁합으로 운명을 분석하는 동양 이학 랩',
+        icon: <IconSaju />,
+        accent: '#d4a574',
+    },
 ];
 
 export const appRoutes = [
@@ -240,4 +254,20 @@ export const appRoutes = [
         path: 'tarot/history',
         element: <TarotHistory />,
     },
+    {
+        path: 'saju',
+        element: <Saju />,
+    },
+    {
+        path: 'saju/result',
+        element: <SajuResult />,
+    },
+    {
+        path: 'saju/compatibility',
+        element: <Compatibility />,
+    },
+    {
+        path: 'saju/compatibility/result',
+        element: <CompatibilityResult />,
+    },
 ];