:root {
  --bg: #eef6f1;
  --panel: #fffdf7;
  --ink: #142520;
  --muted: #60706a;
  --line: #d6e3dc;
  --accent: #007c62;
  --accent-dark: #053a31;
  --accent-2: #d8a02f;
  --coral: #bf674b;
  --cool: #2f6f85;
  --soft: #e0f3eb;
  --page-start: #fffaf0;
  --surface: #fffefa;
  --surface-2: #f7f2e6;
  --surface-3: #eaf7f0;
  --surface-accent: #def3e9;
  --popup: #fffdfa;
  --money: #008861;
  --money-soft: #ddf6e9;
  --gold-soft: #fff1cf;
  --asset-soft: #e4f0f5;
  --warning: #8a5b00;
  --warning-soft: rgba(247, 196, 102, 0.24);
  --danger: #ae3f38;
  --danger-soft: rgba(164, 75, 62, 0.14);
  --button-text: #fffefa;
  --primary-hover: #05614f;
  --secondary-bg: #fffdf7;
  --secondary-text: #142520;
  --app-bg-dark: #0d241f;
  --workspace-bg-top: #14392f;
  --workspace-bg-bottom: #0d241f;
  --sidebar-bg-start: #123229;
  --sidebar-bg-end: #0d241f;
  --sidebar-text: #fffaf0;
  --nav-item-bg: rgba(255, 253, 247, 0.1);
  --nav-active-bg: #d8a02f;
  --nav-active-text: #13251f;
  --card-tint: #f2f8f3;
  --shadow: 0 20px 54px rgba(18, 46, 37, 0.11);
  --shadow-small: 0 10px 24px rgba(18, 46, 37, 0.075);
}

/* Host From Home themes are applied through CSS variables. */
body{background:var(--app-bg-dark)!important;color:var(--ink)}.app-shell{background:var(--app-bg-dark)!important}.workspace{background:radial-gradient(circle at 86% 0,color-mix(in srgb,var(--accent) 20%,transparent),transparent 30rem),linear-gradient(180deg,var(--workspace-bg-top) 0,var(--workspace-bg-bottom) 100%)!important}.sidebar{background:linear-gradient(180deg,var(--sidebar-bg-start),var(--sidebar-bg-end))!important;color:var(--sidebar-text)!important}.topbar,.panel,.metric-card,.dashboard-card,.dashboard-fast-start,.auth-card,.setup-card,.worker-card,.host-review-card{background:linear-gradient(180deg,var(--panel),var(--card-tint))!important;border-color:color-mix(in srgb,var(--accent) 24%,transparent)!important}.topbar{border-top-color:var(--accent)!important}.topbar:before,.metric-card:before,.dashboard-card:before{background:linear-gradient(180deg,var(--accent),var(--accent-2))!important}.panel-header span,.metric-card span,.dashboard-card span{color:var(--accent)!important}.dashboard-card,.metric-card{background:linear-gradient(160deg,var(--panel) 0,var(--surface-3) 72%,var(--gold-soft) 100%)!important}.primary-button,.dashboard-open{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--button-text)!important}.primary-button:hover,.dashboard-open:hover{background:var(--primary-hover)!important}.nav-item{background:var(--nav-item-bg)!important}.nav-item.active{background:var(--nav-active-bg)!important;color:var(--nav-active-text)!important}.ghost-button,.secondary-button,.panel-actions button,.top-actions .ghost-button{background:var(--secondary-bg)!important;color:var(--secondary-text)!important;border-color:color-mix(in srgb,var(--accent) 24%,transparent)!important}@media(max-width:760px){.workspace{background:linear-gradient(180deg,var(--workspace-bg-top),var(--workspace-bg-bottom))!important}}

