:root {
  color-scheme: light;
  --bg: #c6ccd3;
  --chrome: #d9dde2;
  --surface: #f7f7f7;
  --surface-2: #e9edf2;
  --ink: #15181c;
  --muted: #52606c;
  --line: #aab3bd;
  --line-strong: #778491;
  --primary: #2f6f9e;
  --secondary: #1f4f82;
  --font-colour: #15181c;
  --teal: #1e5f8f;
  --green: #2f6f3a;
  --blue: #1f4f82;
  --gold: #9b6b18;
  --red: #a2382f;
  --soft-teal: #dcebf6;
  --soft-blue: #d8e4f1;
  --soft-gold: #f0e2bf;
  --soft-red: #eed5d3;
  --nav-start: #2f6f9e;
  --nav-end: #1f4f82;
  --nav-border: #153c61;
  --button-start: #2f6f9e;
  --button-end: #1e527e;
  --shadow: 0 1px 0 rgba(255, 255, 255, 0.78) inset, 0 1px 3px rgba(20, 28, 35, 0.18);
  --radius: 3px;
  --app-font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  --app-font-size: clamp(11px, calc(10.45px + 0.16vw), 13.8px);
  --app-line-height: 1.32;
  --app-gap: 10px;
  --app-pad: 10px;
  --control-min-height: clamp(28px, calc(26px + 0.28vw), 34px);
  --menu-font-size: clamp(10.5px, calc(9.9px + 0.18vw), 13.4px);
  --tab-font-size: clamp(10.5px, calc(9.9px + 0.18vw), 13.4px);
  --kpi-height: 52px;
  --kpi-value-size: 18px;
}

/* Runtime 198: QR equipment commit list and Messenger hit-target/layout fix */
.qr-equipment-list-box {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  min-height: 44px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-soft);
}

.qr-equipment-list-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
}

.qr-equipment-list-item .muted {
  grid-column: 1 / -1;
}

.messenger-icon-button,
.messenger-online-user,
.whatsapp-thread-main,
.messenger-send-button {
  position: relative;
  z-index: 2;
  pointer-events: auto;
  touch-action: manipulation;
}

body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-sidebar {
  pointer-events: auto;
  z-index: 3;
}

body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-chat-panel {
  pointer-events: none;
}

body[data-view="whatsapp"] .whatsapp-layout.is-chat-open .whatsapp-chat-panel {
  pointer-events: auto;
  z-index: 4;
}

