:root {
  --red: #b91c1c;
  --red-dark: #7f1d1d;
  --primary-rgb: 185, 28, 28;
  --dark-rgb: 5, 5, 5;
  --ink: #0f172a;
  --muted: #667085;
  --line: #050505;
  --bg: #f5f6f8;
  --panel: #ffffff;
  --blue: #1d4ed8;
  --green: #047857;
  --shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
  --canvas: #dfe7f0;
  --canvas-strong: #ccd8e6;
  --surface: #f5f8fc;
  --surface-alt: #ebf1f7;
  --surface-warm: #f7f1e5;
  --sidebar: #3a4b60;
  --sidebar-panel: #465970;
  --accent-gold: #d7a441;
  --accent-blue: #2d5f93;
  --border-soft: #c7d0dc;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  overflow-x: hidden;
  background: var(--canvas);
  color: var(--ink);
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button,
select {
  font: inherit;
}

input,
textarea {
  width: 100%;
  font: inherit;
  color: var(--ink);
  background: white;
}

button {
  cursor: pointer;
}

.loading-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  padding: 28px;
  text-align: center;
}

.loading-screen img {
  width: 112px;
  height: 112px;
  border-radius: 28px;
  box-shadow: var(--shadow);
}

.login-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: calc(22px + env(safe-area-inset-top)) 18px calc(22px + env(safe-area-inset-bottom));
  background:
    linear-gradient(135deg, rgba(204, 216, 230, 0.94), rgba(247, 241, 229, 0.82)),
    var(--canvas);
}

.login-card {
  width: min(100%, 420px);
  display: grid;
  gap: 14px;
  padding: 24px;
  border: 3px solid var(--line);
  border-top: 7px solid var(--red);
  border-bottom: 7px solid var(--accent-gold);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.login-card img {
  width: 104px;
  height: 104px;
  justify-self: center;
  border: 3px solid var(--line);
  border-radius: 10px;
  background: white;
  box-shadow: var(--shadow);
}

.login-card h1,
.login-card p {
  margin: 0;
  text-align: center;
}

.login-card h1 {
  font-size: 28px;
  line-height: 1.05;
}

.login-card label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
}

.login-card select,
.login-card input {
  min-height: 50px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: white;
  color: var(--ink);
  font-weight: 700;
}

.login-error {
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #fef2f2;
  color: var(--red-dark);
  padding: 10px;
  font-weight: 900;
  text-align: center;
}

.offline-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 14px;
  padding: 28px;
  text-align: center;
  background: #101114;
  color: white;
}

.offline-screen img {
  width: 118px;
  height: 118px;
  border-radius: 28px;
  border: 3px solid var(--red);
  box-shadow: var(--shadow);
}

.offline-screen h1,
.offline-screen p {
  margin: 0;
}

.offline-screen p {
  max-width: 360px;
  color: rgba(255, 255, 255, 0.76);
  font-weight: 700;
  line-height: 1.45;
}

.offline-screen button {
  min-height: 48px;
  border: 2px solid white;
  border-radius: 8px;
  background: var(--red);
  color: white;
  padding: 0 22px;
  font-weight: 900;
}

.app-shell {
  min-height: 100vh;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #101114;
  color: white;
  border-bottom: 4px solid var(--red);
  padding: calc(10px + env(safe-area-inset-top)) 16px 12px;
}

.topbar-inner {
  max-width: 1180px;
  margin: 0 auto;
}

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

.brand-row > div {
  min-width: 0;
  flex: 1;
}

.brand-logo {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 2px solid rgba(255, 255, 255, 0.22);
  object-fit: cover;
}

.brand-title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.1;
}

.brand-subtitle {
  margin: 3px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
}

.access-pill {
  margin-left: auto;
  display: none;
  align-items: center;
  min-height: 30px;
  padding: 4px 10px;
  border: 2px solid rgba(255, 255, 255, 0.36);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.86);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.access-pill.programming {
  display: inline-flex;
  background: #fef3c7;
  color: #111827;
  border-color: #fbbf24;
}

.logout-button {
  min-height: 38px;
  border: 2px solid rgba(255, 255, 255, 0.36);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: white;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 900;
}

.shell-row {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.top-nav {
  display: none;
  gap: 8px;
}

.top-nav button,
.nav-more-select select {
  min-height: 38px;
  border: 2px solid rgba(255, 255, 255, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: white;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 900;
}

.top-nav button.active,
.desktop-more.active select {
  background: white;
  color: var(--ink);
}

.nav-more-select {
  display: grid;
  gap: 4px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 900;
}

.nav-more-select select {
  min-width: 150px;
  appearance: auto;
}

.control-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.control-row label {
  display: grid;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.72);
}

.control-row select {
  width: 100%;
  min-height: 42px;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: white;
  color: var(--ink);
  padding: 8px 10px;
}

.locked-select {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 42px;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: #f8fafc;
  color: var(--ink);
  padding: 8px 10px;
  font-size: 14px;
  font-weight: 800;
}

.desktop-module-tabs {
  display: none;
}

.screen {
  padding: 14px 14px 28px;
  max-width: 1120px;
  margin: 0 auto;
}

.with-bottom-nav .screen {
  padding-bottom: 92px;
}

.screen-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin: 8px 0 12px;
}

.screen-title h2 {
  margin: 0;
  font-size: 24px;
  line-height: 1.1;
}

.title-action {
  min-width: min(150px, 100%);
}

.toolbar {
  display: grid;
  gap: 10px;
  margin: 0 0 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}

.toolbar label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}

.search-input {
  min-height: 46px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f8fafc;
  color: var(--ink);
}

.filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.filter-pill {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: white;
  color: var(--ink);
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 900;
}

.filter-pill span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  min-height: 24px;
  border-radius: 999px;
  background: #f1f5f9;
  color: var(--ink);
}

.filter-pill.active {
  background: var(--ink);
  color: white;
}

.filter-pill.active span {
  background: white;
  color: var(--ink);
}

.dashboard-hero {
  display: grid;
  gap: 18px;
  margin: 8px 0 14px;
  padding: 18px;
  border: 3px solid var(--line);
  border-bottom: 7px solid var(--red);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.96)),
    white;
  box-shadow: var(--shadow);
}

.dashboard-hero h2 {
  margin: 0;
  font-size: 32px;
  line-height: 1.05;
}

.dashboard-hero p {
  max-width: 620px;
  margin: 8px 0 0;
  color: #344054;
  font-weight: 700;
  line-height: 1.45;
}

.hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.hero-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 4px 10px;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: white;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}

.hero-actions {
  display: grid;
  gap: 10px;
  align-content: start;
}

.small {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.notice,
.mode-banner {
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
  padding: 12px;
  margin: 0 0 12px;
}

.notice {
  background: #ecfdf5;
  color: var(--green);
  font-weight: 800;
}

.mode-banner {
  display: grid;
  gap: 4px;
  background: #fff7ed;
  color: var(--ink);
}

.mode-banner code {
  color: var(--red-dark);
  font-weight: 800;
}

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

.dashboard-stats {
  margin-bottom: 14px;
}

.stat-card,
.job-card,
.task-card,
.activity-card,
.panel {
  background: var(--panel);
  border: 2px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.stat-card {
  min-height: 96px;
  padding: 14px;
  text-align: left;
  cursor: pointer;
  background: linear-gradient(180deg, #ffffff, rgba(var(--primary-rgb), 0.08));
  transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.stat-card strong {
  display: block;
  font-size: 34px;
  line-height: 1;
}

.stat-card span {
  display: block;
  margin-top: 8px;
  font-weight: 800;
}

.stat-card:hover,
.job-card:hover,
.task-card:hover,
.dash-action:hover,
.home-row:hover,
.workspace-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.12);
}

.dashboard-grid {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.dashboard-workbench {
  display: grid;
  gap: 14px;
}

.desktop-control-heading {
  display: none;
}

.desktop-focus-strip {
  display: none;
}

.desktop-brand-banner,
.streamlit-desktop-home {
  display: none;
}

.dashboard-main-column,
.dashboard-actions-column {
  display: grid;
  gap: 14px;
  align-content: start;
}

.dashboard-panel {
  display: grid;
  gap: 12px;
}

.dashboard-panel h3 {
  margin: 0;
  font-size: 20px;
}

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

.home-row {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  text-align: left;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, rgba(var(--primary-rgb), 0.07));
  color: var(--ink);
}

.home-row b,
.home-row small,
.home-row em {
  display: block;
  min-width: 0;
}

.home-row b {
  font-size: 15px;
}

.home-row small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.home-row em {
  color: var(--red-dark);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.dash-action-grid {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.dash-action-section {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.dash-action-section h3 {
  margin: 0;
  padding: 0 2px;
  color: var(--ink);
  font-size: 16px;
  font-weight: 900;
}

.dash-action-section .dash-action-grid {
  margin-top: 0;
}

.dash-action {
  min-height: 78px;
  display: grid;
  align-content: center;
  gap: 5px;
  text-align: left;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: var(--red);
  color: white;
}

.dash-action:nth-child(even) {
  background: var(--ink);
}

.dash-action b,
.dash-action span {
  display: block;
}

.dash-action b {
  font-size: 17px;
}

.dash-action span {
  color: rgba(255, 255, 255, 0.84);
  font-size: 12px;
  font-weight: 800;
}

.muted-action {
  background: linear-gradient(180deg, rgba(var(--primary-rgb), 0.16), rgba(var(--primary-rgb), 0.07));
  color: var(--ink);
}

.muted-action span {
  color: var(--muted);
}

.quick-grid {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.nav-button,
.primary-button,
.secondary-button,
.danger-button,
.back-button,
.contact-button,
.mini-button {
  min-height: 48px;
  border-radius: 8px;
  border: 2px solid var(--line);
  font-weight: 800;
}

.nav-button,
.primary-button {
  background: var(--red);
  color: white;
}

.secondary-button,
.danger-button,
.back-button,
.contact-button,
.mini-button {
  background: linear-gradient(180deg, rgba(var(--primary-rgb), 0.15), rgba(var(--primary-rgb), 0.06));
  color: var(--ink);
}

.danger-button {
  background: linear-gradient(180deg, #fee2e2, rgba(var(--primary-rgb), 0.08));
  border-color: var(--line);
  color: #991b1b;
}

.back-button {
  background: linear-gradient(180deg, rgba(var(--dark-rgb), 0.12), rgba(var(--primary-rgb), 0.08));
}

.contact-button,
.mini-button {
  background: linear-gradient(180deg, rgba(var(--primary-rgb), 0.12), rgba(var(--dark-rgb), 0.04));
}

.primary-button:active,
.secondary-button:active,
.danger-button:active,
.back-button:active,
.contact-button:active,
.nav-button:active,
.stat-card:active {
  background: var(--green);
  color: white;
}

.list {
  display: grid;
  gap: 12px;
}

.calendar-panel {
  display: grid;
  gap: 12px;
}

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

.schedule-row {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.schedule-date {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 4px;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--ink);
}

.schedule-date b,
.schedule-date span,
.schedule-row p {
  margin: 0;
}

.schedule-date span {
  color: var(--red-dark);
  font-size: 13px;
  font-weight: 900;
}

.schedule-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.calendar-workbench {
  display: grid;
  gap: 12px;
}

.calendar-form-panel,
.calendar-schedule-panel {
  align-self: start;
}

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

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

.calendar-autofill-card {
  display: grid;
  gap: 8px;
  padding: 11px;
  border: 1px solid var(--crm-border);
  border-left: 4px solid var(--crm-primary);
  border-radius: 8px;
  background: var(--crm-card-alt, #f8fafc);
}

.calendar-autofill-card > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.calendar-autofill-card b {
  color: var(--crm-ink);
  font-size: 13px;
  font-weight: 900;
}

.calendar-autofill-card small {
  color: var(--crm-muted);
  font-weight: 750;
}

.calendar-autofill-card input[readonly] {
  background: #ffffff;
  color: var(--crm-ink);
}

.calendar-schedule-head {
  align-items: center;
}

.calendar-mode-toggle {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.calendar-day-group {
  display: grid;
  gap: 8px;
}

.calendar-day-group h4 {
  margin: 2px 0 0;
  color: var(--crm-ink);
  font-size: 13px;
  font-weight: 950;
  text-transform: uppercase;
}

.calendar-event-card {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 128px;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--crm-border);
  border-left: 4px solid var(--crm-primary);
  border-radius: 8px;
  background: #ffffff;
}

.calendar-event-card.compact {
  grid-template-columns: 1fr;
  gap: 7px;
  padding: 8px;
}

.calendar-event-time {
  display: grid;
  gap: 2px;
  color: var(--crm-ink);
}

.calendar-event-time b {
  font-size: 13px;
  font-weight: 950;
}

.calendar-event-time span,
.calendar-event-main p,
.schedule-note {
  color: var(--crm-muted);
  font-size: 12px;
  font-weight: 750;
}

.calendar-event-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.calendar-event-main b {
  color: var(--crm-ink);
  font-size: 14px;
  font-weight: 950;
}

.calendar-week-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(120px, 1fr));
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.calendar-day-column {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 240px;
  padding: 9px;
  border: 1px solid var(--crm-border);
  border-radius: 8px;
  background: var(--crm-card-alt, #f8fafc);
}

.calendar-day-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--crm-border);
}

.calendar-day-header b {
  color: var(--crm-ink);
  font-size: 12px;
  font-weight: 950;
}

.calendar-day-header span {
  color: var(--crm-muted);
  font-size: 11px;
  font-weight: 850;
}

.calendar-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(94px, 1fr));
  gap: 6px;
  overflow-x: auto;
}

.calendar-month-cell {
  display: grid;
  align-content: start;
  gap: 4px;
  min-height: 92px;
  padding: 8px;
  border: 1px solid var(--crm-border);
  border-radius: 8px;
  background: #ffffff;
}

.calendar-month-cell.muted {
  opacity: 0.55;
  background: var(--crm-card-alt, #f8fafc);
}

.calendar-month-cell b {
  color: var(--crm-ink);
  font-size: 12px;
  font-weight: 950;
}

.calendar-month-cell span,
.calendar-month-cell small {
  overflow: hidden;
  color: var(--crm-muted);
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.map-tools {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.map-tools label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-weight: 900;
}

.map-tools select {
  min-height: 46px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: white;
  color: var(--ink);
  font-weight: 800;
}

.map-shell {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.map-surface {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  border: 3px solid var(--line);
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(17, 24, 39, 0.08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(17, 24, 39, 0.08) 1px, transparent 1px),
    linear-gradient(135deg, #eef6ff, #f8fafc 45%, #edf7ef);
  background-size: 56px 56px, 56px 56px, cover;
}

.map-surface::before,
.map-surface::after {
  content: "";
  position: absolute;
  inset: auto -10% 42% -10%;
  height: 32px;
  transform: rotate(-7deg);
  background: rgba(255, 255, 255, 0.72);
  border-top: 2px solid rgba(17, 24, 39, 0.16);
  border-bottom: 2px solid rgba(17, 24, 39, 0.16);
}

.map-surface::after {
  inset: 46% -10% auto -10%;
  transform: rotate(10deg);
}

.map-pin {
  position: absolute;
  z-index: 2;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 3px solid var(--line);
  border-radius: 999px 999px 999px 3px;
  transform: translate(-50%, -50%) rotate(-45deg);
  background: var(--red);
  box-shadow: var(--shadow);
}

.map-pin span,
.map-pin b {
  transform: rotate(45deg);
}

.map-pin b {
  color: white;
  font-size: 13px;
  line-height: 1;
}

.map-pin.active { background: #2563eb; }
.map-pin.incoming { background: #b91c1c; }
.map-pin.closed { background: #64748b; }
.map-pin.open { background: #0f766e; }

.map-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: white;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}

.map-legend i {
  width: 12px;
  height: 12px;
  border: 2px solid var(--line);
  border-radius: 50%;
}

.map-legend i.active { background: #2563eb; }
.map-legend i.incoming { background: #b91c1c; }
.map-legend i.closed { background: #64748b; }
.map-legend i.open { background: #0f766e; }

.map-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--muted);
  font-weight: 900;
}

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

.location-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-left-width: 8px;
  border-radius: 8px;
  background: white;
}

.location-row.active { border-left-color: #2563eb; }
.location-row.incoming { border-left-color: #b91c1c; }
.location-row.closed { border-left-color: #64748b; }
.location-row.open { border-left-color: #0f766e; }

.location-index {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: #f8fafc;
  color: var(--ink);
  font-weight: 900;
}

.location-row b,
.location-row p {
  margin: 0;
}

.location-actions {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.field-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
}

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

.field-job-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
}

.field-job-card.current {
  border-width: 3px;
  background: #f8fafc;
  box-shadow: var(--shadow);
}

.accounting-banner {
  position: sticky;
  top: 8px;
  z-index: 4;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px;
  border: 3px solid var(--line);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: var(--shadow);
}

.accounting-banner div {
  display: grid;
  gap: 4px;
  padding: 9px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.accounting-banner b {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
}

.accounting-banner span {
  color: var(--ink);
  font-size: 17px;
  font-weight: 900;
}

.accounting-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
  padding: 10px;
  border: 1px solid var(--crm-border);
  border-radius: 8px;
  background: var(--professional-panel, #ffffff);
  box-shadow: var(--crm-shadow-soft);
}

.accounting-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.accounting-nav-button {
  min-width: 150px;
}

.settings-grid {
  display: grid;
  gap: 14px;
}

.settings-panel {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.settings-role-list {
  display: grid;
  gap: 12px;
}

.settings-role-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}

.settings-role-card.fixed {
  background: #eff6ff;
}

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

.role-enabled {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  font-size: 15px;
  font-weight: 900;
}

.role-enabled input {
  width: 20px;
  height: 20px;
  accent-color: var(--red);
}

.role-card-grid {
  margin: 0;
}

.settings-panel input[type="color"] {
  min-height: 48px;
  padding: 4px;
}

.company-logo-uploader {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 14px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}

.company-logo-uploader > img {
  width: 112px;
  height: 112px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #ffffff;
  object-fit: contain;
}

.company-logo-uploader > div {
  display: grid;
  gap: 8px;
}

.company-logo-browse {
  width: fit-content;
  display: inline-grid;
  gap: 5px;
  color: var(--ink);
  font-weight: 800;
}

.company-logo-browse input[type="file"] {
  max-width: 100%;
}

@media (max-width: 540px) {
  .company-logo-uploader {
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
  }

  .company-logo-uploader > img {
    width: 76px;
    height: 76px;
  }
}

.theme-preset-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.theme-preset-panel > b {
  color: var(--ink);
  font-size: 13px;
}

.theme-preset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.theme-preset-button {
  min-height: 48px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink);
  text-align: left;
  font-weight: 900;
}

.theme-preset-button i {
  display: block;
  height: 24px;
  border: 2px solid var(--line);
  border-radius: 4px;
  background: linear-gradient(90deg, var(--preset-primary) 0 50%, var(--preset-secondary) 50% 100%);
}

.sticky-save-bar {
  position: sticky;
  bottom: 72px;
  z-index: 7;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 14px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow);
}

.accounting-grid {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 12px;
  padding: 0 4px 14px;
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.accounting-week {
  flex: 0 0 min(360px, calc(100vw - 44px));
  min-width: min(360px, calc(100vw - 44px));
  max-width: 420px;
  width: 100%;
  height: auto;
  min-height: 0;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
  overflow: visible;
  scroll-snap-align: start;
}

.accounting-week,
.accounting-week * {
  box-sizing: border-box;
  min-width: 0;
}

.accounting-week h3 {
  margin: 0;
}

.accounting-week-head {
  align-items: stretch;
}

.accounting-week-head > div:first-child {
  min-width: 0;
}

.accounting-week-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(92px, 1fr));
  gap: 7px;
  margin-top: 8px;
}

.accounting-week-metrics div {
  display: grid;
  gap: 3px;
  min-height: 54px;
  padding: 8px;
  border: 1px solid var(--crm-border);
  border-radius: 7px;
  background: var(--crm-card-alt, #f8fafc);
}

.accounting-week-metrics b,
.week-ending-pill small {
  color: var(--crm-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.accounting-week-metrics span {
  color: var(--crm-ink);
  font-size: 13px;
  font-weight: 900;
}

.week-ending-pill {
  align-self: stretch;
  display: grid;
  place-content: center;
  gap: 3px;
  min-width: 118px;
  padding: 9px 10px;
  border: 1px solid var(--crm-border-strong, #111827);
  border-radius: 8px;
  text-align: center;
}

.week-ending-pill.positive {
  background: #dcfce7;
}

.week-ending-pill.warning {
  background: #fef3c7;
}

.week-ending-pill b {
  color: #0f172a;
  font-size: 14px;
  font-weight: 950;
}

.tier-block {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.finance-row {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  text-align: left;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink);
  height: auto;
  overflow: visible;
}

.finance-row strong,
.finance-row small,
.finance-row em {
  display: block;
  overflow-wrap: anywhere;
  word-break: normal;
}

.finance-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.finance-row em {
  font-style: normal;
  font-weight: 900;
}

.accounting-control-panel {
  margin-bottom: 12px;
}

.accounting-planner {
  display: grid;
  gap: 14px;
  margin-bottom: 14px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #fffaf0;
}

.planner-head,
.planner-main-grid {
  display: grid;
  gap: 12px;
}

.planner-head {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.planner-head h3 {
  margin: 0 0 4px;
}

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

.planning-week-card {
  display: grid;
  gap: 5px;
  min-height: 112px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.planning-week-card b,
.planning-week-card strong {
  color: var(--ink);
  font-weight: 950;
}

.planning-week-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.planning-week-card.good {
  border-left: 6px solid #15803d;
}

.planning-week-card.watch {
  border-left: 6px solid #d97706;
}

.planning-week-card.danger {
  border-left: 6px solid #b91c1c;
  background: #fff1f2;
}

.planner-main-grid {
  grid-template-columns: minmax(260px, 0.38fr) minmax(0, 1fr);
  align-items: start;
}

.planning-suggestions,
.payment-planner-table {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.planning-suggestions p {
  margin: 0;
  padding: 9px 10px;
  border: 1px solid var(--crm-border);
  border-left: 4px solid var(--crm-primary);
  border-radius: 7px;
  background: var(--crm-card-alt, #f8fafc);
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.42;
}

.payment-planner-row {
  display: grid;
  grid-template-columns: 92px minmax(210px, 1fr) minmax(132px, 0.45fr) minmax(150px, 0.55fr);
  gap: 9px;
  align-items: stretch;
  min-width: 0;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.payment-planner-row > * {
  min-width: 0;
}

.payment-planner-row.selected {
  background: #ecfdf5;
}

.planner-check {
  min-height: 0;
}

.planner-payable strong,
.planner-payable small {
  overflow-wrap: anywhere;
}

.planner-amount,
.planner-move {
  display: grid;
  gap: 6px;
}

.planner-amount b {
  color: var(--ink);
  font-size: 14px;
  font-weight: 950;
}

.tier-pill,
.current-week-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafc;
  color: var(--ink);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.tier-pill.tier-1 {
  background: #dcfce7;
}

.tier-pill.tier-2 {
  background: #fef3c7;
}

.tier-pill.tier-3 {
  background: #e2e8f0;
}

.planner-week-buttons {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  justify-content: stretch;
}

.planner-week-buttons .primary-button,
.planner-week-buttons .secondary-button,
.planner-move .primary-button,
.planner-move .secondary-button {
  min-width: 0;
  width: 100%;
  flex: 1 1 0;
  white-space: nowrap;
}

.primary-button:disabled,
.secondary-button:disabled,
.danger-button:disabled {
  cursor: not-allowed;
  opacity: 0.42;
  box-shadow: none;
}

.compact-form {
  align-items: end;
}

.finance-control-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}

.finance-check {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}

.finance-check input {
  width: 20px;
  height: 20px;
  accent-color: var(--green);
}

.finance-open {
  display: block;
  min-height: 42px;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  text-align: left;
}

.finance-open.disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.finance-schedule {
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  height: auto;
  overflow: visible;
}

.finance-schedule label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.finance-schedule input {
  min-height: 38px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 7px 9px;
}

.mini-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.accounting-week .mini-button-row .primary-button,
.accounting-week .mini-button-row .secondary-button {
  flex: 1 1 72px;
}

.tier-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.tier-title span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.tier-block.tier-1 {
  background: #ecfdf5;
}

.tier-block.tier-2 {
  background: #fffbeb;
}

.tier-block.tier-3 {
  background: #f8fafc;
}

.accounting-add-ar {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #eef2ff;
}

.accounting-add-ar b {
  color: var(--ink);
}

.accounting-add-ar.collapsed {
  background: #f8fafc;
}

.accounting-add-toggle {
  justify-self: start;
}

.ar-row {
  background: #f8fafc;
}

.approval-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.approval-summary div {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, rgba(var(--primary-rgb), 0.08));
}

.approval-summary b {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.approval-summary span {
  color: var(--ink);
  font-size: 30px;
  font-weight: 900;
  line-height: 1;
}

.approvals-stack {
  gap: 12px;
}

.approvals-panel {
  display: grid;
  gap: 12px;
}

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

.approval-row {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, rgba(var(--primary-rgb), 0.06));
}

.approval-kind,
.approval-main {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.approval-kind {
  flex-wrap: wrap;
}

.approval-main {
  justify-content: space-between;
}

.approval-main h3 {
  margin: 0;
  font-size: 18px;
}

.approval-main p {
  margin: 5px 0 0;
  color: var(--muted);
  font-weight: 800;
}

.approval-main strong {
  flex: 0 0 auto;
  color: var(--red-dark);
  font-size: 18px;
  font-weight: 900;
}

.approval-note {
  padding: 8px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink) !important;
}

.approval-actions {
  margin-top: 0;
}

.job-card,
.task-card,
.activity-card,
.panel {
  padding: 14px;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.job-header {
  background: linear-gradient(180deg, #ffffff, #f3f6fb);
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  margin-bottom: 12px;
}

.job-header h3,
.task-card h3 {
  margin: 0;
  font-size: 18px;
}

.task-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.task-head h2,
.task-head h3 {
  margin: 0;
  line-height: 1.12;
}

.compact-task-card {
  cursor: pointer;
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  margin: 8px 8px 0 0;
  padding: 4px 10px;
  border-radius: 999px;
  border: 2px solid var(--line);
  background: #eef2ff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.badge.green {
  background: #ecfdf5;
  color: var(--green);
}

.badge.blue {
  background: #eff6ff;
  color: var(--blue);
}

.badge.gold {
  background: #fffbeb;
  color: #92400e;
}

.eyebrow {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.job-meta,
.task-meta {
  display: grid;
  gap: 6px;
  margin: 10px 0;
  color: var(--muted);
  font-size: 14px;
}

.task-meta div,
.task-context div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px;
}

.task-meta b,
.task-context b {
  color: var(--ink);
}

.task-focus {
  display: grid;
  gap: 12px;
}

.task-context {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--muted);
  font-size: 14px;
}

.task-primary-actions {
  display: grid;
  gap: 10px;
}

.reminder-send-box,
.reminder-response-box {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, rgba(var(--primary-rgb), 0.07));
}

.reminder-send-box textarea,
.reminder-response-box textarea {
  min-height: 92px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: white;
  color: var(--ink);
  resize: vertical;
}

.reminder-response-box label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-weight: 900;
}

.job-meta div {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.job-meta b {
  color: var(--ink);
}

.job-meta span {
  min-width: 0;
  color: var(--muted);
}

.contact-row,
.action-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.action-row.two {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

.action-row.three {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

.action-row.four {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

.contact-button {
  min-height: 40px;
  font-size: 13px;
}

.contact-button,
.mini-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.contact-button.disabled,
.mini-button.disabled,
button.contact-button:disabled,
button.mini-button:disabled {
  background: var(--professional-panel-muted, #f3f5f8) !important;
  color: var(--muted, #64748b) !important;
  border-color: var(--line-soft, #d7dde6) !important;
  cursor: not-allowed;
  opacity: 0.72;
  box-shadow: none !important;
}

.primary-button.compact,
.secondary-button.compact,
.danger-button.compact,
.mini-button.compact {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 12px;
}

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

.polished-job-card {
  overflow: hidden;
  border-width: 3px;
}

.job-title-band {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 14px;
  background: #f8fafc;
  border-bottom: 3px solid var(--line);
}

.job-title-band h3 {
  margin: 3px 0 0;
  font-size: 20px;
  line-height: 1.08;
}

.job-card-body {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.job-next-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.job-next-strip span,
.job-next-strip b {
  display: block;
}

.job-next-strip span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.job-next-strip b {
  margin-top: 3px;
  font-size: 15px;
}

.next-job-button {
  min-height: 42px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: var(--red);
  color: white;
  padding: 0 16px;
  font-weight: 900;
}

.compact-job-card .job-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.open-job-button {
  width: 100%;
  min-height: 48px;
  margin-top: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: var(--ink);
  color: white;
  font-weight: 900;
}

.job-hero .job-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.job-hero h2 {
  margin: 0;
  font-size: 25px;
  line-height: 1.08;
}

.job-detail-screen {
  max-width: 1080px;
}

.detail-stack {
  display: grid;
  gap: 14px;
}

.job-detail-title,
.workspace-title {
  align-items: center;
}

.job-detail-hero {
  overflow: hidden;
  border: 3px solid var(--line);
  border-radius: 12px;
  background: white;
  box-shadow: var(--shadow);
}

.job-detail-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 16px;
  background: #f8fafc;
  border-bottom: 4px solid var(--line);
}

.job-detail-heading {
  min-width: 0;
}

.job-detail-heading h2 {
  margin: 2px 0 0;
  font-size: 28px;
  line-height: 1.05;
}

.job-detail-heading p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}

.job-detail-body {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.next-process-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.next-process-panel h3 {
  margin: 2px 0 0;
  font-size: 21px;
  line-height: 1.12;
}

.job-fact-grid {
  padding: 2px 0;
}

.next-task-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 12px 0;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.next-task-card h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.job-contact-bar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(74px, 1fr));
  gap: 8px;
  margin: 12px 0;
}

.job-info-grid {
  display: grid;
  gap: 8px;
}

.restricted-note {
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--muted);
  font-weight: 800;
}

.workspace-grid {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.workspace-button {
  min-height: 74px;
  display: grid;
  gap: 4px;
  align-content: center;
  text-align: left;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, rgba(var(--primary-rgb), 0.08));
  color: var(--ink);
  padding: 12px;
}

.workspace-button.recommended {
  background: var(--ink);
  color: white;
  border-bottom: 5px solid var(--red);
}

.workspace-button b {
  font-size: 17px;
}

.workspace-button.recommended span {
  color: rgba(255, 255, 255, 0.82);
}

.workspace-button span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.more-tools-panel,
.quick-panel {
  margin-top: 10px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
  overflow: hidden;
}

.more-tools-panel summary,
.quick-panel summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(var(--primary-rgb), 0.15), rgba(var(--primary-rgb), 0.06));
  color: var(--ink);
  cursor: pointer;
  font-weight: 900;
  list-style: none;
}

.more-tools-panel summary::-webkit-details-marker,
.quick-panel summary::-webkit-details-marker {
  display: none;
}

.more-tools-panel summary::after,
.quick-panel summary::after {
  content: "Open";
  color: var(--red-dark);
  font-size: 12px;
  font-weight: 900;
}

.more-tools-panel[open] summary::after,
.quick-panel[open] summary::after {
  content: "Close";
}

.more-tools-panel summary span {
  min-width: 28px;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: white;
  color: var(--ink);
  font-size: 12px;
}

.compact-tool-grid {
  margin: 0;
  padding: 10px;
  border-top: 2px solid var(--line);
}

.small-action {
  min-height: 38px;
  padding: 0 12px;
}

.workspace-summary {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.workspace-summary b {
  font-size: 18px;
}

.workspace-utility-grid {
  display: grid;
  gap: 10px;
  margin: 0 0 12px;
}

.workspace-switcher {
  margin: 0;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.workspace-switcher label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-weight: 900;
}

.workspace-switcher select {
  min-height: 44px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: white;
  color: var(--ink);
  font-weight: 800;
}

.workspace-panel {
  overflow: hidden;
}

.workspace-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  margin: -12px -12px 12px;
  padding: 16px;
  border-bottom: 3px solid var(--line);
  background: #f8fafc;
}

.workspace-hero h2 {
  margin: 2px 0 0;
  font-size: 27px;
  line-height: 1.08;
}

.workspace-hero p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.workspace-next-required {
  display: grid;
  gap: 3px;
  margin: 0 0 14px;
  padding: 11px 14px;
  border: 1px solid #86c99a;
  border-left: 5px solid #15803d;
  background: #effaf2;
}

.workspace-next-required span {
  color: #39734a;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.workspace-next-required b {
  color: #146c32;
  font-size: 17px;
  line-height: 1.25;
}

.compact-contact-bar {
  margin: 0;
  padding: 10px;
  border-top: 2px solid var(--line);
}

.job-workspace-panel {
  border-width: 3px;
}

.job-tools-section {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.job-tools-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.job-tools-heading h3,
.job-tools-heading p {
  margin: 0;
}

.job-tools-heading h3 {
  margin-top: 2px;
  font-size: 18px;
}

.job-detail-screen .job-tools-section .workspace-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.job-detail-screen .job-tools-section .workspace-button {
  min-width: 0;
  min-height: 62px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--primary);
  border-radius: 4px;
  background: #ffffff;
  box-shadow: none;
}

.job-detail-actions {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.purchase-summary {
  border-width: 3px;
}

.purchase-request-form,
.purchase-approval-form {
  margin-bottom: 14px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}

.purchase-po-preview {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
}

.purchase-po-preview b,
.purchase-po-preview span {
  display: block;
}

.purchase-po-preview span {
  margin-top: 4px;
  font-size: 22px;
  font-weight: 900;
}

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

.purchase-card-row {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
}

.purchase-card-row.approved {
  border-bottom: 5px solid var(--green);
}

.purchase-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.purchase-card-head h3 {
  margin: 2px 0 0;
  font-size: 23px;
  line-height: 1.08;
}

.purchase-card-ticket {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 3px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}

.purchase-card-ticket b,
.purchase-card-ticket span {
  display: block;
}

.purchase-card-ticket b {
  font-size: 26px;
  line-height: 1;
}

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

.material-row {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
}

.material-row.approved {
  border-bottom: 5px solid var(--green);
}

.material-signoff-box {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.attention-card {
  display: grid;
  gap: 10px;
  border-width: 3px;
  border-bottom: 5px solid #f59e0b;
}

.attention-card h3 {
  margin: 2px 0 0;
  font-size: 22px;
  line-height: 1.08;
}

.folder-list,
.split-stack {
  display: grid;
  gap: 12px;
}

.folder-card {
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
}

.gate-card {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #fff7ed;
}

.gate-card.complete {
  background: #ecfdf5;
}

.gate-grid {
  display: grid;
  gap: 10px;
}

.gate-stage {
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
}

.gate-stage.complete {
  background: #ecfdf5;
}

.folder-card h3 {
  margin: 0 0 8px;
  font-size: 18px;
}

.customer-form-card {
  display: grid;
  gap: 12px;
}

.customer-forms-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
  padding: 14px;
}

.customer-form-job-summary {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
  padding: 14px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: white;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.customer-form-job-summary h3,
.customer-form-job-summary p {
  margin: 0;
}

.summary-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.summary-pills span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 4px 10px;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: #f8fafc;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}

.share-box {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.share-box label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-weight: 800;
}

.share-box input,
.share-box textarea {
  min-height: 46px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: white;
  color: var(--ink);
}

.share-box textarea {
  min-height: 150px;
  resize: vertical;
}

.email-preview {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
}

.email-preview > div {
  color: var(--ink);
  line-height: 1.45;
}

.form-link-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.form-link-row code {
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 9px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: white;
  font-size: 12px;
  font-weight: 800;
}

.customer-form-screen {
  min-height: 100vh;
  display: grid;
  place-items: start center;
  padding: calc(18px + env(safe-area-inset-top)) 14px calc(24px + env(safe-area-inset-bottom));
  background: var(--bg);
}

.customer-form-panel {
  width: min(100%, 760px);
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 3px solid var(--line);
  border-bottom: 7px solid var(--red);
  border-radius: 14px;
  background: white;
  box-shadow: var(--shadow);
}

.customer-form-panel img {
  width: 92px;
  height: 92px;
  justify-self: center;
  border-radius: 24px;
  box-shadow: var(--shadow);
}

.customer-form-panel h1,
.customer-form-panel p {
  margin: 0;
}

.customer-form-panel h1 {
  text-align: center;
  font-size: 30px;
  line-height: 1.05;
}

.customer-form-panel .eyebrow,
.customer-form-panel .small {
  text-align: center;
}

.customer-form-panel label span {
  justify-self: start;
  margin-left: 6px;
  padding: 2px 7px;
  border: 2px solid var(--line);
  border-radius: 999px;
  background: #fffbeb;
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
}

.folder-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.file-list,
.note-row {
  display: grid;
  gap: 8px;
}

.file-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px 0;
  border-top: 1px solid #d8dee6;
}

.file-row.selectable {
  grid-template-columns: 92px minmax(0, 1fr);
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.file-row:first-child {
  border-top: 0;
}

.file-row.selectable:first-child {
  border-top: 2px solid var(--line);
}

.file-select {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 42px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}

.file-select input {
  width: 18px;
  height: 18px;
  accent-color: var(--red);
}

.file-send-panel {
  margin: 12px 0;
}

.file-send-panel h3 {
  margin: 0;
  color: var(--ink);
}

.file-row b,
.note-row b {
  color: var(--ink);
}

.file-row span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.file-actions {
  display: grid;
  grid-template-columns: auto 1fr 1fr;
  gap: 8px;
  align-items: center;
}

.mini-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 6px 10px;
  text-decoration: none;
  font-size: 12px;
}

.note-row {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #d8dee6;
}

.note-row p {
  margin: 0;
}

.form-grid {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
}

.intake-form {
  margin-top: 14px;
}

.location-capture {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.location-capture b,
.location-capture p {
  margin: 0;
}

.form-grid label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-weight: 800;
}

.form-grid label.required-missing {
  padding: 8px;
  border: 2px solid #f59e0b;
  border-radius: 8px;
  background: #fffbeb;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
  min-height: 46px;
  border: 2px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}

.form-grid textarea {
  min-height: 120px;
  resize: vertical;
}

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

.missing-strip {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #fff7ed;
}

.missing-strip div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.missing-strip span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 2px solid #f59e0b;
  border-radius: 999px;
  background: white;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}

.kv {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid #d8dee6;
}

.kv:last-child {
  border-bottom: 0;
}

.kv b {
  color: var(--ink);
}

.kv span {
  min-width: 0;
}

.bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 10px 10px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, 0.94);
  border-top: 2px solid var(--line);
  backdrop-filter: blur(12px);
}

.bottom-nav button,
.bottom-nav select {
  min-height: 44px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(var(--primary-rgb), 0.14), rgba(var(--dark-rgb), 0.04));
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
  width: 100%;
}

.bottom-nav button.active,
.mobile-more.active select {
  background: var(--red);
  color: white;
}

.bottom-nav .mobile-more {
  display: block;
  min-width: 0;
  color: transparent;
  font-size: 0;
}

.bottom-nav .mobile-more select {
  padding: 0 6px;
  text-align: center;
}

.empty {
  padding: 22px;
  border: 2px dashed #98a2b3;
  border-radius: 10px;
  background: white;
  color: var(--muted);
  text-align: center;
  font-weight: 700;
}

.compact-empty {
  padding: 14px;
  border-style: solid;
  font-size: 13px;
}

@media (max-width: 560px) {
  .approval-summary {
    grid-template-columns: 1fr;
  }

  .approval-main {
    display: grid;
  }

  .approval-main strong {
    justify-self: start;
  }
}

@media (min-width: 760px) {
  .access-pill {
    display: inline-flex;
  }

  .shell-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
  }

  .top-nav {
    display: flex;
  }

  .control-row {
    width: 680px;
  }

  .dashboard-hero {
    grid-template-columns: minmax(0, 1fr) 220px;
    align-items: center;
    padding: 24px;
  }

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

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

  .home-row {
    grid-template-columns: minmax(0, 1fr) 150px;
    align-items: center;
  }

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

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

  .action-row.four {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }

  .contact-row,
  .action-row {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }

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

  .job-info-grid .wide {
    grid-column: 1 / -1;
  }

  .next-process-panel {
    grid-template-columns: minmax(0, 1fr) 220px;
    align-items: center;
  }

  .job-detail-actions {
    grid-template-columns: 260px;
    justify-content: end;
  }

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

  .workspace-utility-grid {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.7fr);
    align-items: start;
  }

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

  .calendar-workbench {
    grid-template-columns: minmax(320px, 0.42fr) minmax(0, 0.58fr);
    align-items: start;
  }

  .calendar-form-panel {
    position: sticky;
    top: 86px;
  }

  .schedule-row {
    grid-template-columns: 150px minmax(0, 1fr) 180px;
    align-items: center;
  }

  .map-tools {
    grid-template-columns: minmax(0, 1fr) 220px;
  }

  .location-row {
    grid-template-columns: 44px minmax(0, 1fr) 210px;
    align-items: center;
  }

  .location-actions {
    grid-column: auto;
  }

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

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

  .customer-form-job-summary {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .summary-pills {
    justify-content: flex-end;
  }

  .settings-grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: start;
  }

  .sticky-save-bar {
    bottom: 18px;
    grid-template-columns: 220px 160px;
    justify-content: end;
  }

  .bottom-nav {
    display: none;
  }

  .screen {
    padding-bottom: 34px;
  }
}

@media (min-width: 1080px) {
  .topbar {
    padding: 7px 28px 8px;
    border-bottom: 4px solid var(--red);
  }

  .topbar-inner {
    max-width: 1320px;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(560px, 680px);
    align-items: end;
    gap: 8px 16px;
  }

  .brand-row {
    grid-column: 1;
    grid-row: 1;
  }

  .brand-logo {
    width: 36px;
    height: 36px;
    border-radius: 9px;
  }

  .brand-title {
    font-size: 20px;
  }

  .brand-subtitle {
    font-size: 12px;
  }

  .shell-row {
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: 1fr;
    align-items: end;
    gap: 10px;
    margin-top: 0;
  }

  .top-nav {
    display: none;
  }

  .top-nav button,
  .nav-more-select select {
    min-height: 34px;
    border-radius: 4px 4px 0 0;
    border-color: rgba(255, 255, 255, 0.34);
    padding: 0 12px;
    font-size: 12px;
  }

  .control-row {
    width: min(680px, 100%);
    justify-self: end;
    grid-template-columns: minmax(190px, 1fr) minmax(190px, 1fr) minmax(180px, 0.8fr);
    gap: 6px;
  }

  .control-row label {
    gap: 3px;
    font-size: 10px;
    font-weight: 800;
  }

  .control-row select,
  .locked-select {
    min-height: 32px;
    border-radius: 5px;
    padding: 5px 9px;
    font-size: 12px;
  }

  .desktop-module-tabs {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0;
    margin-top: 7px;
    border: 2px solid rgba(255, 255, 255, 0.28);
    border-bottom: 0;
    background: rgba(255, 255, 255, 0.06);
  }

  .desktop-module-tabs button {
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 6px 10px;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.22);
    background: transparent;
    color: white;
    font-weight: 900;
  }

  .desktop-module-tabs button:last-child {
    border-right: 0;
  }

  .desktop-module-tabs button.active,
  .desktop-module-tabs button:hover {
    background: white;
    color: var(--ink);
  }

  .desktop-module-tabs b,
  .desktop-module-tabs span {
    display: block;
    min-width: 0;
  }

  .desktop-module-tabs b {
    font-size: 13px;
  }

  .desktop-module-tabs span {
    display: none;
  }

  .screen {
    max-width: 1320px;
    padding: 14px 30px 44px;
  }

  .screen-title {
    align-items: end;
    border-bottom: 3px solid var(--line);
    padding-bottom: 12px;
  }

  .screen-title h2 {
    font-size: 34px;
  }

  .dashboard-hero {
    display: none;
  }

  .desktop-control-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
    padding: 8px 12px;
    border: 2px solid var(--line);
    border-left: 7px solid var(--line);
    border-radius: 4px;
    background: white;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
  }

  .desktop-control-heading h2,
  .desktop-control-heading p {
    margin: 0;
  }

  .desktop-control-heading h2 {
    font-size: 18px;
    line-height: 1.1;
  }

  .desktop-control-heading span {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
  }

  .desktop-control-actions {
    display: grid;
    grid-template-columns: repeat(2, 128px);
    gap: 8px;
  }

  .desktop-control-actions .primary-button,
  .desktop-control-actions .secondary-button {
    min-height: 32px;
    font-size: 12px;
  }

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

  .desktop-focus-card {
    min-height: 76px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 10px;
    align-items: center;
    padding: 12px 14px;
    text-align: left;
    border: 2px solid var(--line);
    border-top: 6px solid var(--red);
    border-radius: 8px;
    background: white;
    color: var(--ink);
    box-shadow: 0 5px 14px rgba(15, 23, 42, 0.07);
  }

  .desktop-focus-card:nth-child(even) {
    border-top-color: var(--blue);
  }

  .desktop-focus-card span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
  }

  .desktop-focus-card b {
    grid-column: 2;
    grid-row: 1 / span 2;
    font-size: 28px;
    line-height: 1;
  }

  .desktop-focus-card small {
    color: var(--ink);
    font-size: 13px;
    font-weight: 900;
  }

  .dashboard-hero {
    grid-template-columns: minmax(0, 1fr) 250px;
    align-items: center;
    margin: 0 0 12px;
    padding: 12px 14px;
    border-radius: 4px;
    border-bottom-width: 4px;
  }

  .dashboard-hero h2 {
    font-size: 22px;
  }

  .dashboard-hero p {
    max-width: 760px;
    margin-top: 6px;
    font-size: 13px;
  }

  .hero-badges {
    margin-top: 8px;
  }

  .hero-badges span {
    min-height: 24px;
    padding: 2px 8px;
    font-size: 11px;
  }

  .hero-actions {
    gap: 8px;
  }

  .hero-actions .primary-button,
  .hero-actions .secondary-button {
    min-height: 38px;
  }

  .dashboard-stats {
    display: none;
  }

  .stat-card {
    min-height: 58px;
    padding: 10px 12px;
    border-radius: 4px;
    background: white;
  }

  .stat-card strong {
    font-size: 22px;
  }

  .stat-card span {
    margin-top: 3px;
    font-size: 12px;
  }

  .dashboard-workbench {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 0;
  }

  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    margin-top: 0;
  }

  .dashboard-actions-column {
    display: none;
  }

  .dashboard-actions-column .dash-action-section {
    margin-top: 0;
    padding: 10px;
    border: 2px solid var(--line);
    border-radius: 4px;
    background: white;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  }

  .dashboard-actions-column .dash-action-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .dashboard-actions-column .dash-action {
    min-height: 44px;
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
    padding: 8px 10px;
    border-radius: 4px;
    border-left: 6px solid var(--red);
    background: white;
    color: var(--ink);
  }

  .dashboard-actions-column .dash-action:nth-child(even) {
    border-left-color: var(--ink);
    background: white;
    color: var(--ink);
  }

  .dashboard-actions-column .dash-action b {
    font-size: 14px;
  }

  .dashboard-actions-column .dash-action span {
    color: var(--muted);
    font-size: 11px;
  }

  .dashboard-panel,
  .panel,
  .job-card,
  .task-card,
  .activity-card,
  .workspace-button {
    border-radius: 8px;
  }

  .home-screen .dashboard-panel {
    padding: 12px;
  }

  .home-screen .dashboard-panel .folder-head .small {
    display: none;
  }

  .home-screen .home-row {
    min-height: 60px;
    padding: 10px 12px;
    border-radius: 7px;
    border-left: 6px solid var(--red);
    background: white;
  }

  .home-screen .home-row:nth-child(even) {
    border-left-color: var(--blue);
  }

  .home-screen .home-row b {
    font-size: 14px;
  }

  .home-screen .home-row small,
  .home-screen .home-row em {
    font-size: 11px;
  }

  .home-screen .home-row em {
    color: var(--ink);
    text-align: right;
  }

  .jobs-screen .list,
  .tasks-screen .list,
  .activity-screen .list,
  .attention-screen .list {
    grid-template-columns: 1fr;
  }

  .jobs-screen .job-card-body {
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr) minmax(300px, 0.72fr);
    align-items: start;
    gap: 14px;
  }

  .jobs-screen .job-next-strip,
  .jobs-screen .job-meta,
  .jobs-screen .contact-row {
    margin: 0;
  }

  .jobs-screen .job-meta {
    align-self: stretch;
    padding: 10px;
    border: 2px solid var(--line);
    border-radius: 8px;
    background: #ffffff;
  }

  .jobs-screen .contact-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-self: start;
  }

  .tasks-screen .compact-task-card {
    display: grid;
    grid-template-columns: minmax(300px, 0.85fr) minmax(0, 1fr) minmax(250px, 0.48fr);
    gap: 14px;
    align-items: stretch;
  }

  .tasks-screen .compact-task-card .task-meta,
  .tasks-screen .compact-task-card .action-row {
    margin: 0;
  }

  .tasks-screen .compact-task-card .task-meta {
    align-self: stretch;
    padding: 10px;
    border: 2px solid var(--line);
    border-radius: 8px;
    background: #ffffff;
  }

  .tasks-screen .compact-task-card .action-row {
    align-self: center;
  }

  .task-detail-screen,
  .workspace-screen,
  .job-detail-screen {
    max-width: 1280px;
  }

  .job-detail-screen .detail-stack {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .job-detail-screen .job-detail-hero {
    height: fit-content;
  }

  .job-detail-screen .workspace-button {
    min-height: 58px;
    padding: 10px;
  }

  .job-detail-screen .workspace-button b {
    font-size: 15px;
  }

  .job-detail-screen .workspace-button span {
    font-size: 11px;
  }

  .task-detail-screen .task-focus {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.48fr);
    align-items: start;
  }

  .task-detail-screen .task-head,
  .task-detail-screen .task-context,
  .task-detail-screen .job-contact-bar,
  .task-detail-screen .reminder-response-box,
  .task-detail-screen .task-primary-actions {
    grid-column: 1 / -1;
  }

  .attention-card {
    grid-template-columns: minmax(300px, 0.95fr) minmax(0, 1fr);
    align-items: start;
  }

  .attention-card .task-head,
  .attention-card .action-row {
    grid-column: 1 / -1;
  }

  .reminder-send-box {
    margin-top: 0;
  }

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

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

/* v273 reusable subcontractor company database. */
.subcontractor-database-screen { gap: 16px; }
.subcontractor-database-toolbar { display: grid; grid-template-columns: minmax(320px, 1fr) auto; align-items: end; gap: 16px; }
.subcontractor-database-toolbar > label { display: grid; gap: 6px; }
.database-count { display: flex; align-items: baseline; gap: 7px; padding: 9px 12px; border: 1px solid var(--line); background: #fff; }
.database-count b { color: var(--brand-primary, #a50f17); font-size: 1.35rem; }
.database-count span { color: var(--muted); font-size: .76rem; }
.subcontractor-database-table-wrap { overflow-x: auto; border: 1px solid var(--line); background: #fff; }
.subcontractor-database-table { width: 100%; min-width: 1040px; border-collapse: collapse; }
.subcontractor-database-table th { padding: 10px 12px; border-right: 1px solid #d9dee5; background: #171a1f; color: #fff; font-size: .7rem; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.subcontractor-database-table td { padding: 11px 12px; border-top: 1px solid #d9dee5; border-right: 1px solid #e4e7eb; color: #1f2937; font-size: .82rem; vertical-align: top; }
.subcontractor-database-table tbody tr:nth-child(even) { background: #f7f8fa; }
.subcontractor-database-table td b,
.subcontractor-database-table td span,
.subcontractor-database-table td small { display: block; }
.subcontractor-database-table td small { margin-top: 3px; color: #5f6875; }
.subcontractor-database-editor { border-top: 2px solid var(--brand-primary, #a50f17); }
.subcontractor-editor-actions { display: flex; justify-content: flex-end; gap: 10px; }
.missing-material-review { border: 1px solid #d7ad3f; border-left: 4px solid #d7ad3f; background: #fffdf5; }
.missing-material-review > .workflow-section-heading { padding: 12px 14px; border-bottom: 1px solid #ead9a6; }
.missing-material-grid { display: grid; gap: 0; }
.missing-material-grid article { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(160px, .35fr) minmax(160px, .3fr); gap: 14px; align-items: end; padding: 11px 14px; border-top: 1px solid #eee2bf; }
.missing-material-grid article:first-child { border-top: 0; }
.missing-material-grid article > div b,
.missing-material-grid article > div small,
.missing-material-grid article > div span { display: block; }
.missing-material-grid article > div small { margin: 3px 0; color: #667085; }
.missing-material-grid article > label:not(.toggle-line) { display: grid; gap: 5px; font-size: .75rem; font-weight: 800; text-transform: uppercase; }
@media (max-width: 760px) {
  .subcontractor-database-toolbar { grid-template-columns: 1fr; }
  .database-count { justify-content: center; }
  .missing-material-grid article { grid-template-columns: 1fr; align-items: stretch; }
}

@media (min-width: 1080px) {
  .app-shell {
    display: grid;
    grid-template-columns: 304px minmax(0, 1fr);
    align-items: start;
    min-height: 100vh;
    max-width: 100vw;
    overflow-x: hidden;
    background: #f3f4f6;
  }

  .app-content {
    min-width: 0;
    overflow-x: hidden;
    padding: 18px 26px 44px;
  }

  .topbar {
    position: sticky;
    top: 0;
    align-self: start;
    height: 100vh;
    overflow-y: auto;
    padding: 18px 18px;
    border-right: 2px solid var(--line);
    border-bottom: 0;
    background: #111114;
  }

  .topbar-inner {
    display: grid;
    grid-template-columns: 1fr;
    align-content: start;
    gap: 16px;
    max-width: none;
  }

  .brand-row {
    display: grid;
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 9px;
    text-align: center;
  }

  .brand-row > div {
    display: grid;
    justify-items: center;
  }

  .brand-logo {
    width: 142px;
    height: auto;
    max-height: 96px;
    border: 0;
    border-radius: 0;
    object-fit: contain;
  }

  .brand-title {
    display: none;
  }

  .brand-subtitle {
    color: rgba(255, 255, 255, 0.78);
    font-size: 12.5px;
    font-weight: 750;
  }

  .access-pill,
  .access-pill.programming,
  .logout-button {
    width: 100%;
    justify-content: center;
  }

  .shell-row {
    display: grid;
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 0;
  }

  .top-nav,
  .bottom-nav {
    display: none;
  }

  .control-row {
    width: 100%;
    grid-template-columns: 1fr;
    justify-self: stretch;
    gap: 12px;
  }

  .control-row label {
    gap: 5px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 11px;
    font-weight: 850;
  }

  .control-row select,
  .locked-select {
    width: 100%;
    min-height: 40px;
    border: 2px solid var(--line);
    border-radius: 6px;
    background: #ffffff;
    color: var(--ink);
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.25;
  }

  .control-row .map-provider-control {
    display: none !important;
  }

  .desktop-module-tabs {
    display: grid;
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 0;
    border: 0;
    background: transparent;
  }

  .desktop-module-tabs button {
    min-height: 44px;
    justify-content: flex-start;
    padding: 9px 12px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-left: 7px solid var(--red);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    text-align: left;
    box-shadow: none;
  }

  .desktop-module-tabs button.active,
  .desktop-module-tabs button:hover {
    background: #ffffff;
    color: var(--ink);
  }

  .desktop-brand-banner {
    min-height: 118px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0 0 14px;
    padding: 12px 16px;
    border: 2px solid var(--line);
    border-top: 4px solid var(--red);
    border-bottom: 4px solid var(--red);
    border-radius: 10px;
    background: linear-gradient(180deg, #111114 0%, #111114 74%);
    color: #ffffff;
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 10px 24px rgba(17, 24, 39, 0.12);
  }

  .desktop-brand-logo {
    width: 132px;
    max-width: 46vw;
    height: auto;
    object-fit: contain;
  }

  .desktop-brand-subtitle {
    display: inline-block;
    margin-top: 6px;
    padding: 4px 12px;
    border-top: 1px solid rgba(var(--primary-rgb), 0.9);
    color: #f3f4f6;
    font-size: 13px;
    font-weight: 750;
  }

  .screen {
    max-width: none;
    padding: 0;
  }

  .home-screen > .dashboard-hero,
  .home-screen > .desktop-control-heading,
  .home-screen > .desktop-focus-strip,
  .home-screen > .dashboard-stats,
  .home-screen > .dashboard-workbench {
    display: none;
  }

  .streamlit-desktop-home {
    display: block;
  }

  .streamlit-page-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    margin: 0 0 12px;
  }

  .streamlit-page-heading h2 {
    margin: 0;
    color: var(--ink);
    font-size: 26px;
    line-height: 1.1;
  }

  .desktop-role-note {
    max-width: 760px;
    margin: 6px 0 0;
    color: #4b5563;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.35;
  }

  .streamlit-page-actions {
    display: grid;
    grid-template-columns: repeat(2, 140px);
    gap: 8px;
  }

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

  .streamlit-metric-card {
    min-height: 92px;
    padding: 14px;
    text-align: left;
    border: 2px solid var(--line);
    border-left: 7px solid var(--red);
    border-radius: 6px;
    background: #ffffff;
    color: var(--ink);
    box-shadow: 0 7px 16px rgba(17, 24, 39, 0.06);
  }

  .streamlit-metric-card.active {
    box-shadow: 0 0 0 2px rgba(17, 24, 39, 0.22), 0 10px 22px rgba(17, 24, 39, 0.08);
  }

  .streamlit-metric-card b {
    display: block;
    color: var(--ink);
    font-size: 15px;
    font-weight: 950;
  }

  .streamlit-metric-card h3 {
    margin: 5px 0 0;
    color: var(--red-dark);
    font-size: 34px;
    line-height: 1;
  }

  .streamlit-detail-panel {
    padding: 16px;
    border: 2px solid var(--line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(17, 24, 39, 0.06);
  }

  .streamlit-detail-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
  }

  .streamlit-detail-head h3,
  .streamlit-detail-head p {
    margin: 0;
  }

  .streamlit-detail-head h3 {
    color: var(--ink);
    font-size: 22px;
  }

  .streamlit-detail-head p {
    margin-top: 3px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
  }

  .streamlit-job-board {
    display: grid;
    gap: 10px;
  }

  .streamlit-job-row {
    display: grid;
    grid-template-columns: minmax(230px, 2.2fr) minmax(108px, 0.74fr) minmax(200px, 1.3fr) minmax(158px, 0.72fr);
    gap: 12px;
    align-items: center;
    padding: 16px 18px;
    border: 2px solid var(--line);
    border-left: 7px solid var(--red);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 7px 16px rgba(17, 24, 39, 0.055);
  }

  .streamlit-job-row.alt {
    background: #fafafa;
  }

  .streamlit-job-main h4 {
    margin: 0;
    color: #050505;
    font-size: 18px;
    line-height: 1.15;
  }

  .streamlit-job-main p {
    margin: 5px 0 0;
    color: #374151;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
  }

  .streamlit-row-label,
  .streamlit-next-box span {
    display: block;
    margin-bottom: 5px;
    color: #6b7280;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .streamlit-row-value {
    color: var(--ink);
    font-size: 15px;
    line-height: 1.25;
  }

  .streamlit-next-box {
    min-height: 64px;
    padding: 10px 12px;
    border: 2px solid var(--line);
    border-left: 6px solid var(--red);
    border-radius: 8px;
    background: rgba(var(--primary-rgb), 0.07);
  }

  .streamlit-next-box b {
    color: var(--ink);
    font-size: 14px;
    line-height: 1.2;
  }

  .streamlit-row-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .streamlit-row-actions .primary-button,
  .streamlit-row-actions .secondary-button {
    min-height: 34px;
    font-size: 12px;
  }
}

@media (min-width: 1080px) {
  :root {
    --desktop-radius: 3px;
    --desktop-soft-shadow: 0 3px 10px rgba(17, 24, 39, 0.055);
    --desktop-panel-border: 2px solid var(--line);
  }

  body {
    background: var(--canvas);
  }

  .app-shell {
    background: var(--canvas);
  }

  .app-content {
    background:
      linear-gradient(180deg, var(--canvas) 0%, #f5f7fa 240px, var(--canvas) 100%);
    padding: 22px 30px 46px;
  }

  .topbar {
    background: var(--sidebar);
    border-right: 2px solid #050505;
  }

  .control-row select,
  .locked-select,
  .logout-button,
  .top-nav button,
  .nav-more-select select,
  .primary-button,
  .secondary-button,
  .danger-button,
  .back-button,
  .contact-button,
  .mini-button,
  .nav-button,
  .filter-pill,
  .hero-badges span,
  .access-pill,
  .access-pill.programming {
    border-radius: var(--desktop-radius);
  }

  .control-row select,
  .locked-select {
    background: #f7f9fc;
    border-color: #101114;
  }

  .primary-button,
  .secondary-button,
  .danger-button,
  .back-button,
  .contact-button,
  .mini-button,
  .nav-button {
    min-height: 36px;
    padding: 7px 12px;
    border-width: 2px;
    box-shadow: none;
  }

  .primary-button:hover,
  .secondary-button:hover,
  .danger-button:hover,
  .back-button:hover,
  .contact-button:hover,
  .mini-button:hover,
  .nav-button:hover {
    filter: brightness(0.97);
  }

  .desktop-module-tabs {
    gap: 6px;
  }

  .desktop-module-tabs button {
    min-height: 40px;
    border-radius: var(--desktop-radius);
    border-left-width: 5px;
    border-color: rgba(255, 255, 255, 0.42);
    box-shadow: none;
    background: rgba(255, 255, 255, 0.09);
  }

  .desktop-module-tabs button.active,
  .desktop-module-tabs button:hover {
    background: #f8fafc;
    border-color: #f8fafc;
    border-left-color: var(--accent-gold);
    color: var(--ink);
  }

  .desktop-brand-banner {
    min-height: 84px;
    border-top-color: var(--accent-gold);
    border-bottom-color: var(--accent-gold);
    border-radius: var(--desktop-radius);
    background: var(--sidebar-panel);
    box-shadow: var(--desktop-soft-shadow);
  }

  .desktop-brand-logo {
    width: 112px;
  }

  .dashboard-hero,
  .desktop-control-heading,
  .desktop-focus-card,
  .dashboard-panel,
  .panel,
  .job-card,
  .task-card,
  .activity-card,
  .workspace-button,
  .toolbar,
  .notice,
  .mode-banner,
  .calendar-panel,
  .field-job-card,
  .settings-panel,
  .settings-role-card,
  .theme-preset-panel,
  .theme-preset-button,
  .sticky-save-bar,
  .accounting-banner,
  .accounting-banner div,
  .accounting-week,
  .tier-block,
  .finance-row,
  .finance-schedule,
  .accounting-add-ar,
  .approvals-panel,
  .approval-summary div,
  .compact-task-card,
  .compact-job-card,
  .polished-job-card,
  .job-detail-hero,
  .next-process-panel,
  .next-task-card,
  .more-tools-panel,
  .quick-panel,
  .workspace-panel,
  .workspace-hero,
  .job-workspace-panel,
  .purchase-card-row,
  .purchase-card-ticket,
  .attention-card,
  .folder-card,
  .gate-card,
  .customer-form-card,
  .customer-forms-panel,
  .customer-form-panel,
  .file-send-panel,
  .streamlit-metric-card,
  .streamlit-detail-panel,
  .streamlit-job-row,
  .streamlit-next-box,
  .home-screen .home-row,
  .jobs-screen .job-meta,
  .tasks-screen .compact-task-card .task-meta {
    border-radius: var(--desktop-radius) !important;
    box-shadow: var(--desktop-soft-shadow);
  }

  .dashboard-panel,
  .panel,
  .job-card,
  .task-card,
  .activity-card,
  .workspace-button,
  .toolbar,
  .calendar-panel,
  .field-job-card,
  .settings-panel,
  .settings-role-card,
  .theme-preset-panel,
  .accounting-week,
  .tier-block,
  .finance-row,
  .approvals-panel,
  .compact-task-card,
  .compact-job-card,
  .polished-job-card,
  .job-detail-hero,
  .next-process-panel,
  .next-task-card,
  .more-tools-panel,
  .quick-panel,
  .workspace-panel,
  .workspace-hero,
  .job-workspace-panel,
  .purchase-card-row,
  .attention-card,
  .folder-card,
  .gate-card,
  .customer-form-card,
  .customer-forms-panel,
  .file-send-panel {
    background: var(--surface);
  }

  .theme-preset-panel {
    background: var(--surface-warm);
  }

  .theme-preset-button {
    background: var(--surface);
  }

  .theme-preset-button:hover {
    background: #eef4fb;
    box-shadow: 0 0 0 1px rgba(5, 5, 5, 0.25);
  }

  .notice,
  .mode-banner,
  .streamlit-detail-panel,
  .accounting-banner,
  .sticky-save-bar {
    background: var(--surface-alt);
  }

  .streamlit-page-heading {
    padding-bottom: 12px;
    border-bottom: 2px solid var(--line);
    background: var(--surface-alt);
    margin: 0 0 14px;
    padding: 13px 14px;
    border: 2px solid var(--line);
    border-left: 5px solid var(--accent-blue);
  }

  .streamlit-page-heading h2 {
    font-size: 24px;
    font-weight: 900;
  }

  .desktop-role-note {
    color: #4b5563;
    font-size: 12.5px;
    font-weight: 700;
  }

  .streamlit-metric-grid {
    gap: 10px;
  }

  .streamlit-metric-card {
    min-height: 82px;
    padding: 12px;
    border-left-width: 5px;
    background: var(--surface);
  }

  .streamlit-metric-card:nth-child(2n) {
    border-left-color: var(--accent-blue);
    background: #f7f9fc;
  }

  .streamlit-metric-card:nth-child(3n) {
    border-left-color: var(--accent-gold);
    background: var(--surface-warm);
  }

  .streamlit-metric-card h3 {
    color: var(--ink);
    font-size: 30px;
  }

  .streamlit-metric-card.active {
    background: #eef4fb;
    box-shadow: inset 0 0 0 1px var(--line), var(--desktop-soft-shadow);
  }

  .streamlit-detail-panel {
    padding: 14px;
    background: var(--surface-alt);
  }

  .streamlit-detail-head {
    padding-bottom: 10px;
    border-bottom: 2px solid var(--line);
  }

  .streamlit-detail-head h3 {
    font-size: 20px;
  }

  .streamlit-job-board {
    gap: 8px;
  }

  .streamlit-job-row {
    padding: 13px 14px;
    border-left-width: 5px;
    background: var(--surface);
  }

  .streamlit-job-row.alt {
    background: #f7f9fc;
  }

  .streamlit-next-box {
    min-height: 58px;
    border-left-width: 4px;
    background: #eef4fb;
  }

  .job-card,
  .task-card,
  .activity-card,
  .panel,
  .dashboard-panel,
  .workspace-button {
    border: var(--desktop-panel-border);
    background: var(--surface);
  }

  .primary-button {
    background: var(--red);
  }

  .secondary-button,
  .mini-button,
  .contact-button,
  .back-button {
    background: #eef4fb;
  }

  .job-card:hover,
  .task-card:hover,
  .activity-card:hover,
  .workspace-button:hover,
  .streamlit-metric-card:hover,
  .streamlit-job-row:hover {
    transform: none;
    box-shadow: 0 0 0 1px rgba(5, 5, 5, 0.25), var(--desktop-soft-shadow);
  }
}

@media (min-width: 1080px) {
  body,
  .app-shell {
    background: var(--canvas) !important;
  }

  .app-content {
    background:
      linear-gradient(180deg, rgba(204, 216, 230, 0.9) 0, rgba(223, 231, 240, 0.94) 220px, var(--canvas) 100%) !important;
  }

  .streamlit-page-heading,
  .screen-title,
  .toolbar,
  .dashboard-panel,
  .panel,
  .job-card,
  .task-card,
  .activity-card,
  .workspace-button,
  .calendar-panel,
  .field-job-card,
  .settings-panel,
  .settings-role-card,
  .accounting-week,
  .approvals-panel,
  .compact-task-card,
  .compact-job-card,
  .polished-job-card,
  .job-detail-hero,
  .next-process-panel,
  .next-task-card,
  .workspace-panel,
  .workspace-hero,
  .job-workspace-panel,
  .purchase-card-row,
  .attention-card,
  .folder-card,
  .gate-card,
  .customer-forms-panel,
  .file-send-panel {
    background: var(--surface) !important;
  }

  .streamlit-detail-panel,
  .accounting-banner,
  .sticky-save-bar,
  .more-tools-panel,
  .quick-panel {
    background: var(--surface-alt) !important;
  }

  .streamlit-metric-card,
  .finance-row,
  .streamlit-job-row,
  .home-screen .home-row {
    background: #f7f9fc !important;
  }

  .streamlit-metric-card:nth-child(3n),
  .tier-block.tier-2,
  .theme-preset-panel {
    background: var(--surface-warm) !important;
  }

  .streamlit-job-row.alt,
  .job-card:nth-child(even),
  .task-card:nth-child(even),
  .activity-card:nth-child(even) {
    background: #edf3f9 !important;
  }

  .streamlit-next-box,
  .jobs-screen .job-meta,
  .tasks-screen .compact-task-card .task-meta,
  .finance-schedule,
  .tier-block {
    background: #eaf1f8 !important;
  }

  .topbar {
    background:
      linear-gradient(180deg, var(--sidebar) 0%, #314155 100%) !important;
  }

  .desktop-module-tabs button {
    background: rgba(255, 255, 255, 0.13) !important;
  }

  .desktop-module-tabs button.active,
  .desktop-module-tabs button:hover {
    background: #f4f7fb !important;
  }
}

/* Sleek square system layer: keeps the app tappable without making every screen feel bubbly. */
:root {
  --square-radius: 6px;
  --square-radius-tight: 3px;
  --professional-panel: #fbf6eb;
  --professional-panel-alt: #eef4fb;
  --professional-band: #f1e7d4;
  --professional-clean: #fffdf7;
}

.screen {
  max-width: 1240px;
}

.screen-title {
  padding: 12px 14px;
  border: 2px solid var(--line);
  border-left: 6px solid var(--red);
  border-radius: var(--square-radius);
  background: linear-gradient(180deg, #ffffff, var(--professional-panel));
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.055);
}

.screen-title .eyebrow {
  margin: 0 0 3px;
}

.stat-card,
.job-card,
.task-card,
.activity-card,
.panel,
.dashboard-panel,
.toolbar,
.home-row,
.dash-action,
.workspace-button,
.calendar-panel,
.field-job-card,
.settings-panel,
.settings-role-card,
.theme-preset-panel,
.accounting-week,
.tier-block,
.finance-row,
.approvals-panel,
.compact-task-card,
.compact-job-card,
.polished-job-card,
.job-detail-hero,
.next-process-panel,
.next-task-card,
.more-tools-panel,
.quick-panel,
.workspace-panel,
.workspace-hero,
.job-workspace-panel,
.purchase-card-row,
.purchase-card-ticket,
.attention-card,
.folder-card,
.gate-card,
.customer-form-card,
.customer-forms-panel,
.customer-form-panel,
.file-send-panel,
.streamlit-metric-card,
.streamlit-detail-panel,
.streamlit-job-row,
.streamlit-next-box,
.notice,
.mode-banner,
.location-capture {
  border-radius: var(--square-radius) !important;
}

.primary-button,
.secondary-button,
.danger-button,
.back-button,
.contact-button,
.mini-button,
.nav-button,
.filter-pill,
.badge,
.access-pill,
.locked-select,
.control-row select,
.form-grid input,
.form-grid select,
.form-grid textarea,
input,
select,
textarea {
  border-radius: var(--square-radius-tight) !important;
}

.dashboard-panel,
.panel,
.job-card,
.task-card,
.activity-card,
.workspace-button,
.home-row,
.streamlit-job-row,
.compact-job-card,
.compact-task-card {
  background: var(--professional-panel);
}

.job-card:nth-child(even),
.task-card:nth-child(even),
.activity-card:nth-child(even),
.home-row:nth-child(even),
.streamlit-job-row.alt {
  background: var(--professional-panel-alt);
}

.primary-button {
  border: 2px solid var(--line);
  background: var(--red);
  color: white;
}

.secondary-button,
.back-button,
.mini-button,
.contact-button,
.nav-button {
  border: 2px solid var(--line);
  background: #eef4fb;
  color: var(--ink);
}

.sales-intake-screen .screen-title {
  align-items: flex-start;
}

.sales-intake-shell {
  display: grid;
  gap: 14px;
}

.sales-intake-summary,
.sales-form-section,
.sales-submit-panel {
  border: 2px solid var(--line);
  border-radius: var(--square-radius);
  background: var(--professional-clean);
  box-shadow: 0 5px 16px rgba(15, 23, 42, 0.07);
}

.sales-intake-summary {
  display: grid;
  gap: 14px;
  padding: 14px;
  align-content: start;
  border-top: 5px solid var(--accent-gold);
  background: linear-gradient(180deg, var(--professional-clean), var(--professional-panel));
}

.sales-intake-summary h3 {
  margin: 0;
  font-size: 22px;
  line-height: 1.12;
}

.sales-progress {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: var(--square-radius-tight);
  background: var(--professional-band);
}

.sales-progress > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-weight: 900;
}

.sales-progress span {
  color: var(--muted);
  font-size: 12px;
}

.sales-progress-bar {
  height: 12px;
  overflow: hidden;
  border: 2px solid var(--line);
  border-radius: var(--square-radius-tight);
  background: white;
}

.sales-progress-bar span {
  display: block;
  height: 100%;
  min-width: 4px;
  background: linear-gradient(90deg, var(--red), var(--accent-gold));
}

.sales-summary-list {
  display: grid;
  gap: 8px;
}

.sales-summary-item {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 2px solid var(--line);
  border-left: 5px solid var(--red);
  border-radius: var(--square-radius-tight);
  background: var(--professional-clean);
}

.sales-summary-item.ready {
  border-left-color: var(--green);
}

.sales-summary-item b {
  color: var(--ink);
  font-size: 12px;
  text-transform: uppercase;
}

.sales-summary-item span,
.sales-location-readout {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.sales-form-stack {
  display: grid;
  gap: 14px;
}

.sales-form-section {
  overflow: hidden;
}

.sales-form-section-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 13px 14px;
  border-bottom: 2px solid var(--line);
  background: var(--professional-band);
}

.sales-form-section-head h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
}

.sales-form-section-head p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}

.sales-step {
  display: inline-grid;
  place-items: center;
  min-width: 38px;
  height: 34px;
  border: 2px solid var(--line);
  border-radius: var(--square-radius-tight);
  background: var(--red);
  color: white;
  font-size: 13px;
  font-weight: 900;
}

.sales-form-grid {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.sales-form-grid label {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}

.sales-form-grid label small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
}

.sales-form-grid input,
.sales-form-grid textarea {
  min-height: 46px;
  border: 2px solid var(--line);
  border-radius: var(--square-radius-tight);
  background: var(--professional-clean);
  color: var(--ink);
  padding: 10px 11px;
  font-weight: 700;
}

.sales-form-grid textarea {
  min-height: 102px;
  resize: vertical;
}

.sales-form-grid .wide {
  grid-column: 1 / -1;
}

.sales-form-grid .required-missing input,
.sales-form-grid .required-missing textarea {
  border-left-width: 5px;
  border-left-color: #d97706;
  background: #fffaf0;
}

.sales-submit-panel {
  display: grid;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border-top: 5px solid var(--red);
  background: linear-gradient(180deg, var(--professional-clean), var(--professional-panel));
}

.sales-submit-panel b,
.sales-submit-panel p {
  margin: 0;
}

.sales-submit-panel p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}

.enterprise-intake-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.enterprise-intake-actions .secondary-button {
  min-height: 42px;
  border-radius: var(--square-radius-tight);
}

.enterprise-intake-actions .tax-document-browse-button {
  background: var(--red);
  color: #ffffff;
}

.enterprise-intake-actions .secondary-button:not(.tax-document-browse-button) {
  background: #1f425f;
  color: #ffffff;
}

.new-sale-quick-fill-box {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 2px solid var(--line);
  border-left: 6px solid var(--accent-gold);
  border-radius: var(--square-radius);
  background: linear-gradient(180deg, var(--professional-clean), var(--professional-panel));
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
}

.quick-fill-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.quick-fill-head h3,
.quick-fill-head p {
  margin: 0;
}

.quick-fill-head h3 {
  font-size: 20px;
  line-height: 1.15;
}

.quick-fill-head .small {
  margin-top: 4px;
  color: var(--muted);
  font-weight: 800;
}

.quick-fill-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.quick-fill-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: var(--square-radius-tight);
  font-size: 12px;
  font-weight: 900;
}

.quick-fill-chip.needed {
  background: #fff7ed;
  color: #7c2d12;
}

.quick-fill-chip.ready {
  background: #ecfdf3;
  color: #14532d;
}

.quick-fill-grid {
  display: grid;
  gap: 11px 12px;
}

.quick-fill-field {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}

.quick-fill-field span {
  line-height: 1.2;
}

.quick-fill-field input,
.quick-fill-field select,
.quick-fill-field textarea {
  min-height: 42px;
  width: 100%;
  border: 2px solid var(--line);
  border-radius: var(--square-radius-tight);
  background: #ffffff;
  color: var(--ink);
  padding: 9px 10px;
  font-weight: 750;
}

.quick-fill-field textarea {
  min-height: 82px;
  resize: vertical;
}

.quick-fill-field.required-missing input,
.quick-fill-field.required-missing select,
.quick-fill-field.required-missing textarea {
  border-left: 5px solid #d97706;
  background: #fffaf0;
}

.quick-fill-field input:focus,
.quick-fill-field select:focus,
.quick-fill-field textarea:focus {
  border-color: var(--crm-primary);
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.16);
  outline: none;
}

.quick-fill-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

@media (min-width: 760px) {
  .sales-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .quick-fill-field.wide {
    grid-column: 1 / -1;
  }

  .sales-submit-panel {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (min-width: 1080px) {
  :root {
    --square-radius: 3px;
    --square-radius-tight: 2px;
  }

  .sales-intake-shell {
    grid-template-columns: 320px minmax(0, 1fr);
    align-items: start;
  }

  .sales-intake-summary {
    position: sticky;
    top: 24px;
  }

  .dashboard-hero,
  .job-detail-hero,
  .workspace-hero {
    border-bottom-width: 4px;
  }
}

/* Beige header/sidebar test for Elite red + black line palette. */
.topbar {
  background:
    linear-gradient(180deg, var(--professional-clean) 0%, var(--professional-panel) 58%, var(--professional-band) 100%) !important;
  color: var(--ink) !important;
  border-bottom: 4px solid var(--red) !important;
}

.brand-logo {
  border-color: var(--line) !important;
  background: var(--professional-clean);
}

.brand-title,
.brand-subtitle,
.control-row label,
.nav-more-select {
  color: var(--ink) !important;
}

.brand-subtitle,
.nav-more-select {
  opacity: 0.82;
}

.access-pill,
.access-pill.programming {
  border-color: var(--line) !important;
  background: var(--professional-clean) !important;
  color: var(--ink) !important;
}

.logout-button {
  border: 2px solid var(--line) !important;
  background: var(--red) !important;
  color: #ffffff !important;
}

.top-nav button,
.nav-more-select select,
.control-row select,
.locked-select {
  border: 2px solid var(--line) !important;
  background: var(--professional-clean) !important;
  color: var(--ink) !important;
}

.top-nav button.active,
.desktop-more.active select {
  background: var(--red) !important;
  color: #ffffff !important;
}

.desktop-module-tabs {
  border-color: var(--line) !important;
  background: var(--professional-band) !important;
}

.desktop-module-tabs button {
  border-color: var(--line) !important;
  border-left-color: var(--red) !important;
  background: var(--professional-clean) !important;
  color: var(--ink) !important;
}

.desktop-module-tabs button.active,
.desktop-module-tabs button:hover {
  background: var(--red) !important;
  color: #ffffff !important;
}

.desktop-brand-banner {
  background:
    linear-gradient(180deg, var(--professional-clean) 0%, var(--professional-band) 100%) !important;
  color: var(--ink) !important;
}

.desktop-brand-subtitle {
  border-top-color: var(--red) !important;
  color: var(--ink) !important;
}

@media (min-width: 1080px) {
  .topbar {
    border-right: 2px solid var(--line) !important;
    border-bottom: 0 !important;
  }
}

/* Make the beige header/sidebar feel attached to the frame instead of floating. */
.topbar {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.topbar-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

@media (max-width: 1079px) {
  .topbar {
    left: 0;
    right: 0;
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
  }
}

/* v129 app-only home consolidation. Desktop layout intentionally unchanged. */
.app-shell.app-mode {
  max-height: 100svh;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden;
}

.app-shell.app-mode .mobile-app-header,
.app-shell.app-mode .topbar,
.app-shell.app-mode .app-global-action-bar,
.app-shell.app-mode .app-content {
  grid-column: 1 !important;
}

.app-shell.app-mode .app-workflow-rail {
  display: none !important;
}

.app-shell.app-mode .app-global-action-bar {
  position: relative;
  top: auto;
  z-index: 70;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 10px;
  border-bottom: 1px solid #cfd5dc;
  background: #ffffff;
}

.app-dot-menu-button {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  border: 1px solid #aeb6c0;
  border-radius: 18px;
  background: #ffffff;
  color: #303945;
  box-shadow: none;
  font-size: 11px;
  font-weight: 650;
  cursor: pointer;
}

.app-dot-menu-button.active {
  border-color: #8f1523;
  background: #fff6f7;
  color: #8f1523;
}

.app-dot-menu-mark {
  width: 16px;
  height: 16px;
  display: grid;
  grid-template-columns: repeat(2, 5px);
  grid-template-rows: repeat(2, 5px);
  place-content: center;
  gap: 3px;
}

.app-dot-menu-mark i {
  width: 5px;
  height: 5px;
  display: block;
  border-radius: 50%;
  background: currentColor;
}

.app-start-sale-button {
  min-height: 34px !important;
  padding: 6px 13px !important;
  white-space: nowrap;
}

.app-dot-menu-panel {
  position: absolute;
  top: calc(100% + 4px);
  left: 8px;
  z-index: 90;
  width: min(360px, calc(100vw - 16px));
  max-height: min(58svh, 430px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow-y: auto;
  padding: 1px;
  border: 1px solid #aeb6c0;
  border-radius: 8px;
  background: #d7dce2;
  box-shadow: 0 16px 34px rgba(23, 33, 43, .22);
}

.app-dot-menu-panel button {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border: 0;
  border-radius: 0;
  background: #ffffff;
  color: #202932;
  text-align: left;
  box-shadow: none;
}

.app-dot-menu-panel button:hover,
.app-dot-menu-panel button:focus-visible {
  background: #fff5f6;
  color: #8f1523;
}

.app-dot-menu-panel button b {
  font-size: 11px;
  line-height: 1.15;
}

.app-dot-menu-panel button span {
  min-width: 22px;
  padding: 2px 5px;
  border-radius: 10px;
  background: #eef1f4;
  font-size: 9px;
  text-align: center;
}

.app-shell.app-mode:not(.mobile-inner-page) .app-content {
  grid-row: 3 !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
}

.app-shell.app-mode:not(.mobile-inner-page) .mobile-command-hub {
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 8px !important;
  overflow: hidden;
}

.app-shell.app-mode .app-unified-module-grid {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(42px, 1fr);
  gap: 6px;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row,
.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row:last-child {
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border: 1px solid #cfd5dc;
  border-left: 3px solid var(--brand-primary, #a50f17);
  border-radius: 5px;
  background: #ffffff;
  overflow: hidden;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-order,
.app-shell.app-mode .app-unified-module-grid .mobile-module-copy small,
.app-shell.app-mode .app-unified-module-grid .mobile-module-open {
  display: none !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-icon {
  width: 30px !important;
  height: 30px !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-copy,
.app-shell.app-mode .app-unified-module-grid .mobile-module-copy b {
  min-width: 0;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-copy b {
  display: -webkit-box;
  overflow: hidden;
  color: #202932;
  font-size: clamp(10px, 3.3vw, 13px) !important;
  line-height: 1.1;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.app-shell.app-mode .gpt-float-button {
  z-index: 85 !important;
  pointer-events: auto !important;
}

@media (min-width: 620px) {
  .app-shell.app-mode .app-unified-module-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-height: 700px) {
  .app-shell.app-mode .app-unified-module-grid { gap: 4px; }
  .app-shell.app-mode:not(.mobile-inner-page) .mobile-command-hub { padding: 5px !important; }
  .app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row { padding: 4px 6px; }
  .app-shell.app-mode .app-unified-module-grid .mobile-module-icon { width: 26px !important; height: 26px !important; }
}

@media (min-width: 1080px) {
  .app-shell {
    grid-template-columns: 304px minmax(0, 1fr);
    align-items: stretch !important;
    background: var(--professional-band) !important;
  }

  .topbar {
    width: 304px !important;
    height: 100vh !important;
    min-height: 100vh !important;
    padding: 0 !important;
  }

  .topbar-inner {
    min-height: 100vh;
    padding: 18px !important;
    background:
      linear-gradient(180deg, var(--professional-clean) 0%, var(--professional-panel) 58%, var(--professional-band) 100%);
  }

  .app-content {
    padding-top: 0 !important;
  }

  .screen {
    padding-top: 18px;
  }
}

/* Keep workflow tabs boxed cleanly; the Closeout tab should not lose its right edge. */
.desktop-module-tabs {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.desktop-module-tabs button {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

.desktop-module-tabs button:last-child {
  border-right: 2px solid var(--line) !important;
}

@media (min-width: 1080px) {
  .desktop-module-tabs button:last-child {
    border-right: 2px solid var(--line) !important;
  }
}

@media (min-width: 1080px) {
  .app-shell {
    position: relative;
    isolation: isolate;
  }

  .app-shell::before {
    content: "";
    position: fixed;
    inset: 0 auto 0 0;
    width: 304px;
    background:
      linear-gradient(180deg, var(--professional-clean) 0%, var(--professional-panel) 58%, var(--professional-band) 100%);
    border-right: 2px solid var(--line);
    pointer-events: none;
    z-index: 0;
  }

  .topbar {
    position: sticky;
    z-index: 2;
    background: transparent !important;
    border-right: 0 !important;
  }

  .topbar-inner {
    position: relative;
    z-index: 1;
    background: transparent !important;
  }

  .app-content {
    position: relative;
    z-index: 1;
  }
}

/* Refined CRM/dashboard test layer. */
:root {
  --crm-bg: #f4f5f7;
  --crm-card: #ffffff;
  --crm-card-alt: #f8f9fa;
  --crm-border: #e2e8f0;
  --crm-border-strong: #cbd5e1;
  --crm-ink: #1a202c;
  --crm-muted: #4a5568;
  --crm-primary: var(--brand-primary, #a50f17);
  --crm-primary-dark: var(--brand-primary-dark, #71080e);
  --crm-amber: #b7791f;
  --crm-red: #b91c1c;
  --crm-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  --crm-shadow-soft: 0 2px 8px rgba(15, 23, 42, 0.045);
}

html,
body {
  background: var(--crm-bg) !important;
  color: var(--crm-ink);
  font-family: Inter, Roboto, "Segoe UI", Arial, Helvetica, sans-serif;
}

.app-shell,
.app-content {
  background: var(--crm-bg) !important;
}

.app-shell::before {
  background: var(--crm-card) !important;
  border-right: 1px solid var(--crm-border) !important;
}

.topbar,
.topbar-inner {
  background: var(--crm-card) !important;
}

.topbar {
  border-color: var(--crm-border) !important;
  box-shadow: none !important;
}

.brand-logo {
  border: 1px solid var(--crm-border) !important;
  border-radius: 10px !important;
}

.brand-title {
  display: block !important;
  color: var(--crm-ink) !important;
  font-size: 17px !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
}

.brand-subtitle,
.desktop-role-note,
.small,
.streamlit-detail-head p,
.streamlit-job-main p,
.job-meta,
.task-meta,
.home-row small {
  color: var(--crm-muted) !important;
}

.desktop-brand-banner {
  display: none !important;
}

.access-pill,
.access-pill.programming,
.locked-select,
.control-row select,
.nav-more-select select {
  min-height: 38px !important;
  border: 1px solid var(--crm-border) !important;
  border-radius: 8px !important;
  background: var(--crm-card-alt) !important;
  color: var(--crm-ink) !important;
  box-shadow: none !important;
  appearance: auto;
}

.control-row label,
.nav-more-select {
  color: var(--crm-muted) !important;
  font-size: 11px !important;
  font-weight: 750 !important;
}

.desktop-module-tabs {
  display: grid !important;
  gap: 4px !important;
  border: 0 !important;
  background: transparent !important;
}

.desktop-module-tabs button {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 42px !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-left: 3px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--crm-muted) !important;
  text-align: left;
}

.desktop-module-tabs button:hover,
.desktop-module-tabs button.active {
  border-left-color: var(--crm-primary) !important;
  background: #eef3f8 !important;
  color: var(--crm-primary) !important;
}

.desktop-module-tabs button:last-child {
  border-right: 0 !important;
}

.desktop-module-tabs .nav-icon {
  display: inline-grid !important;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: #eef2f7;
  color: var(--crm-primary);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
}

.desktop-module-tabs button.active .nav-icon,
.desktop-module-tabs button:hover .nav-icon {
  background: var(--crm-primary);
  color: #ffffff;
}

.desktop-module-tabs .nav-copy {
  display: grid !important;
  gap: 1px;
  min-width: 0;
}

.desktop-module-tabs .nav-copy b {
  color: inherit;
  font-size: 13px;
  font-weight: 850;
}

.desktop-module-tabs .nav-copy span {
  display: block !important;
  color: var(--crm-muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.2;
}

.desktop-module-tabs button.active .nav-copy span,
.desktop-module-tabs button:hover .nav-copy span {
  color: #486179;
}

.screen-title,
.streamlit-page-heading,
.dashboard-hero,
.streamlit-detail-panel,
.streamlit-metric-card,
.streamlit-job-row,
.dashboard-panel,
.panel,
.job-card,
.task-card,
.activity-card,
.workspace-button,
.toolbar,
.calendar-panel,
.field-job-card,
.settings-panel,
.settings-role-card,
.accounting-week,
.tier-block,
.finance-row,
.approvals-panel,
.compact-task-card,
.compact-job-card,
.polished-job-card,
.job-detail-hero,
.next-process-panel,
.next-task-card,
.workspace-panel,
.workspace-hero,
.job-workspace-panel,
.purchase-card-row,
.attention-card,
.folder-card,
.gate-card,
.customer-forms-panel,
.file-send-panel,
.home-row,
.dash-action,
.sales-intake-summary,
.sales-form-section,
.sales-submit-panel {
  border: 1px solid var(--crm-border) !important;
  border-radius: 10px !important;
  background: var(--crm-card) !important;
  box-shadow: var(--crm-shadow-soft) !important;
}

.screen-title,
.streamlit-page-heading {
  border-left: 4px solid var(--crm-primary) !important;
  padding: 16px 20px !important;
}

.streamlit-metric-card {
  min-height: 92px;
  padding: 18px 20px !important;
  border-left: 4px solid var(--crm-border-strong) !important;
}

.streamlit-metric-card.active {
  border-left-color: var(--crm-primary) !important;
  background: #f8fbfd !important;
  box-shadow: var(--crm-shadow) !important;
}

.streamlit-metric-card b {
  color: var(--crm-muted) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0;
  text-transform: uppercase;
}

.streamlit-metric-card h3 {
  color: var(--crm-ink) !important;
  font-size: 34px !important;
  font-weight: 850 !important;
}

.streamlit-detail-panel {
  padding: 20px !important;
}

.streamlit-job-board {
  gap: 12px !important;
}

.streamlit-job-row {
  grid-template-columns: minmax(260px, 2.4fr) minmax(140px, 0.85fr) minmax(220px, 1.35fr) minmax(164px, 0.72fr) !important;
  gap: 16px !important;
  align-items: center;
  padding: 20px 22px !important;
  border-left: 0 !important;
  box-shadow: var(--crm-shadow-soft) !important;
}

.streamlit-job-row.alt {
  background: var(--crm-card) !important;
}

.streamlit-job-main h4,
.home-row b,
.job-title-band h3,
.job-header h3,
.task-card h3 {
  color: var(--crm-ink) !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
}

.streamlit-job-main p {
  color: var(--crm-muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.streamlit-row-label,
.streamlit-next-box span {
  color: var(--crm-muted) !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
}

.status-pill,
.badge {
  display: inline-flex !important;
  align-items: center;
  width: fit-content;
  min-height: 28px;
  padding: 4px 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #edf2f7 !important;
  color: #2d3748 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2;
}

.status-pill.green,
.badge.green {
  background: #dcfce7 !important;
  color: #166534 !important;
}

.status-pill.blue,
.badge.blue {
  background: #dbeafe !important;
  color: #1e3a8a !important;
}

.status-pill.gold,
.badge.gold {
  background: #fef3c7 !important;
  color: #92400e !important;
}

.streamlit-next-box {
  min-height: 60px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--crm-border) !important;
  border-left: 4px solid var(--crm-amber) !important;
  border-radius: 8px !important;
  background: #fffbeb !important;
}

.streamlit-next-box b {
  color: var(--crm-ink) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.primary-button,
.next-job-button {
  border: 1px solid var(--crm-primary-dark) !important;
  border-radius: 8px !important;
  background: var(--crm-primary) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.primary-button:hover,
.next-job-button:hover {
  background: var(--crm-primary-dark) !important;
}

.secondary-button,
.open-job-button,
.back-button,
.mini-button,
.contact-button,
.nav-button {
  border: 1px solid var(--crm-border-strong) !important;
  border-radius: 8px !important;
  background: var(--crm-card) !important;
  color: var(--crm-primary) !important;
  box-shadow: none !important;
}

.danger-button,
.logout-button {
  border: 1px solid var(--crm-red) !important;
  background: var(--crm-red) !important;
  color: #ffffff !important;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.sales-form-grid input,
.sales-form-grid textarea,
input,
select,
textarea {
  border: 1px solid var(--crm-border-strong) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: var(--crm-ink) !important;
  box-shadow: none !important;
}

.sales-form-section-head,
.sales-progress,
.job-next-strip,
.task-head,
.job-header,
.job-title-band {
  border-color: var(--crm-border) !important;
  background: var(--crm-card-alt) !important;
}

.notice {
  border: 1px solid #bbf7d0 !important;
  background: #f0fdf4 !important;
  color: #166534 !important;
}

.mode-banner {
  border: 1px solid #fed7aa !important;
  background: #fff7ed !important;
}

@media (min-width: 1080px) {
  .app-shell {
    grid-template-columns: 292px minmax(0, 1fr) !important;
    background: var(--crm-bg) !important;
  }

  .app-shell::before {
    width: 292px !important;
    background: var(--crm-card) !important;
    border-right: 1px solid var(--crm-border) !important;
  }

  .topbar {
    width: 292px !important;
  }

  .topbar-inner {
    padding: 18px 16px !important;
  }

  .app-content {
    padding: 22px 28px 48px !important;
  }
}

@media (max-width: 1079px) {
  .streamlit-job-row {
    grid-template-columns: 1fr !important;
  }

  .desktop-module-tabs button {
    grid-template-columns: 30px minmax(0, 1fr);
  }
}

/* Uniform phone/app treatment for the same refined CRM theme. */
@media (max-width: 1079px) {
  .app-shell,
  .app-content,
  .with-bottom-nav .app-content {
    background: var(--crm-bg) !important;
  }

  .topbar {
    background: var(--crm-card) !important;
    border-bottom: 1px solid var(--crm-border) !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.045) !important;
  }

  .brand-row {
    align-items: center;
  }

  .brand-logo {
    width: 42px !important;
    height: 42px !important;
    border-radius: 10px !important;
  }

  .brand-title {
    font-size: 16px !important;
  }

  .brand-subtitle {
    font-size: 11.5px !important;
  }

  .shell-row,
  .control-row {
    gap: 8px !important;
  }

  .control-row select,
  .locked-select,
  .nav-more-select select {
    min-height: 40px !important;
    border: 1px solid var(--crm-border) !important;
    background: var(--crm-card-alt) !important;
  }

  .screen {
    padding: 12px 12px 92px !important;
  }

  .screen-title,
  .dashboard-hero,
  .dashboard-panel,
  .panel,
  .job-card,
  .task-card,
  .activity-card,
  .workspace-button,
  .home-row,
  .dash-action,
  .stat-card,
  .sales-intake-summary,
  .sales-form-section,
  .sales-submit-panel {
    border: 1px solid var(--crm-border) !important;
    border-radius: 10px !important;
    background: var(--crm-card) !important;
    box-shadow: var(--crm-shadow-soft) !important;
  }

  .dashboard-hero {
    padding: 16px !important;
  }

  .dashboard-hero h2 {
    font-size: 24px !important;
    color: var(--crm-ink) !important;
  }

  .dashboard-hero p {
    color: var(--crm-muted) !important;
    font-size: 13px !important;
  }

  .stat-grid,
  .quick-grid,
  .dash-action-grid {
    gap: 8px !important;
  }

  .stat-card,
  .home-row,
  .dash-action,
  .workspace-button {
    min-height: 64px !important;
    padding: 14px !important;
    color: var(--crm-ink) !important;
  }

  .dash-action {
    background: var(--crm-card) !important;
    border-left: 4px solid var(--crm-primary) !important;
  }

  .dash-action:nth-child(even) {
    background: var(--crm-card-alt) !important;
  }

  .dash-action b,
  .workspace-button b,
  .home-row b {
    color: var(--crm-ink) !important;
  }

  .dash-action span,
  .workspace-button span,
  .home-row small,
  .home-row em {
    color: var(--crm-muted) !important;
  }

  .primary-button,
  .secondary-button,
  .danger-button,
  .back-button,
  .contact-button,
  .mini-button,
  .nav-button {
    min-height: 44px !important;
    border-radius: 8px !important;
    font-size: 13px;
  }

  .bottom-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid var(--crm-border) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 -8px 22px rgba(15, 23, 42, 0.08);
  }

  .bottom-nav button,
  .bottom-nav select {
    min-height: 42px !important;
    border: 1px solid var(--crm-border) !important;
    border-radius: 8px !important;
    background: var(--crm-card-alt) !important;
    color: var(--crm-muted) !important;
    font-size: 11px !important;
    font-weight: 750 !important;
    box-shadow: none !important;
  }

  .bottom-nav button.active,
  .mobile-more.active select {
    border-color: var(--crm-primary) !important;
    background: var(--crm-primary) !important;
    color: #ffffff !important;
  }

  .login-screen {
    background: var(--crm-bg) !important;
  }

  .login-card {
    border: 1px solid var(--crm-border) !important;
    border-top: 4px solid var(--crm-primary) !important;
    border-bottom: 0 !important;
    border-radius: 12px !important;
    background: var(--crm-card) !important;
    box-shadow: var(--crm-shadow) !important;
  }

  .login-card img {
    border: 1px solid var(--crm-border) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
  }

  .login-card select,
  .login-card input {
    border: 1px solid var(--crm-border-strong) !important;
    background: var(--crm-card-alt) !important;
  }
}

/* Final polish: button alignment and stronger active sidebar hierarchy. */
.streamlit-page-actions .primary-button,
.streamlit-page-actions .secondary-button,
.hero-actions .primary-button,
.hero-actions .secondary-button,
.streamlit-row-actions .primary-button,
.streamlit-row-actions .secondary-button,
.primary-button.compact,
.secondary-button.compact {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  white-space: nowrap;
}

.streamlit-page-actions .primary-button,
.streamlit-page-actions .secondary-button {
  min-height: 38px !important;
}

.desktop-module-tabs button.active {
  background: #e6edf5 !important;
  color: var(--crm-primary-dark) !important;
}

.desktop-module-tabs button.active .nav-copy b {
  color: var(--crm-primary-dark) !important;
  font-weight: 950 !important;
}

.desktop-module-tabs button.active .nav-copy span {
  color: #334e68 !important;
  font-weight: 750 !important;
}

.desktop-module-tabs button.active .nav-icon {
  background: var(--crm-primary-dark) !important;
  color: #ffffff !important;
}

.desktop-module-tabs button:focus-visible,
.primary-button:focus-visible,
.secondary-button:focus-visible,
.back-button:focus-visible,
.mini-button:focus-visible {
  outline: 3px solid rgba(var(--primary-rgb), 0.28);
  outline-offset: 2px;
}

@media (max-width: 1079px) {
  .primary-button,
  .secondary-button,
  .danger-button,
  .back-button,
  .contact-button,
  .mini-button,
  .nav-button,
  .bottom-nav button,
  .bottom-nav select {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: 1.1 !important;
  }
}

/* Dashboard QA pass: consistent rows, dividers, actions, and badge contrast. */
@media (min-width: 1080px) {
  .streamlit-job-row {
    grid-template-columns: minmax(300px, 2.2fr) minmax(150px, 0.82fr) minmax(230px, 1.28fr) 176px !important;
    gap: 16px !important;
    overflow: visible !important;
  }

  .streamlit-status-box,
  .streamlit-next-box {
    min-height: 62px !important;
    padding: 12px 14px !important;
    border: 1px solid var(--crm-border) !important;
    border-left: 4px solid var(--crm-amber) !important;
    border-radius: 8px !important;
    background: #fffaf0 !important;
    align-self: stretch;
  }

  .streamlit-status-box {
    border-left-color: var(--crm-primary) !important;
    background: #f6f9fc !important;
  }

  .streamlit-row-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    min-width: 176px !important;
    align-self: stretch;
  }

  .streamlit-row-actions .primary-button,
  .streamlit-row-actions .secondary-button {
    width: 100% !important;
    min-height: 36px !important;
    padding: 0 12px !important;
  }
}

.status-pill.gold,
.badge.gold {
  background: #fef3c7 !important;
  color: #4a2f00 !important;
}

.status-pill.blue,
.badge.blue {
  background: #dbeafe !important;
  color: #163b73 !important;
}

.desktop-module-tabs button.active .nav-copy b {
  color: #102a43 !important;
  font-weight: 950 !important;
}

.desktop-module-tabs button.active .nav-copy span {
  color: #243b53 !important;
}

/* Start New Sale intake optimization: compact, sticky, and validation-linked. */
.sales-intake-shell {
  gap: 18px !important;
}

.sales-intake-summary {
  gap: 12px !important;
  padding: 16px !important;
}

.sales-summary-item {
  width: 100%;
  appearance: none;
  border: 1px solid var(--crm-border-strong) !important;
  border-left: 5px solid var(--crm-red) !important;
  background: #fff7ed !important;
  color: var(--crm-ink) !important;
  cursor: pointer;
  text-align: left;
}

.sales-summary-item.ready {
  border-left-color: #15803d !important;
  background: #f0fdf4 !important;
}

.sales-summary-item:hover,
.sales-summary-item:focus-visible {
  border-color: var(--crm-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.16) !important;
  outline: none;
}

.sales-form-stack {
  gap: 12px !important;
}

.sales-form-section {
  overflow: visible !important;
}

.sales-form-section-head {
  align-items: start !important;
  gap: 10px !important;
  padding: 11px 14px !important;
}

.sales-step {
  align-self: start !important;
  margin-top: 0 !important;
}

.sales-form-section-head h3 {
  line-height: 1.1 !important;
}

.sales-form-section-head p {
  margin-top: 3px !important;
}

.sales-form-grid {
  gap: 10px 12px !important;
  padding: 12px 14px !important;
}

.sales-form-grid label {
  gap: 5px !important;
}

.sales-form-grid input,
.sales-form-grid textarea {
  min-height: 38px !important;
  padding: 8px 10px !important;
  border: 1px solid #9ca3af !important;
  background: #ffffff !important;
  color: var(--crm-ink) !important;
}

.sales-form-grid textarea {
  min-height: 82px !important;
}

.sales-form-grid input::placeholder,
.sales-form-grid textarea::placeholder {
  color: #757575 !important;
  opacity: 0.72;
  font-weight: 600;
}

.sales-form-grid input:focus,
.sales-form-grid textarea:focus {
  border-color: var(--crm-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.16) !important;
  outline: none;
}

.sales-form-grid .required-missing input,
.sales-form-grid .required-missing textarea {
  border-left: 5px solid #b91c1c !important;
  background: #fff7ed !important;
}

.sales-field-highlight {
  animation: salesFieldPulse 2.2s ease;
}

@keyframes salesFieldPulse {
  0%,
  100% {
    box-shadow: none;
  }
  18%,
  72% {
    box-shadow: 0 0 0 4px rgba(var(--primary-rgb), 0.22);
  }
}

.sales-optional-stack {
  display: grid;
  gap: 10px;
}

.sales-optional-panel {
  border: 2px solid var(--line);
  border-radius: var(--square-radius);
  background: var(--professional-clean);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
  overflow: hidden;
}

.sales-optional-panel.open {
  border-color: var(--crm-border-strong);
}

.sales-optional-toggle {
  padding: 13px 14px;
  background: var(--professional-band);
  cursor: pointer;
}

.sales-optional-toggle span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.sales-optional-toggle b {
  color: var(--ink);
  font-size: 14px;
}

.sales-optional-toggle small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.optional-panel-grid {
  border-top: 2px solid var(--line);
  background: var(--professional-clean);
}

.tenant-toggle {
  padding: 10px 12px;
  border: 1px solid var(--crm-border-strong);
  border-radius: 8px;
  background: var(--crm-card-alt);
}

.toggle-line {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 10px !important;
  margin: 0;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.toggle-line input {
  width: 18px;
  height: 18px;
  min-height: 18px !important;
  padding: 0 !important;
  accent-color: var(--crm-red);
}

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

.tenant-fields.is-hidden,
.tenant-fields[hidden] {
  display: none !important;
}

.tenant-fields label:nth-child(3) {
  grid-column: 1 / -1;
}

@media (min-width: 760px) {
  .sales-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1080px) {
  .sales-intake-shell {
    grid-template-columns: 300px minmax(0, 1fr) !important;
  }

  .sales-intake-summary {
    position: sticky !important;
    top: 82px !important;
    max-height: calc(100vh - 106px);
    overflow: auto;
  }
}

@media (max-width: 759px) {
  .tenant-fields {
    grid-template-columns: 1fr;
  }

  .tenant-fields label:nth-child(3) {
    grid-column: auto;
  }
}

.ai-file-focus {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 14px 0;
  padding: 14px;
  border: 2px solid #b91c1c;
  border-radius: 14px;
  background: #fff7f7;
}

.ai-file-focus div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ai-file-focus span {
  overflow-wrap: anywhere;
}

.ai-file-focus .primary-button {
  flex: 0 0 auto;
  text-decoration: none;
}

@media (max-width: 759px) {
  .ai-file-focus {
    align-items: stretch;
    flex-direction: column;
  }

  .ai-file-focus .primary-button {
    width: 100%;
    text-align: center;
  }
}

/* Map View QA pass: matching colors, no raw coordinates, and split-screen workflow. */
.map-workspace {
  display: grid;
  gap: 14px;
}

.map-shell {
  align-self: start;
}

.map-surface {
  min-height: 420px !important;
  border: 1px solid var(--crm-border-strong) !important;
  border-radius: 8px !important;
}

.map-pin,
.location-row,
.location-index,
.map-filter-pill {
  --map-color: #15803d;
  --map-soft: #f0fdf4;
}

.map-pin.all,
.location-row.all,
.location-index.all,
.map-filter-pill.all {
  --map-color: var(--brand-primary, #a50f17);
  --map-soft: #eef4fb;
}

.map-pin.active,
.location-row.active,
.location-index.active,
.map-filter-pill.active {
  --map-color: #2563eb;
  --map-soft: #eff6ff;
}

.map-pin.incoming,
.location-row.incoming,
.location-index.incoming,
.map-filter-pill.incoming {
  --map-color: #b91c1c;
  --map-soft: #fff1f2;
}

.map-pin.hold,
.location-row.hold,
.location-index.hold,
.map-filter-pill.hold {
  --map-color: #92400e;
  --map-soft: #fffbeb;
}

.map-pin.payment,
.location-row.payment,
.location-index.payment,
.map-filter-pill.payment {
  --map-color: #c2410c;
  --map-soft: #fff7ed;
}

.map-pin.preconstruction,
.location-row.preconstruction,
.location-index.preconstruction,
.map-filter-pill.preconstruction {
  --map-color: #475569;
  --map-soft: #f1f5f9;
}

.map-pin.closed,
.location-row.closed,
.location-index.closed,
.map-filter-pill.closed {
  --map-color: #111827;
  --map-soft: #f3f4f6;
}

.map-pin.open,
.location-row.open,
.location-index.open,
.map-filter-pill.open {
  --map-color: #15803d;
  --map-soft: #f0fdf4;
}

.map-pin {
  background: var(--map-color) !important;
}

.location-row {
  border-left-color: var(--map-color) !important;
  cursor: pointer;
}

.location-row:hover,
.location-row:focus-within {
  background: var(--map-soft) !important;
  border-color: var(--map-color) !important;
}

.location-index {
  border-color: var(--map-color) !important;
  background: var(--map-soft) !important;
  color: var(--map-color) !important;
}

.location-row .badge {
  margin: 0 !important;
  vertical-align: middle;
}

.location-address {
  margin-top: 6px !important;
  color: var(--crm-muted) !important;
}

.map-coordinate-state {
  display: inline-flex;
  width: fit-content;
  margin-top: 7px;
  padding: 4px 8px;
  border: 1px solid var(--crm-border);
  border-radius: 999px;
  background: #f8fafc;
  color: var(--crm-muted);
  font-size: 11px;
  font-weight: 850;
}

.map-coordinate-state.ready {
  background: #f0fdf4;
  color: #166534;
}

.map-coordinate-state.missing {
  background: #fff7ed;
  color: #9a3412;
}

.map-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.map-filter-pill {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--crm-border-strong);
  border-radius: 999px;
  background: #ffffff;
  color: var(--crm-ink);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.map-filter-pill::before {
  content: "";
  width: 11px;
  height: 11px;
  flex: 0 0 11px;
  border-radius: 50%;
  background: var(--map-color);
}

.map-filter-pill b {
  font-size: 12px;
}

.map-filter-pill span {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  min-height: 22px;
  border-radius: 999px;
  background: var(--map-soft);
  color: var(--map-color);
  font-size: 11px;
  font-weight: 900;
}

.map-filter-pill.selected {
  border-color: var(--map-color);
  background: var(--map-soft);
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.1);
}

.map-filter-pill:hover,
.map-filter-pill:focus-visible {
  border-color: var(--map-color);
  outline: none;
}

.map-pin.pin-flash {
  animation: mapPinFlash 1.15s ease 2;
}

@keyframes mapPinFlash {
  0%,
  100% {
    box-shadow: var(--shadow);
  }
  50% {
    box-shadow: 0 0 0 12px rgba(var(--primary-rgb), 0.22), var(--shadow);
    transform: translate(-50%, -50%) rotate(-45deg) scale(1.12);
  }
}

@media (min-width: 1080px) {
  .map-workspace {
    grid-template-columns: minmax(360px, 2fr) minmax(520px, 3fr);
    align-items: start;
  }

  .map-shell {
    position: sticky;
    top: 82px;
  }

  .map-surface {
    min-height: 540px !important;
  }

  .location-list {
    max-height: calc(100vh - 190px);
    overflow: auto;
    padding-right: 3px;
  }
}

/* Accounting chronology pass: keep AP and AR inside their matching week. */
.accounting-chronology-note {
  display: grid;
  gap: 3px;
  margin-bottom: 12px;
  padding: 11px 13px;
  border: 1px solid var(--crm-border);
  border-left: 4px solid var(--crm-primary);
  border-radius: 8px;
  background: var(--crm-card-alt);
  color: var(--crm-ink);
  box-shadow: var(--crm-shadow-soft);
}

.accounting-chronology-note b {
  font-size: 13px;
  font-weight: 900;
}

.accounting-chronology-note span {
  color: var(--crm-muted);
  font-size: 12px;
  font-weight: 750;
}

.week-ar-block {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--crm-border);
  border-left: 4px solid #15803d;
  border-radius: 8px;
  background: #f0fdf4;
}

.week-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--crm-ink);
}

.week-section-title b {
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.week-section-title span {
  color: var(--crm-muted);
  font-size: 12px;
  font-weight: 850;
}

.week-section-title.ap-title {
  padding: 9px 10px;
  border: 1px solid var(--crm-border);
  border-left: 4px solid var(--crm-amber);
  border-radius: 8px;
  background: #fffaf0;
}

.week-ar-block .finance-row,
.week-ar-block .ar-row {
  background: #ffffff !important;
}

@media (min-width: 1600px) {
  .accounting-week {
    flex-basis: calc((100% - 48px) / 4);
    min-width: 320px;
    max-width: none;
  }
}

@media (max-width: 1199px) {
  .planner-head,
  .planner-main-grid {
    grid-template-columns: 1fr;
  }

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

  .payment-planner-table {
    overflow-x: visible;
  }

  .payment-planner-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-width: 0;
  }

  .planner-check,
  .planner-amount,
  .planner-move {
    grid-column: auto;
  }

  .planner-payable,
  .planner-week-buttons {
    grid-column: 1 / -1;
  }

  .accounting-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 0;
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .accounting-week {
    flex: auto;
    min-width: 0;
    max-width: none;
  }
}

@media (max-width: 760px) {
  .accounting-planner {
    padding: 12px;
  }

  .planning-summary-grid {
    grid-template-columns: 1fr;
  }

  .payment-planner-table {
    overflow-x: visible;
  }

  .payment-planner-row {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .planner-week-buttons .primary-button,
  .planner-week-buttons .secondary-button,
  .planner-move .primary-button,
  .planner-move .secondary-button {
    flex: 1 1 0;
  }

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

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

  .accounting-nav-button {
    width: 100%;
  }

  .accounting-week-head {
    display: grid;
  }

  .accounting-week-metrics {
    grid-template-columns: 1fr;
  }

  .week-ending-pill {
    min-width: 0;
  }

  .calendar-time-grid,
  .calendar-autofill-card > div {
    grid-template-columns: 1fr;
  }

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

  .calendar-mode-toggle {
    justify-content: stretch;
  }

  .calendar-mode-toggle button {
    flex: 1 1 0;
  }

  .calendar-event-card {
    grid-template-columns: 1fr;
  }

  .calendar-week-grid,
  .calendar-month-grid {
    grid-template-columns: 1fr;
    overflow: visible;
  }

  .calendar-day-column,
  .calendar-month-cell {
    min-height: auto;
  }
}

@media (max-width: 480px) {
  .planner-week-buttons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Unified PWA/app theme: keep phone, tablet, and desktop on the same visual system. */
:root {
  --app-bg: #f4f1ea;
  --app-bg-cool: #eef3f8;
  --app-card: #ffffff;
  --app-card-soft: #fbf7ef;
  --app-card-cool: #f6f9fc;
  --app-ink: #111827;
  --app-muted: #475569;
  --app-line: #111827;
  --app-line-soft: #d6d3ca;
  --app-red: #b91c1c;
  --app-red-dark: #7f1d1d;
  --app-blue: var(--brand-primary, #a50f17);
  --app-blue-dark: var(--brand-primary-dark, #71080e);
  --app-amber: #b7791f;
  --app-radius: 8px;
  --app-radius-tight: 6px;
  --app-shadow: 0 8px 20px rgba(17, 24, 39, 0.08);
  --app-shadow-soft: 0 2px 8px rgba(17, 24, 39, 0.055);
}

html,
body,
.app-shell,
.app-content,
.with-bottom-nav .app-content {
  background: var(--app-bg) !important;
  color: var(--app-ink) !important;
}

.topbar,
.topbar-inner {
  background: var(--app-card-soft) !important;
  color: var(--app-ink) !important;
}

.topbar {
  border-bottom: 2px solid var(--app-line) !important;
  box-shadow: none !important;
}

.brand-logo,
.login-card img {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius) !important;
  background: var(--app-card) !important;
  box-shadow: none !important;
}

.brand-title,
.dashboard-hero h2,
.screen-title h2,
.streamlit-page-heading h2,
.job-header h3,
.job-title-band h3,
.task-card h3,
.folder-card h3,
.dashboard-panel h3,
.dash-action b,
.workspace-button b,
.home-row b {
  color: var(--app-ink) !important;
}

.brand-subtitle,
.small,
.dashboard-hero p,
.home-row small,
.home-row em,
.dash-action span,
.workspace-button span,
.job-meta,
.task-meta {
  color: var(--app-muted) !important;
}

.screen-title,
.dashboard-hero,
.dashboard-panel,
.panel,
.stat-card,
.job-card,
.task-card,
.activity-card,
.workspace-button,
.home-row,
.dash-action,
.field-job-card,
.settings-role-card,
.accounting-planner,
.accounting-week,
.planning-suggestions,
.payment-planner-table,
.payment-planner-row,
.tier-block,
.finance-row,
.folder-card,
.gate-card,
.customer-form-card,
.sales-intake-summary,
.sales-form-section,
.sales-submit-panel,
.calendar-panel,
.calendar-event-card,
.map-shell,
.location-card,
.purchase-card-row,
.attention-card,
.streamlit-metric-card,
.streamlit-job-row,
.streamlit-detail-panel {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius) !important;
  background: var(--app-card) !important;
  box-shadow: var(--app-shadow-soft) !important;
}

.screen-title,
.dashboard-hero,
.accounting-planner,
.sales-intake-summary {
  background: var(--app-card-soft) !important;
}

.stat-card,
.home-row,
.dash-action,
.workspace-button,
.planning-week-card,
.calendar-autofill-card,
.finance-schedule,
.sales-progress,
.sales-form-section-head,
.job-next-strip,
.task-head,
.job-header,
.job-title-band {
  background: var(--app-card-cool) !important;
}

.dash-action,
.streamlit-metric-card.active,
.screen-title,
.streamlit-page-heading {
  border-left: 6px solid var(--app-red) !important;
}

.dashboard-actions-column .dash-action:nth-child(even),
.home-row:nth-child(even),
.job-card:nth-child(even),
.task-card:nth-child(even),
.activity-card:nth-child(even) {
  background: var(--app-card-soft) !important;
}

.primary-button,
.next-job-button {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius-tight) !important;
  background: var(--app-blue) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.primary-button:hover,
.next-job-button:hover {
  background: var(--app-blue-dark) !important;
}

.secondary-button,
.open-job-button,
.back-button,
.mini-button,
.contact-button,
.nav-button {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius-tight) !important;
  background: var(--app-card) !important;
  color: var(--app-blue) !important;
  box-shadow: none !important;
}

.danger-button,
.logout-button {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius-tight) !important;
  background: var(--app-red) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.top-nav button,
.nav-more-select select,
.control-row select,
.locked-select,
.bottom-nav button,
.bottom-nav select,
.login-card select,
.login-card input,
input,
select,
textarea {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius-tight) !important;
  background: var(--app-card) !important;
  color: var(--app-ink) !important;
  box-shadow: none !important;
}

.top-nav button.active,
.nav-more-select.active select,
.bottom-nav button.active,
.mobile-more.active select {
  background: var(--app-red) !important;
  color: #ffffff !important;
}

.desktop-module-tabs button {
  border-radius: var(--app-radius-tight) !important;
}

.desktop-module-tabs button.active,
.desktop-module-tabs button:hover {
  border-left-color: var(--app-red) !important;
  background: var(--app-card-cool) !important;
  color: var(--app-ink) !important;
}

.desktop-module-tabs .nav-icon,
.desktop-module-tabs button.active .nav-icon,
.desktop-module-tabs button:hover .nav-icon {
  border: 2px solid var(--app-line) !important;
  border-radius: var(--app-radius-tight) !important;
  background: var(--app-red) !important;
  color: #ffffff !important;
}

.bottom-nav {
  border-top: 2px solid var(--app-line) !important;
  background: rgba(251, 247, 239, 0.98) !important;
  box-shadow: 0 -8px 22px rgba(17, 24, 39, 0.12) !important;
}

.status-pill,
.badge,
.tier-pill,
.current-week-pill {
  border: 1px solid var(--app-line-soft) !important;
  border-radius: 999px !important;
}

.status-pill.gold,
.badge.gold,
.planning-week-card.watch,
.week-ending-pill.warning {
  background: #fef3c7 !important;
  color: #4a2f00 !important;
}

.status-pill.blue,
.badge.blue {
  background: #dbeafe !important;
  color: #163b73 !important;
}

.status-pill.green,
.badge.green,
.planning-week-card.good,
.week-ending-pill.positive {
  background: #dcfce7 !important;
  color: #14532d !important;
}

.notice {
  border: 2px solid var(--app-line) !important;
  border-left: 6px solid #15803d !important;
  border-radius: var(--app-radius) !important;
  background: #f0fdf4 !important;
  color: #14532d !important;
}

.login-screen {
  background:
    linear-gradient(135deg, rgba(246, 242, 234, 0.96), rgba(238, 243, 248, 0.9)),
    var(--app-bg) !important;
}

.login-card {
  border: 2px solid var(--app-line) !important;
  border-top: 7px solid var(--app-red) !important;
  border-bottom: 0 !important;
  border-radius: var(--app-radius) !important;
  background: var(--app-card) !important;
  box-shadow: var(--app-shadow) !important;
}

@media (min-width: 1080px) {
  .app-shell::before {
    background: var(--app-card-soft) !important;
    border-right: 2px solid var(--app-line) !important;
  }

  .topbar {
    background: var(--app-card-soft) !important;
    border-right: 2px solid var(--app-line) !important;
    border-bottom: 0 !important;
  }
}

@media (max-width: 1079px) {
  .topbar {
    background: var(--app-card-soft) !important;
    border-bottom: 2px solid var(--app-line) !important;
  }

  .screen {
    padding: 12px 12px 96px !important;
  }

  .screen-title,
  .dashboard-hero,
  .dashboard-panel,
  .panel,
  .stat-card,
  .job-card,
  .task-card,
  .activity-card,
  .workspace-button,
  .home-row,
  .dash-action,
  .folder-card,
  .sales-form-section,
  .accounting-planner,
  .calendar-panel {
    border-radius: var(--app-radius) !important;
  }

  .dashboard-hero {
    gap: 12px !important;
    padding: 14px !important;
  }

  .dashboard-hero h2 {
    font-size: 23px !important;
  }

  .stat-grid,
  .dashboard-grid,
  .dash-action-grid,
  .quick-grid {
    gap: 10px !important;
  }

  .dash-action,
  .workspace-button,
  .home-row,
  .stat-card {
    min-height: 62px !important;
    padding: 12px !important;
  }

  .primary-button,
  .secondary-button,
  .danger-button,
  .back-button,
  .mini-button,
  .contact-button,
  .nav-button {
    min-height: 44px !important;
    border-radius: var(--app-radius-tight) !important;
  }
}

/* Soft professional palette override: reduce the red/black-heavy look. */
:root {
  --app-bg: #f4f1ea;
  --app-card-soft: #fbf7ef;
  --app-card-cool: #f5f8fb;
  --app-ink: #1f2937;
  --app-muted: #5f6b7a;
  --app-line: #b8afa2;
  --app-line-soft: #d9d2c7;
  --app-red: #a32626;
  --app-red-dark: #7f1d1d;
  --app-blue: var(--brand-primary, #a50f17);
  --app-blue-dark: var(--brand-primary-dark, #71080e);
  --app-amber: #b7791f;
}

.screen-title,
.streamlit-page-heading,
.dash-action,
.streamlit-metric-card.active {
  border-left-color: var(--app-blue) !important;
}

.dashboard-hero,
.login-card,
.screen-title,
.dashboard-panel,
.panel,
.stat-card,
.job-card,
.task-card,
.activity-card,
.workspace-button,
.home-row,
.dash-action,
.folder-card,
.accounting-planner,
.accounting-week,
.payment-planner-row,
.sales-form-section,
.calendar-panel,
.streamlit-job-row,
.streamlit-detail-panel {
  border-color: var(--app-line) !important;
}

.topbar {
  border-bottom-color: var(--app-line) !important;
}

.app-shell::before {
  border-right-color: var(--app-line) !important;
}

.brand-logo,
.login-card img,
.primary-button,
.secondary-button,
.back-button,
.mini-button,
.contact-button,
.nav-button,
.top-nav button,
.nav-more-select select,
.control-row select,
.locked-select,
.bottom-nav button,
.bottom-nav select,
input,
select,
textarea {
  border-color: var(--app-line) !important;
}

.primary-button,
.next-job-button,
.top-nav button.active,
.nav-more-select.active select,
.bottom-nav button.active,
.mobile-more.active select,
.desktop-module-tabs .nav-icon,
.desktop-module-tabs button.active .nav-icon,
.desktop-module-tabs button:hover .nav-icon {
  background: var(--app-blue) !important;
  color: #ffffff !important;
}

.primary-button:hover,
.next-job-button:hover {
  background: var(--app-blue-dark) !important;
}

.secondary-button,
.open-job-button,
.back-button,
.mini-button,
.contact-button,
.nav-button,
.dash-action,
.dashboard-actions-column .dash-action:nth-child(even) {
  background: var(--app-card) !important;
  color: var(--app-blue) !important;
}

.dash-action:hover,
.desktop-module-tabs button.active,
.desktop-module-tabs button:hover {
  background: var(--app-card-cool) !important;
}

.danger-button,
.logout-button {
  background: var(--app-red) !important;
  border-color: var(--app-red-dark) !important;
  color: #ffffff !important;
}

.login-card {
  border-top-color: var(--app-blue) !important;
}

.desktop-module-tabs button.active,
.desktop-module-tabs button:hover {
  border-left-color: var(--app-blue) !important;
}

.bottom-nav {
  border-top-color: var(--app-line) !important;
}

/* Hard neutralization pass: legacy Streamlit-style boards may still use --red/--line. */
:root {
  --red: var(--brand-primary, #a50f17) !important;
  --red-dark: var(--brand-primary-dark, #71080e) !important;
  --line: #c8bfae !important;
  --ink: #1f2937 !important;
  --muted: #5f6b7a !important;
  --primary-rgb: 31, 59, 87 !important;
  --dark-rgb: 31, 59, 87 !important;
  --app-red: var(--brand-primary, #a50f17) !important;
  --app-red-dark: var(--brand-primary-dark, #71080e) !important;
}

.streamlit-desktop-home,
.streamlit-page-heading,
.streamlit-detail-panel,
.streamlit-job-board,
.streamlit-job-row,
.streamlit-job-row.alt,
.streamlit-metric-card,
.streamlit-next-box,
.streamlit-status-box {
  background: #ffffff !important;
  color: #1f2937 !important;
}

.streamlit-page-heading,
.streamlit-detail-panel,
.streamlit-job-row,
.streamlit-metric-card,
.streamlit-next-box,
.streamlit-status-box {
  border-color: #c8bfae !important;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.055) !important;
}

.streamlit-page-heading,
.streamlit-metric-card,
.streamlit-metric-card.active,
.streamlit-job-row,
.streamlit-next-box,
.streamlit-status-box {
  border-left-color: var(--brand-primary, #a50f17) !important;
}

.streamlit-metric-card.active {
  background: #f5f8fb !important;
  box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.16), 0 6px 14px rgba(31, 41, 55, 0.07) !important;
}

.streamlit-metric-card h3,
.streamlit-row-value,
.streamlit-next-box b,
.streamlit-job-main h4 {
  color: #1f2937 !important;
}

.streamlit-metric-card h3 {
  color: var(--brand-primary, #a50f17) !important;
}

.streamlit-row-label,
.streamlit-next-box span,
.streamlit-job-main p,
.streamlit-detail-head p,
.desktop-role-note {
  color: #5f6b7a !important;
}

.streamlit-page-actions .primary-button,
.streamlit-row-actions .primary-button,
.primary-button,
.next-job-button {
  background: var(--brand-primary, #a50f17) !important;
  border-color: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.streamlit-page-actions .secondary-button,
.streamlit-row-actions .secondary-button,
.secondary-button,
.open-job-button,
.mini-button,
.back-button,
.contact-button,
.nav-button {
  background: #ffffff !important;
  border-color: #c8bfae !important;
  color: var(--brand-primary, #a50f17) !important;
}

.danger-button,
.logout-button {
  background: var(--brand-primary, #a50f17) !important;
  border-color: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.topbar,
.topbar-inner,
.bottom-nav {
  background: #fbf7ef !important;
  border-color: #c8bfae !important;
}

/* Sleek web-app pass: quiet CRM layout, not heavy red/black construction blocks. */
:root {
  --line: #d9d2c7 !important;
  --app-line: #d9d2c7 !important;
  --app-line-soft: #e8e2d8 !important;
  --app-bg: #f4f1ea !important;
  --app-card-soft: #fbf7ef !important;
  --app-card-cool: #f7f9fb !important;
  --app-blue: var(--brand-primary, #a50f17) !important;
  --app-blue-dark: var(--brand-primary-dark, #71080e) !important;
}

.streamlit-desktop-home {
  display: grid !important;
  gap: 16px !important;
}

.streamlit-page-heading {
  padding: 18px 20px !important;
  border: 1px solid #d9d2c7 !important;
  border-left: 0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 2px 10px rgba(31, 41, 55, 0.04) !important;
}

.streamlit-page-heading .eyebrow {
  color: #6b7280 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
}

.streamlit-page-heading h2 {
  color: #1f2937 !important;
  font-size: 25px !important;
  font-weight: 850 !important;
}

.streamlit-metric-grid {
  gap: 10px !important;
}

.streamlit-metric-card {
  min-height: 86px !important;
  padding: 16px !important;
  border: 1px solid #d9d2c7 !important;
  border-top: 3px solid #d9d2c7 !important;
  border-left: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.035) !important;
}

.streamlit-metric-card.active {
  border-top-color: var(--brand-primary, #a50f17) !important;
  background: #f7f9fb !important;
  box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.09), 0 5px 14px rgba(31, 41, 55, 0.055) !important;
}

.streamlit-metric-card b {
  color: #5f6b7a !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}

.streamlit-metric-card h3 {
  color: var(--brand-primary, #a50f17) !important;
  font-size: 30px !important;
  font-weight: 850 !important;
}

.streamlit-detail-panel {
  padding: 16px !important;
  border: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 12px rgba(31, 41, 55, 0.045) !important;
}

.streamlit-detail-head {
  padding-bottom: 10px !important;
  border-bottom: 1px solid #ebe5dc !important;
}

.streamlit-detail-head h3 {
  color: #1f2937 !important;
  font-size: 19px !important;
  font-weight: 850 !important;
}

.streamlit-job-board {
  gap: 8px !important;
}

.streamlit-job-row {
  grid-template-columns: minmax(240px, 2.15fr) minmax(130px, 0.8fr) minmax(210px, 1.25fr) minmax(142px, 0.65fr) !important;
  gap: 14px !important;
  padding: 15px 16px !important;
  border: 1px solid #d9d2c7 !important;
  border-left: 3px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.streamlit-job-row:hover {
  border-left-color: var(--brand-primary, #a50f17) !important;
  background: #f7f9fb !important;
  transform: none !important;
  box-shadow: 0 3px 10px rgba(31, 41, 55, 0.045) !important;
}

.streamlit-job-row.alt {
  background: #fbfcfd !important;
}

.streamlit-status-box,
.streamlit-next-box {
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px solid #e1dbd2 !important;
  border-left: 3px solid #d9d2c7 !important;
  border-radius: 7px !important;
  background: #f7f9fb !important;
}

.streamlit-next-box {
  border-left-color: #b7791f !important;
  background: #fffaf0 !important;
}

.streamlit-row-actions {
  gap: 7px !important;
}

.streamlit-row-actions .primary-button,
.streamlit-page-actions .primary-button {
  background: var(--brand-primary, #a50f17) !important;
  border: 1px solid var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.streamlit-row-actions .secondary-button,
.streamlit-page-actions .secondary-button,
.streamlit-detail-head .mini-button {
  background: #ffffff !important;
  border: 1px solid #c8bfae !important;
  color: var(--brand-primary, #a50f17) !important;
}

.primary-button,
.secondary-button,
.danger-button,
.back-button,
.mini-button,
.contact-button,
.nav-button,
.top-nav button,
.nav-more-select select,
.control-row select,
.locked-select,
.bottom-nav button,
.bottom-nav select,
input,
select,
textarea {
  border-width: 1px !important;
}

/* Dedicated permit workbench. Keeps the Permits tab separate from the Map tab. */
.permits-screen .compact-metrics {
  margin-bottom: 14px;
}

.permit-card {
  border-left: 4px solid var(--crm-accent, var(--brand-primary, #a50f17)) !important;
}

.permit-context {
  margin-top: 12px;
}

.permit-context div {
  min-width: 0;
}

.permit-context span {
  overflow-wrap: anywhere;
}

.legal-disclosure {
  display: grid;
  gap: 6px;
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid #c8bfae;
  border-left: 4px solid #b7791f;
  border-radius: 8px;
  background: #fffaf0;
  color: #1f2937;
}

.legal-disclosure b {
  color: #6b3f07;
  font-size: 13px;
  font-weight: 900;
}

.legal-disclosure span {
  color: #374151;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
}

.gpt-float-button {
  position: fixed;
  right: 18px;
  bottom: calc(22px + env(safe-area-inset-bottom));
  z-index: 40;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border: 2px solid #0f172a;
  border-radius: 999px;
  background: var(--brand-primary, #a50f17);
  color: #ffffff;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.gpt-float-button.active,
.gpt-float-button:hover {
  background: #b7791f;
}

.mobile-app-header {
  display: none;
}

.ai-assistant-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.ai-assistant-panel h3 {
  margin: 0;
  color: #1f2937;
  font-size: 18px;
  font-weight: 850;
}

.ai-assistant-panel p {
  margin: 0;
  color: #5f6b7a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
}

.ai-privacy-banner {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid #d8b8b9;
  border-left: 5px solid var(--brand-primary, #a50f17);
  border-radius: 10px;
  background: #fff8f7;
}

.ai-privacy-banner b {
  color: #7f1016;
  font-size: 14px;
}

.ai-privacy-banner span {
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.ai-job-picker {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 12px;
  font-weight: 850;
}

.ai-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ai-suggestions button {
  min-height: 38px;
  padding: 7px 11px;
  border: 1px solid #b91c1c !important;
  border-radius: 999px;
  background: #ffffff !important;
  color: #9f1119 !important;
  font-size: 12px;
  font-weight: 850;
}

.ai-chat-thread {
  max-height: 430px;
  min-height: 220px;
  display: grid;
  align-content: start;
  gap: 10px;
  overflow-y: auto;
  padding: 12px;
  border: 1px solid #d7dce3;
  border-radius: 12px;
  background: #f8fafc;
}

.ai-message {
  max-width: 88%;
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 12px;
}

.ai-message span {
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.ai-message p {
  white-space: pre-wrap;
  color: inherit;
  font-size: 13px;
  line-height: 1.5;
}

.ai-message.assistant {
  justify-self: start;
  border: 1px solid #e4c6c8;
  background: #fff8f7;
  color: #3f1d20;
}

.ai-message.assistant span {
  color: var(--brand-primary, #a50f17);
}

.ai-message.user {
  justify-self: end;
  background: linear-gradient(180deg, #c91c25, #9d0e15);
  color: #ffffff;
}

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

.ai-compose textarea {
  resize: vertical;
}

.ai-push-to-talk {
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.ai-push-to-talk.listening {
  border-color: #7f1016 !important;
  background: #fff0f1 !important;
  color: #8f1118 !important;
}

.ai-speech-status {
  color: #475569 !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
}

.ai-speech-status.error {
  color: var(--brand-primary, #a50f17) !important;
}

@media (max-width: 759px) {
  .ai-suggestions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ai-suggestions button {
    width: 100%;
    border-radius: 9px;
  }

  .ai-chat-thread {
    max-height: 48vh;
    min-height: 250px;
  }

  .ai-message {
    max-width: 94%;
  }

  .ai-compose {
    grid-template-columns: 1fr;
  }

  .ai-compose .primary-button {
    width: 100%;
  }
}

.voice-sale-start {
  width: 100%;
}

.voice-sale-guide {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 2px solid var(--brand-primary, #a50f17);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 18px 50px rgba(46, 18, 20, 0.2);
}

.voice-sale-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.voice-sale-head h3,
.voice-sale-head p {
  margin: 0;
}

.voice-sale-question {
  display: grid;
  gap: 9px;
  color: #111827;
  font-size: 18px;
  font-weight: 900;
}

.voice-sale-question input {
  min-height: 52px;
  font-size: 16px;
}

.voice-sale-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
}

.voice-sale-summary {
  display: grid;
  gap: 7px;
}

.voice-sale-summary div {
  display: grid;
  gap: 2px;
  padding: 9px 11px;
  border: 1px solid #e4ded6;
  border-radius: 8px;
  background: #fffaf8;
}

.voice-sale-summary span {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.voice-sale-summary b {
  color: #111827;
  font-size: 13px;
}

@media (max-width: 759px) {
  .voice-sale-guide {
    position: relative;
    z-index: 3;
    padding: 14px;
  }

  .voice-sale-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .voice-sale-actions button {
    width: 100%;
    min-height: 46px;
  }
}

/* Mobile/PWA command hub: phones should navigate by focused pages, not long dashboard scrolls. */
.mobile-page-strip {
  display: none;
}

.mobile-command-hub {
  display: grid;
  gap: 14px;
  padding-bottom: calc(112px + env(safe-area-inset-bottom));
}

.mobile-hub-head,
.mobile-focus-panel {
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(31, 41, 55, 0.04);
}

.mobile-hub-head {
  display: grid;
  gap: 10px;
  padding: 16px;
  background: #fbf7ef;
}

.mobile-hub-head h2 {
  margin: 2px 0 4px;
  color: #1f2937;
  font-size: 22px;
  font-weight: 850;
  line-height: 1.12;
}

.mobile-hub-head span {
  color: #5f6b7a;
  font-size: 13px;
  font-weight: 750;
}

.mobile-hub-notice {
  padding: 10px 12px;
  border: 1px solid #c8bfae;
  border-left: 4px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #f7f9fb;
  color: #1f2937;
  font-size: 13px;
  font-weight: 750;
}

.mobile-app-title {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #fbf7ef;
  box-shadow: 0 2px 10px rgba(31, 41, 55, 0.04);
}

.mobile-app-title img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #ffffff;
}

.mobile-app-title div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.mobile-app-title b {
  overflow: hidden;
  color: #1f2937;
  font-size: 17px;
  font-weight: 850;
  line-height: 1.15;
  text-overflow: ellipsis;
}

.mobile-app-title span {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 750;
}

.mobile-home-title {
  padding: 12px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #fbf7ef;
  box-shadow: 0 2px 10px rgba(31, 41, 55, 0.04);
}

.mobile-home-title h2 {
  margin: 2px 0 4px;
  color: #1f2937;
  font-size: 21px;
  font-weight: 850;
}

.mobile-home-title span {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 750;
}

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

.module-launcher-screen {
  min-height: calc(100svh - 76px);
  align-content: start;
}

.mobile-module-list {
  display: grid;
  gap: 10px;
}

.mobile-module-section-label {
  margin: 10px 2px -2px;
  color: #5f6b7a;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.mobile-module-section-label:first-child {
  margin-top: 0;
}

.mobile-module-card {
  min-height: 74px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #ffffff;
  color: #1f2937;
  text-align: left;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.04);
}

.mobile-module-card:hover {
  background: #f7f9fb;
}

.mobile-module-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: var(--brand-primary, #a50f17);
  color: #ffffff;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0;
}

.mobile-module-icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mobile-module-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.mobile-module-copy b {
  color: #1f2937;
  font-size: 17px;
  font-weight: 850;
  line-height: 1.15;
}

.mobile-module-copy small {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

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

.mobile-command-card {
  min-height: 104px;
  display: grid;
  align-content: space-between;
  gap: 7px;
  padding: 13px;
  border: 1px solid #d9d2c7;
  border-top: 3px solid #d9d2c7;
  border-radius: 8px;
  background: #ffffff;
  color: #1f2937;
  text-align: left;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.035);
}

.mobile-command-card.primary {
  border-top-color: var(--brand-primary, #a50f17);
  background: #f7f9fb;
}

.mobile-command-card.accent {
  border-top-color: #b7791f;
  background: #fffaf0;
}

.mobile-command-card.warning {
  border-top-color: #b7791f;
}

.mobile-command-card span {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.mobile-command-card b {
  color: var(--brand-primary, #a50f17);
  font-size: 25px;
  font-weight: 850;
  line-height: 1;
}

.mobile-command-card small {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.mobile-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px;
  border-bottom: 1px solid #ebe5dc;
}

.mobile-section-head h3 {
  margin: 0;
  color: #1f2937;
  font-size: 16px;
  font-weight: 850;
}

.mobile-section-head button {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #c8bfae;
  border-radius: 7px;
  background: #ffffff;
  color: var(--brand-primary, #a50f17);
  font-size: 12px;
  font-weight: 800;
}

.mobile-focus-list {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.mobile-focus-row,
.mobile-job-row {
  width: 100%;
  min-width: 0;
  border: 1px solid #d9d2c7;
  border-left: 3px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #ffffff;
  color: #1f2937;
  box-shadow: none;
}

.mobile-focus-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
  text-align: left;
}

.mobile-job-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  overflow: hidden;
}

.mobile-focus-main {
  min-width: 0;
  padding: 12px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}

.mobile-focus-row span,
.mobile-focus-main span {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.mobile-focus-row b,
.mobile-focus-main b {
  overflow: hidden;
  color: #1f2937;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.25;
  text-overflow: ellipsis;
}

.mobile-focus-row small,
.mobile-focus-main small {
  overflow: hidden;
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
}

.mobile-focus-row em {
  color: var(--brand-primary, #a50f17);
  font-size: 12px;
  font-style: normal;
  font-weight: 850;
}

.mobile-next-button {
  min-width: 84px;
  padding: 0 10px;
  border: 0;
  border-left: 1px solid #d9d2c7;
  background: var(--brand-primary, #a50f17);
  color: #ffffff;
  font-size: 12px;
  font-weight: 850;
}

@media (max-width: 759px) {
  .mobile-app-header {
    position: sticky;
    top: 0;
    z-index: 30;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border-bottom: 1px solid #d9d2c7;
    background: rgba(251, 247, 239, 0.98);
    box-shadow: 0 2px 8px rgba(31, 41, 55, 0.055);
    backdrop-filter: blur(10px);
  }

  .mobile-app-header img {
    width: 38px;
    height: 38px;
    object-fit: contain;
    border: 1px solid #d9d2c7;
    border-radius: 8px;
    background: #ffffff;
  }

  .mobile-app-header div {
    display: grid;
    gap: 2px;
    min-width: 0;
  }

  .mobile-app-header b,
  .mobile-app-header span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-app-header b {
    color: #1f2937;
    font-size: 13px;
    font-weight: 850;
  }

  .mobile-app-header span {
    color: #5f6b7a;
    font-size: 11px;
    font-weight: 700;
  }

  .mobile-app-header button {
    min-height: 32px;
    padding: 0 8px;
    border: 1px solid #c8bfae;
    border-radius: 7px;
    background: #ffffff;
    color: var(--brand-primary, #a50f17);
    font-size: 11px;
    font-weight: 850;
  }

  .gpt-float-button {
    right: 14px;
    bottom: calc(18px + env(safe-area-inset-bottom));
    width: 52px;
    height: 52px;
    font-size: 14px;
  }

  .app-shell:not(.mobile-inner-page) .app-content {
    padding-top: 10px !important;
  }

  .topbar .top-nav,
  .topbar .desktop-module-tabs,
  .topbar .map-provider-control {
    display: none !important;
  }

  .topbar,
  .topbar-inner {
    margin: 0 !important;
    padding: 8px 10px !important;
  }

  .brand-row {
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    gap: 8px !important;
  }

  .brand-logo {
    width: 44px !important;
    height: 44px !important;
  }

  .access-pill {
    padding: 6px 8px !important;
    font-size: 10px !important;
    white-space: nowrap;
  }

  .logout-button {
    min-height: 34px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
  }

  .shell-row {
    display: block !important;
    margin-top: 8px !important;
  }

  .control-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .control-row label {
    gap: 4px !important;
    font-size: 10px !important;
  }

  .control-row select,
  .locked-select {
    min-height: 36px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
  }

  .mobile-command-hub {
    gap: 10px;
    padding-bottom: 86px;
  }

  .module-launcher-screen {
    padding-top: 8px;
  }

  .mobile-app-title {
    grid-template-columns: 46px minmax(0, 1fr);
    padding: 10px;
  }

  .mobile-app-title img {
    width: 46px;
    height: 46px;
  }

  .mobile-hub-head {
    padding: 12px;
  }

  .mobile-hub-head h2 {
    font-size: 19px;
  }

  .mobile-command-grid {
    gap: 8px;
  }

  .mobile-command-grid.launcher-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mobile-module-list {
    gap: 9px;
  }

  .mobile-module-card {
    min-height: 70px;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
  }

  .mobile-module-icon {
    width: 48px;
    height: 48px;
    font-size: 15px;
  }

  .mobile-summary-grid {
    gap: 8px;
  }

  .mobile-command-card {
    min-height: 72px;
    gap: 5px;
    padding: 10px;
  }

  .mobile-command-card span {
    font-size: 10px;
  }

  .mobile-command-card b {
    font-size: 19px;
  }

  .mobile-command-card small {
    font-size: 11px;
  }

  .app-shell.mobile-inner-page .app-content {
    padding-top: 10px !important;
  }

  .mobile-page-strip {
    position: sticky;
    top: 0;
    z-index: 8;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    margin: -4px 0 12px;
    padding: 9px 10px;
    border: 1px solid #d9d2c7;
    border-radius: 8px;
    background: rgba(251, 247, 239, 0.96);
    box-shadow: 0 3px 10px rgba(31, 41, 55, 0.06);
    backdrop-filter: blur(10px);
  }

  .mobile-page-strip button {
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid var(--brand-primary, #a50f17);
    border-radius: 7px;
    background: var(--brand-primary, #a50f17);
    color: #ffffff;
    font-size: 12px;
    font-weight: 850;
  }

  .mobile-page-strip span {
    overflow: hidden;
    color: #1f2937;
    font-size: 13px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .home-screen > .dashboard-hero,
  .home-screen > .desktop-control-heading,
  .home-screen > .desktop-focus-strip,
  .home-screen > .dashboard-stats,
  .home-screen > .dashboard-workbench,
  .home-screen > .streamlit-desktop-home {
    display: none !important;
  }

  .topbar {
    border-bottom-width: 1px !important;
  }

  .brand-title {
    font-size: 18px !important;
  }

  .brand-subtitle {
    font-size: 12px !important;
  }

  .mobile-focus-panel {
    display: none !important;
  }
}

@media (min-width: 760px) {
  .mobile-command-hub {
    display: none;
  }
}

.app-shell.app-mode .desktop-brand-banner,
.app-shell.app-mode .topbar {
  display: none !important;
}

.app-shell.app-mode .mobile-app-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: calc(8px + env(safe-area-inset-top)) 10px 9px;
  border-bottom: 1px solid #d9d2c7;
  background: rgba(251, 247, 239, 0.98);
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.055);
}

.app-shell.app-mode .mobile-app-brand {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.app-shell.app-mode .mobile-app-brand img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #ffffff;
}

.app-shell.app-mode .mobile-app-brand div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.app-shell.app-mode .mobile-app-brand b,
.app-shell.app-mode .mobile-app-brand span,
.mobile-access-lock b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell.app-mode .mobile-app-brand b {
  color: #1f2937;
  font-size: 13px;
  font-weight: 850;
}

.app-shell.app-mode .mobile-app-brand span {
  color: #5f6b7a;
  font-size: 11px;
  font-weight: 700;
}

.mobile-access-control,
.mobile-access-lock {
  display: grid;
  gap: 4px;
  color: #1f2937;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: 0;
}

.mobile-access-control select,
.mobile-access-lock {
  min-height: 38px;
  width: 100%;
  padding: 7px 10px;
  border: 1px solid #c8bfae;
  border-radius: 7px;
  background: #ffffff;
  color: var(--brand-primary, #a50f17);
  font-size: 12px;
  font-weight: 850;
}

.mobile-access-lock {
  align-content: center;
  text-transform: none;
}

.mobile-access-lock span {
  color: #5f6b7a;
  font-size: 10px;
  text-transform: uppercase;
}

.app-shell.app-mode .mobile-command-hub {
  display: grid !important;
}

.app-shell.app-mode .app-content {
  max-width: 560px !important;
  margin: 0 auto;
  padding-top: 10px !important;
}

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

.mobile-quick-tabs button {
  min-height: 82px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 4px;
  padding: 9px 6px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #fbf7ef;
  color: #1f2937;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.035);
}

.mobile-quick-tabs span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--brand-primary, #a50f17);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

.mobile-quick-tabs b {
  font-size: 13px;
  font-weight: 850;
}

.mobile-quick-tabs small {
  color: #5f6b7a;
  font-size: 10px;
  font-weight: 750;
}

.files-hub-list {
  display: grid;
  gap: 10px;
}

.files-hub-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid #d9d2c7;
  border-left: 4px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.035);
}

.files-hub-row div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.files-hub-row b,
.files-hub-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.files-hub-row b {
  color: #1f2937;
  font-size: 15px;
  font-weight: 850;
}

.files-hub-row span {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 700;
}

/* Workflow integrity pass: Jobs and Tasks carry the old master-flow context. */
.workflow-mini-strip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #d9d2c7;
  border-left: 4px solid var(--brand-primary, #a50f17);
  border-radius: 6px;
  background: #fffdf7;
}

.workflow-mini-strip.pause {
  border-left-color: #b7791f;
  background: #fff7ed;
}

.workflow-mini-strip span,
.workflow-mini-strip small {
  color: #5f6b7a;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.workflow-mini-strip b {
  min-width: 0;
  overflow: hidden;
  color: #1f2937;
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workflow-detail-panel {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid #d9d2c7;
  border-left: 4px solid var(--brand-primary, #a50f17);
  border-radius: 6px;
  background: #fffdf7;
}

.workflow-detail-panel.pause {
  border-left-color: #b7791f;
  background: #fff7ed;
}

.workflow-detail-panel div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.workflow-detail-panel span {
  color: #5f6b7a;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.workflow-detail-panel b {
  overflow: hidden;
  color: #1f2937;
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.secondary-button.disabled,
.primary-button.disabled,
button:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

@media (max-width: 760px) {
  .workflow-mini-strip {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .workflow-mini-strip small {
    grid-column: 2;
  }

  .workflow-detail-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Scheduling workbench polish */
.calendar-screen,
.calendar-workbench,
.calendar-workbench > *,
.calendar-panel,
.calendar-form-stack,
.calendar-form-stack > *,
.calendar-schedule-panel {
  min-width: 0 !important;
}

.calendar-screen .screen-title {
  border-left-color: var(--brand-primary, #a50f17) !important;
}

.calendar-workbench {
  gap: 16px !important;
}

.calendar-form-panel,
.calendar-schedule-panel {
  border: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 16px rgba(31, 41, 55, 0.05) !important;
}

.calendar-form-panel {
  position: relative;
  z-index: 10;
  overflow: visible !important;
}

.calendar-schedule-panel {
  position: relative;
  z-index: 1;
  overflow: hidden !important;
}

.calendar-form-panel .folder-head,
.calendar-schedule-panel .folder-head {
  padding-bottom: 12px;
  border-bottom: 1px solid #ebe5dc;
}

.calendar-form-stack {
  gap: 12px !important;
}

.calendar-form-stack > label {
  display: grid;
  gap: 6px;
  min-width: 0 !important;
  color: #1f2937;
  font-size: 13px;
  font-weight: 850;
}

.calendar-form-stack input,
.calendar-form-stack select,
.calendar-form-stack textarea {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.calendar-job-picker select {
  text-overflow: ellipsis;
}

.calendar-time-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-bottom: 0 !important;
}

.calendar-length-field {
  grid-column: 1 / -1;
}

.calendar-selected-job-strip {
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  border: 1px solid #d9d2c7;
  border-left: 4px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #fbf7ef;
}

.calendar-selected-job-strip span {
  color: #5f6b7a;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.calendar-selected-job-strip b {
  color: #1f2937;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
}

.calendar-selected-job-strip .badge {
  justify-self: start;
  font-style: normal;
}

.calendar-autofill-card {
  position: relative;
  z-index: 12;
  padding: 12px !important;
  border: 1px solid #d9d2c7 !important;
  border-left: 4px solid var(--brand-primary, #a50f17) !important;
  background: #f6f9fc !important;
}

.calendar-autofill-card > div {
  grid-template-columns: 1fr !important;
}

.calendar-autofill-card label {
  min-width: 0 !important;
}

.calendar-autofill-card input[readonly] {
  min-height: 40px;
  color: #1f2937 !important;
  background: #ffffff !important;
}

.calendar-mode-toggle {
  padding: 4px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #f6f9fc;
}

.calendar-mode-toggle button {
  min-height: 34px !important;
  border: 0 !important;
  border-radius: 7px !important;
}

.calendar-mode-toggle .primary-button {
  background: var(--brand-primary, #a50f17) !important;
}

.calendar-week-grid {
  grid-template-columns: repeat(7, minmax(178px, 1fr)) !important;
  gap: 10px !important;
  overflow-x: auto;
  padding-bottom: 8px;
  max-width: 100%;
}

.calendar-day-column {
  gap: 9px !important;
  min-height: 220px;
  padding: 10px !important;
  border: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #fbf7ef !important;
}

.calendar-day-header {
  padding-bottom: 8px;
}

.calendar-day-header b {
  font-size: 12px !important;
}

.calendar-empty-day {
  min-height: 58px;
  display: grid;
  place-items: center;
  border: 1px dashed #c8bfae;
  border-radius: 8px;
  color: #6b7280;
  background: rgba(255, 255, 255, 0.55);
  font-size: 12px;
  font-weight: 750;
}

.calendar-event-card {
  grid-template-columns: 82px minmax(0, 1fr) 126px !important;
  gap: 10px !important;
  align-items: center;
  padding: 11px !important;
  border: 1px solid #d9d2c7 !important;
  border-left: 4px solid var(--brand-primary, #a50f17) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.035) !important;
}

.calendar-event-card.compact {
  grid-template-columns: 1fr !important;
}

.calendar-event-main b,
.calendar-event-main p,
.schedule-note {
  overflow-wrap: anywhere;
}

.calendar-event-main b {
  line-height: 1.25;
}

.calendar-event-time {
  padding: 8px;
  border-radius: 7px;
  background: #f6f9fc;
}

.calendar-event-time b {
  color: #1f2937 !important;
}

.calendar-event-time span,
.calendar-event-main p,
.schedule-note {
  margin: 0;
}

.schedule-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 7px !important;
}

.schedule-actions .mini-button {
  min-height: 34px !important;
  padding: 0 9px !important;
  font-size: 12px !important;
}

.route-button {
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.add-address-button {
  background: #fff7ed !important;
  color: #92400e !important;
}

.calendar-month-grid {
  grid-template-columns: repeat(7, minmax(118px, 1fr)) !important;
}

.calendar-month-cell {
  border: 1px solid #d9d2c7 !important;
  background: #ffffff !important;
}

@media (min-width: 1080px) {
  .calendar-workbench {
    grid-template-columns: minmax(300px, 340px) minmax(0, 1fr) !important;
  }

  .calendar-form-panel {
    position: sticky;
    top: 86px;
  }
}

@media (max-width: 759px) {
  .calendar-screen .screen-title h2 {
    font-size: 22px !important;
  }

  .calendar-week-grid,
  .calendar-month-grid {
    grid-template-columns: 1fr !important;
    overflow: visible;
  }

  .calendar-event-card {
    grid-template-columns: 1fr !important;
  }

  .calendar-selected-job-strip b {
    font-size: 12px;
  }
}

/* Dispatch-first scheduling board */
.calendar-dispatch-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.calendar-dispatch-metrics article {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.035);
}

.calendar-dispatch-metrics article.needs-work {
  border-left: 4px solid #b7791f;
  background: #fff7ed;
}

.calendar-dispatch-metrics span {
  color: #5f6b7a;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.calendar-dispatch-metrics b {
  color: #1f2937;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
}

.calendar-dispatch-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto auto auto;
  align-items: end;
  gap: 10px;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid #d9d2c7;
  border-radius: 8px;
  background: #fbf7ef;
}

.calendar-dispatch-toolbar label {
  display: grid;
  gap: 6px;
  color: #1f2937;
  font-size: 12px;
  font-weight: 850;
}

.calendar-dispatch-toolbar select {
  min-height: 42px;
  width: 100%;
}

.calendar-appointment-drawer {
  margin-bottom: 12px;
}

.calendar-appointment-drawer .calendar-form-panel {
  max-width: none;
  position: relative !important;
  top: auto !important;
}

.calendar-appointment-drawer .calendar-form-stack {
  grid-template-columns: minmax(260px, 1.1fr) minmax(240px, 0.9fr) minmax(240px, 0.9fr);
  align-items: start;
}

.calendar-appointment-drawer .calendar-job-picker,
.calendar-appointment-drawer .calendar-selected-job-strip,
.calendar-appointment-drawer .calendar-time-grid,
.calendar-appointment-drawer .calendar-autofill-card {
  grid-column: auto;
}

.calendar-appointment-drawer .calendar-form-stack > label:last-of-type,
.calendar-appointment-drawer .primary-button.wide {
  grid-column: 1 / -1;
}

.calendar-route-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
  border: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
}

.calendar-route-list {
  display: grid;
  gap: 8px;
}

.calendar-route-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid #ebe5dc;
  border-radius: 8px;
  background: #f6f9fc;
}

.calendar-route-row > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--brand-primary, #a50f17);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

.calendar-route-row div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.calendar-route-row b,
.calendar-route-row small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calendar-route-row b {
  color: #1f2937;
  font-size: 13px;
  font-weight: 850;
}

.calendar-route-row small {
  color: #5f6b7a;
  font-size: 11px;
  font-weight: 750;
}

.calendar-workbench {
  grid-template-columns: 1fr !important;
}

.calendar-schedule-panel {
  overflow: hidden !important;
}

.calendar-schedule-panel .folder-head {
  background: #ffffff;
}

.calendar-event-main .badge {
  margin-bottom: 4px;
}

.calendar-next-process {
  color: var(--brand-primary, #a50f17) !important;
  font-weight: 850 !important;
}

.calendar-route-text,
.calendar-route-missing {
  padding-top: 4px;
  border-top: 1px solid #ebe5dc;
}

.calendar-route-missing {
  color: #92400e !important;
}

.calendar-week-grid {
  grid-template-columns: repeat(7, minmax(220px, 1fr)) !important;
}

@media (min-width: 1080px) {
  .calendar-workbench {
    grid-template-columns: 1fr !important;
  }

  .calendar-form-panel {
    position: relative !important;
    top: auto !important;
  }
}

@media (max-width: 1079px) {
  .calendar-dispatch-toolbar {
    grid-template-columns: 1fr 1fr;
  }

  .calendar-appointment-drawer .calendar-form-stack {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 759px) {
  .calendar-dispatch-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .calendar-route-row {
    grid-template-columns: 30px minmax(0, 1fr);
  }

  .calendar-route-row .mini-button {
    grid-column: 1 / -1;
  }
}

/* Personal screen preferences: display-only colors, separate from company branding. */
.personal-settings-grid {
  align-items: start;
}

.personal-theme-panel input[type="color"] {
  min-height: 48px;
  padding: 4px;
}

.personal-preview-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 2px solid var(--app-line);
  border-left: 7px solid var(--app-blue);
  border-radius: 8px;
  background: var(--app-card);
}

.personal-preview-card span {
  color: var(--app-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.personal-preview-card b {
  color: var(--app-ink);
  font-size: 20px;
  font-weight: 900;
}

.personal-preview-card p {
  margin: 0;
  color: var(--app-muted);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.4;
}

/* Mobile jobs: reduce button fatigue and keep filters in one swipeable row. */
.jobs-screen .filter-row {
  flex-wrap: nowrap;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  padding-bottom: 2px;
}

.jobs-screen .filter-row::-webkit-scrollbar {
  display: none;
}

.jobs-screen .filter-pill {
  flex: 0 0 auto;
  white-space: nowrap;
}

.jobs-screen .status-accent-blue {
  border-left-color: var(--app-blue) !important;
  background: linear-gradient(90deg, rgba(var(--primary-rgb), 0.07), var(--app-card) 28%) !important;
}

.jobs-screen .status-accent-gold {
  border-left-color: var(--app-amber) !important;
  background: linear-gradient(90deg, rgba(183, 121, 31, 0.11), var(--app-card) 28%) !important;
}

.jobs-screen .status-accent-green {
  border-left-color: var(--green) !important;
  background: linear-gradient(90deg, rgba(4, 120, 87, 0.09), var(--app-card) 28%) !important;
}

@media (max-width: 759px) {
  .jobs-screen .toolbar {
    gap: 8px;
    padding: 10px;
  }

  .jobs-screen .filter-pill {
    min-height: 34px;
    padding: 5px 10px;
    font-size: 12px;
  }

  .jobs-screen .compact-job-card {
    border-left-width: 6px !important;
  }

  .jobs-screen .job-card-body {
    gap: 9px !important;
  }

  .jobs-screen .job-meta {
    grid-template-columns: 1fr !important;
    gap: 5px !important;
    padding: 8px !important;
    border-width: 1px !important;
  }

  .jobs-screen .job-meta div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
  }

  .jobs-screen .job-meta b {
    flex: 0 0 auto;
  }

  .jobs-screen .job-meta span {
    text-align: right;
  }

  .jobs-screen .contact-row {
    display: flex !important;
    justify-content: flex-end;
    gap: 8px !important;
    margin-top: 2px !important;
  }

  .jobs-screen .contact-button[data-icon] {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    flex: 0 0 40px;
    padding: 0 !important;
    border-radius: 999px !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }

  .jobs-screen .contact-button[data-icon]::before {
    content: attr(data-icon);
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: inherit;
    font-size: 15px;
    font-weight: 950;
  }
}

.control-window-button,
.streamlit-row-actions,
.streamlit-row-actions button {
  position: relative;
  z-index: 6;
  pointer-events: auto !important;
  touch-action: manipulation;
}

.programming-switch-button,
.mobile-programming-switch {
  min-height: 38px;
  border: 1px solid #f4c542;
  border-radius: 7px;
  background: #fef3c7;
  color: #111827;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.12);
}

.programming-switch-button:hover,
.mobile-programming-switch:hover {
  background: #fde68a;
}

.mobile-programming-switch {
  width: 100%;
}

.build-version-pill,
.build-version-line {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 3px 9px;
  border: 1px solid #d9d2c7;
  border-radius: 7px;
  background: #fbf7ef;
  color: #4b5563;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.build-version-line {
  margin: -4px 0 10px;
  justify-content: center;
}

.mobile-app-brand small {
  color: #6b7280;
  font-size: 10px;
  font-weight: 850;
}

.company-site-selector {
  display: grid;
  gap: 4px;
  min-width: 220px;
  color: #1f2937;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.company-site-selector select {
  min-height: 38px;
  width: 100%;
  padding: 7px 32px 7px 10px;
  border: 1px solid #c8bfae;
  border-radius: 7px;
  background: #ffffff;
  color: var(--brand-primary, #a50f17);
  font-size: 12px;
  font-weight: 850;
}

.desktop-company-site-selector {
  min-width: 240px;
  color: rgba(255, 255, 255, 0.74);
}

.desktop-company-site-selector select {
  border-color: rgba(255, 255, 255, 0.32);
  background: #fbf7ef;
  color: #1f2937;
}

.mobile-company-site-selector {
  width: 100%;
}

.desktop-module-tabs {
  display: grid !important;
  gap: 10px !important;
  padding: 10px !important;
  border: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #f4f1ea !important;
}

.desktop-module-tabs button {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 10px 12px !important;
  border: 1px solid #d9d2c7 !important;
  border-left: 1px solid #d9d2c7 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #1f2937 !important;
  text-align: left !important;
  box-shadow: 0 2px 8px rgba(31, 41, 55, 0.04) !important;
}

.desktop-module-tabs button:hover,
.desktop-module-tabs button.active {
  border-color: #c8bfae !important;
  background: #fbf7ef !important;
  color: #111827 !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(31, 41, 55, 0.09) !important;
}

.desktop-module-tabs .nav-icon,
.desktop-module-tabs button.active .nav-icon,
.desktop-module-tabs button:hover .nav-icon {
  width: 54px !important;
  height: 54px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--brand-primary, #a50f17) !important;
  border-radius: 8px !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
}

.desktop-module-tabs .nav-icon svg {
  width: 28px !important;
  height: 28px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.desktop-module-tabs .nav-icon span {
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.desktop-module-tabs .nav-copy {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

.desktop-module-tabs .nav-copy b,
.desktop-module-tabs button.active .nav-copy b {
  color: #111827 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
}

.desktop-module-tabs .nav-copy span,
.desktop-module-tabs button.active .nav-copy span,
.desktop-module-tabs button:hover .nav-copy span {
  color: #5f6b7a !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
}

/* Red mobile brand system and iPhone safe-area correction. */
@media (max-width: 759px) {
  body,
  .app-shell.app-mode {
    background: #f6f3ee;
  }

  .app-shell.app-mode .mobile-app-header {
    display: block !important;
    padding: 0;
    border: 0;
    background: #e5e7e9;
    box-shadow: 0 3px 12px rgba(58, 15, 18, 0.16);
  }

  .mobile-app-brand-panel {
    padding: calc(17px + env(safe-area-inset-top)) 18px 18px;
    background:
      radial-gradient(circle at 86% 18%, rgba(255, 255, 255, 0.12), transparent 34%),
      linear-gradient(145deg, #b91620 0%, #970b13 100%);
    border-bottom: 1px solid var(--brand-primary-dark, #71080e);
  }

  .app-shell.app-mode .mobile-app-brand {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 14px;
  }

  .app-shell.app-mode .mobile-app-brand img {
    width: 66px;
    height: 66px;
    padding: 2px;
    border: 3px solid rgba(255, 255, 255, 0.94);
    border-radius: 999px;
    background: #050505;
    box-shadow: 0 7px 16px rgba(38, 0, 2, 0.3);
  }

  .app-shell.app-mode .mobile-app-brand div {
    gap: 3px;
  }

  .app-shell.app-mode .mobile-app-brand b {
    color: #ffffff;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.08;
    white-space: normal;
  }

  .app-shell.app-mode .mobile-app-brand span {
    color: rgba(255, 255, 255, 0.92);
    font-size: 14px;
    font-weight: 720;
  }

  .app-shell.app-mode .mobile-app-brand small {
    color: rgba(255, 255, 255, 0.78);
    font-size: 12px;
    font-weight: 760;
  }

  .mobile-app-access-panel {
    display: grid;
    gap: 12px;
    padding: 14px 16px 17px;
    border-bottom: 1px solid #b9bdc1;
    background: linear-gradient(180deg, #f0f2f3 0%, #dfe2e4 100%);
  }

  .mobile-app-access-panel .mobile-access-control,
  .mobile-app-access-panel .company-site-selector {
    color: #111827;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.02em;
  }

  .mobile-app-access-panel .mobile-access-control select,
  .mobile-app-access-panel .company-site-selector select,
  .mobile-app-access-panel .mobile-access-lock {
    min-height: 48px;
    padding: 10px 42px 10px 13px;
    border: 1px solid #8f969c;
    border-radius: 11px;
    background: linear-gradient(180deg, #ffffff 0%, #e8eaec 100%);
    color: #111827;
    font-size: 15px;
    font-weight: 760;
    box-shadow: 0 3px 8px rgba(31, 41, 55, 0.13);
  }

  .mobile-programming-switch {
    min-height: 48px;
    border: 1px solid #7f070d;
    border-radius: 11px;
    background: linear-gradient(180deg, var(--brand-primary, #cf222c) 0%, var(--brand-primary, #a50f17) 100%);
    color: #ffffff;
    font-size: 15px;
    font-weight: 850;
    box-shadow: 0 5px 12px rgba(122, 7, 14, 0.24);
  }

  .mobile-programming-switch:hover {
    background: linear-gradient(180deg, #dc2a34 0%, #b4121b 100%);
  }

  .app-shell.app-mode .app-content {
    padding: 16px 12px calc(112px + env(safe-area-inset-bottom)) !important;
    background: #f6f3ee;
  }

  .mobile-command-hub {
    gap: 12px;
    padding-bottom: 0;
  }

  .mobile-module-list {
    gap: 10px;
  }

  .mobile-module-section-label {
    margin: 14px 3px 0;
    color: #111827;
    font-size: 12px;
    font-weight: 900;
  }

  .mobile-module-card {
    min-height: 76px;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 13px;
    padding: 10px 13px;
    border: 1px solid #c6c0b7;
    border-radius: 13px;
    background: #fffefd;
    color: #111827;
    box-shadow: 0 3px 9px rgba(45, 36, 30, 0.08);
  }

  .mobile-module-card:hover {
    border-color: #a80f17;
    background: #fff9f8;
  }

  .mobile-module-icon {
    width: 54px;
    height: 54px;
    border: 1px solid #87080f;
    border-radius: 11px;
    background: linear-gradient(145deg, #d12630 0%, #a20e16 100%);
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 4px 9px rgba(135, 8, 15, 0.18);
  }

  .mobile-module-copy b {
    color: #111827;
    font-size: 18px;
    font-weight: 900;
  }

  .mobile-module-copy small {
    color: #333b46;
    font-size: 13px;
    font-weight: 680;
  }

  .gpt-float-button,
  .gpt-float-button.active,
  .gpt-float-button:hover {
    width: 58px;
    height: 58px;
    right: 15px;
    bottom: calc(18px + env(safe-area-inset-bottom));
    border-color: var(--brand-primary-dark, #71080e);
    background: linear-gradient(145deg, #d12630 0%, #a20e16 100%);
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(118, 7, 13, 0.3);
  }

  .app-shell.mobile-inner-page {
    min-height: 100svh;
    padding-top: env(safe-area-inset-top);
    background: #f6f3ee;
  }

  .app-shell.mobile-inner-page .app-content {
    padding-top: 12px !important;
  }

  .mobile-page-strip {
    top: env(safe-area-inset-top);
    margin: 0 0 14px;
    padding: 8px;
    border: 1px solid #c6c0b7;
    border-radius: 11px;
    background: rgba(255, 254, 253, 0.97);
    box-shadow: 0 4px 12px rgba(45, 36, 30, 0.1);
  }

  .mobile-page-strip button {
    min-height: 42px;
    padding: 0 12px;
    border-color: #7f070d;
    border-radius: 9px;
    background: linear-gradient(180deg, var(--brand-primary, #cf222c) 0%, var(--brand-primary, #a50f17) 100%);
    color: #ffffff;
    font-size: 13px;
    font-weight: 850;
    touch-action: manipulation;
  }

  .mobile-page-strip span {
    color: #111827;
    font-size: 14px;
    font-weight: 900;
  }
}

/* Keep selected Jobs filters and the Cost Control command center on-brand. */
.jobs-screen .filter-pill.active,
.jobs-screen .filter-pill.active:hover,
.jobs-screen .filter-pill.active:focus-visible {
  border-color: var(--brand-primary-dark, #71080e) !important;
  background: linear-gradient(180deg, var(--brand-primary, #cf222c) 0%, var(--brand-primary, #a50f17) 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 3px 8px rgba(var(--primary-rgb), 0.2) !important;
}

.jobs-screen .filter-pill.active span {
  background: #ffffff !important;
  color: var(--brand-primary, #a50f17) !important;
}

.cost-control-screen .screen-title {
  border-left-color: var(--brand-primary, #a50f17) !important;
}

.cost-control-command-grid .mobile-command-card {
  border-top-color: var(--brand-primary, #a50f17);
}

@media (max-width: 759px) {
  .cost-control-screen {
    display: grid;
    gap: 12px;
  }

  .cost-control-screen .screen-title {
    padding: 14px !important;
  }

  .cost-control-screen .screen-title p:last-child {
    margin: 6px 0 0;
    color: #475569;
    font-size: 13px;
    line-height: 1.35;
  }
}

.referral-source-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 7px;
}

.referral-source-actions small {
  color: #5f6b7a;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.3;
}

.referral-source-actions .mini-button {
  flex: 0 0 auto;
  border-color: var(--brand-primary-dark, #71080e) !important;
  background: linear-gradient(180deg, var(--brand-primary, #cf222c) 0%, var(--brand-primary, #a50f17) 100%) !important;
  color: #ffffff !important;
}

@media (max-width: 759px) {
  .referral-source-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .referral-source-actions .mini-button {
    width: 100%;
    min-height: 44px !important;
  }
}

/* Compact Jobs list: one scan-friendly row until the user expands it. */
.jobs-screen .collapsible-job-row {
  overflow: hidden;
  border-width: 1px !important;
  border-left-width: 5px !important;
  border-radius: 10px !important;
  background: #ffffff !important;
}

.job-compact-summary {
  width: 100%;
  min-height: 60px;
  display: grid;
  grid-template-columns: minmax(180px, 0.9fr) minmax(240px, 1.5fr);
  align-items: center;
  gap: 14px;
  padding: 9px 12px;
  border: 0 !important;
  background: #ffffff !important;
  color: #111827 !important;
  text-align: left;
  box-shadow: none !important;
}

.job-compact-summary:hover {
  background: #fff8f7 !important;
}

.job-summary-name,
.job-summary-waiting {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.job-summary-name b,
.job-summary-name small,
.job-summary-waiting b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.job-summary-name b {
  color: #111827;
  font-size: 14px;
  font-weight: 900;
}

.job-summary-name small,
.job-summary-waiting small {
  color: #667085;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.job-summary-waiting b {
  color: var(--brand-primary, #a50f17);
  font-size: 13px;
  font-weight: 850;
}

.job-summary-toggle {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 999px;
  color: var(--brand-primary, #a50f17);
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
}

.collapsible-job-row.expanded .job-compact-summary {
  border-bottom: 1px solid #e2dcd4 !important;
  background: #fff8f7 !important;
}

.job-expanded-details {
  padding: 12px !important;
}

.open-expanded-job {
  width: 100%;
}

@media (max-width: 759px) {
  .jobs-screen .list {
    gap: 7px !important;
  }

  .job-compact-summary {
    min-height: 56px;
    grid-template-columns: minmax(105px, 0.8fr) minmax(135px, 1.4fr);
    gap: 8px;
    padding: 8px 9px;
  }

  .job-summary-name b {
    font-size: 12px;
  }

  .job-summary-name small,
  .job-summary-waiting small {
    font-size: 9px;
  }

  .job-summary-waiting b {
    font-size: 11px;
  }

  .job-summary-toggle {
    width: 28px;
    height: 28px;
    font-size: 18px;
  }
}

.photo-stage-lock {
  min-height: 68px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid #c6c0b7;
  border-left: 5px solid var(--brand-primary, #a50f17);
  border-radius: 9px;
  background: #fff8f7;
}

.photo-stage-lock span {
  color: #667085;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.photo-stage-lock b {
  color: var(--brand-primary, #a50f17);
  font-size: 17px;
  font-weight: 900;
}

.photo-stage-lock small {
  color: #475569;
  font-size: 11px;
  font-weight: 650;
}

/* Keep every AI control inside narrow iPhone viewports. */
.ai-assistant-screen,
.ai-assistant-screen * {
  box-sizing: border-box;
}

.ai-assistant-screen,
.ai-assistant-screen .screen-title,
.ai-assistant-screen .ai-assistant-panel,
.ai-assistant-screen .ai-privacy-banner,
.ai-assistant-screen .ai-job-picker,
.ai-assistant-screen .ai-suggestions,
.ai-assistant-screen .ai-chat-thread,
.ai-assistant-screen .ai-compose {
  width: 100%;
  min-width: 0 !important;
  max-width: 100% !important;
}

.ai-assistant-screen {
  overflow-x: clip;
}

.ai-assistant-screen .ai-assistant-panel,
.ai-assistant-screen .ai-chat-thread {
  overflow-x: hidden;
}

.ai-assistant-screen .ai-privacy-banner b,
.ai-assistant-screen .ai-privacy-banner span,
.ai-assistant-screen .ai-suggestions button,
.ai-assistant-screen .ai-message,
.ai-assistant-screen .ai-message p {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere;
  word-break: normal;
  white-space: normal;
}

.ai-assistant-screen .ai-job-picker select,
.ai-assistant-screen .ai-compose textarea,
.ai-assistant-screen .ai-compose button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.ai-assistant-screen .ai-job-picker select {
  text-overflow: ellipsis;
}

@media (max-width: 759px) {
  .ai-assistant-screen {
    padding-right: 8px !important;
    padding-left: 8px !important;
  }

  .ai-assistant-screen .screen-title {
    align-items: flex-start;
    gap: 10px;
    padding: 13px !important;
  }

  .ai-assistant-screen .screen-title > div {
    width: 100%;
    min-width: 0;
  }

  .ai-assistant-screen .screen-title h2 {
    font-size: 24px !important;
  }

  .ai-assistant-screen .screen-title p {
    overflow-wrap: anywhere;
  }

  .ai-assistant-screen .ai-assistant-panel {
    gap: 11px;
    padding: 11px !important;
  }

  .ai-assistant-screen .ai-privacy-banner {
    padding: 10px 11px;
  }

  .ai-assistant-screen .ai-suggestions button {
    display: block;
    padding: 10px !important;
    font-size: 13px !important;
    line-height: 1.3;
    text-align: center;
  }

  .ai-assistant-screen .ai-chat-thread {
    padding: 8px;
  }

  .ai-assistant-screen .ai-message {
    width: auto;
    max-width: 100% !important;
    padding: 9px 10px;
  }

.ai-assistant-screen .ai-message p {
    font-size: 13px !important;
    line-height: 1.45;
  }
}

.primary-button,
.secondary-button,
.danger-button,
.mini-button,
.contact-button,
.next-job-button {
  border-radius: 2px !important;
  font-weight: 600 !important;
  letter-spacing: 0.035em;
}

.workflow-wizard-progress { display: grid; gap: .7rem; margin-bottom: 1rem; padding: .85rem 1rem; border: 1px solid var(--line, #d9dee7); background: #fff; }
.workflow-wizard-progress > div:first-child { display: flex; justify-content: space-between; gap: 1rem; }
.workflow-wizard-progress span { color: var(--muted, #667085); }
.workflow-step-navigator { display: grid; grid-template-columns: minmax(240px, 1fr) auto; align-items: end; gap: .85rem; margin: 0 0 1rem; padding: .85rem 1rem; border: 1px solid #d9dee7; background: #f8f5ee; }
.workflow-step-navigator label { display: grid; gap: .35rem; margin: 0; color: #374151; font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.workflow-step-navigator select { min-height: 42px; width: 100%; border: 1px solid #bfc7d1; border-radius: 2px; background: #fff; color: #17202a; font: inherit; font-size: .92rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.workflow-step-jump-actions { display: flex; align-items: center; justify-content: flex-end; gap: .55rem; flex-wrap: wrap; }
.workflow-focus-card { min-height: 430px; display: grid; align-content: start; gap: 1.25rem; padding: clamp(1.1rem, 2.5vw, 2rem); border: 1px solid var(--line, #d9dee7); background: #fff; }
.workflow-focus-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line, #d9dee7); }
.workflow-focus-head h2 { margin: .2rem 0 .45rem; }
.workflow-focus-head p { margin: 0; max-width: 760px; }
.workflow-focus-card.next-step-active { border-color: #7fc392; box-shadow: inset 5px 0 0 #15803d; }
.workflow-focus-card.next-step-active .workflow-focus-head h2 { color: #15803d; }
.workflow-focus-card.next-step-active .workflow-focus-head .eyebrow { color: #39734a; }
.focused-task-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; width: 100%; max-width: 900px; }
.focused-task-form.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.focused-task-form.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.focused-task-form label { display: grid; gap: .45rem; min-width: 0; color: #273240; font-size: .78rem; font-weight: 700; letter-spacing: .025em; }
.focused-task-form input,
.focused-task-form select,
.focused-task-form textarea { width: 100%; min-width: 0; min-height: 44px; box-sizing: border-box; padding: .7rem .75rem; border: 1px solid #bfc7d1; border-radius: 2px; background: #fff; color: #17202a; font: inherit; font-size: .94rem; font-weight: 500; letter-spacing: 0; }
.focused-task-form textarea { min-height: 82px; resize: vertical; }
.focused-task-form input:focus,
.focused-task-form select:focus,
.focused-task-form textarea:focus { outline: 2px solid color-mix(in srgb, var(--brand, #9b1c1f) 24%, transparent); outline-offset: 1px; border-color: var(--brand, #9b1c1f); }
.focused-task-form .wide { grid-column: 1 / -1; }
.project-requirements-gate { display: grid; gap: 1rem; width: 100%; }
.requirement-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid #cfd5dd; background: #fff; }
.requirement-choice { display: flex; align-items: flex-start; gap: .75rem; min-height: 108px; padding: 1rem; border-right: 1px solid #d9dee5; cursor: pointer; }
.requirement-choice:last-child { border-right: 0; }
.requirement-choice:has(input:checked) { background: color-mix(in srgb, var(--brand, #9b1c1f) 7%, white); box-shadow: inset 0 3px 0 var(--brand, #9b1c1f); }
.requirement-choice input { width: 18px; height: 18px; margin-top: .12rem; accent-color: var(--brand, #9b1c1f); }
.requirement-choice span { display: grid; gap: .35rem; color: #17202a; }
.requirement-choice small { color: #596675; line-height: 1.45; }
.permit-requirement-details { max-width: none; padding: 1rem; border: 1px solid #cfd5dd; background: #f8fafc; }
.permit-requirement-details[hidden] { display: none; }
.permit-gis-review { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1rem; border-left: 3px solid var(--brand, #9b1c1f); background: #fff; }
.permit-gis-actions { display: flex; align-items: center; justify-content: flex-end; gap: .55rem; flex-wrap: wrap; }
.permit-gis-review > div { display: grid; gap: .2rem; min-width: 0; }
.permit-gis-review span, .routed-form-summary span { color: #66717e; font-size: .73rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.permit-gis-review b { overflow-wrap: anywhere; }
.routed-form-summary { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem .85rem; border-top: 1px solid #d9dee5; }
.focused-permit-form-list { display: grid; gap: .65rem; }
.focused-permit-form-list article { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; border: 1px solid #d4dae2; background: #fff; }
.focused-permit-form-list article > div { display: grid; gap: .25rem; }
.focused-permit-form-list article small { color: #65717e; }
.focused-task-note { padding: .85rem 1rem; border-left: 3px solid var(--brand, #9b1c1f); background: #f7f8fa; }
.focused-task-note b { display: block; margin-bottom: .25rem; color: #17202a; font-size: .95rem; }
.focused-task-note p { margin: 0; color: var(--muted, #667085); line-height: 1.5; }
.optional-label { color: var(--muted, #667085); font-size: .72rem; font-weight: 500; }
.focused-document-upload input[type="file"] { padding: .55rem; border-style: dashed; background: #fbfcfd; cursor: pointer; }
.smart-plan-upload { max-width: none; }
.focused-permit-plan-review { display: grid; gap: 1rem; max-width: 980px; }
.plan-discipline-review { border: 1px solid #cfd5dd; background: #fff; }
.plan-discipline-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem .85rem; border-bottom: 1px solid #d9dee5; background: #f7f9fb; }
.plan-discipline-head span { color: #66717e; font-size: .7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.plan-discipline-head b { color: var(--brand, #9b1c1f); font-size: .8rem; }
.plan-discipline-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.plan-discipline-grid label { display: flex; align-items: center; gap: .55rem; min-height: 44px; padding: .65rem .8rem; border-right: 1px solid #e1e5ea; border-bottom: 1px solid #e1e5ea; color: #5f6b78; font-size: .78rem; font-weight: 700; }
.plan-discipline-grid label.detected { background: #f0f8f2; color: #17623a; }
.plan-discipline-grid input { width: 18px !important; height: 18px !important; min-height: 18px !important; margin: 0; accent-color: #17623a; }
.plan-discipline-review > small { display: block; padding: .6rem .8rem; color: #66717e; font-size: .72rem; line-height: 1.45; }
.email-attachment-field { display: grid; gap: .45rem; min-width: 0; color: #273240; font-size: .78rem; font-weight: 700; letter-spacing: .025em; }
.email-attachment-field input[type="file"] { width: 100%; min-width: 0; min-height: 44px; box-sizing: border-box; padding: .55rem; border: 1px dashed #aeb8c4; border-radius: 2px; background: #fbfcfd; color: #17202a; cursor: pointer; }
.email-attachment-field small { color: var(--muted, #667085); font-size: .74rem; font-weight: 500; letter-spacing: 0; line-height: 1.45; }
.submission-review-actions { display: flex; justify-content: flex-end; gap: .65rem; margin: 0 0 1rem; }
.submission-review-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(310px, .85fr); gap: 1rem; align-items: start; }
.submission-review-details { display: grid; gap: .8rem; min-width: 0; }
.submission-review-hero { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 1.15rem; border: 1px solid #cfd5dc; border-left: 3px solid var(--brand, #9b1c1f); background: #fff; }
.submission-review-hero span:first-child { color: var(--muted, #667085); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.submission-review-hero h3 { margin: .25rem 0; }
.submission-review-hero p { margin: 0; color: var(--muted, #667085); }
.submission-review-section { border: 1px solid #cfd5dc; background: #fff; }
.submission-review-section h3 { margin: 0; padding: .72rem 1rem; border-bottom: 1px solid #d9dee5; background: #f6f8fa; font-size: .88rem; letter-spacing: .035em; text-transform: uppercase; }
.submission-review-section dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.submission-detail-row { display: grid; gap: .25rem; min-width: 0; padding: .75rem 1rem; border-right: 1px solid #e0e4e9; border-bottom: 1px solid #e0e4e9; }
.submission-detail-row.wide { grid-column: 1 / -1; }
.submission-detail-row dt { color: var(--muted, #667085); font-size: .7rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.submission-detail-row dd { margin: 0; overflow-wrap: anywhere; color: #17202a; font-size: .93rem; font-weight: 600; line-height: 1.4; }
.submission-map-panel { position: sticky; top: 1rem; display: grid; gap: .8rem; padding: 1rem; border: 1px solid #cfd5dc; background: #fff; }
.submission-map-panel h3 { margin: 0 0 .25rem; }
.submission-map-panel p { margin: 0; color: var(--muted, #667085); }
.submission-map-panel iframe { width: 100%; height: 360px; border: 1px solid #cfd5dc; }
.submission-map-panel .primary-button { text-align: center; }
.submission-review-footer { display: flex; justify-content: flex-end; margin-top: 1rem; }
@media (max-width: 850px) { .submission-review-layout { grid-template-columns: 1fr; } .submission-map-panel { position: static; } .submission-review-section dl { grid-template-columns: 1fr; } .submission-review-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .plan-discipline-review { display: none; } }

.job-contractor-setup { display: grid; gap: 1rem; min-width: 0; }
.trade-summary-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 1px solid #cfd5dc; background: #fff; }
.project-manager-cost-view .trade-summary-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.project-manager-cost-view .trade-summary-strip > div:first-child { display: none; }
.trade-summary-strip > div { display: grid; gap: .25rem; padding: .8rem .9rem; border-right: 1px solid #d9dee5; }
.trade-summary-strip > div:last-child { border-right: 0; }
.trade-summary-strip span { color: var(--muted, #667085); font-size: .68rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.trade-summary-strip b { color: #17202a; font-size: 1.05rem; }
.trade-summary-strip small { color: #667085; font-size: .62rem; font-weight: 700; line-height: 1.35; }
.job-contractor-picker, .trade-role-assignment { width: 100%; min-width: 0; max-width: 100%; border: 1px solid #cfd5dc; background: #fff; box-sizing: border-box; }
.trade-role-assignment { overflow: hidden; }
.workflow-section-heading { padding: .8rem 1rem; border-bottom: 1px solid #d9dee5; background: #f6f8fa; }
.workflow-section-heading h3 { margin: 0 0 .2rem; font-size: .95rem; }
.workflow-section-heading p { margin: 0; color: var(--muted, #667085); font-size: .78rem; }
.job-contractor-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; padding: .8rem; }
.job-contractor-option { display: flex; gap: .65rem; align-items: center; min-width: 0; padding: .7rem; border: 1px solid #d5dae1; background: #fff; cursor: pointer; }
.job-contractor-option.selected { border-color: var(--brand, #9b1c1f); background: color-mix(in srgb, var(--brand, #9b1c1f) 6%, #fff); }
.job-contractor-option input { width: 17px; height: 17px; accent-color: var(--brand, #9b1c1f); }
.job-contractor-option span { display: grid; gap: .15rem; min-width: 0; }
.job-contractor-option small { overflow: hidden; color: var(--muted, #667085); font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.inline-contractor-add { margin: 0 .8rem .8rem; border: 1px solid #d5dae1; }
.inline-contractor-add summary { padding: .7rem .8rem; color: var(--brand, #9b1c1f); font-size: .78rem; font-weight: 700; cursor: pointer; }
.inline-contractor-add .focused-task-form { padding: .8rem; max-width: none; }
.trade-role-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.mark-all-trades { flex: 0 0 auto; }
.trade-role-scrollbar { height: 20px; overflow-x: scroll; overflow-y: hidden; border-top: 1px solid #cfd5dc; border-bottom: 1px solid #cfd5dc; background: #eef1f4; scrollbar-color: var(--brand, #9b1c1f) #d9dee5; scrollbar-width: auto; }
.trade-role-scrollbar > div { width: 1280px; height: 1px; }
.trade-role-scrollbar::-webkit-scrollbar, .trade-role-table::-webkit-scrollbar { height: 15px; }
.trade-role-scrollbar::-webkit-scrollbar-track, .trade-role-table::-webkit-scrollbar-track { background: #d9dee5; }
.trade-role-scrollbar::-webkit-scrollbar-thumb, .trade-role-table::-webkit-scrollbar-thumb { border: 2px solid #d9dee5; border-radius: 999px; background: var(--brand, #9b1c1f); }
.trade-role-table { overflow-x: scroll; scrollbar-color: var(--brand, #9b1c1f) #d9dee5; scrollbar-width: auto; }
.trade-role-head, .trade-role-row { display: grid; grid-template-columns: minmax(185px, 1.3fr) minmax(180px, .95fr) minmax(175px, 1fr) minmax(255px, 1.15fr) 210px 110px 86px; gap: .6rem; align-items: center; min-width: 1280px; padding: .7rem .75rem; }
.trade-role-head { background: #171b23; color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.trade-role-row { border-bottom: 1px solid #e0e4e9; }
.trade-role-row:nth-child(odd) { background: #fafbfc; }
.trade-role-row.all-role-selected { background: color-mix(in srgb, var(--brand, #9b1c1f) 4%, #fff); }
.trade-role-row > div { display: grid; gap: .15rem; min-width: 0; }
.trade-role-row small { overflow: hidden; color: var(--muted, #667085); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.trade-role-row select { width: 100%; min-width: 0; min-height: 38px; border: 1px solid #bfc7d1; border-radius: 2px; background: #fff; }
.trade-contractor-controls { display: grid; min-width: 0; }
.trade-split-contractor-selects { display: none; gap: .35rem; }
.trade-split-contractor-selects label { display: grid; gap: .12rem; min-width: 0; }
.trade-split-contractor-selects label small { color: #687384; font-size: .58rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.trade-role-row[data-role-mode="split"] .trade-primary-contractor { display: none; }
.trade-role-row[data-role-mode="split"] .trade-split-contractor-selects { display: grid; }
.trade-available-amounts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem !important; }
.trade-available-amounts span { display: grid; gap: .1rem; padding: .35rem; border: 1px solid #dde2e8; background: #fff; font-size: .72rem; font-weight: 800; text-align: center; }
.trade-available-amounts small { color: #687384; font-size: .58rem; font-weight: 700; text-transform: uppercase; }
.trade-role-checkboxes { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .32rem !important; }
.trade-role-checkboxes > small { grid-column: 1 / -1; color: #845600; white-space: normal; }
.trade-role-choice { display: flex; align-items: center; justify-content: center; gap: .35rem; min-height: 38px; padding: .38rem .45rem; border: 1px solid #c8cfd8; border-radius: 5px; background: #fff; color: #273445; font-size: .7rem; font-weight: 800; cursor: pointer; }
.trade-role-choice input { width: 16px; height: 16px; margin: 0; accent-color: var(--brand, #9b1c1f); }
.trade-role-choice:has(input:checked) { border-color: var(--brand, #9b1c1f); background: color-mix(in srgb, var(--brand, #9b1c1f) 9%, #fff); color: var(--brand-dark, #6f1014); }
.trade-role-choice:has(input:disabled) { border-color: #d9dde3; background: #eceff2; color: #9299a3; cursor: not-allowed; opacity: .78; }
.trade-role-choice.all-choice:has(input:checked) { background: var(--brand, #9b1c1f); color: #fff; }
.trade-payment-editor { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .28rem !important; }
.trade-assignment-breakdown { grid-column: 1 / -1; display: grid; gap: .2rem; }
.trade-assignment-breakdown > span { display: flex; align-items: center; justify-content: space-between; gap: .35rem; min-width: 0; padding: .2rem .3rem; border: 1px solid #d7dde4; background: #f8fafb; }
.trade-assignment-breakdown > span small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trade-assignment-breakdown > span b { flex: 0 0 auto; }
.trade-payment-editor > span, .trade-payment-editor > label { display: grid; gap: .08rem; min-width: 0; }
.trade-payment-editor small { color: #687384; font-size: .55rem; font-weight: 700; letter-spacing: .025em; text-transform: uppercase; white-space: normal; }
.trade-payment-editor input { width: 100%; min-width: 0; min-height: 30px; padding: .22rem .3rem; border: 1px solid #c8cfd8; border-radius: 2px; font-size: .68rem; }
.trade-payment-editor strong, .trade-payment-editor b { font-size: .72rem; }
.trade-final-owed { padding: .25rem .3rem; border: 1px solid #d3dae2; background: #f6f8fa; }
.trade-client-material-choice { display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: .35rem; margin-top: .35rem; padding: .38rem .42rem; border: 1px solid #c8cfd8; background: #fff; color: #273445; font-size: .63rem; font-weight: 800; line-height: 1.2; cursor: pointer; }
.trade-client-material-choice input { width: 17px; height: 17px; margin: 0; accent-color: var(--brand, #9b1c1f); }
.trade-client-material-choice:has(input:checked) { border-color: #2b7a47; background: #edf8f1; color: #176b35; }
.trade-coverage { padding: .3rem .4rem; border: 1px solid; font-size: .68rem; font-weight: 700; text-align: center; }
.trade-coverage.complete { border-color: #7bb890; color: #176b35; background: #edf8f1; }
.trade-coverage.missing { border-color: #e1bf6c; color: #845600; background: #fff8df; }
.subcontractor-cost-sheet { display: grid; gap: .85rem; padding: 1.2rem; border: 1px solid #c6cbd2; background: #fff; color: #111; }
.cost-sheet-brand { display: grid; justify-items: center; gap: .18rem; }
.cost-sheet-brand img { width: 54px; height: 54px; object-fit: contain; }
.cost-sheet-brand h2 { margin: 0; color: #8f0c11; }
.cost-sheet-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid #343a40; }
.cost-sheet-meta > div { display: grid; grid-template-columns: 155px minmax(0, 1fr); border-right: 1px solid #343a40; border-bottom: 1px solid #343a40; }
.cost-sheet-meta > div:nth-child(3),
.cost-sheet-meta > div:nth-child(7),
.cost-sheet-meta > div:nth-child(8) { display: none; }
.cost-sheet-meta b, .cost-sheet-meta span { padding: .5rem .6rem; }
.cost-sheet-meta b { background: #f0f1f3; }
.subcontractor-cost-sheet table { width: 100%; border-collapse: collapse; font-size: .76rem; }
.subcontractor-cost-sheet th { padding: .52rem .58rem; border: 1px solid #111; background: #101114; color: #fff; text-align: left; }
.cost-sheet-contractor-table th { background: #970b10; }
.subcontractor-cost-sheet td { padding: .48rem .58rem; border: 1px solid #4f555c; }
.subcontractor-cost-sheet tbody tr:nth-child(even) { background: #edf0f3; }
.cost-sheet-contractor-table td:last-child,
.cost-sheet-role-table td:nth-child(4),
.cost-sheet-role-table td:nth-child(5),
.cost-sheet-role-table td:nth-child(6),
.cost-sheet-role-table td:nth-child(7) { text-align: right; }
.subcontractor-cost-sheet tr.total { font-weight: 800; background: #e4ebf2 !important; }
.subcontractor-cost-sheet tr.total td:nth-last-child(2) { background: #d8eadc; }
.subcontractor-cost-sheet > p { margin: 0; color: #4b5563; font-size: .68rem; text-align: center; }
.cost-sheet-print { justify-self: end; }
#trade-cost-print-root { display: none; }
@media (max-width: 900px) {
  .job-contractor-setup,
  .job-contractor-picker,
  .trade-role-assignment,
  .trade-role-table,
  .trade-role-row { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
  .job-contractor-setup,
  .trade-role-assignment { overflow-x: clip; }
  .trade-summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .job-contractor-options { grid-template-columns: 1fr; }
  .trade-role-heading { align-items: stretch; flex-direction: column; }
  .mark-all-trades { width: 100%; }
  .trade-role-scrollbar { display: none; }
  .trade-role-head { display: none; }
  .trade-role-table {
    padding: .55rem .45rem calc(7rem + env(safe-area-inset-bottom));
    overflow-x: clip;
    overflow-y: visible;
    background: #eef1f4;
  }
  .trade-role-row {
    grid-template-columns: minmax(0, 1fr);
    margin-bottom: .7rem;
    padding: .75rem;
    border: 1px solid #cfd5dc;
    border-radius: 8px;
    background: #fff !important;
  }
  .trade-role-row > * { grid-column: 1 / -1; min-width: 0; max-width: 100%; box-sizing: border-box; }
  .trade-role-row select { width: 100%; max-width: 100%; scroll-margin-block: 8rem; }
  .trade-role-row option { max-width: 100%; }
  .trade-role-checkboxes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cost-sheet-meta { grid-template-columns: 1fr; }
  .subcontractor-cost-sheet { overflow-x: auto; }
  .subcontractor-cost-sheet table { min-width: 760px; }
}
@media print {
  @page tradeCostSheet { size: landscape; margin: .35in; }
  html[data-print-trade-cost-sheet="true"] body > * { display: none !important; }
  html[data-print-trade-cost-sheet="true"] body > #trade-cost-print-root {
    display: block !important;
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html[data-print-trade-cost-sheet="true"] #trade-cost-print-root .subcontractor-cost-sheet {
    display: grid !important;
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    border: 0 !important;
    overflow: visible !important;
    page: tradeCostSheet;
  }
  html[data-print-trade-cost-sheet="true"] #trade-cost-print-root table {
    min-width: 0 !important;
    break-inside: auto;
  }
  html[data-print-trade-cost-sheet="true"] #trade-cost-print-root tr { break-inside: avoid; }
}

.settings-calculated-field { display: grid; align-content: center; gap: .2rem; min-height: 82px; padding: .7rem .8rem; border: 1px solid #cfd5dc; background: #f6f8fa; }
.settings-calculated-field span, .settings-calculated-field small { color: #667085; font-size: .72rem; }
.settings-calculated-field b { color: #8f0c11; font-size: 1.35rem; }

.focused-launch-card, .focused-email-preview { display: grid; gap: .8rem; max-width: 780px; padding: 1.15rem; border: 1px solid var(--line, #d9dee7); background: #f8f9fb; }
.focused-launch-card .primary-button, .focused-email-preview .primary-button { justify-self: start; }
.focused-email-preview > div { display: grid; gap: .2rem; }
.focused-email-preview span { color: var(--muted, #667085); font-size: .78rem; text-transform: uppercase; }
.workflow-wizard-actions { position: sticky; bottom: 0; z-index: 4; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .75rem; padding: 1rem 0; background: linear-gradient(to bottom, rgba(247,248,250,0), #f7f8fa 22%); }
.workflow-wizard-actions button { min-height: 48px; }
.workflow-gate-note { margin: 0; padding: .7rem; text-align: center; color: #8a5a00; background: #fff8df; border: 1px solid #eedb92; }
.company-process-builder.workflow-locked { border-color: #77a88b; box-shadow: inset 4px 0 0 #16804d; }
.company-process-builder.workflow-locked .streamlit-detail-head { background: #edf8f1; }
.company-process-builder.workflow-locked .process-builder-grid { opacity: .72; }
.workflow-lock-confirmation { background: #edf8f1 !important; color: #145c38; }

@media (min-width: 761px) {
  .app-shell:not(.app-mode) .workflow-wizard-actions {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 10px;
  }
  .app-shell:not(.app-mode) .workflow-wizard-actions button {
    width: 190px;
    min-width: 190px;
    max-width: 190px;
    min-height: 50px;
    padding: 8px 12px;
    line-height: 1.2;
    white-space: normal;
  }
  .app-shell:not(.app-mode) .workflow-nav-back { order: 1; }
  .app-shell:not(.app-mode) .workflow-nav-next { order: 2; }
  .app-shell:not(.app-mode) .workflow-save-action { order: 3; }
}

@media (max-width: 720px) {
  .workflow-focus-card { width: 100%; max-width: 100%; min-width: 0; min-height: 360px; box-sizing: border-box; padding: .8rem; overflow: visible; }
  .workflow-focus-head { display: grid; }
  .workflow-step-navigator { grid-template-columns: 1fr; }
  .workflow-step-jump-actions { justify-content: stretch; }
  .workflow-step-jump-actions button { flex: 1 1 160px; }
  .focused-task-form.two, .focused-task-form.three { grid-template-columns: 1fr; }
  .requirement-choice-grid { grid-template-columns: 1fr; }
  .requirement-choice { min-height: 0; border-right: 0; border-bottom: 1px solid #d9dee5; }
  .requirement-choice:last-child { border-bottom: 0; }
  .permit-gis-review, .routed-form-summary, .focused-permit-form-list article { align-items: stretch; flex-direction: column; }
  .workflow-wizard-actions { position: static; grid-template-columns: 1fr 1fr 1fr; padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }
}

/* Recovered intake -> Xactimate -> trades -> billing workflow */
.estimate-document-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .65rem; margin: 1rem 0; }
.estimate-document { border: 1px solid var(--line, #d9dee7); border-radius: 8px; padding: .75rem; background: #f7f8fa; display: grid; gap: .3rem; min-width: 0; }
.estimate-document.loaded { border-color: #8bc5a4; background: #edf8f1; }
.estimate-document span { font-size: .75rem; color: var(--muted, #667085); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trade-assignment-table { overflow-x: auto; margin: 1rem 0; }
.trade-assignment-head, .trade-assignment-row { display: grid; grid-template-columns: minmax(180px, 1.6fr) repeat(3, minmax(90px, .65fr)) minmax(125px, .8fr) minmax(150px, 1fr) minmax(120px, .8fr); gap: .55rem; align-items: center; min-width: 980px; padding: .65rem; }
.trade-assignment-head { background: #171b23; color: #fff; border-radius: 7px 7px 0 0; font-size: .75rem; font-weight: 700; text-transform: uppercase; }
.trade-assignment-row { border: 1px solid var(--line, #d9dee7); border-top: 0; }
.trade-assignment-row:nth-child(odd) { background: #fafafa; }
.trade-assignment-row > div { display: grid; gap: .25rem; }
.trade-assignment-row small { color: var(--muted, #667085); }
.recovered-flow-list { display: grid; gap: .45rem; margin: 1rem 0; }
.recovered-flow-step { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: .8rem; border: 1px solid var(--line, #d9dee7); border-radius: 7px; padding: .75rem; opacity: .72; }
.recovered-flow-step.complete { background: #f1f8f3; opacity: .9; }
.recovered-flow-step.current { border: 2px solid #b91c1c; background: #fff7f7; opacity: 1; box-shadow: 0 5px 18px rgba(var(--primary-rgb), .08); }
.recovered-flow-step > div { display: grid; gap: .12rem; }
.recovered-flow-step small { color: var(--muted, #667085); text-transform: uppercase; letter-spacing: .05em; }
.recovered-flow-step p { margin: .15rem 0 0; font-size: .82rem; color: var(--muted, #667085); }
.flow-state { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #e9edf3; font-weight: 900; }
.recovered-flow-step.complete .flow-state { background: #247a46; color: #fff; }
.recovered-flow-step.current .flow-state { background: #b91c1c; color: #fff; }

@media (max-width: 900px) {
  .estimate-document-grid { grid-template-columns: 1fr 1fr; }
  .recovered-flow-step { grid-template-columns: 28px minmax(0, 1fr); }
  .recovered-flow-step > .badge { grid-column: 2; justify-self: start; }
}

/* Lead intake workbench polish */
.lead-intake-screen {
  background: #f6f7f9;
}

.lead-intake-panel {
  display: grid;
  gap: 16px;
  border: 1px solid #d8dee6 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.06) !important;
}

.lead-intake-backbar {
  margin-bottom: 8px;
}

.lead-intake-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e2e8f0;
}

.lead-intake-title-block {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.lead-intake-id-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.lead-intake-job-id {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #f8fafc;
  color: #1a202c;
  font-size: 12px;
  font-weight: 900;
}

.lead-intake-title-block h2 {
  margin: 0;
  color: #111827;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.08;
  letter-spacing: 0;
}

.lead-intake-title-block p,
.lead-intake-title-block small {
  margin: 0;
  color: #4b5563;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}

.lead-intake-title-block small {
  color: #718096;
  font-size: 12px;
  font-weight: 650;
}

.lead-missing-banner {
  display: grid;
  grid-template-columns: minmax(190px, 0.9fr) minmax(0, 1.6fr);
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid #f0b8a8;
  border-left: 5px solid #b42318;
  border-radius: 8px;
  background: #fff4f1;
}

.lead-missing-banner b,
.lead-missing-banner p {
  margin: 0;
}

.lead-missing-banner b {
  color: #7a271a;
  font-size: 14px;
  font-weight: 950;
}

.lead-missing-banner p {
  margin-top: 3px;
  color: #7f4b42;
  font-size: 12px;
  font-weight: 700;
}

.lead-missing-banner > div:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.lead-missing-banner span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid #f0b8a8;
  border-radius: 6px;
  background: #ffffff;
  color: #7a271a;
  font-size: 12px;
  font-weight: 900;
}

.lead-intake-card-stack {
  display: grid;
  gap: 14px;
}

.lead-intake-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
}

.lead-intake-card.schedule-card {
  border-left: 5px solid #1f3b57;
  background: #fbfdff;
}

.lead-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.lead-card-head b,
.lead-card-head p {
  margin: 0;
}

.lead-card-head b {
  color: #1a202c;
  font-size: 17px;
  font-weight: 950;
}

.lead-card-head p {
  margin-top: 3px;
  color: #718096;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
}

.lead-card-grid {
  display: grid;
  gap: 12px;
}

.lead-card-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lead-card-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lead-intake-field {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: #4a5568;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0;
}

.lead-intake-field > span {
  color: #4a5568;
}

.lead-intake-field input,
.lead-intake-field textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  background: #ffffff;
  color: #111827;
  padding: 9px 10px !important;
  font-size: 14px;
  font-weight: 650;
  box-shadow: none !important;
}

.lead-intake-field textarea {
  min-height: 92px;
  resize: vertical;
}

.lead-intake-field input::placeholder,
.lead-intake-field textarea::placeholder {
  color: #7b8794;
  font-weight: 500;
}

.lead-intake-field input:focus,
.lead-intake-field textarea:focus {
  border-color: #1f3b57 !important;
  outline: 3px solid rgba(31, 59, 87, 0.14);
}

.lead-intake-field.required-missing {
  padding: 9px;
  border: 1px solid #f59e0b;
  border-radius: 7px;
  background: #fffbeb;
}

.lead-intake-field.wide,
.lead-intake-actions {
  grid-column: 1 / -1;
}

.lead-intake-field .referral-source-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.lead-intake-field .referral-source-actions small {
  color: #718096;
  font-size: 11px;
  font-weight: 650;
}

.lead-tenant-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid #d8dee6;
  border-radius: 7px;
  background: #f8fafc;
  color: #1a202c;
  font-size: 13px;
  font-weight: 850;
}

.lead-tenant-toggle input {
  width: 18px;
  height: 18px;
  accent-color: #1f3b57;
}

.lead-tenant-fields[hidden] {
  display: none !important;
}

.lead-intake-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 2px;
}

@media (max-width: 980px) {
  .lead-card-grid.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .lead-intake-header,
  .lead-card-head,
  .lead-missing-banner {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .lead-card-grid.two,
  .lead-card-grid.three {
    grid-template-columns: 1fr;
  }

  .lead-intake-card {
    padding: 14px;
  }

  .lead-intake-actions {
    justify-content: stretch;
  }

  .lead-intake-actions button,
  .lead-card-head .small-action {
    width: 100%;
  }
}

/* Desktop v104: structured workstation shell. Mobile/PWA styles remain unchanged. */
.desktop-utility-header,
.desktop-sidebar-footer {
  display: none;
}

@media (min-width: 1080px) {
  .app-shell:not(.app-mode) {
    min-height: 100vh;
    display: grid !important;
    grid-template-columns: 238px minmax(0, 1fr) !important;
    grid-template-rows: 64px minmax(0, 1fr) !important;
    align-items: stretch !important;
    background: #f4f6f8 !important;
  }

  .app-shell:not(.app-mode)::before {
    content: none !important;
  }

  .app-shell:not(.app-mode) .desktop-utility-header {
    position: sticky;
    top: 0;
    z-index: 30;
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0 22px;
    border-bottom: 1px solid #d7dce2;
    background: #ffffff;
    color: #20252c;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
  }

  .desktop-utility-brand,
  .desktop-utility-actions,
  .desktop-profile-summary {
    display: flex;
    align-items: center;
  }

  .desktop-utility-brand {
    gap: 11px;
    min-width: 0;
  }

  .desktop-utility-brand img {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 1px solid #cfd5dc;
    border-radius: 3px;
    object-fit: cover;
  }

  .desktop-utility-brand > div,
  .desktop-workspace-context,
  .desktop-profile-summary > div {
    display: grid;
    gap: 1px;
    min-width: 0;
  }

  .desktop-utility-brand b {
    color: #171b21;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.1;
  }

  .desktop-utility-brand span,
  .desktop-workspace-context small,
  .desktop-profile-summary small {
    color: #69717d;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.02em;
  }

  .desktop-utility-actions {
    justify-content: flex-end;
    gap: 18px;
    min-width: 0;
  }

  .desktop-workspace-context {
    padding-right: 18px;
    border-right: 1px solid #e1e5ea;
    text-align: right;
  }

  .desktop-workspace-context b {
    color: #262c34;
    font-size: 12px;
    font-weight: 850;
  }

  .desktop-new-sale {
    min-height: 36px !important;
    padding: 0 15px !important;
    border-radius: 3px !important;
    background: var(--brand-primary, #a50f17) !important;
    box-shadow: none !important;
  }

  .desktop-profile-summary {
    gap: 9px;
    min-width: 138px;
  }

  .desktop-profile-summary > span {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    border: 1px solid #cbd1d8;
    border-radius: 3px;
    background: #f0f2f5;
    color: #8c0d14;
    font-size: 13px;
    font-weight: 900;
  }

  .desktop-profile-summary b {
    color: #20252c;
    font-size: 12px;
    font-weight: 850;
  }

  .app-shell:not(.app-mode) > .topbar {
    position: sticky !important;
    top: 64px !important;
    z-index: 20;
    grid-column: 1;
    grid-row: 2;
    width: 238px !important;
    height: calc(100vh - 64px) !important;
    min-height: 0 !important;
    overflow-y: auto;
    padding: 0 !important;
    border: 0 !important;
    border-right: 1px solid #171b20 !important;
    background: #252b33 !important;
    color: #f8fafc;
  }

  .app-shell:not(.app-mode) > .topbar .topbar-inner {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 12px 14px !important;
    background: #252b33 !important;
  }

  .app-shell:not(.app-mode) > .topbar .brand-row {
    display: none !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs {
    order: 1;
    display: grid !important;
    gap: 2px !important;
    width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs::before {
    content: "NAVIGATION";
    display: block;
    padding: 0 10px 8px;
    color: #929aa5;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.12em;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button {
    min-height: 42px !important;
    display: grid !important;
    grid-template-columns: 25px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    border-radius: 2px !important;
    background: transparent !important;
    color: #c8ced6 !important;
    text-align: left !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button:hover {
    border-left-color: #7d858f !important;
    background: #303741 !important;
    color: #ffffff !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button.active {
    border-left-color: #d11a24 !important;
    background: #343b45 !important;
    color: #ffffff !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs .nav-icon,
  .app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon,
  .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon {
    width: 22px !important;
    height: 22px !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #d6dbe1 !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon {
    color: #ef4a53 !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs .nav-icon svg {
    width: 19px !important;
    height: 19px !important;
    stroke-width: 1.8 !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs .nav-copy {
    display: block !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs .nav-copy b,
  .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-copy b {
    color: inherit !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    line-height: 1.15 !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs .nav-copy span {
    display: none !important;
  }

  .app-shell:not(.app-mode) > .topbar .shell-row {
    order: 2;
    display: block;
    margin: auto 0 0 !important;
    padding-top: 14px;
    border-top: 1px solid #3c434d;
  }

  .app-shell:not(.app-mode) > .topbar .top-nav {
    display: none !important;
  }

  .app-shell:not(.app-mode) > .topbar .control-row {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 9px;
  }

  .app-shell:not(.app-mode) > .topbar .control-row label {
    color: #9da5af !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  .app-shell:not(.app-mode) > .topbar .control-row select,
  .app-shell:not(.app-mode) > .topbar .locked-select {
    min-height: 34px !important;
    padding: 6px 9px !important;
    border: 1px solid #4c545f !important;
    border-radius: 2px !important;
    background: #303741 !important;
    color: #f3f4f6 !important;
    font-size: 11px !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .desktop-sidebar-footer {
    order: 3;
    display: grid;
    gap: 8px;
  }

  .desktop-sidebar-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
  }

  .app-shell:not(.app-mode) .desktop-sidebar-footer .access-pill,
  .app-shell:not(.app-mode) .desktop-sidebar-footer .build-version-pill {
    min-height: 24px !important;
    display: inline-flex !important;
    flex: 1 1 auto;
    justify-content: center;
    padding: 3px 6px !important;
    border: 1px solid #4c545f !important;
    border-radius: 2px !important;
    background: transparent !important;
    color: #b8c0ca !important;
    font-size: 9px !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .desktop-sidebar-footer .programming-switch-button,
  .app-shell:not(.app-mode) .desktop-sidebar-footer .logout-button {
    width: 100%;
    min-height: 34px !important;
    border-radius: 2px !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .desktop-sidebar-footer .programming-switch-button {
    border: 1px solid #59616c !important;
    background: #303741 !important;
    color: #f3f4f6 !important;
  }

  .app-shell:not(.app-mode) .desktop-sidebar-footer .logout-button {
    border: 1px solid #8c0d14 !important;
    background: var(--brand-primary, #a50f17) !important;
  }

  .app-shell:not(.app-mode) > .app-content {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    min-height: calc(100vh - 64px);
    padding: 0 !important;
    background: #f4f6f8 !important;
  }

  .app-shell:not(.app-mode) .screen {
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    padding: 24px 28px 40px !important;
  }

  .app-shell:not(.app-mode) .streamlit-desktop-home {
    gap: 18px !important;
  }

  .app-shell:not(.app-mode) .streamlit-page-heading {
    min-height: 58px;
    padding: 0 0 16px !important;
    border: 0 !important;
    border-bottom: 1px solid #d9dee5 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .streamlit-page-heading h2 {
    font-size: 23px !important;
    font-weight: 800 !important;
    letter-spacing: -0.015em;
  }

  .app-shell:not(.app-mode) .streamlit-page-actions button,
  .app-shell:not(.app-mode) .streamlit-detail-head .mini-button,
  .app-shell:not(.app-mode) .streamlit-row-actions button,
  .app-shell:not(.app-mode) .screen-title button,
  .app-shell:not(.app-mode) .toolbar button {
    border-radius: 3px !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .streamlit-metric-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .app-shell:not(.app-mode) .streamlit-metric-card {
    min-height: 92px !important;
    align-content: space-between;
    padding: 15px 16px !important;
    border: 1px solid #d9dee5 !important;
    border-top: 2px solid var(--brand-primary, #a50f17) !important;
    border-radius: 3px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    text-align: left;
    transform: none !important;
  }

  .app-shell:not(.app-mode) .streamlit-metric-card:hover,
  .app-shell:not(.app-mode) .streamlit-metric-card.active {
    border-color: #bdc4cc !important;
    border-top-color: var(--brand-primary, #a50f17) !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), 0.12) !important;
  }

  .app-shell:not(.app-mode) .streamlit-metric-card b {
    color: #616a76 !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  .app-shell:not(.app-mode) .streamlit-metric-card h3 {
    margin-top: 10px !important;
    color: #20252c !important;
    font-size: 31px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
  }

  .app-shell:not(.app-mode) .streamlit-detail-panel {
    min-height: 330px;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid #d9dee5 !important;
    border-radius: 3px !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .streamlit-detail-head {
    min-height: 58px;
    padding: 13px 16px !important;
    border-bottom: 1px solid #e1e5ea !important;
    background: #fafbfc;
  }

  .app-shell:not(.app-mode) .streamlit-detail-head h3 {
    font-size: 15px !important;
    font-weight: 850 !important;
    letter-spacing: 0.01em;
    text-transform: uppercase;
  }

  .app-shell:not(.app-mode) .streamlit-job-board {
    gap: 0 !important;
    padding: 0 !important;
  }

  .app-shell:not(.app-mode) .streamlit-job-row {
    padding: 13px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid #e4e7eb !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .streamlit-job-row:hover,
  .app-shell:not(.app-mode) .streamlit-job-row.alt {
    background: #f8f9fb !important;
  }

  .app-shell:not(.app-mode) .streamlit-status-box,
  .app-shell:not(.app-mode) .streamlit-next-box {
    min-height: 50px !important;
    border-radius: 2px !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .compact-empty {
    min-height: 250px;
    display: grid;
    place-items: center;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #707985;
  }

  .app-shell:not(.app-mode) .panel,
  .app-shell:not(.app-mode) .screen-title,
  .app-shell:not(.app-mode) .workspace-tile,
  .app-shell:not(.app-mode) .dashboard-card,
  .app-shell:not(.app-mode) .mobile-command-card,
  .app-shell:not(.app-mode) .compact-job-card,
  .app-shell:not(.app-mode) .lead-intake-panel,
  .app-shell:not(.app-mode) .lead-intake-card {
    border-radius: 4px !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .badge,
  .app-shell:not(.app-mode) .status-pill,
  .app-shell:not(.app-mode) .filter-pill,
  .app-shell:not(.app-mode) .build-version-pill,
  .app-shell:not(.app-mode) .access-pill {
    border-radius: 2px !important;
  }
}

.customer-detail-toolbar { margin-bottom: 10px; }
.customer-detail-contact-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid #d7dce2;
  background: #fff;
}
.customer-detail-contact-grid > div {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 13px 15px;
  border-right: 1px solid #e2e6eb;
}
.customer-detail-contact-grid > div:last-child { border-right: 0; }
.customer-detail-contact-grid small,
.customer-job-detail-grid small { color: #667085; font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
.customer-detail-contact-grid a,
.customer-detail-contact-grid span { overflow-wrap: anywhere; color: #273445; }
.customer-history-section { margin-top: 18px; }
.customer-history-heading { display: flex; justify-content: space-between; gap: 16px; align-items: end; padding-bottom: 10px; border-bottom: 1px solid #cfd5dc; }
.customer-history-heading h3,
.customer-history-heading p { margin: 0; }
.customer-history-heading > span { color: #667085; font-size: 11px; }
.customer-history-records { border: 1px solid #d7dce2; border-top: 0; background: #fff; }
.customer-job-record { padding: 15px; border-bottom: 1px solid #e2e6eb; }
.customer-job-record:last-child { border-bottom: 0; }
.customer-job-record-head { display: flex; justify-content: space-between; gap: 18px; align-items: start; }
.customer-job-record-head h4,
.customer-job-record-head p { margin: 0; }
.customer-job-record-head > div { display: grid; gap: 5px; }
.customer-job-record-head > div:last-child { justify-items: end; }
.customer-job-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 14px; border: 1px solid #e2e6eb; }
.customer-job-detail-grid > div { min-width: 0; display: grid; gap: 4px; padding: 10px 12px; border-right: 1px solid #e2e6eb; border-bottom: 1px solid #e2e6eb; }
.customer-job-detail-grid span { overflow-wrap: anywhere; color: #273445; }
.customer-history-notes { margin-top: 16px; padding: 14px 16px; border: 1px solid #d7dce2; border-left: 2px solid #8f1523; background: #fff; }
.customer-history-notes h3,
.customer-history-notes p { margin: 0; }
.customer-history-notes p { margin-top: 7px; color: #475467; }

@media (max-width: 850px) {
  .customer-detail-contact-grid,
  .customer-job-detail-grid { grid-template-columns: 1fr 1fr; }
  .customer-job-record-head,
  .customer-history-heading { align-items: stretch; flex-direction: column; }
  .customer-job-record-head > div:last-child { justify-items: start; }
}

/* v108 enterprise layout system: flat, aligned, quiet, and consistent. */
.enterprise-sales-intake .screen-title {
  padding: 14px 0 10px !important;
  border: 0 !important;
  border-bottom: 1px solid #cfd5dc !important;
  background: transparent !important;
  box-shadow: none !important;
}

.enterprise-intake-tools {
  margin: 12px 0 16px;
  padding: 14px 0;
  border: 0;
  border-bottom: 1px solid #d9dee5;
  background: #fff;
}

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

.enterprise-intake-tools .form-grid {
  grid-template-columns: minmax(280px, 1fr) auto !important;
  align-items: end;
  padding: 0 !important;
}

.enterprise-intake-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.enterprise-sales-layout {
  display: block !important;
}

.enterprise-hidden-summary {
  display: none !important;
}

.enterprise-sales-form {
  gap: 0 !important;
  border: 1px solid #cfd5dc;
  background: #fff;
}

.enterprise-sales-form .sales-form-section,
.enterprise-additional-section {
  border: 0 !important;
  border-bottom: 1px solid #d9dee5 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

.enterprise-sales-form .sales-form-section-head,
.enterprise-additional-section > .sales-form-section-head {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  padding: 14px 18px 8px !important;
  border: 0 !important;
  background: #fff !important;
}

.enterprise-sales-form .sales-step {
  display: inline !important;
  min-width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #202833 !important;
  font-size: 16px !important;
}

.enterprise-sales-form .sales-step::after { content: "."; }
.enterprise-sales-form .sales-form-section-head h3 { font-size: 15px !important; text-transform: uppercase; letter-spacing: .035em; }
.enterprise-sales-form .sales-form-section-head p { margin-top: 2px !important; font-size: 12px !important; font-weight: 500 !important; }

.enterprise-sales-form .sales-form-grid {
  padding: 10px 18px 18px !important;
  gap: 10px 14px !important;
  background: #fff !important;
}

.enterprise-property-grid { grid-template-columns: 2fr 1fr 1fr !important; }
.enterprise-contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.enterprise-source-grid { grid-template-columns: 1fr !important; }
.enterprise-project-setup-grid { grid-template-columns: 1fr !important; }
.new-sale-project-setup { display: grid; border: 1px solid #cfd5dd; background: #fff; }
.sale-setup-choice { display: grid; grid-template-columns: minmax(185px, .7fr) minmax(0, 1.3fr); align-items: center; gap: 1rem; min-height: 54px; padding: .55rem .8rem; border-bottom: 1px solid #dce1e7; }
.sale-setup-choice:last-child { border-bottom: 0; }
.sale-setup-choice > b { color: #26313d; font-size: .82rem; }
.sale-choice-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.sale-choice-buttons label { position: relative; display: block; min-width: 0; cursor: pointer; }
.sale-choice-buttons input { position: absolute; width: 1px !important; height: 1px !important; min-height: 1px !important; opacity: 0; pointer-events: none; }
.sale-choice-buttons span { display: block; min-height: 38px; padding: .58rem .7rem; border: 1px solid #c5ccd5; background: #f7f8fa; color: #354151; font-size: .78rem; font-weight: 700; line-height: 1.3; }
.sale-choice-buttons label:has(input:checked) span { border-color: var(--brand, #9b1c1f); background: color-mix(in srgb, var(--brand, #9b1c1f) 9%, white); color: var(--brand, #9b1c1f); box-shadow: inset 3px 0 0 var(--brand, #9b1c1f); }

.enterprise-location-status {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 42px;
  padding: 6px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #d9dee5 !important;
  border-radius: 0 !important;
  background: #fff !important;
}

.enterprise-sales-form input,
.enterprise-sales-form textarea,
.enterprise-sales-form select,
.enterprise-intake-tools input {
  min-height: 40px !important;
  border: 1px solid #bfc7d1 !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.enterprise-sales-form .required-missing input,
.enterprise-sales-form .required-missing textarea {
  border: 1px solid #c98a22 !important;
  background: #fffdf8 !important;
}

.enterprise-optional-list {
  gap: 0 !important;
  padding: 0 18px 14px;
  background: #fff;
}

.enterprise-optional-list .sales-optional-panel {
  border: 0 !important;
  border-top: 1px solid #e0e4e9 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

.enterprise-optional-list .sales-optional-toggle {
  min-height: 42px;
  padding: 8px 2px !important;
  border: 0 !important;
  background: #fff !important;
}

.enterprise-optional-list .sales-optional-toggle input { min-height: auto !important; accent-color: #7f1d1d; }
.enterprise-optional-list .optional-panel-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; padding: 8px 0 16px !important; }

.enterprise-sales-form .sales-submit-panel {
  position: static;
  bottom: auto;
  z-index: auto;
  margin: 8px 0 0 !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-top: 1px solid #bfc7d1 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

.enterprise-sales-form .sales-submit-panel .primary-button {
  border-color: #5f1117 !important;
  background: #7f1d1d !important;
}

.enterprise-sales-form .sales-bottom-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.enterprise-sales-form .sales-bottom-actions button {
  width: 100% !important;
  min-width: 0 !important;
}

.ai-confirm-task {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 2px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #fff8f8;
}

.ai-confirm-task b,
.ai-confirm-task p {
  margin: 0;
}

.ai-confirm-task > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 8px;
}

/* Shared enterprise surfaces across every module. */
.app-shell .panel,
.app-shell .folder-card,
.app-shell .job-card,
.app-shell .task-card,
.app-shell .activity-card,
.app-shell .attention-card,
.app-shell .workspace-button,
.app-shell .stat-card,
.app-shell .home-row,
.app-shell .dash-action,
.app-shell .calendar-panel,
.app-shell .calendar-event-card,
.app-shell .location-card,
.app-shell .purchase-card-row,
.app-shell .gate-card,
.app-shell .customer-form-card,
.app-shell .workflow-focus-card,
.app-shell .workflow-wizard-progress,
.app-shell .accounting-planner,
.app-shell .accounting-week,
.app-shell .planning-suggestions,
.app-shell .settings-role-card {
  border: 1px solid #cfd5dc !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.app-shell .screen-title,
.app-shell .folder-head,
.app-shell .task-head,
.app-shell .job-header,
.app-shell .job-title-band,
.app-shell .workspace-summary,
.app-shell .job-next-strip {
  background: #fff !important;
  box-shadow: none !important;
}

.app-shell .screen-title,
.app-shell .folder-head {
  border-left: 0 !important;
  border-bottom: 1px solid #d9dee5 !important;
}

.app-shell .form-grid input,
.app-shell .form-grid textarea,
.app-shell .form-grid select,
.app-shell .focused-task-form input,
.app-shell .focused-task-form textarea,
.app-shell .focused-task-form select {
  border: 1px solid #bfc7d1 !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.app-shell .workspace-button,
.app-shell .home-row,
.app-shell .dash-action,
.app-shell .sales-summary-item {
  border-left-width: 1px !important;
}

.app-shell .workspace-button.recommended,
.app-shell .desktop-module-tab.active,
.app-shell .nav-button.active {
  border-color: #32465a !important;
  background: #eef2f6 !important;
}

@media (min-width: 980px) {
  .app-shell .form-grid:not(.intake-form),
  .app-shell .job-info-grid,
  .app-shell .workspace-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .enterprise-intake-tools .form-grid,
  .enterprise-property-grid,
  .enterprise-project-setup-grid,
  .enterprise-contact-grid,
  .enterprise-optional-list .optional-panel-grid {
    grid-template-columns: 1fr !important;
  }
  .enterprise-location-status { grid-column: 1; }
  .sale-setup-choice { grid-template-columns: 1fr; gap: .45rem; }
  .sale-choice-buttons { grid-template-columns: 1fr; }
  .enterprise-intake-actions { justify-content: stretch; flex-direction: column; }
  .enterprise-intake-actions button { width: 100%; }
}

/* Messages workspace - aligned enterprise composer (v109). */
.messages-workspace-screen {
  max-width: 1380px;
}

.messages-utility-nav {
  min-height: 52px;
  padding: 8px 0 10px !important;
  border-bottom: 1px solid #d9dee5 !important;
}

.messages-utility-nav .back-button,
.messages-utility-nav .title-action {
  min-height: 36px;
  width: auto;
  padding: 7px 14px;
  border: 1px solid #bfc7d1 !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.messages-workspace-panel {
  padding: 0 !important;
  overflow: visible;
  border: 1px solid #cfd5dc !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.messages-workspace-panel .workspace-hero {
  margin: 0;
  padding: 18px 20px;
  border-bottom: 1px solid #cfd5dc;
  background: #fff;
}

.messages-workspace-panel .workspace-hero h2 {
  font-size: 25px;
}

.workspace-status-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.messages-workspace-panel .workspace-status-group .badge {
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid #bfc7d1;
  border-radius: 2px;
  box-shadow: none;
}

.messages-workspace-panel .workspace-open-badge {
  background: #fff !important;
  color: #344054 !important;
}

.messages-workspace-panel .workspace-utility-grid {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  margin: 0;
  padding: 14px 20px;
  border-bottom: 1px solid #d9dee5;
}

.messages-workspace-panel .workspace-switcher {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.messages-workspace-panel .workspace-switcher select {
  min-height: 40px;
  border: 1px solid #bfc7d1;
  border-radius: 2px;
  font-weight: 700;
}

.messages-workspace-panel .quick-panel {
  min-width: 168px;
  margin: 0;
  border: 1px solid #bfc7d1;
  border-radius: 2px !important;
  background: #fff;
  overflow: visible;
}

.messages-workspace-panel .quick-panel summary {
  min-height: 40px;
  padding: 7px 10px;
  border-radius: 0;
  background: #fff;
  font-size: 13px;
}

.messages-workspace-panel .quick-panel summary::after {
  color: #667085;
  font-size: 11px;
}

.messages-workspace-panel .compact-contact-bar {
  grid-template-columns: repeat(4, minmax(72px, 1fr));
  min-width: 360px;
  margin: 0;
  padding: 8px;
  border-top: 1px solid #d9dee5;
  background: #fff;
}

.message-composer {
  display: grid;
  gap: 0;
  padding: 18px 20px 0;
  background: #fff;
}

.message-composer label {
  display: grid;
  gap: 6px;
  color: #263442;
  font-weight: 800;
}

.message-recipient-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .42fr);
  gap: 14px;
}

.message-composer input,
.message-composer select,
.message-composer textarea {
  width: 100%;
  min-height: 42px;
  padding: 9px 10px;
  border: 1px solid #bfc7d1 !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #17212b;
}

.message-subject-field,
.message-draft-field {
  margin-top: 14px;
}

.message-composer textarea {
  min-height: 170px;
  resize: vertical;
  line-height: 1.55;
}

.message-email-preview {
  gap: 12px;
  margin-top: 18px;
  padding: 18px 0;
  border: 0;
  border-top: 1px solid #cfd5dc;
  border-bottom: 1px solid #cfd5dc;
  border-radius: 0;
}

.message-preview-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 14px;
}

.message-preview-heading b {
  color: #263442;
  font-size: 13px;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.message-preview-heading span {
  color: #667085;
  font-size: 12px;
}

.ebc-email-signature-preview {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: flex-start;
  gap: 14px;
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid #cfd4da;
  color: #111827;
}

.ebc-email-signature-preview img {
  width: 76px;
  height: 76px;
  flex: 0 0 76px;
  object-fit: contain;
}

.ebc-email-signature-identity {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.ebc-email-signature-preview b {
  font-size: 17px;
}

.ebc-email-signature-preview span {
  margin-bottom: 5px;
  color: #374151;
  font-size: 13px;
  font-weight: 700;
}

.ebc-email-signature-preview small {
  color: #4b5563;
  font-size: 12px;
  line-height: 1.35;
}

.ebc-email-signature-preview .ebc-email-signature-legal {
  grid-column: 1 / -1;
  padding: 9px 11px;
  border-left: 3px solid #a50f17;
  background: #f7f8fa;
  color: #6b7280;
  font-size: 10px;
  line-height: 1.55;
}

.appointment-email-section {
  margin: 22px 0 10px;
  padding: 0 0 7px;
  border-bottom: 1px solid #d1d5db;
  background: transparent;
  color: #111827;
  font-size: 14px;
}

.appointment-email-copy,
.appointment-email-detail {
  margin: 0 0 7px;
  color: #263442;
  line-height: 1.55;
}

.appointment-email-copy {
  margin-bottom: 14px;
}

.appointment-email-detail {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  margin: 0;
  padding: 9px 11px;
  border-right: 1px solid #d1d5db;
  border-bottom: 1px solid #d1d5db;
  border-left: 1px solid #d1d5db;
  background: #fff;
}

.appointment-email-detail b {
  color: #6b7280;
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.appointment-email-spacer {
  height: 5px;
}

@media (max-width: 540px) {
  .ebc-email-signature-preview {
    gap: 10px;
  }

  .ebc-email-signature-preview img {
    width: 62px;
    height: 62px;
    flex-basis: 62px;
  }
}

.message-action-bar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 14px 0;
}

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

.message-action-bar .primary-button,
.message-action-bar .secondary-button,
.message-action-bar .contact-button {
  min-height: 38px;
  width: auto;
  padding: 8px 16px;
  border-radius: 2px !important;
  box-shadow: none !important;
}

.message-action-bar .primary-button {
  min-width: 176px;
  background: #8f1523 !important;
  border-color: #8f1523 !important;
  color: #fff !important;
}

.saved-communications-link {
  justify-self: start;
}

.saved-communications-panel {
  margin: 0 20px 20px;
  padding: 14px 0 0;
  border: 0 !important;
  border-top: 1px solid #d9dee5 !important;
  border-radius: 0 !important;
}

@media (max-width: 760px) {
  .messages-workspace-panel .workspace-hero,
  .messages-workspace-panel .workspace-utility-grid,
  .message-composer {
    padding-left: 12px;
    padding-right: 12px;
  }

  .messages-workspace-panel .workspace-utility-grid,
  .message-recipient-grid,
  .message-action-bar {
    grid-template-columns: 1fr;
  }

  .messages-workspace-panel .quick-panel,
  .message-action-bar .saved-communications-link,
  .message-primary-actions,
  .message-primary-actions > * {
    width: 100%;
  }

  .message-primary-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .messages-workspace-panel .compact-contact-bar {
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .saved-communications-panel {
    margin-right: 12px;
    margin-left: 12px;
  }
}

/* Sleek application tabs - flat, compact, and consistent with enterprise screens. */
.app-shell .top-nav,
.app-shell .desktop-module-tabs,
.app-shell .bottom-nav {
  gap: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.app-shell .top-nav button,
.app-shell .top-nav .nav-more-select,
.app-shell .desktop-module-tabs button,
.app-shell .bottom-nav button,
.app-shell .bottom-nav .nav-more-select {
  position: relative;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.app-shell .top-nav button,
.app-shell .top-nav .nav-more-select {
  min-height: 38px !important;
  padding: 8px 14px !important;
  border: 0 !important;
  border-right: 1px solid #d9dee5 !important;
  color: #475467 !important;
}

.app-shell .top-nav button.active {
  background: #fff !important;
  color: #17212b !important;
}

.app-shell .top-nav button.active::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: 0;
  left: 10px;
  height: 3px;
  background: #8f1523;
}

.app-shell:not(.app-mode) .desktop-module-tabs {
  border-right: 1px solid #cfd5dc !important;
  background: #fff !important;
}

.app-shell:not(.app-mode) .desktop-module-tabs::before {
  display: none !important;
}

.app-shell:not(.app-mode) .desktop-module-tabs button {
  min-height: 48px !important;
  padding: 9px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e9ef !important;
  border-left: 3px solid transparent !important;
  color: #475467 !important;
}

.app-shell:not(.app-mode) .desktop-module-tabs button:hover {
  background: #f7f8fa !important;
  color: #17212b !important;
}

.app-shell:not(.app-mode) .desktop-module-tabs button.active {
  border-left-color: #8f1523 !important;
  background: #f3f5f7 !important;
  color: #17212b !important;
}

.app-shell:not(.app-mode) .desktop-module-tabs .nav-icon,
.app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon,
.app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: currentColor !important;
}

.app-shell .bottom-nav {
  border-top: 1px solid #cfd5dc !important;
  background: #fff !important;
}

.app-shell .bottom-nav button,
.app-shell .bottom-nav .nav-more-select {
  min-height: 48px !important;
  border: 0 !important;
  border-right: 1px solid #e5e9ef !important;
  color: #475467 !important;
}

.app-shell .bottom-nav button.active {
  border-top: 3px solid #8f1523 !important;
  background: #f3f5f7 !important;
  color: #17212b !important;
}

.app-shell .nav-more-select select,
.app-shell .desktop-more select,
.app-shell .mobile-more select {
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
}

/* Company Command Center - compact metrics and integrated operations list. */
.cost-control-screen {
  max-width: 1380px;
  gap: 18px;
}

.cost-control-screen > .screen-title {
  min-height: 0;
  padding: 18px 0 20px;
  border-bottom: 1px solid #cfd5dc !important;
}

.cost-control-screen > .screen-title h2 {
  margin-top: 2px;
  font-size: clamp(27px, 3vw, 36px);
  line-height: 1.05;
}

.cost-control-screen > .screen-title p:last-child {
  margin-top: 8px;
  color: #475467;
  font-size: 14px;
}

.command-metrics-section,
.command-operations-section {
  display: grid;
  gap: 10px;
}

.command-metrics-section > h3,
.command-operations-section > h3 {
  margin: 0;
  color: #475467;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

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

.command-metric-card {
  min-height: 112px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  align-content: start;
  gap: 4px;
  padding: 13px 14px;
  border: 1px solid #cfd5dc !important;
  border-top-color: #8f1523 !important;
  border-radius: 2px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #17212b !important;
  text-align: left;
}

.command-metric-card:hover,
.command-metric-card:focus-visible {
  border-color: #8f1523 !important;
  background: #faf7f7 !important;
}

.command-metric-card > span {
  color: #475467;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.command-metric-card > b {
  align-self: center;
  color: #17212b;
  font-size: 27px;
  line-height: 1;
}

.command-metric-card > small {
  color: #667085;
  font-size: 12px;
  font-weight: 650;
}

.command-operation-list {
  overflow: hidden;
  border: 1px solid #cfd5dc;
  border-radius: 2px;
  background: #fff;
}

.command-operation-row {
  width: 100%;
  min-height: 58px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 9px 13px;
  border: 0 !important;
  border-bottom: 1px solid #e1e5ea !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #17212b !important;
  text-align: left;
}

.command-operation-row:last-child {
  border-bottom: 0 !important;
}

.command-operation-row:hover,
.command-operation-row:focus-visible {
  background: #f7f8fa !important;
}

.command-operation-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid #bfc7d1;
  border-radius: 2px;
  color: #475467;
  font-size: 10px;
  font-weight: 900;
}

.command-operation-icon svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.command-operation-copy {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 3px 10px;
}

.command-operation-copy b {
  color: #263442;
  font-size: 13px;
  letter-spacing: .025em;
  text-transform: uppercase;
}

.command-operation-copy small {
  color: #667085;
  font-size: 12px;
}

.command-operation-open {
  min-width: 56px;
  padding: 5px 9px;
  border: 1px solid #bfc7d1;
  border-radius: 2px;
  color: #475467;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

@media (max-width: 900px) {
  .command-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .command-metric-card {
    min-height: 100px;
    padding: 11px;
  }

  .command-operation-row {
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 8px;
    padding: 9px;
  }

  .command-operation-copy {
    display: grid;
  }
}

/* Ordered workflow navigation rail for the installed app and compact desktop. */
.app-shell.app-mode {
  min-height: 100svh;
  display: grid !important;
  grid-template-columns: 74px minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  align-items: stretch;
}

.app-shell.app-mode .mobile-app-header {
  grid-column: 2;
  grid-row: 1;
}

.app-shell.app-mode .topbar {
  grid-column: 2;
  grid-row: 1;
}

.app-global-action-bar {
  position: sticky;
  top: 0;
  z-index: 34;
  grid-column: 2;
  grid-row: 2;
  display: flex;
  justify-content: flex-end;
  min-height: 44px;
  padding: 6px 14px;
  border-bottom: 1px solid #cfd5dc;
  background: rgba(255, 255, 255, .97);
}

.app-shell.app-mode .app-content {
  grid-column: 2;
  grid-row: 3;
  min-width: 0;
}

.app-workflow-rail {
  position: sticky;
  top: 0;
  z-index: 35;
  grid-column: 1;
  grid-row: 1 / span 3;
  width: 74px;
  height: 100svh;
  display: grid;
  grid-auto-rows: minmax(68px, auto);
  align-content: start;
  overflow-y: auto;
  border-right: 1px solid #cfd5dc;
  background: #fff;
  box-shadow: none;
}

.app-workflow-rail-title {
  min-height: 36px;
  display: grid;
  place-items: center;
  border-bottom: 1px solid #e1e5ea;
  color: #667085;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.app-workflow-rail button {
  position: relative;
  min-height: 68px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 3px;
  padding: 7px 3px;
  border: 0 !important;
  border-bottom: 1px solid #e5e9ef !important;
  border-left: 3px solid transparent !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #475467 !important;
  text-align: center;
}

.app-workflow-rail button:hover,
.app-workflow-rail button:focus-visible {
  background: #f7f8fa !important;
  color: #17212b !important;
}

.app-workflow-rail button.active {
  border-left-color: #8f1523 !important;
  background: #f3f5f7 !important;
  color: #17212b !important;
}

.app-workflow-step {
  position: absolute;
  top: 5px;
  left: 6px;
  color: #98a2b3;
  font-size: 8px;
  font-weight: 900;
}

.app-workflow-icon {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
}

.app-workflow-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.app-workflow-rail button b {
  max-width: 64px;
  overflow-wrap: anywhere;
  font-size: 9px;
  line-height: 1.1;
}

@media (max-width: 1079px) {
  .app-shell.with-bottom-nav:not(.app-mode) {
    padding-left: 72px !important;
  }

  .app-shell:not(.app-mode) .bottom-nav {
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 72px !important;
    height: 100svh !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(4, minmax(54px, auto)) !important;
    align-content: center !important;
    padding: 0 !important;
    border-top: 0 !important;
    border-right: 1px solid #cfd5dc !important;
  }

  .app-shell:not(.app-mode) .bottom-nav button,
  .app-shell:not(.app-mode) .bottom-nav .nav-more-select {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 58px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #e5e9ef !important;
  }

  .app-shell:not(.app-mode) .bottom-nav button.active {
    border-top: 0 !important;
    border-left: 3px solid #8f1523 !important;
  }

  .app-shell:not(.app-mode) .bottom-nav .mobile-more {
    display: grid !important;
    place-items: center;
    padding: 4px !important;
    font-size: 9px !important;
  }

  .app-shell:not(.app-mode) .bottom-nav .mobile-more select {
    min-width: 0 !important;
    width: 100% !important;
    padding: 0 !important;
    font-size: 9px !important;
    text-align: center;
  }

  .app-shell.with-bottom-nav:not(.app-mode) .app-content {
    padding-bottom: 18px !important;
  }
}

/* v124 owner forms library, jurisdiction routing, and guided company setup. */
.forms-library-screen,
.setup-interview-screen {
  max-width: 1480px;
  margin: 0 auto;
}

.forms-library-heading,
.setup-interview-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #cfd5dc;
}

.permit-package-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
}

.permit-package-metric {
  padding: 14px 16px;
  border: 1px solid #cfd5dc;
  border-top: 2px solid #981b2a;
  border-radius: 2px;
  background: #fff;
}

.permit-package-metric span,
.permit-package-metric small {
  display: block;
  color: #68727e;
}

.permit-package-metric span {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.permit-package-metric b {
  display: block;
  margin: 5px 0 2px;
  color: #222b35;
  font-size: 28px;
  line-height: 1;
}

.forms-library-panel,
.company-process-builder,
.forms-inventory-panel,
.setup-interview-card {
  margin-top: 16px;
  border: 1px solid #cfd5dc;
  border-radius: 2px;
  background: #fff;
}

.forms-library-panel > header,
.company-process-builder > header,
.forms-inventory-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 13px 16px;
  border-bottom: 1px solid #dce1e6;
  background: #f8f9fa;
}

.forms-library-panel h2,
.company-process-builder h2,
.forms-inventory-panel h2 {
  margin: 0;
  font-size: 14px;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.forms-upload-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 12px 16px;
  padding: 16px;
}

.forms-upload-grid .wide-field,
.forms-upload-grid .forms-role-fieldset,
.forms-upload-actions {
  grid-column: 1 / -1;
}

.forms-role-fieldset {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  padding: 11px 13px;
  border: 1px solid #d4d9df;
}

.forms-role-fieldset legend {
  padding: 0 6px;
  color: #4e5965;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.forms-role-fieldset label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 12px;
}

.forms-upload-actions,
.process-builder-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.process-builder-help {
  padding: 11px 16px;
  border-bottom: 1px solid #e0e4e8;
  color: #5d6874;
  font-size: 12px;
}

.process-builder-grid {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

.process-builder-columns,
.process-builder-row {
  display: grid;
  grid-template-columns: 42px minmax(210px, 1.35fr) minmax(140px, .85fr) minmax(150px, .9fr) minmax(150px, .9fr) minmax(190px, 1.2fr);
  gap: 8px;
  min-width: 1120px;
  align-items: center;
}

.process-builder-columns {
  padding: 9px 12px;
  border-bottom: 1px solid #cfd5dc;
  background: #30363d;
  color: #f4f6f8;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.process-builder-row {
  min-height: 58px;
  padding: 7px 12px;
  border-bottom: 1px solid #e1e5e9;
}

.process-builder-row:nth-child(even) {
  background: #fafbfc;
}

.process-builder-number,
.process-order {
  color: #981b2a;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.process-builder-row select {
  width: 100%;
  min-width: 0;
  min-height: 36px;
  border-radius: 2px;
  font-size: 11px;
}

.process-builder-row select[multiple] {
  min-height: 44px;
}

.process-enable-cell {
  display: flex;
  justify-content: center;
}

.process-builder-actions {
  align-items: center;
  padding: 14px 16px;
  background: #f8f9fa;
}

.process-builder-actions small {
  margin-right: auto;
  color: #67717d;
}

.forms-inventory-table {
  width: 100%;
  border-collapse: collapse;
}

.forms-inventory-head,
.forms-inventory-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.25fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(190px, 1fr) 100px;
  gap: 12px;
  min-width: 860px;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid #e0e4e8;
}

.forms-inventory-head {
  background: #30363d;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.forms-inventory-row small {
  display: block;
  margin-top: 3px;
  color: #69737e;
}

.forms-inventory-table th,
.forms-inventory-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e0e4e8;
  text-align: left;
  vertical-align: top;
}

.forms-inventory-table th {
  background: #30363d;
  color: #fff;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.permit-routing-panel {
  margin-top: 10px;
  padding: 11px 12px;
  border: 1px solid #d4d9df;
  border-left: 3px solid #981b2a;
  background: #fbfcfd;
}

.permit-routing-panel select {
  max-width: 300px;
  min-height: 34px;
  border-radius: 2px;
}

.permit-form-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 9px;
}

.permit-form-links a {
  padding: 6px 9px;
  border: 1px solid #aeb7c1;
  background: #fff;
  color: #29333e;
  font-size: 11px;
  font-weight: 650;
  text-decoration: none;
}

.setup-interview-progress {
  margin: 20px 0 8px;
}

.setup-interview-progress > span {
  display: block;
  margin-bottom: 6px;
  color: #68727e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.setup-interview-progress > div {
  height: 4px;
  overflow: hidden;
  background: #dfe3e7;
}

.setup-interview-progress i {
  display: block;
  height: 100%;
  background: #b51f32;
  transition: width .2s ease;
}

.setup-interview-card {
  max-width: 860px;
  margin: 18px auto 0;
  padding: 26px;
}

.setup-interview-step-label {
  color: #981b2a;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.setup-interview-card h2 {
  margin: 8px 0 5px;
  color: #242d37;
  font-size: 23px;
}

.setup-interview-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 20px;
}

.setup-interview-options button {
  min-height: 52px;
  padding: 10px 13px;
  border: 1px solid #bac1c9;
  border-radius: 2px;
  background: #fff;
  color: #27313b;
  text-align: left;
  box-shadow: none;
}

.setup-interview-options button:hover,
.setup-interview-options button.selected {
  border-color: #b51f32;
  background: #fff7f8;
  box-shadow: inset 3px 0 #b51f32;
}

.setup-interview-navigation,
.setup-interview-actions {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
  padding-top: 14px;
  border-top: 1px solid #e0e4e8;
}

.setup-interview-summary,
.setup-answer-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 18px 0;
}

.setup-interview-summary div,
.setup-answer-summary div {
  padding: 10px 12px;
  border: 1px solid #d7dce1;
  background: #f8f9fa;
}

.setup-interview-summary span,
.setup-interview-summary b,
.setup-answer-summary span,
.setup-answer-summary b {
  display: block;
}

.setup-interview-summary span,
.setup-answer-summary span {
  color: #68727e;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .permit-package-metrics,
  .forms-upload-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .forms-upload-grid > * {
    grid-column: auto;
  }

  .forms-upload-grid .wide-field,
  .forms-upload-grid .forms-role-fieldset,
  .forms-upload-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  .forms-library-heading,
  .setup-interview-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .permit-package-metrics,
  .forms-upload-grid,
  .setup-interview-options,
  .setup-interview-summary,
  .setup-answer-summary {
    grid-template-columns: 1fr;
  }

  .setup-interview-card {
    padding: 18px 14px;
  }

  .forms-inventory-panel {
    overflow-x: auto;
  }

  .forms-inventory-table {
    min-width: 680px;
  }
}

/* v127: flat enterprise app home matching the system-wide control panels. */
.app-shell.app-mode .mobile-command-hub {
  max-width: 1080px;
  margin: 0 auto;
  gap: 16px;
}

.app-shell.app-mode .mobile-hub-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 3px 0 14px;
  border-bottom: 1px solid #c8ced5;
}

.app-shell.app-mode .mobile-hub-heading h2 {
  margin: 2px 0 4px;
  color: #202932;
  font-size: 23px;
  font-weight: 750;
  letter-spacing: -.015em;
}

.app-shell.app-mode .mobile-hub-heading p {
  margin: 0;
  color: #606b77;
  font-size: 12px;
  line-height: 1.4;
}

.app-shell.app-mode .mobile-hub-heading > span {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid #b8c0c9;
  border-radius: 2px;
  background: #fff;
  color: #4f5964;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.app-shell.app-mode .enterprise-module-list {
  display: grid;
  gap: 16px;
}

.app-shell.app-mode .mobile-module-panel {
  overflow: hidden;
  border: 1px solid #cbd1d7;
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
}

.app-shell.app-mode .mobile-module-section-label,
.app-shell.app-mode .mobile-module-section-label:first-child {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 9px 12px;
  border-bottom: 1px solid #cbd1d7;
  background: #343a41;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .085em;
  text-transform: uppercase;
}

.app-shell.app-mode .mobile-module-section-label span {
  color: #c5cbd1;
  font-size: 9px;
  font-weight: 600;
}

.app-shell.app-mode .mobile-module-rows {
  display: grid;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row {
  min-height: 58px;
  width: 100%;
  display: grid;
  grid-template-columns: 32px 34px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border: 0;
  border-bottom: 1px solid #e0e4e8;
  border-radius: 0;
  background: #fff;
  color: #222b35;
  text-align: left;
  box-shadow: none;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row:last-child {
  border-bottom: 0;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row:hover,
.app-shell.app-mode .mobile-module-card.mobile-module-row:focus-visible {
  border-color: #e0e4e8;
  background: #f7f8f9;
  box-shadow: inset 3px 0 var(--app-red);
}

.app-shell.app-mode .mobile-module-order {
  color: var(--app-red-dark);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .035em;
  text-align: center;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-icon {
  width: 32px;
  height: 32px;
  border: 1px solid #b8c0c8;
  border-radius: 2px;
  background: #f6f7f8;
  color: #4e5965;
  box-shadow: none;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-icon svg {
  width: 17px;
  height: 17px;
  stroke-width: 1.7;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-copy {
  gap: 2px;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-copy b {
  color: #202932;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-copy small {
  color: #66717d;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.25;
}

.app-shell.app-mode .mobile-module-open {
  color: #8d1725;
  font-size: 15px;
  font-weight: 700;
  text-align: right;
}

.app-shell.app-mode .mobile-module-card.quick-link-row {
  grid-template-columns: 34px minmax(0, 1fr) 20px;
}

@media (max-width: 560px) {
  .app-shell.app-mode .mobile-hub-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .app-shell.app-mode .mobile-hub-heading > span {
    align-self: flex-start;
  }
}

/* v127 refinement: app Home follows the collapsed Jobs-screen pattern. */
.app-shell.app-mode .mobile-command-hub > .screen-title {
  margin: 0;
  padding: 0 0 12px !important;
}

.app-shell.app-mode .mobile-home-filter-row {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 0 0 2px;
  scrollbar-width: none;
}

.app-shell.app-mode .mobile-home-filter-row::-webkit-scrollbar {
  display: none;
}

.app-shell.app-mode .mobile-home-filter-row .filter-pill {
  flex: 0 0 auto;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid #b8c0c9;
  border-radius: 2px;
  background: #fff;
  color: #343e49;
  box-shadow: none;
  font-size: 11px;
  font-weight: 700;
}

.app-shell.app-mode .mobile-home-filter-row .filter-pill.active {
  border-color: var(--app-red-dark);
  background: var(--app-red);
  color: #fff;
}

.app-shell.app-mode .mobile-home-filter-row .filter-pill span {
  min-width: 20px;
  padding: 2px 5px;
  border-radius: 2px;
  background: #eef1f4;
  color: #343e49;
  font-size: 10px;
  text-align: center;
}

.app-shell.app-mode .mobile-home-filter-row .filter-pill.active span {
  background: #fff;
  color: var(--app-red-dark);
}

.app-shell.app-mode .mobile-module-panel {
  overflow: visible;
  border: 0;
  background: transparent;
}

.app-shell.app-mode .mobile-module-section-label,
.app-shell.app-mode .mobile-module-section-label:first-child {
  min-height: 35px;
  margin: 0 0 8px;
  padding: 5px 2px 8px;
  border: 0;
  border-bottom: 1px solid #cbd1d7;
  background: transparent;
  color: #28323c;
  font-size: 10px;
}

.app-shell.app-mode .mobile-module-section-label span {
  color: #6a7580;
}

.app-shell.app-mode .mobile-module-rows {
  gap: 8px;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row {
  min-height: 64px;
  border: 1px solid #cbd1d7;
  border-left: 4px solid var(--app-red);
  border-radius: 2px;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row:last-child {
  border-bottom: 1px solid #cbd1d7;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row:hover,
.app-shell.app-mode .mobile-module-card.mobile-module-row:focus-visible {
  border-color: #b8c0c9;
  border-left-color: var(--app-red-dark);
  background: #fff8f8;
  box-shadow: none;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-copy b {
  font-size: 14px;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-copy small::before {
  content: "Purpose  ";
  color: #7b858f;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-open::before {
  content: "Open ";
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-open {
  width: 58px;
  justify-self: end;
  white-space: nowrap;
}

.app-shell.app-mode .mobile-module-card.workflow-link-row {
  grid-template-columns: 32px 34px minmax(0, 1fr) 58px;
}

.app-shell.app-mode .mobile-module-card.quick-link-row {
  grid-template-columns: 34px minmax(0, 1fr) 58px;
}

/* v128: Home module groups match Cost Control operations, with red Open actions. */
.app-shell.app-mode .mobile-module-panel {
  overflow: visible;
  border: 0;
  background: transparent;
}

.app-shell.app-mode .mobile-module-section-label,
.app-shell.app-mode .mobile-module-section-label:first-child {
  margin: 0 0 8px;
}

.app-shell.app-mode .mobile-module-rows.command-operation-list {
  overflow: hidden;
  gap: 0;
  border: 1px solid #cfd5dc;
  border-radius: 2px;
  background: #fff;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row,
.app-shell.app-mode .mobile-module-card.mobile-module-row:last-child {
  min-height: 58px;
  border: 0;
  border-bottom: 1px solid #e1e5ea;
  border-radius: 0;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row:last-child {
  border-bottom: 0;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row:hover,
.app-shell.app-mode .mobile-module-card.mobile-module-row:focus-visible {
  border-left: 0;
  background: #f7f8fa;
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-copy small::before {
  content: "";
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-open::before {
  content: "";
}

.app-shell.app-mode .mobile-module-card.mobile-module-row .mobile-module-open,
.app-shell.app-mode .mobile-module-card.mobile-module-row .command-operation-open {
  width: auto;
  min-width: 58px;
  justify-self: end;
  padding: 6px 10px;
  border: 1px solid var(--brand-primary-dark, #71080e);
  border-radius: 2px;
  background: var(--brand-primary, #a50f17);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .055em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

/* v121 enterprise identity and litigation-ready communication archive. */
.communication-connection-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid #d7dce2;
  background: #fff;
}

.communication-connection-panel > div {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
}

.communication-connection-panel > div + div { border-left: 1px solid #d7dce2; }
.communication-connection-panel b { color: #273445; font-size: 11px; letter-spacing: .055em; text-transform: uppercase; }
.communication-connection-panel span { color: #667085; font-size: 11px; line-height: 1.45; }
.communication-connection-panel > div:first-child { border-top: 2px solid #15803d; }
.communication-connection-panel > div:last-child { border-top: 2px solid #c58b13; }

.communication-archive-heading,
.communication-record-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.communication-archive-heading {
  padding-bottom: 12px;
  border-bottom: 1px solid #d7dce2;
}

.communication-archive-heading h3 { margin: 2px 0; }
.communication-archive-heading span { color: #667085; font-size: 11px; }

.communication-record {
  margin-top: 12px;
  border: 1px solid #d7dce2;
  background: #fff;
}

.communication-record-head { padding: 11px 13px; border-bottom: 1px solid #e3e7eb; }
.communication-record-head > div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.communication-record-head b { overflow: hidden; color: #202b38; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }

.communication-direction {
  padding: 3px 7px;
  border: 1px solid #94a3b8;
  border-radius: 2px;
  color: #475569;
  font-size: 9px;
  font-weight: 700 !important;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.communication-direction.outbound { border-color: #7dd3fc; color: #027aa8; }
.communication-direction.inbound { border-color: #86efac; color: #15803d; }

.communication-metadata {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-bottom: 1px solid #e3e7eb;
}
.communication-metadata > div { min-width: 0; padding: 9px 12px; border-right: 1px solid #edf0f3; border-bottom: 1px solid #edf0f3; }
.communication-metadata > div:nth-child(3n) { border-right: 0; }
.communication-metadata dt { color: #667085; font-size: 9px; font-weight: 650; letter-spacing: .075em; text-transform: uppercase; }
.communication-metadata dd { margin: 3px 0 0; overflow-wrap: anywhere; color: #273445; font-size: 11px; }

.communication-body { min-height: 74px; padding: 14px; color: #303b47; font-size: 12px; line-height: 1.55; white-space: pre-wrap; }
.communication-attachments { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 13px; border-top: 1px solid #edf0f3; }
.communication-attachments b { margin-right: 6px; font-size: 10px; text-transform: uppercase; }
.communication-attachments span { padding: 3px 6px; border: 1px solid #d7dce2; font-size: 10px; }
.communication-integrity { display: grid; gap: 3px; padding: 8px 12px; border-top: 1px solid #edf0f3; background: #f7f8fa; color: #667085; font-family: Consolas, monospace; font-size: 8px; overflow-wrap: anywhere; }

.customer-database-heading {
  margin-bottom: 12px;
  padding: 14px 16px !important;
  border: 1px solid #d7dce2;
  background: #fff;
}
.customer-database-heading h2 { margin: 2px 0 3px !important; font-size: clamp(22px, 2vw, 28px) !important; }
.customer-database-heading p:last-child { margin: 0; color: #5b6673; font-size: 11px; }
.customer-command-metrics { margin-bottom: 12px; }
.customer-command-metrics .streamlit-metric-card { border-top: 2px solid #8f1523 !important; }
.customer-database-control-window { margin: 0 !important; }
.customer-database-control-window .customer-database-search { display: block; margin: 12px 14px 10px; color: #475467; font-size: 10px; letter-spacing: .055em; text-transform: uppercase; }
.customer-database-control-window .customer-database-search input { margin-top: 5px; font-size: 12px; letter-spacing: normal; text-transform: none; }
.customer-database-control-window .customer-table-scroll { width: auto; max-width: calc(100% - 28px); margin: 0 14px 14px; border: 1px solid #d7dce2; }
.customer-database-head-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.customer-database-head-actions .mini-button.active { border-color: #16794a; background: #eaf7ef; color: #11623c; }
.customer-table-scrollbar-top { width: auto; max-width: calc(100% - 28px); height: 18px; margin: 0 14px 5px; overflow-x: auto; overflow-y: hidden; border: 1px solid #d7dce2; background: #f4f6f8; }
.customer-table-scrollbar-top > div { width: 1180px; height: 1px; }
.customer-warranty-metric { width: 100%; color: inherit; text-align: left; cursor: pointer; }
.customer-warranty-metric.selected { outline: 2px solid #16804d; outline-offset: -2px; background: #edf9f2 !important; }
.customer-warranty-metric small { color: #667085; font-size: 9px; }

@media (min-width: 1080px) {
  .app-shell:not(.app-mode) .screen,
  .app-shell:not(.app-mode) .workspace-card { border-radius: 0 !important; }
  .app-shell:not(.app-mode) .streamlit-job-main h4,
  .app-shell:not(.app-mode) .customer-table-primary strong { color: #202b38; letter-spacing: -.01em; }
  .app-shell:not(.app-mode) .customer-database-table th { background: #f2f4f6; color: #475467; font-size: 9px; letter-spacing: .075em; text-transform: uppercase; }
  .app-shell:not(.app-mode) .customer-database-table td { border-color: #e1e5e9; }
}

@media (max-width: 760px) {
  .communication-connection-panel,
  .communication-metadata { grid-template-columns: 1fr; }
  .communication-connection-panel > div + div { border-left: 0; }
  .communication-metadata > div { border-right: 0; }
  .communication-archive-heading,
  .communication-record-head { align-items: stretch; flex-direction: column; }
}

@media print {
  html[data-communication-print] body * { visibility: hidden !important; }
  html[data-communication-print] .saved-communications-panel,
  html[data-communication-print] .saved-communications-panel * { visibility: visible !important; }
  html[data-communication-print] .saved-communications-panel { position: absolute; inset: 0; width: 100%; margin: 0; padding: 0; border: 0; }
  html[data-communication-print] .communication-print-button,
  html[data-communication-print] .communication-archive-heading button { display: none !important; }
  html[data-communication-print] .communication-filter-bar,
  html[data-communication-print] .communications-screen > .action-row,
  html[data-communication-print] .communication-record > .action-row { display: none !important; }
  html[data-communication-print]:not([data-communication-print="all"]) .communication-record { display: none !important; }
  html[data-communication-print]:not([data-communication-print="all"]) .communication-record.communication-print-selected { display: block !important; }
  html[data-communication-print="all"] .communication-record,
  html[data-communication-print] .communication-record[data-communication-id] { break-inside: avoid; box-shadow: none !important; }
}

/* v124 owner forms library, jurisdiction routing, and company process builder. */
.forms-library-screen,
.setup-interview-screen { display: grid; gap: 14px; }
.forms-library-heading { margin: 0; }
.forms-library-heading-actions { display: flex; gap: 8px; align-items: center; }
.forms-package-grid { margin: 0; }
.forms-package-grid .streamlit-metric-card { border-top: 2px solid #8f1523 !important; }
.forms-package-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.forms-package-toolbar > b { color: #344054; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.forms-package-button { width: 100%; cursor: pointer; text-align: left; font: inherit; appearance: none; }
.forms-package-button:hover,
.forms-package-button.selected { border-color: var(--brand-primary, #a50f17) !important; background: #fff8f8 !important; }
.forms-package-button.selected { box-shadow: inset 0 0 0 1px var(--brand-primary, #a50f17); }
.forms-package-button small { color: #667085; font-size: 9px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.jurisdiction-process-placement { border-top: 2px solid var(--brand-primary, #a50f17); }
.jurisdiction-placement-list { display: grid; }
.jurisdiction-placement-row { display: grid; grid-template-columns: minmax(260px, 1.4fr) minmax(260px, 1fr) auto; gap: 12px; align-items: end; padding: 12px 14px; border-top: 1px solid #e1e5e9; }
.jurisdiction-placement-row > div { display: grid; gap: 4px; }
.jurisdiction-placement-row small { color: #667085; font-size: 10px; }
.jurisdiction-placement-row label { display: grid; gap: 5px; color: #667085; font-size: 9px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.jurisdiction-placement-row select { min-height: 36px; border: 1px solid #cfd5dc; border-radius: 2px; background: #fff; }

.smart-company-forms-list { display: grid; gap: 0; }
.smart-company-form-card {
  display: grid;
  grid-template-columns: minmax(240px, 1.35fr) minmax(220px, 1fr) minmax(210px, .9fr) minmax(260px, auto);
  align-items: end;
  gap: 12px;
  padding: 14px;
  border-bottom: 1px solid #e1e5e9;
  background: #fff;
}
.smart-company-form-copy { display: grid; gap: 4px; align-self: center; min-width: 0; }
.smart-company-form-copy > span { color: #8f1523; font-size: 9px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.smart-company-form-copy > b { color: #202b38; font-size: 14px; }
.smart-company-form-copy > small { color: #667085; font-size: 10px; line-height: 1.4; }
.smart-company-form-card > label { display: grid; gap: 5px; min-width: 0; color: #475467; font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.smart-company-form-card select,
.smart-company-form-card input { width: 100%; min-width: 0; min-height: 38px; border: 1px solid #cfd5dc; border-radius: 2px; background: #fff; color: #273445; font-size: 11px; letter-spacing: normal; text-transform: none; }
.smart-company-form-actions { display: grid; grid-template-columns: repeat(3, minmax(76px, 1fr)); gap: 7px; min-width: 0; }
.smart-company-form-actions button { width: 100%; min-width: 0; white-space: normal; }
.smart-company-form-actions button:disabled { cursor: not-allowed; opacity: .5; }
.smart-form-empty { grid-column: 2 / -1; margin: 0; color: #92400e; font-size: 10px; }

.damage-assessment-panel { margin-top: 14px; border: 1px solid #cbd5e1; background: #fff; }
.damage-assessment-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; cursor: pointer; list-style: none; border-left: 4px solid var(--brand-primary, #b91c1c); }
.damage-assessment-panel > summary span:first-child { display: grid; gap: 2px; }
.damage-assessment-panel > summary small { color: #64748b; }
.damage-assessment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 14px; border-top: 1px solid #e2e8f0; }
.damage-assessment-grid label,
.damage-utility-fieldset { display: grid; gap: 6px; min-width: 0; font-size: 12px; font-weight: 700; }
.damage-assessment-grid .wide { grid-column: 1 / -1; }
.damage-choice-help { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--brand-primary, #b91c1c) 28%, #cbd5e1); border-radius: 8px; background: color-mix(in srgb, var(--brand-primary, #b91c1c) 6%, #ffffff); }
.damage-choice-help b { color: var(--brand-primary-dark, #7f1016); font-size: 13px; }
.damage-choice-help span { color: #475569; font-size: 11px; line-height: 1.4; }
.damage-intake-source { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid #cbd5e1; background: #f8fafc; }
.damage-intake-source > div { display: grid; gap: 4px; min-width: 0; padding: 10px 12px; border-right: 1px solid #e2e8f0; }
.damage-intake-source > div:last-of-type { border-right: 0; }
.damage-intake-source span { color: #64748b; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.damage-intake-source b { overflow-wrap: anywhere; color: #273445; font-size: 12px; }
.damage-intake-source small { grid-column: 1 / -1; padding: 8px 12px; border-top: 1px solid #e2e8f0; color: #475569; font-size: 10px; }
.damage-choice-fieldset { min-width: 0; margin: 0; padding: 9px 10px 10px; border: 1px solid #cbd5e1; border-radius: 8px; }
.damage-choice-fieldset legend { padding: 0 4px; color: #273445; font-size: 12px; font-weight: 800; }
.damage-choice-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.damage-choice-options label { display: flex; align-items: center; gap: 7px; min-height: 40px; padding: 7px 9px; border: 1px solid #d7dce2; border-radius: 7px; background: #ffffff; cursor: pointer; touch-action: manipulation; }
.damage-choice-options input { flex: 0 0 auto; width: 19px !important; height: 19px !important; min-height: 19px !important; margin: 0; accent-color: var(--brand-primary, #b91c1c); }
.damage-choice-options label:has(input:checked) { border-color: var(--brand-primary, #b91c1c); background: color-mix(in srgb, var(--brand-primary, #b91c1c) 8%, #ffffff); color: var(--brand-primary-dark, #7f1016); }
.damage-utility-fieldset { margin: 0; padding: 8px 10px; border: 1px solid #cbd5e1; }
.damage-utility-fieldset label { display: inline-flex; align-items: center; min-height: 38px; margin-right: 12px; cursor: pointer; touch-action: manipulation; }
.damage-utility-fieldset input { flex: 0 0 auto; width: 19px !important; height: 19px !important; min-height: 19px !important; margin: 0 7px 0 0; accent-color: var(--brand-primary, #b91c1c); }
.damage-assessment-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding: 0 14px 14px; }
.permit-inspection-panel { min-width: 0; max-width: 100%; margin-top: 14px; overflow: hidden; border: 1px solid #cbd5e1; background: #fff; }
.permit-inspection-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; cursor: pointer; list-style: none; border-left: 4px solid var(--brand-primary, #b91c1c); }
.permit-inspection-panel > summary span:first-child { display: grid; gap: 2px; }
.permit-inspection-panel > summary small,
.permit-inspection-panel.locked span { color: #64748b; }
.permit-inspection-panel.locked { display: flex; gap: 12px; align-items: center; padding: 12px 14px; background: #f8fafc; }
.permit-inspection-head,
.permit-inspection-row { display: grid; grid-template-columns: 80px 90px minmax(180px, 1.4fr) minmax(150px, 1fr) minmax(145px, 1fr) 145px; min-width: 930px; align-items: center; gap: 8px; }
.permit-inspection-head { padding: 9px 12px; background: #f1f5f9; color: #64748b; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.permit-inspection-table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.permit-inspection-list { min-width: 930px; }
.permit-inspection-row { padding: 7px 12px; border-top: 1px solid #e2e8f0; }
.permit-inspection-row b { font-size: .82rem; }
.permit-inspection-row input,
.permit-inspection-row select { min-width: 0; }
.permit-inspection-auto-order { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 5px 8px; border-radius: 6px; background: #eef2f7; color: #475569; font-size: .74rem; font-weight: 800; }
.inspection-required { display: flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 800; }
.permit-inspection-actions { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; align-items: center; padding: 12px 14px; border-top: 1px solid #e2e8f0; font-size: .78rem; color: #64748b; }
.permit-inspection-actions > span { flex: 1 1 360px; min-width: 0; }
.permit-inspection-actions > button { flex: 0 1 auto; max-width: 100%; white-space: normal; }
.permit-project-requirements { margin: 12px 0; border: 1px solid #cbd5e1; background: #fff; }
.permit-project-requirements > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; cursor: pointer; border-left: 4px solid var(--brand-primary, #a50f17); }
.permit-project-requirements > summary span:first-child { display: grid; gap: 2px; }
.permit-project-requirements > summary small { color: #64748b; font-weight: 600; }
.permit-project-requirements .requirement-choice-grid, .permit-requirement-edit-fields { margin: 12px 14px; }
.permit-project-requirement-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 12px 14px; border-top: 1px solid #e2e8f0; }
.permit-project-requirement-actions span { flex: 1 1 auto; color: #64748b; font-size: .78rem; }
.permit-auto-source { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #cbd5e1; background: #f8fafc; font-size: .78rem; }
.permit-auto-source b { color: var(--brand-primary, #a50f17); }
.permit-subcontractor-license-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 12px; border: 1px solid #cbd5e1; border-radius: 8px; background: #f8fafc; }
.permit-subcontractor-license-card > .wide { grid-column: 1 / -1; }
.permit-subcontractor-license-card > small { color: #64748b; }
.damage-recommendations-panel { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; align-items: center; margin-top: 14px; padding: 12px 14px; border: 1px solid #cbd5e1; background: #fff; }
.damage-recommendations-panel > div:first-child { display: grid; gap: 3px; }
.damage-recommendations-panel span { color: #64748b; font-size: .78rem; }
.damage-recommendations-files { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.construction-compliance-empty { display: grid; gap: 4px; margin-top: 14px; padding: 12px 14px; border: 1px dashed #94a3b8; background: #f8fafc; }
.construction-compliance-empty span { color: #64748b; font-size: .8rem; }
.construction-compliance-panel { margin-top: 14px; border: 1px solid #94a3b8; background: #fff; }
.construction-compliance-panel.standalone { margin-top: 0; }
.construction-checklist-progress { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 14px; border-left: 4px solid var(--brand-primary, #a50f17); }
.construction-checklist-progress > span { display: grid; gap: 3px; }
.construction-checklist-progress small { color: #64748b; }
.construction-checklist-progress strong { font-size: 1.1rem; }
.construction-checklist-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 2px 0; }
.construction-checklist-section-heading span { color: #64748b; font-size: .78rem; font-weight: 800; }
.construction-checklist-close-actions { position: sticky; bottom: 0; z-index: 4; display: flex; align-items: center; justify-content: flex-end; gap: 14px; padding: 12px 14px; border-top: 1px solid #cbd5e1; background: rgba(255, 255, 255, .97); box-shadow: 0 -5px 14px rgba(15, 23, 42, .08); }
.construction-checklist-close-actions span { flex: 1 1 auto; color: #475569; font-size: .78rem; font-weight: 700; }
.construction-completed-list { border: 1px solid #d7dde5; border-radius: 12px; background: #f8fafc; overflow: hidden; }
.construction-completed-list > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; cursor: pointer; list-style: none; }
.construction-completed-list > summary::-webkit-details-marker { display: none; }
.construction-completed-list > summary span { color: #64748b; font-size: .78rem; font-weight: 800; }
.construction-completed-list > .compliance-checklist-list { padding: 0 10px 10px; }
.missing-scope-panel { display: grid; gap: 12px; padding: 14px; border: 1px solid #d7dde5; border-radius: 14px; background: #fff; }
.missing-scope-panel > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.missing-scope-panel > header h3, .missing-scope-panel > header p { margin: 0; }
.missing-scope-panel > header p { color: #64748b; margin-top: 4px; }
.missing-scope-form { display: grid; grid-template-columns: minmax(170px, .7fr) minmax(220px, 1fr) auto; gap: 10px; align-items: end; padding: 12px; border-radius: 12px; background: #f8fafc; }
.missing-scope-form .wide { grid-column: 1 / -1; }
.missing-scope-list { display: grid; gap: 9px; }
.missing-scope-list article { display: grid; grid-template-columns: minmax(240px, 1.4fr) minmax(190px, .8fr) minmax(190px, 1fr) auto; gap: 10px; align-items: end; padding: 11px; border: 1px solid #e2e8f0; border-radius: 11px; }
.missing-scope-list article > div { display: grid; gap: 3px; }
.missing-scope-list article span, .missing-scope-list article small { color: #64748b; }
.construction-compliance-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 14px; cursor: pointer; border-left: 4px solid var(--brand-primary, #a50f17); }
.construction-compliance-panel > summary span:first-child { display: grid; gap: 3px; }
.construction-compliance-panel > summary small { color: #64748b; }
.compliance-jurisdiction-note { display: flex; gap: 12px; align-items: center; padding: 10px 14px; background: #fff7d6; border-top: 1px solid #e5d586; font-size: .78rem; }
.compliance-jurisdiction-note b { white-space: nowrap; }
.compliance-folder-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 14px; border-top: 1px solid #e2e8f0; }
.compliance-checklist-list { display: grid; border-top: 1px solid #e2e8f0; }
.compliance-checklist-item { display: grid; grid-template-columns: 44px minmax(260px, 1fr) 180px; gap: 12px; align-items: center; padding: 10px 12px; border-bottom: 1px solid #e2e8f0; }
.compliance-checklist-item.complete { background: #f0fdf4; }
.compliance-checklist-item.permit-flow-milestone { border-left: 4px solid #2563eb; background: #eff6ff; }
.compliance-checklist-item.permit-flow-milestone.complete { background: #ecfdf5; border-left-color: #16a34a; }
.permit-flow-status { display: grid; justify-items: stretch; gap: 7px; }
.permit-flow-status .badge { text-align: center; }
.permit-flow-status label,
.inspection-workflow-gate > label { display: grid; gap: 5px; font-size: .72rem; font-weight: 800; }
.inspection-workflow-gate > div { display: flex; flex-wrap: wrap; gap: 8px; }
.compliance-order { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #94a3b8; border-radius: 50%; font-weight: 800; color: #334155; }
.compliance-item-copy { display: grid; gap: 2px; }
.compliance-item-copy > span { color: var(--brand-primary, #a50f17); font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.compliance-item-copy p { margin: 0; color: #334155; font-size: .8rem; }
.compliance-item-copy small { color: #64748b; }
.compliance-checklist-item > label { display: grid; gap: 4px; font-size: .7rem; font-weight: 700; }
.compliance-photo-count { color: #64748b; white-space: nowrap; }
.compliance-inspection-sequence { display: grid; gap: 8px; padding: 14px; background: #f8fafc; }
.compliance-inspection-sequence h4, .compliance-inspection-sequence p { margin: 0; }
.compliance-inspection-sequence > div:first-child { display: grid; gap: 3px; }
.compliance-inspection-sequence > div:first-child p { color: #64748b; font-size: .78rem; }
.compliance-inspection-sequence article { display: grid; grid-template-columns: 36px minmax(190px, 1fr) minmax(200px, .8fr) auto; gap: 10px; align-items: center; padding: 9px 10px; border: 1px solid #cbd5e1; background: #fff; }
.compliance-inspection-sequence article > div { display: grid; gap: 2px; }
.compliance-inspection-sequence article small { color: #64748b; }
.compliance-xactimate-lines { margin-top: 8px; border: 1px solid #dbe5ef; background: #f8fafc; }
.compliance-xactimate-lines summary { cursor: pointer; padding: 7px 9px; color: #1d4ed8; font-size: .76rem; font-weight: 800; }
.compliance-xactimate-lines > div { display: grid; grid-template-columns: minmax(110px, .4fr) minmax(0, 1fr); gap: 8px; padding: 6px 9px; border-top: 1px solid #e2e8f0; font-size: .74rem; }
.inspection-sequence-number { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #111827; color: #fff; font-weight: 800; }
.construction-checklist-screen { display: grid; gap: 14px; }
.construction-checklist-job-select { display: grid; grid-template-columns: auto minmax(260px, 520px); gap: 12px; align-items: center; width: fit-content; font-size: .78rem; font-weight: 800; }
.permit-checklist-launch { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 14px; padding: 12px 14px; border: 1px solid #cbd5e1; background: #f8fafc; }
.permit-checklist-launch > div { display: grid; gap: 3px; }
.permit-checklist-launch span { color: #64748b; font-size: .78rem; }
.construction-inspection-selector { display: grid; gap: 12px; padding: 16px; border: 1px solid #94a3b8; background: #fff; }
.construction-inspection-selector > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.construction-inspection-selector h3, .construction-inspection-selector p { margin: 0; }
.construction-inspection-selector header p { margin-top: 4px; color: #64748b; font-size: .8rem; }
.construction-inspection-selector header strong { padding: 5px 9px; border-radius: 999px; background: #111827; color: #fff; white-space: nowrap; }
.construction-inspection-add { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto; gap: 10px; align-items: end; padding: 12px; border: 1px solid #dbe5ef; background: #f8fafc; }
.construction-inspection-add label { display: grid; gap: 5px; font-size: .72rem; font-weight: 800; }
.construction-inspection-selected { display: grid; gap: 7px; }
.construction-inspection-selected article { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 10px; border: 1px solid #cbd5e1; }
.construction-inspection-selected article > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #111827; color: #fff; font-weight: 800; }
.construction-inspection-selected article > div { display: flex; gap: 6px; }
.construction-inspection-save { justify-self: end; }
.permit-secondary-building { border: 1px solid #cbd5e1; background: #fff; }
.permit-secondary-building > summary { padding: 10px 12px; cursor: pointer; font-weight: 800; }
.permit-secondary-building .damage-assessment-grid { padding: 12px; }
.commercial-permit-fields { border: 1px solid #cbd5e1; background: #f8fafc; }
.commercial-permit-fields > h4 { margin: 0; padding: 10px 12px; border-bottom: 1px solid #cbd5e1; color: #344054; }
.commercial-permit-fields > .damage-assessment-grid { padding: 12px; }

.subcontractor-directory-panel { border-top: 2px solid var(--company-accent, #a71930); }
.subcontractor-directory-table { border: 1px solid var(--line); margin-bottom: 18px; overflow-x: auto; }
.subcontractor-directory-head,
.subcontractor-directory-row { display: grid; grid-template-columns: .8fr 1.5fr 1fr 1.15fr 1.35fr; min-width: 760px; align-items: center; }
.subcontractor-directory-head { background: var(--surface-muted, #f3f4f6); color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.subcontractor-directory-head span,
.subcontractor-directory-row > * { padding: 10px 12px; }
.subcontractor-directory-row { border-top: 1px solid var(--line); font-size: .84rem; }
.subcontractor-directory-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: end; }
.subcontractor-directory-form label { display: grid; gap: 6px; font-size: .76rem; font-weight: 800; text-transform: uppercase; }
.signature-security-note { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; margin-top: 16px; padding: 12px; border: 1px solid var(--line); background: var(--surface-muted, #f7f7f8); font-size: .8rem; }
.signature-security-note b { color: var(--company-accent, #a71930); }
.signature-enrollment-form { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 12px; align-items: end; margin-top: 12px; }
.signature-enrollment-form label { display: grid; gap: 6px; font-size: .76rem; font-weight: 800; text-transform: uppercase; }

.forms-upload-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
}
.forms-upload-grid label { display: grid; gap: 5px; color: #475467; font-size: 10px; font-weight: 650; letter-spacing: .055em; text-transform: uppercase; }
.forms-upload-grid input,
.forms-upload-grid select,
.forms-upload-grid textarea { width: 100%; min-height: 36px; border: 1px solid #cfd5dc; border-radius: 2px; background: #fff; color: #273445; font: inherit; letter-spacing: normal; text-transform: none; }
.forms-upload-grid .wide { grid-column: 1 / -1; }
.forms-role-fieldset { grid-column: span 4; display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 10px 12px; border: 1px solid #d7dce2; }
.forms-role-fieldset legend { padding: 0 5px; color: #475467; font-size: 9px; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; }
.forms-role-fieldset label { display: flex; grid-auto-flow: column; align-items: center; gap: 6px; font-size: 10px; text-transform: none; }
.forms-role-fieldset input { width: auto; min-height: 0; }

.company-process-builder { overflow: hidden; }
.process-template-toggle { display: flex; align-items: center; gap: 7px; color: #475467; font-size: 11px; font-weight: 650; }
.process-builder-columns,
.process-builder-row {
  display: grid;
  grid-template-columns: 42px minmax(210px, 1.4fr) minmax(150px, 1fr) minmax(155px, 1fr) minmax(155px, 1fr) minmax(210px, 1.25fr);
  align-items: stretch;
}
.process-builder-columns { border-top: 1px solid #d7dce2; border-bottom: 1px solid #d7dce2; background: #f2f4f6; }
.process-builder-columns span { padding: 8px 9px; border-right: 1px solid #d7dce2; color: #667085; font-size: 9px; font-weight: 700 !important; letter-spacing: .07em; text-transform: uppercase; }
.process-builder-list { max-height: 720px; overflow: auto; }
.process-builder-row { min-height: 66px; border-bottom: 1px solid #e1e5e9; background: #fff; }
.process-builder-row:nth-child(even) { background: #fafbfc; }
.process-order { display: grid; place-items: center; border-right: 1px solid #e1e5e9; color: #8f1523; font-size: 12px; font-weight: 700 !important; }
.process-builder-row label { min-width: 0; display: grid; align-content: center; gap: 3px; padding: 7px 8px; border-right: 1px solid #e1e5e9; color: #667085; font-size: 8px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.process-builder-row select { width: 100%; min-height: 34px; border: 1px solid #cfd5dc; border-radius: 2px; background: #fff; color: #273445; font-size: 10px; letter-spacing: normal; text-transform: none; }
.process-builder-row select[multiple] { min-height: 45px; }
.process-builder-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; background: #f7f8fa; }
.process-builder-actions span { color: #667085; font-size: 10px; }

.forms-inventory-table { display: grid; }
.forms-inventory-head,
.forms-inventory-row { display: grid; grid-template-columns: minmax(220px, 1.4fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(200px, 1.2fr) 110px; align-items: center; }
.forms-inventory-head { background: #f2f4f6; }
.forms-inventory-head span { padding: 8px 10px; border-right: 1px solid #d7dce2; color: #667085; font-size: 9px; font-weight: 700 !important; letter-spacing: .07em; text-transform: uppercase; }
.forms-inventory-row { min-height: 56px; border-top: 1px solid #e1e5e9; }
.forms-inventory-row > * { min-width: 0; margin: 0 8px; color: #475467; font-size: 10px; }
.forms-inventory-row b,
.forms-inventory-row small { display: block; }
.forms-inventory-row b { color: #273445; font-size: 11px; }
.forms-inventory-row small { margin-top: 3px; color: #667085; }

.permit-routing-panel { margin-top: 12px; border: 1px solid #d7dce2; background: #fff; }
.permit-routing-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, .65fr); align-items: end; gap: 16px; padding: 11px 13px; border-bottom: 1px solid #e1e5e9; }
.permit-routing-head > div { display: grid; gap: 2px; }
.permit-routing-head span,
.permit-routing-head label { color: #667085; font-size: 9px; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; }
.permit-routing-head b { color: #273445; }
.permit-routing-head small { color: #667085; }
.permit-routing-head label { display: grid; gap: 4px; }
.permit-routing-head select { min-height: 34px; border: 1px solid #cfd5dc; background: #fff; color: #273445; font-size: 11px; letter-spacing: normal; text-transform: none; }
.permit-routed-forms { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.permit-routed-form-item { display: grid; border-right: 1px solid #e1e5e9; }
.permit-routed-forms a { display: grid; gap: 3px; padding: 10px 12px; color: #273445; text-decoration: none; }
.permit-routed-form-item > button { margin: 0 12px 10px; justify-self: start; }
.permit-routing-head .damage-assessment-requirement { display: flex; align-items: center; gap: 8px; align-self: end; padding: 9px 10px; border: 1px solid #cbd5e1; background: #fff; font-size: .72rem; font-weight: 800; text-transform: none; }
.permit-routing-head .damage-assessment-requirement input { width: auto; margin: 0; }
.permit-routed-forms a:hover { background: #f8f1f2; color: #8f1523; }
.permit-routed-forms a span { color: #667085; font-size: 9px; }
.permit-no-forms { padding: 11px 12px; color: #667085; font-size: 10px; }

.setup-interview-progress { display: grid; gap: 6px; }
.setup-interview-progress > span { color: #667085; font-size: 10px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.setup-interview-progress > div { height: 5px; background: #dfe3e8; }
.setup-interview-progress i { display: block; height: 100%; background: #8f1523; transition: width 180ms ease; }
.setup-interview-card { max-width: 980px; width: 100%; margin: 0 auto; padding: 24px; border: 1px solid #d7dce2; border-top: 2px solid #8f1523; background: #fff; }
.setup-interview-card > h2 { margin: 5px 0 8px; color: #202b38; font-size: clamp(22px, 3vw, 32px); }
.setup-interview-card > p:not(.eyebrow) { color: #667085; }
.setup-interview-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 20px; border: 1px solid #d7dce2; }
.setup-option { display: grid; gap: 4px; min-height: 76px; padding: 14px; border: 0; border-right: 1px solid #d7dce2; border-bottom: 1px solid #d7dce2; background: #fff; color: #273445; text-align: left; cursor: pointer; }
.setup-option:hover,
.setup-option.selected { background: #f8f1f2; color: #8f1523; }
.setup-option span { color: #667085; font-size: 10px; }
.setup-interview-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.setup-answer-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; border: 1px solid #d7dce2; }
.setup-answer-summary > div { display: grid; gap: 4px; padding: 10px 12px; border-right: 1px solid #e1e5e9; border-bottom: 1px solid #e1e5e9; }
.setup-answer-summary span { color: #667085; font-size: 9px; }
.setup-answer-summary b { color: #273445; font-size: 11px; }

@media (max-width: 900px) {
  .damage-intake-source { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .damage-intake-source > div { border-bottom: 1px solid #e2e8f0; }
  .jurisdiction-placement-row { grid-template-columns: 1fr 1fr; }
  .jurisdiction-placement-row > button { grid-column: 2; justify-self: end; }
  .forms-upload-grid { grid-template-columns: 1fr 1fr; }
  .forms-role-fieldset { grid-column: span 2; }
  .process-builder-columns { display: none; }
  .process-builder-row { grid-template-columns: 34px 1fr 1fr; padding: 6px 0; }
  .process-order { grid-row: 1 / span 3; }
  .process-builder-row label { border-bottom: 1px solid #edf0f3; }
  .forms-inventory-head { display: none; }
  .forms-inventory-row { grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; }
  .permit-routing-head { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .damage-intake-source { display: none; }
}

@media (max-width: 600px) {
  .forms-library-heading-actions,
  .process-builder-actions { align-items: stretch; flex-direction: column; }
  .forms-upload-grid,
  .setup-interview-options,
  .setup-answer-summary { grid-template-columns: 1fr; }
  .jurisdiction-placement-row { grid-template-columns: 1fr; }
  .jurisdiction-placement-row > button { grid-column: 1; justify-self: stretch; }
  .forms-role-fieldset { grid-column: 1; }
  .process-builder-row { grid-template-columns: 32px 1fr; }
  .process-order { grid-row: 1 / span 5; }
  .forms-inventory-row { grid-template-columns: 1fr; }
}

/* v119 scheduling: locked customer data reads as metadata, not editable fields. */
.calendar-autofill-card {
  display: grid !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid #cbd3dc !important;
  border-radius: 2px !important;
  background: #f7f9fb !important;
  box-shadow: none !important;
}

.calendar-autofill-card .linked-contact-heading {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border-bottom: 1px solid #d9dfe6;
  background: #eef2f6;
}

.linked-contact-heading > span {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  flex: 0 0 22px;
  border: 1px solid #7b8794;
  border-radius: 50%;
  color: #44515f;
  font-family: Georgia, serif !important;
  font-size: 13px;
  font-weight: 700 !important;
}

.linked-contact-heading > div {
  display: grid;
  gap: 1px;
}

.linked-contact-heading b {
  color: #243140;
  font-size: 11px;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.linked-contact-heading small {
  color: #687483;
  font-size: 10px;
}

.calendar-autofill-card dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.calendar-autofill-card dl > div {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 11px 13px;
  border-right: 1px solid #dfe4ea;
}

.calendar-autofill-card dl > div:last-child { border-right: 0; }
.calendar-autofill-card dt {
  color: #687483;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.calendar-autofill-card dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: #1f2c3a;
  font-size: 12px;
  font-weight: 600;
}

/* v119 financial simulator: one rolling ledger with dedicated AP and AR queues. */
.accounting-planner {
  padding: 0 !important;
  overflow: hidden;
}

.accounting-planner .planner-head {
  padding: 15px 17px;
  border-bottom: 1px solid #d9dfe6;
  background: #f8fafc;
}

.cash-ledger-scroll,
.finance-table-scroll {
  width: 100%;
  overflow-x: auto;
}

.cash-ledger-table,
.finance-queue-table {
  width: 100%;
  border-collapse: collapse;
  background: #ffffff;
  font-variant-numeric: tabular-nums;
}

.cash-ledger-table { min-width: 720px; }
.cash-ledger-table th,
.cash-ledger-table td {
  padding: 11px 14px;
  border-right: 1px solid #dfe4ea;
  border-bottom: 1px solid #dfe4ea;
  text-align: right;
}

.cash-ledger-table th:first-child,
.cash-ledger-table td:first-child {
  width: 26%;
  text-align: left;
}

.cash-ledger-table thead th {
  background: #27313c;
  color: #ffffff;
  font-size: 10px;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.cash-ledger-table tbody th {
  color: #475467;
  font-size: 11px;
}

.cash-ledger-table td {
  color: #1f2937;
  font-size: 13px;
  font-weight: 600;
}

.cash-ledger-table .ledger-income td { color: #047857; }
.cash-ledger-table .ledger-expense td { color: #9b1827; }
.cash-ledger-table .ledger-ending th,
.cash-ledger-table .ledger-ending td {
  border-top: 2px solid #7d8793;
  background: #f4f6f8;
  font-weight: 700;
}

.cash-ledger-table .ledger-ending td.ledger-good { color: #047857; }
.cash-ledger-table .ledger-ending td.ledger-watch { background: #fff8e6; color: #9a6700; }
.cash-ledger-table .ledger-ending td.ledger-danger { background: #fff0f2; color: #b42335; }

.allocation-guidelines,
.custom-ar-entry {
  border-top: 1px solid #d9dfe6;
  background: #fbfcfd;
}

.allocation-guidelines summary,
.custom-ar-entry summary {
  padding: 11px 16px;
  color: #344054;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .035em;
  cursor: pointer;
}

.allocation-guidelines > div {
  display: grid;
  gap: 0;
  padding: 0 16px 12px 34px;
}

.allocation-guidelines p {
  margin: 4px 0;
  color: #5b6674;
  font-size: 11px;
}

.finance-queue-section {
  border-top: 1px solid #cfd6de;
}

.finance-queue-section > .week-section-title {
  min-height: 48px;
  align-items: center;
  padding: 10px 16px;
  background: #f4f6f8;
}

.finance-queue-table { min-width: 860px; }
.finance-queue-table th,
.finance-queue-table td {
  padding: 10px 12px;
  border-right: 1px solid #e1e6eb;
  border-bottom: 1px solid #e1e6eb;
  color: #344054;
  font-size: 11px;
  text-align: left;
  vertical-align: middle;
}

.finance-queue-table th {
  background: #fafbfc;
  color: #667085;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.finance-queue-table tr.selected td { background: #fff7f8; }
.finance-queue-table td strong,
.finance-queue-table td small {
  display: block;
}
.finance-queue-table td strong { color: #1f2937; }
.finance-queue-table td small { margin-top: 3px; color: #667085; }
.finance-queue-table .finance-open {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}
.finance-queue-table select {
  min-width: 108px;
  min-height: 34px;
  padding: 5px 8px;
  border: 1px solid #bfc7d1;
  border-radius: 2px;
  background: #fff;
  color: #263240;
}
.subcontractor-draw-profile-table { min-width: 940px; }
.subcontractor-draw-profile-table input { min-width: 110px; min-height: 34px; padding: 5px 8px; border: 1px solid #bfc7d1; background: #fff; }

.finance-amount-cell {
  color: #17212b !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap;
}

.ledger-pay-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.ledger-move-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.finance-empty-cell {
  padding: 18px !important;
  color: #667085 !important;
  text-align: center !important;
}

.custom-ar-grid {
  grid-template-columns: repeat(5, minmax(120px, 1fr)) auto !important;
  align-items: end;
  padding: 0 14px 14px;
}

@media (max-width: 760px) {
  .calendar-autofill-card dl { grid-template-columns: 1fr; }
  .calendar-autofill-card dl > div {
    border-right: 0;
    border-bottom: 1px solid #dfe4ea;
  }
  .calendar-autofill-card dl > div:last-child { border-bottom: 0; }
  .custom-ar-grid { grid-template-columns: 1fr !important; }
}

/* v120 customer database: fixed enterprise matrix instead of repeated field labels. */
.customer-table-scroll {
  width: 100%;
  overflow-x: auto;
  border: 1px solid #cfd6de !important;
  background: #ffffff;
}

.customer-database-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: collapse;
  table-layout: fixed;
  background: #ffffff;
}

.customer-database-table th,
.customer-database-table td {
  padding: 11px 13px;
  border-right: 1px solid #e0e5ea;
  border-bottom: 1px solid #e0e5ea;
  color: #344054;
  font-size: 11px;
  line-height: 1.35;
  text-align: left;
  vertical-align: middle;
}

.customer-database-table th:last-child,
.customer-database-table td:last-child { border-right: 0; }
.customer-database-table tbody tr:last-child td { border-bottom: 0; }

.customer-database-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #eef1f4;
  color: #55606e;
  font-size: 9px;
  font-weight: 650 !important;
  letter-spacing: .085em;
  text-transform: uppercase;
}

.customer-database-table th:nth-child(1) { width: 24%; }
.customer-database-table th:nth-child(2) { width: 14%; }
.customer-database-table th:nth-child(3) { width: 18%; }
.customer-database-table th:nth-child(4) { width: 21%; }
.customer-database-table th:nth-child(5) { width: 14%; }
.customer-database-table th:nth-child(6) { width: 9%; }

.customer-database-table tbody tr:hover td { background: #f8fafc; }

.customer-database-table td > a,
.customer-database-table td > span,
.customer-database-table td > small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.customer-database-table td > a {
  color: #344054;
  text-decoration: none;
}

.customer-database-table td > a:hover {
  color: #9b1827;
  text-decoration: underline;
}

.customer-database-table td > small {
  margin-top: 3px;
  color: #7b8490;
  font-size: 10px;
}

.customer-table-primary strong,
.customer-table-primary > small { display: block; }

.customer-table-primary strong {
  color: #17212b;
  font-size: 12px;
  font-weight: 650 !important;
}

.customer-table-primary > small {
  margin-top: 2px;
  color: #667085;
  font-size: 10px;
}

.customer-table-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 7px;
}

.customer-micro-badge {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  padding: 2px 6px;
  border: 1px solid #cbd2da;
  border-radius: 2px;
  background: #ffffff;
  color: #596473;
  font-size: 8px;
  font-weight: 650 !important;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.customer-micro-badge.current {
  border-color: #88b8a5;
  color: #047857;
}

.customer-micro-badge.historical {
  border-color: #b8c0ca;
  color: #596473;
}

.customer-micro-badge.warranty-active {
  border-color: #74b895;
  background: #eaf7ef;
  color: #08663d;
}

.customer-warranty-cell small { margin-top: 5px !important; color: #435466 !important; white-space: normal; }

.customer-empty-value {
  color: #a0a8b2 !important;
  font-size: 13px;
}

.customer-table-action {
  text-align: right !important;
  white-space: nowrap;
}

.customer-table-action button {
  width: 100%;
  min-height: 32px !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

.customer-table-empty {
  padding: 24px !important;
  color: #667085 !important;
  text-align: center !important;
}

@media (max-width: 760px) {
  .customer-table-scrollbar-top { display: none; }
  .customer-database-table { min-width: 850px; }
  .customer-database-table th,
  .customer-database-table td { padding: 9px 10px; }
}

/* Customer database, programming tools, and direct workflow re-entry. */
.customer-database-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid #d7dce2;
  background: #fff;
}

.customer-database-metrics > div {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-right: 1px solid #d7dce2;
}

.customer-database-metrics > div:last-child { border-right: 0; }
.customer-database-metrics span,
.customer-database-row small { color: #667085; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.customer-database-metrics b { color: #17212b; font-size: 24px; }

.customer-database-search { display: grid; gap: 6px; margin: 16px 0 10px; }
.customer-database-list { border: 1px solid #d7dce2; background: #fff; }
.customer-database-row {
  display: grid;
  grid-template-columns: minmax(170px, 1.2fr) minmax(120px, .8fr) minmax(180px, 1fr) minmax(220px, 1.5fr) minmax(130px, .8fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #e5e9ef;
}
.customer-database-row:last-child { border-bottom: 0; }
.customer-database-row > div { min-width: 0; display: grid; gap: 3px; }
.customer-database-row a,
.customer-database-row span { overflow-wrap: anywhere; color: #344054; }
.customer-primary b { color: #17212b; }
.customer-history-label { color: #667085; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.customer-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; color: #667085; }
.customer-pagination > div { display: flex; gap: 8px; }

.programming-metric-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.static-metric { cursor: default !important; }
.think-tank-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid #d7dce2; background: #fff; }
.think-tank-lane { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: start; padding: 16px; border-right: 1px solid #e5e9ef; border-bottom: 1px solid #e5e9ef; }
.think-tank-lane > span { color: #8f1523; font-weight: 900; }
.think-tank-lane h3 { margin: 0 0 5px; }
.think-tank-lane p { margin: 0; color: #667085; }
.think-tank-lane > b { color: #667085; font-size: 10px; text-transform: uppercase; }
.think-tank-actions { margin-top: 16px; }
.system-learning-card {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid #ccd5df;
  border-radius: 18px;
  background: linear-gradient(145deg, #ffffff 0%, #f6f8fb 100%);
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
}
.system-learning-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.system-learning-heading h3 { margin: 2px 0 7px; font-size: clamp(22px, 3vw, 30px); }
.system-learning-heading p:last-child { margin: 0; max-width: 850px; color: #667085; line-height: 1.55; }
.system-learning-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.system-learning-actions small { color: #667085; }
.system-learning-review {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid #d7dce2;
  border-radius: 14px;
  background: #fff;
}
.system-learning-review > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid #e5e9ef;
  background: #f3f5f8;
}
.system-learning-review > div span { color: #667085; font-size: 12px; }
.system-learning-review section {
  max-height: 520px;
  overflow: auto;
  padding: 18px;
}
.system-learning-review h4 { margin: 18px 0 7px; color: #172033; font-size: 18px; }
.system-learning-review h4:first-child { margin-top: 0; }
.system-learning-review h5 { margin: 14px 0 6px; color: #344054; }
.system-learning-review p { margin: 5px 0; color: #475467; line-height: 1.5; overflow-wrap: anywhere; }
.system-learning-bullet { position: relative; padding-left: 18px; }
.system-learning-bullet::before { content: "\2022"; position: absolute; left: 3px; color: var(--brand-accent, #a80f17); font-weight: 900; }
.system-learning-space { height: 8px; }

.job-compact-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; }
.job-compact-head .job-compact-summary { width: 100%; }
.job-row-controls {
  display: flex;
  align-items: stretch;
  border-left: 1px solid #d7dce2;
  background: #fff;
}
.job-row-controls .job-summary-toggle {
  width: 42px;
  height: auto;
  min-height: 42px;
  align-self: stretch;
  border: 0;
  border-right: 1px solid #d7dce2;
  border-radius: 0;
  background: #fff;
}

@media (max-width: 900px) {
  .process-builder-grid { overflow-x: hidden; }
  .process-builder-columns { display: none !important; }
  .process-builder-row {
    min-width: 0 !important;
    grid-template-columns: 34px repeat(2, minmax(0, 1fr)) !important;
  }
  .process-order { grid-row: 1 / span 3; }
}

@media (max-width: 600px) {
  .process-builder-row {
    grid-template-columns: 32px minmax(0, 1fr) !important;
  }
  .process-order { grid-row: 1 / span 5; }
}

.job-summary-delete {
  min-width: 64px;
  padding: 0 10px;
  border: 0;
  border-right: 1px solid #d7dce2;
  border-radius: 0;
  background: #fff;
  color: #9f1239;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .035em;
  cursor: pointer;
}
.job-summary-delete:hover,
.job-summary-delete:focus-visible { background: #fff1f2; color: #881337; }

.company-email-connection-panel { border-left: 3px solid var(--brand-primary, #a50f17) !important; }
.email-connection-status {
  display: grid;
  gap: 4px;
  margin: 0 0 14px;
  padding: 11px 13px;
  border: 1px solid #d7dce2;
  border-radius: 3px;
  background: #f8fafc;
}
.email-connection-status.ready { border-left: 3px solid #047857; }
.email-connection-status.pending { border-left: 3px solid #b45309; }
.email-connection-status b { color: #273445; font-size: 13px; }
.email-connection-status span { color: #667085; font-size: 11px; }
.job-summary-next {
  min-width: 82px;
  padding: 0 14px;
  border: 0;
  border-radius: 0;
  background: #8f1523;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}
.job-summary-next:hover,
.job-summary-next:focus-visible { background: #b21f31; color: #fff; }
.job-summary-next span { margin-left: 4px; }

@media (max-width: 759px) {
  .job-summary-delete { min-width: 48px; padding: 0 6px; font-size: 9px; }
  .job-row-controls .job-summary-toggle { width: 36px; }
  .job-summary-next { min-width: 66px; padding: 0 9px; font-size: 10px; }
}
.mobile-new-sale { white-space: nowrap; }

@media (max-width: 850px) {
  .customer-database-metrics,
  .programming-metric-grid,
  .think-tank-grid { grid-template-columns: 1fr; }
  .system-learning-card { padding: 15px; }
  .system-learning-heading { flex-direction: column; gap: 10px; }
  .system-learning-actions { align-items: stretch; }
  .system-learning-actions .primary-button,
  .system-learning-actions .secondary-button { width: 100%; }
  .system-learning-review > div { flex-direction: column; gap: 3px; }
  .system-learning-review section { max-height: none; padding: 15px; }
  .customer-database-metrics > div { border-right: 0; border-bottom: 1px solid #d7dce2; }
  .customer-database-row { grid-template-columns: 1fr 1fr; }
  .customer-primary,
  .customer-property { grid-column: 1 / -1; }
  .think-tank-lane { border-right: 0; }
}

/* Program-wide enterprise typography. Keep hierarchy crisp without faux-heavy text. */
body,
input,
textarea,
select,
button {
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-kerning: normal;
}

body { font-weight: 400; line-height: 1.45; }
h1, h2, h3, h4, h5, h6 {
  color: #17212b;
  font-weight: 650 !important;
  letter-spacing: -0.018em;
  line-height: 1.18;
}

p,
li,
td,
textarea,
input,
select { font-weight: 400; }

label,
legend,
th { font-weight: 600 !important; letter-spacing: 0.01em; }

small,
.small,
.muted { font-weight: 450 !important; letter-spacing: 0.005em; }

.primary-button,
.secondary-button,
.danger-button,
.mini-button,
.contact-button,
.next-job-button,
.job-summary-next,
.top-nav button,
.bottom-nav button,
.desktop-module-tabs button,
.app-workflow-rail button,
.command-operation-row,
.filter-pill {
  font-weight: 600 !important;
  letter-spacing: 0.035em !important;
  text-rendering: geometricPrecision;
}

.eyebrow,
.badge,
.access-pill,
.build-version-pill,
.app-workflow-rail-title {
  font-weight: 650 !important;
  letter-spacing: 0.08em !important;
}

.command-metric-card b,
.stat-card strong,
.accounting-banner span {
  font-variant-numeric: tabular-nums;
  font-weight: 650 !important;
  letter-spacing: -0.025em;
}

body span { font-weight: 500 !important; }
body b,
body strong { font-weight: 650 !important; }
body em { font-weight: 600 !important; }
.notice,
.login-error,
.map-empty,
.restricted-note { font-weight: 550 !important; }
.eyebrow,
.badge,
.access-pill,
.build-version-pill,
.app-workflow-rail-title { font-weight: 650 !important; }

/* v231 email safety lock for real-client data entry. */
.email-test-mode-button {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 1px;
  min-height: 38px;
  padding: 6px 11px;
  border: 1px solid #d7cdbf;
  border-radius: 4px;
  background: #fff7ed;
  color: #7c2d12;
  font: inherit;
  font-weight: 800;
  line-height: 1.1;
  cursor: pointer;
}

.email-test-mode-button b {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.email-test-mode-button.off {
  background: #ecfdf5;
  border-color: #86efac;
  color: #065f46;
}

.email-test-mode-button.sidebar,
.email-test-mode-button.mobile {
  width: 100%;
}

.email-test-mode-banner,
.email-test-mode-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid #fed7aa;
  border-left: 5px solid #ea580c;
  border-radius: 4px;
  background: #fff7ed;
  color: #7c2d12;
  padding: 12px 14px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.email-test-mode-banner {
  margin-bottom: 14px;
}

.email-test-mode-banner div,
.email-test-mode-card div {
  display: grid;
  gap: 3px;
}

.email-test-mode-banner b,
.email-test-mode-card b {
  color: #111827;
}

.email-test-mode-banner span,
.email-test-mode-card span {
  color: #7c2d12;
  font-size: 13px;
  line-height: 1.35;
}

.email-test-mode-banner button,
.email-test-mode-card button {
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid #9a3412;
  border-radius: 3px;
  background: #9a3412;
  color: #fff;
  font-weight: 850;
  cursor: pointer;
}

.email-test-mode-card.off {
  border-color: #86efac;
  border-left-color: #059669;
  background: #ecfdf5;
  color: #065f46;
}

.email-test-mode-card.off span {
  color: #047857;
}

.email-test-mode-card.off button {
  border-color: #065f46;
  background: #065f46;
}

@media (max-width: 640px) {
  .email-test-mode-banner,
  .email-test-mode-card {
    grid-template-columns: 1fr;
  }
}

/* v238 Owner Test Center: clear safety status before live client communication. */
.test-center-screen {
  display: grid;
  gap: 18px;
}

.test-center-title {
  align-items: center;
}

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

.test-safety-card,
.test-result-card,
.test-flow-panel,
.test-action-panel {
  border: 1px solid #d8d1c5;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.045);
}

.test-safety-card {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 154px;
  padding: 14px;
  border-left-width: 4px;
}

.test-safety-card.good { border-left-color: #047857; }
.test-safety-card.warning { border-left-color: #d97706; }
.test-safety-card.danger { border-left-color: #b91c1c; }

.test-safety-card span,
.test-result-card span {
  color: #5f6b7a;
  font-size: 11px;
  font-weight: 800 !important;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.test-safety-card b,
.test-result-card b {
  color: #111827;
  font-size: 17px;
}

.test-safety-card p,
.test-result-card p,
.test-check-row p,
.test-action-panel p {
  margin: 0;
  color: #4b5563;
  font-size: 13px;
  line-height: 1.45;
}

.test-safety-card button {
  justify-self: start;
  min-height: 34px;
  padding: 6px 11px;
  border: 1px solid #8f1523;
  border-radius: 3px;
  background: #8f1523;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}

.test-result-card {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  border-left: 4px solid #245a86;
  background: #f8fafc;
}

.test-result-card div {
  display: grid;
  gap: 4px;
}

.test-center-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.65fr);
  gap: 14px;
  align-items: start;
}

.test-flow-panel {
  padding: 16px;
}

.test-checklist {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.test-check-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid #e5e0d8;
  border-radius: 4px;
  background: #fbf7ef;
}

.test-check-row > span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 3px;
  background: #1f3b57;
  color: #fff;
  font-weight: 900 !important;
}

.test-check-row b {
  display: block;
  margin-bottom: 4px;
  color: #111827;
}

.test-action-panel {
  display: grid;
  gap: 10px;
  padding: 16px;
  position: sticky;
  top: 16px;
}

.test-action-panel h3 {
  margin: 0;
}

.test-action-panel button {
  width: 100%;
}

@media (max-width: 1100px) {
  .test-safety-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .test-center-workbench {
    grid-template-columns: 1fr;
  }

  .test-action-panel {
    position: static;
  }
}

@media (max-width: 640px) {
  .test-safety-grid {
    grid-template-columns: 1fr;
  }
}

/* v115 premium dashboard details: structured contrast without app bubbles. */
.desktop-nav-group { display: none; }

.command-metric-card,
.streamlit-metric-card,
.command-operation-row,
.streamlit-job-row,
.desktop-module-tabs button {
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.command-metric-card {
  min-height: 104px;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto 1fr;
  column-gap: 12px;
  padding: 14px 16px;
  border-top-color: #cfd5dc !important;
}

.command-metric-card.has-value {
  border-left: 2px solid #8f1523 !important;
  background: linear-gradient(100deg, rgba(143, 21, 35, .035), #fff 46%) !important;
}

.command-metric-card.zero-value { background: #fff !important; }
.command-metric-card > span { grid-column: 1; grid-row: 1; }
.command-metric-card > b {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  min-width: 48px;
  color: #1f2937;
  font-size: clamp(32px, 3vw, 38px);
  text-align: right;
}
.command-metric-card > small { grid-column: 1; grid-row: 2; align-self: end; }

.command-operation-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
}
.command-operation-row:hover .command-operation-icon { color: #8f1523; }

.streamlit-metric-card {
  min-height: 92px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 15px 17px !important;
  border: 1px solid #d7dce2 !important;
  background: #fff !important;
  text-align: left !important;
  box-shadow: none !important;
}
.streamlit-metric-card.has-value {
  border-left: 2px solid #8f1523 !important;
  background: linear-gradient(100deg, rgba(143, 21, 35, .035), #fff 52%) !important;
}
.streamlit-metric-card.zero-value { background: #fff !important; }
.streamlit-metric-card b { align-self: start; color: #475467 !important; font-size: 11px !important; letter-spacing: .055em; text-transform: uppercase; }
.streamlit-metric-card h3 { margin: 0 !important; color: #1f2937 !important; font-size: 36px !important; font-weight: 650 !important; line-height: 1 !important; text-align: right; }
.streamlit-metric-card.active { border-color: #8f1523 !important; }

.streamlit-status-box {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.streamlit-status-box .status-pill,
.app-shell:not(.app-mode) .streamlit-status-box .status-pill {
  display: inline-flex !important;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  padding: 5px 9px !important;
  border: 1px solid #7dd3fc !important;
  border-radius: 2px !important;
  background: transparent !important;
  color: #0284c7 !important;
  box-shadow: none !important;
}
.streamlit-status-box .status-pill.gold { border-color: #d6a548 !important; color: #8a5a00 !important; }
.streamlit-status-box .status-pill.green { border-color: #6bc6a5 !important; color: #047857 !important; }

.streamlit-next-box,
.app-shell:not(.app-mode) .streamlit-next-box {
  min-height: 0 !important;
  padding: 0 0 0 14px !important;
  border: 0 !important;
  border-left: 1px solid #e2e6eb !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.streamlit-next-box > span { color: #667085 !important; font-size: 9px !important; letter-spacing: .08em; text-transform: uppercase; }
.streamlit-next-box > b { display: flex; gap: 7px; align-items: center; color: #273445 !important; }
.streamlit-next-box > b::before { content: "→"; color: #8f1523; font-size: 15px; font-weight: 650; }

.streamlit-row-actions .primary-button,
.streamlit-row-actions .secondary-button,
.control-window-button {
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-radius: 2px !important;
  box-shadow: none !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
}

.streamlit-job-row:hover { background: #f8fafc !important; }

@media (min-width: 1080px) {
  .app-shell:not(.app-mode) .desktop-module-tabs::before { display: none !important; }
  .app-shell:not(.app-mode) .desktop-module-tabs { gap: 0 !important; }
  .app-shell:not(.app-mode) .desktop-nav-group {
    display: block;
    margin: 14px 0 5px;
    padding: 0 12px;
    color: rgba(222, 228, 235, .5);
    font-size: 9px;
    font-weight: 500 !important;
    letter-spacing: .14em;
    line-height: 1;
    text-transform: uppercase;
  }
  .app-shell:not(.app-mode) .desktop-nav-group:first-child { margin-top: 0; }
  .app-shell:not(.app-mode) .desktop-module-tabs button {
    min-height: 39px !important;
    border-radius: 0 !important;
  }
  .app-shell:not(.app-mode) .desktop-module-tabs button.active {
    border-left: 3px solid var(--brand-primary, #b91c2b) !important;
    background: #343b45 !important;
  }
  .app-shell:not(.app-mode) .desktop-module-tabs .nav-icon { color: #aeb7c2 !important; }
  .app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon,
  .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon { color: #e85b64 !important; }
}

/* v116 professional desktop program menu: compact icon rail + ordered workspace navigation. */
.desktop-program-rail,
.desktop-nav-panel-title {
  display: none;
}

@media (min-width: 1080px) {
  .app-shell:not(.app-mode) {
    grid-template-columns: 58px 244px minmax(0, 1fr) !important;
    grid-template-rows: 58px minmax(0, 1fr) !important;
    background: #f3f5f7 !important;
  }

  .app-shell:not(.app-mode) .desktop-program-rail {
    position: sticky;
    top: 0;
    z-index: 45;
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 58px;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-right: 1px solid #30343a;
    background: #17191d;
    color: #b9c0c8;
  }

  .desktop-program-rail button {
    position: relative;
    width: 57px;
    height: 49px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #aeb5bd;
    box-shadow: none;
    cursor: pointer;
  }

  .desktop-program-rail button:hover,
  .desktop-program-rail button:focus-visible {
    background: #22262b;
    color: #ffffff;
    outline: none;
  }

  .desktop-program-rail nav {
    width: 100%;
    display: grid;
    margin-top: 10px;
  }

  .desktop-program-rail nav button.active {
    background: #24282e;
    color: #f3f5f7;
  }

  .desktop-program-rail nav button.active::before {
    content: "";
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 0;
    width: 3px;
    background: var(--brand-primary, #b91c2b);
  }

  .desktop-program-rail button svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
  }

  .desktop-program-rail .desktop-program-brand {
    height: 58px;
    border-bottom: 1px solid #30343a;
    color: #ffffff;
  }

  .program-grid-mark {
    width: 22px;
    height: 22px;
    display: grid;
    grid-template-columns: repeat(2, 8px);
    grid-template-rows: repeat(2, 8px);
    justify-content: center;
    align-content: center;
    gap: 4px;
  }

  .program-grid-mark i {
    display: block;
    border: 1px solid #c6ccd3;
    border-radius: 2px;
    background: #c6ccd3;
  }

  .desktop-program-rail .desktop-program-profile {
    width: 32px;
    height: 32px;
    margin: auto 0 14px;
    border: 1px solid #59616b;
    border-radius: 50%;
    background: #22262b;
    color: #f5f6f7;
    font-size: 12px;
    font-weight: 650 !important;
  }

  .app-shell:not(.app-mode) .desktop-utility-header {
    grid-column: 2 / -1 !important;
    grid-row: 1 !important;
    height: 58px !important;
    padding: 0 20px !important;
    border-bottom: 1px solid #30343a !important;
    background: #17191d !important;
    color: #f5f6f7 !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .desktop-utility-brand img {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    border-color: #424850;
  }

  .app-shell:not(.app-mode) .desktop-utility-brand b,
  .app-shell:not(.app-mode) .desktop-workspace-context b,
  .app-shell:not(.app-mode) .desktop-profile-summary b {
    color: #f5f6f7 !important;
  }

  .app-shell:not(.app-mode) .desktop-utility-brand span,
  .app-shell:not(.app-mode) .desktop-workspace-context small,
  .app-shell:not(.app-mode) .desktop-profile-summary small {
    color: #9ca4ae !important;
  }

  .app-shell:not(.app-mode) .desktop-workspace-context {
    border-right-color: #373c43 !important;
  }

  .app-shell:not(.app-mode) .desktop-profile-summary > span {
    border-color: #505761;
    background: #24282e;
    color: #ffffff;
  }

  .app-shell:not(.app-mode) .desktop-new-sale {
    min-height: 34px !important;
    padding: 0 14px !important;
    border: 1px solid #a91a28 !important;
    border-radius: 2px !important;
    background: #971522 !important;
  }

  .app-shell:not(.app-mode) > .topbar {
    top: 58px !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
    width: 244px !important;
    height: calc(100vh - 58px) !important;
    border-right: 1px solid #30343a !important;
    background: #202327 !important;
  }

  .app-shell:not(.app-mode) > .topbar .topbar-inner {
    gap: 0 !important;
    padding: 0 0 14px !important;
    background: #202327 !important;
  }

  .app-shell:not(.app-mode) .desktop-nav-panel-title {
    min-height: 68px;
    display: grid;
    align-content: center;
    gap: 3px;
    padding: 13px 15px;
    border-bottom: 1px solid #353a41;
  }

  .app-shell:not(.app-mode) .desktop-nav-panel-title span {
    color: #828b96 !important;
    font-size: 9px;
    font-weight: 550 !important;
    letter-spacing: .13em;
    text-transform: uppercase;
  }

  .app-shell:not(.app-mode) .desktop-nav-panel-title b {
    color: #f0f2f4;
    font-size: 14px;
    font-weight: 600 !important;
    letter-spacing: .005em;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs {
    gap: 0 !important;
    padding: 0 0 10px !important;
  }

  .app-shell:not(.app-mode) .desktop-nav-group {
    margin: 17px 0 5px !important;
    padding: 0 15px !important;
    color: #757e89 !important;
    font-size: 9px !important;
    font-weight: 550 !important;
    letter-spacing: .14em !important;
  }

  .app-shell:not(.app-mode) .desktop-nav-panel-title + .desktop-nav-group {
    margin-top: 15px !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button {
    min-height: 42px !important;
    grid-template-columns: 24px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 8px 14px !important;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    border-bottom: 0 !important;
    background: transparent !important;
    color: #b8c0c9 !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button:hover {
    border-left-color: #636c76 !important;
    background: #292d32 !important;
    color: #ffffff !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button.active {
    border-left-color: var(--brand-primary, #b91c2b) !important;
    background: #2b2f35 !important;
    color: #ffffff !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs .nav-icon {
    width: 21px !important;
    height: 21px !important;
    color: #929ba5 !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon,
  .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon {
    color: #e26670 !important;
  }

  .app-shell:not(.app-mode) > .topbar .shell-row {
    margin: auto 14px 0 !important;
  }

  .app-shell:not(.app-mode) .desktop-sidebar-footer {
    padding: 0 14px;
  }

  .app-shell:not(.app-mode) > .app-content {
    grid-column: 3 !important;
    grid-row: 2 !important;
    min-height: calc(100vh - 58px) !important;
    background: #f3f5f7 !important;
  }

  .app-shell:not(.app-mode) .screen {
    padding: 24px 30px 42px !important;
  }
}

/* v117: electric-red navigation accents on a continuous black desktop menu. */
@media (min-width: 1080px) {
  .app-shell:not(.app-mode) .desktop-module-tabs {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button.active {
    border-left-color: #ff2d55 !important;
    background: linear-gradient(90deg, rgba(255, 45, 85, .22) 0%, rgba(255, 45, 85, .07) 55%, rgba(255, 45, 85, 0) 100%) !important;
    color: #ffffff !important;
    box-shadow: inset 3px 0 12px rgba(255, 45, 85, .16) !important;
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon,
  .app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon {
    color: #ff496a !important;
    filter: drop-shadow(0 0 5px rgba(255, 45, 85, .68));
  }

  .app-shell:not(.app-mode) .desktop-module-tabs button:hover {
    border-left-color: #ff496a !important;
    background: rgba(255, 45, 85, .08) !important;
  }

  .desktop-program-rail nav button.active::before {
    background: #ff2d55 !important;
    box-shadow: 0 0 8px rgba(255, 45, 85, .95), 0 0 16px rgba(255, 45, 85, .45);
  }

  .desktop-program-rail nav button.active {
    background: linear-gradient(90deg, rgba(255, 45, 85, .16), #24282e 72%) !important;
    color: #ff496a !important;
  }

  .desktop-program-rail nav button.active svg {
    filter: drop-shadow(0 0 6px rgba(255, 45, 85, .75));
  }

  .program-grid-mark i {
    border-color: #ff496a;
    background: #ff496a;
    box-shadow: 0 0 6px rgba(255, 45, 85, .45);
  }
}

/* v118 universal screen navigation. New authenticated screens inherit this automatically. */
.program-page-navigation {
  position: sticky;
  top: 0;
  z-index: 18;
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border-bottom: 1px solid #d7dce2;
  background: rgba(243, 245, 247, .96);
  backdrop-filter: blur(10px);
}

.program-page-navigation button {
  min-height: 32px;
  padding: 6px 11px;
  border: 1px solid #aeb6c0;
  border-radius: 2px;
  background: #ffffff;
  color: #303945;
  box-shadow: none;
  font-size: 11px;
  font-weight: 650 !important;
  letter-spacing: .02em;
  cursor: pointer;
}

.program-page-navigation .program-main-button {
  border-color: #9b1827;
  background: #9b1827;
  color: #ffffff;
}

.program-page-navigation button:hover:not(:disabled),
.program-page-navigation button:focus-visible:not(:disabled) {
  border-color: #ff2d55;
  box-shadow: 0 0 0 2px rgba(255, 45, 85, .12);
}

.program-page-navigation button:disabled {
  opacity: .4;
  cursor: default;
}

.program-page-navigation > span {
  margin-left: auto;
  overflow: hidden;
  color: #5a6470;
  font-size: 11px;
  font-weight: 600 !important;
  letter-spacing: .07em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

@media (max-width: 1079px) {
  .program-page-navigation {
    min-height: 52px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, .97);
  }

  .program-page-navigation button {
    min-height: 38px;
    padding: 7px 10px;
    font-size: 12px;
  }

  .program-page-navigation > span {
    font-size: 10px;
  }
}

.sales-form-grid label:has(.address-suggestion-menu),
.lead-intake-field:has(.address-suggestion-menu) {
  position: relative;
  z-index: 12;
}

.address-suggestion-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 80;
  display: grid;
  max-height: 300px;
  overflow-y: auto;
  border: 1px solid #94a3b8;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.22);
}

.address-suggestion-menu[hidden] {
  display: none;
}

.address-suggestion-menu button {
  display: grid;
  gap: 3px;
  width: 100%;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid #e2e8f0;
  border-radius: 0;
  background: #ffffff;
  color: #111827;
  text-align: left;
}

.address-suggestion-menu button:last-child {
  border-bottom: 0;
}

.address-suggestion-menu button:hover,
.address-suggestion-menu button:focus {
  background: #eff6ff;
  outline: 2px solid #2563eb;
  outline-offset: -2px;
}

.address-suggestion-menu button b {
  font-size: 14px;
  line-height: 1.3;
}

.address-suggestion-menu button small,
.address-suggestion-note {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.address-suggestion-note {
  padding: 12px 14px;
}

.field-focus-launch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin-bottom: 12px;
  padding: 14px 16px;
  border: 2px solid var(--brand-primary, #b91c1c);
  border-radius: 12px;
  background: var(--brand-primary, #b91c1c);
  color: #ffffff;
  text-align: left;
}

.field-home-launch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  margin-bottom: 12px;
}

.field-home-launch-row .field-focus-launch { margin-bottom: 0; }

.main-alert-home-launch {
  min-width: 112px;
  border: 2px solid #fbbf24;
  border-radius: 12px;
  background: #fbbf24;
  color: #111827;
  font-weight: 900;
}

.field-focus-launch b { font-size: 17px; }
.field-focus-launch span { font-size: 12px; font-weight: 750; }

.field-focus-screen {
  display: grid;
  gap: 16px;
  max-width: 1120px;
  margin: 0 auto;
}

.field-focus-header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px;
  border-radius: 14px;
  background: #111827;
  color: #ffffff;
}

.field-focus-header h2 { margin: 2px 0 4px; color: #ffffff; }
.field-focus-header > div:last-child { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

.main-alert-launch {
  min-height: 42px;
  padding: 9px 14px;
  border: 2px solid #fbbf24;
  border-radius: 9px;
  background: #fbbf24;
  color: #111827;
  font-weight: 900;
}

.main-alert-composer {
  position: absolute;
  z-index: 120;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  gap: 10px;
  width: min(440px, calc(100vw - 28px));
  padding: 16px;
  border: 1px solid #94a3b8;
  border-radius: 12px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 22px 52px rgba(15, 23, 42, .32);
}

.main-alert-composer[hidden] { display: none; }
.main-alert-composer > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.main-alert-composer h3 { margin: 0; }
.main-alert-composer label { display: grid; gap: 5px; color: #334155; font-size: 12px; font-weight: 850; }
.main-alert-composer input,
.main-alert-composer textarea,
.main-alert-composer select { width: 100%; padding: 10px; border: 1px solid #94a3b8; border-radius: 8px; background: #ffffff; color: #111827; }

.field-focus-alerts {
  display: grid;
  gap: 9px;
  padding: 14px;
  border: 2px solid #f59e0b;
  border-radius: 13px;
  background: #fffbeb;
}

.field-focus-alerts h3 { margin: 0; color: #92400e; }
.field-focus-alerts article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border-radius: 9px; background: #ffffff; }
.field-focus-alerts article > div { display: grid; gap: 4px; }
.field-focus-alerts article > div:last-child { display: flex; grid-auto-flow: column; gap: 6px; }
.field-focus-alerts button { min-height: 38px; padding: 8px 11px; border: 1px solid #b45309; border-radius: 7px; background: #ffffff; color: #78350f; font-weight: 850; }

.field-focus-job-list { display: grid; gap: 14px; }
.field-focus-job { overflow: hidden; border: 2px solid #cbd5e1; border-radius: 15px; background: #ffffff; box-shadow: 0 8px 22px rgba(15, 23, 42, .1); }
.field-focus-job.field-priority-job { border-color: var(--brand-primary, #b91c1c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-primary, #b91c1c) 18%, transparent); }
.field-focus-priority { display: block; padding: 7px 14px; background: var(--brand-primary, #b91c1c); color: #ffffff; font-size: 12px; font-weight: 900; }
.field-focus-job-main { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 18px; border: 0; background: #ffffff; color: #111827; text-align: left; }
.field-focus-job-main span { display: grid; gap: 5px; }
.field-focus-job-main b { font-size: 21px; }
.field-focus-job-main strong { font-size: 16px; color: #475569; }
.field-focus-job-main em { color: var(--brand-primary, #b91c1c); font-size: 12px; font-style: normal; font-weight: 900; }
.field-focus-contact-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 0 16px 16px; }
.field-focus-contact-row a,
.field-focus-contact-row button { display: grid; place-items: center; min-height: 46px; border: 1px solid var(--brand-primary, #b91c1c); border-radius: 9px; background: #ffffff; color: var(--brand-primary, #b91c1c); font-weight: 900; text-decoration: none; }
.field-focus-contact-row button:disabled { border-color: #cbd5e1; color: #94a3b8; }
.field-focus-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 16px; border-top: 1px solid #e2e8f0; background: #f8fafc; }
.field-focus-details > div { display: grid; gap: 3px; padding: 10px; border-radius: 8px; background: #ffffff; }
.field-focus-details span { color: #64748b; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.field-focus-details .primary-button { grid-column: 1 / -1; }

@media (max-width: 720px) {
  .missing-scope-form, .missing-scope-list article { grid-template-columns: minmax(0, 1fr); }
  .field-home-launch-row { grid-template-columns: 1fr; }
  .main-alert-home-launch { min-height: 48px; }
  .field-focus-header { align-items: stretch; flex-direction: column; }
  .field-focus-header > div:last-child { justify-content: stretch; }
  .field-focus-header > div:last-child > button { flex: 1 1 auto; }
  .main-alert-composer { left: 0; right: auto; }
  .field-focus-alerts article { align-items: stretch; flex-direction: column; }
  .field-focus-contact-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .field-focus-details { grid-template-columns: 1fr; }
  .field-focus-details .primary-button { grid-column: 1; }
}

/* v151 field mode keeps the normal program shell and only swaps home content. */
.sidebar-field-controls {
  position: relative;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #454d58;
  border-radius: 4px;
  background: #20262d;
}

.sidebar-company-name {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.sidebar-company-name span {
  color: #8f99a5;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.sidebar-company-name b {
  overflow: hidden;
  color: #f8fafc;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-mode-checkbox {
  display: flex !important;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 7px 8px;
  border: 1px solid #59626e;
  border-radius: 4px;
  background: #303741;
  color: #ffffff !important;
  cursor: pointer;
}

.field-mode-checkbox input {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  margin: 0;
  accent-color: var(--brand-primary, #b91c1c);
}

.field-mode-checkbox > span {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.field-mode-checkbox b { font-size: 11px; }
.field-mode-checkbox small { color: #aeb6c0; font-size: 9px; }

.sidebar-field-controls .main-alert-launch {
  width: 100%;
  min-height: 34px;
  padding: 7px 9px;
  border-width: 1px;
  border-radius: 4px;
  font-size: 11px;
}

.sidebar-field-controls .main-alert-composer {
  position: fixed;
  top: auto;
  right: auto;
  bottom: 18px;
  left: 250px;
}

.company-alert-bar {
  position: sticky;
  top: 0;
  z-index: 45;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 18px 0;
  padding: 13px 15px;
  border: 2px solid #a16207;
  border-left: 8px solid #854d0e;
  border-radius: 7px;
  background: #facc15;
  color: #1c1917;
  box-shadow: 0 8px 24px rgba(113, 63, 18, .28);
}

.company-alert-bar::before {
  content: "!";
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border: 2px solid currentColor;
  border-radius: 50%;
  font-size: 18px;
  font-weight: 950;
  line-height: 1;
}

.company-alert-message {
  display: grid;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
}

.company-alert-message b { font-size: 15px; }
.company-alert-message span { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.company-alert-message small { font-size: 10px; font-weight: 850; }
.company-alert-count { flex: 0 0 auto; font-size: 11px; }
.company-alert-actions { display: flex; flex: 0 0 auto; gap: 6px; }
.company-alert-actions button {
  min-height: 32px;
  padding: 6px 9px;
  border: 1px solid #713f12;
  border-radius: 5px;
  background: #ffffff;
  color: #422006;
  font-size: 10px;
  font-weight: 900;
}

/* A yellow alert would disappear into BuildNerve's yellow brand surfaces. */
html[data-brand-profile="buildnerve"] .company-alert-bar {
  border-color: #7f1d1d !important;
  border-left-color: #450a0a !important;
  background: #dc2626 !important;
  color: #ffffff !important;
  box-shadow: 0 8px 26px rgba(127, 29, 29, .38) !important;
}

html[data-brand-profile="buildnerve"] .company-alert-actions button {
  border-color: #ffffff !important;
  background: #ffffff !important;
  color: #991b1b !important;
}

.field-mode-title {
  margin-bottom: 0;
  padding: 4px 2px 0;
}

@media (max-width: 1079px) {
  .sidebar-field-controls { display: none; }
}

@media (max-width: 720px) {
  .company-alert-bar {
    align-items: stretch;
    flex-direction: column;
    margin: 7px 8px 0;
  }
  .company-alert-message span { white-space: normal; }
  .company-alert-actions button { flex: 1 1 auto; }
}

/* v129 final app-only precedence: the app home owns the full viewport. */
.app-shell.app-mode {
  width: 100% !important;
  max-width: none !important;
  max-height: 100svh !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.app-shell.app-mode .mobile-app-header,
.app-shell.app-mode .topbar,
.app-shell.app-mode .app-global-action-bar,
.app-shell.app-mode .app-content {
  width: 100% !important;
  max-width: none !important;
  grid-column: 1 !important;
}

.app-shell.app-mode .mobile-app-header,
.app-shell.app-mode .topbar { grid-row: 1 !important; }
.app-shell.app-mode .app-global-action-bar { grid-row: 2 !important; }
.app-shell.app-mode .app-workflow-rail { display: none !important; }

.app-shell.app-mode:not(.mobile-inner-page) .app-content {
  grid-row: 3 !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
}

.app-shell.app-mode:not(.mobile-inner-page) .mobile-command-hub {
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 8px !important;
  overflow: hidden !important;
}

.app-shell.app-mode .app-unified-module-grid {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(42px, 1fr) !important;
  gap: 6px !important;
  border: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row,
.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row:last-child {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 6px 8px !important;
  border: 1px solid #cfd5dc !important;
  border-left: 3px solid var(--brand-primary, #a50f17) !important;
  border-radius: 5px !important;
  overflow: hidden !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-order,
.app-shell.app-mode .app-unified-module-grid .mobile-module-copy small,
.app-shell.app-mode .app-unified-module-grid .mobile-module-open {
  display: none !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-icon {
  width: 30px !important;
  height: 30px !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-copy b {
  display: -webkit-box !important;
  min-width: 0 !important;
  overflow: hidden !important;
  font-size: clamp(10px, 3.3vw, 13px) !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 620px) {
  .app-shell.app-mode .app-unified-module-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* v136 customizable app home: Menu selects and remembers role-authorized live panels. */
.app-shell.app-mode .pm-home-dashboard {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  overflow: hidden !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid {
  flex: 0 0 auto !important;
  height: auto !important;
  max-height: none !important;
  grid-auto-rows: 52px !important;
  overflow: visible !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-card.selected {
  border-color: var(--brand-primary, #a50f17) !important;
  background: #fff2f2 !important;
  box-shadow: inset 0 0 0 1px var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-card.first-selected {
  border-left: 4px solid var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .pm-menu-help {
  flex: 0 0 auto;
  padding: 5px 7px;
  border-left: 3px solid var(--brand-primary, #a50f17);
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 6%, #ffffff);
  color: #475467;
  font-size: 10px;
  line-height: 1.35;
}

.app-shell.app-mode .pm-home-panel-heading {
  flex: 0 0 auto;
  padding: 2px 3px;
  color: #596473;
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.app-shell.app-mode .pm-home-panel-heading b {
  color: #111827;
}

.app-shell.app-mode .pm-home-panel-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.app-shell.app-mode .pm-home-panel-content > .screen {
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0 0 8px;
}

.app-shell.app-mode .pm-home-selected-sections {
  display: grid;
  align-content: start;
  gap: 10px;
  padding-bottom: 10px;
}

.app-shell.app-mode .pm-home-selected-section {
  min-width: 0;
  overflow: visible;
  border: 1px solid #d2d8df;
  border-radius: 7px;
  background: #fff;
}

.app-shell.app-mode .pm-home-selected-header {
  position: sticky;
  top: 0;
  z-index: 6;
  padding: 8px 10px;
  border-bottom: 1px solid #d2d8df;
  border-left: 4px solid var(--brand-primary, #a50f17);
  border-radius: 6px 6px 0 0;
  background: #f9f6f1;
  color: #141922;
  font-size: 13px;
  letter-spacing: .03em;
}

.app-shell.app-mode .pm-home-selected-body {
  min-width: 0;
  padding: 7px;
}

.app-shell.app-mode .pm-home-overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  padding: 2px;
}

.app-shell.app-mode .pm-home-overview > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 7px;
  border: 1px solid #d2d8df;
  border-top: 3px solid var(--brand-primary, #a50f17);
  border-radius: 6px;
  background: #ffffff;
  text-align: center;
}

.app-shell.app-mode .pm-home-overview span {
  overflow: hidden;
  color: #667085;
  font-size: 9px;
  font-weight: 800;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.app-shell.app-mode .pm-home-overview b { font-size: 19px; }
.app-shell.app-mode .pm-home-overview .primary-button { grid-column: 1 / -1; width: 100%; }

.app-shell.app-mode .pm-home-selected-body > .screen {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.app-shell.app-mode .pm-home-selected-body > .screen > .screen-title {
  display: none !important;
}

.app-shell.app-mode .pm-active-jobs-head {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px;
  border: 1px solid #d8dde3;
  border-left: 3px solid var(--brand-primary, #a50f17);
  border-radius: 5px;
  background: #fff;
}

.app-shell.app-mode .pm-active-jobs-head div {
  display: grid;
  gap: 2px;
}

.app-shell.app-mode .pm-active-jobs-head small {
  color: #687383;
  font-size: 10px;
}

.app-shell.app-mode .pm-active-jobs-head button {
  min-height: 32px;
  padding: 5px 8px;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 4px;
  background: #fff;
  color: #8f1119;
  font-size: 10px;
  font-weight: 700;
}

.app-shell.app-mode .pm-home-active-list {
  display: grid;
  gap: 6px;
  padding-top: 6px;
}

.app-shell.app-mode .pm-home-job.current-geofence-job {
  padding: 4px;
  border: 2px solid #18864b;
  border-radius: 7px;
  background: #effcf4;
}

.app-shell.app-mode .pm-current-job-label {
  display: block;
  padding: 2px 5px 5px;
  color: #12683c;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

/* v133 phone workflow: every Next screen remains scrollable with advancement controls visible. */
.app-shell.app-mode.mobile-inner-page .app-content {
  grid-row: 3 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 8px calc(76px + env(safe-area-inset-bottom)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.app-shell.app-mode.mobile-inner-page .workspace-screen,
.app-shell.app-mode.mobile-inner-page .workspace-panel,
.app-shell.app-mode.mobile-inner-page .workflow-focus-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.app-shell.app-mode.mobile-inner-page .workflow-focus-card {
  min-height: 0 !important;
  gap: 10px !important;
  padding: 12px !important;
  overflow-wrap: anywhere;
}

.app-shell.app-mode.mobile-inner-page .workflow-wizard-progress {
  margin-bottom: 8px !important;
  padding: 9px !important;
}

.app-shell.app-mode.mobile-inner-page .workflow-wizard-actions {
  position: sticky !important;
  bottom: calc(-1px + env(safe-area-inset-bottom)) !important;
  z-index: 20 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 5px !important;
  margin-top: 8px !important;
  padding: 12px 0 8px !important;
  background: linear-gradient(to bottom, rgba(246, 243, 238, 0), #f6f3ee 24%) !important;
}

.app-shell.app-mode.mobile-inner-page .workflow-wizard-actions button {
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 6px 5px !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
  white-space: normal !important;
}

.app-shell.app-mode.mobile-inner-page .focused-task-form,
.app-shell.app-mode.mobile-inner-page .focused-task-form.two,
.app-shell.app-mode.mobile-inner-page .focused-task-form.three {
  width: 100% !important;
  max-width: 100% !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

/* v134 role-filtered appointment reminder with direct job and navigation actions. */
.app-shell.app-mode .appointment-reminder-banner {
  position: fixed;
  right: 8px;
  bottom: calc(84px + env(safe-area-inset-bottom));
  left: 8px;
  z-index: 120;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px 10px;
  width: auto;
  max-width: 520px;
  margin: 0 auto;
  padding: 10px;
  border: 2px solid var(--brand-primary, #a50f17);
  border-radius: 9px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 12px 28px rgba(46, 12, 15, .28);
  color: #151922;
}

.app-shell.app-mode .appointment-reminder-head {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #991019;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.app-shell.app-mode .appointment-reminder-head button {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid #cfd4dc;
  border-radius: 50%;
  background: #fff;
  color: #4b5563;
  font-size: 20px;
  line-height: 1;
}

.app-shell.app-mode .appointment-reminder-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.app-shell.app-mode .appointment-reminder-copy b,
.app-shell.app-mode .appointment-reminder-copy span,
.app-shell.app-mode .appointment-reminder-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell.app-mode .appointment-reminder-copy b { font-size: 14px; }
.app-shell.app-mode .appointment-reminder-copy span { color: var(--brand-primary-dark, #8d1119); font-size: 11px; font-weight: 750; }
.app-shell.app-mode .appointment-reminder-copy small { color: #647082; font-size: 10px; }

.app-shell.app-mode .appointment-reminder-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  align-self: center;
}

.app-shell.app-mode .appointment-reminder-actions button,
.app-shell.app-mode .appointment-reminder-actions a {
  min-height: 38px;
  display: grid;
  place-items: center;
  padding: 6px 9px;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 5px;
  background: var(--brand-primary, #a50f17);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
}

.app-shell.app-mode .appointment-reminder-actions a {
  background: #fff;
  color: var(--brand-primary-dark, #8d1119);
}

.app-shell.app-mode .appointment-reminder-actions button:disabled {
  border-color: #c7ccd3;
  background: #eef0f3;
  color: #737b86;
}

@media (max-width: 430px) {
  .app-shell.app-mode .appointment-reminder-banner {
    grid-template-columns: minmax(0, 1fr);
  }

  .app-shell.app-mode .appointment-reminder-actions {
    grid-column: 1;
  }
}

/* v138 real interactive job street map. */
.interactive-job-map {
  position: relative;
  width: 100%;
  min-height: 480px !important;
  overflow: hidden;
  border: 1px solid #b9c0ca;
  border-radius: 12px;
  background: #e9eef3 !important;
  z-index: 1;
}

.interactive-job-map::before,
.interactive-job-map::after {
  display: none !important;
  content: none !important;
}

.interactive-job-map.leaflet-container {
  font-family: inherit;
}

.map-live-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}

.map-live-toolbar button {
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #fff;
  color: var(--brand-primary-dark, #8d1119);
  font: inherit;
  font-weight: 800;
}

.map-live-toolbar button:first-child {
  background: var(--brand-primary, #a50f17);
  color: #fff;
}

.map-live-toolbar button:disabled {
  border-color: #c7ccd3;
  background: #eef0f3;
  color: #737b86;
}

.map-live-loading,
.map-live-unavailable {
  min-height: 420px;
  display: grid;
  place-content: center;
  gap: 6px;
  padding: 24px;
  color: #4b5563;
  text-align: center;
}

.map-live-unavailable b {
  color: var(--brand-primary-dark, #8d1119);
  font-size: 18px;
}

.map-live-empty {
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid #d6dae0;
  border-radius: 8px;
  background: #fff;
  color: #647082;
  font-size: 13px;
}

.job-map-number {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 11px;
  font-weight: 900;
}

.job-map-number::before {
  display: none !important;
}

.job-map-popup {
  min-width: 210px;
  display: grid;
  gap: 4px;
}

.job-map-popup b { color: #151922; font-size: 14px; }
.job-map-popup span { color: #384152; font-size: 12px; }
.job-map-popup small { color: #647082; font-size: 11px; }

.job-map-popup > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 6px;
}

.job-map-popup button,
.job-map-popup a {
  min-height: 36px;
  display: grid;
  place-items: center;
  padding: 7px 9px;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 7px;
  background: var(--brand-primary, #a50f17);
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.job-map-popup a {
  background: #fff;
  color: var(--brand-primary-dark, #8d1119);
}

.leaflet-popup-content { margin: 12px !important; }
.leaflet-control-zoom a { color: var(--brand-primary-dark, #8d1119) !important; }

.map-coordinate-state {
  display: inline-block;
  margin-top: 5px;
  color: #647082;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.map-coordinate-state.ready { color: #18733a; }
.map-coordinate-state.missing { color: #9a5b08; }

@media (min-width: 1080px) {
  .live-map-workspace {
    grid-template-columns: minmax(520px, 3fr) minmax(340px, 2fr) !important;
  }

  .live-map-shell {
    position: sticky;
    top: 82px;
    align-self: start;
  }
}

@media (max-width: 700px) {
  .interactive-job-map {
    min-height: 52svh !important;
    border-radius: 9px;
  }

  .map-live-loading,
  .map-live-unavailable {
    min-height: 52svh;
  }

  .map-live-toolbar button {
    flex: 1 1 0;
  }
}

/* v141 multi-company brand profiles --------------------------------------- */
.brand-powered-by {
  margin: -4px 0 12px;
  color: var(--app-muted, #5f6b7a);
  font-size: 13px;
  font-weight: 650 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.company-branch-card {
  display: grid;
  gap: 14px;
  border-left: 4px solid var(--app-line, #d9d2c7) !important;
}

.company-branch-card.active {
  border-color: var(--brand-primary, #a50f17) !important;
  box-shadow: 0 0 0 2px rgba(var(--primary-rgb), .12), 0 8px 24px rgba(17, 24, 39, .08);
}

.company-branch-head {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.company-branch-head > div { min-width: 0; }
.company-branch-head h3,
.company-branch-head p { margin: 0; }

.company-branch-logo,
.company-branch-mark {
  width: 84px;
  height: 58px;
  flex: 0 0 84px;
  border: 1px solid #d7dde6;
  border-radius: 10px;
  background: #111827;
  object-fit: contain;
  padding: 7px;
}

.company-branch-mark {
  display: grid;
  place-items: center;
  background: var(--branch-color, #2457ff);
  color: #fff;
  font-size: 24px;
  font-weight: 800 !important;
}

.company-shared-data-note {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #bfd0ff;
  border-radius: 9px;
  background: #f2f6ff;
  color: #334155;
  font-size: 13px;
}

img[src*="eks-logo.png"] {
  object-fit: contain !important;
  background: #111827 !important;
  padding: 6px !important;
}

html[data-brand-profile="buildnerve"] body {
  background: linear-gradient(145deg, #f7f9ff 0%, #eef3ff 64%, #fff8db 100%) !important;
  color: #111827;
}

html[data-brand-profile="buildnerve"] .mobile-app-header,
html[data-brand-profile="buildnerve"] .topbar {
  border-bottom-color: #ffc928 !important;
  background: linear-gradient(135deg, #2457ff 0%, #173bb7 100%) !important;
  color: #fff !important;
}

html[data-brand-profile="buildnerve"] .mobile-app-brand img,
html[data-brand-profile="buildnerve"] .brand-logo,
html[data-brand-profile="buildnerve"] .desktop-utility-brand img {
  border-color: rgba(255, 201, 40, .9) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(255, 201, 40, .22) !important;
  object-fit: contain !important;
}

html[data-brand-profile="buildnerve"] .mobile-app-brand b,
html[data-brand-profile="buildnerve"] .mobile-app-brand span,
html[data-brand-profile="buildnerve"] .mobile-app-brand small,
html[data-brand-profile="buildnerve"] .topbar h1,
html[data-brand-profile="buildnerve"] .topbar p { color: #fff !important; }

html[data-brand-profile="buildnerve"] .primary-button,
html[data-brand-profile="buildnerve"] .contact-button.primary,
html[data-brand-profile="buildnerve"] .program-main-button {
  border-color: #173bb7 !important;
  background: linear-gradient(180deg, #3566ff 0%, #2457ff 100%) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(36, 87, 255, .22);
}

html[data-brand-profile="buildnerve"] .secondary-button,
html[data-brand-profile="buildnerve"] .filter-pill.active {
  border-color: #2457ff !important;
  color: #173bb7 !important;
}

html[data-brand-profile="buildnerve"] .app-global-action-bar {
  border-bottom-color: #d7e0ff !important;
  background: rgba(255, 255, 255, .97) !important;
}

html[data-brand-profile="buildnerve"] .app-dot-menu-button {
  border-color: #d29f00 !important;
  background: linear-gradient(180deg, #ffd85c 0%, #ffc928 100%) !important;
  color: #111827 !important;
}

html[data-brand-profile="buildnerve"] .app-dot-menu-mark i,
html[data-brand-profile="buildnerve"] .program-grid-mark i { background: #111827 !important; }

html[data-brand-profile="buildnerve"] .app-dot-menu-button.active,
html[data-brand-profile="buildnerve"] .desktop-program-rail button.active {
  border-color: #2457ff !important;
  background: #2457ff !important;
  color: #fff !important;
}

html[data-brand-profile="buildnerve"] .app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row,
html[data-brand-profile="buildnerve"] .mobile-module-card {
  border-left-color: #2457ff !important;
  background: #fff !important;
}

html[data-brand-profile="buildnerve"] .mobile-module-icon,
html[data-brand-profile="buildnerve"] .app-unified-module-grid .mobile-module-icon {
  border-color: #d29f00 !important;
  background: linear-gradient(145deg, #ffd85c 0%, #ffc928 100%) !important;
  color: #111827 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 4px 10px rgba(255, 201, 40, .22) !important;
}

html[data-brand-profile="buildnerve"] .gpt-float-button,
html[data-brand-profile="buildnerve"] .gpt-float-button.active,
html[data-brand-profile="buildnerve"] .gpt-float-button:hover {
  border: 3px solid #ffc928 !important;
  background: linear-gradient(145deg, #3566ff 0%, #173bb7 100%) !important;
  color: #fff !important;
  box-shadow: 0 10px 28px rgba(36, 87, 255, .34) !important;
}

html[data-brand-profile="buildnerve"] .badge:not(.green):not(.red),
html[data-brand-profile="buildnerve"] .access-pill.programming {
  border-color: #e4b313 !important;
  background: #fff3bd !important;
  color: #594000 !important;
}

html[data-brand-profile="buildnerve"] .desktop-program-rail {
  border-right-color: #d7e0ff !important;
  background: #111827 !important;
}

html[data-brand-profile="buildnerve"] .desktop-program-brand {
  border-color: #ffc928 !important;
  background: #ffc928 !important;
}

html[data-brand-profile="buildnerve"] .desktop-brand-banner {
  border-color: #d7e0ff !important;
  background: #fff !important;
}

html[data-brand-profile="buildnerve"] .desktop-brand-logo {
  width: min(360px, 48vw) !important;
  max-height: 70px !important;
  object-fit: contain !important;
}

@media (max-width: 700px) {
  .company-branch-logo,
  .company-branch-mark {
    width: 72px;
    height: 52px;
    flex-basis: 72px;
  }

  .mobile-app-brand img[src*="eks-logo.png"] {
    width: 118px !important;
    max-width: 34vw !important;
    height: 50px !important;
  }
}

/* v142 BuildNerve desktop navigation: blue-only brand with neon side tabs. */
@media (min-width: 1080px) {
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button.active {
    border-left-color: #2f8cff !important;
    background: linear-gradient(90deg, rgba(47, 140, 255, .28) 0%, rgba(36, 87, 255, .10) 58%, rgba(36, 87, 255, 0) 100%) !important;
    color: #ffffff !important;
    box-shadow: inset 3px 0 13px rgba(47, 140, 255, .30), 0 0 10px rgba(47, 140, 255, .10) !important;
  }

  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button:hover {
    border-left-color: #5bc0ff !important;
    background: rgba(47, 140, 255, .11) !important;
    color: #ffffff !important;
  }

  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon {
    color: #5bc0ff !important;
    filter: drop-shadow(0 0 5px rgba(47, 140, 255, .95)) drop-shadow(0 0 11px rgba(36, 87, 255, .62)) !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button.active::before {
    background: #2f8cff !important;
    box-shadow: 0 0 8px rgba(47, 140, 255, 1), 0 0 18px rgba(47, 140, 255, .68) !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button.active {
    background: linear-gradient(90deg, rgba(47, 140, 255, .28), #171d2a 76%) !important;
    color: #5bc0ff !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button:hover,
  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button:focus-visible {
    background: rgba(47, 140, 255, .13) !important;
    color: #8bd7ff !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button.active svg {
    filter: drop-shadow(0 0 6px rgba(47, 140, 255, .95)) !important;
  }

  html[data-brand-profile="buildnerve"] .program-grid-mark i {
    border-color: #5bc0ff !important;
    background: #5bc0ff !important;
    box-shadow: 0 0 7px rgba(47, 140, 255, .92) !important;
  }

  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-new-sale,
  html[data-brand-profile="buildnerve"] .programming-switch-button {
    border-color: #173bb7 !important;
    background: linear-gradient(180deg, #3566ff 0%, #2457ff 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(47, 140, 255, .28) !important;
  }
}

/* v143 final BuildNerve sidebar glow reset. Legacy red filters cannot pass. */
@media (min-width: 1080px) {
  html[data-brand-profile="buildnerve"] .desktop-program-rail button,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button,
  html[data-brand-profile="buildnerve"] .desktop-program-rail button svg,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs .nav-icon {
    text-shadow: none !important;
    filter: none !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button.active,
  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button:hover,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button.active,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button:hover {
    border-color: #35a7ff !important;
    box-shadow: inset 3px 0 14px rgba(53, 167, 255, .42), 0 0 12px rgba(36, 87, 255, .24) !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button.active::before,
  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button:hover::before {
    background: #35a7ff !important;
    box-shadow: 0 0 8px rgba(53, 167, 255, 1), 0 0 18px rgba(36, 87, 255, .82) !important;
  }

  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button.active svg,
  html[data-brand-profile="buildnerve"] .desktop-program-rail nav button:hover svg,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button.active .nav-icon,
  html[data-brand-profile="buildnerve"] .app-shell:not(.app-mode) .desktop-module-tabs button:hover .nav-icon {
    color: #68c7ff !important;
    filter: drop-shadow(0 0 5px rgba(53, 167, 255, 1)) drop-shadow(0 0 12px rgba(36, 87, 255, .78)) !important;
  }
}

@media (max-width: 1100px) {
  .smart-company-form-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
  .smart-company-form-copy,
  .smart-company-form-actions,
  .smart-form-empty { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
  .smart-company-form-card { grid-template-columns: minmax(0, 1fr); }
  .smart-company-form-actions { grid-template-columns: minmax(0, 1fr); }
  .damage-assessment-grid { grid-template-columns: minmax(0, 1fr); }
  .permit-subcontractor-license-card { grid-template-columns: minmax(0, 1fr); }
  .damage-recommendations-panel { grid-template-columns: minmax(0, 1fr); }
  .compliance-jurisdiction-note { align-items: flex-start; flex-direction: column; }
  .compliance-checklist-item { grid-template-columns: 40px minmax(0, 1fr); }
  .compliance-checklist-item > :not(.compliance-order):not(.compliance-item-copy) { grid-column: 1 / -1; }
  .construction-checklist-job-select { grid-template-columns: minmax(0, 1fr); width: 100%; }
  .construction-inspection-add { grid-template-columns: minmax(0, 1fr); }
  .construction-inspection-selected article { grid-template-columns: 32px minmax(0, 1fr); }
  .construction-inspection-selected article > div { grid-column: 1 / -1; }
  .construction-inspection-save { justify-self: stretch; }
  .compliance-inspection-sequence article { grid-template-columns: 32px minmax(0, 1fr); }
  .compliance-inspection-sequence article > input,
  .compliance-inspection-sequence article > button { grid-column: 1 / -1; }
  .permit-inspection-actions { align-items: stretch; flex-direction: column; }
  .subcontractor-directory-form { grid-template-columns: minmax(0, 1fr); }
  .signature-security-note { grid-template-columns: minmax(0, 1fr); }
  .signature-enrollment-form { grid-template-columns: minmax(0, 1fr); }
}

/* Final v160 enforcement must remain last so older screen rules cannot reintroduce overflow. */
#app,
.app-shell,
.app-content,
.screen,
.screen > *,
.panel,
.workspace-card,
.streamlit-desktop-home,
.streamlit-page-heading,
.streamlit-metric-grid,
.streamlit-detail-panel,
.streamlit-job-board,
.streamlit-job-row,
.streamlit-job-main,
.streamlit-status-box,
.streamlit-next-box,
.streamlit-row-actions,
.toolbar,
.form-grid {
  min-width: 0 !important;
  max-width: 100% !important;
}

.app-content,
.screen {
  overflow-x: clip !important;
}

.app-content img,
.app-content svg,
.app-content canvas,
.app-content video,
.app-content iframe,
.app-content input,
.app-content select,
.app-content textarea {
  max-width: 100% !important;
}

.customer-table-scroll,
.table-scroll,
.document-table-scroll,
.communication-table-scroll,
.forms-inventory-table,
.process-builder-grid {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

.streamlit-job-main h4,
.streamlit-job-main p,
.streamlit-status-box,
.streamlit-next-box,
.streamlit-next-box b,
.streamlit-row-actions button {
  overflow-wrap: anywhere;
}

@media (min-width: 1080px) {
  .app-shell:not(.app-mode) .streamlit-job-row {
    grid-template-columns: minmax(0, 2.1fr) minmax(0, .82fr) minmax(0, 1.28fr) minmax(140px, .78fr) !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  .app-shell:not(.app-mode) .streamlit-row-actions {
    width: 100% !important;
    min-width: 0 !important;
  }

  .app-shell:not(.app-mode) .streamlit-row-actions button {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 36px !important;
    padding: 7px 9px !important;
    overflow-wrap: anywhere !important;
    line-height: 1.2 !important;
    white-space: normal !important;
  }
}

@media (min-width: 760px) and (max-width: 1279px) {
  .app-shell:not(.app-mode) .streamlit-job-row {
    grid-template-columns: minmax(0, 1.65fr) minmax(118px, .65fr) !important;
  }

  .app-shell:not(.app-mode) .streamlit-next-box { grid-column: 1 !important; }
  .app-shell:not(.app-mode) .streamlit-row-actions { grid-column: 2 !important; }
}

@media (max-width: 759px) {
  .app-shell.app-mode article,
  .app-shell.app-mode .streamlit-row-actions button,
  .app-shell.app-mode .primary-button,
  .app-shell.app-mode .secondary-button {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
}

.referral-company-editor {
  grid-column: 1 / -1;
  padding: 14px;
  border: 1px solid var(--line, #d7d7d7);
  border-left: 3px solid var(--company-primary, #8b1e2d);
  background: #fff;
}

.referral-company-editor .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.secure-setting-list {
  display: block;
  margin-top: 6px;
  line-height: 1.55;
}

.secure-setting-list code {
  color: inherit;
  font-weight: 700;
}

@media (max-width: 759px) {
  .referral-company-editor .form-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* v170 approved queue design system: one flat enterprise language on desktop and app. */
.app-shell .screen-title,
.app-shell .streamlit-page-heading {
  min-height: 0 !important;
  padding: 16px !important;
  border: 1px solid #cfd5dc !important;
  border-radius: 2px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell .screen-title h2,
.app-shell .streamlit-page-heading h2 {
  margin: 0 !important;
  color: #101820 !important;
  font-size: clamp(23px, 2.2vw, 31px) !important;
  font-weight: 700 !important;
}

.app-shell .screen-title p,
.app-shell .streamlit-page-heading p {
  margin: 4px 0 0 !important;
  color: #667085 !important;
}

.app-shell .toolbar,
.app-shell .panel,
.app-shell .streamlit-detail-panel,
.app-shell .command-metrics-section,
.app-shell .command-operations-section,
.app-shell .workspace-card,
.app-shell .lead-intake-panel,
.app-shell .lead-intake-card,
.app-shell .dashboard-panel,
.app-shell .mobile-command-card {
  border: 1px solid #cfd5dc !important;
  border-radius: 2px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell input,
.app-shell select,
.app-shell textarea {
  border-color: #cfd5dc !important;
  border-radius: 2px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell .primary-button,
.app-shell .secondary-button,
.app-shell .danger-button,
.app-shell .mini-button,
.app-shell .contact-button,
.app-shell .next-job-button,
.app-shell .filter-pill,
.app-shell .job-summary-next,
.app-shell .job-summary-delete,
.app-shell .job-summary-toggle {
  border-radius: 2px !important;
  box-shadow: none !important;
}

.streamlit-next-box > b::before {
  content: "\2192" !important;
}

.app-shell:not(.app-mode) .streamlit-desktop-home {
  gap: 12px !important;
}

.app-shell:not(.app-mode) .streamlit-metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.app-shell:not(.app-mode) .streamlit-metric-card {
  min-height: 62px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 13px !important;
  border: 1px solid #cfd5dc !important;
  border-top-width: 1px !important;
  border-radius: 2px !important;
  background: #ffffff !important;
}

.app-shell:not(.app-mode) .streamlit-metric-card.active {
  border-color: var(--brand-primary, #a50f17) !important;
  background: #fffafa !important;
  box-shadow: inset 3px 0 0 var(--brand-primary, #a50f17) !important;
}

.app-shell:not(.app-mode) .streamlit-metric-card b {
  align-self: center !important;
  font-size: 10px !important;
}

.app-shell:not(.app-mode) .streamlit-metric-card h3 {
  margin: 0 !important;
  font-size: 23px !important;
  text-align: right !important;
}

.app-shell:not(.app-mode) .streamlit-detail-panel {
  min-height: 0 !important;
  overflow: hidden !important;
}

.app-shell:not(.app-mode) .streamlit-detail-head {
  min-height: 52px !important;
  padding: 11px 14px !important;
  border-bottom: 1px solid #dce1e7 !important;
  background: #f8f9fb !important;
}

.app-shell:not(.app-mode) .approved-queue-list {
  display: grid !important;
  gap: 8px !important;
  padding: 10px !important;
  background: #f4f6f8 !important;
}

.app-shell:not(.app-mode) .approved-queue-list .collapsible-job-row {
  margin: 0 !important;
  border: 1px solid #cfd5dc !important;
  border-left-width: 1px !important;
  border-radius: 2px !important;
}

.app-shell:not(.app-mode) .job-compact-summary {
  min-height: 60px !important;
  border-radius: 0 !important;
}

.app-shell:not(.app-mode) .job-row-controls {
  border-radius: 0 !important;
}

.app-shell.app-mode .app-content,
.app-shell.app-mode .screen {
  background: #f4f6f8 !important;
}

.app-shell.app-mode .screen {
  padding: 10px !important;
}

.app-shell.app-mode .app-unified-module-grid {
  height: auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: minmax(58px, auto) !important;
  gap: 7px !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row,
.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row:last-child {
  min-height: 58px !important;
  height: auto !important;
  grid-template-columns: 36px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  padding: 9px 11px !important;
  border: 1px solid #cfd5dc !important;
  border-left-width: 1px !important;
  border-radius: 2px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row:hover,
.app-shell.app-mode .app-unified-module-grid .mobile-module-card.mobile-module-row:focus-visible {
  border-color: var(--brand-primary, #a50f17) !important;
  background: #fffafa !important;
  box-shadow: inset 3px 0 0 var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-icon {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid #dce1e7 !important;
  border-radius: 2px !important;
  background: #f8f9fb !important;
  color: var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-copy b {
  display: block !important;
  overflow: hidden !important;
  color: #101820 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-copy small {
  display: block !important;
  margin-top: 3px !important;
  overflow: hidden !important;
  color: #667085 !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-order {
  display: none !important;
}

.app-shell.app-mode .app-unified-module-grid .mobile-module-open {
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 9px !important;
  border: 1px solid var(--brand-primary, #a50f17) !important;
  border-radius: 2px !important;
  color: var(--brand-primary, #a50f17) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
}

.app-shell.app-mode .collapsible-job-row,
.app-shell.app-mode .mobile-command-card,
.app-shell.app-mode .command-metric-card,
.app-shell.app-mode .command-operation-row,
.app-shell.app-mode .pm-home-selected-section,
.app-shell.app-mode .mobile-page-strip {
  border-radius: 2px !important;
  box-shadow: none !important;
}

@media (max-width: 520px) {
  .app-shell.app-mode .app-unified-module-grid .mobile-module-copy small {
    white-space: normal !important;
  }
}

/* Final interaction state intentionally sits after every desktop and app
   theme so a confirmed click is always visible in the same green. */
html body button.button-click-confirmed.button-click-confirmed,
html body button.button-click-confirmed.button-click-confirmed:hover,
html body button.button-click-confirmed.button-click-confirmed:focus-visible {
  background: #15803d !important;
  border-color: #166534 !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.28) !important;
  filter: none !important;
}

/* v196 app-only smartphone launcher. Desktop navigation remains unchanged. */
.app-shell.app-mode .pm-home-dashboard {
  background:
    radial-gradient(circle at 12% 8%, rgba(255, 255, 255, .95), transparent 30%),
    linear-gradient(155deg, #eef3f9 0%, #f8fafc 52%, #e8edf4 100%) !important;
}

.app-shell.app-mode .pm-menu-help {
  display: grid !important;
  gap: 2px !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .82) !important;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .08) !important;
  backdrop-filter: blur(12px);
}

.app-shell.app-mode .pm-menu-help b {
  color: #111827;
  font-size: 12px;
}

.app-shell.app-mode .pm-menu-help span {
  color: #64748b;
  font-size: 9px;
}

.app-shell.app-mode .pm-home-dashboard .smartphone-app-grid.pm-options-grid {
  width: 100% !important;
  max-height: 46svh !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(78px, auto) !important;
  gap: 10px 6px !important;
  padding: 10px 6px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .7) !important;
  box-shadow: 0 8px 26px rgba(15, 23, 42, .1) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.app-shell.app-mode .smartphone-app-tile {
  position: relative;
  min-width: 0;
  min-height: 78px;
  display: grid;
  grid-template-rows: 54px auto;
  justify-items: center;
  align-content: start;
  gap: 5px;
  padding: 0 2px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
  color: #111827;
}

.app-shell.app-mode .smartphone-app-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .22), transparent 44%),
    var(--smartphone-app-color, #2563eb);
  color: #fff;
  box-shadow: 0 6px 13px color-mix(in srgb, var(--smartphone-app-color, #2563eb) 32%, transparent);
}

.app-shell.app-mode .smartphone-app-icon svg {
  width: 29px;
  height: 29px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-shell.app-mode .smartphone-app-label {
  max-width: 100%;
  display: -webkit-box;
  overflow: hidden;
  color: #172033;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.08;
  text-align: center;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.app-shell.app-mode .smartphone-app-order,
.app-shell.app-mode .smartphone-app-add {
  position: absolute;
  top: -5px;
  right: 4px;
  z-index: 2;
  width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #111827;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  box-shadow: 0 2px 7px rgba(15, 23, 42, .24);
}

.app-shell.app-mode .smartphone-app-add {
  background: #64748b;
}

.app-shell.app-mode .smartphone-app-tile.selected .smartphone-app-icon {
  outline: 3px solid color-mix(in srgb, var(--smartphone-app-color, #2563eb) 34%, #fff);
  outline-offset: 2px;
}

.app-shell.app-mode .smartphone-app-tile:active .smartphone-app-icon {
  transform: scale(.92);
}

.app-shell.app-mode .smartphone-screen-settings {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  align-self: center;
  gap: 7px;
  padding: 6px 12px;
  border: 1px solid rgba(100, 116, 139, .3);
  border-radius: 999px;
  background: rgba(255, 255, 255, .86);
  color: #334155;
  box-shadow: 0 3px 10px rgba(15, 23, 42, .07);
}

.app-shell.app-mode .smartphone-screen-settings span,
.app-shell.app-mode .smartphone-screen-settings svg {
  width: 19px;
  height: 19px;
}

.app-shell.app-mode .smartphone-screen-settings svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

.app-shell.app-mode .smartphone-screen-settings b {
  font-size: 10px;
}

.app-shell.app-mode .pm-home-panel-heading {
  display: flex;
  justify-content: space-between;
  padding: 4px 5px !important;
}

.app-shell.app-mode .pm-home-selected-section.smartphone-widget {
  border: 0 !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 7px 22px rgba(15, 23, 42, .1) !important;
  overflow: hidden !important;
}

.app-shell.app-mode .smartphone-widget-header {
  position: static !important;
  min-height: 54px;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  background: color-mix(in srgb, var(--smartphone-app-color, #2563eb) 9%, #fff) !important;
}

.app-shell.app-mode .smartphone-widget-toggle {
  min-width: 0;
  min-height: 40px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 20px;
  gap: 8px;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: #111827;
  text-align: left;
}

.app-shell.app-mode .smartphone-widget-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--smartphone-app-color, #2563eb);
  color: #fff;
}

.app-shell.app-mode .smartphone-widget-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

.app-shell.app-mode .smartphone-widget-toggle > span:nth-child(2) {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.app-shell.app-mode .smartphone-widget-toggle b {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell.app-mode .smartphone-widget-toggle small {
  color: #64748b;
  font-size: 9px;
}

.app-shell.app-mode .smartphone-widget-toggle i {
  color: var(--smartphone-app-color, #2563eb);
  font-size: 20px;
  font-style: normal;
  font-weight: 900;
  text-align: center;
}

.app-shell.app-mode .smartphone-widget-open {
  min-height: 32px;
  padding: 0 10px;
  border: 0;
  border-radius: 9px;
  background: var(--smartphone-app-color, #2563eb);
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.app-shell.app-mode .smartphone-widget.collapsed .smartphone-widget-header {
  background: #fff !important;
}

.app-shell.app-mode .smartphone-widget.collapsed .pm-home-selected-body {
  display: none !important;
}

.app-shell.app-mode .smartphone-empty-home {
  min-height: 180px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 28px 20px;
  border: 1px dashed rgba(100, 116, 139, .45);
  border-radius: 16px;
  background: rgba(255, 255, 255, .74);
  color: #334155;
  text-align: center;
}

.app-shell.app-mode .smartphone-empty-home .app-dot-menu-mark {
  width: 34px;
  height: 34px;
}

.app-shell.app-mode .smartphone-empty-home b {
  font-size: 13px;
}

.app-shell.app-mode .smartphone-empty-home small {
  max-width: 250px;
  color: #64748b;
  font-size: 10px;
  line-height: 1.35;
}

@media (max-width: 360px) {
  .app-shell.app-mode .pm-home-dashboard .smartphone-app-grid.pm-options-grid {
    gap: 8px 3px !important;
    padding-inline: 3px !important;
  }

  .app-shell.app-mode .smartphone-app-icon {
    width: 49px;
    height: 49px;
    border-radius: 13px;
  }

  .app-shell.app-mode .smartphone-app-tile {
    grid-template-rows: 49px auto;
  }
}

/* v183: the phone's customizable Menu keeps the compact approved layout.
   Desktop queue styling above must not turn these back into large legacy keys. */
.app-shell.app-mode .pm-home-dashboard .pm-options-grid {
  height: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: 44px !important;
  gap: 6px !important;
  overflow: visible !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-card.mobile-module-row,
.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-card.mobile-module-row:last-child {
  min-width: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  grid-template-columns: 27px minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 5px 7px !important;
  border: 1px solid #cfd5dc !important;
  border-left: 3px solid var(--brand-primary, #a50f17) !important;
  border-radius: 3px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-card.selected {
  border-color: var(--brand-primary, #a50f17) !important;
  border-left-width: 4px !important;
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 7%, #ffffff) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand-primary, #a50f17) 35%, transparent) !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-icon {
  width: 25px !important;
  height: 25px !important;
  border: 1px solid #d4d9df !important;
  border-radius: 2px !important;
  background: #f7f8fa !important;
  color: var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-icon svg {
  width: 14px !important;
  height: 14px !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-copy b {
  display: block !important;
  overflow: hidden !important;
  color: #182230 !important;
  font-size: 10.5px !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
}

.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-copy small,
.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-open,
.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-order {
  display: none !important;
}

/* v186: quick customer lead link, estimator availability, and public intake. */
.quick-lead-link-panel {
  display: grid;
  gap: 14px;
  min-width: 0;
}

/* Focused permit handoff gates shared by desktop and app. */
.new-sale-agency-lookup,
.workflow-required-attachments,
.permit-custom-inspection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 14px;
  border: 1px solid var(--line, #d8dde5);
  background: #fff;
}

.new-sale-agency-lookup > div,
.workflow-required-attachments {
  display: grid;
  gap: 3px;
}

.new-sale-agency-lookup span,
.workflow-required-attachments > b {
  color: #586270;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.new-sale-agency-lookup small,
.workflow-required-attachments small,
.permit-custom-inspection small { color: var(--muted, #667085); }

.focused-action-required {
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid #e7be3f;
  border-left: 5px solid var(--brand, #b5121b);
  background: #fff4bf;
}

.focused-action-required b { display: block; color: #74151b; font-size: 1rem; }
.focused-action-required p { margin: 5px 0 0; color: #343a43; line-height: 1.45; }

.permit-jurisdiction-actions { display: flex; justify-content: flex-end; gap: 10px; }
.workflow-required-attachments { align-items: stretch; margin-top: 12px; }
.workflow-required-attachments span { font-weight: 700; overflow-wrap: anywhere; }

.subcontractor-packet-selector { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, .55fr); gap: 16px; align-items: end; padding: 14px; border: 1px solid #d8b5b7; border-radius: 12px; background: #fff8f7; }
.subcontractor-packet-selector b { display: block; color: #7f1d24; font-size: .96rem; }
.subcontractor-packet-selector p { margin: 5px 0 0; color: #4b5563; font-size: .82rem; }
.subcontractor-packet-selector label { margin: 0; }
@media (max-width: 760px) { .subcontractor-packet-selector { grid-template-columns: 1fr; } }
.workflow-attachment-picker { display: grid; gap: 8px; }
.workflow-attachment-picker legend { padding: 0 6px; color: #586270; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.workflow-attachment-choice { display: flex; align-items: center; gap: 10px; }
.workflow-attachment-picker label { display: flex; align-items: center; gap: 10px; flex: 1 1 auto; padding: 9px 10px; border: 1px solid #d9dee5; background: #f8fafc; cursor: pointer; }
.workflow-attachment-picker label:has(input:checked) { border-color: #6ba77d; background: #edf8f1; }
.workflow-attachment-picker input { width: 18px; height: 18px; accent-color: #16834a; }
.workflow-attachment-picker label span { display: grid; gap: 2px; }
.workflow-attachment-picker label b { color: #1f2933; font-size: .82rem; }
.workflow-attachment-preview { flex: 0 0 auto; white-space: nowrap; }
.workflow-attachment-picker p { margin: 2px 0 0; color: var(--muted, #667085); font-size: .72rem; }
.contract-review-gate { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; align-items: center; margin-top: 12px; padding: 14px; border: 2px solid var(--brand, #b5121b); background: #fff8f8; }
.contract-review-gate b { display: block; color: var(--brand-dark, #71080e); font-size: .92rem; }
.contract-review-gate p { margin: 4px 0 0; color: #4b5563; font-size: .78rem; line-height: 1.4; }
.contract-review-gate p.error { color: #a50f17; font-weight: 800; }
.contract-review-confirmation { grid-column: 1 / -1; display: flex; align-items: center; gap: 9px; padding: 10px 11px; border: 1px solid #d6a6aa; background: #fff; color: #272b31; font-size: .82rem; font-weight: 800; cursor: pointer; }
.contract-review-confirmation input { flex: 0 0 auto; width: 20px; height: 20px; accent-color: var(--brand, #b5121b); }
.final-price-agreement-form .price-approval-checks { display: grid; gap: 8px; align-content: start; }
.final-price-agreement-form .price-approval-checks .toggle-line { min-height: 42px; padding: 9px 11px; border: 1px solid #d8dde5; background: #fff; color: #20242a; font-weight: 800; }
.final-price-agreement-form .price-approval-checks input { width: 20px; height: 20px; accent-color: var(--brand, #b5121b); }
.contract-preparation-gate { display: grid; gap: 14px; }
.permit-custom-inspection { align-items: end; }
.permit-custom-inspection label { flex: 1 1 420px; }

@media (max-width: 700px) {
  .new-sale-agency-lookup,
  .permit-custom-inspection,
  .permit-jurisdiction-actions { align-items: stretch; flex-direction: column; }
  .workflow-attachment-choice { align-items: stretch; flex-direction: column; }
  .workflow-attachment-preview { width: 100%; }
  .contract-review-gate { grid-template-columns: 1fr; }
  .contract-review-gate .secondary-button { width: 100%; }
  .contract-review-confirmation { grid-column: 1; }
}

.global-loading-bar { position: fixed; inset: 0 0 auto; z-index: 10000; height: 5px; opacity: 0; pointer-events: none; background: rgba(17, 24, 39, .22); transition: opacity 120ms ease; }
.global-loading-bar.visible { opacity: 1; }
.global-loading-bar > span { display: block; width: var(--loading-progress, 0%); height: 100%; background: linear-gradient(90deg, var(--brand-dark, #71080e), var(--brand, #a50f17), #f23b44); box-shadow: 0 0 10px color-mix(in srgb, var(--brand, #a50f17) 75%, transparent); transition: width 220ms ease; }
.global-loading-bar.complete > span { background: #169447; box-shadow: 0 0 10px rgba(22, 148, 71, .55); }
.global-loading-bar > small { position: absolute; top: 8px; right: 12px; padding: .28rem .5rem; border: 1px solid rgba(255,255,255,.18); border-radius: 2px; background: #15191f; color: #fff; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; opacity: 0; transition: opacity 120ms ease; }
.global-loading-bar.visible > small { opacity: 1; }
.global-loading-bar.complete > small { color: #d9ffe5; }

/* v198: use one predictable page scroller on the customizable app home.
   This keeps every expanded app's final action above the fixed navigation. */
.app-shell.app-mode:not(.mobile-inner-page) .app-content {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important;
}

.app-shell.app-mode:not(.mobile-inner-page) .pm-home-dashboard {
  height: auto !important;
  min-height: 100% !important;
  overflow: visible !important;
}

.app-shell.app-mode:not(.mobile-inner-page) .pm-home-panel-content {
  flex: 0 0 auto !important;
  min-height: auto !important;
  overflow: visible !important;
  overscroll-behavior: auto !important;
}

.app-shell.app-mode:not(.mobile-inner-page) .pm-home-selected-sections {
  padding-bottom: 24px !important;
}

.app-shell.app-mode:not(.mobile-inner-page) .pm-home-selected-body,
.app-shell.app-mode:not(.mobile-inner-page) .quick-lead-link-panel {
  overflow: visible !important;
}

/* v199: keep app-menu decoration on one company color. Status and alert
   colors remain semantic and are intentionally not included here. */
.app-shell.app-mode .smartphone-app-tile,
.app-shell.app-mode .smartphone-widget {
  --smartphone-app-color: var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .smartphone-app-icon,
.app-shell.app-mode .smartphone-widget-icon,
.app-shell.app-mode .smartphone-widget-open,
.app-shell.app-mode .smartphone-app-order,
.app-shell.app-mode .smartphone-app-add,
.app-shell.app-mode .smartphone-screen-settings {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.app-shell.app-mode .smartphone-app-icon,
.app-shell.app-mode .smartphone-widget-icon {
  box-shadow: 0 6px 13px color-mix(in srgb, var(--brand-primary, #a50f17) 30%, transparent) !important;
}

.app-shell.app-mode .smartphone-app-tile.selected .smartphone-app-icon {
  outline-color: color-mix(in srgb, var(--brand-primary, #a50f17) 35%, #ffffff) !important;
}

.app-shell.app-mode .smartphone-screen-settings svg,
.app-shell.app-mode .smartphone-widget-icon svg,
.app-shell.app-mode .smartphone-app-icon svg {
  color: #ffffff !important;
  stroke: currentColor !important;
}

/* v200: the installed-app module menu uses a separate icon and pill system. */
.app-shell.app-mode .app-dot-menu-button,
.app-shell.app-mode .mobile-module-icon,
.app-shell.app-mode .mobile-module-order,
.app-shell.app-mode .mobile-module-open,
.app-shell.app-mode .command-operation-open,
.app-shell.app-mode .app-dot-menu-panel button span {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.app-shell.app-mode .app-dot-menu-button.active,
.app-shell.app-mode .app-dot-menu-button:hover,
.app-shell.app-mode .app-dot-menu-button:focus-visible {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary-dark, #7f1016) !important;
  color: #ffffff !important;
}

.app-shell.app-mode .app-dot-menu-mark i {
  background: #ffffff !important;
}

.app-shell.app-mode .mobile-module-icon svg {
  color: #ffffff !important;
  stroke: currentColor !important;
}

.app-shell.app-mode .mobile-module-order,
.app-shell.app-mode .mobile-module-open,
.app-shell.app-mode .command-operation-open,
.app-shell.app-mode .app-dot-menu-panel button span {
  border-radius: 999px !important;
  padding: 3px 7px !important;
}

/* v202: display order is neutral black; app descriptions use stronger ink. */
.app-shell.app-mode .smartphone-app-order,
.app-shell.app-mode .mobile-module-order {
  border-color: #050505 !important;
  background: #050505 !important;
  color: #ffffff !important;
}

.app-shell.app-mode .smartphone-app-label,
.app-shell.app-mode .smartphone-widget-toggle small,
.app-shell.app-mode .mobile-module-copy small,
.app-shell.app-mode .app-unified-module-grid .mobile-module-copy small,
.app-shell.app-mode .pm-home-dashboard .pm-options-grid .mobile-module-copy small {
  color: #050505 !important;
}

.quick-lead-panel-head h3,
.quick-lead-panel-head p {
  margin: 0;
}

.quick-lead-panel-head p {
  margin-top: 4px;
}

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

.quick-lead-recipient-grid label {
  display: grid;
  gap: 6px;
  min-width: 0;
  font-weight: 800;
}

.quick-lead-required-summary {
  margin: 0;
  padding: 10px 12px;
  border-left: 4px solid var(--brand-primary, #a50f17);
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 7%, #ffffff);
}

.quick-lead-ready-card {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: var(--app-card-cool, #f7f9fb);
}

.quick-lead-ready-card a {
  overflow-wrap: anywhere;
  color: var(--brand-primary, #a50f17);
  font-weight: 800;
}

.quick-lead-share-actions {
  margin: 0;
}

.quick-lead-public-panel {
  width: min(100%, 920px);
}

.quick-lead-public-panel > p:not(.eyebrow) {
  max-width: 680px;
  justify-self: center;
  text-align: center;
  color: var(--muted);
}

.required-star,
.customer-form-panel label span.required-star,
.quick-lead-time-field .required-star {
  display: inline !important;
  margin: 0 0 0 2px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #c1121f !important;
  font-size: 20px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
}

.customer-form-panel label > .customer-field-title,
.calendar-invite-public-panel label > .customer-field-title {
  display: inline !important;
  justify-self: start !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ink) !important;
  font-size: inherit !important;
  font-weight: 800 !important;
}

.quick-lead-form-intro {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: var(--app-card-cool, #f7f9fb);
}

.quick-lead-form-intro span {
  color: var(--muted);
  font-size: 13px;
  text-align: right;
}

.quick-lead-time-field {
  min-width: 0;
  margin: 0;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: #fbfcfe;
}

.quick-lead-time-field legend {
  padding: 0 5px;
  color: var(--ink);
  font-weight: 900;
}

.quick-lead-time-field > p {
  margin: 0 0 10px;
  text-align: left !important;
}

.availability-calendar {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  padding: 10px;
  border: 2px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.availability-calendar-head {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  gap: 8px;
  align-items: center;
}

.availability-calendar-head strong {
  text-align: center;
  color: var(--ink);
  font-size: 18px;
}

.availability-calendar-head button {
  min-height: 42px;
  padding: 4px;
  border: 2px solid var(--brand-primary, #a50f17);
  border-radius: 8px;
  background: #fff;
  color: var(--brand-primary, #a50f17);
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}

.availability-calendar-head button:disabled {
  border-color: #cbd5e1;
  color: #94a3b8;
  cursor: not-allowed;
}

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

.availability-calendar-weekdays span {
  padding: 3px 0;
  text-align: center;
  color: #475569;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.availability-calendar-day,
.availability-calendar-blank {
  min-width: 0;
  min-height: 58px;
}

.availability-calendar-day {
  display: grid;
  gap: 2px;
  place-content: center;
  padding: 4px 2px;
  border: 2px solid #cbd5e1;
  border-radius: 7px;
  text-align: center;
}

.availability-calendar-day b {
  font-size: 16px;
  line-height: 1;
}

.availability-calendar-day small {
  font-size: 8px;
  font-weight: 900;
  line-height: 1.05;
}

.availability-calendar-day.available {
  border-color: #15803d;
  background: #f0fdf4;
  color: #14532d;
  cursor: pointer;
}

.availability-calendar-day.available.selected {
  border-color: var(--brand-primary, #a50f17);
  background: var(--brand-primary, #a50f17);
  color: #fff;
}

.availability-calendar-day.blocked {
  border-color: #09090b;
  background: #18181b;
  color: #fff;
  opacity: 0.88;
  cursor: not-allowed;
}

.availability-calendar-day.outside {
  border-color: #cbd5e1;
  background: #e5e7eb;
  color: #64748b;
  opacity: 0.7;
}

.availability-calendar-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
}

.availability-calendar-legend span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
}

.availability-calendar-legend i {
  width: 12px;
  height: 12px;
  border-radius: 3px;
}

.availability-calendar-legend i.open {
  border: 2px solid #15803d;
  background: #f0fdf4;
}

.availability-calendar-legend i.closed {
  background: #18181b;
}

.availability-selected-day {
  margin: 0 0 8px !important;
  padding: 8px 10px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 8%, #fff);
  color: var(--ink);
}

.quick-lead-time-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  max-height: 330px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.quick-lead-time-option {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px !important;
  align-items: center;
  min-width: 0;
  padding: 10px !important;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  cursor: pointer;
}

.quick-lead-time-option:has(input:checked) {
  border-color: var(--brand-primary, #a50f17);
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 8%, #ffffff);
}

.quick-lead-time-option input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--brand-primary, #a50f17);
}

.quick-lead-time-option span {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ink) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.quick-lead-thank-you {
  display: grid;
  gap: 9px;
  padding: 22px;
  border: 3px solid #15803d;
  border-radius: 12px;
  background: #f0fdf4;
  text-align: center;
}

.quick-lead-thank-you h2,
.quick-lead-thank-you p {
  margin: 0;
}

/* v193 private travel-timing assistant and prepared customer notice. */
.travel-delay-alert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 0 0 14px;
  padding: 14px;
  border: 2px solid var(--brand-primary, #a50f17);
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 7%, #fff);
  box-shadow: 0 8px 22px rgba(31, 41, 55, .12);
}

.travel-delay-alert > div:first-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.travel-delay-alert p,
.travel-delay-alert b,
.travel-delay-alert span,
.travel-delay-alert small {
  margin: 0;
}

.travel-delay-alert span,
.travel-delay-alert small {
  color: var(--muted);
}

.travel-delay-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.travel-delay-actions a,
.travel-delay-actions button {
  min-height: 42px;
  display: grid;
  place-items: center;
  padding: 8px 12px;
  border: 1px solid var(--brand-primary, #a50f17);
  border-radius: 7px;
  background: #fff;
  color: var(--brand-primary-dark, #71080e);
  font: inherit;
  font-weight: 850;
  text-decoration: none;
}

.travel-delay-actions .preferred {
  background: var(--brand-primary, #a50f17);
  color: #fff;
}

.travel-delay-actions .dismiss {
  border-color: #cbd0d8;
  color: #596270;
}

@media (max-width: 620px) {
  .quick-lead-recipient-grid,
  .quick-lead-time-grid {
    grid-template-columns: 1fr;
  }

  .quick-lead-form-intro {
    display: grid;
  }

  .quick-lead-form-intro span {
    text-align: left;
  }

  .quick-lead-public-panel {
    padding: 14px;
  }

  .quick-lead-time-grid {
    max-height: 390px;
  }

  .travel-delay-alert {
    grid-template-columns: 1fr;
  }

  .travel-delay-actions > * {
    flex: 1 1 30%;
  }
}
/* v186 private field-time reporting is visible only in the leadership Activity view. */
.field-tracking-summary {
  margin-bottom: 18px;
}

.field-tracking-people,
.field-tracking-details > div {
  display: grid;
  gap: 8px;
}

.field-tracking-person,
.field-tracking-details > div > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
}

.field-tracking-person span,
.field-tracking-details span {
  display: grid;
  gap: 3px;
}

.field-tracking-person span:last-child,
.field-tracking-details span:last-child {
  text-align: right;
}

.field-tracking-details {
  margin-top: 12px;
}

.field-tracking-details summary {
  cursor: pointer;
  font-weight: 800;
  padding: 10px 0;
}

@media (max-width: 640px) {
  .field-tracking-person,
  .field-tracking-details > div > div {
    align-items: flex-start;
  }
}
/* v186 disclosure gate and employee vacation tracker. */
.disclosure-screen {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: max(24px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));
  background: var(--screen);
}

.disclosure-card {
  width: min(720px, 100%);
  padding: clamp(20px, 4vw, 38px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--card);
  box-shadow: 0 18px 50px rgb(15 23 42 / 14%);
}

.disclosure-heading {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 22px;
}

.disclosure-heading img {
  width: 72px;
  height: 72px;
  object-fit: contain;
}

.disclosure-heading h1,
.disclosure-heading p,
.disclosure-item p {
  margin: 0;
}

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

.disclosure-item {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface, #f7f9fb);
}

.disclosure-item > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: white;
  background: var(--primary);
  font-weight: 900;
}

.disclosure-accept {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 18px 0;
  font-weight: 800;
}

.disclosure-accept input {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.time-off-balance-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.time-off-balance-grid > div {
  display: grid;
  gap: 4px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
}

.time-off-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.time-off-form-grid .wide {
  grid-column: 1 / -1;
}

.time-off-balance-list,
.time-off-request-list {
  display: grid;
  gap: 10px;
}

.time-off-balance-list > div {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 140px auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.time-off-balance-list span {
  display: grid;
  gap: 2px;
}

.time-off-request-card {
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--primary);
  border-radius: 14px;
  background: var(--card);
}

.time-off-request-card.approved { border-left-color: #16834a; }
.time-off-request-card.denied { border-left-color: #64748b; }

/* One consistent forward control throughout the desktop workflow. Mobile
   workflow buttons remain equal-width inside their three-column action bar. */
@media (min-width: 701px) {
  .process-next-button {
    width: 120px !important;
    min-width: 120px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
  }
}

.time-off-request-head,
.time-off-decision {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.time-off-request-head > div {
  display: grid;
  gap: 3px;
}

.time-off-decision {
  margin-top: 12px;
}

.time-off-decision input {
  flex: 1 1 240px;
}

@media (max-width: 700px) {
  .disclosure-heading { align-items: flex-start; }
  .disclosure-heading img { width: 56px; height: 56px; }
  .time-off-balance-grid,
  .time-off-form-grid { grid-template-columns: 1fr; }
  .time-off-form-grid .wide { grid-column: auto; }
  .time-off-balance-list > div { grid-template-columns: 1fr; }
  .time-off-decision { align-items: stretch; flex-direction: column; }
}

/* v226 field photo platform: fast capture, visual progress, and restrained 3D camera actions. */
.field-photo-platform,
.field-photo-platform * {
  box-sizing: border-box;
}

.field-photo-platform {
  display: grid;
  gap: 14px;
  width: 100%;
  min-width: 0;
}

.photo-stage-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--brand-primary, #a50f17) 32%, #d8dee8);
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 7%, #fff);
}

.photo-stage-hero > div {
  min-width: 0;
}

.photo-stage-hero span,
.photo-section-heading span {
  display: block;
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.photo-stage-hero h3 {
  margin: 3px 0;
  color: var(--brand-primary, #a50f17);
  font-size: clamp(20px, 5vw, 27px);
  line-height: 1.05;
}

.photo-stage-hero p {
  margin: 0;
  color: #475569;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
}

.photo-stage-hero > strong {
  display: grid;
  min-width: 64px;
  min-height: 64px;
  place-content: center;
  text-align: center;
  color: #fff;
  border-radius: 50%;
  background: var(--brand-primary, #a50f17);
  font-size: 22px;
  line-height: 1;
}

.photo-stage-hero > strong small {
  margin-top: 4px;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

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

.photo-progress-step {
  display: grid;
  min-width: 0;
  gap: 2px;
  align-content: start;
  padding: 9px 7px;
  border: 1px solid #d7dde5;
  border-radius: 11px;
  color: #64748b;
  background: #fff;
}

.photo-progress-step > span {
  color: #94a3b8;
  font-size: 15px;
  line-height: 1;
}

.photo-progress-step b {
  overflow-wrap: anywhere;
  color: #334155;
  font-size: 11px;
  line-height: 1.15;
}

.photo-progress-step small {
  color: #64748b;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.2;
}

.photo-progress-step.complete {
  border-color: #86c8a5;
  background: #effbf3;
}

.photo-progress-step.complete > span {
  color: #16834b;
}

.photo-progress-step.current {
  border-color: var(--brand-primary, #a50f17);
  box-shadow: inset 0 0 0 1px var(--brand-primary, #a50f17);
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 6%, #fff);
}

.photo-progress-step.current > span,
.photo-progress-step.current b {
  color: var(--brand-primary, #a50f17);
}

.photo-room-section,
.photo-draft-panel,
.photo-gallery-section,
.photo-notes-history {
  min-width: 0;
  padding: 13px;
  border: 1px solid #d7dde5;
  border-radius: 14px;
  background: #fff;
}

.photo-section-heading {
  display: flex;
  min-width: 0;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.photo-section-heading > div {
  min-width: 0;
}

.photo-section-heading b {
  display: block;
  margin-top: 2px;
  overflow-wrap: anywhere;
  color: #172033;
  font-size: 15px;
  line-height: 1.2;
}

.photo-section-heading > small {
  flex: 0 0 auto;
  color: #64748b;
  font-size: 10px;
  font-weight: 750;
}

.photo-room-chips {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.photo-room-chip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2px 6px;
  min-width: 0;
  min-height: 50px;
  padding: 8px 9px;
  text-align: left;
  border: 1px solid #d7dde5;
  border-radius: 11px;
  color: #334155;
  background: #f8fafc;
}

.photo-room-chip > span {
  grid-row: 1 / span 2;
  align-self: center;
  color: #94a3b8;
  font-size: 16px;
}

.photo-room-chip b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.photo-room-chip small {
  color: #64748b;
  font-size: 9px;
  font-weight: 750;
}

.photo-room-chip.covered > span {
  color: #16834b;
}

.photo-room-chip.active {
  border-color: var(--brand-primary, #a50f17);
  color: var(--brand-primary, #a50f17);
  background: color-mix(in srgb, var(--brand-primary, #a50f17) 7%, #fff);
  box-shadow: inset 0 0 0 1px var(--brand-primary, #a50f17);
}

.photo-capture-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 2px 2px 8px;
}

.photo-capture-button {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 92px;
  place-content: center;
  gap: 3px;
  padding: 12px 8px;
  cursor: pointer;
  user-select: none;
  text-align: center;
  color: #172033;
  border: 1px solid #c8d0db;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 6px 0 #aeb8c5, 0 10px 18px rgb(15 23 42 / 16%);
  transform: translateY(0);
  transition: transform 100ms ease, box-shadow 100ms ease, filter 100ms ease;
  -webkit-tap-highlight-color: transparent;
}

.photo-capture-button.primary-capture {
  color: #fff;
  border-color: var(--brand-primary-dark, #71080e);
  background: var(--brand-primary, #a50f17);
  box-shadow: 0 6px 0 var(--brand-primary-dark, #71080e), 0 10px 18px color-mix(in srgb, var(--brand-primary, #a50f17) 28%, transparent);
}

.photo-capture-button:active {
  transform: translateY(5px);
  box-shadow: 0 1px 0 #aeb8c5, 0 4px 8px rgb(15 23 42 / 14%);
}

.photo-capture-button.primary-capture:active {
  box-shadow: 0 1px 0 var(--brand-primary-dark, #71080e), 0 4px 8px color-mix(in srgb, var(--brand-primary, #a50f17) 22%, transparent);
}

.photo-capture-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.photo-capture-button > span {
  font-size: 25px;
  line-height: 1;
}

.photo-capture-button b {
  font-size: 14px;
  line-height: 1.1;
}

.photo-capture-button small {
  color: inherit;
  font-size: 9px;
  font-weight: 750;
  opacity: 0.78;
}

.photo-capture-button:has(input:disabled) {
  cursor: wait;
  filter: grayscale(0.45);
  opacity: 0.65;
}

.photo-draft-strip {
  display: grid;
  grid-auto-columns: minmax(92px, 31%);
  grid-auto-flow: column;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 2px 8px;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
}

.photo-draft-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d7dde5;
  border-radius: 11px;
  background: #eef2f7;
  scroll-snap-align: start;
}

.photo-draft-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.photo-draft-card button {
  position: absolute;
  top: 5px;
  right: 5px;
  display: grid;
  width: 28px;
  height: 28px;
  place-content: center;
  padding: 0;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 50%;
  background: rgb(15 23 42 / 80%);
  font-size: 19px;
  line-height: 1;
}

.photo-draft-card small {
  display: block;
  padding: 5px 6px;
  color: #475569;
  font-size: 9px;
  font-weight: 750;
}

.photo-note-field {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 11px;
  font-weight: 850;
}

.photo-note-field textarea {
  width: 100%;
  min-width: 0;
  padding: 10px 11px;
  color: #172033;
  border: 1px solid #cbd5e1;
  border-radius: 11px;
  background: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  resize: vertical;
}

.photo-note-field textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--brand-primary, #a50f17) 28%, transparent);
  border-color: var(--brand-primary, #a50f17);
}

.photo-save-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px;
  border: 1px solid #d7dde5;
  border-radius: 13px;
  background: #f8fafc;
}

.photo-save-bar > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.photo-save-bar > div b {
  color: #172033;
  font-size: 13px;
}

.photo-save-bar > div span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #64748b;
  font-size: 9px;
  font-weight: 700;
}

.photo-save-bar .primary-button {
  min-width: 112px;
  min-height: 44px;
}

.photo-save-bar .primary-button:disabled {
  opacity: 0.45;
}

.photo-note-only-button {
  justify-self: center;
  padding: 5px 8px;
  color: var(--brand-primary, #a50f17);
  border: 0;
  background: transparent;
  font-size: 11px;
  font-weight: 850;
  text-decoration: underline;
}

.photo-gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.photo-gallery-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d7dde5;
  border-radius: 11px;
  background: #fff;
}

.photo-gallery-card > a {
  position: relative;
  display: block;
  overflow: hidden;
  background: #e8edf3;
}

.photo-gallery-card img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.photo-preview-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.photo-gallery-card.preview-unavailable img {
  visibility: hidden;
}

.photo-gallery-card > div {
  display: grid;
  min-width: 0;
  gap: 2px;
  padding: 8px;
}

.photo-gallery-card > div b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #172033;
  font-size: 12px;
}

.photo-gallery-card > div span,
.photo-gallery-card > div small {
  color: #64748b;
  font-size: 9px;
  font-weight: 700;
}

.photo-gallery-card > div p {
  margin: 3px 0;
  color: #334155;
  font-size: 10px;
  line-height: 1.25;
}

.photo-empty-gallery {
  display: grid;
  min-height: 150px;
  place-content: center;
  gap: 4px;
  text-align: center;
  color: #64748b;
  border: 1px dashed #cbd5e1;
  border-radius: 11px;
  background: #f8fafc;
}

.photo-empty-gallery > span {
  color: var(--brand-primary, #a50f17);
  font-size: 30px;
}

.photo-empty-gallery b {
  color: #334155;
  font-size: 13px;
}

.photo-empty-gallery p,
.photo-gallery-count {
  margin: 0;
  color: #64748b;
  font-size: 10px;
}

.photo-notes-history summary {
  cursor: pointer;
  color: #172033;
  font-size: 12px;
  font-weight: 850;
}

@media (min-width: 760px) {
  .photo-room-chips {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

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

  .photo-capture-actions {
    max-width: 560px;
  }
}

@media (max-width: 430px) {
  .app-shell.app-mode .workspace-panel:has(.field-photo-platform) {
    padding-inline: 9px !important;
  }

  .photo-stage-hero,
  .photo-room-section,
  .photo-draft-panel,
  .photo-gallery-section,
  .photo-notes-history {
    border-radius: 12px;
  }

  .photo-save-bar {
    grid-template-columns: 1fr;
  }

  .photo-save-bar .primary-button {
    width: 100%;
  }
}

.app-shell .gpt-float-button {
  will-change: left, top, transform;
}

.app-shell .gpt-float-button.dragging {
  z-index: 999 !important;
  cursor: grabbing;
  background: var(--brand-primary, #a50f17) !important;
  box-shadow: 0 16px 32px color-mix(in srgb, var(--brand-primary, #a50f17) 34%, transparent) !important;
  transform: scale(1.08);
}

.app-shell.app-mode .gpt-float-button.active,
.app-shell.app-mode .gpt-float-button:hover {
  background: var(--brand-primary, #a50f17);
}

/* v216 app-only flat Elite icon study: clean white canvas and solid red apps. */
.app-shell.app-mode .pm-home-dashboard,
.app-shell.app-mode .module-launcher-screen,
.app-shell.app-mode:not(.mobile-inner-page) .app-content {
  background: #ffffff !important;
}

.app-shell.app-mode .pm-menu-help,
.app-shell.app-mode .pm-home-dashboard .smartphone-app-grid.pm-options-grid {
  border: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.app-shell.app-mode .pm-menu-help {
  padding: 8px 6px !important;
}

.app-shell.app-mode .pm-home-dashboard .smartphone-app-grid.pm-options-grid {
  gap: 14px 8px !important;
  padding: 12px 5px 16px !important;
}

.app-shell.app-mode .smartphone-app-tile {
  gap: 8px !important;
  padding: 0 3px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.app-shell.app-mode .smartphone-app-icon {
  width: 56px !important;
  height: 56px !important;
  border: 0 !important;
  border-radius: 16px !important;
  outline: 0 !important;
  background: var(--brand-primary, #a50f17) !important;
  box-shadow: none !important;
  filter: none !important;
}

.app-shell.app-mode .smartphone-app-icon svg {
  width: 30px !important;
  height: 30px !important;
  color: #ffffff !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.15 !important;
}

.app-shell.app-mode .smartphone-app-label {
  margin-top: 0 !important;
  color: #2d2d2d !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

.app-shell.app-mode .smartphone-app-tile.selected .smartphone-app-icon {
  outline: 0 !important;
  box-shadow: none !important;
}

.app-shell.app-mode .smartphone-app-order,
.app-shell.app-mode .smartphone-app-add {
  top: -6px !important;
  right: 3px !important;
  border: 2px solid #ffffff !important;
  box-shadow: none !important;
}

.app-shell.app-mode .smartphone-app-add {
  background: #2d2d2d !important;
}

.app-shell.app-mode .smartphone-screen-settings {
  border: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  color: var(--brand-primary, #a50f17) !important;
  box-shadow: none !important;
}

.app-shell.app-mode .smartphone-screen-settings svg {
  color: var(--brand-primary, #a50f17) !important;
  stroke: currentColor !important;
}

.app-shell.app-mode .pm-home-selected-section.smartphone-widget {
  border: 1px solid #e5e7eb !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.app-shell.app-mode .smartphone-widget-header,
.app-shell.app-mode .smartphone-widget.collapsed .smartphone-widget-header {
  background: #ffffff !important;
}

.app-shell.app-mode .smartphone-widget-icon,
.app-shell.app-mode .smartphone-widget-open {
  border: 0 !important;
  background: var(--brand-primary, #a50f17) !important;
  box-shadow: none !important;
}

.app-shell.app-mode .smartphone-widget-icon svg {
  stroke-width: 2.1 !important;
}

@media (max-width: 360px) {
  .app-shell.app-mode .smartphone-app-icon {
    width: 51px !important;
    height: 51px !important;
    border-radius: 15px !important;
  }

  .app-shell.app-mode .smartphone-app-label {
    font-size: 10px !important;
  }
}

/* v220 structured phone job workspace. */
.app-shell.app-mode .workspace-panel {
  display: grid !important;
  gap: 14px !important;
  padding: 12px !important;
}

.app-shell.app-mode .workspace-hero {
  display: block !important;
  margin: 0 !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: #ffffff !important;
}

.app-shell.app-mode .workspace-hero > div:first-child {
  min-width: 0 !important;
}

.app-shell.app-mode .workspace-hero > div:first-child > .eyebrow {
  margin: 0 0 3px !important;
  color: #6b7280 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

.app-shell.app-mode .workspace-hero h2 {
  margin: 0 0 14px !important;
  color: #222222 !important;
  font-size: 22px !important;
  font-weight: 780 !important;
  line-height: 1.2 !important;
}

.app-shell.app-mode .workspace-status-group {
  display: none !important;
}

.app-shell.app-mode .phone-workspace-job-details {
  display: grid !important;
  gap: 7px !important;
}

.app-shell.app-mode .phone-workspace-job-details h3,
.app-shell.app-mode .workflow-wizard-progress h3,
.app-shell.app-mode .estimate-file-status h3,
.app-shell.app-mode .estimate-upload-section h3 {
  margin: 0 !important;
  color: #222222 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
}

.app-shell.app-mode .phone-workspace-job-details dl {
  display: grid !important;
  gap: 8px !important;
  margin: 0 !important;
}

.app-shell.app-mode .phone-workspace-job-details dl > div {
  display: grid !important;
  grid-template-columns: 66px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
}

.app-shell.app-mode .phone-workspace-job-details dt {
  color: #6b7280 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
}

.app-shell.app-mode .phone-workspace-job-details dd {
  margin: 0 !important;
  color: #222222 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  overflow-wrap: anywhere !important;
}

.app-shell.app-mode .workspace-utility-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

.app-shell.app-mode .workspace-switcher,
.app-shell.app-mode .workspace-utility-grid .quick-panel {
  min-width: 0 !important;
  margin: 0 !important;
  border: 1px solid #e1e5ea !important;
  border-radius: 8px !important;
  background: #ffffff !important;
}

.app-shell.app-mode .workspace-switcher {
  padding: 8px !important;
}

.app-shell.app-mode .workspace-switcher label {
  gap: 5px !important;
  color: #4b5563 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

.app-shell.app-mode .workspace-switcher select {
  min-height: 38px !important;
  padding: 6px !important;
  font-size: 16px !important;
}

.app-shell.app-mode .workspace-utility-grid .quick-panel summary {
  height: 100% !important;
  min-height: 60px !important;
  padding: 8px !important;
  justify-content: center !important;
  background: #ffffff !important;
  color: #222222 !important;
  font-size: 11px !important;
  text-align: center !important;
}

.app-shell.app-mode .workspace-utility-grid .quick-panel summary::after {
  display: none !important;
}

.app-shell.app-mode .workflow-wizard-progress {
  gap: 8px !important;
  margin: 0 !important;
  padding: 13px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
}

.app-shell.app-mode .workflow-wizard-progress > div:first-of-type {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.app-shell.app-mode .workflow-wizard-progress span {
  color: #4b5563 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.app-shell.app-mode .workflow-wizard-progress b {
  color: #222222 !important;
  font-size: 12px !important;
  font-weight: 750 !important;
}

.app-shell.app-mode .workflow-focus-card {
  min-height: 0 !important;
  gap: 18px !important;
  padding: 14px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
}

.app-shell.app-mode .workflow-focus-head {
  display: block !important;
  padding: 0 0 14px !important;
  border-bottom: 1px solid #eef0f3 !important;
}

.app-shell.app-mode .workflow-focus-head .eyebrow {
  margin: 0 0 5px !important;
  color: #6b7280 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

.app-shell.app-mode .workflow-focus-head h2 {
  margin: 0 0 7px !important;
  color: #222222 !important;
  font-size: 19px !important;
  font-weight: 780 !important;
  line-height: 1.25 !important;
}

.app-shell.app-mode .workflow-focus-card.next-step-active .workflow-focus-head h2 {
  color: #15803d !important;
}

.app-shell.app-mode .workspace-next-required {
  margin: 0 !important;
  border-radius: 9px !important;
}

.app-shell.app-mode .workflow-focus-head p:not(.eyebrow) {
  color: #4b5563 !important;
  font-size: 12px !important;
  font-weight: 450 !important;
  line-height: 1.5 !important;
}

.app-shell.app-mode .workflow-focus-head .badge {
  display: inline-flex !important;
  margin-top: 10px !important;
}

.app-shell.app-mode .estimate-file-status,
.app-shell.app-mode .estimate-upload-section {
  display: grid !important;
  gap: 10px !important;
}

.app-shell.app-mode .estimate-file-status + .estimate-upload-section {
  padding-top: 16px !important;
  border-top: 1px solid #eef0f3 !important;
}

.app-shell.app-mode .estimate-document-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  margin: 0 !important;
}

.app-shell.app-mode .estimate-document,
.app-shell.app-mode .estimate-document.loaded {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 9px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #f0f1f3 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
}

.app-shell.app-mode .estimate-document:last-child {
  border-bottom: 0 !important;
}

.app-shell.app-mode .estimate-document b {
  color: #374151 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}

.app-shell.app-mode .estimate-document span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  max-width: 130px !important;
  color: #9a6700 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.app-shell.app-mode .estimate-document.loaded span {
  color: #16713b !important;
}

.app-shell.app-mode .estimate-document span i {
  width: 18px !important;
  height: 18px !important;
  display: inline-grid !important;
  flex: 0 0 18px !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: #fff4d6 !important;
  font-style: normal !important;
}

.app-shell.app-mode .estimate-document.loaded span i {
  background: #e7f7ed !important;
}

.app-shell.app-mode .estimate-upload-section .focused-task-form {
  gap: 8px !important;
}

.app-shell.app-mode .estimate-upload-section .focused-task-form > p {
  margin: 0 !important;
  color: #6b7280 !important;
  font-size: 10px !important;
  font-weight: 450 !important;
  line-height: 1.45 !important;
}

.app-shell.app-mode .workflow-wizard-actions {
  gap: 6px !important;
  margin-top: 0 !important;
}

.app-shell.app-mode .workflow-wizard-actions button {
  min-height: 46px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
}

.app-shell.app-mode .workflow-gate-note {
  margin: -6px 0 0 !important;
  padding: 10px !important;
  border: 0 !important;
  background: transparent !important;
  color: #7a5a12 !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

/* v221 prevent iPhone login-field zoom and fit login to the device viewport. */
@media (max-width: 720px) {
  .login-screen {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    min-height: 100svh !important;
    padding: calc(14px + env(safe-area-inset-top)) 12px calc(14px + env(safe-area-inset-bottom)) !important;
    overflow-x: hidden !important;
  }

  .login-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: min(420px, calc(100vw - 24px)) !important;
    padding: 18px !important;
    box-sizing: border-box !important;
  }

  .login-card input,
  .login-card select,
  .customer-form-screen input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  .customer-form-screen select,
  .customer-form-screen textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
  }
}

@supports (height: 100dvh) {
  @media (max-width: 720px) {
    .login-screen {
      min-height: 100dvh !important;
    }
  }
}

/* v219 iPhone viewport sizing and stable form editing. */
.app-shell.app-mode,
.app-shell.app-mode *,
.app-shell.app-mode *::before,
.app-shell.app-mode *::after {
  box-sizing: border-box;
}

.app-shell.app-mode {
  min-width: 0 !important;
  min-height: 100svh !important;
  height: 100svh !important;
  max-width: 100vw !important;
}

.app-shell.app-mode .app-content,
.app-shell.app-mode .screen,
.app-shell.app-mode form,
.app-shell.app-mode fieldset,
.app-shell.app-mode label,
.app-shell.app-mode .panel,
.app-shell.app-mode .card {
  min-width: 0 !important;
  max-width: 100% !important;
}

.app-shell.app-mode input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
.app-shell.app-mode textarea,
.app-shell.app-mode select {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  font-size: 16px !important;
}

@supports (height: 100dvh) {
  .app-shell.app-mode {
    min-height: 100dvh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
  }
}

@media (max-width: 720px) {
  html,
  body,
  #app {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
}

/* v218 phone-only job detail cleanup. */
.app-shell.app-mode .job-detail-screen {
  padding-bottom: calc(110px + env(safe-area-inset-bottom)) !important;
}

.app-shell.app-mode .job-detail-screen > .job-detail-title {
  display: none !important;
}

.app-shell.app-mode .program-page-navigation {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto !important;
  gap: 6px !important;
}

.app-shell.app-mode .program-page-navigation button {
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 8px !important;
  border-radius: 8px !important;
  line-height: 1.1 !important;
}

.app-shell.app-mode .program-page-navigation > span {
  margin-left: 0 !important;
  text-align: right !important;
}

.app-shell.app-mode .job-detail-hero {
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
}

.app-shell.app-mode .job-detail-band {
  gap: 8px !important;
  padding: 13px !important;
  border-bottom: 1px solid #e5e7eb !important;
  background: #ffffff !important;
}

.app-shell.app-mode .job-detail-heading h2 {
  margin-top: 4px !important;
  color: #222222 !important;
  font-size: clamp(19px, 5.5vw, 24px) !important;
  font-weight: 780 !important;
  line-height: 1.22 !important;
  overflow-wrap: anywhere !important;
}

.app-shell.app-mode .job-detail-heading > p:not(.eyebrow) {
  margin-top: 6px !important;
  color: #5f6670 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}

.app-shell.app-mode .job-detail-body {
  gap: 10px !important;
  padding: 12px !important;
}

.app-shell.app-mode .job-detail-screen .job-contact-bar {
  width: 100% !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

.app-shell.app-mode .job-detail-screen .job-contact-bar .contact-button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 6px 3px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
}

.app-shell.app-mode .job-fact-grid {
  gap: 0 !important;
  padding: 2px 0 !important;
}

.app-shell.app-mode .job-fact-grid .kv {
  grid-template-columns: minmax(88px, .38fr) minmax(0, .62fr) !important;
  gap: 12px !important;
  padding: 10px 2px !important;
  border-bottom: 1px solid #eef0f3 !important;
}

.app-shell.app-mode .job-fact-grid .kv:last-child {
  border-bottom: 0 !important;
}

.app-shell.app-mode .job-fact-grid .kv b {
  color: #6b7280 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}

.app-shell.app-mode .job-fact-grid .kv span {
  color: #222222 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
  text-align: right !important;
}

.app-shell.app-mode .job-detail-screen .job-tools-section {
  gap: 10px !important;
  padding-top: 12px !important;
  border-top: 0 !important;
}

.app-shell.app-mode .job-detail-screen .job-tools-section > .workspace-grid {
  gap: 12px !important;
  margin-top: 4px !important;
  padding: 12px 6px !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
}

.app-shell.app-mode .job-detail-screen .job-tools-section .workspace-button,
.app-shell.app-mode .job-detail-screen .job-tools-section .workspace-button.recommended {
  min-height: 60px !important;
  padding: 8px 3px !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #222222 !important;
  box-shadow: none !important;
  text-align: center !important;
}

.app-shell.app-mode .job-detail-screen .job-tools-section .workspace-button b {
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
}

.app-shell.app-mode .job-detail-screen .job-tools-section .workspace-button span {
  color: #6b7280 !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.app-shell.app-mode .job-detail-screen .more-tools-panel {
  margin-bottom: 90px !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

.app-shell.app-mode .job-detail-screen .more-tools-panel summary {
  background: #ffffff !important;
}

.app-shell.app-mode .job-detail-screen .compact-tool-grid {
  gap: 12px !important;
  padding: 12px 6px !important;
  border-top: 1px solid #eef0f3 !important;
  background: #ffffff !important;
}

@media (max-width: 360px) {
  .app-shell.app-mode .program-page-navigation {
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto !important;
  }

  .app-shell.app-mode .program-page-navigation button {
    padding: 0 5px !important;
    font-size: 11px !important;
  }

  .app-shell.app-mode .program-page-navigation > span {
    max-width: 66px !important;
    font-size: 9px !important;
  }
}

/* v222 stronger phone Management Workspaces labels. */
.app-shell.app-mode .command-operations-section > h3 {
  color: #27313d !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.app-shell.app-mode .command-operation-copy b {
  color: #111827 !important;
  font-weight: 850 !important;
}

.app-shell.app-mode .command-operation-copy small {
  color: #374151 !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

/* v223 keep the active phone field anchored while typing. */
.app-shell.app-mode input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.app-shell.app-mode textarea {
  scroll-margin-top: 110px !important;
  scroll-margin-bottom: 150px !important;
}

/* v224 solid brand color for Job Flow contact and navigation controls. */
.app-shell.app-mode .workspace-utility-grid .quick-panel summary,
.app-shell.app-mode .workspace-utility-grid .quick-panel[open] summary,
.app-shell.app-mode .workspace-utility-grid .quick-panel .compact-contact-bar .contact-button {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary, #a50f17) !important;
  background-image: none !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.app-shell.app-mode .workspace-utility-grid .quick-panel .compact-contact-bar .contact-button:active {
  background: var(--brand-primary-dark, #7f1016) !important;
  color: #ffffff !important;
}

/* v225 phone-wide visual system and company-brand consistency audit. */
@media (max-width: 759px) {
  html,
  body,
  #app {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
  }

  .login-screen,
  .loading-screen,
  .customer-form-screen,
  .disclosure-screen {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }
}

.app-shell.app-mode {
  --mobile-ui-radius: 12px;
  --mobile-ui-radius-small: 10px;
  --mobile-ui-line: color-mix(in srgb, var(--brand-primary, #a50f17) 16%, #d8dee6);
  --mobile-ui-tint: color-mix(in srgb, var(--brand-primary, #a50f17) 7%, #ffffff);
  width: 100vw !important;
  min-width: 0 !important;
  max-width: 100vw !important;
  height: 100svh !important;
  min-height: 100svh !important;
  max-height: 100svh !important;
  background: var(--app-bg, #f4f6f8) !important;
  overflow: hidden !important;
}

@supports (width: 100dvw) {
  .app-shell.app-mode {
    width: 100dvw !important;
    max-width: 100dvw !important;
  }
}

@supports (height: 100dvh) {
  .app-shell.app-mode {
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
  }
}

.app-shell.app-mode .app-content,
.app-shell.app-mode .screen,
.app-shell.app-mode .panel,
.app-shell.app-mode .toolbar,
.app-shell.app-mode form,
.app-shell.app-mode fieldset,
.app-shell.app-mode .form-grid,
.app-shell.app-mode .workspace-grid,
.app-shell.app-mode .list,
.app-shell.app-mode .command-operation-list,
.app-shell.app-mode .command-metric-grid {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.app-shell.app-mode .app-content,
.app-shell.app-mode .screen,
.app-shell.app-mode:not(.mobile-inner-page) .app-content,
.app-shell.app-mode .pm-home-dashboard,
.app-shell.app-mode .module-launcher-screen {
  background: var(--app-bg, #f4f6f8) !important;
}

.app-shell.app-mode img,
.app-shell.app-mode svg,
.app-shell.app-mode iframe {
  max-width: 100%;
}

/* Shared app surfaces use one card shape. */
.app-shell.app-mode :is(
  .panel,
  .toolbar,
  .job-card,
  .task-card,
  .activity-card,
  .attention-card,
  .folder-card,
  .calendar-panel,
  .calendar-event-card,
  .location-card,
  .purchase-card-row,
  .gate-card,
  .customer-form-card,
  .workflow-focus-card,
  .workflow-wizard-progress,
  .streamlit-detail-panel,
  .streamlit-metric-card,
  .mobile-command-card,
  .command-metric-card,
  .pm-home-selected-section,
  .collapsible-job-row,
  .mobile-page-strip,
  .workspace-switcher,
  .quick-panel,
  .more-tools-panel,
  .notice,
  .empty
) {
  border: 1px solid var(--mobile-ui-line) !important;
  border-radius: var(--mobile-ui-radius) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* All standard app actions share height, radius and typography. */
.app-shell.app-mode :is(
  .primary-button,
  .secondary-button,
  .danger-button,
  .back-button,
  .contact-button,
  .mini-button,
  .nav-button,
  .next-job-button,
  .app-start-sale-button,
  .program-page-navigation button,
  .job-summary-next,
  .job-summary-delete,
  .job-summary-toggle,
  .pm-active-jobs-head button,
  .appointment-reminder-actions a,
  .appointment-reminder-actions button
) {
  min-height: 42px !important;
  border-radius: var(--mobile-ui-radius-small) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-weight: 750 !important;
  line-height: 1.15 !important;
  touch-action: manipulation;
}

.app-shell.app-mode :is(
  .primary-button,
  .nav-button.active,
  .app-start-sale-button,
  .program-main-button,
  .contact-button,
  .next-job-button,
  .job-summary-next,
  .appointment-reminder-actions a
) {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.app-shell.app-mode :is(
  .secondary-button,
  .back-button,
  .mini-button,
  .program-back-button,
  .pm-active-jobs-head button
) {
  border-color: var(--mobile-ui-line) !important;
  background: #ffffff !important;
  color: var(--brand-primary-dark, #7f1016) !important;
}

/* Pills remain pills; square legacy buttons become rounded app controls. */
.app-shell.app-mode :is(.badge, .filter-pill, .mobile-module-open, .mobile-module-order, .command-operation-open) {
  border-radius: 999px !important;
}

.app-shell.app-mode .app-global-action-bar {
  border-bottom-color: var(--mobile-ui-line) !important;
  background: var(--app-card, #ffffff) !important;
}

.app-shell.app-mode .app-dot-menu-button {
  min-height: 40px !important;
  padding: 6px 11px !important;
  border: 1px solid var(--brand-primary, #a50f17) !important;
  border-radius: var(--mobile-ui-radius-small) !important;
  background: #ffffff !important;
  color: var(--brand-primary-dark, #7f1016) !important;
  box-shadow: none !important;
}

.app-shell.app-mode .app-dot-menu-button.active {
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.app-shell.app-mode .app-dot-menu-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px !important;
  border: 1px solid var(--mobile-ui-line) !important;
  border-radius: 16px !important;
  background: var(--app-card, #ffffff) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .18) !important;
}

.app-shell.app-mode .app-dot-menu-panel button {
  min-width: 0 !important;
  min-height: 52px !important;
  padding: 9px 10px !important;
  border: 1px solid var(--mobile-ui-line) !important;
  border-radius: var(--mobile-ui-radius) !important;
  background: #ffffff !important;
  color: var(--app-ink, #17212b) !important;
  box-shadow: none !important;
}

.app-shell.app-mode .app-dot-menu-panel button:hover,
.app-shell.app-mode .app-dot-menu-panel button:focus-visible {
  border-color: var(--brand-primary, #a50f17) !important;
  background: var(--mobile-ui-tint) !important;
  color: var(--brand-primary-dark, #7f1016) !important;
}

.app-shell.app-mode .app-dot-menu-panel button span {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

/* Job workspace and all other module menus use the same rounded card language. */
.app-shell.app-mode .workspace-grid {
  gap: 10px !important;
}

.app-shell.app-mode .workspace-button,
.app-shell.app-mode .workspace-button.recommended,
.app-shell.app-mode .mobile-module-card.mobile-module-row,
.app-shell.app-mode .mobile-command-card,
.app-shell.app-mode .command-metric-card,
.app-shell.app-mode .command-operation-row {
  border: 1px solid var(--mobile-ui-line) !important;
  border-radius: var(--mobile-ui-radius) !important;
  background: #ffffff !important;
  background-image: none !important;
  color: var(--app-ink, #17212b) !important;
  box-shadow: none !important;
}

.app-shell.app-mode .workspace-button.recommended,
.app-shell.app-mode .mobile-module-card.mobile-module-row.selected,
.app-shell.app-mode .command-metric-card:focus-visible,
.app-shell.app-mode .command-operation-row:focus-visible {
  border-color: var(--brand-primary, #a50f17) !important;
  background: var(--mobile-ui-tint) !important;
}

.app-shell.app-mode .workspace-button b,
.app-shell.app-mode .mobile-module-copy b,
.app-shell.app-mode .command-operation-copy b {
  color: var(--app-ink, #17212b) !important;
  font-weight: 800 !important;
}

.app-shell.app-mode .workspace-button span,
.app-shell.app-mode .mobile-module-copy small,
.app-shell.app-mode .command-operation-copy small {
  color: var(--app-muted, #5f6b7a) !important;
}

.app-shell.app-mode .command-operation-list {
  display: grid !important;
  gap: 8px !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.app-shell.app-mode .command-operation-row {
  border-bottom: 1px solid var(--mobile-ui-line) !important;
}

.app-shell.app-mode :is(.mobile-module-icon, .command-operation-icon) {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  border-radius: var(--mobile-ui-radius-small) !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

.app-shell.app-mode :is(.mobile-module-open, .command-operation-open, .smartphone-widget-open) {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

/* Forms fit the device and use one control style on every page. */
.app-shell.app-mode input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
.app-shell.app-mode textarea,
.app-shell.app-mode select {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 44px !important;
  padding: 9px 10px !important;
  border: 1px solid var(--mobile-ui-line) !important;
  border-radius: var(--mobile-ui-radius-small) !important;
  background: #ffffff !important;
  color: var(--app-ink, #17212b) !important;
  box-shadow: none !important;
  font-size: 16px !important;
}

.app-shell.app-mode input:focus,
.app-shell.app-mode textarea:focus,
.app-shell.app-mode select:focus {
  border-color: var(--brand-primary, #a50f17) !important;
  outline: 2px solid color-mix(in srgb, var(--brand-primary, #a50f17) 20%, transparent) !important;
  outline-offset: 1px !important;
}

.app-shell.app-mode input:is([type="checkbox"], [type="radio"]) {
  accent-color: var(--brand-primary, #a50f17) !important;
}

/* Remove hard-coded Elite red from other company profiles. */
.app-shell.app-mode :is(
  .eyebrow,
  .process-order,
  .smart-company-form-copy > span,
  .think-tank-lane > span,
  .inline-contractor-add summary
) {
  color: var(--brand-primary-dark, #7f1016) !important;
}

.app-shell.app-mode :is(
  .focused-task-note,
  .permit-gis-review,
  .submission-review-hero,
  .customer-history-notes,
  .company-email-connection-panel
) {
  border-left-color: var(--brand-primary, #a50f17) !important;
}

.app-shell.app-mode .recovered-flow-step.current,
.app-shell.app-mode .forms-package-button.selected,
.app-shell.app-mode .setup-option.selected,
.app-shell.app-mode .requirement-choice:has(input:checked),
.app-shell.app-mode .job-contractor-option.selected {
  border-color: var(--brand-primary, #a50f17) !important;
  background: var(--mobile-ui-tint) !important;
  color: var(--brand-primary-dark, #7f1016) !important;
}

.app-shell.app-mode .recovered-flow-step.current .flow-state,
.app-shell.app-mode .setup-interview-progress i {
  background: var(--brand-primary, #a50f17) !important;
  color: #ffffff !important;
}

/* Contact / Navigate stays solid, but now follows each company's profile. */
.app-shell.app-mode .workspace-utility-grid .quick-panel summary,
.app-shell.app-mode .workspace-utility-grid .quick-panel[open] summary,
.app-shell.app-mode .workspace-utility-grid .quick-panel .compact-contact-bar .contact-button {
  border-color: var(--brand-primary-dark, #7f1016) !important;
  border-radius: var(--mobile-ui-radius-small) !important;
  background: var(--brand-primary, #a50f17) !important;
  background-image: none !important;
  color: #ffffff !important;
}

/* Start New Sale import actions must keep the same brand button palette. */
.enterprise-intake-actions .tax-document-browse-button,
.enterprise-intake-actions button.tax-document-browse-button {
  border-color: var(--line, #141923) !important;
  background: var(--brand-primary, var(--red, #a50f17)) !important;
  background-image: none !important;
  color: #ffffff !important;
}

.enterprise-intake-actions .secondary-button:not(.tax-document-browse-button),
.enterprise-intake-actions button.secondary-button:not(.tax-document-browse-button),
.voice-sale-start {
  border-color: var(--line, #141923) !important;
  background: var(--crm-secondary, #1f425f) !important;
  background-image: none !important;
  color: #ffffff !important;
}

/* Start New Sale priority row: property and customer stay together at the top. */
.enterprise-sales-form .new-sale-top-form-row {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  align-items: stretch;
  border-bottom: 1px solid #d9dee5;
  background: #ffffff;
}

.enterprise-sales-form .new-sale-top-form-row > .sales-form-section {
  border-bottom: 0 !important;
}

.enterprise-sales-form .new-sale-top-form-row > .sales-form-section + .sales-form-section {
  border-left: 1px solid #d9dee5 !important;
}

.enterprise-sales-form .new-sale-top-form-row .enterprise-property-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.enterprise-sales-form .new-sale-top-form-row .enterprise-contact-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.enterprise-sales-form .new-sale-top-form-row .wide,
.enterprise-sales-form .new-sale-top-form-row .enterprise-location-status {
  grid-column: 1 / -1 !important;
}

@media (max-width: 1100px) {
  .enterprise-sales-form .new-sale-top-form-row {
    grid-template-columns: 1fr;
  }

  .enterprise-sales-form .new-sale-top-form-row > .sales-form-section + .sales-form-section {
    border-left: 0 !important;
    border-top: 1px solid #d9dee5 !important;
  }
}

@media (max-width: 760px) {
  .enterprise-sales-form .new-sale-top-form-row .enterprise-property-grid,
  .enterprise-sales-form .new-sale-top-form-row .enterprise-contact-grid {
    grid-template-columns: 1fr !important;
  }
}

/* v252 desktop-only persistent workspace menu control. */
@media (min-width: 1080px) {
  .desktop-menu-toggle {
    min-height: 30px;
    margin-left: 10px;
    padding: 0 10px;
    border: 1px solid #505761;
    border-radius: 2px;
    background: #24282e;
    color: #f5f6f7;
    font-size: 10px;
    font-weight: 750;
    white-space: nowrap;
    box-shadow: none;
  }

  .desktop-menu-toggle:hover,
  .desktop-menu-toggle:focus-visible {
    border-color: #8d96a1;
    background: #30353b;
    color: #ffffff;
    outline: none;
  }

  .app-shell:not(.app-mode).desktop-menu-hidden {
    grid-template-columns: 58px minmax(0, 1fr) !important;
  }

  .app-shell:not(.app-mode).desktop-menu-hidden > .topbar {
    display: none !important;
  }

  .app-shell:not(.app-mode).desktop-menu-hidden > .desktop-utility-header,
  .app-shell:not(.app-mode).desktop-menu-hidden > .app-content {
    grid-column: 2 / -1 !important;
  }
}