diff --git a/web-react/MIGRATION_MATRIX.md b/web-react/MIGRATION_MATRIX.md
index 2e54349..a5d9e0c 100644
--- a/web-react/MIGRATION_MATRIX.md
+++ b/web-react/MIGRATION_MATRIX.md
@@ -27,5 +27,9 @@
 | `/other-exams` | 其他考试 | Student | 最佳成绩、历次考试、通过/等级/分数制结果 | verification |
 | `/makeup-exams` | 补考安排 | Student | 已发布场次、补考原因、考场、座位和成绩 | verification |
 | `/evaluations` | 教学评价 | Student | 开放任务、动态评分维度、一次性提交 | verification |
+| `/academic-planning` | 学业规划与毕业模拟 | Student | 未来学期排课、下学期建议、先修冲突、负荷和毕业时间模拟 | verification |
+| `/physical-fitness` | 我的体质健康 | Student | 已发布学年、单项成绩、标准分、附加分和综合等级 | verification |
+| `/degree-awards` | 我的学位授予 | Student | 正式发布结论、绩点门槛、规则或人工复核说明 | verification |
+| `/graduation-clearance` | 我的毕业离校 | Student | 跨部门事项、必办标记、办结/豁免状态和整体进度 | verification |
 
 后续从 `web/src/router/index.ts` 逐条补全。只有关键合同和各状态验收完整后，状态才能更新为 `complete`。
diff --git a/web-react/README.md b/web-react/README.md
index 8f41605..c693b8c 100644
--- a/web-react/README.md
+++ b/web-react/README.md
@@ -37,6 +37,7 @@ npm.cmd run build
 - 迁移学生 `/my-curriculum` 培养方案进度、`/academic-overview` 学业排名趋势与 `/free-classrooms` 空闲教室查询。
 - 批量迁移学生校历、学籍异动、电子凭证、毕业审核和学费分项缴纳流程。
 - 迁移学生其他考试成绩、补考安排和教学评价提交闭环。
+- 迁移学生学业规划与毕业模拟、体质健康、学位授予和毕业离校进度。
 
 ## 迁移纪律
 
diff --git a/web-react/src/app/App.tsx b/web-react/src/app/App.tsx
index 2f8b89a..92e3c25 100644
--- a/web-react/src/app/App.tsx
+++ b/web-react/src/app/App.tsx
@@ -28,6 +28,10 @@ const AcademicCalendarPage = lazy(() => import('../pages/AcademicCalendarPage'))
 const OtherExamsPage = lazy(() => import('../pages/OtherExamsPage'))
 const MakeupExamsPage = lazy(() => import('../pages/MakeupExamsPage'))
 const EvaluationsPage = lazy(() => import('../pages/EvaluationsPage'))
+const AcademicPlanningPage = lazy(() => import('../pages/AcademicPlanningPage'))
+const PhysicalFitnessPage = lazy(() => import('../pages/PhysicalFitnessPage'))
+const DegreeAwardsPage = lazy(() => import('../pages/DegreeAwardsPage'))
+const GraduationClearancePage = lazy(() => import('../pages/GraduationClearancePage'))
 const SsoCallbackPage = lazy(() => import('../pages/SsoCallbackPage'))
 const SsoBindPage = lazy(() => import('../pages/SsoBindPage'))
 const AppShell = lazy(() => import('../layout/AppShell'))
