/* ===== 10-client-portal.css —— 客户端门户 / 抽屉遮罩（源自原型 V2.10，行区间 793-890） ===== */
  /* ===== Client portal ===== */
  #screen-client{min-height:100vh;background:var(--canvas);}
  .client-top{
    background:#fff;border-bottom:1px solid var(--topbar-border);
    display:flex;align-items:center;gap:14px;padding:0 24px;height:64px;
    position:sticky;top:0;z-index:50;
  }
  .client-logo{display:flex;align-items:center;gap:10px;}
  .client-logo svg{width:26px;height:26px;}
  .client-logo .n{font:700 17px/1.2 var(--font-cn);color:var(--text-strong);}
  .client-logo .s{font:400 11px/1.4 var(--font-cn);color:var(--text-meta);}
  .client-top .spacer{flex:1;}
  .client-exit{
    height:38px;border:1px solid var(--border);border-radius:9px;background:#fff;
    color:var(--text-label);cursor:pointer;padding:0 16px;font:500 13px/1 var(--font-cn);
    display:flex;align-items:center;gap:7px;white-space:nowrap;
  }
  .client-exit:hover{border-color:var(--danger);color:var(--danger);}
  .client-exit svg{width:15px;height:15px;stroke:currentColor;}
  .client-wrap{max-width:920px;margin:0 auto;padding:28px 20px 60px;display:flex;flex-direction:column;gap:20px;}
  .client-hello{
    background:var(--banner-grad);border-radius:var(--radius-lg);color:#fff;
    padding:26px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  }
  .client-hello .h1{font:700 20px/1.4 var(--font-cn);color:#fff;}
  .client-hello .h2{font:400 13px/1.7 var(--font-cn);color:var(--text-onnavy);margin-top:4px;}
  .client-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:22px;}
  .cc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
  .cc-title{font:700 16px/1.3 var(--font-cn);color:var(--text-strong);}
  .cc-sub{font:400 12px/1.6 var(--font-cn);color:var(--text-meta);}
  .stepper{display:flex;align-items:flex-start;margin:8px 0 4px;}
  .st-node{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;position:relative;min-width:0;}
  .st-dot{
    width:30px;height:30px;border-radius:999px;background:#EEF1F6;color:var(--text-meta);
    display:flex;align-items:center;justify-content:center;font:600 12px/1 var(--font-cn);
    position:relative;z-index:1;border:2px solid #EEF1F6;
  }
  .st-node.done .st-dot{background:#E4F4EA;color:#2E9E5B;border-color:#E4F4EA;}
  .st-node.active .st-dot{background:var(--gold-tint);color:#A8821F;border-color:var(--gold);animation:pulse 1.4s ease-in-out infinite;}
  .st-node.active .st-dot svg{width:14px;height:14px;stroke:#A8821F;}
  .st-node.done .st-dot svg{width:14px;height:14px;stroke:#2E9E5B;}
  .st-label{font:500 12px/1.3 var(--font-cn);color:var(--text-meta);text-align:center;}
  .st-node.done .st-label{color:var(--text-body);}
  .st-node.active .st-label{color:#A8821F;font-weight:600;}
  .st-node::before{content:"";position:absolute;top:15px;left:calc(-50% + 16px);right:calc(50% + 16px);height:2px;background:#EEF1F6;}
  .st-node:first-child::before{display:none;}
  .st-node.done::before{background:#BFE5CC;}
  .client-note{
    margin-top:14px;background:#F7F9FC;border:1px solid var(--border);border-radius:10px;
    padding:13px 16px;font:400 13px/1.7 var(--font-cn);color:var(--text-body);
  }
  .client-dyn{display:flex;flex-direction:column;}
  .cd-item{display:flex;gap:12px;padding:10px 0;position:relative;}
  .cd-item:not(:last-child){border-bottom:1px dashed #EEF1F6;}
  .cd-date{font:500 12px/1.4 var(--font-num);color:var(--text-label);flex:none;width:78px;font-variant-numeric:tabular-nums;}
  .cd-text{font:400 13px/1.6 var(--font-cn);color:var(--text-body);flex:1;}
  .doc-confirm{
    border:1px solid #E3D4B4;background:#FCF7F2;border-radius:12px;padding:16px;
    display:flex;flex-direction:column;gap:12px;
  }
  .doc-confirm.confirmed{border-color:#CDEBD7;background:#F4FBF6;}
  .dc-name{font:600 14px/1.4 var(--font-cn);color:var(--text-strong);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
  .dc-desc{font:400 13px/1.7 var(--font-cn);color:var(--text-body);}
  .dc-actions{display:flex;gap:10px;flex-wrap:wrap;}
  .fee-row{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:12px;}
  .fee-row + .fee-row{border-top:1px solid #F2F3F7;}
  .fee-l{display:flex;flex-direction:column;gap:2px;}
  .fee-name{font:500 13px/1.3 var(--font-cn);color:var(--text-body);}
  .fee-meta{font:400 12px/1.4 var(--font-cn);color:var(--text-meta);}
  .fee-amt{font:600 14px/1 var(--font-num);color:var(--text-strong);font-variant-numeric:tabular-nums;white-space:nowrap;}
  .fee-total{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);margin-top:4px;padding-top:12px;}
  .fee-total .t{font:600 14px/1 var(--font-cn);color:var(--text-strong);}
  .fee-total .a{font:700 20px/1 var(--font-num);color:#C26A0E;font-variant-numeric:tabular-nums;}
  .lawyer-row{display:flex;align-items:center;gap:14px;}
  .lawyer-avatar{width:52px;height:52px;border-radius:999px;flex:none;background:var(--sidebar-grad);color:var(--gold-soft);display:flex;align-items:center;justify-content:center;font:700 18px/1 var(--font-cn);}
  .lawyer-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
  .lawyer-name{font:700 15px/1.3 var(--font-cn);color:var(--text-strong);}
  .lawyer-meta{font:400 12px/1.5 var(--font-cn);color:var(--text-meta);}
  .msg-list{display:flex;flex-direction:column;gap:12px;margin-bottom:14px;max-height:280px;overflow-y:auto;}
  .msg{display:flex;gap:10px;max-width:86%;}
  .msg .m-av{width:32px;height:32px;border-radius:999px;flex:none;display:flex;align-items:center;justify-content:center;font:600 12px/1 var(--font-cn);}
  .msg.client .m-av{background:var(--gold);color:var(--navy-800);}
  .msg.lawyer .m-av{background:var(--sidebar-grad);color:var(--gold-soft);}
  .m-body{display:flex;flex-direction:column;gap:4px;}
  .m-text{font:400 13px/1.6 var(--font-cn);color:var(--text-body);background:#F4F6FA;border-radius:2px 12px 12px 12px;padding:10px 14px;white-space:pre-wrap;word-break:break-word;}
  .msg.client .m-text{background:var(--gold-tint);border-radius:12px 2px 12px 12px;}
  .m-time{font:400 11px/1 var(--font-num);color:var(--text-meta);}
  .msg-input-row{display:flex;gap:10px;}
  .msg-input-row input{
    flex:1;height:44px;border:1px solid var(--border);border-radius:10px;padding:0 14px;
    font:400 15px/1 var(--font-cn);color:var(--text-body);min-width:0;
  }
  .msg-input-row input:focus{outline:none;border-color:var(--gold);}

  /* ===== Drawer mask (mobile) ===== */
  .drawer-mask{position:fixed;inset:0;background:rgba(7,27,49,.45);z-index:75;display:none;}
  .drawer-mask.show{display:block;}