/* Dark palette must exist BEFORE first paint. The pre-paint script in
   index.html sets html.lc-industrial-dark from localStorage; the full set of
   component overrides still arrives later with gf-review-theme-enhancements.js,
   but these tokens and the body ground are what the eye actually sees, so
   defining them in a <head> stylesheet is what removes the white flash. */
html.lc-industrial-dark {
  --navy: #071522;
  --blue: #2492ff;
  --bg: #07111d;
  --card: #10283a;
  --text: #f5f9fd;
  --muted: #9eb2c5;
  --border: #27506d;
  --green: #20a568;
  --red: #e15b5b;
  --orange: #e89a3d;
  color-scheme: dark;
  background: #07111d;
}

html.lc-industrial-dark body {
  background: #07111d;
  color: #f5f9fd;
}

:root {
  --lc-shell-sidebar-width: 264px;
  --lc-shell-header-height: 76px;
  --lc-shell-radius: 14px;
  --lc-shell-shadow: 0 8px 24px rgba(11, 45, 77, .07);
  --lc-shell-ink: #09244a;
}

body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.card,
.job-card,
.metric {
  border: 1px solid #dbe6ef;
  border-radius: var(--lc-shell-radius);
  box-shadow: var(--lc-shell-shadow);
}

.job-card {
  box-shadow: 0 3px 12px rgba(11, 45, 77, .05);
}

button,
input,
select,
textarea {
  border-radius: 9px;
}

button {
  font-weight: 750;
  letter-spacing: -.01em;
}

.toolbar {
  gap: 10px;
}

.toolbar > button,
.section-header button,
.button-row button {
  min-height: 42px;
}

#dashboardTileGrid {
  gap: 12px;
}

#dashboardTileGrid .metric {
  position: relative;
  min-height: 84px;
  padding: 18px 48px 18px 20px;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

#dashboardTileGrid .metric::after {
  content: "\203A";
  position: absolute;
  right: 20px;
  top: 50%;
  color: #47647f;
  font-size: 28px;
  line-height: 1;
  transform: translateY(-54%);
}

#dashboardTileGrid .metric:hover {
  border-color: #9fc7e8;
  box-shadow: 0 10px 28px rgba(11, 45, 77, .11);
}

#dashboardTileGrid .metric:focus-visible {
  outline: 3px solid rgba(22, 119, 210, .28);
  outline-offset: 2px;
}

#dashboardTileGrid .metric strong {
  letter-spacing: -.02em;
}

#dashboardPage > .card:first-of-type:not(.storm-mode-banner),
#dashboardPage > .storm-mode-banner + .card {
  border-top: 3px solid #1677d2;
}

.lc-role-sidebar {
  display: none;
}

/* The desktop shell is created once and kept in the DOM across sign-out. */
body:not(.lc-shell-active) .lc-role-sidebar,
body:not(.lc-shell-active) .lc-shell-account {
  display: none !important;
}

.lc-mobile-profile-avatar {
  display: inline-flex;
  width: 36px;
  height: 36px;
  margin-right: 9px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  vertical-align: middle;
  border-radius: 50%;
  color: #0b2d4d;
  background: #e7f1fa;
  font-size: 12px;
  font-weight: 800;
}

.lc-mobile-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (min-width: 1100px) and (pointer: fine) {
  .lc-mobile-profile-avatar {
    display: none;
  }
}

