*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;background:#F1F5F9;color:#1E293B;font-size:14px;line-height:1.6}
.app{display:flex;min-height:100vh}
.sidebar{width:216px;background:#0C447C;color:#fff;flex-shrink:0;display:flex;flex-direction:column}
.logo{padding:20px 18px;border-bottom:1px solid rgba(255,255,255,.15)}
.logo b{font-size:15px;font-weight:500;display:block}
.logo span{font-size:11px;color:#B5D4F4}
.nav{padding:12px 0;flex:1}
.nav-item{padding:10px 18px;font-size:13px;color:#CFE3F7;cursor:pointer;border-left:3px solid transparent}
.nav-item:hover{background:rgba(255,255,255,.08);color:#fff}
.nav-item.on{background:rgba(255,255,255,.14);color:#fff;border-left-color:#5DCAA5;font-weight:500}
.sidebar .foot{padding:14px 18px;font-size:11px;color:#85B7EB;border-top:1px solid rgba(255,255,255,.15)}
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.topbar{background:#fff;border-bottom:1px solid #E2E8F0;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.roles{display:flex;gap:6px;background:#F1F5F9;padding:4px;border-radius:10px}
.role{padding:7px 14px;border-radius:7px;font-size:12.5px;cursor:pointer;color:#475569;white-space:nowrap;border:none;background:none;font-family:inherit}
.role.on{background:#fff;color:#0C447C;font-weight:500;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.role.on[data-r="customer"]{color:#185FA5}
.role.on[data-r="supplier"]{color:#854F0B}
.content{padding:22px 24px;overflow:auto}
h1{font-size:19px;font-weight:500;margin-bottom:4px}
h2{font-size:15px;font-weight:500;margin:22px 0 12px}
h3{font-size:13.5px;font-weight:500;margin-bottom:8px}
.sub{font-size:12.5px;color:#64748B;margin-bottom:18px}
.card{background:#fff;border:1px solid #E2E8F0;border-radius:10px;padding:16px;margin-bottom:14px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.kpi{background:#fff;border:1px solid #E2E8F0;border-radius:10px;padding:15px 16px}
.kpi .lab{font-size:12px;color:#64748B}
.kpi .val{font-size:24px;font-weight:500;margin-top:4px;letter-spacing:-.5px}
.kpi .hint{font-size:11.5px;color:#94A3B8;margin-top:2px}
.up{color:#C0392B}.down{color:#1D9E75}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;padding:9px 10px;background:#F8FAFC;color:#475569;font-weight:500;font-size:12px;border-bottom:1px solid #E2E8F0;white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid #F1F5F9;vertical-align:middle}
tr:last-child td{border-bottom:none}
.num{text-align:right;font-variant-numeric:tabular-nums}
.tag{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:500}
.t-blue{background:#E6F1FB;color:#185FA5}
.t-teal{background:#E1F5EE;color:#0F6E56}
.t-amber{background:#FAEEDA;color:#854F0B}
.t-red{background:#FCEBEB;color:#A32D2D}
.t-gray{background:#F1EFE8;color:#5F5E5A}
.t-green{background:#EAF3DE;color:#3B6D11}
.btn{background:#185FA5;color:#fff;border:none;padding:8px 15px;border-radius:7px;font-size:13px;cursor:pointer;font-family:inherit}
.btn:hover{background:#0C447C}
.btn.ghost{background:#fff;color:#334155;border:1px solid #CBD5E1}
.btn.ghost:hover{background:#F8FAFC}
.btn.sm{padding:5px 11px;font-size:12px}
.btn.teal{background:#0F6E56}.btn.teal:hover{background:#085041}
.btn.amber{background:#BA7517}.btn.amber:hover{background:#854F0B}
.btn:disabled{background:#CBD5E1;cursor:default}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.lock{display:inline-flex;align-items:center;gap:5px;background:#FCEBEB;color:#A32D2D;padding:2px 8px;border-radius:6px;font-size:11.5px;font-weight:500}
.masked{background:#F1EFE8;color:#888780;padding:1px 7px;border-radius:5px;font-size:12px;font-family:ui-monospace,Consolas,monospace}
.eye{background:#EAF3DE;color:#3B6D11;padding:1px 7px;border-radius:5px;font-size:11.5px}
.note{background:#FAEEDA;border:1px solid #EF9F27;border-radius:9px;padding:11px 14px;font-size:12.5px;color:#633806;margin-bottom:14px}
.note.b{background:#E6F1FB;border-color:#85B7EB;color:#0C447C}
.note.g{background:#E1F5EE;border-color:#5DCAA5;color:#085041}
.cmp{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cmp .col{background:#fff;border:1px solid #E2E8F0;border-radius:10px;overflow:hidden}
.cmp .hd{padding:11px 14px;font-size:13px;font-weight:500;color:#fff}
.cmp .hd span{display:block;font-size:11px;font-weight:400;opacity:.85}
.cmp .bd{padding:14px}
.cmp .fld{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px dashed #F1F5F9;font-size:12.5px}
.cmp .fld:last-child{border-bottom:none}
.cmp .fld .k{color:#64748B;flex-shrink:0}
.cmp .fld .v{text-align:right;font-weight:500}
.hd-c{background:#185FA5}.hd-a{background:#0F6E56}.hd-s{background:#BA7517}
.banner{background:linear-gradient(90deg,#0C447C,#185FA5);color:#fff;border-radius:10px;padding:18px 20px;margin-bottom:16px}
.banner h3{font-size:15px;margin-bottom:3px}
.banner p{font-size:12.5px;color:#CFE3F7}
ul.tight{margin:6px 0 0 18px;font-size:12.5px;color:#475569}
ul.tight li{margin:3px 0}
.ai-box{border:1.5px dashed #85B7EB;background:#F8FBFF;border-radius:10px;padding:14px}
.ai-res{background:#fff;border:1px solid #E2E8F0;border-radius:8px;padding:12px;margin-top:12px}
.ai-res .kv{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px dashed #F1F5F9;font-size:12.5px}
.ai-res .kv:last-child{border:none}
.tooth{background:#F8FAFC;border:1px solid #E2E8F0;border-radius:8px;padding:12px;display:inline-block}
.steps{display:flex;gap:0;margin:10px 0 4px;flex-wrap:wrap}
.step{display:flex;align-items:center;font-size:12px;color:#475569}
.step i{width:22px;height:22px;border-radius:50%;background:#E2E8F0;color:#64748B;font-style:normal;display:flex;align-items:center;justify-content:center;font-size:11px;margin-right:6px}
.step.done i{background:#0F6E56;color:#fff}
.step.cur i{background:#185FA5;color:#fff}
.step .ln{width:26px;height:1px;background:#CBD5E1;margin:0 8px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#0C447C;color:#fff;padding:11px 20px;border-radius:8px;font-size:13px;z-index:99;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.langtabs{display:flex;gap:4px;margin-bottom:10px}
.langtabs button{padding:5px 13px;border:1px solid #CBD5E1;background:#fff;border-radius:7px;font-size:12.5px;cursor:pointer;font-family:inherit;color:#475569}
.langtabs button.on{background:#185FA5;color:#fff;border-color:#185FA5}
.doc{background:#fff;border:1px solid #CBD5E1;border-radius:8px;padding:18px;font-size:12.5px}
.doc .dh{display:flex;justify-content:space-between;border-bottom:2px solid #0C447C;padding-bottom:8px;margin-bottom:10px}
.doc .dh b{font-size:14px}
.doc table{font-size:12px}
.mono{font-family:ui-monospace,Consolas,monospace;font-size:12px}
.warnrow{background:#FEF6F6}
.inp{width:100%;padding:7px 10px;border:1px solid #CBD5E1;border-radius:7px;font-size:13px;font-family:inherit;background:#fff;color:#1E293B}
.inp:focus{outline:none;border-color:#185FA5}
.lbl{font-size:12px;color:#475569;margin-bottom:4px;display:block}
.fg{margin-bottom:12px}
.empty{text-align:center;padding:40px;color:#94A3B8;font-size:13px}
.bar{height:8px;background:#E2E8F0;border-radius:4px;overflow:hidden}
.bar i{display:block;height:100%;background:#185FA5}
/* ---- 以上照搬客户原型，以下是平台补充 ---- */
a{color:#185FA5;text-decoration:none}a:hover{text-decoration:underline}
.sidebar .who{padding:12px 18px;font-size:12px;color:#CFE3F7;border-top:1px solid rgba(255,255,255,.15)}
.sidebar .who a{color:#fff}
.sidebar.cust{background:#185FA5}.sidebar.sup{background:#633806}
.nav-item a{color:inherit;display:block}
.nav-item a:hover{text-decoration:none}
.msgs{list-style:none;margin-bottom:14px}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:12px;font-size:13px;background:#E1F5EE;color:#085041;border:1px solid #5DCAA5}
.flash.warning{background:#FAEEDA;color:#854F0B;border-color:#EF9F27}
.flash.error{background:#FCEBEB;color:#A32D2D;border-color:#F09595}
.late-overdue{background:#FEF0F0}.late-overdue td:first-child{border-left:3px solid #C0392B}
.late-soon{background:#FFF8EC}.late-soon td:first-child{border-left:3px solid #BA7517}
.due-overdue{color:#C0392B;font-weight:500}.due-soon{color:#BA7517;font-weight:500}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:12px}
.filters .inp{width:auto;min-width:120px}
.tablewrap{overflow-x:auto}
.kv{display:grid;grid-template-columns:110px 1fr;gap:4px 10px;font-size:13px}
.kv .k{color:#64748B}
.chat{display:flex;flex-direction:column;gap:10px;max-height:460px;overflow-y:auto;padding:4px}
.bubble{max-width:78%;padding:9px 12px;border-radius:10px;font-size:13px;white-space:pre-wrap;word-break:break-word}
.bubble.me{align-self:flex-end;background:#E6F1FB}
.bubble.them{align-self:flex-start;background:#F1F5F9}
.bubble .meta{font-size:11px;color:#94A3B8;margin-bottom:3px}
.bubble img{max-width:220px;max-height:220px;border-radius:6px;display:block;margin-top:6px}
.itemrow{display:grid;grid-template-columns:2fr 1.3fr 1fr .7fr .6fr auto;gap:6px;margin-bottom:6px;align-items:center}
.tooth-svg rect{cursor:default}.tooth-svg.editable rect{cursor:pointer}
.tooth-svg{max-width:100%;height:auto}
.upl{border:1.5px dashed #85B7EB;background:#F8FBFF;border-radius:10px;padding:14px;text-align:center}
.upl-list{margin-top:10px;text-align:left;font-size:12.5px}
.upl-list .bar{margin-top:3px}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.login{width:100%;max-width:380px}
.langsw{display:flex;gap:6px;font-size:12px}
.langsw button,.langsw a{border:1px solid #CBD5E1;background:#fff;border-radius:6px;padding:3px 9px;cursor:pointer;color:#475569;font-family:inherit;font-size:12px}
.langsw .on{background:#185FA5;color:#fff;border-color:#185FA5}
.menu-btn{display:none}
.errorlist{color:#A32D2D;font-size:12px;list-style:none}
form p{margin-bottom:10px}
form p label{display:block;font-size:12px;color:#475569;margin-bottom:3px}
form p input,form p select,form p textarea{width:100%;padding:7px 10px;border:1px solid #CBD5E1;border-radius:7px;font-size:13px;font-family:inherit}
.helptext{font-size:11.5px;color:#94A3B8}
@media (max-width:760px){
  .app{flex-direction:column}
  .sidebar{width:100%;flex-direction:row;flex-wrap:wrap;align-items:center}
  .logo{padding:10px 14px;border:none;flex:1}
  .logo span{display:none}
  .menu-btn{display:block;background:none;border:1px solid rgba(255,255,255,.4);color:#fff;border-radius:6px;padding:5px 10px;margin-right:12px;font-family:inherit}
  .nav,.sidebar .who{display:none;width:100%}
  .sidebar.open .nav,.sidebar.open .who{display:block}
  .sidebar .foot{display:none}
  .content{padding:14px 16px}
  .topbar{padding:10px 16px}
  .g2,.g3,.g4,.cmp{grid-template-columns:1fr}
  .g4.kpis{grid-template-columns:1fr 1fr}
  .itemrow{grid-template-columns:1fr 1fr}
  .kv{grid-template-columns:96px 1fr}
  .bubble{max-width:92%}
  table.stack thead{display:none}
  table.stack tr{display:block;border-bottom:1px solid #E2E8F0;padding:6px 0}
  table.stack td{display:flex;justify-content:space-between;gap:10px;border:none;padding:4px 10px;text-align:right}
  table.stack td::before{content:attr(data-l);color:#64748B;font-size:12px;text-align:left;flex-shrink:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;font-weight:400}
  table.stack td.num{text-align:right}
}
h1.mono,h1 .mono{font-size:19px}
@media (max-width:760px){table.stack td.hide-m{display:none}}
@media (max-width:760px){.tooth-svg.editable{min-width:530px;max-width:none}}
/* ---- 09-29 对齐原型 ---- */
.grid.kpis{margin-bottom:14px}
.kpi .val2{font-size:17px;margin-top:0;color:#475569}
.kpi .hint a{color:inherit}.kpi .hint a.up{color:#C0392B}
.statbar{display:grid;grid-template-columns:84px 1fr 32px;gap:10px;align-items:center;padding:4px 0;font-size:13px;color:inherit}
.statbar:hover{text-decoration:none;background:#F8FAFC}
.statbar .k{color:#475569}.statbar .n{text-align:right;font-variant-numeric:tabular-nums}
.tag{white-space:nowrap}
td a.mono,td .mono{white-space:nowrap}
input[type=file]{font-size:12.5px;font-family:inherit;color:#64748B;max-width:100%}
input[type=file]::file-selector-button{background:#fff;color:#334155;border:1px solid #CBD5E1;padding:6px 13px;border-radius:7px;font-size:12.5px;font-family:inherit;cursor:pointer;margin-right:8px}
input[type=file]::file-selector-button:hover{background:#F8FAFC}
.kv.wide{grid-template-columns:170px 1fr}
.pm td{padding:6px 10px}.pm input{width:84px;text-align:right;padding:5px 8px;border:1px solid #CBD5E1;border-radius:6px;font-size:13px;font-family:inherit}
.pm th.num,.pm td.num{text-align:right}.pm .none{color:#CBD5E1}
.pbar{width:90px;display:inline-block;vertical-align:middle}
@media (max-width:760px){.kv.wide{grid-template-columns:120px 1fr}.statbar{grid-template-columns:84px 1fr 28px}}
.btn,td.mono,td .masked,td.due-overdue,td.due-soon,td .due-overdue,td .due-soon{white-space:nowrap}
@media (max-width:640px){.pm th:first-child,.pm td:first-child{position:sticky;left:0;z-index:1;background:#fff;min-width:118px!important;max-width:130px;box-shadow:1px 0 0 #E2E8F0}.pm thead th:first-child{background:#F8FAFC}.pm input{width:72px}}