:root { color-scheme: light; }
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: "PingFang SC","Microsoft YaHei",-apple-system,sans-serif; background:#f6f8fb; color:#1f2937; padding:24px; line-height:1.6; }
.wrap { max-width: 1100px; margin: 0 auto; }
header { margin-bottom: 20px; }
h1 { font-size: 22px; color:#1F4E79; }
.sub { color:#6b7280; font-size: 13px; margin-top: 4px; }
.badge { display:inline-block; background:#dcfce7; color:#15803d; padding:2px 8px; border-radius:4px; font-size:11px; margin-left:8px; }
.badge.warn { background:#fef3c7; color:#92400e; }
.badge.err { background:#fee2e2; color:#b91c1c; }
.customer-profile-card { background:#fff; border:1px solid #bcd3ea; border-left:4px solid #2E75B6; border-radius:10px; padding:14px 16px; margin:0 0 16px; box-shadow:0 1px 2px rgba(0,0,0,0.03); }
.customer-profile-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:8px; }
.customer-profile-head h2 { font-size:15px; color:#1F4E79; margin:0; }
.customer-profile-head span { font-size:12px; color:#6b7280; }
.customer-profile-card textarea { width:100%; min-height:88px; padding:9px 10px; border:1px solid #d1d5db; border-radius:6px; font-size:13px; line-height:1.6; resize:vertical; font-family:inherit; background:#fbfdff; }
.customer-profile-card textarea:focus { outline:none; border-color:#2E75B6; box-shadow:0 0 0 3px rgba(46,117,182,0.12); background:#fff; }
.grid { display:grid; grid-template-columns: 360px 1fr; gap:20px; }
@media (max-width: 900px){ .grid { grid-template-columns: 1fr; } }
.card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:18px; box-shadow:0 1px 2px rgba(0,0,0,0.03); }
.card h2 { font-size:15px; color:#1F4E79; margin-bottom:12px; padding-bottom:8px; border-bottom:1px solid #eef2f7; }
.drop { display:block; box-sizing:border-box; width:100%; border:2px dashed #c7d2e0; border-radius:10px; padding:28px 16px; text-align:center; cursor:pointer; transition:.15s; color:#6b7280; font-size:13px;}
.drop:hover, .drop.dragover { border-color:#2E75B6; background:#f0f7ff; color:#1F4E79; }
/* iOS Safari 兼容: display:none 的 file input 在 iOS 上点不动, 改用透明定位 */
.drop input { position:absolute; opacity:0; width:0.1px; height:0.1px; overflow:hidden; z-index:-1; }
#preview { margin-top:12px; }
#preview img { width:100%; max-height:280px; object-fit:contain; border-radius:8px; border:1px solid #eee; background:#fafafa; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; background:#1F4E79; color:#fff; border:none; border-radius:8px; padding:10px 18px; font-size:14px; font-weight:600; cursor:pointer; transition:.15s; width:100%; margin-top:12px; }
.btn:hover:not(:disabled) { background:#2E75B6; }
.btn:disabled { background:#9ca3af; cursor:not-allowed; }
.btn.ghost { background:#fff; color:#1F4E79; border:1px solid #1F4E79; }
.btn.ghost:hover { background:#f0f7ff; }
.manual { margin-top:10px; padding-top:10px; border-top:1px dashed #eee; }
.manual input { width:100%; padding:8px 10px; border:1px solid #d1d5db; border-radius:6px; font-size:13px; }
.placeholder { color:#9ca3af; font-size:13px; text-align:center; padding:48px 12px; }
.result { display:flex; flex-direction:column; gap:14px; }
.tag { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; margin-right:4px; }
.tag.cat { background:#e0f2fe; color:#0c4a6e; }
.section { border-left:3px solid #1F4E79; padding:6px 12px; background:#fafbfc; border-radius:0 6px 6px 0; }
.section.warn { border-color:#dc2626; background:#fef2f2; }
.section.good { border-color:#16a34a; background:#f0fdf4; }
.section h3 { font-size:13px; margin-bottom:6px; color:#1F4E79; }
.section.warn h3 { color:#dc2626; }
.section.good h3 { color:#16a34a; }
.section p, .section li { font-size:13px; color:#374151; }
.section ul { margin-left:18px; margin-top:4px; }
.product-card { border:1px solid #e5e7eb; border-radius:8px; padding:12px; margin-top:8px; background:#fff; }
.product-card .pname { font-weight:600; color:#1F4E79; font-size:14px; }
.product-card .ptype { font-size:11px; color:#6b7280; margin-top:2px; }
.priority { float:right; font-size:11px; padding:2px 8px; border-radius:10px; font-weight:600; }
.priority.high { background:#dcfce7; color:#15803d; }
.priority.mid { background:#fef3c7; color:#92400e; }
.priority.low { background:#fee2e2; color:#b91c1c; }
.copy-block { background:#fff; border:1px solid #e5e7eb; border-radius:6px; padding:10px 12px; margin-top:6px; font-size:13px; color:#374151; white-space:pre-wrap; }
.copy-btn { float:right; background:none; border:1px solid #d1d5db; color:#6b7280; padding:2px 8px; border-radius:4px; font-size:11px; cursor:pointer; }
.copy-btn:hover { background:#f3f4f6; }
.loading { display:flex; align-items:center; gap:8px; color:#6b7280; font-size:13px; padding:24px; justify-content:center; }
.spinner { width:16px; height:16px; border:2px solid #e5e7eb; border-top-color:#1F4E79; border-radius:50%; animation:spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.err { background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; border-radius:6px; padding:10px; font-size:13px; }
.disclaimer { font-size:11px; color:#9ca3af; margin-top:16px; line-height:1.5; padding-top:12px; border-top:1px solid #eee; }
/* Tabs */
.tabs { display:flex; gap:8px; margin-bottom:20px; border-bottom:2px solid #e5e7eb; }
.tab-btn { background:none; border:none; padding:10px 18px; font-size:15px; cursor:pointer; color:#6b7280; font-weight:600; border-bottom:3px solid transparent; margin-bottom:-2px; transition:.15s; font-family:inherit; }
.tab-btn:hover { color:#1F4E79; }
.tab-btn.active { color:#1F4E79; border-bottom-color:#2E75B6; }
/* Meal-specific */
.foods-grid { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.food-chip { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:14px; font-size:12px; font-weight:500; }
.food-chip.vegetable { background:#dcfce7; color:#15803d; }
.food-chip.protein { background:#fee2e2; color:#b91c1c; }
.food-chip.staple { background:#fed7aa; color:#9a3412; }
.food-chip.nut { background:#fef3c7; color:#92400e; }
.food-chip.yogurt { background:#e0e7ff; color:#3730a3; }
.food-chip.fruit { background:#fbcfe8; color:#9d174d; }
.food-chip.dessert,.food-chip.drink,.food-chip.other { background:#e5e7eb; color:#374151; }
#mealPreview .meal-preview-wrap { position:relative; margin-top:12px; }
#mealPreview .meal-preview-wrap img { width:100%; max-height:280px; object-fit:contain; border-radius:8px; border:1px solid #eee; background:#fafafa; display:block; }
#mealPreview .meal-preview-remove { position:absolute; top:8px; right:8px; width:28px; height:28px; border:none; border-radius:50%; background:rgba(220,38,38,0.92); color:#fff; font-size:20px; line-height:28px; font-weight:700; cursor:pointer; padding:0; box-shadow:0 2px 8px rgba(0,0,0,0.18); }
#mealPreview .meal-preview-remove:hover { background:#b91c1c; }
/* 餐盘配比条形图 */
.ratio-row { display:flex; align-items:center; gap:8px; margin-top:8px; font-size:12px; }
.ratio-label { width:70px; color:#374151; font-weight:500; }
.ratio-bar-wrap { flex:1; height:18px; background:#f3f4f6; border-radius:9px; overflow:hidden; position:relative; }
.ratio-bar { height:100%; border-radius:9px; transition:width .4s; }
.ratio-bar.vegetable { background:linear-gradient(90deg,#22c55e,#16a34a); }
.ratio-bar.protein { background:linear-gradient(90deg,#ef4444,#dc2626); }
.ratio-bar.staple { background:linear-gradient(90deg,#f97316,#ea580c); }
.ratio-bar.other { background:linear-gradient(90deg,#94a3b8,#64748b); }
.ratio-target { position:absolute; top:-3px; bottom:-3px; width:2px; background:#1F4E79; }
.ratio-val { width:90px; text-align:right; color:#1f2937; font-weight:600; font-size:12px; }
.ratio-val .target { color:#9ca3af; font-weight:400; margin-left:4px; }
.score-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; }
.score-item { flex:1; min-width:120px; padding:8px 12px; border-radius:8px; background:#fff; border:1px solid #e5e7eb; }
.score-item .lbl { font-size:11px; color:#6b7280; }
.score-item .val { font-size:18px; font-weight:700; margin-top:2px; }
.score-item.good .val { color:#16a34a; }
.score-item.warn .val { color:#ea580c; }
.score-item.bad .val { color:#dc2626; }
/* 饮食 - 模式切换按钮 */
.meal-mode-btn { flex:1; background:none; border:none; padding:9px 12px; font-size:14px; font-weight:600; color:#6b7280; border-radius:6px; cursor:pointer; transition:.15s; font-family:inherit; }
.meal-mode-btn:hover { background:#f3f4f6; color:#1F4E79; }
.meal-mode-active { background:#1F4E79; color:#fff !important; }
.meal-mode-active:hover { background:#2E75B6; color:#fff; }
/* 饮食 - 一日三餐 mini 上传 */
.daily-meal-slot { position:relative; }
.daily-slot-remove { position:absolute; top:8px; right:8px; width:24px; height:24px; border:none; border-radius:50%; background:rgba(107,114,128,0.16); color:#6b7280; font-size:18px; line-height:24px; font-weight:700; cursor:pointer; padding:0; }
.daily-slot-remove:hover { background:#fee2e2; color:#b91c1c; }
.drop-mini { display:inline-block; padding:6px 12px; font-size:12px; border:1px dashed #c7d2e0; border-radius:6px; cursor:pointer; color:#6b7280; background:#fff; }
.drop-mini:hover { border-color:#1F4E79; color:#1F4E79; }
.drop-mini input { display:none; }
.drop-mini-label { user-select:none; }
.meal-mini-preview { margin-top:6px; }
.daily-meal-preview-wrap { position:relative; display:inline-block; max-width:100%; }
.daily-meal-preview-wrap img { max-height:90px; max-width:100%; object-fit:contain; border:1px solid #e5e7eb; border-radius:6px; display:block; }
.daily-meal-image-remove { position:absolute; top:4px; right:4px; width:22px; height:22px; border:none; border-radius:50%; background:rgba(220,38,38,0.92); color:#fff; font-size:16px; line-height:22px; font-weight:700; cursor:pointer; padding:0; box-shadow:0 2px 6px rgba(0,0,0,0.16); }
.daily-meal-image-remove:hover { background:#b91c1c; }
.meal-daily-text { width:100%; padding:6px 8px; border:1px solid #d1d5db; border-radius:6px; font-size:13px; font-family:inherit; resize:vertical; min-height:46px; margin-top:8px; }
/* 饮食点评 - 6 区块输出样式 */
.meal-card { background:#fff; border:1px solid #e5e7eb; border-radius:8px; padding:12px 14px; margin-top:10px; }
.meal-card .title { font-weight:600; font-size:13px; color:#1F4E79; margin-bottom:6px; display:flex; align-items:center; justify-content:space-between; }
.meal-card .body { font-size:13px; color:#374151; line-height:1.65; white-space:pre-wrap; }
.meal-card.highlight { background:#fef9c3; border-color:#fde68a; }
.meal-card.client { background:#eef6ff; border-color:#bfdbfe; }
.meal-card.internal { background:#f9fafb; border-color:#e5e7eb; }
.meal-tag { display:inline-block; padding:2px 8px; border-radius:10px; font-size:11px; font-weight:600; margin:2px 4px 2px 0; }
.meal-tag.normal { background:#dcfce7; color:#15803d; }
.meal-tag.low { background:#fef3c7; color:#92400e; }
.meal-tag.high { background:#fee2e2; color:#b91c1c; }
.meal-day-table { width:100%; border-collapse:collapse; font-size:13px; margin-top:6px; }
.meal-day-table td { padding:6px 8px; border-bottom:1px solid #f1f5f9; }
.meal-day-table td:first-child { width:60px; color:#1F4E79; font-weight:600; }
/* 一日三餐 - 拖拽 / 粘贴态 */
.daily-drop-active { outline:3px dashed #2E75B6 !important; outline-offset:-3px; transition:outline .15s; }
.daily-slot-active { box-shadow: 0 0 0 2px #1F4E79; transition: box-shadow .2s; }
@keyframes mealFlash {
  0% { background:#bfdbfe !important; }
  100% { background:transparent; }
}
.daily-paste-flash { animation: mealFlash 0.6s ease-out; }
/* 体检报告 */
.indicator-tbl { width:100%; border-collapse:collapse; font-size:12px; margin-top:6px; }
.indicator-tbl th { background:#f8f9fa; padding:6px 8px; text-align:left; color:#6b7280; font-weight:600; border-bottom:1px solid #e5e7eb; font-size:11px; }
.indicator-tbl td { padding:6px 8px; border-bottom:1px solid #f1f5f9; }
.indicator-tbl tr.status-high td .v { color:#dc2626; font-weight:600; }
.indicator-tbl tr.status-low td .v { color:#2563eb; font-weight:600; }
.indicator-tbl tr.status-abnormal td .v { color:#dc2626; font-weight:700; }
.indicator-tbl tr.status-normal td .v { color:#16a34a; }
.indicator-tbl .arrow { font-size:11px; margin-left:4px; }
.indicator-tbl .ref { color:#9ca3af; font-size:11px; }
.indicator-tbl .clinical { color:#6b7280; font-size:11px; }
.abnormal-pill { display:inline-block; padding:3px 10px; border-radius:12px; font-size:12px; font-weight:600; margin:3px 4px 3px 0; }
.abnormal-pill.high, .abnormal-pill.abnormal { background:#fee2e2; color:#b91c1c; }
.abnormal-pill.low { background:#dbeafe; color:#1d4ed8; }
.abnormal-pill.normal { background:#dcfce7; color:#15803d; }
.abnormal-pill.review { background:#fef3c7; color:#92400e; }
.indicator-tbl tr.status-borderline td .v { color:#d97706; font-weight:600; }
.indicator-tbl tr.status-missing_ref td .v, .indicator-tbl tr.status-needs_review td .v { color:#92400e; }
.group-card { margin-top:10px; border:1px solid #e5e7eb; border-radius:8px; overflow:hidden; }
.group-card .group-title { background:#f8f9fa; padding:8px 12px; font-size:13px; font-weight:600; color:#1F4E79; border-bottom:1px solid #e5e7eb; }
.product-mini { display:flex; gap:10px; padding:10px; background:#fff; border:1px solid #e5e7eb; border-radius:8px; margin-top:8px; }
.product-mini .icon { font-size:24px; }
.product-mini .body { flex:1; }
.product-mini .name { font-weight:600; color:#1F4E79; font-size:13px; }
.product-mini .desc { font-size:12px; color:#374151; line-height:1.55; margin-top:4px; }

/* ============ Session 状态管理 UI (dn-* 前缀避免污染) ============ */
.dn-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:8px 0 12px; padding:8px 10px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:6px; }
.dn-toolbar .dn-tb-label { font-size:12px; color:#6b7280; font-weight:600; }
.dn-toolbar .dn-tb-btn { background:#fff; border:1px solid #d1d5db; border-radius:5px; padding:5px 10px; font-size:12px; color:#374151; cursor:pointer; font-family:inherit; transition:.15s; }
.dn-toolbar .dn-tb-btn:hover { background:#f3f4f6; border-color:#9ca3af; }
.dn-toolbar .dn-tb-btn.danger { color:#991b1b; border-color:#fca5a5; }
.dn-toolbar .dn-tb-btn.danger:hover { background:#fef2f2; border-color:#f87171; }
.dn-toolbar .dn-tb-spacer { flex:1; }
.dn-toolbar .dn-tb-sessid { font-size:10px; color:#9ca3af; font-family:Menlo,monospace; }
.dn-history-panel { margin-top:10px; padding:10px; background:#fafafa; border:1px dashed #d4d4d8; border-radius:6px; }
.dn-history-panel .dn-h-title { font-size:13px; color:#52525b; font-weight:600; margin-bottom:6px; display:flex; align-items:center; justify-content:space-between; }
.dn-history-item { border:1px solid #e5e7eb; border-radius:6px; padding:8px 10px; margin-bottom:6px; cursor:pointer; background:#fff; transition:.15s; }
.dn-history-item:hover { border-color:#3b82f6; background:#eff6ff; }
.dn-history-empty { color:#9ca3af; font-size:12px; padding:8px; text-align:center; }
.dn-restore-hint { background:#fef3c7; border-left:3px solid #f59e0b; padding:8px 12px; margin:8px 0; font-size:13px; color:#92400e; border-radius:4px; line-height:1.5; }
.dn-history-restored-tag { background:#fef3c7; border-left:3px solid #f59e0b; padding:6px 10px; margin-bottom:10px; font-size:12px; color:#92400e; border-radius:4px; }

/* ============ 窄屏适配 ≤ 480px (390px 优先) ============ */
@media (max-width: 480px) {
  body { font-size:14px; }
  .container, main, .wrap { padding:8px !important; max-width:100% !important; }
  /* 主 panel 强制竖排 */
  .panel, .panels, .grid, .row, .split { display:block !important; grid-template-columns:none !important; }
  /* 上传区/按钮/结果区上下排列 */
  #mode-drug, #mode-meal, #mode-report { display:block; }
  #mode-drug > div, #mode-meal > div, #mode-report > div { width:100% !important; max-width:100% !important; }
  /* Tab 按钮换行 */
  .tab-btn { padding:8px 10px !important; font-size:13px !important; }
  .customer-profile-card { padding:12px; margin-bottom:12px; }
  .customer-profile-head { display:block; }
  .customer-profile-head span { display:block; margin-top:2px; }
  /* 按钮、输入框宽度自适应 */
  textarea, input[type="text"], input[type="file"], .btn { width:100% !important; box-sizing:border-box; }
  .btn { padding:12px !important; font-size:14px !important; }
  /* 图片预览缩小 */
  #preview img, #mealPreview img, #reportPreview img { max-width:100% !important; height:auto !important; }
  /* dn-toolbar 在窄屏 */
  .dn-toolbar { padding:6px 8px; gap:6px; }
  .dn-toolbar .dn-tb-btn { padding:6px 8px; font-size:11px; }
  .dn-toolbar .dn-tb-sessid { display:none; }
  /* 避免横向滚动 */
  body, html { overflow-x:hidden; max-width:100%; }
  table { width:100% !important; font-size:12px; word-break:break-word; }
}