@media (min-width: 1100px) and (pointer: fine) {
  body.lc-shell-active {
    --app-content-width: none;
  }

  body.lc-shell-active > header {
    min-height: var(--lc-shell-header-height);
    margin-left: var(--lc-shell-sidebar-width);
    padding: 13px 30px;
    color: var(--lc-shell-ink);
    border-bottom: 1px solid #dbe6ef;
    background: #fff;
    box-shadow: 0 2px 12px rgba(11, 45, 77, .06);
  }

  body.lc-shell-active > header .app-brand {
    max-width: none;
    margin: 0;
  }

  body.lc-shell-active > header .app-brand-logo,
  body.lc-shell-active > header .app-brand > div:nth-child(2) {
    display: none;
  }

  body.lc-shell-active > header .company-brand-badge {
    margin: 0;
    padding: 7px 10px;
    color: var(--lc-shell-ink);
    border: 0;
    background: transparent;
  }

  body.lc-shell-active > header .company-brand-badge img {
    display: block;
    width: 32px;
    height: 32px;
    padding: 2px;
    border: 1px solid #dbe6ef;
    border-radius: 7px;
    background: #fff;
  }

  body.lc-shell-active > header .company-brand-badge::after {
    content: "\2304";
    margin-left: 3px;
    color: #55718f;
    font-size: 15px;
  }

  body.lc-shell-active .lc-shell-account {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
  }

  .lc-shell-account__avatar {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 8px;
    color: #244566;
    background: #eaf1f7;
    font-size: 11px;
    font-weight: 850;
    overflow: hidden;
  }

  .lc-shell-account__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .lc-shell-account__copy {
    display: grid;
    min-width: 96px;
    line-height: 1.1;
  }

  .lc-shell-account__copy strong {
    color: var(--lc-shell-ink);
    font-size: 12px;
  }

  .lc-shell-account__copy small {
    margin-top: 3px;
    color: #55718f;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .lc-shell-account__signout {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    margin-left: 8px;
    padding: 0 0 0 18px;
    color: var(--lc-shell-ink);
    border: 0;
    border-left: 1px solid #dbe6ef;
    border-radius: 0;
    background: transparent;
  }

  .lc-shell-account__signout:hover {
    color: #096fcb;
    background: transparent;
  }

  .lc-shell-account__signout svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
  }

  body.lc-shell-active > main {
    width: auto;
    max-width: none;
    margin: 0 0 0 var(--lc-shell-sidebar-width);
    padding: 26px clamp(24px, 3vw, 48px) 100px;
    min-height: calc(100vh - var(--lc-shell-header-height));
    background: radial-gradient(circle at 65% 12%, rgba(214, 238, 255, .6), transparent 42%), #f7fafc;
  }

  /* Keep the pilot feedback control visible beside the fixed desktop sidebar. */
  body.lc-shell-active .pilot-feedback-launcher {
    left: calc(var(--lc-shell-sidebar-width) + 20px);
  }

  body.lc-shell-active .pilot-feedback-launcher.pilot-feedback-right {
    left: auto;
    right: 20px;
  }

  /* Sparky is anchored to the right and grows leftwards, so a wide or resized
     panel runs its left edge under the sidebar -- which is fixed and painted at
     a far higher layer, so it covers the start of every line rather than being
     covered. Capping the width to the space beside the sidebar keeps the whole
     panel in the content area: heading, Close, conversation, question box and
     the resize grip all stay reachable, and the cap clamps a resized width too,
     because max-width always wins over an inline width. */
  body.lc-shell-active .assistant-panel:not(.hidden) {
    max-width: calc(100vw - var(--lc-shell-sidebar-width) - 40px);
    min-width: min(360px, calc(100vw - var(--lc-shell-sidebar-width) - 40px));
  }

  /* The launcher sits in the same strip and must not slide under it either. */
  body.lc-shell-active .assistant-launcher {
    max-width: calc(100vw - var(--lc-shell-sidebar-width) - 40px);
  }

  body.lc-shell-active > main > section:not(.hidden) {
    width: 100%;
    max-width: 1480px;
    margin-inline: auto;
  }

  body.lc-shell-active #lcDashboardTopSignOut,
  body.lc-shell-active .lc-dashboard-topbar {
    display: none !important;
  }

  body.lc-shell-active .lc-role-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 10010;
    display: flex;
    width: var(--lc-shell-sidebar-width);
    flex-direction: column;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(180deg, #0a3358 0%, #071f36 100%);
    box-shadow: 10px 0 30px rgba(5, 28, 49, .12);
  }

  .lc-role-sidebar__brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: var(--lc-shell-header-height);
    padding: 13px 18px;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    border-radius: 0;
    color: #fff;
    background: #082946;
    text-align: left;
  }

  .lc-role-sidebar__brand:hover {
    background: #0b355a;
  }

  .lc-role-sidebar__brand img {
    width: 45px;
    height: 45px;
    flex: 0 0 auto;
    border-radius: 10px;
  }

  .lc-role-sidebar__brand strong,
  .lc-role-sidebar__brand span {
    display: block;
  }

  .lc-role-sidebar__brand strong {
    font-size: 17px;
  }

  .lc-role-sidebar__brand span {
    margin-top: 2px;
    color: #b9cee0;
    font-size: 10px;
    font-weight: 600;
  }

  .lc-role-sidebar__identity {
    display: none;
  }

  .lc-role-sidebar__identity strong,
  .lc-role-sidebar__identity span {
    display: block;
  }

  .lc-role-sidebar__identity strong {
    overflow: hidden;
    color: #fff;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .lc-role-sidebar__identity span {
    margin-top: 3px;
    color: #9fb9cf;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
  }

  .lc-role-sidebar__nav {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 6px 10px 14px;
    scrollbar-color: rgba(255, 255, 255, .25) transparent;
  }

  .lc-role-sidebar__item {
    display: grid;
    width: 100%;
    min-height: 46px;
    margin: 2px 0;
    padding: 10px 12px;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: 8px;
    color: #eaf3fa;
    background: transparent;
    text-align: left;
  }

  .lc-role-sidebar__item:hover {
    color: #fff;
    background: rgba(255, 255, 255, .08);
  }

  .lc-role-sidebar__item[aria-current="page"] {
    border-left-color: #24a0ff;
    color: #fff;
    background: rgba(35, 143, 230, .24);
  }

  .lc-role-sidebar__item svg {
    width: 20px;
    height: 20px;
    stroke: currentColor;
  }

  .lc-role-sidebar__item span {
    overflow: hidden;
    font-size: 13px;
    line-height: 1.2;
    text-overflow: ellipsis;
  }

  .lc-role-sidebar__footer {
    padding: 10px;
    border-top: 1px solid rgba(255, 255, 255, .12);
  }

  .lc-role-sidebar__footer .lc-role-sidebar__item {
    color: #bcd0e1;
  }

  #dashboardPage .lc-role-workspace {
    padding: 16px 18px;
    border-left: 4px solid #1677d2;
    border-radius: 12px;
    background: #f7fafc;
  }

  #dashboardPage > .lc-dashboard-hero {
    padding: 0 0 10px;
    border: 0;
    box-shadow: none;
    background: transparent;
  }

  #dashboardPage > .lc-dashboard-hero > h2 {
    margin: 0;
    color: var(--lc-shell-ink);
    font-size: clamp(25px, 2.1vw, 34px);
    letter-spacing: -.035em;
  }

  #dashboardPage > .lc-dashboard-hero > h2::before {
    content: "Welcome to ";
  }

  #dashboardPage > .lc-dashboard-hero > p {
    display: none;
  }

  #dashboardPage > .lc-dashboard-hero > .button-row {
    margin-top: 12px;
  }

  #dashboardTileGrid .metric {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-content: center;
    column-gap: 12px;
    min-height: 76px;
    padding: 13px 46px 13px 14px;
    border-radius: 6px;
    box-shadow: 0 2px 7px rgba(11, 45, 77, .035);
  }

  #dashboardTileGrid .metric strong,
  #dashboardTileGrid .metric .muted {
    grid-column: 2;
  }

  #dashboardTileGrid .metric strong {
    align-self: end;
    color: var(--lc-shell-ink);
    font-size: 14px;
  }

  #dashboardTileGrid .metric .muted {
    align-self: start;
    margin-top: 4px;
    color: #55718f;
    font-size: 11px;
  }

  .lc-dashboard-tile__icon {
    display: grid;
    width: 36px;
    height: 36px;
    grid-row: 1 / span 2;
    place-items: center;
    color: var(--lc-shell-ink);
  }

  .lc-dashboard-tile__icon svg {
    width: 25px;
    height: 25px;
    stroke: currentColor;
  }

  #dashboardPage .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #dashboardPage .card,
  #dashboardPage .lc-role-workspace {
    margin-bottom: 14px;
  }

  #jobsPage .job-card,
  #productionPage .job-card,
  #completedJobsPage .job-card,
  #teamPage .job-card,
  #safetyPage .job-card,
  #priceBooksPage .job-card,
  #utilityPortalPage .job-card,
  #timekeepingPage .job-card {
    padding: 16px 18px;
  }
}

