@font-face {
      font-family: 'Inter';
      src: url('./InterVariable.woff2') format('woff2');
      font-weight: 100 900;
      font-style: normal;
      font-display: swap;
    }
    :root {
      --bg: #f2f4f1;
      --surface: #ffffff;
      --surface-soft: #f8f9f7;
      --sidebar: #1c2523;
      --sidebar-2: #2a3431;
      --text: #17201f;
      --muted: #697270;
      --line: #dfe4e1;
      --bad: #b93337;
      --bad-soft: #fde9e8;
      --bad-line: #efcac7;
      --warn: #a95d00;
      --warn-soft: #fff0d8;
      --warn-line: #efd1a5;
      --ok: #137a51;
      --ok-soft: #e5f5ed;
      --ok-line: #b9dfcb;
      --blue: #1c2523;
      --blue-soft: #edf0ed;
      --acid: #c8f04a;
      --chip: #edf0ed;
      --focus: #c8f04a;
      --radius: 18px;
      --shadow: 0 18px 55px rgba(30, 45, 40, .09);
      --sidebar-width: 0px;
      --sidebar-width-compact: 0px;
      --workspace-gutter: 32px;
    }
    * { box-sizing: border-box; }
    html { height: 100%; }
    body {
      margin: 0;
      font-family: 'Inter', Arial, sans-serif;
      background: var(--bg);
      color: var(--text);
      min-height: 100%;
      -webkit-font-smoothing: antialiased;
    }
    body.authLocked {
      overflow: hidden;
    }
    body.authLocked .appShell,
    body.authLocked .modalOverlay,
    body.authLocked .problemJokeModalBackdrop,
    body.authLocked .shortageModalBackdrop {
      display: none !important;
    }
    .authGate {
      position: fixed;
      inset: 0;
      z-index: 500;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background:
        linear-gradient(135deg, rgba(28,37,35,.96), rgba(42,52,49,.92)),
        var(--sidebar);
    }
    body.authLocked .authGate {
      display: flex;
    }
    .authPanel {
      width: min(430px, 100%);
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 20px;
      background: #fff;
      box-shadow: 0 28px 90px rgba(0,0,0,.28);
    }
    .authBrand {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 22px 24px;
      color: #fff;
      background: var(--sidebar);
    }
    .authBrand span {
      width: 58px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 12px;
      color: var(--sidebar);
      background: var(--acid);
      font-size: 10px;
      font-weight: 950;
      line-height: 1;
      text-align: center;
    }
    .authBrand small {
      color: #cfd7d2;
      font-size: 11px;
      font-weight: 750;
      letter-spacing: .08em;
      line-height: 1.25;
      text-transform: uppercase;
    }
    .authHead {
      padding: 26px 26px 8px;
    }
    .authHead p {
      margin: 0 0 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 850;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .authHead h1 {
      margin: 0;
      font-size: 31px;
      line-height: 1;
      letter-spacing: -.045em;
    }
    .authForm {
      display: grid;
      gap: 15px;
      padding: 18px 26px 26px;
    }
    .authForm label {
      display: block;
      margin: 0;
      color: #59635f;
      font-size: 11px;
      font-weight: 820;
    }
    .authForm input {
      display: block;
      width: 100%;
      margin-top: 7px;
      height: 48px;
      min-height: 48px;
      padding: 0 13px;
      border: 1px solid var(--line);
      border-radius: 13px;
      color: var(--text);
      background: #fff;
      font-size: 14px;
      box-shadow: none;
    }
    .authForm input:focus {
      outline: 3px solid rgba(200,240,74,.28);
      border-color: var(--focus);
    }
    .authError {
      min-height: 18px;
      color: var(--bad);
      font-size: 12px;
      font-weight: 760;
    }
    .authForm button {
      height: 48px;
      border-color: var(--acid);
      border-radius: 13px;
      color: var(--sidebar);
      background: var(--acid);
      font-weight: 900;
    }

    .appShell {
      display: block;
      min-height: 100vh;
    }
    .sidebar {
      display: grid;
      grid-template-columns: 245px minmax(0, 1fr) auto;
      align-items: center;
      gap: 32px;
      min-height: 76px;
      padding: 0 32px;
      background: rgba(255,255,255,.88);
      color: var(--text);
      border-bottom: 1px solid var(--line);
      backdrop-filter: blur(12px);
      position: sticky;
      top: 0;
      z-index: 80;
    }
    .brand {
      display: flex;
      gap: 12px;
      align-items: center;
      min-height: 0;
    }
    .brandMark {
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 76px;
      width: 76px;
      height: 36px;
      padding: 0 8px;
      border-radius: 11px;
      background: var(--acid);
      color: var(--sidebar);
      font-weight: 900;
      font-size: 10px;
      letter-spacing: .02em;
      line-height: 1;
      text-align: center;
    }
    .brand div:last-child {
      min-width: 0;
    }
    .brandSub {
      margin-top: 2px;
      color: var(--muted);
      font-size: 11px;
      line-height: 1.2;
      font-weight: 650;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .sideStatus {
      border: 1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.06);
      border-radius: 8px;
      padding: 12px;
      color: #d7dde7;
      font-size: 12px;
      line-height: 1.45;
    }
    .sideStatus b {
      display: block;
      color: #fff;
      font-size: 13px;
      margin-bottom: 3px;
    }
    .sidebarBottom {
      display: none;
    }
    .tabs {
      display: flex;
      align-items: center;
      height: 76px;
      gap: 4px;
      min-width: 0;
      overflow-x: auto;
      overflow-y: hidden;
    }
    .tab {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: auto;
      min-height: 76px;
      border: 1px solid transparent;
      border-radius: 0;
      background: transparent;
      color: #64706d;
      margin: 0;
      padding: 0 14px;
      text-align: left;
      font-weight: 700;
      font-size: 13px;
      white-space: nowrap;
      box-shadow: none;
      transition: color .15s ease, border-color .15s ease, background-color .15s ease;
    }
    .tab:hover:not(.active):not(:disabled) {
      background: transparent;
      border-color: transparent;
      color: var(--text);
      filter: none;
    }
    .tab.active {
      background: transparent;
      color: var(--text);
      border-color: transparent;
      box-shadow: none;
    }
    .tab.active::after {
      content: "";
      position: absolute;
      left: 14px;
      right: 14px;
      bottom: -1px;
      height: 3px;
      border-radius: 3px 3px 0 0;
      background: var(--text);
    }
    .tab.active:hover:not(:disabled) {
      background: transparent;
      color: var(--text);
      border-color: transparent;
      filter: none;
    }
    .operatorMenu {
      position: relative;
      justify-self: end;
      min-width: 0;
      max-width: 220px;
      padding-left: 18px;
      border-left: 1px solid var(--line);
    }
    .operatorMenuBtn {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      min-height: 42px;
      padding: 4px 8px 4px 4px;
      border: 1px solid transparent;
      border-radius: 12px;
      color: inherit;
      background: transparent;
      box-shadow: none;
      text-align: left;
    }
    .operatorMenuBtn:hover {
      border-color: var(--line);
      background: #f3f5f3;
      filter: none;
    }
    .operatorMenu.open .operatorMenuBtn {
      border-color: var(--line);
      background: #f3f5f3;
    }
    .operatorAvatar {
      width: 34px;
      height: 34px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: #fff;
      background: var(--sidebar);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .02em;
    }
    .operatorCurrent {
      min-width: 0;
      flex: 1;
      color: var(--muted);
    }
    .operatorCurrent small {
      display: block;
      margin-bottom: 2px;
      color: var(--muted);
      font-size: 9px;
      font-weight: 800;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .operatorCurrent strong {
      display: block;
      overflow: hidden;
      color: var(--text);
      font-size: 12.5px;
      font-weight: 850;
      line-height: 1.1;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .operatorMenuCaret {
      width: 7px;
      height: 7px;
      flex: 0 0 auto;
      margin-right: 2px;
      border-right: 1.5px solid #7d8782;
      border-bottom: 1.5px solid #7d8782;
      transform: rotate(45deg) translate(-1px, -1px);
    }
    .operatorMenu.open .operatorMenuCaret {
      transform: rotate(225deg) translate(-1px, -1px);
    }
    .operatorMenuPanel {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      z-index: 80;
      min-width: 180px;
      padding: 6px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: 0 16px 40px rgba(28, 37, 35, .14);
    }
    .operatorMenuItem {
      display: block;
      width: 100%;
      min-height: 40px;
      padding: 0 12px;
      border: 0;
      border-radius: 10px;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      font-size: 13px;
      font-weight: 780;
      text-align: left;
    }
    .operatorMenuItem:hover {
      background: #f1f4f1;
      filter: none;
    }
    .operatorAdminPanel {
      border-color: #cdd8ce;
      background: #fbfdf8;
    }
    .operatorAdminIntro {
      display: grid;
      gap: 4px;
      margin: 4px 0 14px;
    }
    .operatorAdminIntro strong {
      color: var(--text);
      font-size: 14px;
      font-weight: 850;
    }
    .operatorAdminIntro span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }
    .operatorPasswordGrid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }
    .operatorPasswordGrid label {
      margin: 0;
      color: #59635f;
      font-size: 11px;
      font-weight: 820;
    }
    .operatorPasswordGrid input {
      display: block;
      width: 100%;
      height: 44px;
      min-height: 44px;
      margin-top: 7px;
      border-radius: 12px;
      font-size: 13px;
    }
    .badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 21px;
      padding: 3px 6px;
      border-radius: 999px;
      background: var(--acid);
      color: var(--sidebar);
      font-size: 10px;
      font-weight: 850;
      margin-left: 8px;
    }
    .tab.active .badge {
      background: var(--acid);
    }
    .badge.hasProblems,
    .tab.active .badge.hasProblems {
      background: var(--bad);
      color: #fff;
    }
    .workspace {
      min-width: 0;
      width: min(1480px, calc(100% - 64px));
      margin: 0 auto;
      padding: 17px 0 112px;
    }
    .workspace > .topbar {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 0;
    }
    .workspace > .topbar .pageTitle {
      display: none;
    }
    .pageTitle h2 {
      margin: 0;
      font-size: clamp(30px, 3vw, 42px);
      line-height: 1;
      letter-spacing: -.045em;
    }
    .pageTitle p {
      margin: 5px 0 0;
      color: var(--muted);
      font-size: 13px;
      max-width: 760px;
      line-height: 1.45;
    }
    .topActions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }
    .topActionGroup {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }

    .controlPanel,
    .contentPanel {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
    }
    .controlPanel {
      position: sticky;
      top: 22px;
    }
    .panelHeader {
      padding: 18px 22px;
      border-bottom: 1px solid var(--line);
      background: var(--surface-soft);
    }
    .panelHeader h2 {
      margin: 0 0 10px;
      font-size: 17px;
      letter-spacing: 0;
    }
    .panelHeader p {
      margin: 0;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
    }
    .module {
      padding: 18px 22px;
      border-bottom: 1px solid var(--line);
    }
    .module:last-child {
      border-bottom: 0;
    }
    .moduleTitle {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 0 0 12px;
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: .04em;
      color: #344054;
    }
    .step {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 22px;
      height: 22px;
      border-radius: 999px;
      background: #e0ecff;
      color: var(--blue);
      font-size: 12px;
      font-weight: 800;
    }
    .small {
      font-size: 12px;
      color: var(--muted);
      line-height: 1.4;
    }
    label {
      display: block;
      margin: 12px 0 6px;
      font-size: 12px;
      font-weight: 750;
      color: #53605c;
    }
    input[type="text"], input[type="date"], input[type="number"], input[type="file"], textarea, select {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 10px 12px;
      background: #fff;
      font-size: 14px;
      min-height: 42px;
      color: var(--text);
    }
    input[type="file"] {
      padding: 8px;
      background: #fff;
    }
    input[type="text"]:focus, input[type="date"]:focus, input[type="number"]:focus, textarea:focus, select:focus {
      outline: 3px solid rgba(200, 240, 74, .28);
      border-color: var(--focus);
    }
    :where(button, input, textarea, select, [role="button"], .tab, .filePreview .selectableColumn):focus-visible {
      outline: 3px solid rgba(200, 240, 74, .45);
      outline-offset: 2px;
    }
    :where(button, [role="button"], .tab, .filePreview .selectableColumn):focus:not(:focus-visible) {
      outline: none;
    }
    textarea {
      min-height: 220px;
      resize: vertical;
      font-family: Consolas, monospace;
      white-space: pre;
      line-height: 1.45;
    }
    button {
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 9px 14px;
      font-size: 13px;
      cursor: pointer;
      background: var(--blue);
      color: white;
      margin: 0;
      min-height: 42px;
      font-weight: 750;
    }
    button:hover:not(:disabled) {
      filter: brightness(.96);
    }
    button.secondary {
      background: var(--sidebar-2);
    }
    button.danger {
      background: var(--bad);
    }
    button.good {
      background: var(--ok);
      border-color: var(--ok);
    }
    button.ghost {
      background: #fff;
      color: var(--text);
      border: 1px solid var(--line);
    }
    button.printMain {
      background: #d92d20;
      color: #fff;
      font-weight: 800;
      box-shadow: 0 10px 20px rgba(217,45,32,.18);
    }
    button:disabled {
      opacity: .45;
      cursor: not-allowed;
    }
    .row {
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
    }
    .toolbar {
      display: flex;
      gap: 8px;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      margin: 8px 0 10px;
    }
    .actionGrid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }
    .actionGrid button {
      width: 100%;
      margin: 0;
    }
    .panel {
      background: var(--surface-soft);
      border: 1px solid var(--line);
      border-radius: 14px;
      padding: 14px;
      margin: 14px 0;
    }
    .panel h3 {
      margin: 0 0 8px;
      font-size: 13px;
      text-transform: uppercase;
      letter-spacing: .04em;
      color: #475467;
    }
    .contentBody {
      padding: 20px;
    }
    .screenActions {
      display: flex;
      gap: 8px;
      justify-content: flex-end;
      flex-wrap: wrap;
    }
    .pageActions {
      margin-bottom: 16px;
    }
    .formPanel {
      max-width: 860px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      padding: 22px;
      box-shadow: var(--shadow);
    }
    .modalOverlay {
      position: fixed;
      inset: 0;
      z-index: 200;
      display: flex;
      align-items: flex-start;
      justify-content: center;
      padding: 72px 14px 24px;
      background: rgba(23, 32, 31, .18);
    }
    .modalDialog {
      width: min(450px, 100%);
      border: 1px solid var(--line);
      border-radius: 16px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(30, 45, 40, .20);
      overflow: hidden;
    }
    .modalDialog.wide {
      width: min(760px, 100%);
    }
    .modalDialog.deliveryEditDialog {
      width: min(820px, calc(100vw - 32px));
      border-color: var(--line);
      border-radius: 18px;
      box-shadow: 0 24px 70px rgba(30, 45, 40, .22);
      position: relative;
    }
    .modalBody {
      padding: 20px 20px 14px;
    }
    .modalBody h2 {
      margin: 0 0 14px;
      font-size: 16px;
      line-height: 1.3;
      letter-spacing: 0;
    }
    .modalMessage {
      color: var(--text);
      font-size: 13px;
      line-height: 1.35;
      white-space: pre-line;
    }
    .modalActions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      padding: 0 20px 20px;
    }
    .modalActions button {
      min-width: 66px;
      border-radius: 12px;
      padding: 8px 14px;
      background: var(--blue);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
    }
    .modalActions button.ghost {
      background: #fff;
      color: var(--text);
      border: 1px solid var(--line);
      box-shadow: none;
    }
    .modalActions button.danger {
      background: var(--bad);
    }
    .jokeSettingRow {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 128px;
      gap: 16px;
      align-items: end;
    }
    .jokeSettingRow strong {
      display: block;
      color: var(--text);
      font-size: 14px;
      line-height: 1.25;
    }
    .jokeSettingRow span {
      display: block;
      margin-top: 5px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }
    .jokeSettingRow label {
      margin: 0;
      color: var(--muted);
      font-size: 10.5px;
      font-weight: 850;
    }
    .jokeSettingRow input {
      width: 100%;
      height: 42px;
      margin-top: 6px;
      border: 1px solid var(--line);
      border-radius: 11px;
      padding: 0 12px;
      color: var(--text);
      font-size: 16px;
      font-weight: 850;
    }
    .problemJokeModalBackdrop {
      position: fixed;
      inset: 0;
      z-index: 215;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(16, 24, 22, .42);
      backdrop-filter: blur(12px);
    }
    .problemJokeModal {
      width: min(560px, 100%);
      border: 1px solid rgba(255,255,255,.32);
      border-radius: 20px;
      background: #fff;
      box-shadow: 0 34px 90px rgba(17, 28, 25, .3);
      overflow: hidden;
    }
    .problemJokeScene {
      position: relative;
      min-height: 188px;
      padding: 24px;
      color: #fff;
      background:
        radial-gradient(circle at 78% 22%, rgba(200,240,74,.28), transparent 27%),
        linear-gradient(135deg, #17201f 0%, #26332f 100%);
      overflow: hidden;
    }
    .problemJokeScene::before {
      content: "";
      position: absolute;
      inset: auto 24px 22px;
      height: 8px;
      border-radius: 99px;
      background: rgba(255,255,255,.12);
    }
    .jokeWarehouse {
      position: relative;
      width: 260px;
      height: 128px;
      margin: 8px auto 0;
      border: 2px solid rgba(255,255,255,.32);
      border-radius: 18px 18px 8px 8px;
      background:
        linear-gradient(#c8f04a, #c8f04a) 30px 34px / 200px 5px no-repeat,
        linear-gradient(#c8f04a, #c8f04a) 30px 76px / 200px 5px no-repeat,
        rgba(255,255,255,.08);
      box-shadow: inset 0 -20px 0 rgba(0,0,0,.08);
    }
    .jokeWarehouse i {
      position: absolute;
      top: 28px;
      bottom: 18px;
      width: 5px;
      border-radius: 99px;
      background: rgba(255,255,255,.48);
    }
    .jokeWarehouse i:nth-child(1) { left: 28px; }
    .jokeWarehouse i:nth-child(2) { left: 128px; }
    .jokeWarehouse i:nth-child(3) { right: 28px; }
    .jokeWarehouse span {
      position: absolute;
      width: 44px;
      height: 28px;
      border-radius: 7px;
      background: rgba(255,255,255,.9);
      box-shadow: inset 0 -8px 0 rgba(28,37,35,.08);
    }
    .jokeWarehouse span:nth-of-type(1) { left: 52px; top: 38px; }
    .jokeWarehouse span:nth-of-type(2) { left: 154px; top: 38px; }
    .jokeWarehouse span:nth-of-type(3) { left: 78px; top: 82px; }
    .jokeWarehouse span:nth-of-type(4) {
      right: 48px;
      top: 82px;
      background: var(--acid);
      transform: rotate(-7deg);
    }
    .jokeBadge {
      position: absolute;
      right: 22px;
      bottom: 18px;
      padding: 7px 11px;
      border: 1px solid rgba(255,255,255,.24);
      border-radius: 999px;
      color: var(--acid);
      background: rgba(0,0,0,.18);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .12em;
    }
    .problemJokeBody {
      padding: 24px 26px 12px;
      text-align: center;
    }
    .problemJokeKicker {
      display: block;
      margin-bottom: 7px;
      color: var(--muted);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .problemJokeBody h2 {
      margin: 0;
      color: var(--text);
      font-size: 28px;
      line-height: 1.1;
      letter-spacing: 0;
    }
    .problemJokeBody p {
      margin: 12px auto 0;
      max-width: 390px;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.45;
    }
    .problemJokeActions {
      display: flex;
      justify-content: center;
      gap: 10px;
      padding: 18px 26px 26px;
    }
    .problemJokeGhost,
    .problemJokePrimary {
      min-height: 44px;
      border-radius: 12px;
      padding: 0 18px;
      font-size: 13px;
      font-weight: 850;
    }
    .problemJokeGhost {
      border: 1px solid var(--line);
      color: var(--text);
      background: #fff;
      box-shadow: none;
    }
    .problemJokePrimary {
      color: var(--text);
      background: var(--acid);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.44);
    }
    .shortageModalBackdrop {
      position: fixed;
      inset: 0;
      z-index: 210;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(23, 32, 31, .34);
      backdrop-filter: blur(10px);
    }
    .shortageModal {
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      width: min(760px, 100%);
      max-height: calc(100vh - 48px);
      border: 1px solid rgba(255,255,255,.32);
      border-radius: 18px;
      background: #fff;
      box-shadow: 0 34px 90px rgba(17, 28, 25, .28);
      overflow: hidden;
    }
    .shortageModalHead {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 18px;
      padding: 22px 24px 20px;
      color: #fff;
      background:
        linear-gradient(135deg, rgba(200,240,74,.16), transparent 42%),
        var(--sidebar);
    }
    .shortageModalKicker {
      display: block;
      margin-bottom: 6px;
      color: rgba(255,255,255,.62);
      font-size: 10px;
      font-weight: 850;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .shortageModalHead h2 {
      margin: 0;
      font-size: 22px;
      line-height: 1.14;
      letter-spacing: 0;
    }
    .shortageModalClose {
      display: grid;
      place-items: center;
      width: 38px;
      height: 38px;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 10px;
      color: #fff;
      background: rgba(255,255,255,.08);
      box-shadow: none;
      font-size: 22px;
      line-height: 1;
    }
    .shortageModalClose:hover {
      background: rgba(255,255,255,.14);
    }
    .shortageModalBody {
      padding: 22px 24px;
      overflow: auto;
      min-height: 0;
    }
    .shortageSelectionHead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      padding: 14px;
      border: 1px solid var(--warn-line);
      border-radius: 14px;
      background: var(--warn-soft);
    }
    .shortageSelectionHead span {
      display: block;
      color: var(--warn);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .06em;
      text-transform: uppercase;
    }
    .shortageSelectionHead strong {
      display: block;
      margin-top: 4px;
      color: var(--text);
      font-size: 18px;
      line-height: 1.1;
    }
    .shortageMiniBtn {
      min-height: 36px;
      border: 1px solid rgba(169,93,0,.24);
      border-radius: 10px;
      padding: 0 12px;
      color: var(--warn);
      background: #fff;
      box-shadow: none;
      font-size: 11px;
      font-weight: 850;
    }
    .shortageReasonBlock label,
    .shortageNote {
      color: var(--muted);
      font-size: 10.5px;
      font-weight: 800;
    }
    .shortagePickerBlock {
      margin-top: 18px;
    }
    .shortagePickerBlock label {
      display: block;
      margin-bottom: 8px;
      color: var(--muted);
      font-size: 10.5px;
      font-weight: 850;
    }
    #shortageProductSearch {
      width: 100%;
      height: 42px;
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 0 13px;
      color: var(--text);
      background: #fff;
      font: inherit;
      font-size: 13px;
      outline: none;
    }
    #shortageProductSearch:focus {
      border-color: #9aa89f;
      box-shadow: 0 0 0 3px rgba(200,240,74,.28);
    }
    .shortageProductList {
      max-height: 240px;
      margin-top: 10px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #fff;
      overflow: auto;
    }
    .shortageProductOption {
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      min-height: 56px;
      margin: 0;
      padding: 10px 14px;
      color: var(--text);
      background: #fff;
      border-top: 1px solid #edf0ed;
      border-right: 0;
      border-bottom: 0;
      border-left: 0;
      border-radius: 0;
      box-shadow: none;
      text-align: left;
      cursor: pointer;
      transition: background .15s ease, box-shadow .15s ease;
    }
    .shortageProductOption:first-child {
      border-top: 0;
    }
    .shortageProductOption.selected {
      background: #f9fcf1;
      box-shadow: inset 3px 0 0 var(--acid);
    }
    .shortageProductOption:hover {
      background: #fbfcf8;
    }
    .shortageProductCheck {
      flex: 0 0 26px;
      display: grid;
      place-items: center;
      width: 26px;
      height: 26px;
      border: 1px solid #cfd8d3;
      border-radius: 8px;
      background: #fff;
    }
    .shortageProductOption.selected .shortageProductCheck {
      border-color: #91aa43;
      background: var(--acid);
    }
    .shortageProductOption.selected .shortageProductCheck::after {
      content: "";
      width: 9px;
      height: 5px;
      border-left: 2px solid var(--text);
      border-bottom: 2px solid var(--text);
      transform: rotate(-45deg);
    }
    .shortageProductNum {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 22px;
      height: 20px;
      margin-right: 7px;
      border: 1px solid var(--line);
      border-radius: 7px;
      color: var(--muted);
      background: var(--surface-soft);
      font-size: 10.5px;
      font-weight: 900;
      vertical-align: 1px;
    }
    .shortageProductInfo {
      flex: 1 1 0;
      min-width: 0;
    }
    .shortageProductInfo strong {
      display: block;
      color: var(--text);
      font-size: 12.5px;
      line-height: 1.25;
    }
    .shortageProductInfo em {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-size: 10.5px;
      font-style: normal;
      line-height: 1.25;
    }
    .shortageProductQty {
      flex: 0 0 54px;
      align-self: center;
      color: var(--text);
      font-size: 13px;
      font-weight: 900;
      text-align: right;
      white-space: nowrap;
    }
    .shortageProductEmpty {
      padding: 18px;
      color: var(--muted);
      font-size: 12px;
      text-align: center;
    }
    .shortageReasonBlock {
      margin-top: 18px;
    }
    .shortageReasonGrid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      margin-top: 8px;
    }
    .shortageReason {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 42px;
      border: 1px solid var(--line);
      border-radius: 11px;
      color: var(--text);
      background: #fff;
      box-shadow: none;
      font-size: 11px;
      font-weight: 850;
    }
    .shortageReason span {
      width: 8px;
      height: 8px;
      border-radius: 99px;
      background: #a8b0ad;
    }
    .shortageReason.active {
      border-color: rgba(28,37,35,.7);
      background: #f4f8ed;
    }
    .shortageReason.active span {
      background: var(--acid);
      box-shadow: 0 0 0 3px rgba(200,240,74,.28);
    }
    .shortageNote {
      display: block;
      margin-top: 18px;
    }
    .shortageNote textarea {
      width: 100%;
      margin-top: 8px;
      resize: vertical;
      min-height: 70px;
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 12px 13px;
      color: var(--text);
      background: #fff;
      font: inherit;
      font-size: 13px;
      outline: none;
    }
    .shortageNote textarea:focus {
      border-color: #9aa89f;
      box-shadow: 0 0 0 3px rgba(200,240,74,.28);
    }
    .shortageModalHint {
      margin-top: 14px;
      padding: 10px 12px;
      border: 1px solid #dce7c8;
      border-radius: 12px;
      color: #52603b;
      background: #f7fbef;
      font-size: 11px;
      line-height: 1.4;
    }
    .shortageModalActions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      padding: 16px 24px 22px;
      border-top: 1px solid var(--line);
      background: var(--surface-soft);
    }
    .shortageGhostBtn,
    .shortagePrimaryBtn {
      min-height: 44px;
      border-radius: 12px;
      padding: 0 18px;
      font-size: 13px;
      font-weight: 850;
    }
    .shortageGhostBtn {
      border: 1px solid var(--line);
      color: var(--text);
      background: #fff;
      box-shadow: none;
    }
    .shortagePrimaryBtn {
      color: var(--text);
      background: var(--acid);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.44);
    }
    @media (max-width: 620px) {
      .jokeSettingRow {
        grid-template-columns: 1fr;
      }
      .problemJokeModalBackdrop {
        align-items: end;
        padding: 12px;
      }
      .problemJokeModal {
        max-height: calc(100vh - 24px);
        overflow: auto;
      }
      .problemJokeScene {
        min-height: 150px;
        padding: 18px;
      }
      .jokeWarehouse {
        width: 220px;
        height: 108px;
      }
      .jokeWarehouse span:nth-of-type(2) { left: 136px; }
      .jokeWarehouse span:nth-of-type(3) { left: 64px; top: 72px; }
      .jokeWarehouse span:nth-of-type(4) { right: 38px; top: 72px; }
      .problemJokeBody {
        padding: 20px 18px 8px;
      }
      .problemJokeBody h2 {
        font-size: 24px;
      }
      .problemJokeActions {
        flex-direction: column-reverse;
        padding: 14px 18px 20px;
      }
      .problemJokeGhost,
      .problemJokePrimary {
        width: 100%;
      }
      .shortageModalBackdrop {
        align-items: end;
        padding: 12px;
      }
      .shortageModal {
        max-height: calc(100vh - 24px);
      }
      .shortageModalHead,
      .shortageModalBody,
      .shortageModalActions {
        padding-left: 16px;
        padding-right: 16px;
      }
      .shortageSelectionHead {
        align-items: stretch;
        flex-direction: column;
      }
      .shortageMiniBtn {
        width: 100%;
      }
      .shortageProductList {
        max-height: 220px;
      }
      .shortageReasonGrid {
        grid-template-columns: 1fr;
      }
      .shortageModalActions {
        flex-direction: column-reverse;
      }
      .shortageGhostBtn,
      .shortagePrimaryBtn {
        width: 100%;
      }
    }
    @media (max-height: 760px) {
      .shortageModal {
        max-height: calc(100vh - 24px);
      }
      .shortageModalHead {
        padding-top: 16px;
        padding-bottom: 14px;
      }
      .shortageModalBody {
        padding-top: 16px;
        padding-bottom: 16px;
      }
      .shortageProductList {
        max-height: 190px;
      }
      .shortageNote textarea {
        min-height: 58px;
      }
      .shortageModalActions {
        padding-top: 12px;
        padding-bottom: 14px;
      }
    }
    .deliveryEditDialog .modalBody {
      padding: 0;
    }
    .deliveryEditDialog .modalBody h2 {
      margin: 0;
      min-height: 58px;
      padding: 20px 66px 12px 22px;
      font-size: 18px;
      line-height: 1.25;
    }
    .deliveryEditDialog .modalMessage {
      padding: 0 22px 18px;
    }
    .deliveryEditDialog .modalActions {
      align-items: center;
      padding: 14px 22px 20px;
      border-top: 1px solid var(--line);
      background: var(--surface-soft);
    }
    .deliveryEditDialog .modalActions button {
      min-width: 92px;
      min-height: 40px;
      border-radius: 8px;
      font-size: 14px;
    }
    .modalCloseBtn {
      position: absolute;
      top: 13px;
      right: 16px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      min-width: 32px;
      min-height: 32px;
      padding: 0;
      border: 1px solid transparent;
      border-radius: 999px;
      background: transparent;
      color: #667085;
      box-shadow: none;
      font-size: 20px;
      font-weight: 500;
      line-height: 1;
      z-index: 2;
    }
    .modalCloseBtn:hover {
      border-color: var(--line);
      background: var(--surface-soft);
      color: var(--text);
      filter: none;
    }
    .deliveryEditForm {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px 16px;
      white-space: normal;
    }
    .deliveryEditForm label {
      display: block;
      margin-top: 0;
      margin-bottom: 6px;
      color: #344054;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0;
    }
    .deliveryEditForm .wide {
      grid-column: 1 / -1;
    }
    .deliveryEditForm textarea {
      min-height: 84px;
      resize: vertical;
      font-family: inherit;
    }
    .deliveryEditForm input,
    .deliveryEditForm textarea {
      width: 100%;
      min-height: 40px;
      padding: 9px 10px;
      border: 1px solid #cbd5e1;
      border-radius: 8px;
      background: #f8fafc;
      color: #111827;
      font-family: inherit;
      font-size: 14px;
      line-height: 1.35;
      box-shadow: inset 0 1px 1px rgba(15, 23, 42, .03);
    }
    .deliveryEditForm input:focus,
    .deliveryEditForm textarea:focus {
      outline: 3px solid rgba(37, 99, 235, .16);
      border-color: #60a5fa;
      background: #fff;
    }
    .deliveryEditNotice {
      margin: -2px 0 14px;
      padding: 10px 12px;
      border: 1px solid #dbeafe;
      border-radius: 8px;
      background: #f8fbff;
      color: #475467;
      font-size: 12px;
      line-height: 1.35;
    }
    .deliveryEditNotice.error {
      border-color: #fecdd3;
      background: #fff1f2;
      color: #9f1239;
      font-weight: 700;
    }
    .inventoryEditDialog {
      width: min(840px, calc(100vw - 32px));
      position: relative;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 20px;
      background: #fff;
      box-shadow: 0 30px 90px rgba(21,31,28,.26);
    }
    .inventoryEditDialog .modalBody {
      padding: 0;
    }
    .inventoryEditDialog .modalBody h2 {
      min-height: 86px;
      display: flex;
      align-items: flex-end;
      margin: 0;
      padding: 24px 74px 22px 26px;
      color: #fff;
      background: var(--sidebar);
      font-size: 25px;
      line-height: 1;
      letter-spacing: -.035em;
    }
    .inventoryEditDialog .modalBody h2::before {
      content: "Карточка склада";
      position: absolute;
      top: 22px;
      left: 26px;
      color: #aeb9b3;
      font-size: 10px;
      font-weight: 850;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .inventoryEditDialog .modalCloseBtn {
      top: 18px;
      right: 22px;
      width: 42px;
      height: 42px;
      min-width: 42px;
      min-height: 42px;
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 12px;
      color: #fff;
      background: rgba(255,255,255,.08);
      font-size: 28px;
      font-weight: 650;
    }
    .inventoryEditDialog .modalCloseBtn:hover {
      border-color: rgba(255,255,255,.32);
      background: rgba(255,255,255,.14);
      color: #fff;
    }
    .inventoryEditDialog .modalMessage {
      padding: 22px 26px 20px;
      white-space: normal;
    }
    .inventoryEditNotice {
      display: flex;
      align-items: center;
      min-height: 42px;
      margin: 0 0 18px;
      padding: 0 14px;
      border: 1px solid #dfe8d6;
      border-radius: 12px;
      color: #59635f;
      background: #f8fbf2;
      font-size: 12px;
      font-weight: 720;
      line-height: 1.35;
    }
    .inventoryEditNotice::before {
      content: "";
      width: 7px;
      height: 7px;
      flex: 0 0 auto;
      margin-right: 9px;
      border-radius: 999px;
      background: var(--acid);
      box-shadow: 0 0 0 4px rgba(200,240,74,.18);
    }
    .inventoryEditNotice.error {
      border-color: var(--bad-line);
      color: var(--bad);
      background: var(--bad-soft);
      font-weight: 820;
    }
    .inventoryEditNotice.error::before {
      background: var(--bad);
      box-shadow: 0 0 0 4px rgba(185,51,55,.12);
    }
    .inventoryEditForm {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 14px;
      white-space: normal;
    }
    .inventoryEditForm > div {
      grid-column: span 2;
    }
    .inventoryEditForm > div:nth-child(4),
    .inventoryEditForm > div:nth-child(5) {
      grid-column: span 3;
    }
    .inventoryEditForm .wide {
      grid-column: 1 / -1;
    }
    .inventoryEditForm label {
      display: block;
      margin: 0 0 7px;
      color: #65706c;
      font-size: 10.5px;
      font-weight: 850;
      letter-spacing: .03em;
    }
    .inventoryEditForm input,
    .inventoryEditForm textarea {
      width: 100%;
      min-height: 48px;
      padding: 0 13px;
      border: 1px solid var(--line);
      border-radius: 13px;
      color: var(--text);
      background: #fff;
      font-family: inherit;
      font-size: 14px;
      font-weight: 650;
      line-height: 1.35;
      box-shadow: none;
    }
    .inventoryEditForm textarea {
      min-height: 92px;
      padding-top: 13px;
      resize: vertical;
    }
    .inventoryAltBlock {
      margin-top: 4px;
      padding-top: 4px;
    }
    .inventoryAltHint {
      margin: -2px 0 10px;
      color: #7a8480;
      font-size: 11.5px;
      font-weight: 600;
      line-height: 1.4;
    }
    .inventoryAltList {
      display: grid;
      gap: 8px;
    }
    .inventoryAltEmpty {
      padding: 12px 14px;
      border: 1px dashed var(--line);
      border-radius: 12px;
      color: #8a9390;
      background: #f8f9f7;
      font-size: 12.5px;
    }
    .inventoryAltItem {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: start;
      padding: 12px 14px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #f8f9f7;
    }
    .inventoryAltText {
      color: var(--text);
      font-size: 13px;
      font-weight: 700;
      line-height: 1.35;
      word-break: break-word;
    }
    .inventoryAltActions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      justify-content: flex-end;
    }
    .inventoryAltActions button {
      min-height: 32px;
      padding: 0 10px;
      font-size: 11px;
    }
    .inventoryAltMeta {
      margin-top: 5px;
      color: #5f7a3a;
      font-size: 10.5px;
      font-weight: 750;
    }
    .inventoryAltConfirmLayer {
      position: absolute;
      inset: 0;
      z-index: 20;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(23, 32, 31, .48);
      backdrop-filter: blur(2px);
    }
    .inventoryAltConfirmLayer.hidden {
      display: none !important;
    }
    .inventoryAltConfirmCard {
      width: min(440px, 100%);
      padding: 24px 24px 20px;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 18px;
      background: #fff;
      box-shadow: 0 24px 70px rgba(0,0,0,.28);
    }
    .inventoryAltConfirmCard h3 {
      margin: 0 0 12px;
      color: var(--text);
      font-size: 20px;
      font-weight: 850;
      letter-spacing: -.03em;
    }
    .inventoryAltConfirmMessage {
      margin: 0;
      color: #53605c;
      font-size: 13.5px;
      font-weight: 600;
      line-height: 1.5;
      white-space: pre-wrap;
      word-break: break-word;
    }
    .inventoryAltConfirmActions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      margin-top: 20px;
    }
    .inventoryAltConfirmActions button {
      min-height: 44px;
      min-width: 110px;
      border-radius: 12px;
      font-size: 13px;
      font-weight: 850;
    }
    .inventoryAltConfirmActions button.danger {
      color: #fff;
      border-color: var(--bad);
      background: var(--bad);
      box-shadow: none;
    }
    .inventoryEditForm input:focus,
    .inventoryEditForm textarea:focus {
      outline: 3px solid rgba(200,240,74,.28);
      border-color: var(--focus);
      background: #fff;
    }
    .inventoryEditDialog .modalActions {
      align-items: center;
      padding: 16px 26px 22px;
      border-top: 1px solid var(--line);
      background: var(--surface-soft);
    }
    .inventoryEditDialog .modalActions button {
      min-width: 104px;
      min-height: 46px;
      border-radius: 12px;
      font-size: 13px;
      font-weight: 900;
      box-shadow: none;
    }
    .inventoryEditDialog .modalActions button:not(.ghost) {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    @media (max-width: 860px) {
      .deliveryEditForm {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .inventoryEditForm {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .inventoryEditForm > div,
      .inventoryEditForm > div:nth-child(4),
      .inventoryEditForm > div:nth-child(5) {
        grid-column: span 1;
      }
      .inventoryEditForm .wide {
        grid-column: 1 / -1;
      }
    }
    @media (max-width: 620px) {
      .modalOverlay {
        padding-top: 18px;
      }
      .deliveryEditForm {
        grid-template-columns: 1fr;
      }
      .inventoryEditDialog .modalBody h2 {
        min-height: 80px;
        padding-left: 20px;
        font-size: 22px;
      }
      .inventoryEditDialog .modalBody h2::before {
        left: 20px;
      }
      .inventoryEditDialog .modalMessage,
      .inventoryEditDialog .modalActions {
        padding-left: 20px;
        padding-right: 20px;
      }
      .inventoryEditForm {
        grid-template-columns: 1fr;
      }
      .inventoryEditForm > div,
      .inventoryEditForm > div:nth-child(4),
      .inventoryEditForm > div:nth-child(5),
      .inventoryEditForm .wide {
        grid-column: 1 / -1;
      }
    }
    .deliveryPanel {
      max-width: none;
    }
    #deliveryTab {
      padding-bottom: 88px;
    }
    .deliveryV4Page {
      width: 100%;
    }
    .deliveryV4PageHead {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 24px;
    }
    .deliveryV4Eyebrow {
      margin: 0 0 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .deliveryV4Title {
      margin: 0;
      color: var(--text);
      font-size: 40px;
      line-height: 1;
      letter-spacing: -.045em;
    }
    .deliveryV4Step {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 700;
      white-space: nowrap;
    }
    .deliveryV4Step b {
      color: var(--text);
    }
    .deliveryV4Card {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .deliveryV4CardHead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 22px 25px;
      border-bottom: 1px solid var(--line);
    }
    .deliveryV4CardHead h2 {
      margin: 0;
      font-size: 16px;
      line-height: 1.2;
    }
    .deliveryV4CardHead p {
      margin: 5px 0 0;
      color: var(--muted);
      font-size: 11px;
    }
    .deliveryV4Status {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      min-height: 28px;
      padding: 7px 9px;
      border-radius: 8px;
      color: var(--green);
      background: var(--green-soft);
      font-size: 10px;
      font-weight: 850;
      white-space: nowrap;
    }
    .deliveryV4Status::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: currentColor;
    }
    .deliveryV4Status.waiting {
      color: #7a8380;
      background: #edf0ed;
    }
    .deliveryV4Status.warn {
      color: var(--warn);
      background: var(--warn-soft);
    }
    .deliveryV4Upload {
      display: grid;
      grid-template-columns: 54px minmax(0, 1fr) auto;
      align-items: center;
      gap: 14px;
      margin: 22px 25px 0;
      padding: 15px;
      border: 1px solid #d3dad6;
      border-radius: 13px;
      background: #fafbf9;
    }
    .deliveryV4FileIcon {
      width: 44px;
      height: 44px;
      display: grid;
      place-items: center;
      border-radius: 11px;
      color: var(--sidebar);
      background: var(--acid);
      font-size: 9px;
      font-weight: 900;
      text-transform: uppercase;
    }
    .deliveryV4FileName {
      overflow: hidden;
      color: var(--text);
      font-size: 13px;
      font-weight: 800;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .deliveryV4FileMeta {
      margin-top: 5px;
      color: var(--muted);
      font-size: 10px;
      line-height: 1.35;
    }
    .deliveryV4Change,
    .deliveryV4Button {
      height: 42px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 15px;
      border: 1px solid var(--line);
      border-radius: 10px;
      color: var(--text);
      background: #fff;
      font-size: 11px;
      font-weight: 780;
      line-height: 1;
      white-space: nowrap;
      cursor: pointer;
    }
    .deliveryV4Change {
      height: 37px;
      padding: 0 12px;
      font-size: 10.5px;
    }
    .deliveryV4ButtonDark {
      color: #fff;
      border-color: var(--sidebar);
      background: var(--sidebar);
    }
    .deliveryV4Button:hover:not(:disabled),
    .deliveryV4Change:hover {
      filter: brightness(.96);
    }
    .deliveryV4FileInput {
      position: absolute;
      width: 1px !important;
      height: 1px !important;
      padding: 0 !important;
      border: 0 !important;
      opacity: 0;
      pointer-events: none;
    }
    .deliveryV4Content {
      padding: 23px 25px 25px;
    }
    .deliveryV4SectionTitle {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 15px;
    }
    .deliveryV4SectionTitle h3 {
      margin: 0;
      font-size: 14px;
    }
    .deliveryV4SectionTitle p {
      margin: 5px 0 0;
      color: var(--muted);
      font-size: 10.5px;
    }
    .deliveryV4Auto {
      color: var(--green);
      font-size: 10px;
      font-weight: 780;
      white-space: nowrap;
    }
    .deliveryV4Settings {
      display: grid;
      grid-template-columns: 170px minmax(0, 1fr);
      gap: 14px;
      margin-bottom: 20px;
      padding: 15px;
      border-radius: 12px;
      background: #f5f7f4;
    }
    .deliveryV4Field label,
    .deliveryV4Mapping label {
      display: block;
      margin: 0 0 7px;
      color: #59635f;
      font-size: 10px;
      font-weight: 780;
    }
    .deliveryV4Control {
      width: 100%;
      height: 43px;
      min-height: 43px;
      padding: 0 12px;
      border: 1px solid #d4dbd7;
      border-radius: 10px;
      outline: 0;
      color: var(--text);
      background: #fff;
      font-size: 12px;
    }
    .deliveryV4Hint {
      display: flex;
      align-items: center;
      color: var(--muted);
      font-size: 10px;
      line-height: 1.45;
    }
    .deliveryV4Hint b {
      color: var(--text);
    }
    .deliveryV4MappingGrid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
    }
    .deliveryV4Mapping {
      position: relative;
      padding: 15px;
      border: 1px solid var(--line);
      border-radius: 13px;
      background: #fff;
    }
    .deliveryV4Mapping:hover {
      border-color: #aeb8b3;
    }
    .deliveryV4MapTop {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 11px;
    }
    .deliveryV4MapLabel {
      color: var(--text);
      font-size: 11.5px;
      font-weight: 800;
    }
    .deliveryV4Required {
      color: var(--bad);
    }
    .deliveryV4Detected {
      color: #85908b;
      font: 700 9px Consolas, monospace;
    }
    .deliveryV4SelectWrap {
      position: relative;
    }
    .deliveryV4SelectWrap::after {
      content: "⌄";
      position: absolute;
      right: 13px;
      top: 13px;
      color: #84908a;
      font-size: 10px;
      pointer-events: none;
    }
    .deliveryV4Mapping select {
      appearance: none;
      padding-right: 34px;
      font-weight: 730;
    }
    .deliveryV4Example {
      display: flex;
      align-items: center;
      gap: 6px;
      min-width: 0;
      margin-top: 9px;
      color: #8a938f;
      font-size: 9px;
    }
    .deliveryV4Example span {
      overflow: hidden;
      padding: 4px 6px;
      border-radius: 6px;
      background: #f3f5f3;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .deliveryV4MappingWarn {
      border-color: #e5c48d;
      background: #fffaf3;
    }
    .deliveryV4MappingWarn .deliveryV4MapLabel {
      color: #8b520e;
    }
    .deliveryV4MappingWarn select {
      border-color: #dfbc83;
    }
    .deliveryV4Warning {
      margin-top: 8px;
      color: var(--warn);
      font-size: 9px;
      font-weight: 700;
    }
    .deliveryV4Checkline {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      margin-top: 20px;
      padding: 16px 17px;
      border: 1px solid #dbe1dd;
      border-radius: 12px;
      background: #f8faf8;
    }
    .deliveryV4CheckInfo {
      display: flex;
      align-items: center;
      gap: 11px;
      min-width: 0;
    }
    .deliveryV4CheckIcon {
      width: 31px;
      height: 31px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 9px;
      color: var(--green);
      background: var(--green-soft);
      font-weight: 900;
    }
    .deliveryV4CheckInfo strong {
      display: block;
      font-size: 11.5px;
    }
    .deliveryV4CheckInfo span {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-size: 9.5px;
      line-height: 1.35;
    }
    .deliveryV4CheckActions {
      display: flex;
      gap: 8px;
      flex: 0 0 auto;
    }
    .deliveryV4Footnote {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin-top: 17px;
      padding-top: 17px;
      border-top: 1px solid var(--line);
      color: var(--muted);
      font-size: 10px;
      line-height: 1.55;
    }
    .deliveryV4InfoIcon {
      width: 19px;
      height: 19px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 6px;
      color: #fff;
      background: #7d8883;
      font-size: 9px;
      font-weight: 900;
    }
    .deliveryV4Footnote b {
      color: var(--text);
    }
    .deliveryV4Footnote #deliveryCapabilityInfo {
      margin-top: 4px;
    }
    .deliveryV4FilePreview {
      margin-top: 18px;
    }
    .deliveryV4Preview {
      margin-top: 18px;
    }
    .deliveryV4Preview .deliveryV4CardHead {
      padding: 18px 22px;
    }
    .deliveryV4PreviewBody {
      padding: 18px 22px;
    }
    .deliveryV4PreviewStats {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 1px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: var(--line);
    }
    .deliveryV4PreviewStat {
      padding: 13px 15px;
      background: #fff;
    }
    .deliveryV4PreviewStat label {
      display: block;
      margin: 0;
      color: var(--muted);
      font-size: 9px;
      font-weight: 780;
      text-transform: uppercase;
    }
    .deliveryV4PreviewStat strong {
      display: block;
      margin-top: 7px;
      color: var(--text);
      font-size: 19px;
      line-height: 1;
    }
    .deliveryV4PreviewStat strong.ok {
      color: var(--green);
    }
    .deliveryV4PreviewStat strong.warn {
      color: var(--warn);
    }
    .deliveryV4Result {
      padding-bottom: 10px;
    }
    .deliveryV4ResultBack {
      margin-bottom: 12px;
    }
    .deliveryV4ResultTable {
      margin-top: 12px;
      border-radius: 18px;
      box-shadow: var(--shadow);
    }
    .deliveryIntro {
      display: block;
    }
    .deliveryFileRow {
      display: grid;
      grid-template-columns: minmax(0, 1fr) max-content;
      gap: 14px;
      align-items: center;
    }
    .deliveryFileRow button {
      white-space: nowrap;
    }
    .deliveryColumnGrid {
      display: grid;
      grid-template-columns: repeat(5, minmax(120px, 1fr));
      gap: 10px;
      margin-top: 12px;
    }
    .deliveryColumnGrid label {
      margin-top: 0;
    }
    .deliveryHint {
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid var(--line);
    }
    .deliveryResultActions,
    .deliveryStickyBar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
    }
    .deliveryResultActions {
      margin: 12px 0;
      padding: 10px 12px;
    }
    .deliveryActionText {
      min-width: 0;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.35;
    }
    .deliveryActionText b {
      display: block;
      color: var(--text);
      font-size: 14px;
    }
    .deliveryActionButtons {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .deliveryStickyBar {
      position: fixed;
      left: 50%;
      right: auto;
      bottom: 18px;
      transform: translateX(-50%);
      width: min(1480px, calc(100% - 64px));
      z-index: 60;
      padding: 12px 14px;
      box-shadow: 0 18px 55px rgba(30, 45, 40, .18);
    }
    .orderFormPanel {
      max-width: none;
      border: 0;
      padding: 0;
      background: transparent;
    }
    .nativeCarrierSelect {
      display: none;
    }
    .carrierPicker {
      position: relative;
    }
    .carrierPickerButton {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      width: 100%;
      min-height: 40px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
      color: var(--text);
      text-align: left;
      font-weight: 700;
    }
    .carrierPickerButton:hover:not(:disabled) {
      filter: none;
      border-color: var(--focus);
    }
    .carrierPickerValue {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }
    .carrierLogo {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      min-width: 46px;
      height: 24px;
      border-radius: 6px;
      background: #eef2f6;
      color: #344054;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: 0;
      padding: 0 7px;
    }
    .carrierPickerText {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .carrierChevron {
      color: var(--muted);
      font-size: 14px;
    }
    .carrierMenu {
      display: none;
      position: absolute;
      left: 0;
      right: 0;
      top: calc(100% + 6px);
      z-index: 120;
      max-height: 330px;
      overflow: auto;
      padding: 6px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 18px 38px rgba(17, 24, 39, .18);
    }
    .carrierPicker.open .carrierMenu {
      display: grid;
      gap: 4px;
    }
    .carrierOption {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      min-height: 38px;
      padding: 7px 8px;
      border: 1px solid transparent;
      border-radius: 7px;
      background: #fff;
      color: var(--text);
      text-align: left;
      font-weight: 700;
    }
    .carrierOption:hover,
    .carrierOption.active {
      background: #f8fafc;
      border-color: #d0d5dd;
      filter: none;
    }
    .carrierOption small {
      display: block;
      margin-top: 1px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 400;
    }
    .dashboardGrid {
      display: grid;
      grid-template-columns: 1.1fr 1fr 1fr;
      gap: 18px;
      align-items: start;
    }
    .dashboardGrid.twoCols {
      grid-template-columns: 1fr 1fr;
    }
    .sectionBox {
      min-height: 180px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      padding: 20px;
      box-shadow: var(--shadow);
    }
    .sectionBox.dangerBox {
      border-color: var(--bad-line);
      background: #fffbfa;
    }
    .sectionTitle {
      margin-bottom: 12px;
      color: #344054;
      font-size: 13px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    .quickActions {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }
    .quickActions button {
      width: 100%;
    }
    .dashboardView {
      display: grid;
      gap: 20px;
    }
    .archiveView {
      display: grid;
      gap: 16px;
    }
    .archiveSummary {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 22px 24px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      color: #fff;
      background: var(--sidebar);
      box-shadow: var(--shadow);
    }
    .archiveSummary h2 {
      margin: 4px 0 5px;
      color: #fff;
      font-size: 24px;
      letter-spacing: -.035em;
    }
    .archiveSummary p {
      margin: 0;
      max-width: 620px;
      color: #aeb8b4;
      font-size: 12.5px;
      line-height: 1.45;
    }
    .archiveKicker {
      color: var(--acid);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .archiveSummary strong {
      min-width: 66px;
      height: 54px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      color: #fff;
      background: var(--bad);
      font-size: 24px;
      font-weight: 900;
    }
    .archiveList {
      display: grid;
      gap: 10px;
    }
    .archiveItem {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: 0 10px 30px rgba(30,45,40,.05);
    }
    .archiveItem summary {
      display: grid;
      grid-template-columns: 150px minmax(0, 1fr) 220px;
      gap: 14px;
      align-items: center;
      min-height: 58px;
      padding: 12px 16px;
      cursor: pointer;
      list-style: none;
    }
    .archiveItem summary::-webkit-details-marker {
      display: none;
    }
    .archiveType {
      width: max-content;
      padding: 6px 9px;
      border-radius: 9px;
      color: var(--bad);
      background: var(--bad-soft);
      font-size: 10px;
      font-weight: 900;
      white-space: nowrap;
    }
    .archiveMain {
      overflow: hidden;
      color: var(--text);
      font-size: 13px;
      font-weight: 850;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .archiveMeta {
      color: var(--muted);
      font-size: 11px;
      font-weight: 760;
      text-align: right;
    }
    .archiveItem pre {
      max-height: 360px;
      margin: 0;
      padding: 14px 16px;
      overflow: auto;
      border-top: 1px solid var(--line);
      background: #f7f9f7;
      color: #27312e;
      font: 11px/1.45 "SFMono-Regular", Consolas, monospace;
      white-space: pre-wrap;
    }
    .dashboardHero {
      display: grid;
      grid-template-columns: 1.28fr .72fr;
      min-height: 250px;
      overflow: hidden;
      border-radius: var(--radius);
      background: var(--sidebar);
      box-shadow: var(--shadow);
    }
    .dashboardHeroMain {
      position: relative;
      padding: 30px;
      color: #fff;
      overflow: hidden;
    }
    .dashboardHeroMain::after {
      content: "";
      position: absolute;
      width: 260px;
      height: 260px;
      right: -70px;
      top: -100px;
      border: 1px solid rgba(200,240,74,.17);
      border-radius: 50%;
      box-shadow: 0 0 0 42px rgba(200,240,74,.035), 0 0 0 84px rgba(200,240,74,.025);
    }
    .dashboardEyebrow {
      margin: 0 0 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .dashboardHero .dashboardEyebrow {
      color: #9eaaa5;
    }
    .dashboardHeroTitle {
      max-width: 620px;
      margin: 0 0 13px;
      font-size: 30px;
      line-height: 1.08;
      letter-spacing: -.04em;
    }
    .dashboardHeroTitle span {
      color: var(--acid);
    }
    .dashboardHeroCopy {
      max-width: 580px;
      margin: 0;
      color: #abb5b1;
      font-size: 13px;
      line-height: 1.55;
    }
    .dashboardHeroActions {
      display: flex;
      gap: 10px;
      margin-top: 27px;
      position: relative;
      z-index: 1;
    }
    .dashboardHeroStats {
      display: grid;
      grid-template-columns: 1fr 1fr;
      background: var(--sidebar-2);
      border-left: 1px solid rgba(255,255,255,.07);
    }
    .dashboardHeroStat {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 24px;
      border-right: 1px solid rgba(255,255,255,.07);
      border-bottom: 1px solid rgba(255,255,255,.07);
    }
    .dashboardHeroStat:nth-child(even) {
      border-right: 0;
    }
    .dashboardHeroStat:nth-last-child(-n+2) {
      border-bottom: 0;
    }
    .dashboardHeroStat span {
      color: #99a49f;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .09em;
      text-transform: uppercase;
    }
    .dashboardHeroStat strong {
      margin-top: 9px;
      color: #fff;
      font-size: 29px;
      line-height: 1;
      font-weight: 820;
      letter-spacing: -.04em;
    }
    .dashboardHeroStat small {
      margin-left: 4px;
      color: #99a49f;
      font-size: 11px;
      font-weight: 650;
    }
    .dashboardButtonAcid {
      border-color: var(--acid);
      background: var(--acid);
      color: var(--sidebar);
      min-height: 46px;
      padding: 0 20px;
    }
    .dashboardButtonGhost {
      min-height: 46px;
      color: #fff;
      border-color: #46514d;
      background: transparent;
    }
    .dashboardLayout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 360px;
      gap: 20px;
      align-items: start;
    }
    .dashboardMainCol,
    .dashboardSideCol {
      display: grid;
      gap: 20px;
    }
    .dashboardCard {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      overflow: hidden;
    }
    .dashboardCardHead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 21px 23px;
      border-bottom: 1px solid var(--line);
    }
    .dashboardCardHead h3 {
      margin: 0;
      font-size: 15px;
      letter-spacing: -.02em;
    }
    .dashboardCardHead p {
      margin: 4px 0 0;
      color: var(--muted);
      font-size: 11px;
    }
    .dashboardLink {
      border: 0;
      color: var(--text);
      background: transparent;
      font-size: 11px;
      font-weight: 800;
      min-height: 0;
      padding: 0;
    }
    .dashboardQueue {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
    }
    .dashboardQueueItem {
      position: relative;
      min-height: 142px;
      padding: 21px;
      border-right: 1px solid var(--line);
    }
    .dashboardQueueItem:last-child {
      border-right: 0;
    }
    .dashboardQueueLabel {
      display: flex;
      align-items: center;
      gap: 7px;
      color: var(--muted);
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .06em;
      text-transform: uppercase;
    }
    .dashboardQueueDot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #9aa49f;
    }
    .dashboardQueueValue {
      margin-top: 14px;
      font-size: 31px;
      font-weight: 840;
      letter-spacing: -.045em;
    }
    .dashboardQueueMeta {
      margin-top: 8px;
      color: var(--muted);
      font-size: 10.5px;
    }
    .dashboardQueueItem.hot { background: #fcfff3; }
    .dashboardQueueItem.hot .dashboardQueueDot { background: var(--acid); box-shadow: 0 0 0 4px rgba(200,240,74,.22); }
    .dashboardQueueItem.warn { background: #fffaf2; }
    .dashboardQueueItem.warn .dashboardQueueDot { background: var(--warn); }
    .dashboardQueueItem.bad { background: #fff8f7; }
    .dashboardQueueItem.bad .dashboardQueueDot { background: var(--bad); }
    .dashboardOperations {
      padding: 4px 22px 10px;
    }
    .dashboardOperation {
      display: grid;
      grid-template-columns: 46px 1.35fr .75fr .65fr 100px;
      align-items: center;
      gap: 15px;
      min-height: 72px;
      border-bottom: 1px solid #e9ece9;
    }
    .dashboardOperation:last-child {
      border-bottom: 0;
    }
    .dashboardOpIcon {
      width: 36px;
      height: 36px;
      display: grid;
      place-items: center;
      border-radius: 10px;
      color: var(--ok);
      background: var(--ok-soft);
      font-size: 13px;
      font-weight: 900;
    }
    .dashboardOpIcon.amber { color: var(--warn); background: var(--warn-soft); }
    .dashboardOpIcon.red { color: var(--bad); background: var(--bad-soft); }
    .dashboardOpTitle { font-size: 12.5px; font-weight: 760; }
    .dashboardOpSub { margin-top: 4px; color: var(--muted); font-size: 10.5px; }
    .dashboardOpOwner { display: flex; align-items: center; gap: 8px; color: #4d5855; font-size: 11px; font-weight: 680; }
    .dashboardMiniAvatar { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #53605c; font-size: 8px; font-weight: 850; }
    .dashboardProgressNum { font-size: 11px; font-weight: 760; }
    .dashboardBar { height: 5px; margin-top: 7px; overflow: hidden; border-radius: 99px; background: #e9ede9; }
    .dashboardBar i { display: block; height: 100%; border-radius: inherit; background: var(--ok); }
    .dashboardTime { color: var(--muted); font-size: 10.5px; text-align: right; }
    .dashboardAttention { padding: 8px 20px 15px; }
    .dashboardAlertRow { display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 12px; padding: 13px 3px; border-bottom: 1px solid #e9ece9; }
    .dashboardAlertRow:last-child { border-bottom: 0; }
    .dashboardAlertIcon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--warn); background: var(--warn-soft); font-weight: 900; }
    .dashboardAlertIcon.red { color: var(--bad); background: var(--bad-soft); }
    .dashboardAlertTitle { font-size: 11.5px; font-weight: 760; }
    .dashboardAlertSub { margin-top: 3px; color: var(--muted); font-size: 10px; }
    .dashboardAlertCount { min-width: 31px; padding: 6px 8px; border-radius: 8px; color: var(--text); background: #eff2ef; font-size: 11px; font-weight: 850; text-align: center; }
    .dashboardLoad { padding: 22px; }
    .dashboardLoadHead { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 18px; }
    .dashboardLoadHead strong { font-size: 28px; letter-spacing: -.04em; }
    .dashboardLoadHead span { color: var(--muted); font-size: 10px; font-weight: 700; }
    .dashboardChart { height: 132px; display: flex; align-items: flex-end; gap: 8px; padding-top: 8px; border-bottom: 1px solid var(--line); }
    .dashboardColumn { flex: 1; position: relative; height: var(--h); border-radius: 5px 5px 0 0; background: #dfe5e1; }
    .dashboardColumn.active { background: var(--sidebar); }
    .dashboardColumn.current { background: var(--acid); }
    .dashboardHours { display: flex; justify-content: space-between; margin-top: 8px; color: #929a97; font-size: 9px; }
    .dashboardZones { padding: 8px 20px 15px; }
    .dashboardZone { display: grid; grid-template-columns: 28px 1fr 44px; align-items: center; gap: 10px; padding: 12px 2px; border-bottom: 1px solid #e9ece9; }
    .dashboardZone:last-child { border-bottom: 0; }
    .dashboardZoneCode { font: 800 11px Consolas, monospace; }
    .dashboardZoneName { font-size: 10.5px; font-weight: 690; }
    .dashboardZoneBar { height: 5px; margin-top: 6px; border-radius: 99px; background: #e8ece9; overflow: hidden; }
    .dashboardZoneBar i { display: block; height: 100%; background: var(--ok); border-radius: inherit; }
    .dashboardZone strong { text-align: right; font-size: 11px; }
    .dashboardQuickGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding: 20px; }
    .dashboardQuick { min-height: 76px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: var(--text); text-align: left; }
    .dashboardQuick:hover { border-color: #aeb8b3; background: #fbfcfa; filter: none; }
    .dashboardQuick b { display: block; font-size: 11px; }
    .dashboardQuick span { display: block; margin-top: 5px; color: var(--muted); font-size: 9.5px; line-height: 1.35; }
    .tasksV4Page {
      --tasks-panel: var(--sidebar);
      --tasks-blue: #315f9a;
      --tasks-blue-soft: #eaf1fb;
      display: grid;
      gap: 18px;
    }
    .tasksV4Quick {
      display: grid;
      grid-template-columns: minmax(280px, 1fr) 170px 155px 135px;
      gap: 9px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--tasks-panel);
      box-shadow: var(--shadow);
    }
    .tasksV4QuickInput,
    .tasksV4Quick select {
      height: 48px;
      border: 1px solid #46514d;
      border-radius: 11px;
      outline: 0;
      color: #fff;
      background: #26302d;
      font-size: 13px;
      box-shadow: none;
    }
    .tasksV4QuickInput {
      padding: 0 15px;
    }
    .tasksV4QuickInput::placeholder {
      color: #8f9b96;
    }
    .tasksV4Quick select {
      padding: 0 12px;
      color: #dce2df;
      font-size: 11px;
    }
    .tasksV4Quick select.inventoryNativeSelect {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }
    .tasksV4Quick .inventorySelect {
      position: relative;
      min-width: 0;
      width: 100%;
    }
    .tasksV4Quick .inventorySelectButton {
      width: 100%;
      height: 48px;
      min-height: 48px;
      padding: 0 34px 0 12px;
      border: 1px solid #46514d;
      border-radius: 11px;
      color: #dce2df;
      background: #26302d;
      box-shadow: none;
      font-size: 11px;
      font-weight: 760;
      line-height: 1.2;
    }
    .tasksV4Quick .inventorySelectButton::after {
      right: 14px;
      border-right-color: #9aa49f;
      border-bottom-color: #9aa49f;
    }
    .tasksV4Quick .inventorySelectButton:hover,
    .tasksV4Quick .inventorySelect.open .inventorySelectButton {
      color: #fff;
      background: #2d3834;
      filter: none;
    }
    .tasksV4Quick .inventorySelectButton:focus,
    .tasksV4Quick .inventorySelectButton:focus-visible {
      outline: none;
      border-color: rgba(200, 240, 74, .55);
      box-shadow: 0 0 0 3px rgba(200, 240, 74, .18);
    }
    .tasksV4Quick .inventorySelectMenu {
      top: calc(100% + 8px);
      right: 0;
      left: 0;
      min-width: 100%;
      border-color: #46514d;
      background: #26302d;
      box-shadow: 0 18px 45px rgba(0,0,0,.35);
    }
    .tasksV4Quick .inventorySelectOption {
      color: #dce2df;
      background: transparent;
    }
    .tasksV4Quick .inventorySelectOption:hover {
      color: #fff;
      background: #34403c;
      filter: none;
    }
    .tasksV4Quick .inventorySelectOption.active {
      color: var(--tasks-panel);
      background: var(--acid);
    }
    .tasksV4Add {
      height: 48px;
      min-height: 48px;
      border: 0;
      border-radius: 11px;
      color: var(--tasks-panel);
      background: var(--acid);
      box-shadow: none;
      font-size: 11.5px;
      font-weight: 850;
    }
    .tasksV4Summary {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 15px;
      background: var(--line);
    }
    .tasksV4Metric {
      padding: 17px 19px;
      background: #fff;
    }
    .tasksV4Metric label {
      display: block;
      margin: 0;
      color: var(--muted);
      font-size: 9.5px;
      font-weight: 800;
      letter-spacing: .07em;
      text-transform: uppercase;
    }
    .tasksV4Metric strong {
      display: block;
      margin-top: 8px;
      font-size: 23px;
      letter-spacing: -.04em;
    }
    .tasksV4Metric small {
      margin-left: 4px;
      color: var(--muted);
      font-size: 9px;
      letter-spacing: 0;
    }
    .tasksV4Metric.overdue strong {
      color: var(--bad);
    }
    .tasksV4Metric.done strong {
      color: var(--ok);
    }
    .tasksV4Layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 330px;
      gap: 20px;
      align-items: start;
    }
    .tasksV4MainCol,
    .tasksV4SideCol {
      display: grid;
      gap: 18px;
    }
    .tasksV4SideCol {
      position: sticky;
      top: 96px;
    }
    .tasksV4Card {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .tasksV4MainCol .tasksV4Card {
      overflow: visible;
    }
    .tasksV4CardHead {
      min-height: 64px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 0 22px;
      border-bottom: 1px solid var(--line);
    }
    .tasksV4CardHead h2 {
      margin: 0;
      font-size: 14px;
    }
    .tasksV4CardHead h2 span {
      color: var(--muted);
      font-weight: 600;
    }
    .tasksV4Tabs {
      display: flex;
      gap: 5px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .tasksV4Tab {
      height: 35px;
      min-height: 35px;
      padding: 0 11px;
      border: 0;
      border-radius: 9px;
      color: var(--muted);
      background: transparent;
      box-shadow: none;
      font-size: 10.5px;
      font-weight: 780;
    }
    .tasksV4Tab.active {
      color: var(--text);
      background: #edf0ed;
    }
    .tasksV4TaskSection {
      padding: 7px 20px 10px;
    }
    .tasksV4GroupTitle {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 13px 0 6px;
      color: #7b8581;
      font-size: 9.5px;
      font-weight: 850;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .tasksV4GroupTitle::after {
      content: "";
      flex: 1;
      height: 1px;
      background: #e2e6e3;
    }
    .tasksV4GroupTitle.overdue {
      color: var(--bad);
    }
    .tasksV4Task {
      display: grid;
      grid-template-columns: 29px minmax(260px, 1fr) 115px 125px 115px 32px;
      align-items: center;
      gap: 12px;
      min-height: 76px;
      padding: 8px 2px;
      border-bottom: 1px solid #e9ece9;
      transition: background-color .15s ease, opacity .15s ease;
    }
    .tasksV4Task:last-child {
      border-bottom: 0;
    }
    .tasksV4Task:hover {
      background: #fafbf9;
    }
    .tasksV4Task.overdue {
      margin: 0 -20px;
      padding-left: 20px;
      padding-right: 20px;
      background: #fffafa;
    }
    .tasksV4Check {
      appearance: none;
      width: 22px;
      height: 22px;
      display: grid;
      place-content: center;
      margin: 0;
      border: 1.5px solid #b7c0bc;
      border-radius: 7px;
      background: #fff;
      cursor: pointer;
    }
    .tasksV4Check:checked {
      border-color: var(--ok);
      background: var(--ok);
    }
    .tasksV4Check:checked::after {
      content: "";
      width: 9px;
      height: 5px;
      border-left: 2px solid #fff;
      border-bottom: 2px solid #fff;
      transform: translateY(-1px) rotate(-45deg);
    }
    .tasksV4TaskTitle {
      font-size: 12.5px;
      font-weight: 780;
    }
    .tasksV4TaskNote {
      margin-top: 5px;
      color: var(--muted);
      font-size: 9.5px;
      line-height: 1.35;
    }
    .tasksV4Tag {
      display: inline-flex;
      width: max-content;
      padding: 6px 8px;
      border-radius: 8px;
      color: #53605b;
      background: #edf0ed;
      font-size: 9px;
      font-weight: 780;
      white-space: nowrap;
    }
    .tasksV4Tag.stock {
      color: var(--tasks-blue);
      background: var(--tasks-blue-soft);
    }
    .tasksV4Tag.order {
      color: var(--warn);
      background: var(--warn-soft);
    }
    .tasksV4Tag.clean {
      color: var(--ok);
      background: var(--ok-soft);
    }
    .tasksV4Owner {
      display: flex;
      align-items: center;
      gap: 7px;
    }
    .tasksV4MiniAvatar {
      width: 27px;
      height: 27px;
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      border-radius: 50%;
      color: #fff;
      background: #53605c;
      font-size: 7.5px;
      font-weight: 850;
    }
    .tasksV4Owner div {
      font-size: 10px;
      font-weight: 730;
    }
    .tasksV4Owner small {
      display: block;
      margin-top: 3px;
      color: var(--muted);
      font-size: 8.5px;
    }
    .tasksV4Due {
      font-size: 10px;
      font-weight: 750;
    }
    .tasksV4Due small {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-size: 8.5px;
    }
    .tasksV4Due.late {
      color: var(--bad);
    }
    .tasksV4Menu {
      width: 31px;
      height: 31px;
      min-height: 31px;
      padding: 0;
      border: 1px solid transparent;
      border-radius: 9px;
      color: #697270;
      background: transparent;
      box-shadow: none;
      font-size: 17px;
    }
    .tasksV4Menu:hover {
      border-color: var(--line);
      background: #f4f6f4;
      filter: none;
    }
    .tasksV4MenuWrap {
      position: relative;
      display: inline-flex;
      justify-content: flex-end;
    }
    .tasksV4MenuPanel {
      position: absolute;
      right: 0;
      top: calc(100% + 7px);
      z-index: 8;
      display: grid;
      gap: 4px;
      min-width: 170px;
      padding: 7px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #fff;
      box-shadow: 0 18px 42px rgba(30,45,40,.18);
      opacity: 0;
      pointer-events: none;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease;
    }
    .tasksV4MenuWrap.open .tasksV4Menu {
      border-color: var(--line);
      background: #eef1ee;
      color: var(--text);
    }
    .tasksV4MenuWrap.open .tasksV4MenuPanel {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }
    .tasksV4MenuAction {
      width: 100%;
      min-height: 34px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 0 10px;
      border: 0;
      border-radius: 8px;
      color: var(--text);
      background: transparent;
      font-size: 12px;
      font-weight: 820;
      box-shadow: none;
      text-align: left;
    }
    .tasksV4MenuAction:hover {
      background: #f4f6f4;
      filter: none;
    }
    .tasksV4MenuAction.done {
      color: var(--ok);
      background: var(--ok-soft);
    }
    .tasksV4MenuAction.done:hover {
      background: #dff3e9;
    }
    .tasksV4Task.completed {
      opacity: .58;
    }
    .tasksV4Task.completed .tasksV4TaskTitle {
      text-decoration: line-through;
    }
    .tasksV4Task.completed .tasksV4TaskNote {
      display: none;
    }
    .tasksV4ShowCompleted {
      width: 100%;
      height: 41px;
      margin-top: 10px;
      border: 1px dashed #cbd2ce;
      border-radius: 10px;
      color: #5f6966;
      background: #fafbf9;
      box-shadow: none;
      font-size: 10.5px;
      font-weight: 780;
    }
    .tasksV4SideCard {
      padding: 20px 22px;
    }
    .tasksV4SideCard h3,
    .tasksV4NoteCard h3 {
      margin: 0 0 17px;
      font-size: 13px;
    }
    .tasksV4Person {
      display: grid;
      grid-template-columns: 31px 1fr auto;
      align-items: center;
      gap: 9px;
      padding: 11px 0;
      border-top: 1px solid #e8ece9;
    }
    .tasksV4Person:first-child {
      padding-top: 0;
      border-top: 0;
    }
    .tasksV4Person .tasksV4MiniAvatar {
      width: 31px;
      height: 31px;
    }
    .tasksV4PersonName {
      font-size: 10.5px;
      font-weight: 760;
    }
    .tasksV4PersonMeta {
      margin-top: 4px;
      color: var(--muted);
      font-size: 8.8px;
    }
    .tasksV4PersonCount {
      min-width: 27px;
      padding: 6px 7px;
      border-radius: 8px;
      background: #edf0ed;
      font-size: 10px;
      font-weight: 850;
      text-align: center;
    }
    .tasksV4PersonCount.hot {
      color: var(--bad);
      background: var(--bad-soft);
    }
    .tasksV4FilterList {
      display: grid;
      gap: 6px;
    }
    .tasksV4FilterItem {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      min-height: 34px;
      padding: 9px 10px;
      border: 0;
      border-radius: 9px;
      color: #59635f;
      background: transparent;
      box-shadow: none;
      font-size: 10.5px;
      font-weight: 710;
      text-align: left;
    }
    .tasksV4FilterItem.active {
      color: var(--text);
      background: #edf0ed;
      font-weight: 800;
    }
    .tasksV4FilterItem b {
      font-size: 9px;
    }
    .tasksV4FilterItem.active b {
      padding: 3px 6px;
      border-radius: 99px;
      background: var(--acid);
    }
    .tasksV4NoteCard {
      padding: 20px 22px;
      color: #fff;
      border: 0;
      background: var(--tasks-panel);
    }
    .tasksV4NoteCard h3 {
      color: #fff;
    }
    .tasksV4NoteCard p {
      margin: 0;
      color: #aeb8b4;
      font-size: 10px;
      line-height: 1.55;
    }
    .tasksV4NoteCard button {
      width: 100%;
      height: 39px;
      min-height: 39px;
      margin-top: 15px;
      border: 1px solid #48534f;
      border-radius: 10px;
      color: #fff;
      background: #28322f;
      box-shadow: none;
      font-size: 10px;
      font-weight: 780;
    }
    .tasksV4Toast {
      position: fixed;
      right: 26px;
      bottom: 26px;
      z-index: 900;
      display: none;
      align-items: center;
      gap: 11px;
      min-height: 48px;
      max-width: min(380px, calc(100vw - 34px));
      padding: 13px 17px;
      border: 1px solid rgba(200,240,74,.42);
      border-radius: 13px;
      color: #fff;
      background: #17211e;
      box-shadow: 0 20px 48px rgba(13,20,18,.34);
      font-size: 13px;
      font-weight: 830;
      line-height: 1.25;
    }
    .tasksV4Toast.show {
      display: flex;
    }
    .tasksV4Toast::before {
      content: "";
      width: 20px;
      height: 20px;
      display: grid;
      place-items: center;
      border-radius: 6px;
      background: var(--acid);
      box-shadow: 0 0 0 4px rgba(200,240,74,.13);
      background-image:
        linear-gradient(45deg, transparent 52%, #17211e 52%, #17211e 64%, transparent 64%),
        linear-gradient(-45deg, transparent 43%, #17211e 43%, #17211e 55%, transparent 55%);
      background-size: 11px 8px, 15px 8px;
      background-position: 4px 9px, 8px 8px;
      background-repeat: no-repeat;
    }
    .listPreview {
      display: grid;
      gap: 8px;
    }
    .scrollPreview {
      max-height: 300px;
      overflow: auto;
      padding-right: 4px;
    }
    .previewItem {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 12px 0;
      border-bottom: 1px solid #e7ebe8;
      font-size: 13px;
    }
    .previewItem:last-child {
      border-bottom: 0;
    }
    .previewMain {
      min-width: 0;
      font-weight: 800;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .previewMeta {
      margin-top: 3px;
      color: var(--muted);
      font-size: 12px;
    }
    .filePreview {
      margin-top: 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      overflow: hidden;
    }
    .filePreviewHeader {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      border-bottom: 1px solid var(--line);
      background: var(--surface-soft);
      color: #53605c;
      font-size: 12px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    .filePreviewBody {
      max-height: min(62vh, 620px);
      overflow: auto;
    }
    .filePreview table {
      min-width: 900px;
      font-size: 12px;
    }
    .filePreview th,
    .filePreview td {
      padding: 7px 8px;
      max-width: 260px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: center;
    }
    .filePreview td.nameColumnCell {
      text-align: left;
    }
    .filePreview .rowNumber {
      width: 56px;
      color: var(--muted);
      text-align: right;
      background: #f8fafc;
      font-weight: 800;
    }
    .filePreview .columnLetter {
      display: block;
      text-align: center;
      color: var(--blue);
      font-weight: 900;
    }
    .filePreview .mappedColumn {
      background: #eff4ff;
    }
    .filePreview .selectableColumn {
      cursor: pointer;
    }
    .filePreview .selectableColumn:hover {
      background: #dbeafe;
    }
    .filePreview .activeTargetColumn {
      background: var(--ok-soft);
    }
    .filePreviewHint {
      color: var(--muted);
      font-size: 12px;
      font-weight: 600;
      text-transform: none;
      letter-spacing: 0;
    }
    .columnInputActive {
      outline: 3px solid rgba(21, 94, 239, .22);
      border-color: var(--blue) !important;
    }
    .searchBar {
      display: grid;
      grid-template-columns: minmax(220px, 1fr);
      gap: 10px;
      margin: 12px 0;
    }
    .searchBar label {
      margin-top: 0;
    }
    .status {
      display: inline-block;
      padding: 4px 9px;
      border-radius: 999px;
      font-size: 11px;
      background: var(--chip);
      color: var(--text);
      margin: 2px 0;
      font-weight: 850;
      line-height: 1.15;
    }
    .status.ok { background: var(--ok-soft); color: var(--ok); }
    .status.bad { background: var(--bad-soft); color: var(--bad); }
    .status.warn { background: var(--warn-soft); color: var(--warn); }
    table {
      width: 100%;
      min-width: 820px;
      border-collapse: collapse;
      font-size: 13px;
      background: #fff;
    }
    th, td {
      border-bottom: 1px solid var(--line);
      padding: 11px 14px;
      vertical-align: top;
      text-align: left;
    }
    th {
      position: sticky;
      top: 0;
      background: var(--surface-soft);
      z-index: 1;
      white-space: nowrap;
      color: #7a8380;
      font-size: 10px;
      text-transform: uppercase;
      letter-spacing: .09em;
      font-weight: 800;
    }
    td.num, th.num { text-align: right; }
    tr.bad td { background: #fff8f7; }
    tr.warn td { background: #fffaf2; }
    tr.done td { color: #6f7875; background: #fbfcfa; }
    tr:hover td { background: #fafbf9; }
    tr.deliveryRowNew td { background: #f8fafc; }
    tr.deliveryRowFound td { background: var(--ok-soft); }
    tr.deliveryRowColorMismatch td { background: var(--warn-soft); }
    tr.deliveryRowError td { background: var(--bad-soft); }
    tr.deliveryRowNew:hover td { background: #f1f5f9; }
    tr.deliveryRowFound:hover td { background: var(--ok-soft); }
    tr.deliveryRowColorMismatch:hover td { background: var(--warn-soft); }
    tr.deliveryRowError:hover td { background: var(--bad-soft); }
    #deliveryTable th.deliveryLocationCol,
    #deliveryTable td.deliveryLocationCol {
      min-width: 118px;
      padding-left: 16px;
      padding-right: 16px;
    }
    #deliveryTable th.deliveryTotalCol,
    #deliveryTable td.deliveryTotalCol {
      min-width: 70px;
      padding-left: 16px;
      padding-right: 16px;
    }
    #deliveryTable th,
    #deliveryTable td {
      text-align: center;
      vertical-align: middle;
    }
    #deliveryTable th.deliveryNameCol,
    #deliveryTable td.deliveryNameCol {
      text-align: left;
      vertical-align: top;
    }
    .deliveryNameCell,
    .inventoryNameCell {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 24px;
      gap: 8px;
      align-items: start;
    }
    .deliveryEditBtn,
    .inventoryEditBtn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 24px;
      height: 24px;
      min-width: 24px;
      min-height: 24px;
      padding: 0;
      border: 1px solid transparent;
      border-radius: 999px;
      background: rgba(21, 94, 239, .08);
      color: var(--blue);
      cursor: pointer;
      font-size: 13px;
      line-height: 1;
      box-shadow: none;
      transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
    }
    .deliveryEditBtn:hover,
    .inventoryEditBtn:hover {
      border-color: rgba(21, 94, 239, .22);
      background: rgba(21, 94, 239, .14);
      color: #0f4fd6;
      filter: none;
      transform: translateY(-1px);
    }
    .deliveryEditBtn svg,
    .inventoryEditBtn svg {
      width: 14px;
      height: 14px;
      display: block;
      stroke: currentColor;
      stroke-width: 2.2;
      stroke-linecap: round;
      stroke-linejoin: round;
      fill: none;
      transform: scaleX(-1);
    }
    .inventoryCatalogView {
      display: grid;
      gap: 14px;
    }
    .inventoryCatalogSummary {
      display: grid;
      grid-template-columns: minmax(260px, 1.3fr) repeat(4, minmax(150px, .7fr));
      overflow: hidden;
      color: #fff;
      background: var(--sidebar);
      border-radius: 18px;
      box-shadow: var(--shadow);
    }
    .inventorySummaryMain,
    .inventoryCatalogMetric {
      min-width: 0;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .inventorySummaryMain {
      padding: 22px 24px;
    }
    .inventoryCatalogMetric {
      padding: 20px 18px;
    }
    .inventoryCatalogMetric:last-child {
      border-right: 0;
    }
    .inventorySummaryLabel,
    .inventoryMetricLabel {
      color: #a8b3af;
      font-size: 10px;
      font-weight: 850;
      letter-spacing: .1em;
      text-transform: uppercase;
    }
    .inventorySummaryLabel {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 9px;
    }
    .inventoryLiveDot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--acid);
      box-shadow: 0 0 0 5px rgba(200,240,74,.11);
    }
    .inventorySummaryTitle {
      font-size: 23px;
      font-weight: 850;
      letter-spacing: -.035em;
      line-height: 1.1;
    }
    .inventorySummaryTitle span {
      color: var(--acid);
    }
    .inventoryMetricValue {
      margin-top: 8px;
      font-size: 25px;
      font-weight: 850;
      letter-spacing: -.04em;
      line-height: 1;
    }
    .inventoryMetricValue small {
      margin-left: 3px;
      color: #96a19d;
      font-size: 10px;
      font-weight: 700;
    }
    .inventoryCatalogToolbar {
      display: grid;
      grid-template-columns: minmax(260px, 430px) minmax(0, 1fr);
      gap: 10px;
      align-items: center;
    }
    .inventoryCatalogSearch {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 11px;
      height: 50px;
      margin: 0;
      padding: 0 16px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: 0 8px 24px rgba(30,45,40,.04);
    }
    .inventoryCatalogSearch svg {
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
      color: #77817e;
    }
    .inventoryCatalogSearch input {
      width: 100%;
      height: auto;
      padding: 0;
      border: 0;
      outline: 0;
      background: transparent;
      font-size: 14px;
    }
    .inventoryCatalogSearch input:focus {
      box-shadow: none;
    }
    .inventorySearchHotkey {
      color: #a1a8a5;
      font-size: 9px;
      font-weight: 800;
      white-space: nowrap;
    }
    .inventoryCatalogFilters {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: nowrap;
      justify-content: flex-end;
      min-width: 0;
    }
    .inventoryFilter {
      position: relative;
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      gap: 8px;
      height: 50px;
      margin: 0;
      padding: 0 11px;
      border: 1px solid var(--line);
      border-radius: 14px;
      color: #4e5956;
      background: #fff;
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
    }
    .inventoryFilter select.inventoryNativeSelect {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }
    .inventoryCatalogTools select.inventoryNativeSelect {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }
    .inventorySelect {
      position: relative;
      min-width: 112px;
    }
    .inventoryStockFilter .inventorySelect {
      min-width: 72px;
    }
    .inventoryLocationFilter .inventorySelect {
      min-width: 82px;
    }
    .inventorySortFilter .inventorySelect {
      min-width: 132px;
    }
    .inventoryRowsSelect .inventorySelect {
      min-width: 42px;
    }
    .inventorySelectButton {
      position: relative;
      width: 100%;
      height: 28px;
      min-height: 28px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 0 22px 0 0;
      border: 0;
      border-radius: 0;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      font-size: 12.5px;
      font-weight: 850;
      line-height: 1;
      text-align: left;
    }
    .inventorySelectButton::after {
      content: "";
      position: absolute;
      right: 2px;
      top: 50%;
      width: 7px;
      height: 7px;
      border-right: 1.7px solid #6d7672;
      border-bottom: 1.7px solid #6d7672;
      transform: translateY(-65%) rotate(45deg);
    }
    .inventorySelectButton:hover,
    .inventorySelect.open .inventorySelectButton {
      color: #0f1716;
      background: transparent;
      filter: none;
    }
    .inventorySelectMenu {
      position: absolute;
      top: calc(100% + 13px);
      right: -12px;
      z-index: 90;
      display: none;
      min-width: 188px;
      max-height: 330px;
      overflow: auto;
      padding: 6px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: 0 18px 45px rgba(21,31,28,.16);
    }
    .inventorySelect.open .inventorySelectMenu {
      display: grid;
      gap: 3px;
    }
    .inventorySelectOption {
      width: 100%;
      height: 34px;
      min-height: 34px;
      justify-content: flex-start;
      padding: 0 10px;
      border: 0;
      border-radius: 9px;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      font-size: 12px;
      font-weight: 780;
      text-align: left;
    }
    .inventorySelectOption:hover {
      background: var(--surface-soft);
      filter: none;
    }
    .inventorySelectOption.active {
      color: var(--sidebar);
      background: var(--acid);
    }
    .inventoryCatalogButton {
      flex: 0 0 auto;
      height: 50px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 13px;
      border: 1px solid var(--line);
      border-radius: 14px;
      color: var(--text);
      background: #fff;
      font-size: 12px;
      font-weight: 850;
      white-space: nowrap;
      box-shadow: none;
    }
    .inventoryCatalogButton svg {
      width: 16px;
      height: 16px;
    }
    .inventoryCatalogButton.dark {
      color: #fff;
      border-color: var(--sidebar);
      background: var(--sidebar);
    }
    .inventoryCatalogButton.acid {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .inventoryCatalogButton.warehouseGlobalButton {
      border-color: #d69a28;
      color: #1b211f;
      box-shadow: 0 10px 24px rgba(177, 117, 24, .13);
    }
    .inventoryCatalogButton.warehouseGlobalButton svg {
      color: currentColor;
    }
    .inventoryCatalogButton.warehouseGlobalButtonImport {
      background: linear-gradient(180deg, #ffd66a 0%, #f2b43a 100%);
    }
    .inventoryCatalogButton.warehouseGlobalButtonExport {
      background: #fff8e8;
    }
    .inventoryCatalogButton.warehouseGlobalButton:hover:not(:disabled) {
      border-color: #ba7f18;
      filter: none;
      transform: translateY(-1px);
      box-shadow: 0 14px 28px rgba(177, 117, 24, .18);
    }
    .inventoryCatalog {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 18px;
      background: #fff;
      box-shadow: var(--shadow);
    }
    .inventoryCatalogHead {
      min-height: 62px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 0 22px;
      border-bottom: 1px solid var(--line);
    }
    .inventoryCatalogResult {
      font-size: 13.5px;
      font-weight: 850;
    }
    .inventoryCatalogResult span {
      color: var(--muted);
      font-weight: 700;
    }
    .inventoryCatalogTools {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
    }
    .inventoryCatalogTool {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: 7px;
      height: 34px;
      padding: 0 11px;
      border: 1px solid var(--line);
      border-radius: 9px;
      color: var(--text);
      background: #eef1ee;
      font-size: 11px;
      font-weight: 850;
    }
    .inventoryCatalogTableWrap {
      max-height: max(640px, calc(100vh - 300px));
      min-height: 600px;
      overflow: auto;
    }
    .inventoryCatalogTable {
      min-width: 1360px;
      table-layout: fixed;
      font-size: 13px;
    }
    .inventoryCatalogTable th {
      padding-top: 13px;
      padding-bottom: 13px;
      text-align: center;
      font-size: 10.5px;
    }
    .inventoryCatalogTable th:first-child,
    .inventoryCatalogTable td:first-child {
      padding-left: 22px;
    }
    .inventoryCatalogTable th:last-child,
    .inventoryCatalogTable td:last-child {
      padding-right: 22px;
    }
    .inventoryCatalogTable td {
      height: auto;
      min-height: 68px;
      padding: 10px 12px;
      vertical-align: middle;
      text-align: center;
    }
    .inventoryCatalogTable tbody tr:hover td {
      background: #fafbf9;
    }
    .inventoryCatalogTable tbody tr.inventoryRowLow td {
      background: #fffaf3;
    }
    .inventoryCatalogTable tbody tr.inventoryRowZero td {
      background: #fbfbfa;
    }
    .inventoryCatalogTable tbody tr.inventoryRowZero .inventoryProductName,
    .inventoryCatalogTable tbody tr.inventoryRowZero .inventoryCode {
      color: #89918e;
    }
    .inventoryCatalogTable tbody tr.inventoryRowSelected td {
      background: #eef7d7;
    }
    .inventoryCatalogTable tbody tr.inventoryRowLow.inventoryRowSelected td,
    .inventoryCatalogTable tbody tr.inventoryRowZero.inventoryRowSelected td {
      background: #eef7d7;
    }
    .inventorySelectBox {
      appearance: none;
      -webkit-appearance: none;
      width: 19px;
      height: 19px;
      display: inline-grid;
      place-content: center;
      margin: 0;
      border: 1.5px solid #bac2bf;
      border-radius: 6px;
      background: #fff;
      cursor: pointer;
      vertical-align: middle;
    }
    .inventorySelectBox:checked {
      border-color: var(--ok);
      background: var(--ok);
    }
    .inventorySelectBox:checked:after {
      content: "";
      width: 8px;
      height: 4px;
      border-left: 2px solid #fff;
      border-bottom: 2px solid #fff;
      transform: translateY(-1px) rotate(-45deg);
    }
    .inventorySelectBox:focus-visible {
      outline: 3px solid rgba(200,240,74,.42);
      outline-offset: 2px;
    }
    .inventoryProductCell {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 6px;
      align-items: center;
      text-align: left;
      min-width: 0;
    }
    .inventoryProductName {
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;
      color: var(--text);
      font-size: 13.5px;
      font-weight: 820;
      line-height: 1.3;
      white-space: normal;
      word-break: break-word;
      overflow-wrap: anywhere;
    }
    .inventoryVariant {
      margin-top: 5px;
      color: #89928f;
      font-size: 11px;
      font-weight: 650;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .inventoryCode {
      display: block;
      color: #4f5c58;
      font: 780 12px/1.25 "SFMono-Regular", Consolas, monospace;
    }
    .inventoryBarcode {
      display: block;
      margin-top: 6px;
      color: #949c99;
      font: 650 10.5px/1.2 "SFMono-Regular", Consolas, monospace;
    }
    .inventoryLocationPill {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 78px;
      padding: 7px 9px;
      border: 1px solid #d6dcda;
      border-radius: 8px;
      color: var(--text);
      background: #fff;
      font: 850 11px/1 "SFMono-Regular", Consolas, monospace;
    }
    .inventoryLocationPill.empty {
      color: var(--bad);
      border-color: var(--bad-line);
      background: var(--bad-soft);
      font-family: inherit;
    }
    .inventoryStockValue {
      color: var(--text);
      font-size: 18px;
      font-weight: 900;
      letter-spacing: -.025em;
    }
    .inventoryStockValue small {
      margin-left: 2px;
      color: #8b9491;
      font-size: 10.5px;
      font-weight: 750;
    }
    .inventoryStockValue.low {
      color: var(--warn);
    }
    .inventoryStockValue.zero {
      color: var(--bad);
    }
    .inventoryState {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 9px;
      border-radius: 8px;
      font-size: 10px;
      font-weight: 900;
      white-space: nowrap;
    }
    .inventoryState:before {
      content: "";
      width: 5px;
      height: 5px;
      border-radius: 50%;
      background: currentColor;
    }
    .inventoryState.ok { color: var(--ok); background: var(--ok-soft); }
    .inventoryState.warn { color: var(--warn); background: var(--warn-soft); }
    .inventoryState.bad { color: var(--bad); background: var(--bad-soft); }
    .inventoryRowMenuBtn {
      width: 32px;
      height: 32px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      border: 1px solid transparent;
      border-radius: 9px;
      color: #697270;
      background: transparent;
      font-size: 17px;
      font-weight: 900;
      line-height: 1;
      box-shadow: none;
    }
    .inventoryRowMenuBtn:hover {
      border-color: var(--line);
      background: #f4f6f4;
      color: var(--text);
      filter: none;
    }
    .inventoryActionCell {
      position: relative;
    }
    .inventoryRowMenu {
      position: relative;
      display: inline-flex;
      justify-content: center;
    }
    .inventoryRowMenuPanel {
      position: absolute;
      right: 0;
      top: calc(100% + 6px);
      z-index: 5;
      min-width: 146px;
      padding: 6px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #fff;
      box-shadow: 0 16px 38px rgba(30,45,40,.16);
      opacity: 0;
      pointer-events: none;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease;
    }
    .inventoryRowMenu.open .inventoryRowMenuPanel {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }
    .inventoryRowAction {
      width: 100%;
      min-height: 34px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 0 10px;
      border: 0;
      border-radius: 8px;
      color: var(--text);
      background: transparent;
      font-size: 12px;
      font-weight: 820;
      box-shadow: none;
      text-align: left;
    }
    .inventoryRowAction:hover {
      background: #f4f6f4;
      filter: none;
    }
    .inventoryPagination {
      min-height: 66px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 0 22px;
      border-top: 1px solid var(--line);
      color: var(--muted);
      font-size: 11.5px;
      font-weight: 650;
    }
    .inventoryPages {
      display: flex;
      align-items: center;
      gap: 5px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .inventoryPageBtn {
      min-width: 31px;
      height: 31px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 9px;
      border: 1px solid var(--line);
      border-radius: 9px;
      color: #59635f;
      background: #fff;
      font-size: 11px;
      font-weight: 800;
      box-shadow: none;
    }
    .inventoryPageBtn.active {
      color: #fff;
      border-color: var(--sidebar);
      background: var(--sidebar);
    }
    .inventoryPageBtn:disabled {
      cursor: not-allowed;
      opacity: .46;
      filter: none;
    }
    .inventoryPageDots {
      min-width: 31px;
      text-align: center;
      color: var(--muted);
      font-size: 11px;
      font-weight: 900;
    }
    .inventoryBulkBar {
      position: fixed;
      left: 50%;
      bottom: 24px;
      z-index: 30;
      display: flex;
      align-items: center;
      gap: 10px;
      max-width: calc(100vw - 48px);
      padding: 9px 10px 9px 17px;
      border: 1px solid #3a4541;
      border-radius: 15px;
      color: #fff;
      background: var(--sidebar);
      box-shadow: 0 18px 45px rgba(21,31,28,.28);
      transform: translateX(-50%);
    }
    .inventoryBulkBar span {
      margin-right: 7px;
      font-size: 11.5px;
      font-weight: 800;
      white-space: nowrap;
    }
    .inventoryBulkMenu {
      position: relative;
    }
    .inventoryBulkMenuPanel {
      position: absolute;
      right: 0;
      bottom: calc(100% + 8px);
      z-index: 2;
      min-width: 150px;
      padding: 6px;
      border: 1px solid #3a4541;
      border-radius: 12px;
      background: var(--sidebar);
      box-shadow: 0 18px 45px rgba(21,31,28,.28);
      opacity: 0;
      pointer-events: none;
      transform: translateY(6px);
      transition: opacity .14s ease, transform .14s ease;
    }
    .inventoryBulkMenu.open .inventoryBulkMenuPanel {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }
    .inventoryBulkBtn {
      height: 34px;
      padding: 0 11px;
      border: 1px solid #46524e;
      border-radius: 9px;
      color: #fff;
      background: #28322f;
      font-size: 10.5px;
      font-weight: 800;
      box-shadow: none;
    }
    .inventoryBulkBtn:hover {
      border-color: #5d6b66;
      background: #34413d;
      filter: none;
    }
    .inventoryBulkBtn.acid {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .inventoryBulkBtn:disabled {
      cursor: not-allowed;
      opacity: .48;
      filter: none;
    }
    #deliveryTable .deliveryNoteCell {
      justify-content: center;
      text-align: center;
    }
    .status.deliveryStatusNew { background: #f1f5f9; color: #475569; }
    .status.deliveryStatusFound { background: var(--ok-soft); color: var(--ok); }
    .status.deliveryStatusColorMismatch { background: var(--warn-soft); color: var(--warn); }
    .status.deliveryStatusError { background: var(--bad-soft); color: var(--bad); }
    tr.deliveryDetailRow {
      cursor: pointer;
    }
    tr.deliveryDetailRow td:last-child {
      color: #344054;
    }
    tr.deliveryDetailRow.open td {
      background: #fff3d6;
    }
    tr.deliverySpoilerRow td {
      border-top: 0;
    }
    tr.deliverySpoilerRow.hidden {
      display: none;
    }
    .deliverySpoilerCell {
      background: #fffdf7 !important;
      padding: 0;
    }
    .deliveryStatusCell {
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .deliveryNoteCell {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 8px;
    }
    .deliveryNoteCell span {
      min-width: 0;
    }
    .deliveryExpandBtn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      width: 18px;
      height: 18px;
      margin-top: -1px;
      padding: 0;
      border: 0;
      border-radius: 4px;
      background: transparent;
      color: var(--warn);
      cursor: pointer;
      font-size: 12px;
      font-weight: 900;
      line-height: 1;
    }
    .deliveryExpandBtn:hover {
      background: #fde68a;
    }
    .deliveryExpandBtn[aria-expanded="true"] {
      transform: rotate(90deg);
    }
    .deliverySpoiler {
      padding: 12px 14px;
      border-top: 1px solid var(--warn-line);
      color: #344054;
      line-height: 1.35;
    }
    .deliveryCompareTable {
      width: 100%;
      min-width: 0;
      border-collapse: separate;
      border-spacing: 0;
      border: 1px solid #e4e7ec;
      border-radius: 6px;
      overflow: hidden;
      background: #fff;
    }
    .deliveryCompareTable th,
    .deliveryCompareTable td {
      padding: 8px 10px;
      border-bottom: 1px solid #eef2f6;
      vertical-align: top;
      text-align: left;
    }
    .deliveryCompareTable tr:last-child td { border-bottom: 0; }
    .deliveryCompareTable th {
      position: static;
      background: #f8fafc;
      color: #475467;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    .deliveryCompareParam {
      width: 132px;
      color: #667085;
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      background: #fbfcfe;
    }
    .deliveryCompareValue {
      width: calc((100% - 132px) / 2);
      overflow-wrap: anywhere;
      color: #111827;
      font-weight: 650;
    }
    .deliveryCompareValue.incoming { border-left: 3px solid #bfdbfe; }
    .deliveryCompareValue.existing { border-left: 3px solid #bbf7d0; }
    .deliveryCompareValue.diff {
      box-shadow: inset 0 0 0 999px rgba(244, 63, 94, .10);
      color: #9f1239;
    }
    .deliveryCompareVariant {
      margin: 10px 0 6px;
      color: #475467;
      font-size: 12px;
      font-weight: 800;
      text-transform: uppercase;
    }
    .deliveryCompareVariant:first-child { margin-top: 0; }
    .deliverySpoilerDecision {
      padding-top: 8px;
      color: var(--muted);
      font-size: 12px;
      text-align: center;
    }
    .tableWrap {
      max-height: calc(100vh - 310px);
      min-height: 360px;
      overflow: auto;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .problemsTableWrap table {
      min-width: 980px;
    }
    .problemMeta {
      margin-top: 4px;
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
    }
    .problemComment {
      margin-top: 7px;
      padding: 7px 9px;
      border: 1px solid #e8ece8;
      border-radius: 9px;
      color: #4d5855;
      background: #f8faf8;
      font-size: 11px;
      line-height: 1.35;
    }
    #problemsTab {
      max-width: 1540px;
      margin: 0 auto;
      padding-bottom: 98px;
    }
    .pcPageHead {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 24px;
      margin-bottom: 24px;
    }
    .pcEyebrow {
      margin: 0 0 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .pcPageHead h1 {
      margin: 0;
      font-size: clamp(30px, 3vw, 42px);
      line-height: 1;
      letter-spacing: -.045em;
    }
    .pcHeadActions,
    .pcFilters,
    .pcTabs,
    .pcPages {
      display: flex;
      gap: 8px;
    }
    .pcFloatingActions {
      position: fixed;
      left: 50%;
      bottom: 24px;
      z-index: 65;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      width: auto;
      max-width: calc(100vw - 48px);
      padding: 9px 10px;
      border: 1px solid #3a4541;
      border-radius: 15px;
      color: #fff;
      background: var(--sidebar);
      box-shadow: 0 18px 45px rgba(21,31,28,.28);
      transform: translateX(-50%);
    }
    #problemsTab.hidden .pcFloatingActions {
      display: none;
    }
    .pcButton {
      height: 38px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 0 14px;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 11px;
      color: var(--text);
      background: #fff;
      box-shadow: none;
      font-size: 11.5px;
      font-weight: 820;
      white-space: nowrap;
    }
    .pcButton.dark {
      color: #fff;
      border-color: rgba(255,255,255,.16);
      background: #2a3431;
    }
    .pcButton.acid {
      height: 38px;
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .pcSummary {
      display: grid;
      grid-template-columns: 1.3fr repeat(4, .7fr);
      margin-bottom: 18px;
      overflow: hidden;
      color: #fff;
      background: var(--sidebar);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }
    .pcSummaryMain {
      padding: 24px 26px;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .pcSummaryLabel {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 9px;
      color: #a8b3af;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    .pcPulse {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #ff7471;
      box-shadow: 0 0 0 5px rgba(255,116,113,.12);
    }
    .pcSummaryTitle {
      font-size: 23px;
      font-weight: 820;
      letter-spacing: -.035em;
    }
    .pcSummaryTitle span { color: #ffaaa7; }
    .pcMetric {
      padding: 22px 20px;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .pcMetric:last-child { border-right: 0; }
    .pcMetric label {
      display: block;
      margin-bottom: 8px;
      color: #96a19d;
      font-size: 9.5px;
      font-weight: 780;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .pcMetric strong {
      font-size: 25px;
      font-weight: 820;
      letter-spacing: -.04em;
    }
    .pcMetric small {
      margin-left: 3px;
      color: #96a19d;
      font-size: 10px;
      font-weight: 650;
    }
    .pcCategoryStrip {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      margin-bottom: 14px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 15px;
      background: #fff;
    }
    .pcCategory {
      min-height: 84px;
      padding: 16px 17px;
      border: 0;
      border-right: 1px solid var(--line);
      border-radius: 0;
      color: var(--text);
      background: #fff;
      box-shadow: none;
      text-align: left;
    }
    .pcCategory:last-child { border-right: 0; }
    .pcCategory.active { background: #fff8f7; }
    .pcCatTop {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    .pcCatIcon {
      width: 27px;
      height: 27px;
      display: grid;
      place-items: center;
      border-radius: 8px;
      color: #59635f;
      background: #edf0ed;
      font-size: 11px;
      font-weight: 900;
    }
    .pcCategory.active .pcCatIcon {
      color: var(--bad);
      background: var(--bad-soft);
    }
    .pcCatCount {
      font-size: 18px;
      font-weight: 840;
    }
    .pcCatName {
      margin-top: 9px;
      color: var(--muted);
      font-size: 10.5px;
      font-weight: 720;
    }
    .pcToolbar {
      display: grid;
      grid-template-columns: minmax(300px, 1fr) auto;
      gap: 12px;
      margin-bottom: 14px;
    }
    .pcSearch {
      height: 51px;
      display: flex;
      align-items: center;
      gap: 11px;
      margin: 0;
      padding: 0 16px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: 0 8px 24px rgba(30,45,40,.04);
    }
    .pcSearch svg {
      width: 18px;
      flex: 0 0 auto;
      color: #77817e;
    }
    .pcSearch input {
      width: 100%;
      height: auto;
      padding: 0;
      border: 0;
      outline: 0;
      background: transparent;
      box-shadow: none;
      font-size: 14px;
    }
    .pcSearch span {
      color: #a1a8a5;
      font-size: 9px;
      font-weight: 700;
      white-space: nowrap;
    }
    .pcFilter {
      height: 51px;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 0 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      color: #4e5956;
      background: #fff;
      box-shadow: none;
      font-size: 12px;
      font-weight: 760;
    }
    .pcFilter b {
      min-width: 20px;
      padding: 3px 6px;
      border-radius: 99px;
      color: var(--sidebar);
      background: var(--acid);
      font-size: 9px;
      text-align: center;
    }
    .pcFilter span { color: #929a97; font-size: 10px; }
    .pcWorkspace {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 365px;
      gap: 20px;
      align-items: start;
    }
    .pcCard {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .pcCardHead {
      min-height: 64px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 14px 22px;
      border-bottom: 1px solid var(--line);
    }
    .pcCardHead h2 { margin: 0; font-size: 14px; }
    .pcCardHead h2 span { color: var(--muted); font-weight: 600; }
    .pcTabs { gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
    .pcTab {
      height: 35px;
      padding: 0 11px;
      border: 0;
      border-radius: 9px;
      color: var(--muted);
      background: transparent;
      box-shadow: none;
      font-size: 10.5px;
      font-weight: 780;
    }
    .pcTab.active { color: var(--text); background: #edf0ed; }
    .pcIssues { padding: 4px 20px 10px; }
    .pcIssue {
      width: 100%;
      display: grid;
      grid-template-columns: 40px minmax(250px, 1.5fr) 120px 135px 130px 110px 34px;
      align-items: center;
      gap: 12px;
      min-height: 92px;
      padding: 0;
      border: 0;
      border-bottom: 1px solid #e9ece9;
      border-radius: 0;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      text-align: left;
    }
    .pcIssue:last-child { border-bottom: 0; }
    .pcIssue.selected {
      margin: 0 -20px;
      padding: 0 20px;
      background: #fff9f8;
      border-left: 3px solid var(--bad);
    }
    .pcSev {
      width: 34px;
      height: 34px;
      display: grid;
      place-items: center;
      border-radius: 10px;
      font-size: 12px;
      font-weight: 900;
    }
    .pcSev.critical { color: var(--bad); background: var(--bad-soft); }
    .pcSev.high { color: var(--warn); background: var(--warn-soft); }
    .pcSev.medium { color: #315f9a; background: #eaf1fb; }
    .pcSev.low { color: var(--ok); background: var(--ok-soft); }
    .pcIssueId {
      color: #8b9491;
      font: 700 9.5px Consolas, monospace;
    }
    .pcIssueTitle {
      display: block;
      margin-top: 5px;
      font-size: 12.5px;
      font-weight: 780;
    }
    .pcIssueSub {
      display: block;
      margin-top: 5px;
      color: var(--muted);
      font-size: 10px;
      line-height: 1.35;
    }
    .pcType {
      font-size: 10.5px;
      font-weight: 740;
    }
    .pcType small,
    .pcOwner small,
    .pcAge small {
      display: block;
      margin-top: 5px;
      color: var(--muted);
      font-size: 9px;
      font-weight: 600;
    }
    .pcOwner {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 10.5px;
      font-weight: 720;
    }
    .pcMiniAvatar {
      width: 28px;
      height: 28px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: #fff;
      background: #53605c;
      font-size: 8px;
      font-weight: 850;
      text-transform: uppercase;
    }
    .pcAge {
      font-size: 10.5px;
      font-weight: 740;
    }
    .pcStatus {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 8px;
      border-radius: 8px;
      font-size: 9px;
      font-weight: 850;
      white-space: nowrap;
    }
    .pcStatus::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: currentColor;
    }
    .pcStatus.new { color: var(--bad); background: var(--bad-soft); }
    .pcStatus.done { color: var(--ok); background: var(--ok-soft); }
    .pcMenu {
      width: 31px;
      height: 31px;
      display: grid;
      place-items: center;
      border-radius: 9px;
      color: #697270;
      font-size: 17px;
    }
    .pcEmpty {
      padding: 38px 20px;
      color: var(--muted);
      font-size: 13px;
      text-align: center;
    }
    .pcPagination {
      min-height: 65px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 0 22px;
      border-top: 1px solid var(--line);
      color: var(--muted);
      font-size: 10.5px;
    }
    .pcPage {
      width: 31px;
      height: 31px;
      border: 1px solid var(--line);
      border-radius: 9px;
      background: #fff;
      box-shadow: none;
      font-size: 10px;
    }
    .pcPage.active { color: #fff; border-color: var(--sidebar); background: var(--sidebar); }
    .pcDetail {
      position: sticky;
      top: 96px;
    }
    .pcDetailHero {
      padding: 23px;
      color: #fff;
      background: var(--sidebar);
    }
    .pcDetailTop {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }
    .pcDetailId {
      color: #9aa5a1;
      font: 700 10px Consolas, monospace;
    }
    .pcPriority {
      padding: 6px 8px;
      border-radius: 8px;
      color: #ffb1ae;
      background: rgba(185,51,55,.18);
      font-size: 9px;
      font-weight: 850;
      text-transform: uppercase;
    }
    .pcDetailHero h2 {
      margin: 16px 0 8px;
      font-size: 20px;
      line-height: 1.2;
      letter-spacing: -.03em;
    }
    .pcDetailHero p {
      margin: 0;
      color: #aeb8b4;
      font-size: 10.5px;
      line-height: 1.5;
    }
    .pcDetailBody { padding: 20px 22px; }
    .pcDetailSection {
      padding: 16px 0;
      border-top: 1px solid #e8ece9;
    }
    .pcDetailSection:first-child { padding-top: 0; border-top: 0; }
    .pcDetailSection h3 {
      margin: 0 0 12px;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .06em;
    }
    .pcFact {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      padding: 6px 0;
      color: var(--muted);
      font-size: 10.5px;
    }
    .pcFact strong {
      max-width: 190px;
      color: var(--text);
      text-align: right;
    }
    .pcProductCard {
      display: flex;
      align-items: center;
      gap: 11px;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 11px;
      background: #fafbf9;
    }
    .pcProductCard.danger {
      border-color: #efc8c6;
      background: #fff9f8;
    }
    .pcThumb {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      flex: 0 0 auto;
      border-radius: 10px;
      color: #67716d;
      background: #edf0ed;
      font-size: 8px;
      font-weight: 900;
    }
    .pcProductName { font-size: 11px; font-weight: 780; }
    .pcProductMeta {
      margin-top: 4px;
      color: var(--muted);
      font-size: 9px;
      line-height: 1.35;
    }
    .pcTimeline { display: grid; gap: 11px; }
    .pcEvent {
      display: grid;
      grid-template-columns: 9px 1fr;
      gap: 9px;
    }
    .pcEventDot {
      width: 8px;
      height: 8px;
      margin-top: 3px;
      border-radius: 50%;
      background: #a9b2ae;
    }
    .pcEvent:first-child .pcEventDot { background: var(--bad); }
    .pcEvent div {
      font-size: 10px;
      line-height: 1.4;
    }
    .pcEvent time {
      display: block;
      margin-top: 3px;
      color: #929a97;
      font-size: 8.5px;
    }
    .pcAction {
      width: 100%;
      height: 43px;
      margin-top: 8px;
      border: 1px solid var(--line);
      border-radius: 10px;
      color: var(--text);
      background: #fff;
      box-shadow: none;
      font-size: 10.5px;
      font-weight: 780;
    }
    .pcAction.primary { color: var(--sidebar); border-color: var(--acid); background: var(--acid); }
    .pcAction.danger { color: var(--bad); border-color: #efc8c6; background: #fffafa; }
    @media (max-width: 1420px) {
      .pcWorkspace { grid-template-columns: minmax(0, 1fr) 330px; }
      .pcIssue { grid-template-columns: 40px minmax(240px,1.5fr) 110px 125px 110px 100px 34px; }
      .pcFloatingActions .pcButton:first-child { display: none; }
    }
    @media (max-width: 1180px) {
      .pcSummary { grid-template-columns: 1fr 1fr; }
      .pcSummaryMain { grid-column: 1 / -1; }
      .pcCategoryStrip { grid-template-columns: repeat(3, 1fr); }
      .pcToolbar { grid-template-columns: 1fr; }
      .pcFilters { flex-wrap: wrap; }
      .pcWorkspace { grid-template-columns: 1fr; }
      .pcDetail { position: static; }
      .pcIssue { grid-template-columns: 40px minmax(0, 1fr) 110px 100px; }
      .pcType, .pcOwner, .pcMenu { display: none; }
    }
    @media (max-width: 720px) {
      .pcFloatingActions {
        align-items: stretch;
        flex-direction: column;
        width: calc(100% - 28px);
        bottom: 14px;
      }
      .pcFloatingActions .pcButton,
      .pcFloatingActions .pcButton:first-child {
        display: inline-flex;
        width: 100%;
      }
      .pcSummary { grid-template-columns: 1fr; }
      .pcMetric { border-top: 1px solid rgba(255,255,255,.1); border-right: 0; }
      .pcCategoryStrip { grid-template-columns: 1fr 1fr; }
      .pcCardHead { align-items: flex-start; flex-direction: column; }
      .pcIssue { grid-template-columns: 34px minmax(0, 1fr); padding: 12px 0; }
      .pcIssue.selected { padding: 12px 20px; }
      .pcAge, .pcStatus { grid-column: 2; justify-self: start; }
    }
    .hidden { display: none; }
    /* Страницы с display:grid/flex не должны перебивать скрытие вкладки */
    [data-view].hidden {
      display: none !important;
    }
    .metrics {
      display: grid;
      grid-template-columns: repeat(4, minmax(150px, 1fr));
      gap: 12px;
      margin: 0 0 18px;
    }
    .metric {
      display: inline-flex;
      flex-direction: column;
      gap: 4px;
      margin: 0;
      padding: 14px 16px;
      border-radius: 14px;
      background: var(--surface-soft);
      font-size: 12px;
      border: 1px solid var(--line);
      color: #53605c;
      min-height: 82px;
    }
    .metric b {
      display: block;
      font-size: 24px;
      color: #111827;
      line-height: 1;
      letter-spacing: -.035em;
    }
    .metric.ok b { color: var(--ok); }
    .metric.warn b { color: var(--warn); }
    .metric.bad b { color: var(--bad); }
    .metric.neutral b { color: #475569; }
    .metric.amber b { color: var(--warn); }
    .metric.ok { background: var(--ok-soft); color: var(--ok); border-color: var(--ok-line); }
    .metric.warn { background: var(--warn-soft); color: var(--warn); border-color: var(--warn-line); }
    .metric.bad { background: var(--bad-soft); color: var(--bad); border-color: var(--bad-line); }
    .metric.neutral { background: #f8fafc; color: #475569; border-color: #cbd5e1; }
    .metric.amber { background: var(--warn-soft); color: var(--warn); border-color: var(--warn-line); }
    #deliveryResultView .metrics {
      grid-template-columns: repeat(6, minmax(105px, 1fr));
      gap: 8px;
      margin-bottom: 12px;
    }
    #deliveryResultView .metric {
      min-height: 54px;
      padding: 8px 10px;
      font-size: 11px;
    }
    #deliveryResultView .metric b {
      font-size: 18px;
    }
    .compactSummary {
      display: flex;
      align-items: center;
      gap: 14px;
      flex-wrap: wrap;
      margin: 0 0 10px;
      padding: 0 0 10px;
      border-bottom: 1px solid var(--line);
      color: var(--muted);
      font-size: 12px;
    }
    .compactSummary .status {
      margin: 0;
      padding: 0;
      border-radius: 0;
      background: transparent;
      color: inherit;
      font-size: 12px;
    }
    .compactSummary .status.ok { color: var(--ok); }
    .compactSummary .status.bad { color: var(--bad); }
    .compactSummary .status.warn { color: var(--warn); }
    .pickingWorkspace {
      --pick-panel: #1c2523;
      --pick-soft: #2a3431;
      --pick-acid: var(--acid);
      --pick-radius: 18px;
    }
    .pickingBreadcrumb {
      display: none;
      align-items: center;
      gap: 8px;
      margin-bottom: 18px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 700;
    }
    .pickingBreadcrumb button {
      width: auto;
      min-height: 0;
      height: auto;
      margin: 0;
      padding: 0;
      border: 0;
      border-radius: 0;
      color: inherit;
      background: transparent;
      box-shadow: none;
      font: inherit;
      line-height: 1.2;
      text-align: left;
      cursor: pointer;
    }
    .pickingBreadcrumb button:hover {
      color: var(--text);
      filter: none;
    }
    .pickingBreadcrumb .current {
      color: var(--text);
      font-weight: 850;
    }
    .pickingHero {
      display: grid;
      grid-template-columns: 1.2fr repeat(3, .55fr);
      overflow: hidden;
      margin-bottom: 18px;
      color: #fff;
      background: var(--pick-panel);
      border-radius: var(--pick-radius);
      box-shadow: var(--shadow);
    }
    .pickingHeroMain {
      padding: 25px 27px;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .pickingEyebrow {
      margin: 0 0 8px;
      color: #9ba6a2;
      font-size: 10px;
      font-weight: 820;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    .pickingOrderTitle {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 0;
      font-size: 29px;
      line-height: 1.08;
      letter-spacing: -.04em;
    }
    .pickingOrderTitle span { color: var(--pick-acid); }
    .pickingLive {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 5px 8px;
      border-radius: 8px;
      color: #d9e0dd;
      background: rgba(255,255,255,.08);
      font-size: 9px;
      font-weight: 800;
      letter-spacing: .05em;
      text-transform: uppercase;
      white-space: nowrap;
    }
    .pickingLive::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--pick-acid);
    }
    .pickingHeroMeta {
      margin-top: 9px;
      color: #aab4b0;
      font-size: 11px;
    }
    .pickingMetric {
      padding: 24px 20px;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .pickingMetric:last-child { border-right: 0; }
    .pickingMetric label {
      display: block;
      margin-bottom: 9px;
      color: #96a19d;
      font-size: 9.5px;
      font-weight: 780;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .pickingMetric strong {
      font-size: 25px;
      letter-spacing: -.04em;
    }
    .pickingMetric small {
      margin-left: 4px;
      color: #96a19d;
      font-size: 10px;
    }
    .pickingPipeline {
      display: flex;
      align-items: center;
      gap: 0;
      margin-bottom: 18px;
      padding: 14px 18px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
    }
    .pickingPhase {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #8a938f;
      font-size: 10.5px;
      font-weight: 780;
      white-space: nowrap;
    }
    .pickingPhase i {
      width: 24px;
      height: 24px;
      display: grid;
      place-items: center;
      border-radius: 7px;
      background: #edf0ed;
      font-style: normal;
      font-size: 9px;
    }
    .pickingPhase.done { color: var(--ok); }
    .pickingPhase.done i {
      color: #fff;
      background: var(--ok);
    }
    .pickingPhase.active { color: var(--text); }
    .pickingPhase.active i {
      color: var(--pick-panel);
      background: var(--pick-acid);
    }
    .pickingPhaseLine {
      flex: 1;
      height: 1px;
      margin: 0 10px;
      background: #dce1de;
    }
    .pickingPhaseLine.done { background: #82b69e; }
    .pickingLayout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 350px;
      gap: 20px;
      align-items: start;
    }
    .pickingMainCol,
    .pickingSideCol {
      display: grid;
      gap: 18px;
    }
    .pickingSideCol {
      position: sticky;
      top: 96px;
    }
    .pickingCard {
      overflow: hidden;
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--pick-radius);
      box-shadow: var(--shadow);
    }
    .pickingCardHead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 20px 23px;
      border-bottom: 1px solid var(--line);
    }
    .pickingCardHead h2 {
      margin: 0;
      font-size: 15px;
      letter-spacing: -.02em;
    }
    .pickingCardHead p {
      margin: 4px 0 0;
      color: var(--muted);
      font-size: 10.5px;
    }
    .pickingPills {
      display: flex;
      gap: 5px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .pickingPill {
      height: 33px;
      padding: 0 10px;
      border: 0;
      border-radius: 9px;
      color: var(--muted);
      background: transparent;
      font-size: 10px;
      font-weight: 780;
      box-shadow: none;
    }
    .pickingPill.active {
      color: var(--text);
      background: #edf0ed;
    }
    .pickingCurrent {
      display: grid;
      grid-template-columns: 1fr 228px;
      color: #fff;
      background: var(--pick-panel);
    }
    .pickingCurrentInfo { padding: 25px; }
    .pickingCurrentTop {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 18px;
    }
    .pickingCurrentTag {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      color: #aeb8b4;
      font-size: 9.5px;
      font-weight: 820;
      letter-spacing: .09em;
      text-transform: uppercase;
    }
    .pickingCurrentTag::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--pick-acid);
    }
    .pickingSequence {
      color: #8f9a96;
      font: 700 10px Consolas, monospace;
    }
    .pickingLocationBig {
      margin-bottom: 10px;
      color: var(--pick-acid);
      font: 850 42px/1 Consolas, monospace;
      letter-spacing: -.04em;
    }
    .pickingWalk {
      color: #a9b3af;
      font-size: 11px;
      line-height: 1.4;
    }
    .pickingCurrentProduct {
      display: flex;
      align-items: center;
      gap: 13px;
      margin-top: 23px;
      padding-top: 20px;
      border-top: 1px solid rgba(255,255,255,.1);
    }
    .pickingThumb {
      width: 44px;
      height: 44px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 11px;
      color: var(--pick-panel);
      background: #e8ede9;
      font-size: 9px;
      font-weight: 900;
      letter-spacing: .03em;
    }
    .pickingProductName {
      font-size: 14px;
      font-weight: 800;
    }
    .pickingProductMeta {
      margin-top: 5px;
      color: #a7b1ad;
      font-size: 10px;
    }
    .pickingPickBox {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 23px;
      border-left: 1px solid rgba(255,255,255,.1);
      background: var(--pick-soft);
    }
    .pickingPickBox label {
      color: #9ca7a2;
      font-size: 9.5px;
      font-weight: 800;
      letter-spacing: .07em;
      text-transform: uppercase;
    }
    .pickingPickNumber {
      margin: 8px 0 16px;
      font-size: 36px;
      font-weight: 850;
      letter-spacing: -.05em;
    }
    .pickingPickNumber small {
      color: #9ca7a2;
      font-size: 12px;
    }
    .pickingScan {
      height: 42px;
      border: 1px solid #4b5753;
      border-radius: 10px;
      outline: 0;
      color: #fff;
      background: #202a27;
      padding: 0 11px;
      font-size: 11px;
    }
    .pickingScan::placeholder { color: #78837f; }
    .pickingConfirm {
      height: 42px;
      margin-top: 8px;
      border: 0;
      border-radius: 10px;
      color: var(--pick-panel);
      background: var(--pick-acid);
      font-size: 10.5px;
      font-weight: 850;
    }
    .pickingProgressWrap {
      padding: 17px 23px;
      border-bottom: 1px solid var(--line);
    }
    .pickingProgressMeta {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 9px;
      color: var(--muted);
      font-size: 11px;
    }
    .pickingProgressMeta strong {
      color: var(--text);
      text-align: right;
    }
    .pickingBar {
      height: 7px;
      overflow: hidden;
      border-radius: 99px;
      background: #e8ece9;
    }
    .pickingBar i {
      display: block;
      width: 0%;
      height: 100%;
      border-radius: inherit;
      background: var(--ok);
      transition: width .18s ease;
    }
    .pickingSearchLine {
      padding: 14px 23px;
      border-bottom: 1px solid var(--line);
      background: #fff;
    }
    .pickingSearchLine input {
      width: 100%;
      height: 42px;
      border: 1px solid #d8deda;
      border-radius: 11px;
      outline: 0;
      padding: 0 13px;
      background: #fff;
      color: var(--text);
      font-size: 12.5px;
    }
    .pickingSearchLine input:focus {
      border-color: #83908a;
      box-shadow: 0 0 0 3px rgba(23,32,31,.06);
    }
    .pickingTableScroll {
      overflow-x: auto;
    }
    .pickingTable {
      width: 100%;
      min-width: 960px;
      border-collapse: collapse;
      table-layout: fixed;
    }
    .pickingTable th {
      padding: 12px 10px;
      color: #7c8582;
      background: #f7f9f7;
      border-bottom: 1px solid var(--line);
      font-size: 9.5px;
      font-weight: 820;
      letter-spacing: .07em;
      text-align: left;
      text-transform: uppercase;
    }
    .pickingTable th:first-child,
    .pickingTable td:first-child { padding-left: 23px; }
    .pickingTable th:last-child,
    .pickingTable td:last-child { padding-right: 23px; }
    .pickingTable td {
      min-height: 80px;
      padding: 10px;
      border-bottom: 1px solid #e9ece9;
      overflow: hidden;
      vertical-align: middle;
    }
    .pickingTable tbody tr:last-child td { border-bottom: 0; }
    .pickingTable tbody tr:hover { background: #fafbf9; }
    .pickingTable tr.row-current { background: #fcfff3; }
    .pickingTable tr.row-problem { background: #fffaf3; }
    .pickingTable tr.row-done .pickingProductName,
    .pickingTable tr.row-done .pickingSku { color: #7f8985; }
    .pickingProduct {
      display: flex;
      align-items: center;
      gap: 11px;
      min-width: 0;
    }
    .pickingProduct > div {
      min-width: 0;
      max-width: 100%;
    }
    .pickingProduct .pickingThumb {
      width: 39px;
      height: 39px;
      color: #64706c;
      background: #f1f4f1;
    }
    .pickingProduct .pickingLineNo {
      width: 39px;
      height: 39px;
      flex: 0 0 39px;
      display: grid;
      place-items: center;
      border: 1px solid #e1e6e2;
      border-radius: 10px;
      color: #53605c;
      background: #f1f4f1;
      font-size: 11px;
      font-weight: 850;
    }
    .pickingProduct .pickingProductName {
      display: block;
      max-width: 100%;
      color: var(--text);
      line-height: 1.22;
      white-space: normal;
      overflow-wrap: anywhere;
      word-break: normal;
    }
    .pickingProduct .pickingProductMeta {
      display: block;
      max-width: 100%;
      margin-top: 5px;
      overflow: hidden;
      color: #89928f;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pickingSku {
      display: block;
      max-width: 100%;
      overflow: hidden;
      color: #53605c;
      font: 750 10.5px Consolas, monospace;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pickingLoc {
      display: inline-flex;
      max-width: 100%;
      padding: 7px 8px;
      border: 1px solid #d4dad7;
      border-radius: 8px;
      font: 800 11px Consolas, monospace;
      white-space: nowrap;
    }
    .pickingQuantity {
      font-size: 16px;
      font-weight: 850;
    }
    .pickingQuantity small {
      margin-left: 3px;
      color: #8b9491;
      font-size: 9px;
    }
    .pickingStatus {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 9px;
      border-radius: 8px;
      font-size: 9.5px;
      font-weight: 850;
      white-space: nowrap;
    }
    .pickingStatus::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: currentColor;
    }
    .pickingStatus.ok {
      color: var(--ok);
      background: var(--ok-soft);
    }
    .pickingStatus.active {
      color: #596328;
      background: #f0f8d7;
    }
    .pickingStatus.warn {
      color: var(--warn);
      background: var(--warn-soft);
    }
    .pickingStatus.bad {
      color: var(--bad);
      background: var(--bad-soft);
    }
    .pickingCheck {
      appearance: none;
      width: 22px;
      height: 22px;
      display: grid;
      place-content: center;
      margin: auto;
      border: 1.5px solid #b8c0bd;
      border-radius: 7px;
      background: #fff;
    }
    .pickingCheck:checked {
      border-color: var(--ok);
      background: var(--ok);
    }
    .pickingCheck:checked::after {
      content: "";
      width: 9px;
      height: 5px;
      border-left: 2px solid #fff;
      border-bottom: 2px solid #fff;
      transform: translateY(-1px) rotate(-45deg);
    }
    .pickingCheck:disabled {
      border-color: #e0e3e1;
      background: #ecefed;
    }
    .pickingRoute {
      padding: 22px;
      color: #fff;
      background: var(--pick-panel);
      border: 0;
    }
    .pickingRoute .pickingEyebrow { color: #96a19d; }
    .pickingNext {
      margin: 2px 0 7px;
      color: var(--pick-acid);
      font: 850 40px Consolas, monospace;
      letter-spacing: -.05em;
    }
    .pickingRouteCopy {
      color: #aab4b0;
      font-size: 11px;
      line-height: 1.5;
    }
    .pickingRouteLine {
      display: flex;
      gap: 6px;
      margin-top: 20px;
    }
    .pickingRouteLine i {
      flex: 1;
      height: 5px;
      border-radius: 99px;
      background: #3c4743;
    }
    .pickingRouteLine i.done { background: #77837e; }
    .pickingRouteLine i.active {
      height: 10px;
      margin-top: -2px;
      background: var(--pick-acid);
    }
    .pickingInfo,
    .pickingProblemBox {
      padding: 20px 22px;
    }
    .pickingInfo h3,
    .pickingProblemBox h3 {
      margin: 0 0 16px;
      font-size: 13px;
    }
    .pickingInfoRow {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      padding: 9px 0;
      border-top: 1px solid #e9ece9;
      color: var(--muted);
      font-size: 10.5px;
    }
    .pickingInfoRow:first-child { border-top: 0; }
    .pickingInfoRow strong {
      max-width: 190px;
      color: var(--text);
      text-align: right;
    }
    .pickingProblemText {
      margin-bottom: 12px;
      color: var(--muted);
      font-size: 10.5px;
      line-height: 1.45;
    }
    .pickingProblemAction {
      width: 100%;
      height: 42px;
      margin-top: 8px;
      border: 1px solid var(--line);
      border-radius: 10px;
      color: var(--text);
      background: #fff;
      font-size: 10.5px;
      font-weight: 780;
      box-shadow: none;
    }
    .pickingProblemAction.warn {
      color: var(--warn);
      border-color: #e8c999;
      background: #fffaf2;
    }
    .pickingActionbar {
      position: fixed;
      left: 50%;
      right: auto;
      bottom: 20px;
      z-index: 25;
      width: min(1480px, calc(100% - 64px));
      pointer-events: none;
      transform: translateX(-50%);
    }
    .pickingActionInner {
      min-height: 78px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      margin: auto;
      padding: 14px 16px 14px 20px;
      border: 1px solid var(--line);
      border-radius: 15px;
      background: rgba(255,255,255,.94);
      box-shadow: 0 18px 45px rgba(21,31,28,.12);
      backdrop-filter: blur(14px);
      pointer-events: auto;
    }
    .pickingSaved {
      display: flex;
      align-items: center;
      gap: 9px;
      color: var(--muted);
      font-size: 11px;
      white-space: nowrap;
    }
    .pickingSaved::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--ok);
    }
    .pickingFooterActions,
    .pickingActionbar #pickingActions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }
    .pickingBlocked {
      margin-right: 5px;
      color: var(--bad);
      font-size: 10.5px;
      font-weight: 750;
    }
    .pickingActionbar #pickingActions button {
      height: 44px;
      padding: 0 17px;
      border: 1px solid var(--line);
      border-radius: 12px;
      color: var(--text);
      background: #fff;
      font-size: 11.5px;
      font-weight: 780;
      box-shadow: none;
    }
    .pickingActionbar #pickingActions button.good {
      height: 48px;
      padding: 0 22px;
      color: var(--pick-panel);
      border-color: var(--pick-acid);
      background: var(--pick-acid);
      box-shadow: 0 8px 24px rgba(156,191,48,.18);
    }
    .pickingActionbar #pickingActions button.printMain,
    .pickingActionbar #pickingActions button.secondary {
      background: #fff;
    }
    .pickingActionbar #pickingActions button.ghost,
    .pickingActionbar #pickingActions button.danger,
    .pickingActionbar #rebuildPickingBtn,
    .pickingActionbar #clearPickingBtn {
      display: none;
    }
    .pickingActionbar #pickingActions button:disabled {
      color: #8d958f;
      border-color: #d9dfd2;
      background: #e9ece7;
      cursor: not-allowed;
    }
    @media (max-width: 1220px) {
      .pickingLayout { grid-template-columns: minmax(0, 1fr) 320px; }
      .pickingHero { grid-template-columns: 1fr repeat(3, .48fr); }
    }
    .emptyState {
      padding: 28px 16px;
      text-align: center;
      color: var(--muted);
      background: #fff;
    }
    .orderCreateGrid {
      display: grid;
      grid-template-columns: minmax(340px, .85fr) minmax(520px, 1.15fr);
      gap: 14px;
      margin-top: 14px;
      align-items: start;
    }
    .orderBox {
      border: 1px solid var(--line);
      border-radius: 8px;
      padding: 14px;
      background: #fff;
    }
    .orderModeSwitch {
      display: inline-flex;
      gap: 4px;
      padding: 4px;
      margin-bottom: 14px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: var(--surface-soft);
    }
    .orderModeSwitch button {
      min-height: 34px;
      margin: 0;
      padding: 7px 11px;
      background: transparent;
      border: 1px solid transparent;
      color: var(--muted);
      font-size: 13px;
      box-shadow: none;
    }
    .orderModeSwitch button.active {
      background: #fff;
      border-color: var(--line);
      color: var(--text);
      box-shadow: 0 8px 20px rgba(30, 45, 40, .08);
    }
    .orderModeSwitch button:hover:not(:disabled) {
      filter: none;
      background: #fff;
    }
    #bulkModeBtn {
      order: 1;
    }
    #manualModeBtn {
      order: 2;
    }
    .manualOrderGrid {
      display: grid;
      grid-template-columns: minmax(220px, 1fr) 120px;
      gap: 10px;
      align-items: end;
    }
    .manualOrderGrid label {
      margin-top: 0;
    }
    .manualAddRow {
      display: flex;
      justify-content: flex-end;
      margin-top: 10px;
    }
    .productSuggest {
      display: grid;
      gap: 6px;
      margin-top: 8px;
    }
    .suggestItem {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      width: 100%;
      padding: 9px 10px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: #f8fafc;
      color: var(--text);
      text-align: left;
      font-weight: 700;
    }
    .suggestItem:hover:not(:disabled),
    .suggestItem.active {
      border-color: #b9c1bd;
      background: var(--blue-soft);
      filter: none;
    }
    .suggestMain {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .suggestMeta {
      display: block;
      grid-column: 1 / -1;
      margin-top: 3px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 400;
    }
    .selectedProduct {
      margin-top: 10px;
      padding: 9px 10px;
      border: 1px solid #d0d5dd;
      border-radius: 8px;
      background: #f8fafc;
    }
    .manualOrderTable {
      border: 1px solid var(--line);
      border-radius: 8px;
      overflow: auto;
      max-height: calc(100vh - 420px);
      min-height: 360px;
    }
    .manualOrderTable table {
      min-width: 760px;
    }
    .manualOrderTable td,
    .manualOrderTable th {
      padding: 9px 10px;
    }
    .manualOrderTable input[type="number"] {
      width: 86px;
      min-height: 34px;
      padding: 6px 8px;
      text-align: right;
    }
    .manualOrderTable button {
      min-height: 32px;
      padding: 6px 9px;
      font-size: 12px;
    }
    .contentPanel.orderContentPanel {
      overflow: visible;
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
    }
    .contentPanel.orderContentPanel .contentBody {
      padding: 0;
    }
    .orderCreateView {
      min-width: 0;
    }
    .orderCreateSteps {
      display: flex;
      align-items: center;
      gap: 9px;
      margin-bottom: 18px;
      padding: 12px 15px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: rgba(255, 255, 255, .66);
    }
    .orderCreateStep {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #89918e;
      font-size: 10.5px;
      font-weight: 780;
      white-space: nowrap;
    }
    .orderCreateStepNo {
      width: 23px;
      height: 23px;
      display: grid;
      place-items: center;
      border: 1px solid #d7dcda;
      border-radius: 7px;
      background: #fff;
      font-size: 9px;
      font-weight: 850;
    }
    .orderCreateStep.active {
      color: var(--text);
    }
    .orderCreateStep.active .orderCreateStepNo {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .orderCreateStep.current .orderCreateStepNo {
      box-shadow: 0 0 0 4px rgba(200, 240, 74, .22);
    }
    .orderCreateStep.done {
      color: var(--text);
    }
    .orderCreateStep.done .orderCreateStepNo {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .orderCreateStepLine {
      width: 32px;
      height: 1px;
      flex: 0 0 auto;
      background: #d9dedb;
    }
    .orderCreateLayout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 350px;
      gap: 20px;
      align-items: start;
    }
    .orderCreateMain,
    .orderCreateSide {
      display: grid;
      gap: 18px;
      min-width: 0;
    }
    .orderCreateSide {
      position: sticky;
      top: 96px;
    }
    .orderCreateCard {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .orderCreateCard.orderDeliveryCard {
      overflow: visible;
      position: relative;
      z-index: 40;
    }
    .orderStepPanel {
      display: none;
    }
    .orderStepPanel.active {
      display: block;
    }
    .orderCardHead {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 21px 23px;
      border-bottom: 1px solid var(--line);
    }
    .orderSectionId {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
    }
    .orderSectionNo {
      width: 31px;
      height: 31px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 10px;
      color: var(--sidebar);
      background: var(--acid);
      font-size: 11px;
      font-weight: 850;
    }
    .orderCardHead h3 {
      margin: 0;
      font-size: 15px;
      letter-spacing: -.02em;
    }
    .orderCardHead p {
      margin: 4px 0 0;
      color: var(--muted);
      font-size: 10.5px;
    }
    .orderCardLink {
      border: 0;
      background: transparent;
      color: var(--text);
      font-size: 10.5px;
      font-weight: 800;
      box-shadow: none;
      white-space: nowrap;
    }
    .orderCardLink:hover:not(:disabled) {
      background: transparent;
      filter: none;
      text-decoration: underline;
    }
    .orderHeaderActions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }
    .orderFormBody {
      padding: 22px;
    }
    .orderFormGrid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 17px;
    }
    .orderField.full {
      grid-column: 1 / -1;
    }
    .orderField label {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin: 0 0 8px;
      color: #596460;
      font-size: 10.5px;
      font-weight: 780;
    }
    .orderField label small {
      color: #9ba29f;
      font-size: 9px;
      font-weight: 600;
    }
    .orderControl,
    #orderTab .carrierPickerButton {
      width: 100%;
      height: 46px;
      min-height: 46px;
      padding: 0 13px;
      border: 1px solid #d8deda;
      border-radius: 11px;
      outline: 0;
      color: var(--text);
      background: #fff;
      font-size: 12.5px;
      transition: .15s;
    }
    .orderControl:focus,
    #orderTab .carrierPickerButton:focus-visible {
      border-color: #83908a;
      box-shadow: 0 0 0 3px rgba(23, 32, 31, .06);
    }
    .orderControl::placeholder {
      color: #a0a7a4;
    }
    #orderTab textarea.orderControl {
      height: 142px;
      min-height: 142px;
      padding-top: 12px;
      resize: vertical;
      line-height: 1.45;
    }
    .orderSegmented {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 7px;
    }
    .orderSegment {
      height: 46px;
      min-height: 46px;
      border: 1px solid var(--line);
      border-radius: 11px;
      color: #6a7471;
      background: #fff;
      font-size: 11px;
      font-weight: 760;
      box-shadow: none;
    }
    .orderSegment.active {
      color: var(--text);
      border-color: #9ca7a2;
      background: #f0f3f0;
      box-shadow: inset 0 0 0 1px #9ca7a2;
    }
    .orderProductsBody {
      padding: 0 22px 16px;
    }
    .orderInputToolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      padding: 18px 0 10px;
    }
    .orderInputToolbar .orderModeSwitch {
      margin-bottom: 0;
    }
    .orderModeHint {
      color: var(--muted);
      font-size: 10px;
      font-weight: 700;
    }
    .orderProductSearch {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 116px auto;
      gap: 10px;
      align-items: end;
      margin-bottom: 10px;
      padding: 14px;
      border: 1px solid #cfd6d2;
      border-radius: 12px;
      background: #fafbf9;
    }
    .orderProductSearch label {
      margin: 0 0 8px;
    }
    .orderProductSearch .orderControl {
      height: 42px;
      min-height: 42px;
    }
    .orderProductSearch button {
      height: 42px;
      min-height: 42px;
      white-space: nowrap;
    }
    .orderSearchPrefix {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }
    .orderSearchPrefix svg {
      width: 18px;
      flex: 0 0 auto;
      color: #737e79;
    }
    .orderBulkPaste {
      display: grid;
      gap: 8px;
      margin-bottom: 12px;
    }
    .orderCurrentTable {
      overflow: auto;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #fff;
      min-height: 300px;
      max-height: calc(100vh - 438px);
    }
    .orderCurrentTable table {
      min-width: 900px;
      table-layout: fixed;
    }
    .orderCurrentTable th {
      padding: 10px;
      color: #7c8582;
      background: #f7f9f7;
      border-bottom: 1px solid var(--line);
      font-size: 9.5px;
      font-weight: 820;
      letter-spacing: .07em;
      text-align: left;
      text-transform: uppercase;
    }
    .orderCurrentTable td {
      height: 76px;
      padding: 10px;
      border-bottom: 1px solid #e9ece9;
      vertical-align: middle;
      font-size: 12px;
    }
    .orderCurrentTable tbody tr:last-child td {
      border-bottom: 0;
    }
    .orderProductCell {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }
    .orderLineNo {
      width: 32px;
      height: 32px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border: 1px solid #e1e6e2;
      border-radius: 9px;
      color: #64706c;
      background: #f1f4f1;
      font-size: 11px;
      font-weight: 850;
    }
    .orderProductName {
      overflow: hidden;
      font-size: 12.5px;
      font-weight: 770;
      text-overflow: ellipsis;
      white-space: normal;
      line-height: 1.25;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }
    .orderProductMeta {
      margin-top: 5px;
      overflow: hidden;
      color: #89928f;
      font-size: 9.5px;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .orderLocation {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      max-width: 100%;
      min-width: 68px;
      min-height: 32px;
      padding: 8px 10px;
      border: 1.5px solid #aeb8b3;
      border-radius: 9px;
      color: var(--text);
      background: #f3f6f3;
      font: 850 12px Consolas, monospace;
      overflow-wrap: anywhere;
      text-align: center;
    }
    .orderAvailable {
      color: var(--ok);
      font-size: 11px;
      font-weight: 800;
    }
    .orderAvailable.bad {
      color: var(--bad);
    }
    .orderCurrentTable td.num {
      text-align: center;
    }
    .orderQtyStepper {
      display: inline-grid;
      grid-template-columns: 32px 40px 32px;
      align-items: stretch;
      width: 104px;
      height: 38px;
      border: 1px solid #cfd6d2;
      border-radius: 10px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 4px 12px rgba(30, 45, 40, .04);
    }
    .orderQtyStepper button {
      width: 100%;
      height: 100%;
      min-height: 0;
      display: grid;
      place-items: center;
      padding: 0;
      border: 0;
      border-radius: 0;
      background: #f4f6f4;
      color: #4f5c58;
      font-size: 15px;
      font-weight: 760;
      line-height: 1;
      box-shadow: none;
    }
    .orderQtyStepper button:hover:not(:disabled) {
      background: #e9ede9;
      filter: none;
    }
    .orderQtyValue {
      display: grid;
      place-items: center;
      min-width: 0;
      border-left: 1px solid #dce2df;
      border-right: 1px solid #dce2df;
      background: #fff;
      color: var(--text);
      font-size: 13px;
      font-weight: 850;
      line-height: 1;
    }
    .orderRemoveBtn {
      width: 31px;
      height: 31px;
      min-height: 31px;
      padding: 0;
      border: 0;
      border-radius: 9px;
      color: #9a4a4a;
      background: transparent;
      font-size: 17px;
      box-shadow: none;
    }
    .orderRemoveBtn:hover:not(:disabled) {
      background: var(--bad-soft);
      filter: none;
    }
    .orderSummaryCard {
      color: #fff;
      border: 0;
      background: var(--sidebar);
    }
    .orderSummaryCard .orderCardHead {
      border-color: rgba(255, 255, 255, .1);
    }
    .orderSummaryCard .orderCardHead h3 {
      color: #fff;
    }
    .orderSummaryEyebrow {
      margin: 0 0 6px;
      color: #94a09b;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    .orderNumberPreview {
      color: var(--acid);
      font: 800 12px Consolas, monospace;
    }
    .orderSummaryBody {
      padding: 20px 22px;
    }
    .orderSummaryRow {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      padding: 10px 0;
      color: #aeb8b4;
      font-size: 11px;
    }
    .orderSummaryRow strong {
      color: #fff;
      font-weight: 760;
      text-align: right;
    }
    .orderSummaryRow.total {
      margin-top: 9px;
      padding-top: 17px;
      border-top: 1px solid rgba(255, 255, 255, .12);
      font-size: 13px;
    }
    .orderSummaryRow.total strong {
      color: var(--acid);
      font-size: 22px;
      letter-spacing: -.03em;
    }
    .orderReserveNote {
      margin-top: 15px;
      padding: 13px;
      border: 1px solid rgba(200, 240, 74, .22);
      border-radius: 11px;
      color: #d6dfda;
      background: rgba(200, 240, 74, .06);
      font-size: 10px;
      line-height: 1.5;
    }
    .orderReserveNote b {
      color: var(--acid);
    }
    .orderValidation {
      padding: 20px 22px;
    }
    .orderValidation h3 {
      margin: 0 0 16px;
      font-size: 13px;
    }
    .orderValidRow {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding: 10px 0;
      border-top: 1px solid #e8ece9;
    }
    .orderValidRow:first-of-type {
      border-top: 0;
    }
    .orderValidIcon {
      width: 19px;
      height: 19px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 6px;
      color: var(--ok);
      background: var(--ok-soft);
      font-size: 9px;
      font-weight: 900;
    }
    .orderValidIcon.warn {
      color: var(--warn);
      background: var(--warn-soft);
    }
    .orderValidIcon.bad {
      color: var(--bad);
      background: var(--bad-soft);
    }
    .orderValidRow div {
      font-size: 10.5px;
      font-weight: 720;
      line-height: 1.35;
    }
    .orderValidRow small {
      display: block;
      margin-top: 3px;
      color: var(--muted);
      font-size: 9px;
      font-weight: 600;
    }
    .orderCreateActionbar {
      position: sticky;
      bottom: 0;
      z-index: 25;
      margin-top: 20px;
      border: 1px solid var(--line);
      border-radius: 15px;
      background: rgba(255, 255, 255, .94);
      box-shadow: 0 18px 45px rgba(21, 31, 28, .12);
      backdrop-filter: blur(14px);
    }
    .orderActionInner {
      min-height: 78px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 14px 16px 14px 20px;
    }
    .orderDraftStatus {
      display: flex;
      align-items: center;
      gap: 9px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 650;
    }
    .orderDraftStatus::before {
      content: "";
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--ok);
    }
    .orderActions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .orderActions button {
      min-height: 44px;
    }
    .orderActions #orderNextStepBtn {
      min-height: 48px;
      padding-inline: 22px;
      border-color: var(--acid);
      background: var(--acid);
      color: var(--sidebar);
      box-shadow: 0 8px 24px rgba(156, 191, 48, .2);
    }
    .orderActions #buildBtn {
      min-height: 48px;
      padding-inline: 22px;
      border-color: var(--acid);
      background: var(--acid);
      color: var(--sidebar);
      box-shadow: 0 8px 24px rgba(156, 191, 48, .2);
    }
    .orderReviewRows {
      display: grid;
      gap: 10px;
    }
    .orderReviewRow {
      display: grid;
      grid-template-columns: 170px minmax(0, 1fr);
      gap: 14px;
      align-items: start;
      padding: 13px 0;
      border-bottom: 1px solid #e8ece9;
    }
    .orderReviewRow:last-child {
      border-bottom: 0;
    }
    .orderReviewRow span {
      color: var(--muted);
      font-size: 10px;
      font-weight: 820;
      letter-spacing: .07em;
      text-transform: uppercase;
    }
    .orderReviewRow strong {
      color: var(--text);
      font-size: 13px;
      line-height: 1.45;
    }
    .mutedCell {
      color: var(--muted);
    }
    .historyV4Page {
      max-width: 1540px;
      margin: 0 auto;
    }
    .historyV4Summary {
      display: grid;
      grid-template-columns: 1.3fr repeat(4, .7fr);
      margin-bottom: 18px;
      overflow: hidden;
      color: #fff;
      background: var(--sidebar);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }
    .historyV4SummaryMain {
      padding: 24px 26px;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .historyV4SummaryLabel {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 9px;
      color: #a8b3af;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: .11em;
      text-transform: uppercase;
    }
    .historyV4LiveDot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--acid);
      box-shadow: 0 0 0 5px rgba(200,240,74,.11);
    }
    .historyV4SummaryTitle {
      font-size: 23px;
      font-weight: 820;
      letter-spacing: -.035em;
    }
    .historyV4SummaryTitle span {
      color: var(--acid);
    }
    .historyV4Metric {
      padding: 22px 20px;
      border-right: 1px solid rgba(255,255,255,.1);
    }
    .historyV4Metric:last-child {
      border-right: 0;
    }
    .historyV4MetricLabel {
      margin-bottom: 8px;
      color: #96a19d;
      font-size: 9.5px;
      font-weight: 780;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .historyV4MetricValue {
      color: #fff;
      font-size: 25px;
      font-weight: 820;
      letter-spacing: -.04em;
    }
    .historyV4MetricValue.warn {
      color: #ffd086;
    }
    .historyV4MetricValue small {
      margin-left: 3px;
      color: #96a19d;
      font-size: 10px;
      font-weight: 650;
    }
    .historyV4Toolbar {
      display: grid;
      grid-template-columns: minmax(300px, 1fr) auto;
      gap: 12px;
      margin-bottom: 14px;
    }
    .historyV4Search {
      height: 51px;
      display: flex;
      align-items: center;
      gap: 11px;
      margin: 0;
      padding: 0 16px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      box-shadow: 0 8px 24px rgba(30,45,40,.04);
    }
    .historyV4Search svg {
      width: 18px;
      flex: 0 0 auto;
      color: #77817e;
    }
    .historyV4Search input {
      width: 100%;
      height: auto;
      min-height: 0;
      padding: 0;
      border: 0;
      outline: 0;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      font-size: 14px;
    }
    .historyV4Search span {
      color: #a1a8a5;
      font-size: 9px;
      font-weight: 700;
      white-space: nowrap;
    }
    .historyV4Filters {
      display: flex;
      gap: 8px;
      align-items: center;
    }
    .historyV4Filter {
      position: relative;
      height: 51px;
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 0;
      padding: 0 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      color: #4e5956;
      background: #fff;
      font-size: 12.5px;
      font-weight: 760;
    }
    .historyV4Filter:focus-within {
      border-color: var(--focus);
      box-shadow: 0 0 0 3px rgba(200, 240, 74, .28);
    }
    .historyV4Filter span {
      color: #929a97;
      font-size: 10px;
      white-space: nowrap;
    }
    .historyV4Filter input,
    .historyV4Filter select {
      width: auto;
      min-width: 112px;
      height: auto;
      min-height: 0;
      padding: 0;
      border: 0;
      border-radius: 0;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      font-size: 12px;
      font-weight: 820;
    }
    .historyV4Filter input[type="date"] {
      appearance: none;
      -webkit-appearance: none;
      min-width: 138px;
      color-scheme: light;
      font-family: inherit;
      font-size: 12px;
      font-weight: 820;
      line-height: 1.2;
      color: var(--text);
    }
    .historyV4Filter input[type="date"]::-webkit-calendar-picker-indicator {
      width: 16px;
      height: 16px;
      margin: 0;
      padding: 0;
      cursor: pointer;
      opacity: .55;
      filter: invert(42%) sepia(6%) saturate(320%) hue-rotate(118deg);
    }
    .historyV4Filter input[type="date"]::-webkit-calendar-picker-indicator:hover {
      opacity: .9;
    }
    .historyV4Filter input:focus,
    .historyV4Filter select:focus {
      outline: none;
      border-color: transparent;
      box-shadow: none;
    }
    .historyV4Filter select.inventoryNativeSelect {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }
    .historyV4Filter .inventorySelect {
      min-width: 128px;
    }
    .historyV4Filter .inventorySelectMenu {
      top: calc(100% + 14px);
      right: -14px;
      left: auto;
      min-width: 188px;
    }
    .historyV4Filter select {
      min-width: 128px;
    }
    .historyV4PeriodButtons {
      height: 51px;
      display: flex;
      align-items: center;
      gap: 5px;
      padding: 0 6px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
    }
    .historyV4PeriodButtons button {
      height: 35px;
      min-height: 35px;
      padding: 0 10px;
      border: 0;
      border-radius: 9px;
      color: var(--muted);
      background: transparent;
      box-shadow: none;
      font-size: 11px;
      font-weight: 760;
    }
    .historyV4PeriodButtons button:hover {
      color: var(--text);
      background: #edf0ed;
      filter: none;
    }
    .historyV4Archive {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .historyV4ArchiveHead {
      min-height: 64px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 0 22px;
      border-bottom: 1px solid var(--line);
    }
    .historyV4Result {
      color: var(--text);
      font-size: 13.5px;
      font-weight: 780;
    }
    .historyV4Result span {
      color: var(--muted);
      font-weight: 600;
    }
    .historyV4Tabs {
      display: flex;
      gap: 5px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .historyV4Tab {
      height: 35px;
      min-height: 35px;
      padding: 0 12px;
      border: 0;
      border-radius: 9px;
      color: var(--muted);
      background: transparent;
      box-shadow: none;
      font-size: 11.5px;
      font-weight: 760;
    }
    .historyV4Tab.active {
      color: var(--text);
      background: #edf0ed;
    }
    .historyV4TableScroll {
      overflow-x: auto;
    }
    #historyTable {
      width: 100%;
      min-width: 0;
      table-layout: fixed;
      border-collapse: collapse;
    }
    #historyTable th {
      padding: 13px 10px;
      color: #7a8380;
      background: #f8f9f7;
      border-bottom: 1px solid var(--line);
      font-size: 10.5px;
      font-weight: 820;
      letter-spacing: .08em;
      text-align: left;
      text-transform: uppercase;
    }
    #historyTable th:first-child,
    #historyTable td:first-child {
      padding-left: 22px;
    }
    #historyTable th:last-child,
    #historyTable td:last-child {
      padding-right: 22px;
    }
    #historyTable td {
      height: 92px;
      padding: 10px;
      border-bottom: 1px solid #e9ece9;
      vertical-align: middle;
      font-size: 13px;
    }
    #historyTable tbody tr:hover {
      background: #fafbf9;
    }
    #historyTable tbody tr:last-child td {
      border-bottom: 0;
    }
    #historyTable tr.historyV4Problem {
      background: #fffaf3;
    }
    #historyTable tr.historyV4Cancelled {
      background: #fbfbfa;
    }
    .historyV4OrderNo {
      display: block;
      color: var(--text);
      font: 800 12px Consolas, monospace;
    }
    .historyV4Source {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-top: 7px;
      color: #7f8985;
      font-size: 10px;
      font-weight: 700;
    }
    .historyV4SourceMark {
      width: 19px;
      height: 19px;
      display: grid;
      place-items: center;
      border-radius: 6px;
      color: #fff;
      background: #315f9a;
      font-style: normal;
      font-size: 7px;
      font-weight: 900;
    }
    .historyV4SourceMark.temu { background: #e95b26; }
    .historyV4SourceMark.web { background: #53605c; }
    .historyV4CustomerName {
      font-size: 13.5px;
      font-weight: 770;
    }
    .historyV4CustomerMeta,
    .historyV4ContentsMeta {
      margin-top: 6px;
      color: #8b9491;
      font-size: 10.5px;
      line-height: 1.25;
    }
    .historyV4Contents {
      font-size: 12px;
      font-weight: 750;
    }
    .historyV4Carrier,
    .historyV4Operator {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }
    .historyV4CarrierMark {
      width: 29px;
      height: 29px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border: 1px solid #dce1de;
      border-radius: 8px;
      color: #4f5a56;
      background: #f3f5f3;
      font-size: 8px;
      font-weight: 900;
    }
    .historyV4MiniAvatar {
      width: 28px;
      height: 28px;
      flex: 0 0 auto;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: #fff;
      background: #53605c;
      font-size: 8px;
      font-weight: 850;
    }
    .historyV4Carrier div,
    .historyV4Operator div {
      min-width: 0;
      font-size: 11.5px;
      font-weight: 740;
    }
    .historyV4Carrier small,
    .historyV4Operator small,
    .historyV4Date small,
    .historyV4Duration small {
      display: block;
      overflow: hidden;
      margin-top: 4px;
      color: #8b9491;
      font-size: 9.5px;
      font-weight: 600;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .historyV4Date {
      font-size: 11.5px;
      font-weight: 720;
    }
    .historyV4Duration {
      font-size: 12px;
      font-weight: 780;
    }
    .historyV4Duration.warn {
      color: var(--warn);
    }
    .historyV4Status {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 9px;
      border-radius: 8px;
      font-size: 10px;
      font-weight: 850;
      white-space: nowrap;
    }
    .historyV4Status::before {
      content: "";
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: currentColor;
    }
    .historyV4Status.ok { color: var(--ok); background: var(--ok-soft); }
    .historyV4Status.warn { color: var(--warn); background: var(--warn-soft); }
    .historyV4Status.info { color: #315f9a; background: #eaf1fb; }
    .historyV4Status.off { color: #697270; background: #edf0ee; }
    .historyV4RowMenu {
      position: relative;
      display: inline-flex;
      justify-content: center;
    }
    .historyV4Menu {
      width: 31px;
      height: 31px;
      min-height: 31px;
      padding: 0;
      border: 1px solid transparent;
      border-radius: 9px;
      color: #697270;
      background: transparent;
      box-shadow: none;
      font-size: 17px;
      line-height: 1;
    }
    .historyV4Menu:hover {
      border-color: var(--line);
      background: #f4f6f4;
      filter: none;
    }
    .historyV4MenuPanel {
      position: absolute;
      right: 0;
      top: calc(100% + 6px);
      z-index: 6;
      min-width: 150px;
      padding: 6px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: #fff;
      box-shadow: 0 16px 38px rgba(30,45,40,.16);
      opacity: 0;
      pointer-events: none;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease;
    }
    .historyV4RowMenu:hover .historyV4MenuPanel,
    .historyV4RowMenu:focus-within .historyV4MenuPanel {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }
    .historyV4MenuPanel button {
      width: 100%;
      min-height: 34px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 0 10px;
      border: 0;
      border-radius: 8px;
      color: var(--text);
      background: transparent;
      box-shadow: none;
      font-size: 12px;
      font-weight: 820;
      text-align: left;
    }
    .historyV4MenuPanel button:hover {
      background: #f4f6f4;
      filter: none;
    }
    .historyV4MenuPanel button.danger {
      color: var(--bad);
    }
    .historyV4Pagination {
      min-height: 68px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 0 22px;
      border-top: 1px solid var(--line);
      color: var(--muted);
      font-size: 11.5px;
      font-weight: 650;
    }
    .historyV4Pages {
      display: flex;
      gap: 5px;
    }
    .historyV4PageBtn {
      min-width: 31px;
      height: 31px;
      min-height: 31px;
      padding: 0 9px;
      border: 1px solid var(--line);
      border-radius: 9px;
      color: #59635f;
      background: #fff;
      box-shadow: none;
      font-size: 11px;
      font-weight: 750;
    }
    .historyV4PageBtn.active {
      color: #fff;
      border-color: var(--sidebar);
      background: var(--sidebar);
    }
    .historyActions {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .historyActions button {
      min-height: 32px;
      padding: 6px 9px;
      font-size: 12px;
      margin: 0;
    }
    .detailPage {
      display: grid;
      gap: 16px;
    }
    .detailTopbar {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 14px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--line);
    }
    .detailTopbar h2 {
      margin: 8px 0 4px;
      font-size: 24px;
      letter-spacing: 0;
    }
    .detailMeta {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.55;
    }
    .detailStats {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      color: var(--muted);
      font-size: 13px;
      padding-bottom: 12px;
      border-bottom: 1px solid var(--line);
    }
    .detailStats b {
      color: var(--text);
    }
    .detailStats .bad {
      color: var(--bad);
    }
    .detailStats .warn {
      color: var(--warn);
    }
    .detailActions {
      display: flex;
      gap: 8px;
      justify-content: flex-end;
      flex-wrap: wrap;
    }
    .detailSection {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: #fff;
      padding: 14px;
    }
    .detailSection .tableWrap {
      min-height: 420px;
      max-height: calc(100vh - 360px);
    }
    .split {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }
    .historyFilters {
      display: grid;
      grid-template-columns: minmax(300px, 1.45fr) minmax(190px, .7fr) minmax(320px, 1fr) minmax(260px, auto);
      gap: 12px;
      align-items: end;
      margin-top: 12px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--surface-soft);
    }
    .historyFilters label {
      margin: 0 0 6px;
    }
    .historyFilters input,
    .historyFilters select {
      background: #fff;
    }
    .dateRange {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }
    .periodButtons {
      display: flex;
      gap: 6px;
      align-items: center;
      flex-wrap: wrap;
    }
    .periodButtons button {
      height: 40px;
      margin: 0;
      padding: 0 12px;
      white-space: nowrap;
      background: #fff;
      border-color: var(--line);
    }
    .periodButtons button:hover:not(:disabled) {
      background: var(--blue-soft);
      border-color: #b9c1bd;
      filter: none;
    }
    .historyFilterInfo {
      margin-top: 8px;
      color: var(--muted);
      font-size: 12px;
    }
    @media (max-width: 1180px) {
      .sidebar {
        grid-template-columns: 210px minmax(0, 1fr);
        gap: 18px;
        padding: 0 24px;
      }
      .operatorMenu {
        grid-column: 1 / -1;
        justify-self: start;
        max-width: none;
        width: auto;
        padding: 8px 0 0;
        border-left: 0;
      }
      .workspace { width: calc(100% - 48px); }
      .controlPanel { position: static; }
      .metrics { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
      .dashboardGrid,
      .dashboardGrid.twoCols { grid-template-columns: 1fr; }
      .archiveSummary {
        align-items: flex-start;
        flex-direction: column;
      }
      .archiveItem summary {
        grid-template-columns: 1fr;
        gap: 7px;
      }
      .archiveMeta {
        text-align: left;
      }
      .dashboardLayout { grid-template-columns: 1fr; }
      .dashboardOperation { grid-template-columns: 46px minmax(0, 1fr) .7fr .7fr 100px; }
      .orderCreateGrid { grid-template-columns: 1fr; }
      .orderCreateLayout { grid-template-columns: minmax(0, 1fr) 320px; }
      .orderProductSearch { grid-template-columns: minmax(0, 1fr) 104px; }
      .orderProductSearch button { grid-column: 1 / -1; }
      .historyFilters { grid-template-columns: minmax(260px, 1fr) minmax(220px, 1fr); }
      .historyV4Summary { grid-template-columns: 1fr 1fr; }
      .historyV4SummaryMain { grid-column: 1 / -1; }
      .historyV4Toolbar { grid-template-columns: 1fr; }
      .historyV4Filters { flex-wrap: wrap; }
      .historyV4ArchiveHead {
        align-items: flex-start;
        flex-direction: column;
        padding: 16px 22px;
      }
      .deliveryColumnGrid { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
      .deliveryV4MappingGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .deliveryV4PageHead {
        align-items: flex-start;
        flex-direction: column;
      }
      .deliveryStickyBar {
        width: calc(100% - 48px);
      }
      .tasksV4Layout {
        grid-template-columns: minmax(0, 1fr) 300px;
      }
      .tasksV4Task {
        grid-template-columns: 29px minmax(250px, 1fr) 105px 115px 105px 32px;
      }
      .periodButtons { align-items: stretch; }
    }
    @media (max-width: 820px) {
      .appShell { display: block; }
      .sidebar {
        position: sticky;
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 10px;
        min-height: 0;
        padding: 14px;
        height: auto;
      }
      .operatorMenu {
        padding-top: 0;
        width: 100%;
        max-width: none;
      }
      .operatorPasswordGrid {
        grid-template-columns: 1fr;
      }
      .tabs {
        height: auto;
        padding-bottom: 2px;
      }
      .tab {
        min-height: 42px;
        border-radius: 10px;
        padding: 0 12px;
      }
      .tab.active {
        background: var(--blue-soft);
      }
      .tab.active::after {
        display: none;
      }
      .workspace {
        width: calc(100% - 28px);
        padding: 18px 0 96px;
      }
      .workspace > .topbar { display: block; }
      .topActions { justify-content: flex-start; margin-top: 12px; }
      .screenActions { justify-content: flex-start; margin-top: 12px; }
      .split { grid-template-columns: 1fr; }
      .deliveryIntro,
      .deliveryFileRow,
      .deliveryColumnGrid {
        grid-template-columns: 1fr;
      }
      .deliveryV4Upload,
      .deliveryV4Settings,
      .deliveryV4MappingGrid,
      .deliveryV4PreviewStats {
        grid-template-columns: 1fr;
      }
      .deliveryV4CardHead,
      .deliveryV4Checkline {
        align-items: stretch;
        flex-direction: column;
      }
      .deliveryV4CheckActions {
        width: 100%;
      }
      .deliveryV4CheckActions button,
      .deliveryV4Change,
      .deliveryV4Button {
        width: 100%;
      }
      .deliveryV4Title {
        font-size: 34px;
      }
      .deliveryV4Step {
        white-space: normal;
      }
      .deliveryResultActions,
      .deliveryStickyBar {
        align-items: stretch;
        flex-direction: column;
      }
      .deliveryStickyBar {
        left: 50%;
        right: auto;
        width: calc(100% - 28px);
        bottom: 14px;
      }
      .pickingActionbar {
        width: calc(100% - 28px);
        bottom: 14px;
      }
      .pickingActionInner {
        align-items: stretch;
        flex-direction: column;
      }
      .deliveryActionButtons {
        justify-content: stretch;
      }
      .deliveryActionButtons button {
        flex: 1;
      }
      .manualOrderGrid { grid-template-columns: 1fr; }
      .orderCreateSteps {
        overflow-x: auto;
      }
      .orderCreateLayout,
      .orderFormGrid,
      .orderProductSearch {
        grid-template-columns: 1fr;
      }
      .orderCreateSide {
        position: static;
      }
      .orderInputToolbar,
      .orderActionInner {
        align-items: stretch;
        flex-direction: column;
      }
      .orderModeSwitch,
      .orderActions {
        width: 100%;
      }
      .orderActions button,
      .orderProductSearch button {
        flex: 1;
      }
      .orderCardHead {
        align-items: flex-start;
        flex-direction: column;
      }
      .historyFilters,
      .dateRange { grid-template-columns: 1fr; }
      .historyV4Summary { grid-template-columns: 1fr; }
      .historyV4Metric {
        border-top: 1px solid rgba(255,255,255,.1);
        border-right: 0;
      }
      .historyV4Filters,
      .historyV4PeriodButtons {
        align-items: stretch;
        flex-direction: column;
      }
      .historyV4Filter,
      .historyV4PeriodButtons,
      .historyV4PeriodButtons button {
        width: 100%;
      }
      .historyV4Filter input,
      .historyV4Filter select {
        width: 100%;
      }
      .historyV4Pagination {
        align-items: flex-start;
        flex-direction: column;
        padding: 14px 22px;
      }
      .metrics { grid-template-columns: 1fr 1fr; }
      .dashboardHero { grid-template-columns: 1fr; }
      .dashboardHeroStats { border-left: 0; }
      .dashboardQueue { grid-template-columns: 1fr 1fr; }
      .dashboardOperation { grid-template-columns: 40px minmax(0, 1fr); gap: 10px; padding: 12px 0; }
      .dashboardOpOwner,
      .dashboardOperation > div:nth-child(4),
      .dashboardTime { grid-column: 2; text-align: left; }
      .dashboardQuickGrid { grid-template-columns: 1fr; }
      .tasksV4Quick {
        grid-template-columns: 1fr 1fr;
      }
      .tasksV4Layout {
        grid-template-columns: 1fr;
      }
      .tasksV4SideCol {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .tasksV4NoteCard {
        grid-column: 1 / -1;
      }
      .tasksV4Task {
        grid-template-columns: 29px minmax(220px, 1fr) 105px 115px 105px 32px;
      }
      .actionGrid { grid-template-columns: 1fr; }
    }

    .replenishPage:not(.hidden) {
      display: grid;
      gap: 18px;
    }
    .replenishLayout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 300px;
      gap: 18px;
      align-items: start;
    }
    .replenishMain,
    .replenishSide {
      display: grid;
      gap: 14px;
    }
    .replenishScanCard {
      padding: 22px;
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 18px;
      color: #fff;
      background: var(--sidebar);
      box-shadow: var(--shadow);
    }
    .replenishScanHead h3 {
      margin: 0 0 6px;
      font-size: 22px;
      letter-spacing: -.03em;
    }
    .replenishScanHead p {
      margin: 0 0 16px;
      color: #a8b3af;
      font-size: 13px;
      line-height: 1.4;
    }
    .replenishScanForm {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
    }
    .replenishScanForm input {
      width: 100%;
      height: 52px;
      min-height: 52px;
      padding: 0 16px;
      border: 1px solid #46514d;
      border-radius: 12px;
      color: #fff;
      background: #26302d;
      font-size: 16px;
      font-weight: 700;
    }
    .replenishScanForm input:focus {
      outline: none;
      border-color: rgba(200, 240, 74, .7);
      box-shadow: 0 0 0 3px rgba(200, 240, 74, .18);
    }
    .replenishGuide {
      margin-top: 16px;
      display: grid;
      gap: 10px;
    }
    .replenishGuideBar {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 10px 14px;
    }
    .replenishGuideBarLabel {
      color: #8f9b96;
      font-size: 11px;
      font-weight: 750;
      letter-spacing: .06em;
      text-transform: uppercase;
    }
    .replenishGuidePath {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }
    .replenishPathStep {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      min-height: 34px;
      padding: 0 12px 0 6px;
      border: 1px solid #3d4844;
      border-radius: 999px;
      color: #b7c0bc;
      background: #24302c;
      box-shadow: none;
      font-size: 12.5px;
      font-weight: 700;
    }
    .replenishPathStep em {
      display: grid;
      place-items: center;
      width: 22px;
      height: 22px;
      border-radius: 50%;
      color: #1c2523;
      background: #6d7873;
      font-style: normal;
      font-size: 11px;
      font-weight: 850;
    }
    .replenishPathStep.current {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .replenishPathStep.current em {
      background: rgba(28, 37, 35, .18);
    }
    .replenishPathStep.done:not(.current) {
      color: #e8eee9;
      border-color: #55635d;
      background: #2d3a35;
    }
    .replenishPathStep.done:not(.current) em {
      background: var(--acid);
    }
    .replenishPathStep:disabled {
      opacity: .42;
      cursor: default;
    }
    .replenishGuidePath > i {
      width: 10px;
      height: 1px;
      background: #4a5651;
    }
    .replenishGuidePanel {
      padding: 16px;
      border: 1px solid #3a4541;
      border-radius: 16px;
      background: #24302c;
    }
    .replenishGuidePanelHead {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 14px;
    }
    .replenishGuideTitle {
      color: #fff;
      font-size: 16px;
      font-weight: 820;
      letter-spacing: -.02em;
    }
    .replenishGuideHint {
      margin-top: 3px;
      color: #8f9b96;
      font-size: 12.5px;
    }
    .replenishGuideBack {
      flex: 0 0 auto;
      min-height: 34px;
      padding: 0 12px;
      border: 1px solid #46514d;
      border-radius: 10px;
      color: #dce2df;
      background: transparent;
      box-shadow: none;
      font-size: 12.5px;
      font-weight: 700;
    }
    .replenishGuideBack:hover {
      border-color: #6a7772;
      background: #2d3834;
      filter: none;
    }
    .replenishGuideOptions.letterGrid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
      gap: 8px;
    }
    .replenishGuideOptions.shelfGrid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
      gap: 8px;
    }
    .replenishGuideOptions.locList {
      display: grid;
      gap: 8px;
      max-height: 280px;
      overflow: auto;
      padding-right: 2px;
    }
    .replenishTile,
    .replenishShelfBtn,
    .replenishLocBtn {
      border: 1px solid #46514d;
      border-radius: 12px;
      color: #e8eee9;
      background: #1c2523;
      box-shadow: none;
      transition: border-color .15s ease, background .15s ease, transform .12s ease;
    }
    .replenishTile {
      display: grid;
      gap: 2px;
      justify-items: center;
      min-height: 68px;
      padding: 12px 8px;
    }
    .replenishTile strong {
      font-size: 20px;
      font-weight: 860;
      letter-spacing: -.03em;
      line-height: 1;
    }
    .replenishTile small,
    .replenishShelfBtn small,
    .replenishLocBtn small {
      color: #8f9b96;
      font-size: 10.5px;
      font-weight: 650;
    }
    .replenishShelfBtn {
      display: grid;
      gap: 3px;
      justify-items: start;
      min-height: 64px;
      padding: 12px 14px;
      text-align: left;
    }
    .replenishShelfBtn strong {
      font-size: 16px;
      font-weight: 820;
    }
    .replenishLocBtn {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      width: 100%;
      min-height: 56px;
      padding: 12px 14px;
      text-align: left;
    }
    .replenishLocBtn span {
      display: grid;
      gap: 2px;
      min-width: 0;
    }
    .replenishLocBtn strong {
      font-size: 14px;
      font-weight: 820;
    }
    .replenishLocBtn em {
      flex: 0 0 auto;
      color: var(--acid);
      font-style: normal;
      font-size: 12px;
      font-weight: 780;
    }
    .replenishTile:hover,
    .replenishShelfBtn:hover,
    .replenishLocBtn:hover {
      border-color: #6d7a74;
      background: #2a3531;
      filter: none;
      transform: translateY(-1px);
    }
    .replenishTile.active,
    .replenishShelfBtn.active,
    .replenishLocBtn.active {
      color: var(--sidebar);
      border-color: var(--acid);
      background: var(--acid);
    }
    .replenishTile.active small,
    .replenishShelfBtn.active small,
    .replenishLocBtn.active small,
    .replenishLocBtn.active em {
      color: rgba(28, 37, 35, .7);
    }
    .replenishGuideEmpty {
      grid-column: 1 / -1;
      padding: 28px 12px;
      color: #8f9b96;
      font-size: 13px;
      text-align: center;
    }
    .replenishScanForm button {
      height: 52px;
      min-height: 52px;
      min-width: 120px;
      border: 0;
      border-radius: 12px;
      color: var(--sidebar);
      background: var(--acid);
      font-size: 14px;
      font-weight: 900;
      box-shadow: none;
    }
    .replenishScanHint {
      margin-top: 12px;
      color: #8f9b96;
      font-size: 11.5px;
    }
    .replenishScanStatus {
      margin-top: 12px;
      color: #dce2df;
      font-size: 13px;
      line-height: 1.4;
    }
    .replenishScanStatus.error {
      color: #ffb4b0;
    }
    .replenishChoiceList {
      display: grid;
      gap: 8px;
      margin-top: 10px;
    }
    .replenishChoiceBtn {
      display: grid;
      gap: 4px;
      justify-content: start;
      width: 100%;
      padding: 12px 14px;
      border: 1px solid #46514d;
      border-radius: 12px;
      color: #fff;
      background: #26302d;
      text-align: left;
      box-shadow: none;
    }
    .replenishChoiceBtn span {
      color: #9aa49f;
      font-size: 11.5px;
    }
    .replenishListCard,
    .replenishParamsCard,
    .replenishOpsSection {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 18px;
      background: #fff;
      box-shadow: var(--shadow);
    }
    .replenishListHead,
    .replenishOpsHead {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 12px;
      padding: 18px 20px;
      border-bottom: 1px solid var(--line);
    }
    .replenishListHead h3,
    .replenishOpsHead h3,
    .replenishParamsCard h3 {
      margin: 0;
      font-size: 15px;
    }
    .replenishListHead h3 span,
    .replenishOpsHead p {
      color: var(--muted);
      font-weight: 600;
    }
    .replenishOpsHead {
      align-items: flex-start;
      flex-direction: column;
    }
    .replenishOpsHead p {
      margin: 6px 0 0;
      font-size: 12.5px;
    }
    .replenishDraftList,
    .replenishOpsList {
      padding: 10px 14px 14px;
      display: grid;
      gap: 10px;
    }
    .replenishDraftItem {
      display: grid;
      grid-template-columns: 110px minmax(0, 1.4fr) 90px 100px minmax(140px, 1fr) 36px;
      gap: 10px;
      align-items: center;
      padding: 12px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #f8f9f7;
    }
    .replenishDraftLoc strong,
    .replenishDraftName {
      display: block;
      font-size: 13px;
      font-weight: 820;
    }
    .replenishDraftLoc span,
    .replenishDraftMeta {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-size: 11px;
    }
    .replenishDraftStock {
      font-size: 12px;
      font-weight: 780;
    }
    .replenishDraftStock.low {
      color: var(--bad);
    }
    .replenishDraftQty,
    .replenishDraftSource {
      display: grid;
      gap: 4px;
      margin: 0;
      font-size: 10px;
      font-weight: 750;
      color: var(--muted);
    }
    .replenishDraftQty input,
    .replenishDraftSource select {
      width: 100%;
      min-height: 38px;
      padding: 0 10px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: #fff;
      font-size: 13px;
      font-weight: 750;
    }
    .replenishDraftRemove {
      width: 36px;
      height: 36px;
      min-height: 36px;
      border-radius: 10px;
      color: var(--bad);
      background: var(--bad-soft);
      border-color: var(--bad-line);
      font-size: 22px;
      line-height: 1;
      box-shadow: none;
    }
    .replenishSummaryCard {
      padding: 20px;
      border-radius: 18px;
      color: #fff;
      background: var(--sidebar);
      box-shadow: var(--shadow);
    }
    .replenishSummaryLabel {
      margin-bottom: 8px;
      color: #a8b3af;
      font-size: 10px;
      font-weight: 850;
      letter-spacing: .1em;
      text-transform: uppercase;
    }
    .replenishSummaryId {
      margin-bottom: 14px;
      font-size: 24px;
      font-weight: 850;
      letter-spacing: -.03em;
    }
    .replenishSummaryStats {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      margin-bottom: 14px;
    }
    .replenishSummaryStats div {
      padding: 10px 12px;
      border-radius: 12px;
      background: rgba(255,255,255,.06);
    }
    .replenishSummaryStats span {
      display: block;
      margin-bottom: 4px;
      color: #96a19d;
      font-size: 10px;
      font-weight: 700;
    }
    .replenishSummaryStats b {
      font-size: 18px;
    }
    .replenishSummaryNote {
      color: #a8b3af;
      font-size: 12px;
      line-height: 1.4;
    }
    .replenishParamsCard {
      padding: 18px;
    }
    .replenishParamsCard label {
      display: grid;
      gap: 6px;
      margin: 12px 0 0;
      font-size: 12px;
      font-weight: 750;
    }
    .replenishParamsHint {
      margin: 10px 0 0;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.4;
    }
    .replenishSideActions {
      display: grid;
      gap: 8px;
    }
    .replenishSideActions button {
      min-height: 46px;
      font-weight: 850;
    }
    .replenishOpCard {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      width: 100%;
      padding: 14px 16px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: #fff;
      text-align: left;
      box-shadow: none;
    }
    .replenishOpCard strong {
      display: block;
      font-size: 14px;
    }
    .replenishOpCard span {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-size: 12px;
    }
    .replenishOpCardStats {
      color: var(--text);
      font-size: 12.5px;
      white-space: nowrap;
    }
    .replenishDetailBar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 14px;
    }
    .replenishDetailActions {
      display: flex;
      gap: 8px;
    }
    .replenishDetailSummary {
      display: flex;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 14px;
      padding: 20px 22px;
      border-radius: 18px;
      color: #fff;
      background: var(--sidebar);
    }
    .replenishDetailSummary h2 {
      margin: 0 0 6px;
      font-size: 28px;
    }
    .replenishDetailSummary p {
      margin: 0;
      color: #a8b3af;
    }
    .replenishDetailTableWrap {
      border: 1px solid var(--line);
      border-radius: 18px;
      background: #fff;
      box-shadow: var(--shadow);
    }
    .replenishPrintSheet {
      display: none;
    }
    @media (max-width: 980px) {
      .replenishLayout {
        grid-template-columns: 1fr;
      }
      .replenishDraftItem {
        grid-template-columns: 1fr 1fr;
      }
      .replenishDraftRemove {
        grid-column: 2;
        justify-self: end;
      }
      .replenishScanForm {
        grid-template-columns: 1fr;
      }
      .replenishGuideOptions.letterGrid {
        grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
      }
      .replenishGuideOptions.shelfGrid {
        grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
      }
      .replenishLocBtn em {
        display: none;
      }
    }

    @media print {
      @page {
        margin: 10mm 9mm;
      }
      body {
        background: #fff;
        color: #000;
        font-family: 'Inter', Arial, sans-serif;
      }
      .sidebar, .topbar, label, #pickingSearch, #dashboardTab, #orderTab, #problemsTab, #tasksTab, #inventoryTab, #deliveryTab, #replenishTab, #historyTab, #maintenanceTab, #archiveTab, #summary, .screenActions {
        display: none !important;
      }
      .appShell {
        display: block;
        min-height: auto;
      }
      .workspace {
        max-width: none;
        padding: 0;
      }
      .contentPanel {
        border: 0;
        box-shadow: none;
        padding: 0;
      }
      .contentBody {
        padding: 0;
      }
      #pickingTab {
        display: block !important;
      }
      body.printReplenish #pickingTab {
        display: none !important;
      }
      body.printReplenish #replenishTab {
        display: block !important;
      }
      body.printReplenish #replenishCreateView,
      body.printReplenish #replenishDetailView {
        display: none !important;
      }
      body.printReplenish #replenishPrintSheet {
        display: block !important;
      }
      .tableWrap {
        max-height: none !important;
        overflow: visible !important;
        border: 0;
      }
      table {
        font-size: 8.5pt;
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed;
        border-collapse: collapse;
        border-top: 2px solid #111;
      }
      thead {
        display: table-header-group;
      }
      tfoot {
        display: table-footer-group;
      }
      th {
        position: static;
        background: #f2f4f7 !important;
      }
      #pickingTable th {
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
        font-size: 7pt;
        line-height: 1.15;
        color: #344054;
        text-transform: uppercase;
        letter-spacing: .02em;
      }
      th, td {
        border-bottom: 1px solid #cfd4dc;
        padding: 4.5px 5px;
        overflow-wrap: anywhere;
        word-break: normal;
        vertical-align: top;
      }
      #pickingTable th:nth-child(1),
      #pickingTable td:nth-child(1) {
        width: 6%;
      }
      #pickingTable th:nth-child(2),
      #pickingTable td:nth-child(2) {
        width: 15%;
      }
      #pickingTable th:nth-child(3),
      #pickingTable td:nth-child(3) {
        width: 37%;
      }
      #pickingTable th:nth-child(4),
      #pickingTable td:nth-child(4) {
        width: 14%;
      }
      #pickingTable th:nth-child(5),
      #pickingTable td:nth-child(5) {
        width: 14%;
      }
      #pickingTable th:nth-child(6),
      #pickingTable td:nth-child(6) {
        width: 7%;
      }
      #pickingTable th:nth-child(7),
      #pickingTable td:nth-child(7) {
        display: none !important;
      }
      #pickingTable th:nth-child(8),
      #pickingTable td:nth-child(8) {
        display: none !important;
      }
      #pickingTable th:nth-child(9),
      #pickingTable td:nth-child(9) {
        width: 7%;
        text-align: center;
      }
      button, input:not([type="checkbox"]) {
        display: none !important;
      }
      #pickingTable input[type="checkbox"] {
        display: inline-block !important;
        appearance: none;
        -webkit-appearance: none;
        width: 15px;
        height: 15px;
        border: 1.5px solid #000;
        border-radius: 2px;
        background: #fff;
      }
      #pickingTable input[type="checkbox"]:checked::after {
        content: "✓";
        display: block;
        text-align: center;
        line-height: 13px;
        font-size: 12px;
        font-weight: bold;
      }
      tr.done td {
        text-decoration: none;
        color: #000;
      }
      .printTitle {
        display: block !important;
        margin-bottom: 6px;
        padding-bottom: 4px;
        overflow: visible !important;
      }
      .printDocTop {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 14px;
        overflow: visible !important;
      }
      #printOrderTitle {
        display: inline-block;
        margin: 0;
        padding: 2px 0 0 3px;
        font-size: 18pt;
        font-weight: 780;
        line-height: 1.18;
        overflow: visible !important;
      }
      .printOrderName {
        margin-top: 4px;
        font-size: 10pt;
        font-weight: 700;
      }
      .printDocStamp {
        min-width: 34mm;
        border: 1px solid #cfd4dc;
        padding: 5px 7px;
        text-align: right;
        white-space: nowrap;
      }
      .printDocStamp span {
        display: block;
        color: #667085;
        font-size: 7pt;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
      }
      .printDocStamp b {
        display: block;
        margin-top: 2px;
        font-size: 9pt;
      }
      .printMeta {
        display: flex;
        gap: 6px;
        flex-wrap: wrap;
        margin-top: 10px;
        font-size: 8pt;
      }
      .printMeta span {
        border: 1px solid #cfd4dc;
        padding: 4px 7px;
        background: #f8fafc;
      }
      .pickingBreadcrumb,
      .pickingHero,
      .pickingPipeline,
      .pickingLayout,
      .pickingActionbar {
        display: none !important;
      }
      .printPickingTable {
        display: table !important;
        font-size: 8.5pt;
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed;
        border-collapse: collapse;
        border-top: 2px solid #111;
      }
      .printPickingTable th {
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
        font-size: 7pt;
        line-height: 1.15;
        color: #344054;
        background: #f2f4f7 !important;
        text-transform: uppercase;
        letter-spacing: .02em;
      }
      .printPickingTable th,
      .printPickingTable td {
        border-bottom: 1px solid #cfd4dc;
        padding: 4.5px 5px;
        overflow-wrap: anywhere;
        word-break: normal;
        vertical-align: top;
      }
      .printPickingTable tfoot td {
        padding: 5mm 0 0;
        border-bottom: 0;
        text-align: center;
      }
      .printFooterRule {
        display: flex;
        align-items: center;
        gap: 5mm;
        color: #111;
      }
      .printFooterRule::before,
      .printFooterRule::after {
        content: "";
        flex: 1;
        border-top: 1px solid #777;
      }
      .printFooterBadge {
        display: inline-block;
        min-width: 26mm;
        padding: 1.3mm 4mm 1.1mm;
        border: 1px solid #111;
        background: #fff;
        font-size: 7.5pt;
        font-weight: 900;
        line-height: 1;
        letter-spacing: .16em;
      }
      .printPickingTable th:nth-child(1),
      .printPickingTable td:nth-child(1) {
        width: 6%;
        text-align: right;
      }
      .printPickingTable th:nth-child(2),
      .printPickingTable td:nth-child(2) {
        width: 15%;
      }
      .printPickingTable th:nth-child(3),
      .printPickingTable td:nth-child(3) {
        width: 34%;
      }
      .printPickingTable th:nth-child(4),
      .printPickingTable td:nth-child(4) {
        width: 14%;
      }
      .printPickingTable th:nth-child(5),
      .printPickingTable td:nth-child(5) {
        width: 14%;
      }
      .printPickingTable th:nth-child(6),
      .printPickingTable td:nth-child(6) {
        width: 8%;
        text-align: center;
      }
      .printPickingTable th:nth-child(7),
      .printPickingTable td:nth-child(7),
      .printPickingTable th:nth-child(8),
      .printPickingTable td:nth-child(8) {
        display: none !important;
      }
      .printPickingTable th:nth-child(9),
      .printPickingTable td:nth-child(9) {
        width: 10%;
        text-align: center;
      }
      .printPickingTable .printZoneRow td {
        padding: 5px 6px;
        border-top: 2px solid #111;
        border-bottom: 1px solid #111;
        background: #e9e9e9 !important;
        color: #111;
        font-size: 8pt;
        font-weight: 850;
        letter-spacing: .06em;
        text-transform: uppercase;
      }
      .printPickingTable .printQty {
        display: inline-block;
        min-width: 9mm;
        padding: 1px 3px;
        text-align: center;
        font-weight: 850;
      }
      .printPickingTable .printQtyMulti {
        min-width: 12mm;
        border: 2px solid #000;
        background: #e6e6e6 !important;
        font-size: 12pt;
        line-height: 1.05;
        letter-spacing: .02em;
      }
      .printPickingTable input[type="checkbox"] {
        display: inline-block !important;
        appearance: none;
        -webkit-appearance: none;
        width: 15px;
        height: 15px;
        border: 1.5px solid #000;
        border-radius: 2px;
        background: #fff;
      }
      .printPickingTable input[type="checkbox"]:checked::after {
        content: "✓";
        display: block;
        text-align: center;
        line-height: 13px;
        font-size: 12px;
        font-weight: bold;
      }
      .metric {
        border: 1px solid #ccc;
        display: inline-block;
        min-height: 0;
      }
    }
    .printTitle {
      display: none;
    }
    .printPickingTable {
      display: none;
    }