/* DetailMargin-style Host From Home shell */
body:not(.worker-mode) {
  background:
    radial-gradient(circle at 10% 0, rgba(18, 63, 78, 0.22), transparent 34rem),
    radial-gradient(circle at 86% 4%, rgba(196, 127, 49, 0.2), transparent 28rem),
    linear-gradient(180deg, #232535 0, #26283b 310px, #f2eadb 310px, #f7f0df 100%) !important;
}

body:not(.worker-mode) .app-shell {
  width: min(1180px, calc(100% - 36px));
  max-width: 1180px;
  min-height: 100vh;
  margin: 18px auto 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  background: transparent !important;
  overflow: visible;
}

body:not(.worker-mode) .sidebar {
  position: sticky;
  top: 12px;
  z-index: 30;
  min-height: 0;
  height: auto;
  padding: 16px 16px 12px;
  border: 1px solid rgba(255, 253, 244, 0.13);
  border-radius: 8px;
  background:
    radial-gradient(circle at 4% 0, rgba(18, 148, 137, 0.18), transparent 24rem),
    linear-gradient(135deg, #171b32 0, #202747 70%, #17273b 100%) !important;
  box-shadow: 0 20px 48px rgba(9, 14, 28, 0.28);
  display: grid;
  grid-template-columns: minmax(280px, auto) minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 16px;
}

body:not(.worker-mode) .brand {
  min-width: 260px;
  padding: 0;
}

body:not(.worker-mode) .brand-mark {
  width: 58px;
  height: 58px;
  background: linear-gradient(135deg, #ffe17d, #d79a32) !important;
  color: #18202f;
}

body:not(.worker-mode) .brand h1 {
  color: #fff8ed;
  font-size: 32px;
  line-height: 0.98;
}

body:not(.worker-mode) .brand p {
  color: rgba(255, 248, 237, 0.74);
}

body:not(.worker-mode) .tool-nav {
  grid-column: 1 / -1;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  overflow: visible;
  padding: 8px 8px 0;
  border-top: 1px solid rgba(255, 248, 237, 0.1);
  scrollbar-width: none;
}

body:not(.worker-mode) .tool-nav::-webkit-scrollbar {
  display: none;
}

body:not(.worker-mode) .nav-item {
  width: auto;
  min-width: 112px;
  flex: 1 1 112px;
  min-height: 46px;
  padding: 10px 16px;
  border-radius: 8px;
  border-color: rgba(255, 248, 237, 0.22) !important;
  background: rgba(255, 248, 237, 0.09) !important;
  color: #fff8ed !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transform: none !important;
}

body:not(.worker-mode) .nav-item small,
body:not(.worker-mode) .nav-item.active::before {
  display: none;
}

body:not(.worker-mode) .nav-item.active {
  background: #fff8ed !important;
  color: #172033 !important;
  border-color: rgba(255, 248, 237, 0.72) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

body:not(.worker-mode) .nav-item.active::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 5px;
  height: 3px;
  border-radius: 999px;
  background: #c98d2d;
}

body:not(.worker-mode) .sync-card {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  width: 190px;
  margin: 0;
  padding: 10px 12px;
  border-color: rgba(255, 248, 237, 0.18);
  background: rgba(255, 248, 237, 0.09);
}

body:not(.worker-mode) .sync-card p {
  display: none;
}

body:not(.worker-mode) .sync-card span {
  color: rgba(255, 248, 237, 0.64);
}

body:not(.worker-mode) .sync-card strong {
  color: #fff8ed;
  font-size: 13px;
}

body:not(.worker-mode) .side-link {
  display: none;
}

body:not(.worker-mode) .workspace {
  padding: 0 0 42px;
  background: transparent !important;
  overflow: visible;
}

body:not(.worker-mode) .topbar {
  min-height: 76px;
  margin-bottom: 12px;
  padding: 14px 18px;
  border-color: rgba(255, 248, 237, 0.16) !important;
  background:
    linear-gradient(135deg, rgba(255, 248, 237, 0.98), rgba(248, 242, 226, 0.96)),
    #fff8ed !important;
  box-shadow: 0 18px 44px rgba(13, 19, 33, 0.16) !important;
}

body:not(.worker-mode) .topbar::before {
  height: 4px;
  background: linear-gradient(90deg, #0f7a6c, #c98d2d, #d46a45) !important;
}

body:not(.worker-mode) .topbar h2 {
  font-size: clamp(28px, 3vw, 38px);
  letter-spacing: 0;
}

body:not(.worker-mode) .home-filter-bar {
  margin-bottom: 12px;
  border-color: rgba(15, 117, 107, 0.18);
  background: linear-gradient(135deg, rgba(232, 246, 241, 0.96), rgba(255, 248, 237, 0.96));
  box-shadow: 0 12px 26px rgba(16, 35, 30, 0.08);
}

body:not(.worker-mode) .metric-grid {
  gap: 10px;
}

body:not(.worker-mode) .metric-card {
  min-height: 82px;
  padding: 16px 18px 16px 64px;
  border-color: rgba(146, 126, 88, 0.3) !important;
  background: linear-gradient(135deg, #fffdf7 0, #f7edda 100%) !important;
  box-shadow: 0 14px 30px rgba(16, 35, 30, 0.09) !important;
}

body:not(.worker-mode) .metric-card::before {
  width: 4px;
  background: linear-gradient(180deg, #0f7a6c, #c98d2d) !important;
}

body:not(.worker-mode) .metric-card::after {
  width: 38px;
  height: 38px;
  top: 18px;
  left: 16px;
  opacity: 0.9;
}

body:not(.worker-mode) .metric-card strong {
  font-size: 28px;
}

body:not(.worker-mode) .panel,
body:not(.worker-mode) .dashboard-fast-start,
body:not(.worker-mode) .host-review-card,
body:not(.worker-mode) .worker-card,
body:not(.worker-mode) .setup-card {
  border-color: rgba(146, 126, 88, 0.28) !important;
  background:
    linear-gradient(180deg, rgba(255, 253, 247, 0.98), rgba(249, 243, 229, 0.96)),
    #fffdf7 !important;
  box-shadow: 0 14px 32px rgba(16, 35, 30, 0.1) !important;
}

body:not(.worker-mode) .panel-header h3 {
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.05;
}

body:not(.worker-mode) .ops-calendar-panel {
  border-color: rgba(15, 117, 107, 0.26) !important;
}

body:not(.worker-mode) .calendar-day,
body:not(.worker-mode) .calendar-agenda div,
body:not(.worker-mode) .property-command-card,
body:not(.worker-mode) .dashboard-card {
  background: linear-gradient(180deg, #fffefa, #f8f2e6) !important;
  border-color: rgba(146, 126, 88, 0.26) !important;
}

body:not(.worker-mode) .calendar-day.has-events {
  background: linear-gradient(180deg, #f5fbf7, #eef7ef) !important;
}

body:not(.worker-mode) .calendar-day.selected {
  border-color: #c98d2d !important;
}

@media (max-width: 980px) {
  body:not(.worker-mode) .app-shell {
    width: min(100% - 24px, 1180px);
  }

  body:not(.worker-mode) .sidebar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  body:not(.worker-mode) .brand {
    min-width: 0;
  }

  body:not(.worker-mode) .sync-card {
    display: none;
  }
}

@media (max-width: 720px) {
  body:not(.worker-mode) {
    background:
      linear-gradient(180deg, #232535 0, #26283b 210px, #f2eadb 210px, #f7f0df 100%) !important;
  }

  body:not(.worker-mode) .app-shell {
    margin-top: 10px;
  }

  body:not(.worker-mode) .sidebar {
    position: sticky;
    top: 8px;
    padding: 12px;
  }

  body:not(.worker-mode) .tool-nav {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
  }

  body:not(.worker-mode) .topbar {
    min-height: 0;
  }

  body:not(.worker-mode) .topbar h2 {
    font-size: 32px;
  }
}

/* Final UI polish pass */
body:not(.worker-mode) .sidebar {
  padding: 14px 16px 10px;
  gap: 10px 14px;
}

body:not(.worker-mode) .brand-mark {
  width: 54px;
  height: 54px;
  border-radius: 9px;
}

body:not(.worker-mode) .brand h1 {
  font-size: clamp(26px, 2.8vw, 30px);
}

body:not(.worker-mode) .tool-nav {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  padding-inline: 0;
}

body:not(.worker-mode) .nav-item {
  min-width: 0;
  min-height: 48px;
  width: 100%;
  padding: 9px 12px;
  justify-content: center;
  text-align: center;
}

body:not(.worker-mode) .nav-item span {
  line-height: 1.05;
}

body:not(.worker-mode) .topbar {
  min-height: 68px;
}

body:not(.worker-mode) .topbar h2 {
  font-size: clamp(30px, 3vw, 38px);
}

body:not(.worker-mode) .daily-retention-panel,
body:not(.worker-mode) .property-command-card,
body:not(.worker-mode) .dashboard-card,
body:not(.worker-mode) .record-item,
body:not(.worker-mode) .panel {
  border-radius: 9px;
}

body:not(.worker-mode) .metric-card,
body:not(.worker-mode) .daily-loop-grid button,
body:not(.worker-mode) .daily-loop-digest article,
body:not(.worker-mode) .daily-loop-alerts button {
  border-radius: 8px;
}

body:not(.worker-mode) .ops-calendar-panel {
  padding-top: 14px;
}

body:not(.worker-mode) .ops-calendar-panel > .panel-header {
  display: none;
}

body:not(.worker-mode) .ops-calendar-head {
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(146, 126, 88, 0.18);
}

body:not(.worker-mode) .ops-calendar-head > div:first-child strong {
  font-size: clamp(28px, 3vw, 38px);
}

body:not(.worker-mode) .calendar-stats div {
  background: linear-gradient(180deg, #fffefa, #f7f1e5);
}

body:not(.worker-mode) .calendar-day {
  min-height: 94px;
}

body:not(.worker-mode) .calendar-day:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 22px rgba(16, 35, 30, 0.1);
}

body:not(.worker-mode) .ops-selected-day-panel {
  border-radius: 9px;
  background: linear-gradient(180deg, #fffefa, #f7f1e5);
}

@media (max-width: 1120px) {
  body:not(.worker-mode) .tool-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  body:not(.worker-mode) .tool-nav {
    display: flex;
  }

  body:not(.worker-mode) .nav-item {
    min-width: 108px;
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

[hidden] {
  display: none !important;
}

body {
  margin: 0;
  min-height: 100vh;
  background:
    linear-gradient(145deg, rgba(0, 124, 98, 0.13), transparent 380px),
    linear-gradient(32deg, transparent 0 64%, rgba(216, 160, 47, 0.11) 64% 100%),
    linear-gradient(180deg, var(--page-start) 0, var(--bg) 520px),
    var(--bg);
  color: var(--ink);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
}

body.auth-locked {
  overflow: hidden;
}

body.auth-locked .app-shell {
  filter: blur(2px);
  pointer-events: none;
  user-select: none;
}

body.auth-gate-open .top-actions {
  display: none;
}

button,
input,
select {
  font: inherit;
}

input:not([type="checkbox"]):not([type="hidden"]):not([type="radio"]),
select {
  min-height: 36px;
}

input[type="checkbox"] {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  accent-color: var(--accent);
}

input[type="file"] {
  max-width: 100%;
  min-width: 0;
}

button {
  cursor: pointer;
  min-height: 36px;
}

.customer-hidden {
  display: none !important;
}

.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 40;
  min-height: 100vh;
  padding: 20px;
  display: grid;
  place-items: center;
  background: rgba(18, 20, 23, 0.72);
}

.auth-gate[hidden] {
  display: none;
}

.auth-card {
  width: min(480px, 100%);
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, var(--popup), var(--surface-2)),
    var(--panel);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.28);
  display: grid;
  gap: 14px;
}

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

.auth-card h2 {
  margin: 5px 0 0;
  font-size: 28px;
  line-height: 1.08;
}

.auth-card p {
  margin: 7px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.auth-tester-note {
  display: grid;
  gap: 5px;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, transparent);
  border-radius: 10px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, #ffffff), #fffaf1);
  padding: 13px;
}

.auth-tester-note span {
  color: var(--accent);
  font-size: 0.74rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.auth-tester-note strong {
  color: var(--ink);
  line-height: 1.15;
}

.auth-tester-note p {
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
}

.auth-card label {
  display: grid;
  gap: 6px;
}

.auth-card input {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
}

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

.auth-payment {
  padding: 12px;
  border: 1px solid rgba(184, 59, 53, 0.22);
  border-radius: 8px;
  background: #fff8f4;
}

.auth-payment strong {
  display: block;
}

.auth-payment button {
  margin-top: 10px;
}

.auth-plan-grid {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.auth-plan-grid button {
  margin: 0;
  min-width: 0;
  border: 1px solid rgba(18, 106, 90, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: #fffdf8;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.auth-plan-grid button:hover {
  border-color: rgba(18, 106, 90, 0.42);
}

.auth-plan-grid span,
.auth-plan-grid small {
  display: block;
}

.auth-plan-grid span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.auth-plan-grid strong {
  margin-top: 4px;
  font-size: 18px;
}

.auth-plan-grid small {
  margin-top: 2px;
  color: var(--muted);
}

.auth-status {
  min-height: 20px;
  font-size: 13px;
  font-weight: 800;
}

.auth-switch-account {
  width: 100%;
}

.app-shell {
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 292px minmax(0, 1fr);
  background: linear-gradient(90deg, #09231f 0 292px, transparent 292px);
  overflow-x: hidden;
}

.sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  min-height: 100vh;
  height: auto;
  padding: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.09), transparent 250px),
    linear-gradient(145deg, rgba(216, 160, 47, 0.13), transparent 420px),
    linear-gradient(180deg, #12332d 0%, #09231f 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 22px;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0 8px;
}

.brand-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background:
    linear-gradient(135deg, #ffe49a, #d8a02f);
  color: #132522;
  font-weight: 900;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.brand h1,
.brand p,
.topbar h2,
.topbar p,
.panel-header h3,
.panel-header span,
.sync-banner p,
.sync-banner strong {
  margin: 0;
}

.brand h1 {
  font-size: 21px;
  line-height: 1.1;
}

.brand p {
  margin-top: 4px;
  color: #c8d2cd;
  font-size: 13px;
}

.tool-nav {
  display: grid;
  gap: 9px;
}

.nav-item {
  width: 100%;
  min-height: 54px;
  padding: 11px 12px 11px 14px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
  text-align: left;
  font-weight: 800;
  display: grid;
  gap: 3px;
  position: relative;
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.nav-item:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.2);
  transform: translateX(2px);
}

.nav-item.active {
  background: linear-gradient(135deg, #fff6df, #e1f4eb);
  color: #102321;
  border-color: rgba(247, 207, 122, 0.82);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
}

.nav-item.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: var(--accent);
}

.nav-item span {
  font-size: 14px;
  line-height: 1.1;
}

.nav-item small {
  color: #b9c2bd;
  font-size: 11px;
  line-height: 1.2;
  font-weight: 700;
}

.nav-item.active small {
  color: #60706a;
}

.sync-card {
  margin-top: auto;
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 248, 231, 0.16), rgba(222, 243, 233, 0.09));
}

.sync-card span,
.eyebrow,
.panel-header span,
.metric-card span,
.sync-banner span,
.record-item span {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0;
  font-weight: 800;
}

.sync-card span {
  color: #aeb5c1;
}

.sync-card strong {
  display: block;
  margin-top: 5px;
}

.sync-card p {
  margin: 8px 0 0;
  color: #d3d7de;
  font-size: 13px;
  line-height: 1.35;
}

.side-link {
  display: block;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  opacity: 0.86;
}

.side-link + .side-link {
  margin-top: -14px;
}

.workspace {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  padding: 24px 26px 32px;
}

.topbar {
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, var(--surface), var(--surface-3) 55%, #f8eed3),
    var(--surface);
  box-shadow: var(--shadow-small);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  overflow: hidden;
}

.topbar > div:first-child {
  flex: 1 1 320px;
  min-width: 260px;
}

.topbar::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: linear-gradient(90deg, var(--money), var(--accent), var(--accent-2), var(--cool));
}

.topbar h2 {
  margin-top: 5px;
  font-size: clamp(28px, 3vw, 34px);
  line-height: 1.04;
  letter-spacing: 0;
}

.daily-mode .topbar {
  padding: 14px 16px;
  align-items: center;
}

.daily-mode .topbar h2 {
  margin-top: 4px;
  font-size: 30px;
}

.daily-mode .app-clock {
  margin-top: 4px;
}

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

.top-actions {
  flex: 0 1 590px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.account-plan-pill {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 9px;
  min-height: 0;
  width: fit-content;
  max-width: min(100%, 520px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  box-shadow: none;
}

.account-plan-pill span,
.account-plan-pill strong,
.account-plan-pill small,
.account-plan-pill em {
  display: inline;
}

.account-plan-pill span {
  min-height: 24px;
  padding: 5px 8px;
  border-radius: 7px;
  background: rgba(0, 124, 98, 0.09);
  color: var(--money);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.account-plan-pill strong {
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(0, 124, 98, 0.16);
  color: var(--ink);
  font-size: 13px;
  line-height: 1.18;
}

.account-plan-pill small,
.account-plan-pill em {
  min-height: 24px;
  padding: 5px 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  font-style: normal;
}

.account-plan-pill em::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 12px;
  margin: 0 8px 0 2px;
  background: rgba(92, 112, 105, 0.28);
  vertical-align: -2px;
}

.quick-actions {
  margin-bottom: 14px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 10px;
}

body.onboarding-mode #homeFilterBar,
body.onboarding-mode #syncBanner,
body.onboarding-mode #dashboardFastStart,
body.onboarding-mode #launchBrief,
body.onboarding-mode .quick-actions,
body.onboarding-mode .metric-grid,
body.onboarding-mode .first-home-focus,
body.onboarding-mode .host-review-inbox,
body.onboarding-mode .worker-today-panel,
body.onboarding-mode .command-panel,
body.onboarding-mode .attention-panel,
body.onboarding-mode #propertyCommandCenter,
body.onboarding-mode #dashboardGrid,
body.onboarding-mode #overviewPanel,
body.onboarding-mode #launchChecklist,
body.onboarding-mode #launchActionPlan {
  display: none !important;
}

body.onboarding-mode #dashboardView {
  display: block;
}

body.onboarding-mode {
  background:
    radial-gradient(circle at 12% 0, rgba(18, 63, 78, 0.14), transparent 30rem),
    linear-gradient(180deg, #f7f0df 0, #f7f0df 100%) !important;
}

body.onboarding-mode .app-shell {
  width: min(1080px, calc(100% - 28px));
  max-width: 1080px;
  grid-template-columns: 1fr;
  min-height: auto;
  margin: 10px auto 28px;
  gap: 8px;
  align-content: start;
}

body.onboarding-mode .sidebar {
  position: static !important;
  height: auto;
  padding: 10px 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  border-color: rgba(15, 117, 107, 0.16);
  background: var(--panel) !important;
  box-shadow: var(--shadow-small);
}

body.onboarding-mode .brand {
  min-width: 0;
}

body.onboarding-mode .brand-mark {
  width: 38px;
  height: 38px;
  font-size: 12px;
}

body.onboarding-mode .brand h1 {
  color: var(--ink);
  font-size: 21px;
  line-height: 1;
}

body.onboarding-mode .brand p {
  color: var(--muted);
}

body.onboarding-mode .sync-card {
  min-height: 38px;
  min-width: 156px;
  padding: 7px 10px;
  border-color: var(--line);
  background: var(--surface-accent);
  color: var(--ink);
}

body.onboarding-mode .sync-card span,
body.onboarding-mode .sync-card strong,
body.onboarding-mode .sync-card p {
  color: var(--ink);
}

body.onboarding-mode .tool-nav,
body.onboarding-mode .topbar,
body.onboarding-mode .side-link {
  display: none !important;
}

body.onboarding-mode .workspace {
  padding: 0 0 24px;
}

body.onboarding-mode .setup-guide {
  width: 100%;
  margin-top: 0;
  padding: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  border-color: rgba(0, 124, 98, 0.24);
  background:
    linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(237, 247, 241, 0.94));
  box-shadow: 0 24px 70px rgba(34, 38, 28, 0.12);
}

body.onboarding-mode .setup-guide-copy {
  max-width: 760px;
}

body.onboarding-mode .setup-guide-copy strong {
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.02;
}

body.onboarding-mode .setup-progress {
  width: 100%;
  min-width: 0;
  justify-self: stretch;
}

body.onboarding-mode .setup-progress-rail {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.onboarding-mode .setup-progress-rail button {
  width: 100%;
  min-height: 48px;
  justify-content: flex-start;
  border-radius: 8px;
}

body.onboarding-mode .setup-wizard,
body.onboarding-mode .setup-stage-card {
  padding: 16px;
  border-radius: 8px;
}

body.onboarding-mode .setup-wizard[hidden],
body.onboarding-mode .setup-stage-card[hidden],
body.onboarding-mode .setup-active-stage[hidden],
.setup-guide[hidden] {
  display: none !important;
}

.dashboard-fast-start {
  margin-bottom: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.daily-mode .dashboard-fast-start {
  grid-template-columns: 1fr;
}

.daily-mode #quickPropertyForm {
  display: none;
}

.daily-mode #quickExpenseForm {
  grid-template-columns: minmax(220px, 0.75fr) minmax(0, 1.25fr);
  align-items: end;
}

.daily-mode #quickExpenseForm .fast-fields {
  grid-template-columns: minmax(126px, 1fr) minmax(148px, 1.1fr) minmax(118px, 0.8fr) minmax(96px, 0.7fr);
}

.launch-brief {
  margin-bottom: 14px;
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-top: 5px solid var(--accent);
  border-radius: 8px;
  padding: 16px;
  background:
    linear-gradient(125deg, rgba(0, 124, 98, 0.1), transparent 58%),
    linear-gradient(180deg, var(--surface), #fbf6e9);
  box-shadow: var(--shadow-small);
  display: grid;
  grid-template-columns: minmax(230px, 0.78fr) minmax(0, 1.22fr);
  gap: 14px;
  align-items: stretch;
}

.launch-brief-copy {
  display: grid;
  align-content: center;
}

.launch-brief-copy span,
.launch-brief-grid span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.launch-brief-copy strong {
  display: block;
  margin-top: 5px;
  max-width: 660px;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.02;
}

.launch-brief-copy p {
  margin: 9px 0 0;
  max-width: 650px;
  color: var(--muted);
  line-height: 1.45;
}

.launch-brief-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.launch-brief-grid button {
  min-width: 0;
  min-height: 132px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 12px;
  background: rgba(255, 253, 247, 0.82);
  color: var(--ink);
  text-align: left;
  display: grid;
  align-content: space-between;
  gap: 7px;
}

.launch-brief-grid button:hover {
  border-color: rgba(0, 124, 98, 0.48);
  background: var(--money-soft);
}

.launch-brief-grid strong {
  font-size: 18px;
  line-height: 1.12;
}

.launch-brief-grid small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
}

.launch-brief-grid b {
  color: var(--money);
  font-size: 12px;
}

.fast-card {
  border: 1px solid rgba(18, 106, 90, 0.2);
  border-radius: 8px;
  padding: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.72), transparent),
    linear-gradient(135deg, var(--surface-accent), var(--surface));
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 12px;
}

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

.fast-card strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.fast-card p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.fast-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  align-items: end;
}

.fast-fields label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.fast-fields label span {
  font-size: 11px;
  color: var(--muted);
}

.fast-fields input,
.fast-fields select {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.fast-fields button {
  min-height: 38px;
}

.quick-actions button {
  min-height: 62px;
  border: 1px solid rgba(0, 124, 98, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(180deg, var(--surface), #f4f8f1);
  color: var(--ink);
  text-align: left;
  padding: 12px;
  font-weight: 900;
  box-shadow: 0 8px 22px rgba(18, 46, 37, 0.065);
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
  position: relative;
  overflow: hidden;
}

.quick-actions button::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--accent);
}

.quick-actions button:nth-child(2)::before,
.quick-actions button:nth-child(6)::before {
  background: var(--money);
}

.quick-actions button:nth-child(3)::before,
.quick-actions button:nth-child(7)::before {
  background: var(--accent-2);
}

.quick-actions button:nth-child(4)::before {
  background: var(--cool);
}

.quick-actions button:hover {
  border-color: var(--accent);
  background:
    linear-gradient(180deg, var(--money-soft), #fff9e9);
  transform: translateY(-1px);
}

.quick-actions span,
.quick-actions small {
  display: block;
}

.quick-actions span {
  font-size: 14px;
  position: relative;
}

.quick-actions small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
  font-weight: 700;
  position: relative;
}

.primary-button,
.ghost-button,
.icon-button {
  min-height: 42px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-weight: 900;
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
}

.primary-button {
  padding: 0 16px;
  background: linear-gradient(135deg, var(--money), var(--accent-dark));
  color: var(--button-text);
  box-shadow: 0 10px 22px rgba(0, 124, 98, 0.22);
}

.ghost-button {
  padding: 0 16px;
  border-color: var(--line);
  background: linear-gradient(180deg, var(--surface), var(--surface-2));
  color: var(--ink);
}

.top-actions .ghost-button {
  background: rgba(255, 255, 255, 0.82);
}

.daily-mode .top-actions {
  gap: 8px;
}

.daily-mode .top-actions .primary-button,
.daily-mode .top-actions .ghost-button {
  min-height: 38px;
  padding: 0 12px;
}

.primary-button:hover,
.ghost-button:hover,
.icon-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(57, 48, 34, 0.11);
}

.compact {
  min-height: 36px;
  padding: 0 12px;
  font-size: 13px;
}

.icon-button {
  width: 36px;
  background: var(--surface-2);
  border-color: var(--line);
}

.device-prompt {
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(0, 124, 98, 0.24);
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(224, 243, 235, 0.98), rgba(255, 253, 247, 0.92)),
    var(--surface);
  box-shadow: var(--shadow-small);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.device-prompt span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.device-prompt strong {
  display: block;
  margin-top: 4px;
  font-size: 19px;
}

.device-prompt p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.device-prompt-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, 1fr));
  gap: 8px;
  flex: 0 0 auto;
}

body.device-phone-preferred .primary-button,
body.device-phone-preferred .ghost-button,
body.device-phone-preferred .mini-button,
body.device-phone-preferred input,
body.device-phone-preferred select,
body.device-phone-preferred textarea {
  min-height: 46px;
}

.sync-banner,
.panel,
.metric-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, var(--surface), #faf7ef);
  box-shadow: var(--shadow);
}

.sync-banner {
  margin-bottom: 16px;
  padding: 16px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  border-left: 5px solid var(--accent);
  background:
    linear-gradient(135deg, var(--surface-accent), var(--surface), var(--surface-2));
}

.sync-banner strong {
  display: block;
  margin-top: 5px;
  font-size: 20px;
}

.sync-banner p {
  margin-top: 7px;
  color: var(--muted);
}

.sync-banner a {
  color: var(--accent);
  font-weight: 900;
}

.paused-access-banner {
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(179, 125, 24, 0.24);
  border-left: 5px solid #d79a2b;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(255, 248, 230, 0.96), rgba(255, 255, 255, 0.88));
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.paused-access-banner span {
  color: #8a5b00;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.paused-access-banner strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.paused-access-banner p {
  margin-top: 5px;
  color: var(--muted);
  font-size: 14px;
}

body.read-only-mode .top-actions [data-host-only],
body.read-only-mode [data-quick-add],
body.read-only-mode [data-add-record] {
  display: none !important;
}

body.read-only-mode .workspace input,
body.read-only-mode .workspace select,
body.read-only-mode .workspace textarea {
  background: rgba(239, 235, 222, 0.56);
  color: var(--muted);
  cursor: not-allowed;
}

body.read-only-mode .record-actions button,
body.read-only-mode .settings-actions button,
body.read-only-mode .fast-card button,
body.read-only-mode .setup-step,
body.read-only-mode .setup-wizard button,
body.read-only-mode .setup-stage-card button {
  opacity: 0.55;
}

.home-filter-bar {
  margin-bottom: 16px;
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--popup), var(--surface-accent), var(--surface-2));
  box-shadow: var(--shadow);
}