.lc-profile-photo-editor {
  display: grid;
  gap: 10px;
  margin: 14px 0;
  padding: 14px;
  border: 1px solid #dbe6ef;
  border-radius: 10px;
  background: #f7fafc;
}

.lc-profile-photo-editor p {
  margin: 4px 0 0;
}

#myProfilePhotoPreview {
  width: 76px;
  height: 76px;
  object-fit: cover;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(11, 45, 77, .15);
}

.lc-profile-photo-picker {
  display: flex;
  gap: 8px;
}

#myProfilePhotoSelection {
  margin: 0;
}

/* Also covers wide touch devices (iPad Pro landscape, Surface in tablet mode).
   Gating this block on width alone left width >= 1100px + pointer: coarse
   matching neither this block nor the (min-width:1100px) and (pointer:fine)
   desktop blocks, so those devices rendered with no shell styling at all. */
@media (max-width: 1099px), (min-width: 1100px) and (pointer: coarse) {
  .lc-role-sidebar {
    display: none !important;
  }

  .lc-shell-account,
  .lc-dashboard-tile__icon {
    display: none !important;
  }

  body.lc-shell-active > header,
  body.lc-shell-active > main {
    margin-left: 0;
  }

  header {
    padding: 15px 16px;
  }

  header .app-brand {
    gap: 10px;
  }

  header .app-brand-logo {
    width: 48px;
    height: 48px;
  }

  header h1 {
    font-size: 22px;
  }

  header p {
    margin-top: 3px;
    font-size: 11px;
  }

  main {
    width: 100%;
    max-width: 920px;
    padding: 16px 14px 92px;
  }

  .card {
    padding: 17px;
    margin-bottom: 13px;
  }

  #dashboardTileGrid .metric {
    min-height: 76px;
    padding: 16px 44px 16px 17px;
  }
}

@media (max-width: 680px) {
  #lcDashboardTopSignOut,
  #lcThemeToggle {
    min-height: 44px !important;
  }
  .company-brand-badge {
    width: auto;
    max-width: 52%;
    margin-left: auto;
  }

  .company-brand-badge span {
    font-size: 11px;
  }

  .toolbar {
    display: grid;
    grid-template-columns: 1fr;
  }

  .toolbar button,
  .section-header button,
  .button-row button {
    width: 100%;
    min-height: 46px;
  }

  #dashboardPage .grid {
    grid-template-columns: 1fr !important;
  }

  #dashboardPage .metric strong {
    font-size: 17px;
  }

  #dashboardPage .metric .muted {
    font-size: 12px;
  }

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

html.lc-industrial-dark .lc-role-sidebar {
  background: linear-gradient(180deg, #061d30 0%, #041321 100%);
}

html.lc-industrial-dark #dashboardTileGrid .metric::after {
  color: #8eb5d3;
}

@media (min-width: 1100px) and (pointer: fine) {
  html.lc-industrial-dark body.lc-shell-active {
    --lc-shell-ink: #f4f8fc;
    background: #07111d !important;
  }

  html.lc-industrial-dark body.lc-shell-active > header {
    color: #eaf2f8 !important;
    border-bottom-color: #20394d !important;
    background: #0b1925 !important;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .3) !important;
  }

  html.lc-industrial-dark body.lc-shell-active > main {
    background: radial-gradient(circle at 68% 8%, rgba(23, 84, 126, .18), transparent 38%), #07111d !important;
  }

  html.lc-industrial-dark body.lc-shell-active > header .company-brand-badge {
    color: #eaf2f8 !important;
    background: transparent !important;
  }

  html.lc-industrial-dark body.lc-shell-active > header .company-brand-badge img {
    border-color: #31536d !important;
    background: #fff !important;
  }

  html.lc-industrial-dark body.lc-shell-active > header .company-brand-badge::after,
  html.lc-industrial-dark .lc-shell-account__copy small {
    color: #8faabd !important;
  }

  html.lc-industrial-dark .lc-shell-account__avatar {
    color: #dceaf5 !important;
    background: #183247 !important;
  }

  html.lc-industrial-dark .lc-shell-account__copy strong,
  html.lc-industrial-dark #lcShellAccount .lc-shell-account__signout {
    color: #f4f8fc !important;
  }

  html.lc-industrial-dark .lc-shell-account__signout {
    border-left-color: #2b4559 !important;
    background: transparent !important;
  }

  html.lc-industrial-dark #lcShellAccount .lc-shell-account__signout:hover {
    color: #71bfff !important;
    background: transparent !important;
  }

  html.lc-industrial-dark .lc-role-sidebar {
    background: linear-gradient(180deg, #0a2236 0%, #061522 100%) !important;
    box-shadow: 10px 0 32px rgba(0, 0, 0, .24) !important;
  }

  html.lc-industrial-dark #lcRoleSidebar .lc-role-sidebar__brand {
    color: #fff !important;
    border-bottom-color: rgba(151, 190, 217, .15) !important;
    background: #0a1d2d !important;
  }

  html.lc-industrial-dark #lcRoleSidebar .lc-role-sidebar__brand:hover {
    background: #102b41 !important;
  }

  html.lc-industrial-dark #lcRoleSidebar .lc-role-sidebar__item,
  html.lc-industrial-dark #lcRoleSidebar .lc-role-sidebar__footer .lc-role-sidebar__item {
    color: #c7d7e4 !important;
    border-color: transparent !important;
    background: transparent !important;
  }

  html.lc-industrial-dark #lcRoleSidebar .lc-role-sidebar__item:hover {
    color: #fff !important;
    background: rgba(113, 191, 255, .09) !important;
  }

  html.lc-industrial-dark #lcRoleSidebar .lc-role-sidebar__item[aria-current="page"] {
    color: #fff !important;
    border-left-color: #3da9ff !important;
    background: rgba(35, 143, 230, .22) !important;
  }

  html.lc-industrial-dark #dashboardPage > .lc-dashboard-hero > h2,
  html.lc-industrial-dark #dashboardTileGrid .metric strong,
  html.lc-industrial-dark .lc-dashboard-tile__icon {
    color: #f4f8fc !important;
  }

  html.lc-industrial-dark #dashboardTileGrid .metric {
    border-color: #28485e !important;
    background: #102536 !important;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .25) !important;
  }

  html.lc-industrial-dark #dashboardTileGrid .metric:hover {
    border-color: #3f7397 !important;
    background: #142c3f !important;
  }

  html.lc-industrial-dark #dashboardTileGrid .metric .muted {
    color: #9db3c4 !important;
  }

  html.lc-industrial-dark .lc-dashboard-tile__icon,
  html.lc-industrial-dark #dashboardTileGrid .metric::after {
    color: #68b8f4 !important;
  }

  html.lc-industrial-dark #dashboardPage .lc-role-workspace {
    border-left-color: #3da9ff !important;
    background: #0d2232 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #dashboardTileGrid .metric,
  .lc-role-sidebar__item {
    transition: none;
  }
}

