:root {
  --navy: #0c2340;
  --navy-2: #123a63;
  --blue: #1976d2;
  --teal: #00a7b5;
  --green: #19a974;
  --orange: #f47b20;
  --gold: #f3b61f;
  --purple: #7754d9;
  --ink: #102033;
  --muted: #60728a;
  --line: #d9e6f2;
  --soft: #f4f8fc;
  --card: rgba(255,255,255,0.94);
  --danger: #d33f49;
  --success: #168e58;
  --shadow: 0 18px 45px rgba(12, 35, 64, .12);
  --radius: 24px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: #f7fbff; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at top left, rgba(0,167,181,.18), transparent 32rem),
    radial-gradient(circle at top right, rgba(25,118,210,.14), transparent 28rem),
    linear-gradient(180deg, #f7fbff 0%, #eef6fd 100%);
}

button, input, select, textarea { font: inherit; }
button { border: 0; cursor: pointer; }
a { color: inherit; }

.app-shell {
  width: 100%;
  max-width: 560px;
  min-height: 100vh;
  margin: 0 auto;
  padding: env(safe-area-inset-top) 14px calc(24px + env(safe-area-inset-bottom));
}

.screen {
  min-height: 100vh;
  padding: 18px 0 28px;
  animation: rise .22s ease both;
}

@keyframes rise {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.logo-hero {
  display: grid;
  place-items: center;
  padding: 14px 0 6px;
}
.logo-hero img { width: min(290px, 82vw); height: auto; display: block; }
.logo-small { width: 50px; height: 50px; border-radius: 16px; object-fit: cover; box-shadow: 0 10px 24px rgba(12,35,64,.13); }

.card {
  background: var(--card);
  border: 1px solid rgba(217,230,242,.9);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px;
  backdrop-filter: blur(10px);
}

.stack { display: grid; gap: 14px; }
.tight { display: grid; gap: 8px; }
.row { display: flex; align-items: center; gap: 10px; }
.row.between { justify-content: space-between; }
.row.wrap { flex-wrap: wrap; }
.grow { flex: 1; }
.center { text-align: center; }

h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(30px, 9vw, 44px); line-height: .98; letter-spacing: -.05em; color: var(--navy); }
h2 { font-size: 24px; line-height: 1.05; letter-spacing: -.03em; color: var(--navy); }
h3 { font-size: 16px; line-height: 1.15; color: var(--navy); }
p { color: var(--muted); line-height: 1.45; }
.subtle { color: var(--muted); font-size: 13px; }
.micro { color: var(--muted); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; font-weight: 800; }

.field { display: grid; gap: 7px; }
label { font-size: 12px; font-weight: 800; color: var(--navy); letter-spacing: .02em; }
input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 13px 14px;
  background: #fff;
  color: var(--ink);
  outline: none;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
}
textarea { min-height: 104px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: rgba(25,118,210,.65); box-shadow: 0 0 0 4px rgba(25,118,210,.1); }

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