.daily-mode .home-filter-bar {
  padding: 10px 12px;
  margin-bottom: 12px;
}

.daily-mode .home-filter-bar strong {
  font-size: 16px;
}

.daily-mode .home-filter-chip {
  padding: 7px 10px;
}

.home-filter-bar span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.home-filter-bar strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.home-filter-options {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.home-filter-chip {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 12px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
}

.home-filter-chip.active {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
  box-shadow: 0 8px 18px rgba(15, 117, 107, 0.16);
}

.setup-guide {
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: var(--shadow);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px 18px;
  align-items: start;
}

.setup-guide-copy {
  order: 1;
  min-width: 0;
}

.setup-wizard {
  order: 3;
}

.setup-stage-card {
  order: 4;
}

.setup-steps {
  order: 4;
  grid-column: 1 / -1;
}

.setup-progress {
  order: 2;
}

.setup-video,
.setup-video-library {
  order: 6;
}

.setup-progress {
  min-width: min(520px, 100%);
  justify-self: end;
  display: grid;
  gap: 10px;
}

.setup-wizard {
  grid-column: 1 / -1;
  border: 1px solid rgba(18, 106, 90, 0.22);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface);
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 12px;
}

.setup-stage-card {
  grid-column: 1 / -1;
  border: 1px solid rgba(212, 154, 50, 0.32);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(236, 247, 241, 0.9));
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 12px;
}

.setup-active-stage {
  order: 4;
  grid-column: 1 / -1;
  min-width: 0;
  display: grid;
  gap: 12px;
}

.setup-active-stage[hidden] {
  display: none !important;
}

.setup-stage-card[hidden] {
  display: none;
}

.setup-stage-card span,
.setup-stage-fields span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-stage-card strong {
  display: block;
  margin-top: 4px;
  font-size: 19px;
}

.setup-stage-card p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.setup-stage-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.setup-stage-fields label {
  display: grid;
  gap: 6px;
}

.setup-stage-fields input {
  min-height: 42px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.setup-wizard-head span,
.setup-wizard-fields span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-wizard-head strong {
  display: block;
  margin-top: 4px;
  font-size: 19px;
}

.setup-wizard-head p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.setup-wizard-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.setup-wizard-fields.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.setup-wizard-fields label {
  display: grid;
  gap: 6px;
}

.label-with-info {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

.field-info-button {
  width: 18px;
  height: 18px;
  border: 1px solid rgba(0, 124, 98, 0.28);
  border-radius: 999px;
  padding: 0;
  background: var(--surface-accent);
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.setup-wizard-fields input,
.setup-wizard-fields select {
  min-height: 42px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.setup-stage-preview {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.setup-stage-preview li {
  min-width: 0;
  border: 1px solid rgba(15, 117, 107, 0.16);
  border-radius: 8px;
  padding: 9px;
  background: rgba(255, 255, 255, 0.72);
}

.setup-stage-preview li.featured {
  border-color: rgba(0, 124, 98, 0.34);
  background: linear-gradient(135deg, var(--surface-accent), rgba(255, 255, 255, 0.9));
  box-shadow: 0 8px 18px rgba(18, 106, 90, 0.08);
}

.setup-stage-preview span {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 5px;
  border-radius: 999px;
  padding: 3px 6px;
  background: rgba(0, 124, 98, 0.1);
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-stage-preview li:not(.featured) span {
  background: rgba(91, 78, 50, 0.08);
  color: var(--muted);
}

.setup-stage-preview strong,
.setup-stage-preview small {
  display: block;
}

.setup-stage-preview strong {
  font-size: 13px;
  line-height: 1.15;
}

.setup-stage-preview small,
.setup-stage-note {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.setup-link-preview {
  display: grid;
  gap: 6px;
}

.setup-link-preview span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-link-preview input {
  min-height: 42px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

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

.setup-quantity-row {
  min-width: 0;
  border: 1px solid rgba(15, 117, 107, 0.16);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.72);
  display: grid;
  grid-template-columns: minmax(150px, 1.15fr) repeat(3, minmax(86px, 0.45fr)) minmax(170px, 0.9fr);
  gap: 8px;
  align-items: end;
}

.setup-quantity-item,
.setup-quantity-row label {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.setup-quantity-item strong,
.setup-quantity-item small {
  display: block;
}

.setup-quantity-item strong {
  line-height: 1.15;
}

.setup-quantity-item small {
  color: var(--muted);
  font-size: 12px;
}

.setup-quantity-row span {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-quantity-row input {
  min-width: 0;
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  background: var(--popup);
  color: var(--ink);
}

.starter-preview {
  min-width: 0;
  border: 1px solid rgba(15, 117, 107, 0.18);
  border-radius: 8px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(236, 247, 241, 0.76), rgba(255, 253, 248, 0.92));
}

.starter-preview-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(15, 117, 107, 0.12);
}

.starter-preview-head span,
.starter-preview-groups span {
  display: block;
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.starter-preview-head strong {
  display: block;
  margin-top: 4px;
  font-size: 17px;
}

.starter-preview-head p {
  max-width: 720px;
  margin: 5px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.starter-preview-head b {
  flex: 0 0 auto;
  border: 1px solid rgba(15, 117, 107, 0.22);
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--surface);
  color: var(--accent);
  font-size: 12px;
}

.starter-preview-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding-top: 10px;
}

.starter-preview-groups article {
  min-width: 0;
}

.starter-preview-groups div {
  margin-top: 7px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.starter-preview-groups em {
  max-width: 100%;
  border: 1px solid rgba(91, 78, 50, 0.12);
  border-radius: 999px;
  padding: 5px 8px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--ink);
  font-size: 12px;
  font-style: normal;
  line-height: 1.1;
}

.starter-editor {
  min-width: 0;
  margin-top: 12px;
  border-top: 1px solid rgba(15, 117, 107, 0.12);
  padding-top: 12px;
  display: grid;
  gap: 8px;
}

.starter-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}

.starter-editor-head span,
.starter-item-row label span {
  display: block;
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.starter-editor-head strong {
  font-size: 14px;
}

.starter-item-row {
  min-width: 0;
  border: 1px solid rgba(91, 78, 50, 0.12);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.7);
  display: grid;
  grid-template-columns: minmax(130px, 1fr) repeat(3, minmax(72px, 0.36fr));
  gap: 10px;
  align-items: end;
}

.starter-item-name {
  min-width: 0;
}

.starter-item-name strong,
.starter-item-name small {
  display: block;
}

.starter-item-name strong {
  line-height: 1.15;
}

.starter-item-name small {
  margin-top: 4px;
  color: var(--muted);
}

.starter-item-row label {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.starter-item-row input {
  min-width: 0;
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  background: var(--popup);
  color: var(--ink);
}

.starter-link-field {
  grid-column: 1 / -1;
}

.setup-wizard-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

.setup-wizard-status {
  margin: 0;
  color: var(--accent);
  font-weight: 800;
}

.setup-progress-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.setup-progress-head span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-progress-head strong {
  font-size: 13px;
  white-space: nowrap;
}

.setup-progress-rail {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.setup-progress-rail button {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 10px 0 7px;
  background: var(--surface-3);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 900;
}

.setup-progress-rail button.active {
  border-color: rgba(0, 124, 98, 0.48);
  background: var(--surface-accent);
  color: var(--ink);
  box-shadow: 0 8px 18px rgba(18, 106, 90, 0.1);
}

.setup-progress-rail button.done {
  border-color: rgba(0, 124, 98, 0.28);
  background: var(--money-soft);
  color: var(--money);
}

.setup-progress-rail b {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--surface);
  color: var(--accent);
  display: grid;
  place-items: center;
  font-size: 12px;
}

.setup-progress-rail strong {
  font-size: 13px;
  line-height: 1;
}

.setup-next-step {
  border: 1px solid rgba(0, 124, 98, 0.2);
  border-radius: 8px;
  padding: 12px;
  background: linear-gradient(135deg, var(--surface), var(--surface-accent));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.setup-next-step span,
.setup-next-step strong,
.setup-next-step p {
  display: block;
}

.setup-next-step span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-next-step strong {
  margin-top: 3px;
  font-size: 16px;
}

.setup-next-step p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.35;
  font-size: 13px;
}

.setup-next-step .primary-button {
  min-width: 160px;
}

.setup-guide-copy span,
.setup-video span,
.setup-video-head span,
.setup-video-card span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.setup-guide-copy strong,
.setup-video strong,
.setup-video-head strong,
.setup-video-card strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
  line-height: 1.2;
}

.setup-guide-copy p,
.setup-video p,
.setup-video-head p,
.setup-video-card p {
  margin: 7px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

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

.setup-step {
  min-height: 74px;
  padding: 10px;
  border: 1px solid rgba(18, 106, 90, 0.28);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  text-align: left;
}

.setup-step b {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), var(--cool));
  color: #fff;
  font-size: 13px;
}

.setup-step span {
  display: block;
  margin-top: 8px;
  font-weight: 900;
  line-height: 1.15;
}

.setup-arrow {
  color: var(--accent);
  font-weight: 900;
}

.setup-video {
  min-height: 106px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, var(--surface), var(--surface-2));
  display: flex;
  gap: 12px;
  align-items: center;
}

.setup-video-library {
  grid-column: 1 / -1;
  padding: 14px;
  border: 1px solid rgba(18, 106, 90, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 254, 250, 0.96), rgba(231, 243, 237, 0.82));
  display: grid;
  gap: 12px;
}

.setup-video-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px;
}

.setup-video-head p {
  max-width: 620px;
}

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

.setup-video-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface);
  display: grid;
  gap: 10px;
  align-content: start;
}

.setup-video-card iframe,
.video-placeholder {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(8, 120, 109, 0.92), rgba(50, 106, 128, 0.9));
}

.video-placeholder {
  color: #fff;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 8px;
  text-align: center;
}

.video-placeholder b,
.video-placeholder span {
  display: block;
  color: #fff;
}

.video-placeholder b {
  font-size: 24px;
  line-height: 1;
}

.video-placeholder span {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
  opacity: 0.78;
}

.setup-video-card .ghost-button {
  width: 100%;
  justify-content: center;
}

.video-play {
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), var(--cool));
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.view {
  display: none;
}

.view.active {
  display: block;
}

#dashboardView.active {
  display: flex;
  flex-direction: column;
}

#dashboardFastStart {
  order: 2;
}

#setupGuide {
  order: 1;
}

.quick-actions {
  order: 3;
}

.metric-grid {
  order: 4;
}

.first-home-focus {
  order: 5;
}

.finish-setup-checklist {
  order: 6;
}

.command-panel {
  order: 7;
}

.ops-calendar-panel {
  order: 8;
}

.attention-panel {
  order: 9;
}

.daily-mode #dashboardFastStart {
  order: 6;
}

.daily-mode #setupGuide {
  display: none;
}

body.onboarding-mode.daily-mode #setupGuide {
  display: grid !important;
}

.daily-mode .metric-grid {
  order: 1;
}

.daily-mode .first-home-focus {
  order: 2;
}

.daily-mode .finish-setup-checklist {
  order: 3;
}

.daily-mode .ops-calendar-panel {
  order: 4;
}

.daily-mode .command-panel {
  order: 5;
}

.daily-mode .quick-actions {
  order: 6;
}

.daily-mode .attention-panel {
  order: 8;
}

.daily-mode #workersView .notice-card[data-help-section="workers"],
.daily-mode #workersView .worker-finder {
  display: none;
}

.has-work-due #workersView .notice-card[data-help-section="workers"],
.has-work-due #workersView .worker-finder {
  display: none;
}

.has-work-due #workersView .panel-note[data-help-section="workers"] {
  display: none;
}

.has-work-due #workersView .panel-header {
  margin-bottom: 12px;
}

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

.finish-setup-checklist {
  margin-bottom: 14px;
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-top: 4px solid var(--accent);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, var(--panel), var(--surface-accent));
  box-shadow: var(--shadow-small);
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.6fr);
  gap: 14px;
  align-items: start;
}

.finish-setup-checklist[hidden] {
  display: none !important;
}

.finish-setup-copy span,
.finish-setup-list button strong {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.finish-setup-copy strong {
  display: block;
  margin-top: 4px;
  font-size: 22px;
  line-height: 1.12;
}

.finish-setup-copy p {
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

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

.finish-setup-list button {
  width: 100%;
  border: 1px solid rgba(15, 117, 107, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--ink);
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  text-align: left;
  cursor: pointer;
}

.finish-setup-list button:hover {
  border-color: rgba(0, 124, 98, 0.36);
  transform: translateY(-1px);
}

.finish-setup-list b {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: var(--surface-accent);
  color: var(--accent);
  display: grid;
  place-items: center;
  font-weight: 900;
}

.finish-setup-list small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.35;
}

.finish-setup-list em {
  font-style: normal;
  font-size: 12px;
  font-weight: 900;
  color: var(--accent);
  white-space: nowrap;
}

.finish-setup-list button.done {
  opacity: 0.72;
}

.finish-setup-list button.done b {
  background: var(--accent);
  color: var(--button-text);
}

.finish-setup-progress {
  grid-column: 1 / -1;
  color: var(--muted);
  font-weight: 800;
}

.metric-card {
  min-height: 88px;
  padding: 14px;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 86% 22%, rgba(0, 136, 97, 0.11), transparent 34%),
    linear-gradient(180deg, #fffefa, #f2fbf5);
}

.metric-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: var(--accent);
}

.metric-card:nth-child(1) {
  border-color: rgba(0, 136, 97, 0.28);
}

.metric-card:nth-child(2) {
  border-color: rgba(216, 160, 47, 0.32);
  background:
    radial-gradient(circle at 86% 22%, rgba(216, 160, 47, 0.14), transparent 34%),
    linear-gradient(180deg, #fffefa, #fff8e8);
}

.metric-card:nth-child(2)::before {
  background: var(--accent-2);
}

.metric-card:nth-child(3) {
  border-color: rgba(49, 92, 114, 0.22);
  background:
    radial-gradient(circle at 86% 22%, rgba(47, 111, 133, 0.13), transparent 34%),
    linear-gradient(180deg, #fffefa, var(--asset-soft));
}

.metric-card:nth-child(3)::before {
  background: var(--cool);
}

.metric-card:nth-child(4)::before {
  background: var(--accent-2);
}

.metric-card::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 16px;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: rgba(18, 106, 90, 0.1);
}

.metric-card:nth-child(2)::after {
  background: rgba(216, 160, 47, 0.12);
}

.metric-card:nth-child(3)::after {
  background: rgba(49, 92, 114, 0.1);
}

.metric-card strong {
  display: block;
  margin-top: 8px;
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0;
  color: var(--money);
}

.metric-card small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
}