/* ---------------------------------------------------------------------------
   Dashboard tile contrast.

   .metric ships with a transparent border and a background one step off the
   page colour (#f5f8fb on #f3f6f9, a ratio of 1.02:1), so at rest a tile had
   no visible edge at all -- the border only appeared on hover. The tiles read
   as a flat list rather than as separate objects.

   The subtitle also failed WCAG AA: #6c7a89 on the tile is 4.12:1, under the
   4.5:1 required for normal text at 12-13px.

   A card boundary is not required to reach the 3:1 of WCAG 1.4.11 here, since
   each tile is identified by its own visible label and icon rather than by its
   outline. The aim is an edge a person can actually see.
   --------------------------------------------------------------------------- */
#dashboardTileGrid .metric {
  background: #ffffff;
  border-color: #c8d6e4;
  box-shadow: 0 1px 2px rgba(11, 45, 77, .05);
}

#dashboardTileGrid .metric .muted {
  color: #566575;
}

html.lc-industrial-dark #dashboardTileGrid .metric {
  background: #14304a !important;
  border-color: #3a6c92 !important;
  box-shadow: none !important;
}

html.lc-industrial-dark #dashboardTileGrid .metric .muted {
  color: #b7cadb !important;
}

/* The tile grid had no bottom margin, so the card that follows it sat flush
   against the last tile -- only the card's shadow suggested a gap. Cards on
   this page are 18px apart, and the tiles inside the grid are 12px apart, so
   the grid takes the card rhythm: a group is separated from the next section
   by more than its own items are separated from each other. */
#dashboardTileGrid {
  margin-bottom: 18px;
}

/* SUMMARY PANELS IN DARK MODE
   .daily-value-summary and the utility metric chips carry a hardcoded light
   background (#eef5fa / #edf3f8) and no dark override, while dark mode sets
   body colour to #f5f9fd. That put near-white text on a near-white panel at
   1.04:1 -- the Safety Reporting totals on the JSA page (Completed JSAs, Jobs,
   Foremen, Crews, Crew Sign-ins) were unreadable, and so was every other user
   of these classes: job progress totals, the billing batch summary and the
   billing reconciliation panel.
   Give the panels a dark ground instead of trying to darken the text, which is
   what the rest of the theme does. The utility chips also pin their number to
   var(--navy) -- #071522 once dark tokens apply -- so that has to move too, or
   it turns invisible against the new ground. */
html.lc-industrial-dark .daily-value-summary,
html.lc-industrial-dark .production-utility-primary-metrics span {
  background: #11293c;
  border: 1px solid #27506d;
  color: #eaf2f8;
}

html.lc-industrial-dark .daily-value-summary strong,
html.lc-industrial-dark .production-utility-primary-metrics strong {
  color: #ffffff;
}

/* EXPANDED REPORT CARD IN DARK MODE
   Two more panels that hardcode a light-mode colour and are never re-stated
   for dark.

   .job-number paints the job number with var(--navy). That token is a dark
   blue used as TEXT in light mode, but dark mode redefines it to #071522, a
   near-black meant as a ground. On the report card, which the theme forces to
   #0c2030, that is 1.11:1 -- TEST-SUP-001 was dark on dark.

   .daily-draft-guidance keeps its pale amber #fff7df while the theme's blanket
   `strong { color:#f5f9fd!important }` turns its heading near-white: 1.01:1 for
   "DRAFT - WAITING FOR FOREMAN". Darken the ground and restate the heading;
   the !important is required only to answer that blanket rule. */
html.lc-industrial-dark .job-number {
  color: #eaf2f8;
}

html.lc-industrial-dark .daily-draft-guidance {
  background: #2e2510;
  border-color: #6d5a1f;
  color: #f2e2b6;
}

html.lc-industrial-dark .daily-draft-guidance strong {
  color: #ffd97a !important;
}

/* ==========================================================================
   DARK MODE: THE REMAINING LIGHT SURFACES
   --------------------------------------------------------------------------
   Dark mode arrived as a set of targeted overrides rather than a theme, so
   every panel that hardcodes a light background stayed light while the text on
   it turned near-white -- body colour is #f5f9fd and the theme forces
   `strong { color:#f5f9fd!important }`. Each one was a latent unreadable
   surface found only by walking into it: the JSA totals, the report card job
   number and the draft banner were the three reported during live testing.

   This restates the rest in one pass, grouped by what the panel MEANS rather
   than by the hex it happened to use, so a new panel can join a family instead
   of inventing another colour:

     surface   #0c2030   cards and page panels        text inherits #f5f9fd
     inset     #143149   chips, tabs, counters        text #eaf2f8
     raised    #1a3b55   hover and active tints       text #eaf2f8
     caution   #2e2510   amber warnings               text #f2e2b6
     danger    #33191a   red warnings                 text #f6c9c9
     success   #10301f   green confirmations          text #a9e0c0

   Every pair was measured; the lowest is 7.61:1 and all clear AA for normal
   text. Borders written as var(--border) already retrain themselves, so only
   hardcoded border hexes are restated here.

   Light mode is untouched: every rule below is scoped to html.lc-industrial-dark.
   ========================================================================== */

