feat: extract secrets to .env, remove hardcoded credentials

- Backend: .env file for DB/JWT/Redis/MinIO config, appsettings.json cleared
- Backend: Program.cs loads .env at startup (no extra NuGet packages)
- Frontend: .env files for VITE_API_URL, api-clients use import.meta.env
- Added vite-env.d.ts type declarations for both frontends
- All hardcoded localhost:5000 replaced with env variable
- Added .env.example template for onboarding

frontend-doctor/src/pages/reports/ReportDetailPage.tsx

@@ -56,50 +56,54 @@ export function ReportDetailPage() {
     finally { setSubmitting(false); }
   };
 
-  if (!report) return <div style={{ padding: 24 }}>加载中...</div>;
+  if (!report) return <div style={{ padding: 28, color: '#9BA0B4' }}>加载中...</div>;
 
   const isCompleted = report.status === 'completed';
   const riskMap: Record<string, { text: string; color: string }> = {
-    normal: { text: '正常', color: '#2e7d32' },
-    attention: { text: '关注', color: '#f57c00' },
-    abnormal: { text: '异常', color: '#c62828' },
+    normal: { text: '正常', color: '#20C997' },
+    attention: { text: '关注', color: '#F59E0B' },
+    abnormal: { text: '异常', color: '#EF4444' },
+  };
+
+  const inputStyle: React.CSSProperties = {
+    width: '100%', padding: '10px 14px', border: '1.5px solid #E1E5ED',
+    borderRadius: 10, fontSize: 13, outline: 'none', boxSizing: 'border-box', fontFamily: 'inherit',
   };
 
   return (
-    <div style={{ padding: 24 }}>
-      <Link to="/reports" style={{ fontSize: 13, color: '#1976d2' }}>← 返回报告列表</Link>
+    <div style={{ padding: 28 }}>
+      <Link to="/reports" style={{ fontSize: 13, color: '#4F6EF7', fontWeight: 500 }}>← 返回报告列表</Link>
 
-      <div style={{ background: '#fff', marginTop: 16, padding: 24, borderRadius: 8, boxShadow: '0 1px 4px rgba(0,0,0,0.08)' }}>
+      <div style={{ background: '#fff', marginTop: 16, padding: 28, borderRadius: 16, boxShadow: '0 2px 12px rgba(0,0,0,0.04)' }}>
         <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
           <div>
-            <h2 style={{ margin: 0 }}>{report.title}</h2>
-            <div style={{ marginTop: 8, fontSize: 13, color: '#888' }}>
+            <h2 style={{ margin: 0, fontSize: 20, fontWeight: 700 }}>{report.title}</h2>
+            <div style={{ marginTop: 8, fontSize: 13, color: '#9BA0B4' }}>
               患者：{report.patientName || '未知'} &nbsp;|&nbsp;
               分类：{categoryMap[report.category] || report.category} &nbsp;|&nbsp;
               日期：{report.createdAt?.split('T')[0]}
             </div>
           </div>
           <span style={{
-            padding: '4px 12px', borderRadius: 12, fontSize: 12, fontWeight: 500,
-            background: isCompleted ? '#e8f5e9' : '#fff3e0',
-            color: isCompleted ? '#2e7d32' : '#f57c00',
+            padding: '6px 14px', borderRadius: 12, fontSize: 12, fontWeight: 600,
+            background: isCompleted ? '#E6F9F2' : '#FFF8E6',
+            color: isCompleted ? '#20C997' : '#F59E0B',
           }}>
             {isCompleted ? '已完成' : '待审核'}
           </span>
         </div>
 
-        {/* 图片 */}
         {report.imageUrls && report.imageUrls.length > 0 && (
-          <div style={{ marginTop: 20 }}>
-            <h4 style={{ fontSize: 14, marginBottom: 8 }}>上传图片（{report.imageUrls.length}张）</h4>
+          <div style={{ marginTop: 24 }}>
+            <h4 style={{ fontSize: 14, fontWeight: 600, marginBottom: 10, color: '#5A6072' }}>上传图片（{report.imageUrls.length}张）</h4>
             <div style={{ display: 'flex', gap: 10, flexWrap: 'wrap' }}>
               {report.imageUrls.map((url, i) => (
                 <div key={i} onClick={() => setLightbox(url)} style={{
-                  width: 120, height: 120, borderRadius: 8, overflow: 'hidden',
-                  cursor: 'pointer', border: '2px solid #eee', background: '#f5f5f5',
+                  width: 120, height: 120, borderRadius: 12, overflow: 'hidden',
+                  cursor: 'pointer', border: '2px solid #F0F2F5', background: '#F9FAFC',
                   display: 'flex', alignItems: 'center', justifyContent: 'center',
                 }}>
-                  <img src={`http://localhost:5000${url}`} alt={`图片${i}`}
+                  <img src={`${import.meta.env.VITE_API_URL}${url}`} alt={`图片${i}`}
                     style={{ maxWidth: '100%', maxHeight: '100%', objectFit: 'cover' }}
                     onError={(e) => { (e.target as HTMLImageElement).style.display = 'none'; }} />
                 </div>
@@ -108,37 +112,35 @@ export function ReportDetailPage() {
           </div>
         )}
 
-        {/* 灯箱 */}
         {lightbox && (
           <div onClick={() => setLightbox(null)} style={{
             position: 'fixed', inset: 0, background: 'rgba(0,0,0,0.85)',
             display: 'flex', alignItems: 'center', justifyContent: 'center', zIndex: 999, cursor: 'pointer',
           }}>
-            <img src={`http://localhost:5000${lightbox}`} alt="预览" style={{ maxWidth: '90vw', maxHeight: '90vh', borderRadius: 8 }} />
+            <img src={`${import.meta.env.VITE_API_URL}${lightbox}`} alt="预览" style={{ maxWidth: '90vw', maxHeight: '90vh', borderRadius: 12 }} />
           </div>
         )}
 
-        {/* 已完成解读 */}
         {isCompleted && (
-          <div style={{ marginTop: 20, padding: 16, background: '#e8f5e9', borderRadius: 8 }}>
-            <h4 style={{ fontSize: 14, marginBottom: 8 }}>解读结果</h4>
-            <div style={{ fontSize: 13 }}>
-              <p><strong>风险等级：</strong>
+          <div style={{ marginTop: 24, padding: 20, background: '#E6F9F2', borderRadius: 12 }}>
+            <h4 style={{ fontSize: 15, fontWeight: 600, marginBottom: 12, color: '#20C997' }}>解读结果</h4>
+            <div style={{ fontSize: 13, color: '#5A6072' }}>
+              <p style={{ margin: '6px 0' }}><strong style={{ color: '#1A1D28' }}>风险等级：</strong>
                 <span style={{ color: riskMap[report.riskLevel || '']?.color, fontWeight: 600 }}>
                   {riskMap[report.riskLevel || '']?.text || report.riskLevel || '-'}
                 </span>
               </p>
-              <p><strong>总结：</strong>{report.summary || '-'}</p>
-              {report.suggestions && <p><strong>建议：</strong>{report.suggestions}</p>}
+              <p style={{ margin: '6px 0' }}><strong style={{ color: '#1A1D28' }}>总结：</strong>{report.summary || '-'}</p>
+              {report.suggestions && <p style={{ margin: '6px 0' }}><strong style={{ color: '#1A1D28' }}>建议：</strong>{report.suggestions}</p>}
             </div>
 
             {report.items && report.items.length > 0 && (
-              <table style={{ width: '100%', marginTop: 12, borderCollapse: 'collapse', fontSize: 12 }}>
+              <table style={{ width: '100%', marginTop: 14, borderCollapse: 'collapse', fontSize: 12 }}>
                 <thead><tr style={{ textAlign: 'left', borderBottom: '2px solid #c8e6c9' }}>
-                  <th style={{ padding: '6px 8px' }}>检查项目</th>
-                  <th style={{ padding: '6px 8px' }}>结果</th>
-                  <th style={{ padding: '6px 8px' }}>参考范围</th>
-                  <th style={{ padding: '6px 8px' }}>是否异常</th>
+                  <th style={{ padding: '6px 8px', color: '#5A6072' }}>检查项目</th>
+                  <th style={{ padding: '6px 8px', color: '#5A6072' }}>结果</th>
+                  <th style={{ padding: '6px 8px', color: '#5A6072' }}>参考范围</th>
+                  <th style={{ padding: '6px 8px', color: '#5A6072' }}>是否异常</th>
                 </tr></thead>
                 <tbody>
                   {report.items.map((item) => (
@@ -146,7 +148,7 @@ export function ReportDetailPage() {
                       <td style={{ padding: '6px 8px' }}>{item.itemName}</td>
                       <td style={{ padding: '6px 8px' }}>{item.resultValue} {item.unit || ''}</td>
                       <td style={{ padding: '6px 8px' }}>{item.referenceRange || '-'}</td>
-                      <td style={{ padding: '6px 8px', color: item.isAbnormal ? '#c62828' : '#2e7d32', fontWeight: 500 }}>
+                      <td style={{ padding: '6px 8px', color: item.isAbnormal ? '#EF4444' : '#20C997', fontWeight: 600 }}>
                         {item.isAbnormal ? '是' : '否'}
                       </td>
                     </tr>
@@ -157,68 +159,66 @@ export function ReportDetailPage() {
           </div>
         )}
 
-        {/* 解读表单 */}
         {!isCompleted && (
-          <div style={{ marginTop: 24, borderTop: '1px solid #eee', paddingTop: 20 }}>
-            <h3 style={{ fontSize: 15, marginBottom: 16 }}>医生解读</h3>
+          <div style={{ marginTop: 28, borderTop: '1px solid #F0F2F5', paddingTop: 24 }}>
+            <h3 style={{ fontSize: 16, fontWeight: 600, marginBottom: 18, color: '#1A1D28' }}>医生解读</h3>
 
-            <div style={{ marginBottom: 12 }}>
-              <label style={{ display: 'block', fontSize: 13, fontWeight: 500, marginBottom: 4 }}>解读总结</label>
+            <div style={{ marginBottom: 14 }}>
+              <label style={{ display: 'block', fontSize: 13, fontWeight: 500, color: '#5A6072', marginBottom: 5 }}>解读总结</label>
               <textarea value={summary} onChange={(e) => setSummary(e.target.value)}
                 placeholder="请输入您的专业解读总结..."
                 rows={4}
-                style={{ width: '100%', padding: '10px 12px', border: '1px solid #ddd', borderRadius: 6, fontSize: 13, resize: 'vertical', fontFamily: 'inherit', boxSizing: 'border-box' }} />
+                style={{ ...inputStyle, resize: 'vertical' }} />
             </div>
 
-            <div style={{ display: 'flex', gap: 16, marginBottom: 12 }}>
+            <div style={{ display: 'flex', gap: 16, marginBottom: 14 }}>
               <div style={{ flex: 1 }}>
-                <label style={{ display: 'block', fontSize: 13, fontWeight: 500, marginBottom: 4 }}>风险等级</label>
-                <select value={riskLevel} onChange={(e) => setRiskLevel(e.target.value)}
-                  style={{ width: '100%', padding: '8px 12px', border: '1px solid #ddd', borderRadius: 6, fontSize: 13, fontFamily: 'inherit' }}>
+                <label style={{ display: 'block', fontSize: 13, fontWeight: 500, color: '#5A6072', marginBottom: 5 }}>风险等级</label>
+                <select value={riskLevel} onChange={(e) => setRiskLevel(e.target.value)} style={inputStyle}>
                   <option value="normal">正常</option>
                   <option value="attention">需关注</option>
                   <option value="abnormal">异常</option>
                 </select>
               </div>
               <div style={{ flex: 1 }}>
-                <label style={{ display: 'block', fontSize: 13, fontWeight: 500, marginBottom: 4 }}>医生建议</label>
+                <label style={{ display: 'block', fontSize: 13, fontWeight: 500, color: '#5A6072', marginBottom: 5 }}>医生建议</label>
                 <input value={suggestions} onChange={(e) => setSuggestions(e.target.value)}
                   placeholder="如：继续当前用药方案"
-                  style={{ width: '100%', padding: '8px 12px', border: '1px solid #ddd', borderRadius: 6, fontSize: 13, fontFamily: 'inherit', boxSizing: 'border-box' }} />
+                  style={inputStyle} />
               </div>
             </div>
 
-            <div style={{ marginBottom: 12 }}>
-              <label style={{ display: 'block', fontSize: 13, fontWeight: 500, marginBottom: 6 }}>检查项目</label>
+            <div style={{ marginBottom: 14 }}>
+              <label style={{ display: 'block', fontSize: 13, fontWeight: 500, color: '#5A6072', marginBottom: 8 }}>检查项目</label>
               {items.map((item, i) => (
-                <div key={i} style={{ display: 'flex', gap: 8, marginBottom: 6, alignItems: 'center' }}>
+                <div key={i} style={{ display: 'flex', gap: 8, marginBottom: 8, alignItems: 'center' }}>
                   <input placeholder="项目名称" value={item.itemName} onChange={(e) => updateItem(i, 'itemName', e.target.value)}
-                    style={{ flex: 2, padding: '6px 10px', border: '1px solid #ddd', borderRadius: 4, fontSize: 12, fontFamily: 'inherit' }} />
+                    style={{ flex: 2, padding: '8px 12px', border: '1.5px solid #E1E5ED', borderRadius: 8, fontSize: 12, outline: 'none' }} />
                   <input placeholder="结果" value={item.resultValue} onChange={(e) => updateItem(i, 'resultValue', e.target.value)}
-                    style={{ flex: 1, padding: '6px 10px', border: '1px solid #ddd', borderRadius: 4, fontSize: 12, fontFamily: 'inherit' }} />
+                    style={{ flex: 1, padding: '8px 12px', border: '1.5px solid #E1E5ED', borderRadius: 8, fontSize: 12, outline: 'none' }} />
                   <input placeholder="单位" value={item.unit} onChange={(e) => updateItem(i, 'unit', e.target.value)}
-                    style={{ width: 70, padding: '6px 10px', border: '1px solid #ddd', borderRadius: 4, fontSize: 12, fontFamily: 'inherit' }} />
+                    style={{ width: 70, padding: '8px 12px', border: '1.5px solid #E1E5ED', borderRadius: 8, fontSize: 12, outline: 'none' }} />
                   <input placeholder="参考范围" value={item.referenceRange} onChange={(e) => updateItem(i, 'referenceRange', e.target.value)}
-                    style={{ flex: 1, padding: '6px 10px', border: '1px solid #ddd', borderRadius: 4, fontSize: 12, fontFamily: 'inherit' }} />
-                  <label style={{ fontSize: 12, whiteSpace: 'nowrap', display: 'flex', alignItems: 'center', gap: 3 }}>
+                    style={{ flex: 1, padding: '8px 12px', border: '1.5px solid #E1E5ED', borderRadius: 8, fontSize: 12, outline: 'none' }} />
+                  <label style={{ fontSize: 12, whiteSpace: 'nowrap', display: 'flex', alignItems: 'center', gap: 4, color: '#5A6072' }}>
                     <input type="checkbox" checked={item.isAbnormal} onChange={(e) => updateItem(i, 'isAbnormal', e.target.checked)} />
                     异常
                   </label>
                   <button onClick={() => removeItem(i)}
-                    style={{ background: 'none', border: 'none', color: '#c62828', cursor: 'pointer', fontSize: 16 }}
-                    disabled={items.length <= 1}>✕</button>
+                    style={{ background: 'none', border: 'none', color: '#EF4444', cursor: 'pointer', fontSize: 18, fontWeight: 700 }}
+                    disabled={items.length <= 1}>×</button>
                 </div>
               ))}
               <button onClick={addItem} style={{
-                padding: '4px 12px', border: '1px dashed #1976d2', borderRadius: 4,
-                background: 'none', color: '#1976d2', cursor: 'pointer', fontSize: 12,
+                padding: '6px 14px', border: '1.5px dashed #4F6EF7', borderRadius: 8,
+                background: 'none', color: '#4F6EF7', cursor: 'pointer', fontSize: 12, fontWeight: 500,
               }}>+ 添加项目</button>
             </div>
 
             <button onClick={handleInterpret} disabled={submitting} style={{
-              padding: '10px 28px', background: '#1976d2', color: '#fff',
-              border: 'none', borderRadius: 6, fontSize: 14, cursor: 'pointer',
-              opacity: submitting ? 0.7 : 1, marginTop: 8,
+              padding: '11px 32px', background: 'linear-gradient(135deg, #4F6EF7 0%, #6C8AFF 100%)', color: '#fff',
+              border: 'none', borderRadius: 10, fontSize: 14, cursor: 'pointer', fontWeight: 600,
+              opacity: submitting ? 0.7 : 1, marginTop: 8, boxShadow: '0 4px 16px rgba(79,110,247,0.25)',
             }}>
               {submitting ? '提交中...' : '提交解读'}
             </button>