.metric-card.warning {
  border-color: rgba(216, 160, 47, 0.32);
  background:
    radial-gradient(circle at 86% 22%, rgba(216, 160, 47, 0.13), transparent 34%),
    linear-gradient(180deg, #fffdf6, #fff5dd);
}

.metric-card.warning strong {
  color: #a96f0d;
}

.first-home-focus {
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid rgba(0, 136, 97, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(221, 246, 233, 0.94), rgba(255, 241, 207, 0.72)),
    var(--surface);
  box-shadow: 0 14px 34px rgba(18, 46, 37, 0.08);
  display: grid;
  grid-template-columns: minmax(210px, 0.7fr) minmax(0, 1.3fr);
  gap: 12px;
  align-items: stretch;
}

.first-home-focus[hidden] {
  display: none;
}

.first-home-copy span,
.first-home-stats span,
.first-home-actions span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.first-home-copy strong {
  display: block;
  margin-top: 6px;
  font-size: 20px;
  line-height: 1.12;
}

.first-home-copy p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.first-home-copy {
  grid-row: span 2;
}

.first-home-stats,
.first-home-actions {
  display: grid;
  gap: 8px;
}

.first-home-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.first-home-actions {
  grid-column: 2;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.first-home-stats button,
.first-home-actions button {
  min-width: 0;
  min-height: 72px;
  border: 1px solid rgba(0, 124, 98, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  display: grid;
  align-content: center;
}

.first-home-stats button {
  padding: 12px;
}

.first-home-stats strong {
  display: block;
  margin-top: 6px;
  font-size: 20px;
  line-height: 1;
  color: var(--money);
}

.first-home-actions button {
  padding: 10px 12px;
  position: relative;
}

.first-home-actions button::before {
  content: "";
  position: absolute;
  top: 12px;
  right: 12px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--coral);
}

.first-home-actions button.is-done::before {
  background: var(--accent);
}

.first-home-actions b {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}

.first-home-actions span {
  display: block;
  padding-right: 14px;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.25;
}

.first-home-stats button:hover,
.first-home-actions button:hover {
  border-color: rgba(0, 124, 98, 0.34);
  transform: translateY(-1px);
}

.host-review-inbox {
  margin-bottom: 14px;
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-radius: 8px;
  padding: 14px;
  background:
    linear-gradient(135deg, var(--money-soft), #fff8e7);
  box-shadow: 0 14px 34px rgba(18, 46, 37, 0.08);
  display: grid;
  gap: 12px;
}

.host-review-inbox[hidden] {
  display: none;
}

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

.host-review-head span,
.host-review-item span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.host-review-head strong {
  display: block;
  margin-top: 4px;
  font-size: 21px;
  line-height: 1.1;
}

.host-review-head p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.host-review-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 9px;
}

.host-review-item {
  min-height: 112px;
  border: 1px solid rgba(0, 124, 98, 0.16);
  border-radius: 8px;
  padding: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--ink);
  text-align: left;
  display: grid;
  align-content: start;
  gap: 5px;
}

.host-review-item.good {
  border-color: rgba(0, 136, 97, 0.28);
}

.host-review-item.warn {
  border-color: rgba(216, 160, 47, 0.36);
  background: rgba(255, 250, 240, 0.9);
}

.host-review-item strong {
  font-size: 15px;
  line-height: 1.18;
}

.host-review-item small {
  color: var(--muted);
  line-height: 1.3;
}

.host-review-note {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.28;
}

.host-review-item b {
  margin-top: 3px;
  color: var(--money);
  font-size: 12px;
}

.host-review-proof-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 3px;
}

.host-review-proof-strip.empty {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.host-review-proof-strip button {
  width: 72px;
  min-height: 50px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 5px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--money);
  display: grid;
  gap: 3px;
  place-items: center;
  text-align: center;
  text-decoration: none;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

.host-review-proof-strip img {
  width: 100%;
  aspect-ratio: 1.45;
  object-fit: cover;
  border-radius: 5px;
}

.host-review-item .mini-button {
  justify-self: start;
  margin-top: 4px;
}

.host-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 4px;
}

.work-log-card {
  margin-bottom: 10px;
}

.work-log-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.work-log-proof-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0;
  padding: 7px;
  border: 1px solid rgba(0, 124, 98, 0.12);
  border-radius: 8px;
  background: rgba(234, 248, 242, 0.55);
}

.work-log-proof-strip button {
  width: 88px;
  min-height: 70px;
  border: 1px solid rgba(0, 124, 98, 0.2);
  border-radius: 8px;
  padding: 5px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--money);
  display: grid;
  gap: 4px;
  place-items: center;
  text-align: center;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

.work-log-proof-strip img {
  width: 100%;
  aspect-ratio: 1.45;
  object-fit: cover;
  border-radius: 5px;
}

.work-log-card-actions {
  justify-content: flex-end;
  margin-top: 2px;
}

.work-log-card-actions .mini-button {
  min-height: 36px;
}

.work-expense-link-card,
.expense-linked-record {
  margin-top: 10px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: rgba(234, 248, 242, 0.72);
  display: grid;
  gap: 4px;
}

.work-expense-link-card.unlinked {
  border-color: rgba(216, 160, 47, 0.34);
  background: rgba(255, 250, 240, 0.88);
}

.work-expense-link-card.covered {
  border-color: rgba(35, 118, 155, 0.25);
  background: rgba(235, 246, 249, 0.88);
}

.work-expense-link-card.muted,
.expense-linked-record.manual {
  background: rgba(255, 255, 255, 0.7);
}

.work-expense-link-card span,
.expense-linked-record span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.work-expense-link-card strong,
.expense-linked-record strong {
  color: var(--ink);
  font-size: 14px;
}

.work-expense-link-card small,
.expense-linked-record small {
  color: var(--muted);
  line-height: 1.35;
}

.work-expense-link-card .mini-button,
.expense-linked-record .mini-button {
  justify-self: start;
  margin-top: 3px;
}

.work-expense-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 3px;
}

.proof-lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  padding: 18px;
  background: rgba(8, 25, 21, 0.72);
  display: grid;
  place-items: center;
}

.proof-lightbox[hidden] {
  display: none;
}

.proof-lightbox-card {
  width: min(92vw, 760px);
  max-height: 92vh;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 8px;
  padding: 12px;
  background: var(--popup);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.36);
  display: grid;
  gap: 10px;
}

.proof-lightbox-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.proof-lightbox img {
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 8px;
  background: #101f1b;
}

.proof-lightbox a {
  color: var(--money);
  font-weight: 900;
}

.panel {
  padding: 20px;
}

.panel-header {
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(222, 216, 205, 0.72);
}

.panel-header {
  margin-bottom: 16px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

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

.panel-header h3 {
  margin-top: 4px;
  font-size: 24px;
  line-height: 1.1;
}

.panel-note {
  max-width: 760px;
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.expense-entry-grid {
  margin-bottom: 14px;
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.2fr);
  gap: 12px;
}

.expense-entry-card,
.receipt-scan-box {
  padding: 14px;
  border: 1px solid rgba(216, 160, 47, 0.32);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--gold-soft), var(--surface));
}

.calendar-import-card {
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid rgba(0, 124, 98, 0.24);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--money-soft), var(--surface));
  display: grid;
  grid-template-columns: minmax(240px, 0.8fr) minmax(320px, 1.2fr);
  gap: 14px;
  align-items: start;
}

.calendar-import-card span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.calendar-import-card strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
  line-height: 1.2;
}

.calendar-import-card p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

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

.calendar-import-controls select,
.calendar-import-controls input,
.ical-paste-box textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
}

.calendar-import-controls select,
.calendar-import-controls input {
  min-height: 38px;
  padding: 0 10px;
}

.calendar-upload {
  min-height: 36px;
  justify-content: center;
}

.calendar-import-controls .ghost-button,
.calendar-upload {
  min-width: 0;
  width: 100%;
}

.calendar-import-guide,
.calendar-import-summary,
.settings-health-panel,
.launch-action-plan {
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 12px 14px;
  background: linear-gradient(180deg, var(--money-soft), var(--surface));
}

.calendar-import-guide {
  display: grid;
  grid-template-columns: minmax(150px, 0.5fr) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.calendar-import-guide b,
.calendar-import-summary span,
.settings-health-head span,
.launch-action-plan > div > span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.calendar-import-guide strong,
.calendar-import-summary strong,
.settings-health-head strong,
.launch-action-plan strong {
  display: block;
  margin-top: 3px;
  color: var(--ink);
}

.calendar-import-guide ol,
.launch-action-plan ol {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.calendar-import-summary p,
.launch-action-plan p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.ical-paste-box {
  grid-column: 1 / -1;
  border-top: 1px solid rgba(222, 216, 205, 0.72);
  padding-top: 10px;
}

.ical-paste-box summary {
  cursor: pointer;
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
}

.ical-paste-box textarea {
  margin: 10px 0 8px;
  padding: 10px;
  resize: vertical;
}

.sample-calendar-cta {
  grid-column: 1 / -1;
  width: fit-content;
}

.expense-entry-card {
  display: grid;
  gap: 8px;
}

.receipt-scan-box {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
}

.expense-entry-card span,
.receipt-scan-box span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.expense-entry-card strong,
.receipt-scan-box strong {
  display: block;
}

.expense-entry-card p,
.receipt-scan-box p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.expense-overview {
  margin: 14px 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.expense-overview article {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--popup);
  box-shadow: 0 8px 22px rgba(38, 47, 42, 0.04);
}

.expense-overview span,
.list-section-heading span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.expense-overview strong {
  display: block;
  margin-top: 4px;
  font-size: 22px;
  line-height: 1.1;
}

.expense-overview small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.list-section-heading {
  margin: 18px 0 8px;
  padding-top: 12px;
  border-top: 1px solid rgba(222, 216, 205, 0.72);
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-end;
}

.list-section-heading strong {
  display: block;
  margin-top: 2px;
  font-size: 17px;
}

.list-section-heading small {
  color: var(--muted);
  text-align: right;
}

.scan-upload {
  position: relative;
  flex-shrink: 0;
  min-height: 40px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  border-radius: 8px;
  background: var(--accent);
  color: var(--button-text);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}

.scan-upload input {
  position: absolute;
  width: 1px;
  min-width: 0;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.scan-status {
  margin: -2px 0 14px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.scan-status.success {
  border-color: rgba(18, 106, 90, 0.24);
  background: #eef7f1;
  color: var(--accent);
}

.scan-status.warn {
  border-color: rgba(184, 59, 53, 0.24);
  background: #fff8f4;
  color: var(--danger);
}

.source-helper {
  margin-bottom: 14px;
  padding: 14px;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 0.9fr);
  gap: 14px;
  border: 1px solid rgba(18, 106, 90, 0.22);
  border-radius: 8px;
  background: #f0f7f2;
}

.source-helper span,
.source-helper-result strong {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.source-helper strong {
  display: block;
  margin-top: 4px;
}

.source-helper p,
.source-helper-result p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.source-helper-form {
  display: grid;
  gap: 8px;
}

.source-helper-form input {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
}

.source-helper-result {
  margin: -2px 0 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
}

.source-helper-result ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.source-helper-result li {
  margin: 5px 0;
}

.readiness-meter-list {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
}

.readiness-workbench {
  margin: 14px 0 16px;
  padding: 16px;
  border: 1px solid rgba(18, 106, 90, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, var(--surface), var(--surface-accent));
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 14px;
}

.readiness-workbench-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.readiness-workbench-head span,
.readiness-bucket-head span,
.readiness-action-card span,
.readiness-summary-grid span {
  display: block;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.readiness-workbench-head strong {
  display: block;
  margin-top: 4px;
  font-size: 24px;
  line-height: 1.1;
}

.readiness-workbench-head p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.readiness-workbench-score {
  min-width: 92px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
  text-align: center;
}

.readiness-workbench-score b {
  display: block;
  color: var(--money);
  font-size: 28px;
  line-height: 1;
}

.readiness-workbench-score small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-weight: 900;
}

.readiness-summary-grid,
.readiness-bucket-grid {
  display: grid;
  gap: 10px;
}

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

.readiness-summary-grid div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--popup);
}

.readiness-summary-grid strong {
  display: block;
  margin-top: 4px;
  font-size: 24px;
}

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

.readiness-bucket {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.58);
  display: grid;
  gap: 10px;
}

.readiness-bucket.danger {
  border-color: rgba(181, 73, 61, 0.36);
  background: rgba(181, 73, 61, 0.06);
}

.readiness-bucket.warn {
  border-color: rgba(201, 139, 34, 0.32);
}

.readiness-bucket.done {
  background: rgba(221, 246, 233, 0.48);
}

.readiness-bucket-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.readiness-bucket-head strong {
  display: block;
  margin-top: 3px;
  font-size: 26px;
  line-height: 1;
}

.readiness-bucket-head small {
  color: var(--muted);
  line-height: 1.35;
  text-align: right;
}

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

.readiness-action-card,
.readiness-empty {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface);
}

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

.readiness-action-card strong,
.readiness-action-card small,
.readiness-empty strong,
.readiness-empty small {
  display: block;
}

.readiness-action-card strong {
  margin-top: 3px;
  line-height: 1.18;
}

.readiness-action-card small,
.readiness-empty small {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.35;
}

.readiness-card-meta {
  text-align: right;
}

.readiness-card-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.readiness-action-proof-strip {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.readiness-action-proof-strip button {
  width: 74px;
  min-height: 58px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 4px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--money);
  display: grid;
  gap: 3px;
  place-items: center;
  text-align: center;
  font-size: 9px;
  font-weight: 900;
  cursor: pointer;
}

.readiness-action-proof-strip img {
  width: 100%;
  aspect-ratio: 1.45;
  object-fit: cover;
  border-radius: 5px;
}

.readiness-card-actions button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 10px;
  background: var(--surface-accent);
  color: var(--ink);
  font-weight: 900;
}

.readiness-card-actions button:first-child {
  background: linear-gradient(135deg, var(--money), var(--accent-dark));
  color: #fff;
}

.readiness-history-heading {
  margin-top: 18px;
}

.readiness-meter-card {
  padding: 16px;
  border: 1px solid rgba(18, 106, 90, 0.16);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 12px 30px rgba(38, 47, 42, 0.08);
}

.readiness-meter-card.empty p {
  margin: 6px 0 0;
  color: var(--muted);
}

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

.readiness-meter-head span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.readiness-meter-head strong,
.readiness-meter-head small {
  display: block;
}

.readiness-meter-head strong {
  margin-top: 4px;
  font-size: 21px;
  line-height: 1.12;
}

.readiness-meter-head small {
  margin-top: 4px;
  color: var(--muted);
}

.readiness-score {
  flex: 0 0 auto;
  min-width: 82px;
  padding: 10px;
  border: 1px solid rgba(18, 106, 90, 0.16);
  border-radius: 8px;
  background: var(--surface-accent);
  text-align: center;
}

.readiness-score b,
.readiness-score small {
  display: block;
}

.readiness-score b {
  color: var(--accent);
  font-size: 24px;
  font-weight: 900;
}

.readiness-score small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.readiness-bar-label {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.readiness-bar-label strong {
  color: var(--ink);
}

.readiness-bar {
  height: 18px;
  margin: 8px 0 14px;
  border-radius: 999px;
  background: var(--line);
  overflow: hidden;
  box-shadow: inset 0 1px 3px rgba(40, 35, 29, 0.12);
}

.readiness-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), var(--cool));
  transition: width 180ms ease;
}

.between-stay-task-list {
  display: grid;
  gap: 8px;
}

.between-stay-task-list label,
.empty-meter-task {
  min-height: 54px;
  border: 1px solid rgba(222, 216, 205, 0.9);
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--popup);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  text-align: left;
}

.between-stay-task-list label.complete {
  background: var(--surface-accent);
  border-color: rgba(18, 106, 90, 0.24);
}

.between-stay-task-list input {
  width: 20px;
  height: 20px;
  accent-color: var(--accent);
}

.between-stay-task-list span {
  display: block;
  font-weight: 900;
}

.between-stay-task-list small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.empty-meter-task {
  color: var(--accent);
  font-weight: 900;
  grid-template-columns: 1fr;
}

.tool-tabs {
  margin-bottom: 12px;
  padding: 4px;
  display: inline-flex;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
}

.tool-tab {
  min-height: 34px;
  border: 0;
  border-radius: 7px;
  padding: 0 12px;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.tool-tab.active {
  background: var(--accent);
  color: #fff;
}

.group-tool-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

.group-tool-strip button {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 13px;
  background: var(--popup);
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.group-tool-strip button.active {
  border-color: rgba(0, 124, 98, 0.28);
  background: var(--surface-accent);
  color: var(--accent);
}

.sales-panel,
.worker-panel {
  display: none;
}

.sales-panel.active,
.worker-panel.active {
  display: block;
}

.worker-portal-summary {
  margin: 0 0 14px;
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-top: 4px solid var(--accent);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, var(--surface), var(--surface-accent));
  box-shadow: var(--shadow-small);
  display: grid;
  grid-template-columns: minmax(220px, 0.85fr) minmax(0, 1.5fr);
  gap: 14px;
  align-items: start;
}

.worker-portal-summary[hidden] {
  display: none !important;
}

.worker-portal-summary-copy span,
.worker-portal-summary-grid span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-portal-summary-copy strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
  line-height: 1.12;
}