/* --- surface: cards and page panels ------------------------------------- */
html.lc-industrial-dark .production-contract-summary,
html.lc-industrial-dark .production-job-totals,
html.lc-industrial-dark .production-utility-card,
html.lc-industrial-dark .production-contract-body,
html.lc-industrial-dark .production-advanced-filters,
html.lc-industrial-dark .job-other-actions-menu,
html.lc-industrial-dark .team-workspace-panel,
html.lc-industrial-dark .team-access-code-details,
html.lc-industrial-dark .daily-unit-suggestions,
html.lc-industrial-dark .daily-unit-suggestion,
html.lc-industrial-dark .daily-saved-pole,
html.lc-industrial-dark .daily-batch-entry,
html.lc-industrial-dark .job-leader-panel,
html.lc-industrial-dark .daily-report-history,
html.lc-industrial-dark .assistant-memory-card,
html.lc-industrial-dark .assistant-message.assistant,
html.lc-industrial-dark .jsa-attachment-page,
html.lc-industrial-dark .contract-setup-start,
html.lc-industrial-dark .closed-jobs-list,
html.lc-industrial-dark .file-drop,
html.lc-industrial-dark .company-logo-upload,
html.lc-industrial-dark .import-summary,
html.lc-industrial-dark #priceBookImportCard.new-price-book-inline-mapping {
  background: #0c2030;
  color: #f5f9fd;
}

/* These pin a light border of their own, so var(--border) never reaches them. */
html.lc-industrial-dark .closed-jobs-list,
html.lc-industrial-dark .job-leader-panel,
html.lc-industrial-dark .daily-report-history,
html.lc-industrial-dark .daily-batch-entry,
html.lc-industrial-dark .daily-saved-pole,
html.lc-industrial-dark .daily-unit-suggestions {
  border-color: #27506d;
}

/* .daily-unit-suggestion pins var(--navy), which dark tokens turn near-black. */
html.lc-industrial-dark .daily-unit-suggestion {
  color: #eaf2f8;
}

/* --- inset: chips, tabs, counters, tracks -------------------------------- */
html.lc-industrial-dark .collapsible-card summary::after,
html.lc-industrial-dark .contract-setup-step-number,
html.lc-industrial-dark .production-contract-summary > summary::after,
html.lc-industrial-dark .version-count,
html.lc-industrial-dark button.secondary,
html.lc-industrial-dark .job-other-actions > summary,
html.lc-industrial-dark .team-workspace-tabs,
html.lc-industrial-dark .billing-status,
html.lc-industrial-dark .progress-track,
html.lc-industrial-dark .daily-saved-pole > summary,
html.lc-industrial-dark .assistant-resize-handle,
html.lc-industrial-dark .daily-review-counts {
  background: #143149;
  color: #eaf2f8;
  border-color: #27506d;
}

html.lc-industrial-dark .status.closed {
  background: #143149;
  color: #b8c8d6;
}

/* --- raised: hover and active tints -------------------------------------- */
html.lc-industrial-dark .production-utility-card:hover,
html.lc-industrial-dark .daily-unit-suggestion:hover,
html.lc-industrial-dark .file-drop.dragover,
html.lc-industrial-dark .assistant-message.user,
html.lc-industrial-dark .assistant-navigation-action,
html.lc-industrial-dark .daily-pole-entry-header {
  background: #1a3b55;
  color: #eaf2f8;
}

html.lc-industrial-dark .assistant-navigation-action,
html.lc-industrial-dark .daily-pole-entry-header {
  border-color: #3f6d8f;
}

/* --- caution: amber ------------------------------------------------------ */
html.lc-industrial-dark .jsa-ppe-alert,
html.lc-industrial-dark .assistant-memory-proposal,
html.lc-industrial-dark .assistant-reminder-banner,
html.lc-industrial-dark .sign-out-reason,
html.lc-industrial-dark .billing-status.submitted,
html.lc-industrial-dark .daily-authorization.pending_packet {
  background: #2e2510;
  color: #f2e2b6;
  border-color: #6d5a1f;
}

html.lc-industrial-dark .jsa-ppe-alert strong,
html.lc-industrial-dark .assistant-memory-proposal strong,
html.lc-industrial-dark .assistant-reminder-banner strong {
  color: #ffd97a !important;
}

/* --- danger: red --------------------------------------------------------- */
html.lc-industrial-dark .app-error-banner,
html.lc-industrial-dark .billing-status.void,
html.lc-industrial-dark .daily-authorization.redline {
  background: #33191a;
  color: #f6c9c9;
  border-color: #7a3436;
}

/* .job-danger-zone and .daily-redline-comment are only a whisper of pink in
   light mode -- #fff8f8 and #fff7f7, a hair off white. Giving them the loud
   danger ground turned a quiet section into an alarm, which is a heavier
   statement than either makes anywhere else. They sit on the normal surface
   and carry the accent in the border and the heading instead. */
html.lc-industrial-dark .job-danger-zone,
html.lc-industrial-dark .daily-redline-comment {
  background: #0c2030;
  color: #f5f9fd;
  border-color: #7a3436;
}

html.lc-industrial-dark .job-danger-zone strong,
html.lc-industrial-dark .daily-redline-comment strong,
html.lc-industrial-dark .daily-redline-comment label {
  color: #ffb3b3 !important;
}

/* --- success: green ------------------------------------------------------ */
html.lc-industrial-dark .contract-setup-step.active,
html.lc-industrial-dark .daily-selected-unit,
html.lc-industrial-dark .daily-authorization.authorized {
  background: #10301f;
  color: #a9e0c0;
  border-color: #2a6444;
}

/* --- text still pinned to light-mode values ------------------------------
   Found by looking at the rendered screen rather than the stylesheet: these
   sit on grounds the sweep darkened, but each names its own colour, so none
   of the panel rules reach them.
     .unit-code-compact       var(--navy) -> near-black       1.11:1
     .daily-authorization-note #b42318 on a dark card         2.53:1
     .daily-saved-pole-review  #1769aa on a dark card         2.88:1 */
html.lc-industrial-dark .unit-code-compact {
  color: #eaf2f8;
}

html.lc-industrial-dark .daily-authorization-note {
  color: #ff9d9d;
}

html.lc-industrial-dark .daily-saved-pole-review {
  color: #6fb8f0;
}