.btn {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 15px;
  border-radius: 17px;
  font-weight: 900;
  color: white;
  background: linear-gradient(135deg, var(--navy), var(--blue));
  box-shadow: 0 12px 24px rgba(25,118,210,.22);
  transition: transform .16s ease, filter .16s ease;
}
.btn:active { transform: scale(.98); }
.btn.secondary { color: var(--navy); background: #e9f4ff; box-shadow: none; }
.btn.ghost { color: var(--navy); background: transparent; box-shadow: none; border: 1px solid var(--line); }
.btn.danger { background: linear-gradient(135deg, #b72a36, var(--danger)); }
.btn.full { width: 100%; }
.btn.small { min-height: 38px; padding: 8px 11px; border-radius: 13px; font-size: 12px; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  padding: 10px 0 12px;
  background: linear-gradient(180deg, rgba(247,251,255,.98) 0%, rgba(247,251,255,.86) 78%, transparent 100%);
  backdrop-filter: blur(8px);
}
.breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: var(--muted); font-size: 12px; font-weight: 800; }
.breadcrumb span { color: var(--navy); }

.topbar-row {
  gap: 10px;
  align-items: center;
}
.topbar-main {
  min-width: 0;
}
.topbar-title {
  min-width: 0;
}
.home-button {
  flex: 0 0 auto;
  min-height: 42px;
  border: 0;
  border-radius: 999px;
  padding: 9px 13px;
  color: #fff;
  background: linear-gradient(135deg, var(--navy), #1976d2);
  box-shadow: 0 10px 22px rgba(12,35,64,.16);
  font-size: 13px;
  font-weight: 1000;
  letter-spacing: -.01em;
}
.home-button:active { transform: scale(.98); }
@media (max-width: 380px) {
  .home-button {
    min-height: 38px;
    padding: 8px 10px;
    font-size: 12px;
  }
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--navy);
  background: #edf6ff;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.pill.favorite { background: #fff4cf; color: #765407; }
.pill.ready { background: rgba(0,167,181,.13); color: #007782; }
.pill.leased { background: rgba(25,169,116,.13); color: #137b56; }
.pill.occupied { background: rgba(25,118,210,.13); color: #175a9c; }
.pill.maintenance { background: rgba(244,123,32,.16); color: #a74b0b; }
.pill.vacant { background: rgba(243,182,31,.2); color: #8f6502; }
.pill.turnover { background: rgba(119,84,217,.16); color: #5439a5; }

.list { display: grid; gap: 10px; }
.item {
  display: grid;
  gap: 6px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(12,35,64,.06);
}
.item.pressable { cursor: pointer; transition: transform .16s ease, border-color .16s ease; }
.item.pressable:active { transform: scale(.99); }
.item.pressable:hover { border-color: rgba(25,118,210,.45); }

.floor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.floor-tile, .unit-tile {
  min-height: 92px;
  border-radius: 22px;
  padding: 14px;
  background: linear-gradient(180deg, #fff, #f9fcff);
  border: 1px solid var(--line);
  text-align: left;
  display: grid;
  align-content: space-between;
  gap: 10px;
  color: var(--navy);
  box-shadow: 0 10px 24px rgba(12,35,64,.07);
}
.floor-tile strong, .unit-tile strong { font-size: 22px; letter-spacing: -.04em; }
.unit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.unit-tile { min-height: 104px; }

.command-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.action-card {
  min-height: 102px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--line);
  padding: 14px;
  text-align: left;
  display: grid;
  gap: 8px;
  box-shadow: 0 10px 24px rgba(12,35,64,.06);
  color: var(--navy);
}
.action-icon {
  width: 36px;
  height: 36px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 18px;
  background: linear-gradient(135deg, var(--navy), var(--blue));
}

.lifecycle {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.lifecycle button {
  min-height: 40px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--line);
  font-size: 11px;
  font-weight: 900;
  color: var(--navy);
}
.lifecycle button.active { color: white; border-color: transparent; }
.lifecycle button[data-status="READY"].active { background: var(--teal); }
.lifecycle button[data-status="LEASED"].active { background: var(--green); }
.lifecycle button[data-status="OCCUPIED"].active { background: var(--blue); }
.lifecycle button[data-status="MAINTENANCE"].active { background: var(--orange); }
.lifecycle button[data-status="VACANT"].active { background: var(--gold); color: #573b00; }
.lifecycle button[data-status="TURNOVER"].active { background: var(--purple); }

.kpi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.kpi {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px;
}
.kpi strong { display: block; font-size: 18px; color: var(--navy); }
.kpi span { display: block; font-size: 11px; color: var(--muted); font-weight: 800; text-transform: uppercase; }

.drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: rgba(7,20,36,.38);
  display: grid;
  align-items: end;
  padding: 14px;
}
.drawer {
  width: min(560px, 100%);
  max-height: 88vh;
  margin: 0 auto;
  overflow: auto;
  background: #fff;
  border-radius: 28px 28px 18px 18px;
  box-shadow: 0 -18px 50px rgba(12,35,64,.28);
  padding: 18px;
  animation: drawer .2s ease both;
}
@keyframes drawer {
  from { transform: translateY(30px); opacity: .7; }
  to { transform: translateY(0); opacity: 1; }
}

.timeline { display: grid; gap: 10px; }
.timeline-entry {
  position: relative;
  display: grid;
  gap: 4px;
  padding: 12px 12px 12px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fbfdff;
}
.timeline-entry::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 12px;
  bottom: 12px;
  width: 4px;
  border-radius: 99px;
  background: linear-gradient(180deg, var(--teal), var(--blue));
}

.empty {
  border: 1px dashed #bed1e6;
  border-radius: 20px;
  padding: 18px;
  text-align: center;
  color: var(--muted);
  background: rgba(255,255,255,.6);
}

.toast {
  position: fixed;
  z-index: 200;
  left: 50%;
  bottom: calc(20px + env(safe-area-inset-bottom));
  transform: translateX(-50%) translateY(20px);
  min-width: min(90vw, 360px);
  max-width: 90vw;
  padding: 12px 14px;
  border-radius: 18px;
  background: var(--navy);
  color: white;
  font-weight: 800;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  box-shadow: 0 14px 34px rgba(12,35,64,.3);
  transition: opacity .2s ease, transform .2s ease;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

.skeleton {
  height: 92px;
  border-radius: 20px;
  background: linear-gradient(90deg, #eaf2fb, #f8fbff, #eaf2fb);
  background-size: 200% 100%;
  animation: shimmer 1.1s infinite linear;
}
@keyframes shimmer { to { background-position: -200% 0; } }

@media (min-width: 760px) {
  .app-shell { max-width: 720px; }
  .floor-grid, .unit-grid, .command-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.span-2 { grid-column: 1 / -1; }
.compact { gap: 8px; }
.mini-space { margin-top: 10px; }
.subcard {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #f8fbff;
  padding: 14px;
}

.unit-tile.has-wo {
  border-color: rgba(244,123,32,.42);
  box-shadow: 0 12px 28px rgba(244,123,32,.12);
}
.wo-strip {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  border-radius: 18px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--navy);
}
.wo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  border-radius: 999px;
  padding: 6px 9px;
  font-size: 11px;
  font-weight: 950;
  line-height: 1.1;
  color: var(--navy);
  background: #edf6ff;
  border: 1px solid rgba(217,230,242,.9);
}
.wo-clear { background: rgba(25,169,116,.12); color: #10784f; border-color: rgba(25,169,116,.22); }
.wo-pending, .wo-2-active-wos, .wo-3-active-wos, .wo-4-active-wos { background: rgba(244,123,32,.14); color: #994504; border-color: rgba(244,123,32,.28); }
.wo-vendor-accepted { background: rgba(25,118,210,.13); color: #155a9d; border-color: rgba(25,118,210,.28); }
.wo-in-progress { background: rgba(0,167,181,.13); color: #007b86; border-color: rgba(0,167,181,.25); }
.wo-rm-self-resolved { background: rgba(119,84,217,.14); color: #563aa7; border-color: rgba(119,84,217,.24); }
.wo-complete-po-approval-pending { background: rgba(243,182,31,.2); color: #7c5700; border-color: rgba(243,182,31,.34); }
.wo-po-released { background: rgba(25,169,116,.16); color: #137b56; border-color: rgba(25,169,116,.3); }

.issue-section {
  display: grid;
  gap: 10px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fbfdff;
}
.section-icon {
  width: 32px;
  height: 32px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #edf6ff;
}
.bubble-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bubble-grid input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.issue-chip {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--navy);
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 6px 16px rgba(12,35,64,.06);
  cursor: pointer;
  user-select: none;
}
.bubble-grid input[type="checkbox"]:checked + .issue-chip {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--navy), var(--blue));
  box-shadow: 0 12px 24px rgba(25,118,210,.2);
}

.wo-card {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 18px;
  padding: 12px;
  box-shadow: 0 8px 18px rgba(12,35,64,.06);
}
.po-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  border-radius: 14px;
  background: #f4f8fc;
  padding: 10px;
  font-size: 12px;
  color: var(--navy);
}

.structure-floor {
  display: grid;
  gap: 10px;
  padding: 13px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: #fbfdff;
}
.unit-edit-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.unit-edit-row .row { flex-shrink: 0; }

details summary {
  cursor: pointer;
  color: var(--navy);
  font-weight: 900;
  padding: 8px 0;
}

@media (max-width: 420px) {
  .unit-edit-row { align-items: stretch; flex-direction: column; }
  .unit-edit-row .row { justify-content: flex-end; }
}

/* v2.2: Entire building card is now a reliable tap target. */
.building-card {
  cursor: pointer;
  position: relative;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.building-card:hover,
.building-card:focus-visible {
  border-color: rgba(25,118,210,.55);
  box-shadow: 0 12px 28px rgba(12,35,64,.1);
  outline: none;
}
.building-card:active { transform: scale(.99); }
.building-card .btn { position: relative; z-index: 2; }
.building-open-area {
  flex: 1;
  min-width: 0;
  padding: 0;
  color: inherit;
  text-align: left;
  display: grid;
  gap: 2px;
}
.building-open-area h3,
.building-open-area p { pointer-events: none; }

/* v2.3: Floor and unit tiles use direct JS listeners instead of inline click handlers. */
.floor-tile, .unit-tile { touch-action: manipulation; cursor: pointer; }
.floor-tile:active, .unit-tile:active { transform: scale(.99); }

/* v2.4: Building renumbering and direct unit editing. */
.helper {
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.35;
  color: var(--muted);
}
.check-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  color: var(--navy);
}
.check-row input {
  width: 20px;
  height: 20px;
  margin-top: 1px;
  flex: 0 0 auto;
}
.check-row span { display: grid; gap: 3px; }
.check-row small { color: var(--muted); line-height: 1.35; font-weight: 600; }
.unit-edit-controls {
  display: grid;
  grid-template-columns: 1.15fr .72fr auto auto;
  gap: 8px;
  align-items: center;
}
.mini-input {
  min-width: 0;
  min-height: 38px;
  border-radius: 13px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 800;
}
.floor-mini { max-width: 78px; }
@media (max-width: 420px) {
  .unit-edit-controls {
    grid-template-columns: 1fr 78px;
  }
  .unit-edit-controls .btn {
    width: 100%;
  }
}

/* v2.6 expanded work-order rooms */
.po-visible-panel {
  border-color: rgba(25,118,210,.18);
  background: linear-gradient(180deg, #f8fbff, #ffffff);
}
.room-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #f8fbff;
}
.work-location-list {
  display: grid;
  gap: 12px;
}
.work-location {
  padding: 0;
  overflow: hidden;
}
.location-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 13px;
  cursor: pointer;
  list-style: none;
}
.location-summary::-webkit-details-marker { display: none; }
.location-summary::after {
  content: "▾";
  color: var(--blue);
  font-weight: 950;
  transition: transform .16s ease;
}
details[open] > .location-summary::after { transform: rotate(180deg); }
.room-remove-btn {
  margin: 0 13px 10px;
  width: calc(100% - 26px);
}
.issue-category {
  display: grid;
  gap: 8px;
  padding: 12px 13px 14px;
  border-top: 1px solid rgba(217,230,242,.8);
}
.issue-category .micro {
  white-space: nowrap;
}
.po-line-strong {
  border: 1px solid rgba(25,118,210,.16);
  background: linear-gradient(135deg, rgba(25,118,210,.08), rgba(0,167,181,.08));
  font-weight: 800;
}
@media (max-width: 520px) {
  .location-summary { align-items: flex-start; }
  .issue-chip { width: 100%; justify-content: flex-start; border-radius: 16px; }
  .room-tools .btn { flex: 1 1 calc(50% - 8px); }
}

/* v2.7 remembered emails + 24-hour on-call notification board */
.notification-board-btn {
  margin-top: 2px;
  background: linear-gradient(135deg, var(--navy), #1976d2);
}
.notification-intro {
  border-color: rgba(0, 167, 181, .18);
  background: linear-gradient(180deg, #f8fdff, #ffffff);
}
.notification-list {
  display: grid;
  gap: 12px;
}
.notification-card {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(12,35,64,.06);
}
.notification-card h3 {
  margin: 0;
  font-size: 16px;
}
.notification-card p {
  margin: 0;
  line-height: 1.4;
}
.compact-field {
  margin-top: -4px;
}
datalist {
  color: var(--navy);
}
.field select[data-email-autofill] {
  border-style: dashed;
  background: #fbfdff;
}
@media (max-width: 520px) {
  .notification-card .row.between {
    align-items: flex-start;
  }
}

/* v2.9 phone-back and work-order layout polish */
.wo-create-panel {
  border: 1px solid rgba(25,118,210,.14);
  border-radius: 24px;
  padding: 14px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}
.work-location-list {
  scroll-margin-top: 12px;
}
.work-location:not([open]) .location-summary {
  border-bottom: 0;
}
.location-summary .subtle::after {
  content: " · tap to expand";
  color: var(--blue);
  font-weight: 800;
}
details[open] .location-summary .subtle::after {
  content: "";
}
@media (max-width: 520px) {
  .drawer {
    max-height: 92vh;
    padding: 14px;
  }
  .wo-create-panel {
    padding: 12px;
  }
}

.profile-snapshot { gap: 12px; }
.profile-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.detail-item {
  min-height: 70px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  overflow: hidden;
}
.detail-item.wide { grid-column: 1 / -1; }
.detail-item span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.detail-item strong {
  min-width: 0;
  color: var(--navy);
  font-size: 14px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.mini-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 24px;
  border-radius: 999px;
  padding: 5px 8px;
  background: #edf6ff;
  color: var(--navy);
  font-size: 11px;
  font-weight: 900;
}
.mini-status.verified { background: rgba(25,169,116,.13); color: #137b56; }
.mini-status.unverified { background: rgba(243,182,31,.2); color: #8f6502; }
.mini-status.expired, .mini-status.alert { background: rgba(211,63,73,.12); color: #a12b34; }
.mini-status.clear { background: #edf6ff; color: var(--navy); }

@media (max-width: 380px) {
  .profile-detail-grid { grid-template-columns: 1fr; }
}

/* v3.1 RM Repair Assist */
.repair-assist-panel {
  border: 1px solid rgba(0, 167, 181, .18);
  border-radius: 22px;
  padding: 13px;
  background: linear-gradient(180deg, #f7feff, #ffffff);
  box-shadow: 0 8px 22px rgba(12,35,64,.05);
}
.repair-assist-panel h3 { margin: 0; font-size: 17px; }
.assist-empty,
.assist-loading,
.assist-note {
  padding: 12px;
  border: 1px dashed rgba(25,118,210,.28);
  border-radius: 16px;
  background: #fbfdff;
  color: var(--muted);
  font-weight: 800;
}
.assist-report {
  padding-top: 4px;
}
.assist-warning {
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(211,63,73,.24);
  background: rgba(211,63,73,.08);
  color: #8f1f28;
}
.assist-warning ul,
.assist-box ul {
  margin: 8px 0 0;
  padding-left: 18px;
}
.assist-warning li,
.assist-box li {
  margin: 5px 0;
  line-height: 1.35;
}
.assist-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.assist-box {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.assist-box h4 {
  margin: 0 0 8px;
  color: var(--navy);
  font-size: 13px;
}
.assist-box p { margin: 0; color: var(--muted); font-weight: 800; }
.assist-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.assist-link {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 10px;
  border-radius: 999px;
  background: #edf6ff;
  color: var(--blue);
  font-weight: 950;
  text-decoration: none;
  border: 1px solid rgba(25,118,210,.18);
}
.pill.warn { background: rgba(244,123,32,.16); color: #994504; }
@media (max-width: 520px) {
  .repair-assist-panel .row.between { align-items: flex-start; }
  .repair-assist-panel .btn { width: 100%; }
  .assist-grid { grid-template-columns: 1fr; }
  .assist-link { width: 100%; justify-content: center; border-radius: 14px; }
}

/* v3.2 occupancy, cleaner WO review, PO cards, and vacant dashboard */
.building-snapshot {
  border-color: rgba(25,118,210,.16);
  background: linear-gradient(180deg, #ffffff, #f7fbff);
}
.occupancy-bar {
  height: 13px;
  overflow: hidden;
  border-radius: 999px;
  background: #e4eef8;
  border: 1px solid rgba(217,230,242,.9);
}
.occupancy-bar span {
  display: block;
  height: 100%;
  min-width: 6px;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--blue));
}
.kpi-grid.one { grid-template-columns: 1fr; }
.vacant-mode .card,
.vacant-dashboard {
  border-color: rgba(243,182,31,.28);
}
.vacant-hero {
  background: linear-gradient(180deg, #fffdf7, #ffffff);
}
.vacant-dashboard {
  background: linear-gradient(180deg, #fffdf7, #ffffff);
}
.selected-review-panel {
  border: 1px solid rgba(25,118,210,.18);
  border-radius: 22px;
  padding: 13px;
  background: #f8fbff;
}
.selected-review-list {
  display: grid;
  gap: 10px;
}
.selected-issue-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}
.resolution-toggle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.resolution-toggle label {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfdff;
  font-size: 12px;
  cursor: pointer;
}
.resolution-toggle input {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}
.vendor-request-panel {
  border: 1px solid rgba(244,123,32,.24);
  border-radius: 22px;
  padding: 13px;
  background: linear-gradient(180deg, #fffaf5, #ffffff);
}
.vendor-request-panel[hidden] { display: none; }
.split-record {
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}
.record-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.work-record {
  border-left: 5px solid var(--blue);
}
.po-record {
  border-left: 5px solid var(--gold);
  background: linear-gradient(180deg, #fffdf7, #fff);
}
.muted-record {
  opacity: .82;
  border-left-color: var(--line);
  background: #fbfdff;
}
.followup-buttons .btn {
  flex: 1 1 auto;
}
@media (max-width: 520px) {
  .resolution-toggle { grid-template-columns: 1fr; }
  .selected-issue-card { padding: 11px; }
  .record-card .row.between { align-items: flex-start; }
  .followup-buttons .btn { width: 100%; }
}

/* v3.4 clickable building counter cards */
.kpi-button {
  width: 100%;
  cursor: pointer;
  text-align: left;
  appearance: none;
  font: inherit;
  color: inherit;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.kpi-button em {
  display: block;
  margin-top: 6px;
  font-style: normal;
  color: var(--blue);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.kpi-button:hover, .kpi-button:focus-visible {
  border-color: rgba(25,118,210,.55);
  box-shadow: 0 10px 24px rgba(12,35,64,.08);
  outline: none;
}
.kpi-button:active { transform: scale(.985); }
.unit-tile .micro {
  overflow-wrap: anywhere;
}

/* v3.5 main building screen clarity */
.home-screen { gap: 12px; }
.compact-hero { padding: 14px; }
.compact-hero h2 { font-size: 26px; }
.home-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.building-list-card { padding: 14px; }
.property-list { gap: 12px; }
.building-card {
  padding: 16px;
  border-width: 2px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fcff 100%);
}
.building-card .row.between { align-items: flex-start; }
.property-name {
  font-size: clamp(24px, 7vw, 34px);
  line-height: .95;
  letter-spacing: -.045em;
  color: var(--navy);
}
.property-address {
  color: var(--ink);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.3;
}
.tap-hint {
  width: max-content;
  color: #145f9e;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: #eaf5ff;
  border: 1px solid #cfe8ff;
  border-radius: 999px;
  padding: 5px 9px;
}
.building-card .pill { font-size: 11px; padding: 5px 9px; min-height: 25px; }
.create-building-card { border-style: dashed; }

@media (max-width: 420px) {
  .home-actions { grid-template-columns: 1fr; }
  .compact-hero .row.between { align-items: flex-start; }
  .building-card .row.wrap .btn { flex: 1 1 auto; }
}

/* v3.6 curated Repair Assist + one-step vendor assignment */
.setup-details {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fbfdff;
  padding: 10px 12px;
}
.setup-details summary {
  cursor: pointer;
  color: var(--navy);
  font-weight: 950;
}
.vendor-one-step {
  border: 1px solid rgba(25,118,210,.16);
  border-radius: 18px;
  padding: 12px;
  background: #fbfdff;
}
.auto-contact-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.auto-contact-summary > div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 10px;
  background: #fff;
}
.auto-contact-summary span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.auto-contact-summary strong {
  display: block;
  margin-top: 4px;
  color: var(--navy);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.issue-guide-list {
  grid-column: 1 / -1;
}
.issue-guide-card {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(25,118,210,.14);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #f8fbff);
}
.issue-guide-card .assist-box {
  padding: 10px;
  background: #fff;
}
.issue-links {
  padding-top: 2px;
}
@media (max-width: 520px) {
  .auto-contact-summary { grid-template-columns: 1fr; }
}

/* v3.7 color-coded unit states, rented/move-in workflow */
.status-pill.ready, .status-ready { border-color: rgba(0,167,181,.34) !important; }
.status-pill.leased, .status-leased { border-color: rgba(25,169,116,.45) !important; }
.status-pill.occupied, .status-occupied { border-color: rgba(25,118,210,.32) !important; }
.status-pill.maintenance, .status-maintenance { border-color: rgba(244,123,32,.45) !important; }
.status-pill.vacant, .status-vacant { border-color: rgba(243,182,31,.48) !important; }
.status-pill.turnover, .status-turnover { border-color: rgba(119,84,217,.38) !important; }
.status-pill.problem, .status-problem { border-color: rgba(211,63,73,.52) !important; }

.unit-tile.status-leased {
  background: linear-gradient(180deg, rgba(25,169,116,.13), #ffffff 70%);
  border-color: rgba(25,169,116,.5);
  box-shadow: 0 14px 30px rgba(25,169,116,.16);
}
.unit-tile.status-vacant {
  background: linear-gradient(180deg, rgba(243,182,31,.18), #ffffff 72%);
  border-color: rgba(243,182,31,.48);
}
.unit-tile.status-maintenance,
.unit-tile.status-turnover {
  background: linear-gradient(180deg, rgba(244,123,32,.14), #ffffff 72%);
  border-color: rgba(244,123,32,.42);
}
.unit-tile.status-ready {
  background: linear-gradient(180deg, rgba(0,167,181,.12), #ffffff 72%);
  border-color: rgba(0,167,181,.38);
}
.unit-tile.problem-unit {
  background: linear-gradient(180deg, rgba(211,63,73,.16), #ffffff 72%);
  border-color: rgba(211,63,73,.55);
  box-shadow: 0 16px 34px rgba(211,63,73,.16);
}
.move-countdown {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(25,169,116,.12);
  color: #10784f;
  font-size: 11px;
  font-weight: 950;
}
.unit-hero.status-hero-leased,
.leased-hero,
.movein-dashboard {
  border-color: rgba(25,169,116,.42);
  background: linear-gradient(180deg, rgba(25,169,116,.10), #ffffff 66%);
}
.unit-hero.status-hero-problem {
  border-color: rgba(211,63,73,.50);
  background: linear-gradient(180deg, rgba(211,63,73,.12), #ffffff 70%);
}
.unit-hero.status-hero-maintenance,
.unit-hero.status-hero-turnover {
  border-color: rgba(244,123,32,.42);
  background: linear-gradient(180deg, rgba(244,123,32,.10), #ffffff 70%);
}
.unit-hero.status-hero-vacant {
  border-color: rgba(243,182,31,.5);
  background: linear-gradient(180deg, rgba(243,182,31,.14), #ffffff 70%);
}
.vacancy-state {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.vacancy-state.repair { background: rgba(244,123,32,.16); color: #994504; }
.vacancy-state.progress { background: rgba(25,118,210,.13); color: #155a9d; }
.vacancy-state.cleaning { background: rgba(119,84,217,.14); color: #563aa7; }
.vacancy-state.showing { background: rgba(0,167,181,.14); color: #007b86; }
.vacancy-state.ready { background: rgba(25,169,116,.15); color: #10784f; }
.vacancy-progress {
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: #e7eef6;
  border: 1px solid var(--line);
}
.vacancy-progress span { display: block; height: 100%; border-radius: inherit; }
.vacancy-progress span.repair { width: 18%; background: var(--orange); }
.vacancy-progress span.progress { width: 45%; background: var(--blue); }
.vacancy-progress span.cleaning { width: 62%; background: var(--purple); }
.vacancy-progress span.showing { width: 78%; background: var(--teal); }
.vacancy-progress span.ready { width: 100%; background: var(--green); }
.rented-cta { background: linear-gradient(135deg, var(--green), #0f8f5b); }
.movein-bar span { background: linear-gradient(90deg, var(--green), var(--teal)); }
.movein-inspection-list .issue-section { background: #ffffff; }
@media (max-width: 520px) {
  .movein-dashboard .row.wrap .btn,
  .vacant-dashboard .row.wrap .btn { width: 100%; }
}


/* v3.9 stability hotfix, showings, home countdowns, vendor dispatch notices */
.home-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.showings-main-btn { background: linear-gradient(135deg, var(--teal), var(--blue)); color: #fff; }
.home-feed-card { border-color: rgba(0,167,181,.18); background: linear-gradient(180deg, #ffffff, #f7fdff); }
.home-feed-list { display: grid; gap: 9px; }
.home-feed-item {
  width: 100%; min-height: 62px; padding: 12px; border-radius: 18px; border: 1px solid var(--line);
  background: #fff; color: var(--navy); text-align: left; display: grid; gap: 4px;
  box-shadow: 0 8px 20px rgba(12,35,64,.06);
}
.home-feed-item span { color: var(--muted); font-size: 10px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.home-feed-item strong { font-size: 15px; line-height: 1.15; }
.home-feed-item em { color: var(--muted); font-style: normal; font-size: 12px; font-weight: 800; overflow-wrap: anywhere; }
.home-feed-item.movein { border-left: 5px solid var(--green); }
.home-feed-item.showing { border-left: 5px solid var(--teal); }
.home-feed-item.vendor { border-left: 5px solid var(--orange); background: linear-gradient(180deg, #fffaf5, #fff); }
.compact-empty { padding: 12px; }

.showing-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.showing-category-card {
  min-height: 118px; border: 1px solid var(--line); border-radius: 22px; padding: 14px; background: #fff;
  color: var(--navy); display: grid; align-content: center; gap: 6px; text-align: left; box-shadow: 0 10px 24px rgba(12,35,64,.07);
}
.showing-category-card strong { font-size: 38px; line-height: .9; color: var(--teal); letter-spacing: -.05em; }
.showing-category-card em { font-style: normal; color: var(--muted); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.showing-unit-list { display: grid; gap: 10px; }
.showing-unit-card {
  display: grid; gap: 12px; border: 1px solid var(--line); border-radius: 20px; padding: 13px; background: #fff;
  box-shadow: 0 8px 20px rgba(12,35,64,.06);
}
.showing-unit-card h3 { font-size: 22px; letter-spacing: -.03em; }
.showing-actions .btn { flex: 1 1 auto; }
.showing-capture-panel { border-color: rgba(0,167,181,.2); background: linear-gradient(180deg, #f7feff, #fff); }
.feedback-chip-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.feedback-chip {
  min-height: 42px; padding: 9px 10px; border-radius: 15px; border: 1px solid var(--line); background: #fff;
  color: var(--navy); font-size: 12px; font-weight: 900; text-align: left;
}
.feedback-chip:active, .showing-category-card:active, .home-feed-item:active { transform: scale(.985); }

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

@media (max-width: 520px) {
  .home-actions { grid-template-columns: 1fr; }
  .showing-category-grid { grid-template-columns: 1fr 1fr; }
  .showing-actions .btn { width: 100%; }
  .feedback-chip-grid { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .showing-category-grid { grid-template-columns: 1fr; }
}

/* v3.9 leasing calendar + prospect follow-up */
.home-feed-item { padding: 0; overflow: hidden; }
.home-feed-main {
  width: 100%; border: 0; background: transparent; color: inherit; text-align: left; padding: 12px;
  display: grid; gap: 4px; font: inherit; border-radius: 18px;
}
.home-feed-main small { color: var(--muted); font-size: 11px; font-weight: 850; }
.mini-action-row { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 10px 10px; }
.btn.tiny { min-height: 30px; padding: 6px 9px; border-radius: 11px; font-size: 11px; flex: 1 1 auto; }
.showing-category-card small { font-size: 11px; color: var(--blue); font-weight: 950; text-transform: uppercase; }
.showing-subhead { margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .08em; }
.showing-unit-card.coming-soon { border-color: rgba(245,158,11,.28); background: linear-gradient(180deg, #fffaf0, #fff); }
.showing-unit-card.ready-now { border-color: rgba(22,163,74,.18); }
.other-units-panel { border: 1px dashed rgba(0,167,181,.28); border-radius: 18px; padding: 12px; background: rgba(0,167,181,.045); }
.other-units-panel h4 { margin: 0; font-size: 13px; letter-spacing: -.01em; }
.mini-list { display: grid; gap: 7px; }
.mini-unit-card {
  width: 100%; border: 1px solid var(--line); background: #fff; color: var(--navy); border-radius: 14px;
  padding: 9px 10px; display: grid; gap: 2px; text-align: left;
}
.mini-unit-card strong { font-size: 13px; }
.mini-unit-card span { color: var(--muted); font-size: 11px; font-weight: 800; }
.mini-unit-card.coming-soon { border-color: rgba(245,158,11,.32); background: #fffaf0; }
.start-showing-panel .detail-grid { margin-top: 2px; }
@media (max-width: 520px) { .mini-action-row .btn { width: auto; } }


/* v4.0 bedroom/unit-type confirmation */
.unit-hero-pills {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
.wo-badge.room-needed,
.pill.warning {
  background: #fff3cd;
  color: #7a4b00;
  border: 1px solid rgba(245, 158, 11, 0.35);
}
.wo-badge.room-confirmed,
.pill.room-confirmed {
  background: #e7f7ff;
  color: #075985;
  border: 1px solid rgba(14, 165, 233, 0.25);
}
.bedroom-prompt-backdrop {
  z-index: 80;
}
.bedroom-prompt {
  border-top: 6px solid #0ea5e9;
}
.bedroom-option-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.bedroom-option {
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  border-radius: 18px;
  padding: 16px 12px;
  min-height: 88px;
  text-align: left;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
}
.bedroom-option strong {
  display: block;
  color: #0c2340;
  font-size: 18px;
  margin-bottom: 6px;
}
.bedroom-option span {
  color: #64748b;
  font-size: 12px;
}
@media (max-width: 520px) {
  .unit-hero-pills { align-items: flex-start; }
  .bedroom-option-grid { grid-template-columns: 1fr; }
}

/* v4.1 vacant sub-status + vendor contact cleanup */
.status-pill.vacant-ready,
.status-vacant-ready,
.unit-tile.status-vacant-ready {
  border-color: rgba(0, 167, 181, .45) !important;
}
.unit-tile.status-vacant-ready {
  background: linear-gradient(180deg, #ecfeff, #ffffff);
}
.status-pill.vacant-needs-work,
.status-vacant-needs-work,
.unit-tile.status-vacant-needs-work {
  border-color: rgba(244, 123, 32, .45) !important;
}
.unit-tile.status-vacant-needs-work {
  background: linear-gradient(180deg, #fff7ed, #ffffff);
}
.status-pill.vacant-turnover,
.status-vacant-turnover,
.unit-tile.status-vacant-turnover {
  border-color: rgba(119, 84, 217, .38) !important;
}
.unit-tile.status-vacant-turnover {
  background: linear-gradient(180deg, #f4f0ff, #ffffff);
}
.status-pill.vacant-showing,
.status-vacant-showing,
.unit-tile.status-vacant-showing {
  border-color: rgba(25, 118, 210, .32) !important;
}
.unit-tile.status-vacant-showing {
  background: linear-gradient(180deg, #eff6ff, #ffffff);
}
.status-pill.vacant-application,
.status-vacant-application,
.unit-tile.status-vacant-application {
  border-color: rgba(245, 158, 11, .45) !important;
}
.unit-tile.status-vacant-application {
  background: linear-gradient(180deg, #fffbeb, #ffffff);
}
.status-pill.vacant-leased,
.status-vacant-leased,
.unit-tile.status-vacant-leased {
  border-color: rgba(25, 169, 116, .45) !important;
}
.unit-tile.status-vacant-leased {
  background: linear-gradient(180deg, #ecfdf5, #ffffff);
}
.vacancy-state.vacant-ready { background: #e0fbff; color: #007b86; }
.vacancy-state.vacant-needs-work { background: #fff1e7; color: #994504; }
.vacancy-state.vacant-turnover { background: #f1ecff; color: #563aa7; }
.vacancy-state.vacant-showing { background: #e8f1ff; color: #155a9d; }
.vacancy-state.vacant-application { background: #fff3cd; color: #7a4b00; }
.vacancy-state.vacant-leased { background: #e7f7ef; color: #137b56; }
.vacancy-progress .vacant-ready { background: linear-gradient(90deg, #00a7b5, #22c55e); width: 76%; }
.vacancy-progress .vacant-needs-work { background: linear-gradient(90deg, #f97316, #f59e0b); width: 24%; }
.vacancy-progress .vacant-turnover { background: linear-gradient(90deg, #7754d9, #f59e0b); width: 44%; }
.vacancy-progress .vacant-showing { background: linear-gradient(90deg, #1976d2, #00a7b5); width: 82%; }
.vacancy-progress .vacant-application { background: linear-gradient(90deg, #f59e0b, #22c55e); width: 90%; }
.vacancy-progress .vacant-leased { background: linear-gradient(90deg, #19a974, #10b981); width: 100%; }
.wo-vendor-contact-needed { background: rgba(245, 158, 11, .14); color: #8a5a00; border-color: rgba(245, 158, 11, .3); }
.wo-pending-vendor-confirmation { background: rgba(25, 118, 210, .13); color: #155a9d; border-color: rgba(25, 118, 210, .28); }
.wo-follow-up-needed { background: rgba(211, 63, 73, .12); color: #9c2530; border-color: rgba(211, 63, 73, .3); }


/* v4.4 mobile fit + showing state cleanup */
.unit-grid,
.floor-grid,
.command-grid,
.showing-unit-list,
.home-feed-list,
.mini-list { min-width: 0; }

.unit-tile,
.floor-tile,
.showing-unit-card,
.home-feed-item,
.mini-unit-card,
.kpi,
.kpi-button,
.card,
.subcard {
  min-width: 0;
  overflow: hidden;
}

.unit-tile {
  align-content: start;
  grid-auto-rows: auto;
  gap: 8px;
  padding: 13px;
}

.unit-tile > *,
.unit-hero-pills > *,
.showing-unit-card > *,
.home-feed-item > * {
  min-width: 0;
  max-width: 100%;
}

.unit-tile strong {
  font-size: clamp(22px, 7vw, 32px);
  line-height: 1;
  overflow-wrap: anywhere;
}

.unit-tile .pill,
.unit-tile .status-pill,
.unit-tile .wo-badge,
.unit-tile .move-countdown,
.unit-hero-pills .pill,
.unit-hero-pills .status-pill {
  width: 100%;
  max-width: 100%;
  justify-content: center;
  white-space: normal;
  text-align: center;
  overflow-wrap: anywhere;
  word-break: normal;
}

.unit-tile .subtle {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  line-height: 1.25;
}

.active-bookings-card,
.active-unit-showings,
.showing-orphan-card {
  border-color: rgba(25, 118, 210, .22);
  background: linear-gradient(180deg, #f8fbff, #ffffff);
}

.active-booking-item { border-left: 5px solid var(--blue); }
.showing-orphan-card { border-color: rgba(211, 63, 73, .24); background: #fff8f8; }

@media (max-width: 430px) {
  .unit-grid { grid-template-columns: 1fr; }
  .unit-tile { min-height: unset; }
  .unit-tile .pill,
  .unit-tile .status-pill,
  .unit-tile .wo-badge,
  .unit-tile .move-countdown {
    min-height: 34px;
    padding-left: 10px;
    padding-right: 10px;
  }
}

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

.quick-login-grid .btn {
  min-height: 44px;
}


.vendor-contact-preview {
  border: 1px solid rgba(37, 99, 235, 0.18);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.08), rgba(16, 185, 129, 0.08));
  border-radius: 16px;
  padding: 12px;
}
.contact-method-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.highlighted-vendor { border: 1px solid rgba(22, 163, 74, 0.35); box-shadow: 0 10px 28px rgba(22, 163, 74, 0.12); }

/* v4.8 notices/forms + completed booking follow-up */
.forms-screen .inner-grid { grid-template-columns: 1fr 1.3fr; gap: 8px; }
.notice-result-card { border-color: rgba(16, 185, 129, 0.28); background: linear-gradient(180deg, #f7fffb, #fff); }
.notice-actions { gap: 8px; margin-top: 8px; }
.notice-actions .btn, .notice-actions a.btn { text-decoration: none; }
.completed-bookings { border: 1px solid rgba(15, 35, 64, 0.1); border-radius: 16px; padding: 10px; background: #fbfcff; }
.completed-bookings summary { font-weight: 900; color: var(--ink); cursor: pointer; padding: 6px; }
.completed-booking-card { opacity: 0.94; border-left: 5px solid #7c3aed; }
.official-notice-form { border-top: 1px solid rgba(15, 35, 64, 0.08); padding-top: 4px; }
.timeline-entry .notice-actions { margin-top: 10px; }
@media (max-width: 520px) { .forms-screen .inner-grid { grid-template-columns: 1fr; } }


/* v4.9 notices/forms visibility + generated notice modal */
.notice-record-list {
  display: grid;
  gap: 12px;
}
.notice-record-card {
  border: 1px solid rgba(42, 62, 86, 0.12);
  border-radius: 18px;
  padding: 14px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  box-shadow: 0 10px 24px rgba(10, 34, 70, 0.06);
  overflow: hidden;
}
.notice-record-card h4 {
  margin: 2px 0 4px;
  font-size: 1.05rem;
}
.notice-status {
  background: #e8f2ff;
  color: #0a56c2;
  border: 1px solid rgba(10, 86, 194, .18);
  max-width: 100%;
  white-space: normal;
}
.notice-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(4, 18, 36, .58);
  backdrop-filter: blur(8px);
}
.notice-modal {
  width: min(520px, 100%);
  max-height: 88vh;
  overflow: auto;
}
.notice-actions {
  gap: 8px;
}
.notice-actions .btn,
.notice-actions a.btn {
  flex: 1 1 120px;
  justify-content: center;
  text-align: center;
}
@media (max-width: 520px) {
  .notice-actions .btn,
  .notice-actions a.btn {
    flex: 1 1 100%;
  }
}

/* v5.0 Notices / Forms selection and preview fixes */
.notice-recipient-picker {
  border: 1px solid rgba(7, 82, 126, 0.14);
  background: linear-gradient(180deg, #f8fdff 0%, #eef9fc 100%);
}
.notice-selected-count {
  display: inline-flex;
  align-self: flex-start;
  padding: 8px 12px;
  border-radius: 999px;
  background: #0b5f8f;
  color: #fff;
  font-weight: 900;
  font-size: 0.9rem;
}
.notice-floor-list {
  display: grid;
  gap: 12px;
}
.notice-floor-group {
  border: 1px solid rgba(15, 35, 60, 0.12);
  border-radius: 20px;
  background: #fff;
  overflow: hidden;
}
.notice-floor-group summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-weight: 900;
  color: #0c243f;
  background: #f3f9fd;
}
.notice-floor-group summary::-webkit-details-marker { display: none; }
.floor-check,
.check-card,
.unit-check-card {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.floor-check,
.check-card {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
}
.notice-floor-group input[type="checkbox"],
.check-card input[type="checkbox"],
.unit-check-card input[type="checkbox"] {
  width: 22px;
  height: 22px;
  accent-color: #0a64c8;
  flex: 0 0 auto;
}
.notice-unit-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  padding: 14px;
}
.unit-check-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(10, 100, 200, 0.16);
  border-radius: 16px;
  background: #ffffff;
  min-width: 0;
}
.unit-check-card strong,
.unit-check-card span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.unit-check-card span {
  grid-column: 2;
  color: #64748b;
  font-weight: 700;
  font-size: 0.85rem;
}
.unit-check-card:has(input:checked) {
  border-color: #0a64c8;
  background: #e9f4ff;
  box-shadow: inset 0 0 0 1px rgba(10, 100, 200, 0.2);
}
.all-building {
  padding: 10px 12px;
  border-radius: 16px;
  background: #e8f6ee;
  color: #064e3b;
}
.notice-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(8, 19, 35, 0.58);
  display: grid;
  place-items: center;
  padding: 18px;
}
.notice-modal {
  max-width: 560px;
  width: min(100%, 560px);
  max-height: calc(100vh - 36px);
  overflow: auto;
}
@media (max-width: 520px) {
  .notice-unit-check-grid { grid-template-columns: 1fr; }
  .notice-floor-group summary { align-items: flex-start; flex-direction: column; }
}

/* v5.1 Notices / Forms common-area and collapsed-floor hotfix */
.notice-common-area-card {
  border: 1px solid rgba(0, 167, 181, 0.18);
  background: linear-gradient(180deg, #f5feff 0%, #eef9fb 100%);
}
.notice-floor-group:not([open]) summary {
  border-radius: 20px;
}
.notice-floor-group[open] summary {
  border-bottom: 1px solid rgba(15, 35, 60, 0.08);
}
.notice-floor-group summary span {
  color: #64748b;
  font-size: 0.85rem;
}
.notice-actions .btn,
.notice-actions a.btn {
  min-height: 40px;
}
@media (max-width: 520px) {
  .notice-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .notice-actions .btn,
  .notice-actions a.btn {
    width: 100%;
    justify-content: center;
  }
}

/* v5.1.1 notice title correction: Entry Notices render as NOTICE OF ENTRY. */


/* v5.5 move-in readiness + active showing refinements */
.movein-readiness-dashboard .movein-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}.movein-check{border:1px solid rgba(15,23,42,.12);border-radius:16px;padding:10px;background:#fff}.movein-check.done{background:#ecfdf5;border-color:#34d399}.movein-check.todo{background:#fff7ed;border-color:#fdba74}.movein-check strong{display:block;font-size:.85rem}.movein-check span{font-size:.78rem;color:#475569}.active-showing-form{border:1px solid rgba(59,130,246,.18);background:#f8fbff;border-radius:18px;padding:12px}.check-chip{display:flex;align-items:center;gap:8px;text-align:left}.check-chip input{width:auto;margin:0}.completed-bookings-section{margin-top:16px}.showings-screen .showing-category-grid{order:1}.showings-screen .active-bookings-card{order:2}.showings-screen .completed-bookings-section{order:3}

/* v5.6: mobile modal positioning + building calendar */
.bedroom-prompt-backdrop {
  align-items: center;
  justify-items: center;
  padding: max(12px, env(safe-area-inset-top)) 14px max(12px, env(safe-area-inset-bottom));
}
.bedroom-prompt {
  width: min(560px, calc(100vw - 28px));
  max-height: min(84vh, 760px);
  border-radius: 24px;
  box-shadow: 0 22px 60px rgba(12, 35, 64, .28);
  overflow: auto;
}
.bedroom-prompt .bedroom-option-grid {
  grid-template-columns: 1fr;
}
.bedroom-prompt .btn.full {
  position: sticky;
  bottom: 0;
  background: rgba(255,255,255,.96);
  box-shadow: 0 -8px 18px rgba(255,255,255,.9);
}
.calendar-template-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.calendar-template {
  min-height: 88px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  color: var(--navy);
  padding: 12px;
  text-align: center;
  box-shadow: 0 8px 20px rgba(12,35,64,.06);
}
.calendar-template span { font-size: 24px; line-height: 1; }
.calendar-template strong { font-size: 13px; }
.calendar-template.selected {
  border-color: rgba(25,118,210,.35);
  background: linear-gradient(180deg, #eaf5ff, #ffffff);
  box-shadow: 0 10px 24px rgba(25,118,210,.15);
}
.calendar-event-list { display: grid; gap: 10px; }
.calendar-event-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}
.calendar-event-card.done { opacity: .72; }
.calendar-pill {
  background: #eaf5ff;
  color: #075985;
  border: 1px solid rgba(14, 165, 233, .25);
}
.home-feed-item.calendar-event { border-color: rgba(14,165,233,.28); background: linear-gradient(180deg, #effaff, #fff); }
@media (max-width: 440px) {
  .calendar-template-grid { grid-template-columns: 1fr; }
  .bedroom-prompt { max-height: 88vh; padding: 14px; }
  .bedroom-option { min-height: 74px; padding: 13px 12px; }
}

/* v5.7: calendar reminder toggles + sync card */
.reminder-toggle-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.reminder-toggle-grid label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: var(--navy);
  font-weight: 800;
}
.reminder-toggle-grid input {
  width: 20px;
  height: 20px;
  accent-color: var(--blue);
}
.calendar-sync-card {
  border-color: rgba(14,165,233,.22);
  background: linear-gradient(180deg, #f0fbff, #ffffff);
}
.calendar-event-card .mini-action-row a.btn {
  text-decoration: none;
}


/* v5.8: always-visible calendar ticker and buildings-first home layout */
.calendar-ticker {
  width: 100%;
  margin-top: 9px;
  min-height: 38px;
  border: 1px solid rgba(25,118,210,.16);
  border-radius: 999px;
  background: linear-gradient(90deg, #0c2340, #1976d2);
  color: #fff;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
  padding: 0 10px;
  box-shadow: 0 10px 22px rgba(12,35,64,.14);
}
.calendar-ticker:active { transform: scale(.992); }
.calendar-ticker-label {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.calendar-ticker-track {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 850;
  text-align: left;
}
.calendar-ticker-track span {
  display: inline-block;
  min-width: 100%;
  padding-left: 100%;
  animation: unitworksTicker 90s linear infinite;
}
.calendar-ticker:hover .calendar-ticker-track span,
.calendar-ticker:focus-visible .calendar-ticker-track span { animation-play-state: paused; }
@keyframes unitworksTicker {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}
.home-screen .building-list-card { order: 20; }
.home-screen .home-feed-card { order: 40; }
.home-screen .create-building-card { order: 15; }
.home-screen .compact-hero { order: 10; }
@media (prefers-reduced-motion: reduce) {
  .calendar-ticker-track span { animation: none; padding-left: 0; }
}
@media (max-width: 380px) {
  .calendar-ticker { min-height: 34px; padding: 0 8px; }
  .calendar-ticker-label { font-size: 9px; padding: 3px 7px; }
  .calendar-ticker-track { font-size: 11px; }
}

/* v5.8.1: mobile width guard / calendar ticker containment hotfix */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
#app,
.app-shell,
.screen,
.card,
.topbar,
.topbar-row,
.topbar-main,
.topbar-title,
.calendar-ticker,
.home-screen,
.building-list-card,
.home-feed-card,
.create-building-card {
  max-width: 100%;
  min-width: 0;
}
.app-shell {
  overflow-x: hidden;
}
.topbar-row {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
}
.topbar-main {
  flex: 1 1 auto;
  overflow: hidden;
}
.topbar-title h2,
.topbar-title .breadcrumb {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.calendar-ticker {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  flex: 0 1 auto;
  touch-action: manipulation;
}
.calendar-ticker-track {
  min-width: 0;
  max-width: 100%;
  flex: 1 1 0;
  overflow: hidden;
  contain: paint;
}
.calendar-ticker-track span {
  min-width: 0;
  width: max-content;
  max-width: none;
  padding-left: 0;
  will-change: transform;
  animation: unitworksTickerSafe 95s linear infinite;
}
@keyframes unitworksTickerSafe {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}
.home-actions,
.grid-2,
.grid-3,
.floor-grid,
.unit-grid,
.showing-category-grid,
.kpi-grid,
.feedback-chip-grid,
.calendar-template-grid {
  min-width: 0;
}
.item,
.unit-tile,
.floor-tile,
.showing-unit-card,
.calendar-event-card,
.home-feed-item,
.building-card {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.btn,
.pill,
.tap-hint,
.micro,
.subtle,
p,
h1,
h2,
h3,
strong,
em,
span {
  max-width: 100%;
}
@media (max-width: 560px) {
  .app-shell {
    width: 100vw;
    max-width: 100vw;
    padding-left: 12px;
    padding-right: 12px;
  }
  .home-actions,
  .grid-2,
  .grid-3 {
    grid-template-columns: 1fr !important;
  }
  .floor-grid,
  .unit-grid,
  .showing-category-grid,
  .kpi-grid,
  .feedback-chip-grid,
  .calendar-template-grid {
    grid-template-columns: 1fr !important;
  }
  .row.between {
    min-width: 0;
  }
  .row.wrap,
  .mini-action-row,
  .showing-actions {
    flex-wrap: wrap;
  }
  .row.wrap > .btn,
  .mini-action-row > .btn,
  .showing-actions > .btn {
    flex: 1 1 100%;
  }
  .calendar-ticker {
    border-radius: 18px;
  }
  .calendar-ticker-label {
    flex: 0 0 auto;
  }
}
@media (max-width: 380px) {
  .topbar-row {
    gap: 6px;
  }
  .logo-small {
    width: 42px;
    height: 42px;
  }
  .topbar-title h2 {
    font-size: 20px;
  }
  .home-button {
    padding: 8px 9px;
  }
}

/* v5.9 Main dashboard, visual calendar, and common-area WO flow */
.dashboard-home .home-command-card { margin-top: 0; }
.main-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
}
.main-action-grid.two-up { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.main-action-card {
  border: 1px solid rgba(12, 35, 64, .13);
  background: linear-gradient(180deg, #ffffff, #f6fbff);
  border-radius: 20px;
  padding: 16px 12px;
  text-align: left;
  display: grid;
  gap: 6px;
  min-height: 122px;
  box-shadow: 0 12px 26px rgba(12, 35, 64, .08);
  color: var(--ink, #0c2340);
  width: 100%;
}
.main-action-card.primary {
  grid-column: 1 / -1;
  background: linear-gradient(135deg, #0c2340, #1267d8);
  color: white;
}
.main-action-card span { font-size: 26px; line-height: 1; }
.main-action-card strong { font-size: 18px; line-height: 1.05; }
.main-action-card small { color: inherit; opacity: .78; font-weight: 700; line-height: 1.25; }
.main-action-card:active { transform: scale(.99); }
.single-action { grid-template-columns: 1fr; }

.common-area-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.common-area-tile {
  border: 1px solid rgba(12, 35, 64, .12);
  background: #fff;
  border-radius: 18px;
  padding: 15px 12px;
  display: grid;
  gap: 6px;
  text-align: left;
  box-shadow: 0 10px 22px rgba(12, 35, 64, .07);
}
.common-area-tile span { font-size: 24px; }
.common-area-tile strong { font-size: 15px; color: #0c2340; }
.common-area-work-list .work-location { margin-top: 0; }

.visual-calendar-card { overflow: hidden; }
.calendar-weekdays,
.calendar-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}
.calendar-weekdays span {
  text-align: center;
  font-size: 10px;
  font-weight: 900;
  color: #60738a;
  text-transform: uppercase;
}
.calendar-day {
  min-width: 0;
  min-height: 48px;
  border: 1px solid rgba(12, 35, 64, .10);
  border-radius: 12px;
  background: #fff;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 2px;
  padding: 5px 2px;
  color: #0c2340;
}
.calendar-day strong { font-size: 14px; }
.calendar-day span { font-size: 9px; font-weight: 800; color: #1267d8; white-space: nowrap; }
.calendar-day.muted { background: transparent; border-color: transparent; box-shadow: none; }
.calendar-day.selected { outline: 3px solid rgba(18, 103, 216, .25); border-color: #1267d8; }
.calendar-day.has-open { background: #fff8e6; border-color: #f0bd38; }
.calendar-day.has-done { background: #ebfff1; border-color: #2aa84a; }
.selected-day-panel { border-top: 1px solid rgba(12,35,64,.08); padding-top: 12px; }
.calendar-event-card.done { opacity: .82; background: #f4fff7; }
.calendar-event-card.done h3::before,
.calendar-event-card.done strong::before { content: "✓ "; color: #23a455; }

@media (max-width: 420px) {
  .main-action-grid { grid-template-columns: 1fr; }
  .main-action-card.primary { grid-column: auto; }
  .main-action-card { min-height: 92px; padding: 14px; }
  .common-area-grid { grid-template-columns: 1fr; }
  .calendar-day { min-height: 42px; border-radius: 10px; }
  .calendar-day strong { font-size: 13px; }
  .calendar-day span { font-size: 8px; }
}

/* v6.0 patch: fixed/high popups, rent tracker, morning agenda, audit trail, poster notices */
.drawer-backdrop {
  align-items: start !important;
  justify-items: center;
  overflow: hidden;
  padding: max(12px, env(safe-area-inset-top)) 14px max(12px, env(safe-area-inset-bottom));
}
.drawer {
  margin-top: clamp(8px, 4vh, 34px) !important;
  max-height: min(88dvh, 760px) !important;
  border-radius: 24px !important;
  box-shadow: 0 22px 60px rgba(12,35,64,.30) !important;
}
.drawer .btn.full,
.wo-create-panel > .btn.full {
  position: sticky;
  bottom: -1px;
  z-index: 4;
  box-shadow: 0 -10px 20px rgba(255,255,255,.95);
}
.audit-line {
  margin: 0;
  color: #1267d8;
  font-size: 11px;
  font-weight: 900;
}
.morning-agenda-backdrop {
  z-index: 160;
}
.morning-agenda-modal {
  width: min(620px, calc(100vw - 28px));
}
.agenda-list {
  display: grid;
  gap: 10px;
}
.agenda-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  border: 1px solid rgba(12,35,64,.10);
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  padding: 11px;
}
.agenda-item > span {
  font-size: 20px;
  line-height: 1;
}
.agenda-item strong,
.agenda-item small {
  display: block;
}
.agenda-item strong {
  color: #0c2340;
  font-size: 14px;
}
.agenda-item small {
  color: #64748b;
  font-size: 12px;
  font-weight: 750;
  margin-top: 2px;
}
.home-feed-item.rent-event {
  border-left: 5px solid #2aa84a;
  background: linear-gradient(180deg, #f2fff6, #fff);
}
.rent-record-list {
  display: grid;
  gap: 12px;
}
.rent-record-card {
  border: 1px solid rgba(12,35,64,.12);
  border-radius: 20px;
  background: #fff;
  padding: 13px;
  box-shadow: 0 10px 22px rgba(12,35,64,.06);
}
.rent-record-form {
  margin-top: 10px;
}
.rent-record-form .wide {
  grid-column: 1 / -1;
}
.rent-pill,
.rent-paid {
  background: #ecfdf5;
  color: #117a3b;
  border-color: rgba(34,197,94,.25);
}
.rent-unpaid {
  background: #fff7ed;
  color: #b45309;
  border-color: rgba(251,146,60,.25);
}
@media (max-width: 520px) {
  .drawer {
    width: calc(100vw - 18px);
    max-height: min(86dvh, 720px) !important;
    margin-top: max(8px, env(safe-area-inset-top)) !important;
    padding: 14px;
  }
  .rent-record-form {
    grid-template-columns: 1fr;
  }
}


/* v6.1 role-based leasing dashboard */
.leasing-dashboard .main-action-grid,
.leasing-action-grid{
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.leasing-command-card{
  border: 1px solid rgba(13, 148, 136, .22);
}
.leasing-reminder-card,
.leasing-ready-card,
.leasing-upcoming-card,
.leasing-unit-dashboard{
  border-color: rgba(37, 99, 235, .14);
}
.leasing-unit-card.ready-now{
  box-shadow: 0 12px 32px rgba(13, 148, 136, .08);
}
.leasing-unit-page .wo-strip,
.leasing-unit-page .notice-records,
.leasing-unit-page .workorder-only{
  display: none !important;
}
.leasing-unit-page .command-grid.leasing-command-grid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 640px){
  .leasing-unit-page .command-grid.leasing-command-grid{
    grid-template-columns: 1fr;
  }
}

.role-hidden{display:none!important}


/* v6.2 audit + resupply */
.audit-grid{display:grid;grid-template-columns:1fr;gap:14px}.audit-card{min-height:180px}.audit-sample-list{display:grid;gap:10px}.audit-sample{border:1px solid rgba(12,35,64,.12);background:#f8fbff;border-radius:18px;padding:12px}.audit-sample p{margin:4px 0;color:#40516a}.audit-sample small{color:#637087}.supply-list{display:grid;gap:12px}.supply-item-row{display:grid;grid-template-columns:1fr 82px;gap:10px;align-items:end;border:1px solid rgba(12,35,64,.12);border-radius:20px;padding:12px;background:#fbfdff}.supply-item-row .supply-note{grid-column:1/-1}.supply-item-row h4{margin:0 0 4px;font-size:15px}.supply-qty input{text-align:center;font-weight:900}.order-list{display:grid;gap:10px}.order-row{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid rgba(12,35,64,.12);border-radius:18px;padding:12px;background:#f8fbff}.order-row p{margin:4px 0;color:#40516a}.order-row small{color:#637087}@media(min-width:780px){.audit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.supply-item-row{grid-template-columns:1fr 90px 1fr}.supply-item-row .supply-note{grid-column:auto}}


/* v6.3 vendor-side work queue */
.vendor-dashboard .vendor-hero h2{margin-bottom:4px}
.vendor-building-group{gap:14px}
.vendor-work-card{display:flex;flex-direction:column;gap:12px;border-left:5px solid #0a56c2}
.vendor-schedule-form{margin-top:6px;background:#f5f8fc;border:1px solid #dbe7f5;border-radius:18px;padding:12px}
.vendor-scheduled-box{background:#ecfff4;border:1px solid #bdeacc;border-radius:16px;padding:12px;color:#153b22}
.vendor-check-list{display:flex;flex-direction:column;gap:8px;max-height:260px;overflow:auto;padding:4px}
.check-row{display:flex;align-items:flex-start;gap:10px;border:1px solid #dbe7f5;border-radius:14px;padding:10px;background:#fff;font-weight:800}
.check-row input{margin-top:3px;min-width:18px;min-height:18px}
.full-field{grid-column:1/-1}
@media(max-width:720px){.vendor-schedule-form.grid-2{grid-template-columns:1fr}.full-field{grid-column:auto}.vendor-work-card .btn.full.small{width:100%}}


/* v6.4 Work Orders dashboard tightening */
.workorders-tight-screen {
  gap: 10px;
  padding-top: 0;
}
.workorders-tight-screen .topbar {
  padding-bottom: 6px;
}
.workorders-summary-card,
.workorder-start-card {
  margin-top: 0;
}
.open-workorders-list {
  display: grid;
  gap: 12px;
}
.workorders-summary-card h2 {
  margin-top: 0;
  font-size: clamp(26px, 7vw, 38px);
  letter-spacing: -0.04em;
}
.workorder-start-card .main-action-card {
  min-height: 112px;
}
@media (max-width: 560px) {
  .workorders-tight-screen .topbar {
    padding-top: 6px;
  }
  .workorders-summary-card,
  .workorder-start-card {
    padding: 12px;
  }
  .workorders-summary-card h2 {
    font-size: 28px;
  }
}

.vendor-confirmation-actions{margin-top:10px;gap:8px;align-items:center}.vendor-scheduled-box{border-radius:14px}


/* v6.6 compact mobile layout + Work Orders priority start */
.workorders-tight-screen .priority-start-card { order: 1; }
.workorders-tight-screen .open-wo-dashboard-card { order: 2; }
.priority-start-card h2 { font-size: clamp(24px, 6.5vw, 32px); }
.open-wo-dashboard-card h2 { font-size: clamp(22px, 6vw, 30px); }
.compact-open-wo-list .wo-card { gap: 8px; }

@media (max-width: 720px) {
  .app-shell {
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: calc(14px + env(safe-area-inset-bottom));
  }
  .screen {
    min-height: auto;
    padding: 8px 0 18px;
  }
  .screen.stack,
  .stack {
    gap: 10px;
  }
  .tight {
    gap: 5px;
  }
  .topbar {
    padding: 5px 0 7px;
  }
  .topbar-row {
    gap: 7px;
  }
  .logo-small {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }
  .home-button {
    min-height: 36px;
    padding: 7px 10px;
    font-size: 12px;
  }
  .card,
  .subcard,
  .record-card,
  .item,
  .building-card,
  .showing-unit-card,
  .notice-record-card,
  .audit-sample,
  .supply-item-row,
  .order-row {
    padding: 11px;
    border-radius: 17px;
  }
  .compact-hero {
    padding: 11px;
  }
  .empty {
    padding: 12px;
    border-radius: 16px;
  }
  h1 {
    font-size: clamp(26px, 8vw, 36px);
  }
  h2,
  .compact-hero h2 {
    font-size: 22px;
    line-height: 1.04;
  }
  h3 {
    font-size: 15px;
  }
  p,
  .helper {
    line-height: 1.3;
  }
  .helper,
  .subtle {
    font-size: 11px;
  }
  .micro {
    font-size: 10px;
  }
  .btn {
    min-height: 40px;
    padding: 9px 11px;
    border-radius: 13px;
  }
  .btn.small {
    min-height: 34px;
    padding: 7px 9px;
    font-size: 11px;
  }
  input,
  select,
  textarea {
    padding: 10px 11px;
    border-radius: 13px;
  }
  textarea {
    min-height: 82px;
  }
  .main-action-grid,
  .main-action-grid.two-up,
  .home-actions,
  .command-grid,
  .common-area-grid,
  .grid-2,
  .grid-3 {
    gap: 8px;
  }
  .main-action-card {
    min-height: 76px;
    padding: 10px;
    border-radius: 16px;
    gap: 4px;
  }
  .main-action-card.primary {
    grid-column: auto;
  }
  .main-action-card span {
    font-size: 21px;
  }
  .main-action-card strong {
    font-size: 16px;
  }
  .main-action-card small {
    font-size: 11px;
    line-height: 1.15;
  }
  .floor-grid,
  .unit-grid,
  .property-list,
  .work-location-list,
  .open-workorders-list,
  .timeline,
  .list,
  .audit-sample-list,
  .supply-list,
  .order-list {
    gap: 8px;
  }
  .floor-tile,
  .unit-tile,
  .action-card {
    min-height: 74px;
    padding: 10px;
    border-radius: 16px;
    gap: 6px;
  }
  .unit-tile {
    min-height: 82px;
  }
  .floor-tile strong,
  .unit-tile strong,
  .property-name {
    font-size: 20px;
    line-height: 1;
  }
  .kpi {
    padding: 9px;
    border-radius: 14px;
  }
  .kpi strong {
    font-size: 16px;
  }
  .pill,
  .wo-badge,
  .tap-hint {
    min-height: 23px;
    padding: 4px 7px;
    font-size: 10px;
  }
  .room-tools,
  .vendor-request-panel,
  .repair-assist-panel,
  .selected-review-panel,
  .setup-details,
  .rent-record-form,
  .vendor-schedule-form {
    padding: 10px;
    border-radius: 15px;
  }
  .location-summary {
    padding: 10px;
  }
  .issue-category {
    padding: 10px;
    gap: 6px;
  }
  .issue-chip {
    min-height: 36px;
    padding: 8px 10px;
    border-radius: 13px;
    font-size: 12px;
  }
  .section-icon {
    width: 28px;
    height: 28px;
    border-radius: 10px;
  }
  .wo-card {
    gap: 8px;
  }
  .record-card {
    gap: 7px;
  }
  .followup-buttons {
    gap: 7px;
  }
  .drawer-backdrop {
    padding-left: 8px;
    padding-right: 8px;
  }
  .drawer {
    padding: 12px;
    border-radius: 20px !important;
  }
  .workorders-tight-screen .topbar {
    padding-top: 3px;
  }
  .workorders-summary-card h2 {
    font-size: 24px;
  }
  .workorder-start-card .main-action-card {
    min-height: 76px;
  }
}

@media (max-width: 420px) {
  .main-action-grid.two-up {
    grid-template-columns: 1fr 1fr;
  }
  .grid-2,
  .grid-3 {
    grid-template-columns: 1fr;
  }
  .workorders-tight-screen .main-action-grid.two-up {
    grid-template-columns: 1fr 1fr;
  }
  .workorders-tight-screen .main-action-card small {
    display: none;
  }
  .workorders-tight-screen .main-action-card {
    min-height: 62px;
  }
}

/* v6.9 compact open work order + vendor assigned work lists */
.wo-compact-row{
  width:100%;
  border:1px solid rgba(12,35,64,.13);
  background:#fff;
  border-radius:16px;
  padding:10px 12px;
  display:grid;
  grid-template-columns:minmax(82px,.75fr) minmax(0,1.35fr) minmax(0,1fr);
  gap:10px;
  align-items:center;
  text-align:left;
  color:var(--navy);
  box-shadow:0 8px 22px rgba(12,35,64,.06);
  cursor:pointer;
}
.wo-compact-row:active{transform:translateY(1px)}
.wo-compact-row:hover{border-color:rgba(10,86,194,.35);background:#f8fbff}
.wo-compact-number{font-weight:1000;font-size:.92rem;letter-spacing:-.02em;white-space:nowrap}
.wo-compact-building,.wo-compact-unit{font-weight:850;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wo-compact-unit{text-align:right;color:#40516a}
.vendor-building-group .tight{margin-bottom:2px}
.uw-detail-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:1000;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:calc(12px + env(safe-area-inset-top)) 10px calc(12px + env(safe-area-inset-bottom));
  background:rgba(12,35,64,.42);
  overflow:auto;
}
.uw-detail-modal{
  width:min(760px,100%);
  max-height:calc(100vh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overflow:auto;
  border-radius:22px;
  background:#fff;
  box-shadow:0 28px 80px rgba(12,35,64,.32);
  padding:14px;
}
.uw-detail-modal-head{
  position:sticky;
  top:0;
  z-index:2;
  background:rgba(255,255,255,.96);
  padding-bottom:8px;
  border-bottom:1px solid rgba(12,35,64,.08);
}
.uw-detail-modal .wo-card{margin-top:0}
@media(max-width:640px){
  .wo-compact-row{grid-template-columns:1fr;gap:3px;padding:9px 10px;border-radius:14px}
  .wo-compact-number{font-size:.95rem}
  .wo-compact-building,.wo-compact-unit{font-size:.84rem;text-align:left}
  .uw-detail-modal{border-radius:18px;padding:10px;max-height:calc(100vh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}


/* v7.0 UX stability: readable ticker + active forms stay visible */
.calendar-ticker-track span { animation-duration: 95s !important; }
.showing-capture-panel,
.wo-create-panel,
#calendarEventForm,
.uw-detail-modal,
.vendor-detail-modal,
.drawer,
.bedroom-prompt,
.active-entry-panel {
  scroll-margin-top: 10px;
}
@media (max-width: 640px) {
  .calendar-ticker-track { font-size: 12px; line-height: 1.25; }
  .calendar-ticker-track span { animation-duration: 110s !important; }
}


/* v7.1 Regional Manager dashboard */
.regional-dashboard-screen .regional-command-card,
.regional-dashboard-screen .regional-approval-card,
.regional-dashboard-screen .regional-data-card { gap: 12px; }
.regional-metric-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:10px; }
.regional-metric-card { border:1px solid rgba(12,35,64,.12); border-radius:16px; padding:12px; background:#fff; display:flex; flex-direction:column; gap:3px; }
.regional-metric-card span { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:#5d6a7c; font-weight:800; }
.regional-metric-card strong { font-size:22px; color:#10233f; }
.regional-metric-card small { color:#6a7280; font-weight:700; }
.regional-data-list { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:8px; }
.regional-data-list > div { border:1px solid rgba(12,35,64,.1); border-radius:14px; padding:10px 12px; display:flex; justify-content:space-between; gap:10px; background:#fff; }
.regional-data-list span { color:#5d6a7c; font-weight:800; }
.regional-data-list strong { color:#10233f; }
.regional-approval-row { border-left:4px solid #2156d9; }
@media (max-width: 720px) {
  .regional-metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap:8px; }
  .regional-data-list { grid-template-columns: 1fr; }
  .regional-dashboard-screen .main-action-grid.two-up { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .regional-metric-card { padding:10px; }
  .regional-metric-card strong { font-size:18px; }
}


/* v7.2 in-app audit viewer */
.selected-audit-card{border-color:rgba(12,35,64,.36);box-shadow:0 10px 26px rgba(12,35,64,.10)}
.audit-detail-panel{scroll-margin-top:12px}
.audit-record-list{display:grid;gap:10px;max-height:68vh;overflow:auto;padding-right:2px}
.audit-record-row{border:1px solid rgba(12,35,64,.12);background:#fbfdff;border-radius:18px;padding:12px;display:grid;gap:10px}
.audit-record-row strong{font-size:15px;color:#10233f}
.audit-record-row p{margin:3px 0;color:#40516a;font-size:13px}
.audit-record-row small{color:#637087;font-size:12px}
.audit-record-fields{display:grid;grid-template-columns:1fr;gap:7px}
.audit-record-fields div{display:grid;gap:2px;border-top:1px solid rgba(12,35,64,.08);padding-top:7px}
.audit-record-fields span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#637087;font-weight:900}
.audit-record-fields b{font-size:12px;color:#10233f;font-weight:800;word-break:break-word}
@media(min-width:780px){.audit-record-row{grid-template-columns:minmax(180px,.65fr) 1.35fr}.audit-record-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* v7.3 RM mobile polish: clean command screen, tighter RM companion layout */
:root { --radius: 18px; --shadow: 0 10px 26px rgba(12,35,64,.08); }
.app-shell { max-width: 540px; padding-left: 10px; padding-right: 10px; }
.screen { padding: 8px 0 16px; min-height: auto; }
.stack { gap: 9px; }
.tight { gap: 4px; }
.card { padding: 12px; border-radius: 18px; box-shadow: 0 8px 20px rgba(12,35,64,.065); }
h1 { font-size: clamp(26px, 8vw, 38px); }
h2 { font-size: 20px; line-height: 1.08; }
h3 { font-size: 15px; }
p { font-size: 13px; line-height: 1.32; }
.micro { font-size: 9.5px; letter-spacing: .055em; }
.topbar { padding: 5px 0 7px; }
.topbar-row { gap: 8px; }
.logo-small { width: 38px; height: 38px; border-radius: 13px; }
.home-button { min-height: 34px; padding: 7px 10px; font-size: 12px; }
.calendar-ticker { min-height: 32px; margin-top: 6px; border-radius: 16px; padding: 0 8px; }
.calendar-ticker-label { min-height: 21px; padding: 3px 7px; font-size: 9px; }
.calendar-ticker-track { font-size: 11px; }
.btn { min-height: 40px; padding: 9px 12px; border-radius: 14px; }
.btn.small { min-height: 32px; padding: 6px 9px; border-radius: 11px; }
input, select, textarea { padding: 9px 10px; border-radius: 12px; }
textarea { min-height: 76px; }
.field { gap: 5px; }
label { font-size: 11px; }
.grid-2, .grid-3, .main-action-grid, .main-action-grid.two-up, .home-actions, .command-grid, .common-area-grid, .floor-grid, .unit-grid, .showing-category-grid, .kpi-grid, .feedback-chip-grid, .calendar-template-grid { gap: 7px; }

.rm-home-v73 { gap: 8px; }
.rm-home-toolbar { display:flex; justify-content:flex-end; margin-top:-3px; }
.rm-command-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:8px; }
.rm-command-tile { min-height: 86px; border-radius: 20px; border:1px solid rgba(12,35,64,.12); background: linear-gradient(180deg,#fff,#f6fbff); box-shadow: 0 8px 20px rgba(12,35,64,.07); color: var(--navy); display:grid; align-content:center; justify-items:start; gap:7px; padding:13px; text-align:left; }
.rm-command-tile.primary { grid-column: 1 / -1; min-height: 88px; color:#fff; background: linear-gradient(135deg,#0c2340,#1976d2); box-shadow: 0 14px 28px rgba(25,118,210,.20); }
.rm-command-tile span { font-size:25px; line-height:1; }
.rm-command-tile strong { font-size:18px; line-height:1; letter-spacing:-.025em; }
.rm-command-tile:active { transform: scale(.985); }
.rm-now-section .home-feed-card { margin-top: 2px; }
.rm-now-section .home-feed-card .helper { display:none; }
.notification-board-shortcut { display:none !important; }

.building-selection-v73 .compact-hero { padding: 10px; }
.building-selection-v73 .compact-hero h2 { font-size: 19px; }
.compact-form-card .helper,
.compact-section-card .helper,
.compact-hero .helper { display:none !important; }
.compact-section-card .row.between { align-items:center; }
.building-card, .item, .floor-tile, .unit-tile, .showing-unit-card, .calendar-event-card, .home-feed-item, .notice-record-card, .audit-card, .supply-row, .wo-card { border-radius: 15px; padding: 10px; box-shadow: 0 5px 14px rgba(12,35,64,.045); }
.floor-tile, .unit-tile { min-height: 72px; gap: 5px; }
.unit-tile strong, .floor-tile strong { font-size: 16px; }
.pill { min-height: 22px; padding: 4px 7px; font-size: 10.5px; }
.empty { padding: 10px; border-radius: 14px; font-size: 13px; }

.main-action-card { min-height: 72px; padding: 10px; border-radius: 16px; gap: 4px; }
.main-action-card.primary { grid-column: auto; }
.main-action-card span { font-size: 21px; }
.main-action-card strong { font-size: 16px; }
.main-action-card small { display:none; }
.workorder-start-card .main-action-card { min-height: 70px; }
.workorders-summary-card h2 { font-size: 21px; }
.open-workorders-list { gap: 6px; }
.wo-compact-row { padding: 8px 10px; border-radius: 13px; }
.wo-compact-number { font-size: 13px; }
.wo-compact-building, .wo-compact-unit { font-size: 12.5px; }

.showing-category-card { min-height: 82px; padding: 12px; }
.showing-category-card strong { font-size: 30px; }
.showing-unit-card h3 { font-size: 18px; }
.home-feed-list { gap: 7px; }
.home-feed-main { padding: 9px 10px; }
.home-feed-item strong { font-size: 14px; }
.home-feed-item em, .home-feed-main small { font-size: 11px; }

@media (max-width: 430px) {
  .app-shell { padding-left: 8px; padding-right: 8px; }
  .rm-command-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap:7px; }
  .rm-command-tile { min-height: 76px; padding: 11px; border-radius: 17px; }
  .rm-command-tile.primary { min-height: 78px; }
  .rm-command-tile span { font-size: 22px; }
  .rm-command-tile strong { font-size: 16px; }
  .row.wrap > .btn, .mini-action-row > .btn, .showing-actions > .btn { flex: 1 1 auto; }
}


/* v7.4 RM mobile polish: header signout, cleaner showings/rent/notices, visible entry forms */
.topbar-actions { display:flex; align-items:center; gap:6px; flex:0 0 auto; }
.header-signout { min-height:34px; border:1px solid rgba(12,35,64,.14); background:#fff; color:#10233f; border-radius:999px; padding:7px 10px; font-size:11px; font-weight:1000; box-shadow:0 6px 14px rgba(12,35,64,.06); }
.rm-home-toolbar { display:none !important; }

.showings-screen > .card:first-of-type p:not(.micro) { display:none; }
.showing-category-grid-v74 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.showing-bedroom-card { min-height:92px; align-content:center; gap:5px; }
.showing-bedroom-card strong { font-size:26px; line-height:.95; letter-spacing:-.06em; color:#10233f; }
.showing-bedroom-card:first-child strong { font-size:23px; }
.showing-bedroom-card em { color:#1976d2; }
.showing-bedroom-card small { color:#5d6a7c; }
.showing-capture-panel, .active-entry-panel { scroll-margin-top: 8px; }

.rent-v74 .rent-control-panel { gap:8px; }
.rent-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.rent-kpi-grid article { border:1px solid rgba(12,35,64,.1); border-radius:14px; padding:8px; background:#fff; display:grid; gap:2px; text-align:center; }
.rent-kpi-grid article span { font-size:9px; text-transform:uppercase; letter-spacing:.06em; color:#64748b; font-weight:950; }
.rent-kpi-grid article strong { font-size:18px; color:#10233f; }
.rent-kpi-grid article.paid { background:#ecfdf5; }
.rent-kpi-grid article.unpaid { background:#fff7ed; }
.tight-controls { gap:7px; }
.rent-compact-list { gap:7px; }
.rent-compact-card { padding:9px; border-radius:15px; }
.rent-unit-head { display:flex; align-items:center; gap:9px; }
.rent-unit-number { width:46px; min-height:38px; border-radius:13px; display:grid; place-items:center; background:#10233f; color:#fff; font-size:16px; font-weight:1000; letter-spacing:-.04em; }
.rent-unit-head strong { display:block; font-size:13px; color:#10233f; }
.rent-unit-head small { display:block; font-size:11px; color:#64748b; font-weight:800; }
.rent-inline-form { margin-top:8px; border-top:1px solid rgba(12,35,64,.08); padding-top:8px; }
.rent-status-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.rent-inline-form .field input, .rent-inline-form .field select { min-height:36px; padding:7px 9px; }

.forms-v74 .notice-select-card { gap:8px; }
.notice-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.notice-mode-card { min-height:104px; border:1px solid rgba(12,35,64,.12); background:linear-gradient(180deg,#fff,#f7fbff); border-radius:18px; padding:12px; text-align:left; display:grid; gap:5px; color:#10233f; box-shadow:0 8px 18px rgba(12,35,64,.06); }
.notice-mode-card span { font-size:24px; }
.notice-mode-card strong { font-size:17px; line-height:1.05; }
.notice-mode-card small { color:#64748b; font-weight:850; }
.notice-form-builder { scroll-margin-top:8px; }
.notice-history-toggle { border:0; background:linear-gradient(135deg,#10233f,#1976d2); color:#fff; border-radius:16px; padding:12px; display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center; text-align:left; box-shadow:0 10px 24px rgba(25,118,210,.15); }
.notice-history-toggle span { font-size:16px; font-weight:1000; }
.notice-history-toggle strong { font-size:18px; }
.notice-history-toggle em { font-style:normal; font-size:11px; font-weight:1000; opacity:.9; }
.notice-history-tools { display:flex; gap:7px; flex-wrap:wrap; }
.chip-button { min-height:32px; border:1px solid rgba(12,35,64,.12); background:#fff; color:#10233f; border-radius:999px; padding:6px 10px; font-size:11px; font-weight:1000; }
.chip-button.active { background:#e9f4ff; border-color:#1976d2; color:#124fa1; }
.notice-history-list { max-height:58vh; overflow:auto; padding-right:2px; }
.notice-history-row { padding:10px; }
.notice-actions .btn.danger { color:#fff; }

.drawer-backdrop, .uw-detail-modal-backdrop, .notice-modal-backdrop, .bedroom-prompt-backdrop { align-items:flex-start !important; justify-content:center !important; overflow:auto !important; padding-top:max(10px, env(safe-area-inset-top)) !important; }
.drawer, .uw-detail-modal, .vendor-detail-modal, .notice-modal, .bedroom-prompt { margin-top:0 !important; max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important; overflow:auto !important; }
.showing-capture-panel, .notice-form-builder, .rent-control-panel, .create-building-card, #calendarEventForm, .audit-detail-panel { scroll-margin-top:8px; }

@media (max-width:430px){
  .topbar-actions { gap:4px; }
  .header-signout, .home-button { min-height:31px; padding:6px 8px; font-size:10.5px; }
  .notice-mode-grid { grid-template-columns:1fr; }
  .rent-kpi-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
  .rent-kpi-grid article { padding:7px 4px; }
  .rent-kpi-grid article strong { font-size:16px; }
  .rent-status-grid { grid-template-columns:1fr 1fr; }
  .showing-bedroom-card strong { font-size:23px; }
}


/* v7.5 clear WO/PO numbers + active showing rebuild */
.booked-showing-card{display:grid;gap:9px}.booked-showing-info{display:grid;gap:2px}.booked-showing-info span{font-size:11px;font-weight:950;text-transform:uppercase;color:#0f7c86;letter-spacing:.06em}.booked-showing-info strong{font-size:17px;letter-spacing:-.03em}.booked-showing-info em{font-style:normal;color:#40516a;font-weight:800}.booked-showing-info small{color:#6b7280;font-weight:850}.showing-arrived-button{min-height:52px;font-size:1.05rem;border-radius:18px;background:linear-gradient(135deg,#10233f,#00a7b5);box-shadow:0 12px 24px rgba(0,167,181,.22)}
.active-showing-hero{display:grid;gap:10px;padding:12px;border:1px solid rgba(0,167,181,.18);border-radius:20px;background:linear-gradient(180deg,#ffffff,#f4fdff)}.active-showing-price{display:grid;gap:0;padding:12px;border-radius:18px;background:#10233f;color:#fff}.active-showing-price span{font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7)}.active-showing-price strong{font-size:36px;line-height:1;font-weight:1000;letter-spacing:-.06em}.active-showing-price small{color:rgba(255,255,255,.78);font-weight:850}.active-showing-prospect{display:grid;gap:5px;padding:10px;border-radius:16px;background:#fff;border:1px solid rgba(15,35,63,.1)}.active-showing-prospect label,.active-showing-prospect span{font-size:10px;font-weight:1000;text-transform:uppercase;letter-spacing:.08em;color:#65758b}.active-showing-prospect strong{font-size:19px;letter-spacing:-.03em}.inline-save-field{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.inline-save-field input{min-height:42px}.showing-feedback-clean-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.showing-feedback-clean-grid .check-chip{min-height:42px;border-radius:14px}.showing-feedback-clean-grid .check-chip.selected,.showing-feedback-clean-grid .check-chip:has(input:checked){background:#ecfeff;border-color:rgba(0,167,181,.45);color:#075985}.other-units-panel{border:2px solid rgba(0,167,181,.18);padding:14px;background:linear-gradient(180deg,#f0fdff,#fff)}.other-units-heading{display:grid;gap:1px}.other-units-heading span{font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;color:#0f7c86}.other-units-heading strong{font-size:22px;letter-spacing:-.04em}.other-units-heading small{font-size:11px;color:#65758b;font-weight:850}.other-units-panel .mini-unit-card{min-height:54px;border-width:2px}.showing-active-actions .btn{min-height:44px}.showing-summary-splash{max-width:520px}.showing-summary-list{display:grid;gap:8px}.showing-summary-unit{padding:10px;border:1px solid rgba(15,35,63,.1);border-radius:16px;background:#f8fbff;display:grid;gap:3px}.showing-summary-unit strong{font-size:16px}.showing-summary-unit span{font-size:13px;font-weight:850;color:#243b55}.showing-summary-unit small{color:#65758b;font-weight:750}.wo-compact-number,.vendor-compact-row .wo-compact-number{font-weight:1000;color:#10233f}.po-record strong,.work-record strong{letter-spacing:-.02em}
@media(max-width:520px){.showing-feedback-clean-grid{grid-template-columns:1fr}.active-showing-price strong{font-size:32px}.showing-arrived-button{min-height:50px}.inline-save-field{grid-template-columns:1fr}.inline-save-field .btn{width:100%}}

button[data-uw-action="showing-walkin"]{font-weight:1000;box-shadow:0 10px 20px rgba(16,35,63,.14)}


.quick-slot-panel{border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:12px;background:#f8fafc;display:grid;gap:10px}.quick-slot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.quick-slot-button{border:1px solid rgba(15,23,42,.12);border-radius:14px;background:#fff;padding:12px 10px;font-weight:900;color:#10233f;box-shadow:0 6px 16px rgba(15,23,42,.06)}.quick-slot-button.selected{background:#10233f;color:#fff;border-color:#10233f}.active-personal-info-card{display:grid;gap:10px}.active-personal-info-fields{border:1px solid rgba(15,23,42,.08);background:#f8fafc;border-radius:18px;padding:12px}.active-showing-mode .active-bookings-card,.active-showing-mode .showing-category-grid{display:none!important}.mini-status-stack{gap:6px;align-items:flex-end}.application-pending-card{border-color:rgba(245,158,11,.45)!important;box-shadow:0 12px 28px rgba(245,158,11,.10)}.showing-active-actions .btn{min-height:44px}.active-showing-price strong{font-size:clamp(2rem,11vw,3.6rem)}
@media(max-width:520px){.quick-slot-grid{grid-template-columns:1fr}.active-personal-info-fields .grid-2{grid-template-columns:1fr}.showing-active-actions{display:grid;grid-template-columns:1fr;gap:8px}.showing-active-actions .btn{width:100%}}



/* v7.8 leasing applications + leased move-in workflow */
.leasing-dashboard-clean .leasing-command-card h2{font-size:clamp(1.7rem,7vw,2.6rem);letter-spacing:-.06em}.leasing-fast-grid .main-action-card{min-height:104px}.leasing-mini-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.leasing-mini-stats span{border:1px solid rgba(15,35,63,.08);border-radius:16px;background:#fff;padding:10px;text-align:center;font-weight:900;color:#526176}.leasing-mini-stats strong{display:block;font-size:24px;color:#10233f;letter-spacing:-.05em}.leasing-app-board{border-color:rgba(0,167,181,.16)}.compact-history-details{border:1px solid rgba(15,35,63,.08);border-radius:16px;padding:10px;background:#f8fafc}.compact-history-details summary{font-weight:950;color:#10233f;cursor:pointer}.application-history-card{opacity:.92;border-left-color:#64748b!important}.movein-modern-dashboard .movein-key-checks{grid-template-columns:repeat(2,minmax(0,1fr))}.movein-progress-banner{display:grid;gap:3px;border-radius:18px;padding:12px;border:1px solid rgba(15,35,63,.1);background:#f8fafc}.movein-progress-banner strong{font-size:16px}.movein-progress-banner span{font-size:12px;color:#5d6a7c;font-weight:800}.movein-progress-banner.waiting{background:#fff7ed;border-color:#fdba74}.movein-progress-banner.ready{background:#ecfeff;border-color:#67e8f9}.movein-progress-banner.done{background:#ecfdf5;border-color:#86efac}.movein-simple-inspection .deficiency-details{border:1px solid rgba(15,35,63,.08);border-radius:16px;padding:10px;background:#f8fafc}.movein-simple-inspection .deficiency-details summary{font-weight:950;color:#10233f;cursor:pointer}.leased-mode .lifecycle button[data-status="LEASED"]{display:none!important}
@media(max-width:520px){.leasing-mini-stats{grid-template-columns:1fr 1fr 1fr}.leasing-mini-stats span{padding:8px 5px;font-size:11px}.leasing-mini-stats strong{font-size:20px}.movein-modern-dashboard .movein-key-checks{grid-template-columns:1fr}.leasing-fast-grid{grid-template-columns:1fr 1fr}.leasing-fast-grid .main-action-card{min-height:92px}}


/* v7.9 leasing agent command layout */
.leasing-home-v79 .leasing-home-grid{margin-top:2px;}
.leasing-home-v79 .leasing-home-grid .rm-command-tile small{font-size:12px;font-weight:850;color:rgba(15,35,63,.62);}
.leasing-home-v79 .leasing-home-grid .rm-command-tile.primary small{color:rgba(255,255,255,.82);}
.leasing-dashboard-strip{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center;margin-top:2px;}
.leasing-focus-board .completed-list{margin-top:2px;}
.showings-mode-hero h2{letter-spacing:-.055em;}
.leasing-walkin-mode .showing-unit-card .showing-actions .btn.full,
.leasing-booking-mode .showing-unit-card .showing-actions .btn.full{min-height:50px;font-size:16px;border-radius:16px;}
.quick-slot-button{text-align:left;line-height:1.15;}
@media(max-width:520px){.leasing-home-v79 .leasing-home-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.leasing-home-v79 .leasing-home-grid .rm-command-tile{min-height:82px}.leasing-home-v79 .leasing-home-grid .rm-command-tile.primary{min-height:84px}.leasing-dashboard-strip .btn{flex:1 1 auto}}


.camera-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;position:relative}.camera-btn{cursor:pointer}.proof-picker-label{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center}.proof-picker-label .native-proof-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.native-proof-input{font-size:100px}.unitworks-submit-row{border:1px solid rgba(37,99,235,.22);border-radius:14px;padding:10px 12px;background:rgba(37,99,235,.06);align-items:flex-start}.unitworks-submit-row span{display:flex;flex-direction:column;gap:2px}.unitworks-submit-row small{font-size:.76rem;color:#64748b}.proof-field .helper{margin-top:6px}.proof-field{min-width:0}

/* v8.3 notification badges + master WO polish */
.rm-command-tile,.main-action-card{position:relative;}
.uw-notification-badge{position:absolute;top:.45rem;right:.55rem;min-width:1.35rem;height:1.35rem;padding:0 .35rem;border-radius:999px;background:#ef4444;color:#fff;font-size:.72rem;font-weight:900;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px rgba(255,255,255,.95),0 8px 18px rgba(239,68,68,.35);z-index:3;}
.vendor-compact-row:not([data-viewed="true"]) .wo-compact-number::after{content:"NEW";display:inline-flex;margin-left:.35rem;padding:.12rem .38rem;border-radius:999px;background:#ef4444;color:#fff;font-size:.62rem;font-weight:900;vertical-align:middle;}
.wo-card .btn[data-work-order-next="entry_notices_delivered"]{background:#0f766e;color:#fff;border-color:#0f766e;}


/* v8.5 vendor photos, pricing, and completion flow */
.vendor-scope-large{border:1px solid rgba(10,86,194,.18);background:#f5f9ff;border-radius:18px;padding:14px;display:grid;gap:6px}
.vendor-scope-large span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:#5d7390;font-weight:900}
.vendor-scope-large strong{font-size:1.12rem;line-height:1.3;color:#0a2446}
.wo-media-panel{border:1px solid rgba(15,35,65,.12);border-radius:18px;padding:12px;background:#fff}
.wo-media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.wo-media-thumb,.wo-media-file{border:1px solid rgba(15,35,65,.12);border-radius:14px;padding:8px;text-decoration:none;color:#10233f;background:#f8fbff;display:grid;gap:6px;font-size:.78rem;font-weight:800;overflow:hidden}
.wo-media-thumb img{width:100%;height:100px;object-fit:cover;border-radius:10px;background:#dfe8f3}
.pricing-summary-panel,.vendor-price-form,.rm-completion-form{border:1px solid rgba(37,99,235,.18);background:linear-gradient(180deg,#f8fbff,#ffffff);border-radius:18px;padding:14px}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pricing-grid div{border:1px solid rgba(15,35,65,.1);border-radius:14px;padding:10px;background:#fff}
.pricing-grid span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:#667085;font-weight:900}
.pricing-grid strong{font-size:1rem;color:#0a2446}
@media(max-width:640px){.vendor-scope-large strong{font-size:1.2rem}.wo-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pricing-grid{grid-template-columns:1fr}.wo-media-thumb img{height:112px}}

/* v8.6 WO/Vendor workflow polish */
.wo-compact-row{grid-template-columns:minmax(92px,.85fr) minmax(110px,1fr) minmax(82px,.8fr);}
.wo-compact-status{grid-column:1 / -1;font-size:.74rem;font-weight:850;color:#5d7390;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.work-package-pill{font-weight:1000;background:#eef6ff;color:#0a56c2;border-color:rgba(10,86,194,.22);}
.wo-status-line{display:block;margin-top:4px;color:#52667f;font-weight:850;line-height:1.25;}
.wo-media-thumb,.wo-media-file{cursor:pointer;text-align:left;font-family:inherit;}
button.wo-media-thumb,button.wo-media-file{appearance:none;-webkit-appearance:none;}
.uw-preview-backdrop{position:fixed;inset:0;z-index:99999;background:rgba(5,15,32,.76);display:flex;align-items:flex-start;justify-content:center;padding:max(12px,env(safe-area-inset-top)) 12px 12px;overflow:auto;}
.uw-preview-modal{width:min(720px,100%);background:#fff;border-radius:22px;padding:12px;box-shadow:0 22px 70px rgba(0,0,0,.35);display:grid;gap:12px;max-height:calc(100dvh - 24px - env(safe-area-inset-top));overflow:auto;}
.preview-close-x{font-weight:1000;}
.uw-preview-body{display:grid;place-items:center;background:#0b1220;border-radius:16px;min-height:220px;overflow:hidden;}
.uw-preview-body img{display:block;max-width:100%;max-height:70dvh;object-fit:contain;}
.uw-notice-preview-frame{width:100%;height:min(70dvh,760px);border:1px solid rgba(15,35,65,.14);border-radius:16px;background:#fff;}
.wo-history-card{background:#fbfcff;}
@media(max-width:640px){.wo-compact-row{grid-template-columns:1fr;}.wo-compact-status{white-space:normal;font-size:.78rem}.uw-preview-modal{border-radius:18px;padding:10px}.uw-preview-body{min-height:180px}.uw-preview-body img{max-height:64dvh}.uw-notice-preview-frame{height:65dvh}}


/* v8.7 multi-photo + vendor price preview */
.proof-archive{display:none!important}
.vendor-live-price-preview .pricing-grid div:last-child strong{font-size:1.18rem}


/* v8.8 WO history stays behind the main WO flow */
.wo-history-card{order:90;}
.wo-history-details{padding:0;overflow:hidden;}
.wo-history-summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;cursor:pointer;border-radius:18px;font-weight:900;}
.wo-history-summary::-webkit-details-marker{display:none;}
.wo-history-summary::after{content:"Show";font-size:.78rem;font-weight:1000;color:#0a56c2;background:#eef6ff;border:1px solid rgba(10,86,194,.18);border-radius:999px;padding:6px 10px;}
.wo-history-details[open] .wo-history-summary::after{content:"Hide";}
.wo-history-list{padding:0 14px 14px;}
@media(max-width:640px){.wo-history-summary{padding:12px 12px}.wo-history-list{padding:0 10px 12px}}

/* v9.0 leasing + turnover scope cleanup */
.showing-feedback-breakdown{display:grid;gap:10px;margin-top:10px}
.showing-feedback-unit-box{border:1px solid rgba(15,35,63,.12);border-radius:16px;padding:12px;background:#f8fbff;display:grid;gap:8px}
.showing-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.showing-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0}
.showing-result-grid div{background:#fff;border:1px solid rgba(15,35,63,.1);border-radius:12px;padding:9px}
.showing-result-grid span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:#64748b;font-weight:800}
.showing-result-grid strong{font-size:.9rem;color:#10233f;word-break:break-word}
.feedback-chip-row{display:flex;gap:6px;flex-wrap:wrap}
.feedback-chip-row span{padding:6px 9px;border-radius:999px;background:#eaf2ff;color:#10233f;font-weight:800;font-size:.78rem}
.moveout-turnover-panel{border:1px solid rgba(245,158,11,.25);background:linear-gradient(180deg,#fffaf0,#ffffff)}
.turnover-scope-card{background:#ffffff;border:1px solid rgba(15,35,63,.12);border-radius:16px;padding:12px}
.scope-section-card{border:1px solid rgba(15,35,63,.12);border-radius:16px;padding:10px;background:#fbfdff}
.scope-section-card summary{cursor:pointer;display:flex;justify-content:space-between;gap:10px;align-items:center}
.scope-chip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0}
.scope-chip input{position:absolute;opacity:0;pointer-events:none}
.scope-chip span{display:block;border:1px solid rgba(15,35,63,.16);background:#fff;border-radius:14px;padding:10px;font-weight:900;font-size:.86rem;text-align:center}
.scope-chip input:checked+span{background:#10233f;color:#fff;border-color:#10233f}
.vendor-turnover-scopes .scope-price-row{border:1px solid rgba(15,35,63,.12);border-radius:14px;padding:10px;background:#fff;margin-bottom:8px}
.turnover-scope-row{border-left:5px solid #f59e0b}
@media(max-width:640px){.showing-result-grid{grid-template-columns:1fr}.scope-chip-grid{grid-template-columns:1fr}.scope-section-card{padding:9px}.feedback-chip-row span{font-size:.74rem}}


/* v9.1 leasing building-first + scope details */
.showing-building-grid{display:grid;gap:10px}
.showing-building-card{width:100%;border:1px solid rgba(14,45,84,.12);background:#fff;border-radius:18px;padding:16px;text-align:left;box-shadow:0 10px 22px rgba(12,30,55,.06);display:grid;gap:6px}
.showing-building-card strong{font-size:1.05rem;color:#10233f}
.showing-building-card span{font-weight:900;color:#23415f}
.showing-building-card small{color:#617089;font-weight:800}
.compact-selected-building{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(14,45,84,.10);background:#f7fbff;border-radius:16px;padding:10px 12px}
.compact-selected-building span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:#6b7b91;font-weight:900}
.compact-selected-building strong{font-size:.98rem;color:#10233f;text-align:right}
.scope-detail-grid{display:grid;grid-template-columns:1fr;gap:10px}
.scope-detail-card{border:1px solid rgba(14,45,84,.12);border-radius:16px;background:#fff;padding:9px;display:grid;gap:8px}
.scope-detail-card .scope-chip{margin:0;width:100%}
.scope-item-details{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px;border-radius:12px;background:#f7fbff;border:1px dashed rgba(14,45,84,.16)}
.scope-detail-card:has(input[type="checkbox"]:checked) .scope-item-details{display:grid}
.scope-item-details .wide{grid-column:1/-1}
.scope-full-line{align-self:end;margin-top:18px;background:#fff;border-radius:10px;padding:9px;font-weight:900}
.mini-field label{font-size:.72rem}
.mini-field input,.mini-field select{min-height:38px;padding:8px 10px}
@media (max-width:520px){.scope-item-details{grid-template-columns:1fr}.scope-full-line{margin-top:0}}

/* Cheque deposit upload / office summary workflow */
.cheque-deposit-panel{border:1px solid rgba(17,24,39,.08)}
.cheque-deposit-panel .helper{margin:.25rem 0 0;color:var(--muted,#64748b)}
.cheque-deposit-body{gap:1rem}
.cheque-upload-form{align-items:end;background:rgba(15,23,42,.03);border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:14px}
.cheque-upload-form .wide{grid-column:1/-1}
.cheque-review-card{border:1px solid rgba(15,23,42,.1);border-radius:18px;padding:14px;background:#fff}
.cheque-review-table{overflow:auto;border:1px solid rgba(15,23,42,.12);border-radius:14px;background:#fff}
.cheque-review-table table{width:100%;min-width:780px;border-collapse:collapse}
.cheque-review-table th,.cheque-review-table td{padding:8px;border-bottom:1px solid rgba(15,23,42,.08);text-align:left;vertical-align:middle}
.cheque-review-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted,#64748b);background:rgba(15,23,42,.035)}
.cheque-review-table input,.cheque-review-table select{width:100%;border:1px solid rgba(15,23,42,.14);border-radius:10px;padding:9px 10px;background:#fff;color:inherit}
.cheque-history-list{gap:.6rem}
.cheque-history-card{display:flex;align-items:center;justify-content:space-between;gap:.8rem;border:1px solid rgba(15,23,42,.08);border-radius:16px;padding:10px 12px;background:rgba(255,255,255,.82)}
.receipt-mini-form{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}
.receipt-mini-form input{max-width:180px;font-size:.75rem}
.btn.tiny{font-size:.72rem;padding:.42rem .62rem;border-radius:999px}
@media(max-width:760px){.cheque-upload-form{grid-template-columns:1fr}.cheque-history-card{align-items:flex-start;flex-direction:column}.receipt-mini-form input{max-width:100%}}

/* v9.9 cheque phone scan flow */
.cheque-scan-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  align-items:stretch;
}
.cheque-phone-form,
.cheque-upload-form{
  border:1px solid rgba(15,35,70,.12);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.72);
}
.cheque-phone-form{
  background:linear-gradient(180deg,rgba(232,246,255,.92),rgba(255,255,255,.78));
  box-shadow:0 10px 24px rgba(10,42,95,.08);
}
.cheque-phone-form h4{margin:.1rem 0 .2rem;font-size:1.05rem;}
.cheque-phone-form input[type=file],
.cheque-upload-form input[type=file]{
  width:100%;
  padding:10px;
  border:1px dashed rgba(18,63,119,.35);
  border-radius:12px;
  background:#fff;
}
@media(max-width:760px){
  .cheque-scan-grid{grid-template-columns:1fr;}
  .cheque-phone-form,.cheque-upload-form{padding:12px;}
}

/* v9.11 contractor key sign-out */
.key-signout-screen .form-grid.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.key-signout-screen .full-width{grid-column:1/-1}
.signature-panel{border:1px solid rgba(15,35,70,.14);border-radius:18px;background:#fff;padding:12px;display:grid;gap:8px}
.signature-title-row{display:flex;justify-content:space-between;align-items:center;gap:10px}
.signature-canvas{width:100%;height:170px;border:2px dashed rgba(15,35,70,.28);border-radius:16px;background:linear-gradient(180deg,#fff,#f8fbff);touch-action:none;display:block}
.key-log-list{display:grid;gap:10px}
.key-log-row{display:grid;grid-template-columns:1.1fr 1.1fr 1.4fr 150px;gap:10px;align-items:center;border:1px solid rgba(15,35,70,.1);border-radius:16px;background:#fff;padding:10px}
.key-log-row div{display:grid;gap:3px}.key-log-row span,.key-log-row small{color:var(--muted,#64748b)}
.key-signature-thumb{width:140px;height:52px;object-fit:contain;border:1px solid rgba(15,35,70,.16);border-radius:10px;background:#fff;justify-self:end}
@media(max-width:760px){.key-signout-screen .form-grid.two{grid-template-columns:1fr}.key-log-row{grid-template-columns:1fr}.key-signature-thumb{justify-self:start;width:180px}}

.auto-timestamp-pill { display:inline-flex; align-items:center; gap:6px; width:max-content; max-width:100%; border:1px solid rgba(13,68,132,.16); background:#eef7ff; color:#102040; border-radius:999px; padding:8px 12px; font-size:.92rem; }
@media (max-width: 720px) { .auto-timestamp-pill { width:100%; justify-content:center; border-radius:16px; } }