.worker-portal-summary-copy p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.worker-portal-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.worker-portal-summary-grid button {
  min-width: 0;
  min-height: 132px;
  border: 1px solid rgba(15, 117, 107, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--ink);
  text-align: left;
  display: grid;
  gap: 5px;
  align-content: start;
  cursor: pointer;
}

.worker-portal-summary-grid button.warn {
  border-color: rgba(205, 139, 39, 0.34);
  background: linear-gradient(135deg, #fff8e8, rgba(255, 255, 255, 0.86));
}

.worker-portal-summary-grid button.good {
  border-color: rgba(0, 124, 98, 0.24);
  background: linear-gradient(135deg, var(--money-soft), rgba(255, 255, 255, 0.86));
}

.worker-portal-summary-grid button:hover {
  transform: translateY(-1px);
  border-color: rgba(0, 124, 98, 0.38);
}

.worker-portal-summary-grid strong {
  font-size: 20px;
  line-height: 1.1;
}

.worker-portal-summary-grid small {
  color: var(--muted);
  line-height: 1.3;
}

.worker-portal-summary-grid b {
  margin-top: auto;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
}

.worker-handoff-setup {
  margin: 0 0 14px;
  border: 1px solid rgba(15, 117, 107, 0.2);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(255, 253, 248, 0.98), rgba(239, 250, 246, 0.9));
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 12px;
  align-items: start;
}

.worker-handoff-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 14px;
  align-items: start;
}

.worker-message-editor,
.service-proof-setup {
  min-width: 0;
  display: grid;
  gap: 9px;
}

.worker-message-editor {
  align-content: start;
}

.service-proof-editor {
  display: grid;
  gap: 9px;
}

.worker-message-editor,
.service-proof-setup {
  border-top: 1px solid rgba(15, 117, 107, 0.16);
  padding-top: 12px;
}

.worker-handoff-setup span,
.service-proof-setup span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-handoff-setup strong,
.service-proof-setup strong {
  display: block;
  margin-top: 4px;
  font-size: 19px;
  line-height: 1.14;
}

.worker-handoff-setup p,
.worker-handoff-setup small,
.service-proof-setup p,
.service-proof-setup small {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.worker-message-editor textarea,
.service-proof-editor input,
.service-proof-editor select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--popup);
  color: var(--ink);
  resize: vertical;
  font: inherit;
  line-height: 1.4;
}

.worker-message-editor textarea {
  min-height: 162px;
}

.service-proof-editor input,
.service-proof-editor select {
  min-height: 42px;
}

.service-proof-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.service-proof-controls label,
.service-proof-picture-row label {
  display: grid;
  gap: 5px;
}

.service-proof-picture-list {
  display: grid;
  gap: 8px;
}

.service-proof-picture-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.42fr) auto;
  gap: 8px;
  align-items: end;
  border: 1px solid rgba(15, 117, 107, 0.14);
  border-radius: 8px;
  padding: 9px;
  background: rgba(255, 255, 255, 0.62);
}

.service-proof-picture-row button {
  min-height: 42px;
}

.service-proof-toggles {
  display: grid;
  gap: 5px;
}

.service-proof-toggles > span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.service-proof-toggles label {
  min-height: 36px;
  border: 1px solid rgba(15, 117, 107, 0.18);
  border-radius: 8px;
  padding: 7px 9px;
  background: rgba(255, 255, 255, 0.72);
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}

.service-proof-toggles input {
  width: 16px;
  height: 16px;
  min-height: 0;
}

.service-proof-preview {
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.74);
}

.service-proof-preview strong,
.service-proof-preview small {
  margin: 0;
}

.service-proof-preview div {
  margin-top: 9px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.service-proof-preview div span {
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 999px;
  padding: 5px 8px;
  background: var(--surface-accent);
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
  text-transform: none;
}

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

.worker-message-actions .setup-wizard-status {
  margin: 0;
}

.notice-card {
  margin-bottom: 14px;
  border: 1px solid rgba(18, 106, 90, 0.2);
  border-radius: 8px;
  padding: 13px 14px;
  background: linear-gradient(135deg, var(--surface-accent), var(--surface-2));
  box-shadow: 0 8px 20px rgba(57, 48, 34, 0.06);
}

.notice-card strong {
  display: block;
  margin-bottom: 4px;
}

.notice-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.multi-property-panel {
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid rgba(18, 106, 90, 0.2);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--surface-3), var(--surface-2));
  display: grid;
  grid-template-columns: minmax(240px, 0.58fr) minmax(0, 1.42fr);
  gap: 18px;
  align-items: start;
}

.multi-property-panel span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.multi-property-panel strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
}

.multi-property-panel p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.multi-property-controls {
  display: grid;
  gap: 10px;
}

.multi-property-controls > label,
.property-picker {
  display: grid;
  gap: 6px;
}

.multi-property-controls > label span,
.property-picker > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

#setupPropertyChecklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

#setupPropertyChecklist label {
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
  display: flex;
  align-items: center;
  gap: 8px;
}

#setupPropertyChecklist input {
  flex: 0 0 auto;
}

#setupPropertyChecklist span {
  color: var(--ink);
  font-weight: 800;
  text-transform: none;
}

.multi-property-controls select {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.setup-tool-card {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.setup-tool-card b {
  display: block;
  font-size: 14px;
}

.setup-tool-card p {
  margin: 5px 0 10px;
  font-size: 13px;
}

.setup-tool-card > div {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.setup-tool-card:last-child > div {
  grid-template-columns: minmax(140px, 1fr) auto;
}

.starter-pack-toggle {
  display: grid;
  gap: 10px;
}

.starter-pack-toggle summary {
  min-height: 44px;
  border: 1px solid rgba(15, 117, 107, 0.18);
  border-radius: 8px;
  padding: 10px 12px;
  background: linear-gradient(135deg, rgba(236, 247, 241, 0.82), rgba(255, 253, 248, 0.96));
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.starter-pack-toggle summary::-webkit-details-marker {
  display: none;
}

.starter-pack-toggle summary p {
  margin-bottom: 0;
}

.starter-pack-toggle summary > span {
  flex: 0 0 auto;
  border: 1px solid rgba(0, 124, 98, 0.2);
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--money);
  background: var(--money-soft);
  font-size: 12px;
  font-weight: 900;
}

.starter-pack-body {
  display: grid;
  gap: 10px;
}

.starter-pack-controls {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.worker-finder {
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, var(--surface), var(--surface-3));
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
  gap: 14px;
  align-items: end;
}

.worker-setup-card {
  margin-bottom: 14px;
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(236, 247, 241, 0.96), rgba(255, 253, 248, 0.98));
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 12px;
}

.worker-setup-card span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-setup-card strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.worker-setup-card p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.worker-setup-fields {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.worker-setup-fields label {
  display: grid;
  gap: 6px;
}

.worker-setup-fields input,
.worker-setup-fields select {
  min-height: 40px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.worker-finder span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-finder strong {
  display: block;
  margin-top: 4px;
}

.worker-finder p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.worker-finder-controls {
  display: grid;
  grid-template-columns: 0.8fr 1fr auto;
  gap: 10px;
}

.worker-finder select,
.worker-finder input {
  min-height: 36px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
}

.today-services-panel {
  margin: 0 0 16px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(244, 251, 246, 0.96), rgba(255, 253, 250, 0.98));
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 12px;
}

.link-readiness-card {
  margin: 0 0 12px;
  border-color: rgba(15, 92, 107, 0.2);
  background: linear-gradient(135deg, rgba(239, 250, 252, 0.96), rgba(255, 253, 250, 0.98));
}

.worker-today-panel {
  margin: 0 0 16px;
}

.today-services-panel[hidden] {
  display: none;
}

.today-services-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: end;
}

.today-services-head span,
.today-service-main span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.today-services-head h3 {
  margin: 3px 0 0;
  font-size: 24px;
  line-height: 1.1;
}

.today-services-head p {
  margin: 5px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.today-services-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(78px, 1fr));
  gap: 8px;
}

.today-services-stats article {
  min-height: 58px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.78);
}

.today-services-stats strong,
.today-services-stats small {
  display: block;
}

.today-services-stats strong {
  color: var(--money);
  font-size: 22px;
  line-height: 1;
}

.today-services-stats small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

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

.dispatch-section {
  display: grid;
  gap: 8px;
}

.dispatch-section-collapsible {
  display: block;
}

.dispatch-section-head {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
  border-bottom: 1px solid rgba(0, 124, 98, 0.14);
  padding: 2px 2px 6px;
}

summary.dispatch-section-head {
  cursor: pointer;
  list-style: none;
  padding: 0;
  border-bottom: 0;
}

summary.dispatch-section-head::-webkit-details-marker {
  display: none;
}

summary.dispatch-section-head strong::after {
  content: " +";
  color: var(--muted);
}

.dispatch-section-collapsible[open] summary.dispatch-section-head {
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(184, 92, 56, 0.24);
  padding-bottom: 6px;
}

.dispatch-section-collapsible[open] summary.dispatch-section-head strong::after {
  content: " -";
}

.dispatch-section-body {
  display: grid;
  gap: 8px;
}

.dispatch-section-head strong {
  color: var(--ink);
  font-size: 14px;
  line-height: 1.15;
}

.dispatch-section-head span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
  text-align: right;
}

.dispatch-section[data-dispatch-section="needsScheduling"] {
  border: 1px solid rgba(184, 92, 56, 0.2);
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff8f2;
}

.dispatch-section[data-dispatch-section="needsScheduling"] .dispatch-section-head {
  border-color: rgba(184, 92, 56, 0.24);
}

.dispatch-section[data-dispatch-section="needsScheduling"] .dispatch-section-head strong {
  color: #8a4326;
}

.today-service-card,
.today-service-empty {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  background: var(--popup);
}

.today-service-card {
  display: grid;
  grid-template-columns: minmax(210px, 0.85fr) minmax(0, 1.45fr);
  gap: 12px 16px;
  align-items: stretch;
  padding: 12px 12px 12px 13px;
  box-shadow: none;
}

.today-service-card.danger {
  border-color: rgba(184, 92, 56, 0.38);
  background: #fff8f2;
}

.today-service-card.today {
  border-color: rgba(0, 136, 97, 0.32);
  background: linear-gradient(90deg, rgba(221, 246, 233, 0.6), var(--surface) 58%);
}

.today-service-card.soon {
  background: #fffaf0;
}

.today-service-card.dispatch-needsScheduling {
  border-color: rgba(184, 92, 56, 0.35);
  background: #fffdf8;
}

.today-service-card.dispatch-needsScheduling .today-service-statusline .pill {
  background: rgba(184, 92, 56, 0.12);
  color: #8a4326;
}

.today-service-main strong,
.today-service-main small,
.today-service-meta small,
.today-service-empty strong,
.today-service-empty small {
  display: block;
}

.today-service-main strong {
  margin-top: 3px;
  font-size: 16px;
  line-height: 1.2;
}

.today-service-main small,
.today-service-meta small,
.today-service-empty small {
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.35;
}

.today-service-meta {
  min-width: 0;
  text-align: left;
  display: grid;
  align-content: start;
  gap: 7px;
}

.today-service-controls label {
  display: grid;
  gap: 4px;
}

.today-service-controls span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.today-service-controls {
  display: grid;
  grid-template-columns: minmax(145px, 1fr) minmax(145px, 0.9fr) minmax(165px, 0.95fr);
  gap: 8px;
}

.today-service-controls select,
.today-service-controls input {
  min-height: 36px;
  width: 100%;
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 800;
}

.today-service-statusline {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.today-service-statusline .pill {
  border-radius: 999px;
  padding: 4px 10px;
  background: rgba(0, 136, 97, 0.11);
  color: var(--money);
  font-size: 12px;
  line-height: 1;
}

.today-service-statusline small {
  margin: 0;
}

.today-service-dispatch-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.today-service-dispatch-facts span {
  border: 1px solid rgba(0, 124, 98, 0.16);
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(244, 251, 246, 0.86);
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.today-service-cost {
  border: 1px solid rgba(0, 136, 97, 0.18);
  border-radius: 8px;
  padding: 7px 9px;
  background: rgba(255, 255, 255, 0.7);
}

.today-service-notes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.today-service-cost b,
.today-service-cost small {
  display: block;
}

.today-service-cost b {
  color: var(--money);
  font-size: 14px;
  line-height: 1.1;
}

.today-service-cost small {
  margin-top: 3px;
  max-width: none;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.today-service-weather {
  border: 1px solid rgba(47, 111, 133, 0.2);
  border-radius: 8px;
  padding: 6px 8px;
  background: rgba(228, 240, 245, 0.74);
}

.today-service-weather.risk {
  border-color: rgba(174, 63, 56, 0.28);
  background: #fff1e8;
}

.today-service-weather.clear {
  border-color: rgba(0, 136, 97, 0.2);
  background: rgba(221, 246, 233, 0.74);
}

.today-service-weather b,
.today-service-weather small {
  display: block;
}

.today-service-weather b {
  color: var(--cool);
  font-size: 13px;
  line-height: 1.15;
}

.today-service-weather.risk b {
  color: var(--danger);
}

.today-service-weather small {
  margin-top: 3px;
  max-width: none;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.today-service-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  padding-top: 2px;
}

.today-service-actions button {
  min-height: 34px;
  width: auto;
  min-width: 112px;
  border: 1px solid rgba(0, 124, 98, 0.2);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
  white-space: nowrap;
}

.today-service-actions button:first-child {
  background: var(--money);
  color: #fff;
  border-color: var(--money);
}

.today-service-actions .mini-button {
  min-width: 96px;
  min-height: 32px;
  padding: 0 10px;
  background: rgba(255, 255, 255, 0.86);
  color: var(--ink);
}

.today-service-actions .rain-delay-button {
  border-color: rgba(184, 92, 56, 0.28);
  background: #fff7ef;
  color: #7b3a21;
}

.command-panel {
  margin-bottom: 16px;
}

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

.property-command-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background:
    linear-gradient(135deg, var(--surface), #f4fbf6);
  box-shadow: var(--shadow-small);
  display: grid;
  gap: 14px;
}

.property-command-card.good {
  border-color: rgba(0, 136, 97, 0.32);
  background:
    linear-gradient(135deg, var(--surface), var(--money-soft));
}

.property-command-card.warn {
  border-color: rgba(205, 139, 39, 0.38);
}

.property-command-card.danger {
  border-color: rgba(181, 73, 61, 0.42);
}

.property-command-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.property-command-head span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.property-command-head h4 {
  margin: 4px 0;
  font-size: 23px;
}

.property-command-head small {
  color: var(--muted);
}

.health-score {
  min-width: 72px;
  min-height: 72px;
  border-radius: 999px;
  background: var(--popup);
  border: 1px solid var(--line);
  display: grid;
  place-content: center;
  text-align: center;
  box-shadow: inset 0 0 0 6px var(--money-soft);
}

.health-score b {
  font-size: 26px;
  line-height: 1;
}

.health-score small {
  color: var(--muted);
  font-weight: 900;
}

.health-bar {
  height: 12px;
  border-radius: 999px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  overflow: hidden;
}

.health-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--money), var(--accent-2));
}