/* ==========================================================================
   DARK MODE: TEXT THAT PINS ITS OWN COLOUR
   --------------------------------------------------------------------------
   The panel sweep above inventoried BACKGROUNDS, so it reported full coverage
   while these were still unreadable: each names its own light-mode colour, so
   no panel rule reaches it, and each now sits on a ground that sweep darkened.
   That gap is why D-101, the quantity warning and the redline heading survived
   a pass that claimed to be complete.

   var(--navy) is the worst of them. It is a dark blue used as TEXT in light
   mode, but dark mode redefines it to #071522 as a GROUND, so every rule that
   spends it on text renders near-black on near-black.

   Identifiers take the plain text colour, disclosures keep a blue so they
   still read as something to click, and the status numbers keep their meaning
   in the light variant of their own hue. Measured; lowest is 7.74:1.
   ========================================================================== */
html.lc-industrial-dark .daily-batch-number,
html.lc-industrial-dark .daily-unit-code {
  color: #eaf2f8;
}

html.lc-industrial-dark .production-advanced-filters > summary,
html.lc-industrial-dark .production-utility-more > summary {
  color: #6fb8f0;
}

html.lc-industrial-dark .job-danger-zone > summary {
  color: #ffb3b3;
}

html.lc-industrial-dark .job-danger-zone > p {
  color: #e8b4b4;
}

html.lc-industrial-dark .storm-mode-banner strong {
  color: #ffe0a8 !important;
}

/* The inactive tab label pins its colour with !important, so this has to. */
html.lc-industrial-dark .team-workspace-tab {
  color: #b8c8d6 !important;
}

/* Run-rate numbers keep their meaning: under, on target, over. */
html.lc-industrial-dark .mh-rate-number.below {
  color: #ff9d9d;
}

html.lc-industrial-dark .mh-rate-number.at-target,
html.lc-industrial-dark .mh-rate-number.above {
  color: #7fe0a8;
}

html.lc-industrial-dark .mh-rate-number.near-target {
  color: #ffd97a;
}

/* ==========================================================================
   DARK MODE: THE STYLESHEETS THE SATELLITE SCRIPTS INJECT
   --------------------------------------------------------------------------
   The two sweeps above read index.html's <style> block and reported full
   coverage. Both were honest about what they measured and wrong about what
   that meant: twenty-one satellite scripts ship CSS of their own, and none of
   it was ever looked at. That is where Timekeeping's roster lived -- summary
   cards white on white, unassigned rows near-white on pale yellow -- and 165
   more rules behind it.

   Same families as above, chosen per rule from the hue of the colour it
   already used, so a warning stays a warning and a card stays a card:
     neutral -> #0c2030   amber -> #2e2510   red -> #33191a   green -> #10301f
   ========================================================================== */

/* --- neutral grounds (85) --- */
html.lc-industrial-dark #safetyWorkspace .sw-pill,
html.lc-industrial-dark #timekeepingPage .tk-empty-state,
html.lc-industrial-dark #timekeepingPage .tk-exception.high,
html.lc-industrial-dark #timekeepingPage .tk-history-audit,
html.lc-industrial-dark #timekeepingPage .tk-history-card,
html.lc-industrial-dark #timekeepingPage .tk-history-row,
html.lc-industrial-dark #timekeepingPage .tk-payroll-card,
html.lc-industrial-dark #timekeepingPage .tk-period-badge,
html.lc-industrial-dark #timekeepingPage .tk-table tbody tr,
html.lc-industrial-dark #timekeepingPage .tk-table tbody tr:hover,
html.lc-industrial-dark #timekeepingPage .tk-table thead th,
html.lc-industrial-dark #timekeepingPage .tk-table tr,
html.lc-industrial-dark #timekeepingPage .tk-table-wrap,
html.lc-industrial-dark #tkSummary,
html.lc-industrial-dark .crew-performance-periods button,
html.lc-industrial-dark .crew-performance-pricing button,
html.lc-industrial-dark .gf-assignment-list,
html.lc-industrial-dark .gf-scope-bar,
html.lc-industrial-dark .lc-industrial-dark .role,
html.lc-industrial-dark .lc-industrial-dark body.lc-shell-active>header .company-brand-badge img,
html.lc-industrial-dark .lc-jsa-add,
html.lc-industrial-dark .lc-jsa-card,
html.lc-industrial-dark .lc-jsa-check,
html.lc-industrial-dark .lc-jsa-progress span,
html.lc-industrial-dark .lc-jsa-review-field,
html.lc-industrial-dark .lc-jsa-review-head,
html.lc-industrial-dark .lc-jsa-review-pill,
html.lc-industrial-dark .lc-jsa-review-section,
html.lc-industrial-dark .lc-jsa-review-signature,
html.lc-industrial-dark .lc-jsa-review-table th,
html.lc-industrial-dark .lc-jsa-task,
html.lc-industrial-dark .lc-mobile-profile-avatar,
html.lc-industrial-dark .lc-pilot-actions a.secondary,
html.lc-industrial-dark .lc-pilot-dot,
html.lc-industrial-dark .lc-pilot-item,
html.lc-industrial-dark .lc-pilot-onboarding,
html.lc-industrial-dark .lc-profile-photo-editor,
html.lc-industrial-dark .lc-shell-active>header,
html.lc-industrial-dark .lc-shell-active>header .company-brand-badge img,
html.lc-industrial-dark .lc-signature-actions,
html.lc-industrial-dark .lc-signature-wrap,
html.lc-industrial-dark .lc-team-empty,
html.lc-industrial-dark .lc-toast,
html.lc-industrial-dark .my-time-active-person,
html.lc-industrial-dark .my-time-admin-row,
html.lc-industrial-dark .my-time-admin-worked,
html.lc-industrial-dark .my-time-hours,
html.lc-industrial-dark .my-time-people,
html.lc-industrial-dark .my-time-person,
html.lc-industrial-dark .my-time-person-badge,
html.lc-industrial-dark .my-time-person.active,
html.lc-industrial-dark .my-time-row.my-time-header,
html.lc-industrial-dark .remaining-units-help,
html.lc-industrial-dark .remaining-units-summary>div,
html.lc-industrial-dark .tk-assignment-group,
html.lc-industrial-dark .tk-complete-roster,
html.lc-industrial-dark .tk-crew-card,
html.lc-industrial-dark .tk-crew-equipment,
html.lc-industrial-dark .tk-crew-equipment-chip,
html.lc-industrial-dark .tk-crew-equipment-chip.primary,
html.lc-industrial-dark .tk-custom-export-menu,
html.lc-industrial-dark .tk-custom-export-menu button,
html.lc-industrial-dark .tk-custom-export-menu button:hover,
html.lc-industrial-dark .tk-edit-card,
html.lc-industrial-dark .tk-employee-detail,
html.lc-industrial-dark .tk-employee-detail .tk-table,
html.lc-industrial-dark .tk-employee-summary,
html.lc-industrial-dark .tk-equipment-card,
html.lc-industrial-dark .tk-equipment-card>summary,
html.lc-industrial-dark .tk-equipment-savebar,
html.lc-industrial-dark .tk-import-box,
html.lc-industrial-dark .tk-manager-section,
html.lc-industrial-dark .tk-manager-section>summary,
html.lc-industrial-dark .tk-my-crew-person,
html.lc-industrial-dark .tk-overhead-code,
html.lc-industrial-dark .tk-overhead-detail,
html.lc-industrial-dark .tk-overhead-detail .tk-table,
html.lc-industrial-dark .tk-overhead-summary,
html.lc-industrial-dark .tk-overhead-summary-title,
html.lc-industrial-dark .tk-roster-summary>div,
html.lc-industrial-dark .tk-roster-swatch,
html.lc-industrial-dark .tk-saved-roster,
html.lc-industrial-dark .tk-summary>div,
html.lc-industrial-dark .tk-workspace-tab:hover,
html.lc-industrial-dark .tk-workspace-tabs {
  background: #0c2030 !important;
  color: #eaf2f8 !important;
  border-color: #27506d !important;
}

