feat: add student learning report dashboard

apps/taro/src/pages/student/student.css

@@ -121,6 +121,10 @@
   background: #eff6ff;
 }
 
+.learning-report-panel {
+  background: #f8fbff;
+}
+
 .list-stack {
   display: flex;
   flex-direction: column;
@@ -139,6 +143,18 @@
   background: #eff6ff;
 }
 
+.split-row {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+}
+
+.split-row .row-main {
+  flex: 1;
+  min-width: 0;
+}
+
 .composite-subquestion {
   margin-top: 0;
 }
@@ -219,6 +235,10 @@
   background: #fff;
 }
 
+.compact-metric {
+  padding: 18px;
+}
+
 .metric-value {
   display: block;
   color: #0f172a;
@@ -233,6 +253,10 @@
   font-size: 22px;
 }
 
+.report-summary-line {
+  margin-top: 18px;
+}
+
 .empty-state {
   padding: 38px 26px;
   border: 1px dashed #cbd5e1;
@@ -308,6 +332,19 @@
   margin-top: 18px;
 }
 
+.compact-toolbar {
+  margin-top: 14px;
+  padding-bottom: 0;
+}
+
+.compact-toolbar .primary-button,
+.compact-toolbar .secondary-button {
+  min-width: 104px;
+  height: 56px;
+  font-size: 22px;
+  line-height: 56px;
+}
+
 .amount-row {
   display: flex;
   align-items: center;
@@ -337,11 +374,107 @@
   font-weight: 750;
 }
 
+.status-badge.warning {
+  background: #fffbeb;
+  color: #92400e;
+}
+
 .status-badge.danger {
   background: #fff1f2;
   color: #be123c;
 }
 
+.trend-chart {
+  display: grid;
+  grid-template-columns: repeat(14, minmax(0, 1fr));
+  gap: 10px;
+  align-items: end;
+  padding: 22px;
+  border: 1px solid #e2e8f0;
+  border-radius: 8px;
+  background: #fff;
+}
+
+.trend-column {
+  min-width: 0;
+  text-align: center;
+}
+
+.trend-value {
+  display: block;
+  min-height: 28px;
+  color: #334155;
+  font-size: 20px;
+  font-weight: 760;
+  line-height: 1.2;
+}
+
+.trend-bar-track {
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+  height: 136px;
+  margin-top: 8px;
+  border-radius: 8px;
+  background: #f1f5f9;
+}
+
+.trend-bar-fill {
+  width: 100%;
+  max-width: 28px;
+  border-radius: 8px 8px 0 0;
+  background: #2563eb;
+}
+
+.trend-bar-fill.h-bucket-0 { height: 0; }
+.trend-bar-fill.h-bucket-1 { height: 10px; }
+.trend-bar-fill.h-bucket-2 { height: 20px; }
+.trend-bar-fill.h-bucket-3 { height: 30px; }
+.trend-bar-fill.h-bucket-4 { height: 40px; }
+.trend-bar-fill.h-bucket-5 { height: 50px; }
+.trend-bar-fill.h-bucket-6 { height: 62px; }
+.trend-bar-fill.h-bucket-7 { height: 74px; }
+.trend-bar-fill.h-bucket-8 { height: 86px; }
+.trend-bar-fill.h-bucket-9 { height: 98px; }
+.trend-bar-fill.h-bucket-10 { height: 110px; }
+.trend-bar-fill.h-bucket-11 { height: 122px; }
+.trend-bar-fill.h-bucket-12 { height: 132px; }
+
+.trend-label {
+  display: block;
+  margin-top: 8px;
+  color: #64748b;
+  font-size: 18px;
+  line-height: 1.2;
+}
+
+.progress-track {
+  width: 100%;
+  height: 12px;
+  margin-top: 16px;
+  overflow: hidden;
+  border-radius: 999px;
+  background: #e2e8f0;
+}
+
+.progress-fill {
+  height: 100%;
+  border-radius: 999px;
+  background: #10b981;
+}
+
+.progress-fill.w-bucket-0 { width: 0; }
+.progress-fill.w-bucket-1 { width: 10%; }
+.progress-fill.w-bucket-2 { width: 20%; }
+.progress-fill.w-bucket-3 { width: 30%; }
+.progress-fill.w-bucket-4 { width: 40%; }
+.progress-fill.w-bucket-5 { width: 50%; }
+.progress-fill.w-bucket-6 { width: 60%; }
+.progress-fill.w-bucket-7 { width: 70%; }
+.progress-fill.w-bucket-8 { width: 80%; }
+.progress-fill.w-bucket-9 { width: 90%; }
+.progress-fill.w-bucket-10 { width: 100%; }
+
 .handbook-entry-body {
   margin-top: 14px;
 }