.next-action-strip {
  border: 1px solid rgba(0, 124, 98, 0.22);
  border-radius: 8px;
  padding: 11px 12px;
  background: linear-gradient(135deg, var(--money-soft), var(--surface));
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.next-action-strip.warn {
  border-color: rgba(201, 139, 34, 0.36);
  background: rgba(247, 196, 102, 0.13);
}

.next-action-strip.danger {
  border-color: rgba(181, 73, 61, 0.38);
  background: rgba(181, 73, 61, 0.09);
}

.next-action-strip span,
.next-action-strip strong,
.next-action-strip small {
  display: block;
}

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

.next-action-strip.danger span {
  color: var(--coral);
}

.next-action-strip.warn span {
  color: var(--accent-2);
}

.next-action-strip strong {
  margin-top: 3px;
  font-size: 16px;
  line-height: 1.2;
}

.next-action-strip small {
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.35;
}

.next-action-strip button,
.command-row-actions button {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 10px;
  background: linear-gradient(180deg, var(--surface), var(--surface-2));
  color: var(--ink);
  font-weight: 900;
}

.next-action-strip button {
  flex: 0 0 auto;
  background: linear-gradient(135deg, var(--money), var(--accent-dark));
  color: #fff;
  border-color: rgba(255, 255, 255, 0.12);
}

.property-command-card.warn .health-bar i {
  background: linear-gradient(90deg, var(--accent-2), var(--accent));
}

.property-command-card.danger .health-bar i {
  background: linear-gradient(90deg, var(--coral), var(--accent-2));
}

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

.command-stat-grid div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: linear-gradient(180deg, var(--popup), #f7fbf5);
}

.command-stat-grid span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.command-stat-grid strong {
  display: block;
  margin-top: 4px;
  font-size: 15px;
  color: var(--money);
}

.command-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--popup);
}

.command-section-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
}

.command-section-head > div {
  display: flex;
  gap: 8px;
}

.command-section-head button,
.command-actions button {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--surface-accent);
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
}

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

.command-list-row {
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px;
  background: var(--surface);
}

.command-list-row > b {
  color: var(--accent);
  font-size: 12px;
  text-transform: uppercase;
}

.command-list-row.danger > b {
  color: var(--coral);
}

.command-list-row.warn > b {
  color: var(--accent-2);
}

.command-list-row strong,
.command-list-row small {
  display: block;
}

.command-list-row small {
  margin-top: 3px;
  color: var(--muted);
}

.command-row-actions {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.command-row-actions button:first-child {
  background: var(--surface-accent);
}

.command-empty {
  color: var(--muted);
  font-weight: 800;
}

.command-section.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.command-section.split a,
.command-section.split p {
  display: block;
  margin: 8px 0 0;
  color: var(--ink);
  text-decoration: none;
  font-weight: 900;
}

.command-section.split small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-weight: 700;
}

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

.multi-home-heavy .property-command-grid {
  grid-template-columns: 1fr;
}

.multi-home-heavy .property-command-card {
  gap: 10px;
}

.multi-home-heavy .property-command-card .command-section.split {
  display: none;
}

.ops-calendar-panel {
  margin-bottom: 16px;
  container-type: inline-size;
}

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

.ops-calendar-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.ops-calendar-head > strong {
  font-size: 20px;
}

.ops-calendar-head > div:first-child {
  flex: 1 1 260px;
  display: grid;
  gap: 4px;
}

.ops-calendar-head > div:first-child span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.ops-calendar-head > div:first-child strong {
  font-size: clamp(22px, 2.1vw, 30px);
  line-height: 1.05;
}

.ops-calendar-head > div:first-child small {
  color: var(--muted);
  font-weight: 800;
  line-height: 1.35;
}

.calendar-month-controls {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.calendar-legend {
  display: flex;
  flex: 1 1 240px;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.calendar-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  padding: 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

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

.calendar-stats div {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, var(--surface), #fbfaf4);
  padding: 11px 12px;
}

.calendar-stats span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.calendar-stats strong {
  display: block;
  margin-top: 5px;
  font-size: 22px;
  line-height: 1;
}

.calendar-legend i,
.calendar-agenda i,
.calendar-dots i {
  display: inline-block;
  border-radius: 999px;
  background: var(--muted);
}

.calendar-legend i,
.calendar-agenda i {
  width: 9px;
  height: 9px;
}

.calendar-dots i {
  width: 8px;
  height: 8px;
}

.calendar-legend .stay,
.calendar-dots .stay,
.calendar-agenda .stay {
  background: var(--accent);
}

.calendar-legend .cleaning,
.calendar-dots .cleaning,
.calendar-agenda .cleaning {
  background: var(--cool);
}

.calendar-legend .service,
.calendar-dots .service,
.calendar-agenda .service {
  background: var(--accent-2);
}

.calendar-legend .restock,
.calendar-dots .restock,
.calendar-agenda .restock {
  background: var(--coral);
}

.calendar-legend .task,
.calendar-dots .task,
.calendar-agenda .task {
  background: var(--ink);
}

.calendar-legend .blocked,
.calendar-agenda .blocked {
  background: var(--danger);
}

.ops-calendar-weekdays,
.ops-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.ops-calendar-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 14px;
  align-items: start;
}

.ops-calendar-weekdays b {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
  text-align: center;
}

.calendar-day {
  min-height: 104px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: var(--surface);
  color: var(--ink);
  text-align: left;
  display: grid;
  align-content: start;
  gap: 6px;
}

.calendar-day.today {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 2px rgba(15, 117, 107, 0.12);
}

.calendar-day.has-events {
  background: linear-gradient(180deg, var(--surface), var(--surface-accent));
}

.calendar-day.selected {
  border-color: var(--accent);
  outline: 3px solid rgba(15, 117, 107, 0.15);
  box-shadow: 0 16px 30px rgba(15, 117, 107, 0.16);
}

.calendar-day.has-blocked {
  box-shadow: inset 0 -3px 0 var(--danger);
}

.calendar-day.calendar-day-blank {
  min-height: 104px;
  border-style: dashed;
  background: rgba(255, 255, 255, 0.34);
  box-shadow: none;
  pointer-events: none;
}

.calendar-day > span {
  font-weight: 900;
}

.calendar-day small {
  width: fit-content;
  max-width: 100%;
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(15, 117, 107, 0.12);
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.15;
  white-space: normal;
  overflow-wrap: anywhere;
}

.calendar-day .blocked-line {
  background: rgba(181, 81, 70, 0.12);
  color: var(--danger);
}

.calendar-day .empty-line {
  background: rgba(107, 114, 128, 0.12);
  color: var(--muted);
}

.calendar-dots {
  min-height: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}

.calendar-dots em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.calendar-day-list {
  display: grid;
  gap: 3px;
}

.calendar-day-list small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

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

.calendar-agenda.selected {
  grid-template-columns: 1fr;
}

.calendar-agenda div {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--popup);
  display: grid;
  gap: 6px 8px;
  align-items: center;
}

.agenda-item {
  padding-left: 14px !important;
}

.agenda-item::before {
  content: "";
  position: absolute;
  inset: 9px auto 9px 0;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: var(--accent);
}

.agenda-item.open::before {
  background: var(--cool);
}

.agenda-item.blocked::before {
  background: var(--danger);
}

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

.calendar-agenda strong {
  font-size: 13px;
}

.calendar-agenda small {
  color: var(--muted);
}

.agenda-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.agenda-item-actions .mini-button {
  min-height: 30px;
}

.ops-selected-day-panel {
  position: sticky;
  top: 14px;
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  padding: 14px;
  box-shadow: var(--shadow-soft);
}

.ops-selected-day-panel > span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.ops-selected-day-panel h4 {
  margin: 0;
  font-size: 18px;
}

.ops-calendar-actions {
  display: grid;
  gap: 8px;
}

.calendar-action-note {
  color: var(--muted);
  font-weight: 800;
}

@container (max-width: 900px) {
  .ops-calendar-shell {
    grid-template-columns: 1fr;
  }

  .ops-selected-day-panel {
    position: static;
  }

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

  .calendar-day {
    min-height: 76px;
  }
}

@container (max-width: 560px) {
  .ops-calendar-head {
    display: grid;
  }

  .calendar-month-controls {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .calendar-legend {
    justify-content: flex-start;
  }

  .ops-calendar-weekdays,
  .ops-calendar-grid {
    gap: 5px;
  }

  .calendar-day {
    min-height: 54px;
    padding: 6px;
    place-items: center;
    align-content: center;
    text-align: center;
  }

  .calendar-day.calendar-day-blank {
    min-height: 54px;
  }

  .calendar-day small {
    display: none;
  }

  .calendar-day.has-events::after {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--accent);
  }

  .calendar-day.has-blocked::after {
    background: var(--danger);
  }
}

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

.attention-panel .dashboard-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dashboard-card,
.record-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(180deg, var(--surface), #fbfaf4);
}

.dashboard-card {
  cursor: pointer;
}

.dashboard-card:hover,
.record-item:hover {
  border-color: rgba(0, 124, 98, 0.34);
  box-shadow: 0 16px 34px rgba(18, 46, 37, 0.1);
}

.dashboard-card {
  min-height: 230px;
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(18, 46, 37, 0.06);
}

button.dashboard-card {
  appearance: none;
  border-color: var(--line);
  text-align: left;
  font: inherit;
}

.dashboard-shortcut-card {
  min-height: 102px;
  gap: 3px;
  justify-content: center;
}

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

.dashboard-shortcut-card strong {
  font-size: 17px;
  line-height: 1.15;
}

.dashboard-shortcut-card b {
  margin-top: 3px;
  color: var(--money);
  font-size: 18px;
}

.dashboard-shortcut-card small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.25;
}

.host-demo-guide {
  grid-column: 1 / -1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(230px, 1fr) minmax(0, 1.55fr) auto;
  align-items: stretch;
  gap: 12px;
  border-color: rgba(0, 124, 98, 0.28);
  background: linear-gradient(135deg, rgba(232, 246, 239, 0.96), rgba(255, 250, 241, 0.94));
}

.host-demo-guide > div:first-child {
  min-width: 0;
}

.host-demo-guide p,
.host-demo-guide small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}

.host-demo-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.host-demo-steps button {
  appearance: none;
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 98px;
  min-width: 0;
  padding: 11px;
  text-align: left;
  color: var(--ink);
  font: inherit;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  cursor: pointer;
}

.host-demo-steps span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.host-demo-steps strong {
  line-height: 1.14;
}

.host-demo-feedback {
  align-self: center;
  white-space: nowrap;
}

.host-retention-digest {
  grid-column: 1 / -1;
  min-height: 0;
}

.host-retention-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 4px;
}

.host-retention-grid button {
  appearance: none;
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 116px;
  padding: 12px;
  text-align: left;
  color: var(--ink);
  font: inherit;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 8px 18px rgba(18, 46, 37, 0.06);
  cursor: pointer;
}

.host-retention-grid button:hover {
  border-color: rgba(0, 124, 98, 0.34);
  transform: translateY(-1px);
}

.host-retention-grid span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.host-retention-grid strong {
  line-height: 1.14;
}

.host-retention-grid small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}

.host-alert-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.host-alert-grid button {
  appearance: none;
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 106px;
  padding: 12px;
  text-align: left;
  color: var(--ink);
  font: inherit;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 8px 18px rgba(18, 46, 37, 0.06);
  cursor: pointer;
}

.host-alert-grid button.warn {
  border-color: rgba(201, 141, 45, 0.38);
  background: #fffaf0;
}

.host-alert-grid button.good {
  border-color: rgba(0, 124, 98, 0.24);
}

.host-alert-grid span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.host-alert-grid strong {
  line-height: 1.14;
}

.host-alert-grid small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}

.dashboard-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--money);
}

.dashboard-card:nth-child(2)::before,
.dashboard-card:nth-child(7)::before {
  background: var(--cool);
}

.dashboard-card:nth-child(3)::before,
.dashboard-card:nth-child(8)::before {
  background: var(--accent-2);
}

.dashboard-card:nth-child(4)::before,
.dashboard-card:nth-child(9)::before {
  background: var(--accent-2);
}

.dashboard-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.dashboard-card h4 {
  margin: 4px 0 0;
  font-size: 20px;
}

.dashboard-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.mini-list,
.record-list {
  display: grid;
  gap: 9px;
}

.mini-list {
  margin-top: auto;
}

.mini-row,
.record-item {
  min-height: 52px;
  padding: 10px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: linear-gradient(180deg, var(--surface), #fbfaf4);
}

.mini-row {
  background: var(--popup);
}

.record-item {
  box-shadow: 0 6px 18px rgba(18, 46, 37, 0.04);
  align-items: flex-start;
}

.record-body {
  min-width: 0;
  flex: 1;
}

.property-snapshot-list {
  gap: 14px;
}

.property-snapshot-card {
  min-height: 210px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: linear-gradient(180deg, var(--surface), #fbfaf4);
  box-shadow: 0 10px 24px rgba(18, 46, 37, 0.07);
  display: grid;
  grid-template-columns: minmax(220px, 0.38fr) minmax(0, 1fr);
}

.property-snapshot-image {
  position: relative;
  min-height: 210px;
  background: var(--surface-accent);
}

.property-snapshot-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(16, 41, 35, 0.16));
}

.property-snapshot-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.property-snapshot-main {
  min-width: 0;
  padding: 14px;
  display: grid;
  gap: 12px;
  align-content: space-between;
}

.property-snapshot-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.property-snapshot-head span,
.property-year-grid small {
  display: block;
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.property-snapshot-head strong {
  display: block;
  margin-top: 3px;
  font-size: 24px;
  line-height: 1.1;
}

.property-snapshot-head small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
}

.property-year-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.property-year-grid span {
  min-width: 0;
  border: 1px solid rgba(91, 78, 50, 0.12);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.66);
}

.property-year-grid b {
  display: block;
  margin-top: 4px;
  font-size: 17px;
  line-height: 1.12;
}

.property-year-grid .good b {
  color: var(--money);
}

.property-year-grid .danger b {
  color: var(--danger);
}

.property-snapshot-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.dashboard-open {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 6px 9px;
  background: var(--money-soft);
  color: var(--money);
  font-size: 11px;
  font-weight: 900;
}

.empty-record {
  border-style: dashed;
  background: var(--surface);
}

.mini-row strong,
.record-item strong {
  display: block;
  line-height: 1.15;
}

.mini-row small,
.record-item small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.record-meta-grid {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(4, minmax(92px, 1fr));
  gap: 7px;
}

.record-fact {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 8px;
  background: linear-gradient(180deg, var(--popup), #f8fbf5);
}

.record-fact small {
  margin: 0 0 3px;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.record-fact b {
  display: block;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.2;
}

.record-fact.money b {
  color: var(--money);
}

.record-fact.warn {
  border-color: rgba(201, 139, 34, 0.35);
  background: rgba(247, 196, 102, 0.14);
}

.record-fact.danger {
  border-color: rgba(164, 75, 62, 0.36);
  background: rgba(164, 75, 62, 0.1);
}

.inline-stock-input {
  width: 100%;
  min-height: 28px;
  border: 0;
  border-radius: 6px;
  padding: 2px 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 15px;
  font-weight: 900;
  outline: none;
}

.inline-stock-input:focus {
  padding-inline: 6px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 0 0 2px rgba(0, 124, 98, 0.24);
}

.record-note {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.receipts-record {
  border-left: 4px solid var(--accent-2);
}

.recurringServices-record {
  border-left: 4px solid var(--cool);
}

.receipt-image-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  margin-top: 7px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 7px;
  padding: 0 10px;
  background: rgba(224, 243, 235, 0.55);
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
}

.receipt-proof-chip {
  width: max-content;
  margin-top: 7px;
  border: 1px solid rgba(0, 124, 98, 0.2);
  border-radius: 8px;
  padding: 6px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--money);
  display: inline-grid;
  gap: 4px;
  justify-items: center;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
}

.receipt-proof-chip img {
  width: 64px;
  aspect-ratio: 1.2;
  object-fit: cover;
  border-radius: 5px;
}

.record-actions a.mini-button {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.trip-note {
  max-width: 620px;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.pill {
  flex-shrink: 0;
  border-radius: 7px;
  padding: 6px 8px;
  background: var(--money-soft);
  color: var(--money);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.pill.warn {
  background: var(--warning-soft);
  color: var(--warning);
}

.pill.danger {
  background: var(--danger-soft);
  color: var(--danger);
}

.record-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  max-width: 260px;
}

.empty-action-record {
  align-items: center;
}

.empty-record-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.mini-button {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--popup);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 900;
}

.mini-button.accent {
  border-color: rgba(18, 106, 90, 0.26);
  background: var(--surface-accent);
  color: var(--accent);
}

.mini-button.danger {
  color: var(--danger);
}

.provider-card-clean {
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 14px;
  align-items: stretch;
}

.provider-card-body {
  display: grid;
  gap: 10px;
}

.provider-card-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

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

.provider-contact-grid a {
  color: var(--accent);
  text-decoration: none;
}

.provider-recurring-summary {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.provider-recurring-summary .record-fact {
  background: var(--money-soft);
  border-color: rgba(0, 124, 98, 0.22);
}

.provider-rate-card {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(250px, 1.25fr);
  gap: 12px;
  align-items: center;
}

.provider-rate-card b {
  white-space: nowrap;
}

.provider-recurring-summary em {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 650;
  line-height: 1.25;
}

.provider-rate-controls {
  display: grid;
  grid-template-columns: minmax(90px, 0.8fr) minmax(140px, 1.2fr);
  gap: 7px;
}

.provider-rate-controls label {
  display: grid;
  gap: 3px;
}

.provider-rate-controls input,
.provider-rate-controls select {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--popup);
  color: var(--ink);
  padding: 4px 7px;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
}

.provider-action-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  align-content: start;
  min-width: 150px;
}

.provider-action-panel .mini-button {
  width: 100%;
  min-height: 36px;
  padding: 0 10px;
}

.provider-action-panel .mini-button:first-child {
  grid-column: 1 / -1;
}

.worker-task-card {
  padding: 14px;
  border: 1px solid rgba(0, 124, 98, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, var(--surface), var(--money-soft));
  box-shadow: 0 14px 34px rgba(18, 46, 37, 0.08);
  display: grid;
  gap: 12px;
}

.worker-task-hero span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-task-hero strong {
  display: block;
  margin-top: 4px;
  font-size: 26px;
  line-height: 1.1;
}

.worker-task-hero p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 15px;
  font-weight: 750;
}

