Migrate saju service UI

src/pages/saju/Today.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useSearchParams, Link } from 'react-router-dom';
+import { useSearchParams } from 'react-router-dom';
 import './_shell/tokens.css';
 import './_shell/shell.css';
 import useViewportMode from './_shell/useViewportMode';
@@ -8,10 +8,10 @@ import BottomNav from './_shell/BottomNav';
 import DesktopHeader from './_shell/DesktopHeader';
 import Mascot from './_shell/Mascot';
 import MascotBubble from './_shell/MascotBubble';
-import PrimaryButton from './_shell/PrimaryButton';
 import GhostButton from './_shell/GhostButton';
 import TodayMobile from './views/today.mobile.jsx';
 import TodayDesktop from './views/today.desktop.jsx';
+import sampleReading from './sampleReading';
 
 export default function Today() {
   const mode = useViewportMode();
@@ -23,7 +23,10 @@ export default function Today() {
   return (
     <div className="saju-v2">
       {mode === 'desktop' && <DesktopHeader />}
-      {!rid && <EmptyState />}
+      {!rid && (mode === 'desktop'
+        ? <TodayDesktop reading={sampleReading} />
+        : <TodayMobile reading={sampleReading} />
+      )}
       {rid && loading && <LoadingState />}
       {rid && error && <ErrorState />}
       {rid && data && (mode === 'desktop'
@@ -35,20 +38,6 @@ export default function Today() {
   );
 }
 
-function EmptyState() {
-  return (
-    <main className="page paper-bg screen-in" style={{ padding: '40px 24px', textAlign: 'center' }}>
-      <Mascot variant="greeting" size={160} style={{ margin: '0 auto 16px' }} />
-      <MascotBubble tone="ivory" tail={false}
-        text="사주를 먼저 입력해주세요."
-        style={{ margin: '0 auto 24px' }} />
-      <Link to="/saju" style={{ display: 'inline-block' }}>
-        <PrimaryButton color="#D4AF37" full={false}>사주 입력하러 가기</PrimaryButton>
-      </Link>
-    </main>
-  );
-}
-
 function LoadingState() {
   return (
     <main className="page paper-bg screen-in" style={{ padding: '60px 24px', textAlign: 'center' }}>