/* 客户跟进交互演示 · 沿用现有令牌与工作台白底样式；只加流程组件，不改配色 */
.flow{padding:0 0 4px}
.flow .wb-head{padding:16px 20px 8px}
.flow .reset{margin-left:auto;background:none;border:1px solid #DADCE0;border-radius:6px;padding:6px 12px;font:inherit;font-size:12.5px;color:#5F6368;cursor:pointer}
.flow .reset:hover{border-color:#1A1A1A;color:#1A1A1A}
.flow-crumb{margin-left:auto;font-size:13px;color:#5F6368}
.stepper{display:flex;gap:6px;list-style:none;margin:0;padding:6px 20px 14px;flex-wrap:wrap;font-size:12.5px;color:#80868B}
.stepper li{display:flex;align-items:center;gap:6px;padding-right:12px;position:relative}
.stepper li:not(:last-child)::after{content:'→';color:#C4C7CB;margin-left:6px}
.stepper i{font-style:normal;width:20px;height:20px;border-radius:50%;border:1.5px solid #C4C7CB;font-size:11px;line-height:17px;text-align:center}
.stepper .now{color:#1A1A1A;font-weight:500}
.stepper .now i{border-color:var(--accent);color:var(--accent)}
.stepper .done{color:#137333}
.stepper .done i{background:#137333;border-color:#137333;color:#fff}
.fgrid{display:grid;grid-template-columns:1fr 1.1fr 1.2fr;gap:16px;padding:0 20px 18px;text-align:left}
.fcol{border:1px solid #DADCE0;border-radius:6px;padding:14px;min-width:0;display:flex;flex-direction:column;gap:10px}
.fcol.dim{color:#80868B;background:#FAFAFA}
.fcol h4{font-size:13.5px;font-weight:500;color:#1A1A1A;margin:0}
.fcol.dim h4{color:#80868B}
.fhint{font-size:12px;color:#5F6368;margin:0;line-height:1.55}
.msg{background:#F1F3F4;border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.6;color:#202124}
.msg small{display:block;color:#80868B;font-size:11px;margin:0 0 4px}
.frow{display:grid;grid-template-columns:96px 1fr;gap:2px 10px;align-items:center;font-size:13px;padding:6px 8px;border-radius:6px}
.frow label{color:#5F6368;font-size:12px}
.frow span{color:#202124}
.frow input,.frow select{font:inherit;font-size:13px;padding:6px 8px;border:1px solid #DADCE0;border-radius:6px;width:100%;background:#fff;color:#202124}
.frow input:focus,.frow select:focus,.flow button:focus-visible,.flow .reset:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.frow.warn{background:#FEF7E0}
.frow.warn em{grid-column:2;font-style:normal;font-size:11.5px;color:#B06000}
.frow.warn em::before{content:'⚠ '}
.ferr{margin:0;font-size:12.5px;color:#C5221F;background:#FCE8E6;border-radius:6px;padding:8px 10px}
.fdone{margin:0;font-size:12.5px;color:#137333}
.fnote-ok{margin:0;font-size:12px;color:#137333;background:#E6F4EA;border-radius:6px;padding:8px 10px;line-height:1.5}
.ftable{width:100%;border-collapse:collapse;font-size:12px;border:1px solid #DADCE0}
.ftable th,.ftable td{border-bottom:1px solid #E8EAED;padding:8px;text-align:left;vertical-align:top}
.ftable th{background:#F8F9FA;font-weight:500;color:#5F6368;font-size:11px;white-space:nowrap}
.ftable tr.static td{color:#80868B}
.ftable tr.new td{background:#FFF7FB;color:#1A1A1A;border-left:3px solid var(--accent)}
.ftable tr.new td+td{border-left:0}
.ftable tr.slot td{color:#9AA0A6;font-style:italic;text-align:center;background:#FAFAFA}
.ftable td small{display:block;color:#80868B;font-size:10.5px;margin-top:3px}
.fcol .btn{align-self:flex-start}
@media (max-width:760px){
  .fgrid{grid-template-columns:1fr;padding:0 12px 14px}
  .stepper{padding:6px 12px 12px;gap:4px;font-size:12px}
  .stepper li{padding-right:6px}
  .stepper li:not(:last-child)::after{margin-left:2px}
  .frow{grid-template-columns:1fr}
  .wb .ftable th:nth-child(3),.wb .ftable td:nth-child(3){display:table-cell}  /* 流程表保留「下一步」列 */
  .ftable{font-size:11px}
  .frow.warn em{grid-column:1}
  .flow .wb-head{flex-wrap:wrap}
}