/* --- amber grounds (8) --- */
html.lc-industrial-dark #safetyWorkspace .sw-completed,
html.lc-industrial-dark #timekeepingPage .tk-exception,
html.lc-industrial-dark #timekeepingPage .tk-period-badge.locked,
html.lc-industrial-dark .lc-stop,
html.lc-industrial-dark .lc-unsaved-badge,
html.lc-industrial-dark .tk-assignment-pending,
html.lc-industrial-dark .tk-roster-swatch.unassigned,
html.lc-industrial-dark .tk-roster-unassigned td {
  background: #2e2510 !important;
  color: #f2e2b6 !important;
  border-color: #6d5a1f !important;
}

/* --- red grounds (2) --- */
html.lc-industrial-dark #safetyWorkspace .sw-critical,
html.lc-industrial-dark .lc-jsa-remove {
  background: #33191a !important;
  color: #f6c9c9 !important;
  border-color: #7a3436 !important;
}

/* --- green grounds (3) --- */
html.lc-industrial-dark #safetyWorkspace .sw-verified,
html.lc-industrial-dark #timekeepingPage .tk-period-badge.approved,
html.lc-industrial-dark .lc-pilot-item.done {
  background: #10301f !important;
  color: #a9e0c0 !important;
  border-color: #2a6444 !important;
}

/* --- neutral text pinned to a light-mode value (64) --- */
html.lc-industrial-dark #timekeepingPage .tk-empty-state strong,
html.lc-industrial-dark #timekeepingPage .tk-export-note,
html.lc-industrial-dark #timekeepingPage .tk-history-empty,
html.lc-industrial-dark #timekeepingPage .tk-history-main strong,
html.lc-industrial-dark #timekeepingPage .tk-history-meta,
html.lc-industrial-dark #timekeepingPage .tk-history-pager,
html.lc-industrial-dark #timekeepingPage .tk-history-search label,
html.lc-industrial-dark #timekeepingPage .tk-report-status,
html.lc-industrial-dark #timekeepingPage .tk-table td::before,
html.lc-industrial-dark .crew-day-metrics span,
html.lc-industrial-dark .crew-performance-caption,
html.lc-industrial-dark .crew-performance-note,
html.lc-industrial-dark .crew-performance-pricing>span,
html.lc-industrial-dark .crew-scoreboard-table td:first-child,
html.lc-industrial-dark .crew-scoreboard-table td:nth-child(2),
html.lc-industrial-dark .gf-assignment-help,
html.lc-industrial-dark .gf-assignment-status,
html.lc-industrial-dark .jsa-history-note,
html.lc-industrial-dark .lc-industrial-dark .billing-status:not(.paid):not(.void),
html.lc-industrial-dark .lc-jsa-card .lc-help,
html.lc-industrial-dark .lc-jsa-card h3,
html.lc-industrial-dark .lc-jsa-grid label,
html.lc-industrial-dark .lc-jsa-review,
html.lc-industrial-dark .lc-jsa-review-empty,
html.lc-industrial-dark .lc-jsa-review-head p,
html.lc-industrial-dark .lc-jsa-review-label,
html.lc-industrial-dark .lc-jsa-review-section h3,
html.lc-industrial-dark .lc-jsa-task-head,
html.lc-industrial-dark .lc-pilot-head p,
html.lc-industrial-dark .lc-pilot-progress,
html.lc-industrial-dark .lc-role-workspace span,
html.lc-industrial-dark .lc-role-workspace strong,
html.lc-industrial-dark .lc-shell-account__signout:hover,
html.lc-industrial-dark .lc-shell-active>header .company-brand-badge::after,
html.lc-industrial-dark .lc-team-count,
html.lc-industrial-dark .my-time-admin-person-name,
html.lc-industrial-dark .my-time-admin-person-name small,
html.lc-industrial-dark .my-time-admin-status,
html.lc-industrial-dark .my-time-charge,
html.lc-industrial-dark .my-time-status,
html.lc-industrial-dark .remaining-unit-toggle-icon,
html.lc-industrial-dark .remaining-units-summary strong,
html.lc-industrial-dark .remaining-units-table th,
html.lc-industrial-dark .tk-assignment-count,
html.lc-industrial-dark .tk-complete-roster>summary,
html.lc-industrial-dark .tk-employee-meta,
html.lc-industrial-dark .tk-employee-metric span,
html.lc-industrial-dark .tk-employee-toggle,
html.lc-industrial-dark .tk-equipment-card>summary span,
html.lc-industrial-dark .tk-equipment-person small,
html.lc-industrial-dark .tk-equipment-roster,
html.lc-industrial-dark .tk-equipment-save-state,
html.lc-industrial-dark .tk-help,
html.lc-industrial-dark .tk-hours-worked,
html.lc-industrial-dark .tk-import-preview,
html.lc-industrial-dark .tk-manager-section>summary span,
html.lc-industrial-dark .tk-overhead-metric span,
html.lc-industrial-dark .tk-overhead-name,
html.lc-industrial-dark .tk-overhead-summary-title strong,
html.lc-industrial-dark .tk-roster-legend,
html.lc-industrial-dark .tk-roster-summary strong,
html.lc-industrial-dark .tk-summary strong,
html.lc-industrial-dark .tk-table th,
html.lc-industrial-dark .tk-workspace-tab {
  color: #eaf2f8 !important;
}

