:root {
      --bg: #f5f7fa;
      --panel: #ffffff;
      --panel-soft: #f4f8f8;
      --ink: #182432;
      --muted: #64748b;
      --line: #dbe3e8;
      --accent: #0d766d;
      --accent-strong: #085f58;
      --warn: #b45309;
      --danger: #b42318;
      --good: #16784b;
      --blue: #2563c9;
      --shadow: 0 8px 24px rgba(24, 36, 50, 0.07);
      --radius: 8px;
    }

    .subcontract-item-stack { display: grid; gap: 14px; }
    .subcontract-group { border: 1px solid var(--line); border-radius: 6px; padding: 12px; display: grid; gap: 10px; }
    .subcontract-group-head, .subcontract-item-title { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
    .subcontract-item-row { border-top: 1px dashed var(--line); padding-top: 12px; display: grid; gap: 10px; }
    .subcontract-item-row:first-of-type { border-top: 0; padding-top: 0; }
    .subcontract-item-fields { display: grid; grid-template-columns: repeat(5, minmax(130px, 1fr)); gap: 10px; }
    .subcontract-item-fields label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; }
    .subcontract-item-fields label span { min-height: 17px; }
    .subcontract-payment-summary { color: #9f1d1d; font-size: 13px; font-weight: 700; }
    .subcontract-payment-list { display: grid; gap: 8px; align-items: center; }
    .subcontract-payment-row { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) auto; gap: 8px; }
    .text-button { border: 0; background: transparent; padding: 3px 0; min-height: auto; }
    @media (max-width: 820px) {
      .subcontract-item-fields, .subcontract-payment-row { grid-template-columns: 1fr; }
      .subcontract-group-head, .subcontract-item-title { align-items: flex-start; flex-direction: column; }
    }

    * { box-sizing: border-box; }

    body {
      margin: 0;
      background: var(--bg);
      color: var(--ink);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
      font-size: 14px;
      line-height: 1.45;
      letter-spacing: 0;
    }

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

    button {
      border: 1px solid var(--line);
      background: var(--panel);
      border-radius: 7px;
      min-height: 36px;
      padding: 0 12px;
      cursor: pointer;
      white-space: nowrap;
    }

    button:hover { border-color: #9aadaa; background: #f8fbfb; }
    button.primary { background: var(--accent); color: #fff; border-color: var(--accent); }
    button.primary:hover { background: var(--accent-strong); }
    button.danger { color: var(--danger); border-color: #efc8c8; }
    button.ghost { background: transparent; }
    button:disabled {
      opacity: 0.58;
      cursor: wait;
    }

    button:focus-visible {
      outline: 3px solid rgba(15, 118, 110, 0.24);
      outline-offset: 2px;
    }

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

    input:focus, select:focus, textarea:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
    }

    .login-gate {
      min-height: 100vh;
      height: auto;
      position: relative;
      overflow-x: hidden;
      overflow-y: auto;
      padding: clamp(22px, 3vw, 48px);
      background: linear-gradient(135deg, #0a0e27, #1a1f4e, #0f1340);
      background-size: 400% 400%;
      color: rgba(255, 255, 255, 0.92);
      animation: splashGradient 15s ease infinite;
      isolation: isolate;
    }

    .login-gate.hidden {
      display: none;
    }

    .hidden {
      display: none !important;
    }

    .login-gate::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(ellipse at center, transparent 0%, transparent 45%, rgba(0, 0, 0, 0.48) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(0, 0, 0, 0.18));
      z-index: 3;
    }

    .splash-particles {
      position: absolute;
      inset: 0;
      z-index: 1;
      opacity: 0.88;
    }

    .splash-orb {
      position: absolute;
      border-radius: 999px;
      filter: blur(80px);
      opacity: 0.3;
      pointer-events: none;
      z-index: 0;
      animation: orbFloat 20s ease-in-out infinite alternate;
    }

    .splash-orb.purple-lg {
      width: 500px;
      height: 500px;
      left: -150px;
      top: -170px;
      background: #6366f1;
    }

    .splash-orb.gold {
      width: 400px;
      height: 400px;
      right: -120px;
      bottom: -120px;
      background: #c9a961;
      animation-delay: -6s;
    }

    .splash-orb.purple-sm {
      width: 300px;
      height: 300px;
      right: 18%;
      top: 34%;
      background: #7c3aed;
      animation-delay: -12s;
    }

    .splash-scanline {
      position: absolute;
      left: 0;
      right: 0;
      top: -2px;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(201, 169, 97, 0.82), transparent);
      box-shadow: 0 0 18px rgba(201, 169, 97, 0.75);
      opacity: 0.75;
      z-index: 2;
      animation: scanDown 8s linear infinite;
    }

    .login-shell {
      position: relative;
      z-index: 4;
      width: min(1180px, 100%);
      min-height: calc(100vh - clamp(22px, 3vw, 48px) * 2);
      margin: 0 auto;
      display: grid;
      grid-template-rows: auto auto auto;
      align-content: space-between;
      row-gap: clamp(22px, 3vh, 38px);
    }

    .login-hero {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: 0;
      padding: clamp(28px, 5vh, 64px) 0 clamp(18px, 3vh, 34px);
    }

    .login-logo {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: 16px;
      color: rgba(255, 255, 255, 0.94);
      font-weight: 800;
      font-size: 28px;
      line-height: 1.25;
      opacity: 0;
      transform: translateY(-18px);
      animation: fadeDown 0.8s ease 0.3s forwards;
      justify-self: start;
    }

    .login-logo-mark {
      width: 72px;
      height: 72px;
      border-radius: 14px;
      display: grid;
      place-items: center;
      color: #d9bd73;
      border: 3px solid #d9bd73;
      background: rgba(255, 255, 255, 0.03);
      font-weight: 900;
      font-size: 34px;
      box-shadow: 0 0 26px rgba(201, 169, 97, 0.22);
      flex: 0 0 auto;
    }

    .login-logo-text {
      display: grid;
      gap: 4px;
    }

    .login-logo-text small {
      color: rgba(255, 255, 255, 0.55);
      font-size: 16px;
      font-weight: 650;
      letter-spacing: 2px;
    }

    .login-title {
      position: relative;
      text-align: center;
      margin: 0 auto;
      width: min(920px, 100%);
    }

    .login-title h1 {
      margin: 0;
      font-size: clamp(38px, 4.45vw, 64px);
      line-height: 1.15;
      font-weight: 800;
      letter-spacing: 8px;
      color: transparent;
      background: linear-gradient(110deg, #fff 0%, #f3e7b3 35%, #c9a961 50%, #fff 65%, #fff 100%);
      background-size: 250% auto;
      -webkit-background-clip: text;
      background-clip: text;
      animation: titleRise 0.9s ease 0.5s both, shimmer 4s linear infinite;
      text-shadow: 0 12px 36px rgba(0, 0, 0, 0.28);
    }

    .login-title p {
      margin: 26px 0 0;
      color: rgba(255, 255, 255, 0.52);
      font-size: 20px;
      line-height: 1.7;
      letter-spacing: 6px;
      opacity: 0;
      transform: translateY(18px);
      animation: fadeUp 0.8s ease 0.8s forwards;
    }

    .login-title p span {
      color: #d9bd73;
      margin: 0 16px;
    }

    .splash-divider {
      width: 60px;
      height: 2px;
      margin: 0 auto 34px;
      background: linear-gradient(90deg, transparent, #d9bd73, transparent);
      opacity: 0;
      animation: dividerIn 0.7s ease 1s forwards;
    }

    .splash-divider.bottom {
      margin: 26px auto 22px;
    }

    .splash-login-card {
      width: min(560px, 100%);
      margin: 20px auto 18px;
      padding: 14px;
      border: 1px solid rgba(201, 169, 97, 0.34);
      border-radius: 14px;
      background: rgba(255, 255, 255, 0.07);
      backdrop-filter: blur(16px);
      box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18), 0 0 26px rgba(201, 169, 97, 0.12);
      /* Login and startup progress are operational UI, not decoration. They
         must be usable on the first frame while the application downloads. */
      opacity: 1;
      transform: none;
    }

    .splash-login-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 10px;
      color: rgba(255, 255, 255, 0.78);
      font-weight: 800;
      letter-spacing: 2px;
      font-size: 13px;
    }

    .splash-login-title span:last-child {
      color: rgba(201, 169, 97, 0.8);
      font-size: 11px;
      font-weight: 650;
      letter-spacing: 1px;
    }

    .platform-board {
      position: relative;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: clamp(12px, 1.3vw, 16px);
      width: min(780px, 100%);
      margin: 0 auto;
      animation: fadeUp 0.8s ease 1.1s both;
    }

    .platform-chip {
      min-height: clamp(88px, 8.8vh, 108px);
      border: 1px solid rgba(255, 255, 255, 0.12);
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.06);
      backdrop-filter: blur(12px);
      padding: 18px;
      display: grid;
      place-items: center;
      gap: 8px;
      color: rgba(255, 255, 255, 0.88);
      opacity: 0;
      transform: translateY(18px);
      animation: cardIn 0.7s ease forwards;
      transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
    }

    .platform-chip:hover {
      transform: translateY(-4px);
      border-color: rgba(201, 169, 97, 0.7);
      box-shadow: 0 14px 34px rgba(201, 169, 97, 0.15);
    }

    .platform-chip:nth-child(1) { animation-delay: 1.3s; }
    .platform-chip:nth-child(2) { animation-delay: 1.4s; }
    .platform-chip:nth-child(3) { animation-delay: 1.5s; }
    .platform-chip:nth-child(4) { animation-delay: 1.6s; }
    .platform-chip:nth-child(5) { animation-delay: 1.7s; }
    .platform-chip:nth-child(6) { animation-delay: 1.8s; }
    .platform-chip:nth-child(7) { animation-delay: 1.9s; }
    .platform-chip:nth-child(8) { animation-delay: 2.0s; }
    .platform-chip:nth-child(9) { animation-delay: 2.1s; }

    .platform-chip .chip-icon {
      font-size: 25px;
      line-height: 1;
    }

    .platform-chip strong {
      font-size: 17px;
      line-height: 1.1;
      color: rgba(255, 255, 255, 0.9);
      letter-spacing: 1px;
    }

    .platform-chip span {
      color: rgba(255, 255, 255, 0.46);
      font-size: 12px;
    }

    .partner-section {
      display: grid;
      place-items: center;
      gap: clamp(10px, 1.4vh, 18px);
      opacity: 0;
      transform: translateY(18px);
      animation: fadeUp 0.8s ease 2.3s forwards;
    }

    .partner-title {
      display: inline-flex;
      align-items: center;
      gap: 18px;
      color: rgba(255, 255, 255, 0.5);
      font-size: 13px;
      font-weight: 750;
      letter-spacing: 4px;
    }

    .partner-title::before,
    .partner-title::after {
      content: "";
      width: 30px;
      height: 1px;
      background: rgba(255, 255, 255, 0.26);
    }

    .partner-logos {
      display: grid;
      grid-template-columns: repeat(9, auto);
      gap: clamp(14px, 1.5vw, 20px);
      justify-content: center;
    }

    .partner-logo {
      display: grid;
      justify-items: center;
      gap: 8px;
      color: rgba(255, 255, 255, 0.44);
      font-size: 11px;
      transition: transform 0.2s ease;
    }

    .partner-logo:hover {
      transform: translateY(-3px) scale(1.08);
    }

    .partner-logo i {
      position: relative;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      color: #fff;
      font-style: normal;
      font-size: 15px;
      font-weight: 900;
      overflow: hidden;
    }

    .partner-logo i::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.32), transparent 52%);
    }

    .partner-logo.douyin i { background: linear-gradient(135deg, #1a1a2e, #000); }
    .partner-logo.xhs i { background: linear-gradient(135deg, #ff4757, #ff6b81); }
    .partner-logo.shipinhao i { background: linear-gradient(135deg, #07c160, #2dc84d); }
    .partner-logo.kuaishou i { background: linear-gradient(135deg, #ff4906, #ff6b35); }
    .partner-logo.meituan i { background: linear-gradient(135deg, #ffc107, #ffb300); }
    .partner-logo.ele i { background: linear-gradient(135deg, #009de6, #00b4f0); }
    .partner-logo.jd i { background: linear-gradient(135deg, #e4393c, #f56c6c); }
    .partner-logo.pdd i { background: linear-gradient(135deg, #e02e24, #f44336); }
    .partner-logo.taobao i { background: linear-gradient(135deg, #ff6a00, #ff8f00); }

    .splash-footer {
      display: grid;
      place-items: center;
      gap: clamp(8px, 1.1vh, 12px);
      padding-bottom: 4px;
      opacity: 0;
      transform: translateY(12px);
      animation: fadeUp 0.8s ease 2.6s forwards;
    }

    .splash-slogan {
      margin: 0;
      color: #c9a961;
      font-size: 14px;
      font-weight: 750;
      letter-spacing: 4px;
    }

    .splash-contact {
      color: rgba(255, 255, 255, 0.2);
      font-size: 11px;
      letter-spacing: 5px;
    }

    .login-form {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 132px;
      gap: 10px;
      align-items: end;
    }

    .splash-login-card .field {
      display: grid;
      gap: 5px;
    }

    .splash-login-card label {
      color: rgba(255, 255, 255, 0.56);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 1px;
    }

    .splash-login-card input {
      min-height: 40px;
      border-color: rgba(255, 255, 255, 0.16);
      background: rgba(8, 12, 34, 0.62);
      color: rgba(255, 255, 255, 0.92);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .splash-login-card input::placeholder {
      color: rgba(255, 255, 255, 0.28);
    }

    .splash-login-card input:focus {
      border-color: rgba(201, 169, 97, 0.78);
      box-shadow: 0 0 0 3px rgba(201, 169, 97, 0.14);
    }

    .login-form button {
      min-height: 40px;
      border: 0;
      background: linear-gradient(135deg, #d9bd73, #9b7b2f);
      color: #111827;
      font-weight: 900;
      letter-spacing: 1px;
      box-shadow: 0 10px 24px rgba(201, 169, 97, 0.22);
    }

    .login-form button:hover {
      filter: brightness(1.08);
      transform: translateY(-1px);
    }

    .login-status {
      grid-column: 1 / -1;
      min-height: 16px;
      color: rgba(255, 255, 255, 0.42);
      font-size: 11px;
    }

    .login-status.error {
      color: #fca5a5;
    }

    .system-load-progress {
      grid-column: 1 / -1;
      display: grid;
      gap: 6px;
      min-height: 31px;
      padding-top: 2px;
      color: rgba(255, 255, 255, 0.54);
      font-size: 11px;
      transition: opacity 180ms ease, transform 180ms ease;
    }

    .system-load-progress.hidden {
      opacity: 0;
      pointer-events: none;
      transform: translateY(-3px);
    }

    .system-load-progress-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .system-load-progress-head strong {
      color: rgba(232, 211, 153, 0.9);
      font-size: 11px;
      font-variant-numeric: tabular-nums;
    }

    .system-load-progress-track {
      position: relative;
      height: 4px;
      overflow: hidden;
      border-radius: 2px;
      background: rgba(255, 255, 255, 0.12);
    }

    .system-load-progress-track span {
      position: absolute;
      inset: 0 auto 0 0;
      width: 0%;
      border-radius: inherit;
      background: linear-gradient(90deg, #c8a353, #f5dc91);
      box-shadow: 0 0 12px rgba(224, 192, 111, 0.52);
      transition: width 180ms ease;
    }

    @keyframes splashGradient {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }

    @keyframes orbFloat {
      from { transform: translate3d(0, 0, 0) scale(1); }
      to { transform: translate3d(44px, 34px, 0) scale(1.08); }
    }

    @keyframes scanDown {
      from { transform: translateY(-2px); }
      to { transform: translateY(100vh); }
    }

    @keyframes fadeDown {
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes fadeUp {
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes titleRise {
      from { opacity: 0; transform: translateY(26px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @keyframes shimmer {
      to { background-position: -250% center; }
    }

    @keyframes dividerIn {
      from { opacity: 0; transform: scaleX(0.2); }
      to { opacity: 1; transform: scaleX(1); }
    }

    @keyframes cardIn {
      to { opacity: 1; transform: translateY(0); }
    }

    .app-shell {
      min-height: 100vh;
      display: grid;
      grid-template-columns: 236px minmax(0, 1fr);
    }

    .app-shell.auth-locked {
      display: none;
    }

    .sidebar {
      position: sticky;
      top: 0;
      height: 100vh;
      background: #182324;
      color: #edf4f3;
      padding: 18px 14px;
      display: flex;
      flex-direction: column;
      gap: 16px;
      overflow-y: auto;
      overflow-x: hidden;
      overscroll-behavior: contain;
    }

    .brand {
      padding: 10px 10px 16px;
      border-bottom: 1px solid rgba(255,255,255,0.12);
    }

    .brand h1 {
      margin: 0;
      font-size: 18px;
      line-height: 1.25;
      font-weight: 750;
    }

    .brand p {
      margin: 8px 0 0;
      color: #afc1bf;
      font-size: 12px;
    }

    .nav {
      display: grid;
      gap: 8px;
      padding-bottom: 18px;
    }

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

    .nav button {
      width: 100%;
      justify-content: flex-start;
      text-align: left;
      border: 0;
      color: #dbe8e6;
      background: transparent;
      padding: 0 10px;
    }

    .nav-primary {
      min-height: 44px;
      font-size: 15px;
      font-weight: 800;
    }

    .nav-primary::before,
    .agency-team-toggle::before {
      content: "›";
      display: inline-block;
      width: 14px;
      margin-right: 4px;
      transition: transform 160ms ease;
    }

    .nav-primary.nav-open::before,
    .agency-team-toggle.nav-open::before {
      transform: rotate(90deg);
    }

    .nav-subnav {
      display: none;
      gap: 4px;
      padding-left: 12px;
      border-left: 1px solid rgba(255,255,255,0.16);
      margin: 2px 0 8px 8px;
    }

    .nav-subnav.open {
      display: grid;
    }

    .agency-team-menu {
      display: none;
      gap: 4px;
      margin: 0 0 8px 12px;
    }

    .agency-team-menu.open {
      display: grid;
    }

    .finance-account-toggle {
      min-height: 34px;
      font-size: 13px;
      font-weight: 750;
      color: #eef8f6 !important;
    }

    .finance-account-toggle::before {
      content: "›";
      display: inline-block;
      width: 14px;
      margin-right: 4px;
      transition: transform 160ms ease;
    }

    .finance-account-toggle.nav-open::before {
      transform: rotate(90deg);
    }

    .finance-account-menu {
      display: none;
      gap: 4px;
      margin: 0 0 6px 12px;
      padding-left: 10px;
      border-left: 1px solid rgba(255,255,255,0.13);
    }

    .finance-account-menu.open {
      display: grid;
    }

    .nav-section-label {
      min-height: 28px;
      display: flex;
      align-items: center;
      padding: 0 12px;
      color: #eef8f6;
      font-size: 14px;
      font-weight: 800;
    }

    .agency-team-toggle {
      min-height: 36px;
      color: #eef8f6;
      font-size: 14px;
      font-weight: 800;
      padding-left: 10px;
    }

    .nav-subnav.hidden,
    .team-only.hidden,
    .permission-hidden {
      display: none;
    }

    .nav-subnav button {
      min-height: 38px;
      color: #b9cbc8;
      font-size: 13px;
      font-weight: 650;
      padding-left: 22px;
    }

    .nav button.active,
    .nav button.parent-active {
      background: rgba(255,255,255,0.12);
      color: #fff;
      border-radius: 6px;
    }

    .nav button.parent-active {
      box-shadow: inset 3px 0 0 var(--accent);
    }

    main {
      min-width: 0;
      padding: 24px 28px 32px;
    }

    .topbar {
      display: flex;
      gap: 20px;
      align-items: flex-start;
      justify-content: space-between;
      margin-bottom: 20px;
      padding: 0 0 18px;
      border-bottom: 1px solid var(--line);
    }

    .topbar-heading {
      min-width: 0;
      display: grid;
      gap: 2px;
    }

    .current-user-greeting {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 3px 9px;
      margin-bottom: 4px;
      border: 1px solid #b8d9d3;
      border-radius: 999px;
      background: #edf8f5;
      color: #11665e;
      font-size: 12px;
      font-weight: 750;
    }

    .topbar h2 {
      margin: 0;
      font-size: 23px;
      line-height: 1.2;
    }

    .topbar p {
      margin: 6px 0 0;
      color: var(--muted);
    }

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

    .actions button {
      min-height: 38px;
      font-weight: 650;
    }

    .toolbar {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 14px;
      box-shadow: var(--shadow);
      margin-bottom: 16px;
    }

    .cloud-panel {
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 14px;
      margin-bottom: 16px;
      box-shadow: var(--shadow);
      display: grid;
      gap: 10px;
    }

    .cloud-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }

    .cloud-status {
      color: var(--muted);
      font-size: 12px;
    }

    .cloud-meta {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .build-version {
      color: var(--muted);
      font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
      font-size: 11px;
      white-space: nowrap;
    }

    .auth-row {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }

    .auth-row.hidden {
      display: none;
    }

    .toolbar-row {
      display: grid;
      grid-template-columns: minmax(250px, 1.35fr) repeat(6, minmax(116px, 1fr));
      gap: 10px;
      align-items: end;
    }

    .task-filter-bar { margin-bottom: 16px; }
    .task-filter-row {
      display: grid;
      grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(140px, 1fr)) auto;
      align-items: end;
      gap: 10px;
    }
    .task-filter-row .field { display: grid; gap: 6px; }
    .task-filter-row .field > span { color: var(--muted); font-size: 12px; font-weight: 650; }
    .task-filter-row button { min-height: 40px; }

    .field {
      display: grid;
      gap: 5px;
    }

    .field label {
      font-size: 12px;
      color: var(--muted);
      font-weight: 650;
    }

    .field.hidden {
      display: none;
    }

    .field-note {
      grid-column: 1 / -1;
      min-height: 24px;
      display: flex;
      align-items: center;
      padding: 2px 10px;
      margin-top: -6px;
      border-left: 3px solid #d6e2e8;
      border-radius: 6px;
      background: #f8fafc;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }

    .field-note.hidden {
      display: none;
    }

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

    .check-group label {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      color: var(--ink);
      font-size: 13px;
      font-weight: 500;
      white-space: nowrap;
    }

    .check-group input {
      width: auto;
      min-height: auto;
      margin: 0;
    }

    .module-panel {
      grid-column: 1 / -1;
      display: grid;
      gap: 12px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #f9fbfb;
      padding: 12px;
    }

    .module-panel.hidden { display: none; }

    .module-title {
      margin: 0;
      font-size: 14px;
      font-weight: 750;
    }

    .shoot-assignment-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(180px, 1fr));
      gap: 8px;
    }

.historical-shoot-assignment-stack {
      grid-template-columns: minmax(0, 1fr);
    }

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

    .shoot-session-item {
      display: grid;
      grid-template-columns: 74px minmax(150px, 0.32fr) minmax(0, 1fr);
      gap: 10px;
      align-items: start;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: linear-gradient(180deg, #fff 0%, #f8fbfd 100%);
    }

    .shoot-session-item strong {
      font-size: 13px;
      white-space: nowrap;
      min-height: 32px;
      display: inline-flex;
      align-items: center;
      color: var(--ink);
    }

    .shoot-session-item .check-group {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .shoot-session-item .check-group label {
      margin: 0;
      border-radius: 999px;
      background: #fff;
    }

    .shoot-session-item .check-group label.disabled {
      opacity: 0.55;
      cursor: not-allowed;
      background: #f1f5f9;
      color: #64748b;
    }

    .shoot-session-date {
      display: grid;
      gap: 4px;
      margin: 0;
      font-size: 12px;
      font-weight: 750;
      color: var(--muted);
    }

    .shoot-session-date input {
      min-height: 32px;
      font-size: 12px;
      font-weight: 750;
    }

    .schedule-conflict {
      padding: 1px 6px;
      border-radius: 999px;
      background: #fee2e2;
      color: #991b1b;
      font-size: 11px;
      font-weight: 800;
    }

    .shoot-assignment-item {
      display: grid;
      grid-template-columns: 72px minmax(120px, 1fr) minmax(150px, 1fr);
      gap: 8px;
      align-items: center;
      padding: 8px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: #fff;
    }

    .shoot-assignment-item strong {
      font-size: 13px;
      white-space: nowrap;
    }

    .historical-shoot-assignment-item {
      grid-template-columns: 104px repeat(4, minmax(140px, 1fr));
      align-items: end;
    }

    .historical-edit-assignment-item {
      grid-template-columns: 104px minmax(160px, 1fr) minmax(160px, 1fr);
      align-items: end;
    }

    .historical-edit-assignment-item > label {
      display: grid;
      gap: 3px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .historical-shoot-assignment-item > label {
      display: grid;
      gap: 3px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .historical-shoot-assignment-item .hint {
      grid-column: 2 / -1;
    }

    .historical-shoot-date-field {
      display: grid;
      gap: 3px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .historical-task-date-field {
      display: grid;
      gap: 4px;
      min-width: 132px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .general-progress-date-stack {
      display: grid;
      gap: 7px;
      min-width: 142px;
    }

    .general-plan-date-field {
      display: inline-grid;
      width: fit-content;
      grid-template-columns: 104px minmax(145px, 190px);
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .task-shoot-arrangement {
      display: block;
      margin-bottom: 5px;
      color: var(--accent-deep);
      font-size: 12px;
    }

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

    .edit-lines {
      display: grid;
      gap: 8px;
    }

    .edit-line {
      display: grid;
      grid-template-columns: 88px repeat(2, minmax(0, 1fr));
      gap: 8px;
      align-items: end;
    }

    .edit-line.third-party {
      grid-template-columns: 88px repeat(2, minmax(0, 1fr)) minmax(0, 1fr);
    }

    .edit-line.final-payment-line {
      grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    }

    .total-package-payment-line,
    .technical-operator-payment-line {
      display: grid;
      grid-template-columns: minmax(145px, 0.78fr) minmax(150px, 0.8fr) minmax(260px, 1.35fr) minmax(210px, 1fr) auto;
      gap: 12px;
      align-items: start;
      padding: 12px;
      border: 1px solid #d7e3e1;
      border-radius: 6px;
      background: #f8fbfa;
    }

    .technical-operator-payment-line {
      grid-template-columns: minmax(210px, 1.15fr) minmax(145px, 0.72fr) minmax(150px, 0.76fr) minmax(250px, 1.25fr) minmax(190px, 0.9fr) auto;
    }

    .total-package-payment-line .field,
    .technical-operator-payment-line .field {
      min-width: 0;
    }

    .total-package-payment-line input[type="file"],
    .technical-operator-payment-line input[type="file"] {
      width: 100%;
      min-width: 0;
      padding: 6px 8px;
      background: #fff;
      color: var(--ink);
      font-size: 12px;
    }

    .total-package-payment-line input[type="file"]::file-selector-button,
    .technical-operator-payment-line input[type="file"]::file-selector-button {
      margin-right: 8px;
      padding: 5px 9px;
      border: 1px solid #b9cfca;
      border-radius: 4px;
      background: #eef5f2;
      color: var(--accent-deep);
      font: inherit;
      font-weight: 700;
      cursor: pointer;
    }

    .total-package-payment-line .hint,
    .technical-operator-payment-line .hint {
      min-height: 17px;
      margin-top: 1px;
      font-size: 11px;
    }

    .total-package-payment-remove,
    .technical-operator-payment-remove {
      min-width: 72px;
      min-height: 38px;
      align-self: end;
      margin-bottom: 0;
    }

    .edit-name {
      min-height: 38px;
      display: flex;
      align-items: center;
      font-weight: 700;
      color: var(--ink);
    }

    .segmented {
      display: inline-flex;
      border: 1px solid var(--line);
      background: #fff;
      border-radius: 7px;
      overflow: hidden;
      min-height: 36px;
      width: 100%;
    }

    .segmented button {
      border: 0;
      border-radius: 0;
      min-height: 34px;
      min-width: 0;
      flex: 1 1 0;
      padding: 0 8px;
      font-size: 12px;
      white-space: nowrap;
      background: transparent;
    }

    .segmented button.active {
      background: var(--ink);
      color: #fff;
    }

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

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

    .location-select-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
    }

    .person-card, .summary-card, .form-panel, .table-panel {
      background: var(--panel);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }

    /* Shared work-surface treatment for the data-heavy operating pages. */
    .section-head h3,
    .section-head .panel-title {
      margin: 0;
      color: #1b2c2c;
      font-size: 16px;
      line-height: 1.35;
      font-weight: 800;
    }

    .section-head > .hint {
      max-width: 680px;
      line-height: 1.55;
    }

    .toolbar .field > label,
    .form-panel .field > label {
      letter-spacing: 0;
    }

    .toolbar select,
    .toolbar input {
      background-color: #fcfefe;
    }

    .toolbar select:hover,
    .toolbar input:hover,
    .form-panel input:not([readonly]):hover,
    .form-panel select:hover,
    .form-panel textarea:not([readonly]):hover {
      border-color: #a8c9c3;
    }

    .person-card {
      overflow: hidden;
      box-shadow: 0 4px 13px rgba(23, 37, 38, 0.045);
    }

    .person-card > h3 {
      display: flex;
      align-items: center;
      min-height: 48px;
      margin: 0;
      padding: 0 16px;
      border-bottom: 1px solid #dce7e5;
      background: #f7fbfa;
      color: #1e3b39;
      font-size: 16px;
      font-weight: 850;
    }

    .person-card > .metric-grid {
      margin: 0 12px;
      padding: 12px 0;
    }

    .person-card > .metric-grid + .metric-grid {
      border-top: 1px solid #e6eeec;
    }

    .person-card > .metric-grid:last-child {
      padding-bottom: 14px;
    }

    .summary-card {
      min-height: 96px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      box-shadow: 0 3px 10px rgba(23, 37, 38, 0.035);
    }

    .person-card {
      padding: 18px;
      display: grid;
      gap: 13px;
    }

    .person-card h3, .panel-title {
      margin: 0;
      font-size: 16px;
      line-height: 1.25;
    }

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

    .metric-grid.status-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .metric-grid.package-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .metric-grid.package-finance-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .metric {
      background: var(--panel-soft);
      border: 1px solid #d6e4e1;
      border-radius: 7px;
      padding: 9px;
      min-height: 68px;
      display: grid;
      align-content: start;
      gap: 4px;
    }

    .metric.clickable {
      cursor: pointer;
      transition: transform 120ms ease, border-color 120ms ease;
    }

    .metric.clickable:hover {
      transform: translateY(-1px);
      border-color: var(--accent);
    }

    .metric.clickable:focus-visible {
      outline: 3px solid rgba(13, 148, 136, 0.28);
      outline-offset: 2px;
    }

    .metric span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.2;
      white-space: nowrap;
    }

    .metric strong {
      font-size: 16px;
      line-height: 1.2;
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }

    .status-grid .metric {
      min-height: 64px;
      padding: 8px;
    }

    .status-grid .metric span {
      font-size: 11px;
    }

    .status-grid .metric strong {
      font-size: 17px;
    }

    .metric.money strong { color: var(--accent-strong); }
    .metric.warn strong { color: var(--warn); }
    .metric.good strong { color: var(--good); }
    .metric.blue strong { color: var(--blue); }
    .metric.risk strong,
    .summary-card.risk strong,
    .risk-text {
      color: #b91c1c;
      font-weight: 900;
    }

    .historical-legacy-tag {
      margin-top: 4px;
      color: #b91c1c;
      font-size: 12px;
      font-weight: 900;
    }

    .section {
      margin-top: 22px;
    }

    .section-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 12px;
    }

    .section-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    .summary-card {
      padding: 16px;
      border-top: 3px solid #d7e8e4;
    }

    .summary-card span {
      display: block;
      color: var(--muted);
      font-size: 12px;
      margin-bottom: 8px;
    }

    .summary-card strong {
      font-size: 22px;
      line-height: 1.2;
    }

    .summary-card.money strong { color: var(--accent-strong); }
    .summary-card.warn strong { color: var(--warn); }
    .summary-card.good strong { color: var(--good); }
    .summary-card.blue strong { color: var(--blue); }
    .summary-card.clickable-card {
      cursor: pointer;
      transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
    }

    .summary-card.clickable-card:hover {
      transform: translateY(-1px);
      border-color: rgba(15, 118, 110, .42);
      box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
    }

    .finance-drilldown-banner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 14px 16px;
      margin-bottom: 12px;
      border: 1px solid #b9d9d4;
      background: #f1f8f6;
    }

    .finance-drilldown-banner strong,
    .finance-drilldown-banner span {
      display: block;
    }

    .finance-drilldown-banner span {
      margin-top: 4px;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.5;
    }

    .form-panel {
      padding: 16px;
      margin-bottom: 16px;
      display: none;
    }

    .form-panel.open { display: block; }

    .form-panel > .section-head {
      padding-bottom: 12px;
      border-bottom: 1px solid var(--line);
    }

    .workbench-form {
      display: grid;
      gap: 16px;
    }

    .workbench-form .form-grid {
      gap: 14px;
    }

    .workbench-form .field > label {
      color: #415456;
      font-weight: 750;
    }

    .workbench-form .field.full {
      padding-top: 14px;
      border-top: 1px solid #dce7e5;
    }

    .workbench-form .edit-lines {
      gap: 10px;
    }

    .workbench-form .edit-line,
    .workbench-form .hq-delivery-line {
      padding: 10px;
      border: 1px solid #dbe6e4;
      border-radius: 7px;
      background: #fbfdfd;
    }

    .workbench-form .hq-delivery-line .check-group {
      background: #f3f9f7;
    }

    .workbench-form .form-footer {
      position: sticky;
      z-index: 6;
      bottom: 0;
      margin: 0 -4px -4px;
      padding: 12px 4px 4px;
      border-top: 1px solid #dce7e5;
      background: var(--panel);
    }

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

    .form-grid .wide { grid-column: span 2; }
    .form-grid .full { grid-column: 1 / -1; }

    .form-footer {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
      margin-top: 14px;
      flex-wrap: wrap;
    }

    .hint {
      color: var(--muted);
      font-size: 12px;
    }

    .role-save-status {
      display: none;
      margin: 10px 0;
      padding: 9px 11px;
      border: 1px solid #b6e3d7;
      border-radius: 7px;
      background: #ecfdf5;
      color: #0f766e;
      font-size: 13px;
      font-weight: 750;
    }

    .role-save-status:not(:empty) {
      display: block;
    }

    .role-save-status.pending {
      border-color: #fde68a;
      background: #fffbeb;
      color: #92400e;
    }

    .role-save-status.error {
      border-color: #fecaca;
      background: #fef2f2;
      color: #b91c1c;
    }

    .table-panel {
      overflow: hidden;
      border-color: #d3dfdd;
      box-shadow: 0 4px 15px rgba(23, 37, 38, 0.045);
    }

    .table-wrap {
      overflow: auto;
      max-height: min(72vh, 760px);
      scrollbar-gutter: stable;
      background: #fff;
      scrollbar-color: #8ca8a4 #edf3f2;
      scrollbar-width: thin;
    }

    .table-wrap::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }

    .table-wrap::-webkit-scrollbar-track {
      background: #edf3f2;
    }

    .table-wrap::-webkit-scrollbar-thumb {
      border: 2px solid #edf3f2;
      border-radius: 999px;
      background: #8ca8a4;
    }

    .table-wrap::-webkit-scrollbar-thumb:hover {
      background: #5f827d;
    }

    .table-wrap table thead th {
      position: sticky;
      top: 0;
      z-index: 2;
      border-bottom-color: #cbdad7;
      background: #f6faf9;
      color: #3e5653;
      font-size: 12px;
      font-weight: 800;
      box-shadow: 0 1px 0 #dce7e5;
    }

    .table-wrap tbody tr:nth-child(even) td {
      background: #fbfdfd;
    }

    .table-wrap tbody tr:hover td {
      background: #f0f8f6;
    }

    .merchant-first-table th:first-child,
    .merchant-first-table td:first-child {
      position: sticky;
      left: 0;
      z-index: 1;
      box-shadow: 1px 0 0 #d7e3e1, 6px 0 10px rgba(23, 37, 38, 0.035);
    }

    .merchant-first-table thead th:first-child {
      z-index: 3;
      background: #f6faf9;
    }

    .merchant-first-table tbody tr:nth-child(even) td:first-child {
      background: #fbfdfd;
    }

    .merchant-first-table tbody tr:hover td:first-child {
      background: #f0f8f6;
    }

    .table-wrap td {
      line-height: 1.45;
    }

    .floating-table-scrollbar {
      position: fixed;
      z-index: 90;
      bottom: max(10px, env(safe-area-inset-bottom));
      height: 24px;
      padding: 5px;
      box-sizing: border-box;
      border: 1px solid #cbd5e1;
      border-radius: 5px;
      background: rgba(255, 255, 255, 0.96);
      box-shadow: 0 3px 12px rgba(15, 23, 42, 0.16);
      overscroll-behavior: contain;
      cursor: grab;
      touch-action: none;
      user-select: none;
    }

    .floating-table-scrollbar.hidden {
      display: none;
    }

    .floating-table-scrollbar.dragging {
      cursor: grabbing;
    }

    .floating-table-scrollbar:focus-visible {
      outline: 3px solid rgba(14, 116, 144, 0.38);
      outline-offset: 2px;
    }

    .floating-table-scrollbar-track {
      position: relative;
      width: 100%;
      height: 100%;
      border-radius: 3px;
      background: #dbe4ea;
    }

    .floating-table-scrollbar-thumb {
      position: absolute;
      inset: 0 auto 0 0;
      min-width: 48px;
      border-radius: 3px;
      background: #0f766e;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.22);
      transition: background-color 120ms ease;
    }

    .floating-table-scrollbar:hover .floating-table-scrollbar-thumb,
    .floating-table-scrollbar.dragging .floating-table-scrollbar-thumb {
      background: #115e59;
    }

    .section-title-with-action {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .drilldown-back {
      min-height: 30px;
      padding: 0 10px;
      color: var(--accent-strong);
      border-color: rgba(15, 118, 110, 0.34);
      font-weight: 700;
    }

    [data-drilldown-column].drilldown-flash {
      animation: drilldownColumnFlash 1.95s ease-in-out 1;
    }

    @keyframes drilldownColumnFlash {
      0%, 100% { background-color: inherit; box-shadow: inset 0 0 0 0 transparent; }
      12%, 34%, 56% { background-color: #fee2e2; box-shadow: inset 0 0 0 2px #dc2626; color: #991b1b; }
      23%, 45%, 67% { background-color: inherit; box-shadow: inset 0 0 0 0 transparent; }
    }

    .table-load-more {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      padding: 12px;
      border-top: 1px solid var(--line);
      background: #f8fafc;
      color: var(--muted);
      font-size: 12px;
    }

    .table-load-more button {
      min-height: 30px;
      border-radius: 999px;
      padding: 0 14px;
      background: #fff;
      color: var(--ink);
      font-weight: 650;
    }

    .table-pagination {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 12px 14px;
      border-top: 1px solid var(--line);
      background: #f8fafc;
      color: var(--muted);
      font-size: 12px;
    }

    .table-pagination-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      flex: 0 0 auto;
    }

    .table-pagination button {
      min-height: 32px;
      border-radius: 6px;
      padding: 0 12px;
      background: #fff;
      color: var(--ink);
      font-weight: 650;
    }

    .table-pagination button:disabled {
      cursor: not-allowed;
      opacity: .45;
    }

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

    th, td {
      padding: 10px;
      border-bottom: 1px solid var(--line);
      text-align: left;
      vertical-align: top;
      white-space: nowrap;
    }

    th {
      background: #f1f5f7;
      color: #44515a;
      font-size: 12px;
      font-weight: 750;
      position: sticky;
      top: 0;
      z-index: 1;
    }

    tbody tr.row-settled td { background: #ecfdf3; }
    tbody tr.row-unassigned td { background: #fee2e2; color: #7f1d1d; }
    tbody tr.row-not-started td { background: #fff1f2; }
    tbody tr.row-working td { background: #fffbeb; }
    tbody tr.row-pending td { background: #f3f4f6; color: #4b5563; }
    tbody tr.row-risk td { background: #fecaca; color: #7f1d1d; }
    tbody tr.row-payment-unconfirmed td { background: #fee2e2; color: #7f1d1d; }
    tbody tr.row-shared-pending td { background: #fff7ed; }
    tbody tr.row-settled:hover td { background: #dcfce7; }
    tbody tr.row-unassigned:hover td { background: #fecaca; }
    tbody tr.row-not-started:hover td { background: #ffe4e6; }
    tbody tr.row-working:hover td { background: #fef3c7; }
    tbody tr.row-pending:hover td { background: #e5e7eb; }
    tbody tr.row-risk:hover td { background: #fca5a5; }
    tbody tr.row-payment-unconfirmed:hover td { background: #fecaca; }
    tbody tr.row-shared-pending:hover td { background: #ffedd5; }
    tr:hover td { background: #fbfcfd; }

    .merchant-first-table {
      border-collapse: separate;
      border-spacing: 0;
    }

    .merchant-first-table th:first-child,
    .merchant-first-table td:first-child {
      position: sticky;
      left: 0;
      min-width: 156px;
      max-width: 260px;
      background: #fff;
      box-shadow: 1px 0 0 var(--line), 8px 0 12px -12px rgba(15, 23, 42, 0.6);
    }

    .merchant-first-table th:first-child {
      z-index: 4;
      background: #f1f5f7;
    }

    .merchant-first-table td:first-child {
      z-index: 2;
      white-space: normal;
    }

    .merchant-first-table tr.row-settled td:first-child { background: #ecfdf3; }
    .merchant-first-table tr.row-unassigned td:first-child,
    .merchant-first-table tr.row-payment-unconfirmed td:first-child { background: #fee2e2; }
    .merchant-first-table tr.row-not-started td:first-child { background: #fff1f2; }
    .merchant-first-table tr.row-working td:first-child { background: #fffbeb; }
    .merchant-first-table tr.row-pending td:first-child { background: #f3f4f6; }
    .merchant-first-table tr.row-risk td:first-child { background: #fecaca; }
    .merchant-first-table tr.row-shared-pending td:first-child { background: #fff7ed; }
    .merchant-first-table tr:hover td:first-child { background: #fbfcfd; }
    .merchant-first-table tr.row-settled:hover td:first-child { background: #dcfce7; }
    .merchant-first-table tr.row-unassigned:hover td:first-child,
    .merchant-first-table tr.row-payment-unconfirmed:hover td:first-child { background: #fecaca; }
    .merchant-first-table tr.row-not-started:hover td:first-child { background: #ffe4e6; }
    .merchant-first-table tr.row-working:hover td:first-child { background: #fef3c7; }
    .merchant-first-table tr.row-pending:hover td:first-child { background: #e5e7eb; }
    .merchant-first-table tr.row-risk:hover td:first-child { background: #fca5a5; }
    .merchant-first-table tr.row-shared-pending:hover td:first-child { background: #ffedd5; }

    .execution-arrangement-table {
      min-width: 3320px;
    }

    .execution-project-identity,
    .execution-status-cell {
      display: grid;
      gap: 7px;
    }

    .execution-project-identity > strong {
      color: var(--ink);
      font-size: 13px;
      line-height: 1.4;
    }

    .execution-project-meta {
      display: grid;
      gap: 5px;
    }

    .execution-type-chip,
    .task-type-chip,
    .operation-role-chip {
      display: inline-flex;
      align-items: center;
      width: fit-content;
      min-height: 22px;
      padding: 0 7px;
      border: 1px solid #c9e1db;
      border-radius: 5px;
      background: #f0f9f6;
      color: #0f766e;
      font-size: 11px;
      font-weight: 800;
      line-height: 1.2;
    }

    .execution-next-step,
    .execution-status-cell small,
    .task-next-step,
    .task-executor-cell small {
      color: #64748b;
      font-size: 11px;
      font-weight: 650;
      line-height: 1.45;
      white-space: normal;
    }

    .execution-tail-payment-reminder {
      display: block;
      padding: 5px 7px;
      border-left: 3px solid #e99a3a;
      background: #fff8eb;
      color: #92400e;
      font-size: 11px;
      font-weight: 750;
      line-height: 1.45;
      white-space: normal;
    }

    .execution-status-cell {
      min-width: 152px;
      white-space: normal;
    }

    .table-filters {
      display: flex;
      flex-wrap: wrap;
      align-items: end;
      gap: 10px;
      justify-content: flex-end;
      margin: 0 0 12px;
      padding: 10px 12px;
      border: 1px solid #d7e3e1;
      border-radius: 7px;
      background: #fbfdfd;
    }

    .reconciliation-status-filter {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 700;
    }

    .reconciliation-status-filter select {
      min-width: 136px;
      min-height: 34px;
      background: #fff;
    }

    .reconciliation-search-filter input {
      width: 190px;
      min-height: 34px;
      background: #fff;
    }

    tr.finance-reconciliation-row { cursor: pointer; }
    tr.finance-reconciliation-row:focus-visible td { outline: 2px solid var(--accent); outline-offset: -2px; }
    .income-reconciliation-control {
      display: grid;
      gap: 3px;
      min-width: 148px;
      color: var(--text);
      cursor: pointer;
      font-size: 12px;
      line-height: 1.35;
    }

    .income-reconciliation-control > span {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-weight: 700;
      white-space: nowrap;
    }

    .income-reconciliation-control input {
      width: 15px;
      height: 15px;
      min-height: 15px;
      margin: 0;
      accent-color: var(--accent);
    }

    .income-reconciliation-control small,
    .income-reconciliation-status {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
    }

    .income-reconciliation-status.confirmed { color: var(--good); font-weight: 700; }
    .income-reconciliation-status.pending { color: var(--warn); font-weight: 700; }
    .finance-payment-focus {
      animation: financePaymentFocus 1.95s ease-in-out 1;
    }

    @keyframes financePaymentFocus {
      0%, 100% { box-shadow: 0 0 0 0 transparent; background-color: transparent; }
      12%, 34%, 56% { box-shadow: 0 0 0 2px #dc2626; background-color: #fee2e2; }
      23%, 45%, 67% { box-shadow: 0 0 0 0 transparent; background-color: transparent; }
    }

    .status {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 0 8px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 650;
      background: #edf2f7;
    }

    .status.done { background: #dcfce7; color: #166534; }
    .status.unassigned { background: #dc2626; color: #fff; }
    .status.working { background: #fef3c7; color: #92400e; }
    .status.pending { background: #e5e7eb; color: #374151; }
    .status.not-started { background: #ffe4e6; color: #be123c; }
    .status.no { background: #fee2e2; color: #991b1b; }

    .payment-cell {
      display: grid;
      gap: 6px;
      min-width: 150px;
    }

    .proof-link {
      color: var(--blue);
      font-size: 12px;
      font-weight: 650;
      text-decoration: none;
      width: fit-content;
      min-height: 0;
      border: 0;
      background: transparent;
      padding: 0;
    }

    .proof-link:hover { text-decoration: underline; }

    .confirm-note {
      color: var(--danger);
      font-size: 12px;
      font-weight: 650;
    }

    .chart-panel {
      display: grid;
      gap: 10px;
      min-height: 220px;
      align-items: end;
      grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
    }

    .chart-bar {
      display: grid;
      gap: 7px;
      align-items: end;
      min-height: 180px;
    }

    .chart-bar-stack {
      display: grid;
      align-items: end;
      gap: 4px;
      height: 128px;
    }

    .chart-bar-fill {
      min-height: 4px;
      border-radius: 5px 5px 0 0;
      background: var(--accent);
    }

    .chart-bar-fill.money { background: var(--blue); }
    .chart-bar-fill.commission { background: var(--good); }

    .chart-bar small {
      color: var(--muted);
      font-size: 11px;
      text-align: center;
      white-space: nowrap;
    }

    .chart-bar strong {
      font-size: 12px;
      text-align: center;
      white-space: nowrap;
    }

    .row-actions {
      display: flex;
      gap: 6px;
    }

    .row-actions button {
      min-height: 30px;
      padding: 0 8px;
      font-size: 12px;
    }

    .reimburse-grid {
      display: grid;
      gap: 8px;
    }

    .reimburse-line {
      display: grid;
      grid-template-columns: minmax(110px, 0.8fr) minmax(92px, 0.55fr) minmax(110px, 0.65fr) minmax(130px, 1fr) auto;
      gap: 8px;
      align-items: end;
    }

    .participant-line {
      display: grid;
      grid-template-columns: minmax(110px, 1fr) minmax(110px, 0.8fr) minmax(130px, 1fr);
      gap: 8px;
      align-items: end;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #f8fbfd;
    }

    .participant-line .mini-check {
      min-height: 38px;
      margin: 0;
    }

    .hq-delivery-line {
      display: grid;
      grid-template-columns: 150px minmax(110px, 0.7fr) minmax(90px, 0.5fr) minmax(130px, 1fr);
      gap: 8px;
      align-items: end;
    }

    .hq-delivery-line .mini-value {
      min-height: 38px;
      padding: 0 10px;
      border: 1px solid #dce7e5;
      border-radius: 6px;
      background: #f1f7f6;
      color: #325957;
      font-weight: 750;
    }

    .hq-delivery-line.contract-line {
      grid-template-columns: 150px minmax(110px, 0.7fr) minmax(90px, 0.5fr);
    }

    .delivery-items-grid {
      display: grid;
      gap: 10px;
    }

    .package-option-card {
      display: grid;
      gap: 8px;
      padding: 14px;
      border: 1px solid #d6e0e8;
      border-radius: 10px;
      background: linear-gradient(180deg, #ffffff, #f8fbfd);
      box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
      cursor: pointer;
      transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    }

    .package-option-card:hover,
    .package-option-card:focus-within,
    .package-option-card.selected {
      border-color: #b89145;
      box-shadow: 0 12px 28px rgba(184, 145, 69, 0.13);
      transform: translateY(-1px);
    }

    .package-option-head {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }

    .package-option-head input {
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
    }

    .package-option-head strong {
      flex: 1 1 auto;
      min-width: 0;
      font-size: 14px;
      color: #102033;
      overflow-wrap: anywhere;
    }

    .package-option-head span {
      flex: 0 0 auto;
      padding: 4px 9px;
      border-radius: 999px;
      background: #fff7e6;
      color: #8a5a12;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }

    .package-option-card p,
    .package-option-card small {
      margin: 0;
      color: var(--muted);
      line-height: 1.65;
      white-space: normal;
      overflow-wrap: anywhere;
    }

    .package-option-card small {
      display: block;
      padding-top: 8px;
      border-top: 1px dashed #d8e1e9;
      font-size: 12px;
    }

    .package-option-card textarea {
      width: 100%;
      resize: vertical;
      min-height: 76px;
      cursor: text;
    }

    .package-delivery-spec {
      margin: -2px 0 0 27px;
      color: #0f766e;
      font-size: 12px;
      font-weight: 750;
    }

    .package-quantity-row {
      display: grid;
      grid-template-columns: minmax(150px, 0.7fr) auto;
      gap: 10px;
      align-items: end;
      padding: 10px;
      border: 1px solid #e1e9f0;
      border-radius: 8px;
      background: #f8fafc;
    }

    .package-quantity-row .mini-value {
      min-height: 38px;
      justify-content: flex-end;
      color: #8a5a12;
    }

    .proportional-quantity-row {
      grid-template-columns: repeat(2, minmax(150px, 1fr)) auto;
    }

    .other-package-card {
      border-style: dashed;
      background: linear-gradient(180deg, #fffdf7, #fbfcfd);
    }

    .legacy-delivery-box {
      display: grid;
      gap: 8px;
      padding: 12px;
      border: 1px dashed #cfd8df;
      border-radius: 10px;
      background: #fbfcfd;
    }

    .product-catalog-grid {
      display: grid;
      /* Two wide columns keep full package names readable without opening a card. */
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: repeat(var(--product-catalog-rows, 1), max-content);
      grid-auto-flow: column;
      gap: 14px;
      align-items: start;
    }

    .product-catalog-card {
      display: grid;
      gap: 12px;
      padding: 14px;
      border: 1px solid #cfdedb;
      border-top: 3px solid #b8d8d2;
      border-radius: 10px;
      background: #fff;
      box-shadow: 0 6px 18px rgba(23, 37, 38, 0.06);
      align-self: start;
    }

    .product-catalog-card.dragging {
      opacity: 0.45;
    }

    .product-catalog-card.drag-over {
      border-color: #0f9c97;
      box-shadow: 0 0 0 2px rgba(15, 156, 151, 0.2), 0 10px 24px rgba(15, 23, 42, 0.05);
    }

    .product-card-top {
      display: grid;
      grid-template-columns: 34px 96px minmax(0, 1fr) auto;
      gap: 10px;
      align-items: end;
      min-width: 0;
      padding-bottom: 12px;
      border-bottom: 1px solid #dce7e5;
    }

    .product-drag-handle {
      width: 34px;
      min-width: 34px;
      height: 38px;
      padding: 0;
      border: 1px solid #d7e1ea;
      border-radius: 6px;
      background: #f8fafc;
      color: #607180;
      cursor: grab;
      touch-action: none;
      font-size: 18px;
      font-weight: 850;
      line-height: 1;
    }

    .product-drag-handle:active {
      cursor: grabbing;
    }

    .product-drag-handle:hover {
      border-color: #0f9c97;
      background: #edfafa;
      color: #087a76;
    }

    .product-remove-btn {
      min-width: 72px;
      white-space: nowrap;
    }

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

    .product-expand-btn {
      min-width: 56px;
      border-color: #9ec9c2;
      background: #edf9f6;
      color: #0f766e;
      font-weight: 800;
    }

    .product-expand-btn:hover {
      border-color: #0f9c97;
      background: #dff4ef;
    }

    .product-catalog-details {
      display: grid;
      gap: 12px;
      padding-top: 2px;
    }

    .product-pricing-panel {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      align-items: end;
      min-width: 0;
      padding: 12px;
      border: 1px solid #e2e8f0;
      border-radius: 10px;
      background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);
    }

    .product-pricing-panel .field,
    .product-card-top .field {
      min-width: 0;
    }

    .product-sort-order input {
      text-align: center;
      font-variant-numeric: tabular-nums;
    }

    .product-delivery-spec-panel {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      align-items: end;
      padding: 10px;
      border: 1px solid #cbd5e1;
      border-radius: 6px;
      background: #f8fafc;
    }

    .product-delivery-spec-hint {
      grid-column: 1 / -1;
      color: #475569;
      font-size: 12px;
      line-height: 1.5;
    }

    .product-mode-badge {
      grid-column: 1 / -1;
      justify-self: start;
      align-self: end;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      min-height: 38px;
      padding: 0 12px;
      border-radius: 999px;
      background: #ecfdf5;
      color: #047857;
      font-size: 12px;
      font-weight: 850;
      white-space: nowrap;
    }

    .product-catalog-card.fixed-priced .product-mode-badge {
      background: #eff6ff;
      color: #1d4ed8;
    }

    .product-price-hint {
      grid-column: 1 / -1;
      padding: 8px 10px;
      border-radius: 8px;
      background: #f8fafc;
      color: var(--muted);
      font-size: 12px;
      font-weight: 750;
      line-height: 1.5;
      overflow-wrap: anywhere;
    }

    .product-catalog-card.quantity-priced .product-price-hint {
      background: #fff7ed;
      color: #9a3412;
    }

    .product-catalog-card textarea {
      resize: vertical;
      min-height: 70px;
    }

    .product-card-top .product-name-input {
      min-height: 52px;
      height: 52px;
      padding-top: 8px;
      padding-bottom: 8px;
      line-height: 1.45;
      overflow: hidden;
      resize: none;
    }

    .product-description-panel {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      padding: 12px;
      border: 1px solid #dce7e5;
      border-radius: 8px;
      background: #fbfdfd;
    }

    .product-description-panel .field:last-child:nth-child(odd) {
      grid-column: 1 / -1;
    }

    .product-business-visibility {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: auto auto 1fr;
      align-items: center;
      gap: 8px;
      margin: 0;
      padding: 9px 10px;
      border: 1px solid #f1c4c0;
      border-radius: 6px;
      background: #fff8f7;
      color: #9f2d25;
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
    }

    .product-business-visibility input {
      width: 16px;
      height: 16px;
      margin: 0;
      accent-color: #c23b31;
    }

    .product-business-visibility small {
      color: #8b6b68;
      font-size: 12px;
      font-weight: 600;
      line-height: 1.4;
    }

    .product-specifications-panel {
      display: grid;
      gap: 10px;
      padding: 12px;
      border: 1px solid #b9d8d2;
      border-radius: 8px;
      background: #f4faf8;
    }

    .product-specifications-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .product-specifications-head strong,
    .product-specifications-head span {
      display: block;
    }

    .product-specifications-head span,
    .product-specification-hint,
    .product-cost-panel summary span {
      margin-top: 3px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
    }

    .product-specifications-list {
      display: grid;
      gap: 10px;
    }

    .product-specification-card {
      display: grid;
      gap: 10px;
      padding: 11px;
      border: 1px solid #d3e3df;
      border-radius: 7px;
      background: #fff;
    }

    .product-specification-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(130px, 0.42fr) auto;
      align-items: end;
      gap: 10px;
    }

    .product-specification-counts {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(150px, 1.15fr);
      align-items: end;
      gap: 10px;
    }

    .product-specification-hint {
      display: flex;
      min-height: 38px;
      align-items: center;
      line-height: 1.45;
    }

    .product-cost-panel {
      display: grid;
      gap: 10px;
      padding: 9px 10px;
      border: 1px dashed #b8cfca;
      border-radius: 7px;
      background: #f9fcfb;
    }

    .product-cost-panel summary {
      display: flex;
      align-items: center;
      justify-content: space-between;
      cursor: pointer;
      color: #334155;
      font-size: 13px;
      font-weight: 800;
    }

    .product-cost-list {
      display: grid;
      gap: 8px;
    }

    .product-cost-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(110px, 0.4fr) auto;
      align-items: end;
      gap: 8px;
    }

    .product-cost-row select {
      min-width: 0;
    }

    .product-cost-empty {
      padding: 4px 0;
    }

    .package-specification-select {
      margin-top: 2px;
    }

    .package-description-list {
      display: grid;
      gap: 5px;
      margin-top: 2px;
      color: #475569;
      font-size: 12px;
      line-height: 1.55;
    }

    .package-description-list p {
      margin: 0;
    }

    .package-description-list strong {
      color: #334155;
    }

    .package-description-list .package-highlight,
    .package-description-list .package-highlight strong {
      color: #dc2626;
    }

    @media (max-width: 940px) {
      .product-catalog-grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        grid-auto-flow: row;
      }
    }

    @media (max-width: 720px) {
      .product-catalog-grid {
        grid-template-columns: 1fr;
      }

      .product-description-panel,
      .product-specification-head,
      .product-specification-counts,
      .product-cost-row {
        grid-template-columns: 1fr;
      }

      .product-description-panel .field:last-child:nth-child(odd) {
        grid-column: auto;
      }

      .product-specification-hint {
        min-height: auto;
      }
    }

    .product-compat-fields {
      border-top: 1px dashed #dde5ec;
      padding-top: 8px;
    }

    .product-compat-fields summary {
      cursor: pointer;
      color: var(--muted);
      font-size: 12px;
      font-weight: 750;
    }

    .reimburse-line .edit-name {
      font-size: 13px;
    }

    .mini-value {
      min-height: 38px;
      display: flex;
      align-items: center;
      color: var(--muted);
      font-weight: 700;
      white-space: nowrap;
    }

    .mini-check {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin: 2px 6px 2px 0;
      font-size: 12px;
      font-weight: 750;
      white-space: nowrap;
      min-height: 32px;
      padding: 5px 9px;
      border: 1px solid #cfd8df;
      border-radius: 7px;
      background: #fff;
      color: #334155;
    }

    .mini-check input {
      appearance: none;
      min-height: auto;
      width: 15px;
      height: 15px;
      margin: 0;
      border: 1.5px solid #94a3b8;
      border-radius: 4px;
      background: #fff;
      display: inline-grid;
      place-items: center;
      flex: 0 0 auto;
    }

    .mini-check input:checked {
      border-color: var(--good);
      background: var(--good);
    }

    .mini-check input:checked::after {
      content: "";
      width: 7px;
      height: 4px;
      border-left: 2px solid #fff;
      border-bottom: 2px solid #fff;
      transform: rotate(-45deg);
      margin-top: -1px;
    }

    .mini-check:has(input:checked) {
      border-color: #86efac;
      background: #ecfdf3;
      color: #166534;
    }

    [data-task-row] textarea {
      min-width: 180px;
      min-height: 56px;
    }

    .split-detail {
      display: grid;
      gap: 4px;
      color: #475569;
      font-size: 12px;
      line-height: 1.35;
      white-space: nowrap;
    }

    .finance-ledger-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      margin: 16px 0;
      align-items: start;
    }

    .finance-board-section {
      margin: 22px 0;
    }

    .finance-board-section:first-child {
      margin-top: 0;
    }

    .finance-board-section-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 12px;
      padding: 0 2px 10px;
      border-bottom: 1px solid #dbe7e4;
    }

    .finance-board-section-head h4,
    .finance-stage-title h4 {
      margin: 0;
      color: var(--ink);
      font-size: 15px;
      font-weight: 800;
    }

    .finance-board-section-head span {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.5;
    }

    .finance-board-section .section {
      margin-top: 12px;
    }

    .finance-account-guide {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      margin: 16px 0 22px;
    }

    .finance-account-guide > div {
      display: grid;
      gap: 4px;
      padding: 12px 14px;
      border: 1px solid #cfe0dc;
      background: #f4faf8;
    }

    .finance-account-guide strong {
      color: var(--ink);
      font-size: 13px;
    }

    .finance-account-guide span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .finance-stage-title {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin: 26px 0 0;
      padding: 14px 0 12px;
      border-top: 1px solid #dbe7e4;
    }

    .finance-stage-title > span {
      display: grid;
      width: 24px;
      height: 24px;
      place-items: center;
      flex: 0 0 auto;
      color: #fff;
      background: var(--accent-strong);
      font-size: 12px;
      font-weight: 800;
    }

    .finance-stage-title p {
      margin: 4px 0 0;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.5;
    }

    .history-correction-panel {
      margin-top: 16px;
    }

    .history-correction-list {
      display: grid;
      gap: 8px;
      margin-top: 12px;
    }

    .history-correction-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 10px 12px;
      border: 1px solid var(--line);
      background: #f8fafc;
    }

    .history-correction-item > div {
      min-width: 0;
      display: grid;
      gap: 3px;
    }

    .history-correction-item strong { color: var(--ink); }

    .history-correction-item span {
      color: #64748b;
      font-size: 12px;
    }

    .finance-ledger-form {
      margin: 0;
      min-width: 0;
      display: block;
    }

    .finance-ledger-form h4 {
      margin: 0;
      color: var(--ink);
      font-size: 15px;
      font-weight: 700;
    }

    .finance-allocation-editor {
      display: grid;
      gap: 10px;
      padding: 12px;
      border: 1px solid #cfe0dc;
      background: #f8fcfa;
    }

    .finance-allocation-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .finance-allocation-toolbar label,
    .finance-allocation-row label {
      display: grid;
      gap: 5px;
      margin: 0;
      color: var(--muted);
      font-size: 12px;
    }

    .finance-allocation-toolbar select { min-width: 96px; }

    .finance-allocation-rows { display: grid; gap: 8px; }

    .finance-allocation-row {
      display: grid;
      grid-template-columns: 30px minmax(150px, 1.4fr) minmax(112px, .8fr) minmax(116px, .8fr);
      align-items: end;
      gap: 10px;
      padding: 10px;
      border: 1px solid var(--line);
      background: #fff;
    }

    .finance-allocation-order {
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      color: #166534;
      background: #dcfce7;
      font-size: 13px;
      font-weight: 800;
    }

    .finance-allocation-row label:last-of-type { position: relative; }
    .finance-allocation-row label:last-of-type span { position: absolute; right: 10px; bottom: 9px; color: var(--muted); }
    .finance-allocation-row label:last-of-type input { padding-right: 26px; }

    .finance-allocation-amount { display: grid; gap: 5px; min-height: 55px; }
    .finance-allocation-amount span { color: var(--muted); font-size: 12px; }
    .finance-allocation-amount strong { color: var(--ink); font-size: 14px; }

    .finance-rule-list {
      display: grid;
      gap: 12px;
      padding: 4px 0;
    }

    .finance-rule-list > div {
      display: grid;
      grid-template-columns: 112px minmax(0, 1fr);
      gap: 10px;
      padding: 10px 0;
      border-bottom: 1px solid var(--line);
      font-size: 13px;
      line-height: 1.6;
    }

    .finance-rule-list > div:last-child { border-bottom: 0; }
    .finance-rule-list strong { color: var(--ink); }
    .finance-rule-list span { color: var(--muted); }

    .task-table {
      min-width: 1880px;
    }

    .task-table th,
    .task-table td {
      vertical-align: middle;
    }

    .task-date-cell { min-width: 104px; }
    .task-merchant-cell { min-width: 156px; white-space: normal; font-weight: 750; }
    .task-source-cell { min-width: 94px; }
    .task-people-cell { min-width: 220px; white-space: normal; font-weight: 750; }
    .task-lead-cell,
    .task-executor-cell { min-width: 126px; white-space: normal; font-weight: 750; }
    .task-type-cell { min-width: 76px; }
    .task-content-cell { min-width: 260px; white-space: normal; line-height: 1.45; }
    .task-status-cell { min-width: 112px; }
    .task-progress-status-cell { min-width: 126px; white-space: normal; }
    .task-check-cell { min-width: 210px; white-space: normal; }
    .task-quantity-cell { min-width: 150px; white-space: normal; }
    .task-complete-cell { min-width: 128px; }
    .task-finish-cell { min-width: 230px; white-space: normal; }
    .task-drive-cell { min-width: 300px; white-space: normal; }
    .task-travel-cell { min-width: 260px; }
    .task-note-cell { min-width: 190px; }
    .task-action-cell { min-width: 92px; }

    .task-action-stack {
      display: grid;
      gap: 6px;
      justify-items: start;
    }

    .task-action-stack button {
      min-height: 30px;
      padding: 0 10px;
      font-size: 12px;
      font-weight: 750;
    }

    .task-identity {
      display: grid;
      gap: 7px;
      min-width: 0;
    }

    .task-identity > strong {
      color: var(--ink);
      line-height: 1.4;
    }

    .task-identity > div {
      display: grid;
      gap: 5px;
      justify-items: start;
    }

    .task-executor-cell {
      display: grid;
      gap: 5px;
      align-content: center;
    }

    .task-table .task-progress-status-cell {
      background-image: linear-gradient(90deg, rgba(240, 249, 246, 0.88), transparent);
    }

    .task-inline-actions {
      display: flex;
      gap: 6px;
      margin-top: 7px;
    }

    .task-inline-actions button {
      min-height: 30px;
      padding: 0 9px;
      font-size: 12px;
      font-weight: 750;
    }

    .task-progress-quantities {
      display: grid;
      gap: 8px;
    }

    .task-progress-quantity {
      display: flex;
      align-items: center;
      gap: 4px;
      min-height: 32px;
      color: #334155;
      font-size: 12px;
      font-weight: 750;
      white-space: nowrap;
    }

    .task-progress-quantity input {
      width: 58px;
      min-width: 58px;
      min-height: 30px;
      padding: 3px 6px;
      text-align: center;
    }

    .delivery-save-notice {
      margin: 0 0 14px;
      padding: 11px 13px;
      border: 1px solid #86efac;
      border-radius: 7px;
      background: #ecfdf3;
      color: #166534;
      font-weight: 750;
      box-shadow: 0 1px 2px rgba(22, 101, 52, 0.08);
    }

    .general-plan-panel {
      min-width: 560px;
      display: grid;
      gap: 10px;
    }

    #generalPackagePlanPanel .general-plan-panel {
      min-width: 0;
    }

    .general-plan-block {
      display: grid;
      gap: 8px;
      padding: 10px;
      border: 1px solid #d8e2ea;
      border-radius: 8px;
      background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    }

    .general-plan-block h4 {
      margin: 0;
      font-size: 13px;
      font-weight: 850;
      color: var(--ink);
    }

    .general-plan-title-row,
    .general-plan-row-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .general-plan-row-head {
      justify-content: flex-start;
    }

    .general-plan-row-head strong {
      min-width: 44px;
      color: #334155;
      font-size: 12px;
    }

    .general-plan-row-head input {
      max-width: 150px;
      min-height: 32px;
      font-size: 12px;
    }

    @media (max-width: 680px) {
      .general-plan-date-field {
        width: 100%;
        grid-template-columns: 1fr;
      }
    }

    .general-plan-checks,
    .general-plan-fee-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .general-plan-shoot-row {
      display: grid;
      gap: 8px;
      padding: 9px;
      border: 1px dashed #d5dee7;
      border-radius: 8px;
      background: #fff;
    }

    .general-plan-fee-item {
      display: grid;
      grid-template-columns: minmax(90px, auto) 86px;
      align-items: center;
      gap: 6px;
      padding: 6px 8px;
      border: 1px solid #dbe4ec;
      border-radius: 8px;
      background: #fdfefe;
      font-size: 12px;
      font-weight: 750;
      color: #334155;
    }

    .general-plan-fee-item span {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      white-space: nowrap;
    }

    .general-plan-fee-item input[type="checkbox"] {
      width: auto;
      min-height: auto;
      margin: 0;
    }

    .general-plan-fee-item input[type="number"] {
      min-height: 30px;
      font-size: 12px;
      padding: 4px 6px;
    }

    .general-plan-fee-item.disabled {
      opacity: 0.58;
      background: #f1f5f9;
      color: #64748b;
      cursor: not-allowed;
    }

    .general-plan-fee-item.disabled input[type="number"] {
      opacity: 0.78;
      background: #f8fafc;
    }

    .general-plan-edit-grid {
      display: grid;
      gap: 7px;
    }

    .general-plan-edit-row {
      display: grid;
      grid-template-columns: 112px 118px 118px 82px 82px 82px auto;
      gap: 7px;
      align-items: end;
      padding: 8px;
      border: 1px solid #dbe4ec;
      border-radius: 8px;
      background: #fff;
    }

    .general-plan-edit-row strong {
      font-size: 12px;
      color: #334155;
      align-self: center;
    }

    .general-plan-edit-row label {
      display: grid;
      gap: 3px;
      font-size: 11px;
      color: var(--muted);
      font-weight: 750;
    }

    .general-plan-edit-row input,
    .general-plan-edit-row select {
      min-height: 30px;
      font-size: 12px;
      padding: 4px 6px;
    }

    .general-plan-edit-row em {
      font-style: normal;
      font-size: 12px;
      font-weight: 850;
      color: #8a5a12;
      white-space: nowrap;
    }

    .general-plan-edit-progress {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .general-plan-edit-progress span {
      padding: 4px 7px;
      border: 1px solid #dbe4ec;
      border-radius: 6px;
      background: #f8fafc;
      color: #475569;
      font-size: 11px;
      font-weight: 750;
    }

    .general-plan-edit-progress span.over {
      border-color: #fecaca;
      background: #fef2f2;
      color: #b91c1c;
    }

    .general-plan-edit-remove {
      min-height: 30px;
      padding: 0 8px;
      font-size: 12px;
    }

    .general-person-settlement-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 9px;
    }

    .general-person-settlement-item {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 112px 112px;
      gap: 7px;
      align-items: end;
      padding: 9px;
      border: 1px solid #dbe4ec;
      border-radius: 7px;
      background: #fff;
    }

    .general-person-settlement-item strong,
    .general-person-settlement-item span {
      display: block;
    }

    .general-person-settlement-item strong {
      font-size: 12px;
      color: #334155;
    }

    .general-person-settlement-item span {
      margin-top: 4px;
      color: var(--muted);
      font-size: 11px;
    }

    .general-person-settlement-item label {
      display: grid;
      gap: 3px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 750;
    }

    .general-person-settlement-item input {
      min-height: 30px;
      padding: 4px 6px;
      font-size: 12px;
    }

    .task-plan-summary {
      display: grid;
      gap: 8px;
      min-width: 280px;
    }

    .task-plan-summary > strong {
      font-size: 13px;
      color: var(--ink);
    }

    .task-plan-brief {
      display: grid;
      gap: 6px;
    }

    .task-plan-brief span {
      display: block;
      padding: 6px 8px;
      border: 1px solid #dbeafe;
      border-radius: 8px;
      background: #f8fbff;
      color: #334155;
      font-size: 12px;
      font-weight: 750;
      line-height: 1.35;
    }

    .task-status-select {
      min-width: 96px;
      width: 96px;
      padding-right: 28px;
      font-weight: 750;
    }

    .task-complete-inline {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      white-space: nowrap;
    }

    .task-complete-inline input {
      width: 66px;
      min-width: 66px;
      text-align: center;
      font-weight: 750;
    }

    .task-travel-inline {
      display: grid;
      grid-template-columns: 78px 88px;
      gap: 6px;
      align-items: center;
    }

    .task-travel-inline input,
    .task-travel-inline select {
      min-width: 0;
      font-size: 12px;
      font-weight: 750;
    }

    .task-checks {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }

    .task-session-stack {
      display: grid;
      gap: 8px;
      min-width: 210px;
    }

    .task-session-line {
      display: grid;
      grid-template-columns: 56px minmax(0, 1fr);
      align-items: center;
      gap: 8px;
      padding: 7px 8px;
      border: 1px solid #dbe3e8;
      border-radius: 7px;
      background: rgba(255, 255, 255, 0.82);
    }

    .task-session-line.single {
      grid-template-columns: minmax(0, 1fr);
    }

    .session-date-chip,
    .date-chip {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 3px 8px;
      border-radius: 999px;
      background: #eef2ff;
      color: #3730a3;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }

    .session-display-line.compact {
      grid-template-columns: 48px minmax(0, 1fr);
    }

    .schedule-panel .table-wrap {
      max-height: 68vh;
    }

    .schedule-table {
      min-width: 1280px;
      border-collapse: separate;
      border-spacing: 0;
    }

    .schedule-table th {
      position: sticky;
      top: 0;
      z-index: 2;
      background: #f8fafc;
    }

    .schedule-table th:first-child,
    .schedule-table td:first-child {
      position: sticky;
      left: 0;
      z-index: 3;
      background: #fff;
      box-shadow: 1px 0 0 var(--line);
    }

    .schedule-person {
      min-width: 96px;
      font-weight: 850;
      color: var(--ink);
    }

    .schedule-table td {
      min-width: 150px;
      vertical-align: top;
      background: #fff;
    }

    .schedule-free {
      color: #94a3b8;
      font-size: 12px;
      font-weight: 750;
      text-align: center;
    }

    .schedule-busy {
      background: #fff7ed;
    }

    .schedule-card {
      display: grid;
      gap: 3px;
      padding: 8px;
      border-radius: 8px;
      border: 1px solid #fed7aa;
      background: #fffbeb;
      color: #92400e;
      box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
      min-width: 132px;
    }

    .schedule-card + .schedule-card {
      margin-top: 6px;
    }

    .schedule-card strong {
      font-size: 12px;
      line-height: 1.25;
      color: #78350f;
      white-space: normal;
    }

    .schedule-card span,
    .schedule-card small {
      font-size: 11px;
      font-weight: 750;
    }

    .schedule-card.done {
      border-color: #bbf7d0;
      background: #ecfdf3;
      color: #166534;
    }

    .schedule-card.working {
      border-color: #fde68a;
      background: #fefce8;
      color: #854d0e;
    }

    .schedule-card.pending {
      border-color: #fecaca;
      background: #fef2f2;
      color: #991b1b;
    }

    .task-session-line strong {
      font-size: 12px;
      color: var(--ink);
      min-width: 0;
      white-space: nowrap;
    }

    .task-session-actions {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: nowrap;
      min-width: 0;
    }

    .task-session-line input[type="number"] {
      width: 74px;
      min-width: 74px;
      text-align: center;
      font-weight: 750;
    }

    .operation-desk-table {
      min-width: 1240px;
    }

    .operation-desk-merchant {
      display: grid;
      gap: 7px;
      min-width: 150px;
    }

    .operation-desk-merchant strong {
      color: var(--ink);
      line-height: 1.4;
    }

    .operation-desk-detail {
      min-width: 260px;
      max-width: 420px;
      white-space: normal;
      color: #475569;
      line-height: 1.5;
    }

    .operation-next-step {
      display: inline-flex;
      align-items: center;
      min-height: 26px;
      padding: 0 8px;
      border: 1px solid #bfdbfe;
      border-radius: 5px;
      background: #eff6ff;
      color: #1d4ed8;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }

    .operation-next-step.risk {
      border-color: #fecaca;
      background: #fef2f2;
      color: #b91c1c;
    }

    .task-session-line select {
      width: 86px;
      min-width: 86px;
      font-size: 12px;
      font-weight: 750;
    }

    .session-display {
      display: grid;
      gap: 6px;
      min-width: 160px;
    }

    .session-display.single {
      min-width: 0;
    }

    .session-display-line {
      display: grid;
      grid-template-columns: 52px minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      padding: 6px 8px;
      border: 1px solid #dbe3e8;
      border-radius: 7px;
      background: rgba(255, 255, 255, 0.74);
    }

    .session-display-line.compact {
      grid-template-columns: 48px minmax(0, 1fr);
    }

    .session-display-line strong {
      font-size: 12px;
      color: #334155;
      white-space: nowrap;
    }

    .person-chip-row {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      min-width: 0;
    }

    .person-chip {
      display: inline-flex;
      align-items: center;
      min-height: 24px;
      padding: 3px 8px;
      border-radius: 999px;
      border: 1px solid #cbd5e1;
      background: #f8fafc;
      color: #0f172a;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }

    .split-detail strong {
      color: var(--ink);
    }

    .empty {
      background: #fff;
      border: 1px dashed #b9c4ca;
      border-radius: var(--radius);
      padding: 28px;
      color: var(--muted);
      text-align: center;
    }

    .view { display: none; }
    .view.active { display: block; }

    .toast {
      position: fixed;
      right: 18px;
      bottom: 18px;
      background: #172026;
      color: #fff;
      padding: 11px 14px;
      border-radius: 7px;
      box-shadow: var(--shadow);
      opacity: 0;
      transform: translateY(8px);
      transition: opacity 160ms ease, transform 160ms ease;
      pointer-events: none;
      z-index: 20;
    }

    .toast.show {
      opacity: 1;
      transform: translateY(0);
    }

    .collaboration-sync-banner {
      position: sticky;
      top: 10px;
      z-index: 15;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin: 0 0 14px;
      padding: 10px 12px;
      border: 1px solid #e2a33b;
      border-radius: var(--radius);
      background: #fff8e8;
      color: #7d4a00;
      box-shadow: 0 3px 12px rgba(84, 56, 16, 0.1);
      font-size: 13px;
      font-weight: 700;
    }

    .collaboration-sync-banner.hidden {
      display: none;
    }

    .collaboration-sync-banner button {
      flex: 0 0 auto;
      min-height: 32px;
      padding: 0 12px;
      border-color: #bd7900;
      background: #fff;
      color: #7d4a00;
    }

    .edit-lock-status {
      margin-left: auto;
      padding: 5px 8px;
      border: 1px solid #e2a33b;
      border-radius: 4px;
      background: #fff8e8;
      color: #7d4a00;
      font-size: 12px;
      font-weight: 700;
    }

    .edit-lock-status.hidden {
      display: none;
    }

    .saving-overlay {
      position: fixed;
      inset: 0;
      z-index: 60;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(15, 23, 42, 0.18);
      backdrop-filter: blur(2px);
    }

    .saving-overlay.hidden {
      display: none;
    }

    .saving-card {
      min-width: 220px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      padding: 18px 22px;
      border: 1px solid rgba(255, 255, 255, 0.62);
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.96);
      color: #0f172a;
      box-shadow: 0 18px 46px rgba(15, 23, 42, 0.18);
      font-weight: 850;
    }

    .saving-spinner {
      width: 20px;
      height: 20px;
      border-radius: 999px;
      border: 3px solid #d9e2e7;
      border-top-color: var(--accent);
      animation: spin 780ms linear infinite;
      flex: 0 0 auto;
    }

    @keyframes spin {
      to { transform: rotate(360deg); }
    }

    .proof-modal {
      position: fixed;
      inset: 0;
      z-index: 50;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(15, 23, 42, 0.62);
    }

    .proof-modal.hidden { display: none; }

    .proof-modal-panel {
      width: min(920px, 100%);
      max-height: 88vh;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      background: #fff;
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
    }

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

    .proof-modal-head strong { font-size: 16px; }

    .proof-modal-body {
      min-height: 240px;
      overflow: auto;
      padding: 16px;
      background: #f8fafc;
    }

    .proof-modal-body img {
      display: block;
      max-width: 100%;
      height: auto;
      margin: 0 auto;
      border-radius: 6px;
      background: #fff;
    }

    .store-code-sop-modal-panel {
      width: min(760px, 100%);
      max-height: 88vh;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      background: #fff;
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .store-code-sop-body {
      overflow: auto;
      padding: 20px;
      background: #f8fafc;
    }

    .store-code-sop-intro {
      display: grid;
      gap: 10px;
      padding-bottom: 16px;
      border-bottom: 1px solid var(--line);
    }

    .store-code-sop-intro p,
    .store-code-sop-list p {
      margin: 0;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.65;
    }

    .store-code-sop-list {
      display: grid;
      gap: 14px;
      margin: 18px 0;
      padding-left: 22px;
    }

    .store-code-sop-list li { padding-left: 4px; }

    .store-code-sop-list strong {
      display: block;
      margin-bottom: 5px;
      color: var(--ink);
      font-size: 14px;
    }

    .store-code-sop-actions {
      display: flex;
      justify-content: flex-end;
      padding-top: 16px;
      border-top: 1px solid var(--line);
    }

    .store-code-sop-actions a {
      min-height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
    }

    .password-modal-panel {
      width: min(460px, 100%);
      display: grid;
      grid-template-rows: auto 1fr;
      background: #fff;
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .shared-settlement-modal-panel {
      width: min(1080px, 100%);
      max-height: 88vh;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      background: #fff;
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .shared-settlement-modal-panel .proof-modal-head {
      align-items: flex-start;
    }

    .shared-settlement-modal-panel .proof-modal-head .hint {
      margin: 4px 0 0;
    }

    .shared-settlement-modal-body {
      min-height: 220px;
      overflow: auto;
      padding: 16px;
      background: #f8fafc;
    }

    .settlement-counterparty-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      gap: 10px;
      margin-bottom: 16px;
    }

    .settlement-counterparty-card {
      display: grid;
      gap: 5px;
      padding: 12px;
      border: 1px solid #fed7aa;
      border-radius: 7px;
      background: #fffaf5;
    }

    .settlement-counterparty-card span {
      color: #64748b;
      font-size: 12px;
    }

    .settlement-counterparty-card strong {
      color: #c2410c;
      font-size: 18px;
      font-variant-numeric: tabular-nums;
    }

    .shared-settlement-table {
      min-width: 820px;
    }

    .shared-settlement-table th,
    .shared-settlement-table td {
      vertical-align: middle;
    }

    .shared-settlement-table td:nth-child(2) {
      min-width: 200px;
      white-space: normal;
    }

    @media (max-width: 720px) {
      .shared-settlement-modal-panel {
        max-height: calc(100vh - 24px);
      }

      .shared-settlement-modal-body {
        padding: 12px;
      }
    }

    .password-form {
      padding: 16px;
      display: grid;
      gap: 12px;
    }

    .password-actions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
      padding-top: 4px;
    }

    .import-input {
      display: none;
    }

    @media (max-width: 1100px) {
      .login-gate { height: auto; min-height: 100vh; overflow-y: auto; }
      .login-shell { min-height: calc(100vh - 44px); gap: 24px; }
      .login-logo-mark { width: 58px; height: 58px; font-size: 28px; }
      .login-logo { font-size: 24px; }
      .login-logo-text small { font-size: 14px; }
      .login-title h1 { font-size: 50px; }
      .platform-board { width: min(720px, 100%); }
      .partner-logos { grid-template-columns: repeat(5, auto); row-gap: 14px; }
      .app-shell { grid-template-columns: 1fr; }
      .sidebar {
        position: static;
        height: auto;
      }
      .nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .toolbar-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .task-filter-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .auth-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .grid-3 { grid-template-columns: 1fr; }
      .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .location-select-grid { grid-template-columns: 1fr; }
      .module-grid { grid-template-columns: 1fr; }
      .general-plan-edit-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .general-plan-edit-row strong,
      .general-plan-edit-row em { grid-column: 1 / -1; }
      .general-person-settlement-grid { grid-template-columns: 1fr; }
      .product-pricing-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .product-delivery-spec-panel { grid-template-columns: 1fr; }
      .historical-shoot-assignment-item { grid-template-columns: 104px repeat(2, minmax(140px, 1fr)); }
      .historical-shoot-assignment-item .hint { grid-column: 2 / -1; }
      .historical-edit-assignment-item { grid-template-columns: 104px repeat(2, minmax(140px, 1fr)); }
      .finance-allocation-row { grid-template-columns: 30px minmax(140px, 1fr) minmax(110px, .8fr); }
      .finance-allocation-amount { grid-column: 2 / -1; min-height: auto; }
      .proportional-quantity-row { grid-template-columns: minmax(150px, 1fr) auto; }
      .product-mode-badge {
        justify-content: flex-start;
        width: fit-content;
      }
      .total-package-payment-line,
      .technical-operator-payment-line {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .total-package-payment-remove,
      .technical-operator-payment-remove {
        width: fit-content;
        margin-bottom: 0;
      }
    }

    @media (max-height: 900px) and (min-width: 681px) {
      .login-gate { padding-top: 28px; padding-bottom: 28px; }
      .login-shell { row-gap: 18px; }
      .login-logo-mark { width: 58px; height: 58px; font-size: 28px; }
      .login-logo { font-size: 24px; }
      .login-logo-text small { font-size: 13px; }
      .login-hero { padding: 34px 0 18px; }
      .splash-divider { margin-bottom: 20px; }
      .splash-divider.bottom { margin: 14px auto 16px; }
      .login-title h1 { font-size: clamp(36px, 4vw, 54px); }
      .login-title p { margin-top: 14px; font-size: 17px; }
      .splash-login-card { margin: 14px auto 12px; }
      .platform-chip { min-height: 82px; padding: 12px; }
      .platform-chip .chip-icon { font-size: 21px; }
      .platform-chip strong { font-size: 15px; }
      .partner-logo i { width: 38px; height: 38px; font-size: 13px; border-radius: 10px; }
      .partner-logo { gap: 5px; }
      .splash-slogan { font-size: 12px; }
    }

    @media (max-height: 760px) and (min-width: 681px) {
      .login-gate { overflow-y: auto; }
      .login-shell { align-content: start; }
      .login-hero { padding-top: 24px; }
      .platform-board { width: min(700px, 100%); }
      .platform-chip { min-height: 74px; }
      .partner-section { margin-top: 6px; }
    }

    @media (max-width: 680px) {
      .workbench-form .form-footer {
        position: static;
        margin: 0;
        padding: 12px 0 0;
      }

      .workbench-form .field.full {
        padding-top: 12px;
      }

      .historical-shoot-assignment-item { grid-template-columns: 1fr; }
      .historical-shoot-assignment-item .hint { grid-column: auto; }
      .historical-edit-assignment-item { grid-template-columns: 1fr; }
      .finance-allocation-toolbar { align-items: flex-start; flex-direction: column; }
      .finance-allocation-row { grid-template-columns: 30px minmax(0, 1fr); align-items: start; }
      .finance-allocation-row label,
      .finance-allocation-amount { grid-column: 2; }
      .login-gate { padding: 14px; }
      .login-shell { min-height: calc(100vh - 28px); gap: 18px; }
      .login-logo {
        gap: 10px;
        font-size: 20px;
        align-items: center;
      }
      .login-logo-mark {
        width: 50px;
        height: 50px;
        font-size: 24px;
        border-radius: 12px;
      }
      .login-logo-text small {
        font-size: 12px;
        letter-spacing: 1px;
      }
      .login-hero { padding: 10px 0; }
      .login-title h1 {
        font-size: 34px;
        letter-spacing: 3px;
      }
      .login-title p {
        font-size: 14px;
        letter-spacing: 2px;
        margin-top: 14px;
      }
      .splash-divider { margin-bottom: 18px; }
      .splash-divider.bottom { margin: 16px auto 16px; }
      .splash-login-card {
        margin: 14px auto 12px;
        padding: 12px;
      }
      .login-form { grid-template-columns: 1fr; }
      .platform-board {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 9px;
      }
      .platform-chip {
        min-height: 78px;
        padding: 10px 6px;
      }
      .platform-chip .chip-icon { font-size: 20px; }
      .platform-chip strong { font-size: 13px; }
      .partner-section { gap: 12px; }
      .partner-title { font-size: 12px; }
      .partner-logos {
        grid-template-columns: repeat(3, auto);
        gap: 12px 16px;
      }
      .partner-logo i {
        width: 38px;
        height: 38px;
        font-size: 13px;
        border-radius: 10px;
      }
      .splash-slogan {
        font-size: 12px;
        letter-spacing: 2px;
      }
      .splash-contact { letter-spacing: 2px; }
      .floating-table-scrollbar {
        bottom: max(6px, env(safe-area-inset-bottom));
      }
      .table-pagination { flex-wrap: wrap; }
      .table-pagination-actions { width: 100%; justify-content: flex-end; }
      main { padding: 16px; }
      .topbar { display: grid; }
      .actions { justify-content: flex-start; }
      .section-head { align-items: flex-start; flex-wrap: wrap; }
      .section-actions { width: 100%; justify-content: space-between; }
      .toolbar-row, .task-filter-row, .grid-4, .form-grid { grid-template-columns: 1fr; }
      .finance-ledger-grid { grid-template-columns: 1fr; }
      .finance-account-guide { grid-template-columns: 1fr; }
      .history-correction-item { align-items: flex-start; flex-direction: column; }
      .finance-rule-list > div { grid-template-columns: 1fr; gap: 3px; }
      .auth-row { grid-template-columns: 1fr; }
      .form-grid .wide { grid-column: auto; }
      .sidebar { padding: 12px 10px; }
      .sidebar .brand { margin-bottom: 8px; }
      .nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px;
      }
      .nav button {
        min-height: 34px;
        padding: 7px 8px;
        font-size: 12px;
      }
      .metric-grid,
      .metric-grid.package-grid,
      .metric-grid.package-finance-grid { grid-template-columns: 1fr; }
      .person-card .metric-grid:not(.status-grid):not(.package-grid):not(.package-finance-grid) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .summary-card strong { font-size: 18px; }
      .edit-line,
      .edit-line.third-party,
      .total-package-payment-line,
      .technical-operator-payment-line,
      .reimburse-line,
      .hq-delivery-line,
      .hq-delivery-line.contract-line,
      .shoot-assignment-grid,
      .shoot-assignment-item,
      .product-card-top,
      .product-pricing-panel {
        grid-template-columns: 1fr;
      }
      .product-remove-btn,
      .product-mode-badge,
      .product-card-actions {
        width: 100%;
      }
      .product-card-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .package-quantity-row,
      .proportional-quantity-row { grid-template-columns: 1fr; }
      .edit-name { min-height: auto; }
      .general-person-settlement-item { grid-template-columns: 1fr; }
    }

    /* Operating workbench visual system: shared by headquarters, delivery,
       team, and finance screens without changing their business behaviour. */
    body {
      background: var(--bg);
      color: var(--ink);
      font-size: 14px;
    }

    button {
      min-height: 38px;
      border-color: #cfd9df;
      border-radius: 6px;
      background: #fff;
      font-weight: 700;
      transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
    }

    button:hover:not(:disabled) {
      border-color: #8ea8a5;
      background: #f7fbfa;
    }

    button.primary {
      background: var(--accent);
      border-color: var(--accent);
      box-shadow: 0 2px 5px rgba(8, 95, 88, 0.2);
    }

    button.primary:hover:not(:disabled) {
      background: var(--accent-strong);
      border-color: var(--accent-strong);
      transform: translateY(-1px);
    }

    input, select, textarea {
      min-height: 40px;
      border-color: #ccd7de;
      border-radius: 6px;
      background: #fff;
      padding: 8px 10px;
    }

    input:focus, select:focus, textarea:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(13, 118, 109, 0.13);
    }

    .app-shell { grid-template-columns: 252px minmax(0, 1fr); }

    .sidebar {
      background: #fff;
      color: var(--ink);
      padding: 14px 12px 24px;
      border-right: 1px solid #dbe3e8;
      box-shadow: 2px 0 14px rgba(24, 36, 50, 0.035);
      gap: 14px;
    }

    .brand {
      position: relative;
      margin: 0 2px;
      padding: 15px 13px 14px 49px;
      border: 1px solid #d4e5e1;
      border-radius: 8px;
      background: #f2f8f7;
    }

    .brand::before {
      content: "赢";
      position: absolute;
      left: 13px;
      top: 16px;
      width: 25px;
      height: 25px;
      display: grid;
      place-items: center;
      border-radius: 6px;
      background: var(--accent);
      color: #fff;
      font-size: 14px;
      font-weight: 850;
    }

    .brand h1 {
      color: #163b37;
      font-size: 15px;
      font-weight: 850;
      line-height: 1.34;
    }

    .brand p {
      margin-top: 7px;
      color: #617571;
      font-size: 11px;
      line-height: 1.5;
    }

    .brand p span {
      display: block;
      white-space: nowrap;
    }

    .nav { gap: 5px; }
    .nav-group { gap: 3px; }

    .nav button {
      color: #53616d;
      border-radius: 6px;
      padding: 0 10px;
    }

    .nav button:hover:not(:disabled) {
      background: #f3f7f8;
      color: #174c47;
    }

    .nav-primary {
      min-height: 40px;
      color: #2b3844 !important;
      font-size: 14px;
      font-weight: 800;
    }

    .nav-primary::before,
    .agency-team-toggle::before,
    .finance-account-toggle::before {
      color: #90a0ac;
      font-size: 18px;
    }

    .nav-subnav,
    .finance-account-menu {
      margin: 1px 0 5px 13px;
      padding: 3px 0 3px 8px;
      border-left-color: #dbe5e8;
    }

    .nav-subnav button,
    .finance-account-toggle,
    .agency-team-toggle {
      min-height: 34px;
      color: #687783 !important;
      font-size: 13px;
      font-weight: 650;
    }

    .nav-subnav button { padding-left: 11px; }

    .nav button.active,
    .nav button.parent-active {
      background: #e9f5f2;
      color: #0a6158 !important;
    }

    .nav button.parent-active { box-shadow: inset 3px 0 0 var(--accent); }

    main {
      padding: 24px 30px 38px;
      background: var(--bg);
    }

    .topbar {
      align-items: center;
      margin-bottom: 16px;
      padding: 0 0 17px;
      border-bottom-color: #d9e2e7;
    }

    .topbar h2 {
      color: #172432;
      font-size: 24px;
      font-weight: 850;
    }

    .topbar p { max-width: 760px; color: #6c7a89; }

    .current-user-greeting {
      min-height: 23px;
      padding: 2px 8px;
      border-color: #c6dfda;
      border-radius: 5px;
      background: #f0f8f6;
      color: #0d6b62;
      font-weight: 750;
    }

    .actions { gap: 7px; }
    .actions button { min-height: 36px; }

    .cloud-panel,
    .toolbar {
      border-color: #dbe4e9;
      border-radius: 8px;
      box-shadow: none;
    }

    .cloud-panel {
      padding: 11px 14px;
      background: #fbfcfd;
    }

    .cloud-head strong { color: #2b3b48; font-size: 13px; }
    .cloud-status { color: #55706d; font-weight: 650; }
    .toolbar { padding: 15px; background: #fff; }
    .field { gap: 6px; }
    .field label { color: #5d6d7b; font-weight: 750; }

    .toolbar .field > label,
    .form-panel .field > label { color: #516372; }

    #businessEntryOwnerField,
    #businessEntryOwnerField + .field {
      align-content: start;
    }

    .business-entry-owner-hint {
      margin-top: -5px;
    }

    .segmented {
      padding: 3px;
      border: 1px solid #d4dde3;
      border-radius: 7px;
      background: #f5f7f9;
    }

    .segmented button {
      min-height: 30px;
      border: 0;
      border-radius: 5px;
      background: transparent;
      color: #677684;
    }

    .segmented button.active {
      background: #fff;
      color: #0c665d;
      box-shadow: 0 1px 3px rgba(24, 36, 50, 0.1);
    }

    .person-card,
    .summary-card,
    .form-panel,
    .table-panel {
      border-color: #dbe4e9;
      box-shadow: 0 4px 14px rgba(24, 36, 50, 0.045);
    }

    .summary-card {
      min-height: 104px;
      border-top: 3px solid #badbd5;
      border-radius: 8px;
      padding: 16px;
    }

    .summary-card span { color: #667789; font-weight: 650; }
    .summary-card strong { color: #1e2e3c; font-size: 23px; font-weight: 850; }
    .summary-card.money { border-top-color: #6aa59d; }
    .summary-card.good { border-top-color: #63aa7a; }
    .summary-card.warn { border-top-color: #d8a24b; }
    .summary-card.blue { border-top-color: #7ea8d7; }

    .metric {
      min-height: 72px;
      border-color: #dce6e9;
      border-radius: 6px;
      background: #f9fbfc;
      padding: 10px;
    }

    .metric span { color: #6b7b89; white-space: normal; }
    .metric strong { color: #213242; font-size: 17px; font-weight: 800; }
    .metric.clickable:hover { background: #f0f8f6; border-color: #8bc1b8; }

    .section { margin-top: 26px; }
    .section-head { margin-bottom: 11px; }
    .section-head h3,
    .section-head .panel-title { color: #20303e; font-size: 17px; font-weight: 850; }

    .form-panel { padding: 18px; }
    .form-panel > .section-head { padding-bottom: 14px; }
    .workbench-form { gap: 18px; }
    .workbench-form .field.full { border-top-color: #e2e9ed; }
    .workbench-form .edit-line,
    .workbench-form .hq-delivery-line {
      border-color: #d7e2e6;
      border-radius: 6px;
      background: #fbfcfd;
    }

    .workbench-form .hq-delivery-line .check-group { background: #f5faf9; }
    .workbench-form .form-footer { border-top-color: #dfe7eb; }
    .field-note { border-left-color: #6ca99f; background: #f4f9f8; }
    .check-group { border-color: #ccd8de; border-radius: 6px; }

    .table-panel { border-radius: 8px; }
    .table-wrap {
      background: #fff;
      scrollbar-color: #a8b7bd #eef2f4;
    }

    .table-wrap::-webkit-scrollbar-track { background: #eef2f4; }
    .table-wrap::-webkit-scrollbar-thumb { border-color: #eef2f4; background: #a8b7bd; }
    .table-wrap::-webkit-scrollbar-thumb:hover { background: #768b93; }

    .table-wrap table thead th,
    .merchant-first-table thead th:first-child {
      background: #f3f6f8;
      border-bottom-color: #d6e0e5;
      color: #536473;
      font-size: 12px;
      font-weight: 800;
    }

    .table-wrap tbody tr:nth-child(even) td,
    .merchant-first-table tbody tr:nth-child(even) td:first-child { background: #fbfcfd; }

    .table-wrap tbody tr:hover td,
    .merchant-first-table tbody tr:hover td:first-child { background: #eff8f6; }

    .merchant-first-table th:first-child,
    .merchant-first-table td:first-child { box-shadow: 1px 0 0 #dbe4e9, 5px 0 12px rgba(24, 36, 50, 0.045); }

    .status { border-radius: 999px; font-weight: 750; }

    .finance-board-section {
      margin: 24px 0;
      padding-top: 2px;
    }

    .finance-board-section-head {
      padding: 0 0 10px;
      border-bottom-color: #d9e3e7;
    }

    .finance-board-section-head h4,
    .finance-stage-title h4 { color: #20303e; font-size: 16px; }

    .finance-account-guide > div {
      border-color: #d6e3e4;
      border-radius: 7px;
      background: #f5faf9;
    }

    @media (max-width: 1100px) and (min-width: 681px) {
      .app-shell { grid-template-columns: 208px minmax(0, 1fr); }
      main { padding: 20px; }
      .sidebar { padding: 12px 10px 20px; }
      .brand { padding-left: 13px; }
      .brand::before { display: none; }
      .toolbar-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    }

    @media (max-width: 680px) {
      main { padding: 14px; }
      .sidebar { background: #fff; border-bottom: 1px solid #dbe3e8; }
      .brand { padding: 12px; }
      .brand::before { display: none; }
      .topbar { gap: 12px; }
      .topbar h2 { font-size: 21px; }
      .summary-card { min-height: 82px; }
      .summary-card strong { font-size: 20px; }
      .toolbar, .form-panel { padding: 13px; }
      .nav-subnav, .finance-account-menu { margin-left: 8px; }
    }