:root {
  --ink: #25345a;
  --muted: #72809f;
  --paper: #f3f7ff;
  --card: #ffffff;
  --line: #dfe7f4;
  --green: #4f7df3;
  --green-2: #6c63df;
  --mint: #e8efff;
  --gold: #f0a33a;
  --gold-soft: #fff2dc;
  --red: #b85449;
  --red-soft: #f8e7e3;
  --blue: #4f7df3;
  --blue-soft: #e9f0ff;
  --shadow: 0 14px 38px rgba(70,92,145,.10);
  font-family: "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--paper); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.auth-hidden { display: none !important; }
.login-screen { min-height: 100vh; padding: 28px 5vw 45px; color: #25345a; background: radial-gradient(circle at 12% 18%,#d7e7ff 0,transparent 34%),radial-gradient(circle at 82% 78%,#eadfff 0,transparent 32%),linear-gradient(135deg,#f8fbff 0%,#edf4ff 50%,#f6f1ff 100%); }
.login-brand { display:flex; align-items:center; gap:12px; max-width:1180px; margin:0 auto; }
.login-brand strong,.login-brand span { display:block; }
.login-brand strong { font-size:16px; letter-spacing:.05em; }
.login-brand span { margin-top:3px; color:#7e8dab; font-size:10px; }
.login-layout { display:grid; grid-template-columns:1.15fr .75fr; gap:80px; align-items:center; width:min(1180px,100%); min-height:calc(100vh - 100px); margin:0 auto; }
.login-intro { max-width:650px; }
.login-eyebrow { color:#6c63df; font-size:10px; letter-spacing:.16em; }
.login-intro h1 { margin:18px 0; font-size:42px; line-height:1.3; font-weight:590; }
.login-intro p { max-width:610px; color:#68799d; font-size:13px; line-height:2; }
.login-rule { display:flex; gap:14px; max-width:560px; margin-top:30px; padding:16px 18px; border:1px solid #d9e4f7; border-radius:12px; background:rgba(255,255,255,.62); box-shadow:0 10px 30px rgba(83,105,160,.07); }
.login-rule b { white-space:nowrap; color:#5b65c8; font-size:11px; }
.login-rule span { color:#7483a3; font-size:10px; line-height:1.6; }
.login-card { padding:30px; border:1px solid rgba(255,255,255,.9); border-radius:20px; color:var(--ink); background:rgba(255,255,255,.94); box-shadow:0 28px 75px rgba(77,99,156,.18); }
.login-card-head span { color:var(--gold); font-size:9px; letter-spacing:.12em; }
.login-card-head h2 { margin:6px 0 24px; font-size:21px; }
.login-method { padding:17px; border:1px solid var(--line); border-radius:13px; background:white; }
.login-method-title { display:flex; align-items:center; gap:11px; }
.login-method-title b,.login-method-title small { display:block; }
.login-method-title b { font-size:12px; }
.login-method-title small { margin-top:4px; color:var(--muted); font-size:9px; }
.login-method-icon { display:grid; place-items:center; width:37px; height:37px; border-radius:10px; color:white; background:var(--green); font-weight:700; }
.login-method-icon.wechat { background:#2eaa60; }
.demo-account { display:grid; gap:5px; margin:15px 0 10px; }
.demo-account span { color:var(--muted); font-size:9px; }
.demo-account select { width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:#faf9f5; outline:none; }
.login-button { width:100%; min-height:42px; border-radius:9px; font-size:11px; font-weight:700; }
.login-button.primary { border:0; color:white; background:var(--green); }
.login-button.secondary { border:1px solid #a9c8ff; color:#3f6ed1; background:#f0f6ff; }
.partner-channel-note { display:flex; align-items:center; gap:11px; margin-top:15px; padding:14px 16px; border:1px solid #dce7f5; border-radius:12px; background:#f7faff; }
.partner-channel-note b,.partner-channel-note small { display:block; }
.partner-channel-note b { color:#35456c; font-size:11px; }
.partner-channel-note small { margin-top:4px; color:var(--muted); font-size:9px; line-height:1.55; }
.login-divider { position:relative; margin:15px 0; color:#9da7a3; font-size:9px; text-align:center; }
.login-divider::before { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--line); }
.login-divider span { position:relative; padding:0 10px; background:var(--card); }
.login-footnote { margin:16px 3px 0; color:#8a9692; font-size:8px; line-height:1.6; }
.account-button { display:grid; grid-template-columns:auto auto; column-gap:5px; align-items:center; padding:5px 9px; border:0; border-radius:9px; color:var(--ink); background:transparent; text-align:right; }
.account-button:hover { background:rgba(79,125,243,.08); }
.account-button span { grid-column:1/-1; color:var(--muted); font-size:8px; }
.account-button strong { font-size:11px; }
.account-button small { color:var(--red); font-size:8px; opacity:0; transition:.18s; }
.account-button:hover small { opacity:1; }
.app-shell { display: grid; grid-template-columns: 248px 1fr; min-height: 100vh; }
.sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 30; width: 248px;
  display: flex; flex-direction: column; padding: 25px 17px;
  color: var(--ink); background: linear-gradient(180deg,#f8fbff 0%,#eef3ff 100%); border-right:1px solid #dce6f5;
}
.brand { display: flex; align-items: center; gap: 12px; padding: 0 9px 22px; }
.brand-mark {
  display: grid; place-items: center; width: 43px; height: 43px;
  border: 1px solid #cbd9f2; border-radius: 13px;
  color: #5d6fd2; background: white; font-family: serif; font-size: 23px; box-shadow:0 6px 18px rgba(83,105,160,.09);
}
.brand strong,.brand span { display: block; }
.brand strong { font-size: 16px; letter-spacing: .05em; }
.brand span { margin-top: 3px; color: #8290ad; font-size: 10px; }
.workspace-switch { margin: 0 7px 18px; padding: 11px 13px; border: 1px solid #dce5f5; border-radius: 10px; background: rgba(255,255,255,.75); }
.workspace-switch span,.workspace-switch strong { display: block; }
.workspace-switch span { color: #8a97b2; font-size: 9px; }
.workspace-switch strong { margin-top: 4px; color: #35456c; font-size: 12px; }
.main-nav { display: grid; gap: 5px; overflow: auto; }
.nav-button {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 11px 13px; border: 0; border-radius: 10px;
  color: #657596; background: transparent; text-align: left; transition: .18s ease;
}
.nav-button:hover { color: #3f64cf; background: #e8efff; }
.nav-button.active { color: #3f64cf; background: #dfe9ff; box-shadow: inset 3px 0 #6c63df; font-weight:700; }
.nav-icon { width: 20px; text-align: center; }
.sidebar-foot { margin-top: auto; padding-top: 15px; }
.security-note { padding: 12px; border:1px solid #dce5f5; border-radius: 10px; background: rgba(255,255,255,.7); }
.security-note b,.security-note span { display: block; }
.security-note b { font-size: 11px; }
.security-note span { margin-top: 4px; color: #8491ad; font-size: 9px; line-height: 1.5; }
.text-button { margin: 13px 7px 0; border: 0; color: #7d8baa; background: transparent; font-size: 11px; }
.main { grid-column: 2; min-width: 0; }
.topbar {
  position: sticky; top: 0; z-index: 20; height: 86px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 0 32px; border-bottom: 1px solid rgba(222,221,214,.85);
  background: rgba(243,247,255,.94); backdrop-filter: blur(14px);
}
.topbar-title span { color: var(--gold); font-size: 9px; letter-spacing: .14em; }
.topbar-title h1 { margin: 5px 0 0; font-size: 21px; font-weight: 650; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.search-button { min-width: 220px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 9px; color: #82908c; background: var(--card); text-align: left; }
.notification-button { position: relative; padding: 9px 11px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: var(--card); }
.notification-button b { position: absolute; right: -7px; top: -8px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; color: white; background: var(--red); font-size: 10px; line-height: 19px; }
.role-switcher { display: grid; gap: 2px; }
.role-switcher span { color: var(--muted); font-size: 8px; }
.role-switcher select { max-width: 165px; border: 0; outline: 0; color: var(--ink); background: transparent; font-weight: 600; }
.avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: white; background: var(--green-2); font-weight: 700; }
.page-content { max-width: 1460px; margin: 0 auto; padding: 29px 32px 55px; }
.hero {
  position: relative; overflow: hidden; display: grid; grid-template-columns: 1.45fr .75fr;
  min-height: 204px; padding: 30px 33px; border-radius: 18px;
  color: white; background: linear-gradient(120deg,#4f7df3,#7667df); box-shadow: var(--shadow);
}
.hero::after { content:""; position:absolute; right:-70px; top:-110px; width:330px; height:330px; border:1px solid rgba(255,255,255,.13); border-radius:50%; box-shadow:0 0 0 48px rgba(255,255,255,.025),0 0 0 95px rgba(255,255,255,.025); }
.hero-copy,.hero-side { position: relative; z-index: 1; }
.hero-copy { align-self: center; }
.hero-copy .eyebrow { color: #fff0bd; font-size: 10px; letter-spacing: .13em; }
.hero h2 { margin: 10px 0 11px; font-size: 27px; font-weight: 580; }
.hero p { max-width: 720px; margin: 0; color: #e8ecff; font-size: 12px; line-height: 1.8; }
.hero-side { display: flex; align-items: center; justify-content: flex-end; }
.hero-score { display: grid; place-items: center; width: 126px; height: 126px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: rgba(255,255,255,.07); }
.hero-score strong { font-family: Georgia,serif; font-size: 29px; }
.hero-score span { color: #e5e8ff; font-size: 10px; }
.stat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin: 19px 0; }
.stat-card { position: relative; padding: 19px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); box-shadow: 0 8px 24px rgba(24,48,44,.035); }
.stat-card .label { color: var(--muted); font-size: 11px; }
.stat-card .value { margin: 9px 0 4px; font-family: Georgia,serif; font-size: 27px; font-weight: 600; }
.stat-card .hint { color: #8c9793; font-size: 9px; }
.stat-card .accent { position:absolute; right:17px; top:17px; width:7px; height:7px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 5px var(--gold-soft); }
.section-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(285px,.65fr); gap:19px; }
.panel { border:1px solid var(--line); border-radius:15px; background:var(--card); box-shadow:var(--shadow); }
.panel-header { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; border-bottom:1px solid var(--line); }
.panel-header h3 { margin:0; font-size:14px; }
.panel-header p { margin:4px 0 0; color:var(--muted); font-size:10px; }
.panel-body { padding:19px; }
.section-title { display:flex; align-items:end; justify-content:space-between; gap:16px; margin:27px 0 12px; }
.section-title h2 { margin:0; font-size:18px; }
.section-title p { margin:4px 0 0; color:var(--muted); font-size:10px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:35px; padding:8px 13px; border:1px solid transparent; border-radius:9px; font-size:11px; font-weight:600; }
.button.primary { color:white; background:var(--green); }
.button.secondary { color:var(--green); border-color:#cbd9f8; background:white; }
.button.ghost { color:var(--muted); border-color:var(--line); background:transparent; }
.button.danger { color:var(--red); border-color:#edcbc5; background:#fff9f8; }
.button:disabled { opacity:.45; cursor:not-allowed; }
.filters { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.filter-input,.form-control { min-height:38px; padding:8px 11px; border:1px solid var(--line); border-radius:9px; outline:0; color:var(--ink); background:white; }
.filter-input:focus,.form-control:focus { border-color:#7ba498; box-shadow:0 0 0 3px rgba(39,107,93,.09); }
.filter-input { min-width:220px; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:10px; }
th { padding:11px 12px; color:var(--muted); background:#f8f7f3; text-align:left; font-weight:600; white-space:nowrap; }
td { padding:13px 12px; border-bottom:1px solid var(--line); vertical-align:middle; }
tr:last-child td { border-bottom:0; }
.table-title { font-size:11px; font-weight:700; }
.table-sub { margin-top:4px; color:var(--muted); font-size:9px; }
.amount { font-family:Georgia,serif; font-size:14px; font-weight:600; }
.tag { display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; color:var(--green-2); background:var(--mint); font-size:9px; white-space:nowrap; }
.tag.gold { color:#93651f; background:var(--gold-soft); }
.tag.red { color:var(--red); background:var(--red-soft); }
.tag.blue { color:var(--blue); background:var(--blue-soft); }
.tag.gray { color:#69736f; background:#eeefec; }
.progress { overflow:hidden; height:7px; border-radius:5px; background:#e9ebe7; }
.progress > span { display:block; height:100%; border-radius:5px; background:linear-gradient(90deg,#4f7df3,#8a77e8); }
.progress.gold > span { background:linear-gradient(90deg,#bc7d28,#e0b66d); }
.metric-line { display:grid; grid-template-columns:90px 1fr 46px; align-items:center; gap:10px; margin:13px 0; font-size:10px; }
.metric-line b { text-align:right; }
.activity-list { display:grid; }
.activity-item { display:grid; grid-template-columns:auto 1fr; gap:11px; padding:13px 0; border-bottom:1px solid var(--line); }
.activity-item:last-child { border-bottom:0; }
.activity-dot { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; color:var(--green); background:var(--mint); font-size:10px; }
.activity-item strong { display:block; font-size:11px; }
.activity-item p { margin:4px 0; color:var(--muted); font-size:10px; line-height:1.55; }
.activity-item time { color:#9aa49f; font-size:8px; }
.kanban { display:grid; grid-template-columns:repeat(4,minmax(210px,1fr)); gap:13px; overflow:auto; padding-bottom:5px; }
.kanban-col { min-height:330px; padding:12px; border:1px solid var(--line); border-radius:13px; background:#f8f7f3; }
.kanban-head { display:flex; justify-content:space-between; margin-bottom:11px; font-size:11px; font-weight:700; }
.kanban-card { margin-bottom:9px; padding:13px; border:1px solid var(--line); border-radius:11px; background:white; box-shadow:0 5px 15px rgba(24,48,44,.03); }
.kanban-card h4 { margin:0 0 7px; font-size:11px; }
.kanban-card p { margin:4px 0; color:var(--muted); font-size:9px; }
.candidate-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.candidate-card { padding:17px; border:1px solid var(--line); border-radius:13px; background:var(--card); }
.candidate-top { display:flex; align-items:center; gap:11px; }
.candidate-avatar { display:grid; place-items:center; width:39px; height:39px; border-radius:12px; color:var(--green); background:var(--mint); font-weight:700; }
.candidate-card h3 { margin:0; font-size:13px; }
.candidate-card p { margin:4px 0; color:var(--muted); font-size:9px; }
.candidate-tags { display:flex; gap:6px; flex-wrap:wrap; margin:13px 0; }
.candidate-links { display:flex; gap:6px; flex-wrap:wrap; min-height:25px; margin:10px 0; }
.candidate-foot { display:flex; justify-content:space-between; padding-top:11px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; }
.candidate-link-button { width:100%; margin-top:12px; }
.order-candidate-summary { display:grid; gap:4px; margin:10px 0; padding:9px; border-radius:9px; background:#f5f7fb; color:var(--muted); font-size:9px; }
.order-candidate-summary strong { color:var(--ink); }
.card-actions { display:flex; gap:6px; }
.card-actions .button { flex:1; padding-inline:7px; }
.application-list { display:grid; gap:13px; }
.application-row { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:12px; padding:15px; border:1px solid var(--line); border-radius:12px; background:#f9fafc; }
.application-row .full { grid-column:1/-1; }
.application-person { display:flex; gap:10px; align-items:center; }
.application-person strong,.application-person span { display:block; }
.application-person strong { margin-bottom:5px; font-size:11px; }
.application-person span { color:var(--muted); font-size:9px; }
.upload-zone {
  position: relative; display: grid; place-items: center; min-height: 135px; padding: 22px;
  border: 1.5px dashed #9bb9ee; border-radius: 13px; color: var(--muted);
  background: #f6f9ff; text-align: center; transition: .18s ease;
}
.upload-zone:hover,.upload-zone.dragging { border-color: var(--green-2); background: #eef2ff; }
.upload-zone input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.upload-zone strong,.upload-zone span { display: block; }
.upload-zone strong { color: var(--green); font-size: 13px; }
.upload-zone span { margin-top: 7px; font-size: 9px; line-height: 1.6; }
.upload-icon { margin-bottom: 8px; color: var(--green-2); font-size: 25px; }
.form-group.parse-panel { display: none; padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: #faf9f5; }
.form-group.parse-panel.visible { display: block; }
.parse-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.parse-head strong { font-size: 11px; }
.parse-head span { color: var(--muted); font-size: 9px; }
.parse-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-top: 11px; }
.parse-step { padding: 8px; border-radius: 8px; color: #7d8884; background: #e9ece9; font-size: 9px; text-align: center; }
.parse-step.done { color: var(--green); background: var(--mint); font-weight: 700; }
.funnel { display:flex; align-items:flex-end; justify-content:center; min-height:230px; padding:15px; }
.funnel-step { display:grid; place-items:center; height:150px; color:white; background:var(--green-2); clip-path:polygon(8% 0,92% 0,78% 100%,22% 100%); }
.funnel-step:nth-child(2) { height:125px; background:#7287eb; }
.funnel-step:nth-child(3) { height:100px; background:#9a8de9; }
.funnel-step:nth-child(4) { height:75px; background:#c49855; }
.funnel-step strong,.funnel-step span { display:block; text-align:center; }
.funnel-step strong { font-family:Georgia,serif; font-size:20px; }
.funnel-step span { font-size:8px; }
.formula-box { padding:15px; border:1px solid #e5d3b6; border-radius:11px; color:#765421; background:#fbf4e8; font-size:10px; line-height:1.7; }
.access-warning { margin-top:15px; padding:18px; border-color:#e5d3b6; background:#fbf4e8; }
.access-warning strong { font-size:12px; }
.access-warning p { margin:7px 0 0; color:#765421; font-size:10px; line-height:1.7; }
.split-bar { display:flex; overflow:hidden; height:28px; margin:12px 0; border-radius:8px; color:white; font-size:9px; font-weight:700; }
.split-bar span { display:grid; place-items:center; }
.split-sales { background:#4f7df3; }
.split-owner { background:#7667df; }
.split-delivery { background:#c28e3f; }
.empty { padding:35px; color:var(--muted); text-align:center; font-size:11px; }
.modal-backdrop { position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:25px; background:rgba(10,27,23,.55); backdrop-filter:blur(4px); }
.modal { width:min(680px,100%); max-height:90vh; overflow:auto; border-radius:17px; background:var(--card); box-shadow:0 26px 80px rgba(0,0,0,.24); }
.modal-header { display:flex; justify-content:space-between; align-items:flex-start; padding:21px 23px; border-bottom:1px solid var(--line); }
.modal-header h2 { margin:0; font-size:18px; }
.modal-header p { margin:5px 0 0; color:var(--muted); font-size:10px; }
.icon-button { border:0; color:var(--muted); background:transparent; font-size:18px; }
.modal-body { padding:21px 23px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.form-group { display:grid; gap:6px; }
.form-group.full { grid-column:1/-1; }
.form-group label { font-size:10px; font-weight:700; }
.form-group textarea { min-height:80px; resize:vertical; }
.modal-actions { display:flex; justify-content:flex-end; gap:9px; padding:16px 23px; border-top:1px solid var(--line); }
.toast-root { position:fixed; right:23px; bottom:23px; z-index:100; display:grid; gap:9px; }
.toast { min-width:260px; padding:13px 15px; border-radius:10px; color:white; background:#526fd0; box-shadow:var(--shadow); font-size:11px; animation:toast-in .25s ease; }
@keyframes toast-in { from { transform:translateY(8px); opacity:0; } }
.mobile-only { display:none; }
@media (max-width:1100px) {
  .search-button { display:none; }
  .stat-grid { grid-template-columns:repeat(2,1fr); }
  .candidate-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:760px) {
  .login-screen { padding:22px 17px; }
  .login-layout { grid-template-columns:1fr; gap:28px; align-content:center; }
  .login-intro h1 { font-size:29px; }
  .login-intro p,.login-rule { display:none; }
  .login-card { padding:23px; }
  .app-shell { display:block; }
  .sidebar { transform:translateX(-100%); transition:.2s ease; }
  .sidebar.open { transform:translateX(0); }
  .main { min-width:0; }
  .topbar { height:74px; padding:0 15px; }
  .mobile-only { display:block; }
  .topbar-title h1 { font-size:17px; }
  .role-switcher span,.notification-button { display:none; }
  .role-switcher select { max-width:125px; font-size:10px; }
  .page-content { padding:20px 15px 40px; }
  .hero { grid-template-columns:1fr; padding:25px; }
  .hero-side { display:none; }
  .stat-grid,.section-grid,.candidate-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }
  .application-row { grid-template-columns:1fr; }
  .application-row .full { grid-column:auto; }
}
