/* Ginseng Operations Hub — 西洋参运营中控台
   所有样式都在这里。
   设计系统使用 CSS 变量(:root),改一个变量整套系统颜色都跟着变。
*/

/* ===================================================================
     设计系统 / DESIGN SYSTEM
     这一段定义了整个系统的"长相":颜色、字体、卡片、按钮。
     后面所有 17 个页面都复用这里的样式,不再重新定义。
     =================================================================== */
  :root{
    /* 背景色 / Backgrounds */
    --bg-page:    #FBF9F4;   /* 暖白页面背景 warm white */
    --bg-card:    #FFFFFF;   /* 卡片白底 */
    --bg-cream:   #F6F2E9;   /* 奶油色浅块 soft cream */
    --bg-rail:    #FFFFFF;   /* 左侧导航背景 */

    /* 主色 / Brand colors */
    --green-900:  #143D2E;   /* 最深绿(标题/强调) */
    --green-700:  #1E5A3F;   /* 深绿主按钮 deep green */
    --green-600:  #267A52;
    --green-100:  #E3F0E8;   /* 浅绿底 */
    --maple:      #B5852E;   /* 枫叶金点缀 muted maple/gold */
    --maple-100:  #F6ECD8;   /* 金色浅底 */

    /* 文字 / Text */
    --text-1:     #1F2A24;   /* 主文字 */
    --text-2:     #5C6660;   /* 次要灰字 grey secondary */
    --text-3:     #939995;   /* 提示弱字 */

    /* 状态色 / Status colors (见需求第十五节) */
    --st-green:   #267A52;   /* 完成/到货/库存足够/发货 */
    --st-green-bg:#E3F0E8;
    --st-blue:    #2C6EB5;   /* 已确认/已下单/进行中 */
    --st-blue-bg: #E4EEF8;
    --st-amber:   #B5852E;   /* 需注意/备货中/建议采购 */
    --st-amber-bg:#F6ECD8;
    --st-red:     #C0492F;   /* 低库存/缺货/高紧急/取消 */
    --st-red-bg:  #FAE8E3;
    --st-grey:    #7A817C;   /* 草稿/中性/未启用 */
    --st-grey-bg: #EDEDE8;
    --st-purple:  #6A4FA3;   /* 已包装 packed */
    --st-purple-bg:#EEE9F6;
    --st-darkgreen:#143D2E;  /* 已完成 completed */

    /* 边框 / Borders */
    --border:     #EAE6DC;
    --border-2:   #DAD5C8;

    /* 圆角 / Radius */
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --r-xl: 22px;

    --rail-w: 248px;
  }

  *{ box-sizing:border-box; margin:0; padding:0; }
  html,body{ height:100%; }
  body{
    font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",-apple-system,sans-serif;
    background:var(--bg-page);
    color:var(--text-1);
    -webkit-font-smoothing:antialiased;
    font-size:15px;
    line-height:1.6;
  }

  /* ---- 整体布局:左导航 + 右内容 ---- */
  .app{ display:flex; min-height:100vh; }

  /* ===================================================================
     左侧导航 / SIDEBAR NAVIGATION
     =================================================================== */
  .rail{
    width:var(--rail-w);
    flex-shrink:0;
    background:var(--bg-rail);
    border-right:1px solid var(--border);
    padding:20px 14px;
    display:flex;
    flex-direction:column;
    gap:4px;
    position:sticky;
    top:0;
    height:100vh;
    overflow-y:auto;
  }
  .brand{
    display:flex; align-items:center; gap:10px;
    padding:6px 8px 18px;
  }
  .brand-mark{
    width:38px; height:38px; border-radius:11px;
    background:var(--green-700);
    color:#fff; display:flex; align-items:center; justify-content:center;
    font-size:20px; flex-shrink:0;
  }
  .brand-text .en{ font-size:14px; font-weight:600; color:var(--green-900); line-height:1.25; }
  .brand-text .cn{ font-size:12px; color:var(--text-2); }

  .nav-group-label{
    font-size:11px; color:var(--text-3); text-transform:uppercase;
    letter-spacing:.06em; padding:14px 10px 6px; font-weight:600;
  }
  .nav-item{
    display:flex; align-items:center; gap:11px;
    padding:9px 11px; border-radius:var(--r-sm);
    color:var(--text-1); cursor:pointer; border:none; background:none;
    width:100%; text-align:left; font-size:14px; font-family:inherit;
    transition:background .12s;
  }
  .nav-item .ic{ width:18px; text-align:center; font-size:16px; color:var(--text-2); flex-shrink:0; }
  .nav-item .lbl{ display:flex; flex-direction:column; line-height:1.2; }
  .nav-item .lbl .cn{ font-size:11px; color:var(--text-3); }
  .nav-item:hover{ background:var(--bg-cream); }
  .nav-item.active{ background:var(--green-100); color:var(--green-900); font-weight:600; }
  .nav-item.active .ic{ color:var(--green-700); }
  .nav-item.active .lbl .cn{ color:var(--green-600); }
  .nav-item.muted .ic, .nav-item.muted .lbl{ opacity:.62; }

  /* ===================================================================
     右侧内容区
     =================================================================== */
  .main{ flex:1; min-width:0; display:flex; flex-direction:column; }

  /* 顶部栏:含角色切换器 */
  .topbar{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 30px;
    background:var(--bg-page);
    border-bottom:1px solid var(--border);
    position:sticky; top:0; z-index:20;
  }
  .topbar-left{ display:flex; align-items:center; gap:12px; }
  .topbar-left .pagetitle{ font-size:15px; font-weight:600; color:var(--green-900); }
  .topbar-left .pagetitle .cn{ font-weight:400; color:var(--text-2); }
  /* 汉堡按钮:桌面隐藏,窄屏显示 */
  .hamburger{
    display:none; background:none; border:1px solid var(--border-2); border-radius:var(--r-sm);
    width:38px; height:38px; font-size:18px; cursor:pointer; color:var(--text-1); font-family:inherit;
    align-items:center; justify-content:center;
  }
  .hamburger:hover{ background:var(--bg-cream); }
  /* 移动端导航遮罩 */
  .nav-scrim{ display:none; position:fixed; inset:0; background:rgba(20,30,25,.4); z-index:40; }
  .nav-scrim.show{ display:block; }
  /* 返回键 */
  .back-btn{
    display:flex; align-items:center; gap:6px;
    background:var(--bg-card); border:1px solid var(--border-2); border-radius:var(--r-sm);
    padding:7px 13px 7px 10px; cursor:pointer; font-family:inherit; font-size:13.5px; color:var(--text-1);
    transition:background .12s, border-color .12s;
  }
  .back-btn:hover{ background:var(--bg-cream); border-color:var(--green-600); color:var(--green-900); }
  .back-btn .arr{ font-size:16px; line-height:1; }
  .back-btn .cn{ color:var(--text-3); font-size:12px; }
  .back-btn.hidden{ display:none; }

  /* 角色切换器 */
  .role-switch{ display:flex; align-items:center; gap:10px; }
  .role-switch .demo-tag{
    font-size:11px; color:var(--maple); background:var(--maple-100);
    padding:3px 9px; border-radius:20px; font-weight:600;
  }
  .role-select{
    appearance:none;
    font-family:inherit; font-size:14px; color:var(--text-1);
    background:var(--bg-card);
    border:1px solid var(--border-2); border-radius:var(--r-sm);
    padding:8px 34px 8px 14px; cursor:pointer;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235C6660' stroke-width='2.5'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat:no-repeat; background-position:right 12px center;
  }

  /* 内容画布 */
  .canvas{ padding:30px 30px 60px; max-width:1080px; }

  /* ---- 页面大标题 ---- */
  .page-head{ margin-bottom:26px; }
  .page-head h1{ font-size:25px; color:var(--green-900); font-weight:700; letter-spacing:-.01em; }
  .page-head h1 .cn{ font-weight:500; color:var(--text-1); }
  .page-head .sub{ color:var(--text-2); font-size:14.5px; margin-top:7px; max-width:620px; }
  .page-head .sub .cn{ display:block; color:var(--text-3); font-size:13.5px; margin-top:2px; }

  /* ---- 区块标题 ---- */
  .section{ margin-bottom:30px; }
  .section-title{
    display:flex; align-items:center; gap:8px;
    font-size:15px; font-weight:600; color:var(--green-900); margin-bottom:13px;
  }
  .section-title .cn{ font-weight:400; color:var(--text-2); font-size:13px; }
  .section-title .ic{ color:var(--maple); font-size:17px; }

  /* ===================================================================
     组件:大按钮 / Big Action buttons
     =================================================================== */
  .big-actions{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; }
  .big-btn{
    background:var(--bg-card); border:1px solid var(--border);
    border-radius:var(--r-md); padding:20px 18px;
    cursor:pointer; text-align:left; font-family:inherit;
    display:flex; flex-direction:column; gap:12px;
    transition:transform .12s, border-color .12s, box-shadow .12s;
  }
  .big-btn:hover{ transform:translateY(-2px); border-color:var(--green-600); box-shadow:0 6px 20px rgba(30,90,63,.08); }
  .big-btn .ico{
    width:46px; height:46px; border-radius:13px;
    display:flex; align-items:center; justify-content:center; font-size:23px;
  }
  .big-btn .ico.green{ background:var(--green-100); color:var(--green-700); }
  .big-btn .ico.gold{ background:var(--maple-100); color:var(--maple); }
  .big-btn .ico.blue{ background:var(--st-blue-bg); color:var(--st-blue); }
  .big-btn .ico.red{ background:var(--st-red-bg); color:var(--st-red); }
  .big-btn .t-en{ font-size:16px; font-weight:600; color:var(--text-1); }
  .big-btn .t-cn{ font-size:13px; color:var(--text-2); margin-top:-6px; }

  /* primary 主操作按钮(深绿实心) */
  .btn-primary{
    background:var(--green-700); color:#fff; border:none;
    border-radius:var(--r-sm); padding:11px 22px; font-size:15px; font-weight:600;
    cursor:pointer; font-family:inherit; display:inline-flex; align-items:center; gap:9px;
    transition:background .12s;
  }
  .btn-primary:hover{ background:var(--green-900); }
  .btn-primary .cn{ font-weight:400; opacity:.85; }

  /* ===================================================================
     组件:需要处理 / Needs Attention 卡片
     =================================================================== */
  .attn-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:13px; }
  .attn-card{
    background:var(--bg-card); border:1px solid var(--border);
    border-radius:var(--r-md); padding:16px 17px; cursor:pointer;
    display:flex; align-items:center; gap:14px;
    transition:border-color .12s, transform .12s;
  }
  .attn-card:hover{ border-color:var(--border-2); transform:translateY(-1px); }
  .attn-card .num{ font-size:27px; font-weight:700; line-height:1; }
  .attn-card .meta .en{ font-size:13.5px; font-weight:600; color:var(--text-1); }
  .attn-card .meta .cn{ font-size:12px; color:var(--text-3); }
  .attn-card.amber .num{ color:var(--st-amber); }
  .attn-card.red .num{ color:var(--st-red); }
  .attn-card.blue .num{ color:var(--st-blue); }
  .attn-card.green .num{ color:var(--st-green); }

  /* ===================================================================
     组件:最近动态 feed / Recent Activity
     =================================================================== */
  .feed{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; }
  .feed-item{ display:flex; align-items:flex-start; gap:13px; padding:14px 18px; border-bottom:1px solid var(--border); }
  .feed-item:last-child{ border-bottom:none; }
  .feed-dot{
    width:32px; height:32px; border-radius:9px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center; font-size:15px; margin-top:1px;
  }
  .feed-body{ flex:1; min-width:0; }
  .feed-body .en{ font-size:14px; color:var(--text-1); }
  .feed-body .cn{ font-size:12.5px; color:var(--text-3); }
  .feed-time{ font-size:12px; color:var(--text-3); white-space:nowrap; }
  /* 动态可点 + 留言数 */
  .feed-item.clickable{ cursor:pointer; transition:background .12s; }
  .feed-item.clickable:hover{ background:var(--bg-cream); }
  .feed-right{ display:flex; flex-direction:column; align-items:flex-end; gap:5px; }
  .feed-cmt{ font-size:11.5px; color:var(--st-blue); background:var(--st-blue-bg); border-radius:20px; padding:2px 9px; font-weight:600; white-space:nowrap; }
  .feed-cmt.muted{ color:var(--text-3); background:var(--bg-cream); }
  /* 动态详情顶部 */
  .act-detail-top{ display:flex; gap:13px; align-items:center; margin-bottom:14px; }
  .act-detail-top .adt-en{ font-size:15px; font-weight:600; color:var(--green-900); }
  .act-detail-top .adt-cn{ font-size:12.5px; color:var(--text-3); margin-top:2px; }
  .act-detail-text{ background:var(--bg-cream); border-radius:var(--r-md); padding:15px 17px; font-size:13.5px; color:var(--text-2); line-height:1.7; margin-bottom:22px; }
  /* 留言区 */
  .cmt-section{ border-top:1px solid var(--border); padding-top:18px; }
  .cmt-title{ font-size:14px; font-weight:600; color:var(--green-900); margin-bottom:14px; }
  .cmt-list{ display:flex; flex-direction:column; gap:14px; margin-bottom:18px; }
  .cmt-empty{ font-size:13px; color:var(--text-3); text-align:center; padding:14px; }
  .cmt{ display:flex; gap:11px; }
  .cmt-avatar{ width:32px; height:32px; border-radius:50%; color:#fff; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; flex-shrink:0; }
  .cmt-body{ flex:1; }
  .cmt-head{ display:flex; align-items:baseline; gap:9px; }
  .cmt-who{ font-size:13px; font-weight:600; }
  .cmt-time{ font-size:11.5px; color:var(--text-3); }
  .cmt-text{ font-size:13.5px; color:var(--text-1); margin-top:3px; line-height:1.55; white-space:pre-wrap; }
  .cmt-compose{ display:flex; gap:11px; align-items:flex-start; border-top:1px solid var(--border); padding-top:16px; }

  /* ---- 管理入口(降权) ---- */
  .admin-row{ display:flex; gap:12px; flex-wrap:wrap; }
  .admin-chip{
    display:flex; align-items:center; gap:9px;
    background:var(--bg-cream); border:1px solid var(--border);
    border-radius:var(--r-sm); padding:11px 16px; cursor:pointer; font-family:inherit;
    color:var(--text-2); font-size:13.5px; transition:background .12s;
  }
  .admin-chip:hover{ background:#EFEADD; }
  .admin-chip .ic{ color:var(--text-3); }
  .admin-chip .cn{ color:var(--text-3); font-size:12px; }

  /* 占位提示(还没做的页面) */
  .placeholder{
    background:var(--bg-card); border:1px dashed var(--border-2);
    border-radius:var(--r-md); padding:46px 30px; text-align:center; color:var(--text-2);
  }
  .placeholder .ic{ font-size:34px; color:var(--maple); }
  .placeholder h3{ margin:14px 0 6px; color:var(--green-900); font-size:18px; }
  .placeholder .batch{ display:inline-block; margin-top:14px; background:var(--maple-100); color:var(--maple); padding:5px 14px; border-radius:20px; font-size:12.5px; font-weight:600; }

  /* 角色提示横幅 */
  .role-banner{
    display:flex; align-items:center; gap:11px;
    background:var(--green-100); border:1px solid #CDE4D6;
    border-radius:var(--r-sm); padding:11px 16px; margin-bottom:24px;
    font-size:13.5px; color:var(--green-900);
  }
  .role-banner .ic{ color:var(--green-700); font-size:17px; }
  .role-banner b{ font-weight:600; }

  /* ===================================================================
     第2批组件:销售工作台 + 新建订单
     =================================================================== */

  /* ---- 状态药丸 pill ---- */
  .pill{ display:inline-block; padding:3px 11px; border-radius:20px; font-size:12px; font-weight:600; white-space:nowrap; }

  /* ---- 主操作大横幅(销售工作台顶部的"创建新订单") ---- */
  .primary-hero{
    background:var(--green-700); border-radius:var(--r-lg);
    padding:26px 28px; color:#fff; display:flex; align-items:center; justify-content:space-between;
    gap:20px; flex-wrap:wrap;
  }
  .primary-hero .ph-text .t{ font-size:19px; font-weight:600; }
  .primary-hero .ph-text .d{ font-size:13.5px; opacity:.85; margin-top:4px; max-width:420px; }
  .primary-hero .ph-btn{
    background:#fff; color:var(--green-900); border:none; cursor:pointer;
    font-family:inherit; font-size:16px; font-weight:600;
    padding:14px 26px; border-radius:var(--r-sm); display:inline-flex; align-items:center; gap:10px;
    white-space:nowrap; transition:transform .12s;
  }
  .primary-hero .ph-btn:hover{ transform:scale(1.03); }
  .primary-hero .ph-btn .cn{ font-weight:400; opacity:.7; }

  /* ---- 步骤说明条 ---- */
  .steps-row{ display:flex; gap:10px; flex-wrap:wrap; }
  .step-chip{
    flex:1; min-width:120px; background:var(--bg-card); border:1px solid var(--border);
    border-radius:var(--r-md); padding:14px 15px; display:flex; align-items:flex-start; gap:11px;
  }
  .step-chip .n{
    width:24px; height:24px; border-radius:50%; background:var(--green-100); color:var(--green-700);
    font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .step-chip .stxt .en{ font-size:13.5px; font-weight:600; }
  .step-chip .stxt .cn{ font-size:12px; color:var(--text-3); }

  /* ---- 简洁列表表格(最近订单) ---- */
  .list-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; }
  .otable{ width:100%; border-collapse:collapse; }
  .otable th{
    text-align:left; font-size:11.5px; color:var(--text-3); text-transform:uppercase; letter-spacing:.04em;
    font-weight:600; padding:13px 16px; background:var(--bg-cream); border-bottom:1px solid var(--border);
  }
  .otable td{ padding:14px 16px; border-bottom:1px solid var(--border); font-size:14px; vertical-align:middle; }
  .otable tr:last-child td{ border-bottom:none; }
  .otable tr.clickable{ cursor:pointer; }
  .otable tr.clickable:hover td{ background:var(--bg-cream); }
  .otable .ono{ font-weight:600; color:var(--green-900); font-family:"SF Mono",ui-monospace,monospace; font-size:13px; }
  .otable .sub{ font-size:12px; color:var(--text-3); }

  /* ---- "下一步会发生什么"信息卡 ---- */
  .next-card{
    background:var(--green-100); border:1px solid #CDE4D6; border-radius:var(--r-md);
    padding:18px 20px; display:flex; gap:14px; align-items:flex-start;
  }
  .next-card .ic{ font-size:22px; }
  .next-card .nx .t{ font-weight:600; color:var(--green-900); font-size:14.5px; }
  .next-card .nx .d{ font-size:13.5px; color:var(--text-2); margin-top:4px; line-height:1.65; }

  /* ===================================================================
     新建订单:结账式分步表单
     =================================================================== */
  .checkout{ display:grid; grid-template-columns:1fr 300px; gap:24px; align-items:start; }
  @media(max-width:860px){ .checkout{ grid-template-columns:1fr; } }

  .checkout-main{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; }

  /* 步骤进度条 */
  .progress{ display:flex; padding:18px 22px; gap:0; border-bottom:1px solid var(--border); background:var(--bg-cream); overflow-x:auto; }
  .pstep{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
  .pstep .dot{
    width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    font-size:12px; font-weight:700; flex-shrink:0;
    background:var(--st-grey-bg); color:var(--text-3); border:2px solid transparent;
  }
  .pstep.active .dot{ background:var(--green-700); color:#fff; }
  .pstep.done .dot{ background:var(--green-100); color:var(--green-700); border-color:var(--green-600); }
  .pstep .plbl{ font-size:12px; color:var(--text-3); white-space:nowrap; }
  .pstep.active .plbl{ color:var(--green-900); font-weight:600; }
  .pstep .line{ width:18px; height:2px; background:var(--border-2); margin:0 6px; flex-shrink:0; }

  /* 步骤内容 */
  .step-body{ padding:30px 28px; min-height:230px; }
  .step-body .q{ font-size:18px; font-weight:600; color:var(--green-900); margin-bottom:5px; }
  .step-body .q .cn{ font-weight:400; color:var(--text-2); font-size:14px; }
  .step-body .hint{ font-size:13px; color:var(--text-3); margin-bottom:20px; }

  .field-label{ font-size:13px; font-weight:600; color:var(--text-1); margin-bottom:7px; display:block; }
  .field-label .cn{ font-weight:400; color:var(--text-3); }
  .ipt{
    width:100%; font-family:inherit; font-size:15px; color:var(--text-1);
    background:var(--bg-page); border:1px solid var(--border-2); border-radius:var(--r-sm);
    padding:12px 14px; margin-bottom:18px; transition:border-color .12s;
  }
  .ipt:focus{ outline:none; border-color:var(--green-600); background:#fff; }
  textarea.ipt{ resize:vertical; min-height:80px; }

  /* 产品选择卡 */
  .pick-list{ display:flex; flex-direction:column; gap:10px; }
  .pick-item{
    display:flex; align-items:center; gap:14px; padding:14px 16px;
    border:1px solid var(--border-2); border-radius:var(--r-md); cursor:pointer; background:var(--bg-page);
    transition:border-color .12s, background .12s;
  }
  .pick-item:hover{ border-color:var(--green-600); }
  .pick-item.selected{ border-color:var(--green-700); background:var(--green-100); }
  .pick-item .radio{
    width:20px; height:20px; border-radius:50%; border:2px solid var(--border-2); flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
  }
  .pick-item.selected .radio{ border-color:var(--green-700); }
  .pick-item.selected .radio::after{ content:""; width:10px; height:10px; border-radius:50%; background:var(--green-700); }
  .pick-item .pinfo{ flex:1; }
  .pick-item .pinfo .en{ font-size:14.5px; font-weight:600; }
  .pick-item .pinfo .cn{ font-size:12.5px; color:var(--text-3); }
  .pick-item .pprice{ font-size:14px; font-weight:600; color:var(--maple); white-space:nowrap; }

  /* 数量步进器 */
  .qty-row{ display:flex; align-items:center; gap:16px; margin-bottom:20px; }
  .qty-stepper{ display:flex; align-items:center; border:1px solid var(--border-2); border-radius:var(--r-sm); overflow:hidden; }
  .qty-stepper button{
    width:46px; height:46px; border:none; background:var(--bg-cream); cursor:pointer; font-size:22px;
    color:var(--green-700); font-family:inherit; transition:background .12s;
  }
  .qty-stepper button:hover{ background:#EBE5D6; }
  .qty-stepper input{ width:80px; height:46px; border:none; text-align:center; font-size:18px; font-weight:600; font-family:inherit; color:var(--text-1); }
  .qty-stepper input:focus{ outline:none; }

  /* 底部导航按钮 */
  .step-foot{ display:flex; justify-content:space-between; padding:18px 28px; border-top:1px solid var(--border); background:var(--bg-cream); }
  .btn-ghost{
    background:none; border:1px solid var(--border-2); color:var(--text-2); cursor:pointer;
    font-family:inherit; font-size:14px; padding:11px 20px; border-radius:var(--r-sm); transition:background .12s;
  }
  .btn-ghost:hover{ background:#fff; }
  .btn-ghost:disabled{ opacity:.4; cursor:not-allowed; }

  /* 右侧实时摘要 */
  .summary-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-lg); padding:20px 22px; position:sticky; top:90px; }
  .summary-card h3{ font-size:15px; color:var(--green-900); margin-bottom:4px; }
  .summary-card h3 .cn{ font-weight:400; color:var(--text-2); font-size:12.5px; }
  .summary-card .srow{ display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--border); font-size:13.5px; }
  .summary-card .srow:last-of-type{ border-bottom:none; }
  .summary-card .srow .k{ color:var(--text-3); }
  .summary-card .srow .v{ color:var(--text-1); font-weight:600; text-align:right; }
  .summary-card .srow .v.empty{ color:var(--text-3); font-weight:400; font-style:italic; }

  /* 成功提示 */
  .success-box{ text-align:center; padding:40px 28px; }
  .success-box .check{
    width:66px; height:66px; border-radius:50%; background:var(--green-100); color:var(--green-700);
    font-size:34px; display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
  }
  .success-box h2{ font-size:21px; color:var(--green-900); }
  .success-box h2 .cn{ font-weight:500; color:var(--text-1); display:block; font-size:16px; margin-top:2px; }
  .success-box .auto-note{
    background:var(--maple-100); border-radius:var(--r-md); padding:15px 18px; margin:22px auto 0; max-width:430px;
    display:flex; gap:12px; align-items:flex-start; text-align:left;
  }
  .success-box .auto-note .ic{ font-size:20px; }
  .success-box .auto-note .t{ font-weight:600; color:var(--maple); font-size:14px; }
  .success-box .auto-note .d{ font-size:13px; color:var(--text-2); margin-top:3px; }
  .success-box .sb-actions{ display:flex; gap:12px; justify-content:center; margin-top:26px; flex-wrap:wrap; }

  /* ===================================================================
     第3批组件:订单页 Orders
     =================================================================== */

  /* 顶部快速操作行 */
  .quick-row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:6px; }

  /* 状态概览条:可点筛选 */
  .status-overview{ display:flex; gap:10px; flex-wrap:wrap; }
  .so-chip{
    background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md);
    padding:11px 16px; cursor:pointer; display:flex; align-items:center; gap:11px;
    transition:border-color .12s, transform .12s; font-family:inherit;
  }
  .so-chip:hover{ transform:translateY(-1px); }
  .so-chip.active{ border-color:var(--green-700); box-shadow:0 0 0 1px var(--green-700) inset; }
  .so-chip .dot{ width:10px; height:10px; border-radius:50%; flex-shrink:0; }
  .so-chip .scnt{ font-size:18px; font-weight:700; color:var(--text-1); }
  .so-chip .slbl{ font-size:12.5px; color:var(--text-2); }
  .so-chip .slbl .cn{ color:var(--text-3); font-size:11px; }

  /* 订单行可展开 */
  .otable td .prog{ font-size:12px; color:var(--text-2); }
  .order-detail{ background:var(--bg-cream); }
  .order-detail td{ padding:0 !important; border-bottom:1px solid var(--border) !important; }
  .od-inner{ padding:18px 22px; }
  .od-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px 26px; }
  .od-field .k{ font-size:11.5px; color:var(--text-3); text-transform:uppercase; letter-spacing:.04em; }
  .od-field .v{ font-size:14px; color:var(--text-1); margin-top:2px; }

  /* 订单流程进度迷你条(运营/老板可见) */
  .mini-pipe{ display:flex; align-items:center; gap:0; margin-top:14px; flex-wrap:wrap; }
  .mp-node{ display:flex; align-items:center; gap:6px; }
  .mp-node .d{ width:18px; height:18px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; flex-shrink:0; background:var(--st-grey-bg); color:var(--text-3); }
  .mp-node.done .d{ background:var(--green-700); color:#fff; }
  .mp-node.current .d{ background:var(--maple); color:#fff; }
  .mp-node .t{ font-size:11.5px; color:var(--text-3); }
  .mp-node.done .t{ color:var(--green-700); }
  .mp-node.current .t{ color:var(--maple); font-weight:600; }
  .mp-line{ width:14px; height:2px; background:var(--border-2); margin:0 5px; }
  .mp-line.done{ background:var(--green-600); }

  /* 下一步动作建议 */
  .od-next{ margin-top:14px; background:#fff; border:1px solid var(--border); border-radius:var(--r-sm); padding:11px 15px; font-size:13px; color:var(--text-2); display:flex; gap:9px; align-items:center; }
  .od-next .ic{ color:var(--maple); }
  .od-next b{ color:var(--green-900); font-weight:600; }

  /* 状态说明图例 */
  .legend{ display:flex; gap:18px; flex-wrap:wrap; }
  .legend-item{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--text-2); }
  .legend-item .dot{ width:11px; height:11px; border-radius:50%; }

  /* 表格内迷你按钮 */
  .row-toggle{ background:none; border:none; cursor:pointer; color:var(--text-3); font-size:15px; font-family:inherit; padding:4px; transition:transform .15s; }
  .row-toggle.open{ transform:rotate(90deg); color:var(--green-700); }

  /* 空状态 */
  .empty-state{ text-align:center; padding:40px; color:var(--text-3); }

  /* ===================================================================
     第4批组件:运营中控 Operations Control
     =================================================================== */

  /* 概览指标卡 */
  .ops-metrics{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:13px; }
  .metric{
    background:var(--bg-cream); border-radius:var(--r-md); padding:16px 18px;
  }
  .metric .mlbl{ font-size:12.5px; color:var(--text-2); }
  .metric .mlbl .cn{ color:var(--text-3); font-size:11px; }
  .metric .mval{ font-size:28px; font-weight:700; color:var(--green-900); margin-top:6px; line-height:1; }
  .metric .mval.warn{ color:var(--st-amber); }
  .metric .mval.danger{ color:var(--st-red); }
  .metric .msub{ font-size:11.5px; color:var(--text-3); margin-top:5px; }

  /* 流程看板 Pipeline */
  .pipeline-board{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; overflow-x:auto; }
  @media(max-width:1000px){ .pipeline-board{ grid-template-columns:repeat(3,minmax(160px,1fr)); } }
  @media(max-width:640px){ .pipeline-board{ grid-template-columns:repeat(2,minmax(150px,1fr)); } }
  .pipe-col{ background:var(--bg-cream); border-radius:var(--r-md); padding:10px; min-height:120px; }
  .pipe-col-head{ display:flex; align-items:center; justify-content:space-between; padding:4px 6px 10px; }
  .pipe-col-head .ph-t{ font-size:12.5px; font-weight:600; color:var(--green-900); display:flex; align-items:center; gap:6px; }
  .pipe-col-head .ph-t .cn{ font-weight:400; color:var(--text-3); font-size:11px; }
  .pipe-col-head .pcnt{ background:#fff; border:1px solid var(--border); border-radius:20px; font-size:11px; font-weight:700; padding:1px 9px; color:var(--text-2); }
  .pipe-col.alert .pipe-col-head .pcnt{ background:var(--st-red-bg); color:var(--st-red); border-color:transparent; }
  .pipe-col .stage-dot{ width:8px; height:8px; border-radius:50%; }

  .pipe-card{
    background:#fff; border:1px solid var(--border); border-radius:var(--r-sm);
    padding:10px 11px; margin-bottom:8px; cursor:pointer; transition:transform .1s, border-color .1s;
  }
  .pipe-card:last-child{ margin-bottom:0; }
  .pipe-card:hover{ transform:translateY(-1px); border-color:var(--green-600); }
  .pipe-card .pc-no{ font-size:12px; font-weight:700; color:var(--green-900); font-family:"SF Mono",ui-monospace,monospace; }
  .pipe-card .pc-cust{ font-size:11.5px; color:var(--text-2); margin-top:3px; line-height:1.3; }
  .pipe-card .pc-meta{ font-size:11px; color:var(--text-3); margin-top:5px; display:flex; justify-content:space-between; gap:6px; }
  .pipe-card.urgent{ border-left:3px solid var(--st-red); border-radius:0 var(--r-sm) var(--r-sm) 0; }
  .pipe-empty{ text-align:center; color:var(--text-3); font-size:11.5px; padding:16px 4px; }

  /* 需要处理:行式列表 */
  .attn-list{ display:flex; flex-direction:column; gap:10px; }
  .attn-row{
    background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md);
    padding:14px 17px; display:flex; align-items:center; gap:15px; cursor:pointer;
    transition:border-color .12s; font-family:inherit; text-align:left; width:100%;
  }
  .attn-row:hover{ border-color:var(--border-2); }
  .attn-row .ar-ic{ width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:19px; flex-shrink:0; }
  .attn-row .ar-body{ flex:1; }
  .attn-row .ar-body .t{ font-size:14.5px; font-weight:600; color:var(--text-1); }
  .attn-row .ar-body .d{ font-size:12.5px; color:var(--text-3); margin-top:1px; }
  .attn-row .ar-num{ font-size:24px; font-weight:700; }
  .attn-row .ar-go{ color:var(--text-3); font-size:18px; }
  .attn-row.red .ar-ic{ background:var(--st-red-bg); color:var(--st-red); } .attn-row.red .ar-num{ color:var(--st-red); }
  .attn-row.amber .ar-ic{ background:var(--st-amber-bg); color:var(--st-amber); } .attn-row.amber .ar-num{ color:var(--st-amber); }
  .attn-row.blue .ar-ic{ background:var(--st-blue-bg); color:var(--st-blue); } .attn-row.blue .ar-num{ color:var(--st-blue); }
  .attn-row.green .ar-ic{ background:var(--st-green-bg); color:var(--st-green); } .attn-row.green .ar-num{ color:var(--st-green); }

  /* 两列布局(物料/采购概览) */
  .two-col{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  @media(max-width:760px){ .two-col{ grid-template-columns:1fr; } }
  .mini-list-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); padding:16px 18px; }
  .mini-list-card .mlc-title{ font-size:14px; font-weight:600; color:var(--green-900); margin-bottom:12px; display:flex; align-items:center; gap:7px; }
  .mini-list-card .mlc-title .cn{ font-weight:400; color:var(--text-3); font-size:12px; }
  .mlc-row{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--border); font-size:13px; }
  .mlc-row:last-child{ border-bottom:none; }
  .mlc-row .mr-name{ color:var(--text-1); }
  .mlc-row .mr-name .cn{ color:var(--text-3); font-size:11.5px; }

  /* ===================================================================
     第5批组件:仓库工作台 + 入库 + 出库
     =================================================================== */

  /* 四个大动作按钮(仓库工作台顶部) */
  .wh-actions{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:13px; }

  /* 库存状态列表 */
  .inv-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; }

  /* ===================================================================
     管理员编辑组件:弹窗 / 图片上传 / 编辑按钮
     =================================================================== */

  /* 管理员工具条 */
  .admin-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
  .admin-bar .ab-tip{ font-size:12.5px; color:var(--maple); background:var(--maple-100); padding:5px 12px; border-radius:20px; font-weight:600; }
  .btn-add{
    background:var(--green-700); color:#fff; border:none; border-radius:var(--r-sm);
    padding:9px 17px; font-size:14px; font-weight:600; cursor:pointer; font-family:inherit;
    display:inline-flex; align-items:center; gap:7px; transition:background .12s;
  }
  .btn-add:hover{ background:var(--green-900); }
  .btn-add .cn{ font-weight:400; opacity:.85; }

  /* 行内编辑/删除小按钮 */
  .row-actions{ display:flex; gap:6px; }
  .icon-btn{
    width:30px; height:30px; border-radius:7px; border:1px solid var(--border-2); background:#fff;
    cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center;
    color:var(--text-2); transition:all .12s; font-family:inherit;
  }
  .icon-btn:hover{ border-color:var(--green-600); color:var(--green-700); }
  .icon-btn.del:hover{ border-color:var(--st-red); color:var(--st-red); background:var(--st-red-bg); }

  /* 弹窗 */
  .modal-overlay{
    display:none; position:fixed; inset:0; background:rgba(20,30,25,.45);
    z-index:100; align-items:center; justify-content:center; padding:20px;
    -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  }
  .modal-overlay.show{ display:flex; }
  .modal-box{
    background:var(--bg-card); border-radius:var(--r-lg); width:100%; max-width:520px;
    max-height:88vh; overflow-y:auto; box-shadow:0 24px 60px rgba(0,0,0,.25);
  }
  .modal-head{ display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid var(--border); position:sticky; top:0; background:var(--bg-card); }
  .modal-head h3{ font-size:17px; color:var(--green-900); }
  .modal-head h3 .cn{ font-weight:400; color:var(--text-2); font-size:13px; }
  .modal-close{ background:none; border:none; cursor:pointer; font-size:22px; color:var(--text-3); line-height:1; padding:4px; }
  .modal-close:hover{ color:var(--text-1); }
  .modal-body{ padding:22px 24px; }
  .modal-foot{ display:flex; gap:10px; justify-content:flex-end; padding:16px 24px; border-top:1px solid var(--border); position:sticky; bottom:0; background:var(--bg-card); }

  /* 图片上传区 */
  .img-upload{ display:flex; align-items:center; gap:16px; margin-bottom:20px; }
  .img-preview{
    width:90px; height:90px; border-radius:var(--r-md); border:1px solid var(--border-2);
    background:var(--bg-cream); flex-shrink:0; overflow:hidden; display:flex; align-items:center; justify-content:center;
    font-size:30px; color:var(--text-3);
  }
  .img-preview img{ width:100%; height:100%; object-fit:cover; }
  .img-upload .iu-side{ flex:1; }
  .img-upload .iu-side .iu-label{ font-size:13px; font-weight:600; color:var(--text-1); margin-bottom:6px; }
  .img-upload .iu-side .iu-hint{ font-size:11.5px; color:var(--text-3); margin-top:6px; }
  .btn-upload{
    display:inline-flex; align-items:center; gap:7px; background:var(--bg-cream); border:1px solid var(--border-2);
    border-radius:var(--r-sm); padding:8px 14px; cursor:pointer; font-size:13px; color:var(--text-1); font-family:inherit;
  }
  .btn-upload:hover{ background:#EFEADD; }

  /* 产品大图卡片(管理员 + 普通通用) */
  .prod-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
  .prod-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; display:flex; flex-direction:column; }
  .prod-img{ height:150px; background:linear-gradient(135deg,var(--bg-cream),var(--maple-100)); display:flex; align-items:center; justify-content:center; font-size:46px; position:relative; }
  .prod-img img{ width:100%; height:100%; object-fit:cover; }
  .prod-card-body{ padding:15px 16px; flex:1; display:flex; flex-direction:column; }
  .prod-card-body .pc-cat{ font-size:11px; color:var(--maple); font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
  .prod-card-body .pc-name{ font-size:15px; font-weight:600; color:var(--green-900); margin-top:4px; line-height:1.3; }
  .prod-card-body .pc-cn{ font-size:12.5px; color:var(--text-3); margin-top:2px; }
  .prod-card-body .pc-meta{ font-size:12.5px; color:var(--text-2); margin-top:10px; display:flex; flex-direction:column; gap:3px; }
  .prod-card-body .pc-price{ font-size:18px; font-weight:700; color:var(--green-700); margin-top:auto; padding-top:12px; }
  .prod-card-actions{ display:flex; gap:7px; padding:0 16px 15px; }
  .prod-card-actions .icon-btn{ flex:1; }
  /* 行内小缩略图(物料/原料) */
  .row-thumb{ width:38px; height:38px; border-radius:8px; background:var(--bg-cream); flex-shrink:0; overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:17px; color:var(--text-3); }
  .row-thumb img{ width:100%; height:100%; object-fit:cover; }
  /* 库存类别标签 */
  .inv-tabs{ display:flex; gap:8px; margin-bottom:22px; border-bottom:1px solid var(--border); }
  .inv-tab{
    display:flex; align-items:center; gap:7px; background:none; border:none; cursor:pointer;
    font-family:inherit; font-size:14.5px; color:var(--text-2); padding:11px 16px 13px;
    border-bottom:2.5px solid transparent; margin-bottom:-1px; transition:color .12s;
  }
  .inv-tab .cn{ font-size:12px; color:var(--text-3); }
  .inv-tab:hover{ color:var(--green-900); }
  .inv-tab.active{ color:var(--green-900); font-weight:600; border-bottom-color:var(--green-700); }
  .inv-tab.active .cn{ color:var(--green-600); }
  .inv-tab .tab-badge{ background:var(--st-red-bg); color:var(--st-red); font-size:11px; font-weight:700; border-radius:20px; padding:1px 8px; }
  .inv-row{ display:flex; align-items:center; gap:14px; padding:14px 18px; border-bottom:1px solid var(--border); }
  .inv-row:last-child{ border-bottom:none; }
  .inv-row .iv-name{ flex:1; }
  .inv-row .iv-name .en{ font-size:14px; font-weight:600; color:var(--text-1); }
  .inv-row .iv-name .cn{ font-size:12px; color:var(--text-3); }
  .inv-row .iv-stock{ text-align:right; min-width:110px; }
  .inv-row .iv-stock .num{ font-size:18px; font-weight:700; }
  .inv-row .iv-stock .unit{ font-size:11px; color:var(--text-3); }
  .inv-row .iv-bar{ width:120px; height:7px; background:var(--st-grey-bg); border-radius:5px; overflow:hidden; flex-shrink:0; }
  .inv-row .iv-bar > i{ display:block; height:100%; border-radius:5px; }
  .inv-row.ok .iv-stock .num{ color:var(--st-green); }
  .inv-row.low .iv-stock .num{ color:var(--st-red); }
  .inv-badge{ font-size:11px; font-weight:600; padding:3px 9px; border-radius:20px; white-space:nowrap; }
  .inv-badge.ok{ background:var(--st-green-bg); color:var(--st-green); }
  .inv-badge.low{ background:var(--st-red-bg); color:var(--st-red); }

  /* 进出库流水 */
  .log-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; }
  .log-row{ display:flex; align-items:center; gap:13px; padding:13px 18px; border-bottom:1px solid var(--border); }
  .log-row:last-child{ border-bottom:none; }
  .log-ic{ width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; }
  .log-ic.in{ background:var(--st-green-bg); color:var(--st-green); }
  .log-ic.out{ background:var(--st-blue-bg); color:var(--st-blue); }
  .log-body{ flex:1; }
  .log-body .m{ font-size:14px; color:var(--text-1); }
  .log-body .r{ font-size:12px; color:var(--text-3); }
  .log-qty{ font-size:15px; font-weight:700; white-space:nowrap; }
  .log-qty.in{ color:var(--st-green); }
  .log-qty.out{ color:var(--st-blue); }
  .log-time{ font-size:11.5px; color:var(--text-3); white-space:nowrap; min-width:80px; text-align:right; }

  /* 待备货订单小卡 */
  .prep-row{ display:flex; align-items:center; gap:13px; padding:13px 18px; border-bottom:1px solid var(--border); }
  .prep-row:last-child{ border-bottom:none; }
  .prep-row .pno{ font-family:"SF Mono",ui-monospace,monospace; font-weight:700; color:var(--green-900); font-size:13px; }

  /* 入库/出库简易表单(4问) */
  .form-wrap{ display:grid; grid-template-columns:1fr 300px; gap:24px; align-items:start; }
  @media(max-width:860px){ .form-wrap{ grid-template-columns:1fr; } }
  .form-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-lg); padding:26px 28px; }
  .form-card .fc-intro{ font-size:13.5px; color:var(--text-2); margin-bottom:22px; padding-bottom:18px; border-bottom:1px solid var(--border); }
  .q-block{ margin-bottom:22px; }
  .q-block .qn{ display:flex; align-items:center; gap:9px; font-size:15px; font-weight:600; color:var(--green-900); margin-bottom:10px; }
  .q-block .qn .qnum{ width:22px; height:22px; border-radius:50%; background:var(--green-100); color:var(--green-700); font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
  .q-block .qn .cn{ font-weight:400; color:var(--text-3); font-size:13px; }

  /* ===================================================================
     第6批组件:采购任务 + 物料需求 + 采购工作台
     =================================================================== */

  /* 采购任务卡片 */
  .pt-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:15px; }
  .pt-card{
    background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md);
    padding:18px 19px; display:flex; flex-direction:column; gap:13px;
  }
  .pt-card.high{ border-top:3px solid var(--st-red); }
  .pt-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
  .pt-head .pt-name{ font-size:15.5px; font-weight:600; color:var(--green-900); }
  .pt-head .pt-name .cn{ font-weight:400; color:var(--text-3); font-size:12.5px; display:block; }
  .pt-rows{ display:flex; flex-direction:column; gap:8px; }
  .pt-line{ display:flex; justify-content:space-between; gap:10px; font-size:13px; }
  .pt-line .k{ color:var(--text-3); }
  .pt-line .v{ color:var(--text-1); font-weight:500; text-align:right; }
  .pt-line .v.big{ font-size:16px; font-weight:700; color:var(--green-700); }
  .pt-orders{ display:flex; gap:6px; flex-wrap:wrap; }
  .pt-orders .otag{ font-size:11px; font-family:"SF Mono",ui-monospace,monospace; background:var(--bg-cream); border:1px solid var(--border); border-radius:6px; padding:2px 7px; color:var(--text-2); }
  .pt-foot{ display:flex; gap:8px; flex-wrap:wrap; padding-top:13px; border-top:1px solid var(--border); }
  .pt-btn{ flex:1; min-width:0; font-family:inherit; font-size:12.5px; font-weight:600; padding:9px 8px; border-radius:var(--r-sm); cursor:pointer; border:1px solid var(--border-2); background:#fff; color:var(--text-2); transition:all .12s; white-space:nowrap; }
  .pt-btn:hover{ border-color:var(--green-600); color:var(--green-700); }
  .pt-btn.go{ background:var(--green-700); color:#fff; border-color:var(--green-700); }
  .pt-btn.go:hover{ background:var(--green-900); color:#fff; }
  .pt-btn.done{ background:var(--st-green-bg); color:var(--st-green); border-color:transparent; cursor:default; }

  /* 物料需求表 */
  .needs-table .bar-cell{ display:flex; align-items:center; gap:10px; }
  .needs-table .nbar{ width:90px; height:8px; background:var(--st-grey-bg); border-radius:5px; overflow:hidden; flex-shrink:0; }
  .needs-table .nbar > i{ display:block; height:100%; }
  .gap-pos{ color:var(--st-green); font-weight:600; }
  .gap-neg{ color:var(--st-red); font-weight:700; }
  .needs-note{ background:var(--maple-100); border-radius:var(--r-md); padding:14px 18px; display:flex; gap:12px; align-items:flex-start; font-size:13px; color:var(--text-2); margin-bottom:20px; }
  .needs-note .ic{ font-size:18px; }
  .needs-note b{ color:var(--maple); }

  /* ===================================================================
     第7批组件:老板工作台 Owner Workspace — 全卡片,零表格
     =================================================================== */

  /* 经营概览大卡(6张) */
  .biz-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(165px,1fr)); gap:14px; }
  .biz-card{
    background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md);
    padding:18px 19px; cursor:pointer; transition:transform .12s, box-shadow .12s; font-family:inherit; text-align:left;
  }
  .biz-card:hover{ transform:translateY(-2px); box-shadow:0 6px 20px rgba(20,61,46,.07); }
  .biz-card .bc-top{ display:flex; align-items:center; justify-content:space-between; }
  .biz-card .bc-ic{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:19px; }
  .biz-card .bc-trend{ font-size:11.5px; font-weight:600; padding:2px 8px; border-radius:20px; }
  .biz-card .bc-val{ font-size:32px; font-weight:700; line-height:1; margin:14px 0 4px; }
  .biz-card .bc-lbl{ font-size:13px; color:var(--text-2); }
  .biz-card .bc-lbl .cn{ color:var(--text-3); font-size:11.5px; }
  .biz-card.green .bc-ic{ background:var(--green-100); color:var(--green-700); } .biz-card.green .bc-val{ color:var(--green-900); }
  .biz-card.blue .bc-ic{ background:var(--st-blue-bg); color:var(--st-blue); } .biz-card.blue .bc-val{ color:var(--st-blue); }
  .biz-card.amber .bc-ic{ background:var(--st-amber-bg); color:var(--st-amber); } .biz-card.amber .bc-val{ color:var(--st-amber); }
  .biz-card.red .bc-ic{ background:var(--st-red-bg); color:var(--st-red); } .biz-card.red .bc-val{ color:var(--st-red); }
  .biz-card.gold .bc-ic{ background:var(--maple-100); color:var(--maple); } .biz-card.gold .bc-val{ color:var(--maple); }
  .trend-up{ background:var(--st-green-bg); color:var(--st-green); }
  .trend-flat{ background:var(--st-grey-bg); color:var(--text-3); }

  /* 老板需关注:醒目横条 */
  .owner-attn{ display:flex; flex-direction:column; gap:11px; }
  .oa-card{
    border-radius:var(--r-md); padding:15px 18px; display:flex; align-items:center; gap:14px;
    cursor:pointer; font-family:inherit; text-align:left; width:100%; border:1px solid;
    transition:transform .12s;
  }
  .oa-card:hover{ transform:translateX(2px); }
  .oa-card.red{ background:var(--st-red-bg); border-color:#F0CFC6; }
  .oa-card.amber{ background:var(--maple-100); border-color:#EAD9B5; }
  .oa-card .oa-ic{ font-size:20px; }
  .oa-card .oa-body{ flex:1; }
  .oa-card .oa-body .t{ font-size:14.5px; font-weight:600; color:var(--green-900); }
  .oa-card .oa-body .d{ font-size:12.5px; color:var(--text-2); margin-top:1px; }
  .oa-card .oa-go{ font-size:18px; color:var(--text-3); }

  /* 订单健康度:横向比例条 */
  .health-bar{ display:flex; height:34px; border-radius:var(--r-sm); overflow:hidden; border:1px solid var(--border); }
  .health-seg{ display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:600; color:#fff; min-width:0; }
  .health-legend{ display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; }
  .hl-item{ display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--text-2); }
  .hl-item .dot{ width:10px; height:10px; border-radius:3px; }

  /* 风险两列 */
  .risk-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); padding:18px 20px; }
  .risk-card .rc-h{ font-size:14px; font-weight:600; color:var(--green-900); margin-bottom:13px; display:flex; align-items:center; gap:8px; }
  .risk-card .rc-h .cn{ font-weight:400; color:var(--text-3); font-size:12px; }
  .risk-item{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--border); font-size:13px; }
  .risk-item:last-child{ border-bottom:none; }
  .risk-item .ri-dot{ width:8px; height:8px; border-radius:50%; flex-shrink:0; margin-right:9px; }

  /* 快速查看入口 */
  .review-links{ display:flex; gap:11px; flex-wrap:wrap; }
  .review-chip{
    display:flex; align-items:center; gap:9px; background:var(--bg-card); border:1px solid var(--border);
    border-radius:var(--r-sm); padding:12px 17px; cursor:pointer; font-family:inherit; font-size:13.5px; color:var(--text-1);
    transition:border-color .12s, transform .12s;
  }
  .review-chip:hover{ border-color:var(--green-600); transform:translateY(-1px); }
  .review-chip .cn{ color:var(--text-3); font-size:11.5px; }

  /* ===================================================================
     第8批组件:合作方入口 Partner Portal — 隔离最强,脱敏最严
     =================================================================== */

  /* 外部用户横幅 */
  .partner-banner{
    background:linear-gradient(120deg, var(--green-700), var(--green-900));
    border-radius:var(--r-lg); padding:24px 26px; color:#fff; margin-bottom:26px;
  }
  .partner-banner .pb-t{ font-size:20px; font-weight:600; }
  .partner-banner .pb-d{ font-size:13.5px; opacity:.85; margin-top:5px; }

  /* 产品目录预览(卡片网格,无价格内部字段) */
  .catalog-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:15px; }
  .cat-card{
    background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md);
    overflow:hidden; transition:transform .12s, box-shadow .12s;
  }
  .cat-card:hover{ transform:translateY(-2px); box-shadow:0 6px 20px rgba(20,61,46,.07); }
  .cat-thumb{ height:120px; background:linear-gradient(135deg, var(--bg-cream), var(--maple-100)); display:flex; align-items:center; justify-content:center; font-size:42px; }
  .cat-body{ padding:15px 16px; }
  .cat-body .cat-cat{ font-size:11px; color:var(--maple); font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
  .cat-body .cat-name{ font-size:14.5px; font-weight:600; color:var(--green-900); margin-top:4px; line-height:1.3; }
  .cat-body .cat-cn{ font-size:12px; color:var(--text-3); margin-top:2px; }
  .cat-specs{ display:flex; flex-direction:column; gap:5px; margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
  .cat-specs .cs-row{ display:flex; justify-content:space-between; font-size:12px; }
  .cat-specs .cs-row .k{ color:var(--text-3); }
  .cat-specs .cs-row .v{ color:var(--text-1); font-weight:500; }
  .cat-price{ font-size:17px; font-weight:700; color:var(--green-700); margin-top:12px; }

  /* 发货状态说明 */
  .ship-guide{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:11px; }
  .sg-step{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); padding:14px 15px; text-align:center; }
  .sg-step .sg-dot{ width:30px; height:30px; border-radius:50%; margin:0 auto 9px; display:flex; align-items:center; justify-content:center; font-size:14px; color:#fff; }
  .sg-step .sg-t{ font-size:13px; font-weight:600; color:var(--text-1); }
  .sg-step .sg-cn{ font-size:11.5px; color:var(--text-3); }

  /* 联系方式 */
  .contact-card{ background:var(--bg-cream); border-radius:var(--r-md); padding:20px 24px; display:flex; gap:30px; flex-wrap:wrap; }
  .contact-card .ct-item .k{ font-size:11.5px; color:var(--text-3); text-transform:uppercase; letter-spacing:.04em; }
  .contact-card .ct-item .v{ font-size:14.5px; color:var(--green-900); font-weight:600; margin-top:3px; }

  /* ===================================================================
     第9批组件:配置三页 + 库存 + 库存动态
     =================================================================== */

  /* Admin 提示条 */
  .admin-note{ display:flex; align-items:center; gap:10px; background:var(--st-amber-bg); border:1px solid #EAD9B5; border-radius:var(--r-sm); padding:11px 16px; margin-bottom:22px; font-size:13px; color:#7A5A14; }
  .admin-note .ic{ font-size:16px; }

  /* 配方卡 */
  .recipe-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); margin-bottom:15px; overflow:hidden; }
  .recipe-head{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px; background:var(--bg-cream); border-bottom:1px solid var(--border); }
  .recipe-head .rh-name{ font-size:15px; font-weight:600; color:var(--green-900); }
  .recipe-head .rh-name .cn{ font-weight:400; color:var(--text-3); font-size:12.5px; display:block; }
  .recipe-formula{ padding:8px 20px 16px; }
  .recipe-formula .rf-intro{ font-size:12.5px; color:var(--text-3); padding:10px 0; }
  .rf-row{ display:flex; align-items:center; justify-content:space-between; padding:11px 0; border-bottom:1px solid var(--border); font-size:13.5px; }
  .rf-row:last-child{ border-bottom:none; }
  .rf-row .rf-mat{ color:var(--text-1); display:flex; align-items:center; gap:9px; }
  .rf-row .rf-mat .cn{ color:var(--text-3); font-size:11.5px; }
  .rf-row .rf-qty{ font-weight:600; color:var(--green-700); }
  .rf-dot{ width:7px; height:7px; border-radius:50%; background:var(--maple); }

  /* 供应商卡 */
  .sup-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:15px; }
  .sup-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); padding:18px 20px; }
  .sup-card .sup-name{ font-size:15px; font-weight:600; color:var(--green-900); margin-bottom:13px; }
  .sup-line{ display:flex; justify-content:space-between; font-size:13px; padding:6px 0; }
  .sup-line .k{ color:var(--text-3); }
  .sup-line .v{ color:var(--text-1); font-weight:500; }
  .sup-supplies{ margin-top:11px; padding-top:11px; border-top:1px solid var(--border); }
  .sup-supplies .k{ font-size:11.5px; color:var(--text-3); text-transform:uppercase; letter-spacing:.04em; margin-bottom:7px; }
  .sup-tag{ display:inline-block; font-size:11.5px; background:var(--green-100); color:var(--green-700); border-radius:6px; padding:3px 9px; margin:0 5px 5px 0; }

  /* 完整产品目录表 */
  .price-col{ color:var(--maple); font-weight:600; }

  /* 法律文书卡片 */
  .legal-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); gap:16px; }
  .legal-card{ background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-md); padding:18px 19px; position:relative; }
  .legal-card.expired{ border-left:4px solid var(--st-red); }
  .legal-card.soon{ border-left:4px solid var(--st-amber); }
  .legal-card.active{ border-left:4px solid var(--st-green); }
  .legal-top{ display:flex; align-items:flex-start; gap:12px; margin-bottom:14px; }
  .legal-icon{ width:42px; height:42px; border-radius:10px; background:var(--bg-cream); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; overflow:hidden; }
  .legal-icon img{ width:100%; height:100%; object-fit:cover; }
  .legal-name{ font-size:14.5px; font-weight:600; color:var(--green-900); line-height:1.3; }
  .legal-type{ font-size:11.5px; color:var(--maple); font-weight:600; margin-top:3px; }
  .legal-meta{ display:flex; flex-direction:column; gap:7px; }
  .lm-row{ display:flex; justify-content:space-between; gap:10px; font-size:12.5px; }
  .lm-row .k{ color:var(--text-3); }
  .lm-row .v{ color:var(--text-1); text-align:right; }
  .legal-actions{ display:flex; gap:7px; justify-content:flex-end; margin-top:14px; padding-top:12px; border-top:1px solid var(--border); }
  /* 报销详情 */
  .rb-detail{ display:flex; flex-direction:column; gap:10px; background:var(--bg-cream); border-radius:var(--r-md); padding:15px 17px; }
  .rb-detail .lm-row{ font-size:13.5px; }
  /* 文件附件块 */
  .file-attach{ display:flex; align-items:center; gap:11px; background:var(--bg-cream); border:1px solid var(--border-2); border-radius:var(--r-md); padding:13px 16px; text-decoration:none; color:var(--text-1); transition:background .12s; }
  .file-attach:hover{ background:#EFEADD; }
  .file-attach .fa-ic{ font-size:22px; }
  .file-attach .fa-name{ flex:1; font-size:13.5px; font-weight:600; color:var(--green-900); word-break:break-all; }
  .file-attach .fa-dl{ font-size:12px; color:var(--green-700); font-weight:600; white-space:nowrap; }
  .file-ic{ font-size:20px; }
  .legal-file{ margin-top:12px; }
  .legal-file .no-file{ font-size:12px; color:var(--text-3); background:var(--bg-cream); border-radius:var(--r-sm); padding:9px 13px; }

  /* ===================================================================
     移动端适配 / MOBILE — 窄屏时导航变抽屉
     =================================================================== */
  @media(max-width:720px){
    .hamburger{ display:flex; }
    /* 导航变成从左滑出的抽屉 */
    .rail{
      position:fixed; top:0; left:0; z-index:50;
      transform:translateX(-100%); transition:transform .22s ease;
      box-shadow:4px 0 24px rgba(0,0,0,.12);
    }
    .rail.open{ transform:translateX(0); }
    /* 顶栏更紧凑 */
    .topbar{ padding:12px 16px; }
    .canvas{ padding:20px 16px 50px; }
    .page-head h1{ font-size:21px; }
    /* 角色切换器收窄 */
    .role-switch .demo-tag{ display:none; }
    .role-select{ font-size:13px; padding:7px 30px 7px 11px; max-width:150px; }
    /* 返回键在窄屏只留箭头,省空间 */
    .back-btn .cn{ display:none; }
    /* 各种网格在手机上单列 */
    .big-actions, .wh-actions, .attn-grid, .ops-metrics, .biz-grid, .prod-grid, .sup-grid, .catalog-grid, .pt-grid{ grid-template-columns:1fr !important; }
    .status-overview{ overflow-x:auto; }
    /* 表格可横向滚动,不挤压 */
    .list-card{ overflow-x:auto; }
    .otable{ min-width:560px; }
  }