
    :root {
      --bg: #f6f7fb;
      --panel: #ffffff;
      --line: #e3e7ef;
      --text: #182033;
      --muted: #697386;
      --brand: #2563eb;
      --brand-soft: #eaf1ff;
      --green: #14875b;
      --green-soft: #e8f7ef;
      --orange: #b45309;
      --orange-soft: #fff4df;
      --red: #c24141;
      --red-soft: #ffecec;
      --shadow: 0 10px 24px rgba(18, 31, 56, 0.08);
      --radius: 8px;

      /* ABC design-system aliases. Keep the legacy tokens above until every
         role-private stylesheet has migrated deliberately. */
      --abc-color-canvas: var(--bg);
      --abc-color-surface: var(--panel);
      --abc-color-surface-subtle: #f8fafc;
      --abc-color-border: var(--line);
      --abc-color-border-strong: #c5cfdd;
      --abc-color-text: var(--text);
      --abc-color-text-muted: var(--muted);
      --abc-color-primary: var(--brand);
      --abc-color-primary-subtle: var(--brand-soft);
      --abc-color-success: var(--green);
      --abc-color-success-subtle: var(--green-soft);
      --abc-color-warning: var(--orange);
      --abc-color-warning-subtle: var(--orange-soft);
      --abc-color-danger: var(--red);
      --abc-color-danger-subtle: var(--red-soft);
      --abc-color-info: #1d4ed8;
      --abc-color-info-subtle: #eaf1ff;
      --abc-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.24);

      --abc-space-1: 4px;
      --abc-space-2: 8px;
      --abc-space-3: 12px;
      --abc-space-4: 16px;
      --abc-space-5: 20px;
      --abc-space-6: 24px;
      --abc-space-8: 32px;
      --abc-space-10: 40px;

      --abc-font-size-xs: 12px;
      --abc-font-size-sm: 13px;
      --abc-font-size-md: 14px;
      --abc-font-size-lg: 16px;
      --abc-font-size-xl: 19px;
      --abc-line-height-tight: 1.35;
      --abc-line-height-normal: 1.55;
      --abc-font-weight-medium: 600;
      --abc-font-weight-strong: 700;

      --abc-radius-sm: 6px;
      --abc-radius-md: var(--radius);
      --abc-radius-lg: 12px;
      --abc-shadow-panel: var(--shadow);
      --abc-shadow-overlay: 0 18px 50px rgba(18, 31, 56, 0.18);
      --abc-control-height: 38px;
      --abc-content-width: 1480px;
      --abc-layer-sticky: 10;
      --abc-layer-overlay: 100;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
    }

    * { box-sizing: border-box; }

    html {
      height: 100%;
      scroll-behavior: auto;
      overflow-anchor: none;
      overflow: hidden;
    }

    body {
      height: 100%;
      margin: 0;
      color: var(--text);
      background: var(--bg);
      letter-spacing: 0;
      overflow-anchor: none;
      overflow: hidden;
    }

    button, input, select, textarea {
      font: inherit;
    }

    button {
      border: 1px solid var(--line);
      background: #fff;
      color: var(--text);
      border-radius: 7px;
      padding: 8px 12px;
      cursor: pointer;
      transition: 0.16s ease;
      white-space: nowrap;
    }

    button:hover {
      border-color: #b8c4d8;
      box-shadow: 0 3px 10px rgba(18, 31, 56, 0.08);
    }

    button:focus-visible,
    a:focus-visible,
    summary:focus-visible {
      outline: 3px solid rgba(37, 99, 235, 0.55);
      outline-offset: 2px;
    }

    button.primary {
      color: #fff;
      border-color: var(--brand);
      background: var(--brand);
    }

    button.success {
      color: #fff;
      border-color: #16A34A;
      background: #16A34A;
      font-weight: 650;
    }

    button.danger {
      color: #fff;
      border-color: var(--red);
      background: var(--red);
    }

    input, select, textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
      color: var(--text);
      padding: 8px 10px;
      outline: none;
      min-height: 38px;
    }

    textarea {
      min-height: 76px;
      resize: vertical;
    }

    input:focus, select:focus, textarea:focus {
      border-color: #7aa2ff;
      box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
      }
    }

    .app {
      height: 100vh;
      min-height: 100vh;
      display: grid;
      grid-template-columns: 238px 1fr;
      overflow: hidden;
    }

    .side {
      background: #eaf1ff;
      border-right: 1px solid #dce5f7;
      padding: 22px 18px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 26px;
      font-size: 21px;
      font-weight: 750;
      color: #1c5fd7;
    }

    .brand-mark {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      color: #fff;
      border-radius: 50%;
      background: #0f172a;
      font-size: 13px;
    }

    .nav {
      display: grid;
      gap: 6px;
    }

    .nav button,
    .nav a {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-color: transparent;
      background: transparent;
      padding: 12px 10px;
      text-align: left;
      color: #1f2a44;
      text-decoration: none;
      border-radius: 7px;
    }

	    .nav button.active,
	    .nav a.active {
	      background: #fff;
	      border-color: #d7e2f8;
	      box-shadow: 0 4px 14px rgba(37, 99, 235, 0.1);
	      color: var(--brand);
	      font-weight: 700;
	    }

	    .nav button.is-navigating {
	      background: #fff;
	      border-color: #9bb8f5;
	      color: var(--brand);
	      cursor: progress;
	      opacity: 0.85;
	    }

	    .nav button.is-navigating::after {
	      content: "进入中";
	      margin-left: 8px;
	      color: var(--muted);
	      font-size: 12px;
	      font-weight: 650;
	    }

    .main {
      min-width: 0;
      min-height: 0;
      height: 100vh;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    .topbar {
      height: 64px;
      min-height: 64px;
      max-height: 64px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 9px;
      padding: 14px 22px;
      background: #fff;
      border-bottom: 1px solid var(--line);
      position: sticky;
      top: 0;
      z-index: 10;
      overflow: hidden;
    }

    .top-title {
      min-width: 0;
      overflow: hidden;
    }

    .top-title h1 {
      margin: 0;
      font-size: 19px;
      line-height: 1.35;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .top-title p {
      margin: 3px 0 0;
      color: var(--muted);
      font-size: 13px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .actions {
      width: min(760px, 64vw);
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex: 0 0 auto;
      min-width: 0;
      overflow: hidden;
      white-space: nowrap;
    }

    .topbar-user {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 7px;
      min-width: 0;
      max-width: min(390px, 34vw);
      overflow: hidden;
    }

    .topbar-notification-slot {
      display: inline-flex;
      align-items: center;
      flex: 0 0 auto;
    }

    .topbar-command-group {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex: 0 0 auto;
    }

    #loginBadge,
    #feishuBadge {
      display: inline-flex;
      align-items: center;
      max-width: 220px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #loginBadge {
      width: 100%;
    }

    #feishuBadge {
      width: 100%;
    }

    .content {
      width: min(1480px, 100%);
      margin: 0 auto;
      padding: 18px 22px 34px;
      display: grid;
      gap: 16px;
      flex: 1 1 auto;
      min-height: 0;
      overflow: auto;
      overscroll-behavior: contain;
      scrollbar-gutter: stable;
    }

    .section {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      min-width: 0;
    }

    .section-head {
      min-height: 54px;
      padding: 12px 16px;
      border-bottom: 1px solid var(--line);
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
    }

    .section-head h2 {
      margin: 0;
      font-size: 16px;
    }

    .compact-head {
      min-height: auto;
      padding: 0 0 10px;
      border-bottom: 0;
    }

    .compact-head h3 {
      margin: 0;
      font-size: 16px;
    }

    .section-body {
      padding: 14px 16px 16px;
    }

    .grid {
      display: grid;
      gap: 12px;
    }

    .sub-panel {
      display: grid;
      gap: 12px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #f9fbff;
    }

    .cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

    label {
      display: grid;
      gap: 6px;
      font-size: 13px;
      color: #3a4558;
      min-width: 0;
    }

    .metric-row {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 10px;
    }

    .metric-row .metric-button {
      appearance: none;
      border: 0;
      background: transparent;
      color: inherit;
      cursor: pointer;
      font: inherit;
      padding: 0;
      text-align: left;
    }

    .metric-row .metric-button-static {
      cursor: default;
    }

    .metric-row .metric-button .metric {
      height: 100%;
      transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
    }

    .metric-row .metric-button:not(.metric-button-static):hover .metric,
    .metric-row .metric-button.active .metric {
      border-color: var(--primary);
      box-shadow: 0 0 0 2px rgba(37, 99, 235, .12);
    }

    .metric-row .metric-button.active .metric {
      background: #f8fbff;
    }

    .metric {
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 12px 14px;
    }

    .metric .name {
      color: var(--muted);
      font-size: 13px;
    }

    .metric .value {
      margin-top: 6px;
      font-size: 24px;
      font-weight: 800;
    }

    .data-screen-shell .section-body {
      overflow: hidden;
    }

    .data-screen-layout {
      display: grid;
      gap: 12px;
      padding: 14px;
      background:
        linear-gradient(180deg, rgba(17, 24, 39, .96), rgba(22, 28, 36, .94)),
        repeating-linear-gradient(90deg, rgba(20, 184, 166, .07) 0 1px, transparent 1px 96px),
        repeating-linear-gradient(0deg, rgba(251, 146, 60, .05) 0 1px, transparent 1px 80px);
      color: #e5edf8;
    }

    .data-screen-status-bar {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 10px;
      color: #9fb2ca;
      font-size: 12px;
    }

    .data-screen-status-bar strong {
      color: #fff;
      font-size: 18px;
    }

    .data-screen-command-grid {
      display: grid;
      grid-template-columns: minmax(220px, .72fr) minmax(520px, 1.65fr) minmax(260px, .9fr);
      gap: 12px;
      min-height: 430px;
    }

    .data-screen-command-left,
    .data-screen-command-right,
    .data-screen-flow-field,
    .data-screen-war-room,
    .data-screen-people-panel {
      border: 1px solid rgba(148, 163, 184, .22);
      border-radius: 8px;
      background: rgba(15, 23, 42, .76);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 18px 50px rgba(0, 0, 0, .20);
    }

    .data-screen-command-left {
      display: grid;
      grid-template-rows: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .data-screen-command-metric {
      display: grid;
      align-content: center;
      gap: 6px;
      min-height: 92px;
      padding: 16px;
      border: 1px solid rgba(148, 163, 184, .16);
      border-radius: 8px;
      background: linear-gradient(135deg, rgba(30, 41, 59, .92), rgba(15, 23, 42, .78));
    }

    .data-screen-command-metric span,
    .data-screen-command-metric em {
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
    }

    .data-screen-command-metric strong {
      color: #fff;
      font-size: 34px;
      line-height: 1;
    }

    .data-screen-tone-danger {
      border-color: rgba(248, 113, 113, .42);
      animation: dataScreenRiskPulse 2.8s ease-in-out infinite;
    }

    .data-screen-tone-money {
      border-color: rgba(34, 197, 94, .32);
    }

    .data-screen-flow-field {
      position: relative;
      overflow: hidden;
      padding: 20px;
      background:
        linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(22, 28, 36, .78)),
        repeating-linear-gradient(90deg, rgba(148, 163, 184, .08) 0 1px, transparent 1px 82px),
        repeating-linear-gradient(0deg, rgba(148, 163, 184, .08) 0 1px, transparent 1px 72px);
    }

    .data-screen-flow-bg {
      position: absolute;
      inset: 0;
      background: linear-gradient(110deg, transparent, rgba(59, 130, 246, .10), transparent);
      animation: dataScreenSweep 5s linear infinite;
    }

    .data-screen-flow-track {
      position: absolute;
      inset: 48% 8% auto;
      height: 8px;
    }

    .data-screen-flow-line {
      position: absolute;
      inset: 2px 0;
      border-radius: 999px;
      background: linear-gradient(90deg, #22c55e, #38bdf8, #f59e0b, #fb7185);
      opacity: .82;
      box-shadow: 0 0 24px rgba(56, 189, 248, .35);
    }

    .data-screen-flow-pulse {
      position: absolute;
      top: -5px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 0 0 8px rgba(56, 189, 248, .16), 0 0 30px rgba(255, 255, 255, .8);
      animation: dataScreenFlow 4.6s linear infinite;
    }

    .data-screen-flow-pulse.pulse-two {
      animation-delay: -2.2s;
      opacity: .78;
    }

    .data-screen-flow-nodes {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
      height: 100%;
      align-items: center;
    }

    .data-screen-stage {
      display: grid;
      gap: 12px;
      min-height: 230px;
      padding: 16px;
      border: 1px solid rgba(148, 163, 184, .20);
      border-radius: 8px;
      background: rgba(2, 6, 23, .62);
      backdrop-filter: blur(8px);
    }

    .data-screen-stage.is-risk {
      border-color: rgba(251, 146, 60, .45);
    }

    .data-screen-stage-label {
      display: grid;
      gap: 4px;
    }

    .data-screen-stage-label strong {
      color: #fff;
      font-size: 16px;
    }

    .data-screen-stage-label span,
    .data-screen-stage-foot {
      color: #9fb2ca;
      font-size: 12px;
    }

    .data-screen-stage-number {
      color: #fff;
      font-size: 42px;
      font-weight: 900;
      line-height: 1;
    }

    .data-screen-stage-bar,
    .data-screen-load-bar {
      height: 7px;
      overflow: hidden;
      border-radius: 999px;
      background: rgba(148, 163, 184, .18);
    }

    .data-screen-stage-bar i,
    .data-screen-load-bar i {
      display: block;
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, #22c55e, #f59e0b, #ef4444);
      animation: dataScreenBarGlow 2.6s ease-in-out infinite;
    }

    .data-screen-stage-foot {
      display: flex;
      justify-content: space-between;
      gap: 8px;
    }

    .data-screen-flow-summary {
      position: absolute;
      z-index: 2;
      left: 20px;
      right: 20px;
      bottom: 18px;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    .data-screen-flow-summary strong {
      padding: 10px;
      border: 1px solid rgba(148, 163, 184, .18);
      border-radius: 8px;
      background: rgba(15, 23, 42, .72);
      color: #dbeafe;
      text-align: center;
    }

    .data-screen-command-right {
      display: grid;
      align-content: start;
      gap: 12px;
      padding: 16px;
    }

    .data-screen-command-right h3,
    .data-screen-panel-title h3,
    .data-screen-people-panel h3 {
      margin: 0;
      color: #fff;
      font-size: 16px;
    }

    .data-screen-command-right ol,
    .data-screen-war-room ul,
    .data-screen-people-panel ul {
      display: grid;
      gap: 8px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .data-screen-war-room ul {
      align-content: start;
    }

    .data-screen-war-room:not(.data-screen-hot-people) ul {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .data-screen-command-action {
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr);
      gap: 10px;
      align-items: start;
      padding: 10px;
      border: 1px solid rgba(96, 165, 250, .24);
      border-radius: 8px;
      background: rgba(30, 41, 59, .72);
    }

    .data-screen-command-action > span {
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background: rgba(59, 130, 246, .22);
      color: #bfdbfe;
      font-weight: 800;
    }

    .data-screen-command-action strong,
    .data-screen-command-action em {
      display: block;
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .data-screen-command-action em {
      margin-top: 4px;
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
      line-height: 1.45;
    }

    .data-screen-risk-strip {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .data-screen-risk-strip span {
      padding: 10px;
      border-radius: 8px;
      background: rgba(248, 113, 113, .13);
      color: #fecaca;
      font-weight: 700;
      text-align: center;
    }

    .data-screen-ticker {
      overflow: hidden;
      border: 1px solid rgba(251, 146, 60, .28);
      border-radius: 8px;
      background: rgba(30, 41, 59, .72);
      color: #fed7aa;
      white-space: nowrap;
    }

    .data-screen-ticker > div {
      display: inline-flex;
      gap: 28px;
      min-width: 100%;
      padding: 9px 14px;
      animation: dataScreenTicker 28s linear infinite;
    }

    .data-screen-ticker span {
      display: inline-flex;
      gap: 8px;
      align-items: center;
    }

    .data-screen-ticker b {
      color: #fff;
      font-weight: 800;
    }

    .data-screen-ticker strong {
      color: #fb7185;
      font-size: 18px;
    }

    .data-screen-ops-grid {
      display: grid;
      grid-template-columns: .85fr 1.15fr;
      gap: 12px;
      align-items: start;
    }

    .data-screen-war-room {
      display: grid;
      gap: 12px;
      align-content: start;
      min-width: 0;
      padding: 14px;
    }

    .data-screen-panel-title {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      align-items: baseline;
    }

    .data-screen-panel-title span {
      color: #9fb2ca;
      font-size: 12px;
    }

    .data-screen-alert,
    .data-screen-action {
      display: grid;
      gap: 5px;
      min-width: 0;
      padding: 10px;
      border: 1px solid rgba(148, 163, 184, .18);
      border-radius: 8px;
      background: rgba(30, 41, 59, .76);
    }

    .data-screen-war-room:not(.data-screen-hot-people) .data-screen-alert {
      min-height: 118px;
      align-content: center;
    }

    .data-screen-alert strong,
    .data-screen-action strong {
      color: #fff;
      font-size: 13px;
      overflow-wrap: anywhere;
    }

    .data-screen-alert > span {
      color: #fb7185;
      font-size: 24px;
      font-weight: 900;
    }

    .data-screen-alert em,
    .data-screen-action span {
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
      overflow-wrap: anywhere;
    }

    .data-screen-level-red {
      border-color: rgba(248, 113, 113, .48);
      background: rgba(127, 29, 29, .42);
      animation: dataScreenRiskPulse 2.4s ease-in-out infinite;
    }

    .data-screen-level-yellow {
      border-color: rgba(245, 158, 11, .42);
      background: rgba(120, 53, 15, .35);
    }

    .data-screen-people-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .data-screen-people-panel {
      min-width: 0;
      padding: 14px;
    }

    .data-screen-people-panel ul {
      max-height: 380px;
      overflow: auto;
      padding-right: 2px;
    }

    .data-screen-person {
      display: grid;
      gap: 8px;
      min-width: 0;
      padding: 10px;
      border: 1px solid rgba(148, 163, 184, .18);
      border-radius: 8px;
      background: rgba(30, 41, 59, .74);
    }

    .data-screen-person strong,
    .data-screen-person span,
    .data-screen-person em {
      display: block;
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .data-screen-person strong {
      color: #fff;
      font-size: 13px;
    }

    .data-screen-person span,
    .data-screen-person em {
      margin-top: 3px;
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
      line-height: 1.45;
    }

    .data-screen-person-stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
    }

    .data-screen-person-stats span {
      margin: 0;
      padding: 4px 6px;
      border-radius: 6px;
      background: rgba(15, 23, 42, .88);
      color: #dbeafe;
      font-size: 12px;
      text-align: center;
      white-space: nowrap;
    }

    .data-screen-person-卡住 {
      border-color: rgba(248, 113, 113, .44);
      background: rgba(127, 29, 29, .36);
    }

    .data-screen-person-进行中 {
      border-color: rgba(96, 165, 250, .34);
      background: rgba(30, 58, 138, .28);
    }

    @keyframes dataScreenFlow {
      from { left: 0; transform: translateX(-20px); }
      to { left: 100%; transform: translateX(0); }
    }

    @keyframes dataScreenSweep {
      from { transform: translateX(-120%); }
      to { transform: translateX(120%); }
    }

    @keyframes dataScreenTicker {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    @keyframes dataScreenBarGlow {
      0%, 100% { filter: brightness(1); }
      50% { filter: brightness(1.35); }
    }

    @keyframes dataScreenRiskPulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(248, 113, 113, .0); }
      50% { box-shadow: 0 0 0 3px rgba(248, 113, 113, .16); }
    }

    @media (max-width: 1280px) {
      .data-screen-command-grid {
        grid-template-columns: 1fr;
      }

      .data-screen-command-left {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        grid-template-rows: none;
      }

      .data-screen-flow-field {
        min-height: 360px;
      }

      .data-screen-ops-grid,
      .data-screen-people-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 760px) {
      .data-screen-layout {
        padding: 10px;
      }

      .data-screen-command-left,
      .data-screen-flow-nodes,
      .data-screen-flow-summary,
      .data-screen-ops-grid,
      .data-screen-people-grid {
        grid-template-columns: 1fr;
      }

      .data-screen-flow-field {
        min-height: auto;
      }

      .data-screen-flow-track,
      .data-screen-flow-summary {
        position: static;
      }

      .data-screen-flow-track {
        margin: 10px 0;
      }

      .data-screen-stage {
        min-height: 150px;
      }

      .data-screen-command-metric strong,
      .data-screen-stage-number {
        font-size: 30px;
      }
    }

    .smart-screen-shell {
      position: relative;
      min-height: calc(100vh - 104px);
      overflow: hidden;
      border: 1px solid rgba(56, 189, 248, .28);
      border-radius: 8px;
      background:
        linear-gradient(180deg, #07111f, #101827 56%, #07111f),
        repeating-linear-gradient(90deg, rgba(56, 189, 248, .07) 0 1px, transparent 1px 96px),
        repeating-linear-gradient(0deg, rgba(34, 197, 94, .045) 0 1px, transparent 1px 82px);
      color: #dbeafe;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 24px 70px rgba(15,23,42,.22);
    }

    .smart-screen-shell.smart-screen-is-fullscreen,
    .smart-screen-shell:fullscreen {
      position: fixed;
      inset: 0;
      z-index: 1000;
      width: 100vw;
      height: 100vh;
      min-height: 100vh;
      overflow: auto;
      border: 0;
      border-radius: 0;
    }

    .smart-screen-bg {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(34, 197, 94, .12), transparent 24%, transparent 76%, rgba(248, 113, 113, .11)),
        linear-gradient(135deg, transparent, rgba(56, 189, 248, .08), transparent);
      animation: smartSweep 6s linear infinite;
    }

    .smart-screen-top {
      position: relative;
      z-index: 1;
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: center;
      padding: 16px 18px 12px;
      border-bottom: 1px solid rgba(148, 163, 184, .18);
    }

    .smart-screen-top strong {
      display: block;
      color: #fff;
      font-size: 24px;
      letter-spacing: 0;
    }

    .smart-screen-top span,
    .smart-panel header span {
      color: #9fb2ca;
      font-size: 12px;
    }

    .smart-screen-status {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 8px;
    }

    .smart-screen-status span,
    .smart-screen-status button {
      padding: 7px 10px;
      border: 1px solid rgba(96, 165, 250, .24);
      border-radius: 8px;
      background: rgba(15, 23, 42, .66);
      color: #bfdbfe;
    }

    .smart-screen-status button {
      cursor: pointer;
      font: inherit;
    }

    .smart-sse-status {
      color: #bbf7d0 !important;
      border-color: rgba(34,197,94,.36) !important;
    }

    .smart-cockpit {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 320px;
      grid-template-areas:
        "monthly right"
        "left right"
        "center right"
        "bottom bottom"
        "groups groups"
        "quality quality";
      gap: 12px;
      padding: 12px 16px 16px;
      min-height: calc(100vh - 73px);
    }

    .smart-monthly-strip {
      grid-area: monthly;
      display: grid;
      grid-template-columns: 180px minmax(0, 1fr);
      gap: 12px;
      align-items: stretch;
    }

    .smart-monthly-strip header,
    .smart-group-card,
    .smart-quality-panel {
      min-width: 0;
      border: 1px solid rgba(148, 163, 184, .20);
      border-radius: 8px;
      background: rgba(15, 23, 42, .72);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 16px 42px rgba(0,0,0,.18);
    }

    .smart-monthly-strip header {
      display: grid;
      align-content: center;
      gap: 6px;
      padding: 12px 14px;
    }

    .smart-monthly-strip header strong {
      color: #fff;
      font-size: 18px;
    }

    .smart-monthly-strip header span {
      color: #9fb2ca;
      font-size: 12px;
    }

    .smart-monthly-strip > div {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .smart-left-rail {
      grid-area: left;
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 10px;
    }

    .smart-operating-kpis .smart-kpi {
      min-height: 92px;
    }

    .smart-center-stage {
      grid-area: center;
      display: grid;
      grid-template-columns: minmax(520px, 1.35fr) minmax(360px, .9fr);
      gap: 12px;
    }

    .smart-right-rail {
      grid-area: right;
      display: grid;
      align-content: start;
      gap: 12px;
    }

    .smart-bottom-row {
      grid-area: bottom;
      display: grid;
      grid-template-columns: .86fr 1.14fr;
      gap: 12px;
      align-items: start;
    }

    .smart-group-grid {
      grid-area: groups;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .smart-quality-panel {
      grid-area: quality;
    }

    .smart-kpi,
    .smart-panel,
    .smart-flow-field {
      min-width: 0;
      border: 1px solid rgba(148, 163, 184, .20);
      border-radius: 8px;
      background: rgba(15, 23, 42, .72);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 16px 42px rgba(0,0,0,.18);
    }

    .smart-kpi {
      display: grid;
      align-content: center;
      gap: 6px;
      min-height: 82px;
      padding: 12px;
    }

    .smart-kpi span,
    .smart-kpi em {
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
    }

    .smart-kpi strong {
      color: #fff;
      font-size: 32px;
      line-height: 1;
      overflow-wrap: anywhere;
    }

    .smart-kpi-red {
      border-color: rgba(248, 113, 113, .42);
    }

    .smart-kpi-yellow {
      border-color: rgba(251, 191, 36, .36);
    }

    .smart-kpi-green {
      border-color: rgba(34, 197, 94, .34);
    }

    .smart-flow-field {
      position: relative;
      min-height: 430px;
      overflow: hidden;
      padding: 20px;
      background:
        linear-gradient(180deg, rgba(8, 15, 28, .88), rgba(15, 23, 42, .78)),
        repeating-linear-gradient(90deg, rgba(148, 163, 184, .08) 0 1px, transparent 1px 88px),
        repeating-linear-gradient(0deg, rgba(148, 163, 184, .06) 0 1px, transparent 1px 74px);
    }

    .smart-scanline {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent, rgba(56, 189, 248, .12), transparent);
      animation: smartScan 5s linear infinite;
    }

    .smart-flow-beam {
      position: absolute;
      left: 7%;
      right: 7%;
      top: 48%;
      height: 5px;
      border-radius: 999px;
      background: linear-gradient(90deg, #22c55e, #38bdf8, #f97316, #ef4444);
      box-shadow: 0 0 24px rgba(56, 189, 248, .42);
    }

    .smart-flow-beam::after {
      content: "";
      position: absolute;
      top: -7px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 0 0 9px rgba(56, 189, 248, .15), 0 0 32px rgba(255,255,255,.75);
      animation: smartFlowDot 4.4s linear infinite;
    }

    .smart-flow-beam.beam-two::after {
      animation-delay: -2.1s;
      opacity: .75;
    }

    .smart-flow-nodes {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
      height: 100%;
      align-items: center;
    }

    .smart-flow-node {
      display: grid;
      gap: 12px;
      min-height: 244px;
      padding: 14px;
      border: 1px solid rgba(96, 165, 250, .24);
      border-radius: 8px;
      background: linear-gradient(180deg, rgba(2, 6, 23, .70), rgba(15, 23, 42, .48));
      backdrop-filter: blur(8px);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 44px rgba(0,0,0,.22);
    }

    .smart-node-ring {
      display: grid;
      place-items: center;
      width: 52px;
      height: 52px;
      border-radius: 50%;
      border: 2px solid rgba(56, 189, 248, .75);
      color: #fff;
      font-weight: 900;
      box-shadow: 0 0 26px rgba(56, 189, 248, .24);
    }

    .smart-node-body {
      display: grid;
      gap: 9px;
    }

    .smart-node-body h3,
    .smart-panel h3 {
      margin: 0;
      color: #fff;
      font-size: 16px;
      letter-spacing: 0;
    }

    .smart-node-body p,
    .smart-node-body footer,
    .smart-person p,
    .smart-person em,
    .smart-decision em,
    .smart-decision small,
    .smart-bottleneck em,
    .smart-live-event span {
      margin: 0;
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
      line-height: 1.45;
      overflow-wrap: anywhere;
    }

    .smart-stage-primary {
      display: grid;
      gap: 4px;
    }

    .smart-stage-primary span {
      color: #bfdbfe;
      font-size: 12px;
      font-weight: 800;
    }

    .smart-node-body strong {
      color: #fff;
      font-size: 38px;
      line-height: 1;
    }

    .smart-node-bar,
    .smart-load {
      height: 7px;
      overflow: hidden;
      border-radius: 999px;
      background: rgba(148,163,184,.18);
    }

    .smart-node-bar i,
    .smart-load i {
      display: block;
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, #38bdf8, #22c55e);
      animation: smartBarGlow 2.6s ease-in-out infinite;
    }

    .smart-node-body footer {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
    }

    .smart-level-red {
      border-color: rgba(248, 113, 113, .48) !important;
      background-color: rgba(127, 29, 29, .30);
    }

    .smart-level-yellow {
      border-color: rgba(251, 191, 36, .42) !important;
      background-color: rgba(120, 53, 15, .26);
    }

    .smart-flow-legend {
      position: absolute;
      z-index: 2;
      left: 20px;
      right: 20px;
      bottom: 18px;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .smart-flow-legend span,
    .smart-risk-strip span {
      padding: 10px;
      border: 1px solid rgba(148, 163, 184, .18);
      border-radius: 8px;
      background: rgba(15, 23, 42, .76);
      color: #dbeafe;
      font-weight: 800;
      text-align: center;
    }

    .smart-chart-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .smart-panel {
      display: grid;
      gap: 10px;
      align-content: start;
      padding: 14px;
    }

    .smart-panel header {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: baseline;
    }

    .smart-chart-panel canvas {
      display: block;
      width: 100%;
      height: 170px;
      border-radius: 8px;
      background: rgba(8, 15, 28, .72);
    }

    .smart-quality-panel summary {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: center;
      cursor: pointer;
      color: #dbeafe;
      list-style: none;
    }

    .smart-quality-panel summary::-webkit-details-marker {
      display: none;
    }

    .smart-quality-panel summary strong {
      color: #fff;
      font-size: 15px;
    }

    .smart-quality-panel summary span {
      color: #9fb2ca;
      font-size: 12px;
    }

    .smart-quality-panel:not([open]) {
      padding: 10px 14px;
      opacity: .82;
    }

    .smart-quality-panel:not([open]) header,
    .smart-quality-panel:not([open]) .smart-quality-counts,
    .smart-quality-panel:not([open]) ul {
      display: none;
    }

    .smart-decision-panel ol,
    .smart-live-panel ul,
    .smart-bottleneck-panel ul,
    .smart-rank-panel ul,
    .smart-people-panel ul,
    .smart-group-card ul,
    .smart-group-card ol,
    .smart-quality-panel ul {
      display: grid;
      gap: 8px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .smart-decision,
    .smart-bottleneck,
    .smart-person,
    .smart-live-event {
      min-width: 0;
      border: 1px solid rgba(148, 163, 184, .18);
      border-radius: 8px;
      background: rgba(30, 41, 59, .68);
    }

    .smart-decision {
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr);
      gap: 10px;
      padding: 10px;
    }

    .smart-decision > span {
      display: grid;
      place-items: center;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: rgba(59, 130, 246, .24);
      color: #bfdbfe;
      font-weight: 900;
    }

    .smart-decision strong,
    .smart-bottleneck strong,
    .smart-person strong,
    .smart-live-event strong {
      display: block;
      color: #fff;
      overflow-wrap: anywhere;
    }

    .smart-bottleneck-panel ul {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .smart-bottleneck {
      display: grid;
      gap: 6px;
      min-height: 112px;
      padding: 12px;
    }

    .smart-bottleneck span {
      color: #fb7185;
      font-size: 28px;
      font-weight: 900;
      line-height: 1;
    }

    .smart-rank-panel ul,
    .smart-people-panel ul,
    .smart-live-panel ul {
      max-height: 430px;
      overflow: auto;
      padding-right: 2px;
    }

    .smart-person {
      display: grid;
      gap: 7px;
      padding: 10px;
    }

    .smart-person-head,
    .smart-person-stats {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: center;
    }

    .smart-person-head span,
    .smart-person-stats span {
      color: #bfdbfe;
      font-size: 12px;
      white-space: nowrap;
    }

    .smart-person-stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .smart-person-stats span {
      padding: 4px 6px;
      border-radius: 6px;
      background: rgba(8, 15, 28, .78);
      text-align: center;
    }

    .smart-live-event {
      display: grid;
      grid-template-columns: 64px minmax(0, .8fr) minmax(0, 1.2fr);
      gap: 8px;
      align-items: center;
      padding: 9px;
      animation: smartEventIn .5s ease-out both;
      animation-delay: var(--delay, 0ms);
    }

    .smart-live-event time {
      color: #93c5fd;
      font-size: 12px;
    }

    .smart-group-card {
      display: grid;
      align-content: start;
      gap: 8px;
      padding: 12px;
      border-color: rgba(56, 189, 248, .22);
    }

    .smart-group-card header {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: start;
    }

    .smart-group-card header strong {
      display: block;
      color: #fff;
      font-size: 18px;
    }

    .smart-group-card header span,
    .smart-group-card header em,
    .smart-group-card > p {
      color: #9fb2ca;
      font-size: 12px;
      font-style: normal;
      line-height: 1.5;
    }

    .smart-group-card > p {
      min-height: 0;
      margin: 0;
    }

    .smart-group-metrics {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .smart-group-metrics span,
    .smart-quality-counts span {
      display: grid;
      gap: 3px;
      min-width: 0;
      padding: 8px;
      border: 1px solid rgba(148, 163, 184, .16);
      border-radius: 8px;
      background: rgba(8, 15, 28, .62);
    }

    .smart-group-metrics em {
      color: #9fb2ca;
      font-size: 11px;
      font-style: normal;
      overflow-wrap: anywhere;
    }

    .smart-group-metrics strong {
      color: #fff;
      font-size: 20px;
      line-height: 1;
      overflow-wrap: anywhere;
    }

    .smart-group-body {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
      align-items: start;
      max-height: 230px;
      overflow: hidden;
    }

    .smart-group-body .smart-bottleneck {
      min-height: 0;
    }

    .smart-quality-counts {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 8px;
    }

    .smart-quality-counts span,
    .smart-quality-panel li {
      color: #cbd5e1;
      font-size: 12px;
      line-height: 1.45;
    }

    @keyframes smartSweep {
      from { transform: translateX(-100%); opacity: .7; }
      to { transform: translateX(100%); opacity: .95; }
    }

    @keyframes smartScan {
      from { transform: translateY(-110%); }
      to { transform: translateY(110%); }
    }

    @keyframes smartFlowDot {
      from { left: 0; transform: translateX(-18px); }
      to { left: 100%; transform: translateX(0); }
    }

    @keyframes smartBarGlow {
      0%, 100% { filter: brightness(1); }
      50% { filter: brightness(1.32); }
    }

    @keyframes smartRiskPulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(248, 113, 113, 0); }
      50% { box-shadow: 0 0 0 3px rgba(248, 113, 113, .16); }
    }

    @keyframes smartEventIn {
      from { opacity: 0; transform: translateX(10px); }
      to { opacity: 1; transform: translateX(0); }
    }

    @media (max-width: 1280px) {
      .smart-cockpit {
        grid-template-columns: 1fr;
        grid-template-areas: "monthly" "left" "center" "right" "bottom" "groups" "quality";
      }
      .smart-left-rail,
      .smart-chart-grid,
      .smart-group-grid,
      .smart-monthly-strip > div,
      .smart-quality-counts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .smart-monthly-strip {
        grid-template-columns: 1fr;
      }
      .smart-flow-field {
        min-height: 360px;
      }
    }

    @media (max-width: 760px) {
      .smart-screen-top,
      .smart-screen-status {
        justify-content: flex-start;
      }
      .smart-left-rail,
      .smart-chart-grid,
      .smart-bottom-row,
      .smart-group-grid,
      .smart-monthly-strip > div,
      .smart-quality-counts,
      .smart-group-body,
      .smart-flow-nodes,
      .smart-flow-legend,
      .smart-bottleneck-panel ul {
        grid-template-columns: 1fr;
      }
      .smart-flow-field {
        min-height: auto;
      }
      .smart-flow-beam,
      .smart-flow-legend {
        position: static;
      }
      .smart-flow-node {
        min-height: 180px;
      }
      .smart-kpi strong,
      .smart-node-body strong {
        font-size: 28px;
      }
    }

    .a-summary-metric {
      appearance: none;
      border: 0;
      text-align: left;
      cursor: pointer;
      font: inherit;
    }
    .a-summary-metric:hover,
    .a-summary-metric:focus-visible {
      outline: 2px solid rgba(64, 158, 255, .32);
      outline-offset: 2px;
    }
    .a-summary-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 3200;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px;
      background: rgba(15, 23, 42, .44);
    }
    .a-summary-modal {
      width: min(1120px, calc(100vw - 28px));
      max-height: min(760px, calc(100vh - 28px));
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      overflow: hidden;
      border: 1px solid #DDE6F1;
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 24px 72px rgba(15, 23, 42, .24);
    }
    .a-summary-modal-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      padding: 16px 18px;
      border-bottom: 1px solid #E5EAF3;
      background: #F8FBFF;
    }
    .a-summary-modal-title {
      min-width: 0;
      display: grid;
      gap: 4px;
    }
    .a-summary-modal-title strong {
      color: #172033;
      font-size: 16px;
      line-height: 1.25;
    }
    .a-summary-modal-title span,
    .a-summary-modal-meta,
    .a-summary-modal-pager {
      color: #667085;
      font-size: 12px;
      line-height: 1.5;
    }
    .a-summary-modal-body {
      min-height: 0;
      display: grid;
      align-content: start;
      gap: 10px;
      padding: 14px 18px 16px;
      overflow: auto;
    }
    .a-summary-modal-table {
      min-height: 0;
      max-height: 360px;
      overflow: auto;
      border: 1px solid #E5EAF3;
      border-radius: 8px;
    }
    .a-summary-modal-table table {
      width: 100%;
      table-layout: fixed;
    }
    .a-summary-modal-table th,
    .a-summary-modal-table td {
      text-align: center;
      vertical-align: middle;
    }
    .a-summary-modal-table td {
      overflow-wrap: anywhere;
    }
    .a-summary-modal-table td .muted {
      text-align: center;
    }
    .a-summary-modal-pager {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }
    .a-summary-subdetail-stack {
      display: grid;
      gap: 14px;
      margin-top: 6px;
      padding-top: 12px;
      border-top: 1px solid #E5EAF3;
    }
    .a-summary-subdetail {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .a-summary-subdetail-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      color: #344054;
      font-size: 13px;
      line-height: 1.4;
    }
    .a-summary-subdetail-head span {
      color: #667085;
      font-size: 12px;
      white-space: nowrap;
    }
    .a-summary-evidence-notes {
      display: grid;
      gap: 4px;
      padding: 8px 10px;
      border: 1px solid #FEDF89;
      border-radius: 8px;
      background: #FFFAEB;
      color: #7A4B00;
      font-size: 12px;
      line-height: 1.5;
    }

    .metric.danger {
      border-color: #fecaca;
      background: #fff7f7;
    }

    .metric.danger .name,
    .metric.danger .value {
      color: #b42318;
    }

    .list-filter-summary {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.5;
    }
    .a-abnormal-reason-tag {
      border: 0;
      cursor: pointer;
      font: inherit;
      margin-left: 8px;
      vertical-align: middle;
    }
    .a-abnormal-reason-tag:hover {
      filter: brightness(.96);
    }

    .metric-note {
      margin-bottom: 12px;
      padding: 10px 12px;
      border: 1px solid #dbe7ff;
      border-radius: 10px;
      background: #f8fbff;
      color: #536079;
      font-size: 13px;
      line-height: 1.6;
    }

    .b-metric-detail-backdrop {
      position: fixed;
      inset: 0;
      z-index: 80;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(15, 23, 42, .38);
    }
    .b-metric-detail-modal {
      width: min(1120px, calc(100vw - 48px));
      max-height: calc(100vh - 48px);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      background: #fff;
      border: 1px solid #E2E8F0;
      border-radius: 10px;
      box-shadow: 0 24px 80px rgba(15, 23, 42, .22);
      overflow: hidden;
    }
    .b-metric-detail-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      border-bottom: 1px solid #E2E8F0;
      background: #F8FAFC;
    }
    .b-metric-detail-title {
      display: grid;
      gap: 3px;
      min-width: 0;
    }
    .b-metric-detail-title strong {
      font-size: 16px;
      color: #172033;
    }
    .b-metric-detail-title span,
    .b-metric-detail-meta,
    .b-metric-row-meta {
      color: #64748B;
      font-size: 12px;
    }
    .b-metric-detail-body {
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      gap: 10px;
      padding: 14px 16px;
      overflow: hidden;
    }
    .b-metric-detail-table-wrap {
      min-height: 0;
      overflow: auto;
      border: 1px solid #E2E8F0;
      border-radius: 8px;
    }
    .b-metric-detail-table {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
      font-size: 13px;
    }
    .b-metric-detail-table th,
    .b-metric-detail-table td {
      padding: 10px 12px;
      border-bottom: 1px solid #E2E8F0;
      text-align: left;
      vertical-align: top;
      word-break: break-word;
    }
    .b-metric-detail-table th {
      position: sticky;
      top: 0;
      z-index: 1;
      background: #F8FAFC;
      color: #475569;
      font-weight: 700;
    }
    .b-metric-detail-table th:nth-child(1) { width: 25%; }
    .b-metric-detail-table th:nth-child(2) { width: 11%; }
    .b-metric-detail-table th:nth-child(3) { width: 31%; }
    .b-metric-detail-table th:nth-child(4) { width: 15%; }
    .b-metric-detail-table th:nth-child(5) { width: 9%; }
    .b-metric-detail-table th:nth-child(6) { width: 9%; }
    .b-metric-open-detail {
      white-space: nowrap;
    }
    .b-metric-row-title {
      font-weight: 700;
      color: #172033;
      margin-bottom: 4px;
    }
    .b-metric-detail-pager {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      color: #475569;
      font-size: 13px;
    }

    .callback-buckets {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      align-items: start;
    }

    .callback-bucket {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: #fbfdff;
      min-width: 0;
      overflow: hidden;
    }

    .callback-bucket-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      padding: 10px 12px;
      border-bottom: 1px solid var(--line);
      font-size: 13px;
      font-weight: 700;
      color: #273347;
      background: #f7f9fc;
    }

    .callback-bucket-body {
      display: grid;
      gap: 8px;
      padding: 10px;
      max-height: 360px;
      overflow: auto;
    }

    .callback-bucket-body .pagination-bar {
      width: 100%;
      min-width: 0;
      margin: 0;
      align-items: flex-start;
      flex-direction: column;
    }

    .callback-bucket-body .pagination-actions {
      width: 100%;
      justify-content: flex-start;
      overflow-x: auto;
    }

    .callback-bucket-body .empty {
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .callback-task-card {
      display: grid;
      gap: 6px;
      padding: 10px;
      border: 1px solid #e7edf7;
      border-radius: 8px;
      background: #fff;
    }

    .callback-task-title {
      font-weight: 800;
      color: #1f2937;
      word-break: break-word;
    }

    .callback-task-meta {
      font-size: 12px;
      color: var(--muted);
      line-height: 1.45;
    }

    .callback-task-card button {
      justify-self: start;
    }

    .split {
      display: grid;
      grid-template-columns: minmax(420px, 0.92fr) minmax(580px, 1.08fr);
      gap: 16px;
      align-items: start;
    }

    .workbench-split {
      grid-template-columns: minmax(360px, 0.82fr) minmax(680px, 1.18fr);
      gap: 18px;
    }

    .side-stack,
    .action-stack {
      align-content: start;
      gap: 14px;
    }

    .action-stack .section,
    .side-stack .section {
      box-shadow: 0 8px 20px rgba(18, 31, 56, 0.06);
    }

    .action-form {
      align-items: start;
    }

    .action-form > label {
      min-height: 70px;
      padding: 10px;
      border: 1px solid #e8edf5;
      border-radius: 8px;
      background: #fbfdff;
    }

    .action-form > label[style*="grid-column"] {
      min-height: auto;
    }

    .action-form .inline {
      padding-top: 4px;
    }

    .workbench-note {
      margin-top: 10px;
      padding: 9px 11px;
      border: 1px solid #e6ebf3;
      border-radius: 8px;
      background: #fbfcff;
      color: var(--muted);
      line-height: 1.55;
      font-size: 12px;
    }

    .table-wrap {
      overflow: auto;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
    }

    .table-wrap.scroll-panel {
      max-height: 520px;
    }

    .workbench-split .table-wrap.scroll-panel {
      max-height: 610px;
    }

    .table-wrap.list-table table {
      min-width: 100%;
      table-layout: fixed;
    }

    .table-wrap.list-table th,
    .table-wrap.list-table td {
      padding: 12px 14px;
    }

    .row-title {
      font-weight: 750;
      line-height: 1.35;
      word-break: break-word;
    }

    .row-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 7px;
    }

    .mini-tag {
      display: inline-flex;
      align-items: center;
      min-height: 20px;
      padding: 1px 7px;
      border-radius: 999px;
      color: #4b5870;
      background: #f3f6fb;
      border: 1px solid #e0e6f0;
      font-size: 12px;
      line-height: 1.4;
      white-space: nowrap;
    }

    table {
      width: 100%;
      border-collapse: collapse;
      min-width: 760px;
      background: #fff;
    }

    th, td {
      padding: 11px 12px;
      border-bottom: 1px solid var(--line);
      text-align: left;
      vertical-align: top;
      font-size: 13px;
    }

    th {
      color: #4d5b70;
      background: #f8faff;
      position: sticky;
      top: 0;
      z-index: 1;
    }

    tr:hover td {
      background: #fbfcff;
    }

    tr.selectable-row {
      cursor: pointer;
    }

    tr.selectable-row td {
      transition: background 0.16s ease, box-shadow 0.16s ease, color 0.16s ease;
    }

    tr.selectable-row:hover td {
      background: #eef6ff;
    }

    tr.selected-row td {
      background: #dbeafe;
      border-bottom-color: #b8cdf8;
      color: #12214a;
    }

    tr.selected-row:hover td {
      background: #dbeafe;
    }

    tr.selected-row td:first-child {
      box-shadow: inset 5px 0 0 var(--brand);
      font-weight: 700;
    }

    tr.selected-row .muted {
      color: #445577;
    }

    .pill {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      border-radius: 999px;
      padding: 2px 8px;
      font-size: 12px;
      border: 1px solid var(--line);
      background: #fff;
      white-space: nowrap;
    }

    .pill.blue { color: var(--brand); background: var(--brand-soft); border-color: #c9dcff; }
    .pill.green { color: var(--green); background: var(--green-soft); border-color: #b9ebd1; }
    .pill.orange { color: var(--orange); background: var(--orange-soft); border-color: #f6d8a4; }
    .pill.red { color: var(--red); background: var(--red-soft); border-color: #ffc8c8; }

    .muted {
      color: var(--muted);
      margin-top: 3px;
    }

    .inline {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
    }

    .hint {
      padding: 10px 12px;
      border: 1px solid #dce5f7;
      background: #f8fbff;
      border-radius: var(--radius);
      color: #334155;
      font-size: 13px;
      line-height: 1.6;
    }

    .sync-warning {
      padding: 12px 14px;
      border: 1px solid #f5b6a8;
      background: #fff2ec;
      color: #a53b16;
      border-radius: var(--radius);
      font-weight: 700;
      line-height: 1.55;
    }

    .command-hero {
      display: grid;
      grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.9fr);
      gap: 16px;
      align-items: start;
    }

    .key-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .key-card {
      min-height: 98px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      padding: 12px;
      display: grid;
      gap: 6px;
      cursor: pointer;
    }

    .key-card:hover {
      border-color: #b8c4d8;
      box-shadow: 0 4px 14px rgba(18, 31, 56, 0.08);
    }

    .key-card.disabled,
    .funnel-node.disabled {
      cursor: default;
      opacity: 0.72;
    }

    .key-card.disabled:hover,
    .funnel-node.disabled:hover {
      border-color: var(--line);
      box-shadow: none;
    }

    .key-card.a { border-left: 5px solid var(--brand); }
    .key-card.b { border-left: 5px solid #f59e0b; }
    .key-card.c { border-left: 5px solid var(--green); }
    .key-card.all { border-left: 5px solid #64748b; }

    .key-card .label {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.3;
    }

    .key-card .number {
      font-size: 25px;
      font-weight: 850;
      line-height: 1.1;
    }

    .result-card {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      padding: 14px;
      display: grid;
      gap: 12px;
      box-shadow: var(--shadow);
    }

    .result-card.a { border-left: 5px solid var(--brand); }
    .result-card.b { border-left: 5px solid #f59e0b; }
    .result-card.c { border-left: 5px solid var(--green); }
    .result-card.boss { border-left: 5px solid var(--red); }

    .result-card-head {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 10px;
      flex-wrap: wrap;
    }

    .result-card-title {
      font-size: 17px;
      font-weight: 850;
      color: #1e293b;
    }

    .result-kpis {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 8px;
    }

    .result-kpi {
      border: 1px solid #e5eaf3;
      border-radius: 8px;
      padding: 9px 10px;
      background: #fbfdff;
      min-height: 70px;
    }

    .result-kpi span {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }

    .result-kpi strong {
      display: block;
      margin-top: 6px;
      font-size: 20px;
      line-height: 1.15;
      color: #172033;
    }

    .result-line {
      display: grid;
      grid-template-columns: 88px 1fr;
      gap: 10px;
      align-items: start;
      font-size: 13px;
      line-height: 1.55;
    }

    .result-line b {
      color: #475569;
    }

    .result-table .pill {
      min-height: 22px;
    }

    .result-table td {
      vertical-align: top;
    }

    .result-proof-row td {
      padding-top: 0;
      background: #fbfdff;
    }

    .result-proof-box {
      display: grid;
      grid-template-columns: minmax(180px, .9fr) minmax(260px, 1.35fr) minmax(180px, .9fr);
      gap: 10px;
      border: 1px solid #dbeafe;
      border-radius: 8px;
      background: #f8fbff;
      padding: 10px;
      font-size: 13px;
      line-height: 1.55;
    }

    .result-proof-item {
      min-width: 0;
    }

    .result-proof-title {
      margin-bottom: 4px;
      color: #64748b;
      font-size: 12px;
      font-weight: 800;
    }

    .result-proof-content {
      color: #1f2937;
      word-break: break-word;
    }

    .result-proof-details {
      margin-top: 8px;
      border: 1px solid #e2e8f0;
      border-radius: 8px;
      background: #fff;
      overflow: hidden;
    }

    .result-proof-details > summary {
      padding: 8px 10px;
      color: #1d4ed8;
      cursor: pointer;
      font-weight: 700;
      list-style: none;
      user-select: none;
    }

    .result-proof-details > summary::-webkit-details-marker {
      display: none;
    }

    .result-proof-details > summary::after {
      content: "展开";
      float: right;
      color: #64748b;
      font-size: 12px;
      font-weight: 700;
    }

    .result-proof-details[open] > summary::after {
      content: "收起";
    }

    .result-proof-list {
      display: grid;
      gap: 8px;
      padding: 0 10px 10px;
    }

    .result-proof-card {
      border: 1px solid #edf2f7;
      border-radius: 8px;
      background: #fbfdff;
      padding: 9px;
    }

    .result-proof-card-title {
      margin-bottom: 6px;
      color: #111827;
      font-weight: 800;
    }

    .result-proof-card-meta {
      color: #64748b;
      font-size: 12px;
      margin-bottom: 6px;
    }

    .result-proof-field-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px 10px;
    }

    .result-proof-field {
      min-width: 0;
      color: #475569;
      font-size: 12px;
    }

    .result-proof-field b {
      display: block;
      color: #64748b;
      font-size: 11px;
      font-weight: 700;
    }

    .result-proof-field span {
      display: block;
      color: #1f2937;
      overflow-wrap: anywhere;
    }

    .result-proof-actions {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      flex-wrap: wrap;
    }

    .result-proof-actions button {
      min-height: 34px;
    }

    @media (max-width: 1100px) {
      .result-proof-box {
        grid-template-columns: 1fr;
      }
      .result-proof-field-grid {
        grid-template-columns: 1fr;
      }
    }

    .funnel {
      display: grid;
      grid-template-columns: repeat(11, minmax(96px, 1fr));
      gap: 8px;
      overflow-x: auto;
      padding-bottom: 4px;
    }

    .funnel-node {
      position: relative;
      min-height: 78px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      padding: 10px;
      cursor: pointer;
    }

    .funnel-node:not(:last-child)::after {
      content: ">";
      position: absolute;
      right: -9px;
      top: 26px;
      color: #94a3b8;
      font-weight: 800;
      z-index: 1;
    }

    .funnel-node .node-name {
      color: #475569;
      font-size: 12px;
      line-height: 1.35;
    }

    .funnel-node .node-value {
      margin-top: 7px;
      font-size: 22px;
      font-weight: 850;
    }

    .funnel-node.blue { background: #f3f7ff; border-color: #cfe0ff; }
    .funnel-node.orange { background: #fff8eb; border-color: #f4d49b; }
    .funnel-node.green { background: #f0fbf5; border-color: #bdebd2; }
    .funnel-node.red { background: #fff1f1; border-color: #ffc8c8; }
    .funnel-node.gray { background: #f8fafc; border-color: #e2e8f0; }

    .boss-pricing-suggestions {
      margin-top: 12px;
      border-top: 1px solid var(--line);
      padding-top: 12px;
    }

    .boss-pricing-suggestions .suggestion-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 8px;
      color: var(--muted);
      font-size: 12px;
    }

    .boss-pricing-table {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
      font-size: 12px;
    }

    .boss-pricing-table th,
    .boss-pricing-table td {
      border: 1px solid var(--line);
      padding: 7px 8px;
      text-align: left;
      vertical-align: top;
      line-height: 1.45;
      word-break: break-word;
      background: #fff;
    }

    .boss-pricing-table th {
      background: #F8FAFC;
      color: #475467;
      font-weight: 800;
      white-space: nowrap;
    }

    .task-list {
      display: grid;
      gap: 8px;
      counter-reset: important;
    }

    .task-item {
      display: grid;
      grid-template-columns: 28px 1fr;
      gap: 8px;
      align-items: start;
      border: 1px solid var(--line);
      background: #fff;
      border-radius: var(--radius);
      padding: 10px;
      line-height: 1.55;
    }

    .task-item::before {
      counter-increment: important;
      content: counter(important);
      display: grid;
      place-items: center;
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background: var(--brand-soft);
      color: var(--brand);
      font-weight: 800;
      font-size: 12px;
    }

    .tri-column {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
    }

    .mini-panel {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      overflow: hidden;
    }

    .mini-panel h3 {
      margin: 0;
      padding: 10px 12px;
      font-size: 14px;
      border-bottom: 1px solid var(--line);
      background: #f8faff;
    }

    .breakpoint-row {
      display: grid;
      gap: 8px;
      padding: 10px 12px;
      border-bottom: 1px solid var(--line);
      border-left: 4px solid transparent;
    }

    .breakpoint-row:last-child { border-bottom: 0; }

    .breakpoint-row.is-red {
      border-left-color: var(--red);
      background: #fff7f7;
    }

    .breakpoint-row.is-yellow {
      border-left-color: var(--orange);
      background: #fffaf0;
    }

    .breakpoint-row.is-gray {
      border-left-color: #94a3b8;
      background: #f8fafc;
    }

    .breakpoint-main {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
    }

    .breakpoint-title-line {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 6px;
      margin-bottom: 4px;
    }

    .breakpoint-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.5;
    }

    .breakpoint-actions {
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap;
      gap: 8px;
    }

    .breakpoint-details {
      flex: 1 1 100%;
      min-width: 220px;
    }

    .breakpoint-details summary {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 36px;
      padding: 8px 12px;
      border: 1px solid #cbd5e1;
      border-radius: 8px;
      background: #fff;
      cursor: pointer;
      font-weight: 800;
      list-style: none;
      user-select: none;
    }

    .breakpoint-details summary::-webkit-details-marker { display: none; }

    .breakpoint-details[open] summary {
      margin-bottom: 8px;
      color: var(--brand);
      border-color: #bfdbfe;
      background: #eff6ff;
    }

    .breakpoint-detail-box {
      border: 1px solid #dbeafe;
      border-radius: 8px;
      background: #f8fbff;
      padding: 10px;
      color: var(--text);
    }

    .breakpoint-detail-head {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 8px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .breakpoint-detail-list {
      display: grid;
      gap: 6px;
    }

    .breakpoint-sample {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
      padding: 8px;
      line-height: 1.55;
    }

    .breakpoint-sample strong {
      display: block;
      margin-bottom: 2px;
      color: var(--text);
    }

    .breakpoint-sample span {
      display: block;
      color: var(--muted);
      font-size: 12px;
    }

    .severity-red td { background: #fff7f7; }
    .severity-yellow td { background: #fffbeb; }
    .severity-gray td { background: #f8fafc; }

    .status-select {
      min-width: 112px;
      padding: 5px 8px;
      min-height: 32px;
    }

    details.sop {
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }

    details.sop summary {
      cursor: pointer;
      padding: 14px 16px;
      font-weight: 800;
    }

    details.sop ol {
      margin: 0;
      padding: 0 26px 18px 42px;
      line-height: 1.8;
      color: #334155;
    }

    .compact-note {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.5;
    }

    .business-note {
      border: 1px solid #d9e7ff;
      background: #f3f8ff;
      color: #2b4d7a;
      border-radius: var(--radius);
      padding: 10px 12px;
      line-height: 1.65;
      font-size: 13px;
    }

    .copy-status {
      border: 1px solid #bfdbfe;
      background: #eff6ff;
      color: #1d4ed8;
      border-radius: var(--radius);
      padding: 10px 12px;
      line-height: 1.55;
      font-size: 13px;
    }

    .copy-status.error {
      border-color: #fecaca;
      background: #fff1f2;
      color: #b91c1c;
    }

    .tag-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .tag-checks {
      min-height: 38px;
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      align-items: center;
      border: 1px solid var(--line);
      border-radius: 7px;
      padding: 8px;
      background: #fff;
    }

    .tag-checks label {
      display: inline-flex;
      grid-auto-flow: column;
      align-items: center;
      width: auto;
      gap: 5px;
      color: #344054;
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 999px;
      padding: 3px 8px;
      font-size: 12px;
    }

    .tag-checks input {
      width: auto;
      min-height: 0;
      padding: 0;
    }

    .tech-config {
      display: none;
    }

    .assistant-box {
      background: #f9fafb;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 12px;
      line-height: 1.7;
      font-size: 13px;
      white-space: pre-wrap;
    }

    .ai-loading {
      border: 1px solid #bfdbfe;
      background: #eff6ff;
      color: #1d4ed8;
      border-radius: var(--radius);
      padding: 12px;
      font-size: 13px;
      line-height: 1.6;
    }

    .ai-result-card {
      display: grid;
      gap: 10px;
      border: 1px solid #dbeafe;
      background: #f8fbff;
      border-radius: var(--radius);
      padding: 12px;
      white-space: normal;
    }

    .ai-result-card .ai-result-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      font-weight: 800;
      color: #1f2937;
    }

    .ai-result-card .ai-result-text {
      white-space: pre-wrap;
      color: #334155;
      line-height: 1.75;
    }

    .ai-result-card .ai-result-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }

    .ai-result-card .ai-action-status {
      color: var(--muted);
      font-size: 12px;
    }

    .empty {
      padding: 34px 16px;
      text-align: center;
      color: var(--muted);
    }

.hidden {
  display: none !important;
}

.notification-bell {
  position: relative;
  min-width: 62px;
  min-height: 32px;
  border-color: #c7d7f2;
  background: #eef6ff;
  color: #185abc;
  font-weight: 800;
}

.notification-bell-count {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #d92d20;
  color: #fff;
  font-size: 11px;
  line-height: 18px;
  text-align: center;
  font-weight: 700;
}

.notification-plugin-root {
  position: fixed;
  right: 16px;
  top: 82px;
  z-index: 9999;
  pointer-events: auto;
}

.notification-toast-tray {
  display: grid;
  gap: 10px;
  width: min(400px, calc(100vw - 28px));
}

.notification-toast-tray-floating {
  position: fixed;
  right: 16px;
  bottom: 18px;
  z-index: 10000;
  pointer-events: none;
}

.notification-toast {
  pointer-events: auto;
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(400px, calc(100vw - 28px));
  max-height: min(220px, calc(100vh - 108px));
  overflow: hidden;
  border: 1px solid #d7dee8;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.2);
}

.notification-toast.is-c-scheduled-reminder {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 10030;
  width: min(680px, calc(100vw - 32px));
  max-height: min(620px, calc(100vh - 40px));
  transform: translate(-50%, -50%);
  border: 2px solid #2563eb;
  border-radius: 14px;
  box-shadow: 0 0 0 100vmax rgba(15, 23, 42, .48), 0 30px 90px rgba(15, 23, 42, .38);
}

.notification-toast.is-c-scheduled-reminder .notification-toast-head {
  min-height: 68px;
  padding: 14px 18px;
  background: linear-gradient(135deg, #eff6ff 0%, #ffffff 72%);
}

.notification-toast.is-c-scheduled-reminder .notification-toast-title strong {
  font-size: 20px;
  line-height: 28px;
  white-space: normal;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-badge {
  min-width: 78px;
  min-height: 30px;
  font-size: 14px;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-body {
  padding: 16px 22px 14px;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 20px;
  border-top: 0;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-field {
  grid-template-columns: 74px minmax(0, 1fr);
  min-height: 46px;
  padding: 9px 0;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-field span {
  font-size: 13px;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-field strong {
  overflow: visible;
  font-size: 15px;
  line-height: 22px;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

.notification-toast.is-c-scheduled-reminder .notification-toast-actions {
  padding: 12px 18px 16px;
}

@media (max-width: 640px) {
  .notification-toast.is-c-scheduled-reminder .notification-toast-fields {
    grid-template-columns: 1fr;
  }
}

.notification-toast-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 30px;
  align-items: center;
  gap: 8px;
  min-height: 52px;
  padding: 9px 12px 8px 14px;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f7fb 100%);
  border-bottom: 1px solid #e5eaf1;
  color: #111827;
}

.notification-toast-badge {
  display: inline-grid;
  place-items: center;
  min-width: 46px;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  background: #eaf2ff;
  color: #185abc;
  border: 1px solid #c7dbff;
  font-size: 12px;
  line-height: 16px;
  font-weight: 800;
  white-space: nowrap;
}

.notification-toast-title {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #111827;
  text-align: left;
}

.notification-toast-title strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 15px;
  line-height: 20px;
  font-weight: 800;
}

.notification-toast-title small {
  color: #64748b;
  font-size: 11px;
  line-height: 14px;
}

.notification-toast-close {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #475569;
  font-size: 20px;
  line-height: 1;
}

.notification-toast-close:hover {
  background: #eef2f7;
  color: #0f172a;
}

.notification-toast-body {
  display: grid;
  gap: 8px;
  min-height: 0;
  overflow: hidden;
  padding: 10px 16px 8px;
  border: 0;
  background: #ffffff;
  text-align: left;
  color: #172033;
}

.notification-toast-body > span {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: #475569;
  font-size: 13px;
  line-height: 18px;
  overflow-wrap: anywhere;
}

.notification-toast-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  align-content: start;
  overflow: hidden;
  border-top: 1px solid #eef2f7;
}

.notification-toast-field {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 28px;
  padding: 5px 0;
  border: 0;
  border-bottom: 1px solid #eef2f7;
  background: transparent;
}

.notification-toast-field span {
  display: block;
  color: #64748b;
  font-size: 12px;
  line-height: 16px;
}

.notification-toast-field strong {
  display: block;
  overflow: hidden;
  color: #111827;
  font-size: 14px;
  line-height: 20px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notification-toast-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  padding: 8px 12px 10px;
  background: #fbfcfe;
  border-top: 1px solid #e5eaf1;
}

.notification-toast-actions button {
  min-height: 32px;
  padding: 6px 12px;
  border-color: transparent;
  background: transparent;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.notification-toast-actions button:hover {
  border-color: #d8e0ea;
  background: #f4f7fb;
}

.notification-toast-actions button.primary {
  border-color: #2563eb;
  background: #2563eb;
  color: #ffffff;
  min-width: 104px;
}

.notification-toast-actions button.primary:hover {
  border-color: #1d4ed8;
  background: #1d4ed8;
}

.notification-toast.is-success {
  border-color: #86efac;
}

.notification-toast.is-warning {
  border-color: #fbbf24;
}

.notification-toast.is-error {
  border-color: #fca5a5;
}

.notification-toast.is-success .notification-toast-badge {
  background: #ecfdf5;
  border-color: #bbf7d0;
  color: #047857;
}

.notification-toast.is-warning .notification-toast-badge {
  background: #fffbeb;
  border-color: #fde68a;
  color: #b45309;
}

.notification-toast.is-error .notification-toast-badge {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

.notification-center-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: start end;
  padding: 72px 18px 18px;
  background: rgba(15, 23, 42, .22);
}

.notification-center-modal {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  width: min(640px, calc(100vw - 28px));
  max-height: min(680px, calc(100vh - 96px));
  overflow: hidden;
  border: 1px solid #d7dee8;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .26);
}

.notification-center-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  gap: 12px;
  align-items: center;
  padding: 14px 14px 12px 16px;
  border-bottom: 1px solid #e5eaf1;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f7fb 100%);
}

.notification-center-head div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.notification-center-head strong {
  color: #111827;
  font-size: 16px;
  line-height: 22px;
}

.notification-center-head span {
  color: #64748b;
  font-size: 12px;
}

.notification-center-close {
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #475569;
  font-size: 22px;
  line-height: 1;
}

.notification-center-close:hover {
  border-color: #d8e0ea;
  background: #eef2f7;
}

.notification-center-list {
  display: grid;
  gap: 10px;
  align-content: start;
  overflow: auto;
  padding: 12px;
  background: #f8fafc;
}

.notification-center-item {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e1e7ef;
  border-radius: 8px;
  background: #fff;
}

.notification-center-item.is-unread {
  border-color: #bcd3ff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .08);
}

.notification-center-item-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.notification-center-item-head strong {
  overflow: hidden;
  color: #111827;
  font-size: 14px;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notification-center-item-head time {
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}

.notification-center-status,
.notification-center-badge {
  display: inline-grid;
  place-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.notification-center-status {
  background: #eef2f7;
  color: #475569;
}

.notification-center-item.is-unread .notification-center-status {
  background: #eaf2ff;
  color: #185abc;
}

.notification-center-badge {
  background: #eef6ff;
  color: #1d4ed8;
}

.notification-center-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 4px 0 0;
}

.notification-center-field {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
  align-items: start;
  padding: 8px 10px;
  border: 1px solid #edf1f6;
  border-radius: 7px;
  background: #fbfdff;
}

.notification-center-field:nth-child(1),
.notification-center-field:nth-child(3),
.notification-center-field.is-note {
  grid-column: 1 / -1;
}

.notification-center-field span {
  color: #64748b;
  font-size: 12px;
  line-height: 20px;
  white-space: nowrap;
}

.notification-center-field strong {
  min-width: 0;
  color: #111827;
  font-size: 13px;
  line-height: 20px;
  overflow-wrap: anywhere;
  white-space: normal;
}

.notification-center-field.is-note {
  grid-template-columns: 1fr;
  gap: 5px;
}

.notification-center-field.is-note strong {
  max-height: 92px;
  overflow: auto;
  padding: 8px 9px;
  border: 1px solid #e5eaf1;
  border-radius: 6px;
  background: #ffffff;
}

.notification-center-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.notification-center-actions button {
  min-height: 30px;
  padding: 5px 11px;
  border-color: #d8e0ea;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.notification-center-actions button.primary {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}

.notification-center-empty {
  padding: 28px 12px;
  color: #64748b;
  text-align: center;
}

@media (max-width: 560px) {
  .notification-center-backdrop {
    padding: 58px 10px 10px;
    place-items: start center;
  }

  .notification-center-fields {
    grid-template-columns: 1fr;
  }

  .notification-center-item-head {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .notification-center-item-head time {
    grid-column: 2 / -1;
  }
}

    .boot-screen {
      min-height: 100vh;
      display: none;
      place-items: center;
      background: linear-gradient(180deg, #eef4ff 0%, #f7f9fd 100%);
      padding: 22px;
    }

    .boot-card {
      width: min(520px, 100%);
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 26px;
      box-shadow: var(--shadow);
    }

    .boot-card h1 {
      margin: 0 0 8px;
      font-size: 24px;
    }

    .boot-card p {
      margin: 0;
      color: var(--muted);
    }

    body.booting #bootScreen {
      display: grid;
    }

    body.booting #loginScreen,
    body.booting #appShell {
      display: none !important;
    }

    body:not(.booting) #bootScreen {
      display: none !important;
    }

    .login-screen {
      min-height: 100vh;
      display: grid;
      place-items: center;
      background: linear-gradient(180deg, #eef4ff 0%, #f7f9fd 100%);
      padding: 22px;
    }

    .login-card {
      width: min(520px, 100%);
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 24px;
    }

    .login-card h1 {
      margin: 0 0 6px;
      font-size: 24px;
    }

    .login-card p {
      margin: 0 0 20px;
      color: var(--muted);
      line-height: 1.6;
    }

    @media (max-width: 1080px) {
      .app { grid-template-columns: 1fr; }
      .side { position: sticky; top: 0; z-index: 20; padding: 12px; }
      .brand { margin-bottom: 10px; }
      .nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .split, .cols-2, .cols-3, .cols-4, .metric-row, .command-hero, .key-grid, .tri-column, .callback-buckets { grid-template-columns: 1fr; }
      .topbar { align-items: center; flex-direction: row; }
      .actions {
        width: min(620px, 58vw);
        justify-content: flex-end;
        gap: 7px;
      }
      .topbar-user {
        max-width: min(300px, 28vw);
      }
      .topbar-command-group {
        gap: 6px;
      }
    }

    @media (max-width: 760px) {
      .topbar {
        height: auto;
        min-height: 64px;
        max-height: none;
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        padding: 12px 14px;
      }

      .actions {
        width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 2px;
      }

      .topbar-user {
        max-width: none;
        flex: 0 0 auto;
      }
    }

    /* ============================================================
       浅色办公风 · 界面整容覆盖层（只改样式，不改任何逻辑/字段/接口）
       重新调色 :root 令牌后会级联到全站组件。
       ============================================================ */
    :root {
      --bg: #F6F7F9;
      --panel: #FFFFFF;
      --line: #E5E7EB;
      --text: #1F2937;
      --muted: #6B7280;
      --brand: #2563EB;
      --brand-soft: #EFF4FF;
      --green: #16A34A;
      --green-soft: #ECFDF3;
      --orange: #B45309;
      --orange-soft: #FFF7ED;
      --red: #DC2626;
      --red-soft: #FEF2F2;
      --warn: #B45309;
      --warn-soft: #FEF9E7;
      --b-accent: #F59E0B;
      --c-accent: #10B981;
      --shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 8px 20px rgba(16, 24, 40, 0.06);
      --radius: 10px;
    }

    body { font-size: 14px; line-height: 1.55; -webkit-font-smoothing: antialiased; }

    /* —— 排版宽度与间距 —— */
    .content { width: min(1440px, 100%); padding: 22px 24px 40px; gap: 20px; }
    .section { box-shadow: var(--shadow); }
    .section + .section { margin-top: 0; }
    .section-head { min-height: 56px; padding: 14px 18px; }
    .section-head h2 { font-size: 18px; font-weight: 700; letter-spacing: .2px; }
    .section-body { padding: 18px; }
    .grid { gap: 14px; }
    label { font-size: 14px; color: #374151; gap: 7px; }

    /* —— 顶部标题区 —— */
    .top-title h1 { font-size: 22px; font-weight: 750; }
    .top-title p { font-size: 13px; }
    .topbar { padding: 14px 24px; }

    /* —— 侧边导航：分组清晰 + 选中高亮 + A/B/C 浅色标识 —— */
    .side { background: #F0F3F8; border-right: 1px solid #E2E8F2; }
    .nav button { border-radius: 9px; font-size: 14px; padding: 11px 12px; color: #344256; }
    .nav button:hover { background: #ffffff; box-shadow: none; }
    .nav button span { font-size: 11px; color: var(--muted); font-weight: 600; }
    .nav button.active { box-shadow: 0 2px 10px rgba(37, 99, 235, 0.12); }
    .nav button[data-view="agroup"].active { box-shadow: inset 3px 0 0 var(--brand), 0 2px 10px rgba(37,99,235,.10); }
    .nav button[data-view="bgroup"].active { color: #92400E; box-shadow: inset 3px 0 0 var(--b-accent), 0 2px 10px rgba(245,158,11,.12); }
    .nav button[data-view="cgroup"].active { color: #047857; box-shadow: inset 3px 0 0 var(--c-accent), 0 2px 10px rgba(16,185,129,.12); }

    body:has(#view-manager:not(.hidden)) {
      --brand: #0f766e;
      --brand-soft: #e7f5f3;
      --line: #dce7e7;
      --shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 12px 28px rgba(21, 36, 47, 0.08);
      background: #f4f7f7;
    }
    body:has(#view-manager:not(.hidden)) .side {
      background:
        linear-gradient(180deg, #edf4f3 0%, #f6f8f8 64%, #f3f6f6 100%);
      border-right-color: #d5e2e1;
    }
    body:has(#view-manager:not(.hidden)) .brand {
      color: #0f5f59;
    }
    body:has(#view-manager:not(.hidden)) .brand-mark {
      background: #15242f;
      box-shadow: 0 8px 18px rgba(21, 36, 47, .18);
    }
    body:has(#view-manager:not(.hidden)) .nav button.active {
      color: #0f5f59;
      border-color: #cfe2e0;
      background: #ffffff;
      box-shadow: inset 3px 0 0 #0f766e, 0 8px 20px rgba(15, 95, 89, .10);
    }
    body:has(#view-manager:not(.hidden)) .nav button:hover {
      background: rgba(255, 255, 255, .82);
    }
    body:has(#view-manager:not(.hidden)) .topbar {
      background: rgba(255, 255, 255, .94);
      border-bottom-color: #dce7e7;
      box-shadow: 0 6px 18px rgba(21, 36, 47, .04);
    }
    body:has(#view-manager:not(.hidden)) .top-title h1 {
      color: #15242f;
    }
    body:has(#view-manager:not(.hidden)) button.primary {
      border-color: #0f766e;
      background: #0f766e;
      box-shadow: 0 4px 12px rgba(15, 118, 110, .18);
    }
    body:has(#view-manager:not(.hidden)) button.primary:hover {
      border-color: #0d625c;
      background: #0d625c;
    }

    /* —— 统一按钮 —— */
    button { border-radius: 8px; padding: 9px 14px; min-height: 38px; font-size: 14px; font-weight: 600; }
    button:hover { border-color: #C5D0E0; }
    button.primary { box-shadow: 0 2px 8px rgba(37, 99, 235, 0.18); }
    button.primary:hover { background: #1D4ED8; border-color: #1D4ED8; }
    /* 危险按钮：红色描边，不要大红实心 */
    button.danger { background: #fff; color: var(--red); border-color: #F2B8B8; box-shadow: none; }
    button.danger:hover { background: var(--red-soft); border-color: var(--red); }
    button:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }

    /* —— 表单字段：呼吸感 —— */
    input, select, textarea { min-height: 40px; border-radius: 8px; font-size: 14px; }
    textarea { min-height: 84px; line-height: 1.6; }
    .action-form > label { min-height: 76px; padding: 11px 12px; background: #FCFDFE; border-color: #EBEFF5; }
    .action-form > label:focus-within { border-color: #BFD3FF; background: #fff; }

    /* —— 卡片标题左侧业务识别色 —— */
    #view-bgroup .section > .section-head { box-shadow: inset 3px 0 0 var(--b-accent); }
    #view-cgroup .section > .section-head { box-shadow: inset 3px 0 0 var(--c-accent); }

    /* —— 指标卡 —— */
    .metric { padding: 14px 16px; border-radius: var(--radius); }
    .metric .value { font-size: 26px; }
    #view-bgroup .metric { border-top: 2px solid #FBE3B8; }
    #view-cgroup .metric { border-top: 2px solid #BBEBD3; }

    /* —— 状态标签（badge=.pill）更像标签按钮 —— */
    .pill { min-height: 23px; padding: 3px 10px; font-weight: 600; }
    .pill.blue { background: var(--brand-soft); border-color: #D2E0FB; }
    .pill.green { background: var(--green-soft); border-color: #BBEBD3; }
    .pill.orange { color: #B45309; background: #FFF4E2; border-color: #F6D8A4; }
    .pill.red { background: var(--red-soft); border-color: #F6C9C9; }

    /* —— 多选标签：pill/tag 样式 —— */
    .tag-checks { gap: 8px; padding: 9px; border-radius: 8px; }
    .tag-checks label { padding: 4px 11px; font-size: 13px; background: #F4F6F9; border-color: #E2E8F0; cursor: pointer; transition: .15s ease; }
    .tag-checks label:hover { border-color: #C5D0E0; }
    .tag-checks label:has(input:checked) { background: var(--brand-soft); border-color: #B6CEFB; color: #1D4ED8; font-weight: 600; }
    #view-cgroup .tag-checks label:has(input:checked) { background: var(--green-soft); border-color: #A7E3C6; color: #047857; }

    /* —— 表格：行高加大、表头浅灰、等宽强调 —— */
    .table-wrap.list-table th, .table-wrap.list-table td { padding: 14px 16px; }
    th, td { font-size: 14px; }
    th { background: #F4F6FA; color: #4B5768; font-weight: 700; }
    tr:hover td { background: #FAFBFD; }
    .row-meta .mini-tag { font-variant-numeric: tabular-nums; }

    /* —— 信息提示框 —— */
    .hint, .business-note { font-size: 13px; line-height: 1.65; border-radius: var(--radius); }
    .inline-status {
      display: inline-flex;
      align-items: center;
      min-height: 28px;
      padding: 4px 10px;
      border-radius: 999px;
      border: 1px solid #E2E8F0;
      background: #F8FAFC;
      color: var(--muted);
      font-size: 12px;
      font-weight: 600;
      line-height: 1.3;
    }
    .inline-status:empty { display: none; }
    .inline-status.green { color: #047857; background: var(--green-soft); border-color: #BBEBD3; }
    .inline-status.orange { color: #B45309; background: #FFF4E2; border-color: #F6D8A4; }
    .inline-status.red { color: #B42318; background: var(--red-soft); border-color: #F6C9C9; }
    .manager-action-filters {
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
      margin: 2px 0 6px;
    }
    .manager-action-filters button {
      min-height: 34px;
      padding: 6px 12px;
      font-size: 13px;
      background: #fff;
    }
    .manager-action-filters button.active {
      color: #1D4ED8;
      border-color: #BFD3FF;
      background: var(--brand-soft);
      box-shadow: 0 2px 8px rgba(37,99,235,.08);
    }
    .manager-action-summary-meta {
      gap: 6px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .manager-action-title {
      min-width: 220px;
      font-weight: 750;
    }

    /* ===== 新增可复用排版组件（供 B/C 模板使用） ===== */
    .intro-card {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 14px 16px;
      background: var(--brand-soft);
      line-height: 1.6;
    }
    .intro-card .intro-title { font-size: 16px; font-weight: 750; margin-bottom: 4px; }
    .intro-card .intro-desc { font-size: 13px; color: #475467; }
    .intro-card.b { background: #FFF7EC; border-color: #F6DDB0; }
    .intro-card.b .intro-title { color: #92400E; }
    .intro-card.c { background: #ECFDF3; border-color: #BBEBD3; }
    .intro-card.c .intro-title { color: #047857; }

    /* 表单内的小分区标题（整行，纯展示，不影响 FormData） */
    .action-form > label.field-group-title,
    .field-group-title {
      grid-column: 1 / -1;
      min-height: auto !important;
      padding: 4px 0 2px !important;
      margin-top: 6px;
      border: 0 !important;
      background: transparent !important;
      font-size: 13px;
      font-weight: 750;
      color: #334155;
      letter-spacing: .3px;
      display: flex; align-items: center; gap: 8px;
    }
    .field-group-title::before {
      content: "";
      width: 4px; height: 14px; border-radius: 2px;
      background: var(--brand);
    }
    #view-bgroup .field-group-title::before { background: var(--b-accent); }
    #view-cgroup .field-group-title::before { background: var(--c-accent); }
    .field-group-title .req { color: var(--red); font-weight: 700; margin-left: 2px; }

    /* 底部粘性操作条：长表单滚动时保存/转C按钮始终可见 */
    .action-form > .inline:last-child {
      position: sticky;
      bottom: 0;
      grid-column: 1 / -1;
      margin: 6px -18px -18px;
      padding: 12px 18px;
      background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #ffffff 36%);
      border-top: 1px solid var(--line);
      justify-content: flex-end;
      z-index: 2;
    }
    #view-cgroup .action-form button.primary { background: var(--green); border-color: var(--green); box-shadow: 0 2px 8px rgba(22,163,74,.18); }
    #view-cgroup .action-form button.primary:hover { background: #15803D; border-color: #15803D; }

    /* 可折叠次要字段区 */
    details.field-collapse { grid-column: 1 / -1; border: 1px solid var(--line); border-radius: 8px; background: #FBFCFE; }
    details.field-collapse > summary { cursor: pointer; padding: 10px 14px; font-size: 13px; font-weight: 700; color: #475467; list-style: none; display: flex; align-items: center; gap: 8px; }
    details.field-collapse > summary::-webkit-details-marker { display: none; }
    details.field-collapse > summary::before { content: "▸"; color: var(--muted); transition: transform .15s ease; }
    details.field-collapse[open] > summary::before { transform: rotate(90deg); }
    details.field-collapse > .grid { padding: 0 14px 14px; }

    /* 风险提醒小卡 */
    .risk-strip { display: grid; gap: 8px; }
    .risk-line { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 8px; font-size: 13px; border: 1px solid var(--line); background: #fff; }
    .risk-line.on { border-color: #F6C9C9; background: var(--red-soft); color: #B42318; font-weight: 600; }
    .risk-line.calm { color: var(--muted); }

    /* 物流最新轨迹独立信息框 */
    .trace-box { background: #F8FAFC; border: 1px solid var(--line); border-radius: 8px; padding: 11px 13px; font-size: 13px; line-height: 1.6; color: #344256; white-space: pre-wrap; }
    .multiline-text { display: block; white-space: pre-line; overflow-wrap: anywhere; line-height: 1.45; }

    /* ============================================================
       紧凑精炼 pass —— 收紧间距 / 统一控件尺寸 / 强化视觉层级
       （只改样式，不改任何逻辑/字段/接口；追加在末尾覆盖前述松散间距）
       ============================================================ */
    :root {
      --space-xs: 6px;
      --space-sm: 8px;
      --space-md: 12px;
      --space-lg: 16px;
      --space-xl: 20px;
      --ctl-h: 32px;            /* 输入框/下拉统一高度 */
      --btn-h: 40px;            /* 操作按钮高度 */
      --divider: #E8E8E8;       /* 区块分隔线 */
      --primary-green: #2ECC71; /* 主操作绿 */
      --danger-red: #E74C3C;    /* 危险操作红 */
    }

    /* —— 字号层级：工具标题 16/600/#333，区块标题 14/500/#666，标签 13/400/#666 —— */
    .top-title h1 { font-size: 16px; font-weight: 600; color: #333; }
    .top-title p { font-size: 12px; color: #888; }
    .section-head { min-height: 46px; padding: 10px var(--space-lg); }
    .section-head h2 { font-size: 14px; font-weight: 500; color: #666; letter-spacing: 0; }
    label { font-size: 13px; font-weight: 400; color: #666; gap: var(--space-xs); }

    /* —— 整体间距收紧 —— */
    .content { gap: var(--space-md); padding: 16px 20px 28px; }
    .section + .section { margin-top: 0; }
    .section-body { padding: var(--space-lg); }
    .grid { gap: var(--space-md); }
    .cols-2, .cols-3, .cols-4 { gap: var(--space-md) var(--space-lg); }
    .action-form { gap: var(--space-md) var(--space-lg); }
    .split { gap: var(--space-xl); }
    .workbench-split { gap: var(--space-xl); }
    .side-stack, .action-stack { gap: var(--space-md); }

    /* —— 去掉每个字段的卡片底，回到干净紧凑的标签+控件 —— */
    .action-form > label {
      min-height: auto;
      padding: 0;
      border: 0;
      background: transparent;
    }
    .action-form > label:focus-within { background: transparent; border: 0; }
    .action-form .inline { padding-top: 0; }

    /* —— 统一控件高度 32px、左边界对齐 —— */
    input, select { height: var(--ctl-h); min-height: var(--ctl-h); padding: 0 10px; font-size: 13px; border-radius: 6px; }
    textarea { min-height: 64px; padding: 7px 10px; font-size: 13px; line-height: 1.55; border-radius: 6px; }
    input:focus, select:focus, textarea:focus { outline: none; }

    /* —— 区块标题：14/500/#666 + 顶部灰色分隔线 + 20px 上间距 —— */
    .action-form > label.field-group-title,
    .field-group-title {
      font-size: 14px !important;
      font-weight: 500 !important;
      color: #666 !important;
      margin-top: var(--space-xl);
      padding: var(--space-md) 0 var(--space-sm) !important;
      letter-spacing: 0;
    }
    .action-form > label.field-group-title:not(:first-child),
    .field-group-title:not(:first-child) {
      border-top: 1px solid var(--divider) !important;
    }
    .field-group-title::before { width: 3px; height: 13px; }

    /* —— 多选/复选：2–3 列网格（不再散列）、相邻 8px —— */
    .tag-checks {
      display: grid !important;
      grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
      gap: var(--space-sm) !important;
      padding: var(--space-sm) !important;
    }
    .tag-checks label { margin: 0; justify-content: center; }

    /* —— 按钮：40px 高、14px、绿色主按钮 + 0.5px shadow，红色危险，禁用灰 —— */
    button { min-height: var(--btn-h); height: auto; padding: 0 16px; font-size: 14px; font-weight: 600; border-radius: 6px; }
    button.primary,
    #view-cgroup .action-form button.primary {
      background: var(--primary-green); border-color: var(--primary-green); color: #fff;
      box-shadow: 0 0.5px 2px rgba(46, 204, 113, 0.45);
    }
    button.primary:hover,
    #view-cgroup .action-form button.primary:hover { background: #29B765; border-color: #29B765; }
    button.danger { background: #fff; color: var(--danger-red); border-color: #F1B0AA; box-shadow: none; }
    button.danger:hover { background: #FDECEA; border-color: var(--danger-red); }
    button:disabled { color: #CCC !important; background: #F5F5F5 !important; border-color: #E5E5E5 !important; box-shadow: none; opacity: 1; }

    /* —— 底部提交条：按钮铺满整行 —— */
    .action-form > .inline:last-child { display: flex; gap: var(--space-sm); padding: var(--space-md) var(--space-lg); }
    .action-form > .inline:last-child > button { flex: 1 1 0; }

    /* —— 表格：行高 36px、1px 分隔线、紧凑表头 —— */
    table { border-collapse: collapse; }
    th, td,
    .table-wrap.list-table th, .table-wrap.list-table td { padding: 8px 12px; font-size: 13px; line-height: 1.4; }
    tbody td { height: 36px; }
    tbody tr { border-bottom: 1px solid #EEEEEE; }

    /* —— 左侧导航列表：每项 ~46px、项间 8px —— */
    .nav { display: flex; flex-direction: column; gap: var(--space-sm); }
    .nav button { min-height: 46px; }

    /* —— 指标卡收紧 —— */
    .metric { padding: 10px 12px; }
    .metric .value { font-size: 22px; }
    .metric-row { gap: var(--space-sm); }

    /* —— 移动端：间距 -25% —— */
    @media (max-width: 760px) {
      :root { --space-xs: 4px; --space-sm: 6px; --space-md: 9px; --space-lg: 12px; --space-xl: 15px; }
      .content { padding: 12px 14px 22px; }
      .tag-checks { grid-template-columns: repeat(auto-fill, minmax(46%, 1fr)); }
    }

    /* ============================================================
       负责人/老板指挥台专属排版
       只加强板块层级和对齐，不影响 A/B/C 员工工具表单。
       ============================================================ */
    #view-manager .command-hero {
      align-items: stretch;
      grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
    }
    #view-manager .command-hero > .section,
    #view-manager .action-stack {
      height: 100%;
    }
    #view-manager .action-stack {
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      align-content: stretch;
    }
    #view-manager .action-stack > .section {
      min-height: 0;
    }
    #view-manager .section-head {
      min-height: 48px;
      padding: 12px 16px;
      background: linear-gradient(180deg, #ffffff 0%, #f9fbfb 100%);
    }
    #view-manager .section-head h2 {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 15px;
      font-weight: 700;
      color: #273449;
      letter-spacing: 0;
    }
    #view-manager .section-head h2::before {
      content: "";
      width: 4px;
      height: 16px;
      border-radius: 999px;
      background: #64748b;
    }
    #view-manager .command-hero > .section:first-child .section-head h2::before { background: var(--brand); }
    #view-manager .action-stack > .section:first-child .section-head h2::before { background: var(--orange); }
    #view-manager .ai-panel .section-head h2::before { background: #6366f1; }
    #view-manager #manager-today-command .section-head h2::before { background: var(--red); }
    #view-manager #manager-transfer-out .section-head h2::before { background: var(--orange); }
    #view-manager #group-manager-bridge.group-a .section-head h2::before { background: var(--brand); }
    #view-manager #group-manager-bridge.group-b .section-head h2::before { background: var(--b-accent); }
    #view-manager #group-manager-bridge.group-c .section-head h2::before { background: var(--c-accent); }
    #view-manager #manager-breakpoints .section-head h2::before { background: var(--brand); }
    #view-manager #manager-alerts .section-head h2::before { background: var(--red); }
    #view-manager #manager-logistics .section-head h2::before { background: var(--green); }
    #view-manager #manager-checklist .section-head h2::before { background: var(--green); }

    #view-manager .group-manager-layout {
      display: grid;
      grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
      gap: 14px;
      align-items: stretch;
    }
    #view-manager .group-manager-intro {
      display: grid;
      align-content: start;
      gap: 12px;
      padding: 14px;
      border: 1px solid #E2E8F0;
      border-radius: 10px;
      background: #F8FAFC;
    }
    #view-manager .group-manager-intro strong {
      color: #172033;
      font-size: 16px;
    }
    #view-manager .group-manager-flow {
      display: grid;
      gap: 8px;
      color: #475467;
      font-size: 13px;
      line-height: 1.55;
    }
    #view-manager .group-manager-focus {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }
    #view-manager .group-focus-card {
      display: grid;
      gap: 10px;
      min-height: 128px;
      padding: 12px;
      border: 1px solid #E5EAF2;
      border-radius: 10px;
      background: #FFFFFF;
    }
    #view-manager .group-focus-card .label {
      color: #667085;
      font-size: 13px;
      font-weight: 700;
    }
    #view-manager .group-focus-card .number {
      color: #172033;
      font-size: 24px;
      font-weight: 850;
      line-height: 1;
    }
    #view-manager .group-focus-card .action {
      color: #475467;
      font-size: 13px;
      line-height: 1.45;
    }
    #view-manager .group-manager-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
    }
    @media (max-width: 1080px) {
      #view-manager .group-manager-layout,
      #view-manager .group-manager-focus,
      #view-manager .manager-today-grid {
        grid-template-columns: 1fr;
      }
    }

    #view-manager .key-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }
    #view-manager .key-card {
      min-height: 88px;
      padding: 12px 13px;
      gap: 8px;
      background: #fff;
    }
    #view-manager .key-card .label {
      color: #667085;
      font-size: 13px;
      line-height: 1.35;
    }
    #view-manager .key-card .number {
      color: #172033;
      font-size: 26px;
      font-weight: 850;
      letter-spacing: 0;
    }
    #view-manager .manager-diagnostic-tabs {
      display: flex;
      gap: 8px;
      overflow-x: auto;
      padding: 2px 2px 8px;
      border-bottom: 1px solid #E5EAF3;
    }
    #view-manager .manager-diagnostic-tab {
      display: grid;
      gap: 2px;
      min-width: 112px;
      padding: 9px 14px;
      border: 1px solid #DDE6F1;
      border-radius: 999px;
      background: #FFFFFF;
      color: #172033;
      text-align: left;
      cursor: pointer;
      transition: border-color .15s ease, background .15s ease, color .15s ease;
    }
    #view-manager .manager-diagnostic-tab:hover {
      border-color: #AFC7F8;
      background: #F8FBFF;
    }
    #view-manager .manager-diagnostic-tab.active {
      border-color: #2563EB;
      background: #EEF4FF;
      box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .16);
    }
    #view-manager .manager-diagnostic-title {
      color: #1D4ED8;
      font-size: 13px;
      font-weight: 850;
    }
    #view-manager .manager-diagnostic-tab strong {
      color: #172033;
      font-size: 15px;
      line-height: 1.1;
    }
    #view-manager .manager-diagnostic-panel {
      display: grid;
      gap: 12px;
      padding-top: 4px;
    }
    #view-manager .manager-sample-trigger {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 10px;
      border: 1px solid #BBD3FF;
      border-radius: 999px;
      background: #EFF6FF;
      color: #1D4ED8;
      font-size: 12px;
      font-weight: 800;
      cursor: pointer;
      white-space: nowrap;
    }
    #view-manager .manager-sample-trigger strong {
      color: #172033;
      font-size: 13px;
    }
    #view-manager .manager-sample-trigger:hover {
      border-color: #2563EB;
      background: #DBEAFE;
    }
    #view-manager .manager-sample-trigger.disabled,
    #view-manager .manager-sample-trigger:disabled {
      cursor: not-allowed;
      opacity: .55;
    }
    .manager-sample-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 3200;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px;
      background: rgba(15, 23, 42, .46);
    }
    .manager-sample-modal {
      width: min(1080px, calc(100vw - 28px));
      max-height: min(760px, calc(100vh - 28px));
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      overflow: hidden;
      border: 1px solid #DDE6F1;
      border-radius: 18px;
      background: #FFFFFF;
      box-shadow: 0 24px 72px rgba(15, 23, 42, .24);
    }
    .manager-sample-modal-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      padding: 16px 18px;
      border-bottom: 1px solid #E5EAF3;
      background: linear-gradient(180deg, #F8FBFF 0%, #FFFFFF 100%);
    }
    .manager-sample-modal-title {
      min-width: 0;
      display: grid;
      gap: 4px;
    }
    .manager-sample-modal-title strong {
      color: #172033;
      font-size: 16px;
      line-height: 1.25;
    }
    .manager-sample-modal-title span {
      color: #667085;
      font-size: 12px;
      line-height: 1.5;
    }
    .manager-sample-modal-body {
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      gap: 10px;
      padding: 14px 18px 16px;
    }
    .manager-sample-modal-meta,
    .manager-sample-modal-pager {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
      color: #667085;
      font-size: 12px;
    }
    .manager-sample-table-wrap {
      min-height: 0;
      overflow: auto;
    }
    .manager-sample-table th:first-child,
    .manager-sample-table td:first-child {
      width: 56px;
      text-align: center;
      color: #667085;
    }
    .manager-sample-table th:nth-child(2),
    .manager-sample-table td:nth-child(2) {
      min-width: 180px;
    }
    .manager-sample-table th:nth-child(5),
    .manager-sample-table td:nth-child(5) {
      min-width: 360px;
      max-width: 520px;
      white-space: normal;
      line-height: 1.55;
    }
    #view-manager .manager-today-grid {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 10px;
    }
    #view-manager .manager-today-card {
      display: grid;
      grid-template-rows: auto auto 1fr;
      gap: 8px;
      min-height: 118px;
      padding: 13px;
      text-align: left;
      border: 1px solid #E2E8F0;
      border-radius: 8px;
      background: #FFFFFF;
      color: #1F2937;
      box-shadow: none;
    }
    #view-manager .manager-today-card:hover {
      border-color: #BFD3FF;
      background: #F8FBFF;
    }
    #view-manager .manager-today-card .label {
      color: #667085;
      font-size: 13px;
      font-weight: 750;
      line-height: 1.25;
    }
    #view-manager .manager-today-card strong {
      color: #172033;
      font-size: 28px;
      line-height: 1;
      letter-spacing: 0;
    }
    #view-manager .manager-today-card .note {
      color: #475467;
      font-size: 12px;
      line-height: 1.45;
    }
    #view-manager .manager-today-card.red {
      border-color: #F2B8B5;
      background: #FFF7F7;
    }
    #view-manager .manager-today-card.orange {
      border-color: #F6D8A4;
      background: #FFF9EF;
    }
    #view-manager .manager-today-card.green {
      border-color: #BBEBD3;
      background: #F6FEFA;
    }
    #view-manager .manager-today-rule {
      margin-top: 10px;
      color: #475467;
      font-size: 13px;
      line-height: 1.55;
    }
    @media (max-width: 1080px) {
      #view-manager .manager-today-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }
    @media (max-width: 760px) {
      #view-manager .manager-today-grid {
        grid-template-columns: 1fr;
      }
    }
    #view-manager .task-list {
      gap: 9px;
    }
    #view-manager .task-item {
      min-height: 44px;
      padding: 10px 12px;
      color: #273449;
      background: #ffffff;
      border-color: #e5eaf2;
      font-size: 14px;
      line-height: 1.55;
    }
    #view-manager .ai-panel .section-body {
      align-content: start;
    }
    #view-manager .ai-panel .hint,
    #view-manager #manager-transfer-out .hint {
      color: #344256;
      background: #f8fbff;
      border-color: #dbe7f8;
      font-size: 13px;
    }
    #view-manager .manager-page-shell {
      display: grid;
      gap: 18px;
      min-width: 0;
      padding: 2px;
      color: #22303c;
    }
    #view-manager .manager-top-grid {
      display: grid;
      grid-template-columns: minmax(300px, .78fr) minmax(520px, 1.22fr);
      gap: 14px;
      align-items: stretch;
      min-width: 0;
    }
    #view-manager .manager-top-card {
      min-width: 0;
      margin: 0;
      border-color: #dce7e7;
      background: linear-gradient(180deg, #ffffff 0%, #fbfdfc 100%);
      box-shadow: 0 14px 34px rgba(20, 34, 45, .08);
    }
    #view-manager .manager-summary-tabs {
      overflow: hidden;
      border-color: #cfdede;
      background: #ffffff;
    }
    #view-manager .manager-summary-tabs-head {
      align-items: stretch;
      gap: 16px;
      padding-bottom: 0;
    }
    #view-manager .manager-summary-tab-list {
      display: flex;
      align-items: stretch;
      justify-content: flex-end;
      gap: 8px;
      min-width: 0;
      flex: 1 1 520px;
      padding-top: 8px;
      overflow-x: auto;
      scrollbar-gutter: stable;
    }
    #view-manager .manager-summary-tab {
      position: relative;
      min-height: 54px;
      min-width: 132px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 16px;
      border: 1px solid transparent;
      border-radius: 8px 8px 0 0;
      background: transparent;
      color: #34464c;
      font-size: 15px;
      font-weight: 850;
      white-space: nowrap;
      box-shadow: none;
    }
    #view-manager .manager-summary-tab:hover {
      color: #0f766e;
      background: rgba(255, 255, 255, .75);
    }
    #view-manager .manager-summary-tab.active {
      color: #0f5f59;
      background: #ffffff;
      border-color: #cfe2e0 #cfe2e0 #ffffff;
      box-shadow: 0 -1px 0 #ffffff, 0 10px 20px rgba(18, 48, 52, .08);
    }
    #view-manager .manager-summary-tab.active::after {
      content: "";
      position: absolute;
      right: 18px;
      bottom: -1px;
      left: 18px;
      height: 3px;
      border-radius: 3px 3px 0 0;
      background: #0f766e;
    }
    #view-manager .manager-summary-tab strong {
      min-width: 26px;
      height: 22px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 8px;
      border-radius: 999px;
      background: #e8f5f3;
      color: #1b625d;
      font-size: 12px;
      font-weight: 850;
      font-variant-numeric: tabular-nums;
    }
    #view-manager .manager-summary-tab.active strong {
      background: #dff2ef;
      color: #0f766e;
    }
    #view-manager .manager-summary-tab-body {
      padding-top: 16px;
    }
    #view-manager .manager-summary-tab-panel > .section {
      margin: 0;
      border: 0;
      box-shadow: none;
    }
    #view-manager .manager-summary-tab-panel .section-head {
      padding: 0 0 12px;
    }
    #view-manager .manager-operations-hub {
      display: grid;
      gap: 14px;
      min-width: 0;
      padding: 18px;
      border: 1px solid #cadcdd;
      border-radius: 12px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(247, 251, 250, .96) 100%),
        linear-gradient(135deg, rgba(12, 116, 110, .10), rgba(183, 121, 31, .07));
      box-shadow: 0 18px 42px rgba(16, 31, 40, .12);
    }
    #view-manager .manager-operations-head {
      display: grid;
      grid-template-columns: minmax(260px, 1fr) minmax(420px, .9fr);
      gap: 14px;
      align-items: end;
      min-width: 0;
    }
    #view-manager .manager-operations-head h2 {
      margin: 0;
      color: #15242f;
      font-size: 23px;
      font-weight: 900;
      letter-spacing: 0;
    }
    #view-manager .manager-operations-head p {
      margin: 6px 0 0;
      color: #607178;
      font-size: 13px;
      line-height: 1.5;
    }
    #view-manager .manager-operations-kpis {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      min-width: 0;
    }
    #view-manager .manager-operations-kpis .metric {
      margin: 0;
      min-height: 64px;
      border-color: #d8e5e5;
      background: rgba(255, 255, 255, .88);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 8px 18px rgba(18, 38, 48, .06);
    }
    #view-manager .manager-operations-grid {
      display: grid;
      gap: 14px;
      min-width: 0;
    }
    #view-manager .manager-secondary-grid {
      display: grid;
      grid-template-columns: minmax(360px, .9fr) minmax(360px, 1.1fr);
      gap: 14px;
      align-items: start;
      min-width: 0;
    }
    #view-manager .manager-sop {
      min-width: 0;
      margin: 0;
      border-color: #dce7e7;
      background: linear-gradient(180deg, #ffffff 0%, #fbfdfc 100%);
      box-shadow: 0 12px 26px rgba(20, 34, 45, .07);
    }
    #view-manager .manager-operation-card,
    #view-bgroup .manager-operation-card,
    #view-manager #manager-checklist,
    #view-manager #manager-action-loop,
    #view-manager #manager-logistics {
      margin: 0;
      min-width: 0;
      border-color: #dce7e7;
      background: linear-gradient(180deg, #ffffff 0%, #fbfdfc 100%);
      box-shadow: 0 12px 28px rgba(20, 34, 45, .08);
    }
    #view-manager .manager-checklist-shell {
      min-width: 0;
    }
    #view-manager .manager-brief-note {
      color: #52666a;
      background: #f6faf9;
      border-color: #dce9e8;
      font-size: 12px;
    }
    #view-manager #manager-transfer-out .transfer-out-summary,
    #view-bgroup #bManagerAuxTabs .transfer-out-summary {
      display: grid;
      grid-template-columns: minmax(230px, .55fr) minmax(360px, 1fr);
      gap: 12px;
      align-items: stretch;
      padding: 0;
      border-bottom: 1px solid #dce7e7;
      background: #ffffff;
    }
    #view-manager #manager-transfer-out .transfer-out-head-main,
    #view-bgroup #bManagerAuxTabs .transfer-out-head-main {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      padding: 12px 14px;
      border-right: 1px solid #dce7e7;
      background:
        linear-gradient(180deg, #ffffff 0%, #f7fbfa 100%),
        linear-gradient(90deg, rgba(12, 116, 110, .08), transparent);
    }
    #view-manager #manager-transfer-out .transfer-out-head-main h2,
    #view-bgroup #bManagerAuxTabs .transfer-out-head-main h2 {
      margin: 0;
      color: #15242f;
      font-size: 18px;
      font-weight: 900;
      letter-spacing: 0;
    }
    #view-manager #manager-transfer-out .transfer-out-tabs,
    #view-bgroup #bManagerAuxTabs .transfer-out-tabs {
      display: flex;
      align-items: stretch;
      justify-content: flex-end;
      gap: 8px;
      width: 100%;
      min-width: 0;
      padding: 8px 12px 0;
      background: #f5f9f8;
      box-shadow: inset 0 -1px 0 #dce7e7;
    }
    #view-manager #manager-transfer-out .transfer-out-tab,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab {
      position: relative;
      min-height: 56px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-width: 150px;
      padding: 0 18px;
      border: 1px solid transparent;
      border-radius: 8px 8px 0 0;
      background: transparent;
      color: #34464c;
      font-size: 16px;
      font-weight: 800;
      white-space: nowrap;
      box-shadow: none;
    }
    #view-manager #manager-transfer-out .transfer-out-tab:hover,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab:hover {
      color: #0f766e;
      background: rgba(255, 255, 255, .72);
    }
    #view-manager #manager-transfer-out .transfer-out-tab.is-active,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab.is-active {
      color: #0f5f59;
      background: #ffffff;
      border-color: #cfe2e0 #cfe2e0 #ffffff;
      box-shadow: 0 -1px 0 #ffffff, 0 10px 20px rgba(18, 48, 52, .08);
    }
    #view-manager #manager-transfer-out .transfer-out-tab.is-active::after,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab.is-active::after {
      content: "";
      position: absolute;
      right: 20px;
      bottom: -1px;
      left: 20px;
      height: 3px;
      border-radius: 3px 3px 0 0;
      background: #0f766e;
    }
    #view-manager #manager-transfer-out .transfer-out-tab em,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab em {
      min-width: 30px;
      height: 24px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 9px;
      border-radius: 999px;
      background: #e8f5f3;
      color: #1b625d;
      font-size: 13px;
      font-weight: 800;
      font-style: normal;
      font-variant-numeric: tabular-nums;
    }
    #view-manager #manager-transfer-out .transfer-out-tab.is-active em,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab.is-active em {
      background: #dff2ef;
      color: #0f766e;
    }
    #view-manager #manager-transfer-out,
    #view-bgroup #bManagerAuxTabs {
      border-color: #cfdede;
      background: #ffffff;
      box-shadow: 0 10px 24px rgba(31, 45, 61, .08), 0 2px 0 rgba(15, 118, 110, .04);
      max-width: 100%;
      min-width: 0;
      overflow: hidden;
    }
    #view-manager #manager-transfer-out .section-body {
      display: grid;
      gap: 12px;
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
    }
    #view-manager #manager-transfer-out .transfer-out-board {
      display: grid;
      gap: 10px;
      max-height: 590px;
      max-width: 100%;
      min-width: 0;
      overflow-x: hidden;
      overflow-y: auto;
      padding-right: 2px;
    }
    #view-manager #manager-transfer-out .transfer-out-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, .34fr);
      gap: 12px;
      align-items: stretch;
      min-width: 0;
      padding: 12px;
      border: 1px solid #dfe9e8;
      border-radius: 8px;
      background: linear-gradient(180deg, #ffffff 0%, #fcfefe 100%);
      box-shadow: 0 8px 20px rgba(20, 34, 45, .06);
    }
    #view-manager #manager-transfer-out .deal-cancel-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, .28fr);
      gap: 12px;
      align-items: stretch;
      min-width: 0;
      padding: 12px;
      border: 1px solid #e3e2da;
      border-radius: 8px;
      background: linear-gradient(180deg, #ffffff 0%, #fffdf8 100%);
      box-shadow: 0 8px 20px rgba(44, 35, 21, .06);
    }
    #view-manager #manager-transfer-out .deal-cancel-main {
      display: grid;
      grid-template-columns: minmax(150px, .9fr) minmax(140px, .74fr) minmax(220px, 1.28fr) minmax(190px, 1fr);
      gap: 10px;
      min-width: 0;
    }
    #view-manager #manager-transfer-out .deal-cancel-review {
      display: grid;
      gap: 9px;
      min-width: 0;
      padding: 10px;
      border: 1px solid #e5ded0;
      border-radius: 8px;
      background: #fffaf2;
    }
    #view-manager #manager-transfer-out .deal-cancel-review label > span {
      display: block;
      margin-bottom: 5px;
      color: #725322;
      font-size: 12px;
      font-weight: 800;
    }
    #view-manager #manager-transfer-out .deal-cancel-review input {
      width: 100%;
      min-height: 32px;
      height: 32px;
      padding: 4px 8px;
      font-size: 13px;
    }
    #view-manager #manager-transfer-out .transfer-out-main {
      display: grid;
      grid-template-columns: minmax(150px, .95fr) minmax(130px, .72fr) minmax(220px, 1.35fr) minmax(150px, .85fr);
      gap: 10px;
      min-width: 0;
    }
    #view-manager #manager-transfer-out .transfer-out-cell {
      min-width: 0;
      padding: 9px 10px;
      border: 1px solid #e4eceb;
      border-radius: 8px;
      background: #ffffff;
      color: #34464c;
      font-size: 13px;
      line-height: 1.45;
      overflow-wrap: anywhere;
      word-break: break-word;
    }
    #view-manager #manager-transfer-out .transfer-label,
    #view-manager #manager-transfer-out .transfer-out-edit label > span {
      display: block;
      margin-bottom: 5px;
      color: #5a6868;
      font-size: 12px;
      font-weight: 800;
    }
    #view-manager #manager-transfer-out .transfer-out-edit {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 9px;
      min-width: 0;
      padding: 10px;
      border: 1px solid #dfe9e8;
      border-radius: 8px;
      background: #f6faf9;
    }
    #view-manager #manager-transfer-out .transfer-out-edit label,
    #view-manager #manager-transfer-out .transfer-out-proof {
      min-width: 0;
    }
    #view-manager #manager-transfer-out .transfer-note-field,
    #view-manager #manager-transfer-out .transfer-out-proof {
      grid-column: 1 / -1;
    }
    #view-manager #manager-transfer-out .transfer-out-edit input,
    #view-manager #manager-transfer-out .transfer-out-edit select {
      width: 100%;
      min-height: 30px;
      height: 30px;
      padding: 3px 8px;
      font-size: 13px;
    }
    #view-manager #manager-transfer-out .transfer-out-actions {
      grid-column: 1 / -1;
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
      min-width: 0;
    }
    #view-manager #manager-transfer-out .transfer-out-actions button {
      min-height: 32px;
      padding: 0 10px;
      font-size: 13px;
    }
    #view-manager #manager-transfer-out .transfer-customer-name,
    #view-manager #manager-transfer-out .transfer-goods-text {
      color: #15242f;
      font-weight: 700;
      line-height: 1.45;
    }
    #view-manager #manager-transfer-out .transfer-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      margin-top: 6px;
    }
    #view-manager #manager-transfer-out .transfer-meta span {
      display: inline-flex;
      align-items: center;
      min-height: 22px;
      padding: 2px 7px;
      border-radius: 999px;
      color: #4a5c60;
      background: #f3f7f6;
      border: 1px solid #dce7e7;
      font-size: 12px;
      white-space: nowrap;
    }
    #view-manager #manager-transfer-out .transfer-proof-line {
      margin-top: 6px;
      color: #0f766e;
      font-size: 12px;
      line-height: 1.35;
    }
    #view-manager #manager-transfer-out .transfer-proof-line.pending {
      color: #a16207;
    }
    #view-manager #manager-transfer-out .transfer-warning {
      margin-top: 6px;
      padding: 5px 7px;
      border-radius: 6px;
      color: #8a4b0f;
      background: #fff8ea;
      border: 1px solid #edd7a6;
      font-size: 12px;
      line-height: 1.4;
    }
    #view-manager #manager-transfer-out .transfer-audit {
      margin-top: 6px;
      color: #5a6868;
      font-size: 12px;
    }
    #view-manager #manager-transfer-out .transfer-audit summary {
      cursor: pointer;
      color: #0f766e;
      font-weight: 600;
    }
    #view-manager #manager-transfer-out .transfer-audit-body {
      display: grid;
      gap: 4px;
      margin-top: 6px;
      padding: 7px;
      border-radius: 6px;
      background: #f6faf9;
      border: 1px solid #dce7e7;
      word-break: break-all;
    }
    @media (max-width: 1180px) {
      #view-manager .manager-top-grid,
      #view-manager .manager-operations-head,
      #view-manager .manager-secondary-grid {
        grid-template-columns: 1fr;
      }
      #view-manager #manager-transfer-out .transfer-out-card {
        grid-template-columns: 1fr;
      }
      #view-manager #manager-transfer-out .deal-cancel-row {
        grid-template-columns: 1fr;
      }
      #view-manager #manager-transfer-out .transfer-out-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      #view-manager #manager-transfer-out .deal-cancel-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }
    @media (max-width: 760px) {
      #view-manager .manager-operations-hub {
        padding: 12px;
        border-radius: 8px;
      }
      #view-manager .manager-operations-kpis {
        grid-template-columns: 1fr;
      }
      #view-manager #manager-transfer-out .transfer-out-summary,
      #view-bgroup #bManagerAuxTabs .transfer-out-summary {
        grid-template-columns: 1fr;
      }
      #view-manager #manager-transfer-out .transfer-out-head-main,
      #view-bgroup #bManagerAuxTabs .transfer-out-head-main {
        border-right: 0;
        border-bottom: 1px solid #e5eaf2;
      }
      #view-manager #manager-transfer-out .transfer-out-summary,
      #view-bgroup #bManagerAuxTabs .transfer-out-summary {
        overflow: hidden;
      }
      #view-manager #manager-transfer-out .transfer-out-tabs,
      #view-bgroup #bManagerAuxTabs .transfer-out-tabs {
        flex-wrap: wrap;
        justify-content: stretch;
        padding: 8px 10px 0;
      }
      #view-manager #manager-transfer-out .transfer-out-tab,
      #view-bgroup #bManagerAuxTabs .transfer-out-tab {
        flex: 1 1 180px;
        min-height: 50px;
        padding: 0 14px;
        font-size: 15px;
      }
      #view-manager #manager-transfer-out .transfer-out-main,
      #view-manager #manager-transfer-out .deal-cancel-main,
      #view-manager #manager-transfer-out .transfer-out-edit {
        grid-template-columns: 1fr;
      }
      #view-manager #manager-transfer-out .transfer-note-field,
      #view-manager #manager-transfer-out .transfer-out-proof {
        grid-column: auto;
      }
      #view-manager #manager-transfer-out .transfer-out-actions button,
      #view-manager #manager-transfer-out .transfer-out-actions .pill {
        width: 100%;
      }
    }
    #view-manager #manager-breakpoints .mini-panel h3 {
      color: #273449;
      font-size: 14px;
      font-weight: 700;
      background: #f7faff;
    }
    #view-manager .breakpoint-row strong {
      font-size: 14px;
      color: #1f2937;
    }
    #view-manager .breakpoint-row .muted {
      font-size: 12px;
      line-height: 1.45;
    }
    #view-manager .table-wrap th {
      color: #4b5870;
      font-weight: 700;
    }
    #view-manager #manager-logistics table,
    #view-dashboard #dashboard-logistics table {
      min-width: 0;
      width: 100%;
      table-layout: fixed;
    }
    #view-manager #manager-logistics th,
    #view-manager #manager-logistics td,
    #view-dashboard #dashboard-logistics th,
    #view-dashboard #dashboard-logistics td {
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: break-word;
    }
    #view-manager #manager-logistics th:last-child,
    #view-manager #manager-logistics td:last-child,
    #view-dashboard #dashboard-logistics th:last-child,
    #view-dashboard #dashboard-logistics td:last-child {
      width: 132px;
    }
    #view-manager #manager-logistics td:last-child .logistics-action-grid,
    #view-dashboard #dashboard-logistics td:last-child .logistics-action-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px;
      min-width: 0;
    }
    #view-manager #manager-logistics td:last-child .logistics-action-grid button,
    #view-dashboard #dashboard-logistics td:last-child .logistics-action-grid button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: 30px;
      min-width: 0;
      max-width: 100%;
      width: 100%;
      padding: 0 6px;
      border-radius: 8px;
      font-size: 12px;
      line-height: 1;
      white-space: nowrap;
    }
    #view-manager #manager-logistics td:last-child .logistics-action-grid button:disabled,
    #view-dashboard #dashboard-logistics td:last-child .logistics-action-grid button:disabled {
      opacity: .55;
      cursor: not-allowed;
    }

    /* ============================================================
       B端两栏工作台骨架 —— 真正挂到 B组/C组 DOM 上的紧凑布局
       （只改样式与结构，不动任何字段名/接口/保存逻辑）
       这一层位于最后，权重足够覆盖旧的松散样式。
       ============================================================ */
    .bc-workbench {
      display: grid;
      grid-template-columns: 380px minmax(0, 1fr);
      gap: 16px;
      align-items: stretch;
      height: calc(100vh - 150px);
      min-height: 420px;
      overflow: hidden;
    }
    .bc-list-pane {
      height: 100%;
      min-height: 0;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      background: #fff;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
    }
    .bc-list-head {
      position: sticky; top: 0; z-index: 1;
      display: flex; align-items: center; justify-content: space-between;
      padding: 10px 12px;
      background: #F9FAFB; border-bottom: 1px solid #E5E7EB;
      font-size: 13px; font-weight: 600; color: #374151;
    }
    .bc-list-search {
      position: sticky; top: 43px; z-index: 1;
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
      padding: 10px 12px;
      background: #fff;
      border-bottom: 1px solid #EEF2F7;
    }
    .b-search-main {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 58px 58px;
      gap: 8px;
      align-items: center;
      min-width: 0;
    }
    .b-search-main > input {
      min-width: 0;
      height: 34px;
      padding: 6px 10px;
      border: 1px solid #D9E1EE;
      border-radius: 6px;
      font-size: 13px;
    }
    .b-filter-primary {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 8px;
      min-width: 0;
    }
    .b-advanced-filters {
      grid-column: 1 / -1;
      min-width: 0;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #F9FAFB;
    }
    .b-advanced-filters summary {
      cursor: pointer;
      padding: 7px 10px;
      color: #475467;
      font-size: 12px;
      font-weight: 800;
      list-style-position: inside;
      user-select: none;
    }
    .b-filter-advanced-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      padding: 0 10px 10px;
    }
    .bc-list-search select {
      min-width: 0;
      width: 100%;
      height: 34px;
      padding: 6px 10px;
      border: 1px solid #D9E1EE;
      border-radius: 6px;
      font-size: 13px;
      background: #fff;
    }
    .bc-filter-control {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 6px;
      min-width: 0;
      height: 34px;
    }
    .bc-filter-control span {
      color: #667085;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }
    .bc-list-search button {
      min-width: 0;
      width: 100%;
      height: 34px;
      min-height: 34px;
      white-space: nowrap;
      padding-left: 6px;
      padding-right: 6px;
      font-size: 13px;
    }
    .bc-list-search .wide-action { grid-column: span 2; }
    .b-date-range-panel {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: minmax(150px, 180px) auto minmax(150px, 180px) auto auto;
      align-items: end;
      gap: 8px;
      padding: 8px;
      border: 1px solid #D0D5DD;
      border-radius: 8px;
      background: #FCFCFD;
    }
    .b-date-range-panel[hidden],
    .b-date-range-panel [hidden] {
      display: none !important;
    }
    .b-date-field {
      display: grid;
      gap: 4px;
      min-width: 0;
    }
    .b-date-field span {
      color: #667085;
      font-size: 12px;
      font-weight: 800;
    }
    #view-bgroup .bc-list-search {
      top: 49px;
      grid-template-columns: minmax(62px, 1fr) 54px 70px 76px 36px 36px;
      align-items: center;
      gap: 5px;
      padding: 7px 8px;
    }
    #view-bgroup .bc-list-search > .b-search-input,
    #view-bgroup .bc-list-search > .bc-filter-control,
    #view-bgroup .bc-list-search > .b-search-submit,
    #view-bgroup .bc-list-search > .b-search-clear {
      grid-column: auto;
    }
    #view-bgroup .bc-list-search > .b-date-range-panel,
    #view-bgroup .b-advanced-filters[open] {
      grid-column: 1 / -1;
    }
    #view-bgroup .bc-list-search > .b-search-input {
      min-width: 0;
      width: 100%;
      height: 32px;
      min-height: 32px;
      padding: 5px 9px;
      border: 1px solid #D9E1EE;
      border-radius: 6px;
      font-size: 13px;
    }
    #view-bgroup .bc-filter-control {
      grid-template-columns: minmax(0, 1fr);
      height: 32px;
      gap: 0;
    }
    #view-bgroup .b-filter-quick > span,
    #view-bgroup .b-filter-time > span,
    #view-bgroup .b-filter-source > span {
      display: none;
    }
    #view-bgroup .b-filter-advanced-grid .bc-filter-control {
      grid-template-columns: auto minmax(0, 1fr);
      gap: 6px;
    }
    #view-bgroup .b-filter-advanced-grid .bc-filter-control span {
      display: inline;
      font-size: 11px;
    }
    #view-bgroup .bc-list-search select,
    #view-bgroup .bc-list-search button {
      height: 32px;
      min-height: 32px;
      border-radius: 6px;
      font-size: 12px;
    }
    #view-bgroup .bc-list-search button {
      padding-left: 4px;
      padding-right: 4px;
    }
    #view-cgroup .bc-list-search {
      top: 49px;
      grid-template-columns: minmax(92px, 1fr) 62px 66px 36px 36px;
      align-items: center;
      gap: 5px;
      padding: 7px 8px;
    }
    #view-cgroup .bc-list-search > .c-search-input,
    #view-cgroup .bc-list-search > .bc-filter-control,
    #view-cgroup .bc-list-search > .c-search-submit,
    #view-cgroup .bc-list-search > .c-search-clear {
      grid-column: auto;
    }
    #view-cgroup .bc-list-search > .c-date-range-panel {
      grid-column: 1 / -1;
    }
    #view-cgroup .bc-list-search > .c-search-input {
      min-width: 0;
      width: 100%;
      height: 32px;
      min-height: 32px;
      padding: 5px 9px;
      border: 1px solid #D9E1EE;
      border-radius: 6px;
      font-size: 13px;
    }
    #view-cgroup .bc-filter-control {
      grid-template-columns: minmax(0, 1fr);
      height: 32px;
      gap: 0;
    }
    #view-cgroup .c-filter-status > span,
    #view-cgroup .c-filter-time > span {
      display: none;
    }
    #view-cgroup .bc-list-search select,
    #view-cgroup .bc-list-search button {
      height: 32px;
      min-height: 32px;
      border-radius: 6px;
      font-size: 12px;
    }
    #view-cgroup .bc-list-search button {
      padding-left: 4px;
      padding-right: 4px;
    }
    .c-date-range-panel {
      display: grid;
      grid-template-columns: minmax(120px, 1fr) auto minmax(120px, 1fr);
      align-items: end;
      gap: 8px;
      padding: 8px;
      border: 1px solid #D0D5DD;
      border-radius: 8px;
      background: #FCFCFD;
    }
    .c-date-range-panel[hidden],
    .c-date-range-panel [hidden] {
      display: none !important;
    }
    .c-date-field {
      display: grid;
      gap: 4px;
      min-width: 0;
    }
    .c-date-field span {
      color: #667085;
      font-size: 12px;
      font-weight: 800;
    }
    .c-date-field input {
      min-width: 0;
      width: 100%;
      height: 32px;
      min-height: 32px;
      padding: 5px 8px;
      border: 1px solid #D9E1EE;
      border-radius: 6px;
      font-size: 12px;
    }
    .c-date-separator {
      padding-bottom: 8px;
      color: #667085;
      font-size: 12px;
      font-weight: 800;
    }
    #view-bgroup .b-advanced-filters {
      border-radius: 6px;
      grid-column: auto;
      height: 32px;
      min-height: 32px;
      align-self: stretch;
      overflow: visible;
    }
    #view-bgroup .b-advanced-filters summary {
      display: grid;
      place-items: center;
      height: 32px;
      padding: 0 6px;
      list-style: none;
      white-space: nowrap;
    }
    #view-bgroup .b-advanced-filters summary::-webkit-details-marker {
      display: none;
    }
    #view-bgroup .b-advanced-filters[open] {
      height: auto;
      min-height: 32px;
    }
    #view-bgroup .b-advanced-filters[open] summary {
      justify-content: start;
      place-items: center start;
      border-bottom: 1px solid #E5E7EB;
    }
    #view-bgroup .b-filter-advanced-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      padding: 8px;
    }
    .b-date-field input {
      display: block;
      grid-column: auto;
      width: 100%;
      height: 34px;
      min-height: 34px;
      padding: 5px 9px;
      border: 1px solid #D0D5DD;
      border-radius: 6px;
      background: #fff;
      color: #101828;
      font-size: 13px;
    }
    .b-date-field input:focus {
      outline: 2px solid rgba(21, 112, 239, .16);
      border-color: #84CAFF;
    }
    .b-date-separator {
      align-self: center;
      color: #667085;
      font-size: 13px;
      font-weight: 800;
    }
    .b-date-apply-btn,
    .b-date-clear-btn {
      align-self: end;
      width: auto;
      min-width: 72px;
      padding-left: 10px;
      padding-right: 10px;
    }
    .pagination-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 7px 8px;
      margin: 8px 0;
      border: 1px solid #E4E7EC;
      border-radius: 8px;
      background: #F9FAFB;
      color: #475467;
      font-size: 13px;
    }
    .pagination-summary {
      min-width: 86px;
      flex: 1 1 auto;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }
    .pagination-page {
      color: #667085;
      white-space: nowrap;
    }
    .pagination-pill {
      justify-self: start;
    }
    .pagination-actions {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 5px;
      white-space: nowrap;
      flex: 0 0 auto;
    }
    .pagination-jump {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      height: 32px;
      padding: 0;
      border: 0;
      background: transparent;
      color: #667085;
      white-space: nowrap;
    }
    .pagination-current-label {
      color: #667085;
    }
    .pagination-jump input {
      width: 42px;
      height: 32px;
      min-height: 32px;
      padding: 4px 6px;
      border: 1px solid #D0D5DD;
      border-radius: 6px;
      background: #fff;
      color: #101828;
      font-size: 13px;
      font-weight: 800;
      text-align: center;
      font-variant-numeric: tabular-nums;
    }
    .pagination-total {
      min-width: 28px;
      color: #667085;
      font-variant-numeric: tabular-nums;
    }
    .pagination-nav-btn,
    .pagination-go-btn {
      height: 32px;
      min-height: 32px;
      padding: 0 8px;
      line-height: 1;
      font-size: 13px;
      font-weight: 700;
    }
    .pagination-go-btn {
      min-width: 34px;
      padding: 0 8px;
    }
    .pagination-bar button[disabled] {
      opacity: .45;
      cursor: not-allowed;
    }
    @media (max-width: 760px) {
      .pagination-bar {
        align-items: flex-start;
        flex-direction: column;
      }
      .pagination-summary {
        width: 100%;
      }
      .pagination-actions {
        justify-content: flex-start;
        max-width: 100%;
        overflow-x: auto;
      }
    }
    .bc-detail-pane {
      height: 100%;
      min-height: 0;
      display: flex; flex-direction: column; min-width: 0;
      background: #fff;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
    }
    .bc-detail-scroll { flex: 1; overflow: auto; padding: 12px; }
    .bc-sticky-actions {
      flex: 0 0 auto;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      padding: 10px 12px;
      border-top: 1px solid #E5E7EB;
      background: #fff;
      border-radius: 0 0 8px 8px;
    }
    .bc-sticky-actions.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .bc-sticky-actions button { height: 40px; min-height: 40px; font-size: 14px; margin: 0; width: 100%; }
    .bc-sticky-actions .success { background: #16A34A; border-color: #16A34A; color: #fff; font-weight: 650; }

    /* —— 左侧紧凑客户列表 —— */
    .customer-list { display: grid; gap: 0; }
    .bc-list-pane .customer-list {
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: auto;
      display: block;
    }
    .customer-item {
      padding: 10px 12px;
      border-bottom: 1px solid #EEF2F7;
      cursor: pointer;
      content-visibility: auto;
      contain-intrinsic-size: auto 104px;
    }
    #view-cgroup .customer-item {
      content-visibility: visible;
      contain-intrinsic-size: none;
    }
    .customer-item:hover { background: #F8FAFC; }
    .customer-item.active { background: #EFF6FF; box-shadow: inset 4px 0 0 #2563EB; }
    #view-bgroup .customer-item.active { box-shadow: inset 4px 0 0 var(--b-accent); background: #FFF8EE; }
    #view-cgroup .customer-item.active {
      background: #CFF7DF;
      box-shadow: inset 5px 0 0 #059669, inset 0 0 0 1px #86DCAF;
    }
    #view-cgroup .customer-item.active .customer-item-title { color: #065F46; font-weight: 750; }
    #view-cgroup .customer-item.active .customer-item-meta { color: #14532D; }
    .customer-item-title { font-size: 14px; font-weight: 600; color: #1F2937; line-height: 1.35; }
    .customer-item-meta { margin-top: 4px; font-size: 12px; color: #6B7280; line-height: 1.35; }
    .customer-item-tags { margin-top: 6px; display: flex; gap: 4px; flex-wrap: wrap; }
    #view-bgroup .b-customer-card {
      width: 100%;
      display: grid;
      gap: 7px;
      padding: 12px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #FFFFFF;
      color: #111827;
      text-align: left;
      cursor: pointer;
      transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
    }
    #view-bgroup .b-customer-card:hover {
      border-color: #CBD5E1;
      background: #F8FAFC;
    }
    #view-bgroup .b-customer-card.active {
      border-color: var(--b-accent);
      background: #FFFBF4;
      box-shadow: inset 3px 0 0 var(--b-accent), 0 1px 2px rgba(17, 24, 39, .05);
    }
    #view-bgroup .b-resource-card {
      border-style: dashed;
      background: #FAFAFA;
    }
    #view-bgroup .b-card-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      min-width: 0;
    }
    #view-bgroup .b-card-name {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 15px;
      line-height: 1.3;
      font-weight: 750;
      color: #111827;
    }
    #view-bgroup .b-card-source {
      flex: 0 0 auto;
      padding: 2px 7px;
      border-radius: 999px;
      background: #FFF7ED;
      color: #9A3412;
      font-size: 11px;
      font-weight: 700;
      line-height: 1.45;
    }
    #view-bgroup .b-card-identity,
    #view-bgroup .b-card-owner {
      display: block;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 12px;
      line-height: 1.35;
      color: #4B5563;
    }
    #view-bgroup .b-card-owner { color: #6B7280; }
    #view-bgroup .b-card-chip-rail {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      min-width: 0;
    }
    #view-bgroup .b-card-chip {
      max-width: 100%;
      padding: 2px 7px;
      border-radius: 999px;
      background: #EFF6FF;
      color: #1D4ED8;
      font-size: 11px;
      font-weight: 650;
      line-height: 1.45;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    #view-bgroup .b-card-chip[data-tone="gray"] { background: #F3F4F6; color: #4B5563; }
    #view-bgroup .b-card-chip[data-tone="green"] { background: #ECFDF3; color: #067647; }
    #view-bgroup .b-card-chip[data-tone="orange"] { background: #FFF7ED; color: #C2410C; }
    #view-bgroup .b-card-chip[data-tone="red"] { background: #FEF2F2; color: #B42318; }
    #view-bgroup .b-card-next {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: baseline;
      gap: 6px;
      padding-top: 2px;
      font-size: 12px;
      line-height: 1.4;
      color: #6B7280;
    }
    #view-bgroup .b-card-next strong {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: #111827;
      font-weight: 700;
    }
    .bc-list-empty { padding: 24px 12px; text-align: center; color: #9CA3AF; font-size: 13px; }

    /* —— 右侧紧凑卡片 —— */
    .compact-card { border: 1px solid #E5E7EB; border-radius: 8px; background: #fff; margin-bottom: 12px; box-shadow: none; }
    .compact-card:last-child { margin-bottom: 0; }
    .compact-card-head {
      display: flex; align-items: center; justify-content: space-between; gap: 8px;
      padding: 9px 12px; border-bottom: 1px solid #EEF2F7;
      font-size: 14px; font-weight: 600; color: #1F2937;
    }
	    #view-bgroup .compact-card-head { box-shadow: inset 3px 0 0 var(--b-accent); }
	    #view-cgroup .compact-card-head { box-shadow: inset 3px 0 0 var(--c-accent); }
	    .compact-card-body { padding: 12px; }
	    .manager-action-card > summary.compact-card-head {
	      cursor: pointer;
	      list-style: none;
	    }
	    .manager-action-card > summary.compact-card-head::-webkit-details-marker { display: none; }
	    .manager-action-card > summary.compact-card-head::before {
	      content: "展开";
	      flex: 0 0 auto;
	      margin-right: 8px;
	      color: var(--brand);
	      font-size: 12px;
	      font-weight: 700;
	      border: 1px solid #cfe0ff;
	      border-radius: 999px;
	      padding: 2px 8px;
	      background: #f4f8ff;
	    }
	    .manager-action-card[open] > summary.compact-card-head::before {
	      content: "收起";
	      color: #475467;
	      border-color: #E5E7EB;
	      background: #F8FAFC;
	    }
	    .manager-action-zone {
	      border: 1px solid #E5E7EB;
	      border-radius: 8px;
	      background: #FBFCFE;
	      padding: 12px;
	    }
	    .manager-action-zone-title {
	      display: flex;
	      align-items: center;
	      justify-content: space-between;
	      gap: 10px;
	      margin-bottom: 10px;
	      font-weight: 800;
	      color: #1f2937;
	    }
	    .manager-action-zone.execution-zone { border-left: 3px solid var(--orange); }
	    .manager-action-zone.verify-zone { border-left: 3px solid var(--green); }
	    .compact-divider { margin: 14px 0; border-top: 1px solid #EEF2F7; }
    #view-bgroup .b-pending-actions .section-body {
      display: grid;
      gap: 10px;
    }
    #view-bgroup .b-pending-action-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding: 10px;
      border: 1px solid #F3D4A3;
      border-radius: 8px;
      background: #FFF9F0;
    }
    #view-bgroup .b-pending-action-tab {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 34px;
      padding: 0 11px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #FFFFFF;
      color: #374151;
      font-weight: 800;
      box-shadow: none;
    }
    #view-bgroup .b-pending-action-tab strong {
      min-width: 22px;
      padding: 2px 7px;
      border-radius: 999px;
      background: #F3F4F6;
      color: #4B5563;
      font-size: 12px;
      text-align: center;
      font-variant-numeric: tabular-nums;
    }
    #view-bgroup .b-pending-action-tab.active {
      border-color: #F59E0B;
      background: #FFF3D6;
      color: #92400E;
      box-shadow: inset 3px 0 0 var(--b-accent);
    }
    #view-bgroup .b-pending-action-tab.active strong {
      background: #FDE68A;
      color: #92400E;
    }
    #view-bgroup .b-pending-action-table-wrap {
      max-height: clamp(360px, 48vh, 560px);
    }
    #view-bgroup .b-pending-action-table-wrap table {
      min-width: 980px;
    }
    #view-bgroup .b-pending-action-table-wrap td {
      vertical-align: top;
      line-height: 1.45;
    }
    #view-bgroup .b-pending-action-object-cell strong {
      display: block;
      max-width: 220px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    #view-bgroup .b-pending-action-fields {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }
    #view-bgroup .b-pending-action-field {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 2px 8px;
      border: 1px solid #F3D4A3;
      border-radius: 999px;
      background: #FFF9F0;
      color: #92400E;
      font-size: 12px;
      font-weight: 800;
      line-height: 1.3;
    }
    #view-agroup .a-action-record-tabs-section {
      width: 100%;
      min-width: 0;
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-summary {
      display: flex;
      align-items: stretch;
      min-height: 56px;
      padding: 0;
      overflow: hidden;
      border-bottom: 1px solid #dce7e7;
      background: #f5f9f8;
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tabs {
      display: flex;
      align-items: stretch;
      justify-content: flex-start;
      flex-wrap: wrap;
      gap: 8px;
      width: 100%;
      min-width: 0;
      padding: 8px 12px 0;
      background: #f5f9f8;
      box-shadow: inset 0 -1px 0 #dce7e7;
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tab {
      position: relative;
      min-height: 56px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-width: 0;
      flex: 0 0 auto;
      padding: 0 12px;
      border: 1px solid transparent;
      border-radius: 8px 8px 0 0;
      background: transparent;
      color: #34464c;
      font-size: 16px;
      font-weight: 800;
      white-space: nowrap;
      box-shadow: none;
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tab:hover {
      color: #0f766e;
      background: rgba(255, 255, 255, .72);
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tab.is-active {
      color: #0f5f59;
      background: #ffffff;
      border-color: #cfe2e0 #cfe2e0 #ffffff;
      box-shadow: 0 -1px 0 #ffffff, 0 10px 20px rgba(18, 48, 52, .08);
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tab.is-active::after {
      content: "";
      position: absolute;
      right: 20px;
      bottom: -1px;
      left: 20px;
      height: 3px;
      border-radius: 3px 3px 0 0;
      background: #0f766e;
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tab em {
      min-width: 30px;
      height: 24px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 9px;
      border-radius: 999px;
      background: #e8f5f3;
      color: #1b625d;
      font-size: 13px;
      font-weight: 800;
      font-style: normal;
      font-variant-numeric: tabular-nums;
    }
    #view-agroup .a-action-record-tabs-section .transfer-out-tab.is-active em {
      background: #dff2ef;
      color: #0f766e;
    }
    #view-agroup .a-action-record-tab-body {
      display: grid;
      gap: 10px;
      min-width: 0;
      padding: 12px;
    }
    #view-agroup .a-action-record-tab-body > .section,
    #view-agroup .a-action-record-tab-body > .grid {
      width: 100%;
      min-width: 0;
      margin: 0;
    }
    #view-agroup .a-action-record-tab-body > .grid {
      grid-template-columns: minmax(0, 1fr);
    }
    #view-agroup .a-workload-panel {
      display: grid;
      gap: 10px;
    }
    #view-agroup .a-workload-toolbar {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      align-items: center;
      gap: 12px;
      width: 100%;
      min-width: 0;
    }
    #view-agroup .a-workload-toolbar-left,
    #view-agroup .a-workload-toolbar-center,
    #view-agroup .a-workload-toolbar-right {
      display: flex;
      align-items: center;
      min-width: 0;
    }
    #view-agroup .a-workload-toolbar-left {
      justify-content: flex-start;
    }
    #view-agroup .a-workload-toolbar-center {
      justify-content: center;
    }
    #view-agroup .a-workload-toolbar-right {
      justify-content: flex-end;
      gap: 8px;
      white-space: nowrap;
    }
    #view-agroup .a-workload-toolbar-center:empty {
      min-height: 34px;
    }
    #view-agroup .a-workload-date-range {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
      white-space: nowrap;
    }
    #view-agroup .a-workload-date-range-label {
      color: #4d646b;
      font-size: 13px;
      font-weight: 800;
    }
    #view-agroup .a-workload-date-range-picker {
      display: inline-flex;
      align-items: center;
      height: 36px;
      border: 1px solid #cfdbe0;
      border-radius: 4px;
      background: #fff;
      box-shadow: inset 0 1px 1px rgba(15, 23, 42, .03);
      overflow: hidden;
    }
    #view-agroup .a-workload-date-range-picker input[type="date"] {
      width: 138px;
      height: 34px;
      padding: 0 10px;
      border: 0;
      background: transparent;
      color: #20383f;
      font-size: 13px;
      font-weight: 700;
      outline: none;
    }
    #view-agroup .a-workload-date-range-picker input[type="date"]:focus {
      background: #f7fbfb;
    }
    #view-agroup .a-workload-date-range-separator {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      align-self: stretch;
      min-width: 38px;
      padding: 0 8px;
      border-left: 1px solid #edf2f4;
      border-right: 1px solid #edf2f4;
      color: #6b7b80;
      font-size: 13px;
      font-weight: 800;
      background: #f8fafb;
    }
    #view-agroup .a-workload-query-btn {
      min-height: 36px;
      padding: 0 16px;
      border-radius: 4px;
      font-weight: 900;
    }
    #view-agroup .a-workload-employee-chips {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }
    #view-agroup .a-workload-employee-chip {
      min-height: 34px;
      padding: 0 14px;
      border: 1px solid #cfe2e0;
      border-radius: 999px;
      background: #ffffff;
      color: #34464c;
      font-size: 14px;
      font-weight: 800;
      cursor: pointer;
      box-shadow: 0 1px 2px rgba(18, 48, 52, .04);
    }
    #view-agroup .a-workload-employee-chip:hover {
      border-color: #8fc4bd;
      color: #0f766e;
      background: #f4fbfa;
    }
    #view-agroup .a-workload-employee-chip.is-active {
      border-color: #0f766e;
      color: #0f5f59;
      background: #e8f5f3;
      box-shadow: 0 8px 18px rgba(15, 118, 110, .18);
    }
    #view-agroup .a-workload-summary-table {
      max-height: min(560px, 58vh);
      overflow: auto;
    }
    #view-agroup .a-workload-summary-table thead th {
      position: sticky;
      top: 0;
      z-index: 1;
    }
    #view-agroup .a-workload-summary-table tr.a-workload-total-row td {
      background: #f6faf9;
      border-bottom: 1px solid #cfe2e0;
      color: #173b40;
      font-weight: 900;
    }
    #view-agroup .a-workload-summary-table .a-workload-total-note {
      color: #6b7b80;
      font-size: 12px;
      font-weight: 800;
    }
    #view-agroup .a-workload-summary-table tr.a-workload-date-row {
      cursor: pointer;
    }
    #view-agroup .a-workload-summary-table tr.a-workload-date-row:hover td {
      background: #f4fbfa;
    }
    #view-agroup .a-workload-summary-table tr.a-workload-date-row.is-active td {
      background: #eaf6f4;
      box-shadow: inset 3px 0 0 #0f766e;
    }
    #view-agroup .a-workload-expanded-day {
      display: grid;
      gap: 8px;
      margin-top: 6px;
    }
    #view-agroup .a-workload-expanded-day h4,
    #view-agroup .a-workload-day h4 {
      margin: 0;
      font-size: 15px;
      line-height: 1.4;
      color: #223b42;
    }
    #view-agroup .a-workload-employee-row td:first-child {
      font-weight: 800;
      color: #20383f;
    }
    @media (max-width: 760px) {
      #view-agroup .a-workload-toolbar {
        grid-template-columns: minmax(0, 1fr);
      }
      #view-agroup .a-workload-toolbar-left,
      #view-agroup .a-workload-toolbar-center,
      #view-agroup .a-workload-toolbar-right {
        justify-content: flex-start;
      }
      #view-agroup .a-workload-toolbar-right {
        white-space: normal;
      }
      #view-agroup .a-workload-date-range {
        width: 100%;
        flex-wrap: wrap;
      }
      #view-agroup .a-workload-date-range-picker {
        flex: 1 1 250px;
      }
      #view-agroup .a-workload-date-range-picker input[type="date"] {
        width: 50%;
        min-width: 0;
      }
    }
    #view-agroup .a-record-summary-grid {
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }
    #view-agroup .a-embedded-pending-actions > summary {
      display: none;
    }
    #view-agroup .a-embedded-pending-actions > .section-body {
      padding: 0;
    }
    #view-bgroup .b-work-tabs .section-body {
      display: grid;
      gap: 10px;
    }
    #view-bgroup .b-manager-aux-tabs {
      display: grid;
      gap: 10px;
    }
    #view-bgroup .b-manager-aux-tab-body {
      display: grid;
      gap: 10px;
      min-width: 0;
    }
    #view-bgroup .b-work-tabs-embedded {
      border: 0;
      box-shadow: none;
    }
    #view-bgroup .b-manager-aux-tab-body > .section {
      margin: 0;
    }
    #view-bgroup .b-work-tab-head {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding: 10px;
      border: 1px solid #F3D4A3;
      border-radius: 8px;
      background: #FFF9F0;
    }
    #view-bgroup .b-work-tab {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 34px;
      padding: 0 11px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #FFFFFF;
      color: #374151;
      font-weight: 800;
      cursor: pointer;
      user-select: text;
      -webkit-user-select: text;
    }
    #view-bgroup .b-work-tab-label,
    #view-bgroup .b-work-tab-count {
      user-select: text;
      -webkit-user-select: text;
    }
    #view-bgroup .b-work-tab strong {
      min-width: 22px;
      padding: 2px 7px;
      border-radius: 999px;
      background: #F3F4F6;
      color: #4B5563;
      font-size: 12px;
      text-align: center;
      font-variant-numeric: tabular-nums;
    }
    #view-bgroup .b-work-tab.active {
      border-color: #F59E0B;
      background: #FFF3D6;
      color: #92400E;
      box-shadow: inset 3px 0 0 var(--b-accent);
    }
    #view-bgroup .b-work-tab.active strong {
      background: #FDE68A;
      color: #92400E;
    }
    #view-bgroup .b-workload-panel {
      display: grid;
      gap: 10px;
    }
    #view-bgroup .b-workload-subtabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding: 8px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #F9FAFB;
    }
    #view-bgroup .b-workload-subtab {
      display: inline-flex;
      align-items: center;
      min-height: 32px;
      padding: 0 12px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #FFFFFF;
      color: #374151;
      font-weight: 800;
      cursor: pointer;
      user-select: text;
      -webkit-user-select: text;
    }
    #view-bgroup .b-workload-subtab.active {
      border-color: #2563EB;
      background: #EFF6FF;
      color: #1D4ED8;
      box-shadow: inset 3px 0 0 #2563EB;
    }
    #view-bgroup .b-workload-month-controls {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 10px;
    }
    #view-bgroup .b-workload-month-controls strong {
      min-width: 86px;
      text-align: center;
      color: #111827;
    }
    #view-bgroup .b-workload-custom-form {
      display: flex;
      flex-wrap: wrap;
      align-items: end;
      gap: 8px;
    }
    #view-bgroup .b-workload-custom-form label {
      min-width: 180px;
    }
    #view-bgroup .b-workload-table-wrap table {
      min-width: 960px;
    }
    #view-bgroup .b-workload-employee-row {
      background: #F8FAFC;
      color: #475569;
    }
    #view-bgroup .b-workload-employee-row td:first-child {
      padding-left: 28px;
    }
    #view-bgroup .b-work-table-wrap {
      max-height: clamp(360px, 50vh, 600px);
    }
    #view-bgroup .b-work-table-wrap table {
      min-width: 1040px;
    }
    #view-bgroup .b-work-pagination-top,
    #view-bgroup .b-work-pagination-bottom {
      display: flex;
      justify-content: flex-end;
    }
    #view-bgroup .b-work-table-wrap td {
      vertical-align: top;
      line-height: 1.45;
    }
    #view-bgroup .b-work-row td {
      padding-top: 10px;
      padding-bottom: 10px;
    }
    #view-bgroup .b-work-object,
    #view-bgroup .b-work-status-cell,
    #view-bgroup .b-work-recent,
    #view-bgroup .b-work-time {
      display: grid;
      gap: 5px;
      min-width: 0;
    }
    #view-bgroup .b-work-object strong {
      overflow-wrap: anywhere;
    }
    #view-bgroup .b-work-cell-label {
      display: inline-flex;
      align-items: center;
      min-width: 42px;
      margin-right: 6px;
      color: #64748B;
      font-size: 12px;
      font-weight: 800;
    }
    #view-bgroup .b-work-subline {
      color: #475569;
      font-size: 12px;
      overflow-wrap: anywhere;
    }
    #view-bgroup .b-work-status-cell .compact-note,
    #view-bgroup .b-work-field-list .compact-note {
      display: inline;
      padding: 0;
      border: 0;
      background: transparent;
      color: #64748B;
      font-size: 12px;
    }
    #view-bgroup .b-work-field-list {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }
    #view-bgroup .b-work-field-chip {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 2px 8px;
      border: 1px solid #F3D4A3;
      border-radius: 999px;
      background: #FFF9F0;
      color: #92400E;
      font-size: 12px;
      font-weight: 800;
    }
    #view-bgroup .b-work-recent {
      max-width: 360px;
      overflow-wrap: anywhere;
    }
    #view-bgroup .b-work-time {
      min-width: 150px;
      color: #334155;
      font-size: 12px;
    }
    #view-bgroup .b-work-action-btn {
      min-width: 76px;
      white-space: nowrap;
    }
    #view-bgroup .b-work-table-wrap textarea {
      width: 100%;
      min-height: 42px;
      margin-bottom: 6px;
      resize: vertical;
      font-size: 13px;
    }
    #view-bgroup .b-work-action-controls {
      align-items: stretch;
      flex-wrap: wrap;
      gap: 6px;
    }
    #view-bgroup .b-work-action-controls button {
      min-height: 34px;
      padding: 0 9px;
      white-space: nowrap;
    }
    #view-bgroup .b-work-direct-highlight {
      outline: 3px solid #F59E0B;
      outline-offset: 4px;
      transition: outline-color .2s ease;
    }
    #view-bgroup .b-pending-action-table-wrap textarea {
      width: 100%;
      min-height: 42px;
      margin-bottom: 6px;
      resize: vertical;
      font-size: 13px;
    }
    #view-bgroup .b-pending-action-details {
      margin-top: 8px;
    }
    #view-bgroup .b-pending-action-details summary {
      cursor: pointer;
      color: #92400E;
      font-weight: 800;
      font-size: 12px;
    }
    #view-bgroup .b-pending-action-business .compact-info-grid {
      grid-template-columns: 1fr;
      margin-top: 8px;
      padding: 8px;
      border: 1px solid #F3E1C2;
      border-radius: 8px;
      background: #FFFCF7;
    }
    #view-bgroup .b-pending-action-samples {
      margin-top: 8px;
      max-height: 180px;
      overflow: auto;
    }
    #view-bgroup .b-pending-action-controls {
      align-items: stretch;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 6px;
    }
    #view-bgroup .b-pending-action-controls button {
      min-height: 34px;
      padding: 0 9px;
      font-size: 13px;
      white-space: nowrap;
    }
    .group-title { margin: 0 0 8px; font-size: 13px; font-weight: 600; color: #4B5563; grid-column: 1 / -1; }
    .info-card-blue { background: #F0F7FF; border-color: #CFE3FB; }
    .compact-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; font-size: 13px; color: #4B5563; }
    .compact-info-grid div { min-width: 0; line-height: 1.5; }
    .compact-info-grid .info-wide { grid-column: 1 / -1; }
    .compact-info-grid strong {
      display: block;
      color: #111827;
      font-size: 13px;
      font-weight: 650;
      line-height: 1.55;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      overflow-wrap: anywhere;
      word-break: break-word;
    }
    .compact-info-copy-row {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }
    .compact-info-copy-row strong { flex: 1; min-width: 0; }
    .compact-info-copy-row button { flex: 0 0 auto; }
    .c-handoff-card { background: #FFFFFF; border-color: #D7E5F5; }
    .c-handoff-sourcebar {
      display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
      margin: 10px 12px 0; padding: 9px 10px;
      border: 1px solid #BFE6D0; border-radius: 7px; background: #F0FDF4;
    }
    .c-handoff-sourcebar > span:first-child { color: #166534; font-size: 12px; font-weight: 700; }
    .c-source-chip {
      display: inline-flex; align-items: center; gap: 6px; min-width: 0;
      padding: 4px 7px; border: 1px solid #CFE3D7; border-radius: 6px;
      background: #FFFFFF; color: #111827; font-size: 13px; font-weight: 650;
    }
    .c-source-chip button { min-height: 24px; height: 24px; padding: 1px 7px; font-size: 12px; }
    .c-handoff-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .c-handoff-facts > div {
      padding: 7px 9px; border: 1px solid #E6EDF5; border-radius: 6px; background: #FAFCFF;
    }
    .c-handoff-facts .info-wide { background: #FFFFFF; }
    .c-handoff-facts .info-wide strong {
      max-height: min(220px, 32vh);
      overflow: auto;
      white-space: pre-wrap;
      scrollbar-width: thin;
    }
    .c-handoff-facts .fact-label { display: block; margin-bottom: 2px; color: #64748B; font-size: 12px; }
    .c-handoff-facts .customer-fact strong { font-size: 14px; }
    .c-handoff-facts .customer-id { display: block; margin-top: 2px; color: #64748B; font-size: 12px; overflow-wrap: anywhere; }
    .c-handoff-source-text {
      margin: 0 12px 10px;
      border: 1px solid #DDE7F2;
      border-radius: 8px;
      background: #FFFFFF;
      overflow: hidden;
    }
    .c-handoff-source-head {
      min-height: 34px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 7px 10px;
      border-bottom: 1px solid #E8EEF6;
      background: #F8FAFC;
      color: #334155;
      font-size: 13px;
      font-weight: 750;
    }
    .c-handoff-source-head em {
      color: #64748B;
      font-style: normal;
      font-size: 12px;
      font-weight: 500;
    }
    .c-handoff-source-body {
      max-height: min(180px, 28vh);
      overflow: auto;
      padding: 10px;
      color: #111827;
      font-size: 13px;
      line-height: 1.65;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
      scrollbar-width: thin;
    }
    .c-handoff-note-line {
      display: grid;
      gap: 4px;
      padding: 8px 10px;
      border-top: 1px solid #EEF2F7;
      color: #475569;
      font-size: 13px;
      line-height: 1.55;
      background: #FBFDFF;
    }
    .c-handoff-note-line span {
      color: #64748B;
      font-size: 12px;
      font-weight: 700;
    }
    .compact-note { padding: 8px 10px; border: 1px solid #E5E7EB; border-radius: 6px; background: #F9FAFB; color: #4B5563; font-size: 13px; line-height: 1.5; }
    .recent-list { display: grid; gap: 8px; }
    .recent-item { padding: 8px 10px; border: 1px solid #EEF2F7; border-radius: 6px; background: #FBFDFF; font-size: 13px; color: #4B5563; }
    #view-cgroup .recent-item {
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      overflow-wrap: anywhere;
      word-break: break-word;
    }
    #view-bgroup .b-follow-record-text {
      margin-top: 6px;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
      word-break: break-word;
      line-height: 1.6;
      color: #344054;
    }
    .c-deal-cancel-submitted {
      min-height: 34px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 0 14px;
      border: 1px solid #BFDBFE;
      border-radius: 8px;
      background: #EFF6FF;
      color: #1D4ED8;
      font-size: 14px;
      font-weight: 800;
      white-space: nowrap;
    }
    .c-deal-cancel-submitted::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 999px;
      background: currentColor;
      opacity: .9;
    }
    .c-deal-cancel-submitted.approved {
      border-color: #A7F3D0;
      background: #ECFDF5;
      color: #047857;
    }
    .c-deal-cancel-submitted.rejected {
      border-color: #FECACA;
      background: #FEF2F2;
      color: #B91C1C;
    }

    /* —— 表单网格（真正用到 B/C） —— */
    .form-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
    .form-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; }
    .form-full { grid-column: 1 / -1; }

    /* —— 多选 checkbox 网格 —— */
    .check-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .check-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .check-item {
      min-height: 28px; display: flex; align-items: center; gap: 6px;
      padding: 0 8px; border: 1px solid #E5E7EB; border-radius: 6px;
      background: #F9FAFB; font-size: 13px; color: #374151; cursor: pointer; margin: 0;
    }
    .check-item:hover { border-color: #C7D2E0; }
    .check-item input { width: 14px; height: 14px; min-height: 14px; margin: 0; flex: 0 0 auto; }
    .check-item:has(input:checked) { background: var(--brand-soft); border-color: #B6CEFB; color: #1D4ED8; font-weight: 600; }
    #view-cgroup .check-item:has(input:checked) { background: var(--green-soft); border-color: #A7E3C6; color: #047857; }

    /* —— 在 bc 工作台内强制紧凑、扁平字段（高权重覆盖旧松散样式） —— */
    .bc-detail-pane input,
    .bc-detail-pane select { height: 32px; min-height: 32px; padding: 4px 8px; font-size: 14px; }
    .bc-detail-pane textarea { min-height: 60px; padding: 6px 8px; font-size: 14px; }
    .bc-detail-pane textarea.c-shipping-detail-raw {
      min-height: 96px;
      max-height: 168px;
      line-height: 1.55;
      resize: vertical;
      overflow-y: auto;
    }
    .bc-detail-pane .action-form > label,
    .bc-detail-pane form > label,
    .bc-detail-pane label {
      min-height: auto; padding: 0; border: 0; background: transparent;
      display: grid; gap: 4px; font-size: 13px; color: #6B7280;
    }
    .bc-detail-pane .action-form { gap: 12px 16px; }
    .bc-detail-pane .field-group-title { margin-top: 4px; }
    .bc-detail-pane .sub-panel { padding: 10px; background: #F9FBFF; }
    .bc-detail-pane .trace-compact textarea { min-height: 52px; }
    .bc-detail-pane .inline { padding-top: 0; }
    .bc-detail-pane .check-item {
      min-height: 28px; display: flex; align-items: center; gap: 6px;
      padding: 0 8px; border: 1px solid #E5E7EB; border-radius: 6px;
      background: #F9FAFB; font-size: 13px; color: #374151;
    }
    .c-logistics-action-bar {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 12px;
      margin-top: 2px;
      flex-wrap: wrap;
    }
    .c-logistics-save-action,
    .c-warehouse-acceptance-action {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }
    .c-logistics-save-action {
      justify-content: flex-start;
    }
    .c-logistics-action-bar button {
      width: 146px;
      min-width: 146px;
      height: 40px;
      min-height: 40px;
      justify-content: center;
    }
    .c-warehouse-acceptance-action {
      justify-content: flex-start;
      position: relative;
      padding-top: 8px;
    }
    .c-warehouse-acceptance-btn {
      position: relative;
    }
    .c-warehouse-acceptance-badge {
      position: absolute;
      top: 0;
      right: -8px;
      z-index: 1;
      padding: 1px 6px;
      border-radius: 999px;
      background: #DC2626;
      color: #FFFFFF;
      border: 1px solid #FECACA;
      font-size: 11px;
      font-weight: 700;
      line-height: 16px;
      white-space: nowrap;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
    }
    /* bc 工作台内不再让旧 sticky inline 生效（按钮已移到 bc-sticky-actions） */
    .bc-detail-pane .action-form > .inline:last-child { position: static; margin: 0; padding: 0; border: 0; background: none; }

    @media (max-width: 640px) {
      .c-logistics-action-bar {
        align-items: center;
      }
      .c-logistics-save-action,
      .c-warehouse-acceptance-action {
        justify-content: flex-start;
      }
    }

    /* C组成交撤销专用弹窗 */
    .c-deal-cancel-trigger {
      height: 40px;
      min-height: 40px;
      padding: 0 16px;
      border: 1px solid #FDBA74;
      border-radius: 6px;
      background: #FFF7ED;
      color: #9A3412;
      font-size: 14px;
      font-weight: 600;
    }
    .c-deal-cancel-trigger:hover {
      border-color: #FB923C;
      background: #FFEDD5;
    }
    .c-deal-cancel-backdrop {
      position: fixed;
      inset: 0;
      z-index: 80;
      display: grid;
      place-items: center;
      padding: 18px;
      background: rgba(15, 23, 42, .38);
    }
    .c-deal-cancel-modal {
      width: min(520px, calc(100vw - 24px));
      max-height: calc(100vh - 24px);
      overflow: auto;
      display: grid;
      grid-template-rows: auto 1fr auto;
      border: 1px solid #FED7AA;
      border-radius: 10px;
      background: #FFFFFF;
      box-shadow: 0 22px 70px rgba(15, 23, 42, .24);
    }
    .c-deal-cancel-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      border-bottom: 1px solid #F3E3CF;
      background: #FFF8ED;
    }
    .c-deal-cancel-title {
      min-width: 0;
      display: grid;
      gap: 3px;
    }
    .c-deal-cancel-title strong {
      color: #172033;
      font-size: 16px;
      line-height: 1.2;
    }
    .c-deal-cancel-title span {
      color: #7C5C2E;
      font-size: 12px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .c-deal-cancel-close {
      width: 30px;
      height: 30px;
      min-height: 30px;
      padding: 0;
      border-radius: 50%;
      font-size: 20px;
      line-height: 1;
      background: #FFFFFF;
      color: #7C2D12;
    }
    .c-deal-cancel-body {
      display: grid;
      gap: 12px;
      padding: 14px 16px;
    }
    .c-deal-cancel-body label,
    .c-deal-cancel-field {
      display: grid;
      gap: 5px;
      color: #6B7280;
      font-size: 13px;
    }
    .c-deal-cancel-body select,
    .c-deal-cancel-body textarea {
      width: 100%;
    }
    .c-deal-cancel-body textarea {
      min-height: 92px;
      resize: vertical;
    }
    .c-deal-cancel-scope {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }
    .c-deal-cancel-scope label {
      min-height: 34px;
      display: flex;
      align-items: center;
      gap: 7px;
      padding: 0 10px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #FAFAFA;
      color: #374151;
      cursor: pointer;
    }
    .c-deal-cancel-scope label:has(input:checked) {
      border-color: #FDBA74;
      background: #FFF7ED;
      color: #9A3412;
      font-weight: 600;
    }
    .c-deal-cancel-scope input {
      width: 14px;
      height: 14px;
      min-height: 14px;
      margin: 0;
    }
    .c-deal-cancel-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      padding: 12px 16px;
      border-top: 1px solid #F3E3CF;
      background: #FFFCF7;
    }
    .c-deal-cancel-actions .inline-status {
      margin-right: auto;
      min-width: 0;
    }

    /* C组采购报价提醒弹层 V0 */
    .c-risk-open-btn {
      background: #DC2626;
      border-color: #DC2626;
      color: #fff;
      box-shadow: 0 2px 8px rgba(220, 38, 38, .18);
    }
    .c-risk-open-btn:hover {
      background: #B91C1C;
      border-color: #B91C1C;
      color: #fff;
    }
    .c-risk-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 90;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(15, 23, 42, .42);
    }
    .c-risk-modal {
      width: min(1600px, calc(100vw - 24px));
      max-height: calc(100vh - 24px);
      display: grid;
      grid-template-rows: auto auto minmax(0, 1fr);
      overflow: hidden;
      border: 1px solid #D8E3F0;
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(15, 23, 42, .25);
    }
    .c-risk-modal-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 12px 16px;
      border-bottom: 1px solid #E5E7EB;
      background: #F8FAFC;
    }
    .c-risk-modal-title { display: grid; gap: 3px; min-width: 0; }
    .c-risk-modal-title strong { font-size: 15px; color: #172033; }
    .c-risk-modal-title span { font-size: 12px; color: #667085; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .c-risk-modal-actions { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; }
    .c-risk-modal-body {
      min-height: 0;
      overflow: auto;
      padding: 14px 16px 16px;
      display: grid;
      gap: 12px;
    }
    .c-risk-modal-body.result-mode {
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    .b-handoff-modal-backdrop {
      z-index: 95;
    }
    .b-handoff-modal {
      width: min(720px, calc(100vw - 40px));
      max-height: calc(100vh - 40px);
      grid-template-rows: auto minmax(0, 1fr);
      overflow: hidden;
    }
    .b-handoff-modal-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      padding: 16px 18px;
      border-bottom: 1px solid #E5E7EB;
      background: #F8FAFC;
    }
    .b-handoff-modal-title {
      display: grid;
      gap: 3px;
      min-width: 0;
    }
    .b-handoff-modal-title h3 {
      margin: 0;
      color: #111827;
      font-size: 17px;
      line-height: 1.35;
    }
    .b-handoff-modal-title p {
      margin: 0;
      color: #667085;
      font-size: 12px;
    }
    .b-handoff-modal-form {
      min-height: 0;
      display: grid;
      grid-template-rows: minmax(0, 1fr) auto;
      margin: 0;
    }
    .b-handoff-modal-body {
      min-height: 0;
      overflow: auto;
      display: grid;
      gap: 12px;
      padding: 16px 18px;
    }
    .b-handoff-summary {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px 12px;
      padding: 12px;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #F8FAFC;
    }
    .b-handoff-summary div {
      min-width: 0;
      display: grid;
      gap: 3px;
    }
    .b-handoff-summary span {
      color: #667085;
      font-size: 12px;
    }
    .b-handoff-summary strong {
      min-width: 0;
      overflow: hidden;
      color: #111827;
      font-size: 13px;
      line-height: 1.35;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .b-handoff-field {
      display: grid;
      gap: 6px;
      color: #344054;
      font-size: 13px;
    }
    .b-handoff-modal textarea[name="summary"] {
      min-height: 132px;
      resize: vertical;
    }
    .b-handoff-note {
      padding: 10px 12px;
      border: 1px solid #E4E7EC;
      border-radius: 8px;
      background: #FCFCFD;
      color: #667085;
      font-size: 12px;
      line-height: 1.5;
    }
    .b-handoff-modal-foot {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      padding: 12px 18px;
      border-top: 1px solid #E5E7EB;
      background: #fff;
    }
    .c-risk-source-details,
    .c-risk-result-warnings {
      flex: 0 0 auto;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #F8FAFC;
    }
    .c-risk-source-details > summary,
    .c-risk-result-warnings > summary {
      padding: 8px 11px;
      color: #475467;
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
    }
    .c-risk-source-details[open] > summary,
    .c-risk-result-warnings[open] > summary { border-bottom: 1px solid #E5E7EB; }
    .c-risk-source-content { display: grid; gap: 10px; padding: 10px; }
    .c-risk-modal-body.result-mode .c-risk-table-wrap {
      flex: 1 1 auto;
      min-height: 260px;
    }
    .c-risk-input-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 10px;
      align-items: end;
    }
    .c-risk-input-grid label { display: grid; gap: 5px; color: #4B5563; font-size: 13px; }
    .c-risk-input-grid textarea {
      min-height: 168px;
      max-height: min(360px, 38vh);
      overflow: auto;
      resize: vertical;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
    }
    .c-risk-quote-controls {
      display: grid;
      grid-template-columns: minmax(180px, 240px) minmax(150px, 180px) minmax(0, 1fr);
      gap: 10px;
      align-items: end;
    }
    .c-risk-quote-controls label {
      display: grid;
      gap: 5px;
      color: #4B5563;
      font-size: 13px;
    }
    .c-risk-quote-controls .compact-note {
      min-height: 32px;
      display: flex;
      align-items: center;
      padding: 6px 10px;
    }
    .c-risk-result-meta {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      min-height: 28px;
      color: #4B5563;
      font-size: 13px;
    }
    .c-risk-alert-list {
      display: grid;
      gap: 8px;
    }
    .c-risk-alert {
      padding: 9px 11px;
      border: 1px solid #FEC84B;
      border-radius: 8px;
      background: #FFFAEB;
      color: #92400E;
      font-size: 13px;
      line-height: 1.45;
    }
    .c-risk-footnote {
      color: #667085;
      font-size: 12px;
      line-height: 1.4;
    }
    .c-risk-table-wrap {
      overflow: auto;
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      background: #fff;
    }
    .c-risk-table {
      min-width: 1420px;
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
    }
    .c-risk-table-decision-first { min-width: 1240px; }
    .c-risk-table-decision-first .col-product { width: 170px; }
    .c-risk-table-decision-first .col-date { width: 92px; }
    .c-risk-table-decision-first .col-suggest,
    .c-risk-table-decision-first .col-redline { width: 96px; }
    .c-risk-table-decision-first .col-risk { width: 72px; }
    .c-risk-table-decision-first .col-action { width: 190px; }
    .c-risk-table-decision-first .col-price { width: 82px; }
    .c-risk-table-decision-first .col-sale30 { width: 150px; }
    .c-risk-table-decision-first .col-sku { width: 280px; }
    .c-risk-table-decision-first .col-stock { width: 62px; }
    .c-risk-table-decision-first td.col-suggest,
    .c-risk-table-decision-first td.col-redline {
      padding-top: 15px;
      font-size: 17px;
      font-weight: 850;
      font-variant-numeric: tabular-nums;
    }
    .c-risk-table-decision-first td.col-suggest { color: #047857; background: #ECFDF3; }
    .c-risk-table-decision-first td.col-redline { color: #B54708; background: #FFF4E5; }
    .c-risk-table-decision-first th.col-suggest { color: #047857; background: #E8F7EF; }
    .c-risk-table-decision-first th.col-redline { color: #B54708; background: #FFF0DB; }
    .c-risk-table-decision-first th.col-action,
    .c-risk-table-decision-first td.col-action { border-right: 3px solid #CBD5E1; }
    .c-risk-table th {
      position: sticky;
      top: 0;
      z-index: 1;
      height: 38px;
      padding: 8px 10px;
      background: #F3F6FA;
      color: #344256;
      font-size: 13px;
      font-weight: 750;
      line-height: 1.35;
      text-align: left;
      white-space: nowrap;
      border-bottom: 1px solid #DCE5EF;
    }
    .c-risk-table td {
      height: auto;
      min-height: 42px;
      padding: 9px 10px;
      vertical-align: top;
      color: #273449;
      font-size: 13px;
      line-height: 1.45;
      white-space: pre-line;
      overflow-wrap: anywhere;
      border-bottom: 1px solid #EEF2F7;
    }
    .c-risk-table .col-sku .c-risk-cell-content,
    .c-risk-table .col-sales .c-risk-cell-content,
    .c-risk-table .col-cost .c-risk-cell-content,
    .c-risk-table .col-action .c-risk-cell-content {
      max-height: 86px;
      overflow: auto;
      scrollbar-width: thin;
    }
    .c-risk-product-group { border-top: 12px solid #EEF3F8; }
    .c-risk-product-group:first-of-type { border-top-width: 0; }
    .c-risk-product-main td {
      padding-top: 13px;
      padding-bottom: 13px;
      background: #F7FAFF;
      border-top: 1px solid #C9D8EC;
      border-bottom-color: #D8E3F0;
    }
    .c-risk-product-main td.col-price,
    .c-risk-product-main td.col-sale30,
    .c-risk-product-main td.col-sku,
    .c-risk-product-main td.col-stock {
      background: #FAFBFC;
      color: #526175;
      font-size: 12px;
    }
    .c-risk-product-main td.col-action {
      background: #F4F8FE;
      color: #243B5A;
      font-weight: 650;
    }
    .c-risk-product-main td:first-child {
      border-left: 4px solid #2563EB;
      background: #EEF5FF;
    }
    .c-risk-product-name {
      display: flex;
      flex-direction: column;
      gap: 5px;
      font-size: 14px;
      font-weight: 800;
      color: #172B4D;
    }
    .c-risk-product-index {
      align-self: flex-start;
      padding: 2px 7px;
      border-radius: 999px;
      background: #2563EB;
      color: #fff;
      font-size: 11px;
      font-weight: 750;
      line-height: 1.4;
    }
    .c-risk-table .col-product { width: 170px; }
    .c-risk-table .col-date { width: 96px; }
    .c-risk-table .col-price { width: 84px; }
    .c-risk-table .col-sku { width: 250px; }
    .c-risk-table .col-sale30 { width: 150px; }
    .c-risk-table .col-sales { width: 220px; }
    .c-risk-table .col-cost { width: 250px; }
    .c-risk-table .col-stock { width: 70px; }
    .c-risk-table .col-suggest { width: 92px; }
    .c-risk-table .col-redline { width: 92px; }
    .c-risk-table .col-risk { width: 78px; }
    .c-risk-table .col-action { width: 210px; }
    .c-risk-basis-row td {
      padding: 0 10px 12px 14px;
      background: #F7FAFF !important;
      color: #4B5563;
      font-size: 12px;
      border-left: 4px solid #2563EB;
      border-bottom: 1px solid #C9D8EC;
    }
    .c-risk-detail-owner {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 0 0 9px;
      padding: 6px 10px;
      border-radius: 6px;
      background: #E8F1FF;
      color: #174EA6;
      font-size: 13px;
      font-weight: 800;
    }
    .c-risk-detail-owner::before { content: "以下依据属于"; color: #52677F; font-size: 11px; font-weight: 650; }
    .c-risk-expanded-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1.15fr;
      gap: 10px;
      padding: 2px 0;
    }
    .c-risk-expanded-grid section {
      min-width: 0;
      padding: 11px 12px;
      border: 1px solid #E2E8F0;
      border-radius: 7px;
      background: #fff;
      box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    }
    .c-risk-expanded-grid section:nth-child(1) { border-top: 3px solid #4F7FC7; }
    .c-risk-expanded-grid section:nth-child(2) { border-top: 3px solid #8B6BB1; }
    .c-risk-expanded-grid section:nth-child(3) {
      border-color: #F1C27D;
      border-top: 3px solid #D68A24;
      background: #FFFCF5;
      box-shadow: 0 2px 5px rgba(180, 83, 9, .08);
    }
    .c-risk-expanded-grid section > strong { display: block; margin-bottom: 7px; color: #253858; font-size: 13px; }
    .c-risk-expanded-grid section > div {
      white-space: pre-line;
      line-height: 1.65;
      overflow-wrap: anywhere;
      font-variant-numeric: tabular-nums;
    }
    .c-risk-basis-toggle {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      margin-top: 6px;
      padding: 0;
      border: 0;
      background: transparent;
      color: #2563EB;
      font-size: 12px;
      cursor: pointer;
    }
    .c-risk-basis-toggle:hover { text-decoration: underline; }
    .c-risk-expiry-alert {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 10px 14px 0;
      padding: 10px 12px;
      border: 1px solid #F4B860;
      border-left: 5px solid #D97706;
      border-radius: 8px;
      background: #FFF7E8;
      color: #8A4B08;
      font-size: 13px;
      font-weight: 750;
      line-height: 1.45;
    }
    .c-risk-expiry-alert.red {
      border-color: #F0A3A3;
      border-left-color: #C62828;
      background: #FFF0F0;
      color: #9B1C1C;
    }
    .c-risk-sku-chooser-backdrop {
      position: fixed;
      inset: 0;
      z-index: 120;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(15, 23, 42, .55);
    }
    .c-risk-sku-chooser-dialog {
      width: min(920px, calc(100vw - 48px));
      max-height: min(760px, calc(100vh - 48px));
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      overflow: hidden;
      border: 1px solid #D8E3F0;
      border-radius: 10px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(15, 23, 42, .32);
    }
    .c-risk-sku-chooser-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 12px 14px;
      border-bottom: 1px solid #E5E7EB;
      background: #F8FAFC;
    }
    .c-risk-sku-chooser-head strong { color: #172033; font-size: 15px; }
    .c-risk-sku-chooser-body { min-height: 0; overflow: auto; padding: 14px; }
    .c-risk-sku-chooser-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      margin-top: 10px;
    }
    .c-risk-sku-chooser-list .recent-item { min-width: 0; }
    .c-risk-sku-primary {
      display: grid;
      gap: 7px;
      margin-top: 10px;
      padding: 12px;
      border: 2px solid #7FADDF;
      border-radius: 9px;
      background: #F4F8FE;
    }
    .c-risk-sku-primary-spec { color: #174EA6; font-size: 18px; font-weight: 850; }
    .c-risk-sku-primary .primary { justify-self: start; }
    .c-risk-sku-other { margin-top: 10px; }
    .c-risk-sku-other > summary { color: #526175; font-size: 12px; font-weight: 700; cursor: pointer; }
    .c-risk-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 42px;
      min-height: 22px;
      padding: 2px 8px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 750;
      white-space: nowrap;
    }
    .c-risk-badge.red { color: #B42318; background: #FEE4E2; border: 1px solid #FDA29B; }
    .c-risk-badge.yellow { color: #B54708; background: #FEF0C7; border: 1px solid #FEC84B; }
    .c-risk-badge.green { color: #047857; background: #D1FADF; border: 1px solid #86EFAC; }
    .c-risk-badge.gray { color: #475467; background: #F2F4F7; border: 1px solid #D0D5DD; }
    .c-risk-results-shell {
      flex: 1 1 auto;
      min-height: 260px;
      overflow: auto;
      display: grid;
      grid-auto-rows: max-content;
      align-content: start;
      gap: 9px;
      padding: 0 2px 4px;
      scrollbar-width: thin;
    }
    .c-risk-batch-summary {
      position: sticky;
      top: 0;
      z-index: 4;
      display: grid;
      gap: 5px;
      padding: 6px 8px;
      border: 1px solid #CFDCEC;
      border-radius: 9px;
      background: rgba(248, 251, 255, .97);
      box-shadow: 0 2px 6px rgba(15, 23, 42, .06);
    }
    .c-risk-batch-counts { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
    .c-risk-product-nav {
      display: flex;
      flex-wrap: nowrap;
      align-items: center;
      gap: 6px;
      overflow-x: auto;
      padding-bottom: 1px;
      scrollbar-width: thin;
    }
    .c-risk-batch-counts strong { margin-right: 4px; color: #172B4D; font-size: 14px; }
    .c-risk-count-chip,
    .c-risk-nav-chip {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      min-height: 24px;
      padding: 3px 8px;
      border: 1px solid #D7E0EA;
      border-radius: 999px;
      background: #fff;
      color: #475467;
      font-size: 11px;
      font-weight: 700;
    }
    button.c-risk-nav-chip {
      flex: 0 0 auto;
      max-width: 190px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      cursor: pointer;
    }
    button.c-risk-nav-chip:hover { border-color: #84ADDB; background: #EEF5FF; color: #174EA6; }
    .c-risk-count-chip.green { color: #047857; border-color: #A6F4C5; background: #ECFDF3; }
    .c-risk-count-chip.yellow { color: #B54708; border-color: #FEC84B; background: #FFFAEB; }
    .c-risk-count-chip.red { color: #B42318; border-color: #FDA29B; background: #FEF3F2; }
    .c-risk-product-card {
      align-self: start;
      height: max-content;
      overflow: hidden;
      border: 1px solid #C9D8EC;
      border-left: 5px solid #2563EB;
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
      scroll-margin-top: 92px;
      content-visibility: auto;
      contain-intrinsic-size: auto 340px;
    }
    .c-risk-product-card.needs-choice { border-left-color: #F59E0B; }
    .c-risk-product-card.blocked { border-left-color: #D92D20; }
    .c-risk-card-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
      padding: 8px 11px;
      border-bottom: 1px solid #DDE6F0;
      background: #F8FAFC;
    }
    .c-risk-card-title { display: grid; gap: 2px; min-width: 0; }
    .c-risk-card-title strong { color: #172B4D; font-size: 15px; line-height: 1.3; }
    .c-risk-card-kicker { color: #52677F; font-size: 11px; font-weight: 750; }
    .c-risk-card-status { display: flex; justify-content: flex-end; }
    .c-risk-decision-grid {
      display: grid;
      grid-template-columns: minmax(150px, .75fr) minmax(150px, .75fr) minmax(280px, 2fr);
      border-bottom: 1px solid #E2E8F0;
    }
    .c-risk-decision-block { min-width: 0; padding: 9px 11px; border-right: 1px solid #E2E8F0; }
    .c-risk-decision-block:last-child { border-right: 0; }
    .c-risk-decision-block.suggest { background: #F3FBF6; }
    .c-risk-decision-block.redline { background: #FFF9F0; }
    .c-risk-decision-block.inactive { background: #F2F4F7; }
    .c-risk-decision-block.inactive .c-risk-decision-price { color: #667085; font-size: 20px; }
    .c-risk-decision-label { display: block; margin-bottom: 3px; color: #667085; font-size: 11px; font-weight: 750; }
    .c-risk-decision-price { color: #047857; font-size: 22px; font-weight: 850; line-height: 1.1; font-variant-numeric: tabular-nums; }
    .c-risk-decision-block.redline .c-risk-decision-price { color: #B54708; }
    .c-risk-decision-action { color: #253858; font-size: 12px; font-weight: 650; line-height: 1.45; white-space: pre-line; }
    .c-risk-identity-panel {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 9px;
      align-items: center;
      padding: 7px 11px;
      border-bottom: 1px solid #E7EDF4;
      background: #FBFCFE;
    }
    .c-risk-identity-panel.needs-choice { background: #FFFAEB; }
    .c-risk-identity-copy { min-width: 0; color: #475467; font-size: 11px; line-height: 1.4; white-space: pre-line; overflow-wrap: anywhere; }
    .c-risk-identity-copy strong { display: inline; margin-right: 6px; color: #344054; font-size: 12px; }
    .c-risk-candidate-callout { display: grid; justify-items: end; gap: 5px; color: #B54708; font-size: 12px; font-weight: 750; }
    .c-risk-pack-confirm {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 8px 11px;
      border-bottom: 1px solid #F4D08B;
      background: #FFF8E8;
    }
    .c-risk-pack-confirm-copy { display: grid; gap: 2px; min-width: 0; color: #7A4B08; font-size: 12px; }
    .c-risk-pack-confirm-copy strong { color: #7A2E0E; font-size: 13px; }
    .c-risk-pack-confirm-controls { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
    .c-risk-pack-confirm-controls input { width: 92px; min-height: 34px; }
    .c-risk-market-strip {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      border-bottom: 1px solid #E2E8F0;
      background: #fff;
    }
    .c-risk-market-item { min-width: 0; padding: 6px 11px; border-right: 1px solid #EEF2F6; }
    .c-risk-market-item:last-child { border-right: 0; }
    .c-risk-market-item span { display: block; margin-bottom: 3px; color: #7A8699; font-size: 11px; }
    .c-risk-market-item strong { display: block; color: #344054; font-size: 12px; line-height: 1.35; white-space: pre-line; overflow-wrap: anywhere; }
    .c-risk-card-evidence { padding: 7px 10px 9px; background: #F8FAFC; }
    .c-risk-card-evidence .c-risk-expanded-grid { gap: 7px; }
    .c-risk-card-evidence .c-risk-expanded-grid section { padding: 7px 9px; }
    .c-risk-card-evidence .c-risk-expanded-grid section > strong { margin-bottom: 4px; font-size: 12px; }
    .c-risk-card-evidence .c-risk-expanded-grid section > div { line-height: 1.42; }
    .c-risk-card-evidence .c-risk-expanded-grid section:nth-child(1),
    .c-risk-card-evidence .c-risk-expanded-grid section:nth-child(2) { border-top-color: #AAB7C6; }
    .c-risk-pending-list { display: grid; gap: 10px; }
    .c-risk-pending-panel {
      display: grid;
      grid-template-columns: minmax(220px, .8fr) minmax(0, 2fr);
      gap: 14px;
      padding: 12px 14px;
      border: 1px solid #FEC84B;
      border-left: 5px solid #F59E0B;
      border-radius: 9px;
      background: #FFFAEB;
    }
    .c-risk-pending-title { display: grid; align-content: start; gap: 5px; }
    .c-risk-pending-title span { color: #B54708; font-size: 11px; font-weight: 800; }
    .c-risk-pending-title strong { color: #7A2E0E; font-size: 14px; }
    .c-risk-pending-choices { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
    .c-risk-pending-choices button { min-height: 34px; border-color: #F5B544; background: #fff; font-weight: 750; transition: none; }
    .c-risk-pending-choices button.primary {
      color: #fff;
      border-color: #D97706;
      background: #D97706;
      box-shadow: 0 0 0 3px rgba(217, 119, 6, .18);
    }
    .c-risk-empty {
      padding: 22px;
      text-align: center;
      color: #667085;
      font-size: 13px;
    }
    @media (max-width: 760px) {
      .c-risk-modal-backdrop { padding: 10px; }
      .c-risk-modal { width: calc(100vw - 20px); max-height: calc(100vh - 20px); }
      .c-risk-input-grid { grid-template-columns: 1fr; }
      .c-risk-quote-controls { grid-template-columns: 1fr; }
      .c-risk-modal-head { align-items: start; }
      .c-risk-modal-actions { flex-wrap: wrap; justify-content: flex-end; }
      .c-risk-expanded-grid { grid-template-columns: 1fr; }
      .c-risk-sku-chooser-backdrop { padding: 10px; }
      .c-risk-sku-chooser-dialog { width: calc(100vw - 20px); max-height: calc(100vh - 20px); }
      .c-risk-sku-chooser-list { grid-template-columns: 1fr; }
      .c-risk-decision-grid,
      .c-risk-market-strip { grid-template-columns: 1fr; }
      .c-risk-decision-block,
      .c-risk-market-item { border-right: 0; border-bottom: 1px solid #E2E8F0; }
      .c-risk-identity-panel { grid-template-columns: 1fr; }
      .c-risk-candidate-callout { justify-items: start; }
      .c-risk-pack-confirm { align-items: stretch; flex-direction: column; }
      .c-risk-pack-confirm-controls { width: 100%; }
      .c-risk-pack-confirm-controls input { flex: 1 1 auto; width: auto; }
      .c-risk-pending-panel { grid-template-columns: 1fr; }
      .bc-workbench { grid-template-columns: 1fr; }
      .bc-list-search { grid-template-columns: 1fr 1fr; }
      .bc-list-search > input { grid-column: 1 / -1; }
      .bc-list-search select { max-width: none; }
    }

    /* ABC V2 final visual override: placed last so old page-specific CSS cannot override it. */
    .content { background: #F4F6FA; }
    .a-workbench-shell,
    .b-workbench-shell,
    .c-workbench-shell,
    .manager-page-shell {
      display: grid;
      gap: 14px;
      min-width: 0;
    }
    .a-kpi-strip,
    .b-kpi-strip,
    .c-kpi-strip {
      display: grid;
      grid-template-columns: repeat(4, minmax(150px, 1fr));
      gap: 10px;
      margin: 0;
    }
    .a-kpi-strip .metric,
    .b-kpi-strip .metric,
    .c-kpi-strip .metric {
      min-height: 76px;
      padding: 12px 14px;
      border: 1px solid #E3E8F0;
      border-radius: 8px;
      background: #FFFFFF;
      box-shadow: 0 8px 18px rgba(15, 23, 42, .05);
    }
    .a-kpi-strip .metric .name,
    .b-kpi-strip .metric .name,
    .c-kpi-strip .metric .name {
      color: #586174;
      font-size: 12px;
      font-weight: 700;
    }
    .a-kpi-strip .metric .value,
    .b-kpi-strip .metric .value,
    .c-kpi-strip .metric .value {
      color: #111827;
      font-size: 24px;
      line-height: 1.2;
      font-weight: 850;
      font-variant-numeric: tabular-nums;
    }
    .a-abnormal-type-strip {
      display: grid;
      gap: 8px;
      min-width: 0;
      padding: 10px 12px;
      border: 1px solid #E3E8F0;
      border-radius: 8px;
      background: #FFFFFF;
      box-shadow: 0 8px 18px rgba(15, 23, 42, .04);
    }
    .a-abnormal-type-title {
      color: #586174;
      font-size: 12px;
      font-weight: 800;
    }
    .a-abnormal-type-list {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      min-width: 0;
    }
    .a-abnormal-type-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      min-width: 0;
      max-width: 100%;
      padding: 6px 9px;
      border: 1px solid #D8DEE9;
      border-radius: 10px;
      background: #F8FAFC;
      color: #334155;
      font-size: 12px;
      line-height: 1.2;
      cursor: default;
    }
    .a-abnormal-type-chip span {
      overflow-wrap: anywhere;
    }
    .a-abnormal-type-badge {
      min-width: 20px;
      padding: 2px 7px;
      border-radius: 10px;
      background: #E2E8F0;
      color: #475569;
      font-style: normal;
      font-weight: 800;
      text-align: center;
      font-variant-numeric: tabular-nums;
    }
    .a-abnormal-type-chip.has-count {
      border-color: #FCA5A5;
      background: #FEF2F2;
      color: #991B1B;
    }
    .a-abnormal-type-chip.has-count .a-abnormal-type-badge {
      background: #DC2626;
      color: #FFFFFF;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .38);
    }
    .a-abnormal-type-chip.is-zero .a-abnormal-type-badge {
      background: #EEF2F7;
      color: #94A3B8;
      font-weight: 700;
    }
    .a-abnormal-type-chip.is-active {
      border-color: #2563EB;
      background: #EFF6FF;
      color: #1D4ED8;
      box-shadow: 0 8px 18px rgba(37, 99, 235, .18), 0 0 0 2px rgba(37, 99, 235, .12);
      transform: translateY(-1px);
    }
    .a-abnormal-type-chip.is-active .a-abnormal-type-badge {
      outline: 2px solid rgba(37, 99, 235, .22);
      outline-offset: 1px;
    }
    .a-workbench-grid {
      display: grid;
      grid-template-columns: minmax(520px, 1.15fr) minmax(360px, .85fr);
      gap: 14px;
      align-items: start;
    }
    .a-workbench-main,
    .a-workbench-side,
    .workbench-aux-grid {
      min-width: 0;
      display: grid;
      gap: 12px;
      align-content: start;
    }
    .workbench-aux-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      margin-bottom: 14px;
    }
    .workbench-aux-grid > .section,
    .workbench-aux-grid > details.section {
      min-width: 0;
      margin: 0;
    }
    .workbench-aux-grid > details.section:not([open]) > .section-body {
      display: none;
    }
    .workbench-aux-grid > .section:nth-last-child(1):nth-child(odd),
    .workbench-aux-grid > details.section:nth-last-child(1):nth-child(odd) {
      grid-column: 1 / -1;
    }
    .section,
    .bc-list-pane,
    .bc-detail-pane {
      border: 1px solid #E2E8F0;
      border-radius: 8px;
      background: #FFFFFF;
      box-shadow: 0 10px 24px rgba(15, 23, 42, .055);
    }
    .section-head,
    summary.section-head,
    .bc-list-head,
    .compact-card-head {
      min-height: 48px;
      padding: 11px 14px;
      border-bottom: 1px solid #E7ECF3;
      background: #FBFCFE;
    }
    .section-head h2,
    summary.section-head h2,
    .manager-operations-head h2 {
      margin: 0;
      color: #111827;
      font-size: 16px;
      line-height: 1.3;
      font-weight: 850;
    }
    .section-head .pill,
    .bc-list-head .pill,
    .compact-card-head .pill {
      min-height: 24px;
      padding: 3px 9px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 750;
    }
    .bc-workbench {
      grid-template-columns: 390px minmax(0, 1fr);
      gap: 14px;
      height: calc(100vh - 180px);
      min-height: 560px;
      max-height: calc(100vh - 92px);
    }
    #view-bgroup .bc-workbench {
      height: calc(100vh - 92px);
      min-height: 648px;
      max-height: calc(100vh - 4px);
    }
    #view-cgroup .bc-workbench {
      grid-template-columns: 350px minmax(0, 1fr);
      height: calc(100vh - 96px);
      min-height: 640px;
      max-height: calc(100vh - 14px);
    }
    #view-bgroup .bc-list-pane .pagination-bar,
    #view-cgroup .bc-list-pane .pagination-bar {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      align-items: stretch;
      gap: 6px;
      overflow: visible;
    }
    #view-bgroup .bc-list-pane .pagination-summary,
    #view-cgroup .bc-list-pane .pagination-summary {
      width: 100%;
      min-width: 0;
    }
    #view-bgroup .bc-list-pane .pagination-actions,
    #view-cgroup .bc-list-pane .pagination-actions {
      width: 100%;
      min-width: 0;
      max-width: 100%;
      flex-wrap: wrap;
      justify-content: flex-start;
      gap: 4px;
      overflow: visible;
      white-space: normal;
    }
    #view-bgroup .bc-list-pane .pagination-jump,
    #view-cgroup .bc-list-pane .pagination-jump {
      gap: 4px;
      height: 30px;
      flex: 0 0 auto;
    }
    #view-bgroup .bc-list-pane .pagination-jump input,
    #view-cgroup .bc-list-pane .pagination-jump input {
      width: 36px;
      height: 30px;
      min-height: 30px;
      padding: 3px 5px;
    }
    #view-bgroup .bc-list-pane .pagination-total,
    #view-cgroup .bc-list-pane .pagination-total {
      min-width: 24px;
    }
    #view-bgroup .bc-list-pane .pagination-nav-btn,
    #view-bgroup .bc-list-pane .pagination-go-btn,
    #view-cgroup .bc-list-pane .pagination-nav-btn,
    #view-cgroup .bc-list-pane .pagination-go-btn {
      min-width: 32px;
      height: 30px;
      min-height: 30px;
      padding: 0 5px;
    }
    #view-bgroup #bListPaginationTop .pagination-bar {
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 6px;
      margin: 6px 8px;
      padding: 5px 6px;
    }
    #view-bgroup #bListPaginationTop .pagination-summary {
      width: auto;
      min-width: 74px;
      font-size: 12px;
    }
    #view-bgroup #bListPaginationTop .pagination-actions {
      width: auto;
      justify-content: flex-end;
      flex-wrap: nowrap;
      overflow-x: auto;
      white-space: nowrap;
    }
    #view-bgroup #bListPaginationTop .pagination-nav-btn,
    #view-bgroup #bListPaginationTop .pagination-go-btn {
      height: 28px;
      min-height: 28px;
      min-width: 28px;
      padding: 0 5px;
      font-size: 12px;
    }
    #view-bgroup #bListPaginationTop .pagination-jump,
    #view-bgroup #bListPaginationTop .pagination-jump input {
      height: 28px;
      min-height: 28px;
    }
    #view-bgroup #bListPaginationTop .pagination-jump input {
      width: 34px;
    }
    #view-cgroup #cListPaginationTop .pagination-bar {
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 6px;
      margin: 6px 8px;
      padding: 5px 6px;
    }
    #view-cgroup #cListPaginationTop .pagination-summary {
      width: auto;
      min-width: 74px;
      font-size: 12px;
    }
    #view-cgroup #cListPaginationTop .pagination-actions {
      width: auto;
      justify-content: flex-end;
      flex-wrap: nowrap;
      overflow-x: auto;
      white-space: nowrap;
    }
    #view-cgroup #cListPaginationTop .pagination-nav-btn,
    #view-cgroup #cListPaginationTop .pagination-go-btn {
      height: 28px;
      min-height: 28px;
      min-width: 28px;
      padding: 0 5px;
      font-size: 12px;
    }
    #view-cgroup #cListPaginationTop .pagination-jump,
    #view-cgroup #cListPaginationTop .pagination-jump input {
      height: 28px;
      min-height: 28px;
    }
    #view-cgroup #cListPaginationTop .pagination-jump input {
      width: 34px;
    }
    @media (max-width: 980px) {
      #view-bgroup .bc-list-search {
        grid-template-columns: minmax(62px, 1fr) 54px 70px 76px 36px 36px;
      }
      #view-bgroup .bc-list-search > .bc-filter-control {
        grid-column: span 1;
      }
      #view-bgroup .bc-list-search > .b-filter-quick,
      #view-bgroup .bc-list-search > .b-filter-time {
        grid-column: span 1;
      }
      #view-bgroup .bc-list-search > .b-search-input {
        grid-column: auto;
      }
      #view-bgroup #bListPaginationTop .pagination-bar {
        grid-template-columns: minmax(0, 1fr);
      }
      #view-bgroup #bListPaginationTop .pagination-actions {
        justify-content: flex-start;
      }
      #view-cgroup .bc-list-search {
        grid-template-columns: minmax(120px, 1fr) 40px 40px;
      }
      #view-cgroup .bc-list-search > .bc-filter-control {
        grid-column: span 1;
      }
      #view-cgroup .bc-list-search > .c-filter-status,
      #view-cgroup .bc-list-search > .c-filter-time {
        grid-column: span 1;
      }
      #view-cgroup .bc-list-search > .c-search-input {
        grid-column: 1 / -3;
      }
      #view-cgroup #cListPaginationTop .pagination-bar {
        grid-template-columns: minmax(0, 1fr);
      }
      #view-cgroup #cListPaginationTop .pagination-actions {
        justify-content: flex-start;
      }
    }
    @media (max-width: 760px) {
      .b-date-range-panel,
      .c-date-range-panel {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      }
      .b-date-apply-btn,
      .b-date-clear-btn {
        grid-column: auto;
      }
    }
    @media (max-width: 560px) {
      .b-date-range-panel,
      .c-date-range-panel {
        grid-template-columns: minmax(0, 1fr);
      }
      .b-date-separator,
      .c-date-separator {
        display: none;
      }
    }
    #view-cgroup .c-aux-section {
      display: block;
      min-width: 0;
      margin-top: 14px;
      padding: 10px;
      border: 1px solid #D1F5E0;
      border-radius: 10px;
      background: #F4FFF8;
      box-shadow: 0 10px 28px rgba(16, 185, 129, .08);
    }
    #view-cgroup .c-aux-section > #cAuxTabs {
      margin-top: 12px;
    }
    #view-cgroup .c-aux-section-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-height: 44px;
      padding: 0 4px;
      cursor: pointer;
      list-style: none;
    }
    #view-cgroup .c-aux-section-head::-webkit-details-marker {
      display: none;
    }
    #view-cgroup .c-aux-section-head::after {
      content: "展开";
      flex: 0 0 auto;
      min-width: 44px;
      padding: 5px 10px;
      border: 1px solid #A7F3D0;
      border-radius: 999px;
      background: #fff;
      color: #047857;
      font-size: 12px;
      font-weight: 850;
      text-align: center;
    }
    #view-cgroup .c-aux-section[open] .c-aux-section-head::after {
      content: "收起";
    }
    #view-cgroup .c-aux-section-head .compact-note {
      margin-left: auto;
      color: #047857;
      text-align: right;
    }
    #view-cgroup .c-aux-section-head h2 {
      margin: 0;
      color: #111827;
      font-size: 16px;
      line-height: 1.3;
      font-weight: 850;
    }
    #view-cgroup .c-aux-tabs {
      overflow: hidden;
      border: 1px solid #D1F5E0;
      box-shadow: 0 10px 26px rgba(16, 185, 129, .10);
    }
    #view-cgroup .c-aux-tabs-head {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding: 12px;
      border-bottom: 1px solid #E4E7EC;
      background: linear-gradient(180deg, #F8FFFB 0%, #FFFFFF 100%);
    }
    #view-cgroup .c-aux-tab {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 36px;
      padding: 0 12px;
      border: 1px solid #D0D5DD;
      border-radius: 8px;
      background: #fff;
      color: #344054;
      font-weight: 800;
      box-shadow: none;
    }
    #view-cgroup .c-aux-tab strong {
      min-width: 22px;
      padding: 2px 7px;
      border-radius: 999px;
      background: #F2F4F7;
      color: #475467;
      font-size: 12px;
      text-align: center;
      font-variant-numeric: tabular-nums;
    }
    #view-cgroup .c-aux-tab.active {
      border-color: #34D399;
      background: #ECFDF3;
      color: #047857;
      box-shadow: inset 3px 0 0 var(--c-accent);
    }
    #view-cgroup .c-aux-tab.active strong {
      background: #D1FAE5;
      color: #047857;
    }
    #view-cgroup .c-aux-tabs-body {
      display: block;
      padding: 12px;
    }
    #view-cgroup .c-aux-tab-panel {
      display: grid;
      gap: 10px;
      min-width: 0;
    }
    #view-cgroup .c-aux-filter-row {
      justify-content: flex-start;
      gap: 6px;
    }
    #view-cgroup .c-aux-tabs .table-wrap {
      height: clamp(320px, 42vh, 420px);
      overflow-y: auto;
    }
    #view-cgroup .c-callback-task-list {
      padding: 8px;
      background: #F8FAFC;
    }
    #view-cgroup .c-callback-task-table {
      border-collapse: separate;
      border-spacing: 0 8px;
      min-width: 980px;
      background: transparent;
    }
    #view-cgroup .c-callback-task-row > td {
      padding: 0;
      border: 0;
      background: transparent;
      vertical-align: top;
    }
    #view-cgroup .c-callback-task-card {
      display: grid;
      grid-template-columns: minmax(280px, 1fr) minmax(170px, .62fr) minmax(300px, 1.1fr) 136px;
      grid-template-areas:
        "customer meta goods action"
        "customer meta reason action";
      gap: 10px;
      align-items: stretch;
      padding: 10px;
      border: 1px solid #D9E2EC;
      border-radius: 8px;
      background: #FFFFFF;
      box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
    }
    #view-cgroup .c-callback-task-customer {
      grid-area: customer;
      min-width: 0;
    }
    #view-cgroup .c-callback-task-meta {
      grid-area: meta;
      display: grid;
      grid-template-rows: 1fr 1fr;
      gap: 8px;
      min-width: 0;
    }
    #view-cgroup .c-callback-info-panel.is-goods {
      grid-area: goods;
    }
    #view-cgroup .c-callback-info-panel.is-reason {
      grid-area: reason;
    }
    #view-cgroup .c-callback-customer-card {
      height: 100%;
      display: grid;
      align-content: start;
      gap: 7px;
      padding: 9px 10px;
      border: 1px solid #E2E8F0;
      border-radius: 8px;
      background: #FCFCFD;
      box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    }
    #view-cgroup .c-callback-customer-name {
      color: #111827;
      font-size: 14px;
      font-weight: 850;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    #view-cgroup .c-callback-customer-id {
      padding: 5px 6px;
      border-radius: 6px;
      background: #FFFFFF;
      color: #344054;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
      font-size: 12px;
      line-height: 1.35;
      overflow-wrap: anywhere;
      white-space: normal;
    }
    #view-cgroup .c-callback-customer-chips {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      min-width: 0;
    }
    #view-cgroup .c-callback-customer-chips span {
      max-width: 100%;
      padding: 3px 7px;
      border: 1px solid #E4E7EC;
      border-radius: 6px;
      background: #FFFFFF;
      color: #475467;
      font-size: 11px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    #view-cgroup .c-callback-info-panel {
      min-width: 0;
      display: grid;
      align-content: start;
      gap: 5px;
      padding: 9px 10px;
      border: 1px solid #E4E7EC;
      border-radius: 8px;
      background: #FCFCFD;
    }
    #view-cgroup .c-callback-info-label {
      color: #667085;
      font-size: 11px;
      font-weight: 800;
      line-height: 1.2;
    }
    #view-cgroup .c-callback-info-body {
      min-width: 0;
      color: #111827;
      font-size: 13px;
      line-height: 1.45;
      overflow-wrap: anywhere;
    }
    #view-cgroup .c-callback-info-body strong {
      font-size: 13px;
      font-weight: 850;
    }
    #view-cgroup .c-callback-date {
      margin-top: 5px;
      color: #667085;
      font-size: 12px;
      font-variant-numeric: tabular-nums;
    }
    #view-cgroup .c-callback-long-text {
      max-height: 92px;
      overflow: auto;
      padding-right: 3px;
      white-space: normal;
      overflow-wrap: anywhere;
    }
    #view-cgroup .c-callback-task-action {
      display: flex;
      align-items: center;
      justify-content: center;
      grid-area: action;
      min-width: 0;
      padding: 8px;
      border-left: 1px solid #E4E7EC;
    }
    #view-cgroup .c-callback-task-action .small-btn {
      width: 100%;
      min-width: 112px;
      height: 38px;
      padding: 0 14px;
      white-space: nowrap;
    }
    @media (max-width: 1180px) {
      #view-cgroup .c-callback-task-table {
        min-width: 760px;
      }
      #view-cgroup .c-callback-task-card {
        grid-template-columns: minmax(250px, 1fr) minmax(170px, .75fr) minmax(260px, 1fr) 128px;
      }
    }
    #view-cgroup .c-aux-callback-form-card {
      margin-top: 4px;
    }
    #view-cgroup .c-action-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 80;
      display: grid;
      place-items: center;
      padding: 20px;
      background: rgba(15, 23, 42, .42);
    }
    #view-cgroup .c-action-modal {
      width: min(760px, calc(100vw - 40px));
      max-height: calc(100vh - 40px);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      overflow: hidden;
      border: 1px solid #D1F5E0;
      border-radius: 10px;
      background: #fff;
      box-shadow: 0 22px 60px rgba(15, 23, 42, .22);
    }
    #view-cgroup .c-action-modal-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      border-bottom: 1px solid #E4E7EC;
      background: #F8FFFB;
    }
    #view-cgroup .c-action-modal-title {
      display: grid;
      gap: 3px;
      min-width: 0;
    }
    #view-cgroup .c-action-modal-title strong {
      color: #111827;
      font-size: 16px;
      line-height: 1.3;
    }
    #view-cgroup .c-action-modal-title span {
      color: #667085;
      font-size: 12px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    #view-cgroup .c-action-modal-body {
      display: grid;
      gap: 12px;
      min-height: 0;
      overflow: auto;
      padding: 14px 16px;
    }
    #view-cgroup .c-action-modal-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 12px 16px;
      border-top: 1px solid #E4E7EC;
      background: #FCFCFD;
    }
    #view-cgroup .c-top-metric-modal {
      width: min(1180px, calc(100vw - 48px));
      height: min(760px, calc(100vh - 48px));
      max-height: calc(100vh - 48px);
    }
    #view-cgroup .c-top-metric-modal-backdrop {
      z-index: 10020;
    }
    #view-cgroup .c-top-metric-modal .c-action-modal-body {
      align-content: start;
      overflow: hidden;
      padding: 12px 14px;
    }
    #view-cgroup .c-top-metric-modal .c-action-modal-foot {
      justify-content: flex-end;
    }
    #view-cgroup .c-top-metric-footer-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
      min-width: 0;
    }
    #view-cgroup .c-top-metric-footer-actions .pagination {
      margin: 0;
      justify-content: flex-end;
    }
    #view-cgroup .c-top-metric-command-actions {
      justify-content: flex-end;
      margin: 0;
    }
    #view-cgroup .c-top-metric-modal .table-scroll {
      min-height: 0;
      max-height: calc(100vh - 188px);
      overflow: auto;
      border: 1px solid #EAECF0;
      border-radius: 8px;
    }
    #view-cgroup .c-top-metric-table {
      min-width: 980px;
    }
    #view-cgroup .c-top-metric-table th,
    #view-cgroup .c-top-metric-table td {
      vertical-align: top;
    }
    #view-cgroup .c-top-metric-table small {
      display: block;
      margin-top: 4px;
      color: #667085;
      line-height: 1.35;
    }
    #view-cgroup .c-callback-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 82;
      display: grid;
      place-items: center;
      padding: 20px;
      background: rgba(15, 23, 42, .42);
    }
    #view-cgroup .c-callback-modal {
      width: min(820px, calc(100vw - 40px));
      max-height: calc(100vh - 40px);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      overflow: hidden;
      border: 1px solid #BFDBFE;
      border-radius: 10px;
      background: #fff;
      box-shadow: 0 22px 60px rgba(15, 23, 42, .22);
    }
    #view-cgroup .c-callback-modal-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      border-bottom: 1px solid #E4E7EC;
      background: #F8FBFF;
    }
    #view-cgroup .c-callback-modal-title {
      display: grid;
      gap: 3px;
      min-width: 0;
    }
    #view-cgroup .c-callback-modal-title strong {
      color: #111827;
      font-size: 16px;
      line-height: 1.3;
    }
    #view-cgroup .c-callback-modal-title span {
      color: #667085;
      font-size: 12px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    #view-cgroup .c-callback-modal-body {
      min-height: 0;
      overflow: auto;
      scrollbar-gutter: stable;
      padding: 14px 16px;
    }
    #view-cgroup .c-callback-modal-form,
    #view-cgroup .c-callback-modal-fields,
    #view-cgroup .c-callback-modal-fields > label {
      min-width: 0;
    }
    #view-cgroup .c-callback-modal-fields input,
    #view-cgroup .c-callback-modal-fields select,
    #view-cgroup .c-callback-modal-fields textarea {
      width: 100%;
      max-width: 100%;
      resize: vertical;
    }
    #view-cgroup .c-callback-modal-fields textarea {
      min-height: 78px;
    }
    #view-cgroup .c-callback-modal-foot {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
      padding: 12px 16px;
      border-top: 1px solid #E4E7EC;
      background: #FCFCFD;
    }
    #view-cgroup .c-callback-modal-foot button {
      flex: 0 0 auto;
    }
    #view-cgroup .c-callback-modal-foot .inline-status {
      min-width: 0;
    }
    @media (max-width: 720px) {
      #view-cgroup .c-callback-modal-backdrop {
        padding: 10px;
      }
      #view-cgroup .c-callback-modal {
        width: calc(100vw - 20px);
        max-height: calc(100vh - 20px);
      }
      #view-cgroup .c-callback-modal-fields {
        grid-template-columns: minmax(0, 1fr);
      }
      #view-cgroup .c-callback-modal-foot {
        flex-wrap: wrap;
      }
      #view-cgroup .c-callback-modal-foot button {
        flex: 1 1 0;
      }
      #view-cgroup .c-callback-modal-foot .inline-status {
        flex: 1 0 100%;
      }
    }
    #view-cgroup .c-aux-grid {
      margin-bottom: 0;
    }
    #view-cgroup .c-aux-grid > .section:not(#oldCustomerCallbackPanel),
    #view-cgroup .c-aux-grid > details.section {
      max-height: 360px;
      overflow: hidden;
    }
    #view-cgroup .c-aux-grid > details.section:not([open]) {
      height: 60px;
    }
    #view-cgroup .c-aux-grid #oldCustomerCallbackPanel {
      grid-column: 1 / -1;
      min-width: 0;
    }
    .bc-list-pane,
    .bc-detail-pane {
      overflow: hidden;
    }
    .bc-list-head {
      gap: 8px;
    }
    .bc-list-head > span:first-child {
      min-width: 0;
      overflow: hidden;
      color: #111827;
      font-size: 15px;
      font-weight: 850;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .bc-list-head button {
      height: 30px;
      min-height: 30px;
      padding: 0 9px;
      border-color: #D7DEE9;
      background: #FFFFFF;
      font-size: 12px;
      font-weight: 750;
    }
    .bc-list-search {
      top: 49px;
      grid-template-columns: 1fr;
      gap: 7px;
      padding: 10px;
      background: #FFFFFF;
    }
    .b-search-main {
      grid-template-columns: minmax(0, 1fr) 56px 56px;
      gap: 7px;
    }
    .b-filter-primary,
    .b-filter-advanced-grid {
      grid-template-columns: 1fr;
      gap: 7px;
    }
    .b-search-main > input,
    .bc-list-search select,
    .bc-list-search button {
      height: 34px;
      min-height: 34px;
      border-radius: 7px;
      font-size: 13px;
    }
    .pagination-bar {
      margin: 8px 10px;
      padding: 6px 8px;
      border-color: #E2E8F0;
      background: #F8FAFC;
    }
    .customer-item {
      min-height: 92px;
      padding: 11px 12px;
      border-bottom: 1px solid #EDF1F6;
      background: #FFFFFF;
    }
    .customer-item-title {
      color: #111827;
      font-size: 14px;
      font-weight: 800;
    }
    .customer-item-meta,
    .customer-item-footer {
      color: #667085;
      font-size: 12px;
      line-height: 1.45;
    }
    .customer-item.active {
      background: #EFF6FF;
      box-shadow: inset 4px 0 0 #2563EB;
    }
    #view-bgroup .customer-item.active {
      background: #FFF8EC;
      box-shadow: inset 4px 0 0 #D97706;
    }
    #view-bgroup .customer-item.b-row-resource {
      background: #F7FEF9;
      box-shadow: inset 4px 0 0 #16A34A;
    }
    #view-bgroup .customer-item.b-row-resource.active {
      background: #ECFDF3;
      box-shadow: inset 4px 0 0 #15803D;
    }
    #view-bgroup .customer-item.b-row-resource .customer-item-title::before {
      content: "货源案件";
      display: inline-block;
      margin-right: 8px;
      padding: 2px 6px;
      border: 1px solid #BBF7D0;
      border-radius: 6px;
      background: #DCFCE7;
      color: #166534;
      font-size: 11px;
      font-weight: 800;
      line-height: 1.2;
      vertical-align: 1px;
    }
    #view-bgroup .customer-item.b-row-customer .customer-item-title::before {
      content: "客户主档";
      display: inline-block;
      margin-right: 8px;
      padding: 2px 6px;
      border: 1px solid #FED7AA;
      border-radius: 6px;
      background: #FFEDD5;
      color: #9A3412;
      font-size: 11px;
      font-weight: 800;
      line-height: 1.2;
      vertical-align: 1px;
    }
    #view-bgroup .b-customer-card {
      margin: 0 0 8px;
      padding: 11px 12px;
      border-radius: 8px;
    }
    #view-bgroup .b-card-name {
      font-size: 14px;
    }
    #view-bgroup .b-card-identity,
    #view-bgroup .b-card-owner,
    #view-bgroup .b-card-next {
      font-size: 12px;
    }
    #view-bgroup .b-card-chip {
      max-width: calc(50vw - 28px);
    }
    #view-cgroup .customer-item.active {
      background: #ECFDF5;
      box-shadow: inset 4px 0 0 #059669;
    }
    .bc-detail-scroll {
      padding: 14px;
      scrollbar-gutter: stable;
    }
    .compact-card {
      border-color: #E2E8F0;
      border-radius: 8px;
      box-shadow: none;
    }
    .compact-note,
    .hint,
    .workbench-note,
    .metric-note {
      color: #667085;
      font-size: 12px;
      line-height: 1.45;
    }
    .intro-card {
      display: none;
    }
    #view-manager .manager-operations-hub {
      border: 1px solid #DDE5F0;
      border-radius: 8px;
      background: #FFFFFF;
      box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
    }
    #view-manager .manager-operations-head {
      padding: 14px 16px;
      border-bottom: 1px solid #E7ECF3;
      background: #FBFCFE;
    }
    #view-manager .manager-operations-head p {
      display: none;
    }
    #view-manager #manager-transfer-out .transfer-out-summary,
    #view-bgroup #bManagerAuxTabs .transfer-out-summary {
      align-items: center;
      background: #FFFFFF;
      box-shadow: inset 0 -1px 0 #E7ECF3;
    }
    #view-manager #manager-transfer-out .transfer-out-head-main h2,
    #view-bgroup #bManagerAuxTabs .transfer-out-head-main h2 {
      font-size: 16px;
      font-weight: 850;
    }
    #view-manager #manager-transfer-out .transfer-out-tabs,
    #view-bgroup #bManagerAuxTabs .transfer-out-tabs {
      min-height: 42px;
      padding: 4px;
      border: 1px solid #DDE5F0;
      border-radius: 8px;
      background: #F6F8FB;
      box-shadow: none;
    }
    #view-manager #manager-transfer-out .transfer-out-tab,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab {
      min-height: 34px;
      padding: 0 14px;
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: #475467;
      font-size: 14px;
      font-weight: 800;
    }
    #view-manager #manager-transfer-out .transfer-out-tab.is-active,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab.is-active {
      background: #FFFFFF;
      color: #111827;
      box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
    }
    #view-manager #manager-transfer-out .transfer-out-tab em,
    #view-bgroup #bManagerAuxTabs .transfer-out-tab em {
      margin-left: 8px;
      color: inherit;
      font-size: 13px;
      font-style: normal;
      font-variant-numeric: tabular-nums;
    }
    #view-manager .manager-operations-grid {
      padding: 14px;
      gap: 14px;
    }
    @media (max-width: 1100px) {
      .a-kpi-strip,
      .b-kpi-strip,
      .c-kpi-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .a-workbench-grid,
      .workbench-aux-grid,
      .bc-workbench {
        grid-template-columns: 1fr;
        height: auto;
        max-height: none;
      }
      .bc-list-pane,
      .bc-detail-pane {
        min-height: 420px;
      }
    }
    @media (max-width: 760px) {
      .content {
        padding: 12px;
      }
      .a-kpi-strip,
      .b-kpi-strip,
      .c-kpi-strip {
        grid-template-columns: 1fr 1fr;
      }
      .a-kpi-strip .metric,
      .b-kpi-strip .metric,
      .c-kpi-strip .metric {
        min-height: 68px;
        padding: 10px;
      }
      .a-kpi-strip .metric .value,
      .b-kpi-strip .metric .value,
      .c-kpi-strip .metric .value {
        font-size: 20px;
      }
      .bc-list-search {
        grid-template-columns: 1fr 1fr;
      }
      .bc-workbench {
        min-height: 0;
      }
      .bc-list-pane,
      .bc-detail-pane {
        min-height: 360px;
      }
    }

    /* A group left action lane: old inner grids must not outgrow the new column. */
    #view-agroup .a-workbench-main,
    #view-agroup .a-workbench-side,
    #view-agroup .a-workbench-main .section,
    #view-agroup .a-workbench-side .section,
    #view-agroup .a-workbench-main .section-body,
    #view-agroup .a-workbench-side .section-body {
      min-width: 0;
      max-width: 100%;
    }

    #view-agroup .a-workbench-main .section-body.grid,
    #view-agroup .a-workbench-main #aHelperForm,
    #view-agroup .a-workbench-main .split,
    #view-agroup .a-workbench-main .metric-row {
      display: grid;
      grid-template-columns: 1fr;
      min-width: 0;
      max-width: 100%;
    }

    #view-agroup .a-workbench-main #aHelperForm label,
    #view-agroup .a-workbench-main #aHelperForm .hint,
    #view-agroup .a-workbench-main #aHelperForm .inline,
    #view-agroup .a-workbench-main .split > *,
    #view-agroup .a-workbench-main .metric-row > *,
    #view-agroup .a-workbench-main .table-wrap {
      min-width: 0;
      max-width: 100%;
    }

    #view-agroup .a-workbench-main #aHelperForm .inline {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
    }

    #view-agroup .a-workbench-main #aHelperForm .inline button {
      flex: 1 1 150px;
      max-width: 100%;
    }

    /* A group page is an execution console for every role: task helper first, auxiliary panels below. */
    #view-agroup .a-workbench-staff .a-workbench-grid {
      grid-template-columns: minmax(0, 1fr);
    }

    #view-agroup .a-workbench-staff .a-workbench-side {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      align-items: start;
    }

    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px 14px;
    }

    #view-agroup .a-workbench-staff .a-workbench-main .split {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #view-agroup .a-workbench-staff .a-workbench-main .metric-row {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm .inline {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
      gap: 8px;
    }

    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm .inline button {
      width: 100%;
      min-width: 0;
      padding-left: 8px;
      padding-right: 8px;
    }

    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm .a-task-command-row {
      padding: 12px;
      border: 1px solid #bfdbfe;
      border-radius: 8px;
      background: #eff6ff;
    }

    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm .a-task-command-row #claimATaskBtn,
    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm .a-task-command-row #sentATaskBtn {
      font-weight: 800;
    }

    #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm .a-wechat-health-row {
      margin-top: 2px;
    }

    #view-agroup .a-workbench-staff .a-workbench-main .section {
      overflow: hidden;
    }

    #view-agroup .a-workbench-staff .a-staff-worklog-archive {
      overflow: hidden;
    }

    #view-agroup .a-workbench-staff .a-staff-worklog-archive:not([open]) > .section-body {
      display: none;
    }

    #view-agroup .a-workbench-staff .a-staff-worklog-archive .grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    @media (max-width: 980px) {
      #view-agroup .a-workbench-staff .a-workbench-side,
      #view-agroup .a-workbench-staff .a-workbench-main #aHelperForm,
      #view-agroup .a-workbench-staff .a-workbench-main .split,
      #view-agroup .a-workbench-staff .a-workbench-main .metric-row,
      #view-agroup .a-workbench-staff .a-staff-worklog-archive .grid {
        grid-template-columns: 1fr;
      }
    }

    .nav a {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border: 1px solid transparent;
      border-radius: 7px;
      background: transparent;
      padding: 12px 10px;
      text-align: left;
      color: #1f2a44;
      text-decoration: none;
    }

    .nav a.active {
      background: #fff;
      border-color: #d7e2f8;
      box-shadow: 0 4px 14px rgba(37, 99, 235, 0.1);
      color: var(--brand);
      font-weight: 700;
    }

    .topbar-command-group form {
      margin: 0;
    }

    /*
     * ABC shared UI primitives
     * ------------------------
     * These classes are opt-in. Role-private templates keep ownership of
     * layout, field order, button placement and business state machines.
     */
    .abc-visually-hidden {
      position: absolute !important;
      width: 1px !important;
      height: 1px !important;
      padding: 0 !important;
      margin: -1px !important;
      overflow: hidden !important;
      clip: rect(0, 0, 0, 0) !important;
      white-space: nowrap !important;
      border: 0 !important;
    }

    .abc-status {
      display: inline-flex;
      align-items: center;
      gap: var(--abc-space-1);
      min-height: 24px;
      padding: 2px var(--abc-space-2);
      border: 1px solid var(--abc-color-border);
      border-radius: 999px;
      background: var(--abc-color-surface-subtle);
      color: var(--abc-color-text);
      font-size: var(--abc-font-size-xs);
      font-weight: var(--abc-font-weight-medium);
      line-height: var(--abc-line-height-tight);
      white-space: nowrap;
    }

    .abc-status--success {
      border-color: #a7dec5;
      background: var(--abc-color-success-subtle);
      color: #0d6845;
    }

    .abc-status--warning {
      border-color: #f1cf96;
      background: var(--abc-color-warning-subtle);
      color: #8b4108;
    }

    .abc-status--danger {
      border-color: #efb4b4;
      background: var(--abc-color-danger-subtle);
      color: #982f2f;
    }

    .abc-status--info {
      border-color: #b7cdfb;
      background: var(--abc-color-info-subtle);
      color: var(--abc-color-info);
    }

    .abc-empty-state {
      display: grid;
      place-items: center;
      gap: var(--abc-space-2);
      min-height: 112px;
      padding: var(--abc-space-6);
      border: 1px dashed var(--abc-color-border-strong);
      border-radius: var(--abc-radius-md);
      background: var(--abc-color-surface-subtle);
      color: var(--abc-color-text-muted);
      text-align: center;
    }

    .abc-empty-state > :first-child {
      color: var(--abc-color-text);
      font-weight: var(--abc-font-weight-strong);
    }

    .abc-field-help,
    .abc-field-error {
      margin: var(--abc-space-1) 0 0;
      font-size: var(--abc-font-size-xs);
      line-height: var(--abc-line-height-normal);
    }

    .abc-field-help {
      color: var(--abc-color-text-muted);
    }

    .abc-field-error {
      color: var(--abc-color-danger);
      font-weight: var(--abc-font-weight-medium);
    }

    :where(input, select, textarea)[aria-invalid="true"] {
      border-color: var(--abc-color-danger);
      box-shadow: 0 0 0 3px rgba(194, 65, 65, 0.14);
    }

    .abc-skeleton {
      position: relative;
      overflow: hidden;
      min-height: 1em;
      border-radius: var(--abc-radius-sm);
      background: #e7ebf2;
      color: transparent !important;
      pointer-events: none;
      user-select: none;
    }

    .abc-skeleton::after {
      content: "";
      position: absolute;
      inset: 0;
      transform: translateX(-100%);
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
      animation: abc-skeleton-shimmer 1.35s ease-in-out infinite;
    }

    @keyframes abc-skeleton-shimmer {
      to { transform: translateX(100%); }
    }

    .abc-scroll-region {
      max-width: 100%;
      overflow: auto;
      overscroll-behavior: contain;
      scrollbar-gutter: stable;
    }

    .abc-loading[aria-busy="true"] {
      cursor: progress;
      opacity: 0.72;
    }

    @media (prefers-reduced-motion: reduce) {
      .abc-skeleton::after {
        animation: none;
      }
    }

    @media (forced-colors: active) {
      .abc-status,
      .abc-empty-state,
      :where(input, select, textarea)[aria-invalid="true"] {
        border-color: CanvasText;
      }

      .abc-status--success,
      .abc-status--warning,
      .abc-status--danger,
      .abc-status--info {
        color: CanvasText;
      }
    }
.notification-toast.is-follow-reminder {
  border: 2px solid #f97316;
  box-shadow: 0 18px 48px rgb(234 88 12 / 28%);
  animation: c-follow-reminder-pulse 1.2s ease-in-out 3;
}

.notification-toast.is-follow-reminder .notification-toast-badge {
  background: #ea580c;
  color: #fff;
}

.notification-center-item.is-follow-reminder {
  border-left: 4px solid #f97316;
  background: #fff7ed;
}

.notification-center-item.is-follow-reminder .notification-center-badge {
  background: #ea580c;
  color: #fff;
}

@keyframes c-follow-reminder-pulse {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-3px) scale(1.015); }
}

@media (prefers-reduced-motion: reduce) {
  .notification-toast.is-follow-reminder { animation: none; }
}