/* --- red text pinned to a light-mode value (3) --- */
html.lc-industrial-dark #safetyWorkspace .sw-error,
html.lc-industrial-dark .my-time-person button,
html.lc-industrial-dark .querySelector('[data-linecrew-jsa-load-error]')) {
  color: #ff9d9d !important;
}

/* --- green text pinned to a light-mode value (2) --- */
html.lc-industrial-dark .lc-signature-status.signed,
html.lc-industrial-dark .tk-equipment-save-state.saved {
  color: #7fe0a8 !important;
}

/* --- satellite sweep, pass 2: selectors the first pass deduplicated --- */
html.lc-industrial-dark #safetyWorkspace .sw-pill,
html.lc-industrial-dark #timekeepingPage .tk-empty-state,
html.lc-industrial-dark #timekeepingPage .tk-exception.high,
html.lc-industrial-dark #timekeepingPage .tk-history-audit,
html.lc-industrial-dark #timekeepingPage .tk-history-card,
html.lc-industrial-dark #timekeepingPage .tk-history-row,
html.lc-industrial-dark #timekeepingPage .tk-payroll-card,
html.lc-industrial-dark #timekeepingPage .tk-period-badge,
html.lc-industrial-dark #timekeepingPage .tk-table tbody tr,
html.lc-industrial-dark #timekeepingPage .tk-table tbody tr:hover,
html.lc-industrial-dark #timekeepingPage .tk-table thead th,
html.lc-industrial-dark #timekeepingPage .tk-table tr,
html.lc-industrial-dark #timekeepingPage .tk-table-wrap,
html.lc-industrial-dark .crew-performance-periods button,
html.lc-industrial-dark .crew-performance-pricing button,
html.lc-industrial-dark .lc-industrial-dark .role,
html.lc-industrial-dark .lc-industrial-dark body.lc-shell-active>header .company-brand-badge img,
html.lc-industrial-dark .lc-jsa-add,
html.lc-industrial-dark .lc-jsa-card,
html.lc-industrial-dark .lc-jsa-check,
html.lc-industrial-dark .lc-jsa-progress span,
html.lc-industrial-dark .lc-jsa-review-field,
html.lc-industrial-dark .lc-jsa-review-head,
html.lc-industrial-dark .lc-jsa-review-pill,
html.lc-industrial-dark .lc-jsa-review-section,
html.lc-industrial-dark .lc-jsa-review-signature,
html.lc-industrial-dark .lc-jsa-review-table th,
html.lc-industrial-dark .lc-jsa-task,
html.lc-industrial-dark .lc-mobile-profile-avatar,
html.lc-industrial-dark .lc-pilot-actions a.secondary,
html.lc-industrial-dark .lc-pilot-dot,
html.lc-industrial-dark .lc-pilot-item,
html.lc-industrial-dark .lc-pilot-onboarding,
html.lc-industrial-dark .lc-profile-photo-editor,
html.lc-industrial-dark .lc-shell-active>header,
html.lc-industrial-dark .lc-shell-active>header .company-brand-badge img,
html.lc-industrial-dark .lc-signature-actions,
html.lc-industrial-dark .lc-signature-wrap,
html.lc-industrial-dark .lc-team-empty,
html.lc-industrial-dark .lc-toast,
html.lc-industrial-dark .my-time-active-person,
html.lc-industrial-dark .my-time-admin-row,
html.lc-industrial-dark .my-time-admin-worked,
html.lc-industrial-dark .my-time-hours,
html.lc-industrial-dark .my-time-people,
html.lc-industrial-dark .my-time-person,
html.lc-industrial-dark .my-time-person-badge,
html.lc-industrial-dark .my-time-person.active,
html.lc-industrial-dark .my-time-row.my-time-header,
html.lc-industrial-dark .tk-complete-roster,
html.lc-industrial-dark .tk-crew-card,
html.lc-industrial-dark .tk-crew-equipment,
html.lc-industrial-dark .tk-crew-equipment-chip,
html.lc-industrial-dark .tk-crew-equipment-chip.primary,
html.lc-industrial-dark .tk-custom-export-menu,
html.lc-industrial-dark .tk-custom-export-menu button,
html.lc-industrial-dark .tk-custom-export-menu button:hover,
html.lc-industrial-dark .tk-employee-detail .tk-table,
html.lc-industrial-dark .tk-employee-summary,
html.lc-industrial-dark .tk-equipment-card,
html.lc-industrial-dark .tk-equipment-card>summary,
html.lc-industrial-dark .tk-equipment-savebar,
html.lc-industrial-dark .tk-import-box,
html.lc-industrial-dark .tk-manager-section,
html.lc-industrial-dark .tk-manager-section>summary,
html.lc-industrial-dark .tk-my-crew-person,
html.lc-industrial-dark .tk-overhead-code,
html.lc-industrial-dark .tk-overhead-detail,
html.lc-industrial-dark .tk-overhead-detail .tk-table,
html.lc-industrial-dark .tk-overhead-summary,
html.lc-industrial-dark .tk-overhead-summary-title,
html.lc-industrial-dark .tk-roster-summary>div,
html.lc-industrial-dark .tk-roster-swatch,
html.lc-industrial-dark .tk-workspace-tab:hover,
html.lc-industrial-dark .tk-workspace-tabs {
  background: #0c2030 !important;
  color: #eaf2f8 !important;
  border-color: #27506d !important;
}