body.desktop-page {
  min-width: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 78% 0%, rgba(216, 163, 64, 0.16), transparent 34%),
    linear-gradient(135deg, #edf2f7 0%, #f6f2ea 48%, #e6edf5 100%);
}[hidden] {
  display: none !important;
}.desktop-app {
  --desktop-sidebar: 250px;
  --desktop-gap: 24px;
  min-height: 100vh;
  padding-left: var(--desktop-sidebar);
  overflow: visible;
  background: transparent;
}.desktop-app::before {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--desktop-sidebar);
  height: auto;
  background:
    linear-gradient(180deg, rgba(7, 18, 37, 0.94) 0%, rgba(8, 25, 55, 0.86) 34%, rgba(30, 48, 72, 0.7) 58%, rgba(214, 103, 18, 0.82) 100%),
    radial-gradient(circle at 20% 8%, rgba(255, 255, 255, 0.14), transparent 24%),
    var(--app-bg-photo) center / cover no-repeat;
  box-shadow: 18px 0 40px rgba(7, 18, 37, 0.16);
}.desktop-app .app-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  display: grid;
  width: var(--desktop-sidebar);
  height: 96px;
  grid-template-columns: 1fr;
  align-content: start;
  padding: 18px 18px 14px;
  border: 0;
  background: linear-gradient(180deg, rgba(6, 15, 31, 0.34), rgba(6, 15, 31, 0));
  backdrop-filter: none;
}.desktop-app .brand-row {
  gap: 10px;
}.desktop-app .brand-home-link {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}.desktop-app .brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 12px;
}.desktop-app .brand-row strong {
  color: rgba(255, 255, 255, 0.86);
  font-size: 16px;
}.desktop-app .brand-row span,
.desktop-app .account-card span {
  color: rgba(255, 255, 255, 0.52);
}.desktop-app .account-card {
  position: fixed;
  left: 14px;
  bottom: 18px;
  width: calc(var(--desktop-sidebar) - 28px);
  box-sizing: border-box;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 10px;
  border-color: rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}.desktop-app .account-card button {
  width: 100%;
  height: 34px;
  border-color: rgba(242, 199, 110, 0.5);
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.82);
}.desktop-app .main-tabs {
  position: fixed;
  top: 108px;
  bottom: 136px;
  left: 0;
  z-index: 9;
  display: grid;
  width: var(--desktop-sidebar);
  max-height: none;
  grid-template-columns: 1fr;
  align-content: start;
  gap: 8px;
  margin: 0;
  padding: 16px 14px 18px;
  overflow-y: auto;
  border: 0;
  background: transparent;
  transition: none;
}.desktop-app .main-tabs button {
  min-height: 50px;
  grid-template-columns: 34px 1fr;
  padding: 7px 9px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.72);
}.desktop-app .main-tabs button[hidden],
.desktop-app [data-page-jump][hidden],
.desktop-app [data-panel][hidden] {
  display: none !important;
}.desktop-app .main-tabs button.active {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.92);
  box-shadow: none;
}.desktop-app .main-tabs button.active .nav-icon {
  background: rgba(255, 255, 255, 0.2);
  color: #f2c76e;
}.desktop-app .main-tabs button.active > span:not(.nav-icon)::after {
  color: rgba(255, 255, 255, 0.46);
}.desktop-app .main-tabs .owner-report-menu {
  grid-column: auto;
}.desktop-app .main-tabs .owner-report-toggle {
  grid-template-columns: 34px minmax(0, 1fr) 14px;
  min-height: 50px;
}.desktop-app .main-tabs .owner-report-toggle i {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
  justify-self: end;
  margin-top: 12px;
}.desktop-app .main-tabs .owner-report-menu.expanded .owner-report-toggle {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.9);
}.desktop-app .main-tabs .owner-report-submenu {
  padding: 2px 0 2px 50px;
}.desktop-app .main-tabs .owner-report-submenu button {
  min-height: 32px;
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px !important;
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: 0;
  white-space: nowrap;
}.desktop-app .main-tabs .owner-report-submenu button:hover {
  background: transparent;
  color: rgba(255, 255, 255, 0.9);
}.desktop-app .page-title-strip .main-tabs-collapse {
  display: none;
}.desktop-app.nav-collapsed .main-tabs {
  max-height: none;
  margin: 0;
  padding: 16px 14px 18px;
  opacity: 1;
  pointer-events: auto;
}.desktop-app.nav-collapsed .page-stack {
  background: transparent;
}.desktop-app .page-stack {
  min-height: 100vh;
  padding: 14px var(--desktop-gap) var(--desktop-gap);
  overflow: visible;
  background: transparent;
  backdrop-filter: none;
}.desktop-app .page {
  overflow: visible;
}.desktop-app .page:not(.active) {
  display: none;
}.desktop-app .page.active {
  display: block;
}.desktop-app .page-title-strip {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 88px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin: 0 0 22px;
  padding: 16px 22px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: #ffffff;
  color: #101827;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.08);
}.desktop-app .page-title-strip::after {
  display: none;
}.desktop-app .page-title-strip p {
  margin: 0;
  color: #8c7a63;
  font-size: 10px;
  letter-spacing: 0.18em;
  text-shadow: none;
  text-transform: uppercase;
}.desktop-app .page-title-strip h1 {
  color: #101827;
  font-size: 22px;
  line-height: 1.1;
  text-shadow: none;
}.desktop-app .page-title-strip > p,
.desktop-app .page-title-strip > h1,
.desktop-app .page-title-strip > .title-search-row {
  position: relative;
  z-index: 1;
}.desktop-app .page-title-strip .title-search-row {
  display: grid;
  width: min(413px, 100%);
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  margin: 12px 0 0 auto;
}.desktop-app .page[data-panel="inventory"] .page-title-strip .title-search-row {
  width: min(880px, 100%);
  grid-template-columns: repeat(3, minmax(116px, 0.6fr)) minmax(220px, 1.4fr) auto auto;
}.desktop-app .page-title-strip .title-search-input,
.desktop-app .page-title-strip .title-filter-select {
  width: 100%;
  height: 42px;
  padding: 0 16px;
  border: 1px solid #cfd8e6;
  border-radius: 3px;
  background: #ffffff;
  color: #172033;
  font-size: 14px;
  font-weight: 800;
}.desktop-app .page-title-strip .title-filter-select {
  appearance: auto;
  cursor: pointer;
}.desktop-app .page-title-strip .title-search-input::placeholder {
  color: #8290a8;
  opacity: 1;
}.desktop-app .page-title-strip .title-search-row button {
  height: 42px;
  padding: 0 20px;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
  box-shadow: none;
}.desktop-app .page[data-panel="inventory"] .page-title-strip .title-search-row button {
  min-width: 92px;
}.desktop-app .page-title-strip .title-search-row .title-add-vehicle {
  border-color: #ff8a1c;
  background: #ff8a1c;
  color: #ffffff;
}body:not(.desktop-page) .page-title-strip .desktop-title-search {
  display: none;
}body.desktop-page .desktop-app .page > .mobile-search-card,
body.desktop-page .desktop-app .page > .inventory-mobile-search-card {
  display: none;
}body.desktop-page .desktop-app .page[data-panel="inventory"] > .full-action {
  display: none;
}body.desktop-page .desktop-app .page[data-panel="inventory"] > .inventory-mobile-primary-actions {
  display: none;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 14px;
  margin: 0 0 14px;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article {
  min-height: 88px;
  padding: 16px 18px;
  border-radius: 16px;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card strong {
  font-size: 26px;
}.desktop-app .metric-grid,
.desktop-app .status-summary,
.desktop-app .role-grid,
.desktop-app .info-grid,
.desktop-app .field-grid,
.desktop-app .choice-grid,
.desktop-app .sold-filter-grid,
.desktop-app .vehicle-list,
.desktop-app .sold-list,
.desktop-app .data-list,
.desktop-app .notice-list,
.desktop-app .person-list,
.desktop-app .permission-list,
.desktop-app .sale-sheet-grid {
  gap: 16px;
}.desktop-app .metric-grid,
.desktop-app .sold-metrics,
.desktop-app .compact-metrics,
.desktop-app .page[data-panel="ranking"] .metric-grid {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 14px;
}.desktop-app .metric-card,
.desktop-app .content-card,
.desktop-app .toolbar-card,
.desktop-app .filter-card,
.desktop-app .sold-filter-grid,
.desktop-app .vehicle-card,
.desktop-app .sold-card,
.desktop-app .notice-card,
.desktop-app .profile-card,
.desktop-app .person-list article,
.desktop-app .form-section,
.desktop-app .report-section,
.desktop-app .record-list,
.desktop-app .article-box {
  border-color: rgba(201, 211, 224, 0.9);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 18px 46px rgba(17, 31, 52, 0.08);
}.desktop-app .metric-card {
  min-height: 112px;
  padding: 18px;
}.desktop-app .metric-card span,
.desktop-app .metric-card small {
  font-size: 14px;
}.desktop-app .metric-card strong {
  font-size: 32px;
}.desktop-app .content-card,
.desktop-app .filter-card,
.desktop-app .toolbar-card,
.desktop-app .sold-filter-grid,
.desktop-app .profile-card {
  margin-top: 18px;
  padding: 20px;
}.desktop-app .page[data-panel="ranking"] .content-card {
  overflow: hidden;
}.desktop-app .page[data-panel="ranking"] .content-card {
  min-height: 360px;
}.desktop-app .title-badge {
  display: grid;
  min-width: 28px;
  height: 24px;
  place-items: center;
  border-radius: 8px;
  background: #fff0f1;
  color: #f0373d;
  font-size: 11px;
  font-weight: 950;
}.desktop-app .title-badge.rank,
.desktop-app .title-badge.fix,
.desktop-app .title-badge.notice,
.desktop-app .title-badge.warn {
  min-width: 24px;
}.desktop-app .dashboard-table {
  display: grid;
  margin-top: 0;
  padding-top: 0;
}.desktop-app .sales-rank-board {
  display: grid;
  gap: 8px;
  padding: 12px;
}.desktop-app .sales-rank-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) minmax(78px, auto);
  gap: 10px;
  align-items: center;
  min-height: 54px;
  padding: 9px 10px;
  border: 1px solid rgba(218, 226, 235, 0.95);
  border-radius: 8px;
  background: linear-gradient(90deg, #ffffff 0%, #f8fbff 100%);
}.desktop-app .sales-rank-row.rank-1 {
  border-color: rgba(214, 154, 45, 0.48);
  background: linear-gradient(90deg, #fff8e8 0%, #ffffff 82%);
}.desktop-app .sales-rank-medal {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  background: #10213d;
  color: #ffffff;
  font-size: 13px;
  font-weight: 950;
}.desktop-app .rank-1 .sales-rank-medal {
  background: #d69a2d;
  color: #071225;
}.desktop-app .sales-rank-main {
  display: grid;
  gap: 5px;
  min-width: 0;
}.desktop-app .sales-rank-name,
.desktop-app .sales-rank-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}.desktop-app .sales-rank-name strong {
  min-width: 0;
  overflow: hidden;
  color: #071225;
  font-size: 14px;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .sales-rank-name span {
  flex: 0 0 auto;
  padding: 2px 7px;
  border-radius: 999px;
  background: #eef4fb;
  color: #526784;
  font-size: 11px;
  font-weight: 900;
}.desktop-app .sales-rank-meta span {
  color: #526784;
  font-size: 12px;
  font-weight: 850;
}.desktop-app .sales-rank-track {
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8eef6;
}.desktop-app .sales-rank-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d69a2d, #2f7fd6);
}.desktop-app .sales-rank-prize {
  display: grid;
  justify-items: end;
  gap: 2px;
  white-space: nowrap;
}.desktop-app .sales-rank-prize span {
  color: #73829a;
  font-size: 10px;
  font-weight: 850;
}.desktop-app .sales-rank-prize strong {
  color: #071225;
  font-size: 15px;
  font-weight: 950;
}.desktop-app .dashboard-row {
  display: grid;
  align-items: center;
  min-height: 53px;
  padding: 0 12px;
  border-bottom: 1px solid rgba(218, 226, 235, 0.95);
  color: #071225;
  font-size: 14px;
}.desktop-app .dashboard-row:last-child {
  border-bottom: 0;
}.desktop-app .dashboard-head {
  min-height: 36px;
  background: #f3f3f3;
  color: #20334f;
  font-size: 13px;
  font-weight: 850;
}.desktop-app .dash-car {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 2px 10px;
  align-items: center;
  min-width: 0;
}.desktop-app .dash-car img,
.desktop-app .avatar-placeholder {
  width: 50px;
  height: 38px;
  grid-row: 1 / span 2;
  border-radius: 5px;
  object-fit: cover;
}.desktop-app .avatar-placeholder {
  background:
    radial-gradient(circle at 50% 34%, #ffffff 0 17%, transparent 18%),
    radial-gradient(circle at 50% 88%, #ffffff 0 31%, transparent 32%),
    #c6d0e0;
}.desktop-app .dash-car strong {
  min-width: 0;
  overflow: hidden;
  color: #071225;
  font-size: 15px;
  font-weight: 950;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .dash-car small {
  color: #536987;
  font-size: 12px;
  font-weight: 750;
}.desktop-app .dashboard-row b {
  color: #e9171c;
  font-weight: 950;
}.desktop-app .dashboard-row em {
  color: #071225;
  font-style: normal;
  font-weight: 950;
}.desktop-app .empty-state {
  display: grid;
  min-height: 198px;
  place-items: center;
  color: #71839c;
  font-size: 15px;
  font-weight: 750;
}.desktop-app .repair-progress-body {
  display: grid;
  grid-template-columns: 146px minmax(0, 1fr);
  gap: 22px;
  align-items: center;
  padding: 12px 18px 18px;
}.desktop-app .repair-donut {
  display: grid;
  width: 132px;
  height: 132px;
  place-items: center;
  align-content: center;
  border-radius: 50%;
  background:
    radial-gradient(circle, #ffffff 0 42%, transparent 43%),
    conic-gradient(#ef373c 0 25%, #ff8d1a 25% 68%, #1f9a68 68% 82%, #c8d3df 82% 100%);
}.desktop-app .repair-donut strong {
  color: #071225;
  font-size: 28px;
  line-height: 1;
}.desktop-app .repair-donut span {
  color: #526784;
  font-size: 12px;
  font-weight: 800;
}.desktop-app .toolbar-card {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) auto;
  align-items: center;
}.desktop-app .backoffice-toolbar {
  display: flex;
  grid-template-columns: none;
  width: fit-content;
  max-width: 100%;
}.desktop-app .backoffice-toolbar button {
  width: auto;
  min-width: 136px;
}

/* 2026-08-02: management-table rows use an inline vehicle editor in the right drawer. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
    padding-right: min(48vw, 900px);
  }

  body.desktop-page .desktop-app .inventory-management-detail {
    width: min(48vw, 900px);
    background: #fff;
  }

  body.desktop-page .desktop-app .management-detail-actions button.active {
    border-color: #c88a25;
    color: #8a5a12;
    background: linear-gradient(180deg, #fff8e9 0%, #f5e4c0 100%);
    box-shadow: inset 0 0 0 1px rgba(200, 138, 37, .16), 0 7px 16px rgba(126, 83, 18, .1);
  }

  body.desktop-page .desktop-app .management-inline-editor-host {
    min-height: 360px;
    border-top: 1px solid #edf0f4;
    background: #f5f7fa;
  }

  body.desktop-page .desktop-app .inventory-management-detail .mobile-modal[data-modal="vehicle-manage"].management-inline-editor {
    position: static;
    display: block !important;
    width: 100%;
    height: auto;
    max-width: none;
    max-height: none;
    min-height: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor > .modal-header,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-tabs {
    display: none !important;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-body {
    display: block;
    max-height: none;
    min-height: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-panel {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    padding: 20px 22px 26px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: #f7f9fc;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-panel.active {
    display: block;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 16px;
    padding: 0 0 13px 13px;
    border-bottom: 1px solid #e4e8ee;
    border-left: 4px solid #c68a25;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro > div {
    display: grid;
    flex: 0 0 auto;
    gap: 3px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro small {
    color: #b77b17;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro h3 {
    margin: 0;
    color: #17233a;
    font-size: 20px;
    font-weight: 950;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro p {
    max-width: 520px;
    margin: 0;
    color: #6b778a;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    text-align: right;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(3),
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(4),
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(7) {
    grid-column: 1 / -1;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block {
    border-color: #e1e6ed;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(20, 35, 60, .045);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel.active {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 14px 16px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .manage-section-intro,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .public-publish-setting,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .public-spec-fields,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .vehicle-description-ai,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .mobile-field.wide {
    grid-column: 1 / -1;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-document-summary,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-picker {
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #e1e6ed;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(20, 35, 60, .045);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(260px, 1.4fr);
    align-items: center;
    gap: 16px;
    padding: 14px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting h4 {
    margin: 0;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-document-summary,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-picker {
    min-height: 100%;
    padding: 14px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-spec-fields {
    padding: 14px;
    border: 1px solid #e1e6ed;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(20, 35, 60, .045);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai {
    margin: 0;
    border-radius: 10px;
    box-shadow: 0 5px 16px rgba(20, 35, 60, .045);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .mobile-field.wide {
    padding: 14px;
    border: 1px solid #e1e6ed;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(20, 35, 60, .045);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-actions {
    position: sticky;
    z-index: 6;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 14px 22px;
    border-top: 1px solid #e2e7ee;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 -8px 22px rgba(20, 35, 60, .07);
    backdrop-filter: blur(10px);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-actions button {
    min-width: 96px;
    height: 38px;
  }

  @media (max-width: 1320px) {
    body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
      padding-right: 55vw;
    }

    body.desktop-page .desktop-app .inventory-management-detail {
      width: 55vw;
    }

    body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro {
      align-items: flex-start;
    }
  }
}

/* In-stock vehicle inspection and compulsory-insurance reminders */
.title-ai-copy,
.inventory-ai-copy-mobile-action,
.title-inspection-alert,
.inspection-alert-mobile-action {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.title-ai-copy svg,
.inventory-ai-copy-mobile-action svg,
.title-inspection-alert svg,
.inspection-alert-mobile-action svg,
.inspection-alert-heading-icon svg,
.inspection-alert-empty svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row {
  width: min(1040px, 100%);
  grid-template-columns: minmax(116px, .6fr) minmax(116px, .6fr) minmax(220px, 1.4fr) auto auto auto;
}

body.desktop-page .desktop-app .page[data-panel="inventory"] .title-inspection-alert {
  min-width: 112px;
  border-color: #d5a13d;
  background: #fffaf0;
  color: #8f5f0a;
}

body.desktop-page .desktop-app .page[data-panel="inventory"] .title-ai-copy {
  min-width: 96px;
  border-color: #3f73c9;
  background: linear-gradient(180deg, #f5f9ff 0%, #e9f2ff 100%);
  color: #174f9c;
}

body.desktop-page .inventory-ai-copy-mobile-action {
  display: none;
}

.title-inspection-alert [data-inspection-alert-badge],
.inspection-alert-mobile-action [data-inspection-alert-badge] {
  display: grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  background: #d92d20;
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 950;
  line-height: 1;
}

.title-inspection-alert [data-inspection-alert-badge][hidden],
.inspection-alert-mobile-action [data-inspection-alert-badge][hidden] {
  display: none;
}

body.desktop-page .inspection-alert-mobile-action {
  display: none;
}

body.desktop-page .mobile-modal[data-modal="inspection-alert"] {
  width: min(1080px, calc(100vw - 64px));
  max-height: min(850px, calc(100vh - 48px));
}

.mobile-modal[data-modal="inspection-alert"] {
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
}

.inspection-alert-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 16px;
}

.inspection-alert-heading-icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: linear-gradient(145deg, #d9a437, #aa7016);
  color: #fff;
  box-shadow: 0 10px 25px rgba(174, 112, 20, .25);
}

.inspection-alert-heading-icon svg {
  width: 27px;
  height: 27px;
}

.inspection-alert-header > div:nth-child(2) {
  min-width: 0;
}

.inspection-alert-header p {
  margin: 0 0 3px;
  color: #b47d1e;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
}

.inspection-alert-header h2 {
  margin: 0;
  color: #111827;
  font-size: 25px;
}

.inspection-alert-header > div:nth-child(2) > span {
  display: block;
  margin-top: 5px;
  color: #778196;
  font-size: 13px;
  font-weight: 700;
}

.inspection-alert-count {
  padding: 8px 13px;
  border: 1px solid #ebc477;
  border-radius: 999px;
  background: #fff8e9;
  color: #9a670e;
  font-size: 13px;
  white-space: nowrap;
}

.inspection-alert-tabs {
  display: flex;
  gap: 8px;
  padding: 10px 18px 0;
  border-top: 1px solid #edf0f5;
  background: #fff;
}

.inspection-alert-tabs button {
  min-width: 126px;
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-bottom: 3px solid transparent;
  border-radius: 11px 11px 0 0;
  background: transparent;
  color: #697386;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
}

.inspection-alert-tabs button.active {
  border-color: #eed9ad;
  border-bottom-color: #bd8427;
  background: #fff9ec;
  color: #8b5b08;
}

.inspection-alert-body {
  background: #f3f5f8;
}

.inspection-alert-body [data-inspection-alert-panel][hidden] {
  display: none;
}

.inspection-alert-list {
  display: grid;
  gap: 16px;
}

.inspection-alert-global-settings {
  display: grid;
  grid-template-columns: minmax(230px, 1fr) auto auto auto;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid #e4cc9e;
  border-radius: 15px;
  background: linear-gradient(135deg, #fffaf0, #fff);
  box-shadow: 0 8px 24px rgba(143, 95, 10, .06);
}

.inspection-alert-global-settings > div {
  display: grid;
  gap: 3px;
}

.inspection-alert-global-settings > div small {
  color: #b47a1b;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .1em;
}

.inspection-alert-global-settings > div strong {
  color: #172033;
  font-size: 14px;
}

.inspection-alert-global-settings label {
  display: grid;
  grid-template-columns: auto 64px auto;
  align-items: center;
  gap: 7px;
  color: #66543a;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}

.inspection-alert-global-settings input {
  width: 64px;
  height: 38px;
  padding: 0 8px;
  border: 1px solid #d8be8c;
  border-radius: 9px;
  background: #fff;
  color: #172033;
  font-weight: 900;
  text-align: center;
  appearance: textfield;
  -moz-appearance: textfield;
}

.inspection-alert-global-settings input::-webkit-inner-spin-button,
.inspection-alert-global-settings input::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
}

.inspection-alert-global-settings em {
  font-style: normal;
}

.inspection-alert-global-settings button {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid #b77b1e;
  border-radius: 9px;
  background: linear-gradient(135deg, #d9a437, #b77b1e);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.inspection-alert-history-list {
  display: grid;
  gap: 12px;
}

.inspection-alert-history-card {
  display: grid;
  grid-template-columns: 88px minmax(180px, 1fr) minmax(290px, 1.25fr) minmax(220px, .8fr);
  align-items: center;
  gap: 16px;
  padding: 15px;
  border: 1px solid #e1e7ef;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .055);
}

.inspection-alert-history-photo {
  width: 88px;
  height: 64px;
  overflow: hidden;
  border-radius: 11px;
  background: #eef1f5;
}

.inspection-alert-history-photo img,
.inspection-alert-history-photo .inspection-alert-photo-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.inspection-alert-history-vehicle small {
  color: #ad7619;
  font-size: 11px;
  font-weight: 900;
}

.inspection-alert-history-vehicle h3 {
  margin: 3px 0;
  color: #172033;
  font-size: 17px;
  line-height: 1.25;
}

.inspection-alert-history-vehicle p {
  margin: 0;
  color: #6c7688;
  font-size: 13px;
  font-weight: 800;
}

.inspection-alert-history-change {
  display: grid;
  grid-template-columns: auto minmax(86px, 1fr) auto auto minmax(86px, 1fr);
  align-items: center;
  gap: 7px;
  padding: 11px 12px;
  border: 1px solid #e8edf3;
  border-radius: 12px;
  background: #f8fafc;
}

.inspection-alert-history-change span {
  color: #7a8495;
  font-size: 10px;
  font-weight: 850;
}

.inspection-alert-history-change strong {
  color: #253047;
  font-size: 13px;
  white-space: nowrap;
}

.inspection-alert-history-change i {
  color: #b47a1b;
  font-size: 18px;
  font-style: normal;
  font-weight: 900;
}

.inspection-alert-history-meta {
  display: grid;
  justify-items: end;
  gap: 7px;
}

.inspection-alert-history-status {
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}

.inspection-alert-history-status.safe {
  background: #e8f7ee;
  color: #087443;
}

.inspection-alert-history-status.adjusted {
  background: #f0f3f7;
  color: #647084;
}

.inspection-alert-history-meta p {
  display: grid;
  justify-items: end;
  gap: 1px;
  margin: 0;
}

.inspection-alert-history-meta p b {
  color: #172033;
  font-size: 13px;
}

.inspection-alert-history-meta p span {
  color: #818a9a;
  font-size: 11px;
}

.inspection-alert-history-reward {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #a66800;
  font-size: 12px;
  font-style: normal;
  font-weight: 950;
}

.inspection-alert-history-reward svg {
  width: 16px;
  height: 16px;
}

.inspection-alert-history-reward.disabled {
  color: #8a93a2;
  font-weight: 800;
}


.inspection-alert-card {
  overflow: hidden;
  border: 1px solid #e2e7ef;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .07);
}

.inspection-alert-card > header {
  display: grid;
  grid-template-columns: 112px minmax(170px, 1fr);
  align-items: center;
  gap: 18px;
  padding: 18px;
  border-bottom: 1px solid #edf0f5;
}

.inspection-alert-photo {
  width: 112px;
  height: 76px;
  overflow: hidden;
  border-radius: 12px;
  background: #eef1f5;
}

.inspection-alert-photo img,
.inspection-alert-photo-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  object-fit: cover;
  color: #9a670e;
  font-size: 18px;
  font-weight: 950;
}

.inspection-alert-vehicle-name small {
  color: #bd8320;
  font-size: 11px;
  font-weight: 900;
}

.inspection-alert-vehicle-name h3 {
  margin: 3px 0 4px;
  color: #111827;
  font-size: 21px;
  line-height: 1.2;
}

.inspection-alert-vehicle-name p {
  margin: 0;
  color: #596579;
  font-size: 14px;
  font-weight: 850;
}

.inspection-alert-date-row > button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid #c28a2d;
  border-radius: 9px;
  background: #fff;
  color: #8f5f0a;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.inspection-alert-dates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 16px 18px 18px;
}

.inspection-alert-date-row {
  display: grid;
  grid-template-columns: minmax(118px, 1fr) minmax(154px, 1fr) auto;
  align-items: end;
  gap: 12px;
  padding: 14px;
  border: 1px solid #e4e9f0;
  border-radius: 13px;
  background: #f9fafb;
}

.inspection-alert-date-row.danger {
  border-color: #f1c2bd;
  background: linear-gradient(135deg, #fff6f5, #fffdfa);
}

.inspection-alert-date-summary {
  display: grid;
  gap: 3px;
}

.inspection-alert-date-summary span,
.inspection-alert-date-row label span {
  color: #687386;
  font-size: 11px;
  font-weight: 850;
}

.inspection-alert-date-summary strong {
  color: #172033;
  font-size: 16px;
}

.inspection-alert-date-summary em {
  color: #667085;
  font-size: 12px;
  font-style: normal;
  font-weight: 850;
}

.inspection-alert-date-row.danger .inspection-alert-date-summary em {
  color: #d92d20;
}

.inspection-alert-date-row label {
  display: grid;
  gap: 5px;
}

.inspection-alert-date-row input {
  width: 100%;
  height: 38px;
  padding: 0 9px;
  border: 1px solid #d2d9e5;
  border-radius: 9px;
  background: #fff;
  color: #172033;
  font-weight: 800;
}

.inspection-alert-date-row > button {
  min-height: 38px;
  border-color: #ba8124;
  background: linear-gradient(135deg, #d9a437, #b77b1e);
  color: #fff;
}

.inspection-alert-loading,
.inspection-alert-empty {
  display: grid;
  place-items: center;
  min-height: 280px;
  padding: 40px;
  border: 1px dashed #d7c18f;
  border-radius: 18px;
  background: #fff;
  color: #6f7787;
  text-align: center;
}

.inspection-alert-empty svg {
  width: 48px;
  height: 48px;
  margin-bottom: 10px;
  color: #c18a2d;
}

.inspection-alert-empty h3 {
  margin: 0;
  color: #172033;
  font-size: 20px;
}

.inspection-alert-empty p {
  margin: 7px 0 0;
  font-size: 13px;
  font-weight: 700;
}

.inspection-alert-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.inspection-alert-footer p {
  display: grid;
  gap: 2px;
  margin: 0;
  color: #7a8496;
  font-size: 12px;
}

.inspection-alert-footer p b {
  color: #81560b;
  font-size: 13px;
}

.inspection-alert-footer > button {
  min-width: 120px;
  border-color: #b77b1e;
  background: #bd8427;
  color: #fff;
}

@media (max-width: 1180px) and (min-width: 900px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .inspection-alert-card > header {
    grid-template-columns: 92px minmax(140px, 1fr);
  }

  .inspection-alert-photo {
    width: 92px;
    height: 68px;
  }

  .inspection-alert-global-settings {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .inspection-alert-global-settings > div {
    grid-column: 1 / -1;
  }

  .inspection-alert-dates {
    grid-template-columns: 1fr;
  }

  .inspection-alert-history-card {
    grid-template-columns: 78px minmax(160px, 1fr) minmax(280px, 1.4fr);
  }

  .inspection-alert-history-photo {
    width: 78px;
    height: 58px;
  }

  .inspection-alert-history-meta {
    grid-column: 2 / -1;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    justify-items: start;
  }

  .inspection-alert-history-meta p {
    justify-items: start;
  }
}

@media (max-width: 899px) {
  body:not(.desktop-page) .page[data-panel="inventory"] > .inspection-alert-mobile-action {
    display: flex;
    width: calc(100% - 28px);
    min-height: 48px;
    margin: 0 14px 14px;
    border: 1px solid #d5a13d;
    border-radius: 14px;
    background: #fffaf0;
    color: #8f5f0a;
    font-size: 15px;
    font-weight: 950;
  }

  .inspection-alert-modal .modal-header {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    padding: 18px 16px;
  }

  .inspection-alert-heading-icon {
    width: 44px;
    height: 44px;
    border-radius: 13px;
  }

  .inspection-alert-header > div:nth-child(2) > span,
  .inspection-alert-count {
    display: none;
  }

  .inspection-alert-tabs {
    padding: 8px 12px 0;
  }

  .inspection-alert-tabs button {
    flex: 1 1 0;
    min-width: 0;
    height: 42px;
  }

  .inspection-alert-card > header {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 12px;
    padding: 13px;
  }

  .inspection-alert-photo {
    width: 82px;
    height: 62px;
  }

  .inspection-alert-vehicle-name h3 {
    font-size: 17px;
  }

  .inspection-alert-global-settings {
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin-bottom: 12px;
    padding: 13px;
  }

  .inspection-alert-global-settings > div,
  .inspection-alert-global-settings button {
    grid-column: 1 / -1;
  }

  .inspection-alert-global-settings label {
    grid-template-columns: minmax(0, 1fr) 58px auto;
    white-space: normal;
  }

  .inspection-alert-global-settings input {
    width: 58px;
  }

  .inspection-alert-dates {
    grid-template-columns: 1fr;
    padding: 12px;
  }

  .inspection-alert-date-row {
    grid-template-columns: 1fr minmax(145px, 1fr);
  }

  .inspection-alert-date-row > button {
    grid-column: 1 / -1;
  }

  .inspection-alert-history-card {
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 11px;
    padding: 12px;
  }

  .inspection-alert-history-photo {
    width: 70px;
    height: 56px;
  }

  .inspection-alert-history-change,
  .inspection-alert-history-meta {
    grid-column: 1 / -1;
  }

  .inspection-alert-history-change {
    grid-template-columns: auto minmax(0, 1fr) auto auto minmax(0, 1fr);
  }

  .inspection-alert-history-change strong {
    white-space: normal;
  }

  .inspection-alert-history-meta {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    justify-items: start;
  }

  .inspection-alert-history-meta p {
    justify-items: start;
  }

  .inspection-alert-footer p {
    display: none;
  }

  body:not(.desktop-page) .inspection-alert-footer {
    display: flex !important;
    grid-template-columns: 1fr !important;
  }

  .inspection-alert-footer > button {
    grid-column: 1 / -1;
    flex: 1 1 100%;
    width: 100% !important;
    max-width: none !important;
  }
}

/* 獎金錢包：與金幣並列，點選後開啟賣車人生收益明細。 */
body.desktop-page .desktop-app .account-card {
  width: 392px;
  grid-template-columns: 68px 92px minmax(0, 1fr) 54px;
  gap: 5px;
}
body.desktop-page .desktop-app .main-tabs { right: 416px; }
body.desktop-page .desktop-app .account-card .bonus-wallet-button {
  display: grid;
  width: auto;
  min-width: 92px;
  height: 32px;
  grid-template-columns: 18px minmax(0, 1fr);
  grid-template-rows: 13px 13px;
  column-gap: 5px;
  align-items: center;
  padding: 2px 7px;
  border: 1px solid #b8d4c4;
  border-radius: 999px;
  color: #1f7350;
  background: #f4fbf7;
  box-shadow: 0 4px 12px rgba(28, 112, 76, .08);
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button svg {
  grid-row: 1 / 3; width: 18px; height: 18px; fill: none; stroke: #24805b;
  stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round;
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button span {
  margin: 0; color: #668b78; font-size: 8px; line-height: 1; text-align: left;
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button strong {
  overflow: hidden; color: #176b49; font-size: 11px; line-height: 1;
  text-align: left; text-overflow: ellipsis; white-space: nowrap;
}
body.desktop-page .desktop-app .account-card > button:not(.coin-wallet-button):not(.bonus-wallet-button) {
  min-width: 54px; height: 32px; padding: 0 8px;
}
@media (max-width: 1535px) and (min-width: 1321px) {
  body.desktop-page .desktop-app .account-card {
    width: 360px; grid-template-columns: 62px 82px minmax(0, 1fr) 50px;
  }
  body.desktop-page .desktop-app .main-tabs { right: 378px; }
  body.desktop-page .desktop-app .account-card .bonus-wallet-button { min-width: 82px; padding-right: 5px; padding-left: 5px; }
}
@media (max-width: 1320px) and (min-width: 900px) {
  body.desktop-page .desktop-app .account-card {
    width: 352px; grid-template-columns: 62px 80px minmax(0, 1fr) 50px;
  }
  body.desktop-page .desktop-app .account-card .bonus-wallet-button { min-width: 80px; padding-right: 5px; padding-left: 5px; }
}

/* 2026-08-01: desktop vehicle management tables */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article {
    position: relative;
    min-height: 104px;
    overflow: hidden;
    padding: 17px 20px 15px 76px;
    border: 1px solid #e8ebf1;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(15, 34, 64, 0.04);
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article::before {
    content: none;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article::after {
    content: none;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article.stock { color: #124281; }
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article.reserved { color: #8a5a18; }
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article.price { color: #3a6576; }
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card article.repair { color: #5b5273; }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-icon {
    position: absolute;
    top: 31px;
    left: 18px;
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    color: currentColor;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-icon svg {
    width: 42px;
    height: 42px;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card span,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card strong,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card small {
    display: block;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card span {
    color: #5b6472;
    font-size: 12px;
    font-weight: 800;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card strong {
    margin-top: 4px;
    color: #13213a;
    font-size: 23px;
    line-height: 1.05;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-overview-card small {
    margin-top: 7px;
    color: #7e8795;
    font-size: 11px;
    font-weight: 650;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .filter-card {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(20, 35, 60, 0.05);
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .status-tabs,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .view-tabs {
    display: flex;
    width: auto;
    min-width: 0;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 0;
    border-radius: 10px;
    background: #f3f5f8;
    overflow: visible;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .status-tabs button,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .view-tabs button {
    width: auto;
    min-width: 112px;
    height: 38px;
    padding: 0 15px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    box-shadow: none;
    clip-path: none;
    color: #5c6677;
    font-size: 12px;
    font-weight: 850;
    transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .status-tabs button::after {
    content: none;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .status-tabs button::before {
    position: static;
    display: block;
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 999px;
    content: "";
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .status-tabs button.active {
    border-color: #10213f;
    background: #10213f;
    color: #fff;
    box-shadow: 0 5px 12px rgba(16, 33, 63, 0.18);
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .status-tabs button.active::before {
    background: #fff;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .view-tabs button {
    min-width: 96px;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .view-tabs button.active {
    border-color: #d8dee8;
    background: #fff;
    color: #10213f;
    box-shadow: 0 3px 10px rgba(16, 33, 63, 0.1);
  }

  @media (max-width: 1180px) {
    body.desktop-page .desktop-app .page[data-panel="inventory"] .filter-card {
      flex-wrap: wrap;
    }
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"],
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] {
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(20, 35, 60, 0.05);
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-table-head,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-card {
    width: 100%;
    min-width: 1190px;
    grid-template-columns:
      90px
      minmax(190px, 1.4fr)
      minmax(90px, 0.75fr)
      minmax(230px, 2fr)
      minmax(78px, 0.7fr)
      minmax(82px, 0.75fr)
      minmax(82px, 0.75fr)
      minmax(94px, 0.8fr)
      minmax(94px, 0.8fr)
      minmax(300px, 1.8fr);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-table-head,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-card {
    width: 100%;
    min-width: 1184px;
    grid-template-columns:
      80px
      minmax(170px, 1.3fr)
      minmax(86px, 0.7fr)
      minmax(200px, 1.8fr)
      minmax(74px, 0.65fr)
      minmax(78px, 0.7fr)
      minmax(78px, 0.7fr)
      minmax(86px, 0.75fr)
      minmax(86px, 0.75fr)
      minmax(86px, 0.75fr)
      minmax(160px, 1.2fr);
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .desktop-table-head,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .desktop-table-head {
    height: 42px;
    padding: 0 14px;
    border-bottom-color: #e9edf2;
    background: #fbfbfc;
    color: #606978;
    font-size: 12px;
    font-weight: 800;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .desktop-table-head .vehicle-info-head,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .desktop-table-head .vehicle-info-head {
    grid-column: 1 / 3;
    padding-left: 8px;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span {
    grid-row: 1;
    align-self: center;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(2) { grid-column: 3; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(3) { grid-column: 4; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(4) { grid-column: 5; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(5) { grid-column: 6; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(6) { grid-column: 7; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(7) { grid-column: 8; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(8) { grid-column: 9; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(9) {
    grid-column: 10;
    justify-self: stretch;
    text-align: center;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(2),
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(4),
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(5),
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(6),
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(7),
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(8) {
    justify-self: stretch;
    padding-right: 0;
    padding-left: 0;
    text-align: center;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-card,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-card {
    min-height: 108px;
    padding: 12px 14px;
    border-bottom-color: #edf0f4;
    transition: background 0.16s ease, box-shadow 0.16s ease;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-card:hover,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-card:hover {
    z-index: 1;
    background: #fbfdff;
    box-shadow: inset 4px 0 0 #c58b26;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-card > img,
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-placeholder {
    width: 76px;
    height: 62px;
    align-self: center;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(20, 30, 50, 0.12);
  }

  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-thumb {
    width: 66px;
    height: 58px;
    align-self: center;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(20, 30, 50, 0.12);
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > *,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > * {
    grid-row: 1;
    min-width: 0;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(1),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(1) { grid-column: 2; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(2),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(2) { grid-column: 3; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(3),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(3) { grid-column: 4; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(4),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(4) { grid-column: 5; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(5),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(5) { grid-column: 6; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(6),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(6) { grid-column: 7; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(7),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(7) { grid-column: 8; }
  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(8),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(8) { grid-column: 9; }
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(9) { grid-column: 10; }

  body.desktop-page .desktop-app .management-vehicle-summary,
  body.desktop-page .desktop-app .management-status,
  body.desktop-page .desktop-app .management-tags,
  body.desktop-page .desktop-app .management-certification,
  body.desktop-page .desktop-app .management-money {
    align-self: center;
    padding: 0 8px;
  }

  body.desktop-page .desktop-app .management-vehicle-summary strong,
  body.desktop-page .desktop-app .management-vehicle-summary span,
  body.desktop-page .desktop-app .management-vehicle-summary small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .management-vehicle-summary strong {
    color: #17243a;
    font-size: 16px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .management-vehicle-summary span {
    margin-top: 5px;
    color: #667084;
    font-size: 11px;
    font-weight: 650;
  }

  body.desktop-page .desktop-app .management-vehicle-summary span i {
    color: #c8ced8;
    font-style: normal;
  }

  body.desktop-page .desktop-app .management-vehicle-summary .plate-state {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-top: 7px;
    color: #6b7280;
    font-size: 10px;
    font-weight: 750;
  }

  body.desktop-page .desktop-app .management-vehicle-summary .plate-state > i {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 999px;
    background: #94a3b8;
  }

  body.desktop-page .desktop-app .management-vehicle-summary .plate-state.safe > i { background: #13a05a; }
  body.desktop-page .desktop-app .management-vehicle-summary .plate-state.danger > i { background: #dc3b35; }

  body.desktop-page .desktop-app .management-status strong {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    padding: 4px 9px;
    border-radius: 999px;
    background: #eef4ff;
    color: #245399;
    font-size: 11px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .management-status strong.status-in-stock { background: #eaf8ef; color: #21824b; }
  body.desktop-page .desktop-app .management-status strong.status-reserved { background: #fff4df; color: #b06a16; }
  body.desktop-page .desktop-app .management-status strong.status-sold { background: #eef2f8; color: #58657a; }

  body.desktop-page .desktop-app .management-status small {
    display: block;
    margin-top: 7px;
    color: #87909f;
    font-size: 10px;
    font-weight: 650;
  }

  body.desktop-page .desktop-app .management-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }

  body.desktop-page .desktop-app .management-tags span {
    display: inline-flex;
    width: auto;
    max-width: 92px;
    min-height: 23px;
    align-items: center;
    padding: 3px 8px;
    overflow: hidden;
    border-radius: 5px;
    background: #f0f4fa;
    color: #3c4c67;
    font-size: 10px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .management-tags span:nth-child(4n + 1) { background: #edf3fb; color: #3d5579; }
  body.desktop-page .desktop-app .management-tags span:nth-child(4n + 2) { background: #f6f1fb; color: #69527e; }
  body.desktop-page .desktop-app .management-tags span:nth-child(4n + 3) { background: #fff2e4; color: #8c5e25; }
  body.desktop-page .desktop-app .management-tags span:nth-child(4n) { background: #edf8f3; color: #327359; }

  body.desktop-page .desktop-app .management-empty {
    display: block;
    align-self: center;
    padding: 0 8px;
    color: #17243a;
    font-size: 14px;
    font-weight: 800;
  }

  body.desktop-page .desktop-app .management-certification {
    display: flex;
    min-height: 76px;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    justify-self: stretch;
    gap: 0;
    padding: 0;
    overflow: visible;
  }

  body.desktop-page .desktop-app .management-certification > i {
    display: block;
    width: 70px;
    height: 70px;
    flex: 0 0 70px;
    border-radius: 6px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }

  body.desktop-page .desktop-app .management-certification small {
    display: none;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:nth-child(4),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-head > span:nth-child(4) {
    justify-self: center;
    text-align: center;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(4),
  body.desktop-page .desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(4) {
    display: flex;
    min-height: 76px;
    align-items: center;
    justify-content: center;
    align-self: center;
    justify-self: stretch;
    padding: 0;
    overflow: visible;
    text-align: center;
  }

  body.desktop-page .desktop-app .management-certification.certification-yes > i { background-image: url("vehicle-site-assets/certification-logo-yes-20260723.jpg?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-hot > i { background-image: url("vehicle-site-assets/certification-logo-hot-20260723.jpg?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-tsi > i { background-image: url("vehicle-site-assets/certification-logo-tsi-20260723.jpg?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-goo > i { background-image: url("vehicle-site-assets/certification-logo-goo-20260723.jpg?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-save > i { background-image: url("vehicle-site-assets/certification-logo-save-20260723.jpg?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-tcbu > i { background-image: url("vehicle-site-assets/certification-logo-tcbu.png?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-carok > i { background-image: url("vehicle-site-assets/certification-logo-carok.jpg?v=1"); }
  body.desktop-page .desktop-app .management-certification.certification-sum > i { background-image: url("vehicle-site-assets/certification-logo-sum-classic.png?v=1"); }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .management-money,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .management-money {
    display: block;
    width: 100%;
    align-self: center;
    justify-self: stretch;
    padding-right: 0;
    padding-left: 0;
    color: #17243a;
    font-size: 17px;
    font-weight: 900;
    text-align: center;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .sold-list[data-view="table"] .management-money.profit-loss {
    color: #c93131;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .card-actions {
    grid-column: 10;
    display: flex;
    flex-wrap: nowrap;
    gap: 5px;
    padding-left: 8px;
  }

  body.desktop-page .desktop-app .sold-list[data-view="table"] .card-actions {
    grid-column: 11;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    padding-left: 8px;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .card-actions button,
  body.desktop-page .desktop-app .sold-list[data-view="table"] .card-actions button {
    width: 100%;
    min-width: 0;
    min-height: 29px;
    padding: 0 7px;
    border-radius: 7px;
    font-size: 10px;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .card-actions button {
    width: auto;
    min-width: 50px;
    min-height: 34px;
    flex: 1 1 0;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .vehicle-table-head > span:last-child {
    justify-self: center;
    text-align: center;
  }

  body.desktop-page .desktop-app .sold-list[data-view="table"] .desktop-status-panel {
    display: none;
  }
}
@media (max-width: 899px) {
  body:not(.desktop-page) .account-card .bonus-wallet-button { display: none !important; }
  body:not(.desktop-page) .account-card > button:not(.coin-wallet-button):not(.bonus-wallet-button) {
    width: 50px; min-width: 50px;
  }
}

/* 2026-08-01: split inventory management table and vehicle detail drawer */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"] {
    box-sizing: border-box;
    transition: padding-right .2s ease;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
    padding-right: min(37vw, 680px);
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-table-head,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-card {
    min-width: 824px;
    grid-template-columns:
      174px
      minmax(140px, 1.45fr)
      minmax(62px, .64fr)
      minmax(136px, 1.45fr)
      minmax(56px, .58fr)
      minmax(54px, .56fr)
      minmax(54px, .56fr)
      minmax(61px, .62fr)
      minmax(61px, .62fr)
      40px;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-card {
    position: relative;
    min-height: 148px;
    cursor: pointer;
    transition: background-color .16s ease, box-shadow .16s ease;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-card:hover,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-card:focus-visible {
    z-index: 1;
    outline: none;
    background: #f7faff;
    box-shadow: inset 3px 0 #1f5cb2;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-card > img,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .vehicle-placeholder {
    width: 158px;
    height: 124px;
    border-radius: 10px;
    object-fit: cover;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="table"] .card-actions {
    display: none !important;
  }

  body.desktop-page .desktop-app .management-row-index,
  body.desktop-page .desktop-app .management-row-chevron {
    display: none;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .management-row-index {
    position: absolute;
    z-index: 3;
    top: 8px;
    left: 8px;
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 5px;
    color: #fff;
    background: linear-gradient(145deg, #c88b24, #8e5c0b);
    box-shadow: 0 4px 9px rgba(120, 77, 10, .22);
    font-size: 10px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .management-row-chevron {
    grid-column: 10;
    display: grid;
    width: 34px;
    height: 44px;
    place-self: center;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 10px;
    color: #1f5cb2;
    background: transparent;
    font-size: 31px;
    font-weight: 300;
    line-height: 1;
    cursor: pointer;
    transition: color .16s ease, background .16s ease, transform .16s ease;
  }

  body.desktop-page .desktop-app .vehicle-list[data-view="table"] .management-row-chevron:hover {
    color: #fff;
    background: #1f5cb2;
    transform: translateX(2px);
  }

  body.desktop-page .desktop-app .inventory-management-detail {
    position: fixed;
    z-index: 8400;
    top: 72px;
    right: 0;
    bottom: 0;
    width: min(37vw, 680px);
    overflow: auto;
    border-left: 1px solid #e4e8ef;
    color: #17243a;
    background: #fff;
    box-shadow: -18px 0 42px rgba(18, 35, 62, .12);
    scrollbar-width: thin;
  }

  body.desktop-page .desktop-app .management-detail-header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(220px, 44%) 1fr;
    gap: 18px;
    padding: 22px 24px 14px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .management-detail-close {
    position: absolute;
    z-index: 2;
    top: 10px;
    right: 12px;
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #5e6674;
    background: rgba(255,255,255,.92);
    box-shadow: 0 4px 14px rgba(10,25,50,.1);
    font-size: 27px;
    font-weight: 300;
    cursor: pointer;
  }

  body.desktop-page .desktop-app .management-detail-hero {
    height: 164px;
    overflow: hidden;
    border-radius: 10px;
    background: #f1f3f6;
  }

  body.desktop-page .desktop-app .management-detail-hero img,
  body.desktop-page .desktop-app .management-detail-placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  body.desktop-page .desktop-app .management-detail-placeholder {
    display: grid;
    place-items: center;
    color: #9ba4b2;
    font-size: 28px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .management-detail-heading {
    min-width: 0;
    align-self: center;
  }

  body.desktop-page .desktop-app .management-detail-heading > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }

  body.desktop-page .desktop-app .management-detail-heading h2 {
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    color: #14223a;
    font-size: 22px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .management-detail-heading > div > strong {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    padding: 3px 9px;
    border-radius: 999px;
    color: #21824b;
    background: #eaf8ef;
    font-size: 11px;
  }

  body.desktop-page .desktop-app .management-detail-heading > div > strong.status-reserved {
    color: #a96814;
    background: #fff3dd;
  }

  body.desktop-page .desktop-app .management-detail-heading p {
    margin: 9px 0 2px;
    color: #697386;
    font-size: 12px;
    font-weight: 700;
  }

  body.desktop-page .desktop-app .management-detail-heading p i {
    color: #cbd1da;
    font-style: normal;
  }

  body.desktop-page .desktop-app .management-detail-heading .management-certification {
    width: 70px;
    min-height: 70px;
    margin-top: 10px;
    padding: 0;
  }

  body.desktop-page .desktop-app .management-detail-heading .management-certification > i {
    width: 68px;
    height: 68px;
  }

  body.desktop-page .desktop-app .management-detail-thumbs {
    display: flex;
    gap: 9px;
    min-height: 62px;
    padding: 0 24px 14px;
    overflow-x: auto;
  }

  body.desktop-page .desktop-app .management-detail-thumbs button {
    width: 70px;
    height: 54px;
    flex: 0 0 70px;
    overflow: hidden;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 7px;
    background: #eef1f5;
    cursor: pointer;
  }

  body.desktop-page .desktop-app .management-detail-thumbs button.active {
    border-color: #bf8527;
  }

  body.desktop-page .desktop-app .management-detail-thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  body.desktop-page .desktop-app .management-detail-thumbs > span {
    align-self: center;
    color: #9ba4b2;
    font-size: 12px;
  }

  body.desktop-page .desktop-app .management-detail-actions {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    padding: 14px 20px;
    border-top: 1px solid #edf0f4;
    border-bottom: 1px solid #edf0f4;
    background: #fbfcfe;
  }

  body.desktop-page .desktop-app .management-detail-actions button {
    display: grid;
    min-width: 0;
    min-height: 66px;
    place-items: center;
    gap: 4px;
    padding: 8px 3px;
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    color: #4e5d72;
    background: #fff;
    font-size: 10px;
    font-weight: 850;
    cursor: pointer;
  }

  body.desktop-page .desktop-app .management-detail-actions button i {
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    color: #1e66b4;
    font-size: 20px;
    font-style: normal;
  }

  body.desktop-page .desktop-app .management-detail-actions button svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  body.desktop-page .desktop-app .management-detail-actions button.repair i { color: #c47e16; }
  body.desktop-page .desktop-app .management-detail-actions button.public i { color: #9a6a24; }
  body.desktop-page .desktop-app .management-detail-actions button.info i { color: #276cae; }
  body.desktop-page .desktop-app .management-detail-actions button.photos i { color: #3c76aa; }
  body.desktop-page .desktop-app .management-detail-actions button.deposit i { color: #168256; }
  body.desktop-page .desktop-app .management-detail-actions button.sell i { color: #7040a5; }
  body.desktop-page .desktop-app .management-detail-actions button.delete { color: #c53131; background: #fff7f7; }
  body.desktop-page .desktop-app .management-detail-actions button.delete i { color: #c53131; }

  body.desktop-page .desktop-app .management-detail-section {
    padding: 18px 24px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .management-detail-section h3 {
    margin: 0 0 13px;
    color: #26354c;
    font-size: 15px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .management-detail-publish {
    display: grid;
    grid-template-columns: 1fr 90px;
    align-items: center;
    margin-bottom: 14px;
    font-size: 12px;
    font-weight: 750;
  }

  body.desktop-page .desktop-app .management-detail-publish strong {
    padding: 7px 10px;
    border-radius: 5px;
    text-align: center;
  }

  body.desktop-page .desktop-app .management-detail-publish strong.on { color: #8a5a12; background: #dba233; }
  body.desktop-page .desktop-app .management-detail-publish strong.off { color: #697386; background: #eef1f5; }

  body.desktop-page .desktop-app .management-detail-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 14px;
  }

  body.desktop-page .desktop-app .management-detail-fields label {
    display: grid;
    grid-template-columns: 76px 1fr;
    align-items: center;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid #e7ebf1;
    border-radius: 6px;
    background: #fff;
  }

  body.desktop-page .desktop-app .management-detail-fields span {
    color: #6e7786;
    font-size: 11px;
    font-weight: 700;
  }

  body.desktop-page .desktop-app .management-detail-fields strong {
    overflow: hidden;
    color: #24344d;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .management-detail-tags .management-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0;
  }

  body.desktop-page .desktop-app .management-detail-description {
    margin: 14px 0 0;
    padding: 12px 14px;
    border-radius: 8px;
    color: #4c596c;
    background: #f7f9fc;
    font-size: 12px;
    line-height: 1.65;
    white-space: pre-wrap;
  }

  body.desktop-page .desktop-app .management-detail-description.muted { color: #9aa3b0; }

  body.desktop-page .desktop-app .management-detail-footer {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 16px 24px 26px;
    background: #fbfcfe;
  }

  body.desktop-page .desktop-app .management-detail-footer span {
    display: block;
    padding: 0 12px;
    text-align: center;
  }

  body.desktop-page .desktop-app .management-detail-footer span + span {
    border-left: 1px solid #e4e8ee;
  }

  body.desktop-page .desktop-app .management-detail-footer small,
  body.desktop-page .desktop-app .management-detail-footer strong {
    display: block;
  }

  body.desktop-page .desktop-app .management-detail-footer small {
    color: #8992a0;
    font-size: 10px;
  }

  body.desktop-page .desktop-app .management-detail-footer strong {
    margin-top: 5px;
    color: #1b2b44;
    font-size: 13px;
  }

  @media (max-width: 1320px) {
    body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
      padding-right: 37vw;
    }
    body.desktop-page .desktop-app .inventory-management-detail {
      width: 37vw;
    }
    body.desktop-page .desktop-app .management-detail-actions {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
}

/* Extensible employee coin wallet and shop. */
body.desktop-page .desktop-app .account-card {
  width: 310px;
  grid-template-columns: auto minmax(0,1fr) auto;
}
body.desktop-page .desktop-app .main-tabs { right:342px; }
body.desktop-page .desktop-app .account-card .coin-wallet-button {
  display:grid;
  width:auto;
  min-width:78px;
  height:34px;
  grid-template-columns:18px auto;
  grid-template-rows:14px 13px;
  column-gap:5px;
  align-items:center;
  padding:2px 10px;
  border:1px solid #dfc58e;
  border-radius:999px;
  color:#885b16;
  background:#fff;
  box-shadow:0 4px 12px rgba(136,91,22,.08);
}

body.desktop-page .desktop-app .account-card .coin-wallet-button svg { grid-row:1/3; width:18px; height:18px; fill:#f7e3a5; stroke:#9a6819; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
body.desktop-page .desktop-app .account-card .coin-wallet-button span { margin:0; color:#a08768; font-size:8px; line-height:1; text-align:left; }
body.desktop-page .desktop-app .account-card .coin-wallet-button strong { color:#8b5b12; font-size:12px; line-height:1; text-align:left; }
.coin-panel-host { position:fixed; inset:0; z-index:10000; font-family:inherit; }
.coin-panel-backdrop { position:absolute; inset:0; background:rgba(17,21,28,.28); backdrop-filter:blur(2px); }
.coin-panel-card { position:absolute; top:76px; right:20px; display:flex; width:min(480px,calc(100vw - 32px)); height:min(620px,calc(100vh - 96px)); max-height:calc(100vh - 96px); flex-direction:column; overflow:hidden; border:1px solid #eadbc2; border-radius:20px; color:#282116; background:#fffdf9; box-shadow:0 24px 70px rgba(28,22,13,.24); }
.coin-panel-card > header { display:flex; min-height:82px; align-items:center; justify-content:space-between; padding:16px 18px; color:#fff; background:linear-gradient(125deg,#6f4714,#c8953e); }
.coin-panel-card > header > div { display:flex; gap:11px; align-items:center; }
.coin-panel-card > header > div > span { display:grid; width:44px; height:44px; place-items:center; border-radius:50%; background:rgba(255,255,255,.16); }
.coin-panel-card > header svg { width:27px; height:27px; fill:#f8dfa0; stroke:#fff3d0; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.coin-panel-card > header p { margin:0; color:#f8ead1; font-size:12px; }
.coin-panel-card > header p strong { display:block; margin-top:3px; color:#fff; font-size:27px; line-height:1; }
.coin-panel-card > header > button { width:34px; height:34px; border:1px solid rgba(255,255,255,.35); border-radius:50%; color:#fff; background:rgba(255,255,255,.08); font-size:24px; cursor:pointer; }
.coin-lifetime { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid #eee4d5; background:#fff8eb; }
.coin-lifetime span { padding:10px 18px; color:#8f816d; font-size:11px; }
.coin-lifetime span + span { border-left:1px solid #eee4d5; }
.coin-lifetime b { margin-left:5px; color:#7c5318; font-size:13px; }
.coin-panel-card > nav { display:grid; grid-template-columns:1fr 1fr; padding:10px 14px 0; border-bottom:1px solid #eee5d8; background:#fff; }
.coin-panel-card > nav button { position:relative; height:40px; border:0; color:#8c8375; background:transparent; font-size:13px; font-weight:800; cursor:pointer; }
.coin-panel-card > nav button.active { color:#986616; }
.coin-panel-card > nav button.active::after { content:""; position:absolute; right:18px; bottom:0; left:18px; height:3px; border-radius:4px; background:#bf862c; }
.coin-panel-content { min-height:0; flex:1 1 auto; overflow:auto; padding:12px 14px 16px; background:#fffdf9; }
.coin-history-item { display:grid; grid-template-columns:38px 1fr auto; gap:10px; min-height:64px; align-items:center; padding:8px 5px; border-bottom:1px solid #f0e8dc; }
.coin-history-icon { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:#fff1ce; }
.coin-history-icon svg { width:20px; height:20px; fill:#f7dfa0; stroke:#a66d17; stroke-width:1.6; }
.coin-history-item > div strong,.coin-history-item > div small,.coin-history-item > p small { display:block; }
.coin-history-item > div strong { color:#3c3327; font-size:13px; }
.coin-history-item small { margin-top:3px; color:#9e9589; font-size:10px; }
.coin-history-item > div .coin-history-vehicle { overflow:hidden; color:#8a5c16; font-size:11px; font-weight:800; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
.coin-history-item > p { margin:0; text-align:right; }
.coin-history-item > p b { color:#23865f; font-size:15px; }
.coin-history-item.spend > p b { color:#bd5b42; }
.coin-empty { display:grid; min-height:230px; place-content:center; justify-items:center; color:#978b7a; text-align:center; }
.coin-empty > span { display:grid; width:58px; height:58px; place-items:center; margin-bottom:12px; border-radius:50%; background:#fff1d0; }
.coin-empty svg { width:32px; height:32px; fill:#f5dc9c; stroke:#aa741f; stroke-width:1.5; }
.coin-empty strong { color:#6f5b3d; font-size:16px; }
.coin-empty p { max-width:280px; margin:7px 0 0; font-size:11px; line-height:1.6; }
.coin-shop-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.coin-shop-item { overflow:hidden; border:1px solid #eadfce; border-radius:13px; background:#fff; }
.coin-shop-image { display:grid; height:94px; place-items:center; overflow:hidden; background:linear-gradient(145deg,#fff7e6,#f4e6c8); }
.coin-shop-image img { width:100%; height:100%; object-fit:cover; }
.coin-shop-image svg { width:38px; height:38px; fill:#f3d78c; stroke:#9c6818; stroke-width:1.4; }
.coin-shop-item > strong,.coin-shop-item > p { display:block; margin-right:10px; margin-left:10px; }
.coin-shop-item > strong { margin-top:9px; color:#463a2a; font-size:13px; }
.coin-shop-item > p { min-height:30px; margin-top:4px; margin-bottom:7px; color:#948878; font-size:10px; line-height:1.45; }
.coin-shop-item footer { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; border-top:1px solid #f0e7da; }
.coin-shop-item footer span { display:flex; gap:4px; align-items:center; color:#996315; font-size:12px; font-weight:900; }
.coin-shop-item footer svg { width:16px; height:16px; fill:#f5d984; stroke:#9c6818; stroke-width:1.5; }
.coin-shop-item footer button { height:28px; padding:0 12px; border:0; border-radius:999px; color:#fff; background:#ac7420; font-size:11px; font-weight:800; cursor:pointer; }
.coin-shop-item footer button:disabled { color:#a79d90; background:#eee8df; cursor:not-allowed; }
.coin-shop-grid { grid-template-columns:1fr; gap:9px; }
.coin-shop-item { display:grid; min-height:78px; grid-template-columns:76px minmax(0,1fr); grid-template-rows:auto auto auto; grid-template-areas:"image title" "image description" "image actions"; align-items:stretch; }
.coin-shop-image { grid-area:image; width:76px; height:100%; min-height:78px; border-right:1px solid #f0e7da; }
.coin-shop-item > strong { grid-area:title; align-self:end; margin:7px 10px 0; overflow:hidden; font-size:13px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.coin-shop-item > p { grid-area:description; min-height:0; margin:2px 10px 3px; overflow:hidden; color:#8b806f; font-size:10px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.coin-shop-item footer { grid-area:actions; min-width:0; padding:5px 10px; }
.coin-shop-item footer span { min-width:0; font-size:13px; }
.coin-shop-item footer button { min-width:58px; height:27px; padding:0 10px; }
.coin-redemption-note { padding:9px 16px; border-top:1px solid #eee4d5; color:#918675; background:#fff9ef; font-size:10px; text-align:center; }
@media (max-width:1320px) and (min-width:900px) {
  body.desktop-page .desktop-app .account-card { width:276px; }
  body.desktop-page .desktop-app .main-tabs { right:300px; }
  body.desktop-page .desktop-app .account-card .coin-wallet-button { min-width:68px; padding-right:7px; padding-left:7px; }
}
@media (max-width:700px) {
  .coin-panel-card { top:10px; right:10px; height:min(680px,calc(100svh - 20px)); max-height:calc(100svh - 20px); }
  .coin-shop-grid { grid-template-columns:1fr; }
  .coin-shop-item { grid-template-columns:70px minmax(0,1fr); }
  .coin-shop-image { width:70px; }
}

@media (max-width: 720px) {.desktop-app .toolbar-card.backoffice-toolbar,
.desktop-app .backoffice-toolbar {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px;
    width: 100% !important;
  }.desktop-app .backoffice-toolbar button {
    width: 100% !important;
    min-width: 0 !important;
    height: 36px;
    padding: 0 6px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.1;
    white-space: nowrap;
  }
}.desktop-app .backoffice-form-actions {
  display: flex;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] {
  display: grid;
  width: 100%;
  max-width: none;
  justify-self: stretch;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > .page-title-strip,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > .backoffice-inline-form,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-repair-master-form] {
  grid-column: 1 / -1;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-contact-panel="sponsor"],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-contact-panel="shareholder"],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-accounts],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-repair-masters],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-loan-agents],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-colors] {
  grid-column: span 6;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-watch-permissions] {
  grid-column: 1 / -1;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-masters] {
  grid-column: 1 / -1;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .page-title-strip {
  min-height: 94px;
  margin: 0 0 2px;
  padding: 20px 26px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(38, 46, 58, .06);
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-title-strip > div {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 18px;
  align-items: center;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-title-strip p {
  grid-column: 1;
  grid-row: 2;
  margin: 0;
  color: #9c7742;
  font-size: 10px;
  letter-spacing: .16em;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-title-strip h1 {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  color: #172033;
  font-size: 24px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-title-strip span {
  grid-column: 2;
  grid-row: 1 / 3;
  color: #7e8898;
  font-size: 12px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-toolbar {
  display: flex;
  width: 100%;
  gap: 10px;
  padding: 12px;
  border-radius: 14px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-toolbar button {
  flex: 1 1 150px;
  min-width: 132px;
  max-width: 220px;
  height: 40px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card {
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(38, 46, 58, .055);
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .permission-list {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] [data-account-list] {
  grid-template-columns: 1fr;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] [data-watch-permission-list] {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] [data-watch-permission-list] .backoffice-watch-access-picker {
  grid-column: 1 / -1;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] [data-repair-master-list] {
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] [data-repair-master-list] .backoffice-master-group:first-child {
  grid-row: auto;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] [data-repair-master-list] .backoffice-repair-master-panel:first-child {
  grid-row: auto;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-master-group {
  min-height: 190px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-master-panel {
  min-height: 0;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-browser {
  height: 100%;
  align-content: start;
  grid-template-columns: minmax(0, 1fr);
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-vendor-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-vendor-tabs button {
  width: 100%;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-detail-panel header {
  align-items: center;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-detail-items {
  align-content: start;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-card {
  display: grid;
  gap: 14px;
  width: 100%;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  width: 100%;
  min-width: 0;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-panel,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-model-panel {
  width: 100%;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-panel {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(207, 216, 230, 0.9);
  border-radius: 14px;
  background: #f8fafc;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tabs article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 10px 12px;
  align-items: start;
  min-width: 0;
  min-height: 76px;
  padding: 12px;
  border: 1px solid rgba(191, 204, 224, 0.95);
  border-radius: 12px;
  background: #fff;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tabs article.selected {
  border-color: #d99a22;
  background: #fff8e8;
  box-shadow: 0 8px 18px rgba(217, 154, 34, 0.12);
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tab {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #071225;
  text-align: left;
  cursor: pointer;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tab strong,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tab span {
  min-width: 0;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  word-break: break-word;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tab strong {
  font-size: 14px;
  font-weight: 950;
  line-height: 1.25;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-tab span {
  color: #526784;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.35;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  align-self: start;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-actions button,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > div button {
  min-width: 56px;
  height: 30px;
  padding: 0 12px;
  border: 1px solid #d8b16b;
  border-radius: 999px;
  background: #fffaf1;
  color: #071225;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 3px 9px rgba(154, 103, 20, 0.08);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-actions button:hover,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > div button:hover {
  background: #fff3d8;
  border-color: #c88712;
  box-shadow: 0 6px 14px rgba(154, 103, 20, 0.14);
  transform: translateY(-1px);
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-actions button[data-sql-repair-master-delete-id],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > div button[data-sql-repair-master-delete-id] {
  border-color: #ffb6b6;
  background: #fff6f6;
  color: #e11d48;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-brand-actions button[data-sql-repair-master-delete-id]:hover,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > div button[data-sql-repair-master-delete-id]:hover {
  border-color: #fb7185;
  background: #fff1f2;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 8px 12px;
  align-items: start;
  min-height: 70px;
  padding: 12px;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > strong,
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > span {
  min-width: 0;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  word-break: break-word;
  line-height: 1.35;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-list article > div {
  grid-row: 1 / span 2;
  grid-column: 2;
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  align-self: start;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-master-group > .backoffice-master-list:not(.backoffice-repair-tree) {
  align-content: start;
}

@media (max-width: 1280px) {body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-contact-panel="sponsor"],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-contact-panel="shareholder"],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-accounts],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-repair-masters],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-watch-permissions],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-masters],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-loan-agents],
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-colors] {
    grid-column: 1 / -1;
  }body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-vehicle-master-grid {
    grid-template-columns: minmax(0, 1fr);
  }body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-browser {
    grid-template-columns: minmax(0, 1fr);
  }
}.desktop-app .toolbar-card input {
  width: 100%;
}.desktop-app .status-tabs {
  grid-template-columns: repeat(5, minmax(118px, 1fr));
}.desktop-app .view-tabs {
  grid-column: 1 / -1;
}.desktop-app .sold-filter-grid {
  width: 100%;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
}.desktop-app .page[data-panel="sold"] .sold-title-search {
  width: 100%;
  height: 42px;
  padding: 0 16px;
  border: 1px solid #cfd8e6;
  border-radius: 3px;
  background: #ffffff;
  color: #172033;
  font-size: 14px;
  font-weight: 800;
}.desktop-app .page[data-panel="sold"] .sold-search-card {
  width: min(347px, 100%);
  margin: 12px 0 0 auto;
  grid-template-columns: minmax(0, 1fr);
}.desktop-app .page[data-panel="sold"] .sold-control-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}.desktop-app .page[data-panel="sold"] .sold-control-row select,
.desktop-app .page[data-panel="sold"] .sold-sort-control select {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border: 1px solid #cad6e6;
  border-radius: 4px;
  background: #ffffff;
  color: #172033;
  font-size: 14px;
  font-weight: 850;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid,
.desktop-app .page[data-panel="sold"] .sold-summary-grid,
.page[data-panel="sold"] .sold-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card,
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card,
.page[data-panel="sold"] .sold-summary-grid .metric-card {
  --sold-accent: #2f7df1;
  --sold-accent-soft: #eaf2ff;
  --sold-accent-glow: rgba(47, 125, 241, 0.16);
  position: relative;
  min-height: 118px;
  padding: 18px 20px 16px;
  overflow: hidden;
  border: 1px solid rgba(189, 205, 226, 0.9);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 251, 255, 0.96) 100%),
    linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--sold-accent-soft) 100%);
  box-shadow: 0 16px 36px rgba(17, 31, 52, 0.07);
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card::before,
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card::before,
.page[data-panel="sold"] .sold-summary-grid .metric-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--sold-accent), rgba(255, 255, 255, 0));
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card::after,
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card::after,
.page[data-panel="sold"] .sold-summary-grid .metric-card::after {
  content: "";
  position: absolute;
  top: -34px;
  right: -30px;
  width: 104px;
  height: 104px;
  border-radius: 999px;
  background: var(--sold-accent-glow);
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(2),
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(2),
.page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(2) {
  --sold-accent: #16a667;
  --sold-accent-soft: #eefbf5;
  --sold-accent-glow: rgba(22, 166, 103, 0.16);
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(3),
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(3),
.page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(3) {
  --sold-accent: #8756df;
  --sold-accent-soft: #f4efff;
  --sold-accent-glow: rgba(135, 86, 223, 0.16);
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(4),
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(4),
.page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(4) {
  --sold-accent: #ff8a1f;
  --sold-accent-soft: #fff4e8;
  --sold-accent-glow: rgba(255, 138, 31, 0.18);
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card span,
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card span,
.page[data-panel="sold"] .sold-summary-grid .metric-card span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  color: #173253;
  font-size: 13px;
  font-weight: 900;
  background: var(--sold-accent-soft);
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card strong,
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card strong,
.page[data-panel="sold"] .sold-summary-grid .metric-card strong {
  position: relative;
  z-index: 1;
  margin-top: 10px;
  color: #061226;
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: 0;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card small,
.desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card small,
.page[data-panel="sold"] .sold-summary-grid .metric-card small {
  position: relative;
  z-index: 1;
  margin-top: 8px;
  color: #526984;
  font-size: 13px;
  font-weight: 800;
}.desktop-app .page[data-panel="sold"] .sold-view-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 6px 0 16px;
}.desktop-app .page[data-panel="sold"] .sold-view-toolbar .view-tabs {
  flex: 1 1 auto;
}.desktop-app .page[data-panel="sold"] .sold-sort-control {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #48617d;
  font-size: 14px;
  font-weight: 850;
  white-space: nowrap;
}.desktop-app .page[data-panel="sold"] .sold-sort-control select {
  width: 190px;
  height: 42px;
}.desktop-app .page[data-panel="ranking"] .sold-filter-grid {
  width: 100%;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  margin: 0 0 18px;
  padding: 16px;
}body.desktop-page .desktop-app .page[data-panel="ranking"] > .metric-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 0 0 18px;
}body.desktop-page .desktop-app .page[data-panel="ranking"] > .metric-grid .metric-card {
  align-content: start;
  min-height: 112px;
  padding: 9px 15px 18px;
  border-radius: 14px;
}body.desktop-page .desktop-app .page[data-panel="ranking"] > .metric-grid .metric-card span {
  width: fit-content;
  min-height: 28px;
  margin: 0 0 12px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 950;
}body.desktop-page .desktop-app .page[data-panel="ranking"] > .metric-grid .metric-card strong {
  font-size: 30px;
  line-height: 1.05;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-board,
.page[data-panel="ranking"] .ranking-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 0;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card,
.page[data-panel="ranking"] .ranking-card {
  min-height: 0;
  margin-top: 0;
  padding: 18px;
  overflow: visible;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 14px 36px rgba(17, 31, 52, 0.08);
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card-head,
.page[data-panel="ranking"] .ranking-card-head {
  display: grid;
  gap: 0;
  margin: 0 0 14px;
  min-height: 42px;
  align-items: center;
  padding: 0 16px;
  border: 1px solid rgba(30, 95, 199, 0.24);
  border-radius: 12px;
  background: linear-gradient(135deg, #edf6ff 0%, #dbeafe 100%);
  box-shadow: inset 3px 0 0 #2f7dea;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card-head h2,
.page[data-panel="ranking"] .ranking-card-head h2 {
  display: inline-flex;
  width: fit-content;
  min-height: 0;
  align-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #1354b8;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
  box-shadow: none;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card-head p,
.page[data-panel="ranking"] .ranking-card-head p {
  display: none;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card:nth-child(2) .ranking-card-head,
.page[data-panel="ranking"] .ranking-card:nth-child(2) .ranking-card-head {
  border-color: rgba(255, 138, 24, 0.28);
  background: linear-gradient(135deg, #fff4df 0%, #ffe2bd 100%);
  box-shadow: inset 3px 0 0 #ff8a18;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card:nth-child(2) .ranking-card-head h2,
.page[data-panel="ranking"] .ranking-card:nth-child(2) .ranking-card-head h2 {
  color: #bb5508;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card:nth-child(3) .ranking-card-head,
.page[data-panel="ranking"] .ranking-card:nth-child(3) .ranking-card-head {
  border-color: rgba(239, 68, 68, 0.25);
  background: linear-gradient(135deg, #fff0f1 0%, #ffe0e6 100%);
  box-shadow: inset 3px 0 0 #ef4444;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-card:nth-child(3) .ranking-card-head h2,
.page[data-panel="ranking"] .ranking-card:nth-child(3) .ranking-card-head h2 {
  color: #c6283d;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list,
.page[data-panel="ranking"] .ranking-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list li,
.page[data-panel="ranking"] .ranking-list li {
  position: relative;
  display: grid;
  min-height: 62px;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #dce4ee;
  border-radius: 12px;
  background: #ffffff;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list li.mine,
.page[data-panel="ranking"] .ranking-list li.mine {
  border-color: #ff9f36;
  background: #fffaf2;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list b,
.page[data-panel="ranking"] .ranking-list b {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 50%;
  background: #f1f5f9;
  color: #071225;
  font-size: 12px;
  font-weight: 950;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list li:nth-child(1) b,
body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list li.mine b,
.page[data-panel="ranking"] .ranking-list li:nth-child(1) b,
.page[data-panel="ranking"] .ranking-list li.mine b {
  background: #ff8a1c;
  color: #ffffff;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list li:nth-child(3) b,
.page[data-panel="ranking"] .ranking-list li:nth-child(3) b {
  background: #2ec3df;
  color: #ffffff;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list strong,
.page[data-panel="ranking"] .ranking-list strong {
  display: block;
  margin-bottom: 5px;
  overflow: hidden;
  color: #071225;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list small,
.page[data-panel="ranking"] .ranking-list small {
  color: #2f547b;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.2;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list li > span,
.page[data-panel="ranking"] .ranking-list li > span {
  display: grid;
  justify-items: end;
  gap: 5px;
  min-width: 82px;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list em,
.page[data-panel="ranking"] .ranking-list em {
  color: #00112d;
  font-size: 18px;
  font-style: normal;
  font-weight: 950;
  line-height: 1;
}body.desktop-page .desktop-app .page[data-panel="ranking"] .ranking-list i,
.page[data-panel="ranking"] .ranking-list i {
  position: absolute;
  top: -7px;
  right: 10px;
  min-width: 50px;
  height: 18px;
  display: grid;
  place-items: center;
  padding: 0 7px;
  border-radius: 999px;
  background: #ff7a1a;
  color: #ffffff;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  line-height: 1;
}.desktop-app .page[data-panel="inventory"] .filter-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(214, 198, 176, 0.74);
  border-radius: 14px;
  background:
    linear-gradient(180deg, #fffaf2 0%, #f6efe4 100%),
    #fffaf2;
  box-shadow: 0 14px 32px rgba(69, 45, 22, 0.08);
}.desktop-app .page[data-panel="inventory"] .status-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  min-width: 0;
  gap: 4px;
  padding: 0 0 12px;
  border-bottom: 1px solid rgba(214, 198, 176, 0.72);
  overflow: visible;
}.desktop-app .page[data-panel="inventory"] .status-tabs button {
  position: relative;
  display: inline-flex;
  width: 100%;
  min-width: 0;
  height: 34px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 0 12px;
  border: 1px solid rgba(196, 174, 141, 0.58);
  border-radius: 0;
  background:
    linear-gradient(180deg, #fffdf8 0%, #f6eee1 100%),
    #fffaf2;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 5px 12px rgba(75, 50, 22, 0.06);
  color: #18243a;
  font-size: 13px;
  font-weight: 900;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}.desktop-app .page[data-panel="inventory"] .status-tabs button::after {
  position: absolute;
  top: 5px;
  right: -2px;
  width: 18px;
  height: 1px;
  background: rgba(196, 174, 141, 0.78);
  content: "";
  pointer-events: none;
  transform: rotate(45deg);
  transform-origin: center;
}.desktop-app .page[data-panel="inventory"] .status-tabs button.active {
  border-color: rgba(151, 99, 27, 0.82);
  background:
    linear-gradient(180deg, #f8d98a 0%, #d7a13b 56%, #b77a1d 100%),
    #d8a340;
  color: #071225;
  box-shadow:
    0 9px 16px rgba(117, 72, 18, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.36),
    inset 0 -3px 0 rgba(93, 58, 16, 0.5);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.active::after {
  background: rgba(151, 99, 27, 0.9);
}.desktop-app .page[data-panel="inventory"] .status-tabs button i {
  display: none;
}.desktop-app .page[data-panel="inventory"] .status-tabs .all::before { background: #2f64d8; }.desktop-app .page[data-panel="inventory"] .status-tabs .stock::before { background: #15946a; }.desktop-app .page[data-panel="inventory"] .status-tabs .delivery::before { background: #7c4de8; }.desktop-app .page[data-panel="inventory"] .status-tabs .repair::before { background: #64748b; }.desktop-app .page[data-panel="inventory"] .status-tabs .deposit::before { background: #b77216; }.desktop-app .page[data-panel="inventory"] .status-tabs button.all {
  --status-tab-border: rgba(183, 114, 22, 0.68);
  --status-tab-bg: linear-gradient(180deg, #f8d98a 0%, #d7a13b 56%, #b77a1d 100%);
  --status-tab-text: #071225;
  --status-tab-shadow: rgba(117, 72, 18, 0.18);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.stock {
  --status-tab-border: rgba(21, 148, 106, 0.66);
  --status-tab-bg: linear-gradient(180deg, #e8fff1 0%, #b9f3cd 58%, #34c182 100%);
  --status-tab-text: #064e3b;
  --status-tab-shadow: rgba(21, 148, 106, 0.18);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.delivery {
  --status-tab-border: rgba(124, 77, 232, 0.62);
  --status-tab-bg: linear-gradient(180deg, #f4efff 0%, #ddd2ff 58%, #9b7af2 100%);
  --status-tab-text: #32146d;
  --status-tab-shadow: rgba(124, 77, 232, 0.2);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.repair {
  --status-tab-border: rgba(37, 99, 235, 0.6);
  --status-tab-bg: linear-gradient(180deg, #eef6ff 0%, #cfe4ff 58%, #6ea5ef 100%);
  --status-tab-text: #123b7a;
  --status-tab-shadow: rgba(37, 99, 235, 0.18);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.deposit {
  --status-tab-border: rgba(183, 114, 22, 0.62);
  --status-tab-bg: linear-gradient(180deg, #fff7e8 0%, #ffd89a 58%, #d08a28 100%);
  --status-tab-text: #5b2d05;
  --status-tab-shadow: rgba(183, 114, 22, 0.18);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.active {
  border-color: var(--status-tab-border);
  background: var(--status-tab-bg);
  color: var(--status-tab-text);
  box-shadow:
    0 9px 16px var(--status-tab-shadow),
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 0 -3px 0 rgba(7, 18, 37, 0.22);
}.desktop-app .page[data-panel="inventory"] .status-tabs button.active::after {
  background: var(--status-tab-border);
}.desktop-app .page[data-panel="inventory"] .view-tabs {
  display: flex;
  gap: 8px;
  padding-top: 0;
}.desktop-app .page[data-panel="inventory"] .view-tabs button {
  min-width: 0;
  height: 36px;
  padding: 0 14px;
  border: 1px solid rgba(196, 174, 141, 0.58);
  border-radius: 999px;
  background:
    linear-gradient(180deg, #fffdf8 0%, #f6eee1 100%),
    #fffaf2;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 6px 12px rgba(75, 50, 22, 0.06);
  color: #18243a;
  font-size: 14px;
  font-weight: 900;
}.desktop-app .page[data-panel="inventory"] .view-tabs button.active {
  border-color: rgba(151, 99, 27, 0.82);
  background:
    linear-gradient(180deg, #f8d98a 0%, #d7a13b 56%, #b77a1d 100%),
    #d8a340;
  color: #071225;
  box-shadow:
    0 9px 16px rgba(117, 72, 18, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.36),
    inset 0 -3px 0 rgba(93, 58, 16, 0.5);
}.desktop-app .vehicle-list,
.desktop-app .sold-list {
  width: 100%;
}.desktop-app .vehicle-list[data-view="card"] {
  display: grid;
  grid-template-columns: 1fr;
  justify-items: stretch;
  width: 100%;
  margin: 0;
  gap: 10px;
}.desktop-app .sold-list[data-view="card"] {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}.desktop-app .vehicle-card,
.desktop-app .sold-card {
  min-width: 0;
}.desktop-app .vehicle-list[data-view="card"] .vehicle-card,
.desktop-app .sold-list[data-view="card"] .sold-card {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr) minmax(170px, 260px) 84px;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045);
}.desktop-app .vehicle-list[data-view="card"] .vehicle-card {
  width: 100%;
  grid-template-columns: 112px minmax(420px, 1fr) minmax(132px, 150px) max-content;
}.desktop-app .sold-list[data-view="card"] .sold-card {
  grid-template-columns: 132px minmax(0, 1fr) minmax(160px, 280px) 72px;
  min-height: 146px;
  gap: 14px;
  padding: 14px;
  border: 1px solid #dbe4ef;
  border-radius: 12px;
}.desktop-app .vehicle-list[data-view="card"] .vehicle-card > img,
.desktop-app .vehicle-list[data-view="card"] .vehicle-placeholder,
.desktop-app .sold-list[data-view="card"] .sold-thumb {
  width: 109px;
  height: 88px;
  border: 1px solid #dbe4ec;
  border-radius: 10px;
  object-fit: cover;
}.desktop-app .sold-list[data-view="card"] .sold-thumb {
  width: 132px;
  height: 112px;
  align-self: stretch;
}.desktop-app .vehicle-info,
.desktop-app .sold-info {
  display: grid;
  min-width: 0;
  gap: 8px;
}.desktop-app .vehicle-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}.desktop-app .vehicle-title-row h2,
.desktop-app .sold-card h2 {
  margin: 0;
  overflow: hidden;
  color: #1f2933;
  font-size: 20px;
  font-weight: 950;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .sold-list[data-view="card"] .sold-card h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 22px;
}.desktop-app .sold-title-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .sold-rating {
  display: inline-grid;
  flex: 0 0 auto;
  min-width: 46px;
  height: 22px;
  place-items: center;
  padding: 0 10px;
  border-radius: 999px;
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0;
}.desktop-app .sold-rating.gold {
  background: linear-gradient(135deg, #58420a, #c39a16);
  box-shadow: 0 8px 16px rgba(137, 94, 0, 0.22);
}.desktop-app .sold-rating.violet {
  background: linear-gradient(135deg, #4a20a8, #8a55ff);
}.desktop-app .sold-rating.orange {
  background: linear-gradient(135deg, #d85f12, #ff9a1a);
}.desktop-app .vehicle-info > p,
.desktop-app .sold-info > p {
  margin: 0;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}.desktop-app .sold-meta-line i {
  color: #8da0b6;
  font-style: normal;
  padding: 0 8px;
}.desktop-app .sold-extra-line {
  color: #4b6078;
  font-size: 12px;
  font-weight: 850;
}.desktop-app .vehicle-card .vehicle-stats,
.desktop-app .sold-grid {
  display: grid;
  max-width: 420px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
}.desktop-app .sold-list[data-view="card"] .sold-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 410px;
}.desktop-app .vehicle-stats b,
.desktop-app .sold-grid span {
  min-height: 49px;
  display: grid;
  align-content: center;
  padding: 7px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
  color: #172033;
  font-size: 14px;
  font-weight: 950;
  text-align: center;
}.desktop-app .sold-list[data-view="card"] .sold-grid span {
  min-height: 46px;
  padding: 6px 4px;
  border-radius: 7px;
  background: #fbfdff;
}.desktop-app .vehicle-stats span,
.desktop-app .sold-grid span {
  color: #475569;
  font-size: 11px;
  font-weight: 800;
}.desktop-app .sold-grid b {
  color: #172033;
  font-size: 14px;
}.desktop-app .sold-grid .danger-text,
.desktop-app .sold-profit-panel strong {
  color: #dc0000;
}.desktop-app .sold-profit-panel.profit-loss strong {
  color: #15803d;
}.desktop-app .vehicle-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
  margin: 0;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.4;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-info {
  gap: 7px;
  align-self: center;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-title-row {
  align-items: center;
  gap: 8px;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-title-row h2 {
  color: #1d2939;
  font-size: 22px;
  font-weight: 950;
  line-height: 1.08;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-title-row .pill {
  display: inline-grid;
  min-width: 42px;
  height: 24px;
  place-items: center;
  padding: 0 9px;
  border-radius: 5px;
  background: #e7f8db;
  color: #3b8c24;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
}body.desktop-page .desktop-app .vehicle-title-row .pill.status-in-stock {
  border: 1px solid rgba(21, 148, 106, 0.26);
  background: #dcfce7;
  color: #15803d;
}body.desktop-page .desktop-app .vehicle-title-row .pill.status-preparing {
  border: 1px solid rgba(37, 99, 235, 0.26);
  background: #dbeafe;
  color: #1d4ed8;
}body.desktop-page .desktop-app .vehicle-title-row .pill.status-pending-delivery {
  border: 1px solid rgba(124, 77, 232, 0.28);
  background: #ede9fe;
  color: #5b21b6;
}body.desktop-page .desktop-app .vehicle-title-row .pill.status-reserved {
  border: 1px solid rgba(183, 114, 22, 0.3);
  background: #ffedd5;
  color: #9a3412;
}body.desktop-page .desktop-app .vehicle-title-row .pill.status-sold {
  border: 1px solid rgba(180, 35, 24, 0.26);
  background: #ffe5e5;
  color: #b42318;
}body.desktop-page .desktop-app .vehicle-title-row .pill.status-deleted {
  border: 1px solid rgba(75, 85, 99, 0.22);
  background: #e5e7eb;
  color: #4b5563;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-info > p {
  display: flex;
  align-items: center;
  margin: 0;
  color: #53627a;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-info > p i {
  padding: 0 9px;
  color: #96a3b5;
  font-style: normal;
  font-weight: 700;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-card .vehicle-stats {
  max-width: 392px;
  grid-template-columns: repeat(4, 92px);
  gap: 8px;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-stats b {
  min-height: 52px;
  padding: 6px 8px;
  border-color: #dbe4ef;
  border-radius: 7px;
  color: #13223a;
  font-size: 14px;
  font-weight: 950;
  line-height: 1.18;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-stats span {
  margin-bottom: 3px;
  color: #56657b;
  font-size: 11px;
  font-weight: 850;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-meta {
  gap: 0 18px;
  color: #3d4b62;
  font-size: 12px;
  font-weight: 750;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-meta span {
  display: none;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-meta span:nth-child(4),
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-meta span:nth-child(7) {
  display: inline;
}.desktop-app .desktop-status-panel {
  min-height: 88px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  gap: 6px;
  padding-left: 12px;
  border-left: 1px solid #e5e7eb;
  color: #172033;
}.desktop-app .desktop-status-panel span {
  font-size: 14px;
  font-weight: 850;
}.desktop-app .desktop-status-panel strong {
  overflow: hidden;
  color: #111827;
  font-size: 24px;
  font-weight: 950;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .desktop-status-panel small {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}.desktop-app .sold-list[data-view="card"] .sold-profit-panel {
  min-height: 78px;
  padding-left: 14px;
}.desktop-app .sold-list[data-view="card"] .sold-profit-panel span {
  color: #172033;
  font-size: 14px;
}.desktop-app .sold-list[data-view="card"] .sold-profit-panel strong {
  color: #dc0000;
  font-size: 30px;
  letter-spacing: 0;
}.desktop-app .sold-list[data-view="card"] .sold-profit-panel.profit-loss strong {
  color: #15803d;
}.desktop-app .sold-list[data-view="card"] .sold-profit-panel small {
  color: #5d7189;
  font-size: 12px;
}.desktop-app .vehicle-list[data-view="card"] .card-actions {
  grid-column: 4;
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: max-content;
  margin-left: auto;
  align-items: flex-end;
  align-self: center;
  justify-self: end;
}.desktop-app .sold-list[data-view="card"] .card-actions {
  grid-column: auto;
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-items: stretch;
  align-self: center;
  justify-self: end;
}.desktop-app .vehicle-list[data-view="card"] .card-actions button,
.desktop-app .sold-list[data-view="card"] .card-actions button {
  width: 76px;
  min-height: 31px;
  padding: 0;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}.desktop-app .sold-list[data-view="card"] .card-actions {
  gap: 8px;
}.desktop-app .sold-list[data-view="card"] .card-actions button {
  width: 64px;
  min-height: 28px;
  font-size: 11px;
}.desktop-app .sold-list[data-view="card"] .card-actions.sold-card-actions.boss {
  gap: 6px;
}.desktop-app .sold-list[data-view="card"] .card-actions.sold-card-actions.boss button {
  width: 78px;
}.desktop-app .vehicle-list[data-view="compact"],
.desktop-app .sold-list[data-view="compact"] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 12px;
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-card,
.desktop-app .sold-list[data-view="compact"] .sold-card {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px 12px;
  align-items: start;
  min-height: 224px;
  padding: 12px;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}.desktop-app .sold-list[data-view="compact"] .sold-card {
  grid-template-columns: 124px minmax(0, 1fr);
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-card > img,
.desktop-app .vehicle-list[data-view="compact"] .vehicle-placeholder,
.desktop-app .sold-list[data-view="compact"] .sold-thumb {
  width: 92px;
  height: 68px;
  border-radius: 9px;
}.desktop-app .sold-list[data-view="compact"] .sold-thumb {
  width: 124px;
  height: 104px;
  object-fit: cover;
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-title-row h2,
.desktop-app .sold-list[data-view="compact"] .sold-card h2 {
  font-size: 18px;
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-info > p,
.desktop-app .sold-list[data-view="compact"] .sold-info > p {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-stats,
.desktop-app .sold-list[data-view="compact"] .sold-grid {
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 14px;
  max-width: none;
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-stats b,
.desktop-app .sold-list[data-view="compact"] .sold-grid span {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
}body.desktop-page .desktop-app .vehicle-list .pill.status-in-stock,
body.desktop-page .desktop-app .vehicle-list .inventory-status-text.status-in-stock,
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat.status-in-stock {
  --vehicle-status-bg: #dcfce7;
  --vehicle-status-fg: #15803d;
  --vehicle-status-border: rgba(21, 148, 106, 0.26);
}body.desktop-page .desktop-app .vehicle-list .pill.status-preparing,
body.desktop-page .desktop-app .vehicle-list .inventory-status-text.status-preparing,
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat.status-preparing {
  --vehicle-status-bg: #dbeafe;
  --vehicle-status-fg: #1d4ed8;
  --vehicle-status-border: rgba(37, 99, 235, 0.26);
}body.desktop-page .desktop-app .vehicle-list .pill.status-pending-delivery,
body.desktop-page .desktop-app .vehicle-list .inventory-status-text.status-pending-delivery,
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat.status-pending-delivery {
  --vehicle-status-bg: #ede9fe;
  --vehicle-status-fg: #5b21b6;
  --vehicle-status-border: rgba(124, 77, 232, 0.28);
}body.desktop-page .desktop-app .vehicle-list .pill.status-reserved,
body.desktop-page .desktop-app .vehicle-list .inventory-status-text.status-reserved,
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat.status-reserved {
  --vehicle-status-bg: #ffedd5;
  --vehicle-status-fg: #9a3412;
  --vehicle-status-border: rgba(183, 114, 22, 0.3);
}body.desktop-page .desktop-app .vehicle-list .pill.status-sold,
body.desktop-page .desktop-app .vehicle-list .inventory-status-text.status-sold,
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat.status-sold {
  --vehicle-status-bg: #ffe5e5;
  --vehicle-status-fg: #b42318;
  --vehicle-status-border: rgba(180, 35, 24, 0.26);
}body.desktop-page .desktop-app .vehicle-list .pill.status-deleted,
body.desktop-page .desktop-app .vehicle-list .inventory-status-text.status-deleted,
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat.status-deleted {
  --vehicle-status-bg: #e5e7eb;
  --vehicle-status-fg: #4b5563;
  --vehicle-status-border: rgba(75, 85, 99, 0.22);
}body.desktop-page .desktop-app .vehicle-list .pill[class*="status-"],
body.desktop-page .desktop-app .vehicle-list .inventory-status-text[class*="status-"],
body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat[class*="status-"] {
  border: 1px solid var(--vehicle-status-border) !important;
  background: var(--vehicle-status-bg) !important;
  color: var(--vehicle-status-fg) !important;
}body.desktop-page .desktop-app .vehicle-list .vehicle-status-stat[class*="status-"] span {
  color: var(--vehicle-status-fg) !important;
}.desktop-app .vehicle-list[data-view="compact"] .vehicle-meta,
.desktop-app .vehicle-list[data-view="compact"] .desktop-status-panel,
.desktop-app .sold-list[data-view="compact"] .desktop-status-panel {
  display: none;
}.desktop-app .vehicle-list[data-view="compact"] .card-actions,
.desktop-app .sold-list[data-view="compact"] .card-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 8px;
  justify-content: center;
}.desktop-app .vehicle-list[data-view="compact"] .card-actions button,
.desktop-app .sold-list[data-view="compact"] .card-actions button {
  width: 64px;
  min-width: 64px;
  min-height: 34px;
  padding: 0;
  border-radius: 999px;
}.desktop-app .sold-list[data-view="compact"] .card-actions.sold-card-actions.boss {
  flex-wrap: wrap;
}.desktop-app .sold-list[data-view="compact"] .card-actions.sold-card-actions.boss button {
  width: auto;
  min-width: 64px;
  padding: 0 10px;
}.desktop-app .vehicle-list[data-view="table"],
.desktop-app .sold-list[data-view="table"] {
  display: block;
  overflow-x: auto;
  border: 1px solid #dbe4ef;
  border-radius: 0;
  background: #ffffff;
  box-shadow: inset 0 -8px 0 #f7f9fb;
}.desktop-app .desktop-table-head {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .desktop-table-head,
.desktop-app .sold-list[data-view="table"] .desktop-table-head {
  display: grid;
  min-width: 1280px;
  height: 46px;
  align-items: center;
  padding: 0 12px;
  border-bottom: 1px solid #dfe5ec;
  background: #f7f7f7;
  color: #172033;
  font-size: 14px;
  font-weight: 900;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-table-head {
  min-width: 1220px;
  grid-template-columns: 76px 150px 118px 148px 102px 116px 132px 120px 90px 230px;
}.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-table-head,
.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card {
  min-width: 924px;
  grid-template-columns: 76px minmax(160px, 1fr) 82px 132px 92px 116px 96px 120px;
}.desktop-app .sold-list[data-view="table"] .sold-table-head {
  min-width: 1620px;
  height: 38px;
  grid-template-columns: 52px 80px 104px 56px 86px 88px 106px 136px 136px 84px 84px 84px 84px 84px 76px 76px 94px 104px;
}.desktop-app .sold-list[data-view="table"] {
  overflow-x: auto;
}.desktop-app .sold-list[data-view="table"] .sold-table-head span {
  min-width: 0;
  padding: 0 3px;
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-card,
.desktop-app .sold-list[data-view="table"] .sold-card {
  display: grid;
  min-width: 1280px;
  align-items: center;
  gap: 0;
  padding: 8px 12px;
  border: 0;
  border-bottom: 1px solid #e3e7ed;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-card {
  min-width: 1220px;
  grid-template-columns: 76px 150px 118px 148px 102px 116px 132px 120px 90px 230px;
}.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card {
  min-width: 924px;
  grid-template-columns: 76px minmax(160px, 1fr) 82px 132px 92px 116px 96px 120px;
}.desktop-app .sold-list[data-view="table"] .sold-card {
  position: relative;
  min-width: 1620px;
  grid-template-columns: 52px 80px 104px 56px 86px 88px 106px 136px 136px 84px 84px 84px 84px 84px 76px 76px 94px 104px;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-right: 4px;
  padding-left: 4px;
}.desktop-app .sold-list[data-view="table"] .sold-card::after {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-card > img,
.desktop-app .vehicle-list[data-view="table"] .vehicle-placeholder,
.desktop-app .sold-list[data-view="table"] .sold-thumb {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  width: 50px;
  height: 40px;
  border-radius: 4px;
  object-fit: cover;
}.desktop-app .sold-list[data-view="table"] .sold-thumb {
  width: 40px;
  height: 30px;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-card > img,
.desktop-app .sold-list[data-view="table"] .sold-thumb {
  display: block;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
}.desktop-app .vehicle-table-cells,
.desktop-app .sold-table-cells {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-info,
.desktop-app .sold-list[data-view="table"] .sold-info {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-title-row,
.desktop-app .sold-list[data-view="table"] .sold-info h2 {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-title-row h2,
.desktop-app .sold-list[data-view="table"] .sold-info h2 {
  font-size: 14px;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-title-row .pill,
.desktop-app .vehicle-list[data-view="table"] .vehicle-info > p,
.desktop-app .vehicle-list[data-view="table"] .vehicle-stats {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-meta {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells {
  display: contents;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells span,
.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells strong,
.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells b {
  display: block;
  grid-row: 1;
  min-width: 0;
  padding: 0 8px;
  overflow: hidden;
  color: #172033;
  font-size: 14px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells strong,
.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells b {
  font-weight: 950;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(1) { grid-column: 2; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(2) { grid-column: 3; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(3) { grid-column: 4; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(4) { grid-column: 5; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(5) { grid-column: 6; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(6) { grid-column: 7; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(7) { grid-column: 8; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(8) { grid-column: 9; }.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(1) { grid-column: 2; }.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(2) { grid-column: 3; }.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(3) { grid-column: 4; }.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(4) { grid-column: 5; }.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(5) { grid-column: 6; }.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(6) { grid-column: 7; }.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > .inventory-status-text {
  display: inline-flex;
  width: 56px;
  min-width: 56px;
  max-width: 56px;
  align-items: center;
  justify-content: center;
  align-self: center;
  justify-self: center;
  padding: 3px 10px;
  text-align: center;
}.desktop-app .vehicle-list[data-view="table"] .vehicle-table-head span:nth-child(9),
.desktop-app .vehicle-list[data-view="table"] .vehicle-table-cells > :nth-child(8) {
  display: flex;
  grid-column: 9;
  align-items: center;
  justify-content: center;
  justify-self: center;
  width: 56px;
  padding-right: 0;
  padding-left: 0;
  text-align: center;
}.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-table-head span:nth-child(7),
.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .vehicle-table-cells > :nth-child(6) {
  display: flex;
  grid-column: 7;
  align-items: center;
  justify-content: center;
  justify-self: center;
  width: 56px;
  padding-right: 0;
  padding-left: 0;
  text-align: center;
}.desktop-app .vehicle-list[data-view="table"] .desktop-status-panel,
.desktop-app .sold-list[data-view="table"] .desktop-status-panel {
  min-height: 0;
  padding: 0 10px;
  border: 0;
}.desktop-app .vehicle-list[data-view="table"] .desktop-status-panel {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .desktop-status-panel span,
.desktop-app .vehicle-list[data-view="table"] .desktop-status-panel small,
.desktop-app .sold-list[data-view="table"] .desktop-status-panel span,
.desktop-app .sold-list[data-view="table"] .desktop-status-panel small {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .desktop-status-panel strong,
.desktop-app .sold-list[data-view="table"] .desktop-status-panel strong {
  font-size: 14px;
}.desktop-app .vehicle-list[data-view="table"] .card-actions,
.desktop-app .sold-list[data-view="table"] .card-actions {
  grid-row: 1;
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-start;
  padding-left: 10px;
}.desktop-app .vehicle-list[data-view="table"] .card-actions {
  grid-column: 10;
}.desktop-app .vehicle-list[data-view="table"] .guest-vehicle-card .card-actions {
  grid-column: 8;
}.desktop-app .sold-list[data-view="table"] .sold-info,
.desktop-app .sold-list[data-view="table"] .sold-info > p {
  display: none;
}.desktop-app .sold-list[data-view="table"] .sold-extra-line {
  display: none;
}.desktop-app .sold-list[data-view="table"] .sold-grid {
  display: none;
}.desktop-app .sold-list[data-view="table"] .sold-table-cells {
  display: contents;
}.desktop-app .sold-list[data-view="table"] .sold-table-cells span,
.desktop-app .sold-list[data-view="table"] .sold-table-cells strong {
  display: block;
  grid-row: 1;
  min-height: 0;
  padding: 0 3px;
  border: 0;
  background: transparent;
  color: #172033;
  font-size: 12px;
  font-weight: 750;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .sold-list[data-view="table"] .sold-table-cells strong {
  font-weight: 950;
}.desktop-app .sold-list[data-view="table"] .sold-table-cells .danger-text {
  color: #dc0000;
}.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(1) { grid-column: 2; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(2) { grid-column: 3; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(3) { grid-column: 4; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(4) { grid-column: 5; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(5) { grid-column: 6; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(6) { grid-column: 7; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(7) { grid-column: 8; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(8) { grid-column: 9; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(9) { grid-column: 10; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(10) { grid-column: 11; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(11) { grid-column: 12; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(12) { grid-column: 13; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(13) { grid-column: 14; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(14) { grid-column: 15; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(15) { grid-column: 16; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(16) { grid-column: 17; }.desktop-app .sold-list[data-view="table"] .sold-table-cells > :nth-child(17) { grid-column: 18; }.desktop-app .sold-list[data-view="table"] .sold-profit-panel {
  display: none;
}.desktop-app .sold-list[data-view="table"] .card-actions {
  display: none;
}.desktop-app .vehicle-list[data-view="table"] .card-actions button,
.desktop-app .sold-list[data-view="table"] .card-actions button {
  width: 64px;
  min-width: 64px;
  min-height: 30px;
  padding: 0;
  border-radius: 999px;
  font-size: 12px;
  white-space: nowrap;
}.desktop-app .sold-list .card-actions.sold-card-actions .delete {
  border-color: #fecaca;
  background: #fff1f2;
  color: #e11d48;
}.desktop-app .notice-list,
.desktop-app .person-list,
.desktop-app .permission-list {
  grid-template-columns: repeat(2, minmax(320px, 1fr));
}.desktop-app .dashboard-row {
  grid-template-columns: minmax(180px, 1.4fr) repeat(5, minmax(92px, 1fr));
}.desktop-app .risk-table .dashboard-row {
  grid-template-columns: minmax(180px, 1.5fr) repeat(3, minmax(100px, 1fr));
}.desktop-app .rank-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}.desktop-app .permission-mobile-shell {
  max-width: none;
}.desktop-app .permission-mobile-matrix {
  grid-template-columns: repeat(3, minmax(280px, 1fr));
}body.desktop-page .modal-layer {
  z-index: 3000;
  place-items: center;
  padding: 28px;
  background: rgba(7, 18, 41, 0.58);
}body.desktop-page:has(.sold-view-modal.active) .modal-layer {
  padding: 5px 28px;
}body.desktop-page .mobile-modal {
  width: min(1180px, calc(100vw - 72px));
  max-height: calc(100vh - 56px);
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(242, 199, 110, 0.26);
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(216, 163, 64, 0.12), transparent 28%),
    linear-gradient(180deg, #fffaf2 0%, #f6efe5 100%);
  box-shadow: 0 28px 80px rgba(7, 18, 41, 0.28);
}body.desktop-page .mobile-modal.active {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}body.desktop-page .modal-header {
  position: static;
  padding: 26px 30px 22px;
}body.desktop-page .modal-body {
  max-height: calc(100vh - 220px);
  padding: 22px 28px;
  overflow: auto;
}body.desktop-page .modal-actions {
  position: static;
  padding: 18px 28px;
}body.desktop-page .mobile-modal[data-modal="announcement-detail"] {
  width: min(810px, calc(100vw - 48px));
  height: min(756px, calc(100dvh - 48px));
  max-height: min(756px, calc(100dvh - 48px));
}body.desktop-page .mobile-modal[data-modal="announcement-detail"] .modal-body {
  display: flex;
  align-items: stretch;
  padding: 0;
}body.desktop-page .mobile-modal[data-modal="announcement-detail"] .article-box {
  box-sizing: border-box;
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  min-height: 100%;
  margin: 0;
  padding: 22px 24px;
  border-radius: 0;
}body.desktop-page .mobile-modal[data-modal="announcement-detail"] .article-box img {
  display: block;
  width: 170px;
  height: 112px;
  object-fit: cover;
  margin-top: 16px;
}body.desktop-page .mobile-modal[data-modal="announcement-create"] {
  width: min(960px, calc(100vw - 72px));
  height: min(680px, calc(100dvh - 56px));
  max-height: min(680px, calc(100dvh - 56px));
}body.desktop-page .mobile-modal[data-modal="announcement-create"] .modal-body {
  padding: 26px 28px;
}body.desktop-page .mobile-modal[data-modal="announcement-create"] .form-section {
  display: grid;
  min-height: 100%;
  align-content: start;
  gap: 14px;
  margin-bottom: 0;
}body.desktop-page .mobile-modal[data-modal="announcement-create"] .mobile-field textarea {
  min-height: 150px;
}body.desktop-page .mobile-modal[data-modal="vehicle-add"] {
  width: min(708px, calc(100vw - 72px));
  border-color: transparent;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] {
  width: min(880px, calc(100vw - 22px));
  height: min(760px, calc(100dvh - 16px));
  max-height: min(760px, calc(100dvh - 16px));
  border-color: transparent;
  border-radius: 14px;
  background: #cbc5bb;
  grid-template-columns: 160px minmax(0, 1fr);
  grid-template-rows: 110px minmax(0, 1fr) 68px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-body {
  display: grid;
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  grid-template-columns: 160px minmax(0, 1fr);
  grid-template-rows: 110px minmax(0, 1fr) 68px;
  gap: 0;
  align-items: stretch;
  max-height: none;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  background: #cbc5bb;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-header {
  display: grid;
  grid-column: 1 / -1;
  grid-row: 1;
  grid-template-columns: minmax(0, 1fr) 48px;
  gap: 16px;
  align-items: center;
  z-index: 1;
  padding: 21px 26px;
  border-bottom: 1px solid rgba(242, 199, 110, 0.58);
  background:
    radial-gradient(circle at 88% 28%, rgba(242, 199, 110, 0.18), transparent 30%),
    linear-gradient(112deg, #0a1730 0%, #10254c 54%, #303131 100%);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-header p {
  margin: 0 0 6px;
  color: #f2c76e;
  font-size: 12px;
  letter-spacing: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-header h2 {
  margin: 0;
  color: #fffaf2;
  font-size: 27px;
  line-height: 1.08;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-header span {
  margin-top: 8px;
  color: rgba(255, 250, 242, 0.78);
  font-weight: 800;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  min-width: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero-photo {
  position: relative;
  display: grid;
  width: 104px;
  height: 70px;
  margin: 0;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(242, 199, 110, 0.34);
  border-radius: 10px;
  background: rgba(255, 250, 242, 0.1);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero-photo img[hidden],
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero-photo span[hidden] {
  display: none !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero-photo span {
  display: grid;
  width: 42px;
  height: 42px;
  margin: 0;
  place-items: center;
  border-radius: 12px;
  background: rgba(255, 250, 242, 0.94);
  color: #9a6517;
  font-size: 15px;
  font-weight: 950;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-hero-content {
  min-width: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-title-row {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-title-row h2 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-title-row em {
  flex: 0 0 auto;
  margin: 0;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(242, 199, 110, 0.18);
  color: #f2c76e;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-manage-summary-cards {
  display: none;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-close {
  width: 46px;
  height: 46px;
  align-self: center;
  justify-self: end;
  border-color: rgba(242, 199, 110, 0.46);
  background: rgba(255, 250, 242, 0.96);
  color: #071225;
  box-shadow: 0 14px 30px rgba(7, 18, 41, 0.3);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-tabs {
  display: grid;
  grid-column: 1;
  grid-row: 2 / 4;
  grid-template-columns: 1fr;
  align-content: start;
  gap: 10px;
  align-self: stretch;
  margin: 0;
  padding: 25px 17px 18px;
  border-right: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0;
  background: #1f2020;
  box-shadow:
    inset -1px 0 0 rgba(0, 0, 0, 0.42),
    0 18px 34px rgba(7, 18, 41, 0.18);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 36px;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 999px;
  background: #f8fbff;
  color: #071225;
  font-size: 13px;
  font-weight: 900;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.16),
    inset 0 0 0 1px rgba(7, 18, 37, 0.04);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-tab-icon {
  display: block;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  color: currentColor;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-tabs button.active {
  border-color: #102750;
  background: #f8fbff;
  color: #071225;
  box-shadow:
    inset 0 0 0 1px rgba(16, 39, 80, 0.18),
    0 8px 16px rgba(7, 18, 41, 0.16);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel {
  grid-column: 2;
  grid-row: 2;
  box-sizing: border-box;
  width: auto;
  max-width: none;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 18px 24px 20px;
  overflow: auto;
  border-color: rgba(201, 211, 224, 0.9);
  border-radius: 0;
  background: #fffaf2;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel.active {
  display: block;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel h3 {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 18px;
  color: #10254c;
  font-size: 18px;
  font-weight: 950;
  line-height: 1.2;
  letter-spacing: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel h3::before {
  content: "";
  width: 4px;
  height: 18px;
  border-radius: 999px;
  background: linear-gradient(180deg, #f2c76e 0%, #b77412 100%);
  box-shadow: 0 8px 16px rgba(183, 116, 18, 0.18);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel .repair-entry-header {
  margin: 0 0 18px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel .repair-entry-header h3 {
  margin: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="status"] {
  padding: 18px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="status"] h3 {
  margin-bottom: 24px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="status"] .current-status {
  margin-bottom: 18px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="status"] .choice-grid {
  max-width: 660px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="status"] .choice-grid button {
  height: 36px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .field-grid.two,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .choice-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .field-grid.two {
  align-items: start;
  gap: 14px 16px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .mobile-field {
  gap: 8px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .mobile-field > span {
  display: block;
  line-height: 1.25;
  min-height: 17px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .repair-fuel-locked {
  border-color: #d7c5a8;
  background: #f7f1e8;
  color: #5d6675;
  cursor: not-allowed;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .mobile-field span {
  color: #26364f;
  font-size: 13px;
  font-weight: 900;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .mobile-field input,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .mobile-field select,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .mobile-field textarea {
  min-height: 40px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-info-stack {
  display: grid;
  gap: 12px;
  margin-bottom: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-info-block {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(196, 208, 223, 0.78);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 251, 244, 0.96), rgba(245, 237, 225, 0.94)),
    #f8f0e4;
  box-shadow: var(--shadow);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-info-block > h3 .manage-section-icon,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-info-block > .manage-funding-main > h3 .manage-section-icon {
  display: block;
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  color: #b77412;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-choice-grid.funding {
  max-width: none;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-choice-grid button,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-brand-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 38px;
  min-width: 0;
  padding: 0 12px;
  border: 1px solid rgba(196, 174, 141, 0.64);
  border-radius: 999px;
  background:
    linear-gradient(180deg, #fffdf8 0%, #f6eee1 100%),
    #fffaf2;
  color: #18243a;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 6px 12px rgba(75, 50, 22, 0.06);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-choice-grid.funding button > svg {
  display: block;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  color: currentColor;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-choice-grid button.selected.user-selected {
  border-color: rgba(151, 99, 27, 0.82);
  background:
    linear-gradient(180deg, #f8d98a 0%, #d7a13b 56%, #b77a1d 100%),
    #d8a340;
  color: #071225;
  box-shadow:
    0 9px 16px rgba(117, 72, 18, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.36),
    inset 0 -3px 0 rgba(93, 58, 16, 0.42);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-choice-grid .manage-plain-action,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-brand-actions button {
  border-radius: 999px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-brand-grid,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-brand-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-search-field {
  margin-top: 2px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-vehicle-fields {
  padding-top: 0;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .field-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .choice-grid {
  display: grid;
  grid-template-columns: repeat(2, 116px);
  justify-content: center;
  gap: 8px 12px;
  margin: 8px 0 12px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] .choice-grid button {
  width: 116px;
  height: 30px;
  padding: 0 12px;
  border-color: #4b5563;
  border-radius: 999px;
  font-size: 12px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel[data-manage-panel="repair"] > .outline-action {
  min-width: 128px;
  height: 32px;
  margin: 20px 0 12px;
  padding: 0 16px;
  border-color: rgba(159, 99, 24, 0.46);
  background: linear-gradient(135deg, #f2c76e 0%, #d8a340 44%, #9a6517 100%);
  color: #071225;
  font-size: 12px;
  font-weight: 950;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .record-table {
  margin-top: 10px;
  border-radius: 10px;
  background: #ffffff;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .photo-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .sub-photo-empty .photo-preview-frame {
  width: min(100%, calc((100% - 20px) / 3));
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .upload-list {
  grid-template-columns: 1fr;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions {
  display: grid;
  grid-column: 2;
  grid-row: 3;
  z-index: 1;
  grid-template-columns: auto auto;
  align-items: center;
  justify-content: end;
  gap: 14px;
  padding: 14px 26px;
  border-top: 1px solid rgba(196, 184, 170, 0.82);
  background: rgba(255, 250, 242, 0.96);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions button {
  min-width: 88px;
  height: 34px;
  padding: 0 22px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions .primary {
  min-width: 82px;
  border-color: rgba(159, 99, 24, 0.46);
  background: linear-gradient(135deg, #f2c76e 0%, #d8a340 44%, #9a6517 100%);
  color: #071225;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions .dark {
  min-width: 82px;
  border-color: rgba(159, 99, 24, 0.46);
  background: linear-gradient(135deg, #f2c76e 0%, #d8a340 44%, #9a6517 100%);
  color: #071225;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions button:first-child {
  justify-self: end;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions button:last-child {
  justify-self: end;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel::-webkit-scrollbar {
  width: 8px;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(115, 127, 143, 0.54);
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .manage-panel {
  scrollbar-width: thin;
  scrollbar-color: rgba(115, 127, 143, 0.54) transparent;
}body.desktop-page .mobile-modal[data-modal="vehicle-add"] .field-grid,
body.desktop-page .mobile-modal[data-modal="vehicle-search"] .field-grid,
body.desktop-page .mobile-modal[data-modal="staff-create"] .field-grid,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .field-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] {
  width: min(1280px, calc(100vw - 18px));
  max-width: 1280px;
  height: min(98vh, calc(100vh - 2px));
  max-height: calc(100vh - 2px);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-header {
  min-height: 80px;
  padding: 8px 18px 8px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-summary {
  grid-template-columns: 82px minmax(0, 1fr);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-header p {
  margin-bottom: 3px;
  font-size: 11px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-info-row h2 {
  font-size: 23px;
  line-height: 1.08;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-meta-row {
  display: block;
  margin: 0;
  font-size: 15px;
  line-height: 1.25;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-photo {
  width: 82px;
  height: 56px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-close {
  top: 0;
  right: 20px;
  align-self: center;
  justify-self: end;
  width: 40px;
  height: 40px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-body {
  min-height: 0;
  max-height: none;
  padding: 8px 10px 8px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: stable;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-report-layout.sale-report-layout.three {
  overflow-x: visible;
  overflow-y: visible;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-report-layout.sale-report-layout.three .sale-report-board {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  align-items: stretch;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-report-layout.sale-report-layout.three.two .sale-report-board {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card h3 {
  padding: 10px 9px;
  font-size: 15px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info {
  margin: 7px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info h4 {
  padding: 6px 8px;
  font-size: 12px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info span,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info strong {
  min-height: 29px;
  padding: 5px 4px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table th {
  height: 40px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table td {
  height: 31px;
  padding: 4px 5px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total {
  min-height: 50px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-sign-grid {
  gap: 8px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-sign-grid span {
  min-height: 50px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-note {
  min-height: 31px;
}body.desktop-page .photo-grid,
body.desktop-page .upload-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}body.desktop-page .sold-view-modal.active {
  --sold-view-width: min(770px, calc(100vw - 64px));
  --sold-view-height: min(912px, calc(100dvh - 10px));
  width: var(--sold-view-width);
  height: var(--sold-view-height);
  max-height: var(--sold-view-height);
  position: relative;
  background: #f5f6f8;
}body.desktop-page .sold-view-body {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: 100%;
  margin: 0;
  padding: 10px 12px 12px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}body.desktop-page .sold-view-body::-webkit-scrollbar {
  width: 9px;
}body.desktop-page .sold-view-body::-webkit-scrollbar-track {
  background: rgba(226, 232, 240, 0.72);
  border-radius: 999px;
}body.desktop-page .sold-view-body::-webkit-scrollbar-thumb {
  border: 2px solid rgba(226, 232, 240, 0.72);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.34);
}body.desktop-page .sold-report-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 38px;
  height: 38px;
}body.desktop-page .sold-view-actions {
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  pointer-events: auto;
}body.desktop-page .sold-view-actions button {
  min-width: 54px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(190, 132, 46, 0.42);
  border-radius: 7px;
  background: linear-gradient(135deg, #fff8ea 0%, #f0bd55 100%);
  color: #071225;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 5px 12px rgba(146, 94, 22, 0.1);
  cursor: pointer;
}body.desktop-page .sold-view-actions button:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 16px rgba(146, 94, 22, 0.16);
}body.desktop-page .print-frame {
  position: fixed;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 1px;
  border: 0;
  opacity: 0;
  pointer-events: none;
}body.desktop-page .sold-detail-hero {
  grid-template-columns: 158px minmax(390px, 1fr);
  gap: 8px;
  position: relative;
  padding-right: 42px;
}body.desktop-page .sold-detail-photo {
  height: 104px;
  max-height: 104px;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  box-shadow: 0 8px 18px rgba(17, 24, 39, 0.11);
}body.desktop-page .sold-detail-shell {
  display: grid;
  min-height: calc((min(912px, calc(100dvh - 10px)) - 34px) / 1.05);
  gap: 8px;
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  zoom: 1.05;
}body.desktop-page .sold-detail-title h2 {
  font-size: 14px;
  line-height: 1.18;
}body.desktop-page .sold-detail-title {
  display: contents;
  position: static;
  min-height: auto;
  padding-right: 0;
}body.desktop-page .sold-detail-title > h2,
body.desktop-page .sold-detail-title > p,
body.desktop-page .sold-detail-badges > .sold-status-badge,
body.desktop-page .sold-detail-badges > .sold-score-badge {
  display: none !important;
}body.desktop-page .sold-detail-title p {
  margin: 5px 0 8px;
  font-size: 16px;
  line-height: 1.2;
}body.desktop-page .sold-detail-badges {
  display: contents;
  gap: 5px;
}body.desktop-page .sold-inline-actions {
  position: absolute;
  top: 0;
  right: 42px;
  display: grid;
  width: 76px;
  height: 104px;
  grid-template-rows: repeat(6, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid rgba(190, 132, 46, 0.6);
  border-radius: 10px;
  background: linear-gradient(180deg, #fff8ea 0%, #f8d985 100%);
  box-shadow: 0 8px 18px rgba(146, 94, 22, 0.16);
}body.desktop-page .sold-detail-specs {
  margin-right: 82px;
}body.desktop-page .sold-status-badge,
body.desktop-page .sold-score-badge {
  min-width: 50px;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 6px;
  font-size: 15px;
}body.desktop-page .sold-photo-action {
  min-width: 0;
  min-height: 24px;
  gap: 3px;
  padding: 0 4px;
  border-radius: 6px;
  font-size: 10px;
}body.desktop-page .sold-inline-actions .sold-photo-action {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0 8px;
  border: 0;
  border-bottom: 1px solid rgba(190, 132, 46, 0.48);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #071225;
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
}body.desktop-page .sold-inline-actions .sold-photo-action:last-child {
  border-bottom: 0;
}body.desktop-page .sold-inline-actions .sold-photo-action.deposit-detail {
  color: #071225;
}body.desktop-page .sold-inline-actions .sold-photo-action:hover {
  background: rgba(255, 255, 255, 0.34);
  box-shadow: inset 0 0 0 999px rgba(255, 255, 255, 0.08);
}body.desktop-page .sold-photo-action::before {
  width: 12px;
  height: 12px;
  border-radius: 4px;
  font-size: 8px;
}body.desktop-page .sold-inline-actions .sold-photo-action::before {
  display: none;
}body.desktop-page .sold-detail-specs div {
  grid-template-columns: 20px 34px minmax(0, 1fr);
  gap: 5px;
  min-height: 34px;
  padding: 0 7px;
}body.desktop-page .sold-detail-specs small,
body.desktop-page .sold-info-table span,
body.desktop-page .sold-source-summary span,
body.desktop-page .sold-money-row span,
body.desktop-page .sold-cost-band span,
body.desktop-page .sold-real-profit span {
  font-size: 11.5px;
}body.desktop-page .sold-detail-specs small {
  justify-self: start;
  min-width: 0;
  white-space: nowrap;
}body.desktop-page .sold-detail-specs span:first-child {
  width: 18px;
  height: 18px;
}body.desktop-page .sold-detail-specs .sold-row-icon svg {
  width: 15px;
  height: 15px;
}body.desktop-page .sold-detail-specs strong {
  justify-self: start;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  font-size: 11.5px;
  line-height: 1.15;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}body.desktop-page .sold-detail-panel {
  padding: 8px 10px;
  border-radius: 9px;
}body.desktop-page .sold-detail-panel h3,
body.desktop-page .sold-cost-band h3 {
  gap: 7px;
  margin-bottom: 7px;
  font-size: 15px;
}body.desktop-page .sold-detail-panel h3.sold-panel-title {
  gap: 8px;
  margin-bottom: 7px;
  font-size: 15px;
}body.desktop-page .sold-detail-panel h3::before,
body.desktop-page .sold-cost-band h3::before {
  width: 3px;
  height: 18px;
}body.desktop-page .sold-overview-grid {
  gap: 6px;
}body.desktop-page .sold-overview-grid article {
  grid-template-columns: 30px minmax(0, 1fr);
  column-gap: 6px;
  min-height: 48px;
  padding: 5px 8px;
  border-radius: 8px;
}body.desktop-page .overview-icon {
  width: 28px;
  height: 28px;
  font-size: 16px;
}body.desktop-page .overview-icon svg {
  width: 16px;
  height: 16px;
}body.desktop-page .sold-overview-grid small {
  font-size: 11px;
}body.desktop-page .sold-overview-grid strong {
  margin-top: 0;
  font-size: 16px;
}body.desktop-page .sold-overview-grid strong em {
  font-size: 13px;
}body.desktop-page .sold-overview-grid p,
body.desktop-page .sold-reserved-block p,
body.desktop-page .sold-money-row p,
body.desktop-page .sold-real-profit p {
  margin-top: 1px;
  font-size: 9.5px;
  line-height: 1.1;
}body.desktop-page .sold-detail-two-col,
body.desktop-page .sold-profit-layout {
  gap: 8px;
}body.desktop-page .sold-detail-two-col > .sold-detail-panel:first-child {
  display: flex;
  min-height: 0;
  flex-direction: column;
}body.desktop-page .sold-info-table,
body.desktop-page .sold-source-summary,
body.desktop-page .sold-money-row {
  border-radius: 6px;
}body.desktop-page .sold-info-table {
  display: grid;
  gap: 0;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  background: #ffffff;
}body.desktop-page .sold-info-table div {
  grid-template-columns: 36px minmax(116px, 0.9fr) minmax(0, 1.35fr);
  grid-template-rows: none;
  width: auto;
  min-height: 40px;
  gap: 0;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 0;
  background: #ffffff;
}body.desktop-page .sold-info-table div:last-child {
  border-bottom: 0;
}body.desktop-page .sold-info-table span,
body.desktop-page .sold-info-table strong {
  padding: 0 8px;
}body.desktop-page .sold-info-table span:first-child {
  grid-row: auto;
  justify-content: center;
  padding: 0;
}body.desktop-page .sold-info-table span:nth-child(2) {
  align-self: auto;
  border-right: 1px solid #e5e7eb;
  color: #374151;
  font-size: 13px;
  line-height: 1.2;
}body.desktop-page .sold-info-table strong {
  align-self: auto;
  justify-content: flex-start;
  font-size: 13px;
  line-height: 1.15;
  white-space: normal;
}body.desktop-page .sold-info-table .sold-highlight-source-row strong {
  color: #dc2626;
  font-size: 14.5px;
  line-height: 1.08;
}body.desktop-page .sold-source-summary {
  margin-top: auto;
}body.desktop-page .sold-source-summary div {
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 5px 8px;
  min-height: 56px;
  padding: 7px 8px;
}body.desktop-page .sold-source-summary strong {
  grid-column: 1 / -1;
  font-size: 14px;
}body.desktop-page .sold-source-summary .sold-highlight-source-summary strong {
  color: #dc2626;
  font-size: 15px;
  line-height: 1.08;
}body.desktop-page .sold-cost-band {
  border-radius: 9px;
}body.desktop-page .sold-cost-band h3 {
  margin: 0;
  padding: 10px 13px;
  font-size: 15px;
}body.desktop-page .sold-cost-band > div {
  margin: 5px 8px;
  border-radius: 7px;
}body.desktop-page .sold-cost-band article,
body.desktop-page .sold-money-row article {
  gap: 2px;
  min-height: 34px;
  padding: 4px 8px;
}body.desktop-page .sold-cost-band strong,
body.desktop-page .sold-money-row strong {
  font-size: 14px;
}body.desktop-page .sold-money-row strong.profit-pair-value {
  display: block;
  width: 100%;
  font-size: 14px;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}body.desktop-page .sold-profit-panel-new h4 {
  margin: 4px 0 6px;
  font-size: 13px;
}body.desktop-page .sold-profit-layout {
  grid-template-columns: minmax(0, 1fr) 150px;
}body.desktop-page .sold-profit-panel-new {
  display: flex;
  min-height: 0;
  flex-direction: column;
}body.desktop-page .sold-profit-panel-new .sold-profit-layout {
  flex: 1 1 auto;
  align-items: start;
}body.desktop-page .sold-profit-panel-new .profit-items,
body.desktop-page .sold-profit-panel-new .sold-real-profit {
  height: 100%;
}body.desktop-page .sold-profit-panel-new .profit-items {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}body.desktop-page .sold-profit-panel-new .profit-items article {
  display: flex;
  flex-direction: column;
  min-height: 88px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 7px;
  text-align: center;
}body.desktop-page .sold-profit-panel-new .profit-items article span {
  display: block;
  width: 100%;
  min-width: 0;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: normal;
}body.desktop-page .sold-real-profit {
  gap: 4px;
  min-height: 88px;
  padding: 9px;
  border-radius: 9px;
}body.desktop-page .sold-real-profit strong {
  font-size: 24px;
}body.desktop-page .sold-reserved-block {
  gap: 14px;
  min-height: 53px;
  padding: 10px;
  border-radius: 9px;
}body.desktop-page .sold-reserved-block > span {
  width: 28px;
  height: 28px;
  border-width: 1px;
  font-size: 23px;
}body.desktop-page .sold-reserved-block strong {
  font-size: 14px;
}body.desktop-page .sold-detail-panel,
body.desktop-page .sold-cost-band,
body.desktop-page .sold-reserved-block {
  box-shadow: 0 7px 16px rgba(17, 24, 39, 0.05);
}body.desktop-page .desktop-app .dashboard-row {
  min-height: 58px;
  padding: 0 12px;
}body.desktop-page .desktop-app .dashboard-head {
  min-height: 38px;
}body.desktop-page .desktop-app .dash-car img,
body.desktop-page .desktop-app .avatar-placeholder {
  width: 54px;
  height: 40px;
}body.desktop-page .desktop-app .empty-state {
  min-height: 230px;
}body.desktop-page .desktop-app .repair-progress-body {
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 20px;
  padding: 12px 18px 18px;
}body.desktop-page .desktop-app .repair-donut {
  width: 132px;
  height: 132px;
}

body.desktop-page .mobile-modal[data-modal="vehicle-manage"] [data-manage-panel="repair"] input[list="repair-item-options"] {
  padding-right: 38px;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23344054' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E");
  background-position: right 11px center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
}

body.desktop-page .mobile-modal[data-modal="vehicle-manage"] [data-manage-panel="repair"] input[list="repair-item-options"]::-webkit-calendar-picker-indicator {
  width: 28px;
  height: 100%;
  margin: 0 -34px 0 0;
  opacity: 0;
  cursor: pointer;
}

body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .vehicle-info-public-content .required-mark {
  color: #c9483d;
  font: inherit;
}

@media (max-width: 1500px) {
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 16px 22px;
  border: 0;
  border-radius: 0;
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.08);
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip > p {
  display: block;
  grid-column: 1;
  grid-row: 1;
  width: fit-content;
  height: auto;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #ffe0a8;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.16em;
  line-height: 1.2;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip > h1 {
  grid-column: 1;
  grid-row: 2;
  margin: 0;
  color: #ffffff;
  font-size: 38px;
  font-weight: 950;
  line-height: 1.1;
  text-shadow: 0 10px 22px rgba(0, 0, 0, 0.26);
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row {
  width: min(940px, 66vw);
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  margin: 0;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-input,
body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-filter-select,
body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row button {
  height: 40px;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row button:not(.title-add-vehicle) {
  border-color: #d19a33;
  background: #fff8e8;
  color: #8a5b12;
}

@media (max-width: 1180px) {body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    row-gap: 8px;
  }body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row {
    width: min(570px, 100%);
    grid-column: 1;
    grid-row: 3;
    justify-self: end;
    margin-top: 12px;
  }
}body.desktop-page .desktop-app .page-title-strip {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 88px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin: 0 0 22px;
  padding: 16px 22px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: #ffffff;
  color: #101827;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.08);
}body.desktop-page .desktop-app .page-title-strip::after {
  display: none;
}body.desktop-page .desktop-app .hy-page-brand {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}body.desktop-page .desktop-app .hy-page-logo {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 12px;
  background: #fffaf0;
  color: #c79a58;
  font-size: 16px;
  font-weight: 950;
  letter-spacing: 0;
  box-shadow: inset 0 0 0 1px rgba(199, 154, 88, 0.18);
}body.desktop-page .desktop-app .hy-page-divider {
  width: 1px;
  height: 42px;
  flex: 0 0 auto;
  background: #e5e7eb;
}body.desktop-page .desktop-app .hy-page-title-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}body.desktop-page .desktop-app .hy-page-title-copy p,
body.desktop-page .desktop-app .bulletin-title-strip > div > p,
body.desktop-page .desktop-app .personal-title-strip > div:first-child > p {
  order: 2;
  margin: 0;
  color: #8c7a63;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.18em;
  line-height: 1;
  text-transform: uppercase;
}body.desktop-page .desktop-app .hy-page-title-copy h1,
body.desktop-page .desktop-app .bulletin-title-strip > div > h1,
body.desktop-page .desktop-app .personal-title-strip > div:first-child > h1 {
  margin: 0;
  overflow: hidden;
  color: #101827;
  font-size: 22px;
  font-weight: 950;
  line-height: 1.15;
  text-overflow: ellipsis;
  text-shadow: none;
  white-space: nowrap;
}body.desktop-page .desktop-app .hy-page-title-copy span,
body.desktop-page .desktop-app .bulletin-title-strip > div > span,
body.desktop-page .desktop-app .personal-title-strip > div:first-child > span {
  display: none;
}body.desktop-page .desktop-app .hy-page-actions {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  min-width: 0;
  margin-left: auto;
}body.desktop-page .desktop-app .hy-page-actions .title-search-row {
  display: grid;
  width: min(460px, 34vw);
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin: 0;
}body.desktop-page .desktop-app .page[data-panel="inventory"] .hy-page-actions .title-search-row {
  width: min(920px, 60vw);
  grid-template-columns: repeat(3, minmax(116px, 0.6fr)) minmax(220px, 1.4fr) auto auto;
}body.desktop-page .desktop-app .hy-page-actions .title-search-input,
body.desktop-page .desktop-app .hy-page-actions .title-filter-select {
  height: 42px;
  padding: 0 16px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #ffffff;
  color: #111827;
  font-size: 14px;
  font-weight: 750;
  box-shadow: none;
}body.desktop-page .desktop-app .hy-page-actions .title-filter-select {
  cursor: pointer;
}body.desktop-page .desktop-app .hy-page-actions .title-search-input::placeholder {
  color: #9ca3af;
}body.desktop-page .desktop-app .hy-page-actions .title-search-row button,
body.desktop-page .desktop-app .hy-page-actions .title-inline-action,
body.desktop-page .desktop-app .hy-page-actions .main-tabs-collapse {
  display: inline-flex;
  width: auto;
  min-width: 0;
  height: 42px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 1px solid #e3c48e;
  border-radius: 8px;
  background: #fffaf0;
  color: #9a6b24;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  box-shadow: none;
}body.desktop-page .desktop-app .hy-page-actions .title-search-row .title-add-vehicle {
  border-color: #111827;
  background: #111827;
  color: #ffffff;
}body.desktop-page .desktop-app .hy-page-profile {
  position: relative;
  display: inline-flex;
  height: 42px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: #ffffff;
  color: #111827;
  box-shadow: none;
  cursor: pointer;
}body.desktop-page .desktop-app .hy-page-profile {
  padding: 0 2px;
}body.desktop-page .desktop-app .hy-page-avatar {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 999px;
  background: #efe8dc;
  background-position: center;
  background-size: cover;
  color: #8a6428;
  font-size: 14px;
  font-weight: 950;
}body.desktop-page .desktop-app .hy-page-avatar.has-image {
  color: transparent;
}body:not(.desktop-page) .page-title-strip .title-inline-action {
  display: none;
}body:not(.desktop-page) .page[data-panel="bulletin"] .bulletin-title-strip .bulletin-create-btn {
  display: inline-flex;
}body.desktop-page .desktop-app .page[data-panel="bulletin"] > .full-action,
body.desktop-page .desktop-app .page[data-panel="people"] > .full-action {
  display: none;
}body.desktop-page .desktop-app .page[data-panel="bulletin"] .page-title-strip,
body.desktop-page .desktop-app .page[data-panel="people"] .page-title-strip,
body.desktop-page .desktop-app .page[data-panel="personal"] .page-title-strip {
  gap: 28px;
  align-items: center;
}body.desktop-page .desktop-app .page[data-panel="bulletin"] .page-title-strip > p,
body.desktop-page .desktop-app .page[data-panel="people"] .page-title-strip > p {
  margin: 0;
}body.desktop-page .desktop-app .page[data-panel="bulletin"] .page-title-strip > h1,
body.desktop-page .desktop-app .page[data-panel="people"] .page-title-strip > h1 {
  margin: 0;
}body.desktop-page .desktop-app .page-title-strip .title-inline-action {
  display: inline-flex;
}body.desktop-page .desktop-app .page-title-strip .title-inline-action:hover {
  transform: none;
  box-shadow: none;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip {
  min-height: 88px;
  gap: 28px;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip > p {
  grid-column: 1;
  grid-row: 1;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip > h1 {
  grid-column: 1;
  grid-row: 2;
}body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .title-search-row {
  width: min(460px, 34vw);
  margin: 0;
}body.desktop-page .desktop-app .page-title-strip .main-tabs-collapse {
  margin-right: 0;
  border-color: #e3c48e;
  background: #fffaf0;
  color: #9a6b24;
}

@media (max-width: 1180px) {body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip,
body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    row-gap: 8px;
  }body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row,
body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .title-search-row {
    width: min(570px, 100%);
    grid-column: 1;
    grid-row: 3;
    justify-self: end;
    margin-top: 12px;
  }
}

@media (max-width: 1280px) {body.desktop-page {
    min-width: 0;
  }.desktop-app {
    --desktop-sidebar: 250px;
  }.desktop-app .metric-grid,
.desktop-app .sold-metrics,
.desktop-app .compact-metrics,
.desktop-app .page[data-panel="ranking"] .metric-grid {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }.desktop-app .vehicle-list,
.desktop-app .sold-list {
    grid-template-columns: 1fr;
  }
}/* 2026-07-18: desktop navigation is a shared top bar on every car-system page. */
body.desktop-page .desktop-app {
  --desktop-sidebar: 0px;
  min-height: 100vh;
  padding-left: 0;
  padding-top: 0;
}body.desktop-page .desktop-app::before { display: none; }body.desktop-page .desktop-app .app-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 80;
  width: 100%;
  height: 82px;
  padding: 0 22px;
  border: 0;
  border-bottom: 1px solid rgba(113, 83, 44, 0.14);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #1d2430;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 28px rgba(34, 42, 55, 0.07);
  backdrop-filter: blur(18px);
}body.desktop-page .desktop-app .brand-row { width: 220px; gap: 0; }body.desktop-page .desktop-app .brand-logo-horizontal {
  width: 198px;
  height: 58px;
  object-fit: contain;
  object-position: left center;
}body.desktop-page .desktop-app .brand-home-link,
body.desktop-page .desktop-app .brand-home-link:hover,
body.desktop-page .desktop-app .brand-home-link:focus-visible,
body.desktop-page .desktop-app .brand-home-link:hover .brand-logo-horizontal,
body.desktop-page .desktop-app .brand-home-link:focus-visible .brand-logo-horizontal,
body.desktop-page .desktop-app .brand-logo-horizontal {
  transform: none !important;
  transition: none !important;
}body.desktop-page .desktop-app .account-card {
  position: static;
  width: 220px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  margin: 0;
  padding: 7px 8px 7px 12px;
  border: 1px solid #eadfce;
  border-radius: 999px;
  color: #242a32;
  background: #fffaf3;
  box-shadow: none;
}body.desktop-page .desktop-app .account-card span { color: #a08768; font-size: 9px; }body.desktop-page .desktop-app .account-card strong { color: #33271c; font-size: 12px; }body.desktop-page .desktop-app .account-card button {
  width: auto;
  min-width: 58px;
  height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #c99b50, #895a1d);
}body.desktop-page .desktop-app .main-tabs {
  position: fixed;
  inset: 0 252px auto 252px;
  z-index: 90;
  width: auto;
  height: 82px;
  max-height: 82px;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}body.desktop-page .desktop-app .main-tabs > button,
body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle {
  position: relative;
  width: auto;
  min-width: 78px;
  min-height: 82px;
  height: 82px;
  grid-template-columns: 22px auto;
  gap: 7px;
  padding: 0 11px;
  border: 0;
  border-radius: 0;
  color: #4c4a46;
  background: transparent;
  box-shadow: none;
  white-space: nowrap;
}body.desktop-page .desktop-app .main-tabs > button::after,
body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle::after {
  content: "";
  position: absolute;
  right: 14px;
  bottom: 0;
  left: 14px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: transparent;
}body.desktop-page .desktop-app .main-tabs > button:hover,
body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle:hover { color: #94631f; background: #fffaf3; }body.desktop-page .desktop-app .main-tabs > button.active { color: #8b5b1b; background: transparent; }body.desktop-page .desktop-app .main-tabs > button.active::after { background: linear-gradient(90deg, #dfb86e, #8c5a19); }body.desktop-page .desktop-app .main-tabs .nav-icon {
  width: 22px;
  height: 22px;
  border-radius: 0;
  color: #a47737;
  background: transparent;
}body.desktop-page .desktop-app .main-tabs .nav-icon svg { width: 19px; height: 19px; stroke-width: 1.9; }body.desktop-page .desktop-app .main-tabs button.active .nav-icon { color: #8b5b1b; background: transparent; }body.desktop-page .desktop-app .main-tabs button > span:not(.nav-icon) { font-size: 15px; font-weight: 800; line-height: 1; }body.desktop-page .desktop-app .main-tabs button > span:not(.nav-icon)::after { display: none; }body.desktop-page .desktop-app .main-tabs .owner-report-menu {
  position: relative;
  display: block;
  flex: 0 0 auto;
  height: 82px;
}body.desktop-page .desktop-app .main-tabs .owner-report-toggle { grid-template-columns: 22px auto 10px; }body.desktop-page .desktop-app .main-tabs .owner-report-toggle i { grid-column: 3; margin-top: 35px; width: 6px; height: 6px; }body.desktop-page .desktop-app .main-tabs .owner-report-submenu {
  position: absolute;
  top: 70px;
  right: 0;
  z-index: 100;
  width: 230px;
  gap: 3px;
  padding: 10px;
  border: 1px solid #eadbc6;
  border-radius: 12px;
  background: rgba(255, 253, 249, 0.98);
  box-shadow: 0 18px 42px rgba(44, 34, 23, 0.18);
}body.desktop-page .desktop-app .main-tabs .owner-report-submenu::before { display: none; }body.desktop-page .desktop-app .main-tabs .owner-report-submenu button {
  min-height: 38px;
  padding: 0 11px;
  border-radius: 7px;
  color: #50483e;
  background: transparent;
  font-size: 12px !important;
}body.desktop-page .desktop-app .main-tabs .owner-report-submenu button::before { display: none; }body.desktop-page .desktop-app .main-tabs .owner-report-submenu button:hover { color: #8b5b1b; background: #fff5e6; }body.desktop-page .desktop-app .page-stack {
  min-height: 100vh;
  padding: 104px 24px 28px;
}body.desktop-page .desktop-app.nav-collapsed .main-tabs {
  inset: 0 252px auto 252px;
  width: auto;
  height: 82px !important;
  max-height: 82px;
  padding: 0;
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 1320px) and (min-width: 900px) {body.desktop-page .desktop-app .app-header { height: 68px; padding: 0 16px; }body.desktop-page .desktop-app .brand-row { width: 205px; }body.desktop-page .desktop-app .account-card { width: 205px; }body.desktop-page .desktop-app .main-tabs,
body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    inset: 68px 0 auto;
    height: 58px !important;
    max-height: 58px;
    justify-content: flex-start;
    padding: 0 12px;
    overflow-x: auto;
    overflow-y: visible;
    border-bottom: 1px solid #eadfce;
    background: rgba(255, 255, 255, 0.98);
  }body.desktop-page .desktop-app .main-tabs > button,
body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle,
body.desktop-page .desktop-app .main-tabs .owner-report-menu { height: 58px; min-height: 58px; }body.desktop-page .desktop-app .main-tabs .owner-report-toggle i { margin-top: 23px; }body.desktop-page .desktop-app .main-tabs .owner-report-submenu { position: fixed; top: 118px; right: 12px; }body.desktop-page .desktop-app .page-stack { padding-top: 146px; }
}body.desktop-page .action-dialog-card {
  width: min(520px, calc(100vw - 80px));
}body.desktop-page .modal-actions,
body.desktop-page .mobile-modal[data-modal="vehicle-manage"] .modal-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}body.desktop-page .modal-actions .primary,
body.desktop-page .modal-actions .confirm {
  order: 1;
}body.desktop-page .modal-actions button:not(.primary):not(.confirm) {
  order: 2;
}body.desktop-page .fix-progress-hero {
  min-height: 132px;
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.14), transparent 30%),
    radial-gradient(circle at 82% 42%, rgba(76, 201, 143, 0.18), transparent 28%),
    linear-gradient(105deg, #173049 0%, #2f4c5d 48%, #d98c25 100%);
}body.desktop-page .fix-progress-layout {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}body.desktop-page .fix-progress-board {
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.09);
}body.desktop-page .fix-progress-board {
  padding: 16px;
}body.desktop-page .fix-progress-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}body.desktop-page .fix-progress-toolbar div {
  display: flex;
  align-items: center;
  gap: 10px;
}body.desktop-page .fix-progress-toolbar span {
  color: #92400e;
  font-size: 13px;
  font-weight: 950;
}body.desktop-page .fix-progress-toolbar strong {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: #eaf7f0;
  color: #0f6f55;
  font-size: 13px;
  font-weight: 950;
}body.desktop-page .fix-progress-toolbar button {
  min-height: 38px;
  padding: 0 18px;
  border: 1px solid #d29a2d;
  border-radius: 999px;
  background: linear-gradient(180deg, #f6c65e, #c98713);
  color: #1f2937;
  font-weight: 950;
  cursor: pointer;
}body.desktop-page .fix-progress-section-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}body.desktop-page .fix-progress-section-title span {
  display: block;
  margin-bottom: 3px;
  color: #b7791f;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}body.desktop-page .fix-progress-section-title h2 {
  margin: 0;
  color: #0f172a;
  font-size: 22px;
  line-height: 1.12;
}body.desktop-page .fix-progress-section-title strong {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: #eaf7f0;
  color: #0f6f55;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}body.desktop-page .fix-progress-form,
body.desktop-page .fix-progress-item {
  display: grid;
  gap: 10px;
}body.desktop-page .fix-progress-compose-popover {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.32);
}body.desktop-page .fix-progress-compose-popover[hidden] {
  display: none;
}body.desktop-page .fix-progress-compose-card {
  width: min(560px, calc(100vw - 48px));
  padding: 18px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 28px 70px rgba(15, 23, 42, 0.24);
}body.desktop-page .fix-progress-compose-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}body.desktop-page .fix-progress-compose-card header span {
  display: block;
  color: #b7791f;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.08em;
}body.desktop-page .fix-progress-compose-card header h2 {
  margin: 3px 0 0;
  color: #0f172a;
  font-size: 22px;
  line-height: 1.1;
}body.desktop-page .fix-progress-compose-card header button {
  position: relative;
  display: grid;
  width: 34px;
  height: 34px;
  overflow: hidden;
  place-items: center;
  border: 1px solid #cbd5e1;
  border-radius: 50%;
  background: #f8fafc;
  color: transparent;
  cursor: pointer;
}body.desktop-page .fix-progress-compose-card header button::before,
body.desktop-page .fix-progress-compose-card header button::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  background: #0f172a;
}body.desktop-page .fix-progress-compose-card header button::before {
  transform: translate(-50%, -50%) rotate(45deg);
}body.desktop-page .fix-progress-compose-card header button::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}body.desktop-page .fix-progress-form label,
body.desktop-page .fix-progress-item label {
  display: grid;
  gap: 6px;
}body.desktop-page .fix-progress-form label span,
body.desktop-page .fix-progress-item label span {
  color: #334155;
  font-size: 13px;
  font-weight: 850;
}body.desktop-page .fix-progress-form input,
body.desktop-page .fix-progress-form textarea,
body.desktop-page .fix-progress-item input,
body.desktop-page .fix-progress-item textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font: inherit;
  font-size: 14px;
}body.desktop-page .fix-progress-form input,
body.desktop-page .fix-progress-item input {
  height: 42px;
  padding: 0 12px;
}body.desktop-page .fix-progress-form textarea,
body.desktop-page .fix-progress-item textarea {
  min-height: 94px;
  resize: vertical;
  padding: 10px 12px;
  line-height: 1.45;
}body.desktop-page .fix-progress-form input[type="file"],
body.desktop-page .fix-progress-item input[type="file"] {
  height: auto;
  min-height: 42px;
  padding: 8px 10px;
  cursor: pointer;
}body.desktop-page .fix-progress-form button,
body.desktop-page .fix-progress-item button {
  min-height: 38px;
  border: 1px solid #d29a2d;
  border-radius: 999px;
  background: linear-gradient(180deg, #f6c65e, #c98713);
  color: #1f2937;
  font-weight: 950;
  cursor: pointer;
}body.desktop-page .fix-progress-item .fix-progress-summary {
  display: grid;
  width: 100%;
  min-height: 42px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 0 12px;
  border-color: #f1d19b;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  text-align: left;
  box-shadow: none;
}body.desktop-page .fix-progress-item .fix-progress-summary strong {
  min-width: 0;
  overflow: hidden;
  font-size: 15px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}body.desktop-page .fix-progress-item .fix-progress-summary span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}body.desktop-page .fix-progress-item.expanded .fix-progress-summary span {
  background: #fff0c2;
  color: #9a5f00;
}body.desktop-page .fix-progress-detail {
  display: grid;
  gap: 10px;
}body.desktop-page .fix-progress-detail[hidden] {
  display: none;
}body.desktop-page .fix-progress-attachments {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}body.desktop-page .fix-progress-attachment-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}body.desktop-page .fix-progress-attachment-head strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}body.desktop-page .fix-progress-attachment-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 850;
}body.desktop-page .fix-progress-attachment-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(86px, 1fr));
  gap: 8px;
}body.desktop-page .fix-progress-attachment-grid a {
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #ffffff;
}body.desktop-page .fix-progress-attachment-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}body.desktop-page .fix-progress-attachment-empty {
  display: grid;
  min-height: 48px;
  place-items: center;
  border: 1px dashed #cbd5e1;
  border-radius: 9px;
  color: #64748b;
  font-size: 13px;
  font-weight: 850;
}body.desktop-page .fix-progress-list {
  display: grid;
  gap: 10px;
}body.desktop-page .fix-progress-item {
  padding: 12px;
  border: 1px solid #f1d19b;
  border-radius: 12px;
  background: linear-gradient(180deg, #fffaf0, #ffffff);
}body.desktop-page .fix-progress-item.done {
  border-color: #bde7cf;
  background: linear-gradient(180deg, #f2fff8, #ffffff);
}body.desktop-page .fix-progress-item.confirmed {
  border-color: #c7d2fe;
  background: linear-gradient(180deg, #f4f7ff, #ffffff);
}body.desktop-page .fix-progress-item header,
body.desktop-page .fix-progress-item footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}body.desktop-page .fix-progress-item header span {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 0 9px;
  border-radius: 999px;
  background: #fff0c2;
  color: #9a5f00;
  font-size: 12px;
  font-weight: 950;
}body.desktop-page .fix-progress-item.done header span {
  background: #d9f8e7;
  color: #0f6f55;
}body.desktop-page .fix-progress-item.confirmed header span {
  background: #e0e7ff;
  color: #3730a3;
}body.desktop-page .fix-progress-item time,
body.desktop-page .fix-progress-item small {
  color: #64748b;
  font-size: 12px;
  font-weight: 750;
}body.desktop-page .fix-progress-item footer {
  justify-content: flex-end;
}body.desktop-page .fix-progress-item footer button {
  width: auto;
  min-width: 108px;
  padding: 0 14px;
}body.desktop-page .fix-progress-item footer button.outline {
  border-color: #9ccfba;
  background: #f5fffb;
  color: #0f6f55;
}body.desktop-page .fix-progress-empty {
  display: grid;
  min-height: 112px;
  place-items: center;
  border: 1px dashed #cbd5e1;
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.74);
  color: #64748b;
  font-weight: 850;
}

@media (max-width: 1180px) {body.desktop-page .fix-progress-layout {
    grid-template-columns: 1fr;
  }
}body.desktop-page .desktop-app[data-active-page="login"],
body.desktop-page .desktop-app[data-active-page="testlogin"] {
  min-height: 100vh;
  padding-left: 0;
  overflow: auto;
  background: #050403;
}body.desktop-page .desktop-app[data-active-page="login"]::before,
body.desktop-page .desktop-app[data-active-page="testlogin"]::before {
  display: none;
}body.desktop-page .desktop-app[data-active-page="login"] .app-header,
body.desktop-page .desktop-app[data-active-page="login"] .main-tabs,
body.desktop-page .desktop-app[data-active-page="login"] .account-card,
body.desktop-page .desktop-app[data-active-page="testlogin"] .app-header,
body.desktop-page .desktop-app[data-active-page="testlogin"] .main-tabs,
body.desktop-page .desktop-app[data-active-page="testlogin"] .account-card {
  display: none;
}body.desktop-page .desktop-app[data-active-page="login"] .page-stack,
body.desktop-page .desktop-app[data-active-page="testlogin"] .page-stack {
  display: grid;
  min-height: 100vh;
  align-items: stretch;
  justify-items: stretch;
  padding: 0;
  background: transparent;
}body.desktop-page .desktop-app[data-active-page="login"] .page.active[data-panel="login"],
body.desktop-page .desktop-app[data-active-page="testlogin"] .page.active[data-panel="testlogin"] {
  display: grid;
  width: 100%;
  min-height: 100vh;
}body.desktop-page .desktop-app .login-btn {
  height: 40px;
  border-radius: 9px;
  font-size: 15px;
  font-weight: 950;
}body.desktop-page .desktop-app .login-btn.primary {
  border-color: rgba(164, 102, 18, 0.28);
  background: linear-gradient(135deg, #f6cf78 0%, #d99c2f 46%, #9e650e 100%);
  color: #071225;
  box-shadow: 0 12px 24px rgba(117, 72, 18, 0.15);
}body.desktop-page .desktop-app .login-btn.guest {
  border-color: rgba(7, 18, 37, 0.16);
  background: linear-gradient(135deg, #ffffff 0%, #f1e8da 100%);
  color: #263449;
  box-shadow: none;
}body.desktop-page .desktop-app .role-login-panel {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(196, 208, 223, 0.78);
}body.desktop-page .desktop-app .role-login-title {
  position: static;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin: 0 0 8px;
  padding: 0;
  background: transparent;
  transform: none;
}body.desktop-page .desktop-app .role-login-title span {
  color: #071225;
  font-size: 14px;
  font-weight: 950;
}body.desktop-page .desktop-app .role-login-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}body.desktop-page .desktop-app .role-login {
  display: grid;
  min-height: 48px;
  align-content: center;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  text-align: left;
  box-shadow: 0 10px 22px rgba(7, 18, 37, 0.09);
}body.desktop-page .desktop-app .role-login span {
  color: #071225;
  font-size: 14px;
  font-weight: 900;
}body.desktop-page .desktop-app .role-login.owner {
  border-color: rgba(169, 104, 16, 0.34);
  background: linear-gradient(135deg, #ffe2a1 0%, #f0b74e 100%);
}body.desktop-page .desktop-app .role-login.manager {
  border-color: rgba(200, 85, 19, 0.34);
  background: linear-gradient(135deg, #ffcfaa 0%, #ff8a37 100%);
}body.desktop-page .desktop-app .role-login.finance {
  border-color: rgba(33, 139, 134, 0.32);
  background: linear-gradient(135deg, #dff8f4 0%, #75d0c5 100%);
}body.desktop-page .desktop-app .role-login.sales {
  border-color: rgba(168, 67, 56, 0.32);
  background: linear-gradient(135deg, #ffe4df 0%, #ff9c8c 100%);
}

@media (max-width: 980px) {body.desktop-page .desktop-app[data-active-page="login"] .page-stack,
body.desktop-page .desktop-app[data-active-page="testlogin"] .page-stack {
    padding: 0;
  }
}body.desktop-page .desktop-app .page:not(.active) {
  display: none !important;
}body.desktop-page .desktop-app .page.active {
  display: block;
}body.desktop-page .desktop-app .page.active[data-panel="bulletin"],
body.desktop-page .desktop-app .page.active[data-panel="personal"] {
  display: grid;
}

@media (max-width: 1500px) {
}/* Backoffice final desktop overrides */
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title {
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border-radius: 14px 14px 0 0 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title h2 {
  color: #071225 !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title span {
  color: #526784 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .permission-list .backoffice-master-group {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  align-content: start !important;
  min-height: 0 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .permission-list .backoffice-master-group > * {
  grid-column: 1 / -1 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .permission-list .backoffice-master-group > div {
  grid-row: auto !important;
  justify-content: stretch !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .permission-list .backoffice-repair-master-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  align-content: start !important;
  min-height: 0 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .permission-list .backoffice-repair-master-panel > * {
  grid-column: 1 / -1 !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-browser {
  display: grid !important;
  gap: 10px !important;
  align-content: start !important;
  grid-template-columns: minmax(0, 1fr) !important;
}body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-repair-detail-panel {
  min-height: 0 !important;
}/* Inventory and sold card photo sizing */
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-card {
  grid-template-columns: 158px minmax(0, 1fr) minmax(170px, 260px) 92px;
  width: 100%;
  max-width: none;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) {
  grid-template-columns: 158px minmax(0, 1fr) minmax(150px, 230px) 84px;
  grid-template-areas: "sold-photo sold-info sold-profit sold-actions";
  grid-auto-rows: auto;
  align-items: center;
  min-height: 154px;
  padding: 14px;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-card > img,
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-placeholder {
  width: 158px;
  height: 124px;
  align-self: center;
  object-fit: cover;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-thumb {
  width: 158px;
  height: 124px;
  align-self: center;
  object-fit: cover;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) > .sold-thumb {
  grid-area: sold-photo;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) .sold-info {
  grid-area: sold-info;
  align-self: center;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) .sold-profit-panel {
  grid-area: sold-profit;
  align-self: center;
  justify-self: stretch;
  min-height: 78px;
  padding-left: 14px;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) .sold-card-actions {
  grid-area: sold-actions;
  grid-column: auto;
  align-self: center;
  justify-self: stretch;
  width: 100%;
}body.desktop-page .desktop-app .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) .sold-card-actions button {
  width: 100%;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-card {
  grid-template-areas: none;
  grid-auto-rows: auto;
  min-height: 154px;
  align-items: center;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-card > img,
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-placeholder,
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .vehicle-info,
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .desktop-status-panel,
body.desktop-page .desktop-app .vehicle-list[data-view="card"] .card-actions {
  grid-area: auto;
  grid-row: auto;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .card-actions {
  grid-column: 4;
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: 84px;
  margin-left: auto;
  align-items: stretch;
  align-self: center;
  justify-self: end;
}body.desktop-page .desktop-app .vehicle-list[data-view="card"] .card-actions button {
  width: 100%;
}body.desktop-page .desktop-app .vehicle-list[data-view="compact"] .vehicle-card {
  grid-template-columns: 132px minmax(0, 1fr);
}body.desktop-page .desktop-app .sold-list[data-view="compact"] .sold-card {
  grid-template-columns: 132px minmax(0, 1fr);
}body.desktop-page .desktop-app .vehicle-list[data-view="compact"] .vehicle-card > img,
body.desktop-page .desktop-app .vehicle-list[data-view="compact"] .vehicle-placeholder {
  width: 132px;
  height: 112px;
  object-fit: cover;
}body.desktop-page .desktop-app .sold-list[data-view="compact"] .sold-thumb {
  width: 132px;
  height: 112px;
  object-fit: cover;
}

@media (max-width: 1500px) {
}/* Desktop reconciliation pages use a compact white title strip. Mobile keeps its existing title styling. */
body.desktop-page .desktop-app .page.active > .owner-reconcile-title-strip {
  min-height: 48px;
  padding: 16px 22px 10px;
  margin: 0 0 10px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: #ffffff;
  color: #0f172a;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}body.desktop-page .desktop-app .page.active > .owner-reconcile-title-strip::after {
  display: none;
}body.desktop-page .desktop-app .page.active > .owner-reconcile-title-strip > div {
  position: relative;
  z-index: 1;
  min-width: 0;
}body.desktop-page .desktop-app .page.active > .owner-reconcile-title-strip h1 {
  margin: 0;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 900;
  letter-spacing: 0;
  text-shadow: none;
}body.desktop-page .desktop-app .page.active > .owner-reconcile-title-strip .owner-accounting-title-actions {
  position: static;
  z-index: 1;
  align-self: center;
}body.desktop-page .desktop-app .page.active[data-panel="owner-repair-report"] .owner-repair-ledger-table th {
  height: 38px;
  min-height: 38px;
  padding: 5px 6px;
  font-size: 13px;
  line-height: 1.12;
  white-space: nowrap;
}body.desktop-page .desktop-app .page.active[data-panel="owner-repair-report"] .owner-repair-ledger-table th.owner-accounting-include-col,
body.desktop-page .desktop-app .page.active[data-panel="owner-repair-report"] .owner-repair-ledger-table td.owner-accounting-include-col {
  width: 92px;
  min-width: 92px;
  white-space: nowrap;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-sheets {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 0 8px 14px;
  zoom: 1;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-sheet {
  min-width: 0;
  overflow-x: hidden;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-sheet h2 {
  padding: 9px 10px;
  gap: 6px;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-sheet h2 span {
  font-size: 13px;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-sheet h2 em {
  font-size: 11px;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  table-layout: fixed;
  font-size: 11.5px;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th,
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td {
  height: 28px;
  padding: 4px 2px;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th {
  height: 30px;
  font-size: 11px !important;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-edit-cell {
  min-height: 18px;
  padding: 2px;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-view-btn,
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-delete {
  min-height: 21px;
  padding: 0 6px;
  font-size: 10px !important;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-actions .owner-fuel-delete {
  margin-left: 3px;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(1),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(1) {
  width: 8%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(2),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(2) {
  width: 13%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(3),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(3) {
  width: 11%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(4),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(4) {
  width: 6%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(5),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(5) {
  width: 10%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(6),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(6) {
  width: 9%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(7),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(7) {
  width: 11%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(8),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(8),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(9),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(9) {
  width: 7%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(10),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(10) {
  width: 8%;
}body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table th:nth-child(11),
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-dashboard-card .owner-fuel-table td:nth-child(11) {
  width: 10%;
}body.desktop-page :is(
  .agency-report-table,
.remittance-report-table,
.owner-accounting-table,
.owner-fuel-table,
.owner-expense-detail-table,
.owner-repair-ledger-table,
[data-panel="owner-profit-report"] table
) tbody td {
  color: #071225 !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}body.desktop-page :is(
  .agency-report-table,
.remittance-report-table,
.owner-accounting-table,
.owner-fuel-table,
.owner-expense-detail-table,
.owner-repair-ledger-table,
[data-panel="owner-profit-report"] table
) tbody td * {
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}body.desktop-page .desktop-app .page.active[data-panel="owner-agency-report"] .agency-report-table tbody td,
body.desktop-page .desktop-app .page.active[data-panel="owner-remittance-report"] .remittance-report-table tbody td,
body.desktop-page .desktop-app .page.active[data-panel="owner-accounting-cash-report"] .owner-accounting-table tbody td,
body.desktop-page .desktop-app .page.active[data-panel="owner-fuel-report"] .owner-fuel-table tbody td,
body.desktop-page .desktop-app .page.active[data-panel="owner-expense-report"] .owner-expense-detail-table tbody td,
body.desktop-page .desktop-app .page.active[data-panel="owner-repair-report"] .owner-repair-ledger-table tbody td {
  min-height: 38px;
  padding-top: 7px;
  padding-bottom: 7px;
  vertical-align: middle;
}body.desktop-page .desktop-app .page.active[data-panel="owner-remittance-report"] .remittance-report-table tbody td:nth-child(11),
body.desktop-page .desktop-app .page.active[data-panel="owner-remittance-report"] .remittance-report-table tbody td:nth-child(12),
body.desktop-page .desktop-app .page.active[data-panel="owner-remittance-report"] .remittance-report-table tbody td:nth-child(13) {
  white-space: nowrap;
}.login-language {
  display: none !important;
}/* Sale report modal: match the soft reference card style and vehicle header. */
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] {
  background: #f5f3ef;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-header {
  grid-template-columns: minmax(0, 1fr) 72px;
  min-height: 80px;
  padding: 8px 14px 8px 18px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.82);
  background: #ffffff;
  color: #111827;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-summary {
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 12px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-photo {
  width: 82px;
  height: 56px;
  border: 0;
  border-radius: 9px;
  background: #eef2f7;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-info-row {
  gap: 4px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-info-row p {
  margin: 0;
  color: #d39a22;
  font-size: 12px;
  font-weight: 950;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-info-row h2 {
  color: #111827;
  font-size: 24px;
  line-height: 1.05;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-vehicle-meta-row {
  color: #6b7280;
  font-size: 15px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-close {
  top: auto;
  right: auto;
  align-self: center;
  justify-self: center;
  width: 38px;
  height: 38px;
  border: 0;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  transform: none;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-body {
  padding: 8px 10px 8px;
  background: #f5f3ef;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-body:has(> .sell-form-panel.active) {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-form-panel.active {
  min-height: 0;
  height: 100%;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-form-grid-redesign {
  height: 100%;
  grid-template-rows: auto auto minmax(0, 1fr);
  align-items: stretch;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-money-card,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-gift-card,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-payment-card {
  align-self: stretch;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-actions {
  padding: 4px 14px;
  background: rgba(255, 255, 255, 0.96);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-actions .primary[data-sql-sell-submit] {
  min-width: 136px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: #1f2329;
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.2);
  font-weight: 950;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-total {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.25fr) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 50px;
  padding: 0 14px;
  line-height: 1;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total [data-sale-report-total-label],
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-total,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-total [data-sale-report-total-label] {
  font-size: 17px;
  font-weight: 950;
  line-height: 1.1;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total [data-sale-report-total-label],
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-total [data-sale-report-total-label] {
  justify-self: center;
  min-width: 0;
  text-align: center;
  white-space: nowrap;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total strong,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-total.neutral strong,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-total strong,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-total.neutral strong {
  justify-self: end;
  font-size: 17px;
  font-weight: 950;
  line-height: 1.1;
  white-space: nowrap;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .modal-actions button[data-close-modal] {
  min-width: 118px;
  height: 42px;
  border-radius: 999px;
  background: #ffffff;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card {
  border: 0 !important;
  background: #ffffff !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-static-info {
  border: 0;
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.035);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info span,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info strong,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-static-info span,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-static-info strong {
  border: 0 !important;
  background: #ffffff !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info h4,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-static-info h4 {
  border: 0 !important;
  border-bottom: 0 !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info span,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-info strong,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-static-info span,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-static-info strong {
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table {
  border: 0 !important;
  background: transparent !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table tbody td tbody td {
  border-right: 0 !important;
  border-top: 1px solid rgba(15, 23, 42, 0.07) !important;
  background: #ffffff !important;
  padding-right: 8px !important;
  padding-left: 8px !important;
  color: #071225 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  text-align: center !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table tbody tr:first-child td tbody tr:first-child td {
  border-top: 0 !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table tbody td:nth-child(2),
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table tbody td:nth-child(4) tbody td:nth-child(2) tbody td:nth-child(4) {
  text-align: center !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table tbody td:nth-child(1),
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table tbody td:nth-child(3) tbody td:nth-child(1) tbody td:nth-child(3) {
  font-size: 12.5px !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-money-table input input {
  text-align: center !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-subtotal-row td,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-subtotal-row td {
  border-top: 1px solid rgba(15, 23, 42, 0.09) !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-add-row td,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-add-row td {
  padding: 10px 8px;
  border-top: 1px solid rgba(15, 23, 42, 0.06) !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-row-actions,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-row-actions {
  display: flex;
  width: 100%;
  justify-content: center;
  gap: 14px;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-row-actions button,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-row-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  flex: 0 0 132px;
  width: 132px;
  min-width: 0;
  min-height: 37px;
  padding: 0 18px;
  border: 1px solid #edf1f6;
  border-radius: 10px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.055);
  font-size: 12px;
  font-weight: 850;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-row-actions button[data-sale-report-delete-selected],
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-row-actions button[data-sale-report-delete-selected] {
  border-color: #edf1f6;
  background: #ffffff;
  color: #ef4444;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card.company .sale-report-row-actions button:not([data-sale-report-delete-selected]).company .sale-report-row-actions button:not([data-sale-report-delete-selected]) {
  border-color: #edf1f6;
  background: #ffffff;
  color: #111827;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card.business .sale-report-row-actions button:not([data-sale-report-delete-selected]).business .sale-report-row-actions button:not([data-sale-report-delete-selected]) {
  border-color: #edf1f6;
  background: #ffffff;
  color: #111827;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card.customer .sale-report-row-actions button:not([data-sale-report-delete-selected]).customer .sale-report-row-actions button:not([data-sale-report-delete-selected]) {
  border-color: #edf1f6;
  background: #ffffff;
  color: #111827;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-row-actions button[data-sale-report-add-row]::first-letter,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-row-actions button[data-sale-report-add-row]::first-letter {
  color: #2f8a3a;
  font-size: 20px;
  font-weight: 950;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-row-actions button[data-sale-report-delete-selected]::first-letter,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-row-actions button[data-sale-report-delete-selected]::first-letter {
  color: #ef4444;
  font-size: 20px;
  font-weight: 950;
}/* Final live sell-detail layout lock. This file loads last,
so keep the active
   three-card settlement board from inheriting older full-width report rules. */
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-report-layout.sale-report-layout.three {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board].sale-report-board {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, calc((100% - 20px) / 3))) !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  align-items: start !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-report-layout.sale-report-layout.three.two [data-sell-report-board].sale-report-board {
  grid-template-columns: repeat(2, minmax(0, calc((100% - 20px) / 3))) !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] > .sale-report-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table {
  display: block !important;
  table-layout: fixed !important;
  width: calc(100% - 24px) !important;
  max-width: calc(100% - 24px) !important;
  min-width: 0 !important;
  overflow: hidden !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table thead {
  display: block !important;
  width: 100% !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table thead tr {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  width: 100% !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table tbody {
  display: table !important;
  width: 100% !important;
  table-layout: fixed !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table tbody td {
  width: 25% !important;
  border-right: 0 !important;
  border-left: 0 !important;
  border-top: 1px solid rgba(15, 23, 42, 0.07) !important;
  border-bottom: 0 !important;
  background: #fbfcfd !important;
  text-align: center !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table tbody tr:first-child td {
  border-top: 0 !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table input,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table input[readonly],
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board] .sale-money-table .sale-report-locked {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 980px) {body.desktop-page .mobile-modal[data-modal="vehicle-sell"] [data-sell-report-board].sale-report-board,
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sell-report-layout.sale-report-layout.three.two [data-sell-report-board].sale-report-board {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}/* Vehicle sell reports: keep the bottom receive/signature row as fixed cards. */
body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card .sale-sign-grid,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-card .sale-sign-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px !important;
  margin: 0 12px 10px !important;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card .sale-sign-grid.one,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-card .sale-sign-grid.one {
  grid-template-columns: minmax(0, 1fr);
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card .sale-sign-grid.three,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-card .sale-sign-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card .sale-sign-grid span,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-card .sale-sign-grid span {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 50px !important;
  padding: 8px 6px;
  border: 1px solid #edf1f6 !important;
  border-radius: 7px;
  background: #fbfcfd !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.035);
  color: #111827;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card .sale-sign-grid b,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-card .sale-sign-grid b {
  display: block;
  min-height: 18px;
  margin-top: 4px;
  color: #111827;
  font-size: 13px;
  font-weight: 950;
  line-height: 1.2;
  white-space: nowrap;
}body.desktop-page .mobile-modal[data-modal="vehicle-sell"] .sale-report-card .sale-note,
body.desktop-page .mobile-modal[data-modal="sale-detail"] .sale-report-card .sale-note {
  display: block;
  min-height: 31px;
  margin: 0 12px 12px !important;
  padding: 6px 8px;
  border: 1px solid #edf1f6 !important;
  border-radius: 7px;
  background: #fbfcfd !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.035);
  color: #111827;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  white-space: pre-line;
}body.desktop-page .mobile-modal[data-modal="vehicle-manage"] [data-manage-panel="photos-view"] {
  padding: 18px 22px;
}.desktop-app .sold-list.sales-only-sold-list,
.desktop-app .sold-list.sales-only-sold-list[data-view] {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}.desktop-app .sold-list.sales-only-sold-list .sold-table-head,
.desktop-app .sold-list.sales-only-sold-list .sold-table-cells {
  display: none !important;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-card,
.desktop-app .sold-list.sales-only-sold-list[data-view] .sales-sold-card {
  display: grid;
  grid-template-columns: 158px minmax(310px, 1fr) minmax(360px, 0.72fr) 28px;
  gap: 14px;
  align-items: stretch;
  min-height: 158px;
  padding: 12px 16px;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06);
  cursor: pointer;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-photo-wrap {
  position: relative;
  min-width: 0;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-photo,
.desktop-app .sold-list.sales-only-sold-list[data-view] .sales-sold-photo {
  width: 100%;
  height: 132px;
  display: block;
  border: 0;
  border-radius: 9px;
  object-fit: cover;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-rating {
  position: absolute;
  top: 0;
  left: 0;
  width: 54px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 0 0 18px 0;
  background: rgba(255, 255, 255, 0.94);
  color: #7c5a22;
  font-size: 14px;
  font-weight: 950;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.1);
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-rating b {
  margin-top: 0;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-photo-count {
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.68);
  color: #ffffff;
  font-size: 12px;
  font-weight: 850;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-main {
  display: grid;
  align-content: center;
  gap: 9px;
  min-width: 0;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-title-row h2 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #071225;
  font-size: 25px;
  font-weight: 950;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-title-row span {
  min-width: 38px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: #f1ece3;
  color: #6f582c;
  font-size: 13px;
  font-weight: 950;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-meta,
.desktop-app .sold-list.sales-only-sold-list .sales-sold-people {
  margin: 0;
  color: #6b7280;
  font-size: 14px;
  font-weight: 850;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-meta i,
.desktop-app .sold-list.sales-only-sold-list .sales-sold-people i {
  padding: 0 12px;
  color: #c5bfb5;
  font-style: normal;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid #eceff3;
  border-bottom: 1px solid #eceff3;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-stats span {
  display: grid;
  gap: 5px;
  min-height: 54px;
  align-content: center;
  padding: 7px 9px;
  border-right: 1px solid #eceff3;
  text-align: center;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-stats span:last-child {
  border-right: 0;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-stats small {
  color: #7b8492;
  font-size: 13px;
  font-weight: 800;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-stats b {
  color: #071225;
  font-size: 15px;
  font-weight: 950;
  white-space: nowrap;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money {
  display: grid;
  grid-template-columns: repeat(4, minmax(84px, 1fr));
  align-self: stretch;
  border-left: 1px solid #eceff3;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money section {
  display: grid;
  align-content: center;
  gap: 10px;
  min-width: 0;
  padding: 0 8px;
  border-right: 1px solid #eceff3;
  text-align: center;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money span {
  color: #172033;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money strong {
  min-width: 0;
  overflow: visible;
  color: #111827;
  font-size: clamp(18px, 1.4vw, 23px);
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  text-overflow: clip;
  white-space: nowrap;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money .tone-danger strong,
.desktop-app .sold-list.sales-only-sold-list .sales-sold-money .tone-loss strong {
  color: #b91c1c;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money .tone-success strong {
  color: #15803d;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-money .tone-gold strong {
  color: #9a6b24;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-detail {
  width: 28px;
  min-width: 28px;
  height: 44px;
  align-self: center;
  justify-self: end;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #ffffff;
  color: transparent;
  box-shadow: none;
  font-size: 0;
}.desktop-app .sold-list.sales-only-sold-list .sales-sold-detail::before {
  content: ">";
  color: #071225;
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
}

/* Keep the coin wallet beside the account controls after all legacy header rules. */
body.desktop-page .desktop-app .account-card {
  width:310px;
  grid-template-columns:auto minmax(0,1fr) auto;
}
body.desktop-page .desktop-app .main-tabs { right:342px; }
@media (max-width:1320px) and (min-width:900px) {
  body.desktop-page .desktop-app .account-card { width:276px; grid-template-columns:auto minmax(0,1fr) auto; }
  body.desktop-page .desktop-app .main-tabs { right:300px; }
}

/* Coin panel alignment and task tab. */
.coin-panel-card > header > button {
  display:grid;
  place-items:center;
  padding:0;
  line-height:0;
}
.coin-panel-card > header > button svg {
  display:block;
  width:19px;
  height:19px;
  fill:none;
  stroke:#fff;
  stroke-width:1.8;
  stroke-linecap:round;
}
.coin-panel-card > nav { grid-template-columns:repeat(3,1fr); }
.coin-task-list { display:grid; gap:9px; }
.coin-task-item { display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:10px; align-items:center; padding:12px 10px; border:1px solid #eee2cf; border-radius:13px; background:#fff; }
.coin-task-icon { display:grid; width:38px; height:38px; place-items:center; border-radius:11px; background:#fff1d3; }
.coin-task-icon svg,.coin-task-empty > span svg { width:21px; height:21px; fill:none; stroke:#a66d17; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.coin-task-item > div { min-width:0; }
.coin-task-item > div strong,.coin-task-item > div p,.coin-task-item > div small { display:block; overflow:hidden; margin:0; text-overflow:ellipsis; white-space:nowrap; }
.coin-task-item > div strong { color:#403426; font-size:13px; }
.coin-task-item > div p { margin-top:4px; color:#948a7c; font-size:10px; }
.coin-task-progress { height:5px; margin-top:8px; overflow:hidden; border-radius:10px; background:#eee9e1; }
.coin-task-progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#d3a34d,#a86e18); }
.coin-task-item > div small { margin-top:4px; color:#9b9184; font-size:9px; text-align:right; }
.coin-task-item > div .coin-task-repeatable-count { margin-top:10px; color:#9a6516; font-size:10px; font-weight:800; text-align:left; }
.coin-task-item aside { display:grid; gap:7px; justify-items:end; }
.coin-task-item aside b { display:flex; gap:3px; align-items:center; color:#9a6516; font-size:12px; white-space:nowrap; }
.coin-task-item aside b svg { width:15px; height:15px; fill:#f2d67f; stroke:#9b6819; stroke-width:1.5; }
.coin-task-item aside button { min-width:58px; height:28px; border:0; border-radius:999px; color:#fff; background:#ac7420; font-size:10px; font-weight:800; cursor:pointer; }
.coin-task-item aside button:disabled { color:#a59b8e; background:#eee8df; cursor:not-allowed; }
.coin-task-item.completed:not(.claimed) { border-color:#dcb66f; background:#fffbf2; }
.coin-task-item.claimed { opacity:1; }
.coin-task-status { display:inline-flex; min-width:58px; height:28px; align-items:center; justify-content:center; border-radius:999px; font-size:10px; font-weight:800; white-space:nowrap; }
.coin-task-status.done { color:#28754b; background:#e6f5eb; }
.coin-task-status.pending { color:#8f8373; background:#eee8df; }
.coin-task-status.repeatable { color:#8d5b13; background:#fff0cc; }
.coin-reward-animation { position:fixed; top:76px; right:22px; z-index:12000; display:flex; min-width:156px; height:52px; align-items:center; gap:10px; padding:8px 14px 8px 9px; border:1px solid #e6c98e; border-radius:14px; pointer-events:none; color:#65420f; background:rgba(255,250,239,.98); box-shadow:0 10px 28px rgba(70,47,16,.16); animation:coin-reward-mini 1.8s ease both; }
.coin-reward-medal { display:grid; width:34px; height:34px; flex:0 0 34px; place-items:center; border:1px solid #e2bd70; border-radius:50%; background:linear-gradient(145deg,#fff0bd,#d7a54a); }
.coin-reward-medal svg { width:21px; height:21px; fill:#f9dc82; stroke:#81520e; stroke-width:1.55; }
.coin-reward-animation p { display:grid; gap:2px; margin:0; color:#8e7b61; font-size:10px; line-height:1.1; }
.coin-reward-animation p b { color:#9a6210; font-size:18px; line-height:1; }
.coin-wallet-received { animation:coin-wallet-received .65s cubic-bezier(.2,1.6,.4,1); }
@keyframes coin-reward-mini { 0%{opacity:0;transform:translateY(-10px) scale(.96)} 14%,72%{opacity:1;transform:none} 100%{opacity:0;transform:translateY(-5px) scale(.98)} }
@keyframes coin-wallet-received { 0%,100%{transform:none} 40%{transform:scale(1.14);box-shadow:0 0 0 6px rgba(218,168,68,.2),0 0 24px rgba(210,151,42,.5)} }
@media (max-width:899px) { .coin-reward-animation { top:62px; right:10px; min-width:142px; height:48px; } }
@media (prefers-reduced-motion:reduce) { .coin-reward-animation,.coin-reward-animation *,.coin-wallet-received { animation-duration:.01ms !important; animation-delay:0ms !important; } }
.coin-task-empty > span { background:#fff1d0; }

/* Owner-only settings tabs and coin reward management. */
.page[data-panel="backoffice"] > .backoffice-settings-tabs {
  grid-column:1/-1;
}
.backoffice-settings-tabs {
  display:flex;
  gap:8px;
  padding:8px;
  border:1px solid #e4d5bd;
  border-radius:14px;
  background:#fffdf9;
  box-shadow:0 8px 24px rgba(74,51,25,.06);
}
.backoffice-settings-tabs[hidden] { display:none!important; }
.backoffice-settings-tabs button {
  min-width:150px;
  height:42px;
  padding:0 22px;
  border:1px solid transparent;
  border-radius:10px;
  color:#746755;
  background:transparent;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
}
.backoffice-settings-tabs button.active {
  border-color:#d7af6a;
  color:#fff;
  background:linear-gradient(135deg,#c99640,#8f5b15);
  box-shadow:0 6px 16px rgba(143,91,21,.2);
}
.page[data-panel="backoffice"].coin-settings-active > :not(.backoffice-title-strip):not(.backoffice-settings-tabs):not(.backoffice-coin-settings) {
  display:none!important;
}
.page[data-panel="backoffice"].coin-task-settings-active > :not(.backoffice-title-strip):not(.backoffice-settings-tabs):not(.coin-task-settings) {
  display:none!important;
}
.page[data-panel="backoffice"].ai-prompt-settings-active > :not(.backoffice-title-strip):not(.backoffice-settings-tabs):not(.ai-prompt-settings) {
  display:none!important;
}
.page[data-panel="backoffice"].ai-usage-settings-active > :not(.backoffice-title-strip):not(.backoffice-settings-tabs):not(.ai-usage-settings) {
  display:none!important;
}
.page[data-panel="backoffice"].coin-record-settings-active > :not(.backoffice-title-strip):not(.backoffice-settings-tabs):not(.coin-record-settings) {
  display:none!important;
}
.page[data-panel="backoffice"] > .backoffice-coin-settings {
  grid-column:1/-1;
  padding:0;
  overflow:hidden;
  border:1px solid #e4d5bd;
  border-radius:16px;
  background:#fffdf9;
}
.backoffice-coin-settings[hidden] { display:none!important; }
.page[data-panel="backoffice"] > .coin-record-settings {
  grid-column:1/-1;
  padding:0;
  overflow:hidden;
  border:1px solid #e4d5bd;
  border-radius:16px;
  background:#fffdf9;
}
.coin-record-settings[hidden] { display:none!important; }
.coin-record-heading {
  gap:20px;
  align-items:center;
}
.coin-record-heading > button {
  flex:0 0 auto;
  min-width:110px;
  height:40px;
  border:1px solid #d5a24b;
  border-radius:999px;
  color:#7f4b08;
  background:#fffaf0;
  font-weight:900;
  cursor:pointer;
}
.coin-record-summary {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  padding:18px 20px;
  background:#f7f9fc;
  border-bottom:1px solid #e5eaf1;
}
.coin-record-summary article {
  position:relative;
  min-width:0;
  padding:16px 18px;
  border:1px solid #e1e6ee;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 22px rgba(15,35,64,.05);
}
.coin-record-summary article::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  border-radius:14px 0 0 14px;
  background:#c88d28;
}
.coin-record-summary span,
.coin-record-summary small {
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:800;
}
.coin-record-summary strong {
  display:block;
  margin:6px 0 4px;
  color:#10213d;
  font-size:25px;
  line-height:1;
}
.coin-record-toolbar {
  display:flex;
  align-items:end;
  gap:12px;
  padding:16px 20px;
  border-bottom:1px solid #e6eaf0;
  background:#fff;
}
.coin-record-view-tabs {
  display:flex;
  gap:6px;
  margin-right:auto;
  padding:4px;
  border-radius:11px;
  background:#eef2f7;
}
.coin-record-view-tabs button {
  min-height:38px;
  padding:0 16px;
  border:0;
  border-radius:8px;
  color:#445064;
  background:transparent;
  font-weight:900;
  cursor:pointer;
}
.coin-record-view-tabs button.active {
  color:#fff;
  background:#10213d;
  box-shadow:0 4px 12px rgba(16,33,61,.18);
}
.coin-record-view-tabs button span {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:20px;
  margin-left:6px;
  padding:0 6px;
  border-radius:999px;
  color:inherit;
  background:rgba(255,255,255,.18);
  font-size:11px;
}
.coin-record-toolbar > label {
  display:grid;
  gap:5px;
  color:#526071;
  font-size:12px;
  font-weight:900;
}
.coin-record-toolbar select,
.coin-record-toolbar input {
  height:40px;
  min-width:180px;
  padding:0 12px;
  border:1px solid #d7dee8;
  border-radius:9px;
  color:#17233a;
  background:#fff;
  font:inherit;
}
.coin-record-search input { min-width:260px; }
.coin-record-table-wrap {
  overflow:auto;
  max-height:620px;
  background:#fff;
}
.coin-record-table {
  width:100%;
  min-width:920px;
  border-collapse:collapse;
  color:#17233a;
  font-size:13px;
}
.coin-record-table th {
  position:sticky;
  top:0;
  z-index:1;
  padding:13px 14px;
  border-bottom:1px solid #dce2eb;
  color:#4b576a;
  background:#f5f7fa;
  text-align:left;
  white-space:nowrap;
}
.coin-record-table td {
  padding:14px;
  border-bottom:1px solid #e7ebf0;
  vertical-align:middle;
}
.coin-record-table tr:hover td { background:#fffcf5; }
.coin-record-person strong,
.coin-record-detail strong { display:block; color:#10213d; }
.coin-record-person small,
.coin-record-detail small { display:block; margin-top:3px; color:#7a8699; }
.coin-record-type,
.coin-record-status {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:58px;
  min-height:26px;
  padding:0 9px;
  border-radius:999px;
  color:#825208;
  background:#fff3d7;
  font-size:12px;
  font-weight:900;
}
.coin-record-status.completed { color:#087443; background:#e7f7ee; }
.coin-record-status.pending { color:#8b5a00; background:#fff3d7; }
.coin-record-status.cancelled { color:#b42318; background:#feeceb; }
.coin-record-amount { font-size:15px; font-weight:950; white-space:nowrap; }
.coin-record-amount.positive { color:#09834f; }
.coin-record-amount.negative { color:#c02a24; }
.coin-record-empty {
  padding:48px 18px!important;
  color:#7b8798;
  text-align:center;
}
@media(max-width:720px) {
  .page[data-panel="backoffice"] > .coin-record-settings { margin:0 12px; }
  .coin-record-heading {
    align-items:flex-start;
    padding:16px;
  }
  .coin-record-heading h2 { font-size:19px; }
  .coin-record-heading > button { min-width:76px; height:36px; }
  .coin-record-summary {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    padding:12px;
  }
  .coin-record-summary article { padding:13px 12px; }
  .coin-record-summary strong { font-size:21px; }
  .coin-record-toolbar {
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:end;
    gap:10px;
    padding:12px;
  }
  .coin-record-view-tabs { grid-column:1/-1; width:100%; }
  .coin-record-view-tabs button { flex:1; padding:0 8px; }
  .coin-record-toolbar select,
  .coin-record-toolbar input,
  .coin-record-search input { width:100%; min-width:0; }
  .coin-record-table-wrap { overflow:visible; max-height:none; padding:0 12px 12px; }
  .coin-record-table { min-width:0; }
  .coin-record-table thead { display:none; }
  .coin-record-table,
  .coin-record-table tbody,
  .coin-record-table tr,
  .coin-record-table td { display:block; width:100%; }
  .coin-record-table tr {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px 12px;
    margin-top:10px;
    padding:13px;
    border:1px solid #e1e6ee;
    border-radius:13px;
    background:#fff;
    box-sizing:border-box;
    box-shadow:0 6px 18px rgba(15,35,64,.05);
  }
  .coin-record-table td {
    min-width:0;
    padding:0;
    border:0;
  }
  .coin-record-table td::before {
    content:attr(data-label);
    display:block;
    margin-bottom:4px;
    color:#7a8699;
    font-size:11px;
    font-weight:900;
  }
  .coin-record-table td.coin-record-detail { grid-column:1/-1; }
  .coin-record-table td.coin-record-empty { grid-column:1/-1; padding:28px 10px!important; }
}
.coin-settings-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:20px 22px;
  border-bottom:1px solid #eadfce;
  background:linear-gradient(110deg,#fffaf0,#f6e6c6);
}
.coin-settings-heading p,.coin-settings-heading h2,.coin-settings-heading span { margin:0; }
.coin-settings-heading p { color:#aa7624; font-size:10px; font-weight:900; letter-spacing:.15em; }
.coin-settings-heading h2 { margin-top:3px; color:#32271b; font-size:22px; }
.coin-settings-heading span { display:block; margin-top:5px; color:#8b7c69; font-size:12px; }
.coin-settings-heading > button,.coin-settings-actions button,.coin-settings-item footer button {
  border:1px solid #d9bb88;
  border-radius:9px;
  color:#8a5b17;
  background:#fffaf0;
  font-weight:800;
  cursor:pointer;
}
.coin-settings-heading > button { min-width:110px; height:38px; padding:0 18px; }
.coin-settings-form {
  display:grid;
  grid-template-columns:2fr 1fr 1fr .7fr;
  gap:12px;
  padding:18px 22px;
  border-bottom:1px solid #eadfce;
  background:#fff;
}
.coin-settings-form > label { display:grid; gap:6px; min-width:0; color:#766956; font-size:11px; font-weight:700; }
.coin-settings-form > label.wide { grid-column:span 2; }
.coin-settings-stock-field { display:grid; gap:6px; min-width:0; color:#766956; font-size:11px; font-weight:700; }
.coin-settings-stock-field > label:first-child { display:grid; gap:6px; min-width:0; }
.coin-settings-stock-field .coin-settings-unlimited-stock { display:flex; align-items:center; gap:7px; color:#805a1d; font-size:11px; font-weight:900; cursor:pointer; }
.coin-settings-stock-field .coin-settings-unlimited-stock input { width:17px; height:17px; min-width:17px; padding:0; accent-color:#a66f1d; }
.coin-settings-stock-field > small { color:#9a8b76; font-size:10px; font-weight:500; line-height:1.4; }
.coin-settings-stock-field.is-unlimited [data-coin-admin-stock] { color:#9a8f80; background:#f1ede7; cursor:not-allowed; }
.coin-settings-form input,.coin-settings-form textarea,.coin-settings-form select {
  width:100%;
  min-width:0;
  border:1px solid #ddcdb5;
  border-radius:9px;
  color:#30271e;
  background:#fffcf7;
  outline:none;
}
.coin-settings-form input { height:40px; padding:0 12px; }
.coin-settings-form select { height:40px; padding:0 12px; }
.coin-settings-form textarea { min-height:70px; padding:10px 12px; resize:vertical; }
.coin-settings-form input:focus,.coin-settings-form textarea:focus,.coin-settings-form select:focus { border-color:#b98430; box-shadow:0 0 0 3px rgba(185,132,48,.12); }
.coin-settings-image-field { display:grid; gap:6px; min-width:0; color:#766956; font-size:11px; font-weight:700; }
.coin-settings-image-upload { display:block; cursor:pointer; }
.coin-settings-image-upload > input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }
.coin-settings-image-preview { min-height:88px; display:flex; align-items:center; justify-content:center; gap:9px; padding:12px; border:1px dashed #d8bd91; border-radius:12px; background:#fffcf7; color:#956719; text-align:center; transition:.18s ease; }
.coin-settings-image-preview:hover { border-color:#b98430; background:#fff7e8; }
.coin-settings-image-preview > b { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:#f7e8c9; font-size:22px; }
.coin-settings-image-preview > em { font-size:13px; font-style:normal; font-weight:900; }
.coin-settings-image-preview > small { color:#998b78; font-size:10px; }
.coin-settings-image-preview.has-image { justify-content:flex-start; text-align:left; }
.coin-settings-image-preview.has-image > img { width:72px; height:64px; border-radius:9px; object-fit:cover; background:#eee; }
.coin-settings-image-preview.has-image > span { display:grid; gap:4px; min-width:0; }
.coin-settings-image-preview.has-image strong { overflow:hidden; color:#4b3a25; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.coin-settings-item-icon img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.coin-settings-form-overlay { position:fixed; inset:0; z-index:420; display:grid; place-items:center; padding:24px; background:rgba(18,25,36,.5); backdrop-filter:blur(4px); }
.coin-settings-form-overlay[hidden] { display:none !important; }
.coin-settings-form-dialog { width:min(980px,calc(100vw - 48px)); max-height:calc(100vh - 48px); overflow:hidden; border:1px solid #e4d5bc; border-radius:18px; background:#fff; box-shadow:0 28px 80px rgba(21,27,37,.25); }
.coin-settings-form-dialog > header { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:72px; padding:14px 20px; border-bottom:1px solid #eadfce; background:linear-gradient(110deg,#fffaf0,#f8e8c7); }
.coin-settings-form-dialog > header p,.coin-settings-form-dialog > header h3 { margin:0; }
.coin-settings-form-dialog > header p { color:#a8701c; font-size:10px; font-weight:900; letter-spacing:.14em; }
.coin-settings-form-dialog > header h3 { margin-top:3px; color:#2c261e; font-size:21px; }
.coin-settings-form-dialog > header button { width:38px; height:38px; border:1px solid #d8bd91; border-radius:50%; color:#7a5c2f; background:#fffaf1; font-size:23px; line-height:1; cursor:pointer; }
.coin-settings-form-dialog .coin-settings-form { max-height:calc(100vh - 120px); overflow:auto; }
body.coin-admin-form-open { overflow:hidden !important; }
@media (max-width:700px) {
  .coin-settings-form-overlay { padding:0; place-items:stretch; }
  .coin-settings-form-dialog { width:100%; max-height:100svh; border:0; border-radius:0; }
  .coin-settings-form-dialog > header { min-height:64px; padding:10px 14px; }
  .coin-settings-form-dialog > header h3 { font-size:19px; }
  .coin-settings-form-dialog .coin-settings-form { max-height:calc(100svh - 64px); padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
}
.coin-settings-form .coin-settings-active {
  grid-column:span 2;
  display:flex;
  align-items:center;
  gap:8px;
  align-self:center;
  font-size:12px;
}
.coin-settings-form .coin-settings-active input { width:17px; height:17px; }
.coin-settings-actions { grid-column:span 2; display:flex; justify-content:flex-end; gap:8px; align-items:center; }
.coin-settings-actions button { min-width:88px; height:38px; padding:0 15px; }
.coin-settings-actions button.primary { border-color:#9b681b; color:#fff; background:linear-gradient(135deg,#c99742,#8d5914); }
.coin-settings-list { display:grid; gap:10px; padding:16px 22px 22px; }
.coin-settings-item {
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 120px 72px auto;
  gap:14px;
  align-items:center;
  min-height:82px;
  padding:12px 14px;
  border:1px solid #e7dccb;
  border-radius:12px;
  background:#fff;
}
.coin-settings-item.inactive { opacity:.68; background:#f6f3ee; }
.coin-settings-item-icon { display:grid; width:42px; height:42px; place-items:center; border-radius:50%; background:#fff0ca; }
.coin-settings-item-icon svg,.coin-settings-item > b svg,.coin-settings-empty > svg { width:24px; height:24px; fill:#f4d785; stroke:#9a6819; stroke-width:1.5; }
.coin-task-settings-item .coin-settings-item-icon svg,.coin-task-settings-empty-icon svg { width:24px; height:24px; fill:none; stroke:#9a6819; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.coin-settings-item > div { min-width:0; }
.coin-settings-item > div strong { color:#3a3025; font-size:14px; }
.coin-settings-item > div p { overflow:hidden; margin:4px 0; color:#887c6c; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.coin-settings-item > div small { color:#a09789; font-size:10px; }
.coin-settings-item > b { display:flex; gap:6px; align-items:center; justify-content:flex-end; color:#946117; font-size:15px; }
.coin-settings-item > b svg { width:18px; height:18px; }
.coin-settings-item > em { padding:5px 8px; border-radius:999px; color:#287a54; background:#eaf7ef; font-size:10px; font-style:normal; text-align:center; }
.coin-settings-item.inactive > em { color:#857a6c; background:#ece8e1; }
.coin-settings-item footer { display:flex; gap:6px; }
.coin-settings-item footer button { height:30px; padding:0 12px; font-size:10px; }
.coin-settings-item footer button:last-child { color:#a44934; border-color:#dfb7aa; }
.coin-settings-empty { display:grid; min-height:180px; place-content:center; justify-items:center; color:#968a78; text-align:center; }
.coin-settings-empty > svg { width:46px; height:46px; margin-bottom:12px; }
.coin-settings-empty strong { color:#66543a; font-size:16px; }
.coin-settings-empty span { margin-top:6px; font-size:11px; }
@media(max-width:720px) {
  .backoffice-settings-tabs { position:sticky; top:0; z-index:5; margin:0 12px; }
  .backoffice-settings-tabs button { flex:1; min-width:0; padding:0 8px; }
  .page[data-panel="backoffice"] > .backoffice-coin-settings { margin:0 12px; }
  .coin-settings-heading { align-items:flex-start; padding:16px; }
  .coin-settings-heading h2 { font-size:18px; }
  .coin-settings-heading span { max-width:210px; line-height:1.5; }
  .coin-settings-heading > button { min-width:84px; padding:0 10px; }
  .coin-settings-form { grid-template-columns:1fr 1fr; padding:14px; }
  .coin-settings-form > label.wide,.coin-settings-form .coin-settings-active { grid-column:1/-1; }
  .coin-settings-actions { grid-column:1/-1; }
  .coin-settings-list { padding:12px 14px 18px; }
  .coin-settings-item { grid-template-columns:40px minmax(0,1fr) auto; gap:9px; }
  .coin-settings-item-icon { width:36px; height:36px; }
  .coin-settings-item > b { grid-column:2; justify-content:flex-start; }
  .coin-settings-item > em { grid-column:3; grid-row:1; }
  .coin-settings-item footer { grid-column:2/4; justify-content:flex-end; }
}

/* Shared desktop header utilities: notification and profile belong to the global header. */
body.desktop-page .desktop-app .header-account-zone {
  position: relative;
  z-index: 130;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
body.desktop-page .desktop-app .header-page-utilities {
  position: relative;
  z-index: 131;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
}
body.desktop-page .desktop-app .header-page-utilities[hidden] { display: none !important; }
body.desktop-page .desktop-app .header-page-utilities .hy-page-profile { flex: 0 0 auto; }
body.desktop-page .desktop-app .header-page-utilities > .public-frontend-shortcut,
body.desktop-page .desktop-app .header-page-utilities > .visitor-chat-floating {
  position: relative;
  top: auto;
  right: auto;
  z-index: 132;
  flex: 0 0 auto;
}
body.desktop-page .desktop-app .header-page-utilities > .visitor-chat-floating .visitor-chat-floating-panel {
  position: fixed;
  top: 74px;
  right: 24px;
}
.coin-task-settings [data-coin-task-admin-new] { display: none !important; }
.coin-task-settings-form > label:not(:has([data-coin-task-admin-reward])):not([data-coin-task-admin-sales-threshold]) { display: none !important; }
.coin-task-settings-form { grid-template-columns: minmax(220px, 420px) !important; }
.coin-task-settings-form .coin-settings-actions { grid-column: 1 !important; }
.coin-rule-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 20px 22px 8px;
}
.coin-rule-group {
  overflow: hidden;
  border: 1px solid #e7d8bf;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(86, 63, 28, .06);
}
.coin-rule-group > header {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 112px;
  padding: 16px;
  border-bottom: 1px solid #eee2cf;
  background: linear-gradient(135deg, #fffaf0, #f9edda);
}
.coin-rule-group.streak-rule-group > header {
  background: linear-gradient(135deg, #f8fbff, #edf3fb);
}
.coin-rule-group.sale-rule-group { order: 1; }
.coin-rule-group.streak-rule-group { order: 2; }
.coin-rule-group.rank-rule-group {
  grid-column: 1 / -1;
  order: 3;
}
.coin-rule-group.rank-rule-group > header {
  background: linear-gradient(135deg, #fff9ea, #f3ead8);
}
.coin-rule-group.count-rule-group {
  grid-column: 1 / -1;
  order: 4;
}
.coin-rule-group.count-rule-group > header {
  background: linear-gradient(135deg, #f4fbf7, #e8f5ed);
}
.coin-rule-group-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid #e2bf7d;
  border-radius: 13px;
  color: #9a6819;
  background: #fff;
}
.coin-rule-group-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.coin-rule-group > header p,
.coin-rule-group > header h3,
.coin-rule-group > header span { margin: 0; }
.coin-rule-group > header p {
  color: #aa7624;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}
.coin-rule-group > header h3 {
  margin-top: 3px;
  color: #32271b;
  font-size: 17px;
}
.coin-rule-group > header div > span {
  display: block;
  margin-top: 5px;
  color: #827363;
  font-size: 11px;
  line-height: 1.55;
}
.coin-rule-group > header > button {
  min-width: 104px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid #d2a85d;
  border-radius: 10px;
  color: #8c5c16;
  background: #fff;
  font-weight: 900;
  cursor: pointer;
}
.coin-rule-list {
  display: grid;
  gap: 10px;
  min-height: 118px;
  padding: 14px;
}
.coin-rule-item {
  grid-template-columns: 48px minmax(0, 1fr) 88px 64px auto;
  gap: 10px;
  padding: 12px;
  border-color: #eee2cf;
  box-shadow: none;
}
.coin-rule-days {
  display: grid;
  width: 44px;
  height: 44px;
  place-content: center;
  border: 1px solid #d6b06c;
  border-radius: 12px;
  color: #8e5b10;
  background: #fff9ed;
  text-align: center;
}
.coin-rule-days b {
  font-size: 17px;
  line-height: 1;
}
.coin-rule-days small {
  margin-top: 3px;
  font-size: 9px;
}
.coin-rule-item > div p {
  max-width: 320px;
}
.coin-rule-empty {
  display: grid;
  min-height: 90px;
  place-content: center;
  gap: 5px;
  color: #9b8e7b;
  text-align: center;
}
.coin-rule-empty strong { color: #65543e; font-size: 13px; }
.coin-rule-empty span { font-size: 11px; }
.coin-task-standard-heading {
  margin: 14px 22px 0;
  padding: 14px 16px;
  border: 1px solid #e8dece;
  border-radius: 12px;
  background: #faf8f4;
}
.coin-task-standard-heading p,
.coin-task-standard-heading h3,
.coin-task-standard-heading span { margin: 0; }
.coin-task-standard-heading p { color: #a47a38; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.coin-task-standard-heading h3 { margin-top: 3px; color: #3b3024; font-size: 16px; }
.coin-task-standard-heading span { display: block; margin-top: 4px; color: #897d6d; font-size: 11px; }
.coin-rule-form-dialog {
  width: min(660px, calc(100vw - 48px));
}
.coin-rule-settings-form {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.coin-rule-settings-form > label,
.coin-rule-settings-form .coin-settings-active {
  display: grid !important;
}
.coin-rule-settings-form .coin-settings-active,
.coin-rule-preview,
.coin-rule-settings-form .coin-settings-actions {
  grid-column: 1 / -1 !important;
}
.coin-rule-preview {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 5px 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid #ead9bc;
  border-radius: 12px;
  background: #fffaf1;
}
.coin-rule-preview > span {
  grid-row: 1 / 3;
  padding: 6px 9px;
  border-radius: 999px;
  color: #8e611d;
  background: #f4e2bd;
  font-size: 10px;
  font-weight: 900;
}
.coin-rule-preview > strong { color: #382d20; font-size: 14px; }
.coin-rule-preview > p { margin: 0; color: #827564; font-size: 11px; }
.coin-rule-preview > b {
  grid-column: 3;
  grid-row: 1 / 3;
  display: flex;
  gap: 5px;
  align-items: center;
  color: #946117;
}
.coin-rule-preview > b svg { width: 18px; height: 18px; }
@media (max-width: 1180px) {
  .coin-rule-groups { grid-template-columns: 1fr; }
  .coin-rule-group.rank-rule-group,
  .coin-rule-group.count-rule-group { grid-column: 1; }
}
@media (max-width: 899px) {
  .coin-rule-groups { gap: 12px; padding: 14px 12px 6px; }
  .coin-rule-group > header {
    grid-template-columns: 40px minmax(0, 1fr);
    min-height: auto;
    padding: 14px;
  }
  .coin-rule-group-icon { width: 38px; height: 38px; }
  .coin-rule-group > header > button {
    grid-column: 1 / -1;
    width: 100%;
  }
  .coin-rule-item {
    grid-template-columns: 44px minmax(0, 1fr) auto;
  }
  .coin-rule-item > b { grid-column: 2; justify-content: flex-start; }
  .coin-rule-item > em { grid-column: 3; grid-row: 1; }
  .coin-rule-item footer { grid-column: 2 / 4; }
  .coin-task-standard-heading { margin: 12px 12px 0; }
  .coin-rule-settings-form { grid-template-columns: 1fr !important; }
  .coin-rule-settings-form > *,
  .coin-rule-settings-form .coin-settings-actions { grid-column: 1 !important; }
  .coin-rule-preview { grid-template-columns: 1fr; }
  .coin-rule-preview > span,
  .coin-rule-preview > b { grid-column: 1; grid-row: auto; justify-self: start; }
}
@media (min-width: 1321px) {
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs { right: 390px; }
}
@media (max-width: 1320px) and (min-width: 900px) {
  body.desktop-page .desktop-app .header-account-zone { gap: 5px; }
}

/* 2026-07-20: keep the desktop header readable on 11–14 inch laptops.
   The navigation stays on one row and labels must never collapse to ellipses. */
@media (min-width: 900px) and (max-width: 1650px) {
  body.desktop-page .desktop-app .app-header {
    height: 68px;
    padding: 0 10px;
  }
  body.desktop-page .desktop-app .brand-row {
    flex: 0 0 168px;
    width: 168px;
  }
  body.desktop-page .desktop-app .brand-logo-horizontal {
    width: 158px;
    height: 48px;
  }
  body.desktop-page .desktop-app .header-account-zone {
    flex: 0 0 auto;
    gap: 3px;
  }
  body.desktop-page .desktop-app .header-page-utilities {
    gap: 0;
  }
  body.desktop-page .desktop-app .header-page-utilities .hy-page-profile {
    transform: none;
  }
  body.desktop-page .desktop-app .account-card {
    width: 232px;
    grid-template-columns: 62px minmax(0, 1fr) 52px;
    gap: 5px;
    padding: 5px 5px 5px 7px;
  }
  body.desktop-page .desktop-app .account-card .coin-wallet-button {
    min-width: 62px;
    height: 32px;
    padding: 2px 6px;
  }
  body.desktop-page .desktop-app .account-card > div {
    min-width: 0;
  }
  body.desktop-page .desktop-app .account-card > div span,
  body.desktop-page .desktop-app .account-card > div strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  body.desktop-page .desktop-app .account-card > button:not(.coin-wallet-button) {
    min-width: 52px;
    height: 32px;
    padding: 0 8px;
    font-size: 12px;
  }
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    inset: 0 305px auto 178px;
    width: auto;
    height: 68px !important;
    max-height: 68px;
    justify-content: center;
    gap: 0;
    padding: 0 2px;
    overflow: visible;
    border: 0;
    background: transparent;
  }
  body.desktop-page .desktop-app .main-tabs > button,
  body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle,
  body.desktop-page .desktop-app .main-tabs .owner-report-menu {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    min-height: 68px;
    height: 68px;
  }
  body.desktop-page .desktop-app .main-tabs > button,
  body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle {
    grid-template-columns: 17px max-content;
    gap: 3px;
    padding: 0 6px;
    overflow: visible;
  }
  body.desktop-page .desktop-app .main-tabs .owner-report-toggle {
    grid-template-columns: 17px max-content 7px;
  }
  body.desktop-page .desktop-app .main-tabs .nav-icon {
    width: 17px;
    height: 17px;
  }
  body.desktop-page .desktop-app .main-tabs .nav-icon svg {
    width: 15px;
    height: 15px;
  }
  body.desktop-page .desktop-app .main-tabs button > span:not(.nav-icon) {
    display: block;
    width: max-content;
    max-width: none;
    overflow: visible;
    font-size: 12px;
    line-height: 1;
    text-overflow: clip;
    white-space: nowrap;
  }
  body.desktop-page .desktop-app .main-tabs .owner-report-toggle i {
    margin-top: 28px;
  }
  body.desktop-page .desktop-app .main-tabs .owner-report-submenu {
    top: 62px;
  }
  body.desktop-page .desktop-app .page-stack {
    padding-top: 88px;
  }
}

@media (min-width: 900px) and (max-width: 1180px) {
  body.desktop-page .desktop-app .brand-row {
    flex-basis: 145px;
    width: 145px;
  }
  body.desktop-page .desktop-app .brand-logo-horizontal {
    width: 138px;
    height: 44px;
  }
  body.desktop-page .desktop-app .account-card {
    width: 204px;
    grid-template-columns: 58px minmax(0, 1fr) 48px;
  }
  body.desktop-page .desktop-app .account-card > button:not(.coin-wallet-button) {
    min-width: 48px;
    padding: 0 6px;
  }
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    right: 300px;
    left: 150px;
  }
  body.desktop-page .desktop-app .main-tabs > button,
  body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle {
    grid-template-columns: max-content;
    padding-right: 5px;
    padding-left: 5px;
  }
  body.desktop-page .desktop-app .main-tabs .owner-report-toggle {
    grid-template-columns: max-content 7px;
  }
  body.desktop-page .desktop-app .main-tabs .nav-icon {
    display: none;
  }
  body.desktop-page .desktop-app .main-tabs button > span:not(.nav-icon) {
    font-size: 11px;
  }
}

.visitor-chat-page {
  display: grid;
  gap: 16px;
}

.visitor-chat-shell {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  min-height: 620px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08);
}

.visitor-chat-sidebar {
  border-right: 1px solid #dbe3ef;
  background: #f8fafc;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.visitor-chat-source-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid #dbe3ef;
  background: #fff;
}

.visitor-chat-source-tabs button {
  min-height: 36px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  color: #475569;
  background: #f8fafc;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.visitor-chat-source-tabs button.is-active {
  border-color: #0f172a;
  color: #fff;
  background: #0f172a;
}

.visitor-chat-sidebar-head,
.visitor-chat-room-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #dbe3ef;
  color: #0f172a;
}

.visitor-chat-sidebar-head span {
  color: #64748b;
  font-size: 13px;
}

.visitor-chat-thread-list {
  overflow: auto;
}

.visitor-chat-thread {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #e2e8f0;
  background: transparent;
  padding: 13px 16px;
  text-align: left;
  cursor: pointer;
  display: grid;
  gap: 5px;
}

.visitor-chat-thread:hover,
.visitor-chat-thread.is-active {
  background: #eef6ff;
}

.visitor-chat-thread.has-unread {
  background: #fff7ed;
  box-shadow: inset 3px 0 0 #ef4444;
}

.visitor-chat-thread.has-unread.is-active {
  background: #eef6ff;
}

.visitor-chat-thread-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: #0f172a;
  font-weight: 800;
}

.visitor-chat-thread-title > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.visitor-chat-thread-title > span:last-child {
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}

.visitor-chat-thread-visitor,
.visitor-chat-thread-preview {
  color: #475569;
  font-size: 13px;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.visitor-chat-thread-visitor {
  display: flex;
  align-items: center;
  gap: 6px;
}

.visitor-chat-thread-visitor > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.visitor-chat-unread {
  margin-left: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.visitor-chat-room {
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background: #fff;
}

.visitor-chat-room-head {
  min-height: 58px;
}

.visitor-chat-room-head strong {
  display: inline-block;
  color: #2563eb;
  font-size: 18px;
  margin-right: 8px;
}

.visitor-chat-room-head span {
  color: #0f172a;
  font-weight: 700;
}

.visitor-chat-room-head small {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}

.visitor-chat-delete {
  flex: 0 0 auto;
  border: 1px solid #fecaca;
  border-radius: 999px;
  padding: 8px 12px;
  color: #b91c1c;
  background: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.visitor-chat-delete:hover {
  border-color: #fca5a5;
  background: #fff1f2;
}

.visitor-chat-delete:disabled {
  opacity: 0.55;
  cursor: wait;
}

.visitor-chat-delete[hidden] {
  display: none !important;
}

.visitor-chat-message-list {
  padding: 18px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.visitor-chat-empty {
  margin: auto;
  color: #94a3b8;
  font-weight: 700;
}

.visitor-chat-message {
  max-width: min(620px, 72%);
  display: grid;
  gap: 4px;
}

.visitor-chat-message.is-staff {
  align-self: flex-end;
}

.visitor-chat-message-meta {
  color: #64748b;
  font-size: 12px;
}

.visitor-chat-message-bubble {
  border-radius: 14px;
  padding: 10px 13px;
  background: #f1f5f9;
  color: #0f172a;
  line-height: 1.55;
  white-space: pre-wrap;
}

.visitor-chat-message.is-staff .visitor-chat-message-bubble {
  background: #dbeafe;
}

.visitor-chat-reply {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 14px;
  border-top: 1px solid #dbe3ef;
  background: #fff;
}

.visitor-chat-reply input {
  min-height: 42px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 0 12px;
  font: inherit;
}

.visitor-chat-reply button {
  min-width: 92px;
  border: 0;
  border-radius: 8px;
  background: #0f172a;
  color: #fff;
  font-weight: 800;
}

.visitor-chat-floating {
  position: fixed;
  top: auto;
  right: 24px;
  bottom: 24px;
  z-index: 1200;
}

.public-frontend-shortcut {
  position: fixed;
  top: 24px;
  right: 132px;
  z-index: 1200;
  height: 40px;
  min-width: 58px;
  padding: 0 14px;
  border: 1px solid rgba(214, 181, 121, 0.72);
  border-radius: 999px;
  color: #8a5b12;
  background: #fffaf1;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}

.visitor-chat-floating-button {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(214, 181, 121, 0.65);
  border-radius: 999px;
  background: #fffaf1;
  color: #9a680f;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
  display: grid;
  place-items: center;
  cursor: pointer;
  position: relative;
}

.visitor-chat-floating-button svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.visitor-chat-floating-button span {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 18px;
  text-align: center;
}

.visitor-chat-floating-panel {
  position: absolute;
  top: auto;
  right: 0;
  bottom: 48px;
  width: min(980px, calc(100vw - 32px));
  height: min(680px, calc(100vh - 88px));
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
}

.visitor-chat-floating-head {
  height: 52px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e2e8f0;
  background: #0f172a;
  color: #fff;
}

.visitor-chat-floating-head button {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.visitor-chat-shell-floating {
  height: calc(100% - 52px);
  min-height: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.visitor-chat-shell-floating .visitor-chat-room,
.visitor-chat-shell-floating .visitor-chat-message-list {
  min-height: 0;
}

.visitor-chat-shell-floating .visitor-chat-room {
  height: 100%;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}

.visitor-chat-shell-floating .visitor-chat-sidebar {
  min-height: 0;
  overflow: hidden;
}

.visitor-chat-shell-floating .visitor-chat-thread-list {
  min-height: 0;
  overflow-y: auto;
}

.visitor-chat-shell-floating .visitor-chat-reply {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}

@media (max-width: 899px) {
  body:not(.desktop-page) .app-header {
    min-height: 64px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding-right: 178px;
  }

  body:not(.desktop-page) .brand-row {
    min-width: 0;
  }

  body:not(.desktop-page) .brand-logo-horizontal {
    width: min(136px, calc(100vw - 190px));
    height: 42px;
  }

  body:not(.desktop-page) .account-card {
    position: fixed;
    top: 14px;
    right: 10px;
    z-index: 1220;
    display: block;
    width: auto;
    padding: 0;
  }

  body:not(.desktop-page) .account-card .coin-wallet-button,
  body:not(.desktop-page) .account-card > div {
    display: none !important;
  }

  body:not(.desktop-page) .account-card > button:not(.coin-wallet-button) {
    width: 50px;
    min-width: 50px;
    height: 38px;
    padding: 0;
    border-radius: 999px;
    font-size: 12px;
    box-shadow: 0 10px 24px rgba(75, 50, 22, 0.14);
  }

  .public-frontend-shortcut {
    top: auto;
    right: 12px;
    bottom: calc(142px + env(safe-area-inset-bottom));
    height: 38px;
    min-width: 54px;
    padding: 0 10px;
    font-size: 12px;
    z-index: 5050;
  }

  .visitor-chat-floating {
    top: auto;
    right: 18px;
    bottom: calc(94px + env(safe-area-inset-bottom));
    z-index: 5050;
  }

  .visitor-chat-floating-button {
    width: 38px;
    height: 38px;
  }

  .visitor-chat-floating-panel {
    position: fixed;
    top: 64px;
    right: 10px;
    left: 10px;
    width: auto;
    height: calc(100vh - 92px);
  }

  body.modal-open .public-frontend-shortcut,
  body.modal-open .visitor-chat-floating,
  body.photo-viewer-open .public-frontend-shortcut,
  body.photo-viewer-open .visitor-chat-floating {
    display: none !important;
  }

  .visitor-chat-shell-floating {
    grid-template-columns: 1fr;
  }

  .visitor-chat-shell-floating .visitor-chat-sidebar {
    max-height: 210px;
    border-right: 0;
    border-bottom: 1px solid #dbe3ef;
  }
}

/* Keep desktop header shortcut buttons clickable when the fixed nav spans over them. */
body.desktop-page .desktop-app .main-tabs {
  pointer-events: none;
}
body.desktop-page .desktop-app .main-tabs > button,
body.desktop-page .desktop-app .main-tabs > .owner-report-menu,
body.desktop-page .desktop-app .main-tabs > .owner-report-menu > .owner-report-toggle,
body.desktop-page .desktop-app .main-tabs .owner-report-submenu,
body.desktop-page .desktop-app .main-tabs .owner-report-submenu button {
  pointer-events: auto;
}

/* Keep the chat shortcut in the header; only its window is anchored to the
   lower-right corner of the viewport. */
body.desktop-page .desktop-app .header-page-utilities > .visitor-chat-floating {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  z-index: 132;
}

body.desktop-page .visitor-chat-floating-panel {
  position: fixed;
  top: auto;
  right: 24px;
  bottom: 24px;
  z-index: 20000;
  width: min(980px, calc(100vw - 48px));
  height: min(680px, calc(100vh - 48px));
  overscroll-behavior: contain;
  touch-action: pan-y;
}

/* The chat is its own scroll surface. Prevent wheel/touch scroll from
   chaining into the back-office page when a chat list reaches an edge. */
html:has(body.desktop-page .visitor-chat-floating-panel:not([hidden])),
body.desktop-page:has(.visitor-chat-floating-panel:not([hidden])) {
  overflow: hidden;
  overscroll-behavior: none;
}

body.desktop-page .visitor-chat-floating-panel .visitor-chat-shell-floating,
body.desktop-page .visitor-chat-floating-panel .visitor-chat-sidebar,
body.desktop-page .visitor-chat-floating-panel .visitor-chat-room,
body.desktop-page .visitor-chat-floating-panel .visitor-chat-thread-list,
body.desktop-page .visitor-chat-floating-panel .visitor-chat-message-list {
  overscroll-behavior: contain;
}

/* Keep the public-site and message shortcuts at a stable, readable size on
   desktop monitors. The middle navigation may compact, but these controls
   must not shrink with the available header width. */
@media (min-width: 900px) {
  body.desktop-page .desktop-app .header-account-zone {
    flex: 0 0 auto;
    min-width: 0;
  }

  body.desktop-page .desktop-app .header-page-utilities {
    flex: 0 0 104px;
    width: 104px;
    min-width: 104px;
    gap: 6px;
  }

  body.desktop-page .desktop-app .header-page-utilities > .public-frontend-shortcut {
    flex: 0 0 58px;
    width: 58px;
    min-width: 58px;
    height: 40px;
    min-height: 40px;
    padding: 0;
    font-size: 13px;
    line-height: 40px;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .header-page-utilities > .visitor-chat-floating {
    flex: 0 0 40px;
    width: 40px;
    min-width: 40px;
    height: 40px;
  }

  body.desktop-page .desktop-app .header-page-utilities .visitor-chat-floating-button {
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
  }
}

/* Public visitor phone setting: keep the card readable in the backoffice grid. */
body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-public-contact-phone-settings] {
  grid-column: span 6;
  min-width: 0;
  overflow: visible;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] > .card-title {
  min-height: 66px !important;
  padding: 10px 16px !important;
  box-sizing: border-box;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] > .card-title h2 {
  margin: 0;
  white-space: nowrap;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] > .card-title span {
  display: block;
  margin-top: 4px;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.4;
  white-space: normal;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] > .field-grid.two {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 12px;
  align-items: end;
  padding: 14px 16px 16px;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] .mobile-field {
  min-width: 0;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] [data-public-contact-phone-input] {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] .form-actions {
  display: flex;
  width: auto;
  margin: 0;
  align-self: end !important;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] [data-public-contact-phone-save] {
  width: auto;
  min-width: 112px;
  height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(179, 137, 71, 0.52);
  border-radius: 999px;
  background: linear-gradient(180deg, #ffe08c 0%, #d69725 100%);
  color: #071225;
  font-size: 13px;
  font-weight: 950;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(117, 72, 18, 0.12);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}
body.desktop-page .desktop-app [data-public-contact-phone-settings] [data-public-contact-phone-save]:hover {
  filter: brightness(1.03);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(117, 72, 18, 0.18);
}
@media (max-width: 899px) {
  .page[data-panel="backoffice"] [data-public-contact-phone-settings] > .field-grid.two {
    grid-template-columns: 1fr;
  }
  .page[data-panel="backoffice"] [data-public-contact-phone-settings] [data-public-contact-phone-save] {
    width: 100%;
  }
}

/* 2026-08-02: keep every backoffice management card on a stable desktop grid. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] {
    grid-auto-flow: row;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-public-contact-phone-settings],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-contact-panel="sponsor"],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-accounts],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-customer-sources],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-loan-agents],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-colors] {
    grid-column: span 6 !important;
    min-width: 0;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-watch-permissions],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-repair-masters],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-masters] {
    grid-column: 1 / -1 !important;
    min-width: 0;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card {
    overflow: hidden;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title > div {
    min-width: 0;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title h2,
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title span {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    word-break: break-word;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] .backoffice-card > .card-title > button {
    flex: 0 0 auto;
    min-width: 104px;
    height: 34px;
    padding: 0 16px;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"]
  :is(
    [data-contact-panel="sponsor"],
    [data-backoffice-accounts],
    [data-backoffice-customer-sources],
    [data-backoffice-loan-agents],
    [data-backoffice-vehicle-colors]
  ) > .permission-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 10px;
    align-content: start;
    padding: 12px 14px 14px;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"]
  :is(
    [data-contact-panel="sponsor"],
    [data-backoffice-accounts],
    [data-backoffice-customer-sources],
    [data-backoffice-loan-agents],
    [data-backoffice-vehicle-colors]
  ) > .permission-list > article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    grid-template-rows: auto auto;
    gap: 4px 12px;
    align-items: center;
    min-width: 0;
    min-height: 64px;
    padding: 10px 12px;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"]
  :is(
    [data-contact-panel="sponsor"],
    [data-backoffice-accounts],
    [data-backoffice-customer-sources],
    [data-backoffice-loan-agents],
    [data-backoffice-vehicle-colors]
  ) > .permission-list > article > strong,
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"]
  :is(
    [data-contact-panel="sponsor"],
    [data-backoffice-accounts],
    [data-backoffice-customer-sources],
    [data-backoffice-loan-agents],
    [data-backoffice-vehicle-colors]
  ) > .permission-list > article > span {
    grid-column: 1;
    min-width: 0;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    word-break: break-word;
    line-height: 1.35;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"]
  :is(
    [data-contact-panel="sponsor"],
    [data-backoffice-accounts],
    [data-backoffice-customer-sources],
    [data-backoffice-loan-agents],
    [data-backoffice-vehicle-colors]
  ) > .permission-list > article > div {
    grid-column: 2;
    grid-row: 1 / span 2;
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    align-items: center;
    justify-content: flex-end;
  }

  body.desktop-page .desktop-app .page.active[data-panel="backoffice"]
  :is(
    [data-contact-panel="sponsor"],
    [data-backoffice-accounts],
    [data-backoffice-customer-sources],
    [data-backoffice-loan-agents],
    [data-backoffice-vehicle-colors]
  ) > .permission-list > article > div > button {
    flex: 0 0 auto;
    min-width: 64px;
    height: 32px;
    padding: 0 12px;
    white-space: nowrap;
  }
}

@media (min-width: 901px) and (max-width: 1100px) {
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-public-contact-phone-settings],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-contact-panel="sponsor"],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-accounts],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-customer-sources],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-loan-agents],
  body.desktop-page .desktop-app .page.active[data-panel="backoffice"] > [data-backoffice-vehicle-colors] {
    grid-column: 1 / -1 !important;
  }
}

@media (min-width: 1181px) and (max-width: 1650px) {
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    right: 390px;
    justify-content: space-between;
    gap: 4px;
    padding-right: 8px;
    padding-left: 8px;
  }

  body.desktop-page .desktop-app .header-account-zone {
    gap: 8px;
  }

  body.desktop-page .desktop-app .header-page-utilities {
    flex-basis: 150px;
    width: 150px;
    min-width: 150px;
  }
}

@media (min-width: 1651px) {
  body.desktop-page .desktop-app .header-page-utilities {
    flex-basis: 150px;
    width: 150px;
    min-width: 150px;
  }
}

@media (min-width: 900px) and (max-width: 1180px) {
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    right: 320px;
  }
}

body.desktop-page .desktop-app .staff-management-toolbar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 18px;
}

body.desktop-page .desktop-app .staff-management-title strong {
  display: block;
  color: #111827;
  font-size: 22px;
  font-weight: 900;
}

body.desktop-page .desktop-app .staff-management-title span {
  display: block;
  margin-top: 2px;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
}

body.desktop-page .desktop-app .staff-management-actions .primary {
  min-height: 42px;
  padding: 0 22px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #d9a94c, #9b5f12);
  color: #fff;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(146, 95, 19, 0.22);
}

body.desktop-page .desktop-app .staff-filter-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(260px, 1.5fr) repeat(3, minmax(150px, 0.7fr)) auto;
  gap: 10px;
  align-items: center;
}

body.desktop-page .desktop-app .staff-filter-row input,
body.desktop-page .desktop-app .staff-filter-row select {
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #d7c8b3;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  font-size: 14px;
}

body.desktop-page .desktop-app .staff-search-count {
  grid-column: 1 / -1;
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
}

body.desktop-page .desktop-app .person-list {
  display: block;
}

body.desktop-page .desktop-app .staff-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

body.desktop-page .desktop-app .staff-status-section + .staff-status-section {
  margin-top: 24px;
}

body.desktop-page .desktop-app .staff-status-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 12px;
  padding: 0 2px 10px;
  border-bottom: 1px solid rgba(213, 226, 240, 0.95);
  color: #071225;
  font-size: 15px;
  font-weight: 950;
}

body.desktop-page .desktop-app .staff-status-section-header span {
  color: #9b6b20;
  font-size: 12px;
  font-weight: 900;
}

body.desktop-page .desktop-app .staff-member-card {
  position: relative;
  min-height: 168px;
  padding: 18px;
  border: 1px solid rgba(213, 226, 240, 0.96);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

body.desktop-page .desktop-app .staff-card-menu {
  display: none !important;
}

body.desktop-page .desktop-app .staff-member-card.is-pending {
  border-color: rgba(245, 158, 11, 0.45);
  background: linear-gradient(180deg, #fffaf1 0%, #ffffff 100%);
}

body.desktop-page .desktop-app .staff-card-main {
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 14px;
  align-items: start;
}

body.desktop-page .desktop-app .staff-card-copy {
  display: block;
  min-width: 0;
}

body.desktop-page .desktop-app .staff-card-avatar {
  flex: 0 0 60px;
  width: 76px;
  height: 76px;
  min-width: 76px;
  min-height: 76px;
  max-width: 76px;
  max-height: 76px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 999px;
  border: 0;
  background: linear-gradient(135deg, #f7eddc, #d9a94c);
  color: #704512;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 900;
}

body.desktop-page .desktop-app button.staff-card-avatar {
  padding: 0;
  width: 76px !important;
  height: 76px !important;
  min-width: 76px !important;
  min-height: 76px !important;
  border: 0;
  border-radius: 999px;
  appearance: none;
  font: inherit;
  cursor: zoom-in;
}

body.desktop-page .desktop-app .staff-card-avatar.has-photo {
  background: #f8fafc;
  border: 1px solid rgba(213, 226, 240, 0.95);
  box-shadow: inset 0 0 0 2px #fff;
}

body.desktop-page .desktop-app .staff-card-avatar img {
  flex: 0 0 100%;
  width: 100% !important;
  min-width: 100%;
  height: 100% !important;
  min-height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 999px;
  background: #f8fafc;
}

body.desktop-page .desktop-app .staff-card-name {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  width: auto;
  color: #111827;
  font-size: 17px;
  font-weight: 900;
}

body.desktop-page .desktop-app .staff-owner-mark {
  padding: 2px 6px;
  border-radius: 999px;
  background: #fff4d6;
  color: #9b5f12;
  font-size: 11px;
  font-weight: 900;
}

body.desktop-page .desktop-app .staff-card-role {
  margin-top: 7px;
  display: block;
  width: auto;
  color: #9b5f12;
  font-size: 13px;
  font-weight: 900;
}

body.desktop-page .desktop-app .staff-card-department,
body.desktop-page .desktop-app .staff-card-phone {
  margin-top: 6px;
  display: block;
  width: auto;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

body.desktop-page .desktop-app .staff-card-phone {
  white-space: nowrap;
}

body.desktop-page .desktop-app .staff-card-footer {
  display: flex;
  gap: 7px;
  align-items: center;
  margin-top: 14px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

body.desktop-page .desktop-app .staff-card-footer small {
  margin-left: auto;
  color: #94a3b8;
  font-size: 11px;
}

body.desktop-page .desktop-app .staff-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #f59e0b;
}

body.desktop-page .desktop-app .staff-status-dot.online {
  background: #22c55e;
}

body.desktop-page .desktop-app .staff-card-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 14px;
}

body.desktop-page .desktop-app .staff-card-actions button {
  min-height: 34px;
  border: 1px solid #d7c8b3;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  font-weight: 900;
}

body.desktop-page .desktop-app .staff-card-actions button:first-child {
  border-color: #071225;
  background: #071225;
  color: #fff;
}

body.desktop-page .desktop-app .staff-empty-card {
  display: grid;
  min-height: 140px;
  place-items: center;
  text-align: center;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal {
  width: min(1040px, calc(100vw - 96px));
  max-height: calc(100vh - 72px);
  overflow: hidden;
  border-radius: 14px;
  background: #fffdf9;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header {
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 98px;
  padding: 24px 24px 12px;
  border-bottom: 1px solid #eadfce;
  background: #fffdf9;
  color: #071225;
  box-shadow: none;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header > div:first-child p {
  margin: 0 0 4px;
  color: #9b6b1e;
  font-size: 12px;
  font-weight: 900;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header h2 {
  margin: 0;
  color: #071225;
  font-size: 20px;
  letter-spacing: 0;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header-actions button {
  min-width: 72px;
  height: 38px;
  border: 1px solid #e2d0b8;
  border-radius: 8px;
  background: #fff;
  color: #314056;
  font-size: 14px;
  font-weight: 800;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header-actions .primary {
  border-color: #b77b18;
  background: linear-gradient(135deg, #d9a847, #9d6412);
  color: #fff;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header-actions .staff-editor-delete {
  border-color: rgba(239, 68, 68, 0.4);
  background: #fff7f7;
  color: #dc2626;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-header-actions .staff-editor-close {
  min-width: 34px;
  width: 34px;
  padding: 0;
  border-color: transparent;
  background: transparent;
  color: #8a7b68;
  font-size: 24px;
  line-height: 1;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .modal-body {
  padding: 0;
  background: #fffdf9;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .form-section {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal > .modal-actions {
  display: none;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-shell {
  display: grid;
  grid-template-columns: 156px minmax(0, 1fr);
  min-height: 430px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-sidebar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 32px 12px 28px;
  border-right: 1px solid #eadfce;
  background: #f6efe6;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-photo {
  position: relative;
  display: grid;
  width: 86px;
  height: 86px;
  place-items: center;
  overflow: hidden;
  border: 1px solid #ecd8b4;
  border-radius: 50%;
  background: linear-gradient(135deg, #f8e2aa, #d49b3f);
  color: #8a5a13;
  font-size: 20px;
  font-weight: 900;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-photo.has-photo {
  background: #fff;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-photo.has-photo span {
  display: none;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-photo img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-photo button {
  position: absolute;
  right: 0;
  bottom: 2px;
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border: 1px solid #e3d1bd;
  border-radius: 999px;
  background: #fff;
  color: #b77b18;
  font-size: 13px;
  line-height: 1;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal [data-staff-editor-name] {
  color: #071225;
  font-size: 18px;
  font-weight: 900;
  text-align: center;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-role-pill {
  padding: 5px 12px;
  border-radius: 7px;
  background: #fff4dd;
  color: #a46b15;
  font-size: 13px;
  font-weight: 900;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #4e8f47;
  font-size: 13px;
  font-weight: 800;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-status i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #45b65d;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-nav {
  width: 100%;
  margin-top: 20px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-nav button {
  width: 100%;
  height: 40px;
  border: 0;
  border-radius: 8px;
  background: #fff7e9;
  color: #805512;
  font-size: 14px;
  font-weight: 900;
  text-align: left;
  padding: 0 14px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-content {
  padding: 34px 28px 38px;
  overflow: auto;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-content h3 {
  margin: 0 0 26px;
  color: #273244;
  font-size: 17px;
  font-weight: 900;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-basic-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px 28px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field {
  gap: 8px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field > span {
  color: #5b6473;
  font-size: 13px;
  font-weight: 900;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field input,
body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field select,
body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field textarea {
  min-height: 44px;
  border: 1px solid #e4d0b8;
  border-radius: 8px;
  background: #fff;
  color: #1b2737;
  font-size: 15px;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field.wide {
  grid-column: span 2;
}

body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-profit-access-field {
  grid-column: 1 / -1;
}

.staff-profit-defaults-field {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(360px, 1.15fr);
  align-items: center;
  gap: 20px;
  min-height: 94px;
  padding: 14px 16px;
  border: 1px solid #e4d0b8;
  border-radius: 12px;
  background: linear-gradient(135deg, #fffaf0, #fff);
}

.staff-profit-default-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.staff-profit-default-inputs label {
  display: grid;
  grid-template-columns: auto minmax(72px, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid #dfc69f;
  border-radius: 10px;
  background: #fff;
}

.staff-profit-default-inputs span,
.staff-profit-default-inputs b {
  color: #5d4b31;
  font-size: 13px;
  font-style: normal;
  font-weight: 850;
  white-space: nowrap;
}

.staff-profit-default-inputs input {
  width: 100%;
  min-width: 0;
  height: 34px;
  border: 0;
  border-radius: 7px;
  background: #f7f4ed;
  color: #15233a;
  font-size: 16px;
  font-weight: 900;
  text-align: right;
  outline: none;
}

.staff-profit-default-inputs input:focus {
  box-shadow: 0 0 0 2px rgba(198, 138, 24, 0.24);
}

.staff-profit-access-field {
  position: relative;
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 16px;
  border: 1px solid #e4d0b8;
  border-radius: 12px;
  background: linear-gradient(135deg, #fffaf0, #fff);
  cursor: pointer;
}

.staff-profit-access-copy {
  display: grid;
  gap: 5px;
}

.staff-profit-access-copy strong {
  color: #273244;
  font-size: 14px;
  font-weight: 900;
}

.staff-profit-access-copy small {
  color: #7a8493;
  font-size: 12px;
  line-height: 1.45;
}

.staff-profit-access-field input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.staff-profit-access-field > i {
  position: relative;
  flex: 0 0 48px;
  width: 48px;
  height: 27px;
  border-radius: 999px;
  background: #d5d9df;
  box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12);
  transition: 0.2s ease;
}

.staff-profit-access-field > i::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.22);
  transition: 0.2s ease;
}

.staff-profit-access-field input:checked + i {
  background: linear-gradient(135deg, #dca331, #ad7412);
}

.staff-profit-access-field input:checked + i::after {
  transform: translateX(21px);
}

.staff-profit-access-field.is-locked {
  cursor: default;
  opacity: 0.8;
}

.staff-avatar-lightbox {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background: rgba(15, 23, 42, 0.72);
}

.staff-avatar-lightbox img {
  width: min(430px, 86vw);
  height: min(430px, 76vh);
  border: 8px solid #fff;
  border-radius: 24px;
  object-fit: cover;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.36);
}

.staff-avatar-lightbox-close {
  position: absolute;
  top: 22px;
  right: 24px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: #071225;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

@media (max-width: 900px) {
  body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-shell {
    grid-template-columns: 1fr;
  }

  body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-sidebar {
    border-right: 0;
    border-bottom: 1px solid #eadfce;
  }

  body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .staff-editor-basic-grid {
    grid-template-columns: 1fr;
  }

  body.desktop-page .mobile-modal[data-modal="staff-create"].staff-editor-modal .mobile-field.wide {
    grid-column: auto;
  }
}

@media (max-width: 980px) {
  body.desktop-page .desktop-app .staff-filter-row {
    grid-template-columns: 1fr 1fr;
  }

  body.desktop-page .desktop-app .staff-filter-row input,
  body.desktop-page .desktop-app .staff-filter-row button {
    grid-column: 1 / -1;
  }
}

/* Inventory card actions always occupy the card's far-right column. */
body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="card"] .vehicle-card {
  grid-template-columns: 158px minmax(0, 1fr) minmax(220px, 260px) 84px;
}

body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="card"] .vehicle-card > .card-actions {
  grid-column: 4 / 5;
  justify-self: end;
  align-self: center;
  width: 84px;
  margin-right: 0;
  margin-left: 0;
}

body.desktop-page .desktop-app .page[data-panel="inventory"] .vehicle-list[data-view="card"] .vehicle-card > .card-actions button {
  width: 100%;
}

/* Final header layout for coin + bonus wallet + profile + logout. */
@media (min-width: 1321px) {
  body.desktop-page .desktop-app .account-card {
    width: 320px;
    grid-template-columns: 64px 86px 92px 54px;
    gap: 4px;
  }
  body.desktop-page .desktop-app .main-tabs { right: 490px; }
}
@media (max-width: 1535px) and (min-width: 1321px) {
  body.desktop-page .desktop-app .account-card {
    width: 306px;
    grid-template-columns: 60px 80px 88px 50px;
  }
  body.desktop-page .desktop-app .main-tabs { right: 480px; }
}
@media (max-width: 1320px) and (min-width: 900px) {
  body.desktop-page .desktop-app .account-card {
    width: 292px;
    grid-template-columns: 58px 76px 82px 48px;
    gap: 4px;
  }
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs { right: 460px; }
}
body.desktop-page .desktop-app .account-card > div {
  min-width: 0;
  padding-right: 0;
}
body.desktop-page .desktop-app .account-card > div span,
body.desktop-page .desktop-app .account-card > div strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button {
  display: grid;
  width: auto;
  min-width: 80px;
  height: 32px;
  grid-template-columns: 18px minmax(0, 1fr);
  grid-template-rows: 13px 13px;
  column-gap: 5px;
  align-items: center;
  padding: 2px 6px;
  border: 1px solid #b8d4c4;
  border-radius: 999px;
  color: #1f7350;
  background: #f4fbf7;
  box-shadow: 0 4px 12px rgba(28, 112, 76, .08);
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button svg {
  grid-row: 1 / 3;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #24805b;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button span {
  margin: 0;
  color: #668b78;
  font-size: 8px;
  line-height: 1;
  text-align: left;
}
body.desktop-page .desktop-app .account-card .bonus-wallet-button strong {
  overflow: hidden;
  color: #176b49;
  font-size: 11px;
  line-height: 1;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.desktop-page .desktop-app .account-card > button:not(.coin-wallet-button):not(.bonus-wallet-button) {
  min-width: 48px;
  height: 32px;
  padding: 0 6px;
}
@media (max-width: 899px) {
  body:not(.desktop-page) .account-card .bonus-wallet-button { display: none !important; }
}

/* Account balances live below the user name and expand only when requested. */
@media (min-width: 900px) {
  body.desktop-page .desktop-app .account-card {
    width: 190px;
    grid-template-columns: minmax(0, 1fr) 54px;
    gap: 6px;
    overflow: visible;
  }
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    right: 360px;
  }
  body.desktop-page .desktop-app .account-card > div {
    position: relative;
    overflow: visible;
  }
  body.desktop-page .desktop-app .account-wallet-menu {
    position: relative;
    width: max-content;
    margin-top: 2px;
  }
  body.desktop-page .desktop-app .account-wallet-menu > summary {
    display: flex;
    width: max-content;
    align-items: center;
    gap: 3px;
    padding: 0;
    list-style: none;
    color: #8a6940;
    font-size: 9px;
    font-weight: 850;
    line-height: 1.1;
    cursor: pointer;
    user-select: none;
  }
  body.desktop-page .desktop-app .account-wallet-menu > summary::-webkit-details-marker { display: none; }
  body.desktop-page .desktop-app .account-wallet-menu > summary span {
    color: #b17a27;
    font-size: 10px;
    transition: transform .18s ease;
  }
  body.desktop-page .desktop-app .account-wallet-menu[open] > summary span { transform: rotate(180deg); }
  body.desktop-page .desktop-app .account-wallet-dropdown {
    position: absolute;
    top: calc(100% + 9px);
    right: -8px;
    z-index: 5200;
    display: grid;
    width: 178px;
    gap: 7px;
    padding: 9px;
    border: 1px solid #e7d6bc;
    border-radius: 13px;
    background: #fffdf8;
    box-shadow: 0 16px 38px rgba(72, 49, 18, .2);
  }
  body.desktop-page .desktop-app .account-wallet-dropdown::before {
    content: "";
    position: absolute;
    top: -6px;
    right: 16px;
    width: 10px;
    height: 10px;
    border-top: 1px solid #e7d6bc;
    border-left: 1px solid #e7d6bc;
    background: #fffdf8;
    transform: rotate(45deg);
  }
  body.desktop-page .desktop-app .account-card .account-wallet-dropdown .coin-wallet-button,
  body.desktop-page .desktop-app .account-card .account-wallet-dropdown .bonus-wallet-button {
    width: 100%;
    min-width: 0;
    height: 40px;
    padding: 4px 10px;
    box-sizing: border-box;
  }
}

/* Keep the employee name visible and place a larger, icon-only wallet menu
   directly on its right. */
@media (min-width: 900px) {
  body.desktop-page .desktop-app .account-card {
    width: 236px;
    grid-template-columns: minmax(0, 1fr) 52px 54px;
    gap: 5px;
    align-items: center;
    overflow: visible;
  }
  body.desktop-page .desktop-app .account-card > div {
    position: static;
    overflow: hidden;
  }
  body.desktop-page .desktop-app .account-wallet-menu {
    position: relative;
    width: 52px;
    margin: 0;
  }
  body.desktop-page .desktop-app .account-wallet-menu > summary {
    display: grid;
    width: 48px;
    height: 40px;
    place-items: center;
    padding: 0;
    border: 1px solid #dfbd82;
    border-radius: 14px;
    list-style: none;
    color: #8b5a14;
    background: linear-gradient(145deg, #fffdf8 0%, #fff4df 100%);
    box-sizing: border-box;
    box-shadow: 0 5px 14px rgba(139, 90, 20, .12), inset 0 1px 0 rgba(255, 255, 255, .9);
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
  }
  body.desktop-page .desktop-app .account-wallet-menu > summary:hover {
    border-color: #c99135;
    box-shadow: 0 7px 18px rgba(139, 90, 20, .18), inset 0 1px 0 rgba(255, 255, 255, .95);
    transform: translateY(-1px);
  }
  body.desktop-page .desktop-app .account-wallet-menu > summary span {
    display: block;
    width: 9px;
    height: 9px;
    border-right: 2px solid #071225;
    border-bottom: 2px solid #071225;
    font-size: 0;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .2s ease;
  }
  body.desktop-page .desktop-app .account-wallet-menu[open] > summary {
    border-color: #c58a2c;
    background: linear-gradient(145deg, #fff8eb 0%, #f9e1b8 100%);
  }
body.desktop-page .desktop-app .account-wallet-menu[open] > summary span {
    transform: translateY(2px) rotate(225deg);
  }
  body.desktop-page .desktop-app .account-wallet-dropdown {
    right: 0;
    width: 190px;
  }
}

/* Sales accounts expose fewer destinations. Keep those items together instead
   of stretching four buttons across the whole header and into the account area. */
@media (min-width: 900px) and (max-width: 1180px) {
  body.desktop-page.sales-role-nav .desktop-app .main-tabs,
  body.desktop-page.sales-role-nav .desktop-app.nav-collapsed .main-tabs {
    inset: 0 360px auto 178px;
    justify-content: flex-start;
    gap: 6px;
    padding: 0 6px;
  }
}

@media (min-width: 1181px) and (max-width: 1650px) {
  body.desktop-page.sales-role-nav .desktop-app .main-tabs,
  body.desktop-page.sales-role-nav .desktop-app.nav-collapsed .main-tabs {
    inset: 0 414px auto 178px;
    justify-content: flex-start;
    gap: 18px;
    padding: 0 18px;
  }
}

@media (min-width: 1651px) {
  body.desktop-page.sales-role-nav .desktop-app .main-tabs,
  body.desktop-page.sales-role-nav .desktop-app.nav-collapsed .main-tabs {
    inset: 0 414px auto 236px;
    justify-content: flex-start;
    gap: 24px;
    padding: 0 24px;
  }
}

/* The owner has the full navigation set. On laptop-width screens the header
   shortcuts previously covered the Settings item, so reserve its final slot. */
@media (min-width: 1181px) and (max-width: 1650px) {
  body.desktop-page:has(.main-tabs > button[data-page="backoffice"][aria-hidden="false"]) .desktop-app .account-card {
    width: 190px;
    grid-template-columns: minmax(0, 1fr) 44px 48px;
  }

  body.desktop-page:has(.main-tabs > button[data-page="backoffice"][aria-hidden="false"]) .desktop-app .account-wallet-menu {
    width: 44px;
  }

  body.desktop-page:has(.main-tabs > button[data-page="backoffice"][aria-hidden="false"]) .desktop-app .account-wallet-menu > summary {
    width: 42px;
  }
}

/* Vehicle photo AI captions */
.photo-ai-prompt-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(0, 1fr) minmax(140px, 190px);
  align-items: end;
  gap: 10px 14px;
  padding: 14px;
  border: 1px solid #e4c98f;
  border-radius: 14px;
  background: #fffaf0;
}

.photo-ai-prompt-toolbar label {
  display: grid;
  min-width: 0;
  gap: 6px;
  color: #293246;
  font-weight: 900;
}

.photo-ai-prompt-toolbar select {
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid #d7ab58;
  border-radius: 10px;
  background: #fff;
  color: #172033;
  font-weight: 800;
}

.photo-ai-prompt-toolbar p {
  margin: 0 0 10px;
  color: #64748b;
}

.photo-ai-helper-copy {
  display: grid;
  min-width: 0;
  align-self: center;
  gap: 4px;
}

.photo-ai-helper-copy p {
  margin: 0;
  overflow-wrap: anywhere;
}

[data-ai-provider-status] {
  color: #657083;
  font-size: 13px;
  font-weight: 700;
}

[data-ai-provider-status].online {
  color: #13734a;
}

[data-ai-provider-status].offline {
  color: #b33b2e;
}

.add-photo-ai-provider-toolbar {
  grid-template-columns: minmax(220px, 340px);
  margin-top: 12px;
}

.photo-ai-charge {
  align-self: center;
  white-space: nowrap;
  color: #8a5a09;
  background: #fff6df;
  border: 1px solid #e8c77f;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 800;
}

.photo-ai-prompt-toolbar button,
.ai-prompt-admin-card footer button {
  min-height: 42px;
  padding: 8px 16px;
  border: 1px solid #c9952b;
  border-radius: 10px;
  background: linear-gradient(180deg, #dfae48, #bb7b10);
  color: #fff;
  font-weight: 900;
}

.photo-ai-prompt-toolbar > button {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.vehicle-description-ai {
  display: grid;
  gap: 12px;
  margin: 16px 0;
  padding: 16px;
  border: 1px solid #dfbd78;
  border-radius: 16px;
  background: linear-gradient(145deg, #fffaf1, #fff);
  box-shadow: 0 10px 28px rgba(97, 63, 12, 0.08);
}

.vehicle-description-ai header div {
  display: grid;
  gap: 3px;
}

.vehicle-description-ai header strong {
  color: #172033;
  font-size: 17px;
}

.vehicle-description-ai header span,
.vehicle-description-ai > small {
  color: #6b7280;
  line-height: 1.55;
}

.vehicle-description-ai-actions {
  display: grid;
  grid-template-columns: minmax(220px, 300px) minmax(260px, max-content);
  align-items: end;
  gap: 12px;
}

.vehicle-description-ai-actions label {
  display: grid;
  gap: 6px;
  color: #293246;
  font-weight: 900;
}

.vehicle-description-ai-actions select {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #d7ab58;
  border-radius: 11px;
  background: #fff;
  color: #172033;
  font-weight: 800;
}

.vehicle-description-ai-actions button {
  min-height: 44px;
  padding: 9px 17px;
  border: 1px solid #b77b17;
  border-radius: 11px;
  background: linear-gradient(180deg, #e6b751, #bc7c10);
  color: #111827;
  font-weight: 900;
  cursor: pointer;
}

.vehicle-description-ai-actions button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.vehicle-description-ai [data-ai-provider-status] {
  margin: 0;
  padding: 9px 11px;
  border-radius: 10px;
  background: #f5f7fa;
  color: #64748b;
  font-size: 13px;
}

.vehicle-description-ai [data-ai-provider-status].online {
  background: #edf9f2;
  color: #167244;
}

.vehicle-description-ai [data-ai-provider-status].offline {
  background: #fff1f1;
  color: #b42318;
}

.ai-prompt-settings-list {
  display: grid;
  gap: 14px;
  width: 100%;
  padding: 18px 22px 24px;
  box-sizing: border-box;
}

.ai-prompt-group-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 4px 2px;
}

.ai-prompt-group-title > div {
  display: grid;
  gap: 4px;
}

.ai-prompt-group-title strong {
  color: #182238;
  font-size: 20px;
}

.ai-prompt-group-title span {
  color: #75684f;
  font-size: 14px;
  line-height: 1.55;
}

.ai-prompt-group-title button {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 8px 15px;
  border: 1px solid #c9952b;
  border-radius: 10px;
  background: #fff8ea;
  color: #89570a;
  font-weight: 900;
  cursor: pointer;
}

.page[data-panel="backoffice"] > .ai-prompt-settings {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e4d5bd;
  border-radius: 16px;
  background: #fffdf9;
}

.page[data-panel="backoffice"] > .ai-usage-settings {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e4d5bd;
  border-radius: 16px;
  background: #fffdf9;
}

.ai-usage-total {
  flex: 0 0 auto;
  padding: 10px 16px;
  border: 1px solid #d9aa50;
  border-radius: 999px;
  color: #754808;
  background: #fff;
  font-size: 18px;
  white-space: nowrap;
}

.ai-usage-table-wrap {
  width: 100%;
  overflow-x: auto;
  padding: 18px 22px 24px;
  box-sizing: border-box;
}

.ai-usage-table {
  width: 100%;
  min-width: 820px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid #eadcc4;
  border-radius: 12px;
  background: #fff;
}

.ai-usage-table th,
.ai-usage-table td {
  padding: 13px 14px;
  border-bottom: 1px solid #eee4d4;
  color: #243046;
  text-align: left;
  vertical-align: middle;
}

.ai-usage-table th {
  color: #6d5738;
  background: #faf5ec;
  font-size: 13px;
}

.ai-usage-table tr:last-child td {
  border-bottom: 0;
}

.ai-usage-table td:last-child b {
  color: #9b6108;
  font-size: 16px;
  white-space: nowrap;
}

.ai-usage-empty {
  padding: 36px 16px !important;
  color: #8b8173 !important;
  text-align: center !important;
}

@media (max-width: 899px) {
  .ai-usage-settings .coin-settings-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .ai-usage-total {
    font-size: 16px;
  }
  .ai-usage-table-wrap {
    padding: 12px;
  }
}

.ai-prompt-admin-card {
  display: grid;
  grid-template-columns: 1fr 1fr 110px;
  gap: 12px;
  padding: 16px;
  border: 1px solid #ead5ab;
  border-radius: 15px;
  background: #fffdf8;
}

.ai-prompt-admin-card header,
.ai-prompt-admin-card > label:has(textarea),
.ai-prompt-admin-card footer {
  grid-column: 1 / -1;
}

.ai-prompt-admin-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ai-prompt-admin-card header div,
.ai-prompt-admin-card > label {
  display: grid;
  gap: 6px;
}

.ai-prompt-admin-card header strong {
  font-size: 18px;
}

.ai-prompt-admin-card header small {
  color: #94702b;
}

.ai-prompt-admin-card input,
.ai-prompt-admin-card textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #d8dee9;
  border-radius: 10px;
  background: #fff;
  color: #172033;
  font: inherit;
  line-height: 1.55;
}

.ai-prompt-admin-card footer {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
}

.ai-prompt-admin-card footer button.danger {
  border-color: #e4b0ad;
  background: #fff4f3;
  color: #b42318;
}

.photo-ai-header-actions {
  display: flex;
  flex: 1 1 430px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.display-photo-box > header,
.outdoor-photo-box > header {
  flex-wrap: wrap;
  align-items: center;
}

.photo-ai-header-actions > span {
  margin-left: auto;
}

.sub-photo-box [data-photo-ai-generate-all] {
  width: auto !important;
  height: 34px !important;
  min-height: 34px;
  padding: 6px 12px;
  border-color: #c9952b;
  border-radius: 18px;
  background: linear-gradient(180deg, #e3b451, #bc7d11);
  color: #fff;
  font-weight: 900;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 6px 14px rgba(176, 112, 12, .18);
}

.sub-photo-box .line-photo-share-button {
  width: auto !important;
  height: 34px !important;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 6px 12px;
  border: 1px solid #06c755;
  border-radius: 18px;
  background: #06c755;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.sub-photo-box .line-photo-share-button:hover:not(.is-disabled) {
  border-color: #05ad4a;
  background: #05ad4a;
}

.sub-photo-box .social-photo-share-button {
  width: auto !important;
  height: 34px !important;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 6px 12px;
  border: 1px solid #6a5bd7;
  border-radius: 18px;
  background: linear-gradient(135deg, #168aff 0%, #8555d9 52%, #e1306c 100%);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.sub-photo-box .social-photo-share-button:hover:not(:disabled) {
  filter: brightness(.94);
}

.sub-photo-box .social-photo-share-button:disabled,
.sub-photo-box .social-photo-share-button.is-disabled {
  cursor: not-allowed;
  opacity: .48;
}

.sub-photo-box .line-photo-share-button.is-disabled,
.sub-photo-box .line-photo-share-button[aria-disabled="true"] {
  opacity: .48;
  cursor: not-allowed;
}

.vehicle-social-share-dialog {
  width: min(560px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  padding: 0;
  overflow: hidden;
  border: 1px solid #e6d6ba;
  border-radius: 20px;
  background: #fffdf9;
  color: #172033;
  box-shadow: 0 24px 70px rgba(20, 28, 45, .28);
}

.vehicle-social-share-dialog::backdrop {
  background: rgba(14, 20, 34, .58);
  backdrop-filter: blur(3px);
}

.vehicle-social-share-dialog__body {
  display: grid;
  gap: 14px;
  max-height: calc(100vh - 28px);
  padding: 18px;
  overflow-y: auto;
}

.vehicle-social-share-dialog__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.vehicle-social-share-dialog__head h3 {
  margin: 0 0 4px;
  font-size: 19px;
}

.vehicle-social-share-dialog__head p,
.vehicle-social-share-dialog__hint {
  margin: 0;
  color: #667085;
  font-size: 13px;
  line-height: 1.55;
}

.vehicle-social-share-dialog__close {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border: 1px solid #d9dee8;
  border-radius: 50%;
  background: #fff;
  color: #344054;
  font-size: 20px;
  cursor: pointer;
}

.vehicle-social-share-dialog__preview {
  width: min(100%, 350px);
  max-height: 430px;
  justify-self: center;
  object-fit: contain;
  border-radius: 14px;
  background: #111827;
  box-shadow: 0 10px 28px rgba(17, 24, 39, .16);
}

.vehicle-social-share-dialog__summary {
  padding: 10px 12px;
  border: 1px solid #eadfce;
  border-radius: 12px;
  background: #fff;
  color: #475467;
  font-size: 13px;
}

.vehicle-social-share-dialog__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.vehicle-social-share-dialog__actions button {
  min-height: 42px;
  border: 1px solid #d7bf94;
  border-radius: 12px;
  background: #fffaf1;
  color: #7a4e08;
  font-weight: 900;
  cursor: pointer;
}

.vehicle-social-share-dialog__actions [data-social-share-native] {
  border-color: transparent;
  background: linear-gradient(135deg, #168aff 0%, #8555d9 52%, #e1306c 100%);
  color: #fff;
}

.vehicle-social-share-dialog__actions [data-social-share-photos] {
  border-color: #d7bf94;
  background: linear-gradient(180deg, #fffdf8 0%, #fff7e8 100%);
}

.vehicle-social-share-dialog__actions [data-social-share-copy] {
  grid-column: 1 / -1;
  background: #fff;
}

.vehicle-social-share-dialog__actions button:disabled {
  cursor: not-allowed;
  opacity: .5;
}

.sub-photo-box [data-photo-ai-generate-all]:disabled {
  cursor: not-allowed;
  opacity: .5;
  box-shadow: none;
}

.sub-photo-empty:has(.photo-ai-item) {
  align-items: stretch;
  overflow-x: auto;
}

.photo-ai-item {
  display: grid;
  flex: 0 0 min(31%, 270px);
  min-width: 210px;
  gap: 8px;
}

.photo-ai-caption {
  display: grid;
  gap: 7px;
}

.photo-ai-caption textarea,
.add-ai-photo-item textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 76px;
  padding: 9px 10px;
  resize: vertical;
  border: 1px solid #d8dee9;
  border-radius: 10px;
  background: #fff;
  color: #172033;
  font: inherit;
  line-height: 1.45;
}

.photo-ai-caption > div {
  display: flex;
  gap: 7px;
}

.photo-ai-caption button,
.add-ai-photo-item button {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #d9aa4d;
  border-radius: 9px;
  background: #fff9ed;
  color: #83570c;
  font-weight: 800;
  cursor: pointer;
}

.photo-ai-caption button:last-child {
  border-color: #cad4e3;
  background: #f4f7fb;
  color: #22304a;
}

.photo-ai-caption button:disabled,
.add-ai-photo-item button:disabled {
  cursor: wait;
  opacity: .65;
}

.add-photo-card b:has(.add-ai-photo-list) {
  display: block;
  width: 100%;
  max-height: 460px;
  overflow: auto;
}

.add-ai-photo-list {
  display: grid;
  gap: 10px;
}

.add-ai-photo-item {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid #d9e0eb;
  border-radius: 11px;
  background: #fff;
}

.add-ai-photo-item img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 8px;
}

.add-ai-photo-item small {
  overflow: hidden;
  color: #64748b;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .photo-ai-prompt-toolbar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .photo-ai-prompt-toolbar p {
    margin: 0;
  }

  .vehicle-description-ai-actions {
    grid-template-columns: 1fr;
  }

  .vehicle-description-ai-actions button {
    width: 100%;
  }

  .ai-prompt-admin-card {
    grid-template-columns: 1fr;
  }

  .ai-prompt-settings-list {
    padding: 12px;
  }

  .ai-prompt-group-title {
    align-items: stretch;
    flex-direction: column;
  }

  .ai-prompt-group-title button {
    width: 100%;
  }

  .ai-prompt-admin-card > * {
    grid-column: 1 !important;
  }

  .photo-section-head {
    align-items: flex-start;
  }

  .photo-ai-header-actions {
    display: grid;
    flex: 1 1 100%;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    justify-content: stretch;
    gap: 6px;
  }

  .sub-photo-box [data-photo-ai-generate-all] {
    order: 2;
    width: 100% !important;
    max-width: 100%;
    padding-inline: 10px;
  }

  .sub-photo-box .line-photo-share-button {
    order: 1;
    width: 100% !important;
    max-width: 100%;
    padding-inline: 10px;
  }

  .sub-photo-box .social-photo-share-button {
    order: 1;
    width: 100% !important;
    max-width: 100%;
    padding-inline: 10px;
  }

  .photo-ai-header-actions > span {
    grid-column: 1 / -1;
    justify-self: end;
    margin-left: 0;
  }

  .photo-ai-item {
    flex-basis: 82%;
    min-width: 230px;
    scroll-snap-align: start;
  }

  .mobile-modal[data-modal="vehicle-manage"] .sub-photo-box .sub-photo-empty:has(.photo-ai-item) {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    justify-items: initial !important;
    place-items: initial !important;
    gap: 10px !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
  }

  .mobile-modal[data-modal="vehicle-manage"] .photo-ai-caption > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 7px;
  }

  .mobile-modal[data-modal="vehicle-manage"] .photo-ai-caption button {
    width: 100%;
    min-width: 0;
    padding-inline: 6px;
  }
}

@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
    padding-right: min(48vw, 900px);
  }

  body.desktop-page .desktop-app .inventory-management-detail {
    width: min(48vw, 900px);
  }
}

@media (min-width: 901px) and (max-width: 1320px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
    padding-right: 55vw;
  }

  body.desktop-page .desktop-app .inventory-management-detail {
    width: 55vw;
  }
}

/* 2026-08-02: restore the original sold-record table beside the newer management table. */
.desktop-app .sold-legacy-table-cells {
  display: none;
}

@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="sold"] .view-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] {
    display: block;
    overflow-x: auto;
    border: 1px solid #dbe4ef;
    border-radius: 0;
    background: #fff;
    box-shadow: inset 0 -8px 0 #f7f9fb;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-head,
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-card {
    display: grid;
    width: 100%;
    min-width: 1620px;
    grid-template-columns: 52px 80px 104px 56px 86px 88px 106px 136px 136px 84px 84px 84px 84px 84px 76px 76px 94px 104px;
    align-items: center;
    gap: 0;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-head {
    height: 38px;
    padding: 0 4px;
    border-bottom: 1px solid #dfe5ec;
    background: #f7f7f7;
    color: #172033;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-head span {
    min-width: 0;
    padding: 0 3px;
    overflow: hidden;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-card {
    position: relative;
    min-height: 42px;
    padding: 3px 4px;
    border: 0;
    border-bottom: 1px solid #e3e7ed;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-card::after {
    display: none;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-thumb {
    display: block;
    grid-column: 1;
    grid-row: 1;
    width: 40px;
    height: 30px;
    align-self: center;
    border-radius: 4px;
    object-fit: cover;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-thumb-empty {
    grid-column: 1;
    grid-row: 1;
    width: 40px;
    height: 30px;
    border-radius: 4px;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-table-cells,
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-info,
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .desktop-status-panel,
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .card-actions {
    display: none !important;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells {
    display: contents;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > * {
    display: block;
    grid-row: 1;
    min-width: 0;
    min-height: 0;
    padding: 0 3px;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #172033;
    font-size: 12px;
    font-weight: 750;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(1) { grid-column: 2; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(2) { grid-column: 3; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(3) { grid-column: 4; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(4) { grid-column: 5; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(5) { grid-column: 6; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(6) { grid-column: 7; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(7) { grid-column: 8; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(8) { grid-column: 9; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(9) { grid-column: 10; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(10) { grid-column: 11; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(11) { grid-column: 12; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(12) { grid-column: 13; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(13) { grid-column: 14; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(14) { grid-column: 15; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(15) { grid-column: 16; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(16) { grid-column: 17; }
  body.desktop-page .desktop-app .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > :nth-child(17) { grid-column: 18; }
}

@media (max-width: 900px) {
  body:not(.desktop-page) .page[data-panel="sold"] [data-view-group="sold"] [data-view="legacy-table"] {
    display: none !important;
  }
}

/* Final layout authority for the split front-office / back-office inline editor. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions button {
    min-height: 68px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel.active {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro h3::before {
    content: none;
  }
}

/* 2026-08-02: compact design-spec editor used only by management-table detail drawer. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
    padding-right: min(46vw, 820px);
  }

  body.desktop-page .desktop-app .inventory-management-detail {
    width: min(46vw, 820px);
    color: #142039;
    background: #fff;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-header {
    grid-template-columns: minmax(220px, 43%) minmax(0, 1fr);
    gap: 16px;
    padding: 13px 16px 10px;
    background: #fff;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-close {
    top: 8px;
    right: 9px;
    width: 28px;
    height: 28px;
    color: #263247;
    box-shadow: none;
    font-size: 24px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-hero {
    height: 148px;
    border-radius: 7px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-heading h2 {
    font-size: 23px;
    letter-spacing: -.02em;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-heading > div > strong {
    min-height: 25px;
    padding: 2px 8px;
    font-size: 12px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-heading p {
    margin: 7px 0 2px;
    font-size: 13px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-heading .management-certification {
    width: 55px;
    min-height: 55px;
    margin-top: 7px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-heading .management-certification > i {
    width: 53px;
    height: 53px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-thumbs {
    gap: 7px;
    min-height: 52px;
    padding: 0 16px 10px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-thumbs button {
    width: 61px;
    height: 43px;
    flex-basis: 61px;
    border-radius: 6px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions {
    grid-template-columns: repeat(auto-fit, minmax(86px, 1fr));
    gap: 5px;
    padding: 6px 8px;
    background: #fff;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions button {
    min-height: 58px;
    gap: 2px;
    padding: 4px 2px;
    border-color: #e5e9ef;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.15;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions button i {
    width: 27px;
    height: 27px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions button svg {
    width: 25px;
    height: 25px;
    stroke-width: 1.8;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-detail-actions button.active {
    border-color: #d3a556;
    color: #8a5a12;
    background: #fff9ed;
    box-shadow: inset 0 0 0 1px rgba(193, 132, 32, .12);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor-host {
    border-top: 0;
    background: #fff;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-body {
    background: #fff;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-panel {
    padding: 11px 16px 62px;
    background: #fff;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-section-intro {
    display: none !important;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .mobile-field {
    gap: 4px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .mobile-field > span,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-picker legend,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor h4 {
    color: #26354b;
    font-size: 14px;
    font-weight: 850;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .mobile-field input,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .mobile-field select {
    width: 100%;
    min-height: 38px;
    height: 38px;
    padding: 0 11px;
    border: 1px solid #dfe4eb;
    border-radius: 5px;
    color: #17233a;
    background-color: #fff;
    box-shadow: none;
    font-size: 14px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .mobile-field textarea {
    width: 100%;
    min-height: 84px;
    padding: 10px 11px;
    border: 1px solid #dfe4eb;
    border-radius: 5px;
    color: #17233a;
    background: #fff;
    box-shadow: none;
    font-size: 14px;
    line-height: 1.45;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .field-grid.two,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .choice-grid.two {
    gap: 7px 10px;
  }

  /* Back-office panel */
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-stack {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 14px;
    margin: 0;
  }

  /* Keep the compact selectors side by side and move funding details onto a full-width row. */
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(2) {
    display: contents;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(2) > .manage-funding-main {
    display: grid;
    grid-column: 2;
    align-content: start;
    gap: 7px;
    padding: 10px 0 11px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(2) > .funding-contributors {
    grid-column: 1 / -1;
    margin: 8px 0 12px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block {
    align-content: start;
    gap: 7px;
    padding: 10px 0 11px;
    border: 0;
    border-bottom: 1px solid #edf0f4;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(3),
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(4),
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(7) {
    grid-column: 1 / -1;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block h3 {
    display: flex;
    min-height: 21px;
    align-items: center;
    gap: 6px;
    margin: 0 0 1px;
    color: #1b2940;
    font-size: 16px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block h3::before {
    width: 3px;
    height: 17px;
    flex: 0 0 3px;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block h3 .manage-section-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-choice-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-choice-grid.funding {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(1) .manage-choice-grid,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(2) .manage-choice-grid.funding {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-choice-grid button,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-brand-actions button {
    height: 36px;
    padding: 0 8px;
    border-radius: 5px;
    box-shadow: none;
    font-size: 13px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-choice-grid button > svg {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(1) .manage-choice-grid button,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-info-block:nth-child(2) .manage-choice-grid button {
    min-height: 38px;
    height: auto;
    line-height: 1.2;
    white-space: normal;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-choice-grid button.selected.user-selected {
    box-shadow: inset 0 -2px 0 rgba(91, 55, 11, .28);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-brand-grid {
    gap: 7px 10px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-brand-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-search-field {
    margin: 0;
  }

  /* Front-office panel */
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel.active {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 8px 14px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .public-publish-setting,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .public-spec-fields,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .vehicle-description-ai,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .mobile-field.wide {
    grid-column: 1 / -1;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-document-summary,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-picker,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-spec-fields,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .mobile-field.wide {
    margin: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting {
    display: grid;
    grid-template-columns: 135px minmax(220px, 310px);
    justify-content: start;
    gap: 10px;
    padding: 3px 0 8px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting h4 {
    margin: 0;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting .choice-grid {
    gap: 0;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-publish-setting button {
    height: 36px;
    border-radius: 0;
    box-shadow: none;
    font-size: 13px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-spec-fields {
    padding: 2px 0 10px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(6, 36px);
    grid-auto-flow: row;
    column-gap: 20px;
    row-gap: 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .mobile-field {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    min-width: 0;
    margin: 0;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .mobile-field > span {
    margin: 0;
    font-size: 13px;
    line-height: 1.2;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .mobile-field input,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .mobile-field select {
    width: 100%;
    height: 36px;
    min-height: 36px;
    padding-top: 2px;
    padding-bottom: 2px;
    border-radius: 4px;
    font-size: 13px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-left {
    grid-column: 1;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-right {
    grid-column: 2;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-row-1 {
    grid-row: 1;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-row-2 {
    grid-row: 2;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-row-3 {
    grid-row: 3;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-row-4 {
    grid-row: 4;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-row-5 {
    grid-row: 5;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .manage-public-spec-fields .manage-spec-row-6 {
    grid-row: 6;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-document-summary,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-picker {
    min-height: 0;
    padding: 8px 0 10px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-document-summary h4 {
    margin: 0 0 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-document-summary > p {
    display: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .certification-logo-picker {
    display: grid;
    gap: 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .certification-logo-picker > span {
    font-size: 13px;
    font-weight: 850;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .certification-logo-options {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .certification-logo-options button {
    min-width: 0;
    min-height: 48px;
    height: 48px;
    padding: 2px;
    border-radius: 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .certification-logo-options button i {
    width: 35px;
    height: 35px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .certification-logo-options button em {
    display: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .warranty-link-fields {
    margin-top: 6px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-picker legend {
    margin-bottom: 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-options {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-options label {
    min-width: 0;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .public-advantage-options label span {
    min-height: 34px;
    padding: 5px 6px;
    border-radius: 5px;
    font-size: 12px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai {
    padding: 8px 0 10px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai header {
    display: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 1fr);
    gap: 10px;
    align-items: end;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai-actions label {
    display: grid;
    gap: 4px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai-actions label span {
    font-size: 14px;
    font-weight: 850;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai-actions select,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai-actions button {
    height: 38px;
    min-height: 38px;
    border-radius: 5px;
    font-size: 13px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-description-ai > small {
    display: none;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .mobile-field.wide {
    padding: 0;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .vehicle-public-content-panel > .mobile-field.wide textarea {
    min-height: 68px;
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-actions {
    position: fixed;
    right: 0;
    bottom: 0;
    width: min(46vw, 820px);
    box-sizing: border-box;
    gap: 9px;
    padding: 8px 16px;
    background: rgba(255, 255, 255, .97);
  }

  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-actions button {
    min-width: 78px;
    height: 38px;
    padding: 0 16px;
    font-size: 14px;
  }
}

@media (min-width: 901px) and (max-width: 1320px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"].management-detail-open {
    padding-right: 58vw;
  }

  body.desktop-page .desktop-app .inventory-management-detail,
  body.desktop-page .desktop-app .inventory-management-detail .management-inline-editor .modal-actions {
    width: 58vw;
  }
}

/* Keep every desktop inventory action, including inspection alerts, on one row. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"] .hy-page-actions .title-search-row,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row {
    width: min(1100px, 76vw);
    grid-template-columns:
      repeat(4, minmax(84px, .52fr))
      minmax(170px, 1.25fr)
      auto auto auto auto;
    gap: 8px;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row button {
    min-width: 0;
    padding-inline: 12px;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .title-inspection-alert {
    min-width: 96px;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .title-ai-copy {
    min-width: 88px;
  }
}

@media (min-width: 901px) and (max-width: 1180px) {
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .hy-page-brand {
    display: none;
  }

  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .hy-page-actions,
  body.desktop-page .desktop-app .page[data-panel="inventory"] .inventory-title-strip .title-search-row {
    width: 100%;
  }
}

/* Keep the desktop header navigation compact on wide screens. The previous
   space-between layout expanded every gap as the viewport became wider. */
@media (min-width: 1321px) {
  body.desktop-page .desktop-app .main-tabs,
  body.desktop-page .desktop-app.nav-collapsed .main-tabs {
    justify-content: center !important;
    gap: 10px !important;
  }
}

/* 2026-08-05: keep all four sold-vehicle views visually aligned with vehicle data. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list {
    width: 100%;
  }

  /* Card view: same photo, row height and information rhythm as inventory cards. */
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-card:not(.sales-sold-card) {
    grid-template-columns: 158px minmax(0, 1fr) minmax(170px, 260px) 92px;
    grid-template-areas: "sold-photo sold-info sold-profit sold-actions";
    min-height: 216px;
    gap: 16px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-thumb {
    width: 158px;
    height: 124px;
    border-radius: 10px;
    object-fit: cover;
    box-shadow: 0 4px 12px rgba(20, 30, 50, .12);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-info {
    min-width: 0;
    align-self: center;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-card h2 {
    font-size: 18px;
    line-height: 1.2;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-meta-line,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-extra-line {
    font-size: 12px;
    line-height: 1.45;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-grid {
    gap: 8px;
    margin-top: 10px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-grid span {
    min-height: 48px;
    border: 1px solid #e7ebf1;
    border-radius: 8px;
    background: #fbfcfe;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-profit-panel {
    min-height: 112px;
    align-self: center;
    justify-content: center;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-card-actions {
    display: flex;
    width: 92px;
    flex-direction: column;
    align-self: center;
    justify-self: end;
    gap: 7px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="card"] .sold-card-actions button {
    width: 100%;
    min-height: 32px;
    border-radius: 7px;
  }

  /* Compact view: same two-column card size as inventory and never leak content. */
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] {
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 12px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-card {
    grid-template-columns: 132px minmax(0, 1fr);
    grid-template-areas: "sold-photo sold-info" "sold-actions sold-actions";
    min-width: 0;
    min-height: 224px;
    overflow: hidden;
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-thumb {
    width: 132px;
    height: 112px;
    border-radius: 9px;
    object-fit: cover;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-info {
    min-width: 0;
    overflow: hidden;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-title-text,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-meta-line {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-grid span {
    min-width: 0;
    min-height: 46px;
    border: 1px solid #e7ebf1;
    border-radius: 7px;
    background: #fbfcfe;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="compact"] .sold-card-actions {
    grid-area: sold-actions;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 8px 10px 10px;
    overflow: hidden;
    border-top: 1px solid #edf0f4;
  }

  /* Management table: use inventory's large photo and spacious row proportions. */
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] {
    overflow-x: auto;
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(20, 35, 60, .05);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-table-head,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-card {
    width: 100%;
    min-width: 1080px;
    grid-template-columns:
      174px
      minmax(145px, 1.35fr)
      minmax(72px, .62fr)
      minmax(145px, 1.35fr)
      minmax(68px, .58fr)
      minmax(65px, .56fr)
      minmax(65px, .56fr)
      minmax(72px, .62fr)
      minmax(72px, .62fr)
      minmax(72px, .62fr)
      minmax(158px, 1.15fr);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-card {
    position: relative;
    min-height: 148px;
    padding: 12px 14px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-card:hover {
    z-index: 1;
    background: #f7faff;
    box-shadow: inset 3px 0 #1f5cb2;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-thumb {
    width: 158px;
    height: 124px;
    align-self: center;
    border-radius: 10px;
    object-fit: cover;
    box-shadow: 0 3px 10px rgba(20, 30, 50, .12);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .management-vehicle-summary strong {
    font-size: 16px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .management-money {
    font-size: 16px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .card-actions {
    grid-column: 11;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-self: center;
    gap: 6px;
    padding: 0 4px 0 10px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .card-actions button {
    min-height: 34px;
    border-radius: 7px;
    font-size: 11px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .card-actions .delete {
    grid-column: 1 / -1;
  }

  /* Legacy table: retain all accounting columns but use the same visual density. */
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] {
    overflow-x: auto;
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(20, 35, 60, .05);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] .sold-legacy-table-head {
    height: 44px;
    background: #fbfbfc;
    color: #606978;
    font-size: 12px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] .sold-legacy-table-head,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] .sold-card {
    min-width: 1652px;
    grid-template-columns: 84px 80px 104px 56px 86px 88px 106px 136px 136px 84px 84px 84px 84px 84px 76px 76px 94px 104px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] .sold-card {
    min-height: 82px;
    padding-block: 10px;
    border-bottom: 1px solid #edf0f4;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] .sold-thumb {
    width: 72px;
    height: 58px;
    border-radius: 8px;
    object-fit: cover;
    box-shadow: 0 2px 8px rgba(20, 30, 50, .12);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="legacy-table"] .sold-legacy-table-cells > * {
    font-size: 12px;
    line-height: 1.35;
  }
}

/* 2026-08-05: sold management table uses the same split editor as inventory. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="sold"] {
    box-sizing: border-box;
    transition: padding-right .2s ease;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"].management-detail-open {
    padding-right: min(46vw, 820px);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-card {
    cursor: pointer;
    transition: background-color .16s ease, box-shadow .16s ease;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-card:focus-visible {
    z-index: 1;
    outline: none;
    background: #f7faff;
    box-shadow: inset 3px 0 #1f5cb2;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .card-actions {
    display: none !important;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .management-row-index {
    position: absolute;
    z-index: 3;
    top: 8px;
    left: 8px;
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 5px;
    color: #fff;
    background: linear-gradient(145deg, #c88b24, #8e5c0b);
    box-shadow: 0 4px 9px rgba(120, 77, 10, .22);
    font-size: 10px;
    font-weight: 900;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-management-row-chevron {
    grid-column: 11;
    display: grid;
    width: 34px;
    height: 44px;
    place-self: center;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 10px;
    color: #1f5cb2;
    background: transparent;
    font-size: 31px;
    font-weight: 300;
    line-height: 1;
    cursor: pointer;
    transition: color .16s ease, background .16s ease, transform .16s ease;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-list[data-view="table"] .sold-management-row-chevron:hover {
    color: #fff;
    background: #1f5cb2;
    transform: translateX(2px);
  }
}

@media (min-width: 901px) and (max-width: 1320px) {
  body.desktop-page .desktop-app .page[data-panel="sold"].management-detail-open {
    padding-right: 58vw;
  }
}

/* 2026-08-05: make the desktop sold page share the inventory page visual system. */
@media (min-width: 901px) {
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip {
    min-height: 88px;
    margin-bottom: 22px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip > .hy-page-actions {
    display: grid;
    width: min(1120px, 74vw);
    grid-template-columns: minmax(500px, 1.55fr) minmax(270px, 1fr);
    align-items: center;
    gap: 8px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .sold-title-filters {
    display: grid;
    width: 100%;
    grid-template-columns:
      minmax(105px, 0.9fr)
      minmax(150px, 1.2fr)
      minmax(100px, 0.8fr)
      minmax(110px, 0.95fr);
    gap: 8px;
    margin: 0;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .sold-title-filters select,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .sold-search-card input {
    height: 42px;
    border: 1px solid #e0e5ec;
    border-radius: 8px;
    background: #fff;
    color: #172033;
    font-size: 13px;
    font-weight: 800;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .sold-title-filters select {
    min-width: 0;
    padding: 0 12px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip .sold-search-card {
    width: 100%;
    margin: 0;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card {
    --sold-icon: none;
    --sold-icon-color: #5f6876;
    position: relative;
    min-height: 104px;
    overflow: hidden;
    padding: 17px 20px 15px 76px;
    border: 1px solid #e8ebf1;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(15, 34, 64, 0.04);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card::before {
    position: absolute;
    top: 30px;
    left: 18px;
    width: 46px;
    height: 46px;
    content: "";
    background-color: transparent;
    background-image: var(--sold-icon);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card::after {
    content: none;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(1) {
    --sold-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a5a18' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.2 12.8 21a2 2 0 0 1-2.8 0L3 14V4h10l7.6 7.6a1.1 1.1 0 0 1 0 1.6Z'/%3E%3Ccircle cx='8' cy='9' r='1.5'/%3E%3C/svg%3E");
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(2) {
    --sold-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b765e' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 8.5c-.7-.7-1.7-1-3-1-1.7 0-3 .9-3 2.2 0 3.3 6 1.4 6 4.6 0 1.3-1.3 2.2-3 2.2-1.2 0-2.3-.4-3-1.2M12 5.5v13'/%3E%3C/svg%3E");
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(3) {
    --sold-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23665783' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Cpath d='M3 10h18M7 14h3'/%3E%3C/svg%3E");
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card:nth-child(4) {
    --sold-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23906a2c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M8 7h8M8 11h2M12 11h2M16 11h0M8 15h2M12 15h2M16 15h0'/%3E%3C/svg%3E");
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card span,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card strong,
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card small {
    position: relative;
    z-index: 1;
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    background: transparent;
    border-radius: 0;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card span {
    margin: 0;
    min-height: 0;
    color: #5b6472;
    font-size: 12px;
    font-weight: 800;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card strong {
    margin: 4px 0 0;
    color: #13213a;
    font-size: 23px;
    line-height: 1.05;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-summary-grid .metric-card small {
    margin: 7px 0 0;
    color: #7e8795;
    font-size: 11px;
    font-weight: 650;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-view-toolbar {
    display: flex;
    min-height: 70px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 14px;
    padding: 12px 14px;
    border: 1px solid #e4e8ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(20, 35, 60, 0.05);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-view-toolbar .view-tabs {
    display: flex;
    width: auto;
    flex: 0 1 auto;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 0;
    border-radius: 10px;
    background: #f3f5f8;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-view-toolbar .view-tabs button {
    width: auto;
    min-width: 96px;
    height: 38px;
    padding: 0 15px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #5c6677;
    font-size: 12px;
    font-weight: 850;
    box-shadow: none;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-view-toolbar .view-tabs button.active {
    border-color: #d8dee8;
    background: #fff;
    color: #10213f;
    box-shadow: 0 3px 10px rgba(16, 33, 63, 0.1);
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-sort-control {
    margin-left: auto;
  }
}

@media (min-width: 901px) and (max-width: 1180px) {
  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  body.desktop-page .desktop-app .page[data-panel="sold"] .sold-title-strip > .hy-page-actions {
    width: 100%;
    grid-template-columns: minmax(0, 1.55fr) minmax(220px, 1fr);
  }
}
/* Cross-dealership shared inventory */
.title-shared-vehicle-toggle {
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid #c78524;
  border-radius: 12px;
  background: #fffaf1;
  color: #9a6114;
  font-weight: 800;
  white-space: nowrap;
}

.title-shared-vehicle-toggle.active {
  background: #111827;
  border-color: #111827;
  color: #fff;
}

.shared-vehicle-setting .choice-grid {
  max-width: 420px;
  margin: 12px 0;
}

.shared-vehicle-setting [data-peer-asking-price-field] {
  max-width: 420px;
}

.shared-vehicle-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 22px;
  margin-bottom: 10px;
  border: 1px solid #e5d5bd;
  border-radius: 16px;
  background: linear-gradient(135deg, #fffaf2, #fff);
}

.shared-vehicle-list-head small,
.shared-vehicle-summary small {
  color: #b1741d;
  font-weight: 800;
  letter-spacing: .08em;
}

.shared-vehicle-list-head h2,
.shared-vehicle-summary h2 { margin: 3px 0; }

.shared-vehicle-card {
  display: grid;
  grid-template-columns: 28px 140px minmax(260px, 1fr) minmax(190px, .45fr) auto;
  align-items: center;
  gap: 18px;
  padding: 14px 18px;
}

.shared-vehicle-card > img,
.shared-vehicle-card > .vehicle-placeholder {
  width: 140px;
  height: 92px;
  border-radius: 12px;
  object-fit: cover;
}

.shared-vehicle-summary p { margin: 4px 0 0; color: #667085; }
.shared-vehicle-peer-price { display: grid; gap: 5px; }
.shared-vehicle-peer-price span { color: #667085; font-size: 13px; }
.shared-vehicle-peer-price strong { color: #b46d0b; font-size: 21px; }
.shared-vehicle-actions { display: flex; gap: 8px; }

.shared-vehicle-readonly-modal {
  width: min(980px, calc(100vw - 32px));
  max-height: min(88vh, 900px);
  overflow: auto;
}

.shared-vehicle-tabs { display: flex; gap: 8px; padding: 14px 22px; border-bottom: 1px solid #e6e9ef; }
.shared-vehicle-tabs button { padding: 10px 22px; border: 1px solid #d8dee9; border-radius: 999px; background: #fff; font-weight: 800; }
.shared-vehicle-tabs button.active { color: #fff; background: #ad7019; border-color: #ad7019; }
.shared-vehicle-readonly-body { padding: 22px; background: #f7f8fa; }
.shared-readonly-hero { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px; border-radius: 16px; background: #172033; color: #fff; }
.shared-readonly-hero h3 { margin: 4px 0; font-size: 26px; }
.shared-readonly-hero > div:last-child { display: grid; gap: 5px; text-align: right; }
.shared-readonly-hero strong { color: #ffc85f; font-size: 26px; }
.shared-readonly-section { margin-top: 16px; padding: 20px; border: 1px solid #e1e5eb; border-radius: 16px; background: #fff; }
.shared-readonly-section > header { display: flex; justify-content: space-between; gap: 16px; }
.shared-public-spec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 16px; }
.shared-public-spec-grid > div { display: grid; gap: 4px; padding: 13px; border-radius: 10px; background: #f5f7fa; }
.shared-public-spec-grid span { color: #667085; font-size: 13px; }
.shared-advantage-list { display: flex; flex-wrap: wrap; gap: 8px; }
.shared-advantage-list span { padding: 7px 12px; border-radius: 999px; background: #fff4dd; color: #9a6114; font-weight: 700; }
.shared-feature-description { white-space: pre-wrap; line-height: 1.8; }
.shared-outdoor-photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 16px; }
.shared-outdoor-photo-grid figure { margin: 0; overflow: hidden; border: 1px solid #e0e4ea; border-radius: 12px; background: #fff; }
.shared-outdoor-photo-grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.shared-outdoor-photo-grid figcaption { padding: 10px 12px; color: #475467; }

@media (max-width: 760px) {
  .title-shared-vehicle-toggle { width: 100%; }
  .shared-vehicle-list-head { align-items: flex-start; flex-direction: column; }
  .shared-vehicle-card { grid-template-columns: 92px 1fr; gap: 12px; }
  .shared-vehicle-card .management-row-index { display: none; }
  .shared-vehicle-card > img,
  .shared-vehicle-card > .vehicle-placeholder { width: 92px; height: 76px; }
  .shared-vehicle-peer-price,
  .shared-vehicle-actions { grid-column: 1 / -1; }
  .shared-vehicle-actions button { flex: 1; }
  .shared-readonly-hero { align-items: flex-start; flex-direction: column; }
  .shared-readonly-hero > div:last-child { text-align: left; }
  .shared-public-spec-grid { grid-template-columns: repeat(2, 1fr); }
  .shared-outdoor-photo-grid { grid-template-columns: 1fr; }
}
/* Per-tenant header branding */
.tenant-brand-header {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 190px;
  color: #2a241d;
}
.tenant-brand-header > b {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 2px solid #b77a24;
  border-radius: 12px;
  color: #a36817;
  background: #fffaf1;
  font-size: 16px;
}
.tenant-brand-header > span { display: grid; gap: 2px; }
.tenant-brand-header strong,
.tenant-brand-header small {
  display: block;
  max-width: 145px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tenant-brand-header strong { color: #2b2d31; font-size: 18px; line-height: 1.15; }
.tenant-brand-header small { color: #7c6a53; font-size: 9px; letter-spacing: .08em; }