@media (max-width: 720px) {
  body[data-view="whatsapp"] .whatsapp-layout {
    display: grid !important;
    grid-template-columns: 100% !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-sidebar {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    transform: none !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-chat-panel {
    display: none !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-chat-open .whatsapp-sidebar {
    display: none !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-chat-open .whatsapp-chat-panel {
    display: grid !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
  }
}

.record-created-meta {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  margin: 6px 0 8px;
  padding: 4px 7px;
  border: 1px solid #b7c2cd;
  background: #eef3f7;
  color: #263544;
  border-radius: 3px;
  font-size: 11px;
  line-height: 1.25;
  font-weight: 600;
}

.record-created-meta.compact {
  display: inline-flex;
  margin: 3px 0;
  padding: 3px 6px;
  font-size: 10.5px;
  font-weight: 600;
}

@media print {
  .record-created-meta,
  [data-app-only-meta] {
    display: none !important;
  }
}

/* Runtime 149 APK logo top-left and menu beside Company selector */
@media (max-width: 720px) {
  body.hireops-apk {
    --apk-header-z: 780;
    --apk-menu-z: 790;
    padding-top: 0 !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: var(--apk-header-z) !important;
    overflow: visible !important;
    isolation: isolate !important;
    transform: none !important;
    min-height: calc(118px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk .brand {
    position: relative !important;
    min-height: 34px !important;
    padding-left: 40px !important;
  }

  body.hireops-apk .brand-mark {
    position: absolute !important;
    top: calc(5px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-header-z) + 15) !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    transform: none !important;
    pointer-events: none !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .global-controls {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 5px !important;
    align-items: end !important;
    width: 100% !important;
  }

  body.hireops-apk .global-controls .apk-header-menu-toggle {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: end !important;
    justify-self: stretch !important;
  }

  body.hireops-apk .global-controls label:has(#companyFilter) {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk .global-controls label:has(#branchFilter) {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk .global-controls label:has(#departmentFilter) {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk .global-controls label:has(#searchInput) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: calc(var(--apk-header-z) + 20) !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: var(--apk-menu-z) !important;
    padding-top: calc(84px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: calc(var(--apk-menu-z) - 5) !important;
  }
}

/* Runtime 150 final APK left-edge logo and menu placement */
@media (max-width: 720px) {
  body.hireops-apk .topbar {
    padding-left: 2px !important;
    padding-right: 4px !important;
  }

  body.hireops-apk .brand {
    padding-left: 34px !important;
  }

  body.hireops-apk .brand-mark {
    left: 2px !important;
  }

  body.hireops-apk .global-controls {
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 4px !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    width: 28px !important;
    min-width: 28px !important;
    justify-self: start !important;
  }
}

/* Runtime 152 final APK brand text alignment */
@media (max-width: 720px) {
  body.hireops-apk .brand > div:not(.brand-mark) {
    transform: translateY(8px) !important;
  }
}

/* Runtime 155 final PDF Studio web scrolling */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  overflow: auto !important;
}

.pdf-viewer-modal {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow: auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  overflow: auto !important;
}

.pdf-page-shell {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
}

.pdf-sign-panel {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

.pdf-edit-panel {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

.pdf-viewer-body.pdf-viewer-body-full {
  grid-template-columns: minmax(0, 1fr) !important;
}

.pdf-page-stage {
  position: relative !important;
  display: block !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}

.pdf-annotation-layer {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

.pdf-text-box {
  pointer-events: auto !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    max-height: calc(100dvh - 10px) !important;
  }

  .pdf-viewer-body,
  .pdf-page-shell,
  .pdf-sign-panel,
  .pdf-edit-panel {
    max-height: none !important;
  }
}

/* Runtime 156 final web Messenger: only chat scrolls */
@media (min-width: 721px) {
  body[data-view="whatsapp"]:not(.hireops-apk) {
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .layout {
    height: calc(100dvh - 89px) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-layout {
    height: 100% !important;
    min-height: 0 !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-sidebar,
  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-chat-panel {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-messages {
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-compose {
    flex-shrink: 0 !important;
  }
}

/* Runtime 156 web Messenger: only chat scrolls */
@media (min-width: 721px) {
  body[data-view="whatsapp"]:not(.hireops-apk) {
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .layout {
    height: calc(100dvh - 89px) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-layout {
    height: 100% !important;
    min-height: 0 !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-sidebar,
  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-chat-panel {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-messages {
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-compose {
    flex-shrink: 0 !important;
  }
}

/* Runtime 154 final Job Book tabs, QR streamlining and in-app equipment rename */
.qr-request-form {
  gap: 8px !important;
}

.qr-section {
  padding: 9px !important;
  border-radius: 6px !important;
}

.qr-section-head {
  margin-bottom: 6px !important;
}

.qr-company-grid,
.qr-department-panel,
.qr-department-body,
.qr-mini-section {
  gap: 6px !important;
}

.qr-company-toggle {
  min-height: 30px !important;
  padding: 7px 10px 7px 6px !important;
}

.qr-company-check {
  margin: 8px 0 0 10px !important;
}

.qr-department-panel,
.qr-department-body {
  padding: 8px !important;
}

.qr-department-head {
  padding: 6px 8px !important;
}

.qr-date-group {
  padding: 7px !important;
  border-radius: 6px !important;
}

.qr-date-group-head {
  margin-bottom: 5px !important;
  font-size: 10.5px !important;
}

.qr-date-group-grid,
.qr-schedule-grid,
.qr-transport-grid {
  gap: 6px !important;
}

.equipment-list-rename-modal {
  max-width: min(520px, calc(100vw - 20px)) !important;
}

@media (min-width: 721px) {
  .qr-request-form > .qr-section:first-child .form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* Runtime 155 PDF Studio web scrolling */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  overflow: auto !important;
}

.pdf-viewer-modal {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow: auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  overflow: auto !important;
}

.pdf-page-shell {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
}

.pdf-sign-panel {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    max-height: calc(100dvh - 10px) !important;
  }

  .pdf-viewer-body,
  .pdf-page-shell,
  .pdf-sign-panel {
    max-height: none !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .jobbook-tab-row {
    gap: 3px !important;
    margin-bottom: 6px !important;
    padding-bottom: 5px !important;
  }

  body.hireops-apk .jobbook-tab-row .tab-button {
    min-height: 24px !important;
    padding: 3px 5px !important;
    font-size: 9.5px !important;
    line-height: 1.05 !important;
    border-radius: 3px !important;
  }

  body.hireops-apk .qr-section {
    padding: 7px !important;
  }

  body.hireops-apk .qr-section-head h3 {
    font-size: 12px !important;
  }

  body.hireops-apk .qr-request-form label span,
  body.hireops-apk .qr-date-group-head {
    font-size: 9px !important;
  }

  body.hireops-apk .qr-request-form input,
  body.hireops-apk .qr-request-form select,
  body.hireops-apk .qr-request-form textarea {
    min-height: 30px !important;
    font-size: 13px !important;
  }
}

/* Runtime 154 final Job Book tabs, QR streamlining and in-app equipment rename */
.qr-request-form {
  gap: 8px !important;
}

.qr-section {
  padding: 9px !important;
  border-radius: 6px !important;
}

.qr-section-head {
  margin-bottom: 6px !important;
}

.qr-company-grid,
.qr-department-panel,
.qr-department-body,
.qr-mini-section {
  gap: 6px !important;
}

.qr-company-toggle {
  min-height: 30px !important;
  padding: 7px 10px 7px 6px !important;
}

.qr-company-check {
  margin: 8px 0 0 10px !important;
}

.qr-department-panel,
.qr-department-body {
  padding: 8px !important;
}

.qr-department-head {
  padding: 6px 8px !important;
}

.qr-date-group {
  padding: 7px !important;
  border-radius: 6px !important;
}

.qr-date-group-head {
  margin-bottom: 5px !important;
  font-size: 10.5px !important;
}

.qr-date-group-grid,
.qr-schedule-grid,
.qr-transport-grid {
  gap: 6px !important;
}

.equipment-list-rename-modal {
  max-width: min(520px, calc(100vw - 20px)) !important;
}

@media (min-width: 721px) {
  .qr-request-form > .qr-section:first-child .form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .jobbook-tab-row {
    gap: 3px !important;
    margin-bottom: 6px !important;
    padding-bottom: 5px !important;
  }

  body.hireops-apk .jobbook-tab-row .tab-button {
    min-height: 24px !important;
    padding: 3px 5px !important;
    font-size: 9.5px !important;
    line-height: 1.05 !important;
    border-radius: 3px !important;
  }

  body.hireops-apk .qr-section {
    padding: 7px !important;
  }

  body.hireops-apk .qr-section-head h3 {
    font-size: 12px !important;
  }

  body.hireops-apk .qr-request-form label span,
  body.hireops-apk .qr-date-group-head {
    font-size: 9px !important;
  }

  body.hireops-apk .qr-request-form input,
  body.hireops-apk .qr-request-form select,
  body.hireops-apk .qr-request-form textarea {
    min-height: 30px !important;
    font-size: 13px !important;
  }
}

/* Runtime 154 final Job Book tabs, QR streamlining and in-app equipment rename */
.qr-request-form {
  gap: 8px !important;
}

.qr-section {
  padding: 9px !important;
  border-radius: 6px !important;
}

.qr-section-head {
  margin-bottom: 6px !important;
}

.qr-company-grid,
.qr-department-panel,
.qr-department-body,
.qr-mini-section {
  gap: 6px !important;
}

.qr-company-toggle {
  min-height: 30px !important;
  padding: 7px 10px 7px 6px !important;
}

.qr-company-check {
  margin: 8px 0 0 10px !important;
}

.qr-department-panel,
.qr-department-body {
  padding: 8px !important;
}

.qr-department-head {
  padding: 6px 8px !important;
}

.qr-date-group {
  padding: 7px !important;
  border-radius: 6px !important;
}

.qr-date-group-head {
  margin-bottom: 5px !important;
  font-size: 10.5px !important;
}

.qr-date-group-grid,
.qr-schedule-grid,
.qr-transport-grid {
  gap: 6px !important;
}

.equipment-list-rename-modal {
  max-width: min(520px, calc(100vw - 20px)) !important;
}

@media (min-width: 721px) {
  .qr-request-form > .qr-section:first-child .form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .jobbook-tab-row {
    gap: 3px !important;
    margin-bottom: 6px !important;
    padding-bottom: 5px !important;
  }

  body.hireops-apk .jobbook-tab-row .tab-button {
    min-height: 24px !important;
    padding: 3px 5px !important;
    font-size: 9.5px !important;
    line-height: 1.05 !important;
    border-radius: 3px !important;
  }

  body.hireops-apk .qr-section {
    padding: 7px !important;
  }

  body.hireops-apk .qr-section-head h3 {
    font-size: 12px !important;
  }

  body.hireops-apk .qr-request-form label span,
  body.hireops-apk .qr-date-group-head {
    font-size: 9px !important;
  }

  body.hireops-apk .qr-request-form input,
  body.hireops-apk .qr-request-form select,
  body.hireops-apk .qr-request-form textarea {
    min-height: 30px !important;
    font-size: 13px !important;
  }
}

/* Runtime 154 Job Book tabs, QR streamlining and in-app equipment rename */
.qr-request-form {
  gap: 8px !important;
}

.qr-section {
  padding: 9px !important;
  border-radius: 6px !important;
}

.qr-section-head {
  margin-bottom: 6px !important;
}

.qr-company-grid,
.qr-department-panel,
.qr-department-body,
.qr-mini-section {
  gap: 6px !important;
}

.qr-company-toggle {
  min-height: 30px !important;
  padding: 7px 10px 7px 6px !important;
}

.qr-company-check {
  margin: 8px 0 0 10px !important;
}

.qr-department-panel,
.qr-department-body {
  padding: 8px !important;
}

.qr-department-head {
  padding: 6px 8px !important;
}

.qr-date-group {
  padding: 7px !important;
  border-radius: 6px !important;
}

.qr-date-group-head {
  margin-bottom: 5px !important;
  font-size: 10.5px !important;
}

.qr-date-group-grid,
.qr-schedule-grid,
.qr-transport-grid {
  gap: 6px !important;
}

.equipment-list-rename-modal {
  max-width: min(520px, calc(100vw - 20px)) !important;
}

@media (min-width: 721px) {
  .qr-request-form > .qr-section:first-child .form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .jobbook-tab-row {
    gap: 3px !important;
    margin-bottom: 6px !important;
    padding-bottom: 5px !important;
  }

  body.hireops-apk .jobbook-tab-row .tab-button {
    min-height: 24px !important;
    padding: 3px 5px !important;
    font-size: 9.5px !important;
    line-height: 1.05 !important;
    border-radius: 3px !important;
  }

  body.hireops-apk .qr-section {
    padding: 7px !important;
  }

  body.hireops-apk .qr-section-head h3 {
    font-size: 12px !important;
  }

  body.hireops-apk .qr-request-form label span,
  body.hireops-apk .qr-date-group-head {
    font-size: 9px !important;
  }

  body.hireops-apk .qr-request-form input,
  body.hireops-apk .qr-request-form select,
  body.hireops-apk .qr-request-form textarea {
    min-height: 30px !important;
    font-size: 13px !important;
  }
}

/* Runtime 150 final APK logo top-left and menu beside Company selector */
@media (max-width: 720px) {
  body.hireops-apk {
    --apk-header-z: 780;
    --apk-menu-z: 790;
    padding-top: 0 !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: var(--apk-header-z) !important;
    padding-left: 2px !important;
    padding-right: 4px !important;
    overflow: visible !important;
    isolation: isolate !important;
    transform: none !important;
    min-height: calc(118px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk .brand {
    position: relative !important;
    min-height: 34px !important;
    padding-left: 34px !important;
  }

  body.hireops-apk .brand-mark {
    position: absolute !important;
    top: calc(5px + env(safe-area-inset-top, 0px)) !important;
    left: 2px !important;
    z-index: calc(var(--apk-header-z) + 15) !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    transform: none !important;
    pointer-events: none !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .global-controls {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 4px !important;
    align-items: end !important;
    width: 100% !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  body.hireops-apk .global-controls .apk-header-menu-toggle {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: end !important;
    justify-self: stretch !important;
  }

  body.hireops-apk .global-controls label:has(#companyFilter) {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk .global-controls label:has(#branchFilter) {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk .global-controls label:has(#departmentFilter) {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk .global-controls label:has(#searchInput) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: calc(var(--apk-header-z) + 20) !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: var(--apk-menu-z) !important;
    padding-top: calc(84px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: calc(var(--apk-menu-z) - 5) !important;
  }
}

/* Runtime 150 final APK left-edge logo and menu placement */
@media (max-width: 720px) {
  body.hireops-apk .topbar {
    padding-left: 2px !important;
    padding-right: 4px !important;
  }

  body.hireops-apk .brand {
    padding-left: 34px !important;
  }

  body.hireops-apk .brand-mark {
    left: 2px !important;
  }

  body.hireops-apk .global-controls {
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 4px !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    width: 28px !important;
    min-width: 28px !important;
    justify-self: start !important;
  }
}

/* Runtime 145 APK locked header, logo, and menu controls */
@media (max-width: 720px) {
  body.hireops-apk {
    --apk-header-z: 700;
    --apk-menu-z: 760;
    padding-top: 0 !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: var(--apk-header-z) !important;
    isolation: isolate !important;
    min-height: calc(118px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk .brand {
    padding-left: 40px !important;
    min-height: 34px !important;
  }

  body.hireops-apk .brand-mark {
    position: fixed !important;
    top: calc(5px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-header-z) + 10) !important;
    width: 30px !important;
    height: 30px !important;
    pointer-events: none !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .main-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle {
    position: fixed !important;
    top: calc(44px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-menu-z) + 20) !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: var(--apk-menu-z) !important;
    padding-top: calc(84px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: calc(var(--apk-menu-z) - 5) !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk {
    display: block;
    min-height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
  }

  body.hireops-apk .topbar {
    position: static;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    width: 100%;
    padding: calc(6px + env(safe-area-inset-top, 0px)) 8px 8px;
  }

  body.hireops-apk .brand {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 8px;
    min-width: 0;
    align-items: center;
  }

  body.hireops-apk .brand-mark,
  body.hireops-apk .brand-mark img {
    width: 42px;
    height: 42px;
    max-width: 42px;
    max-height: 42px;
  }

  body.hireops-apk .brand h1 {
    margin: 0;
    overflow: hidden;
    font-size: 15px;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.hireops-apk .brand p {
    display: block;
    max-width: 100%;
    margin: 2px 0 0;
    overflow: hidden;
    font-size: 10px;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.hireops-apk .global-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    width: 100%;
  }

  body.hireops-apk .global-controls label:has(#searchInput) {
    grid-column: 1 / -1;
  }

  body.hireops-apk .global-controls select,
  body.hireops-apk .global-controls input {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    font-size: 16px;
  }

  body.hireops-apk .user-panel {
    width: 100%;
    min-width: 0;
    justify-content: stretch;
  }

  body.hireops-apk .user-chip {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    width: 100%;
    min-width: 0;
    gap: 5px;
  }

  body.hireops-apk .layout {
    display: block;
    width: 100%;
    min-height: auto;
    overflow: visible;
  }

  body.hireops-apk .content {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: auto;
    padding: 8px 8px calc(18px + env(safe-area-inset-bottom, 0px));
    overflow: visible;
  }

  body.hireops-apk .main-menu-toggle {
    position: fixed;
    top: env(safe-area-inset-top, 0px);
    left: 0;
    z-index: 120;
    width: 44px;
    height: 44px;
    min-height: 44px;
    transform: none !important;
  }

  body.hireops-apk .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 110;
    width: min(88vw, 330px) !important;
    max-width: min(88vw, 330px);
    max-height: 100dvh;
    padding: calc(52px + env(safe-area-inset-top, 0px)) 10px calc(12px + env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    transform: translateX(0);
  }

  body.hireops-apk.main-menu-collapsed .sidebar {
    width: min(88vw, 330px) !important;
    opacity: 1;
    transform: translateX(-105%);
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: rgba(8, 14, 22, 0.28);
    content: "";
    pointer-events: none;
  }

  body.hireops-apk .view-head,
  body.hireops-apk .panel-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    align-items: start;
  }

  body.hireops-apk .view-head .actions,
  body.hireops-apk .panel-head .actions,
  body.hireops-apk .actions,
  body.hireops-apk .chip-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
    width: 100%;
    gap: 6px;
  }

  body.hireops-apk .view-head .report-menu,
  body.hireops-apk .view-head .report-menu-trigger,
  body.hireops-apk .actions > button,
  body.hireops-apk .actions > a,
  body.hireops-apk .chip-row > button,
  body.hireops-apk .chip-row > a {
    width: 100%;
    min-width: 0;
  }

  body.hireops-apk .tab-row,
  body.hireops-apk .help-tab-row,
  body.hireops-apk .table-wrap,
  body.hireops-apk .equipment-lines-wrap,
  body.hireops-apk .transport-trip-table-wrap,
  body.hireops-apk .transport-table-wrap,
  body.hireops-apk .rider-table-wrap,
  body.hireops-apk .crew-chart-wrap,
  body.hireops-apk .pop-stock-grid,
  body.hireops-apk .migration-five-row-table {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.hireops-apk .panel,
  body.hireops-apk .record-card,
  body.hireops-apk .view-head,
  body.hireops-apk .panel-head,
  body.hireops-apk label {
    min-width: 0;
    max-width: 100%;
  }
}

html[data-colour-scheme="graphite"] {
  --bg: #c9ced3;
  --chrome: #e0e3e6;
  --surface: #f8f8f8;
  --surface-2: #eceff1;
  --ink: #16181b;
  --muted: #505963;
  --line: #a8b0b8;
  --line-strong: #6f7984;
  --teal: #4c6673;
  --green: #3e6a57;
  --blue: #394b5d;
  --gold: #8b6d30;
  --red: #9e3d36;
  --soft-teal: #dce6ea;
  --soft-blue: #e0e5ea;
  --nav-start: #56616d;
  --nav-end: #2f3740;
  --nav-border: #222a31;
  --button-start: #596775;
  --button-end: #394553;
}

html[data-colour-scheme="rainbow-red"] {
  --bg: #d7c9c9;
  --chrome: #eadede;
  --surface: #fff8f8;
  --surface-2: #f5e7e7;
  --ink: #211313;
  --muted: #6a5555;
  --line: #bea9a9;
  --line-strong: #927171;
  --teal: #386c74;
  --green: #4d7139;
  --blue: #46557b;
  --gold: #9a6f1c;
  --red: #b3262f;
  --soft-teal: #dcecef;
  --soft-blue: #e1e5f1;
  --soft-red: #f7d9dc;
  --nav-start: #c9363f;
  --nav-end: #8f2028;
  --nav-border: #64151b;
  --button-start: #cb3b43;
  --button-end: #992630;
}

html[data-colour-scheme="rainbow-orange"] {
  --bg: #d6cec3;
  --chrome: #e9e1d6;
  --surface: #fffaf4;
  --surface-2: #f4eadc;
  --ink: #21170d;
  --muted: #665849;
  --line: #bcae9c;
  --line-strong: #8e7a63;
  --teal: #3a6e70;
  --green: #5d7136;
  --blue: #3f5f80;
  --gold: #a15f00;
  --red: #a23b2f;
  --soft-gold: #f5dfb8;
  --soft-red: #f0d7d3;
  --nav-start: #c96c16;
  --nav-end: #90480b;
  --nav-border: #663207;
  --button-start: #cf741d;
  --button-end: #9a500f;
}

html[data-colour-scheme="rainbow-yellow"] {
  --bg: #d6d2c4;
  --chrome: #e8e4d7;
  --surface: #fffdf4;
  --surface-2: #f3eedc;
  --ink: #1f1a0e;
  --muted: #625a49;
  --line: #b9b098;
  --line-strong: #897b5c;
  --teal: #3e706f;
  --green: #5e7334;
  --blue: #465d7d;
  --gold: #9b7100;
  --red: #9b3b33;
  --soft-gold: #f6e8bd;
  --soft-red: #efd8d4;
  --nav-start: #b89016;
  --nav-end: #7c6108;
  --nav-border: #584506;
  --button-start: #be971c;
  --button-end: #866a0c;
}

html[data-colour-scheme="rainbow-green"] {
  --bg: #c8d3c8;
  --chrome: #dce6dc;
  --surface: #f7fbf7;
  --surface-2: #e7f0e7;
  --ink: #101e12;
  --muted: #4d6350;
  --line: #a6b8a8;
  --line-strong: #6f8b72;
  --teal: #247064;
  --green: #2f7b3f;
  --blue: #235f75;
  --gold: #8c741b;
  --red: #a33a32;
  --soft-teal: #d9eee9;
  --soft-blue: #dcebee;
  --nav-start: #3c934b;
  --nav-end: #24642f;
  --nav-border: #194721;
  --button-start: #439d52;
  --button-end: #2b7137;
}

html[data-colour-scheme="rainbow-blue"] {
  --bg: #c7ced7;
  --chrome: #dce2ea;
  --surface: #f7faff;
  --surface-2: #e6edf6;
  --ink: #101822;
  --muted: #4d5d6c;
  --line: #a5b2c0;
  --line-strong: #6f7f91;
  --teal: #1e6d88;
  --green: #3c714a;
  --blue: #235fa5;
  --gold: #94711a;
  --red: #a43b34;
  --soft-teal: #d9edf4;
  --soft-blue: #dce9f8;
  --nav-start: #2f75c9;
  --nav-end: #1f4f91;
  --nav-border: #153765;
  --button-start: #367fce;
  --button-end: #245a9d;
}

html[data-colour-scheme="rainbow-indigo"] {
  --bg: #cbc9d5;
  --chrome: #dfddea;
  --surface: #f8f7ff;
  --surface-2: #e9e7f5;
  --ink: #171421;
  --muted: #575268;
  --line: #aaa6bb;
  --line-strong: #77708e;
  --teal: #3d687a;
  --green: #526f3b;
  --blue: #4c55a0;
  --gold: #92701a;
  --red: #9d3942;
  --soft-teal: #dce9ef;
  --soft-blue: #e2e2f6;
  --nav-start: #5659b8;
  --nav-end: #37387e;
  --nav-border: #272859;
  --button-start: #6064c0;
  --button-end: #414394;
}

html[data-colour-scheme="rainbow-violet"] {
  --bg: #d1c8d5;
  --chrome: #e5ddea;
  --surface: #fcf7ff;
  --surface-2: #eee6f5;
  --ink: #1c1321;
  --muted: #625168;
  --line: #b5a5bd;
  --line-strong: #836e8f;
  --teal: #426878;
  --green: #5b7039;
  --blue: #5f4e9f;
  --gold: #94701a;
  --red: #a13a55;
  --soft-teal: #dfeaf0;
  --soft-blue: #e7e1f5;
  --nav-start: #8a4fb3;
  --nav-end: #5f347d;
  --nav-border: #442459;
  --button-start: #9458bd;
  --button-end: #6d3c8f;
}

html[data-colour-scheme="emerald"] {
  --bg: #c8d2ce;
  --chrome: #dce4e0;
  --surface: #f7faf8;
  --surface-2: #e8f0ec;
  --ink: #101d19;
  --muted: #4d645b;
  --line: #a7b8b1;
  --line-strong: #708b80;
  --teal: #247064;
  --green: #2f7443;
  --blue: #235f75;
  --gold: #92721b;
  --red: #a23a32;
  --soft-teal: #d9eee9;
  --soft-blue: #dcebee;
  --nav-start: #2f8068;
  --nav-end: #1f5f49;
  --nav-border: #164635;
  --button-start: #318b70;
  --button-end: #21664f;
}

html[data-colour-scheme="maroon"] {
  --bg: #d4cacc;
  --chrome: #e4dcde;
  --surface: #faf7f8;
  --surface-2: #f0e8ea;
  --ink: #1f1417;
  --muted: #66535a;
  --line: #b9a9ae;
  --line-strong: #8b737c;
  --teal: #3e6b76;
  --green: #536f38;
  --blue: #574979;
  --gold: #986c1b;
  --red: #9d3143;
  --soft-teal: #dce9ec;
  --soft-blue: #e4e0ee;
  --soft-red: #f1d7dd;
  --nav-start: #9a3e55;
  --nav-end: #68283c;
  --nav-border: #4a1b2a;
  --button-start: #a6485f;
  --button-end: #733047;
}

html[data-colour-scheme="high-contrast"] {
  color-scheme: dark;
  --bg: #050505;
  --chrome: #111;
  --surface: #fff;
  --surface-2: #ececec;
  --ink: #000;
  --muted: #333;
  --line: #000;
  --line-strong: #000;
  --teal: #005fcc;
  --green: #006b2b;
  --blue: #003d8f;
  --gold: #755100;
  --red: #b00020;
  --soft-teal: #d9ecff;
  --soft-blue: #dce8ff;
  --soft-gold: #fff0c7;
  --soft-red: #ffd9df;
  --nav-start: #000;
  --nav-end: #000;
  --nav-border: #fff;
  --button-start: #003d8f;
  --button-end: #002e6d;
  --shadow: none;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--app-font-family);
  font-size: var(--app-font-size);
  line-height: var(--app-line-height);
}

button,
input,
select {
  font: inherit;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

.currency-input-shell {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 4px;
  width: 100%;
}

.currency-input-shell.no-gap {
  gap: 0;
}

.currency-input-prefix {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 6px;
  border: 1px solid var(--line);
  border-right: 0;
  background: var(--surface-2);
  color: var(--ink);
  font-weight: 800;
}

.currency-input-shell input {
  min-width: 0;
}

button {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(360px, 500px) minmax(420px, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 6px 12px;
  background: linear-gradient(#eef1f4, #cfd5dc);
  border-bottom: 1px solid #7d8792;
  box-shadow: 0 1px 0 #fff inset;
}

.brand {
  display: flex;
  gap: 12px;
  align-items: center;
}

.brand-mark {
  flex: 0 0 auto;
  width: 92px;
  height: 76px;
  background: transparent url("/assets/hire-ops-logo.svg") center / contain no-repeat;
  border: 0;
  overflow: visible;
}

.brand-mark img {
  display: block;
  width: 92px;
  height: 76px;
  max-width: 92px;
  max-height: 100%;
  object-fit: contain;
  background: transparent;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  font-size: 1.54rem;
}

h2 {
  font-size: 1.38rem;
}

h3 {
  font-size: 1.08rem;
}

.brand p,
.muted {
  color: var(--muted);
}

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

.global-controls label:has(#searchInput) {
  grid-column: 1 / -1;
  min-width: 0;
}

.global-search-results {
  position: fixed;
  z-index: 60;
  margin: 0;
  overflow: auto;
  box-shadow: 0 12px 28px rgba(20, 28, 35, 0.3);
}

body.main-menu-collapsed .global-search-results {
  width: auto;
}

.tiny-checkbox-list {
  display: grid;
  gap: 2px;
  max-height: 138px;
  overflow: auto;
  padding: 3px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.tiny-checkbox {
  display: grid;
  grid-template-columns: 13px minmax(0, 1fr);
  align-items: center;
  gap: 4px;
  min-height: 18px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.15;
}

.tiny-checkbox input {
  width: 11px;
  min-height: 11px;
  height: 11px;
  margin: 0;
  padding: 0;
}

label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

input,
select {
  width: 100%;
  min-height: 30px;
  padding: 5px 7px;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  outline: none;
}

input:focus,
select:focus,
textarea:focus,
button:focus-visible {
  border-color: var(--teal);
  box-shadow: 0 0 0 2px rgba(31, 79, 130, 0.22);
}

.readonly-field,
input[readonly] {
  color: #27313a;
  background: #e5e9ee;
  border-color: #9ea8b3;
}

.user-panel {
  min-width: 220px;
}

.user-chip {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.user-identity {
  min-width: 0;
}

.user-name-row {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  gap: 5px;
}

.presence-dot {
  display: inline-block;
  width: 9px;
  min-width: 9px;
  height: 9px;
  border: 1px solid rgba(20, 31, 45, 0.24);
  border-radius: 50%;
  background: #6b7280;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.68);
}

.presence-dot.ok {
  background: #1f8f3a;
}

.presence-dot.warn {
  background: #d79a21;
}

.presence-dot.bad {
  background: #9aa3ad;
}

.presence-dot.dark {
  background: #27313a;
}

.notification-bell {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  padding: 5px 9px;
  color: var(--ink);
  background: #eef3f8;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-weight: 900;
}

.notification-bell.has-items {
  color: #fff;
  background: var(--blue);
  border-color: var(--blue);
}

.notification-bell-icon {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

.notification-menu-wrap {
  position: relative;
  display: inline-flex;
  min-width: 0;
}

.notification-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 50;
  width: min(360px, calc(100vw - 24px));
  max-height: min(480px, calc(100vh - 110px));
  overflow: auto;
  padding: 8px;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  box-shadow: 0 16px 40px rgba(16, 28, 42, 0.28);
}

.notification-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 4px 8px;
  border-bottom: 1px solid var(--line);
}

.notification-menu-item {
  display: grid;
  width: 100%;
  gap: 3px;
  margin-top: 6px;
  padding: 8px;
  color: var(--ink);
  text-align: left;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.notification-menu-item span,
.notification-menu-item small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.notification-menu-item:hover {
  border-color: var(--blue);
  background: var(--soft-blue);
}

.notification-menu-item small,
.notification-menu-empty {
  color: var(--muted);
}

.notification-menu-empty {
  padding: 14px 8px 8px;
}

.notification-count {
  min-width: 18px;
  padding: 1px 5px;
  color: inherit;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.25;
  text-align: center;
}

.auth-setup-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  overflow: hidden;
}

.auth-qr-wrap {
  display: grid;
  place-items: center;
  padding: 8px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.auth-qr-code {
  display: block;
  width: 180px;
  max-width: 36vw;
  height: auto;
}

.auth-setup-copy {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.auth-setup-copy code,
.auth-uri-text {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.layout {
  display: grid;
  grid-template-columns: 214px minmax(0, 1fr);
  min-height: calc(100vh - 89px);
  transition: grid-template-columns 160ms ease;
}

body.main-menu-collapsed .layout {
  grid-template-columns: 0 minmax(0, 1fr);
}

.sidebar {
  grid-column: 1;
  grid-row: 1;
  position: sticky;
  top: 89px;
  align-self: start;
  height: calc(100vh - 89px);
  padding: 10px 8px;
  overflow-y: auto;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border-right: 1px solid var(--nav-border);
  transition: width 160ms ease, padding 160ms ease, opacity 120ms ease;
  scrollbar-width: none;
}

.sidebar::-webkit-scrollbar {
  display: none;
}

.content {
  grid-column: 2;
  grid-row: 1;
}

body.main-menu-collapsed .sidebar {
  width: 0;
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
  opacity: 0;
  border-right: 0;
}

.main-menu-toggle {
  grid-column: 1;
  grid-row: 1;
  position: sticky;
  top: 89px;
  z-index: 14;
  align-self: start;
  justify-self: start;
  width: 24px;
  height: calc(100vh - 89px);
  min-height: 220px;
  margin-left: 0;
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border: 1px solid var(--nav-border);
  border-left: 0;
  border-top: 0;
  border-bottom: 0;
  border-radius: 0;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.22) inset;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  writing-mode: horizontal-tb;
}

body:not(.main-menu-collapsed) .main-menu-toggle {
  grid-column: 1;
  margin-left: 206px;
}

body.main-menu-collapsed .main-menu-toggle {
  grid-column: 1 / 2;
  margin-left: 0;
  opacity: 1;
  visibility: visible;
}

@media (min-width: 721px) {
  body:not(.hireops-apk) .layout {
    grid-template-columns: 214px minmax(0, 1fr);
  }

  body:not(.hireops-apk).main-menu-collapsed .layout {
    grid-template-columns: 0 minmax(0, 1fr);
  }

  body:not(.hireops-apk) .sidebar {
    position: fixed;
    top: 89px;
    bottom: 0;
    left: 0;
    z-index: 18;
    width: 214px;
    height: auto;
    max-height: calc(100vh - 89px);
  }

  body:not(.hireops-apk).main-menu-collapsed .sidebar {
    width: 0;
  }

  body:not(.hireops-apk) .main-menu-toggle {
    position: fixed;
    top: 89px;
    left: 0;
    z-index: 19;
    height: calc(100vh - 89px);
  }

  body:not(.hireops-apk):not(.main-menu-collapsed) .main-menu-toggle {
    margin-left: 0;
    transform: translateX(206px);
  }

  body:not(.hireops-apk).main-menu-collapsed .main-menu-toggle {
    transform: translateX(0);
  }
}

.nav-button,
.ghost-button,
.solid-button,
.chip-button {
  min-height: var(--control-min-height);
  border: 1px solid transparent;
  border-radius: var(--radius);
  font-weight: 800;
}

.nav-button {
  width: 100%;
  margin-bottom: 4px;
  padding: 7px 8px;
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.28);
  font-size: var(--menu-font-size);
  text-align: left;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.18) inset;
}

.nav-button.is-active {
  color: #fff;
  background: rgba(255, 255, 255, 0.24);
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset;
}

.nav-button.has-submenu::after {
  content: "▸";
  float: right;
  font-size: 11px;
  opacity: 0.85;
}

.nav-button.has-submenu[aria-expanded="true"]::after {
  content: "▾";
}

.nav-submenu {
  display: grid;
  gap: 3px;
  margin: -1px 0 6px 10px;
  padding: 5px 0 5px 8px;
  border-left: 1px solid rgba(255, 255, 255, 0.34);
}

.nav-submenu-button {
  min-height: clamp(28px, calc(24px + 0.5vw), 34px);
  padding: 5px 7px;
  color: #eef6ff;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius);
  font-size: clamp(9px, calc(8.2px + 0.2vw), 11.5px);
  font-weight: 800;
  text-align: left;
}

.nav-submenu-button.is-active,
.nav-submenu-button:hover {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.42);
}

.solid-button {
  padding: 6px 10px;
  color: #fff;
  background: linear-gradient(var(--button-start), var(--button-end));
  border-color: var(--nav-border);
}

.ghost-button,
.chip-button {
  padding: 6px 10px;
  color: var(--ink);
  background: linear-gradient(#ffffff, #dfe4e9);
  border-color: var(--line);
  box-shadow: 0 1px 0 #fff inset;
}

.chip-button.is-active {
  color: #fff;
  background: var(--blue);
  border-color: var(--blue);
}

.map-view-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 32px;
  padding: 0;
  font-size: 0;
  line-height: 1.1;
  white-space: nowrap;
}

.map-view-icon {
  display: block;
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.link-button {
  border: 0;
  background: transparent;
  color: #1f5f9f;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  padding: 0;
  text-align: left;
}

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

.content {
  min-width: 0;
  width: 100%;
  padding: calc(var(--app-pad) + 2px) calc(var(--app-pad) + 4px) 28px;
}

.view-head,
.panel-head,
.actions,
.chip-row {
  display: flex;
  gap: 10px;
  align-items: center;
}

.view-head,
.panel-head {
  justify-content: space-between;
}

.view-head {
  margin-bottom: 8px;
  padding: 5px 8px;
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border: 1px solid var(--nav-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.view-head h2 {
  font-size: 15px;
  line-height: 1.15;
}

.view-head p {
  font-size: 11px;
  line-height: 1.2;
}

.view-head .muted {
  color: #dceaf5;
}

.actions,
.chip-row {
  flex-wrap: wrap;
}

.report-menu {
  position: relative;
  flex: 0 0 auto;
}

.report-menu-trigger {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  color: #fff;
  background: linear-gradient(#285d8c, #173f65);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.28) inset;
  cursor: pointer;
  font-weight: 900;
  list-style: none;
}

.report-menu-trigger::-webkit-details-marker {
  display: none;
}

.report-menu-panel {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  z-index: 240;
  display: grid;
  min-width: 280px;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  box-shadow: 0 10px 24px rgba(20, 28, 35, 0.22);
}

.report-menu-heading {
  padding: 5px 7px 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.global-print-menu {
  display: inline-flex;
  width: auto;
}

.global-print-trigger {
  justify-content: center;
  width: 34px;
  min-width: 34px;
  min-height: 30px;
  padding: 5px;
  font-size: 16px;
  line-height: 1;
}

.web-user-actions {
  display: grid;
  gap: 5px;
  justify-items: stretch;
}

.web-header-tools {
  display: grid;
  gap: 5px;
  justify-items: stretch;
}

.web-user-actions .ghost-button,
.web-user-actions #onlineUsers,
.web-header-tools .notification-menu-wrap,
.web-header-tools .notification-bell,
.web-header-tools .global-print-menu,
.web-header-tools .global-print-trigger {
  width: 100%;
}

.web-user-actions #onlineUsers {
  justify-content: center;
}

.web-header-tools .global-print-menu {
  display: block;
}

.report-menu-item {
  display: grid;
  gap: 2px;
  width: 100%;
  min-height: 36px;
  padding: 7px 8px;
  color: var(--ink);
  background: transparent;
  border: 0;
  border-radius: var(--radius);
  text-align: left;
}

.report-menu-item:hover:not(:disabled),
.report-menu-item:focus-visible {
  background: var(--surface-2);
}

.report-menu-item span {
  font-weight: 900;
}

.report-menu-item small {
  color: var(--muted);
}

.template-builder-preview {
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--panel-soft);
}

.builder-preview-head {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 12px;
  align-items: center;
  border-bottom: 4px solid var(--primary);
  padding-bottom: 10px;
}

.builder-preview-head img {
  max-width: 82px;
  max-height: 64px;
  object-fit: contain;
  background: transparent;
}

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

.builder-preview-grid > div {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  background: var(--panel);
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: calc(var(--app-gap) - 2px);
  width: 100%;
  margin-bottom: var(--app-gap);
}

.kpi,
.panel,
.auth-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.kpi {
  display: grid;
  grid-template-rows: auto auto;
  align-content: center;
  min-width: 0;
  height: var(--kpi-height);
  min-height: var(--kpi-height);
  max-height: var(--kpi-height);
  padding: 6px 8px;
  overflow: hidden;
}

.kpi .label {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: uppercase;
}

.kpi .value {
  min-width: 0;
  margin-top: 2px;
  overflow: hidden;
  font-size: var(--kpi-value-size);
  font-weight: 900;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kpi .note {
  display: none;
}

.panel {
  min-width: 0;
  padding: 10px;
}

.panel-head {
  margin-bottom: 8px;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--line);
}

h4 {
  margin: 16px 0 8px;
  font-size: 0.92rem;
}

.grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: var(--app-gap);
  margin-bottom: var(--app-gap);
}

.grid-2.wide-left {
  grid-template-columns: minmax(min(420px, 100%), 1.2fr) minmax(min(320px, 100%), 0.8fr);
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: var(--app-gap);
}

.module-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
  gap: 10px;
  align-items: start;
}

.jobbook-layout {
  display: grid;
  grid-template-columns: minmax(260px, 330px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.jobbook-list {
  position: sticky;
  top: 70px;
  max-height: calc(100vh - 94px);
  overflow: auto;
}

.job-results {
  display: grid;
  gap: 5px;
  margin-top: 8px;
}

.job-result {
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 7px 8px;
  color: var(--ink);
  background: linear-gradient(#ffffff, #e3e7ec);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  text-align: left;
}

.job-result.is-active {
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border-color: var(--nav-border);
}

.job-result.is-active .muted {
  color: #dceaf5;
}

.tab-row {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.tab-button {
  min-height: 30px;
  padding: 6px 9px;
  color: var(--ink);
  background: linear-gradient(#ffffff, #dfe4e9);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: var(--tab-font-size);
  font-weight: 800;
}

.tab-button.is-active {
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border-color: var(--nav-border);
}

.tab-panel {
  min-height: 300px;
}

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

.resource-card {
  display: grid;
  gap: 4px;
  min-height: 86px;
}

.resource-card .label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.resource-card .value {
  font-size: 20px;
  font-weight: 900;
}

.admin-stack {
  display: grid;
  gap: 12px;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

.whatsapp-layout {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.whatsapp-sidebar,
.whatsapp-chat-panel {
  min-height: 64vh;
}

.whatsapp-contact,
.whatsapp-thread {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  text-align: left;
}

.whatsapp-thread {
  grid-template-columns: minmax(0, 1fr) auto;
}

.whatsapp-thread.is-active {
  border-color: #1d7d4d;
  background: #e2f2e8;
}

.whatsapp-thread-main {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 0;
  color: inherit;
  text-align: left;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.messenger-back-button {
  display: none;
  margin-right: 8px;
}

.whatsapp-messages {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 46vh;
  max-height: 58vh;
  overflow: auto;
  padding: 8px;
  background: #eef3ef;
  border: 1px solid var(--line);
}

.whatsapp-message {
  max-width: min(680px, 86%);
  background: transparent;
  border: 0;
}

.whatsapp-message-row,
.messenger-contact-main {
  display: flex;
  min-width: 0;
  gap: 8px;
  align-items: flex-start;
}

.messenger-contact-main {
  align-items: center;
}

.messenger-avatar {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  object-fit: cover;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #f8fafc;
}

.messenger-avatar-placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #1f3a5f;
  background: #dcebf7;
  font-size: 12px;
  font-weight: 900;
}

.messenger-presence {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
}

.messenger-presence-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #8793a0;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.78);
}

.messenger-presence.is-online {
  color: #1d6a35;
}

.messenger-presence.is-online .messenger-presence-dot {
  background: #1f9d4c;
}

.messenger-presence.is-inactive {
  color: #91640e;
}

.messenger-presence.is-inactive .messenger-presence-dot {
  background: #d99016;
}

.messenger-online-strip {
  display: grid;
  gap: 7px;
  margin-bottom: 10px;
  padding: 8px;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.messenger-online-title {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.messenger-online-list {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
}

.messenger-online-user {
  display: grid;
  justify-items: center;
  gap: 4px;
  min-width: 62px;
  max-width: 76px;
  padding: 5px;
  color: var(--ink);
  background: transparent;
  border: 0;
  border-radius: var(--radius);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.messenger-online-user span:last-child {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.messenger-chat-participants {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.whatsapp-message-bubble {
  min-width: 0;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #cad4cd;
  border-radius: 7px;
}

.whatsapp-message.is-own {
  justify-self: end;
}

.whatsapp-message.is-own .whatsapp-message-row {
  flex-direction: row-reverse;
}

.whatsapp-message.is-own .whatsapp-message-bubble {
  background: #d9f5cf;
}

.whatsapp-message.is-target {
  border-color: #0b74e5;
  box-shadow: 0 0 0 3px rgba(11, 116, 229, 0.18);
}

.whatsapp-message p {
  margin: 4px 0;
}

.messenger-typing-indicator {
  justify-self: start;
  display: inline-flex;
  gap: 7px;
  align-items: center;
  width: max-content;
  max-width: min(360px, 86%);
  padding: 7px 10px;
  color: #345;
  background: #fff;
  border: 1px solid #cad4cd;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
}

.messenger-typing-pen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  color: #0b3a78;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.messenger-typing-pen::after {
  width: 18px;
  margin-left: 5px;
  overflow: hidden;
  content: "...";
  animation: messengerTypingDots 1.1s steps(3, end) infinite;
}

@keyframes messengerTypingDots {
  0% { width: 0; }
  100% { width: 18px; }
}

.messenger-sender-name {
  display: inline-block;
  margin-bottom: 2px;
}

.whatsapp-audio {
  display: block;
  width: min(320px, 100%);
  margin: 6px 0 2px;
}

.messenger-image-link {
  display: block;
  margin-top: 6px;
}

.messenger-image-attachment {
  display: block;
  width: min(280px, 100%);
  max-height: 320px;
  object-fit: contain;
  border: 1px solid #b8c2cc;
  border-radius: 7px;
  background: #f8fafc;
}

.messenger-file-attachment {
  display: grid;
  gap: 2px;
  margin-top: 6px;
  padding: 8px 10px;
  color: var(--ink);
  background: #f8fafc;
  border: 1px solid #b8c2cc;
  border-radius: 7px;
  text-decoration: none;
}

.message-read-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 6px;
  vertical-align: middle;
}

.message-read-receipt {
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: #fff;
  background: #c01624;
  border: 0;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.message-read-list {
  display: inline-flex;
  max-width: min(520px, 86vw);
  overflow-x: auto;
  padding: 3px 7px;
  color: #7a121b;
  background: #fff1f2;
  border: 1px solid #efb0b7;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  z-index: 4;
}

.whatsapp-compose {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto auto;
  gap: 8px;
  margin-top: 10px;
  align-items: end;
}

.messenger-quick-emoji {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  align-self: end;
}

.messenger-emoji-button {
  min-width: 30px;
  padding: 5px 7px;
  font-size: 15px;
  line-height: 1;
}

.messenger-attachment-controls,
.whatsapp-recording-controls {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.messenger-attach-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.messenger-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  min-width: 38px;
  padding: 6px;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(18, 140, 126, 0.18);
}

.messenger-sound-button {
  flex: 0 0 auto;
}

.messenger-control-icon {
  display: block;
  width: 18px;
  height: 18px;
  pointer-events: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.messenger-new-message-dot {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 80;
  display: inline-flex;
  min-width: 76px;
  min-height: 76px;
  align-items: center;
  justify-content: center;
  padding: 12px;
  color: #fff;
  background: #0b74e5;
  border: 3px solid #fff;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(11, 116, 229, 0.34);
  font-weight: 900;
  cursor: pointer;
}

.messenger-new-message-dot:hover,
.messenger-new-message-dot:focus-visible {
  background: #075db8;
  outline: 3px solid rgba(11, 116, 229, 0.24);
  outline-offset: 2px;
}

.crew-whatsapp-panel {
  margin-bottom: 10px;
}

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

table {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
}

th,
td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

th {
  position: sticky;
  top: 0;
  z-index: 1;
  color: var(--muted);
  background: linear-gradient(#f5f7f9, #dfe4e9);
  font-size: 11px;
  text-transform: uppercase;
}

tbody tr:hover {
  background: var(--soft-teal);
}

tbody tr.ict-ticket-closed-row,
tbody tr.ict-ticket-closed-row:hover {
  background: #eceff2;
  color: #6b7280;
  opacity: 0.62;
}

tbody tr.ict-ticket-closed-row input,
tbody tr.ict-ticket-closed-row select,
tbody tr.ict-ticket-closed-row textarea,
tbody tr.ict-ticket-closed-row button {
  filter: grayscale(1);
  opacity: 0.7;
}

tbody tr.ict-ticket-closed-row .strong,
tbody tr.ict-ticket-closed-row .muted,
tbody tr.ict-ticket-closed-row td {
  color: #6b7280;
}

.status {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 2px 6px;
  border-radius: 2px;
  background: var(--soft-blue);
  color: #17446f;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid rgba(31, 79, 130, 0.22);
}

.status.ok {
  color: #1f5d24;
  background: #dff0dd;
}

.status.warn {
  color: #7a5317;
  background: var(--soft-gold);
}

.status.bad {
  color: #8a2e23;
  background: var(--soft-red);
}

.status.dark {
  color: #fff;
  background: var(--ink);
}

.status.status-job-cancelled {
  background: #000;
  border-color: #000;
  color: #fff;
}

.status.status-job-ignored {
  background: #3b3f45;
  border-color: #2b2f34;
  color: #fff;
}

.status.status-job-budget {
  background: #d9dde2;
  border-color: #aeb6bf;
  color: #000;
}

.status.status-job-internal {
  background: #eef0f2;
  border-color: #8d98a3;
  color: #1f2933;
}

.status.status-job-qr {
  background: #fff;
  border-color: #9aa4ad;
  color: #000;
}

.status.status-job-quote {
  background: #fff;
  border-color: #17813b;
  color: #008000;
}

.status.status-job-provisional {
  background: #0052b8;
  border-color: #003b86;
  color: #fff200;
}

.status.status-job-confirmed {
  background: #2fb34a;
  border-color: #188432;
  color: #000;
}

.status.status-job-active {
  background: #5b0000;
  border-color: #3c0000;
  color: #ff9d9d;
}

.status.status-job-completed {
  background: #064d1f;
  border-color: #023614;
  color: #a8f5b2;
}

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

.pipeline-status-board {
  display: flex;
  align-items: stretch;
  overflow-x: auto;
  padding-bottom: 6px;
}

.pipeline-status-board .board-col {
  flex: 0 0 260px;
}

.pipeline-job-card {
  cursor: pointer;
}

.pipeline-job-card:hover {
  border-color: var(--accent);
}

.pipeline-job-title {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}

.jobbook-nav-controls {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}

.jobbook-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}

.jobbook-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.jobbook-header-actions .solid-button,
.jobbook-header-actions .ghost-button {
  min-height: 32px;
  padding: 6px 10px;
  white-space: nowrap;
}

.jobbook-title-row h3 {
  min-width: 0;
  margin: 0;
}

.jobbook-heading-stack {
  display: grid;
  min-width: min(100%, 360px);
  gap: 4px;
}

.jobbook-nav-controls .icon-button {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  font-weight: 800;
}

.jobbook-nav-controls .icon-button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.board-col {
  min-width: 0;
}

.card-list {
  display: grid;
  gap: 7px;
}

.record-card {
  padding: 9px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 #fff inset;
}

.record-card.is-hot {
  border-color: #d29a8d;
  background: var(--soft-red);
}

.downloads-panel {
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(239, 245, 249, 0.94)),
    var(--panel);
}

.downloads-hero {
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(320px, 1.08fr);
  gap: 18px;
  align-items: center;
}

.downloads-hero-copy {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.downloads-hero-copy h3 {
  margin: 0;
  color: #173f65;
  font-size: clamp(1.32rem, 1.08rem + 0.7vw, 1.9rem);
  line-height: 1.12;
}

.eyebrow,
.download-app-type {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 3px 7px;
  color: #173f65;
  background: #e8eef3;
  border: 1px solid #c9d5df;
  border-radius: var(--radius);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.download-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.download-screenshot {
  min-width: 0;
  margin: 0;
  padding: 8px;
  background: #f8fafc;
  border: 1px solid #c6d1dc;
  border-radius: var(--radius);
  box-shadow: 0 16px 34px rgba(30, 45, 62, 0.16);
}

.download-screenshot img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #9fb0bf;
  border-radius: calc(var(--radius) - 2px);
}

.download-screenshot figcaption {
  margin-top: 7px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-align: center;
}

.download-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: var(--app-gap);
}

.download-app-card {
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 12px;
  min-width: 0;
  min-height: 210px;
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 #fff inset, 0 6px 16px rgba(26, 39, 52, 0.08);
}

.download-app-card h4 {
  margin: 10px 0 7px;
  color: var(--ink);
  font-size: 1rem;
}

.download-app-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.42;
}

.download-app-card.is-restricted {
  background: linear-gradient(#fbfcfd, #f2f5f7);
  border-style: dashed;
}

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

.download-actions .solid-button,
.download-actions .ghost-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  text-align: center;
  text-decoration: none;
}

.download-lock-note {
  display: inline-flex;
  max-width: 100%;
  padding: 6px 8px;
  color: #5d371a;
  background: #fff4d6;
  border: 1px solid #e0c278;
  border-radius: var(--radius);
  font-size: 0.82rem;
  font-weight: 800;
}

@media (max-width: 820px) {
  .downloads-hero {
    grid-template-columns: 1fr;
  }

  .download-actions .solid-button,
  .download-actions .ghost-button,
  .download-actions .download-lock-note {
    flex: 1 1 180px;
  }
}

.stock-hierarchy {
  display: grid;
  gap: 10px;
}

.stock-master-group {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  overflow: hidden;
}

.stock-master-group > summary {
  cursor: pointer;
  padding: 10px 12px;
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  font-weight: 900;
}

.stock-category-group {
  padding: 10px;
  border-top: 1px solid var(--line);
}

.stock-category-group h4 {
  margin: 0 0 8px;
  font-size: 13px;
}

.stock-item-list {
  display: grid;
  gap: 7px;
}

.stock-item-card {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) minmax(180px, auto);
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--soft);
}

.stock-item-main {
  min-width: 0;
}

.stock-item-title {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.stock-barcode-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px;
}

.stock-barcode-list span:not(.muted) {
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  font-size: 11px;
  font-weight: 800;
}

.stock-transfer-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.stock-transfer-summary > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.stock-transfer-summary strong {
  overflow-wrap: anywhere;
}

.stock-item-counts {
  display: grid;
  grid-template-columns: repeat(4, minmax(54px, auto));
  gap: 6px;
  text-align: right;
}

.stock-item-counts span {
  display: grid;
  gap: 1px;
}

.stock-item-counts small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.stock-modify-shell {
  display: grid;
  gap: 10px;
}

.stock-modify-section {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.stock-modify-section > .panel-head {
  padding: 0 0 6px;
  border-bottom: 1px solid var(--line);
}

.stock-modify-section h4 {
  margin: 0;
}

.stock-modify-barcode-box,
.stock-associated-picker {
  display: grid;
  gap: 7px;
  align-self: stretch;
}

.stock-barcode-checklist,
.stock-associated-search-results,
.stock-associated-selected-list {
  display: grid;
  gap: 4px;
  max-height: 156px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--line);
  background: #fff;
}

.stock-barcode-checklist label,
.stock-associated-search-results label {
  display: flex;
  gap: 7px;
  align-items: center;
  min-height: 24px;
}

.stock-barcode-checklist label.is-written-off {
  color: var(--muted);
  background: #e4e8ed;
  text-decoration: line-through;
}

.stock-associated-selected-list {
  display: flex;
  flex-wrap: wrap;
}

.stock-associated-selected-list span {
  padding: 3px 7px;
  border: 1px solid var(--line);
  background: var(--surface-2);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-general-grid {
  grid-template-columns: minmax(280px, 1fr) minmax(240px, 0.72fr) minmax(320px, 1fr);
  grid-template-areas:
    "identity dates financials"
    "identity responsibility financials"
    "compliance responsibility financials"
    "commission commission financials";
  align-items: start;
}

.jobbook-general-grid > .jobbook-identity-group,
.jobbook-general-grid > .jobbook-responsibility-group,
.jobbook-general-grid > .jobbook-dates-group,
.jobbook-general-grid > .jobbook-financial-group,
.jobbook-general-grid > .jobbook-compliance-group,
.jobbook-general-grid > .jobbook-commission-group {
  grid-column: auto;
  align-self: start;
}

.jobbook-identity-group {
  grid-area: identity;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.jobbook-identity-title {
  display: none;
}

.jobbook-identity-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-identity-fields label {
  min-width: 0;
}

.jobbook-responsibility-group {
  grid-area: responsibility;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.jobbook-responsibility-title {
  display: none;
}

.jobbook-responsibility-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-responsibility-fields label {
  min-width: 0;
}

.jobbook-dates-group {
  grid-area: dates;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.jobbook-dates-title {
  display: none;
}

.jobbook-dates-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-dates-fields label {
  min-width: 0;
}

.jobbook-financial-group {
  grid-area: financials;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.jobbook-financial-title {
  display: none;
}

.jobbook-financial-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-financial-fields label {
  min-width: 0;
}

.jobbook-compliance-group {
  grid-area: compliance;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.jobbook-compliance-title {
  display: none;
}

.jobbook-compliance-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-compliance-fields label {
  min-width: 0;
}

.jobbook-commission-group {
  grid-area: commission;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.jobbook-commission-title {
  display: none;
}

.jobbook-commission-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--app-gap);
  align-items: end;
}

.jobbook-commission-fields label {
  min-width: 0;
}

.jobbook-general-grid > .jobbook-identity-group,
.jobbook-general-grid > .jobbook-responsibility-group,
.jobbook-general-grid > .jobbook-dates-group,
.jobbook-general-grid > .jobbook-financial-group,
.jobbook-general-grid > .jobbook-compliance-group,
.jobbook-general-grid > .jobbook-commission-group {
  gap: 6px;
  padding: 7px;
}

.jobbook-identity-fields,
.jobbook-responsibility-fields,
.jobbook-dates-fields,
.jobbook-financial-fields,
.jobbook-compliance-fields,
.jobbook-commission-fields {
  gap: 6px;
}

.jobbook-general-grid label,
.jobbook-general-grid input,
.jobbook-general-grid select {
  min-width: 0;
  max-width: 100%;
}

.jobbook-general-grid input,
.jobbook-general-grid select,
.jobbook-budget-field input {
  width: 100%;
  inline-size: 100%;
  flex: 0 1 auto;
}

.field-note {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.system-format-pair-group {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.system-format-pair-title {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.system-format-pair-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--app-gap);
  align-items: end;
}

.system-format-pair-grid label {
  min-width: 0;
}

.system-colour-control input[type="color"] {
  width: 100%;
  min-height: var(--control-min-height);
  padding: 2px;
  cursor: pointer;
}

.system-format-logo-cell {
  display: grid;
  min-width: 0;
  align-self: stretch;
}

.system-format-logo-cell .stationery-logo-preview {
  min-height: 64px;
}

.system-config-list {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  align-self: stretch;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.system-config-list-head {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  padding-bottom: 6px;
}

.system-config-list-head h4 {
  margin: 0;
  font-size: 13px;
}

.system-config-list-grid {
  display: grid;
  gap: 6px;
}

.system-config-list-grid.payment-terms {
  grid-template-columns: minmax(240px, 2fr) minmax(160px, .8fr) minmax(100px, .5fr);
}

.system-config-list-grid.quote-options {
  grid-template-columns: minmax(260px, 2fr) minmax(140px, .7fr) minmax(100px, .5fr);
}

.system-config-list-heading {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.system-config-list-row {
  grid-column: 1 / -1;
  display: grid;
  gap: 6px;
  align-items: center;
}

.system-config-list-grid.payment-terms .system-config-list-row {
  grid-template-columns: minmax(240px, 2fr) minmax(160px, .8fr) minmax(100px, .5fr);
}

.system-config-list-grid.quote-options .system-config-list-row {
  grid-template-columns: minmax(260px, 2fr) minmax(140px, .7fr) minmax(100px, .5fr);
}

.system-config-list-row input,
.system-config-list-row select {
  min-width: 0;
}

.company-commercial-terms-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.company-commercial-terms-grid > .system-config-list {
  grid-column: auto;
  min-width: 0;
  overflow: hidden;
}

.company-commercial-terms-grid .system-config-list-head {
  align-items: flex-start;
}

.company-commercial-terms-grid .system-config-list-head h4,
.company-commercial-terms-grid .system-config-list-head .muted {
  min-width: 0;
}

.company-commercial-terms-grid .system-config-list-grid.payment-terms,
.company-commercial-terms-grid .system-config-list-grid.payment-terms .system-config-list-row {
  grid-template-columns: minmax(0, 1.5fr) minmax(92px, .85fr) minmax(76px, .55fr);
}

.company-commercial-terms-grid .system-config-list-grid.quote-options,
.company-commercial-terms-grid .system-config-list-grid.quote-options .system-config-list-row {
  grid-template-columns: minmax(0, 1.6fr) minmax(96px, .8fr) minmax(76px, .55fr);
}

.company-commercial-terms-grid .system-config-list-row input,
.company-commercial-terms-grid .system-config-list-row select {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}

.hire-day-rule-actions {
  align-items: center;
  justify-content: flex-start;
  margin: 8px 0;
}

.hire-day-rule-table input,
.hire-day-rule-table select {
  min-width: 0;
  width: 100%;
}

.hire-day-rule-table td:last-child {
  width: 92px;
}

@media (max-width: 720px) {
  .system-config-list-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .system-config-list-grid.payment-terms,
  .system-config-list-grid.quote-options,
  .system-config-list-grid.payment-terms .system-config-list-row,
  .system-config-list-grid.quote-options .system-config-list-row {
    grid-template-columns: 1fr;
  }

  .company-commercial-terms-grid {
    grid-template-columns: 1fr;
  }

  .system-config-list-heading {
    display: none;
  }

  .system-format-pair-grid {
    grid-template-columns: 1fr;
  }
}

.migration-progress {
  position: relative;
  height: 24px;
  margin-top: 12px;
  overflow: hidden;
  background: #dfe5eb;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 #fff inset;
}

.migration-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--teal), var(--green));
  transition: width 180ms ease;
}

.migration-progress span {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
}

.migration-process {
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.developer-cli-row {
  align-items: center;
  background: #050914;
  border: 1px solid #1f2a3d;
  border-radius: 6px;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  margin-top: 10px;
  padding: 10px;
}

.developer-cli-prompt {
  color: #8bd5ff;
  font-family: Consolas, "Courier New", monospace;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.developer-cli-row input {
  background: #090f1c;
  border-color: #26344d;
  color: #e5eefc;
  font-family: Consolas, "Courier New", monospace;
}

@media (max-width: 720px) {
  .developer-cli-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .developer-cli-row button {
    width: 100%;
  }
}

.developer-cli-output {
  max-height: 520px;
  overflow: auto;
  tab-size: 2;
  white-space: pre-wrap;
  word-break: break-word;
}

.migration-load-control-frame {
  display: flex;
  flex-direction: column;
  min-height: 245px;
  margin-top: 10px;
}

.migration-load-fields {
  align-items: start;
}

.migration-load-fields label {
  align-self: start;
}

.migration-load-actions {
  align-items: flex-end;
  margin-top: auto;
  padding-top: 14px;
}

.migration-five-row-table {
  max-height: 285px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.migration-five-row-table table {
  min-width: 980px;
}

.migration-five-row-table th {
  top: 0;
  z-index: 2;
}

.equipment-list-edit,
.equipment-list-create,
.equipment-add-grid {
  margin-top: 10px;
}

.equipment-list-panel {
  margin-top: 10px;
  margin-bottom: 10px;
}

.equipment-list-tabs {
  margin-top: 8px;
}

.equipment-list-groups {
  display: grid;
  gap: 12px;
}

.equipment-list-groups.is-compact {
  gap: 8px;
  margin-top: 8px;
}

.equipment-list-venue-group {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}

.equipment-list-venue-heading {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.equipment-list-workspace .equipment-lines-wrap {
  margin-top: 10px;
}

.equipment-paste-actions {
  margin-top: 8px;
}

.equipment-list-window-modal {
  border: 2px solid color-mix(in srgb, var(--line) 78%, var(--accent));
  display: flex;
  flex-direction: column;
  height: calc(100dvh - 130px);
  margin: 12px;
  overflow: visible;
  padding: 22px;
  width: min(1480px, calc(100vw - 320px));
}

.equipment-list-window-modal .equipment-list-panel {
  border: 1px solid var(--line);
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  box-shadow: none;
  margin: 12px 0 0;
  min-height: 0;
  overflow: visible;
  padding: 14px;
}

.equipment-list-window-modal .equipment-lines-wrap {
  min-height: 0;
  overflow: auto;
  padding-bottom: 10px;
}

.budget-preview-note {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 800;
  margin-top: 4px;
}

.budget-preview-note.is-warning {
  color: #b42318;
}

.equipment-list-workspace input:disabled,
.equipment-list-workspace select:disabled,
.equipment-list-workspace button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.equipment-toolbar-menu .report-menu-trigger {
  min-height: 32px;
}

.equipment-toolbar-menu {
  position: relative;
}

.equipment-toolbar-menu .report-menu-panel {
  left: 0;
  right: auto;
  max-width: min(320px, calc(100vw - 32px));
  min-width: min(260px, calc(100vw - 32px));
}

.equipment-paste-actions {
  align-items: flex-start;
  gap: clamp(5px, 1vw, 10px);
  position: relative;
  z-index: 35;
}

.readonly-counter {
  background: var(--surface-2);
  color: var(--muted);
  cursor: default;
}

.equipment-lines-wrap table {
  min-width: 1260px;
}

.equipment-lines-wrap th,
.equipment-lines-wrap td {
  white-space: nowrap;
}

.equipment-item-cell {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 420px;
  white-space: nowrap;
}

.qty-scan-cell {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.qty-scan-cell input {
  width: 64px;
  min-width: 64px;
}

.scan-status-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  min-height: 28px;
  padding: 3px 7px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  font-weight: 900;
  white-space: nowrap;
}

.money-input {
  min-width: 112px;
}

.percent-input {
  min-width: 82px;
}

.small-check {
  inline-size: 16px;
  block-size: 16px;
  min-height: 0;
}

[data-equipment-row-select] {
  inline-size: clamp(13px, 2.6vw, 16px);
  block-size: clamp(13px, 2.6vw, 16px);
  min-height: 0;
}

button,
input,
select,
textarea {
  max-width: 100%;
}

.equipment-scanner-modal {
  width: min(820px, 100%);
}

.equipment-scanner-stage {
  position: relative;
  background: #08111f;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  overflow: hidden;
  padding: 10px;
}

.equipment-scanner-stage video {
  aspect-ratio: 16 / 9;
  background: #050b14;
  border-radius: 6px;
  width: 100%;
}

.pop-stock-window {
  margin-top: 10px;
  overflow: hidden;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  font-family: "Segoe UI", Tahoma, Arial, sans-serif;
}

.pop-stock-title {
  min-height: 32px;
  padding: 7px 10px;
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border-bottom: 1px solid var(--nav-border);
  font-size: 13px;
  font-weight: 900;
}

.pop-stock-title span {
  font-weight: 700;
}

.pop-stock-tabs,
.pop-stock-categories {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  padding: 8px 10px 0;
  border-bottom: 1px solid var(--line);
}

.pop-stock-categories {
  align-items: stretch;
  padding: 8px 10px;
  border-top: 0;
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
}

.pop-tab,
.pop-category {
  min-height: 28px;
  padding: 5px 9px;
  color: var(--ink);
  background: linear-gradient(#ffffff, #dfe4e9);
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: var(--radius) var(--radius) 0 0;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  box-shadow: var(--shadow);
}

.pop-category {
  min-height: 28px;
  border-bottom: 1px solid var(--line);
  border-radius: var(--radius);
}

.pop-tab.is-active,
.pop-category.is-active {
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border-color: var(--nav-border);
  box-shadow: var(--shadow);
}

.pop-stock-category-menu {
  position: relative;
  border-bottom: 1px solid var(--line);
}

.pop-stock-category-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  margin: 7px 10px;
  padding: 6px 10px;
  color: #fff;
  background: linear-gradient(var(--nav-start), var(--nav-end));
  border: 1px solid var(--nav-border);
  border-radius: var(--radius);
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
  list-style: none;
}

.pop-stock-category-trigger::-webkit-details-marker {
  display: none;
}

.stock-take-head {
  align-items: end;
  margin-bottom: 10px;
}

.stock-take-table-wrap {
  margin-top: 10px;
}

.stock-take-counter {
  display: grid;
  grid-template-columns: auto 32px minmax(54px, 76px) 32px;
  gap: 5px;
  align-items: center;
}

.stock-take-counter input {
  min-width: 0;
  text-align: center;
}

.stock-take-counter .chip-button {
  min-height: 30px;
  padding: 5px 7px;
}

.stock-take-app-shell {
  min-height: calc(100vh - 96px);
  align-items: flex-start;
  padding: 0;
}

.stock-take-app-card {
  display: grid;
  width: 100%;
  min-height: calc(100vh - 96px);
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  border-radius: 0;
  box-shadow: none;
}

.stock-take-app-toolbar {
  align-items: end;
}

.stock-take-app-actions {
  margin: 10px 0;
}

.stock-take-admin-reset {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
  margin: 0 0 10px;
  padding: 10px;
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fff7f7;
}

.stock-take-admin-reset label {
  min-width: min(320px, 100%);
  margin: 0;
}

.stock-take-app-table-wrap textarea {
  display: block;
  width: min(320px, 100%);
  margin-top: 6px;
  min-height: 44px;
  resize: vertical;
}

.stock-take-app-counter {
  grid-template-columns: auto minmax(62px, 88px) auto auto;
}

.stock-take-admin-lock {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--soft);
}

.stock-take-app-table-wrap {
  min-height: 0;
  overflow: auto;
}

.stock-take-barcode-list {
  margin-top: 6px;
  font-size: 12px;
}

.stock-take-barcode-list summary {
  cursor: pointer;
  color: var(--link);
  font-weight: 700;
}

.stock-take-barcode-list > div {
  display: grid;
  gap: 6px;
  max-height: 180px;
  overflow: auto;
  padding: 6px 0 0;
}

.scanner-inline-popup {
  position: absolute;
  inset: 10px;
  z-index: 4;
  display: grid;
  place-items: center;
  pointer-events: auto;
}

.scanner-inline-popup > .modal-backdrop {
  position: static;
  width: min(420px, 100%);
  min-height: 0;
  padding: 0;
  background: transparent;
}

.scanner-inline-popup .modal-card {
  width: 100%;
  max-height: 100%;
}

.stock-take-offline-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(7, 16, 27, 0.78);
  backdrop-filter: blur(5px);
}

.stock-take-offline-dialog {
  width: min(440px, 100%);
  padding: 22px;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
}

.stock-take-offline-dialog h2 {
  margin: 0 0 10px;
  font-size: 24px;
}

.stock-take-offline-dialog p {
  margin: 0 0 12px;
}

.stock-take-offline-dialog .solid-button {
  width: 100%;
  justify-content: center;
}

.pop-stock-toolbar {
  display: grid;
  grid-template-columns: minmax(52px, 72px) minmax(44px, 58px) minmax(220px, 1fr) minmax(210px, 300px) 34px 34px;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.pop-stock-toolbar input,
.pop-stock-toolbar select {
  min-height: 30px;
  padding: 5px 7px;
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: 12px;
}

.pop-code-slot {
  background: #e5e9ee !important;
}

.pop-check {
  display: flex;
  grid-auto-flow: column;
  grid-template-columns: auto auto;
  gap: 4px;
  align-items: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.pop-check input {
  width: 14px;
  min-height: 14px;
  padding: 0;
}

.pop-accept,
.pop-reject {
  display: grid;
  width: 30px;
  min-height: 26px;
  place-items: center;
  padding: 0;
  background: linear-gradient(#ffffff, #dfe4e9);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  font-size: 18px;
  font-weight: 900;
}

.pop-accept {
  color: #008000;
}

.pop-reject {
  color: #b00000;
}

.pop-stock-grid {
  max-height: 360px;
  overflow: auto;
  background: var(--surface);
  border: 0;
  border-top: 0;
}

.pop-stock-grid table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  background: var(--surface);
  font-size: 12px;
}

.pop-stock-grid th,
.pop-stock-grid td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  line-height: 1.3;
  white-space: nowrap;
}

.pop-stock-grid th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: linear-gradient(#edf1f5, #dce3ea);
  color: #2a333c;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.pop-stock-grid tbody tr {
  cursor: default;
}

.pop-stock-grid tbody tr:hover {
  background: var(--soft-blue);
}

.pop-stock-grid tbody tr.is-selected {
  background: var(--blue);
  color: #fff;
}

.pop-stock-grid tbody tr.is-selected td {
  color: #fff;
}

.stock-picker-indicator {
  width: 18px;
  text-align: center;
  font-weight: 900;
}

.number-cell {
  text-align: right;
}

.danger-text {
  color: #a61b1b;
  font-weight: 800;
}

.equipment-planner-wrap {
  max-height: 68vh;
}

.equipment-planner-table th,
.equipment-planner-table td {
  min-width: 96px;
}

.equipment-planner-table th:nth-child(1),
.equipment-planner-table td:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 120px;
  background: #fff;
}

.equipment-planner-table th:nth-child(2),
.equipment-planner-table td:nth-child(2) {
  position: sticky;
  left: 120px;
  z-index: 2;
  min-width: 240px;
  background: #fff;
}

.equipment-planner-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
}

.equipment-planner-table thead th:nth-child(1),
.equipment-planner-table thead th:nth-child(2) {
  z-index: 4;
}

.lockable-section {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.lockable-section:disabled {
  opacity: 0.72;
}

.locked-banner {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 8px 0 10px;
  padding: 7px 8px;
  background: var(--soft-gold);
  border: 1px solid #c6a45b;
  border-radius: var(--radius);
}

.schedule-shell {
  display: grid;
  gap: 10px;
}

.schedule-form {
  grid-template-columns: minmax(150px, 0.8fr) minmax(150px, 0.8fr) minmax(110px, 0.5fr) minmax(220px, 1.5fr) minmax(120px, 0.6fr);
}

.hot-job-open {
  cursor: zoom-in;
}

.stack-actions {
  display: grid;
  gap: 5px;
  min-width: 76px;
}

.auth-grid {
  grid-template-columns: 1fr;
}

.auth-shell {
  display: grid;
  min-height: calc(100vh - 150px);
  place-items: center;
}

.auth-card {
  width: min(460px, 100%);
  padding: 14px;
}

.demo-logins,
.login-note {
  display: grid;
  gap: 2px;
}

.demo-logins {
  margin-top: 14px;
  padding: 8px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--muted);
  font-size: 12px;
}

.wide-field {
  grid-column: span 2;
}

.stock-photo-capture input[type="file"] {
  min-height: 44px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.stock-photo-preview-wrap {
  display: flex;
  align-items: flex-start;
}

.stock-photo-preview {
  width: min(220px, 100%);
  max-height: 180px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.admin-editor,
.workflow-panel {
  margin-bottom: 10px;
}

.address-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.address-type-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.address-record-filter-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.address-filter-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.address-record-row {
  cursor: pointer;
}

.address-record-row:hover {
  background: var(--surface-2);
}

.address-result-subhead {
  margin-top: 14px;
}

.address-detail-modal {
  width: min(920px, 100%);
}

.address-type-picker label {
  align-items: center;
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: inline-flex;
  gap: 6px;
  min-height: 36px;
  padding: 6px 10px;
}

.address-type-picker input {
  margin: 0;
}

.address-form-section {
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 10px 0;
  padding: 10px;
}

.address-form-section legend {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0 6px;
  text-transform: uppercase;
}

.address-multi-select {
  position: relative;
}

.address-multi-select summary {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  cursor: pointer;
  display: flex;
  min-height: 34px;
  overflow: hidden;
  padding: 7px 28px 7px 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.address-multi-select summary::-webkit-details-marker {
  display: none;
}

.address-multi-select summary::after {
  content: "v";
  position: absolute;
  right: 10px;
}

.address-multi-select[open] summary::after {
  content: "^";
}

.address-multi-select-menu {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  display: grid;
  gap: 5px;
  left: 0;
  max-height: 240px;
  min-width: 100%;
  overflow: auto;
  padding: 6px;
  position: absolute;
  top: calc(100% + 4px);
  z-index: 15;
}

.crew-schedule-layout {
  display: grid;
  grid-template-columns: minmax(360px, 0.95fr) minmax(420px, 1.05fr);
  gap: 10px;
  align-items: start;
}

.address-edit-actions {
  margin-top: 10px;
}

.address-toolbar input {
  flex: 1 1 260px;
  min-width: 220px;
}

@media (max-width: 720px) {
  .address-record-filter-bar {
    grid-template-columns: 1fr;
  }
}

.admin-user-editor {
  margin-top: 10px;
  padding: 10px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 6px;
  max-height: 220px;
  overflow: auto;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.permission-grid {
  max-height: 300px;
}

.checkbox-tile {
  display: flex;
  min-height: 28px;
  gap: 7px;
  align-items: center;
  padding: 5px 7px;
  color: var(--ink);
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: 12px;
  font-weight: 700;
}

.checkbox-tile input {
  width: auto;
  min-height: 0;
}

.rider-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.32fr) minmax(620px, 1fr);
  gap: 10px;
  align-items: start;
}

.rider-card-list {
  margin-top: 10px;
}

.rider-editor-panel {
  overflow: hidden;
}

.rider-sheet {
  --rider-primary: var(--blue);
  --rider-accent: var(--green);
  --rider-soft: var(--soft-blue);
  color: #000;
  background: #fff;
  border: 1px solid #111;
  box-shadow: var(--shadow);
}

.rider-header {
  display: grid;
  grid-template-columns: 160px minmax(220px, 0.8fr) minmax(360px, 1fr);
  gap: 10px;
  align-items: start;
  padding: 10px;
  border-top: 4px solid #111;
}

.rider-logo {
  display: grid;
  min-height: 152px;
  place-items: start center;
}

.rider-logo img {
  max-width: 140px;
  max-height: 150px;
  object-fit: contain;
}

.rider-title {
  display: grid;
  gap: 6px;
  align-self: start;
  padding-top: 4px;
}

.rider-title input {
  min-height: 38px;
  color: #000;
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 26px;
  font-weight: 900;
  text-align: center;
}

.rider-title span {
  color: var(--muted);
  text-align: center;
  font-weight: 800;
}

.rider-meta {
  display: grid;
  grid-template-columns: minmax(140px, 0.7fr) minmax(190px, 1fr);
  align-items: stretch;
}

.rider-meta label {
  display: contents;
}

.rider-meta label > span {
  display: grid;
  align-items: center;
  justify-items: end;
  min-height: 28px;
  padding: 3px 6px;
  color: #000;
  font-size: 13px;
  font-weight: 900;
  border: 1px solid #111;
  border-right: 0;
  border-bottom: 0;
}

.rider-meta label > input,
.rider-meta .inline-fields {
  min-height: 28px;
  border-radius: 0;
  border-color: #111;
  border-bottom: 0;
}

.rider-meta label:nth-last-child(1) > span,
.rider-meta label:nth-last-child(1) > input {
  border-bottom: 1px solid #111;
}

.inline-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.inline-fields input {
  border: 0;
  border-right: 1px solid #111;
  border-radius: 0;
}

.inline-fields input:last-child {
  border-right: 0;
}

.rider-table-wrap {
  border: 0;
  border-radius: 0;
}

.rider-table {
  min-width: 860px;
  color: #000;
  font-size: 13px;
}

.rider-table th,
.rider-table td {
  padding: 3px;
  border: 1px solid #111;
  vertical-align: top;
}

.rider-table th {
  text-align: center;
  font-style: italic;
}

.rider-table input,
.rider-table textarea {
  min-height: 28px;
  color: #000;
  background: #fff;
  border-color: #c4c9cf;
  border-radius: 0;
}

.rider-table textarea {
  resize: vertical;
}

.requested-head {
  color: #000;
  background: var(--rider-accent);
  font-style: normal !important;
  text-transform: uppercase;
}

.supplied-head {
  color: #000;
  background: #9cc4e3;
  font-style: normal !important;
  text-transform: uppercase;
}

.availability-head,
.rider-table th:last-child {
  color: #000;
  background: #ff5555;
}

.rider-section-row td {
  padding: 0;
  background: #000;
}

.rider-section-row input {
  color: #fff;
  background: #000;
  border: 0;
  font-weight: 900;
  text-align: center;
}

.rider-availability-cell {
  display: grid;
  gap: 4px;
}

.upload-preview {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(120px, 1fr) minmax(160px, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px;
  color: var(--ink);
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: 12px;
}

.upload-preview img {
  max-width: 150px;
  max-height: 86px;
  object-fit: contain;
  background: transparent;
  border: 1px solid var(--line);
}

.danger-button {
  color: #7a201a;
}

button[hidden] {
  display: none;
}

.gantt,
.crew-gantt {
  display: grid;
  gap: 6px;
}

.crew-filter-panel {
  margin-bottom: 10px;
}

.crew-filter-bar {
  display: grid;
  grid-template-columns: minmax(170px, 220px) minmax(280px, 1fr);
  gap: 10px;
}

.crew-sheet-head,
.crew-sheet-filters,
.crew-match-card {
  display: grid;
  grid-template-columns: minmax(110px, 0.65fr) minmax(120px, 0.75fr) minmax(260px, 1.6fr);
}

.crew-sheet-head {
  min-width: 560px;
  color: #000;
  background: #fff;
  border: 1px solid #111;
  border-bottom: 0;
  font-size: 18px;
  font-weight: 900;
  text-decoration: underline;
}

.crew-sheet-head span,
.crew-sheet-filters span {
  min-height: 32px;
  padding: 4px 5px;
  border-right: 1px solid #111;
}

.crew-sheet-head span:last-child,
.crew-sheet-filters span:last-child {
  border-right: 0;
}

.crew-sheet-filters {
  min-width: 560px;
  height: 22px;
  background: #f0f2f4;
  border: 1px solid #111;
}

.crew-sheet-filters span::after {
  float: right;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  color: #65717c;
  content: "\25BE";
  font-size: 9px;
  line-height: 14px;
  text-align: center;
  background: #fff;
  border: 1px solid #9ba5af;
}

.crew-match-list {
  display: grid;
  gap: 0;
  overflow: auto;
}

.crew-match-card {
  min-width: 560px;
  padding: 0;
  color: #000;
  background: #fff;
  border: 1px solid #111;
  border-top: 0;
  text-align: left;
}

.crew-match-card > span {
  min-height: 52px;
  padding: 5px;
  border-right: 1px solid #111;
}

.crew-match-card > span:last-child {
  border-right: 0;
}

.crew-match-card.is-available {
  background: #f6f7f8;
}

.crew-role {
  font-weight: 800;
}

.crew-chart-panel,
.transport-schedule-panel {
  margin-bottom: 10px;
}

.transport-schedule-panel {
  position: sticky;
  top: 101px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  height: calc(100vh - 113px);
  min-height: 420px;
  overflow: hidden;
  background: var(--surface);
}

.crew-chart-wrap {
  max-height: 68vh;
}

.crew-chart-table {
  min-width: 1280px;
}

.crew-chart-table th {
  background: linear-gradient(#edf1f5, #dce3ea);
  color: #2a333c;
}

.crew-role-col,
.crew-name-col {
  min-width: 150px;
  background: var(--surface-2) !important;
}

.crew-day-cell {
  width: 155px;
  min-width: 155px;
  padding: 6px;
  vertical-align: top;
}

.crew-day-cell select,
.crew-day-cell input {
  min-height: 26px;
  margin-bottom: 4px;
  padding: 3px 5px;
  font-size: 12px;
}

.crew-day-cell input[readonly] {
  background: #eef3f8;
  color: var(--muted);
}

.crew-rate-comparison {
  display: grid;
  gap: 2px;
  margin: 2px 0 5px;
  padding: 5px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: var(--text);
  font-size: 11px;
  line-height: 1.25;
}

.crew-day-cell.is-open {
  background: #f8fafc;
}

.crew-day-cell.is-booked {
  background: var(--soft-blue);
}

.crew-booking {
  display: grid;
  gap: 4px;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 #fff inset;
}

.format-preview,
.stationery-preview-card {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.scheme-preview-swatch {
  display: block;
  width: 100%;
  min-height: 18px;
  border: 1px solid var(--nav-border);
  border-radius: var(--radius);
  background: linear-gradient(90deg, var(--nav-start), var(--nav-end));
}

.stationery-preview-card img {
  max-width: 180px;
  max-height: 110px;
  object-fit: contain;
  background: transparent;
}

.admin-template-tabs {
  margin-bottom: 10px;
}

.transport-manager-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.transport-schedule-dock {
  flex: 0 0 auto;
  display: block;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  margin-bottom: 10px;
  overflow: hidden;
  position: relative;
  z-index: 2;
}

.transport-blue-header {
  align-items: center;
  background: #0b3a78;
  color: white;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 8px 10px;
}

.transport-duty-menu {
  display: block;
}

.transport-duty-summary {
  cursor: pointer;
  list-style: none;
}

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

.transport-duty-menu-icon {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 18px;
  line-height: 1;
}

.transport-blue-header strong {
  display: block;
  font-size: 17px;
  line-height: 1.15;
  text-transform: uppercase;
}

.transport-blue-header span {
  color: rgba(255, 255, 255, 0.78);
  font-size: 12px;
}

.transport-blue-header .checkbox-tile {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.25);
  color: white;
}

.transport-manager-grid.compact {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin: 0;
  padding: 8px;
}

.transport-manager-card {
  display: grid;
  gap: 6px;
  padding: 8px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.transport-manager-grid.compact .transport-manager-card {
  gap: 4px;
  padding: 6px;
}

.transport-manager-grid.compact .transport-manager-card label span,
.transport-manager-grid.compact .manager-phone {
  font-size: 12px;
}

.manager-phone {
  color: var(--blue);
  font-weight: 900;
  text-decoration: underline;
}

.transport-schedule-panel .transport-tab-row,
.transport-schedule-panel .transport-filter-line,
.transport-schedule-panel .transport-filter-row {
  flex: 0 0 auto;
}

.transport-trip-table-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.transport-trip-table-wrap table {
  min-width: 1120px;
}

.transport-trip-table-wrap th {
  top: 0;
  z-index: 2;
}

.transport-gps-layout {
  display: grid;
  grid-template-columns: minmax(420px, 1.1fr) minmax(320px, 0.9fr);
  gap: 10px;
  align-items: start;
}

.driver-nav-panel {
  overflow: hidden;
}

.driver-nav-hero {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  padding: 10px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.nav-link-button {
  display: inline-grid;
  min-width: 142px;
  place-items: center;
  text-decoration: none;
}

.driver-map {
  position: relative;
  min-height: 280px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.38) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,0.38) 1px, transparent 1px),
    linear-gradient(135deg, #dcebf6, #e9edf2);
  background-size: 42px 42px, 42px 42px, auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.map-road {
  position: absolute;
  background: #53616d;
  border: 4px solid #f7f7f7;
  box-shadow: 0 0 0 1px #8e99a4;
}

.map-road-main {
  left: 7%;
  top: 50%;
  width: 86%;
  height: 28px;
  transform: rotate(-12deg);
}

.map-road-side {
  left: 46%;
  top: 18%;
  width: 28px;
  height: 70%;
  transform: rotate(22deg);
}

.map-pin,
.map-vehicle {
  position: absolute;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 900;
  border-radius: 999px;
  box-shadow: var(--shadow);
}

.map-pin {
  width: 34px;
  height: 34px;
  background: var(--red);
}

.map-origin {
  left: 13%;
  top: 56%;
}

.map-destination {
  right: 13%;
  top: 34%;
  background: var(--green);
}

.map-vehicle {
  left: 48%;
  top: 48%;
  width: 64px;
  height: 28px;
  background: var(--blue);
  border-radius: var(--radius);
  font-size: 11px;
}

.route-step-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.route-step {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 8px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.route-step-number {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  color: #fff;
  background: var(--blue);
  border-radius: 999px;
  font-weight: 900;
}

.driver-trip-list {
  display: grid;
  gap: 8px;
  max-height: 70vh;
  overflow: auto;
}

.driver-trip-card {
  display: grid;
  gap: 6px;
  padding: 9px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 1px 0 #fff inset;
}

.driver-trip-card.is-active {
  border-color: #245b88;
  background: var(--soft-blue);
}

.gantt-row {
  display: grid;
  grid-template-columns: minmax(180px, 280px) minmax(180px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.gantt-date {
  display: block;
  margin-top: 2px;
  font-size: 11px;
}

.gantt-track {
  position: relative;
  height: 18px;
  overflow: hidden;
  background: #e1e5ea;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.gantt-track i {
  position: absolute;
  top: 2px;
  bottom: 2px;
  display: block;
  background: linear-gradient(#4e86b4, #245b88);
  border: 1px solid #174567;
  border-radius: 2px;
}

.transport-sheet {
  background: #fff;
  border: 1px solid #000;
  box-shadow: var(--shadow);
}

.transport-banner {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  min-height: 118px;
  color: #fff;
  background: #082c68;
  border-bottom: 1px solid #000;
}

.transport-banner img {
  width: 76px;
  height: 106px;
  margin-left: 65px;
  object-fit: contain;
  background: transparent;
}

.transport-banner h2 {
  justify-self: center;
  color: #fff;
  font-size: 26px;
  text-decoration: underline;
}

.transport-contact-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr 0.85fr 1.15fr 0.85fr 0.85fr;
  border-bottom: 1px solid #000;
}

.contact-label,
.contact-value {
  min-height: 40px;
  padding: 4px 6px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  font-weight: 800;
}

.contact-label {
  display: grid;
  align-items: center;
  justify-items: end;
  color: #fff;
  background: #082c68;
  text-decoration: underline;
}

.contact-value {
  display: grid;
  align-items: center;
  justify-items: center;
  color: #000;
  background: #99d4df;
  white-space: pre-line;
  text-align: center;
}

.transport-table-wrap {
  border: 0;
  border-radius: 0;
}

.transport-sheet-table {
  min-width: 920px;
  color: #000;
  font-size: 14px;
}

.transport-sheet-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  color: #fff;
  background: #082c68;
  border: 1px solid #000;
  text-align: center;
  text-decoration: underline;
}

.transport-sheet-table th::after {
  float: right;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  color: #65717c;
  content: "\25BE";
  font-size: 9px;
  line-height: 14px;
  text-align: center;
  background: #fff;
  border: 1px solid #9ba5af;
}

.transport-sheet-table td {
  min-height: 74px;
  padding: 6px 4px;
  background: #fff;
  border: 1px solid #000;
  text-align: center;
  vertical-align: middle;
}

.transport-sheet-table td:last-child {
  text-align: left;
  white-space: normal;
}

.transport-time {
  font-weight: 900;
}

.transport-vehicle-cell {
  background: #e3b6f4 !important;
  font-weight: 900;
  white-space: pre-line;
}

.transport-alert-row td {
  background: #ffc400;
  font-weight: 900;
}

.strong {
  font-weight: 900;
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.empty {
  display: grid;
  min-height: 160px;
  place-items: center;
  color: var(--muted);
  background: var(--surface);
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius);
  text-align: center;
}

.toast {
  position: fixed;
  right: 20px;
  bottom: 20px;
  max-width: min(380px, calc(100vw - 40px));
  padding: 10px 12px;
  color: #fff;
  background: var(--ink);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1180px) {
  .jobbook-general-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "identity dates"
      "identity responsibility"
      "compliance responsibility"
      "financials financials"
      "commission commission";
  }

  :root {
    --app-font-size: clamp(10.8px, calc(10px + 0.24vw), 12.8px);
    --app-gap: 8px;
    --app-pad: 8px;
    --control-min-height: clamp(32px, calc(29px + 0.48vw), 36px);
    --menu-font-size: clamp(10px, calc(9.35px + 0.24vw), 12.2px);
    --tab-font-size: clamp(10px, calc(9.35px + 0.24vw), 12.2px);
    --kpi-height: 48px;
    --kpi-value-size: 16px;
  }

  .topbar,
  .layout,
  .module-grid,
  .jobbook-layout,
  .grid-2,
  .grid-3 {
    grid-template-columns: 1fr;
  }

  .jobbook-list {
    position: static;
    max-height: none;
  }

  .sidebar {
    grid-column: 1;
    grid-row: auto;
    position: sticky;
    top: 154px;
    display: flex;
    height: auto;
    gap: 8px;
    overflow-x: auto;
    padding: 10px 14px;
    background: linear-gradient(var(--nav-start), var(--nav-end));
    border-right: 0;
    border-bottom: 1px solid var(--nav-border);
  }

  .content {
    grid-column: 1;
    grid-row: auto;
  }

  .main-menu-toggle {
    grid-column: 1;
    grid-row: auto;
    top: 154px;
    width: 100%;
    height: 13px;
    min-height: 13px;
    margin-left: 0;
    border-left: 1px solid var(--nav-border);
    border-radius: 0;
    font-size: 15px;
    writing-mode: horizontal-tb;
  }

  body:not(.main-menu-collapsed) .main-menu-toggle {
    margin-left: 0;
  }

  body.main-menu-collapsed .layout {
    grid-template-columns: 1fr;
  }

  body.main-menu-collapsed .sidebar {
    display: none;
  }

  .transport-schedule-panel {
    top: 154px;
    height: calc(100vh - 166px);
  }

  .nav-button {
    flex: 0 0 auto;
    width: auto;
    margin-bottom: 0;
  }

  .global-controls,
  .board,
  .resource-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .global-controls label:has(#searchInput) {
    min-width: 0;
  }

  .global-search-results {
    position: fixed;
    max-height: calc(100vh - 166px);
  }

  .address-workspace,
  .crew-schedule-layout,
  .crew-filter-bar,
  .transport-manager-grid,
  .transport-gps-layout,
  .rider-layout,
  .route-step-grid {
    grid-template-columns: 1fr;
  }

  .pop-stock-toolbar {
    grid-template-columns: minmax(52px, 72px) minmax(44px, 58px) minmax(220px, 1fr) 32px 32px;
  }

  .pop-warehouse {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  :root {
    --app-font-size: clamp(9.6px, calc(8.4px + 0.72vw), 11.4px);
    --app-line-height: 1.22;
    --app-gap: 6px;
    --app-pad: 6px;
    --control-min-height: clamp(32px, calc(28px + 1.6vw), 38px);
    --menu-font-size: clamp(8.6px, calc(7.4px + 0.7vw), 10.4px);
    --tab-font-size: clamp(8.4px, calc(7.2px + 0.68vw), 10.2px);
    --kpi-height: 38px;
    --kpi-value-size: 12px;
  }

  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  body,
  .layout,
  .content,
  .panel,
  .record-card,
  .modal-card,
  .view-head,
  .panel-head,
  .actions,
  .chip-row {
    max-width: 100%;
    min-width: 0;
  }

  .content,
  .panel,
  .record-card,
  .driver-trip-card,
  .whatsapp-message-bubble,
  label,
  td,
  th {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .topbar,
  .content {
    padding-left: var(--app-pad);
    padding-right: var(--app-pad);
  }

  .topbar {
    position: static;
    z-index: 20;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .brand {
    align-items: flex-start;
  }

  .brand-mark {
    height: 52px;
  }

  .brand-mark img {
    max-width: 66px;
  }

  .layout {
    display: grid;
    grid-template-columns: 1fr;
    min-height: auto;
    position: relative;
  }

  .sidebar {
    position: absolute;
    top: 48px;
    left: 0;
    right: 0;
    z-index: 18;
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    height: auto;
    max-width: 100vw;
    padding: 8px 10px;
    overflow: visible;
    background: linear-gradient(var(--nav-start), var(--nav-end));
    border: 1px solid var(--nav-border);
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid var(--nav-border);
    box-shadow: 0 10px 24px rgba(20, 28, 35, 0.22);
  }

  .main-menu-toggle {
    position: sticky;
    top: 0;
    z-index: 19;
    justify-self: start;
    width: 46px;
    height: 44px;
    min-height: 44px;
    margin: 0 0 4px 0;
    border: 1px solid var(--nav-border);
    border-left: 0;
    border-radius: 0 0 5px 0;
    font-size: 24px;
    writing-mode: horizontal-tb;
  }

  body:not(.main-menu-collapsed) .main-menu-toggle {
    margin-left: 0;
  }

  .sidebar .nav-button {
    width: 100%;
    min-width: 0;
    margin-bottom: 0;
    padding: 11px 12px;
    text-align: left;
    white-space: normal;
  }

  .nav-submenu {
    margin: 0 0 6px 8px;
  }

  .nav-submenu-button {
    min-height: 34px;
    font-size: 10.5px;
  }

  body:not(.main-menu-collapsed) .content {
    padding-top: 8px;
  }

  .transport-schedule-panel {
    top: 0;
    height: calc(100dvh - 20px);
    min-height: 520px;
  }

  .nav-button,
  .ghost-button,
  .solid-button,
  .chip-button,
  .tab-button,
  input,
  select {
    min-height: var(--control-min-height);
  }

  .nav-button,
  .tab-button {
    padding: 8px 10px;
  }

  .user-panel {
    min-width: 0;
  }

  .user-chip {
    align-items: stretch;
    flex-direction: column;
    justify-content: flex-start;
  }

  .user-chip > span:first-child {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .notification-menu-wrap {
    position: static;
    display: block;
    width: 100%;
  }

  .notification-bell {
    justify-content: center;
    width: 100%;
    min-height: 44px;
  }

  .notification-menu {
    position: fixed;
    top: 8px;
    right: var(--app-pad);
    left: var(--app-pad);
    width: auto;
    max-height: calc(100dvh - 16px);
    z-index: 1000;
  }

  .notification-menu-head {
    position: sticky;
    top: -8px;
    z-index: 1;
    background: var(--surface);
  }

  .content {
    padding-top: 10px;
  }

  .auth-shell {
    min-height: calc(100dvh - 20px);
    align-items: stretch;
    padding: 10px 0;
    place-items: start stretch;
  }

  .auth-card {
    width: 100%;
    max-width: none;
    padding: 10px;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }

  .auth-grid,
  .demo-logins {
    grid-template-columns: 1fr;
  }

  .auth-setup-card {
    grid-template-columns: 1fr;
  }

  .auth-qr-code {
    max-width: min(180px, 78vw);
  }

  .auth-card code {
    display: block;
    max-width: 100%;
    padding: 8px;
    overflow-wrap: anywhere;
    white-space: normal;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 6px;
  }

  .auth-card .record-card .muted {
    overflow-wrap: anywhere;
  }

  .view-head {
    gap: 8px;
    padding: 8px 10px;
  }

  .view-head h2 {
    font-size: 1.22rem;
  }

  .view-head p {
    display: none;
  }

  .report-menu {
    width: 100%;
  }

  .report-menu-trigger {
    width: 100%;
    justify-content: center;
  }

  .report-menu-panel {
    left: 0;
    right: auto;
    width: min(92vw, 340px);
    min-width: 0;
  }

  .global-print-menu {
    width: auto;
  }

  .global-print-trigger {
    width: 34px;
    min-width: 34px;
  }

.web-user-actions .global-print-menu,
.web-user-actions .global-print-trigger {
  width: 100%;
}

.web-header-tools .notification-menu-wrap,
.web-header-tools .notification-bell,
.web-header-tools .global-print-menu,
.web-header-tools .global-print-trigger {
  width: 100%;
}

  .equipment-toolbar-menu {
    width: auto;
  }

  .equipment-toolbar-menu .report-menu-trigger {
    width: auto;
    justify-content: center;
  }

  .equipment-toolbar-menu .report-menu-panel {
    width: min(88vw, 320px);
  }

  .equipment-list-window-modal {
    height: calc(100vh - 36px);
    margin: 6px;
    padding: 10px;
    width: calc(100vw - 24px);
  }

  .equipment-list-window-modal .equipment-list-panel {
    padding: 8px;
  }

  .global-controls,
  .board,
  .whatsapp-layout,
  .form-grid,
  .resource-grid,
  .grid-2,
  .grid-2.wide-left,
  .grid-3,
  .module-grid,
  .jobbook-layout,
  .admin-editor,
  .admin-user-editor,
  .builder-preview-grid {
    grid-template-columns: 1fr;
  }

  .global-controls label:has(#searchInput) {
    min-width: 0;
  }

  .global-search-results {
    position: static;
    width: 100%;
    max-height: none;
    box-shadow: var(--shadow);
  }

  .kpi-grid {
    display: grid;
    grid-auto-flow: initial;
    grid-auto-columns: initial;
    grid-template-columns: repeat(var(--kpi-count, 6), minmax(0, 1fr));
    gap: 3px;
    overflow-x: hidden;
    width: 100%;
    padding-bottom: 2px;
  }

  .kpi {
    height: var(--kpi-height);
    min-height: var(--kpi-height);
    max-height: var(--kpi-height);
    min-width: 0;
    padding: 4px 5px;
  }

  .kpi .label {
    font-size: clamp(5.8px, 1.85vw, 8px);
    line-height: 1.05;
  }

  .kpi .value {
    margin-top: 1px;
    font-size: clamp(8px, 3.15vw, var(--kpi-value-size));
    line-height: 1.05;
  }

  .kpi .note {
    display: none;
  }

  .panel {
    padding: 9px;
  }

  .panel-head .actions,
  .view-head .actions {
    width: 100%;
  }

  .whatsapp-compose,
  .whatsapp-contact {
    grid-template-columns: 1fr;
  }

  .whatsapp-layout {
    gap: 0;
    min-height: calc(100dvh - 78px);
  }

  .whatsapp-layout.is-thread-list .whatsapp-chat-panel {
    display: none;
  }

  .whatsapp-layout.is-chat-open .whatsapp-sidebar {
    display: none;
  }

  .whatsapp-sidebar {
    min-height: 0;
    max-height: none;
    height: calc(100dvh - 128px);
    overflow: auto;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    -webkit-overflow-scrolling: touch;
  }

  .whatsapp-contact-list {
    display: grid;
    max-height: 30dvh;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  .messenger-online-strip {
    margin-bottom: 8px;
    border-left: 0;
    border-right: 0;
  }

  .messenger-online-user {
    min-width: 58px;
  }

  .whatsapp-thread-list {
    gap: 6px;
  }

  .whatsapp-thread {
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 8px;
    border-radius: 0;
  }

  .whatsapp-thread-main {
    min-height: 44px;
  }

  .whatsapp-chat-panel {
    display: flex;
    flex-direction: column;
    min-height: 64dvh;
    height: calc(100dvh - 132px);
    overflow: hidden;
    padding: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }

  .whatsapp-chat-panel > .panel-head {
    position: sticky;
    top: 0;
    z-index: 2;
    flex: 0 0 auto;
    padding: 10px 12px;
    background: #fff;
    border-bottom: 1px solid var(--line);
  }

  .whatsapp-chat-panel > .panel-head h3 {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 6px;
  }

  .messenger-back-button {
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 34px;
    align-items: center;
    padding: 5px 8px;
  }

  .whatsapp-chat-panel > .panel-head .actions {
    justify-content: flex-end;
  }

  .whatsapp-chat-panel > .panel-head .messenger-chat-participants {
    display: flex;
    max-height: 40px;
    overflow: hidden;
  }

  .whatsapp-messages {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding: 12px 10px;
    border: 0;
    border-radius: 0;
    background:
      linear-gradient(rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.78)),
      #dfe9df;
    -webkit-overflow-scrolling: touch;
  }

  .whatsapp-message {
    max-width: 82%;
    border: 0;
  }

  .whatsapp-message-bubble {
    padding: 8px 10px;
    border: 0;
    border-radius: 14px 14px 14px 4px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
  }

  .whatsapp-message.is-own .whatsapp-message-bubble {
    border-radius: 14px 14px 4px 14px;
  }

  .whatsapp-message-row {
    gap: 6px;
  }

  .whatsapp-message .messenger-avatar {
    width: 28px;
    height: 28px;
  }

  .messenger-sender-name {
    display: inline-block;
    margin-bottom: 1px;
    font-size: 11px;
  }

  .whatsapp-message-bubble > .muted {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    margin-top: 3px;
    font-size: 10px;
  }

  .whatsapp-audio {
    width: min(250px, 72vw);
  }

  .message-read-wrap {
    margin-left: 4px;
  }

  .message-read-receipt {
    width: 17px;
    height: 17px;
    font-size: 10px;
  }

  .message-read-list {
    position: absolute;
    right: 8px;
    bottom: calc(100% + 4px);
    max-width: 86vw;
    border-radius: 10px;
  }

  .whatsapp-compose {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    gap: 4px;
    flex: 0 0 auto;
    margin-top: 0;
    padding: 8px;
    background: #f8fafc;
    border-top: 1px solid var(--line);
  }

  .whatsapp-compose .icon-button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: 50%;
  }

  .whatsapp-compose textarea {
    grid-column: 1 / -1;
    min-height: 44px;
    max-height: 96px;
    resize: none;
    border-radius: 999px;
    padding: 11px 14px;
  }

  .messenger-quick-emoji {
    min-width: 0;
    gap: 3px;
    overflow-x: visible;
    padding-bottom: 0;
  }

  .whatsapp-recording-controls {
    grid-column: 1 / -1;
    justify-content: space-between;
  }

  .messenger-attachment-controls {
    grid-column: auto;
    flex-wrap: nowrap;
    gap: 4px;
    justify-content: center;
  }

  .whatsapp-compose .messenger-icon-button {
    width: 30px;
    min-width: 30px;
    min-height: 30px;
    height: 30px;
    padding: 4px;
    border-radius: 50%;
  }

  .whatsapp-compose .messenger-control-icon {
    width: 15px;
    height: 15px;
  }

  .whatsapp-compose .messenger-emoji-button {
    min-width: 25px;
    min-height: 30px;
    padding: 4px 5px;
    font-size: 14px;
  }

  .whatsapp-compose > .solid-button {
    min-height: 30px;
    padding: 4px 8px;
  }

  .whatsapp-recording-controls button {
    flex: 1 1 0;
    justify-content: center;
  }

  .messenger-image-attachment {
    width: min(250px, 72vw);
    max-height: 280px;
  }

  body.hireops-apk .whatsapp-chat-panel {
    height: calc(100dvh - 108px);
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head {
    gap: 4px;
    padding: 6px 8px;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head h3 {
    gap: 4px;
    font-size: 12px;
    line-height: 1.1;
  }

  body.hireops-apk .messenger-back-button {
    min-height: 28px;
    padding: 3px 7px;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head .actions {
    gap: 4px;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head .messenger-chat-participants {
    max-height: 18px;
    font-size: 10px;
    line-height: 1.1;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head .danger-button {
    min-height: 28px;
    padding: 3px 7px;
  }

  body.hireops-apk .whatsapp-compose {
    gap: 3px;
    padding: 5px 6px;
  }

  body.hireops-apk .whatsapp-compose textarea {
    min-height: 34px;
    max-height: 64px;
    padding: 8px 12px;
  }

  body.hireops-apk .whatsapp-compose .messenger-icon-button {
    width: 28px;
    min-width: 28px;
    min-height: 28px;
    height: 28px;
  }

  body.hireops-apk .whatsapp-compose > .solid-button {
    min-height: 28px;
    padding: 3px 8px;
  }

  .help-tab-row,
  .tab-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
  }

  .tab-button {
    flex: 0 0 auto;
  }

  .actions,
  .chip-row {
    flex-wrap: wrap;
    gap: 6px;
  }

  .actions > *,
  .chip-row > * {
    min-width: 0;
  }

  .actions > button,
  .actions > a,
  .chip-row > button,
  .chip-row > a {
    flex: 1 1 auto;
  }

  .map-view-button {
    flex: 0 0 34px;
    width: 34px;
    min-width: 34px;
    height: 34px;
  }

  .wide-field {
    grid-column: auto;
  }

  .jobbook-general-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "identity"
      "compliance"
      "dates"
      "responsibility"
      "financials"
      "commission";
  }

  .view-head,
  .panel-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .gantt-row {
    grid-template-columns: 1fr;
  }

  .transport-banner {
    grid-template-columns: 80px 1fr;
    min-height: 92px;
  }

  .transport-banner img {
    width: 58px;
    height: 78px;
    margin-left: 10px;
  }

  .transport-banner h2 {
    font-size: 18px;
    text-align: center;
  }

  .transport-contact-grid {
    grid-template-columns: 1fr 1fr;
  }

  .rider-header,
  .rider-meta {
    grid-template-columns: 1fr;
  }

  .rider-meta label > span {
    justify-items: start;
    border-right: 1px solid #111;
  }

  .rider-title input {
    font-size: 20px;
  }

  .contact-label {
    justify-items: start;
  }

  .pop-stock-toolbar {
    grid-template-columns: 60px 56px 1fr 32px 32px;
  }

  .pop-search,
  .pop-warehouse {
    grid-column: 1 / -1;
  }

  .table-wrap {
    max-width: 100%;
    overflow-x: hidden;
  }

  .table-wrap table,
  .transport-trip-table-wrap table,
  .migration-five-row-table table,
  .pop-stock-grid table,
  .rider-table,
  .equipment-planner-table,
  .transport-sheet-table {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .table-wrap thead,
  .transport-trip-table-wrap thead,
  .migration-five-row-table thead,
  .pop-stock-grid thead,
  .equipment-planner-table thead,
  .transport-sheet-table thead {
    display: none;
  }

  .table-wrap tbody,
  .table-wrap tr,
  .table-wrap td,
  .transport-trip-table-wrap tbody,
  .transport-trip-table-wrap tr,
  .transport-trip-table-wrap td,
  .migration-five-row-table tbody,
  .migration-five-row-table tr,
  .migration-five-row-table td,
  .pop-stock-grid tbody,
  .pop-stock-grid tr,
  .pop-stock-grid td,
  .equipment-planner-table tbody,
  .equipment-planner-table tr,
  .equipment-planner-table td,
  .transport-sheet-table tbody,
  .transport-sheet-table tr,
  .transport-sheet-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .table-wrap tr,
  .transport-trip-table-wrap tr,
  .migration-five-row-table tr,
  .pop-stock-grid tr,
  .equipment-planner-table tr,
  .transport-sheet-table tr {
    margin: 0 0 8px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    overflow: hidden;
  }

  .table-wrap td,
  .transport-trip-table-wrap td,
  .migration-five-row-table td,
  .pop-stock-grid td,
  .equipment-planner-table td,
  .transport-sheet-table td {
    padding: 6px 8px;
    border-bottom: 1px solid var(--line);
    white-space: normal;
  }

  .table-wrap td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    color: var(--muted);
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
  }
}

.stock-thumb {
  align-items: center;
  background: #e9eef5;
  border: 1px solid #bcc8d6;
  border-radius: 6px;
  display: inline-flex;
  height: 48px;
  justify-content: center;
  object-fit: cover;
  overflow: hidden;
  width: 64px;
}

.stock-thumb-placeholder {
  color: #17395f;
  font-weight: 800;
}

.autosize-textarea {
  line-height: 1.35;
  min-height: 44px;
  resize: vertical;
  white-space: pre-wrap;
  width: 100%;
}

.transport-filter-row {
  align-items: end;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  margin: 10px 0;
  overflow-x: auto;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
}

.transport-filter-row > #transportTripSort {
  flex: 0 0 170px;
}

.risk-signal-card summary {
  cursor: pointer;
  list-style-position: inside;
}

.risk-signal-detail {
  border-top: 1px solid var(--line);
  margin-top: 10px;
  padding-top: 10px;
}

.transport-date-filters,
.transport-status-filters {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0;
}

.transport-schedule-filter-bar {
  align-items: stretch;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  margin: 10px 0;
  overflow-x: auto;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
}

.transport-filter-group {
  align-items: end;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 10px;
  margin: 0;
  min-height: 56px;
  padding: 8px 10px 10px;
}

.transport-filter-group legend {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0 4px;
}

.transport-filter-group-options {
  align-items: end;
  display: flex;
  gap: 10px;
}

.transport-filter-search {
  align-self: end;
  flex: 1 1 280px;
  min-width: 240px;
}

.transport-filter-line {
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 2px;
}

.transport-description-input {
  min-width: 280px;
}

.checkbox-tile.compact {
  min-height: 38px;
  padding: 7px 10px;
}

.compact-view-head {
  margin-bottom: 10px;
}

.modal-backdrop {
  align-items: center;
  background: rgba(7, 20, 35, 0.32);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 24px;
  position: fixed;
  z-index: 1000;
}

.equipment-list-window-backdrop {
  background: rgba(7, 20, 35, 0.14);
  padding-top: 96px;
}

.modal-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: 18px;
  width: min(1080px, 100%);
}

.modal-card,
.equipment-list-window-modal,
.pdf-viewer-modal,
.action-dialog-modal,
.quote-review-modal,
.ict-close-modal,
.messenger-camera-modal,
.equipment-scanner-modal {
  opacity: 1;
}

.quote-review-modal h4 {
  margin: 0 0 10px;
}

.modal-actions {
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 14px;
}

.messenger-camera-modal {
  width: min(760px, 100%);
}

.ict-close-modal {
  width: min(720px, 100%);
}

.po-detail-modal {
  background: #93a9ba;
  border-color: #233b4c;
  color: #071523;
  padding: 10px;
  width: min(1160px, 100%);
}

.po-detail-modal input,
.po-detail-modal select,
.po-detail-modal textarea {
  background: #f8fbff;
  border-color: #2a4052;
  color: #071523;
  min-height: 24px;
}

.po-detail-head,
.po-detail-grid,
.po-detail-summary,
.po-detail-footer {
  display: grid;
  gap: 10px;
}

.po-detail-head {
  align-items: center;
  grid-template-columns: 1fr auto;
  margin-bottom: 8px;
}

.po-detail-head h3 {
  margin: 0;
}

.po-detail-top-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.po-detail-number {
  font-family: "Courier New", monospace;
  font-size: 1.4rem;
  letter-spacing: 0;
}

.po-detail-grid {
  grid-template-columns: minmax(260px, 0.9fr) minmax(360px, 1.1fr);
}

.po-detail-box {
  border: 1px solid #233b4c;
  padding: 8px;
}

.po-detail-box > label,
.po-detail-fields label,
.po-detail-summary label,
.po-total-box label,
.po-detail-footer label {
  color: #071523;
  gap: 4px;
}

.po-detail-box > input {
  margin-top: 4px;
  width: 100%;
}

.po-detail-fields {
  display: grid;
  gap: 6px 10px;
  grid-template-columns: repeat(2, minmax(150px, 1fr));
}

.po-detail-tabs {
  align-items: center;
  display: flex;
  gap: 2px;
  margin-top: 6px;
}

.po-detail-tabs span {
  background: #dbe4ec;
  border: 1px solid #2a4052;
  border-bottom-color: #dbe4ec;
  color: #071523;
  font-size: 0.78rem;
  padding: 2px 10px;
}

.po-detail-lines {
  border: 1px solid #233b4c;
  margin-top: 10px;
  max-height: 260px;
  overflow: auto;
}

.po-detail-lines table {
  border-collapse: collapse;
  min-width: 980px;
  width: 100%;
}

.po-detail-lines th,
.po-detail-lines td {
  border: 1px solid #2a4052;
  padding: 2px;
  vertical-align: top;
}

.po-detail-lines th {
  background: #6f8799;
  color: #06111c;
  font-size: 0.78rem;
}

.po-detail-lines input,
.po-detail-lines select {
  width: 100%;
}

.po-detail-line-actions {
  margin-top: 6px;
}

.po-detail-summary {
  align-items: end;
  grid-template-columns: minmax(180px, 0.7fr) 1fr minmax(220px, 0.8fr);
  margin-top: 8px;
}

.po-detail-summary label:first-child {
  align-items: center;
  display: grid;
  grid-template-columns: auto minmax(70px, 1fr) auto;
}

.po-total-box {
  display: grid;
  gap: 6px;
}

.po-total-box label {
  align-items: center;
  display: grid;
  grid-template-columns: 1fr minmax(110px, 140px);
}

.po-detail-footer {
  grid-template-columns: minmax(300px, 1fr) minmax(220px, 0.5fr);
  margin-top: 8px;
}

.po-detail-checks {
  align-content: end;
  display: grid;
  gap: 8px;
}

.po-detail-checks label {
  align-items: center;
  display: flex;
  flex-direction: row;
}

.po-detail-modal .modal-actions {
  border-top-color: #2a4052;
}

.finance-document-detail-modal {
  background: #c8c2b8;
  border-color: #242424;
  width: min(1120px, 100%);
}

.finance-summary-strip {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin: 8px 0;
}

.finance-summary-strip > div {
  background: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(36, 36, 36, 0.35);
  border-radius: var(--radius);
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px;
}

.finance-summary-strip span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.finance-summary-strip strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.finance-document-address-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(300px, 0.95fr) minmax(300px, 1fr);
}

.finance-document-address-box {
  background: #d6d1c7;
  display: grid;
  gap: 4px;
}

.finance-document-address-box > label {
  align-items: center;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
}

.finance-document-address-row {
  display: grid;
  gap: 4px;
  grid-template-columns: minmax(0, 1fr) minmax(90px, 0.55fr);
}

.finance-document-account {
  align-items: center;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
}

.finance-document-header-grid {
  align-items: end;
  border-bottom: 1px solid #242424;
  border-top: 1px solid #242424;
  display: grid;
  gap: 6px 10px;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  margin-top: 8px;
  padding: 8px 0;
}

.finance-document-header-grid label {
  color: #071523;
  gap: 3px;
}

.finance-document-lines {
  max-height: 280px;
}

.finance-document-lines table {
  min-width: 1060px;
}

.finance-document-lines th:nth-child(1),
.finance-document-lines td:nth-child(1) {
  width: 80px;
}

.finance-document-lines th:nth-child(3),
.finance-document-lines td:nth-child(3),
.finance-document-lines th:nth-child(4),
.finance-document-lines td:nth-child(4) {
  width: 130px;
}

.finance-document-lines th:nth-child(5),
.finance-document-lines td:nth-child(5),
.finance-document-lines th:nth-child(6),
.finance-document-lines td:nth-child(6) {
  width: 140px;
}

.finance-document-lines th:nth-child(7),
.finance-document-lines td:nth-child(7) {
  text-align: center;
  width: 70px;
}

.finance-document-tabs {
  border-bottom: 1px solid #242424;
  margin-top: 8px;
}

.finance-document-tabs span {
  background: #ece9e1;
  border-color: #242424;
}

.finance-document-tabs span.is-active {
  background: #fffdf6;
}

.finance-document-discount-row {
  display: grid;
  justify-content: end;
  margin-top: 6px;
}

.finance-document-discount-row label {
  align-items: center;
  color: #071523;
  display: grid;
  gap: 6px;
  grid-template-columns: auto minmax(110px, 150px);
}

.finance-document-footer-grid {
  grid-template-columns: minmax(260px, 1fr) minmax(210px, 0.65fr) minmax(220px, 0.7fr);
}

.finance-document-vat-box,
.finance-document-total-box {
  color: #071523;
  display: grid;
  gap: 6px;
}

.finance-document-vat-box {
  align-content: start;
}

.finance-document-vat-box label {
  align-items: center;
  display: flex;
  flex-direction: row;
}

.finance-document-vat-list {
  background: #eef2f6;
  border: 1px solid #2a4052;
  min-height: 74px;
  overflow: auto;
  padding: 6px;
}

.finance-document-total-box label {
  align-items: center;
  display: grid;
  gap: 4px;
  grid-template-columns: auto minmax(60px, 80px) auto minmax(100px, 130px);
}

.finance-document-total-box label:not(:first-child) {
  grid-template-columns: 1fr minmax(110px, 140px);
}

.finance-document-checks {
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, max-content);
}

.finance-document-detail-modal .po-detail-head {
  border-bottom: 1px solid #242424;
  padding-bottom: 6px;
}

@media (max-width: 760px) {
  .po-detail-grid,
  .po-detail-summary,
  .po-detail-footer,
  .finance-document-address-grid,
  .finance-document-header-grid,
  .finance-document-footer-grid {
    grid-template-columns: 1fr;
  }

  .po-detail-head {
    grid-template-columns: 1fr;
  }

  .po-detail-top-actions {
    justify-content: flex-start;
  }

  .finance-document-checks {
    grid-template-columns: 1fr;
  }
}

.messenger-camera-stage {
  display: grid;
  min-height: min(58vh, 520px);
  overflow: hidden;
  place-items: center;
  background: #0b1220;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.messenger-camera-stage video {
  display: block;
  width: 100%;
  max-height: min(58vh, 520px);
  object-fit: contain;
  background: #0b1220;
}

.readonly-with-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.inline-file {
  display: inline-grid;
  gap: 4px;
  min-width: 220px;
}

.equipment-lines-wrap td:nth-child(n+5),
.equipment-lines-wrap input,
.nowrap-input {
  white-space: nowrap;
}

.terms-box {
  background: #f7f9fc;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.quote-terms {
  margin-top: 12px;
}

.qr-request-form {
  display: grid;
  gap: 14px;
}

.qr-jobbook-workbench {
  display: grid;
  gap: 12px;
}

.qr-workbench-head {
  align-items: center;
}

.qr-workbench-tabs {
  border-bottom: 1px solid var(--line);
  margin: 0 -14px;
  padding: 0 14px;
}

.qr-workbench-grid {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr);
}

.qr-workbench-main,
.qr-workbench-side {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.qr-workbench-panel {
  display: none;
  min-width: 0;
}

.qr-workbench-panel.is-active {
  display: grid;
  gap: 12px;
}

.qr-workbench-stage {
  grid-column: 1 / -1;
  min-width: 0;
}

.qr-jobbook-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 12px;
  min-width: 0;
}

.qr-jobbook-card .panel-head {
  margin-bottom: 0;
}

.qr-general-card {
  gap: 14px;
}

.qr-general-sections {
  display: grid;
  gap: 12px;
}

.qr-general-section {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 12px;
}

.qr-section-heading {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding-bottom: 8px;
}

.qr-section-heading h4 {
  color: var(--blue);
  font-size: 0.96rem;
  font-weight: 900;
  margin: 0;
}

.qr-jobbook-general-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.qr-commercial-grid {
  grid-template-columns: minmax(180px, 1.2fr) repeat(4, minmax(150px, 1fr));
}

.qr-jobbook-general-grid .span-2,
.qr-jobbook-card .span-2 {
  grid-column: span 2;
}

.qr-client-details {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 10px;
}

.qr-client-details.empty {
  color: var(--muted);
  display: block;
}

.qr-client-details span {
  color: var(--muted);
  display: flex;
  flex-direction: column;
  font-size: 0.82rem;
  gap: 2px;
  min-width: 0;
}

.qr-client-details b {
  color: var(--ink);
  font-size: 0.72rem;
  letter-spacing: 0;
  text-transform: uppercase;
}

.qr-quote-builder-card {
  padding-bottom: 0;
}

.qr-equipment-list-groups {
  display: grid;
  gap: 12px;
}

.qr-equipment-list-tabs {
  display: grid;
  gap: 10px;
}

.qr-equipment-list-tabs > .qr-company-check {
  justify-self: start;
  margin: 0;
}

.qr-equipment-list-sheet {
  background: color-mix(in srgb, var(--surface) 78%, white);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 0;
  overflow: hidden;
}

.qr-equipment-list-title {
  align-items: center;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 8px 10px;
}

.qr-equipment-list-body {
  display: grid;
  gap: 10px;
  padding: 10px;
}

.qr-equipment-list-sheet:has([data-qr-department]:not(:checked)) .qr-equipment-list-body {
  display: none;
}

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

.qr-crew-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.qr-crew-pills label {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  flex-direction: row;
  gap: 6px;
  min-height: 30px;
  padding: 5px 9px;
}

.qr-project-timeline-panel,
.qr-stage-designer-panel {
  background: color-mix(in srgb, var(--panel) 96%, var(--surface));
}

.qr-timeline-lanes {
  display: grid;
  gap: 8px;
}

.qr-venue-timelines {
  display: grid;
  gap: 10px;
}

.qr-venue-timeline-row {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.qr-venue-timeline-head {
  align-items: end;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr) auto;
}

.qr-timeline-lane {
  align-items: end;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: 92px 1fr 1fr;
  padding: 8px;
}

.qr-timeline-lane > span {
  color: var(--blue);
  font-weight: 900;
  padding-bottom: 8px;
}

.qr-stage-preview {
  background: #f8fbfe;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  padding: 10px;
}

.qr-full-stage-designer {
  padding: 0;
  overflow: hidden;
}

.qr-full-stage-designer > .panel-head {
  padding: 12px;
}

.qr-full-stage-designer .view-head {
  display: none;
}

.qr-full-stage-designer .stage-designer-shell {
  border-top: 1px solid var(--line);
}

.qr-stage-grid {
  aspect-ratio: 16 / 9;
  background:
    linear-gradient(90deg, rgba(23, 79, 122, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(23, 79, 122, 0.08) 1px, transparent 1px),
    #ffffff;
  background-size: 24px 24px;
  border: 1px solid var(--line);
  border-radius: 6px;
  position: relative;
}

.qr-stage-object {
  align-items: center;
  border: 1px solid rgba(16, 32, 51, 0.28);
  border-radius: 4px;
  display: flex;
  font-size: 11px;
  font-weight: 900;
  justify-content: center;
  position: absolute;
}

.qr-stage-main {
  background: #50606f;
  color: white;
  height: 30%;
  left: 24%;
  top: 48%;
  width: 52%;
}

.qr-stage-screen {
  background: #182533;
  color: white;
  height: 14%;
  left: 34%;
  top: 30%;
  width: 32%;
}

.qr-stage-pa-left,
.qr-stage-pa-right {
  background: #2d4662;
  color: white;
  height: 18%;
  top: 47%;
  width: 12%;
}

.qr-stage-pa-left {
  left: 9%;
}

.qr-stage-pa-right {
  right: 9%;
}

.qr-saved-panel .table-wrap {
  max-height: 260px;
  overflow: auto;
}

.visually-hidden {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

.qr-builder-steps {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.qr-builder-steps span {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  min-height: 34px;
  padding: 9px 10px;
  text-align: center;
}

.qr-builder-steps span.is-active {
  background: var(--soft-blue);
  border-color: color-mix(in srgb, var(--blue) 45%, var(--line));
  color: var(--blue);
}

.qr-builder-section {
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
}

.qr-import-button {
  margin: 0;
}

.qr-timeline-preview {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 12px;
}

.qr-timeline-preview div {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 10px;
}

.qr-timeline-preview span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.qr-timeline-preview strong {
  font-size: 13px;
}

.qr-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--panel);
}

.qr-section-head {
  align-items: baseline;
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.qr-section-head h3,
.qr-mini-section h4 {
  margin: 0;
}

.qr-commission-pair {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(110px, 0.8fr) minmax(180px, 1.2fr);
}

.qr-date-group {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface);
}

.qr-job-info-grid .qr-date-group,
.qr-job-info-grid .qr-brief-field {
  grid-column: 1 / -1;
}

.qr-date-group-head {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 8px;
  text-transform: uppercase;
}

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

.qr-company-grid {
  display: grid;
  gap: 12px;
}

.qr-company-block {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
}

.qr-company-check {
  margin: 12px 0 0 14px;
  width: 14px;
  height: 14px;
  min-height: 14px;
  position: static;
  opacity: 1;
  pointer-events: auto;
}

.qr-company-toggle {
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px 12px 8px;
  width: calc(100% - 40px);
}

.qr-company-toggle::after {
  content: "+";
  color: var(--blue);
  font-size: 20px;
  font-weight: 800;
}

.qr-company-check:checked + .qr-company-toggle::after {
  content: "-";
}

.qr-company-check:not(:checked) ~ .qr-department-panel {
  display: none;
}

.qr-department-panel {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 10px;
  padding: 12px;
}

.qr-department-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel) 92%, white);
  overflow: hidden;
}

.qr-department-head {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.qr-department-head .checkbox-tile,
.qr-department-body .checkbox-grid label {
  align-items: center;
  background: transparent;
  border: 0;
  display: inline-flex;
  gap: 6px;
  min-height: 20px;
  padding: 0;
}

.qr-department-head input[type="checkbox"],
.qr-department-body input[type="checkbox"] {
  flex: 0 0 auto;
  height: 14px;
  min-height: 14px;
  width: 14px;
}

.qr-department-card:has([data-qr-department]:not(:checked)) .qr-department-body {
  display: none;
}

.qr-department-body {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.qr-mini-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.qr-schedule-grid,
.qr-transport-grid,
.qr-equipment-entry-grid,
.qr-transport-planner-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.qr-equipment-entry-grid {
  align-items: end;
  grid-template-columns: minmax(72px, 96px) minmax(180px, 1fr) auto;
}

.qr-equipment-rows {
  display: grid;
  gap: 10px;
}

.qr-equipment-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.qr-equipment-inline-actions {
  align-items: end;
  display: flex;
  gap: 6px;
}

.qr-icon-button {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
  display: inline-flex;
  font-size: 18px;
  font-weight: 900;
  height: 38px;
  justify-content: center;
  line-height: 1;
  min-height: 38px;
  padding: 0;
  width: 38px;
}

.qr-icon-button.add {
  background: var(--soft-green);
  color: var(--green);
}

.qr-icon-button.remove {
  background: var(--soft-red);
  color: var(--red);
}

.qr-department-streamline .qr-department-body {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.qr-department-streamline .qr-mini-dates {
  grid-column: 1 / -1;
}

.qr-department-streamline .qr-mini-section {
  grid-column: 1 / -1;
}

.qr-department-streamline .qr-mini-section h4 {
  color: var(--blue);
  font-size: 0.92rem;
  font-weight: 900;
}

.company-department-grid {
  max-height: 260px;
  overflow: auto;
}

@media (max-width: 720px) {
  .qr-section {
    padding: 10px;
  }

  .qr-company-toggle,
  .qr-department-panel,
  .qr-department-body {
    padding: 10px;
  }

  .qr-schedule-grid,
  .qr-transport-grid,
  .qr-equipment-entry-grid,
  .qr-transport-planner-grid,
  .qr-commission-pair,
  .qr-date-group-grid,
  .qr-builder-steps,
  .qr-timeline-preview,
  .qr-workbench-grid,
  .qr-jobbook-general-grid,
  .qr-client-details,
  .qr-list-dates,
  .qr-commercial-grid,
  .qr-venue-timeline-head,
  .qr-timeline-lane,
  .qr-department-streamline .qr-department-body {
    grid-template-columns: 1fr;
  }

  .qr-jobbook-general-grid .span-2,
  .qr-jobbook-card .span-2 {
    grid-column: auto;
  }

  .qr-workbench-tabs {
    overflow-x: auto;
    padding-bottom: 4px;
  }

  .qr-department-streamline .qr-mini-dates {
    grid-column: auto;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .qr-date-group-grid,
  body.hireops-apk .qr-mini-dates .qr-schedule-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.hireops-apk .qr-date-group-grid,
  body.hireops-apk .qr-mini-dates .qr-schedule-grid {
    gap: 6px !important;
  }
}

@media (max-width: 720px) {
  :root {
    --app-font-size: 11px;
    --app-line-height: 1.22;
    --app-gap: 5px;
    --app-pad: 5px;
    --control-min-height: 34px;
    --menu-font-size: 10px;
    --tab-font-size: 10px;
    --kpi-height: 38px;
    --kpi-value-size: 12px;
  }

  html,
  body {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
    overscroll-behavior-x: none;
  }

  body {
    touch-action: pan-y;
  }

  img,
  svg,
  canvas,
  video {
    max-width: 100%;
    height: auto;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 25;
    gap: 5px;
    padding: 4px 5px 5px;
  }

  .brand {
    gap: 7px;
    align-items: center;
  }

  .brand-mark {
    width: 42px;
    height: 36px;
  }

  .brand-mark img {
    width: 42px;
    height: 36px;
    max-width: 42px;
  }

  h1 {
    font-size: 1.08rem;
    line-height: 1.05;
  }

  h2 {
    font-size: 1.05rem;
  }

  h3 {
    font-size: 0.96rem;
  }

  .brand p {
    max-width: calc(100vw - 74px);
    overflow: hidden;
    font-size: 10px;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .global-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
  }

  label {
    gap: 2px;
    font-size: 9.5px;
    line-height: 1.1;
  }

  input,
  select,
  textarea {
    min-width: 0;
    min-height: 34px;
    padding: 5px 6px;
    font-size: 16px;
    line-height: 1.2;
  }

  textarea {
    width: 100%;
  }

  .layout {
    width: 100%;
    overflow: clip;
  }

  .main-menu-toggle {
    position: sticky;
    top: 0;
    width: 42px;
    height: 38px;
    min-height: 38px;
    margin-bottom: 2px;
  }

  .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: auto;
    z-index: 90;
    width: min(86vw, 320px);
    max-width: 320px;
    max-height: 100dvh;
    padding: 8px;
    overflow-y: auto;
    box-shadow: 12px 0 32px rgba(10, 18, 28, 0.28);
    -webkit-overflow-scrolling: touch;
  }

  body.main-menu-collapsed .sidebar {
    display: block;
    width: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
  }

  .sidebar .nav-button {
    min-height: 36px;
    padding: 8px 10px;
  }

  .nav-submenu {
    gap: 4px;
    margin: 0 0 5px 6px;
    padding: 4px 0 4px 6px;
  }

  .nav-submenu-button {
    min-height: 32px;
    padding: 6px 8px;
  }

  .content {
    width: 100%;
    max-width: 100%;
    padding: 6px 5px 18px;
    overflow-x: clip;
  }

  .view-head {
    gap: 6px;
    margin-bottom: 6px;
    padding: 7px 8px;
  }

  .view-head h2 {
    font-size: 13px;
  }

  .view-head .actions,
  .panel-head .actions,
  .actions,
  .chip-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
    width: 100%;
    gap: 5px;
  }

  body.hireops-apk .view-head .actions {
    display: flex;
    width: auto;
    flex-wrap: nowrap;
    justify-content: flex-end;
  }

  .actions > button,
  .chip-row > button,
  .report-menu,
  .report-menu-trigger {
    width: 100%;
    min-width: 0;
  }

  .solid-button,
  .ghost-button,
  .chip-button,
  .tab-button,
  .report-menu-trigger {
    min-height: 34px;
    padding: 7px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.hireops-apk .actions > .messenger-sound-button {
    width: 34px;
    min-width: 34px;
    min-height: 34px;
    padding: 6px;
  }

  .panel,
  .record-card,
  .auth-card {
    padding: 7px;
  }

  .panel-head {
    gap: 5px;
    margin-bottom: 6px;
    padding-bottom: 5px;
  }

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

  .kpi {
    padding: 4px;
  }

  .module-grid,
  .jobbook-layout,
  .grid-2,
  .grid-2.wide-left,
  .grid-3,
  .board,
  .resource-grid,
  .form-grid,
  .admin-editor,
  .admin-user-editor,
  .builder-preview-grid,
  .address-workspace,
  .crew-schedule-layout,
  .crew-filter-bar,
  .rider-layout,
  .transport-manager-grid,
  .transport-gps-layout,
  .route-step-grid,
  .upload-preview,
  .schedule-form,
  .transport-contact-grid,
  .qr-schedule-grid,
  .qr-transport-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .tab-row,
  .help-tab-row,
  .transport-filter-line,
  .transport-date-filters,
  .transport-status-filters,
  .address-type-picker {
    display: flex;
    flex-wrap: nowrap;
    max-width: 100%;
    gap: 5px;
    overflow-x: auto;
    padding-bottom: 5px;
    -webkit-overflow-scrolling: touch;
  }

  .tab-button,
  .address-type-picker label,
  .checkbox-tile.compact {
    flex: 0 0 auto;
  }

  .table-wrap,
  .equipment-lines-wrap,
  .transport-trip-table-wrap,
  .transport-table-wrap,
  .rider-table-wrap,
  .crew-match-list,
  .crew-chart-wrap,
  .pop-stock-grid,
  .migration-five-row-table {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  table,
  .rider-table,
  .transport-sheet-table,
  .transport-trip-table-wrap table,
  .equipment-lines-wrap table,
  .pop-stock-grid table,
  .migration-five-row-table table,
  .crew-chart-table {
    min-width: 560px;
    font-size: 11px;
  }

  th,
  td {
    padding: 4px 5px;
  }

  .crew-sheet-head,
  .crew-sheet-filters,
  .crew-match-card {
    min-width: 0;
    grid-template-columns: minmax(82px, 0.7fr) minmax(88px, 0.8fr) minmax(120px, 1fr);
    font-size: 11px;
  }

  .rider-header {
    gap: 6px;
    padding: 7px;
  }

  .rider-logo {
    min-height: 76px;
  }

  .rider-logo img {
    max-width: 96px;
    max-height: 74px;
  }

  .rider-title input {
    min-height: 34px;
    font-size: 17px;
  }

  .transport-schedule-panel {
    position: relative;
    top: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }

  .transport-blue-header {
    gap: 6px;
    padding: 7px 8px;
  }

  .transport-blue-header strong {
    font-size: 13px;
  }

  .transport-blue-header span {
    display: none;
  }

  .transport-manager-grid.compact {
    grid-template-columns: minmax(0, 1fr);
    padding: 6px;
  }

  .transport-trip-table-wrap {
    max-height: 58dvh;
  }

  .transport-description-input,
  .address-toolbar input,
  .inline-file {
    min-width: 0;
  }

  .transport-banner {
    grid-template-columns: 56px minmax(0, 1fr);
    min-height: 70px;
  }

  .transport-banner img {
    width: 42px;
    height: 58px;
    margin-left: 8px;
  }

  .transport-banner h2 {
    font-size: 15px;
  }

  .modal-backdrop {
    align-items: stretch;
    padding: 8px;
  }

  .modal-card {
    width: 100%;
    max-height: calc(100dvh - 16px);
    padding: 10px;
  }

  .messenger-new-message-dot {
    right: 12px;
    bottom: 12px;
    min-width: 54px;
    min-height: 54px;
    padding: 8px;
  }

  .toast {
    right: 8px;
    bottom: 8px;
    left: 8px;
    max-width: none;
  }
}

@media (max-width: 420px) {
  .global-controls {
    grid-template-columns: 1fr;
  }

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

  .view-head .actions,
  .panel-head .actions,
  .actions,
  .chip-row {
    grid-template-columns: 1fr;
  }

  table,
  .rider-table,
  .transport-sheet-table,
  .transport-trip-table-wrap table,
  .equipment-lines-wrap table,
  .pop-stock-grid table,
  .migration-five-row-table table,
  .crew-chart-table {
    min-width: 520px;
  }
}

@media (max-width: 720px) {
  .topbar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 3px 6px;
    padding: 3px 5px;
  }

  .brand {
    min-width: 0;
    gap: 5px;
  }

  .brand-mark {
    width: 30px;
    height: 28px;
  }

  .brand-mark img {
    width: 30px;
    height: 28px;
    max-width: 30px;
    max-height: 28px;
  }

  h1 {
    font-size: 0.92rem;
    line-height: 1;
  }

  .brand p {
    display: none;
  }

  .global-controls {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3px;
  }

  .global-controls label {
    gap: 0;
  }

  .global-controls label > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  .global-controls label:has(#searchInput) {
    grid-column: 1 / -1;
  }

  .global-controls select,
  .global-controls input {
    min-height: 28px;
    padding: 3px 5px;
    font-size: 13px;
    line-height: 1.1;
  }

  .user-panel {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }

  .user-chip {
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
  }

  .user-chip > span:first-child {
    max-width: 108px;
    overflow: hidden;
    line-height: 1;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .user-chip > span:first-child .muted,
  .user-chip #onlineUsers {
    display: none;
  }

  .user-chip .status {
    min-height: 22px;
    padding: 3px 5px;
    font-size: 9px;
    line-height: 1;
  }

  .notification-menu-wrap {
    position: relative;
    display: inline-flex;
    width: auto;
  }

  .notification-bell {
    width: auto;
    min-height: 28px;
    padding: 3px 6px;
  }

  .notification-bell-icon {
    width: 14px;
    height: 14px;
  }

  .notification-count {
    min-width: 15px;
    padding: 0 4px;
    font-size: 10px;
  }

  .user-chip .ghost-button {
    min-height: 28px;
    padding: 3px 7px;
    font-size: 10px;
  }

  .login-note {
    max-width: 112px;
    overflow: hidden;
    line-height: 1.05;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .login-note .muted {
    display: none;
  }

  .main-menu-toggle {
    top: 0;
    width: 36px;
    height: 32px;
    min-height: 32px;
    font-size: 20px;
  }
}

@media (max-width: 720px) {
  *,
  *::before,
  *::after {
    max-width: 100%;
  }

  html,
  body,
  .layout,
  .content {
    overflow-x: hidden;
  }

  .tab-row,
  .help-tab-row,
  .transport-filter-line,
  .transport-date-filters,
  .transport-status-filters,
  .address-type-picker,
  .messenger-quick-emoji,
  .table-wrap,
  .equipment-lines-wrap,
  .transport-trip-table-wrap,
  .transport-table-wrap,
  .rider-table-wrap,
  .crew-match-list,
  .crew-chart-wrap,
  .pop-stock-grid,
  .migration-five-row-table {
    overflow-x: hidden;
  }

  .table-wrap table,
  .transport-trip-table-wrap table,
  .transport-table-wrap table,
  .equipment-lines-wrap table,
  .migration-five-row-table table,
  .pop-stock-grid table,
  .rider-table,
  .equipment-planner-table,
  .transport-sheet-table,
  .crew-chart-table {
    display: block;
    width: 100%;
    min-width: 0;
    table-layout: fixed;
  }

  .table-wrap thead,
  .transport-trip-table-wrap thead,
  .transport-table-wrap thead,
  .equipment-lines-wrap thead,
  .migration-five-row-table thead,
  .pop-stock-grid thead,
  .rider-table thead,
  .equipment-planner-table thead,
  .transport-sheet-table thead,
  .crew-chart-table thead {
    display: none;
  }

  .table-wrap tbody,
  .table-wrap tr,
  .table-wrap td,
  .transport-trip-table-wrap tbody,
  .transport-trip-table-wrap tr,
  .transport-trip-table-wrap td,
  .transport-table-wrap tbody,
  .transport-table-wrap tr,
  .transport-table-wrap td,
  .equipment-lines-wrap tbody,
  .equipment-lines-wrap tr,
  .equipment-lines-wrap td,
  .migration-five-row-table tbody,
  .migration-five-row-table tr,
  .migration-five-row-table td,
  .pop-stock-grid tbody,
  .pop-stock-grid tr,
  .pop-stock-grid td,
  .rider-table tbody,
  .rider-table tr,
  .rider-table td,
  .equipment-planner-table tbody,
  .equipment-planner-table tr,
  .equipment-planner-table td,
  .transport-sheet-table tbody,
  .transport-sheet-table tr,
  .transport-sheet-table td,
  .crew-chart-table tbody,
  .crew-chart-table tr,
  .crew-chart-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .table-wrap tr,
  .transport-trip-table-wrap tr,
  .transport-table-wrap tr,
  .equipment-lines-wrap tr,
  .migration-five-row-table tr,
  .pop-stock-grid tr,
  .rider-table tr,
  .equipment-planner-table tr,
  .transport-sheet-table tr,
  .crew-chart-table tr {
    margin: 0 0 8px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    overflow: hidden;
  }

  .table-wrap td,
  .transport-trip-table-wrap td,
  .transport-table-wrap td,
  .equipment-lines-wrap td,
  .migration-five-row-table td,
  .pop-stock-grid td,
  .rider-table td,
  .equipment-planner-table td,
  .transport-sheet-table td,
  .crew-chart-table td {
    padding: 6px 8px;
    border-bottom: 1px solid var(--line);
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .map-view-button,
  .actions > .map-view-button,
  .chip-row > .map-view-button {
    flex: 0 0 34px;
    width: 34px;
    min-width: 34px;
    max-width: 34px;
    height: 34px;
    padding: 0;
  }

  .whatsapp-compose .messenger-quick-emoji {
    overflow-x: visible;
  }
}

body.hireops-apk .messenger-quick-emoji {
  display: none;
}

body.hireops-apk .view-head .actions {
  display: flex;
  width: auto;
  flex-wrap: nowrap;
  justify-content: flex-end;
}

body.hireops-apk .view-head .report-menu,
body.hireops-apk .view-head .report-menu-trigger {
  width: auto;
}

body.hireops-apk .global-print-menu {
  width: auto;
}

body.hireops-apk .global-print-trigger {
  width: 30px;
  min-width: 30px;
  height: 28px;
  min-height: 28px;
  padding: 3px;
}

body.hireops-apk .global-print-menu .report-menu-panel {
  position: fixed;
  top: calc(44px + env(safe-area-inset-top, 0px));
  right: 6px;
  left: auto;
  z-index: 360;
  width: calc(100vw - 12px);
  max-width: 360px;
  max-height: calc(100dvh - 58px - env(safe-area-inset-top, 0px));
  overflow: auto;
}

body.hireops-apk .actions > .messenger-sound-button {
  width: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 6px;
}

body.hireops-apk .whatsapp-chat-panel > .panel-head .messenger-sound-button {
  display: inline-flex;
  width: 30px;
  min-width: 30px;
  min-height: 30px;
  padding: 5px;
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.34);
}

body.hireops-apk .whatsapp-chat-panel > .panel-head {
  gap: 4px;
  padding: 6px 8px;
}

body.hireops-apk .whatsapp-chat-panel > .panel-head h3 {
  gap: 4px;
  font-size: 12px;
  line-height: 1.1;
}

body.hireops-apk .messenger-back-button,
body.hireops-apk .whatsapp-chat-panel > .panel-head .danger-button {
  min-height: 28px;
  padding: 3px 7px;
}

body.hireops-apk .whatsapp-chat-panel > .panel-head .messenger-chat-participants {
  max-height: 18px;
  font-size: 10px;
  line-height: 1.1;
  overflow: hidden;
}

body.hireops-apk .whatsapp-compose {
  gap: 3px;
  padding: 5px 6px;
}

body.hireops-apk .whatsapp-compose textarea {
  min-height: 34px;
  max-height: 64px;
  padding: 8px 12px;
}

@media (max-width: 720px) {
  .stock-item-card {
    grid-template-columns: 56px minmax(0, 1fr);
  }

  .stock-item-counts {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    text-align: left;
  }

  .layout {
    overflow-x: clip;
  }

  .sidebar {
    display: grid !important;
    width: min(86vw, 320px) !important;
    max-width: 320px;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 10px 10px;
    opacity: 1;
    transform: translateX(0);
    transition: transform 210ms ease, box-shadow 210ms ease;
    touch-action: pan-y;
    will-change: transform;
  }

  body.main-menu-collapsed .sidebar {
    display: grid !important;
    width: min(86vw, 320px) !important;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 10px 10px;
    border-right: 1px solid var(--nav-border);
    opacity: 1;
    pointer-events: none;
    transform: translateX(-104%);
  }

  body:not(.main-menu-collapsed)::before {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(8, 14, 22, 0.28);
    content: "";
    pointer-events: none;
  }

  .main-menu-toggle,
  body.hireops-apk .main-menu-toggle {
    position: fixed;
    top: env(safe-area-inset-top, 0px);
    left: 0;
    z-index: 102;
    width: 44px;
    height: 44px;
    min-height: 44px;
    margin: 0;
    border-radius: 0 0 6px 0;
    transition: transform 210ms ease;
    touch-action: none;
  }

  body:not(.main-menu-collapsed) .main-menu-toggle {
    transform: translateX(min(86vw, 320px));
  }

  body.main-menu-collapsed .main-menu-toggle {
    transform: translateX(0);
  }

  body[data-view="whatsapp"].hireops-apk .content {
    padding: 0;
  }

  body[data-view="whatsapp"].hireops-apk .view-head {
    display: none;
  }

  body.hireops-apk .whatsapp-layout {
    min-height: 100dvh;
    background: #d9e4dc;
  }

  body.hireops-apk .whatsapp-sidebar {
    height: 100dvh;
    padding-top: 48px;
    background: #f6f7f5;
  }

  body.hireops-apk .whatsapp-chat-panel {
    height: 100dvh;
    min-height: 100dvh;
    background: #d9e4dc;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head {
    min-height: 56px;
    padding: calc(6px + env(safe-area-inset-top, 0px)) 8px 6px;
    color: #fff;
    background: #075e54;
    border-bottom: 0;
    box-shadow: 0 1px 4px rgba(6, 22, 20, 0.24);
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head h3 {
    min-width: 0;
  }

  .messenger-chat-title-main {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
  }

  .messenger-chat-title-main > span {
    display: grid;
    min-width: 0;
    gap: 1px;
  }

  .messenger-chat-title-text {
    overflow: hidden;
    color: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .messenger-chat-subtitle {
    display: block;
    min-width: 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.1;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head .messenger-avatar {
    width: 34px;
    height: 34px;
    border-color: rgba(255, 255, 255, 0.36);
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head .actions {
    width: auto;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head .danger-button,
  body.hireops-apk .whatsapp-chat-panel > .panel-head .messenger-chat-participants {
    display: none;
  }

  body.hireops-apk .messenger-back-button {
    color: #fff;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }

  body.hireops-apk .whatsapp-messages {
    padding: 10px 8px;
    background:
      radial-gradient(circle at 16px 16px, rgba(255, 255, 255, 0.22) 1px, transparent 1.4px),
      radial-gradient(circle at 42px 38px, rgba(7, 94, 84, 0.08) 1px, transparent 1.4px),
      #d9e4dc;
    background-size: 52px 52px;
  }

  body.hireops-apk .whatsapp-message {
    max-width: 86%;
  }

  body.hireops-apk .whatsapp-message .messenger-avatar {
    display: none;
  }

  body.hireops-apk .whatsapp-message-bubble {
    padding: 6px 8px 5px;
    background: #fff;
    border-radius: 8px 8px 8px 2px;
  }

  body.hireops-apk .whatsapp-message.is-own .whatsapp-message-bubble {
    background: #dcf8c6;
    border-radius: 8px 8px 2px 8px;
  }

  body.hireops-apk .messenger-sender-name {
    display: none;
  }

  body.hireops-apk .whatsapp-message p {
    margin: 0 0 3px;
    font-size: 13px;
    line-height: 1.28;
  }

  body.hireops-apk .whatsapp-compose {
    grid-template-columns: auto auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 5px;
    padding: 6px 7px calc(6px + env(safe-area-inset-bottom, 0px));
    background: #eef1ed;
  }

  body.hireops-apk .whatsapp-compose textarea {
    grid-column: 3;
    grid-row: 1;
    min-height: 38px;
    max-height: 86px;
    padding: 10px 14px;
    background: #fff;
    border: 0;
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.1);
  }

  body.hireops-apk .messenger-attachment-controls {
    display: contents;
  }

  body.hireops-apk .whatsapp-compose .messenger-icon-button,
  body.hireops-apk .whatsapp-compose .messenger-send-button {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 0;
    border-radius: 999px;
  }

  body.hireops-apk .whatsapp-compose .messenger-send-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #128c7e;
    border-color: #128c7e;
  }

  body.hireops-apk .messenger-send-label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .whatsapp-compose .messenger-control-icon {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 720px) {
  body.hireops-apk {
    display: block !important;
    min-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 0 !important;
  }

  body.hireops-apk .topbar {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: calc(6px + env(safe-area-inset-top, 0px)) 8px 8px !important;
    overflow: visible !important;
  }

  body.hireops-apk .brand {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 8px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    align-items: center !important;
  }

  body.hireops-apk .brand-mark,
  body.hireops-apk .brand-mark img {
    width: 42px !important;
    height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
  }

  body.hireops-apk .brand h1,
  body.hireops-apk .brand p,
  body.hireops-apk .user-chip span,
  body.hireops-apk .view-head h2,
  body.hireops-apk .panel-head h3 {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .global-controls {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk .global-controls label:has(#searchInput) {
    grid-column: 1 / -1 !important;
  }

  body.hireops-apk .global-controls label,
  body.hireops-apk .global-controls select,
  body.hireops-apk .global-controls input,
  body.hireops-apk .user-panel,
  body.hireops-apk .user-chip {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.hireops-apk .global-controls select,
  body.hireops-apk .global-controls input {
    min-height: 34px !important;
    font-size: 16px !important;
  }

  body.hireops-apk .layout,
  body.hireops-apk .content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: auto !important;
    overflow: visible !important;
  }

  body.hireops-apk .content {
    padding: 8px 8px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.hireops-apk .main-menu-toggle {
    position: fixed !important;
    top: env(safe-area-inset-top, 0px) !important;
    left: 0 !important;
    z-index: 140 !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    transform: none !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 130 !important;
    display: grid !important;
    width: min(88vw, 330px) !important;
    max-width: min(88vw, 330px) !important;
    max-height: 100dvh !important;
    padding: calc(52px + env(safe-area-inset-top, 0px)) 10px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    opacity: 1 !important;
    transform: translateX(0) !important;
  }

  body.hireops-apk.main-menu-collapsed .sidebar {
    pointer-events: none !important;
    transform: translateX(-105%) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: 120 !important;
    pointer-events: none !important;
  }

  body.hireops-apk .view-head,
  body.hireops-apk .panel-head,
  body.hireops-apk .card-head,
  body.hireops-apk .modal-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 6px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    align-items: start !important;
  }

  body.hireops-apk .view-head .actions,
  body.hireops-apk .panel-head .actions,
  body.hireops-apk .card-head .actions,
  body.hireops-apk .actions,
  body.hireops-apk .chip-row,
  body.hireops-apk .toolbar,
  body.hireops-apk .filter-row {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    justify-content: flex-start !important;
    overflow: visible !important;
  }

  body.hireops-apk .actions > button,
  body.hireops-apk .actions > a,
  body.hireops-apk .chip-row > button,
  body.hireops-apk .chip-row > a,
  body.hireops-apk .toolbar > button,
  body.hireops-apk .filter-row > button {
    flex: 1 1 118px !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.hireops-apk .tab-row,
  body.hireops-apk .help-tab-row,
  body.hireops-apk .subtabs,
  body.hireops-apk .report-tabs,
  body.hireops-apk .table-wrap,
  body.hireops-apk .equipment-lines-wrap,
  body.hireops-apk .transport-trip-table-wrap,
  body.hireops-apk .transport-table-wrap,
  body.hireops-apk .rider-table-wrap,
  body.hireops-apk .crew-chart-wrap,
  body.hireops-apk .pop-stock-grid,
  body.hireops-apk .migration-five-row-table {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.hireops-apk .panel,
  body.hireops-apk .record-card,
  body.hireops-apk .metric-card,
  body.hireops-apk .dashboard-card,
  body.hireops-apk form,
  body.hireops-apk fieldset,
  body.hireops-apk label {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.hireops-apk table {
    min-width: max-content !important;
  }
}

@media (max-width: 720px) {
  body:not(.hireops-apk) .main-menu-toggle {
    position: fixed !important;
    top: 84px !important;
    left: 0 !important;
    z-index: 82 !important;
    width: 24px !important;
    min-width: 24px !important;
    height: calc(100dvh - 84px) !important;
    min-height: 220px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
  }

  body:not(.hireops-apk):not(.main-menu-collapsed) .main-menu-toggle {
    transform: translateX(min(86vw, 320px)) !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 135 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 3px 6px !important;
    min-height: 48px !important;
    padding: calc(4px + env(safe-area-inset-top, 0px)) 6px 5px 48px !important;
    background: linear-gradient(#eef1f4, #cfd5dc) !important;
    border-bottom: 1px solid #7d8792 !important;
    overflow: visible !important;
  }

  body.hireops-apk .brand {
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: 6px !important;
  }

  body.hireops-apk .brand-mark,
  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .brand h1 {
    font-size: 13px !important;
    line-height: 1 !important;
  }

  body.hireops-apk .brand p {
    display: none !important;
  }

  body.hireops-apk .user-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: auto !important;
    max-width: 136px !important;
  }

  body.hireops-apk .user-chip {
    display: flex !important;
    width: auto !important;
    gap: 4px !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  body.hireops-apk .user-chip > span:first-child,
  body.hireops-apk .login-note {
    max-width: 72px !important;
    overflow: hidden !important;
    line-height: 1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .global-controls {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 3px !important;
  }

  body.hireops-apk .global-controls label {
    gap: 0 !important;
  }

  body.hireops-apk .global-controls label > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .global-controls label:has(#searchInput) {
    grid-column: auto !important;
  }

  body.hireops-apk .global-controls select,
  body.hireops-apk .global-controls input {
    min-height: 27px !important;
    padding: 3px 5px !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
  }

  body.hireops-apk .main-menu-toggle {
    position: fixed !important;
    top: calc(4px + env(safe-area-inset-top, 0px)) !important;
    left: 4px !important;
    z-index: 145 !important;
    display: inline-flex !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    border: 1px solid var(--nav-border) !important;
    border-radius: 5px !important;
    color: #fff !important;
    background: linear-gradient(var(--nav-start), var(--nav-end)) !important;
    font-size: 0 !important;
    line-height: 1 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle::before {
    content: "\2630";
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
  }
}

@media (max-width: 420px) {
  body:not(.hireops-apk) .main-menu-toggle {
    top: 96px !important;
    height: calc(100dvh - 96px) !important;
  }

  body.hireops-apk .global-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

body:not(.hireops-apk) .topbar {
  z-index: 90 !important;
}

body:not(.hireops-apk) .main-menu-toggle {
  top: 89px !important;
  z-index: 30 !important;
  height: calc(100dvh - 89px) !important;
}

body:not(.hireops-apk) .sidebar {
  top: 89px !important;
  z-index: 20 !important;
}

@media (max-width: 720px) {
  body:not(.hireops-apk) .main-menu-toggle {
    top: 84px !important;
    z-index: 30 !important;
    height: calc(100dvh - 84px) !important;
  }

  body:not(.hireops-apk) .sidebar {
    top: 84px !important;
    z-index: 20 !important;
    max-height: calc(100dvh - 84px) !important;
  }
}

@media (max-width: 420px) {
  body:not(.hireops-apk) .main-menu-toggle {
    top: 96px !important;
    height: calc(100dvh - 96px) !important;
  }

  body:not(.hireops-apk) .sidebar {
    top: 96px !important;
    max-height: calc(100dvh - 96px) !important;
  }
}

@media (max-width: 720px) {
  .equipment-list-window-backdrop {
    padding: 84px 10px 10px;
  }

  .equipment-list-window-modal {
    height: calc(100dvh - 104px);
    margin: 0;
    padding: 12px;
    width: calc(100vw - 20px);
  }

  body.hireops-apk .topbar {
    grid-template-columns: minmax(76px, 1fr) minmax(166px, auto) !important;
    min-height: 44px !important;
    padding: calc(3px + env(safe-area-inset-top, 0px)) 5px 4px 46px !important;
    gap: 2px 5px !important;
    align-items: center !important;
  }

  body.hireops-apk .main-menu-toggle {
    top: calc(3px + env(safe-area-inset-top, 0px)) !important;
    left: 4px !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    border-radius: 4px !important;
  }

  body.hireops-apk .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    grid-template-columns: 26px minmax(0, 1fr) !important;
    gap: 5px !important;
  }

  body.hireops-apk .brand-mark,
  body.hireops-apk .brand-mark img {
    width: 26px !important;
    height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
  }

  body.hireops-apk .brand h1 {
    font-size: 12px !important;
    line-height: 1 !important;
  }

  body.hireops-apk .user-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    justify-self: end !important;
  }

  body.hireops-apk .user-chip {
    display: grid !important;
    grid-template-columns: minmax(42px, 1fr) auto auto auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 3px !important;
    align-items: center !important;
    justify-content: end !important;
  }

  body.hireops-apk .user-chip > span:first-child {
    display: block !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-align: right !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .user-chip > span:first-child .muted,
  body.hireops-apk .user-chip #onlineUsers {
    display: none !important;
  }

  body.hireops-apk #loggedInUser {
    display: block !important;
    overflow: hidden !important;
    font-size: 10px !important;
    line-height: 1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .notification-menu-wrap {
    width: auto !important;
    min-width: 0 !important;
  }

  body.hireops-apk .notification-bell {
    width: 32px !important;
    min-width: 32px !important;
    height: 28px !important;
    min-height: 28px !important;
    gap: 1px !important;
    padding: 2px 3px !important;
  }

  body.hireops-apk .notification-bell-icon {
    width: 13px !important;
    height: 13px !important;
  }

  body.hireops-apk .notification-count {
    min-width: 12px !important;
    padding: 0 2px !important;
    font-size: 8px !important;
    line-height: 1.2 !important;
  }

  body.hireops-apk .user-chip .status {
    min-height: 24px !important;
    padding: 3px 4px !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }

  body.hireops-apk .user-chip .ghost-button {
    min-width: 42px !important;
    min-height: 26px !important;
    padding: 3px 5px !important;
    font-size: 9px !important;
    line-height: 1 !important;
  }

  body.hireops-apk .global-controls {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    margin-top: 1px !important;
  }
}

@media (max-width: 360px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(60px, 0.7fr) minmax(174px, 1.3fr) !important;
  }

  body.hireops-apk .brand h1 {
    font-size: 11px !important;
  }

  body.hireops-apk .user-chip {
    grid-template-columns: minmax(32px, 1fr) auto auto auto !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(84px, 1fr) minmax(224px, auto) !important;
    min-height: 44px !important;
    padding: calc(3px + env(safe-area-inset-top, 0px)) 5px 4px 46px !important;
  }

  body.hireops-apk .global-controls {
    display: grid !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 3px !important;
    margin-top: 2px !important;
  }

  body.hireops-apk .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk .user-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
    max-width: none !important;
  }

  body.hireops-apk .user-chip {
    grid-template-columns: minmax(40px, 1fr) auto auto !important;
    gap: 2px !important;
  }

  body.hireops-apk .global-print-menu {
    width: auto !important;
  }

  body.hireops-apk .global-print-trigger {
    width: 30px !important;
    min-width: 30px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 3px !important;
  }

  body.hireops-apk .apk-header-action {
    min-width: 30px !important;
    min-height: 26px !important;
    padding: 3px 5px !important;
    font-size: 9px !important;
    line-height: 1 !important;
  }
}

@media (max-width: 380px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(58px, 0.75fr) minmax(200px, 1.25fr) !important;
  }

  body.hireops-apk .brand-mark,
  body.hireops-apk .brand-mark img {
    width: 22px !important;
    height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
  }

  body.hireops-apk .brand {
    grid-template-columns: 22px minmax(0, 1fr) !important;
    gap: 4px !important;
  }

  body.hireops-apk .user-chip {
    grid-template-columns: minmax(24px, 1fr) auto auto !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk {
    --kpi-height: 42px;
    --kpi-value-size: 12px;
  }

  body.hireops-apk .kpi-grid {
    display: grid !important;
    grid-template-columns: repeat(var(--kpi-count, 1), minmax(0, 1fr)) !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(0, 1fr) !important;
    gap: 3px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  body.hireops-apk .kpi {
    height: var(--kpi-height) !important;
    min-height: var(--kpi-height) !important;
    max-height: var(--kpi-height) !important;
    min-width: 0 !important;
    padding: 4px 3px !important;
  }

  body.hireops-apk .kpi .label {
    font-size: 6.5px !important;
    line-height: 1 !important;
  }

  body.hireops-apk .kpi .value {
    margin-top: 1px !important;
    font-size: var(--kpi-value-size) !important;
    line-height: 1.05 !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 160 !important;
    touch-action: pan-y !important;
  }

  body.hireops-apk .user-panel {
    position: relative !important;
  }

  body.hireops-apk .user-chip {
    grid-template-columns: minmax(60px, 1fr) auto auto !important;
    gap: 3px !important;
  }

  body.hireops-apk .apk-user-menu-trigger {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 28px !important;
    padding: 0 !important;
    color: var(--ink) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: right !important;
  }

  body.hireops-apk .apk-user-menu-trigger .user-name-row {
    justify-content: flex-end !important;
  }

  body.hireops-apk .apk-user-menu {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    right: 0 !important;
    z-index: 220 !important;
    display: grid !important;
    min-width: 112px !important;
    gap: 5px !important;
    padding: 7px !important;
    background: var(--surface) !important;
    border: 1px solid var(--line-strong) !important;
    border-radius: 6px !important;
    box-shadow: 0 12px 28px rgba(20, 28, 35, 0.24) !important;
  }

  body.hireops-apk .apk-user-menu .ghost-button {
    width: 100% !important;
    min-height: 30px !important;
    padding: 5px 8px !important;
    font-size: 11px !important;
    text-align: center !important;
  }
}

body.hireops-apk .main-menu-toggle,
body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle,
body.hireops-apk.main-menu-collapsed .main-menu-toggle {
  position: fixed !important;
  top: calc(11px + env(safe-area-inset-top, 0px)) !important;
  left: 7px !important;
  z-index: 320 !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 4px !important;
  transform: none !important;
}

body.hireops-apk .main-menu-toggle::before {
  font-size: 17px !important;
}

@media (max-width: 720px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(132px, 1fr) minmax(142px, auto) !important;
  }

  body.hireops-apk .brand {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.hireops-apk .brand h1 {
    display: -webkit-box !important;
    max-height: 2.15em !important;
    overflow: hidden !important;
    font-size: 11.5px !important;
    line-height: 1.05 !important;
    text-overflow: clip !important;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body.hireops-apk .user-chip {
    grid-template-columns: minmax(42px, 1fr) auto auto !important;
  }
}

@media (max-width: 360px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(116px, 1fr) minmax(136px, auto) !important;
  }

  body.hireops-apk .brand h1 {
    font-size: 10.5px !important;
  }
}

.pdf-viewer-modal {
  width: min(1180px, calc(100vw - 20px));
  max-height: calc(100dvh - 20px);
  overflow: hidden;
}

.pdf-viewer-head {
  align-items: center;
}

.pdf-file-pick {
  position: relative;
  overflow: hidden;
}

.pdf-viewer-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}

.pdf-viewer-toolbar label {
  display: grid;
  gap: 2px;
  min-width: 86px;
}

.pdf-viewer-toolbar input,
.pdf-viewer-toolbar select {
  min-height: 30px;
}

.pdf-viewer-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: 10px;
  min-height: 0;
  max-height: calc(100dvh - 154px);
  padding-top: 10px;
}

.pdf-viewer-body-full {
  grid-template-columns: minmax(0, 1fr);
}

.pdf-page-shell {
  min-height: 360px;
  overflow: auto;
  padding: 8px;
  background: #bfc7d1;
  border: 1px solid var(--line-strong);
  -webkit-overflow-scrolling: touch;
}

.pdf-page-stage {
  position: relative;
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
}

.pdf-page-canvas {
  display: block;
  max-width: 100%;
  background: #fff;
  box-shadow: 0 4px 16px rgba(16, 24, 40, 0.22);
}

.pdf-annotation-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.pdf-page-shell.is-sign-mode .pdf-page-stage,
.pdf-page-shell.is-text-mode .pdf-page-stage {
  cursor: crosshair;
}

.pdf-text-box {
  position: absolute;
  z-index: 2;
  min-width: 80px;
  min-height: 32px;
  padding: 4px 5px;
  color: #111827;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid #1f5f91;
  border-radius: 2px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.16);
  font: 12px/1.25 Arial, sans-serif;
  pointer-events: auto;
  resize: both;
}

.pdf-text-box.is-selected {
  border-color: #0f4c81;
  box-shadow: 0 0 0 2px rgba(15, 76, 129, 0.22);
}

.pdf-signature-placement {
  position: absolute;
  z-index: 1;
  display: grid;
  align-items: center;
  justify-items: center;
  color: #0f4c81;
  background: rgba(255, 255, 255, 0.52);
  border: 2px dashed #0f4c81;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 900;
  pointer-events: none;
}

.pdf-viewer-status {
  margin-top: 6px;
  text-align: center;
}

.pdf-edit-panel,
.pdf-sign-panel {
  display: grid;
  align-content: start;
  gap: 9px;
  min-width: 0;
}

.pdf-side-panels {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
}

.pdf-voice-panel {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
  padding: 10px;
  background: #f6f8fb;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.pdf-voice-panel h4 {
  margin: 0;
}

.pdf-voice-grid {
  display: grid;
  gap: 8px;
}

.pdf-voice-grid label {
  display: grid;
  gap: 3px;
}

.pdf-voice-grid label span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.pdf-voice-grid select,
.pdf-voice-grid input:not([type="range"]) {
  width: 100%;
}

.pdf-voice-actions {
  align-items: stretch;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pdf-voice-actions button {
  min-width: 0;
}

.pdf-voice-sample {
  width: 100%;
}

.pdf-voice-note {
  margin: 0;
  font-size: 11px;
}

.pdf-text-format-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  background: var(--surface-2);
  border: 1px solid var(--line);
}

.pdf-text-format-grid label {
  display: grid;
  gap: 3px;
}

.pdf-text-format-grid label span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.pdf-text-format-buttons {
  display: flex;
  gap: 6px;
  align-items: end;
}

.pdf-signature-canvas {
  width: 100%;
  height: 170px;
  touch-action: none;
  background:
    linear-gradient(45deg, rgba(148, 163, 184, 0.14) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(148, 163, 184, 0.14) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(148, 163, 184, 0.14) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(148, 163, 184, 0.14) 75%),
    #fff;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0;
  background-size: 20px 20px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
}

.pdf-signature-date-preview {
  margin-top: -4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: calc(100vw - 10px);
    max-height: calc(100dvh - 10px);
    padding: 8px;
  }

  .pdf-viewer-body {
    grid-template-columns: 1fr;
    max-height: calc(100dvh - 190px);
    overflow: auto;
  }

  .pdf-page-shell {
    min-height: 280px;
  }

  .pdf-signature-canvas {
    height: 145px;
  }
}

.equipment-list-window-backdrop {
  align-items: stretch;
  background: rgba(7, 20, 35, 0.58);
  padding: 12px;
}

.equipment-list-window-modal {
  background: var(--surface);
  border: 2px solid var(--line-strong);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.42);
  height: calc(100dvh - 24px);
  max-height: none;
  margin: 0;
  overflow: hidden;
  padding: 14px;
  width: min(1840px, calc(100vw - 24px));
}

.equipment-list-window-modal .equipment-list-panel {
  background: var(--surface);
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  overflow: hidden;
  padding: 10px;
}

.equipment-list-window-modal .panel-head,
.equipment-list-window-modal .equipment-list-edit,
.equipment-list-window-modal .equipment-paste-actions {
  flex: 0 0 auto;
}

.equipment-list-window-modal .equipment-list-edit {
  grid-template-columns: minmax(118px, 0.55fr) minmax(190px, 1fr) minmax(120px, 0.55fr) minmax(108px, 0.5fr);
}

.equipment-list-window-modal .pop-stock-window {
  flex: 0 0 auto;
  margin-top: 0;
  overflow: hidden;
}

.equipment-list-window-modal .pop-stock-categories {
  flex-wrap: wrap;
  overflow-x: hidden;
  padding: 7px 8px;
}

.equipment-list-window-modal .pop-category {
  flex: 1 1 96px;
  min-width: 0;
  white-space: normal;
}

.equipment-list-window-modal .pop-stock-toolbar {
  grid-template-columns: minmax(54px, 70px) minmax(48px, 62px) minmax(220px, 1fr) minmax(190px, 280px) 32px 32px;
  gap: 6px;
  padding: 7px 8px;
}

.equipment-list-window-modal .pop-stock-grid {
  max-height: min(28dvh, 300px);
  overflow-x: hidden;
  overflow-y: auto;
}

.equipment-list-window-modal .pop-stock-grid table {
  min-width: 0;
  table-layout: fixed;
  width: 100%;
}

.equipment-list-window-modal .pop-stock-grid th,
.equipment-list-window-modal .pop-stock-grid td {
  overflow-wrap: anywhere;
  padding: 5px 6px;
  white-space: normal;
}

.equipment-list-window-modal .pop-stock-grid th:nth-child(1),
.equipment-list-window-modal .pop-stock-grid td:nth-child(1) {
  width: 34px;
}

.equipment-list-window-modal .pop-stock-grid th:nth-child(3),
.equipment-list-window-modal .pop-stock-grid td:nth-child(3),
.equipment-list-window-modal .pop-stock-grid th:nth-child(5),
.equipment-list-window-modal .pop-stock-grid td:nth-child(5) {
  width: 62px;
}

.equipment-list-window-modal .pop-stock-grid th:nth-child(4),
.equipment-list-window-modal .pop-stock-grid td:nth-child(4),
.equipment-list-window-modal .pop-stock-grid th:nth-child(6),
.equipment-list-window-modal .pop-stock-grid td:nth-child(6) {
  width: 92px;
}

.equipment-list-window-modal .equipment-paste-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  overflow: visible;
}

.equipment-list-window-modal .equipment-lines-wrap {
  flex: 1 1 auto;
  min-height: 190px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-bottom: 0;
}

.equipment-list-window-modal .equipment-lines-wrap .table-wrap {
  max-width: 100%;
  overflow-x: hidden;
}

.equipment-list-window-modal .equipment-lines-wrap table {
  min-width: 0;
  table-layout: fixed;
  width: 100%;
}

.equipment-list-window-modal .equipment-lines-wrap th,
.equipment-list-window-modal .equipment-lines-wrap td {
  overflow-wrap: anywhere;
  padding: 5px 6px;
  white-space: normal;
}

.equipment-list-window-modal .equipment-lines-wrap th:nth-child(1),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(1),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(11),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(11),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(12),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(12) {
  width: 44px;
}

.equipment-list-window-modal .equipment-lines-wrap th:nth-child(2),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(2),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(5),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(5),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(7),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(7),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(10),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(10) {
  width: 86px;
}

.equipment-list-window-modal .equipment-lines-wrap th:nth-child(6),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(6),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(8),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(8),
.equipment-list-window-modal .equipment-lines-wrap th:nth-child(9),
.equipment-list-window-modal .equipment-lines-wrap td:nth-child(9) {
  width: 78px;
}

.equipment-list-window-modal .equipment-item-cell,
.equipment-list-window-modal .qty-scan-cell {
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
  white-space: normal;
}

.equipment-list-window-modal .qty-scan-cell input,
.equipment-list-window-modal .money-input,
.equipment-list-window-modal .percent-input {
  min-width: 0;
  width: 100%;
}

.equipment-list-window-modal .scan-status-label,
.equipment-list-window-modal .nowrap-value {
  min-width: 0;
  white-space: normal;
}

@media (max-width: 900px) {
  .equipment-list-window-backdrop {
    padding: 8px;
  }

  .equipment-list-window-modal {
    height: calc(100dvh - 16px);
    padding: 8px;
    width: calc(100vw - 16px);
  }

  .equipment-list-window-modal .equipment-list-edit,
  .equipment-list-window-modal .pop-stock-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .equipment-list-window-modal .pop-search,
  .equipment-list-window-modal .pop-warehouse {
    grid-column: auto;
  }

  .equipment-list-window-modal .equipment-lines-wrap table,
  .equipment-list-window-modal .equipment-lines-wrap thead,
  .equipment-list-window-modal .equipment-lines-wrap tbody,
  .equipment-list-window-modal .equipment-lines-wrap tr,
  .equipment-list-window-modal .equipment-lines-wrap td {
    display: block;
    width: 100%;
  }

  .equipment-list-window-modal .equipment-lines-wrap thead {
    display: none;
  }

  .equipment-list-window-modal .equipment-lines-wrap tr {
    margin-bottom: 8px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface);
    overflow: hidden;
  }

  .equipment-list-window-modal .equipment-lines-wrap td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
  }
}

@media (max-width: 720px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(0, 1fr) minmax(138px, auto) !important;
    min-height: 82px !important;
    padding: calc(4px + env(safe-area-inset-top, 0px)) 5px 5px 46px !important;
    gap: 2px 5px !important;
  }

  body.hireops-apk .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: block !important;
    min-width: 0 !important;
    padding-left: 0 !important;
  }

  body.hireops-apk .brand-mark {
    position: fixed !important;
    top: calc(4px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: 330 !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
    object-fit: contain !important;
  }

  body.hireops-apk .brand h1 {
    display: -webkit-box !important;
    max-height: 2.35em !important;
    overflow: hidden !important;
    font-size: 12px !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body.hireops-apk .brand p {
    display: block !important;
    margin-top: 1px !important;
    overflow: hidden !important;
    color: var(--muted) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .user-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk .global-controls {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    padding-top: 1px !important;
  }

  body.hireops-apk .main-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle {
    top: calc(40px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 28px !important;
    min-height: 28px !important;
  }

  body.hireops-apk .main-menu-toggle::before {
    font-size: 17px !important;
  }
}

@media (max-width: 360px) {
  body.hireops-apk .topbar {
    grid-template-columns: minmax(0, 1fr) minmax(132px, auto) !important;
  }

  body.hireops-apk .brand h1 {
    font-size: 10.5px !important;
  }

  body.hireops-apk .brand p {
    font-size: 8.5px !important;
  }
}

/* Runtime 143 APK final layout fixes */
@media (max-width: 720px) {
  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 360 !important;
  }

  body.hireops-apk .brand-mark {
    position: fixed !important;
    top: calc(4px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: 390 !important;
  }

  body.hireops-apk .main-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle {
    position: fixed !important;
    top: calc(40px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: 620 !important;
  }

  body.hireops-apk .sidebar {
    top: 0 !important;
    bottom: 0 !important;
    z-index: 600 !important;
    padding-top: calc(78px + env(safe-area-inset-top, 0px)) !important;
    box-shadow: 12px 0 32px rgba(12, 18, 26, 0.34) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: 590 !important;
    background: rgba(8, 14, 22, 0.36) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed) .sidebar {
    transform: translateX(0) !important;
  }

  body.hireops-apk.main-menu-collapsed .sidebar {
    transform: translateX(-105%) !important;
  }

  body.hireops-apk .whatsapp-layout,
  body.hireops-apk .whatsapp-sidebar,
  body.hireops-apk .whatsapp-chat-panel,
  body.hireops-apk .whatsapp-messages,
  body.hireops-apk .whatsapp-compose {
    background: var(--surface) !important;
  }

  body.hireops-apk .whatsapp-chat-panel > .panel-head {
    min-height: auto !important;
    padding: 6px 8px !important;
    color: var(--ink) !important;
    background: var(--surface-2) !important;
    border-bottom: 1px solid var(--line) !important;
    box-shadow: none !important;
  }

  body.hireops-apk .messenger-chat-title-main,
  body.hireops-apk .whatsapp-chat-panel > .panel-head .actions {
    display: none !important;
  }

  body.hireops-apk .messenger-back-button {
    color: var(--ink) !important;
    background: var(--surface) !important;
    border-color: var(--line) !important;
    box-shadow: var(--shadow) !important;
  }

  body.hireops-apk .whatsapp-message-bubble,
  body.hireops-apk .whatsapp-message.is-own .whatsapp-message-bubble {
    color: var(--ink) !important;
    background: var(--surface) !important;
    border: 1px solid var(--line) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
  }

  body.hireops-apk .whatsapp-message.is-own .whatsapp-message-bubble {
    background: var(--soft-blue) !important;
  }

  body.hireops-apk .equipment-list-window-backdrop {
    padding: 4px !important;
  }

  body.hireops-apk .equipment-list-window-modal {
    width: calc(100vw - 8px) !important;
    height: calc(100dvh - 8px) !important;
    padding: 6px !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-list-panel {
    padding: 6px !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-list-edit,
  body.hireops-apk .equipment-list-window-modal .pop-stock-toolbar {
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-window {
    max-height: 34dvh !important;
    overflow: hidden !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid {
    max-height: 22dvh !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap {
    min-height: 36dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap table,
  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap thead,
  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap tbody,
  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap tr,
  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap td {
    display: block !important;
    width: 100% !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap thead {
    display: none !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap tr {
    display: grid !important;
    gap: 4px !important;
    margin-bottom: 8px !important;
    padding: 7px !important;
    background: var(--surface) !important;
    border: 1px solid var(--line-strong) !important;
    border-radius: 6px !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap td {
    display: grid !important;
    grid-template-columns: 86px minmax(0, 1fr) !important;
    gap: 6px !important;
    align-items: start !important;
    padding: 3px 0 !important;
    overflow: visible !important;
    white-space: normal !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap td::before {
    content: attr(data-label) !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: var(--muted) !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-item-cell,
  body.hireops-apk .equipment-list-window-modal .qty-scan-cell {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  body.hireops-apk .equipment-list-window-modal input,
  body.hireops-apk .equipment-list-window-modal select {
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

/* Runtime 145 final APK locked header override */
@media (max-width: 720px) {
  body.hireops-apk {
    --apk-header-z: 700;
    --apk-menu-z: 760;
    padding-top: 0 !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: var(--apk-header-z) !important;
    isolation: isolate !important;
    min-height: calc(118px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk .brand {
    padding-left: 40px !important;
    min-height: 34px !important;
  }

  body.hireops-apk .brand-mark {
    position: fixed !important;
    top: calc(5px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-header-z) + 10) !important;
    width: 30px !important;
    height: 30px !important;
    pointer-events: none !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .main-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle {
    position: fixed !important;
    top: calc(44px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-menu-z) + 20) !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: var(--apk-menu-z) !important;
    padding-top: calc(84px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: calc(var(--apk-menu-z) - 5) !important;
  }
}

/* Runtime 148 final APK header-owned logo and menu controls */
@media (max-width: 720px) {
  body.hireops-apk {
    --apk-header-z: 780;
    --apk-menu-z: 790;
    padding-top: 0 !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: var(--apk-header-z) !important;
    overflow: visible !important;
    isolation: isolate !important;
    transform: none !important;
    min-height: calc(118px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk .brand {
    padding-left: 40px !important;
    min-height: 34px !important;
  }

  body.hireops-apk .brand-mark {
    position: absolute !important;
    top: calc(5px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-header-z) + 15) !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    transform: none !important;
    pointer-events: none !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    position: absolute !important;
    top: calc(44px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-header-z) + 20) !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: var(--apk-menu-z) !important;
    padding-top: calc(84px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: calc(var(--apk-menu-z) - 5) !important;
  }
}

/* Runtime 149 final APK logo top-left and menu beside Company selector */
@media (max-width: 720px) {
  body.hireops-apk {
    --apk-header-z: 780;
    --apk-menu-z: 790;
    padding-top: 0 !important;
  }

  body.hireops-apk .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: var(--apk-header-z) !important;
    overflow: visible !important;
    isolation: isolate !important;
    transform: none !important;
    min-height: calc(118px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk .brand {
    position: relative !important;
    min-height: 34px !important;
    padding-left: 40px !important;
  }

  body.hireops-apk .brand-mark {
    position: absolute !important;
    top: calc(5px + env(safe-area-inset-top, 0px)) !important;
    left: 8px !important;
    z-index: calc(var(--apk-header-z) + 15) !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    transform: none !important;
    pointer-events: none !important;
  }

  body.hireops-apk .brand-mark img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  body.hireops-apk .global-controls {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 5px !important;
    align-items: end !important;
    width: 100% !important;
  }

  body.hireops-apk .global-controls .apk-header-menu-toggle {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: end !important;
    justify-self: stretch !important;
  }

  body.hireops-apk .global-controls label:has(#companyFilter) {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk .global-controls label:has(#branchFilter) {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk .global-controls label:has(#departmentFilter) {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk .global-controls label:has(#searchInput) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: calc(var(--apk-header-z) + 20) !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk .sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    z-index: var(--apk-menu-z) !important;
    padding-top: calc(84px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk:not(.main-menu-collapsed)::before {
    z-index: calc(var(--apk-menu-z) - 5) !important;
  }
}

/* Runtime 150 final APK left-edge logo and menu placement */
@media (max-width: 720px) {
  body.hireops-apk .topbar {
    padding-left: 2px !important;
    padding-right: 4px !important;
  }

  body.hireops-apk .brand {
    padding-left: 34px !important;
  }

  body.hireops-apk .brand-mark {
    left: 2px !important;
  }

  body.hireops-apk .global-controls {
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 4px !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  body.hireops-apk .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .main-menu-toggle.apk-header-menu-toggle {
    width: 28px !important;
    min-width: 28px !important;
    justify-self: start !important;
  }
}

/* Runtime 152 final APK brand text alignment */
@media (max-width: 720px) {
  body.hireops-apk .brand > div:not(.brand-mark) {
    transform: translateY(8px) !important;
  }
}

/* Runtime 155 final PDF Studio web scrolling */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  overflow: auto !important;
}

.pdf-viewer-modal {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow: auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  overflow: auto !important;
}

.pdf-page-shell {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
}

.pdf-sign-panel {
  max-height: calc(100dvh - 190px) !important;
  overflow: auto !important;
  padding-right: 2px !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    max-height: calc(100dvh - 10px) !important;
  }

  .pdf-viewer-body,
  .pdf-page-shell,
  .pdf-sign-panel {
    max-height: none !important;
  }
}

/* Runtime 156 true-final web Messenger: only chat scrolls */
@media (min-width: 721px) {
  body[data-view="whatsapp"]:not(.hireops-apk) {
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .layout {
    height: calc(100dvh - 89px) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-layout {
    height: 100% !important;
    min-height: 0 !important;
    align-items: stretch !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-sidebar,
  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-chat-panel {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-messages {
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  body[data-view="whatsapp"]:not(.hireops-apk) .whatsapp-compose {
    flex-shrink: 0 !important;
  }
}
/* Runtime 157: Report Studio admin builder */
.report-studio-grid {
  grid-template-columns: minmax(380px, 1.2fr) minmax(320px, .8fr);
  align-items: start;
}

.report-studio-editor .form-grid {
  align-items: start;
}

.report-studio-band {
  max-height: 156px;
  overflow: auto;
  align-content: start;
}

.report-studio-band .checkbox-tile.compact {
  min-height: 34px;
  padding: 6px 8px;
}

.report-studio-preview {
  background: #f5f7fa;
  border: 1px solid #d8e0e8;
  padding: 12px;
  min-height: 520px;
  display: grid;
  gap: 10px;
  align-content: start;
}

.report-studio-band-preview {
  background: #fff;
  border: 1px solid #c7d0da;
  padding: 12px;
  display: grid;
  gap: 8px;
  min-width: 0;
}

.report-studio-band-preview.report-header-band {
  border-top-width: 4px;
}

.report-studio-band-preview.report-detail-band {
  min-height: 150px;
}

.report-studio-band-preview .band-label {
  color: #607080;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.report-import-preview {
  max-height: 190px;
  overflow: auto;
  padding: 10px;
  color: #102638;
  background: #f8fafc;
  border: 1px dashed #b9c7d6;
  border-radius: 6px;
  font-family: Consolas, Courier New, monospace;
  font-size: 12px;
  line-height: 1.45;
}

.fresh-report-builder {
  display: grid;
  grid-template-columns: minmax(480px, 1fr) minmax(360px, 0.68fr);
  gap: var(--app-gap);
  align-items: start;
  min-width: 0;
}

.fresh-report-builder > *,
.fresh-report-builder-editor,
.report-studio-editor,
.fresh-report-builder-sections,
.report-builder-section {
  min-width: 0;
}

.fresh-report-builder-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 8px 0;
}

.report-builder-main-head,
.report-builder-preview-head {
  align-items: center;
  gap: 10px;
}

.report-builder-main-head > div:first-child,
.report-builder-preview-head > div:first-child {
  min-width: 0;
}

.report-builder-head-actions,
.report-builder-preview-head .actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.report-builder-card,
.report-builder-work-card {
  margin: 10px 0;
  background: #f8fbfd;
  border: 1px solid #c6d2dd;
  border-radius: 6px;
}

.report-builder-card > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 36px;
  padding: 8px 10px;
  color: #102638;
  background: #e5edf4;
  border-bottom: 1px solid #c6d2dd;
  cursor: pointer;
  font-weight: 900;
}

.report-builder-card > summary small {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-builder-card:not([open]) > summary {
  border-bottom: 0;
}

.report-builder-setup-grid,
.report-builder-output-grid {
  padding: 10px;
}

.report-builder-setup-groups {
  display: grid;
  gap: 10px;
  padding: 10px;
}

.report-builder-setup-group {
  min-width: 0;
  padding: 10px;
  background: #f6f9fb;
  border: 1px solid #c6d2dd;
  border-radius: 5px;
}

.report-builder-setup-group h4 {
  margin: 0 0 8px;
  color: #102638;
  font-size: 12px;
  font-weight: 900;
}

.report-builder-setup-group .report-builder-setup-grid,
.report-builder-setup-group .report-builder-output-grid {
  padding: 0;
}

.report-builder-setup-group .report-document-structure,
.report-builder-setup-group .report-builder-design-controls {
  margin: 0;
}

.report-builder-status-strip {
  padding: 7px 8px;
  background: #eef4f8;
  border: 1px solid #d2dde6;
  border-radius: 6px;
}

.report-builder-work-card {
  padding: 10px;
}

.report-builder-sticky-tools {
  position: sticky;
  top: calc(var(--main-menu-top, 90px) + 8px);
  z-index: 18;
  padding: 8px;
  background: #f8fbfd;
  border: 1px solid #b8c4cf;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.report-builder-advanced-grid {
  display: grid;
  gap: 10px;
  padding: 0 10px 10px;
}

.report-builder-preview-panel {
  position: sticky;
  top: 10px;
}

.report-builder-preview-head .actions button {
  min-height: 30px;
  padding: 5px 10px;
}

.fresh-report-builder-palette {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-height: 184px;
  overflow: auto;
  padding: 8px;
  background: var(--surface-2);
  border: 1px solid var(--line);
}

.report-builder-palette-head {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 5px;
  color: #102638;
  border-bottom: 1px solid #c9d4df;
  font-size: 11px;
  font-weight: 900;
}

.report-builder-palette-head span {
  color: var(--muted);
}

.report-builder-section-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 8px;
  margin: 8px 0;
}

.report-builder-section-control {
  border: 1px solid #b8c4cf;
  background: #f6f9fb;
}

.report-builder-section-control.is-active {
  border-color: #0f4c81;
  box-shadow: 0 0 0 2px rgba(15, 76, 129, 0.14);
}

.report-builder-section-control-head {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 8px;
  color: #102638;
  background: #dce6ee;
  border: 0;
  border-bottom: 1px solid #b8c4cf;
  text-align: left;
  cursor: pointer;
}

.report-builder-section-control-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.report-builder-section-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
}

.report-builder-section-control-grid label {
  display: grid;
  gap: 3px;
}

.report-builder-section-control-grid label span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.report-builder-section-control-grid .wide-field {
  grid-column: 1 / -1;
}

.report-builder-source-link-field {
  min-width: 0;
  margin: 0;
  padding: 8px;
  border: 1px solid #b8c4cf;
  border-radius: 4px;
}

.report-builder-source-link-field legend {
  padding: 0 4px;
  color: #4a5867;
  font-size: 11px;
  font-weight: 900;
}

.report-builder-palette-source-head {
  width: 100%;
  padding: 5px 6px;
  color: #263746;
  background: #dde7ef;
  border: 1px solid #c0ccd8;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 900;
}

.report-builder-margin-fields {
  grid-column: 1 / -1;
}

.report-builder-margin-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(82px, 1fr));
  gap: 7px;
}

.report-builder-margin-grid label {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.report-document-structure {
  margin: 10px 0;
  border: 1px solid var(--line);
  background: var(--surface-2);
}

.report-document-structure summary {
  padding: 8px 10px;
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
}

.report-document-structure .compact-form-grid {
  padding: 10px;
  border-top: 1px solid var(--line);
}

.report-document-line-fields,
.report-document-option-grid {
  max-height: 188px;
  overflow: auto;
  align-content: start;
  padding: 4px;
  background: #fff;
  border: 1px solid #c9d4df;
}

.report-builder-field-pill {
  min-height: 30px;
  padding: 5px 9px;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  cursor: grab;
  font-size: 11px;
  font-weight: 800;
}

.report-builder-field-pill.manual {
  color: #fff;
  background: var(--primary);
  border-color: var(--primary);
}

.report-builder-field-pill.formula {
  color: #3f2c00;
  background: #fff4ce;
  border-color: #d2a843;
}

.report-builder-field-pill.line {
  color: #4c1d95;
  background: #f4f0ff;
  border-color: #bba7ea;
}

.report-builder-field-pill.is-dragging,
.report-builder-grid-cell.is-dragging {
  opacity: 0.55;
}

.fresh-report-builder-sections {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.report-builder-section {
  border: 1px solid #b8c4cf;
  background: #f3f7fa;
}

.report-builder-section-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 8px;
  color: #102638;
  background: #dce6ee;
  border-bottom: 1px solid #b8c4cf;
}

.report-builder-section-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.report-builder-sheet {
  display: grid;
  grid-template-columns: repeat(var(--report-builder-columns, 4), minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: #aebdca;
}

.report-builder-column-heads {
  display: contents;
}

.report-builder-column-heads span {
  min-height: 24px;
  padding: 4px 6px;
  color: #243342;
  background: #e8eef4;
  border: 1px solid #c3ced8;
  text-align: center;
  font-size: 11px;
  font-weight: 900;
}

.report-builder-grid-cell {
  position: relative;
  display: grid;
  min-height: 104px;
  gap: 5px;
  align-content: start;
  padding: 8px;
  background: #f8fafc;
  border: 1px dashed #aab8c5;
}

.report-builder-grid-cell.is-filled {
  background: #fff;
  border-style: solid;
  border-color: #6f879f;
  padding-top: 24px;
}

.report-builder-grid-cell.is-manual {
  background: #edf5fb;
}

.report-builder-grid-cell.is-formula {
  background: #fffaf0;
  border-color: #c99a2e;
}

.report-builder-grid-cell.is-line {
  align-content: center;
}

.report-builder-grid-cell.is-selected {
  outline: 3px solid rgba(15, 76, 129, 0.34);
  outline-offset: -3px;
}

.report-builder-grid-cell.has-hidden-heading {
  box-shadow: inset 0 -3px 0 rgba(131, 87, 0, 0.28);
}

.report-builder-cell-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.report-builder-grid-cell.is-drop-target {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(15, 76, 129, 0.16);
}

.report-builder-cell-index {
  position: absolute;
  top: 4px;
  right: 6px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
}

.report-builder-cell-move-handle {
  position: absolute;
  top: 4px;
  left: 6px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 16px;
  padding: 1px 6px;
  color: #123b5d;
  background: #eef5fb;
  border: 1px solid #b7c9d8;
  border-radius: 3px;
  cursor: grab;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  user-select: none;
}

.report-builder-grid-cell.is-dragging .report-builder-cell-move-handle {
  cursor: grabbing;
}

.report-builder-grid-cell label {
  display: grid;
  gap: 3px;
}

.report-builder-grid-cell input,
.report-builder-grid-cell textarea {
  width: 100%;
  min-width: 0;
}

.report-builder-field-token {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 2px 6px;
  overflow: hidden;
  color: #0f4c81;
  background: #e8f2fb;
  border: 1px solid #b7d0e7;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-builder-field-token.formula-token {
  color: #5b3d00;
  background: #fff4ce;
  border-color: #d2a843;
}

.report-builder-heading-state {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 2px 6px;
  color: #5b3d00;
  background: #fff7d9;
  border: 1px solid #d9b35a;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
}

.report-builder-colour-line {
  width: 100%;
  min-height: 1px;
}

.report-builder-format-bar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(86px, 1fr));
  gap: 7px;
  align-items: end;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  margin: 8px 0;
  padding: 8px;
  background: #eef4f8;
  border: 1px solid #b8c4cf;
}

.report-builder-format-bar > div:first-child {
  display: grid;
  gap: 2px;
  align-self: center;
}

.report-builder-format-bar label {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.report-builder-format-bar label span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.report-builder-format-bar input,
.report-builder-format-bar select {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.report-builder-format-bar input[type="color"] {
  min-height: 31px;
  padding: 2px;
}

.report-builder-format-bar .chip-button {
  width: 100%;
  min-width: 0;
}

.fresh-report-builder-preview {
  min-height: 620px;
  overflow: auto;
}

.fresh-report-builder-preview.is-pending {
  opacity: 0.82;
}

.report-builder-fast-preview {
  display: grid;
  gap: 10px;
  min-height: 620px;
  padding: 12px;
  border: 1px solid var(--line-strong);
  box-shadow: 0 1px 0 #fff inset;
}

.report-builder-fast-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 3px solid var(--primary);
}

.report-builder-fast-head img {
  width: 72px;
  max-height: 58px;
  object-fit: contain;
}

.report-builder-fast-head h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
}

.report-builder-fast-head span,
.report-builder-fast-head small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.report-builder-fast-note {
  padding: 7px 8px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--line);
}

.report-builder-exact-preview {
  min-height: 720px;
  background: #c8d1da;
  border: 1px solid var(--line-strong);
}

.report-builder-preview-frame {
  display: block;
  width: 100%;
  min-height: 720px;
  border: 0;
  background: #fff;
}

.report-builder-letterhead-preview {
  display: grid;
  gap: 12px;
  min-height: 600px;
  padding: 18px;
  background-color: #fff;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  border: 1px solid var(--line-strong);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}

.report-builder-letterhead-preview.has-letterhead {
  background-color: rgba(255, 255, 255, 0.92);
  background-blend-mode: lighten;
}

.report-builder-letterhead-head {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 4px solid var(--primary);
}

.report-builder-letterhead-head img {
  max-width: 82px;
  max-height: 58px;
  object-fit: contain;
}

.report-builder-letterhead-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.report-builder-letterhead-grid > div {
  min-height: 50px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid #c8d3de;
}

.report-builder-letterhead-grid span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.report-builder-letterhead-grid strong {
  display: block;
  margin-top: 4px;
  word-break: break-word;
}

.report-builder-preview-sections {
  display: grid;
  gap: 12px;
}

.report-builder-preview-section {
  border: 1px solid #b8c4cf;
  background: #f5f8fb;
}

.report-builder-preview-section-head {
  padding: 6px 8px;
  color: #102638;
  background: #dde7ef;
  border-bottom: 1px solid #b8c4cf;
  font-size: 11px;
  font-weight: 900;
}

.report-builder-preview-sheet {
  display: grid;
  grid-template-columns: repeat(var(--report-builder-columns, 4), minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: #aebdca;
}

.report-builder-preview-column-heads {
  display: contents;
}

.report-builder-preview-column-heads span {
  min-height: 22px;
  padding: 4px 6px;
  color: #243342;
  background: #e8eef4;
  border: 1px solid #c3ced8;
  text-align: center;
  font-size: 10px;
  font-weight: 900;
}

.report-builder-preview-cell {
  display: grid;
  gap: 3px;
  align-content: start;
  min-height: 52px;
  padding: 6px;
  overflow: hidden;
  word-break: break-word;
}

.report-builder-preview-cell.empty {
  color: #8391a0;
  background: #f8fafc;
  border: 1px solid #d5dde5;
  font-size: 9px;
  font-weight: 800;
}

.report-builder-preview-cell span {
  color: inherit;
  font-size: 0.78em;
  font-weight: 900;
  text-transform: uppercase;
}

.report-builder-preview-cell strong {
  min-width: 0;
  font-size: 1em;
}

.report-builder-preview-cell.is-line {
  align-content: center;
}

.report-builder-preview-cell.is-line i {
  display: block;
  width: 100%;
}

.report-builder-preview-table {
  min-height: 110px;
  padding: 10px;
  color: #304050;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid #c8d3de;
  font-family: Consolas, Courier New, monospace;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 980px) {
  .fresh-report-builder {
    grid-template-columns: 1fr;
  }

  .report-builder-preview-panel {
    position: static;
  }

  .report-builder-main-head,
  .report-builder-preview-head {
    align-items: stretch;
  }

  .report-builder-head-actions,
  .report-builder-preview-head .actions {
    justify-content: flex-start;
  }

  .report-builder-format-bar,
  .pdf-text-format-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-builder-margin-grid {
    grid-template-columns: repeat(2, minmax(82px, 1fr));
  }

  .report-builder-sheet {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-builder-preview-sheet {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-builder-step {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  .report-builder-step em {
    grid-column: 2;
  }
}

.report-studio-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.report-studio-columns span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-token-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  background: #f8fafc;
  border: 1px solid #d8e0e8;
  border-radius: 6px;
}

.report-token-list code {
  padding: 4px 6px;
  color: #102638;
  background: #e8eef5;
  border: 1px solid #ced8e3;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
}

.report-studio-simple {
  display: grid;
  gap: 12px;
}

.report-builder-step {
  display: grid;
  grid-template-columns: 24px minmax(0, auto) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  margin-bottom: 6px;
  color: #102638;
}

.report-builder-step span {
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: #173f65;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.report-builder-step em {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-field-stack {
  display: grid;
  gap: 10px;
}

.report-studio-details {
  background: #f8fafc;
  border: 1px solid #d8e0e8;
  border-radius: 7px;
}

.report-studio-details > summary {
  padding: 10px 12px;
  color: #102638;
  cursor: pointer;
  font-weight: 900;
  list-style-position: inside;
}

.report-studio-details[open] > summary {
  border-bottom: 1px solid #d8e0e8;
}

.report-studio-details > .form-grid {
  padding: 12px;
}

@media (max-width: 900px) {
  .report-studio-grid {
    grid-template-columns: 1fr;
  }

  .compact-form-grid {
    grid-template-columns: 1fr;
  }
}

/* Runtime 158: APK brand opens company / branch / department scope menu */
@media (max-width: 720px) {
  body.hireops-apk .brand[data-toggle-apk-scope-menu] {
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
  }

  body.hireops-apk .brand[data-toggle-apk-scope-menu]:focus-visible {
    outline: 2px solid var(--accent, #2b6cb0);
    outline-offset: 2px;
  }

  body.hireops-apk .global-controls {
    overflow: visible !important;
  }

  body.hireops-apk:not(.apk-scope-menu-open) .global-controls label:has(#companyFilter),
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls label:has(#branchFilter),
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls label:has(#departmentFilter),
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls label:has(#warehouseFilter),
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls label:has(#searchInput) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    position: absolute !important;
    left: 4px !important;
    right: 4px !important;
    top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    z-index: calc(var(--apk-header-z, 780) + 25) !important;
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 5px !important;
    padding: 8px !important;
    background: var(--panel, #fff) !important;
    border: 1px solid var(--line, #d8e0e8) !important;
    border-radius: 8px !important;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .24) !important;
  }

  body.hireops-apk.apk-scope-menu-open .topbar {
    padding-bottom: 132px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .apk-header-menu-toggle {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls label:has(#companyFilter) {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls label:has(#branchFilter) {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls label:has(#departmentFilter) {
    grid-column: 3 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls label:has(#searchInput) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }
}

/* Runtime 159: WebView-safe APK selectors and non-overlapping web collapse bar */
.global-controls .scope-search-control {
  grid-column: 1 / -1;
  min-width: 0;
}

body:not(.hireops-apk) .layout {
  grid-template-columns: 24px 214px minmax(0, 1fr) !important;
  min-height: calc(100vh - 89px) !important;
  min-height: calc(100dvh - 89px) !important;
}

body:not(.hireops-apk).main-menu-collapsed .layout {
  grid-template-columns: 24px 0 minmax(0, 1fr) !important;
}

body:not(.hireops-apk) .main-menu-toggle {
  grid-column: 1 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 30 !important;
  width: 24px !important;
  min-width: 24px !important;
  height: calc(100vh - 89px) !important;
  height: calc(100dvh - 89px) !important;
  min-height: 220px !important;
  margin-left: 0 !important;
  transform: none !important;
}

body:not(.hireops-apk) .sidebar {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  height: calc(100vh - 89px) !important;
  height: calc(100dvh - 89px) !important;
  max-height: calc(100vh - 89px) !important;
  max-height: calc(100dvh - 89px) !important;
}

body:not(.hireops-apk) .content {
  grid-column: 3 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
}

body:not(.hireops-apk).main-menu-collapsed .sidebar {
  width: 0 !important;
  min-width: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: hidden !important;
}

@media (max-width: 720px) {
  body:not(.hireops-apk) .layout,
  body:not(.hireops-apk).main-menu-collapsed .layout {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
    min-height: auto !important;
  }

  body:not(.hireops-apk) .main-menu-toggle {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 31 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 18px !important;
    min-height: 18px !important;
    margin: 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--nav-border) !important;
    writing-mode: horizontal-tb !important;
  }

  body:not(.hireops-apk) .sidebar {
    grid-column: 1 !important;
    grid-row: 2 !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .sidebar {
    display: none !important;
  }

  body:not(.hireops-apk) .content {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
}

@media (max-width: 720px) {
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-company-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-branch-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-department-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-warehouse-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-search-control {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-column: 3 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-search-control {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }
}

/* Runtime 164 final cascade: keep APK search beside hamburger and selector menu equal width */
@media (max-width: 720px) {
  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control {
    position: absolute !important;
    top: calc(39px + env(safe-area-inset-top, 0px)) !important;
    left: 38px !important;
    right: 2px !important;
    z-index: calc(var(--apk-header-z, 780) + 28) !important;
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    margin: 0 !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control #searchInput {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 12px !important;
    line-height: 18px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    grid-template-columns: minmax(0, 1fr) !important;
    left: 6px !important;
    right: 6px !important;
    top: calc(76px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-row: 3 !important;
  }

  body.hireops-apk.apk-scope-menu-open .topbar {
    padding-bottom: 144px !important;
  }
}

/* Runtime 165 final cascade: APK Messenger fits the visible page */
@media (max-width: 720px) {
  body[data-view="whatsapp"].hireops-apk {
    height: 100dvh !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .layout {
    height: calc(100dvh - (118px + env(safe-area-inset-top, 0px))) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
    align-items: stretch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-sidebar,
  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head,
  body[data-view="whatsapp"].hireops-apk .whatsapp-compose {
    min-height: 0 !important;
    flex: 0 0 auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-messages {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

body[data-view="whatsapp"].hireops-apk .whatsapp-contact-list,
  body[data-view="whatsapp"].hireops-apk .whatsapp-thread-list {
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* Runtime 166: keep a clear gutter between the fixed menu rail and page content */
body:not(.hireops-apk) .content {
  box-sizing: border-box;
}

@media (min-width: 721px) {
  body:not(.hireops-apk):not(.main-menu-collapsed) .layout {
    grid-template-columns: 242px minmax(0, 1fr) !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .content {
    padding-left: calc(var(--app-pad) + 28px) !important;
  }
}

@media (max-width: 720px) {
  body:not(.hireops-apk).main-menu-collapsed .content {
    padding-left: 34px !important;
  }
}

/* Runtime 400: keep the side menu panel filled below collapsed menu groups */
body:not(.hireops-apk) .sidebar {
  background: linear-gradient(var(--nav-start), var(--nav-end)) !important;
}

@media (min-width: 721px) {
  body:not(.hireops-apk) .sidebar {
    height: calc(100vh - 89px) !important;
    height: calc(100dvh - 89px) !important;
    min-height: calc(100vh - 89px) !important;
    min-height: calc(100dvh - 89px) !important;
    max-height: calc(100vh - 89px) !important;
    max-height: calc(100dvh - 89px) !important;
  }
}

@media (max-width: 720px) {
  body:not(.hireops-apk) .sidebar {
    top: var(--main-menu-top, 84px) !important;
    min-height: calc(100vh - var(--main-menu-top, 84px)) !important;
    min-height: calc(100dvh - var(--main-menu-top, 84px)) !important;
    max-height: calc(100vh - var(--main-menu-top, 84px)) !important;
    max-height: calc(100dvh - var(--main-menu-top, 84px)) !important;
    background: linear-gradient(var(--nav-start), var(--nav-end)) !important;
    overflow-y: auto !important;
  }

  body:not(.hireops-apk) .main-menu-toggle {
    top: var(--main-menu-top, 84px) !important;
    height: calc(100vh - var(--main-menu-top, 84px)) !important;
    height: calc(100dvh - var(--main-menu-top, 84px)) !important;
  }
}

@media (max-width: 720px) {
  body:not(.hireops-apk) .sidebar {
    min-height: calc(100vh - 84px) !important;
    min-height: calc(100dvh - 84px) !important;
    background: linear-gradient(var(--nav-start), var(--nav-end)) !important;
  }
}

@media (max-width: 420px) {
  body:not(.hireops-apk) .sidebar {
    min-height: calc(100vh - 96px) !important;
    min-height: calc(100dvh - 96px) !important;
  }
}

/* Runtime 396: keep side navigation locked while page content scrolls */
@media (min-width: 721px) {
  body:not(.hireops-apk) .layout {
    grid-template-columns: 214px minmax(0, 1fr) !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .layout {
    grid-template-columns: 0 minmax(0, 1fr) !important;
  }

  body:not(.hireops-apk) .sidebar {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: fixed !important;
    top: 89px !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 18 !important;
    width: 214px !important;
    height: auto !important;
    max-height: calc(100vh - 89px) !important;
    overflow-y: auto !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .sidebar {
    width: 0 !important;
  }

  body:not(.hireops-apk) .content {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    margin-left: 0 !important;
  }

  body:not(.hireops-apk) .main-menu-toggle {
    position: fixed !important;
    top: 89px !important;
    left: 0 !important;
    z-index: 19 !important;
    height: calc(100vh - 89px) !important;
  }

  body:not(.hireops-apk):not(.main-menu-collapsed) .main-menu-toggle {
    margin-left: 0 !important;
    transform: translateX(206px) !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .main-menu-toggle {
    transform: translateX(0) !important;
  }
}

/* Runtime 401: align the locked menu below the actual header height */
@media (min-width: 721px) {
  body:not(.hireops-apk) .sidebar {
    top: var(--main-menu-top, 89px) !important;
    height: calc(100vh - var(--main-menu-top, 89px)) !important;
    height: calc(100dvh - var(--main-menu-top, 89px)) !important;
    min-height: calc(100vh - var(--main-menu-top, 89px)) !important;
    min-height: calc(100dvh - var(--main-menu-top, 89px)) !important;
    max-height: calc(100vh - var(--main-menu-top, 89px)) !important;
    max-height: calc(100dvh - var(--main-menu-top, 89px)) !important;
    background: linear-gradient(var(--nav-start), var(--nav-end)) !important;
    overflow-y: auto !important;
  }

  body:not(.hireops-apk) .main-menu-toggle {
    top: var(--main-menu-top, 89px) !important;
    height: calc(100vh - var(--main-menu-top, 89px)) !important;
    height: calc(100dvh - var(--main-menu-top, 89px)) !important;
  }
}

/* Runtime 411: final side-menu gutter after locked-menu overrides */
@media (min-width: 721px) {
  body:not(.hireops-apk):not(.main-menu-collapsed) .layout {
    grid-template-columns: 242px minmax(0, 1fr) !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .content {
    padding-left: calc(var(--app-pad) + 28px) !important;
  }
}

.jobbook-contact-summary,
.jobbook-financial-warnings {
  display: grid;
  gap: 6px;
}

.client-contact-detail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 6px 12px;
  padding: 8px;
  border: 1px solid var(--border);
  background: var(--panel-soft);
}

.client-contact-detail.empty {
  color: var(--muted);
  font-style: italic;
}

.client-contact-detail span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

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

.jobbook-finance-grid fieldset {
  align-content: start;
}

.jobbook-finance-grid label,
.transport-distance-edit {
  min-width: 0;
}

.equipment-availability-chip {
  display: inline-flex;
  min-width: 44px;
  justify-content: flex-end;
  font-variant-numeric: tabular-nums;
}

.transport-distance-edit {
  display: grid;
  grid-template-columns: minmax(70px, 0.45fr) minmax(120px, 1fr);
  gap: 6px;
  margin-top: 4px;
  align-items: start;
}

.supplier-detail-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 4px 10px;
  margin: 8px 0;
  padding: 8px;
  border: 1px solid var(--border);
  background: var(--panel-soft);
}

.accounts-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 8px 0;
}

.accounts-filter-layout {
  align-items: end;
}

.accounts-filter-layout .accounts-status-filter-grid {
  align-items: start;
}

.equipment-picker-modal,
.equipment-list-create-modal {
  width: min(1120px, calc(100vw - 28px));
}

@media (max-width: 980px) {
  .jobbook-finance-grid {
    grid-template-columns: 1fr;
  }

  .transport-distance-edit {
    grid-template-columns: 1fr;
  }
}

/* Runtime 269 final cascade: full PDF Studio workspace for reports, PDFs and documents */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pdf-viewer-modal {
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.pdf-viewer-head,
.pdf-viewer-toolbar {
  flex: 0 0 auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

.pdf-page-shell {
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-studio-report-frame {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
  }

  .pdf-viewer-toolbar {
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
}

/* Runtime 269: all report and document viewing opens in the full PDF Studio workspace */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pdf-viewer-modal {
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.pdf-viewer-head,
.pdf-viewer-toolbar {
  flex: 0 0 auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

.pdf-page-shell {
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-studio-report-frame {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
  }

  .pdf-viewer-toolbar {
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
}

/* Runtime 260 final cascade: stable PDF Studio + report preview layout */
.pdf-viewer-backdrop {
  align-items: center !important;
  overflow: auto !important;
}

.pdf-viewer-modal {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  width: min(1220px, calc(100vw - 20px)) !important;
  max-height: calc(100dvh - 20px) !important;
  overflow: hidden !important;
}

.pdf-viewer-body {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px) !important;
  gap: 10px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.pdf-viewer-body.pdf-viewer-body-full,
.pdf-viewer-body-full {
  grid-template-columns: minmax(0, 1fr) !important;
}

.pdf-page-shell {
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-edit-panel,
.pdf-sign-panel {
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-page-stage {
  position: relative !important;
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
}

.pdf-page-canvas {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
}

.pdf-annotation-layer {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
}

.pdf-text-box {
  pointer-events: auto !important;
  overflow: auto !important;
  line-height: 1.25 !important;
}

.pdf-studio-report-frame {
  display: block !important;
  width: 100% !important;
  min-height: calc(100dvh - 190px) !important;
  border: 0 !important;
  background: #fff !important;
  box-shadow: 0 4px 16px rgba(16, 24, 40, 0.22) !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: calc(100vw - 10px) !important;
    max-height: calc(100dvh - 10px) !important;
  }

  .pdf-viewer-body {
    grid-template-columns: 1fr !important;
    overflow: auto !important;
  }
}

/* Runtime 225: HireOps-built Project Manager resource timeline */
.project-timeline-panel {
  display: grid;
  gap: 10px;
  overflow: hidden;
}

.project-timeline-toolbar,
.project-timeline-add {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(150px, 0.75fr) minmax(140px, 0.65fr) auto;
  gap: 8px;
  align-items: end;
}

.project-timeline-toolbar {
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 0.8fr) minmax(180px, 0.7fr) auto;
}

.project-timeline-add {
  grid-template-columns: minmax(190px, 1.1fr) minmax(220px, 1.2fr) minmax(120px, 0.6fr) minmax(120px, 0.6fr) repeat(4, minmax(112px, 0.55fr)) minmax(150px, 0.7fr) auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.project-timeline-row-add {
  grid-template-columns: minmax(220px, 340px) auto;
  justify-content: start;
}

.project-timeline-plus-button {
  min-width: 74px;
}

.project-timeline-calendar {
  min-height: 540px;
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: #fff;
}

.project-timeline-selfbuilt {
  min-width: 1040px;
  color: var(--ink);
}

.project-timeline-kpis {
  position: sticky;
  left: 0;
  z-index: 5;
  display: grid;
  grid-template-columns: 260px minmax(760px, 1fr);
  align-items: stretch;
  border-bottom: 1px solid var(--line-strong);
  background: #f5f8fb;
}

.project-timeline-kpi-title {
  display: flex;
  align-items: center;
  padding: 8px;
  border-right: 1px solid var(--line-strong);
  font-weight: 900;
}

.project-timeline-kpi-scroll {
  display: grid;
  grid-template-columns: repeat(var(--timeline-days), minmax(var(--timeline-day-width, 96px), 1fr));
}

.project-timeline-kpi-card {
  display: grid;
  gap: 1px;
  min-height: 54px;
  padding: 6px 5px;
  border-right: 1px solid var(--line);
  text-align: center;
}

.project-timeline-kpi-card span,
.project-timeline-kpi-card small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-timeline-kpi-card b {
  font-size: 18px;
}

.project-timeline-grid-head,
.project-timeline-row {
  display: grid;
  grid-template-columns: 260px minmax(760px, 1fr);
}

.project-timeline-grid-head {
  position: sticky;
  top: 0;
  z-index: 4;
  border-bottom: 1px solid var(--line-strong);
  background: #e5ebf1;
}

.project-timeline-resource-head {
  display: flex;
  align-items: center;
  padding: 8px;
  border-right: 1px solid var(--line-strong);
  font-weight: 800;
}

.project-timeline-date-head,
.project-timeline-days {
  display: grid;
  grid-template-columns: repeat(var(--timeline-days), minmax(var(--timeline-day-width, 96px), 1fr));
}

.project-timeline-date-head > div {
  display: grid;
  gap: 2px;
  min-height: 54px;
  padding: 6px 4px;
  border-right: 1px solid var(--line);
  text-align: center;
  font-size: 11px;
  font-weight: 700;
}

.project-timeline-date-head b {
  color: var(--blue);
  font-size: 10px;
}

.project-timeline-time-scale {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}

.project-timeline-time-scale span {
  min-width: 0;
  overflow: hidden;
  text-overflow: clip;
}

.project-timeline-grid-body {
  display: grid;
}

.project-timeline-group-row {
  position: sticky;
  left: 0;
  z-index: 3;
  padding: 7px 10px;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  background: #d8e0e8;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.project-timeline-resource-cell {
  display: grid;
  align-content: center;
  min-height: calc((var(--timeline-levels, 1) * 54px) + 12px);
  padding: 7px 8px;
  border-right: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line);
  background: #f7f9fb;
  font-size: 12px;
}

.project-timeline-resource-title {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.project-timeline-resource-title .strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-timeline-row-actions {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  align-items: center;
}

.project-timeline-remove-row,
.project-timeline-more-row,
.project-timeline-copy-row {
  flex: 0 0 auto;
  padding: 2px 7px;
  font-size: 11px;
}

.project-timeline-days {
  position: relative;
  grid-template-rows: repeat(var(--timeline-levels, 1), 54px);
  min-height: calc((var(--timeline-levels, 1) * 54px) + 12px);
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
}

.project-timeline-cell {
  grid-row: 1 / -1;
  display: block;
  width: 100%;
  min-height: 54px;
  padding: 0;
  border: 0;
  border-right: 1px solid var(--line);
  background:
    linear-gradient(90deg, transparent 0, transparent calc(25% - 1px), rgba(125, 144, 163, 0.22) calc(25% - 1px), rgba(125, 144, 163, 0.22) 25%, transparent 25%, transparent calc(50% - 1px), rgba(125, 144, 163, 0.22) calc(50% - 1px), rgba(125, 144, 163, 0.22) 50%, transparent 50%, transparent calc(75% - 1px), rgba(125, 144, 163, 0.22) calc(75% - 1px), rgba(125, 144, 163, 0.22) 75%, transparent 75%),
    #fff;
  cursor: crosshair;
  appearance: none;
  font: inherit;
}

.project-timeline-cell:nth-child(even) {
  background:
    linear-gradient(90deg, transparent 0, transparent calc(25% - 1px), rgba(125, 144, 163, 0.2) calc(25% - 1px), rgba(125, 144, 163, 0.2) 25%, transparent 25%, transparent calc(50% - 1px), rgba(125, 144, 163, 0.2) calc(50% - 1px), rgba(125, 144, 163, 0.2) 50%, transparent 50%, transparent calc(75% - 1px), rgba(125, 144, 163, 0.2) calc(75% - 1px), rgba(125, 144, 163, 0.2) 75%, transparent 75%),
    #f8fafc;
}

.project-timeline-cell.is-drop-target {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
  background: #e3f0fb;
}

.project-timeline-cell:hover,
.project-timeline-cell:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
  background: #eaf4ff;
}

.project-timeline-event {
  position: absolute;
  left: var(--timeline-event-left, 0);
  top: var(--timeline-event-top, 5px);
  width: max(var(--timeline-event-width, 1%), 18px);
  height: 48px;
  display: flex;
  align-items: stretch;
  z-index: 2;
  min-width: 0;
  margin: 0 2px;
  border: 1px solid #8594a3;
  border-radius: 4px;
  box-shadow: var(--shadow);
  cursor: grab;
}

.project-timeline-event.is-dragging {
  opacity: 0.65;
}

.project-timeline-event.is-resizing {
  opacity: 0.72;
  outline: 2px solid var(--blue);
  outline-offset: 1px;
}

.project-timeline-event.has-custom-color {
  background: var(--timeline-event-color) !important;
  border-color: var(--timeline-event-border) !important;
  color: var(--timeline-event-text) !important;
}

.project-timeline-resize-handle {
  flex: 0 0 22px;
  min-height: 100%;
  cursor: ew-resize;
  opacity: 0.9;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0.12));
  touch-action: none;
  user-select: none;
}

.project-timeline-resize-left {
  border-right: 1px solid rgba(0, 0, 0, 0.22);
}

.project-timeline-resize-right {
  border-left: 1px solid rgba(0, 0, 0, 0.22);
}

.project-timeline-event:hover .project-timeline-resize-handle {
  opacity: 1;
  background: rgba(255, 255, 255, 0.36);
}

.project-timeline-resizing,
.project-timeline-resizing * {
  cursor: ew-resize !important;
  user-select: none !important;
}

.project-timeline-event-link {
  display: grid;
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  min-height: 44px;
  gap: 2px;
  padding: 5px 7px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: 1.15;
  text-align: left;
  cursor: pointer;
}

.project-timeline-event-link b,
.project-timeline-event-link span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-timeline-event-link b {
  font-size: 12px;
  line-height: 1.15;
}

.project-timeline-event-link span {
  font-size: 10.5px;
  line-height: 1.15;
}

.timeline-status-planned {
  background: #e7edf3 !important;
  border-color: #8594a3 !important;
  color: #17212a !important;
}

.timeline-status-provisional {
  background: #1f5f9a !important;
  border-color: #17446e !important;
  color: #fff08a !important;
}

.timeline-status-confirmed {
  background: #3f8f4b !important;
  border-color: #276230 !important;
  color: #061408 !important;
}

.timeline-status-active {
  background: #7a1717 !important;
  border-color: #4b0d0d !important;
  color: #ffd2d2 !important;
}

.timeline-status-completed {
  background: #174f27 !important;
  border-color: #0d3318 !important;
  color: #bff1c9 !important;
}

.timeline-status-cancelled {
  background: #111 !important;
  border-color: #000 !important;
  color: #fff !important;
}

.timeline-status-conflict,
.timeline-event-conflict {
  background: #a2382f !important;
  border-color: #6f1f19 !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 2px #ffd257;
}

.timeline-conflicts {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid #c7773b;
  border-radius: var(--radius);
  background: #fff1dc;
}

.project-timeline-task-modal {
  width: min(780px, calc(100vw - 24px));
}

.project-timeline-task-modal textarea {
  min-height: 120px;
  resize: vertical;
}

.crew-transport-toggle {
  margin-top: 4px;
}

@media (max-width: 980px) {
  .project-timeline-toolbar,
  .project-timeline-add {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .project-timeline-toolbar .actions,
  .project-timeline-add .actions {
    grid-column: 1 / -1;
  }

  .project-timeline-calendar {
    min-height: 460px;
    overflow: auto;
  }

  .project-timeline-grid-head,
  .project-timeline-row {
    grid-template-columns: 190px minmax(760px, 1fr);
  }

  .project-timeline-kpis {
    grid-template-columns: 190px minmax(760px, 1fr);
  }
}

/* Runtime 203: Users admin workspace */
.admin-users-workspace {
  display: grid;
  grid-template-columns: minmax(340px, 0.9fr) minmax(420px, 1.1fr);
  gap: 14px;
  align-items: start;
}

.admin-users-left,
.admin-users-right {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.admin-users-directory .table-wrap {
  max-height: 520px;
  overflow: auto;
}

.admin-users-directory > label {
  margin-top: 12px;
}

.admin-add-user-block {
  margin: 0 0 12px;
}

.admin-add-user-block > .report-studio-details {
  background: var(--panel-soft);
}

.admin-users-directory,
.setup-panel {
  display: grid;
  gap: 12px;
}

.admin-users-directory > label,
.setup-panel > .report-studio-details {
  margin-top: 0;
}

.admin-user-inline-editor {
  border-top: 1px solid var(--border);
  padding-top: 10px;
}

.admin-user-inline-editor .admin-user-editor {
  position: static;
  border: 0;
  box-shadow: none;
  padding: 0;
}

.admin-user-editor {
  position: sticky;
  top: 12px;
}

.admin-user-editor .report-studio-details {
  margin-top: 10px;
}

.admin-user-editor .permission-matrix-wrap,
.admin-user-editor .table-wrap {
  max-height: 420px;
  overflow: auto;
}

.admin-user-identity-grid {
  align-items: start;
}

.admin-user-editor .checkbox-grid {
  max-height: 360px;
  overflow: auto;
}

.company-admin-list {
  display: grid;
  gap: 12px;
}

.company-admin-card {
  display: grid;
  gap: 10px;
}

.company-admin-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: start;
}

.company-admin-grid h4 {
  margin: 0 0 8px;
  font-size: 0.85rem;
}

.company-admin-grid .card-list {
  gap: 6px;
}

.company-admin-grid input,
.company-admin-grid select,
.company-admin-grid textarea {
  width: 100%;
}

.branch-stationery-details {
  margin-top: 8px;
}

.branch-stationery-details .card-list {
  margin-top: 8px;
}

.stationery-logo-preview {
  display: grid;
  place-items: center;
  min-height: 86px;
  padding: 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--muted);
  font-size: 0.86rem;
  text-align: center;
}

.stationery-logo-preview img {
  display: block;
  max-width: 100%;
  max-height: 76px;
  object-fit: contain;
}

.stationery-logo-preview.empty {
  background: var(--surface-2);
  border-style: dashed;
}

.structured-address-fieldset {
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.structured-address-fieldset legend {
  padding: 0 6px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.branch-setup-card {
  display: grid;
  gap: 8px;
}

.branch-department-picker {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin-top: 8px;
  padding: 10px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.branch-department-label {
  display: grid;
  gap: 8px;
  align-content: start;
}

.branch-all-departments {
  width: 100%;
  min-height: 30px;
  margin: 0;
}

.branch-department-grid.checkbox-grid {
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  max-height: 260px;
  margin-top: 0;
  padding: 8px;
  background: var(--surface);
}

.branch-department-grid .checkbox-tile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 34px;
  padding: 5px 6px;
  align-items: center;
}

.branch-department-grid .checkbox-tile span {
  overflow-wrap: anywhere;
}

.company-prefix-details {
  margin-top: 10px;
}

.company-prefix-list {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.company-prefix-row {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) minmax(90px, 0.8fr) 70px 95px auto;
  gap: 6px;
  align-items: center;
  padding: 8px;
}

.company-prefix-row input,
.company-prefix-row select {
  min-width: 0;
}

@media (max-width: 1100px) {
  .admin-users-workspace {
    grid-template-columns: 1fr;
  }

  .admin-user-editor {
    position: static;
  }

  .company-admin-grid {
    grid-template-columns: 1fr;
  }

  .branch-department-picker {
    grid-template-columns: 1fr;
  }

  .company-prefix-row {
    grid-template-columns: 1fr;
  }
}

/* Runtime 203: APK Messenger final layout */
@media (max-width: 720px) {
  body[data-view="whatsapp"].hireops-apk {
    height: 100dvh !important;
    min-height: 100dvh !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .content {
    padding: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-sidebar,
  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout.is-thread-list .whatsapp-sidebar {
    display: grid !important;
    grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout.is-thread-list .whatsapp-chat-panel,
  body[data-view="whatsapp"].hireops-apk .whatsapp-layout.is-chat-open .whatsapp-sidebar {
    display: none !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout.is-chat-open .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-sidebar > .panel-head,
  body[data-view="whatsapp"].hireops-apk .whatsapp-sidebar > label,
  body[data-view="whatsapp"].hireops-apk .messenger-online-strip {
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 0 !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-contact-list,
  body[data-view="whatsapp"].hireops-apk .whatsapp-thread-list {
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 8px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 6px !important;
    align-items: center !important;
    padding: 7px 8px !important;
    min-height: 52px !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head h3 {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-back-button {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-chat-title-main {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-chat-title-text,
  body[data-view="whatsapp"].hireops-apk .messenger-chat-subtitle {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head .actions {
    flex-wrap: nowrap !important;
    gap: 4px !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-chat-participants,
  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head .danger-button {
    display: none !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-messages {
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 10px 8px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-message-row {
    max-width: 92% !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-message.is-own .whatsapp-message-row {
    margin-left: auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-message-bubble {
    max-width: min(82vw, 360px) !important;
    overflow-wrap: anywhere !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-attachment-image {
    max-width: min(72vw, 260px) !important;
    height: auto !important;
  }

  body[data-view="whatsapp"].hireops-apk audio {
    width: min(72vw, 260px) !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose {
    display: grid !important;
    grid-template-columns: 40px 40px minmax(0, 1fr) 40px 44px !important;
    gap: 5px !important;
    align-items: end !important;
    padding: 7px 7px calc(7px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 0 !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-attachment-controls {
    display: contents !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose textarea {
    grid-column: 3 !important;
    min-width: 0 !important;
    min-height: 40px !important;
    max-height: 104px !important;
    resize: none !important;
    font-size: 15px !important;
    line-height: 20px !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose .messenger-icon-button,
  body[data-view="whatsapp"].hireops-apk .whatsapp-compose .messenger-send-button {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose .messenger-send-button {
    grid-column: 5 !important;
    width: 44px !important;
    min-width: 44px !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-send-label,
  body[data-view="whatsapp"].hireops-apk .messenger-quick-emoji {
    display: none !important;
  }
}

/* Runtime 198 final cascade: QR equipment commit list and Messenger hit-target/layout fix */
.qr-equipment-list-box {
  display: grid !important;
  gap: 6px !important;
  margin-top: 8px !important;
  min-height: 44px !important;
  padding: 8px !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--surface-soft) !important;
}

.qr-equipment-list-item {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 4px 8px !important;
  align-items: center !important;
  padding: 7px 8px !important;
  border: 1px solid var(--border) !important;
  border-radius: 7px !important;
  background: var(--surface) !important;
}

.qr-equipment-list-item .muted {
  grid-column: 1 !important;
  overflow-wrap: anywhere !important;
}

.qr-equipment-list-item .qr-icon-button {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
}

.qr-transport-trip-list-box {
  display: grid !important;
  gap: 8px !important;
  margin-top: 10px !important;
  min-height: 48px !important;
  padding: 8px !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--surface-soft) !important;
}

.qr-transport-trip-item {
  display: grid !important;
  grid-template-columns: minmax(120px, 160px) minmax(96px, 120px) minmax(160px, 1fr) minmax(220px, 1.4fr) auto !important;
  gap: 8px !important;
  align-items: end !important;
  padding: 8px !important;
  border: 1px solid var(--border) !important;
  border-radius: 7px !important;
  background: var(--surface) !important;
}

.stock-take-round-actions {
  align-items: center !important;
  gap: 8px !important;
}

.stock-take-round-control {
  display: inline-flex !important;
  gap: 4px !important;
  align-items: center !important;
}

@media (max-width: 720px) {
  .qr-transport-trip-item {
    grid-template-columns: 1fr auto !important;
  }

  .qr-transport-trip-item label {
    grid-column: 1 !important;
  }

  .qr-transport-trip-item .qr-icon-button {
    grid-column: 2 !important;
    grid-row: 1 / span 4 !important;
  }
}

.messenger-icon-button,
.messenger-online-user,
.whatsapp-thread-main,
.messenger-send-button {
  position: relative !important;
  z-index: 2 !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-sidebar {
  pointer-events: auto !important;
  z-index: 3 !important;
}

body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-chat-panel {
  pointer-events: none !important;
}

body[data-view="whatsapp"] .whatsapp-layout.is-chat-open .whatsapp-chat-panel {
  pointer-events: auto !important;
  z-index: 4 !important;
}

@media (max-width: 720px) {
  body[data-view="whatsapp"] .whatsapp-layout {
    display: grid !important;
    grid-template-columns: 100% !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-sidebar {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    transform: none !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-thread-list .whatsapp-chat-panel {
    display: none !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-chat-open .whatsapp-sidebar {
    display: none !important;
  }

  body[data-view="whatsapp"] .whatsapp-layout.is-chat-open .whatsapp-chat-panel {
    display: grid !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
  }
}

/* Runtime 192: stable APK Messenger layout and touch targets */
@media (max-width: 720px) {
  body[data-view="whatsapp"].hireops-apk,
  body[data-view="whatsapp"].hireops-apk .layout,
  body[data-view="whatsapp"].hireops-apk .content,
  body[data-view="whatsapp"].hireops-apk .whatsapp-layout {
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-messages {
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose {
    display: grid !important;
    grid-template-columns: 42px 42px minmax(0, 1fr) 42px 42px !important;
    gap: 5px !important;
    align-items: center !important;
    padding: 6px 7px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-attachment-controls {
    display: grid !important;
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    grid-template-columns: 42px 42px !important;
    gap: 5px !important;
    align-items: center !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose textarea {
    grid-column: 3 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-attachment-controls [data-whatsapp-pick-file] {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body[data-view="whatsapp"].hireops-apk .messenger-attachment-controls [data-whatsapp-open-camera] {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  body[data-view="whatsapp"].hireops-apk [data-whatsapp-start-recording] {
    grid-column: 4 !important;
    grid-row: 1 !important;
  }

  body[data-view="whatsapp"].hireops-apk [data-whatsapp-send] {
    grid-column: 5 !important;
    grid-row: 1 !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-compose .messenger-icon-button,
  body[data-view="whatsapp"].hireops-apk .whatsapp-compose .messenger-send-button {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-recording-controls {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }
}

.equipment-scan-dialog-modal {
  max-width: min(560px, calc(100vw - 18px)) !important;
}

.scan-dialog-detail {
  display: grid;
  grid-template-columns: minmax(88px, auto) minmax(0, 1fr);
  gap: 8px 12px;
  margin: 12px 0;
}

.scan-dialog-code {
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-weight: 900;
  overflow-wrap: anywhere;
}

/* Runtime 173: APK equipment lists use visible, stacked mobile rows */
@media (max-width: 720px) {
  body.hireops-apk:not([data-view="whatsapp"]),
  body.hireops-apk:not([data-view="whatsapp"]) .layout,
  body.hireops-apk:not([data-view="whatsapp"]) .content {
    height: auto !important;
    min-height: 0 !important;
    overflow-y: visible !important;
  }

  body.hireops-apk .equipment-list-window-backdrop {
    align-items: stretch !important;
    padding: 6px !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.hireops-apk .equipment-list-window-modal {
    display: block !important;
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
    height: auto !important;
    min-height: calc(100dvh - 12px) !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    padding: 8px !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-list-panel,
  body.hireops-apk .equipment-list-window-modal .pop-stock-window {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.hireops-apk .equipment-list-window-modal .panel-head,
  body.hireops-apk .equipment-list-workspace .panel-head {
    align-items: stretch !important;
    gap: 6px !important;
  }

  body.hireops-apk .equipment-list-window-modal .panel-head h3,
  body.hireops-apk .equipment-list-workspace .panel-head h3,
  body.hireops-apk .equipment-list-window-modal .panel-head .muted,
  body.hireops-apk .equipment-list-workspace .panel-head .muted {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-list-edit,
  body.hireops-apk .equipment-list-window-modal .pop-stock-toolbar,
  body.hireops-apk .equipment-list-workspace .equipment-list-edit {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid,
  body.hireops-apk .equipment-list-window-modal .equipment-lines-wrap,
  body.hireops-apk .equipment-list-workspace > .equipment-lines-wrap {
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid table,
  body.hireops-apk .equipment-list-window-modal .pop-stock-grid thead,
  body.hireops-apk .equipment-list-window-modal .pop-stock-grid tbody,
  body.hireops-apk .equipment-list-window-modal .pop-stock-grid tr,
  body.hireops-apk .equipment-list-window-modal .pop-stock-grid td,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap table,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap tbody,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap tr,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap td {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid thead,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap thead {
    display: none !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid tr,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap tr {
    display: grid !important;
    gap: 5px !important;
    margin: 0 0 9px !important;
    padding: 8px !important;
    border: 1px solid var(--line-strong) !important;
    border-radius: 7px !important;
    background: var(--surface) !important;
    overflow: visible !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid td,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap td {
    display: grid !important;
    grid-template-columns: minmax(74px, 30%) minmax(0, 1fr) !important;
    gap: 6px !important;
    align-items: start !important;
    padding: 3px 0 !important;
    border-bottom: 0 !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  body.hireops-apk .equipment-list-window-modal .pop-stock-grid td::before,
  body.hireops-apk .equipment-list-workspace .equipment-lines-wrap td::before {
    content: attr(data-label) !important;
    display: block !important;
    min-width: 0 !important;
    color: var(--muted) !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
  }

  body.hireops-apk .equipment-list-workspace .equipment-item-cell,
  body.hireops-apk .equipment-list-workspace .qty-scan-cell,
  body.hireops-apk .equipment-list-workspace .status,
  body.hireops-apk .equipment-list-workspace .nowrap-value {
    display: flex !important;
    flex-wrap: wrap !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  body.hireops-apk .equipment-list-workspace input,
  body.hireops-apk .equipment-list-workspace select,
  body.hireops-apk .equipment-list-window-modal input,
  body.hireops-apk .equipment-list-window-modal select,
  body.hireops-apk .equipment-list-window-modal button,
  body.hireops-apk .equipment-list-workspace button {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-paste-actions,
  body.hireops-apk .equipment-list-workspace .equipment-paste-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 6px !important;
    overflow: visible !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-paste-actions > .equipment-toolbar-menu,
  body.hireops-apk .equipment-list-workspace .equipment-paste-actions > .equipment-toolbar-menu {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-paste-actions > .equipment-toolbar-menu .report-menu-trigger,
  body.hireops-apk .equipment-list-workspace .equipment-paste-actions > .equipment-toolbar-menu .report-menu-trigger {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    padding: 6px 4px !important;
  }

  body.hireops-apk .equipment-list-window-modal .equipment-paste-actions > button,
  body.hireops-apk .equipment-list-workspace .equipment-paste-actions > button,
  body.hireops-apk .equipment-list-window-modal .equipment-paste-actions > .muted,
  body.hireops-apk .equipment-list-workspace .equipment-paste-actions > .muted {
    grid-column: 1 / -1 !important;
  }

  body.hireops-apk .pop-stock-category-menu {
    width: 100% !important;
  }

  body.hireops-apk .pop-stock-category-trigger {
    width: calc(100% - 20px) !important;
    justify-content: space-between !important;
  }

  body.hireops-apk .pop-stock-category-menu .pop-stock-categories {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 0 10px 8px !important;
    overflow: visible !important;
  }

  body.hireops-apk .pop-stock-category-menu .pop-category {
    width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
  }
}

/* Runtime 165: APK Messenger fits the visible page, with only the chat list scrolling */
@media (max-width: 720px) {
  body[data-view="whatsapp"].hireops-apk {
    height: 100dvh !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .layout {
    height: calc(100dvh - (118px + env(safe-area-inset-top, 0px))) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
    align-items: stretch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-sidebar,
  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head,
  body[data-view="whatsapp"].hireops-apk .whatsapp-compose {
    min-height: 0 !important;
    flex: 0 0 auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-messages {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-contact-list,
  body[data-view="whatsapp"].hireops-apk .whatsapp-thread-list {
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* Runtime 388 true final cascade: PDF Studio and scan warnings must sit above nested popups */
.pdf-viewer-backdrop {
  z-index: 10100 !important;
}

.pdf-viewer-modal {
  z-index: 10101 !important;
}

.equipment-scan-dialog-backdrop,
.stock-take-offline-overlay,
.scanner-inline-popup {
  z-index: 10110 !important;
}

/* Runtime 388 final cascade: critical PDF/scanner overlays sit above every editor popup */
.pdf-viewer-backdrop {
  z-index: 10100 !important;
}

.pdf-viewer-modal {
  z-index: 10101 !important;
}

.stock-take-offline-overlay,
.equipment-scan-dialog-backdrop,
.scanner-inline-popup {
  z-index: 10110 !important;
}

/* Runtime 269 actual final cascade: full PDF Studio workspace for reports, PDFs and documents */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pdf-viewer-modal {
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.pdf-viewer-head,
.pdf-viewer-toolbar {
  flex: 0 0 auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

.pdf-page-shell {
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-studio-report-frame {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
  }

  .pdf-viewer-toolbar {
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
}

/* Runtime 269 final cascade: full PDF Studio workspace for reports, PDFs and documents */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pdf-viewer-modal {
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.pdf-viewer-head,
.pdf-viewer-toolbar {
  flex: 0 0 auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

.pdf-page-shell {
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-studio-report-frame {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
  }

  .pdf-viewer-toolbar {
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
}

/* Runtime 269 final cascade: full PDF Studio workspace for reports, PDFs and documents */
.pdf-viewer-backdrop {
  align-items: stretch !important;
  justify-content: stretch !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pdf-viewer-modal {
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.pdf-viewer-head,
.pdf-viewer-toolbar {
  flex: 0 0 auto !important;
}

.pdf-viewer-body {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}

.pdf-page-shell {
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  overflow: auto !important;
}

.pdf-studio-report-frame {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}

@media (max-width: 760px) {
  .pdf-viewer-modal {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
  }

  .pdf-viewer-toolbar {
    overflow-x: auto !important;
    white-space: nowrap !important;
  }
}

/* Runtime 164 final cascade: keep APK search beside hamburger and selector menu equal width */
@media (max-width: 720px) {
  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control {
    position: absolute !important;
    top: calc(39px + env(safe-area-inset-top, 0px)) !important;
    left: 38px !important;
    right: 2px !important;
    z-index: calc(var(--apk-header-z, 780) + 28) !important;
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    margin: 0 !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control #searchInput {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 12px !important;
    line-height: 18px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    grid-template-columns: minmax(0, 1fr) !important;
    left: 6px !important;
    right: 6px !important;
    top: calc(76px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-row: 3 !important;
  }

  body.hireops-apk.apk-scope-menu-open .topbar {
    padding-bottom: 144px !important;
  }
}

/* Runtime 164: APK search lives in the header beside the hamburger, selectors stay equal length */
@media (max-width: 720px) {
  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control {
    position: absolute !important;
    top: calc(39px + env(safe-area-inset-top, 0px)) !important;
    left: 38px !important;
    right: 2px !important;
    z-index: calc(var(--apk-header-z, 780) + 28) !important;
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    margin: 0 !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control #searchInput {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 12px !important;
    line-height: 18px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    grid-template-columns: minmax(0, 1fr) !important;
    left: 6px !important;
    right: 6px !important;
    top: calc(76px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-row: 3 !important;
  }

  body.hireops-apk.apk-scope-menu-open .topbar {
    padding-bottom: 144px !important;
  }
}

/* Runtime 162: APK stacked selectors and persistent header search */
@media (max-width: 720px) {
  body.hireops-apk .global-controls {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 5px !important;
  }

  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-search-control {
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-company-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-branch-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-department-control,
  body.hireops-apk:not(.apk-scope-menu-open) .global-controls .scope-warehouse-control {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    grid-template-columns: 1fr !important;
    top: calc(76px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk.apk-scope-menu-open .topbar {
    padding-bottom: 176px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-search-control {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-row: 3 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-search-control {
    grid-row: 4 !important;
  }

  body.hireops-apk .global-controls select,
  body.hireops-apk .global-controls input {
    width: 100% !important;
    min-width: 0 !important;
  }
}

  /* Runtime 163: force APK header search visible over older high-specificity rules */
  @media (max-width: 720px) {
    body.hireops-apk:not(.apk-scope-menu-open) .global-controls #apkHeaderSearchControl,
    body.hireops-apk:not(.apk-scope-menu-open) .global-controls label#apkHeaderSearchControl.scope-search-control {
      position: static !important;
      display: grid !important;
      width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk:not(.apk-scope-menu-open) #apkHeaderSearchControl #searchInput {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* Runtime 160: APK hamburger stays directly under the logo */
@media (max-width: 720px) {
  body.hireops-apk .brand {
    position: relative !important;
  }

  body.hireops-apk .brand > .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk:not(.main-menu-collapsed) .brand > .main-menu-toggle.apk-header-menu-toggle,
  body.hireops-apk.main-menu-collapsed .brand > .main-menu-toggle.apk-header-menu-toggle {
    position: absolute !important;
    top: calc(39px + env(safe-area-inset-top, 0px)) !important;
    left: 2px !important;
    z-index: calc(var(--apk-header-z, 780) + 30) !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }

  body.hireops-apk .brand > .main-menu-toggle.apk-header-menu-toggle::before {
    font-size: 16px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-column: 2 !important;
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-search-control {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }
}

/* Runtime 164 final cascade: keep APK search beside hamburger and selector menu equal width */
@media (max-width: 720px) {
  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control {
    position: absolute !important;
    top: calc(39px + env(safe-area-inset-top, 0px)) !important;
    left: 38px !important;
    right: 2px !important;
    z-index: calc(var(--apk-header-z, 780) + 28) !important;
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    margin: 0 !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
  }

  body.hireops-apk .brand > #apkHeaderSearchControl.apk-header-search-control #searchInput {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 12px !important;
    line-height: 18px !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls {
    grid-template-columns: minmax(0, 1fr) !important;
    left: 6px !important;
    right: 6px !important;
    top: calc(76px + env(safe-area-inset-top, 0px)) !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control,
  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-company-control {
    grid-row: 1 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-branch-control {
    grid-row: 2 !important;
  }

  body.hireops-apk.apk-scope-menu-open .global-controls .scope-department-control {
    grid-row: 3 !important;
  }

  body.hireops-apk.apk-scope-menu-open .topbar {
    padding-bottom: 144px !important;
  }
}

/* Runtime 165 final cascade: APK Messenger fits the visible page */
@media (max-width: 720px) {
  body[data-view="whatsapp"].hireops-apk {
    height: 100dvh !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .layout {
    height: calc(100dvh - (118px + env(safe-area-inset-top, 0px))) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .content {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-layout {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
    align-items: stretch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-sidebar,
  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-chat-panel > .panel-head,
  body[data-view="whatsapp"].hireops-apk .whatsapp-compose {
    min-height: 0 !important;
    flex: 0 0 auto !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-messages {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body[data-view="whatsapp"].hireops-apk .whatsapp-contact-list,
  body[data-view="whatsapp"].hireops-apk .whatsapp-thread-list {
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }
}
@media (max-width: 720px) {
  body.hireops-apk {
    overscroll-behavior-y: contain;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    text-rendering: optimizeLegibility;
  }

  body.hireops-apk .content,
  body.hireops-apk .panel,
  body.hireops-apk .record-card,
  body.hireops-apk .notification-menu,
  body.hireops-apk .whatsapp-messages,
  body.hireops-apk .whatsapp-contact-list,
  body.hireops-apk .whatsapp-thread-list,
  body.hireops-apk .sidebar {
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
  }

  body.hireops-apk button,
  body.hireops-apk .solid-button,
  body.hireops-apk .ghost-button,
  body.hireops-apk .link-button,
  body.hireops-apk select,
  body.hireops-apk input,
  body.hireops-apk textarea {
    touch-action: manipulation;
  }

  body.hireops-apk button,
  body.hireops-apk .solid-button,
  body.hireops-apk .ghost-button {
    min-height: 42px;
  }

  body.hireops-apk .content {
    padding-bottom: max(22px, env(safe-area-inset-bottom));
  }

  body.hireops-apk .table-wrap table {
    contain: layout paint;
  }
}
/* Runtime 427: The Oracle and Stage Designer */
.oracle-panel {
  display: grid;
  gap: 14px;
}

.oracle-samples {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.oracle-samples button {
  text-align: left;
}

.oracle-answer {
  display: grid;
  gap: 12px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.oracle-conversation {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.oracle-turn {
  display: grid;
  gap: 4px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfe;
}

.oracle-turn p {
  margin: 0;
  color: var(--muted);
}

.oracle-source-row {
  cursor: pointer;
}

.oracle-source-row:hover,
.oracle-source-row:focus-visible {
  outline: 2px solid rgba(38, 103, 158, 0.28);
  outline-offset: -2px;
  background: #eef6fd;
}

.stage-designer-shell {
  display: grid;
  grid-template-columns: minmax(280px, 320px) minmax(0, 1fr) minmax(250px, 300px);
  gap: 12px;
  align-items: start;
}

.stage-toolbox,
.stage-properties,
.stage-canvas-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}

.stage-toolbox label,
.stage-properties label,
.stage-tool-tab-panel label {
  min-width: 0;
}

.stage-toolbox input,
.stage-toolbox select,
.stage-toolbox textarea,
.stage-properties input,
.stage-properties select,
.stage-properties textarea,
.stage-tool-tab-panel input,
.stage-tool-tab-panel select,
.stage-tool-tab-panel textarea {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.stage-toolbox button {
  width: 100%;
  justify-content: flex-start;
}

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

.stage-tool-tabs button {
  min-height: 32px;
  padding: 6px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  justify-content: center;
  overflow-wrap: anywhere;
}

.stage-tool-tabs button.is-active {
  border-color: #1f6aa5;
  background: #e8f2fb;
  color: #174f7a;
}

.stage-tool-tab-panel {
  display: grid;
  gap: 8px;
  min-height: 160px;
  overflow: hidden;
}

.stage-stock-search {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.stage-stock-status {
  display: grid;
  gap: 2px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfe;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.stage-stock-status span,
.stage-stock-status strong {
  display: block;
  font-weight: 600;
}

.stage-stock-status.is-error {
  border-color: #f2b8b5;
  background: #fff7f6;
  color: #9f1d1d;
}

.stage-stock-results {
  display: grid;
  gap: 6px;
  max-height: 260px;
  overflow: auto;
}

.stage-library-tree {
  display: grid;
  gap: 6px;
  max-height: 430px;
  overflow: auto;
}

.stage-library-tree details,
.stage-generic-library,
.stage-production-tools details {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.stage-library-tree summary,
.stage-generic-library summary,
.stage-production-tools summary {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 8px;
  font-weight: 700;
  cursor: pointer;
}

.stage-library-tree summary span {
  color: var(--muted);
  font-weight: 600;
}

.stage-library-category {
  margin: 0 6px 6px;
  background: #f8fbfe;
}

.stage-generic-library {
  display: grid;
  gap: 6px;
  padding-bottom: 6px;
}

.stage-generic-library button {
  margin: 0 6px;
  width: calc(100% - 12px);
}

.stage-stock-result {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  width: 100%;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  text-align: left;
}

.stage-stock-result small {
  display: block;
  color: var(--muted);
  font-size: 11px;
}

.stage-stock-result > span:not(.stage-stock-symbol) {
  min-width: 0;
}

.stage-stock-result strong,
.stage-stock-result small {
  overflow: hidden;
  text-overflow: ellipsis;
}

.stage-stock-symbol {
  width: 30px;
  height: 24px;
  border: 1px solid #17202a;
  border-radius: 4px;
  background: #50606f;
  box-shadow: 4px 4px 0 rgba(17, 24, 39, 0.18);
}

.stage-view-buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.stage-view-buttons .is-active,
.stage-viewport.is-active .stage-viewport-head {
  border-color: #f2c94c;
  box-shadow: 0 0 0 2px rgba(242, 201, 76, 0.28);
}

.stage-underlay-meta {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfe;
  overflow-wrap: anywhere;
}

.stage-underlay-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  font-size: 12px;
}

.stage-underlay-status span {
  color: var(--muted);
  text-align: right;
  overflow-wrap: anywhere;
}

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

.stage-quadrants.has-expanded {
  grid-template-columns: 1fr;
  grid-template-rows: minmax(520px, 1fr);
}

.stage-viewport {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #eef3f8;
  overflow: hidden;
}

.stage-viewport.is-hidden-by-expand {
  display: none;
}

.stage-viewport.is-expanded .stage-canvas-wrap {
  min-height: min(72vh, 760px);
  max-height: min(82vh, 900px);
}

.stage-quadrants.has-expanded .stage-viewport.is-expanded {
  min-height: min(82vh, 900px);
}

.stage-viewport-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: #ffffff;
  cursor: pointer;
  user-select: none;
}

.stage-canvas-wrap {
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: #dfe7f0;
  max-height: min(42vh, 460px);
  cursor: grab;
  overscroll-behavior: contain;
}

.stage-canvas-wrap.is-panning {
  cursor: grabbing;
}

.stage-canvas {
  position: relative;
  min-width: 600px;
  min-height: 360px;
  background-color: #f8fbfe;
  background-image: linear-gradient(#d9e1ea 1px, transparent 1px), linear-gradient(90deg, #d9e1ea 1px, transparent 1px);
}

.stage-underlay {
  position: absolute;
  z-index: 1;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

.stage-guides {
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  user-select: none;
}

.stage-guide {
  position: absolute;
  pointer-events: none;
}

.stage-guide-centre-x {
  top: 0;
  bottom: 0;
  width: 0;
  border-left: 2px solid #7c3aed;
}

.stage-guide-centre-y {
  left: 0;
  right: 0;
  height: 0;
  border-top: 2px solid #7c3aed;
}

.stage-guide-zero-height {
  left: 0;
  right: 0;
  height: 0;
  border-top: 3px solid #16a34a;
}

.stage-guide-upstage {
  left: 0;
  right: 0;
  height: 0;
  border-top: 3px solid #facc15;
}

.stage-guide-upstage-side {
  top: 0;
  bottom: 0;
  width: 0;
  border-left: 3px solid #facc15;
}

.stage-guide-label {
  position: absolute;
  z-index: 9;
  padding: 2px 5px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid var(--line);
  font-size: 11px;
  font-weight: 800;
}

.stage-guide-label-centre {
  color: #6d28d9;
}

.stage-guide-label-zero {
  color: #15803d;
}

.stage-guide-label-upstage {
  color: #a16207;
}

.stage-distance-tick {
  position: absolute;
  left: 0;
  right: 0;
  height: 0;
  border-top: 1px dashed rgba(250, 204, 21, 0.86);
}

.stage-distance-tick span {
  position: absolute;
  left: 8px;
  top: -9px;
  padding: 1px 4px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.82);
  color: #a16207;
  font-size: 10px;
  font-weight: 800;
}

.stage-distance-tick-side {
  top: 0;
  bottom: 0;
  right: auto;
  width: 0;
  border-top: 0;
  border-left: 1px dashed rgba(250, 204, 21, 0.86);
}

.stage-distance-tick-side span {
  left: 4px;
  top: 8px;
}

.stage-object {
  position: absolute;
  z-index: 20;
  display: grid;
  place-items: center;
  border: 1px solid #111827;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.1;
  overflow: hidden;
  cursor: move;
  touch-action: none;
  user-select: none;
  transform-origin: center center;
  isolation: isolate;
}

.stage-object.is-selected {
  outline: 3px solid #f2c94c;
  outline-offset: 2px;
}

.stage-selection-box {
  position: absolute;
  z-index: 30;
  border: 1px dashed #1f6aa5;
  background: rgba(31, 106, 165, 0.12);
  pointer-events: none;
}

.stage-cable-path {
  position: absolute;
  z-index: 12;
  height: 0;
  border-top: 4px solid #d97706;
  transform-origin: 0 50%;
  pointer-events: none;
  filter: drop-shadow(0 1px 1px rgba(17, 24, 39, 0.25));
}

.stage-cable-svg {
  position: absolute;
  inset: 0;
  z-index: 12;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  filter: drop-shadow(0 1px 1px rgba(17, 24, 39, 0.22));
}

.stage-cable-route {
  z-index: 11;
  opacity: 0.9;
}

.stage-cable-run {
  z-index: 12;
}

.stage-cable-draw-preview {
  z-index: 14;
}

.stage-dimension-line {
  position: absolute;
  z-index: 13;
  height: 0;
  border-top: 2px solid #0f766e;
  transform-origin: 0 50%;
  pointer-events: auto;
  cursor: move;
  appearance: none;
  padding: 0;
  background: transparent;
}

.stage-dimension-line::before,
.stage-dimension-line::after {
  content: "";
  position: absolute;
  top: -5px;
  width: 0;
  height: 10px;
  border-left: 2px solid var(--stage-dimension-colour, #0f766e);
}

.stage-dimension-line.is-selected {
  filter: drop-shadow(0 0 4px rgba(15, 118, 110, 0.45));
}

.stage-dimension-line::before {
  left: 0;
}

.stage-dimension-line::after {
  right: 0;
}

.stage-dimension-line span {
  position: absolute;
  left: 50%;
  top: -22px;
  transform: translateX(-50%);
  padding: 2px 5px;
  border-radius: 4px;
  background: #ecfdf5;
  color: var(--stage-dimension-colour, #0f766e);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.stage-speaker-coverage {
  position: absolute;
  z-index: 10;
  transform-origin: 50% 0;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg, rgba(45, 70, 98, 0.26), rgba(45, 70, 98, 0.04));
  border: 1px solid rgba(45, 70, 98, 0.34);
  pointer-events: none;
}

.stage-rigging-point {
  position: absolute;
  z-index: 24;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  transform: translate(-50%, -50%);
  border: 2px solid #111827;
  border-radius: 50%;
  background: #fff;
  color: #111827;
  font-size: 10px;
  font-weight: 900;
  cursor: grab;
}

.stage-rigging-chain {
  position: absolute;
  top: 0;
  z-index: 23;
  width: 0;
  border-left: 2px dashed #111827;
  pointer-events: none;
  transform: translateX(-50%);
}

.stage-rigging-point.is-overloaded {
  border-color: #b91c1c;
  background: #fee2e2;
  color: #991b1b;
}

.stage-object span {
  display: block;
  max-width: 100%;
  padding: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.stage-symbol-truss {
  background-image:
    linear-gradient(45deg, rgba(255,255,255,0.45) 0 8%, transparent 8% 18%, rgba(255,255,255,0.35) 18% 26%, transparent 26%),
    linear-gradient(135deg, rgba(0,0,0,0.22) 0 8%, transparent 8% 18%, rgba(0,0,0,0.18) 18% 26%, transparent 26%);
  background-size: 26px 26px;
}

.stage-symbol-led {
  background-image: repeating-linear-gradient(90deg, rgba(80, 180, 255, 0.34) 0 3px, transparent 3px 8px), linear-gradient(180deg, rgba(255,255,255,0.22), rgba(0,0,0,0.22));
}

.stage-symbol-speaker {
  background-image: radial-gradient(circle at 50% 35%, rgba(255,255,255,0.28) 0 18%, transparent 19%), radial-gradient(circle at 50% 72%, rgba(0,0,0,0.32) 0 24%, transparent 25%);
}

.stage-symbol-moving-light {
  background-image: radial-gradient(circle at 50% 50%, #f7d65b 0 24%, rgba(0,0,0,0.18) 25% 42%, transparent 43%);
}

.stage-symbol-container {
  background-image: repeating-linear-gradient(90deg, rgba(0,0,0,0.2) 0 2px, transparent 2px 12px);
}

.stage-symbol-draping {
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,0.28) 0 5px, rgba(0,0,0,0.18) 5px 10px);
}

.stage-symbol-car {
  border-radius: 45% 45% 25% 25%;
  background-image: linear-gradient(90deg, transparent 0 18%, rgba(255,255,255,0.35) 18% 36%, transparent 36% 64%, rgba(255,255,255,0.35) 64% 82%, transparent 82%);
}

.stage-production-tools {
  display: grid;
  gap: 8px;
  margin-top: 4px;
}

.stage-production-tools details {
  padding-bottom: 8px;
}

.stage-production-tools label,
.stage-production-tools .ghost-button {
  margin: 0 8px 6px;
}

.stage-mini-table {
  display: grid;
  gap: 6px;
  padding: 0 8px;
}

.stage-cable-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 0 8px;
}

.stage-cable-actions .ghost-button.is-active {
  border-color: #16a34a;
  background: #ecfdf5;
  color: #166534;
}

.stage-cable-route-list {
  display: grid;
  gap: 6px;
  padding: 0 8px 8px;
  border-bottom: 1px solid var(--line);
}

.stage-cable-route-list h4 {
  margin: 4px 0 0;
}

.stage-cable-route-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px 58px 52px 32px;
  gap: 5px;
  align-items: center;
  min-width: 0;
}

.stage-cable-route-row.is-active {
  padding: 4px;
  border: 1px solid #16a34a;
  border-radius: 6px;
  background: #ecfdf5;
}

.stage-mini-row,
.stage-cable-row,
.stage-dimension-row {
  display: grid;
  gap: 5px;
  align-items: center;
}

.stage-mini-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stage-mini-row.stage-patch-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stage-cable-row {
  grid-template-columns: minmax(0, 1fr);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.stage-cable-row small {
  display: block;
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  overflow-wrap: anywhere;
}

.stage-rigging-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.stage-dimension-list {
  display: grid;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.stage-dimension-list h4 {
  margin: 0;
}

.stage-dimension-row {
  grid-template-columns: minmax(0, 1fr) 46px repeat(2, minmax(0, 1fr));
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.stage-dimension-row.is-selected {
  border-color: #0f766e;
  background: #ecfdf5;
}

.stage-mini-row input,
.stage-mini-row select,
.stage-rigging-row input,
.stage-rigging-row select,
.stage-dimension-row input,
.stage-dimension-row select,
.stage-cable-row input,
.stage-cable-row select,
.stage-cable-route-row input,
.stage-cable-route-row select {
  min-width: 0;
  width: 100%;
}

.stage-mini-row .icon-button,
.stage-rigging-row .icon-button,
.stage-dimension-row .icon-button,
.stage-cable-route-row .icon-button {
  justify-self: end;
  width: 32px;
}

.stage-colour-control {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.stage-colour-control span {
  grid-column: 1 / -1;
}

.stage-colour-control input[type="color"] {
  width: 38px;
  min-width: 38px;
  height: 32px;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.stage-colour-control strong {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stage-colour-control.is-compact {
  grid-template-columns: 38px;
}

.stage-colour-control.is-compact strong {
  display: none;
}

.stage-power-summary {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfe;
}

.stage-power-summary div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.stage-power-summary span {
  color: var(--muted);
}

.stage-power-summary strong {
  white-space: nowrap;
}

.stage-object-info-list {
  display: grid;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  min-width: 0;
}

.stage-object-list-select {
  width: 100%;
  min-height: 126px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
}

.stage-object-visibility-list {
  display: grid;
  gap: 5px;
  max-height: 260px;
  overflow: auto;
}

.stage-object-visibility-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  padding: 6px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.stage-object-visibility-row.is-selected {
  border-color: #f2c94c;
  background: #fff9db;
}

.stage-object-visibility-row .link-button {
  min-width: 0;
  justify-self: stretch;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stage-object-visibility-row small {
  grid-column: 2;
  color: var(--muted);
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inline-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

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

.stage-visibility-grid h4 {
  grid-column: 1 / -1;
  margin: 8px 0 2px;
}

.stage-visibility-toggle {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.stage-visibility-toggle span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stage-visibility-toggle strong {
  font-size: 11px;
  color: var(--muted);
}

.stage-visibility-toggle.is-hidden {
  opacity: 0.68;
  background: #f3f4f6;
}

.stage-calculated-field input {
  background: #e5e7eb;
  color: #4b5563;
  cursor: not-allowed;
}

.stage-cable-row span,
.stage-calculator-result {
  color: var(--muted);
  font-size: 12px;
}

.stage-warning {
  margin: 6px 8px 0;
  color: #92400e;
  font-weight: 700;
}

.stage-calculator-result {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 0 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfe;
}

.stage-calculator-result strong {
  color: var(--ink);
}

@media (max-width: 1100px) {
  .stage-designer-shell {
    grid-template-columns: 1fr;
  }

  .stage-quadrants {
    grid-template-columns: 1fr;
  }

  .stage-cable-route-row {
    grid-template-columns: minmax(0, 1fr) 46px 58px 52px 32px;
  }

  .stage-cable-route-row .chip-button,
  .stage-cable-route-row .icon-button {
    min-height: 30px;
  }
}

/* Runtime 449: mobile web menu is an overlay, never a layout column. */
@media (max-width: 720px) {
  body:not(.hireops-apk) {
    overflow-x: hidden !important;
  }

  body:not(.hireops-apk) .layout,
  body:not(.hireops-apk).main-menu-collapsed .layout {
    display: block !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: auto !important;
    position: relative !important;
  }

  body:not(.hireops-apk) .content,
  body:not(.hireops-apk).main-menu-collapsed .content {
    display: block !important;
    grid-column: auto !important;
    grid-row: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    padding-left: var(--app-pad) !important;
    padding-right: var(--app-pad) !important;
  }

  body:not(.hireops-apk) .main-menu-toggle,
  body:not(.hireops-apk).main-menu-collapsed .main-menu-toggle {
    position: fixed !important;
    top: calc(var(--main-menu-top, 84px) + 6px) !important;
    left: 0 !important;
    z-index: 42 !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
    border: 1px solid var(--nav-border) !important;
    border-left: 0 !important;
    border-radius: 0 6px 6px 0 !important;
    writing-mode: horizontal-tb !important;
  }

  body:not(.hireops-apk) .sidebar,
  body:not(.hireops-apk).main-menu-collapsed .sidebar {
    grid-column: auto !important;
    grid-row: auto !important;
    position: fixed !important;
    top: var(--main-menu-top, 84px) !important;
    bottom: 0 !important;
    left: 0 !important;
    right: auto !important;
    z-index: 41 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    width: min(86vw, 320px) !important;
    min-width: 0 !important;
    max-width: min(86vw, 320px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 56px 10px 12px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    opacity: 1 !important;
    background: linear-gradient(var(--nav-start), var(--nav-end)) !important;
    border-right: 1px solid var(--nav-border) !important;
    border-bottom: 0 !important;
    box-shadow: 0 18px 32px rgba(20, 28, 35, 0.28) !important;
    transform: translateX(0) !important;
    transition: transform 160ms ease, opacity 120ms ease !important;
  }

  body:not(.hireops-apk).main-menu-collapsed .sidebar {
    pointer-events: none !important;
    opacity: 0 !important;
    transform: translateX(-105%) !important;
  }

  body:not(.hireops-apk) .sidebar .nav-button {
    width: 100% !important;
    text-align: left !important;
    white-space: normal !important;
  }
}