.worker-step-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.worker-step-strip div {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 9px;
  background: rgba(255, 255, 255, 0.72);
  display: flex;
  align-items: center;
  gap: 8px;
}

.worker-step-strip b {
  width: 25px;
  height: 25px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 12px;
}

.worker-step-strip span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.worker-step-strip .complete {
  border-color: rgba(0, 136, 97, 0.28);
  background: var(--money-soft);
}

.worker-step-strip .complete b {
  background: var(--money);
  color: #fff;
}

.worker-step-strip .complete span {
  color: var(--money);
}

.worker-simple-actions {
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.82);
  display: grid;
  grid-template-columns: minmax(150px, auto) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.worker-simple-actions span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.worker-photo-primary {
  min-height: 48px;
}

.worker-success-box {
  border: 1px solid rgba(0, 136, 97, 0.28);
  border-radius: 8px;
  padding: 11px;
  background: var(--money-soft);
}

.worker-success-box b,
.worker-success-box span {
  display: block;
}

.worker-success-box b {
  color: var(--money);
  font-size: 13px;
  text-transform: uppercase;
}

.worker-success-box span {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.35;
}

.worker-stay-alert,
.worker-location-card,
.worker-note-box,
.worker-shopping-list {
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
}

.worker-stay-alert.active {
  border-color: rgba(184, 92, 56, 0.28);
  background: var(--surface-2);
}

.worker-stay-alert b,
.worker-stay-alert span,
.worker-location-card b,
.worker-location-card strong,
.worker-location-card span,
.worker-location-card p,
.worker-note-box b,
.worker-note-box p,
.worker-shopping-list b,
.worker-shopping-list p {
  display: block;
}

.worker-stay-alert b,
.worker-location-card b,
.worker-note-box b,
.worker-shopping-list b {
  font-size: 12px;
  text-transform: uppercase;
  color: var(--accent);
}

.worker-stay-alert span,
.worker-location-card span,
.worker-note-box p,
.worker-shopping-list p {
  margin: 5px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.worker-location-card {
  background: #f7fbf4;
  border-color: rgba(0, 124, 98, 0.22);
}

.worker-location-card strong {
  margin-top: 5px;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.25;
}

.worker-location-card small {
  display: block;
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-note-box.warning {
  background: var(--surface-2);
}

.worker-shopping-list {
  background: #fffaf0;
  border-color: rgba(216, 160, 47, 0.32);
}

.worker-shopping-list ul {
  margin: 9px 0 0;
  padding-left: 20px;
  display: grid;
  gap: 5px;
}

.worker-shopping-list li {
  line-height: 1.32;
}

.worker-buy-links {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.worker-buy-links a {
  min-height: 34px;
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 999px;
  padding: 6px 9px;
  background: var(--money-soft);
  color: var(--money);
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

.photo-request-grid {
  display: grid;
  gap: 9px;
}

.photo-request-item {
  min-height: 58px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.84);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.photo-request-item.complete {
  background: var(--money-soft);
  border-color: rgba(0, 136, 97, 0.28);
}

.photo-request-item b,
.photo-request-item span {
  display: block;
}

.photo-request-item span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.worker-quick-update {
  border: 1px solid rgba(0, 124, 98, 0.18);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.82);
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(110px, 0.34fr) auto;
  gap: 10px;
  align-items: end;
}

.worker-quick-update label,
.worker-quick-update span {
  display: grid;
}

.worker-quick-update span {
  margin-bottom: 5px;
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.worker-quick-update input,
.worker-quick-update textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
  color: var(--ink);
}

.worker-quick-update input {
  min-height: 38px;
  padding: 0 10px;
}

.worker-quick-update textarea {
  min-height: 38px;
  padding: 9px 10px;
  resize: vertical;
}

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

.worker-finish-button {
  min-height: 46px;
  min-width: 180px;
  font-size: 15px;
  box-shadow: 0 14px 28px rgba(0, 124, 98, 0.22);
}

.worker-finish-button:disabled {
  opacity: 0.78;
  cursor: default;
}

.worker-mode [data-add-record],
.worker-mode #suggestedRestockButton,
.worker-mode #sourceHelperButton,
.worker-mode #sourceHelperInput,
.worker-mode .source-helper,
.worker-mode .source-helper-result,
.worker-mode .readiness-workbench,
.worker-mode .readiness-history-heading,
.worker-mode .readiness-meter-list,
.worker-mode #operationsView .panel-header,
.worker-mode #restocksView .panel-header,
.worker-mode #restocksView .notice-card[data-help-section="restocks"] {
  display: none !important;
}

.worker-mode .tool-nav,
.worker-mode .sync-card,
.worker-mode .side-link,
.worker-mode .sync-banner {
  display: none;
}

.worker-mode .sidebar {
  height: auto;
  min-height: 0;
}

.worker-mode .app-shell {
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
}

body.modal-open {
  overflow: hidden;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: clamp(12px, 3vh, 28px);
  background: rgba(12, 14, 17, 0.62);
}

.modal-backdrop[hidden] {
  display: none;
}

.modal {
  width: min(760px, 100%);
  max-height: calc(100dvh - clamp(24px, 6vh, 56px));
  overflow: auto;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.25);
}

.modal-header {
  margin-bottom: 16px;
  display: flex;
  justify-content: space-between;
  gap: 14px;
}

.modal-header span {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0;
  font-weight: 800;
}

.modal-header h3 {
  margin: 4px 0 0;
  font-size: 24px;
}

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

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

.settings-hub {
  margin-bottom: 16px;
  border: 1px solid rgba(18, 106, 90, 0.22);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface-accent);
  display: grid;
  grid-template-columns: minmax(240px, 0.75fr) minmax(0, 1.25fr);
  gap: 14px;
  align-items: center;
}

.settings-health-panel {
  margin-bottom: 16px;
  background: linear-gradient(135deg, var(--surface-accent), var(--surface));
}

.time-travel-panel {
  margin-bottom: 16px;
  border: 1px solid rgba(50, 106, 128, 0.28);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, var(--surface), var(--surface-3));
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto minmax(170px, 0.35fr) auto;
  gap: 12px;
  align-items: end;
}

.time-travel-panel span,
.time-travel-panel strong,
.time-travel-panel p {
  display: block;
}

.time-travel-panel span {
  color: var(--cool);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.time-travel-panel strong {
  margin-top: 4px;
  font-size: 18px;
}

.time-travel-panel p {
  margin: 5px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.time-travel-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.time-travel-actions button,
.time-travel-panel > button {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--popup);
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
}

.time-travel-panel label {
  display: grid;
  gap: 6px;
}

.time-travel-panel input {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.settings-health-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
  margin-bottom: 12px;
}

.settings-health-head b {
  min-width: 64px;
  min-height: 64px;
  border-radius: 999px;
  display: grid;
  place-content: center;
  background: var(--popup);
  border: 1px solid var(--line);
  color: var(--accent);
  font-size: 18px;
}

.settings-health-head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
}

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

.settings-health-item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--popup);
}

.settings-health-item b {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.settings-health-item.ready b {
  color: var(--accent);
}

.settings-health-item.needs b {
  color: var(--coral);
}

.settings-health-item strong,
.settings-health-item small {
  display: block;
}

.settings-health-item strong {
  margin-top: 3px;
  font-size: 13px;
}

.settings-health-item small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.settings-tips-panel {
  margin-bottom: 16px;
  border: 1px solid rgba(55, 111, 131, 0.2);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, var(--surface), var(--surface-3));
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
  gap: 14px;
  align-items: start;
}

.trust-card,
.theme-card,
.billing-card,
.launch-card {
  margin-bottom: 16px;
  border: 1px solid rgba(18, 106, 90, 0.2);
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, var(--surface-3), var(--surface));
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
}

.theme-card {
  align-items: stretch;
}

.billing-card {
  flex-wrap: wrap;
}

.billing-card > div:first-child {
  flex: 1 1 260px;
  min-width: min(100%, 260px);
}

.trust-card span,
.billing-card span,
.theme-card > div span,
.theme-picker > span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.trust-card strong,
.billing-card strong,
.theme-card strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.trust-card p,
.billing-card p,
.theme-card p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.billing-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.billing-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.62;
  transform: none;
  box-shadow: none;
}

.launch-card {
  display: grid;
  align-items: stretch;
}

.launch-action-plan {
  margin-bottom: 16px;
  display: grid;
  grid-template-columns: minmax(0, 0.55fr) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  background: var(--surface);
}

.launch-action-plan li {
  margin-bottom: 8px;
}

.launch-action-plan li span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

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

.launch-card-head span,
.launch-check b {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.launch-card-head strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.launch-card-head p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.launch-check-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.launch-check {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--popup);
}

.launch-check.needs {
  border-color: rgba(201, 139, 34, 0.38);
  background: rgba(247, 196, 102, 0.12);
}

.launch-check.ready b {
  color: var(--accent);
}

.launch-check.needs b {
  color: #a66424;
}

.launch-check strong,
.launch-check small {
  display: block;
}

.launch-check strong {
  margin-top: 4px;
  line-height: 1.2;
}

.launch-check small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.theme-picker {
  width: min(100%, 640px);
  display: grid;
  gap: 10px;
}

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

.theme-palette-option {
  min-height: 96px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--popup);
  color: var(--ink);
  cursor: pointer;
  display: grid;
  gap: 8px;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.theme-palette-option:hover,
.theme-palette-option:focus-within {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--line));
  box-shadow: var(--shadow-small);
  transform: translateY(-1px);
}

.theme-palette-option.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}

.theme-palette-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.theme-palette-name {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.theme-palette-name strong {
  margin: 0;
  font-size: 15px;
}

.theme-palette-name small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.theme-swatches {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.theme-swatches i {
  height: 26px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

.theme-palette-option p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.theme-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.theme-status {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.settings-tips-panel span {
  color: var(--cool);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.settings-tips-panel strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
  line-height: 1.2;
}

.settings-tips-panel p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.tip-toggle-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.tip-toggle {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.82);
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
}

.tip-toggle input {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
}

.tip-toggle span {
  color: var(--ink);
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0;
}

.settings-hub-copy span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.settings-hub-copy strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
  line-height: 1.2;
}

.settings-hub-copy p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

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

.settings-shortcuts button,
.settings-upload {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  display: grid;
  place-items: center;
  text-align: center;
  font-weight: 900;
}

.settings-upload input {
  display: none;
}

.settings-form label {
  display: grid;
  gap: 6px;
}

.settings-form .full {
  grid-column: 1 / -1;
}

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

.settings-form input {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
}

.settings-form input[readonly] {
  background: var(--surface-2);
  color: var(--muted);
}

.settings-form select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  color: var(--ink);
}

.weekly-reminder-preview {
  padding: 14px;
  border: 1px solid rgba(18, 106, 90, 0.18);
  border-radius: 8px;
  background: var(--surface-3);
}

.weekly-reminder-preview > span {
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.weekly-reminder-preview > strong {
  display: block;
  margin-top: 4px;
  font-size: 18px;
}

.weekly-reminder-preview p {
  margin: 6px 0 12px;
  color: var(--muted);
  font-size: 13px;
}

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

.weekly-preview-list div {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
}

.weekly-preview-list b {
  display: inline-block;
  margin-bottom: 4px;
  color: var(--accent);
  font-size: 11px;
  text-transform: uppercase;
}

.weekly-preview-list strong,
.weekly-preview-list span {
  display: block;
}

.weekly-preview-list span {
  color: var(--muted);
  font-size: 13px;
}

.list-limit-note {
  border: 1px solid rgba(18, 106, 90, 0.18);
  border-radius: 8px;
  padding: 12px 14px;
  background: var(--surface-accent);
}

.list-limit-note strong,
.list-limit-note small {
  display: block;
}

.list-limit-note strong {
  color: var(--ink);
}

.list-limit-note small {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.4;
}

.weekly-reminder-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
}

.weekly-reminder-options legend {
  padding: 0 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.weekly-reminder-options label {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: 8px;
}

.weekly-reminder-options input {
  width: auto;
  min-height: 0;
}

.weekly-reminder-options span {
  color: var(--ink);
  text-transform: none;
}

.settings-advanced {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--popup);
  overflow: hidden;
}

.settings-advanced summary {
  position: relative;
  cursor: pointer;
  list-style: none;
  padding: 14px;
  display: grid;
  gap: 4px;
}

.settings-advanced summary::-webkit-details-marker {
  display: none;
}

.settings-advanced summary::after {
  content: "+";
  position: absolute;
  right: 18px;
  margin-top: 7px;
  color: var(--accent);
  font-size: 20px;
  font-weight: 900;
}

.settings-advanced[open] summary::after {
  content: "-";
}

.settings-advanced summary span {
  color: var(--accent);
}

.settings-advanced summary strong {
  padding-right: 34px;
}

.settings-advanced-content {
  border-top: 1px solid var(--line);
  padding: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  background: var(--surface-3);
}

.settings-advanced:not([open]) .settings-advanced-content {
  display: none;
}

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

.modal-fields label.full {
  grid-column: 1 / -1;
}

.provider-create-field[hidden] {
  display: none;
}

.provider-create-field {
  margin-top: -4px;
}

.modal-fields span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.modal-fields input,
.modal-fields select,
.modal-fields textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--popup);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.auth-card input:focus,
.settings-form input:focus,
.modal-fields input:focus,
.modal-fields select:focus,
.modal-fields textarea:focus,
.worker-finder select:focus,
.worker-finder input:focus,
.source-helper-form input:focus {
  outline: none;
  border-color: rgba(15, 117, 107, 0.56);
  box-shadow: 0 0 0 3px rgba(15, 117, 107, 0.12);
}

.modal-fields input,
.modal-fields select {
  min-height: 42px;
}

.modal-fields input[readonly] {
  background: #f2f0ea;
  color: var(--muted);
}

.modal-fields textarea {
  min-height: 96px;
  padding: 10px;
  resize: vertical;
}

.modal-helper {
  grid-column: 1 / -1;
  border: 1px solid rgba(15, 117, 107, 0.2);
  border-radius: 10px;
  padding: 12px 14px;
  background: rgba(15, 117, 107, 0.08);
}