@@ -90,6 +94,10 @@ function AppRoutes() {
           <Route path="/other-exams" element={<OtherExamsPage />} />
           <Route path="/makeup-exams" element={<MakeupExamsPage />} />
           <Route path="/evaluations" element={<EvaluationsPage />} />
+          <Route path="/academic-planning" element={<AcademicPlanningPage />} />
+          <Route path="/physical-fitness" element={<PhysicalFitnessPage />} />
+          <Route path="/degree-awards" element={<DegreeAwardsPage />} />
+          <Route path="/graduation-clearance" element={<GraduationClearancePage />} />
           <Route path="/" element={<Navigate to="/dashboard" replace />} />
         </Route>
         <Route path="*" element={<Navigate to="/dashboard" replace />} />
diff --git a/web-react/src/layout/AppShell.tsx b/web-react/src/layout/AppShell.tsx
index bc584af..6143cec 100644
--- a/web-react/src/layout/AppShell.tsx
+++ b/web-react/src/layout/AppShell.tsx
@@ -25,6 +25,10 @@ import {
   TrophyOutlined,
   SolutionOutlined,
   CommentOutlined,
+  RocketOutlined,
+  HeartOutlined,
+  SafetyCertificateOutlined as DegreeOutlined,
+  CheckCircleOutlined,
 } from '@ant-design/icons'
 import { Avatar, Badge, Button, Layout, Menu, Tag } from 'antd'
 import { useQuery } from '@tanstack/react-query'
@@ -80,6 +84,10 @@ export default function AppShell() {
       { key: '/other-exams', icon: <TrophyOutlined />, label: '其他考试' },
       { key: '/makeup-exams', icon: <SolutionOutlined />, label: '补考安排' },
       { key: '/evaluations', icon: <CommentOutlined />, label: '教学评价' },
+      { key: '/academic-planning', icon: <RocketOutlined />, label: '学业规划' },
+      { key: '/physical-fitness', icon: <HeartOutlined />, label: '体质健康' },
+      { key: '/degree-awards', icon: <DegreeOutlined />, label: '学位授予' },
+      { key: '/graduation-clearance', icon: <CheckCircleOutlined />, label: '毕业离校' },
       { key: '/warnings', icon: <WarningOutlined />, label: '学业预警' },
     ] : []),
     ...(user?.roles.includes('SuperAdmin')
diff --git a/web-react/src/pages/AcademicPlanningPage.tsx b/web-react/src/pages/AcademicPlanningPage.tsx
new file mode 100644
index 0000000..f977df1
--- /dev/null
+++ b/web-react/src/pages/AcademicPlanningPage.tsx
@@ -0,0 +1,37 @@
+import { DeleteOutlined, ExperimentOutlined, ReloadOutlined, ThunderboltOutlined } from '@ant-design/icons'
+import { Alert, App, Button, Empty, Progress, Select, Skeleton, Tag } from 'antd'
+import { useMutation, useQuery } from '@tanstack/react-query'
+import { useEffect, useMemo, useState } from 'react'
+import http, { apiErrorMessage } from '../api/http'
+import PageHeader from '../components/PageHeader'
+import './student-progress.css'
+
+interface PlanningCourse { courseId: string; courseCode: string; courseName: string; credits: number; recommendedSemester: number; type: string; moduleCode: string; moduleName: string; status: string; isSuggested: boolean; prerequisites: { courseName: string; isCompleted: boolean; isInProgress: boolean }[] }
+interface PlanningTerm { semester: number; label: string; isBeyondStandard: boolean }
+interface PlanningPayload { student: { studentNumber: string; name: string; enrollmentYear: number; majorName: string; collegeName: string }; plan: { name: string; version: string; totalCredits: number; nextSemester: number }; baseline: Projection; terms: PlanningTerm[]; courses: PlanningCourse[]; nextSemesterSuggestion: PlanningCourse[]; assumptions: string[] }
+interface Projection { earnedCredits: number; planCompletedCredits: number; creditGap: number; completionRate: number; requirementCount: number; passedRequirementCount: number; missingRequirements: string[]; graduationConclusion?: string; estimatedGraduationTerm?: string; isBeyondStandard?: boolean }
+interface Simulation { projected: Projection; conflicts: { courseId: string; message: string }[]; warnings: { message: string }[]; termSummaries: { semester: number; courseCount: number; credits: number }[] }
+
+export default function AcademicPlanningPage() {
+  const { message } = App.useApp()
+  const query = useQuery({ queryKey: ['academic-planning'], queryFn: async () => (await http.get<PlanningPayload>('/student/academic-planning')).data })
+  const [assignments, setAssignments] = useState<Record<string, number>>({})
+  const simulation = useMutation({ mutationFn: async (value: Record<string, number>) => (await http.post<Simulation>('/student/academic-planning/simulate', { terms: (query.data?.terms ?? []).map((term) => ({ semester: term.semester, courseIds: Object.entries(value).filter(([, semester]) => semester === term.semester).map(([courseId]) => courseId) })) })).data, onError: (error) => message.error(apiErrorMessage(error)) })
+  useEffect(() => { if (!query.data) return; const timer = window.setTimeout(() => simulation.mutate(assignments), 180); return () => window.clearTimeout(timer) }, [assignments, query.data])
+  const available = useMemo(() => (query.data?.courses ?? []).filter((course) => !['Completed', 'InProgress', 'Retaking'].includes(course.status)), [query.data])
+  const projected = simulation.data?.projected ?? query.data?.baseline
+  const conflictIds = new Set(simulation.data?.conflicts.map((item) => item.courseId) ?? [])
+  const assign = (courseId: string, semester?: number) => setAssignments((current) => { const next = { ...current }; if (semester) next[courseId] = semester; else delete next[courseId]; return next })
+  const applySuggestion = () => { if (!query.data) return; setAssignments((current) => ({ ...current, ...Object.fromEntries(query.data.nextSemesterSuggestion.map((course) => [course.courseId, query.data!.plan.nextSemester])) })); message.success('已采用下学期建议') }
+  if (query.isLoading) return <main className="page-container"><Skeleton active paragraph={{ rows: 12 }} /></main>
+  if (query.isError || !query.data) return <main className="page-container"><Alert type="error" showIcon message="学业规划无法加载" description={apiErrorMessage(query.error)} /></main>
+  return <main className="page-container progress-service-page">
+    <PageHeader kicker="DEGREE FLIGHT PLAN" title="学业规划与毕业模拟" description="把未完成课程排入未来学期，检查先修顺序、学期负荷和预计毕业时间。" aside={<div className="planning-actions"><Button icon={<ReloadOutlined />} onClick={() => { setAssignments({}); void query.refetch() }}>重置</Button><Button type="primary" icon={<ThunderboltOutlined />} disabled={!query.data.nextSemesterSuggestion.length} onClick={applySuggestion}>采用建议</Button></div>} />
+    <section className="planning-cockpit"><div><span>{query.data.student.enrollmentYear} 级 · {query.data.student.collegeName}</span><h2>{query.data.student.name}的毕业航线</h2><p>{query.data.student.studentNumber} · {query.data.student.majorName} · {query.data.plan.name} {query.data.plan.version}</p></div><div><Progress type="circle" percent={Math.round(projected?.completionRate ?? 0)} size={72} strokeColor="#54cfbd" /><span>预计毕业</span><strong>{projected?.estimatedGraduationTerm ?? '等待规划'}</strong></div></section>
+    <section className="planning-metrics"><article><span>预计获得学分</span><strong>{projected?.earnedCredits ?? 0} / {query.data.plan.totalCredits}</strong></article><article className={(projected?.creditGap ?? 0) > 0 ? 'warning' : ''}><span>毕业学分缺口</span><strong>{projected?.creditGap ?? 0}</strong></article><article><span>培养要求</span><strong>{projected?.passedRequirementCount ?? 0} / {projected?.requirementCount ?? 0}</strong></article><article><span>已规划课程</span><strong>{Object.keys(assignments).length}</strong></article></section>
+    {(simulation.data?.conflicts.length || simulation.data?.warnings.length) ? <Alert type="warning" showIcon message="规划需要调整" description={[...(simulation.data?.conflicts ?? []), ...(simulation.data?.warnings ?? [])].map((item) => item.message).join('；')} /> : null}
+    <section className="planning-board">{query.data.terms.map((term) => { const courses = available.filter((course) => assignments[course.courseId] === term.semester); const summary = simulation.data?.termSummaries.find((item) => item.semester === term.semester); return <article key={term.semester} className={term.isBeyondStandard ? 'beyond' : ''}><header><div><span>SEMESTER {term.semester}</span><h3>{term.label}</h3></div><Tag color={term.isBeyondStandard ? 'orange' : 'blue'}>{summary?.credits ?? 0} 学分</Tag></header><div>{courses.map((course) => <div key={course.courseId} className={conflictIds.has(course.courseId) ? 'conflict' : ''}><span>{course.courseCode}</span><strong>{course.courseName}</strong><small>{course.credits} 学分 · {course.moduleName}</small><Button type="text" danger icon={<DeleteOutlined />} aria-label={`移除${course.courseName}`} onClick={() => assign(course.courseId)} /></div>)}{!courses.length && <small className="term-empty">把下方课程安排到本学期</small>}</div></article>})}</section>
+    <section className="course-pool"><header><div><span>COURSE POOL</span><h2>待规划课程</h2></div><small>调整学期后会自动重新模拟</small></header><div>{available.map((course) => <article key={course.courseId}><div><span>{course.courseCode} · {course.moduleName}</span><h3>{course.courseName}</h3><p>{course.credits} 学分 · 建议第 {course.recommendedSemester} 学期{course.prerequisites.length ? ` · 先修 ${course.prerequisites.map((item) => item.courseName).join('、')}` : ''}</p></div>{course.isSuggested && <Tag color="cyan">下学期建议</Tag>}<Select allowClear placeholder="选择学期" value={assignments[course.courseId]} options={query.data.terms.map((term) => ({ value: term.semester, label: term.label }))} onChange={(value) => assign(course.courseId, value)} /></article>)}</div>{!available.length && <Empty description="培养方案课程均已完成或在读" />}</section>
+    <section className="assumption-strip"><ExperimentOutlined />{query.data.assumptions.map((item) => <span key={item}>{item}</span>)}</section>
+  </main>
+}
diff --git a/web-react/src/pages/DegreeAwardsPage.tsx b/web-react/src/pages/DegreeAwardsPage.tsx
new file mode 100644
index 0000000..8748b63
--- /dev/null
+++ b/web-react/src/pages/DegreeAwardsPage.tsx
@@ -0,0 +1,15 @@
+import { CheckCircleOutlined, SafetyCertificateOutlined } from '@ant-design/icons'
+import { Alert, Empty, Skeleton, Tag } from 'antd'
+import { useQuery } from '@tanstack/react-query'
+import http, { apiErrorMessage } from '../api/http'
+import PageHeader from '../components/PageHeader'
+import './student-progress.css'
+
+interface DegreeResult { id: string; batchName: string; graduationYear: number; degreeName: string; minimumGradePoint: number; studentNumber: string; name: string; majorName: string; averageGradePoint: number; conclusion: string; exceptionReason?: string; isOverridden: boolean; reviewComment?: string; publishedAt: string }
+export default function DegreeAwardsPage() {
+  const query = useQuery({ queryKey: ['degree-awards-my-result'], queryFn: async () => (await http.get<DegreeResult | null>('/degree-awards/my-result')).data })
+  if (query.isLoading) return <main className="page-container"><Skeleton active paragraph={{ rows: 8 }} /></main>
+  if (query.isError) return <main className="page-container"><Alert type="error" showIcon message="学位授予结果无法加载" description={apiErrorMessage(query.error)} /></main>
+  const result = query.data
+  return <main className="page-container progress-service-page"><PageHeader kicker="DEGREE CONFERRAL" title="我的学位授予结果" description="查看学校正式发布并锁定的学位授予结论。" />{result ? <section className={`degree-certificate ${result.conclusion === 'Granted' ? 'granted' : ''}`}><div className="degree-seal"><SafetyCertificateOutlined /><span>DEGREE CONFERRAL</span></div><div><span>{result.graduationYear} 届 · {result.batchName}</span><h2>{result.conclusion === 'Granted' ? '建议授予学位' : '暂不授予学位'}</h2><p>{result.name}（{result.studentNumber}）· {result.majorName}</p><dl><div><dt>学位名称</dt><dd>{result.degreeName}</dd></div><div><dt>平均绩点</dt><dd>{result.averageGradePoint}</dd></div><div><dt>最低要求</dt><dd>{result.minimumGradePoint}</dd></div></dl><footer><span>发布于 {new Date(result.publishedAt).toLocaleString('zh-CN')}</span><strong>{result.reviewComment || result.exceptionReason || '符合批次授予规则'}</strong>{result.isOverridden && <Tag color="purple">人工复核</Tag>}</footer></div><CheckCircleOutlined /></section> : <section className="progress-empty"><Empty description="学校尚未发布你的学位授予结果" /></section>}</main>
+}
diff --git a/web-react/src/pages/GraduationClearancePage.tsx b/web-react/src/pages/GraduationClearancePage.tsx
new file mode 100644
index 0000000..364af8a
--- /dev/null
+++ b/web-react/src/pages/GraduationClearancePage.tsx
@@ -0,0 +1,19 @@
+import { CheckOutlined, FieldTimeOutlined } from '@ant-design/icons'
+import { Alert, Empty, Progress, Skeleton, Tag } from 'antd'
+import { useQuery } from '@tanstack/react-query'
+import http, { apiErrorMessage } from '../api/http'
+import PageHeader from '../components/PageHeader'
+import './student-progress.css'
+
+interface ClearanceItem { id: string; itemName: string; responsibleUnit: string; isRequired: boolean; status: string; notes?: string; completedAt?: string }
+interface Clearance { id: string; name: string; graduationYear: number; status: string; notes?: string; closedAt?: string; items: ClearanceItem[] }
+const labels: Record<string, string> = { Pending: '待办理', Completed: '已完成', Waived: '已豁免' }
+export default function GraduationClearancePage() {
+  const query = useQuery({ queryKey: ['graduation-clearance-mine'], queryFn: async () => (await http.get<Clearance | null>('/graduation-clearance/my-clearance')).data })
+  if (query.isLoading) return <main className="page-container"><Skeleton active paragraph={{ rows: 9 }} /></main>
+  if (query.isError) return <main className="page-container"><Alert type="error" showIcon message="毕业离校清单无法加载" description={apiErrorMessage(query.error)} /></main>
+  const clearance = query.data
+  const completed = clearance?.items.filter((item) => item.status !== 'Pending').length ?? 0
+  const percent = clearance?.items.length ? Math.round(completed / clearance.items.length * 100) : 0
+  return <main className="page-container progress-service-page"><PageHeader kicker="GRADUATION CLEARANCE" title="我的毕业离校" description="查看图书、财务、宿舍和学院等责任部门的离校手续办理进度。" />{clearance ? <section className="clearance-pass"><header><div><span>LEAVING CAMPUS CHECKLIST</span><h2>{clearance.name}</h2><p>{clearance.graduationYear} 届 · {clearance.status === 'Closed' ? '离校手续已完成' : '离校手续办理中'}</p></div><div><Progress type="circle" size={64} percent={percent} strokeColor="#54cfbd" /><strong>{completed} / {clearance.items.length}</strong></div></header><div>{clearance.items.map((item, index) => <article key={item.id} className={item.status !== 'Pending' ? 'done' : ''}><i>{item.status !== 'Pending' ? <CheckOutlined /> : index + 1}</i><div><span>{item.responsibleUnit}</span><h3>{item.itemName}</h3><p>{item.notes || (item.isRequired ? '必办事项' : '非必办事项')}{item.completedAt ? ` · ${new Date(item.completedAt).toLocaleDateString('zh-CN')}` : ''}</p></div><Tag color={item.status === 'Completed' ? 'green' : item.status === 'Waived' ? 'blue' : 'gold'} icon={item.status === 'Pending' ? <FieldTimeOutlined /> : undefined}>{labels[item.status] ?? item.status}</Tag></article>)}</div>{clearance.notes && <footer>{clearance.notes}</footer>}</section> : <section className="progress-empty"><Empty description="暂未生成你的毕业离校办理清单" /></section>}</main>
+}
diff --git a/web-react/src/pages/PhysicalFitnessPage.tsx b/web-react/src/pages/PhysicalFitnessPage.tsx
new file mode 100644
index 0000000..57c3cf6
--- /dev/null
+++ b/web-react/src/pages/PhysicalFitnessPage.tsx
@@ -0,0 +1,21 @@
+import { HeartOutlined } from '@ant-design/icons'
+import { Alert, Empty, Progress, Skeleton, Tag } from 'antd'
+import { useQuery } from '@tanstack/react-query'
+import http, { apiErrorMessage } from '../api/http'
+import PageHeader from '../components/PageHeader'
+import './student-progress.css'
+
+interface FitnessItem { itemCode: string | number; value: number; unit: string; score?: number; weightedScore?: number }
+interface FitnessRecord { id: string; batchName: string; academicYear: string; testDate: string; standardVersion: string; status: string | number; specialReason?: string; standardScore?: number; bonusScore?: number; totalScore?: number; grade?: string | number; notes?: string; items: FitnessItem[] }
+const itemLabels: Record<string, string> = { '3': 'BMI', Bmi: 'BMI', '4': '肺活量', VitalCapacity: '肺活量', '5': '50 米跑', Sprint50M: '50 米跑', '6': '坐位体前屈', SitAndReach: '坐位体前屈', '7': '立定跳远', StandingLongJump: '立定跳远', '8': '力量项目', Strength: '力量项目', '9': '耐力跑', EnduranceRun: '耐力跑' }
+const statusLabels: Record<string, string> = { '1': '正常', Normal: '正常', '2': '缺测', Missing: '缺测', '3': '缓测', Deferred: '缓测', '4': '免测', Exempt: '免测' }
+const gradeLabels: Record<string, string> = { '1': '不及格', Fail: '不及格', '2': '及格', Pass: '及格', '3': '良好', Good: '良好', '4': '优秀', Excellent: '优秀' }
+const score = (value?: number) => value == null ? '—' : Number(value).toFixed(1)
+const duration = (value: number) => `${Math.floor(value / 60)}′${String(Math.round(value) % 60).padStart(2, '0')}″`
+
+export default function PhysicalFitnessPage() {
+  const query = useQuery({ queryKey: ['physical-fitness-mine'], queryFn: async () => (await http.get<{ records: FitnessRecord[] }>('/physical-fitness/mine')).data.records })
+  if (query.isLoading) return <main className="page-container"><Skeleton active paragraph={{ rows: 10 }} /></main>
+  if (query.isError) return <main className="page-container"><Alert type="error" showIcon message="体测结果无法加载" description={apiErrorMessage(query.error)} /></main>
+  return <main className="page-container progress-service-page"><PageHeader kicker="PHYSICAL HEALTH" title="我的体质健康" description="按学年查看已发布体测结果、单项得分和综合等级。" aside={<div className="fitness-aside"><HeartOutlined /><strong>{query.data?.length ?? 0}</strong><span>个已发布学年</span></div>} /><section className="fitness-list">{query.data?.map((record) => { const normal = ['1', 'Normal'].includes(String(record.status)); return <article key={record.id}><header><div><span>{record.academicYear} · {record.testDate}</span><h2>{record.batchName}</h2><p>{record.standardVersion}</p></div>{normal ? <div className="fitness-score"><Progress type="circle" size={68} percent={Math.min(100, Math.round(record.totalScore ?? 0))} format={() => score(record.totalScore)} /><Tag color={(record.totalScore ?? 0) >= 80 ? 'green' : (record.totalScore ?? 0) >= 60 ? 'blue' : 'red'}>{gradeLabels[String(record.grade)] ?? '待评定'}</Tag></div> : <Tag color="orange">{statusLabels[String(record.status)] ?? String(record.status)}</Tag>}</header>{record.specialReason && <Alert type="info" showIcon message={record.specialReason} />}{normal && <div className="fitness-metrics">{record.items.filter((item) => Number(item.itemCode) >= 3 || itemLabels[String(item.itemCode)]).map((item) => <div key={String(item.itemCode)}><span>{itemLabels[String(item.itemCode)] ?? String(item.itemCode)}</span><strong>{Number(item.itemCode) === 9 || item.itemCode === 'EnduranceRun' ? duration(item.value) : `${item.value} ${item.unit}`}</strong><small>单项 {score(item.score)} · 折算 {score(item.weightedScore)}</small></div>)}</div>}<footer>标准分 {score(record.standardScore)} + 附加分 {score(record.bonusScore)}{record.notes ? ` · ${record.notes}` : ''}</footer></article>})}{!query.data?.length && <Empty description="暂无已发布的体测结果" />}</section></main>
+}
diff --git a/web-react/src/pages/student-progress.css b/web-react/src/pages/student-progress.css
new file mode 100644
index 0000000..3c4ce05
--- /dev/null
+++ b/web-react/src/pages/student-progress.css
@@ -0,0 +1,4 @@
+.progress-service-page{gap:16px}.planning-actions{display:flex;gap:8px}.planning-cockpit{min-height:150px;padding:23px 26px;display:flex;align-items:center;justify-content:space-between;gap:28px;color:white;background:linear-gradient(110deg,#162858,#284583 70%,#176b6c)}.planning-cockpit>div:first-child span{color:var(--teal-bright);font:700 9px var(--font-data)}.planning-cockpit h2{margin:8px 0 5px;color:white;font:600 22px var(--font-display)}.planning-cockpit p{margin:0;color:#c6d1e3;font-size:9px}.planning-cockpit>div:last-child{display:grid;grid-template-columns:auto 150px;grid-template-rows:1fr 1fr;column-gap:15px;align-items:end}.planning-cockpit .ant-progress{grid-row:1/3}.planning-cockpit>div:last-child span{color:#b9c7da;font-size:9px}.planning-cockpit>div:last-child strong{align-self:start;font-size:13px}.planning-metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:white}.planning-metrics article{padding:15px 18px;border-right:1px solid var(--line)}.planning-metrics span,.planning-metrics strong{display:block}.planning-metrics span{color:var(--ink-muted);font-size:9px}.planning-metrics strong{margin-top:7px;color:var(--brand-deep);font:700 18px var(--font-data)}.planning-metrics .warning strong{color:#a85d13}.planning-board{display:flex;gap:12px;overflow-x:auto;padding-bottom:5px}.planning-board>article{min-width:255px;flex:1;border:1px solid var(--line);background:white}.planning-board>article.beyond{border-top-color:var(--amber)}.planning-board>article>header{padding:13px 15px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.planning-board header span,.course-pool header span{color:var(--teal);font:700 8px var(--font-data)}.planning-board h3,.course-pool h2{margin:4px 0 0;color:var(--brand-deep);font-size:13px}.planning-board>article>div{padding:9px;display:grid;gap:7px}.planning-board article article{}.planning-board>article>div>div{position:relative;padding:10px 34px 10px 11px;background:#f5f8fb;border-left:3px solid var(--teal)}.planning-board>article>div>div.conflict{background:#fff5f2;border-color:var(--red)}.planning-board>article>div span,.planning-board>article>div strong,.planning-board>article>div small{display:block}.planning-board>article>div span{color:var(--teal);font:8px var(--font-data)}.planning-board>article>div strong{margin:3px 0;font-size:10px}.planning-board>article>div small{color:var(--ink-muted);font-size:8px}.planning-board>article>div .ant-btn{position:absolute;right:2px;top:6px}.term-empty{padding:22px 8px;text-align:center}.course-pool{border:1px solid var(--line);background:white}.course-pool>header{padding:15px 18px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.course-pool>header>small{color:var(--ink-muted);font-size:9px}.course-pool>div{display:grid;grid-template-columns:repeat(2,1fr)}.course-pool article{padding:14px 17px;display:grid;grid-template-columns:1fr auto 150px;gap:10px;align-items:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.course-pool article span{color:var(--teal);font:8px var(--font-data)}.course-pool article h3{margin:4px 0;color:var(--ink);font-size:11px}.course-pool article p{margin:0;color:var(--ink-muted);font-size:8px}.assumption-strip{padding:13px 17px;display:flex;gap:15px;align-items:center;background:#edf2f7;color:var(--ink-muted);font-size:8px}.assumption-strip>.anticon{color:var(--teal);font-size:18px}.fitness-aside{padding:10px 14px;display:grid;grid-template-columns:auto auto;align-items:center;gap:0 10px;border-left:3px solid #c63f63;background:#fff0f3}.fitness-aside>.anticon{grid-row:1/3;color:#c63f63;font-size:24px}.fitness-aside strong{color:#82203b;font:700 19px var(--font-data)}.fitness-aside span{color:#925268;font-size:8px}.fitness-list{display:grid;gap:15px}.fitness-list>article{border:1px solid var(--line);background:white}.fitness-list>article>header{padding:19px 21px;display:flex;justify-content:space-between}.fitness-list header span{color:var(--teal);font:700 9px var(--font-data)}.fitness-list h2{margin:6px 0 3px;color:var(--brand-deep);font-size:16px}.fitness-list p{margin:0;color:var(--ink-muted);font-size:9px}.fitness-score{display:flex;align-items:center;gap:9px}.fitness-metrics{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.fitness-metrics div{padding:14px 17px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.fitness-metrics span,.fitness-metrics strong,.fitness-metrics small{display:block}.fitness-metrics span{color:var(--ink-muted);font-size:8px}.fitness-metrics strong{margin:6px 0 3px;color:var(--brand-deep);font:700 14px var(--font-data)}.fitness-metrics small{color:var(--ink-muted);font-size:8px}.fitness-list footer{padding:10px 19px;color:var(--ink-muted);background:#f7f9fb;font-size:8px}.degree-certificate{min-height:330px;padding:34px;display:grid;grid-template-columns:120px 1fr auto;gap:30px;align-items:center;color:white;background:linear-gradient(120deg,#343944,#182033)}.degree-certificate.granted{background:linear-gradient(120deg,#153e44,#087f73)}.degree-seal{width:110px;height:110px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.38);border-radius:50%}.degree-seal>.anticon{font-size:38px}.degree-seal span{font:700 7px var(--font-data);letter-spacing:.11em}.degree-certificate>div:nth-child(2)>span{color:var(--teal-bright);font:700 9px var(--font-data)}.degree-certificate h2{margin:9px 0;color:white;font:600 25px var(--font-display)}.degree-certificate p{color:#d2dbe5;font-size:10px}.degree-certificate dl{max-width:560px;margin:22px 0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2)}.degree-certificate dl div{padding:12px}.degree-certificate dt{color:#bdd0d3;font-size:8px}.degree-certificate dd{margin:5px 0 0;font:700 13px var(--font-data)}.degree-certificate footer{display:flex;gap:13px;align-items:center;color:#d2dbe5;font-size:8px}.degree-certificate>svg{font-size:45px;color:var(--teal-bright)}.progress-empty{min-height:320px;display:grid;place-items:center;border:1px solid var(--line);background:white}.clearance-pass{border:1px solid var(--line);background:white}.clearance-pass>header{padding:22px 24px;display:flex;justify-content:space-between;align-items:center;color:white;background:var(--brand-deep)}.clearance-pass header span{color:var(--teal-bright);font:700 9px var(--font-data)}.clearance-pass h2{margin:6px 0;color:white;font-size:18px}.clearance-pass header p{margin:0;color:#bdc9dc;font-size:9px}.clearance-pass header>div:last-child{display:flex;align-items:center;gap:10px}.clearance-pass header>div:last-child strong{font:700 14px var(--font-data)}.clearance-pass>div>article{padding:16px 20px;display:grid;grid-template-columns:34px 1fr auto;gap:14px;align-items:center;border-bottom:1px solid var(--line)}.clearance-pass article>i{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--ink-muted);font-style:normal}.clearance-pass article.done>i{border-color:var(--teal);background:#e9f6f3;color:var(--teal)}.clearance-pass article span{color:var(--teal);font:8px var(--font-data)}.clearance-pass h3{margin:4px 0;color:var(--ink);font-size:11px}.clearance-pass article p{margin:0;color:var(--ink-muted);font-size:8px}.clearance-pass>footer{padding:13px 20px;background:#f7f9fb;color:var(--ink-muted);font-size:9px}
+.planning-board>article>div>div.conflict{border-color:var(--danger)}
+@media(max-width:900px){.course-pool>div{grid-template-columns:1fr}.fitness-metrics{grid-template-columns:repeat(2,1fr)}.degree-certificate{grid-template-columns:100px 1fr}.degree-certificate>svg{display:none}.assumption-strip{align-items:flex-start;flex-direction:column}.planning-metrics{grid-template-columns:repeat(2,1fr)}}
+@media(max-width:600px){.planning-cockpit{align-items:flex-start;flex-direction:column}.planning-cockpit>div:last-child{grid-template-columns:auto 1fr}.course-pool article{grid-template-columns:1fr auto}.course-pool article .ant-select{grid-column:1/-1;width:100%}.fitness-metrics{grid-template-columns:1fr}.degree-certificate{padding:24px;grid-template-columns:1fr}.degree-seal{width:85px;height:85px}.degree-certificate dl{grid-template-columns:1fr}.degree-certificate footer{align-items:flex-start;flex-direction:column}.clearance-pass>header{align-items:flex-start;gap:15px}.clearance-pass>div>article{grid-template-columns:30px 1fr}.clearance-pass article>.ant-tag{grid-column:2}}