.modal-helper strong {
  display: block;
  margin-bottom: 4px;
}

.modal-helper p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.modal-actions {
  position: sticky;
  bottom: -18px;
  z-index: 2;
  margin: 16px -18px -18px;
  padding: 14px 18px 18px;
  border-top: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.84), var(--popup) 42%);
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

@media (max-width: 980px) {
  .app-shell {
    width: 100%;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr);
    background: transparent;
  }

  .workspace,
  .sidebar {
    min-width: 0;
    max-width: 100%;
  }

  .sidebar {
    position: static;
    height: auto;
  }

  .setup-guide {
    grid-template-columns: 1fr;
  }

  .setup-progress {
    width: 100%;
    min-width: 0;
    justify-self: stretch;
  }

  .tool-nav,
  .launch-brief,
  .quick-actions,
  .metric-grid,
  .property-command-grid,
  .worker-portal-summary,
  .worker-handoff-grid,
  .calendar-agenda,
  .dashboard-grid,
  .expense-overview,
  .first-home-focus,
  .finish-setup-checklist,
  .setup-guide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    display: grid;
  }

  .setup-guide-copy {
    grid-column: 1 / -1;
  }

  .launch-brief-copy {
    grid-column: 1 / -1;
  }

  .launch-brief-grid {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .worker-portal-summary-copy {
    grid-column: 1 / -1;
  }

  .worker-portal-summary-grid {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  body.onboarding-mode .setup-progress-rail,
  .setup-stage-preview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .setup-quantity-row {
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(86px, 0.5fr));
  }

  .setup-quantity-link {
    grid-column: 1 / -1;
  }

  .today-service-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .today-service-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: stretch;
  }

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

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

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

@media (max-width: 720px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
  }

  .workspace,
  .sidebar {
    padding: 12px;
  }

  .sidebar {
    position: sticky;
    top: 0;
    z-index: 25;
    gap: 12px;
    padding: 10px 12px 8px;
    min-height: auto;
    box-shadow: 0 12px 28px rgba(9, 35, 31, 0.18);
  }

  .brand {
    padding-bottom: 2px;
    gap: 9px;
  }

  .brand-mark {
    width: 40px;
    height: 40px;
  }

  .brand h1 {
    font-size: 18px;
  }

  .brand p {
    display: none;
  }

  .tool-nav {
    display: flex;
    gap: 8px;
    margin: 0 -12px;
    padding: 0 12px 6px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 12px;
    padding-bottom: 4px;
    scrollbar-width: thin;
  }

  .nav-item {
    min-width: 112px;
    min-height: 44px;
    padding: 9px 10px;
    scroll-snap-align: start;
    align-content: center;
  }

  .nav-item:hover {
    transform: none;
  }

  .nav-item small {
    display: none;
  }

  .sync-card,
  .side-link {
    display: none;
  }

  .top-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .topbar {
    justify-content: stretch;
    align-items: stretch;
    padding: 14px;
    margin-bottom: 10px;
  }

  .topbar > div:first-child {
    min-width: 0;
  }

  .topbar h2 {
    font-size: 27px;
  }

  .app-clock {
    font-size: 12px;
  }

  .top-actions .primary-button,
  .top-actions .ghost-button {
    min-width: 0;
    justify-content: center;
    padding-inline: 8px;
  }

  .top-actions {
    display: none;
  }

  .device-prompt,
  .sync-banner,
  .paused-access-banner {
    display: grid;
    grid-template-columns: 1fr;
    padding: 12px;
    gap: 10px;
  }

  .device-prompt-actions {
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }

  .device-prompt-actions button,
  button,
  .primary-button,
  .ghost-button,
  .mini-button,
  .tool-tab,
  .today-service-actions button,
  .readiness-card-actions button,
  .work-log-card-actions button,
  input,
  select,
  textarea {
    min-height: 46px;
  }

  .topbar,
  .launch-brief,
  .launch-brief-grid,
  .sync-banner,
  .home-filter-bar,
  .provider-card-clean,
  .provider-card-top,
  .provider-contact-grid,
  .provider-recurring-summary,
  .provider-rate-card,
  .provider-rate-controls,
  .provider-action-panel,
  .expense-entry-grid,
  .expense-overview,
  .readiness-workbench-head,
  .readiness-summary-grid,
  .readiness-bucket-grid,
  .readiness-action-card,
  .today-services-head,
  .today-services-stats,
  .today-service-card,
  .source-helper,
  .worker-setup-card,
  .worker-setup-fields,
  .worker-finder,
  .worker-finder-controls,
  .property-command-grid,
  .property-command-head,
  .command-stat-grid,
  .command-section.split,
  .ops-calendar-head,
  .calendar-agenda,
  .multi-property-panel,
  .multi-property-controls,
  .photo-request-item,
  .readiness-meter-head,
  .between-stay-task-list label,
  .calendar-import-card,
  .calendar-import-guide,
  .calendar-import-summary,
  .calendar-import-controls,
  .dashboard-fast-start,
  .fast-fields,
  .launch-card-head,
  .launch-action-plan,
  .launch-check-grid,
  .settings-health-head,
  .settings-health-grid,
  .time-travel-panel,
  .time-travel-actions,
  .settings-form,
  .theme-card,
  .theme-palette-grid,
  .theme-actions,
  .next-action-strip,
  .first-home-focus,
  .first-home-stats,
  .first-home-actions,
  .finish-setup-checklist,
  .finish-setup-list,
  .worker-portal-summary,
  .worker-portal-summary-grid,
  .worker-handoff-grid,
  .service-proof-controls,
  .service-proof-picture-row,
  .quick-actions,
  .metric-grid,
  .dashboard-grid,
  .setup-guide,
  .setup-video-head,
  .setup-video-grid,
  .setup-wizard-fields,
  .setup-stage-fields,
  .setup-wizard-actions,
  .starter-preview-head,
  .starter-preview-groups,
  .starter-editor-head,
  .starter-item-row,
  .setup-progress-rail,
  .setup-steps,
  .modal-fields {
    display: grid;
    grid-template-columns: 1fr;
  }

  .setup-next-step {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .first-home-copy,
  .first-home-actions {
    grid-column: auto;
    grid-row: auto;
  }

  .setup-next-step .primary-button {
    width: 100%;
  }

  .property-snapshot-card,
  .property-year-grid {
    grid-template-columns: 1fr;
  }

  .property-snapshot-image {
    min-height: 170px;
  }

  .worker-step-strip,
  .worker-simple-actions,
  .worker-quick-update {
    display: grid;
    grid-template-columns: 1fr;
  }

  .worker-mode .sidebar {
    padding: 12px 16px;
    gap: 0;
    min-height: auto;
    height: auto;
  }

  .worker-mode .app-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .worker-mode .brand {
    padding: 0;
  }

  .worker-mode .brand-mark {
    width: 42px;
    height: 42px;
  }

  .worker-mode .brand h1 {
    font-size: 20px;
  }

  .worker-mode .tool-nav,
  .worker-mode .sync-banner {
    display: none;
  }

  .worker-mode .workspace {
    padding: 10px 16px 18px;
  }

  .worker-mode .topbar {
    display: none;
  }

  .worker-mode .topbar h2 {
    font-size: 25px;
  }

  .worker-mode .app-clock {
    font-size: 12px;
  }

  .worker-mode .panel {
    padding: 12px;
  }

  .worker-mode .panel-header {
    margin-bottom: 10px;
    padding-bottom: 8px;
  }

  .worker-mode .panel-header h3 {
    font-size: 22px;
  }

  .worker-mode .panel-note {
    display: none;
  }

  .host-review-head,
  .host-review-list {
    display: grid;
    grid-template-columns: 1fr;
  }

  .host-review-head .ghost-button {
    width: 100%;
  }

  .today-services-panel {
    padding: 12px;
  }

  .today-services-head h3 {
    font-size: 21px;
  }

  .today-service-meta {
    min-width: 0;
    text-align: left;
  }

  .today-service-controls,
  .today-service-notes {
    grid-template-columns: 1fr;
  }

  .today-service-cost small {
    max-width: none;
  }

  .today-service-weather small {
    max-width: none;
  }

  .today-service-actions,
  .today-service-actions button {
    width: 100%;
    padding-top: 0;
  }

  body:not(.worker-mode) .today-service-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  body:not(.worker-mode) .today-service-actions button {
    min-width: 0;
    width: auto;
    padding-inline: 6px;
    font-size: 12px;
  }

  .worker-task-card {
    padding: 13px;
    gap: 10px;
  }

  .worker-task-hero strong {
    font-size: 22px;
  }

  .worker-mode .worker-step-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .worker-mode .worker-step-strip div {
    min-height: 43px;
    padding: 7px 5px;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    text-align: center;
  }

  .worker-mode .worker-step-strip b {
    width: 22px;
    height: 22px;
  }

  .worker-mode .worker-step-strip span {
    font-size: 10px;
    line-height: 1.05;
  }

  .worker-mode .worker-simple-actions {
    gap: 7px;
  }

  .worker-mode .worker-simple-actions span {
    text-align: center;
  }

  .worker-mode .worker-stay-alert,
  .worker-mode .worker-location-card,
  .worker-mode .worker-note-box,
  .worker-mode .worker-shopping-list {
    padding: 9px 10px;
  }

  .worker-mode .worker-shopping-list ul {
    gap: 4px;
  }

  .worker-mode .photo-request-grid {
    gap: 8px;
  }

  .worker-mode .photo-request-item {
    gap: 8px;
  }

  .worker-mode .photo-request-item .mini-button,
  .worker-mode .photo-request-item button {
    width: 100%;
    min-height: 44px;
    text-align: center;
  }

  .worker-finish-button,
  .worker-task-actions,
  .worker-task-actions button,
  .worker-quick-update button {
    width: 100%;
  }

  .worker-mode .worker-task-actions {
    position: sticky;
    bottom: 8px;
    z-index: 6;
    padding: 8px;
    border: 1px solid rgba(0, 124, 98, 0.18);
    border-radius: 8px;
    background: rgba(255, 253, 250, 0.94);
    box-shadow: 0 10px 24px rgba(18, 46, 37, 0.14);
  }

  .daily-mode #quickExpenseForm,
  .daily-mode #quickExpenseForm .fast-fields {
    grid-template-columns: 1fr;
  }

  .record-item {
    display: grid;
  }

  .record-actions {
    max-width: none;
    justify-content: flex-start;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .record-actions .mini-button,
  .record-actions button {
    width: 100%;
    min-width: 0;
  }

  .empty-record-actions {
    width: 100%;
    display: grid;
  }

  .empty-record-actions .mini-button {
    width: 100%;
  }

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

  .list-section-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .list-section-heading small {
    text-align: left;
  }

  .home-filter-options {
    justify-content: stretch;
  }

  .home-filter-chip {
    flex: 1 1 auto;
  }

  .ops-calendar-grid {
    gap: 4px;
  }

  .calendar-day {
    min-height: 72px;
    padding: 6px;
  }

  .calendar-day-list {
    display: none;
  }

  .settings-form {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .settings-form label,
  .settings-form span,
  .settings-form input,
  .settings-form select {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .settings-hub,
  .settings-tips-panel,
  .trust-card,
  .launch-action-plan,
  .settings-shortcuts {
    grid-template-columns: 1fr;
  }

  .multi-home-heavy .property-command-card .command-section,
  .multi-home-heavy .property-command-card .command-actions {
    display: none;
  }

  .multi-home-heavy .property-command-card {
    padding: 12px;
  }

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

  .panel-actions {
    width: 100%;
    justify-content: stretch;
  }

  .panel-actions button {
    flex: 1;
  }

  .setup-guide-copy {
    grid-column: auto;
  }

  .setup-arrow {
    display: none;
  }

  .setup-wizard-actions {
    align-items: stretch;
  }

  body.onboarding-mode .sidebar {
    align-items: stretch;
    flex-direction: column;
  }

  body.onboarding-mode .setup-progress-rail,
  .setup-stage-preview,
  .setup-wizard-fields.compact {
    grid-template-columns: 1fr;
  }

  .setup-quantity-row {
    grid-template-columns: 1fr;
  }

  .setup-quantity-link {
    grid-column: auto;
  }

  .top-actions {
    width: 100%;
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: stretch;
  }

  .top-actions button {
    min-width: 0;
    width: 100%;
    padding-inline: 10px;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .setup-video {
    align-items: flex-start;
  }

  .quick-actions button,
  .metric-card,
  .dashboard-card {
    min-width: 0;
  }

  .modal-fields label.full {
    grid-column: auto;
  }

  .modal-backdrop {
    place-items: stretch;
    padding: 0;
  }

  .modal {
    width: 100%;
    min-height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
    border-inline: 0;
  }

  .settings-form .full {
    grid-column: auto;
  }

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

  .launch-brief {
    padding: 13px;
    gap: 12px;
  }

  .launch-brief-copy strong {
    font-size: 24px;
  }

  .launch-brief-grid button {
    min-height: 112px;
  }
}

@media (max-width: 460px) {
  .app-shell {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    max-width: 100%;
  }

  .workspace,
  .panel,
  .settings-hub,
  .trust-card,
  .theme-card,
  .billing-card,
  .settings-form {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .tool-nav,
  .launch-brief-grid,
  .quick-actions,
  .tip-toggle-grid {
    grid-template-columns: 1fr;
  }

  .top-actions {
    display: none;
  }

  .topbar {
    align-items: stretch;
  }

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

  .host-retention-grid {
    grid-template-columns: 1fr;
  }

  .host-demo-guide,
  .host-demo-steps {
    grid-template-columns: 1fr;
  }

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

  .device-prompt-actions,
  .record-actions {
    grid-template-columns: 1fr;
  }

  .top-actions .primary-button,
  .top-actions .ghost-button {
    justify-content: center;
  }
}

/* Beta mobile fit pass */
@media (max-width: 560px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  body:not(.worker-mode) .workspace,
  .app-shell,
  .workspace,
  .topbar,
  .panel,
  .metric-card,
  .dashboard-card,
  .dashboard-fast-start,
  .daily-retention-panel,
  .ops-calendar-panel {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .workspace {
    overflow-x: hidden;
  }

  body:not(.worker-mode) .workspace > *,
  .daily-retention-panel,
  .dashboard-fast-start,
  .ops-calendar-panel,
  .topbar {
    width: min(100%, calc(100vw - 20px));
    justify-self: center;
  }

  .topbar,
  .dashboard-fast-start,
  .daily-retention-panel,
  .ops-calendar-panel {
    padding-inline: 14px;
  }

  .topbar h2,
  .daily-loop-copy strong,
  .launch-brief-copy strong {
    font-size: clamp(27px, 9vw, 34px);
    line-height: 1.04;
  }

  .metric-grid,
  .dashboard-grid,
  .quick-actions,
  .finish-setup-list,
  .daily-loop-grid,
  .daily-loop-digest,
  .daily-loop-alerts,
  .host-retention-grid,
  .host-demo-steps {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .home-filter-bar,
  .panel-actions,
  .record-actions,
  .device-prompt-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .daily-loop-card,
  .launch-brief,
  .launch-brief,
  .host-demo-guide {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .launch-brief,
  .launch-brief-copy,
  .launch-brief-grid {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .launch-brief-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .launch-brief-grid button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .daily-loop-copy,
  .daily-loop-copy strong,
  .daily-loop-copy p,
  .launch-brief-copy strong,
  .launch-brief-copy p {
    max-width: 100%;
    min-width: 0;
  }

  .home-filter-chip,
  .primary-button,
  .secondary-button,
  .ghost-button,
  .panel-actions button {
    width: 100%;
    min-width: 0;
    white-space: normal;
  }

  #launchBrief.launch-brief {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    min-width: 0 !important;
    margin-inline: auto;
  }

  #launchBrief .launch-brief-copy,
  #launchBrief .launch-brief-grid,
  #launchBrief .launch-brief-grid button {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #launchBrief .launch-brief-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #launchBrief .launch-brief-copy strong {
    max-width: none !important;
    font-size: 25px !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
  }
}
